/* Hallmark · macrostructure: Photographic · tone: atmospheric · anchor hue: cyan
 * theme: custom · vibe: 夜色 江湖 影像 商店 · dark / classical serif / cyan-pink
 * display: Noto Serif SC · body: Noto Sans SC · nav: N7 · footer: Ft1
 * pre-emit critique: P4 H5 E4 S4 R5 V4 */
@import url('./tokens.css');
@font-face{font-family:'Noto Sans SC';src:url('./fonts/noto-sans-sc.woff2') format('woff2');font-weight:400 900;font-display:swap}
@font-face{font-family:'Noto Serif SC';src:url('./fonts/noto-serif-sc.woff2') format('woff2');font-weight:700 900;font-display:swap}
*{box-sizing:border-box}html,body{overflow-x:clip}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);font-size:var(--text-body);line-height:1.75;padding-bottom:80px}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:var(--color-transparent)}button,a.button{min-height:44px}button{border:1px solid var(--color-rule);background:var(--color-panel)}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:active,button:active{transform:translateY(1px)}button[data-state=loading]{cursor:progress}button[data-state=error]{border-color:var(--color-error)}button[data-state=success]{border-color:var(--color-accent)}[hidden]{display:none!important}img{max-width:100%;height:auto;display:block}figure,p{margin:0}h1,h2,h3{font-style:normal;margin:0;overflow-wrap:anywhere;min-width:0;line-height:1.3}h1,h2{font-family:var(--font-display);font-weight:900}h2{font-size:var(--text-title)}h3{font-size:var(--text-lede)}p{color:var(--color-muted)}small{font-size:var(--text-small)}.wrap{width:min(1280px,calc(100% - 40px));margin-inline:auto}.button{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-lg);padding:var(--space-sm) var(--space-lg);font-weight:700;white-space:nowrap;position:relative;isolation:isolate;transition:transform var(--dur-micro) var(--ease-out)}.primary{background:var(--color-action);color:var(--color-on-action);border:1px solid var(--color-action-hover)}.primary:hover{background:var(--color-action-hover)}.primary:before{content:'';position:absolute;inset:3px;border:1px solid var(--color-ink);opacity:0;pointer-events:none;transition:opacity var(--dur-short) var(--ease-out)}.primary:hover:before{opacity:.4}.text-link,.secondary-link{display:inline-flex;align-items:center;gap:var(--space-lg);min-height:44px;color:var(--color-accent);white-space:nowrap}.text-link:hover,.secondary-link:hover{text-decoration:underline;text-underline-offset:6px}.skip-link{position:fixed;left:16px;top:-100px;padding:12px 20px;background:var(--color-accent);color:var(--color-paper);z-index:var(--z-modal)}.skip-link:focus{top:12px}.site-header{position:sticky;top:0;z-index:var(--z-nav);background:var(--color-paper);border-bottom:1px solid var(--color-rule)}.nav-shell{width:min(1440px,calc(100% - 32px));margin:auto;min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.wordmark{display:flex;align-items:center;gap:12px;font-weight:700;white-space:nowrap;font-size:1.05rem}.brand-mark{display:grid;place-items:center;width:34px;height:38px;font-family:var(--font-display);font-size:24px;background:var(--color-accent);color:var(--color-paper)}.desktop-nav{display:none}.nav-actions{display:flex;align-items:center;gap:var(--space-xs)}.nav-actions>.button{display:none}.menu-toggle{padding:8px 14px;font-size:14px}.mobile-nav{padding:12px 20px;border-top:1px solid var(--color-rule);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-xs)}.mobile-nav a{padding:12px}.mobile-nav a[aria-current]{border-left:2px solid var(--color-accent);color:var(--color-accent)}
.hero{position:relative;isolation:isolate;padding-top:var(--space-lg)}.hero-background{position:absolute;inset:0;z-index:-1;overflow:clip}.hero-background img{width:100%;height:100%;object-fit:cover;opacity:.22;filter:saturate(.55)}.hero-background:after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,var(--color-transparent),var(--color-paper))}.hero-layout{display:grid;gap:var(--space-xl)}.hero-visual{min-width:0}.frame-title{display:flex;align-items:center;justify-content:space-between;font-size:var(--text-small);margin-bottom:var(--space-sm);gap:var(--space-sm)}.frame-title a{min-height:44px;display:flex;align-items:center;white-space:nowrap;color:var(--color-accent)}.hero-image{display:block;position:relative}.hero-image>img{width:100%;aspect-ratio:16/9;object-fit:cover}.hero-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-xs);margin-top:var(--space-sm)}.hero-thumbs img{width:100%;aspect-ratio:16/9;object-fit:cover}.hero-thumbs a{border:1px solid var(--color-rule)}.hero-thumbs a:hover{border-color:var(--color-accent)}.image-note{display:flex;justify-content:center;flex-direction:column;font-family:var(--font-display);font-size:clamp(.8rem,1.5vw,1.2rem);color:var(--color-ink);padding-left:12px;border-left:1px solid var(--color-accent)}.hero-copy{padding:var(--space-lg);background:var(--color-overlay);border-top:2px solid var(--color-accent)}.tags{display:flex;gap:var(--space-sm);font-size:var(--text-small);color:var(--color-accent)}.tags span+span{border-left:1px solid var(--color-rule);padding-left:var(--space-sm)}.hero h1{font-size:var(--text-display);line-height:1.12;letter-spacing:.025em;margin-top:var(--space-md)}.hero h1 br{display:none}.romanization{font-size:var(--text-small);letter-spacing:.12em;margin:var(--space-sm) 0 var(--space-lg)}.hero-lede{font-size:var(--text-body);max-width:38ch}.hero-facts{font-size:var(--text-small);margin:var(--space-lg) 0}.hero-facts>div{display:flex;gap:var(--space-lg);padding:8px 0;border-bottom:1px solid var(--color-rule)}dt{color:var(--color-muted)}dd{margin:0}.hero-facts dd{margin-left:auto}.hero-copy>.button{width:100%;font-size:var(--text-lede)}.secondary-link{display:flex;justify-content:center;margin-top:var(--space-xs);color:var(--color-ink);border:1px solid var(--color-rule)}.external-note{display:block;font-size:var(--text-small);color:var(--color-muted);margin-top:var(--space-sm);text-align:center}.hero-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-md);padding-block:var(--space-lg);font-size:var(--text-small);color:var(--color-muted)}.hero-bottom a{color:var(--color-accent);min-height:44px;display:flex;align-items:center;white-space:nowrap}.hero-bottom>span{align-self:center}.quick-spec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:1px solid var(--color-rule);padding-block:var(--space-lg);gap:var(--space-lg)}.quick-spec>div{display:flex;flex-direction:column;gap:4px}.quick-spec span{font-size:var(--text-small);color:var(--color-muted)}.quick-spec strong{font-size:var(--text-lede);font-weight:700}.story-section{padding-block:var(--space-3xl);display:grid;gap:var(--space-xl)}.story-heading p{margin:var(--space-md) 0}.story-text p+p{margin-top:var(--space-lg)}.character-note{display:flex;gap:var(--space-lg);flex-wrap:wrap;padding-top:var(--space-lg);margin-top:var(--space-lg);border-top:1px solid var(--color-rule)}.character-note strong{color:var(--color-accent)}.character-note span{font-size:var(--text-small);color:var(--color-muted)}.gameplay-band{background:var(--color-paper-light);color:var(--color-ink-dark);padding-block:var(--space-3xl)}.gameplay-band p,.gameplay-band dt{color:var(--color-dark-muted)}.gameplay-layout{display:grid;gap:var(--space-xl);align-items:center}.gameplay-copy>p{margin-top:var(--space-md)}.gameplay-shot .media-tile{background:var(--color-ink-dark);color:var(--color-ink)}.mechanics{margin:var(--space-lg) 0 0}.mechanics>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:var(--space-md);padding-block:var(--space-md);border-top:1px solid var(--color-light-rule)}.mechanics dt{font-weight:700}.mechanics dd{font-size:var(--text-small)}.section-head{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-xl)}.section-head p{margin-top:var(--space-sm)}.gallery-preview{padding-block:var(--space-3xl)}.gallery-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}.media-tile{min-width:0;background:var(--color-panel)}.media-tile .zoom{display:block;position:relative;overflow:clip}.media-tile img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform var(--dur-short) var(--ease-out)}.media-tile a:hover img{transform:scale(1.025)}.zoom-mark{position:absolute;right:var(--space-sm);bottom:var(--space-sm);display:grid;place-items:center;width:36px;height:36px;background:var(--color-paper);color:var(--color-accent);border:1px solid var(--color-rule);font-size:24px}.media-tile figcaption{padding:var(--space-sm) var(--space-md);display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm)}.media-tile small{color:var(--color-muted)}.reading-band{background:var(--color-panel);padding-block:var(--space-3xl)}.reading-layout{display:grid;gap:var(--space-xl)}.reading-layout p{margin-top:var(--space-lg);max-width:43ch}.reading-links{display:grid}.reading-links>a{display:grid;grid-template-columns:minmax(0,1fr) 24px;gap:6px 12px;position:relative;padding:var(--space-lg) 0;border-bottom:1px solid var(--color-rule)}.reading-links span{font-size:var(--text-small);color:var(--color-accent);grid-column:1}.reading-links strong{font-size:var(--text-body);font-weight:400;grid-column:1}.reading-links b{grid-column:2;grid-row:1/3;align-self:center;color:var(--color-accent)}.reading-links>a:hover strong{text-decoration:underline;text-underline-offset:5px}.faq-section{padding-block:var(--space-3xl)}details{border-bottom:1px solid var(--color-rule)}summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--space-lg);padding:20px 0;list-style:none;font-weight:700}summary::-webkit-details-marker{display:none}summary>span{flex:0 0 24px;color:var(--color-accent);font-size:24px;text-align:center}summary>span:after{content:'+'}details[open] summary>span:after{content:'−'}summary:hover{color:var(--color-accent)}.answer{padding-bottom:var(--space-lg);max-width:85ch}.final-cta{border-top:1px solid var(--color-accent);padding-block:var(--space-2xl);display:grid;gap:var(--space-lg)}.final-cta h2{font-size:var(--text-title)}.final-cta p{margin-top:var(--space-sm)}.final-cta small{color:var(--color-muted)}.site-footer{border-top:1px solid var(--color-rule);padding-top:var(--space-xl);padding-bottom:var(--space-xl)}.footer-top{display:flex;flex-direction:column;gap:var(--space-lg)}.footer-wordmark{font:900 1.7rem var(--font-display);white-space:nowrap}.footer-top p{margin-top:var(--space-sm);font-size:var(--text-small)}.footer-top nav{display:flex;flex-wrap:wrap;gap:4px 20px}.footer-top nav a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;font-size:var(--text-small)}.footer-top a:hover,.related a:hover{color:var(--color-accent)}.related{margin-block:var(--space-lg);padding-block:var(--space-lg);border-top:1px solid var(--color-rule);border-bottom:1px solid var(--color-rule);font-size:var(--text-small)}.related>span{display:block;color:var(--color-muted);margin-bottom:var(--space-sm)}.related>div{display:flex;flex-wrap:wrap;gap:4px var(--space-lg)}.related a{display:inline-flex;min-height:44px;align-items:center;white-space:nowrap;font-size:14px}.legal{max-width:95ch}.legal p{font-size:var(--text-small);margin-top:var(--space-xs)}.mobile-cta{position:fixed;bottom:0;left:0;right:0;z-index:var(--z-cta);display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);background:var(--color-paper);border-top:1px solid var(--color-rule);padding:10px 16px calc(10px + env(safe-area-inset-bottom))}.mobile-cta>span{font-size:var(--text-small);font-weight:700}.mobile-cta small{display:block;font-size:12px;color:var(--color-muted);font-weight:400}.mobile-cta .button{padding:10px 16px;gap:12px}
.subhead{padding-top:var(--space-xl);padding-bottom:var(--space-xl)}.breadcrumb{display:flex;flex-wrap:wrap;gap:var(--space-sm);font-size:var(--text-small);color:var(--color-muted);align-items:center;margin-bottom:var(--space-lg)}.breadcrumb a{min-height:44px;display:flex;align-items:center;white-space:nowrap}.breadcrumb a:hover{color:var(--color-accent)}.subhead h1{font-size:clamp(2.1rem,4.7vw,3.6rem);line-height:1.3}.subhead>p{margin-top:var(--space-lg);max-width:70ch}.filter-bar{display:flex;gap:var(--space-xs);align-items:center;flex-wrap:wrap;padding-block:var(--space-md);margin-bottom:var(--space-lg);border-block:1px solid var(--color-rule)}.filter-bar button{font-size:14px;padding:8px 16px;white-space:nowrap;border-color:var(--color-transparent);background:var(--color-transparent)}.filter-bar button[aria-pressed=true]{background:var(--color-accent);color:var(--color-paper)}.filter-bar button:hover{border-color:var(--color-accent)}.filter-bar>span{font-size:var(--text-small);color:var(--color-muted);margin-left:auto}.gallery-page{padding-bottom:var(--space-2xl);min-height:55dvh}.gallery-help{padding-top:var(--space-lg);font-size:var(--text-small)}.download-layout{display:grid;gap:0;background:var(--color-panel)}.download-photo img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/9}.download-card{padding:var(--space-lg);border-top:2px solid var(--color-accent)}.download-card h2{margin-top:var(--space-sm)}.download-card>p{margin-top:var(--space-md)}.download-card .button{width:100%;margin-top:var(--space-lg)}.small-label{color:var(--color-accent);font-size:var(--text-small)}.download-related{display:flex;flex-wrap:wrap;gap:var(--space-md);margin-top:var(--space-lg)}.download-related>a{display:flex;align-items:center;min-height:44px;white-space:nowrap;font-size:14px}.download-related>a:hover{color:var(--color-accent)}.steps-section{padding-top:var(--space-3xl)}.steps{list-style:none;padding:0;display:grid;gap:var(--space-lg);counter-reset:steps}.steps>li{border-top:1px solid var(--color-rule);padding-top:var(--space-lg)}.steps span{display:block;font-size:2rem;color:var(--color-accent);margin-bottom:var(--space-md)}.steps p{margin-top:var(--space-sm);font-size:var(--text-small)}.guide-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-md)}.guide-cards>a{background:var(--color-panel);border-top:2px solid var(--color-rule);padding:var(--space-md);display:flex;flex-direction:column;align-items:start;gap:var(--space-sm)}.guide-cards h2{font-family:var(--font-body);font-size:var(--text-lede)}.guide-cards p{font-size:var(--text-small);flex:1}.guide-cards span{font-size:var(--text-small);color:var(--color-accent);white-space:nowrap}.guide-cards>a:hover{border-color:var(--color-accent)}.article-layout{display:grid;gap:var(--space-xl);padding-block:var(--space-2xl) var(--space-3xl)}.contents{border-top:1px solid var(--color-rule);padding-top:var(--space-lg);align-self:start}.contents>strong{font-size:var(--text-small);color:var(--color-muted)}.contents nav{display:flex;flex-wrap:wrap;gap:4px 20px;margin-block:var(--space-sm)}.contents nav a{min-height:44px;display:flex;align-items:center;white-space:nowrap}.contents nav a:hover{color:var(--color-accent)}.contents>.text-link{font-size:var(--text-small)}.prose{min-width:0;max-width:80ch}.prose section+section{margin-top:var(--space-3xl);border-top:1px solid var(--color-rule);padding-top:var(--space-xl)}.prose h2{font-size:clamp(1.65rem,2.6vw,2.1rem)}.prose p{margin-top:var(--space-lg)}.prose ul,.prose ol{padding-left:1.5em;color:var(--color-muted);margin-block:var(--space-lg)}.prose li+li{margin-top:var(--space-sm)}.prose strong{color:var(--color-ink)}.prose>section>img{margin-block:var(--space-lg);aspect-ratio:16/9;object-fit:contain;background:var(--color-panel)}.callout{border-left:2px solid var(--color-accent);background:var(--color-panel);padding:var(--space-lg);margin-block:var(--space-lg)}.callout p{margin-top:var(--space-sm)}.note-list,.troubleshooting{margin:var(--space-lg) 0}.note-list>div,.troubleshooting>div{display:grid;grid-template-columns:80px minmax(0,1fr);gap:var(--space-lg);padding-block:var(--space-md);border-bottom:1px solid var(--color-rule)}.note-list dt,.troubleshooting dt{color:var(--color-accent)}.note-list dd,.troubleshooting dd{color:var(--color-muted)}
.lightbox{background:var(--color-paper);color:var(--color-ink);border:1px solid var(--color-rule);padding:16px;width:min(1280px,calc(100% - 24px));max-height:94dvh;overflow:auto}.lightbox::backdrop{background:var(--color-overlay)}.lightbox-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md);gap:var(--space-md)}.lightbox-toolbar button{padding:8px 16px}.lightbox-stage{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:8px}.lightbox-stage button{height:44px}.lightbox-stage figure{min-width:0;margin:0}.lightbox-image{max-height:72dvh;width:100%;object-fit:contain;margin:auto;touch-action:pan-y}.lightbox-caption{text-align:center;margin-top:var(--space-md);font-size:var(--text-small)}.lightbox-status{font-size:var(--text-small);text-align:center;color:var(--color-error)}.lightbox[data-state=loading] .lightbox-image{opacity:.35}.lightbox[data-state=error] .lightbox-image{display:none}.lightbox button:hover{border-color:var(--color-accent);color:var(--color-accent)}.lightbox[open]{animation:lightbox-in var(--dur-short) var(--ease-out)}@keyframes lightbox-in{from{opacity:0}to{opacity:1}}
@media(min-width:640px){.wrap{width:min(1280px,calc(100% - 64px))}.nav-actions>.button{display:inline-flex}.hero-copy{padding:var(--space-xl)}.hero-thumbs{gap:var(--space-md)}.hero-copy>.button{max-width:420px}.hero-copy>.secondary-link{max-width:420px}.hero-copy>.external-note{max-width:420px}.quick-spec{grid-template-columns:repeat(4,minmax(0,1fr))}.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-md)}.media-tile figcaption{font-size:14px;padding:12px}.media-tile small{font-size:12px}.section-head{flex-direction:row;justify-content:space-between;align-items:end}.steps{grid-template-columns:repeat(3,minmax(0,1fr))}.guide-cards>a{padding:var(--space-lg)}.final-cta{grid-template-columns:minmax(0,1fr) auto;align-items:center}.final-cta small{grid-column:1/-1}.download-layout{grid-template-columns:1.1fr 1fr}.download-photo img{aspect-ratio:auto}.download-card{padding:var(--space-xl)}.lightbox{padding:24px}.lightbox-stage{gap:var(--space-md)}}
@media(min-width:768px){.hero-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--space-lg);align-items:center}.hero h1 br{display:block}.hero-copy{padding:var(--space-lg)}.hero h1{font-size:var(--text-display)}.hero-visual{align-self:center}.hero-lede{font-size:var(--text-small)}.hero-facts>div{gap:var(--space-xs)}.hero-facts{font-size:12px}.hero-bottom{padding-block:var(--space-xl)}.story-section{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--space-2xl)}.reading-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:var(--space-2xl)}.gameplay-layout{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--space-xl)}.footer-top{flex-direction:row;justify-content:space-between;align-items:center}.mobile-cta{display:none}body{padding-bottom:0}.article-layout{grid-template-columns:210px minmax(0,1fr);gap:var(--space-xl)}.contents{position:sticky;top:110px}.contents nav{flex-direction:column;gap:var(--space-xs)}.prose{margin-left:auto}.subhead{padding-block:var(--space-2xl)}.troubleshooting>div{grid-template-columns:130px minmax(0,1fr)}}
@media(min-width:1024px){.desktop-nav{display:flex;gap:var(--space-xl);align-items:center}.desktop-nav>a{min-height:76px;display:flex;align-items:center;position:relative;font-size:var(--text-small);white-space:nowrap}.desktop-nav a[aria-current]{color:var(--color-accent)}.desktop-nav a[aria-current]:after{content:'';position:absolute;inset:auto 0 0;height:2px;background:var(--color-accent)}.desktop-nav a:hover{color:var(--color-accent)}.menu-toggle,.mobile-nav{display:none!important}.hero{min-height:calc(100svh - 77px);display:flex;flex-direction:column;justify-content:center;padding-top:var(--space-xl)}.hero-layout{grid-template-columns:minmax(0,1.48fr) minmax(0,1fr);gap:var(--space-2xl)}.hero-copy{padding:var(--space-xl)}.hero-lede{font-size:var(--text-body)}.hero-facts{font-size:var(--text-small)}.hero h1 br{display:none}.hero h1{font-size:clamp(3.5rem,4.7vw,4.6rem);max-width:4.3em}.hero h1{line-height:1.15}.hero-bottom{padding-bottom:var(--space-lg)}.quick-spec>div{border-left:1px solid var(--color-rule);padding-left:var(--space-lg)}.story-section{padding-block:var(--space-4xl)}.gameplay-layout{gap:var(--space-2xl)}.gallery-preview,.reading-band,.faq-section{padding-block:var(--space-4xl)}.gallery-grid{gap:var(--space-lg)}.media-tile figcaption{font-size:var(--text-body);padding:16px}.media-tile small{font-size:14px}.guide-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.article-layout{grid-template-columns:240px minmax(0,1fr);gap:var(--space-3xl)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.media-tile a:hover img,.button:active,button:active{transform:none}}
/* Final responsive refinements */
.hero-copy{order:-1}.hero h1{font-size:clamp(2rem,8.5vw,3rem);max-width:none}.hero h1 br{display:none}.prose{max-width:75ch}.answer{max-width:75ch}
@media(min-width:640px){.download-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}}
@media(min-width:768px){.hero-copy{order:0}.hero h1{font-size:clamp(3.5rem,5.5vw,5rem);max-width:none}.hero h1 br{display:block}}
.gameplay-band{--color-focus:var(--color-ink-dark)}
a:active{opacity:.85}summary:active{opacity:.85}