/* Hallmark · macrostructure: bespoke Pool Journal (Photographic family) · tone: tactile midnight · anchor hue: wine
 * genre: custom editorial · theme: custom · nav: N9 edge rail · footer: Ft4 colophon
 * display: Songti SC · body: PingFang SC · axes: dark / roman-serif / warm-gold
 * user override: full scene fold, narrow ivory paper, hard rectangular CTA
 * pre-emit critique: P4 H5 E4 S5 R5 V4 */
@import url('tokens.css');
*{box-sizing:border-box}html{overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:8rem}body{margin:0;overflow-x:clip;background:var(--color-page);color:var(--color-ink);font-family:var(--font-body);font-size:var(--text-base);line-height:1.8}body:has(dialog[open]){overflow-y:hidden}h1,h2,h3{font-family:var(--font-display);font-style:normal;line-height:1.3;overflow-wrap:anywhere;min-width:0}h1{font-size:var(--text-display);letter-spacing:-.04em;margin:0 0 var(--space-lg)}h2{font-size:var(--text-lg);margin:0 0 var(--space-lg)}h3{font-size:var(--text-md);margin:0 0 var(--space-sm)}p{margin:0 0 var(--space-md)}a{color:inherit;text-underline-offset:5px}a:hover{text-decoration-thickness:2px}button{font:inherit;cursor:pointer}img{display:block;max-width:100%;height:auto}figure{margin:0}figcaption{font-size:var(--text-sm);color:var(--color-muted);margin-top:var(--space-xs)}ul,ol{padding-inline-start:var(--space-lg)}li+li{margin-top:var(--space-xs)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}button:disabled,[aria-disabled=true]{opacity:.5;cursor:not-allowed}button[data-state=loading]{cursor:progress}button[data-state=error]{border-style:dashed;border-color:var(--color-error)}button[data-state=success]{border-color:var(--color-success)}[hidden]{display:none!important}.skip{position:fixed;top:-6rem;left:var(--space-md);background:var(--color-paper);color:var(--color-ink);padding:var(--space-sm);z-index:var(--z-modal)}.skip:focus{top:var(--space-sm)}
.site-header{position:sticky;top:0;z-index:var(--z-sticky);background:var(--color-dark);color:var(--color-on-dark);border-bottom:2px solid var(--color-accent)}.header-inner{max-width:1200px;margin:auto;padding:var(--space-sm) var(--space-lg);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-xs) var(--space-lg)}.brand{display:flex;align-items:center;gap:var(--space-xs);font-family:var(--font-display);font-weight:700;font-size:var(--text-md);text-decoration:none;white-space:nowrap}.brand img{width:28px;height:28px}.site-nav{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2xs) var(--space-md);font-size:var(--text-sm)}.site-nav a{white-space:nowrap;padding-block:var(--space-xs);min-height:44px;display:inline-flex;align-items:center;text-decoration:none}.site-nav [aria-current=page]{color:var(--color-accent);text-decoration:underline}.site-nav .nav-cta{font-weight:700;color:var(--color-accent)}.site-nav a:hover{color:var(--color-accent-hover)}.site-header :focus-visible,.sticky :focus-visible,.footer :focus-visible,.hero :focus-visible{outline-color:var(--color-accent)}
.hero{position:relative;min-height:640px;min-height:min(780px,calc(100svh - 72px));background:var(--color-dark);color:var(--color-on-dark);display:grid;align-items:end;isolation:isolate}.hero-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2}.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,var(--color-clear),var(--color-hero-shade));z-index:-1}.hero-inner{width:min(1120px,100%);margin-inline:auto;padding:var(--space-3xl) var(--page-gutter) var(--space-xl);display:grid;gap:var(--space-lg)}.hero-copy{max-width:680px}.hero h1{font-size:var(--text-display);margin-bottom:var(--space-md)}.hero h1 span{display:block;font-family:var(--font-outlier);font-size:var(--text-md);letter-spacing:.03em;margin-top:var(--space-sm);font-weight:400}.hero-lede{max-width:36em;font-size:var(--text-md);line-height:1.7}.tags{display:flex;gap:var(--space-xs);flex-wrap:wrap;margin:var(--space-md) 0}.tag{font-size:var(--text-sm);border:1px solid var(--color-muted-dark);padding:var(--space-2xs) var(--space-xs)}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-md)}.btn,.filter-btn,.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);min-height:48px;border:1px solid var(--color-dark);border-radius:var(--radius-sm);background:var(--color-accent);color:var(--color-accent-ink);font-weight:700;white-space:nowrap;text-decoration:none;box-shadow:4px 4px 0 var(--color-dark);transition:transform var(--dur-micro) var(--ease-out)}.btn:hover{background:var(--color-accent-hover);text-decoration:none;transform:translateY(-1px)}.btn:active,.filter-btn:active,.icon-btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--color-dark)}.text-link{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;font-size:var(--text-sm);font-weight:600}.hero-side{font-size:var(--text-sm);padding:var(--space-md) 0 0;border-top:1px solid var(--color-muted-dark);max-width:34em}.hero-side strong{font-family:var(--font-display);display:block;font-size:var(--text-md);margin-bottom:var(--space-xs)}
.paper{max-width:1040px;margin:0 auto var(--space-2xl);background:var(--color-paper);box-shadow:8px 8px 0 var(--color-dark)}.info-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:var(--space-lg) var(--page-gutter);gap:var(--space-lg);border-bottom:1px solid var(--color-rule)}dt{font-size:var(--text-sm);color:var(--color-muted)}dd{margin:var(--space-2xs) 0 0;line-height:1.5;font-weight:600;overflow-wrap:anywhere}.content{padding:0 var(--page-gutter)}.section{padding:var(--space-2xl) 0;scroll-margin-top:8rem}.section+.section{border-top:1px solid var(--color-rule)}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-lg);flex-wrap:wrap;margin-bottom:var(--space-lg)}.section-head h2{margin-bottom:0}.lede{font-size:var(--text-md);font-family:var(--font-display);line-height:1.7}.intro-layout,.play-layout{display:grid;gap:var(--space-xl)}.intro-copy{max-width:65ch}.title-logo{max-width:460px;width:100%;margin-top:var(--space-lg);border:1px solid var(--color-rule)}.facts{display:grid;gap:var(--space-sm);margin-top:var(--space-xl)}.facts>div{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:var(--space-md)}.feature-list{margin:0;padding:0;list-style:none}.feature-list li{padding:var(--space-lg) 0;border-bottom:1px solid var(--color-rule)}.feature-list li:first-child{padding-top:0}.feature-list strong{font-family:var(--font-display);font-size:var(--text-md)}.feature-list p{margin:var(--space-xs) 0 0}.media-big,.gallery-card>a{display:block}.media-big img,.gallery-card img{width:100%;aspect-ratio:16/9;object-fit:contain;background:var(--color-dark);color:var(--color-on-dark)}.media-big:hover,.gallery-card>a:hover{outline:2px solid var(--color-focus);outline-offset:2px}.thumb-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-md);margin-top:var(--space-lg)}.thumb-grid a{display:block}.thumb-grid img{aspect-ratio:16/9;object-fit:contain;width:100%}.character-list{display:grid;gap:var(--space-lg);margin-top:var(--space-xl)}.character{border-top:1px solid var(--color-rule);padding-top:var(--space-lg)}.character h3{margin:0 0 var(--space-2xs)}.role{font-size:var(--text-sm);color:var(--color-muted)}.character p:last-child{margin-bottom:0}.notice{font-size:var(--text-sm);padding:var(--space-lg) 0;border-top:1px solid var(--color-rule);border-bottom:1px solid var(--color-rule);margin:var(--space-lg) 0}.download-panel{background:var(--color-dark);color:var(--color-on-dark);margin:var(--space-xl) calc(-1 * var(--page-gutter));padding:var(--space-xl) var(--page-gutter);display:grid;gap:var(--space-lg)}.download-panel h2{margin-bottom:var(--space-sm)}.download-panel p{color:var(--color-muted-dark)}.download-panel .btn{justify-self:start}.download-panel a:focus-visible{outline-color:var(--color-accent)}.update{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:var(--space-lg);padding:var(--space-lg) 0}.update+.update{border-top:1px solid var(--color-rule)}.update .version{font-family:var(--font-body);font-size:var(--text-md);font-weight:700}.update time{font-size:var(--text-sm);color:var(--color-muted);font-variant-numeric:tabular-nums}.update ul{margin:var(--space-sm) 0 0}.faq details{border-top:1px solid var(--color-rule);padding:var(--space-md) 0}.faq summary{cursor:pointer;min-height:44px;display:list-item;font-weight:600;padding-block:var(--space-xs)}.faq details[open] summary{margin-bottom:var(--space-sm)}.faq details p{margin-left:var(--space-lg);margin-bottom:var(--space-md);max-width:65ch}.faq details:last-child{border-bottom:1px solid var(--color-rule)}.sub-head{padding:var(--space-xl) var(--page-gutter);background:var(--color-paper-alt);color:var(--color-ink)}.sub-head h1{font-size:clamp(2rem,4vw,3rem);margin-top:var(--space-xl)}.sub-head>p{max-width:60ch;margin-bottom:0}.breadcrumb{display:flex;flex-wrap:wrap;gap:var(--space-xs);font-size:var(--text-sm)}.breadcrumb a{white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}.breadcrumb span{display:inline-flex;align-items:center}.sub-game{font-size:var(--text-sm);color:var(--color-muted);margin-top:var(--space-lg)}.toc{display:grid;gap:var(--space-xs);padding:var(--space-lg) 0}.toc a{min-height:44px;display:flex;align-items:center;width:fit-content}.guide-cards{display:grid;gap:var(--space-lg);margin-top:var(--space-lg)}.guide-card{padding:var(--space-lg);border:1px solid var(--color-rule)}.guide-card a{white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}.step-list{counter-reset:steps;list-style:none;padding:0;margin:var(--space-xl) 0}.step-list li{padding:var(--space-md) 0 var(--space-md) var(--space-xl);position:relative;counter-increment:steps;border-top:1px solid var(--color-rule)}.step-list li::before{content:counter(steps,decimal-leading-zero);position:absolute;left:0;font-size:var(--text-sm);color:var(--color-muted);font-variant-numeric:tabular-nums}.step-list strong{display:block;margin-bottom:var(--space-xs)}.inline-note{background:var(--color-paper-alt);color:var(--color-ink);padding:var(--space-lg);margin-top:var(--space-lg)}.requirement-grid{display:grid;gap:var(--space-xl)}.requirement-grid dl{margin:0}.requirement-grid dl>div{display:grid;grid-template-columns:5rem minmax(0,1fr);gap:var(--space-sm);padding:var(--space-sm) 0;border-bottom:1px solid var(--color-rule)}.filter-row{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.filter-btn{padding:var(--space-xs) var(--space-md);background:var(--color-paper);color:var(--color-ink);box-shadow:none;border-color:var(--color-rule);font-size:var(--text-sm)}.filter-btn:hover,.filter-btn[aria-pressed=true]{background:var(--color-dark);color:var(--color-on-dark);border-color:var(--color-dark)}.filter-btn[aria-pressed=true]::before{content:'✓';font-size:var(--text-sm)}.gallery-count{font-size:var(--text-sm);margin-top:var(--space-lg)}.gallery-grid{display:grid;gap:var(--space-xl)}.gallery-card figcaption strong{display:block;font-size:var(--text-base);font-family:var(--font-display);color:var(--color-ink);margin-bottom:var(--space-2xs)}
.footer{max-width:1040px;margin:auto;padding:var(--space-xl) var(--page-gutter) var(--space-2xl);background:var(--color-dark);color:var(--color-on-dark)}.footer-brand{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700}.footer-nav,.related{display:flex;flex-wrap:wrap;gap:var(--space-xs) var(--space-lg);font-size:var(--text-sm);margin:var(--space-lg) 0}.footer-nav a,.related a{white-space:nowrap;display:inline-flex;align-items:center;min-height:44px}.legal{font-size:var(--text-sm);color:var(--color-muted-dark);border-top:1px solid var(--color-rule);padding-top:var(--space-lg)}.legal p{margin-bottom:var(--space-sm)}.sticky{position:fixed;inset:auto 0 0;z-index:var(--z-sticky);display:flex;justify-content:space-between;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md) calc(var(--space-sm) + env(safe-area-inset-bottom));background:var(--color-dark);color:var(--color-on-dark);border-top:1px solid var(--color-accent)}.sticky>div{font-size:var(--text-sm);line-height:1.6}.sticky small{display:block;color:var(--color-muted-dark);font-size:var(--text-sm)}.sticky .btn{padding:var(--space-sm) var(--space-md);font-size:var(--text-sm)}body{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
.lightbox{position:fixed;inset:0;margin:auto;width:calc(100% - 24px);max-width:1500px;max-height:92dvh;height:fit-content;overflow:auto;padding:var(--space-md);border:1px solid var(--color-rule);background:var(--color-dark);color:var(--color-on-dark)}.lightbox::backdrop{background:var(--color-overlay)}.lightbox[open]{animation:appear var(--dur-long) var(--ease-out)}.lightbox-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-md)}.lightbox-header p{margin:0;font-size:var(--text-sm)}.lightbox-image{width:100%;height:min(66dvh,720px);object-fit:contain}.lightbox-nav{display:flex;justify-content:space-between;align-items:center;gap:var(--space-xs);margin-top:var(--space-md)}.icon-btn{background:var(--color-paper);color:var(--color-ink);box-shadow:none;font-size:var(--text-sm);padding:var(--space-xs) var(--space-sm)}.icon-btn:hover{background:var(--color-accent);color:var(--color-accent-ink)}.lightbox-status{font-size:var(--text-sm);margin:0;text-align:center;max-width:48ch}.lightbox[data-state=error] .lightbox-status{color:var(--color-accent)}.lightbox[data-state=loading] .lightbox-image{opacity:.35}.lightbox[data-state=success] .lightbox-image{opacity:1}.lightbox :focus-visible{outline-color:var(--color-accent)}@keyframes appear{from{opacity:0}to{opacity:1}}
@media(min-width:40rem){.hero-inner{grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:end}.hero-side{border-top:0;border-left:1px solid var(--color-muted-dark);padding:0 0 0 var(--space-lg)}.info-strip{grid-template-columns:repeat(4,minmax(0,1fr))}.intro-layout{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}.play-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}.thumb-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.character-list,.guide-cards,.requirement-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.download-panel{grid-template-columns:minmax(0,1fr) auto;align-items:center}.download-panel>.notice-small{grid-column:1/-1;margin:0}.sticky{padding-inline:var(--page-gutter)}.hero-lede{max-width:29em}}@media(min-width:60rem){.hero{min-height:calc(100svh - 74px);max-height:900px}.paper{margin-top:calc(-1 * var(--space-lg));position:relative;z-index:var(--z-raised)}.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.gallery-grid .gallery-card:first-child{grid-column:span 2;grid-row:span 2}.sticky{display:none}body{padding-bottom:0}.hero-inner{padding-bottom:var(--space-2xl)}.site-header{height:74px;display:flex;align-items:center}.header-inner{width:100%}.subpage .paper{margin-top:var(--space-xl)}}@media(max-width:39.99rem){.hero{min-height:610px;max-height:none}.hero-inner{padding-top:15rem;padding-bottom:var(--space-xl)}.hero h1{font-size:2.7rem}.hero-side{display:none}.hero-lede{font-size:var(--text-base)}.header-inner{padding:var(--space-xs) var(--space-md);gap:0}.brand{font-size:var(--text-base)}.site-nav{width:100%;justify-content:space-between;gap:var(--space-2xs);font-size:.8125rem}.site-nav a{min-height:40px}.hero .actions{gap:var(--space-xs) var(--space-md)}.section-head{display:block}.section-head .text-link{margin-top:var(--space-sm)}.update{grid-template-columns:minmax(0,1fr);gap:var(--space-xs)}.lightbox-header{align-items:start}.lightbox-image{height:45dvh}.lightbox-nav{flex-wrap:wrap}.lightbox-status{order:3;width:100%}.sticky small{font-size:var(--text-sm)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.btn:hover,.btn:active,.icon-btn:active,.filter-btn:active{transform:none}}

.lightbox-view:fullscreen{background:var(--color-dark);color:var(--color-on-dark);padding:var(--space-lg);overflow:auto;display:flex;flex-direction:column;justify-content:center}.lightbox-view:fullscreen .lightbox-image{height:74dvh}
