:root{color-scheme:dark;--ink:#080709;--text:#f8f5fa;--muted:#817987;--line:#ffffff1a;--accent:#e9b4ed;--card-w:360px;--card-h:230px;font-family:Arial,"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--ink);color:var(--text)}body{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,.stage:focus-visible{outline:2px solid #dcafff;outline-offset:5px}button{border:0}a{color:inherit;text-decoration:none}svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.icon-button{width:40px;height:40px;background:transparent;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;transition:background .2s,border-color .2s}.icon-button:hover{background:#ffffff12;border-color:#ffffff60}.icon-button svg{width:18px;height:18px}#app{position:relative;width:100%;height:100svh;min-height:620px;isolation:isolate;overflow:hidden}#aurora{position:absolute;inset:0;width:100%;height:100%;z-index:-3}.vignette{position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse at 53% 52%,transparent 0%,transparent 30%,#08070966 80%),linear-gradient(#080709 0%,#08070900 22%,#08070900 78%,#080709 100%)}.header{height:100px;margin:0 5%;display:flex;align-items:center;position:relative;z-index:20;gap:52px;border-bottom:1px solid #ffffff0b}.brand{font-size:29px;letter-spacing:-1.8px;font-weight:900;position:relative;white-space:nowrap}.brand-dot{color:#d68fe7}.brand-mark{position:relative;font-size:10px;letter-spacing:0;top:-13px;margin-left:4px}.header-nav{display:flex;align-items:center;gap:22px;font-size:13px;letter-spacing:1px}.current{color:#ddd5e0}.nav-rule{height:12px;width:1px;background:#ffffff30}.nav-en{font-size:10px;color:#827886;letter-spacing:2px}.header-actions{margin-left:auto;display:flex;gap:10px}.header-actions .icon-button{border-color:transparent}.main{height:calc(100% - 188px);min-height:420px;display:grid;grid-template-columns:33% 40% 27%;align-items:center;position:relative;margin:0 5%}.intro{align-self:center;position:relative;z-index:6;pointer-events:none;margin-top:-12px}.eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:2.5px;color:#b9a4be;margin-bottom:26px}.eyebrow span{width:20px;height:1px;background:#cb92d7}.intro h1{font-weight:900;font-size:clamp(42px,5.8vw,86px);letter-spacing:-.065em;line-height:1.13;margin:0;white-space:nowrap;text-shadow:0 4px 24px #080709}.period{color:#d8a8e3}.intro-sub{font-size:14px;color:#afa0b1;letter-spacing:2px;margin:26px 0 0}.intro-bottom{display:flex;align-items:center;gap:12px;color:#69616f;font-size:11px;letter-spacing:1px;margin-top:64px}.intro-line{width:30px;height:1px;background:#64556d}.stage{height:100%;width:100%;position:relative;z-index:5;perspective:1400px;touch-action:none;outline:none}.deck{position:absolute;inset:0;transform-style:preserve-3d}.game-card{position:absolute;top:50%;left:50%;width:var(--card-w);height:var(--card-h);margin-left:calc(var(--card-w) / -2);margin-top:calc(var(--card-h) / -2);padding:0;border-radius:18px;background:#15111b;border:1px solid #e5cbe959;box-shadow:0 20px 60px #000b,inset 0 0 0 1px #ffffff0e;overflow:hidden;transform-style:preserve-3d;will-change:transform;backface-visibility:hidden;isolation:isolate;text-align:left;cursor:pointer}.game-card::after{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid #ffffff13;background:linear-gradient(135deg,#fff1 0%,transparent 25%,transparent 70%,#fff1 100%);pointer-events:none;z-index:5}.game-card.is-front{box-shadow:0 28px 65px #000d,0 0 24px color-mix(in srgb,var(--tone) 20%,transparent);border-color:color-mix(in srgb,var(--tone) 70%,#fff)}.card-art{position:absolute;inset:0;overflow:hidden;background:#141018}.card-art img,.card-art video,.dialog-artwork img,.dialog-artwork video{height:100%;width:100%;object-fit:cover;display:block}.card-art video{position:absolute;inset:0}.card-art iframe{border:0;width:100%;height:100%;pointer-events:none}.card-vignette{position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,#05030930,transparent 65%),linear-gradient(0deg,#09070cec 0%,#09070c20 42%,#0000 65%);pointer-events:none}.card-label{position:absolute;bottom:20px;left:23px;right:23px;z-index:3;display:flex;justify-content:space-between;align-items:end}.card-label strong{display:block;font-size:25px;font-weight:700;letter-spacing:2px;margin-bottom:5px}.card-label span{font-size:9px;color:#e7dce8b5;letter-spacing:2.5px}.card-label .card-number{font-size:12px;letter-spacing:1px;align-self:center;color:#fff9}.card-top{position:absolute;top:17px;left:20px;right:20px;z-index:3;display:flex;justify-content:space-between;align-items:center}.card-pg{font-size:13px;font-weight:800;letter-spacing:.5px;text-shadow:0 2px 8px #000}.card-top .mini-arrow{font-size:18px;line-height:1;color:#fff9}.stage-hint{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:10px;letter-spacing:1.2px;color:#a598ad;z-index:30;pointer-events:none}.stage-hint svg{width:10px;height:18px}.selection{align-self:center;padding-left:26%;z-index:7;position:relative;margin-top:15px}.index-row{display:flex;gap:12px;align-items:baseline;margin-bottom:30px;font-variant-numeric:tabular-nums}.large-index{font-size:64px;font-weight:800;letter-spacing:-4px;line-height:1}.index-total{font-size:13px;color:#817288;letter-spacing:2px}.selection-rule{height:1px;width:28px;background:#ebc3ec;margin-bottom:22px}.selection-overline{font-size:10px;color:#95859c;letter-spacing:2px}.selection h2{font-size:28px;letter-spacing:4px;font-weight:600;margin:9px 0 6px}.selection-copy>p{font-size:10px;letter-spacing:2.6px;color:#8e7a98;margin:0}.explore-button{background:transparent;padding:17px 0 14px;border-bottom:1px solid #d1b6db50;display:flex;gap:28px;align-items:center;margin-top:23px;font-size:12px;letter-spacing:1px;white-space:nowrap}.explore-button svg{width:19px;height:19px;transition:transform .2s}.explore-button:hover svg{transform:translateX(4px)}.arrows{display:flex;align-items:center;gap:8px;margin-top:28px;flex-wrap:wrap}.arrows .icon-button{width:34px;height:34px}.arrows span{width:100%;font-size:10px;color:#82728d;margin-top:8px;letter-spacing:1px}.ghost-type{position:absolute;inset:auto 3.2% 73px;display:flex;justify-content:space-between;font-size:clamp(58px,8.8vw,160px);font-family:Georgia,serif;font-weight:bold;color:#8b54ad12;letter-spacing:-.05em;line-height:1;z-index:-1;pointer-events:none;user-select:none}.footer{position:absolute;bottom:0;left:5%;right:5%;height:88px;display:flex;align-items:center;justify-content:space-between;gap:22px;border-top:1px solid #ffffff10;z-index:20}.footer-meta{font-size:9px;letter-spacing:1.6px;color:#766c7c;display:flex;gap:10px;align-items:center}.tiny-cross{font-size:18px;color:#a186af}.category-nav{display:flex;gap:6px;align-items:center}.category-nav button{font-size:12px;background:transparent;color:#8d808f;position:relative;border-radius:24px;padding:10px 17px;border:1px solid transparent;transition:color .3s,border-color .3s,background .3s;white-space:nowrap}.category-nav button.active{background:#d99eec0e;color:#efd4f8;border-color:#c297d93f}.category-nav button:hover{color:white}.footer-note{font-size:9px;color:#776c7f;letter-spacing:1.2px;white-space:nowrap}.progress-track{position:absolute;bottom:0;height:2px;background:#ffffff05;width:100%;z-index:30}.progress-track>div{height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#8657e1,#f3a5df,#9080ec);box-shadow:0 0 8px #e7a1fc}dialog{width:min(800px,92vw);padding:0;overflow:hidden;border:1px solid #e4b8f241;border-radius:24px;background:#100c16;color:#fff;box-shadow:0 30px 100px #000e}dialog::backdrop{background:#060409dc;backdrop-filter:blur(12px)}.dialog-close{position:absolute;right:16px;top:16px;z-index:10;background:#100b17b0}.dialog-artwork{width:100%;aspect-ratio:16/10;background:#09070d;overflow:hidden}.dialog-artwork iframe{height:100%;width:100%;border:0}.dialog-info{padding:25px 30px;display:flex;justify-content:space-between;align-items:center}.dialog-info span{font-size:10px;letter-spacing:2px;color:#a48cab}.dialog-info h2{font-size:28px;margin:8px 0;letter-spacing:3px}.dialog-info p{font-size:13px;color:#b5a6be;margin:0}.preview-label{border:1px solid #b590c333;padding:9px 13px;border-radius:20px;white-space:nowrap}.media-paused video{opacity:1}
@media(min-width:1600px){:root{--card-w:430px;--card-h:275px}.selection{padding-left:24%}.stage-hint{bottom:28px}}@media(max-height:720px) and (min-width:761px){#app{min-height:540px}.header{height:78px}.main{height:calc(100% - 151px)}.footer{height:73px}:root{--card-w:310px;--card-h:198px}.intro h1{font-size:clamp(42px,5.4vw,72px)}.intro-bottom{margin-top:34px}.selection{margin-top:0}.index-row{margin-bottom:20px}.large-index{font-size:52px}.arrows{margin-top:16px}.stage-hint{bottom:6px}}
@media(max-width:1050px) and (min-width:761px){:root{--card-w:300px;--card-h:195px}.header{gap:25px}.main{grid-template-columns:31% 43% 26%}.selection{padding-left:20%}.footer-meta{display:none}.footer{justify-content:center}.footer-note{position:absolute;right:0;font-size:8px}.category-nav button{padding:10px 13px}.intro-sub{font-size:12px}.intro-bottom{font-size:10px}}
@media(max-width:760px){:root{--card-w:294px;--card-h:190px}#app{height:100svh;min-height:700px}.header{height:78px;margin:0 24px;gap:20px}.brand{font-size:25px}.brand-mark{font-size:8px;top:-11px}.header-nav{gap:0;margin-left:auto}.header-nav .nav-rule,.header-nav .nav-en{display:none}.header-nav .current{font-size:11px;letter-spacing:1px;color:#afa2b6}.header-actions{margin-left:0;gap:2px}.header-actions .icon-button{width:30px;height:34px}.fullscreen{display:none!important}.main{display:block;height:calc(100% - 163px);margin:0}.intro{position:absolute;top:27px;left:26px;margin:0;z-index:6}.eyebrow{font-size:8px;letter-spacing:1.7px;margin:0 0 12px;gap:6px}.eyebrow span{width:14px}.intro h1{font-size:38px;line-height:1.14;letter-spacing:-2px}.intro-sub{font-size:11px;letter-spacing:.8px;margin-top:13px;color:#a694af}.intro-bottom{display:none}.stage{position:absolute;inset:120px 0 37px;height:auto;width:100%;perspective:1100px}.deck{transform:translateX(5px)}.stage-hint{bottom:-23px;font-size:9px;color:#807086}.selection{position:absolute;right:26px;top:31px;margin:0;padding:0;text-align:right;pointer-events:none}.index-row{justify-content:flex-end;gap:6px;margin-bottom:10px}.large-index{font-size:38px;letter-spacing:-2px}.index-total{font-size:9px;letter-spacing:1px}.selection-copy .selection-rule,.selection-overline{display:none}.selection h2{font-size:16px;letter-spacing:2px;margin:0 0 6px}.selection-copy>p{font-size:8px;letter-spacing:1.7px}.explore-button{font-size:10px;gap:14px;margin:12px 0 0 auto;padding:8px 0;pointer-events:auto}.explore-button svg{width:14px;height:14px}.arrows{display:none}.footer{left:18px;right:18px;height:85px;justify-content:center;padding-bottom:env(safe-area-inset-bottom,0)}.footer-meta,.footer-note{display:none}.category-nav{gap:2px;width:100%;justify-content:space-between}.category-nav button{font-size:11px;padding:10px 12px}.ghost-type{bottom:106px;left:5%;right:5%;font-size:53px;opacity:.85}.ghost-type span:last-child{display:none}.ghost-type span:first-child{width:100%;text-align:center;letter-spacing:6px}.dialog-info{padding:20px}.dialog-info h2{font-size:24px}.preview-label{font-size:8px!important;padding:8px}.dialog-artwork{aspect-ratio:4/3}}
@media(max-width:370px){:root{--card-w:264px;--card-h:176px}.category-nav button{padding:10px 9px}.header{margin:0 20px}.intro{left:23px}.selection{right:23px}.intro h1{font-size:34px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}.game-card{will-change:auto}}

@media(max-width:760px) and (max-height:720px){#app{min-height:590px}.header{height:64px}.main{height:calc(100% - 135px)}.intro{top:18px}.intro h1{font-size:32px}.intro-sub{margin-top:9px;font-size:10px}.selection{top:21px}.stage{inset:112px 0 28px}.stage-hint{bottom:-17px}.footer{height:71px}:root{--card-w:260px;--card-h:167px}.card-label strong{font-size:22px}.card-label{bottom:15px;left:19px}.card-top{top:13px}.large-index{font-size:32px}.ghost-type{bottom:91px}}
.dialog-artwork{position:relative}.dialog-artwork video{position:absolute;inset:0}.card-art img,.card-art video{object-position:center 38%}
/* English copy keeps its space while letters reveal. */
.intro .english-headline{font-size:clamp(43px,5.55vw,84px);line-height:.99;letter-spacing:-.065em;font-weight:900}.type-line{display:block;white-space:nowrap}.typed-glyph,.side-glyph{display:inline-block;white-space:pre}.intro-sub[lang=en]{letter-spacing:.65px}.intro-bottom{font-size:9px;letter-spacing:1.1px}.selection h2{font-size:clamp(20px,2.1vw,29px);letter-spacing:.035em;white-space:nowrap;min-height:1.2em}.selection-copy>p{font-size:9px;letter-spacing:1px;line-height:1.5}.selection-overline{font-size:9px;letter-spacing:1.7px}.arrows span{font-size:9px;letter-spacing:1.1px}
.music-toggle{display:flex;gap:9px;align-items:center;justify-content:center;padding:0 10px;background:transparent;height:38px;color:#a998b1;border-radius:22px;border:1px solid #b88fd02c}.music-toggle:hover{color:#f5dcff;border-color:#c99fdf66}.music-label{font-size:9px;letter-spacing:1.2px;white-space:nowrap}.music-toggle.is-playing{color:#eac0fa;border-color:#dbade755;background:#b275cf09}.sound-bars{height:17px;width:18px;display:flex;gap:2px;align-items:center}.sound-bars i{display:block;width:2px;height:3px;border-radius:2px;background:currentColor}.music-toggle.is-playing .sound-bars i{animation:sound-level .9s ease-in-out infinite alternate}.sound-bars i:nth-child(2){animation-delay:-.4s!important}.sound-bars i:nth-child(3){animation-delay:-.7s!important}.sound-bars i:nth-child(4){animation-delay:-.2s!important}@keyframes sound-level{from{height:4px}to{height:16px}}.music-credits{position:relative;align-self:center}.music-credits summary{list-style:none;font-family:Georgia,serif;font-style:italic;font-size:12px;width:22px;height:22px;text-align:center;line-height:22px;cursor:pointer;border:1px solid #ffffff16;border-radius:50%;color:#897592}.music-credits summary::-webkit-details-marker{display:none}.music-credit-panel{position:absolute;top:35px;right:0;width:228px;padding:21px;border:1px solid #c8a3d52d;background:#17101f;border-radius:14px;box-shadow:0 20px 60px #000b;z-index:60}.music-credit-kicker{display:block;font-size:8px;letter-spacing:2px;color:#9a82aa;margin-bottom:11px}.music-credit-panel strong{font-size:17px;letter-spacing:.3px}.music-credit-panel p{font-size:12px;color:#b7a3c3;margin:8px 0 12px}.music-credit-panel a{display:block;font-size:11px;color:#c798e2;text-decoration:underline;text-underline-offset:3px;margin-top:8px}.music-credit-panel small{display:block;margin-top:12px;color:#887590;font-size:10px;line-height:1.6}.music-toggle.is-loading .sound-bars{opacity:.5}
@media(max-width:1050px) and (min-width:761px){.intro .english-headline{font-size:5.45vw}.intro-bottom{font-size:8px;letter-spacing:.5px}.header{gap:24px}.nav-en{display:none}.selection{padding-left:19%}.selection h2{font-size:20px}}
@media(max-width:760px){.intro .english-headline{font-size:34px;line-height:.98;letter-spacing:-1.7px}.intro-sub[lang=en]{font-size:10px;letter-spacing:.3px;margin-top:10px}.selection h2{font-size:14px;letter-spacing:.03em}.selection-copy>p{max-width:116px;font-size:8px;letter-spacing:.45px}.selection-overline{display:none}.header{gap:13px}.header-actions{gap:5px}.music-toggle{border-color:transparent;width:29px;height:30px;padding:0}.music-label{display:none}.music-credits summary{width:19px;height:19px;line-height:18px;font-size:10px}.music-credit-panel{right:-35px}.header-nav .current{font-size:10px}.header-nav{margin-left:auto}.selection{top:34px}}
@media(max-width:370px){.header{gap:9px}.header-nav .current{display:none}.intro .english-headline{font-size:30px}.selection h2{font-size:12px}.selection-copy>p{max-width:100px}}
@media(max-width:760px) and (max-height:720px){.intro .english-headline{font-size:28px}.intro-sub[lang=en]{font-size:9px}.selection{top:21px}}
@media(prefers-reduced-motion:reduce){.music-toggle.is-playing .sound-bars i{animation:none;height:10px}.music-toggle.is-playing .sound-bars i:nth-child(2){height:16px}}

/* Hold a clean cover while the deck moves; reveal video only after settling. */
.game-card .card-art video{opacity:0;transition:opacity .16s ease}
.game-card.is-media-ready .card-art video{opacity:1}
@media(prefers-reduced-motion:reduce){.game-card .card-art video{transition:none}}

/* Card transitions use composited transforms and shading, without animated filters. */
.card-shade{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;z-index:4;will-change:opacity}
.game-card{filter:none;contain:layout style}
@media(max-width:760px){body:not(.has-subpage) #aurora{animation:aurora-drift 18s ease-in-out infinite alternate;will-change:transform;transform-origin:center}.game-card{box-shadow:0 12px 28px #0009,inset 0 0 0 1px #ffffff0e}.game-card.is-front{box-shadow:0 18px 36px #000b,0 0 18px color-mix(in srgb,var(--tone) 15%,transparent)}}
@keyframes aurora-drift{from{transform:translate3d(-5px,-3px,0) scale(1.025)}to{transform:translate3d(5px,4px,0) scale(1.035)}}
@media(prefers-reduced-motion:reduce){body:not(.has-subpage) #aurora{animation:none;will-change:auto}}
