/* Fixed-screen gallery; the game keeps its own layout when this page closes. */
html.keepsake-boot body>main,body.keepsake-showcase>main{display:none!important}
body.viewport-app.keepsake-showcase{height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column;background:#091b17}
body.keepsake-showcase:after{position:fixed!important;background:linear-gradient(100deg,#071914f5,#112d24ed 60%,#091914ee),url('assets/grave-v2.png') center/cover!important}
body.keepsake-showcase>header{height:auto;min-height:82px;flex:0 0 auto;position:relative;background:#0a1c17d9;border-bottom:1px solid #b49c6140}
#keepsakeShowcase{width:100%;max-width:1480px;margin:0 auto;padding:18px clamp(18px,3vw,48px) 12px;flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px;color:#f4ebd3}
#keepsakeShowcase[hidden]{display:none!important}
.keepsake-hero{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr);align-items:center;gap:28px;min-height:0}
.keepsake-intro{max-width:500px;padding:12px 0 18px clamp(36px,3.5vw,50px)}
.keepsake-kicker{display:flex;align-items:center;gap:10px;font:11px/1.6 monospace;letter-spacing:3px;color:#dcc394;margin:0 0 20px}
.keepsake-kicker:before{content:'✦';font-size:18px;color:#ffda95}
#keepsakeTitle{font-family:'Mission WenKai','Noto Sans TC','Noto Sans KR',sans-serif;font-size:clamp(35px,4vw,62px);font-weight:700;line-height:1.34;letter-spacing:1px;margin:0;color:#fff0be;text-shadow:0 2px 20px #d0aa4f18}
#keepsakeTitle em{color:#d8edaf;font-style:normal}
.keepsake-description{font-size:17px;line-height:1.95;color:#c8d4c8;max-width:415px;margin:22px 0}
.keepsake-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.keepsake-tags span{border:1px solid #b2c49c44;border-radius:30px;padding:5px 12px;color:#d5dcc1;font-size:12px;background:#1a33274d}
.keepsake-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#keepsakeEnter{display:flex;align-items:center;justify-content:center;gap:35px;background:#d9ee9e;color:#182b1b;min-height:58px;min-width:215px;border:1px solid #e8f4bd;border-radius:9px;padding:13px 25px;font-size:21px;font-weight:800;box-shadow:0 4px 0 #7a9256,0 0 25px #a4b97518;transition:transform .2s,background .2s}
#keepsakeEnter:hover{background:#eff8c2;transform:translateY(-2px)}
#keepsakeReplay{min-height:48px;padding:11px 17px;border:1px solid #c7b37a;border-radius:9px;background:#142e25;color:#f4e4af;font-size:15px;font-weight:700;line-height:1.4;white-space:nowrap}
#keepsakeReplay:hover{background:#234333;border-color:#f2dfa0}
#keepsakeReplay:focus-visible{outline:2px solid #e7eea8;outline-offset:4px}
.keepsake-enter-note{flex-basis:100%;font-size:12px;color:#adbea9;line-height:1.7}
.keepsake-carousel{min-width:0;min-height:0;height:100%;position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto auto;isolation:isolate}
.keepsake-carousel:before{content:'';position:absolute;inset:10% 5% 20%;border-radius:50%;background:radial-gradient(ellipse,#ddb76122,transparent 68%);z-index:-1}
.keepsake-stage{height:100%;min-height:0;position:relative;overflow:hidden;touch-action:pan-y}
.keepsake-slide{position:absolute;left:50%;top:50%;width:var(--keepsake-card-size,70%);margin:0;transform:translate(-50%,-50%) scale(.7);opacity:0;visibility:hidden;z-index:0;transition:transform .65s cubic-bezier(.2,.7,.25,1),opacity .65s,filter .65s;filter:brightness(.62);pointer-events:none}
.keepsake-slide img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border:1px solid #e5c78e5c;box-shadow:0 14px 38px #0009;border-radius:3px}
.keepsake-slide.is-active{transform:translate(-50%,-50%);opacity:1;visibility:visible;z-index:3;filter:none}
.keepsake-slide.is-prev{transform:translate(-89%,-50%) scale(.83) rotate(-8deg);opacity:.55;visibility:visible;z-index:1}
.keepsake-slide.is-next{transform:translate(-11%,-50%) scale(.83) rotate(8deg);opacity:.55;visibility:visible;z-index:1}
.keepsake-manual .keepsake-slide{transition-duration:.14s}
.keepsake-side{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:44px;height:56px;min-width:0;padding:0;border:1px solid #b6b17899;border-radius:24px;background:#10281fd9;color:#f5e5b9;font:38px/1 Georgia,serif;box-shadow:0 4px 15px #0005}
.keepsake-side:hover{background:#304c35;border-color:#e9dda5}
.keepsake-prev{left:4px}.keepsake-next{right:4px}
.keepsake-caption{text-align:center;min-height:55px;margin:6px auto 4px;max-width:90%}
#keepsakeCardTitle{display:block;font-size:18px;line-height:1.55;color:#f3d69c;font-weight:700}
#keepsakeCardDetail{display:block;font-size:12px;line-height:1.6;margin-top:3px;color:#adbfaf}
.keepsake-navigation{display:flex;justify-content:center;align-items:center;gap:17px;margin:4px 0 6px;min-height:22px}
#keepsakeDots{display:flex;gap:9px;align-items:center}
#keepsakeDots button{width:9px;height:9px;padding:0;border:1px solid #a7ba8f;border-radius:50%;background:#59765530;position:relative}
#keepsakeDots button:before{content:'';position:absolute;inset:-10px}
#keepsakeDots button[aria-pressed='true']{background:#e3ce92;border-color:#f5dfa8;box-shadow:0 0 10px #edd49566}
.keepsake-index{font:12px monospace;color:#d1c5a7;letter-spacing:2px}
.keepsake-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 0 0;border-top:1px solid #b4a77835;font-size:11px;line-height:1.7;color:#96ad9b}
.keepsake-footer>span:first-child{max-width:56%}.keepsake-footer>span:last-child{text-align:right}
.keepsake-footer a{color:#cfba87;text-decoration:none}
#keepsakeHomeTitle{display:inline-block;font:inherit;color:inherit;letter-spacing:inherit;line-height:inherit;text-shadow:inherit;text-align:inherit;background:transparent;border:0;border-radius:3px;padding:0;margin:0;min-width:0;min-height:0;box-shadow:none;cursor:pointer}
#keepsakeHomeTitle:hover{color:#fff3c7}#keepsakeHomeTitle:focus-visible{outline:2px solid #e7d69d;outline-offset:5px}
@media(max-width:1000px){.keepsake-hero{grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr);gap:12px}#keepsakeTitle{font-size:38px}.keepsake-description{font-size:15px;margin:18px 0}.keepsake-tags{gap:5px;margin-bottom:20px}.keepsake-tags span{font-size:11px;padding:4px 9px}}
@media(min-width:721px) and (max-height:650px){.keepsake-kicker{font-size:9px;letter-spacing:2px;margin-bottom:10px}#keepsakeTitle{font-size:32px}.keepsake-description{font-size:13px;line-height:1.7;margin:12px 0}.keepsake-tags{display:none}.keepsake-actions{gap:9px}#keepsakeEnter{min-height:46px;min-width:180px;padding:8px 18px;font-size:18px}#keepsakeReplay{min-height:40px;padding:8px 12px;font-size:13px}.keepsake-intro{padding-top:4px;padding-bottom:4px}.keepsake-caption{min-height:43px}#keepsakeCardTitle{font-size:15px}#keepsakeCardDetail{font-size:11px}.keepsake-footer{font-size:10px}}
@media(max-width:720px) and (orientation:portrait){
 body.keepsake-showcase>header{min-height:64px;gap:4px;padding:7px 12px;flex-wrap:wrap}body.keepsake-showcase .brand-original{width:110px;height:38px}body.keepsake-showcase .brand-titles,body.keepsake-showcase .studio-instagram{display:none}body.keepsake-showcase .header-right{gap:6px}body.keepsake-showcase .langs button{font-size:11px;padding:7px}body.keepsake-showcase .icon-btn,body.keepsake-showcase .help-open{width:30px;height:32px;min-height:30px}
 #keepsakeShowcase{padding:8px 12px 8px;gap:4px}.keepsake-hero{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr) auto;gap:0}.keepsake-intro{display:contents}.keepsake-kicker,.keepsake-tags{display:none}#keepsakeTitle{grid-row:1;text-align:center;font-size:27px;line-height:1.2}#keepsakeTitle br{display:none}#keepsakeTitle em{display:inline}.keepsake-description{grid-row:2;font-size:12px;line-height:1.5;text-align:center;margin:6px auto;max-width:400px}.keepsake-description br{display:none}.keepsake-carousel{grid-row:3;width:100%;min-height:0}.keepsake-caption{min-height:39px;margin:2px auto}#keepsakeCardTitle{font-size:14px}#keepsakeCardDetail{font-size:10px}.keepsake-navigation{margin:2px 0 4px;min-height:18px}.keepsake-side{width:36px;height:48px;font-size:32px}.keepsake-actions{grid-row:4;justify-content:center;gap:8px;padding-top:5px}#keepsakeEnter{width:auto;min-width:150px;min-height:44px;font-size:17px;padding:8px 14px;gap:15px}#keepsakeReplay{width:auto;min-height:42px;font-size:12px;padding:8px 10px}.keepsake-enter-note{font-size:10px;text-align:center;line-height:1.3}.keepsake-footer{font-size:9px;line-height:1.4;padding-top:5px;gap:8px}.keepsake-footer>span:last-child{max-width:44%}#keepsakeFoot{display:none}
}
@media(max-width:420px) and (orientation:portrait){body.keepsake-showcase>header .brand{flex:1 0 100%;justify-content:center;height:30px}body.keepsake-showcase>header .brand-original{height:30px;width:90px}body.keepsake-showcase>header .header-right{margin:auto}body.keepsake-showcase>header{padding:3px 10px 5px;gap:2px}#keepsakeTitle{font-size:24px}}
@media(orientation:landscape) and (max-height:500px){body.keepsake-showcase>header{min-height:48px;padding:3px 16px}body.keepsake-showcase .brand-original{width:100px;height:34px}body.keepsake-showcase .brand-titles,body.keepsake-showcase .studio-instagram{display:none}.keepsake-intro{padding:2px 0 2px 18px}.keepsake-kicker,.keepsake-tags{display:none}#keepsakeShowcase{padding:6px 16px;gap:4px}.keepsake-hero{grid-template-columns:minmax(220px,.85fr) minmax(0,1.15fr);gap:8px}#keepsakeTitle{font-size:27px}.keepsake-description{font-size:12px;line-height:1.5;margin:9px 0}.keepsake-actions{gap:8px}#keepsakeEnter{min-width:145px;min-height:40px;font-size:16px;padding:7px 12px;gap:15px}#keepsakeReplay{font-size:11px;min-height:36px;padding:7px 9px}.keepsake-enter-note{font-size:9px}.keepsake-caption{min-height:35px}#keepsakeCardTitle{font-size:13px}#keepsakeCardDetail{font-size:10px}.keepsake-navigation{margin:0;min-height:18px}.keepsake-footer{font-size:9px;padding-top:4px;line-height:1.3}#keepsakeFoot{display:none}.keepsake-side{width:34px;height:44px;font-size:30px}}
@media(prefers-reduced-motion:reduce){.keepsake-slide,#keepsakeEnter{transition:none}}


#keepsakeBootStatus{max-width:32em;font-size:14px;line-height:1.6;color:#f0dfb8;margin:0}#keepsakeBootRetry[hidden],#keepsakeBootStatus[hidden]{display:none!important}

/* English showcase headings use a lighter scale for the longer copy. */
html[lang="en"] #keepsakeTitle{font-size:clamp(30px,3.4vw,52px);line-height:1.28;letter-spacing:0}
@media(max-width:1000px){html[lang="en"] #keepsakeTitle{font-size:32px}}
@media(min-width:721px) and (max-height:650px){html[lang="en"] #keepsakeTitle{font-size:27px}}
@media(max-width:720px) and (orientation:portrait){html[lang="en"] #keepsakeTitle{font-size:23px;line-height:1.2}}
@media(max-width:420px) and (orientation:portrait){html[lang="en"] #keepsakeTitle{font-size:21px}}
@media(orientation:landscape) and (max-height:500px){html[lang="en"] #keepsakeTitle{font-size:23px}}