/* Hallmark · pre-emit critique: P5 H5 E4 S5 R5 V4
 * macrostructure: Catalogue · theme: custom guild archive · genre: bespoke editorial
 * H2: ratio=5/7, plain real screenshot · F3: key/value · F6: landscape, 3-up
 * nav: N7 · footer: Ft1 · enrichment: official map and narrative panels
 * motion: hard button press; immediate filters; reduced motion supported
 * User palette and system Chinese font pairing retained; no generated game art.
 */
:root{--color-coal:#111315;--color-gun:#4B5563;--color-accent:#FACC15;--color-error:#DC2626;--color-paper:#F5F0E6;--color-ink:oklch(20% .01 70);--color-surface:oklch(25% .01 70);--color-muted:oklch(77% .01 70);--color-rule:oklch(37% .01 70);--color-paper-rule:oklch(83% .02 70);--color-paper-muted:oklch(43% .015 70);--color-cream:oklch(94% .014 80);--color-soft-yellow:oklch(83% .10 90);--color-overlay:oklch(15% .01 70 / .95);--color-clear:transparent;--color-accent-ink:var(--color-coal);--color-focus:var(--color-accent);--color-success:oklch(80% .08 145);--font-display:'Songti SC','STSong','Noto Serif CJK SC',serif;--font-body:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:72px;--ease-out:cubic-bezier(.22,1,.36,1);--ease-in:cubic-bezier(.7,0,.84,0);--ease-in-out:cubic-bezier(.65,0,.35,1)}
*{box-sizing:border-box}html,body{margin:0;overflow-x:clip}html{scroll-behavior:smooth;scroll-padding-top:110px}body{background:var(--color-coal);color:var(--color-paper);font:16px/1.75 var(--font-body);padding-bottom:100px}h1,h2,h3{line-height:1.2;font-style:normal;overflow-wrap:anywhere;min-width:0;margin:0;font-family:var(--font-display)}h1{font-size:clamp(36px,4vw,60px);font-weight:900;letter-spacing:-.035em}h2{font-size:clamp(28px,3vw,40px);font-weight:800}h3{font-size:23px;font-weight:800}p{margin:16px 0}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:5px}a,button,summary{-webkit-tap-highlight-color:var(--color-clear)}button{font:inherit;cursor:pointer;color:inherit}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:5px}img{display:block;max-width:100%;height:auto}figure{margin:0}figcaption{font-size:13px;color:var(--color-muted);padding-top:10px}main{min-width:0}.wrap{max-width:1380px;margin:0 auto;padding-inline:40px}.skip{position:fixed;top:-100px;left:16px;background:var(--color-accent);color:var(--color-accent-ink);padding:12px;z-index:100}.skip:focus{top:10px}.masthead{position:sticky;top:0;z-index:20;background:var(--color-coal);border-bottom:1px solid var(--color-rule)}.mast-row{display:flex;align-items:center;gap:32px;min-height:80px}.brand{display:flex;align-items:center;gap:12px;white-space:nowrap;font-weight:800;font-size:19px;letter-spacing:.02em}.brand img{width:36px;height:36px}.brand small{display:block;font-size:10px;letter-spacing:.1em;color:var(--color-muted);font-weight:500;line-height:1.1}.nav{margin-left:auto;display:flex;gap:28px;align-items:center}.nav a{white-space:nowrap;font-size:14px}.nav a[aria-current]{color:var(--color-accent);text-decoration:underline;text-underline-offset:10px}.btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:11px 24px;border:1px solid var(--color-rule);white-space:nowrap;font:700 14px/1.5 var(--font-body);background:var(--color-clear);text-decoration:none;box-shadow:3px 4px 0 var(--color-gun);transition:transform 100ms var(--ease-out);color:inherit}.btn:hover{text-decoration:none;border-color:var(--color-accent)}.btn:active{transform:translateY(2px);box-shadow:3px 2px 0 var(--color-gun)}.btn.primary{background:var(--color-accent);color:var(--color-accent-ink);border-color:var(--color-accent)}.btn.primary:hover{background:var(--color-soft-yellow)}.btn:disabled,.btn[aria-disabled=true]{opacity:.45;cursor:not-allowed}.btn[data-state=loading]{opacity:.7;cursor:progress}.btn[data-state=error]{border-color:var(--color-error)}.btn[data-state=success]{border-color:var(--color-success)}.actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:28px}.fine{font-size:13px;line-height:1.8;color:var(--color-muted)}.hero{padding-block:32px 48px}.hero-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,8fr);gap:48px;align-items:start}.hero-copy{padding-top:10px}.hero-top{display:flex;align-items:center;gap:16px;margin-bottom:20px}.game-logo{width:86px;height:74px;object-fit:contain}.hero-tag{font-size:12px;letter-spacing:.08em;color:var(--color-muted)}.hero h1 span{display:block;color:var(--color-accent)}.original{display:block;font:400 16px/1.5 var(--font-body);letter-spacing:.02em;margin-top:18px;color:var(--color-muted)}.lead{font-size:18px;max-width:34ch;line-height:1.9;margin-block:22px}.tags{display:flex;gap:8px;flex-wrap:wrap}.tags span{font-size:12px;border:1px solid var(--color-rule);padding:3px 10px}.media-top{display:flex;justify-content:space-between;color:var(--color-muted);font-size:12px;padding-bottom:12px}.main-shot{display:block;position:relative}.main-shot img{aspect-ratio:16/9;width:100%;object-fit:contain}.main-shot:after{content:'查看大图 ↗';position:absolute;right:12px;bottom:12px;padding:4px 10px;background:var(--color-coal);color:var(--color-paper);font-size:12px}.thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}.thumbs a{display:block}.thumbs img{width:100%;aspect-ratio:16/9;object-fit:contain}.thumbs a:hover{outline:2px solid var(--color-accent)}.shot-caption{margin-top:12px;font-size:12px;color:var(--color-muted)}.shelf{margin-top:32px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--color-rule);border-bottom:1px solid var(--color-rule)}.shelf div{padding:16px 18px;border-right:1px solid var(--color-rule)}.shelf div:first-child{padding-left:0}.shelf div:last-child{border:0}.shelf dt{color:var(--color-muted);font-size:11px;margin-bottom:4px}.shelf dd{margin:0;font-size:13px;line-height:1.5}.section{padding-block:72px}.paper{--color-focus:var(--color-coal);background:var(--color-paper);color:var(--color-ink)}.paper p{color:var(--color-paper-muted)}.paper .fine,.paper figcaption{color:var(--color-paper-muted)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:32px}.section-head p{max-width:42ch;margin:0;color:var(--color-muted);font-size:14px}.paper .section-head p{color:var(--color-paper-muted)}.story-panel{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:center}.prose{max-width:65ch}.story-panel .prose{padding-right:20px}.story-line{font-size:clamp(23px,3vw,36px);font-family:var(--font-display);line-height:1.6;font-weight:700;color:var(--color-ink)!important;margin-block:24px}.mechanics{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:48px;align-items:center}.mechanic{padding-block:22px;border-bottom:1px solid var(--color-rule)}.mechanic:first-child{padding-top:0}.mechanic h3{font-size:24px}.mechanic p{font-size:14px;color:var(--color-muted);margin-bottom:0}.mechanic a{font-size:13px;color:var(--color-accent)}.media-shelf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.media-card img{width:100%;aspect-ratio:16/9;object-fit:contain}.media-card h3{margin-top:20px;font-size:22px}.media-card p{font-size:14px;margin-bottom:12px}.media-card>a:last-child{font-size:13px}.paper .media-card{border-bottom:1px solid var(--color-paper-rule);padding-bottom:20px}.faq-layout{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:60px}details{border-bottom:1px solid var(--color-rule);padding-block:18px}summary{font-size:16px;cursor:pointer;line-height:1.7;padding-right:16px}details p{font-size:14px;color:var(--color-muted);margin-bottom:0}.paper details{border-color:var(--color-paper-rule)}.paper details p{color:var(--color-paper-muted)}.banner{padding:32px;display:flex;justify-content:space-between;align-items:center;gap:32px;background:var(--color-surface);border-top:2px solid var(--color-accent)}.banner h2{font-size:28px}.banner p{font-size:14px;color:var(--color-muted);margin-bottom:0}.privacy{padding-block:40px;border-top:1px solid var(--color-rule)}.privacy h2{font-size:24px}.footer{border-top:1px solid var(--color-rule);padding-block:44px}.foot-top{display:flex;justify-content:space-between;gap:32px;align-items:start}.foot-name{font:700 26px/1.4 var(--font-display);margin:0}.footer p{max-width:90ch;font-size:12px;color:var(--color-muted)}.foot-links{display:flex;gap:12px 24px;flex-wrap:wrap;margin-block:20px}.foot-links a{font-size:13px;white-space:nowrap}.footer-label{font-size:12px;color:var(--color-muted)}.fixed-bar{position:fixed;bottom:0;left:0;right:0;z-index:25;background:var(--color-overlay);border-top:1px solid var(--color-rule);padding-bottom:env(safe-area-inset-bottom)}.fixed-inner{display:flex;align-items:center;gap:24px;min-height:78px}.nameplate{font-size:11px;border-left:3px solid var(--color-accent);padding-left:12px;line-height:1.6;white-space:nowrap}.fixed-text{font-size:13px;color:var(--color-muted)}.fixed-back{margin-left:auto;font-size:12px;white-space:nowrap}.fixed-bar .btn{min-height:42px}.breadcrumb{padding-top:26px;display:flex;gap:12px;font-size:12px;color:var(--color-muted);flex-wrap:wrap}.breadcrumb a,.breadcrumb span{white-space:nowrap}.page-heading{padding-block:44px 32px}.page-heading h1{font-size:clamp(32px,4vw,52px)}.page-heading p{max-width:65ch;color:var(--color-muted)}.page-heading .original{font-size:14px}.page-body{padding-bottom:60px}.download-layout{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:48px}.download-card{padding:32px;background:var(--color-surface);border-top:4px solid var(--color-accent)}.download-card h2{font-size:34px}.download-card .platform{font-size:12px;color:var(--color-accent);margin:0 0 16px}.download-card p{font-size:15px}.data-list{margin:24px 0}.data-list div{display:grid;grid-template-columns:100px minmax(0,1fr);padding-block:12px;border-bottom:1px solid var(--color-rule);font-size:14px}.data-list dt{color:var(--color-muted)}.data-list dd{margin:0}.requirements{margin-top:48px}.requirements h2{margin-bottom:24px}.spec-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}.spec-columns h3{font-size:23px}.steps{padding-left:24px}.steps li{padding-left:8px;margin-bottom:24px}.steps h3{font-family:var(--font-body);font-size:17px;line-height:1.5}.steps p{font-size:14px;color:var(--color-muted);margin-top:8px}.filters{display:flex;gap:12px;flex-wrap:wrap;margin-block:20px 32px}.filters[hidden]{display:none}.filters button{border:1px solid var(--color-rule);background:var(--color-clear);padding:9px 20px;font-size:13px;white-space:nowrap;min-height:44px}.filters button[aria-pressed=true]{background:var(--color-accent);color:var(--color-accent-ink);border-color:var(--color-accent)}.filters button:hover{border-color:var(--color-accent)}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px}.gallery-grid figure[hidden]{display:none}.gallery-grid img{aspect-ratio:16/9;width:100%;object-fit:contain}.gallery-grid a{display:block}.gallery-grid a:hover{outline:2px solid var(--color-accent)}.gallery-grid figcaption{color:var(--color-paper);font-size:14px}.gallery-grid small{display:block;color:var(--color-muted);font-size:11px;margin-top:4px}.guide-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:48px}.toc{position:sticky;top:110px;align-self:start;border-top:2px solid var(--color-accent);padding-top:20px}.toc h2{font:700 14px/1.4 var(--font-body);margin-bottom:12px}.toc a{display:block;font-size:13px;white-space:nowrap;padding-block:9px}.guide-content>section{padding-bottom:48px;margin-bottom:48px;border-bottom:1px solid var(--color-rule)}.guide-content h2{font-size:30px;margin-bottom:24px}.guide-content h3{font-size:21px;margin-top:24px}.guide-content p,.guide-content li{max-width:70ch;color:var(--color-muted);font-size:15px}.guide-content figure{max-width:850px;margin-block:28px}.guide-content .note{border-left:2px solid var(--color-accent);padding:8px 20px;background:var(--color-surface);color:var(--color-paper)}.term-list{display:grid;grid-template-columns:140px minmax(0,1fr);font-size:14px;border-top:1px solid var(--color-rule);padding-top:16px;gap:12px}.term-list dt{color:var(--color-accent)}.term-list dd{margin:0;color:var(--color-muted)}.lightbox{padding:20px;border:1px solid var(--color-rule);background:var(--color-coal);color:var(--color-paper);width:min(1240px,94vw);max-height:92vh;max-height:92dvh}.lightbox::backdrop{background:var(--color-overlay)}.lightbox-head,.lightbox-controls{display:flex;justify-content:space-between;gap:16px;align-items:center}.lightbox-head p{font-size:14px;margin:0;max-width:75%;line-height:1.5}.lightbox button{padding:8px 14px;border:1px solid var(--color-rule);background:var(--color-surface);font-size:13px;min-height:44px;white-space:nowrap}.lightbox button:hover{border-color:var(--color-accent)}.lightbox img{width:100%;object-fit:contain;max-height:65vh;margin-block:16px}.lightbox-status{font-size:12px;margin:0}.image-state{font-size:12px;min-height:20px;margin:0;color:var(--color-muted)}.lightbox[data-state=error] .image-state{color:var(--color-paper);border-left:3px solid var(--color-error);padding-left:12px}.lightbox[data-state=loading] img{opacity:.5}.lightbox[data-state=success] img{opacity:1}.lightbox[data-state=error] img{opacity:.2}
@media(min-width:1600px){.wrap{max-width:1540px}.hero-grid{gap:64px}.hero-copy{padding-top:35px}.hero h1{font-size:68px}}
@media(max-width:1100px){.wrap{padding-inline:28px}.nav{gap:18px}.mast-row{gap:20px}.hero-grid{gap:28px;grid-template-columns:minmax(0,5fr) minmax(0,6fr)}.hero h1{font-size:42px}.hero .actions{gap:12px}.hero .btn{padding-inline:16px}.hero-top{margin-bottom:14px}.lead{font-size:16px}.shelf{grid-template-columns:repeat(3,minmax(0,1fr))}.shelf div:nth-child(3){border-right:0}.shelf div:nth-child(4){padding-left:0;border-top:1px solid var(--color-rule)}.shelf div:nth-child(5),.shelf div:nth-child(6){border-top:1px solid var(--color-rule)}.fixed-text{font-size:12px}.story-panel,.mechanics{gap:32px}.guide-layout{grid-template-columns:185px minmax(0,1fr);gap:32px}.download-layout{gap:28px}}
@media(max-width:820px){.mast-row{min-height:100px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;padding-block:12px}.nav{grid-column:1/-1;grid-row:2;justify-content:space-between;margin:0;gap:12px}.mast-row>.btn{min-height:38px;padding:7px 14px;font-size:12px;box-shadow:none}.brand{font-size:16px}.brand img{width:30px;height:30px}.hero-grid{grid-template-columns:minmax(0,1fr)}.hero-copy{padding:0}.hero h1{font-size:48px}.hero h1 span{display:inline}.hero .original{margin-top:12px}.hero-top{margin-bottom:16px}.hero .lead{max-width:55ch}.hero-media{margin-top:12px}.hero{padding-top:28px}.story-panel,.mechanics,.faq-layout,.download-layout{grid-template-columns:minmax(0,1fr)}.story-panel .prose{padding:0}.media-shelf,.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.media-shelf .media-card:last-child{grid-column:1/-1;max-width:600px}.section{padding-block:48px}.section-head{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}.section-head p{max-width:60ch}.fixed-text{display:none}.fixed-inner{gap:20px;min-height:72px}.fixed-back{margin-left:auto}.guide-layout{grid-template-columns:minmax(0,1fr)}.toc{position:static;display:flex;flex-wrap:wrap;gap:8px 20px;padding-block:16px;border-bottom:1px solid var(--color-rule)}.toc h2{width:100%;margin-bottom:0}.toc a{padding:2px 0}.banner{align-items:start}.banner h2{font-size:24px}.foot-top{flex-wrap:wrap}.spec-columns{gap:28px}}
@media(max-width:520px){.wrap{padding-inline:20px}.hero h1{font-size:39px}.hero h1 span{display:block}.game-logo{width:64px;height:55px}.hero-top{gap:14px}.hero-tag{font-size:11px}.hero .lead{font-size:15px}.hero .actions{gap:12px}.btn{gap:12px;padding:10px 16px;font-size:13px;min-height:44px}.nav a{font-size:12px}.hero .fine{font-size:11px}.media-top{font-size:10px;gap:8px}.shelf{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:24px}.shelf div{padding:14px 10px;border-top:1px solid var(--color-rule)}.shelf div:nth-child(odd){padding-left:0;border-right:1px solid var(--color-rule)}.shelf div:nth-child(even){border-right:0;padding-left:16px}.shelf div:nth-child(1),.shelf div:nth-child(2){border-top:0}.shelf dd{font-size:12px}.story-panel,.mechanics,.faq-layout{gap:24px}.media-shelf,.gallery-grid,.spec-columns{grid-template-columns:minmax(0,1fr)}.media-shelf .media-card:last-child{grid-column:auto}.gallery-grid{gap:28px}.banner{padding:24px;flex-direction:column;gap:20px}.banner p{font-size:13px}.fixed-inner{gap:14px;min-height:68px}.nameplate{font-size:9px;padding-left:8px}.fixed-back{font-size:10px}.fixed-bar .btn{padding:10px 12px;font-size:12px;gap:8px;box-shadow:none}.fixed-inner.wrap{padding-inline:16px}.fixed-back{margin-left:auto}.footer .foot-links{gap:12px 20px}.foot-links a{font-size:12px}.download-card{padding:24px}.download-card h2{font-size:29px}.data-list div{grid-template-columns:85px minmax(0,1fr);font-size:13px}.page-heading{padding-block:30px}.page-heading h1{font-size:34px}.page-heading p{font-size:14px}.guide-content h2{font-size:27px}.term-list{grid-template-columns:95px minmax(0,1fr);font-size:12px}.filters{gap:8px}.filters button{padding-inline:14px;font-size:12px}.lightbox{padding:14px}.lightbox-head p{font-size:12px}.lightbox button{padding-inline:10px;font-size:12px}.lightbox-controls{gap:8px}.brand{font-size:14px}.mast-row{gap:8px}.mast-row>.btn{padding-inline:10px;font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

button:active{transform:translateY(2px)}button:disabled{opacity:.5;cursor:not-allowed}button[data-state=loading]{cursor:progress}button[data-state=error]{border-color:var(--color-error)}button[data-state=success]{border-color:var(--color-success)}summary:active,a:active{opacity:.85}
