/* Hallmark · macrostructure: Split Studio · genre: editorial · theme: custom
 * pre-emit critique: P4 H5 E4 S5 R5 V4
 * vibe: 三国军政绘卷 工业操作层 漫画分镜 · nav: N6 · footer: Ft4
 * audience: 策略与叙事游戏玩家 · use: 了解与获取 · motion: button-press only
 * enrichment: E8 official gameplay screenshots · type: Chinese system serif + sans
 */
:root{
 --color-paper:oklch(95.6% .014 85);--color-paper-2:oklch(91.7% .017 82);--color-paper-3:oklch(88.3% .022 81);
 --color-ink:oklch(18.5% .005 250);--color-ink-2:oklch(24% .007 250);--color-muted:oklch(45% .012 250);
 --color-dark-muted:oklch(77% .012 85);--color-rule:oklch(78% .014 80);--color-dark-rule:oklch(37% .013 250);
 --color-accent:oklch(86.7% .174 90);--color-accent-ink:var(--color-ink);--color-red:oklch(49.8% .167 27);--color-error:oklch(61% .22 27);--color-success:oklch(66% .12 145);
 --color-focus:oklch(55% .14 245);--color-overlay:oklch(14% .005 250 / .92);--color-clear:oklch(0% 0 0 / 0);
 --font-display:"Songti SC","STSong","Noto Serif CJK SC",serif;--font-body:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
 --space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:80px;--space-2xl-wide:64px;
 --ease-out:cubic-bezier(.2,.8,.2,1);--ease-in:cubic-bezier(.4,0,1,1);--ease-in-out:cubic-bezier(.4,0,.2,1);
 --gutter:clamp(20px,4vw,64px);--header-height:114px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + var(--space-lg));overflow-x:clip}body{margin:0;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);line-height:1.8;overflow-x:clip;padding-bottom:var(--space-3xl)}button,input{font:inherit}button,a{-webkit-tap-highlight-color:var(--color-clear)}a{color:inherit;text-decoration-thickness:1px;text-underline-offset:5px}button{cursor:pointer}img{display:block;max-width:100%;height:auto}h1,h2,h3{font-style:normal;line-height:1.3;overflow-wrap:anywhere;min-width:0}h1,h2{font-family:var(--font-display)}h1{font-size:clamp(38px,4.9vw,76px);font-weight:900;letter-spacing:-.025em;margin:var(--space-lg) 0}h2{font-size:clamp(29px,3vw,44px);margin:0 0 var(--space-lg)}h3{font-size:20px;margin:0 0 var(--space-sm)}p{margin:0 0 var(--space-md)}figure{margin:0}section[id]{scroll-margin-top:calc(var(--header-height) + var(--space-lg))}:focus-visible{outline:3px solid var(--color-focus);outline-offset:5px}::selection{background:var(--color-accent);color:var(--color-ink)}[hidden]{display:none!important}.wrap{max-width:1440px;margin-inline:auto;padding-inline:var(--gutter)}.skip{position:fixed;top:0;left:20px;z-index:100;background:var(--color-accent);color:var(--color-ink);padding:var(--space-sm) var(--space-md);transform:translateY(-140%)}.skip:focus{transform:none}
.masthead{position:sticky;top:0;z-index:30;background:var(--color-ink);color:var(--color-paper);border-bottom:4px double var(--color-dark-rule)}.mast-top{position:relative;display:flex;justify-content:center;align-items:center;min-height:58px}.brand{font-family:var(--font-display);font-size:24px;letter-spacing:.09em;text-decoration:none;font-weight:800;white-space:nowrap}.brand .seal{display:inline-grid;place-items:center;width:30px;height:30px;background:var(--color-red);color:var(--color-paper);font-size:20px;margin-right:var(--space-sm);letter-spacing:0;border:1px solid var(--color-paper)}.mast-side{display:none;position:absolute;left:var(--gutter);font-size:11px;letter-spacing:.08em;color:var(--color-dark-muted)}.mast-note{display:none;position:absolute;right:var(--gutter);font-size:11px;color:var(--color-dark-muted)}.nav{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;column-gap:var(--space-lg);min-height:50px}.nav a{font-size:13px;text-decoration:none;padding:var(--space-sm) 0;min-height:44px;white-space:nowrap;border-bottom:2px solid var(--color-clear)}.nav a[aria-current=page]{border-bottom-color:var(--color-accent);color:var(--color-accent)}.nav .nav-cta{color:var(--color-accent)}.nav a:hover{color:var(--color-accent)}
.dark{background:var(--color-ink);color:var(--color-paper)}.hero{padding-block:var(--space-xl) var(--space-2xl)}.hero-grid{display:grid;gap:var(--space-xl);align-items:center}.eyebrow{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap;font-size:12px;color:var(--color-dark-muted);letter-spacing:.08em}.eyebrow .stamp{padding:var(--space-xs) var(--space-sm);color:var(--color-accent);border:1px solid var(--color-dark-rule);white-space:nowrap}.hero h1{margin:var(--space-md) 0 var(--space-md)}.hero h1 span{color:var(--color-accent)}.original{font-size:12px;letter-spacing:.03em;color:var(--color-dark-muted);line-height:1.6;max-width:40ch}.lead{font-size:17px;line-height:1.9;margin-top:var(--space-lg);max-width:32em;color:var(--color-dark-muted)}.tags{display:flex;gap:var(--space-sm);flex-wrap:wrap;margin:var(--space-lg) 0}.tag{font-size:12px;line-height:1;padding:var(--space-sm) var(--space-sm);border:1px solid var(--color-dark-rule);color:var(--color-paper)}.actions{display:flex;gap:var(--space-md);flex-wrap:wrap;align-items:center}.btn{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);min-height:50px;text-decoration:none;border:1px solid var(--color-rule);background:var(--color-paper);color:var(--color-ink);font-size:14px;font-weight:700;white-space:nowrap;box-shadow:3px 4px 0 var(--color-dark-rule);transition:transform 90ms var(--ease-out)}.btn.primary{background:var(--color-accent);color:var(--color-accent-ink);border-color:var(--color-accent)}.btn.ghost{background:var(--color-clear);color:var(--color-paper);border-color:var(--color-dark-rule);box-shadow:none}.btn:hover{border-color:var(--color-accent)}.btn:active{transform:translateY(2px);box-shadow:3px 2px 0 var(--color-dark-rule)}.btn[aria-disabled=true],button:disabled{opacity:.5;cursor:not-allowed}.btn[data-state=loading]{opacity:.7}.btn[data-state=error]{border-color:var(--color-error)}.btn[data-state=success]{border-color:var(--color-success)}.arrow{font-size:20px;line-height:1}.fine{font-size:12px;line-height:1.8;color:var(--color-muted)}.dark .fine{color:var(--color-dark-muted)}.hero .fine{margin:var(--space-md) 0 0;max-width:36em}.hero-media{min-width:0}.media-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);font-size:11px;letter-spacing:.07em;color:var(--color-dark-muted);padding-bottom:var(--space-sm)}.media-top b{font-weight:500;color:var(--color-accent)}.main-shot{display:block;border:1px solid var(--color-dark-rule);background:var(--color-ink-2)}.main-shot img{width:100%;aspect-ratio:16/9;object-fit:contain}.shot-caption{display:flex;justify-content:space-between;gap:var(--space-md);padding:var(--space-sm) 0;font-size:12px;color:var(--color-dark-muted)}.shot-caption span:last-child{color:var(--color-accent);white-space:nowrap}.thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-sm)}.thumbs a{position:relative;border:1px solid var(--color-dark-rule);display:block}.thumbs img{width:100%;aspect-ratio:16/9;object-fit:contain}.thumbs a:hover{outline:2px solid var(--color-accent);outline-offset:2px}.hero-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg);margin-top:var(--space-xl);padding-top:var(--space-lg);border-top:1px solid var(--color-dark-rule)}.hero-facts div{display:flex;align-items:baseline;gap:var(--space-sm)}.hero-facts strong{font-family:var(--font-display);font-size:32px;font-weight:700}.hero-facts span{font-size:12px;color:var(--color-dark-muted)}
.section{padding-block:var(--space-2xl-wide)}.spec-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg) var(--space-md);padding-block:var(--space-lg);border-bottom:1px solid var(--color-rule)}.spec-strip dt{font-size:11px;color:var(--color-muted);margin-bottom:var(--space-sm)}.spec-strip dd{margin:0;font-size:14px;font-weight:600}.split{display:grid;gap:var(--space-xl);align-items:center}.prose{max-width:65ch}.prose p{color:var(--color-muted)}.prose a{font-size:14px;min-height:44px;display:inline-flex;align-items:center}.paper-title{display:flex;align-items:flex-start;gap:var(--space-md)}.paper-seal{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--color-red);color:var(--color-paper);font-family:var(--font-display);writing-mode:vertical-rl;letter-spacing:.2em;padding:var(--space-sm) var(--space-sm);font-size:15px;line-height:1.2;border:3px double var(--color-paper);min-height:65px}.photo-frame{border:1px solid var(--color-rule);padding:var(--space-sm);background:var(--color-paper-2);color:var(--color-ink)}.photo-frame img{width:100%;aspect-ratio:16/9;object-fit:contain}.photo-frame figcaption{font-size:12px;color:var(--color-muted);padding:var(--space-sm) var(--space-sm) var(--space-xs)}.story{background:var(--color-paper-2);color:var(--color-ink)}.story .prose .story-line{font-size:25px;font-family:var(--font-display);color:var(--color-ink);line-height:1.6;border-left:3px solid var(--color-red);padding-left:var(--space-lg);margin-block:var(--space-lg)}.mechanics{padding-top:var(--space-2xl)}.mechanic-list{display:grid;gap:var(--space-md)}.mechanic-item{padding:var(--space-md) 0;border-bottom:1px solid var(--color-rule)}.mechanic-item:first-child{padding-top:0}.mechanic-item h3{font-family:var(--font-display);font-size:24px}.mechanic-item p{font-size:14px;color:var(--color-muted);margin:0}.links-strip{display:grid;gap:0;border-top:1px solid var(--color-rule);border-bottom:1px solid var(--color-rule)}.link-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-sm);text-decoration:none;padding:var(--space-lg) var(--space-lg);align-items:center;border-bottom:1px solid var(--color-rule)}.link-panel:last-child{border-bottom:0}.link-panel h3{font-family:var(--font-display);font-size:25px}.link-panel p{color:var(--color-muted);font-size:13px;margin:0}.link-panel:hover{background:var(--color-paper-2);color:var(--color-ink)}.link-panel .go{font-size:24px}.faq-layout{display:grid;gap:var(--space-lg)}.faq{border-top:1px solid var(--color-rule)}.faq details{border-bottom:1px solid var(--color-rule)}.faq summary{font-weight:600;cursor:pointer;padding:var(--space-md) var(--space-lg) var(--space-md) 0;line-height:1.6;min-height:54px}.faq details p{font-size:14px;color:var(--color-muted);padding-bottom:var(--space-md);margin:0}.release-banner{display:grid;gap:var(--space-md);padding:var(--space-xl);background:var(--color-ink);color:var(--color-paper);border-top:2px solid var(--color-dark-rule)}.release-banner h3{font-size:25px;font-family:var(--font-display)}.release-banner p{font-size:14px;color:var(--color-dark-muted);margin:0}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-lg);margin-bottom:var(--space-xl)}.section-head h2{margin:0}.section-head p{font-size:13px;color:var(--color-muted);margin:0}.section-head a{font-size:13px;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}.foot{background:var(--color-ink);color:var(--color-paper);padding-block:var(--space-xl) var(--space-xl);border-top:4px double var(--color-dark-rule)}.foot-heading{font-family:var(--font-display);font-size:30px;font-weight:700;margin-bottom:var(--space-md)}.foot-links{display:flex;gap:var(--space-xs) var(--space-lg);flex-wrap:wrap;font-size:12px;margin:var(--space-sm) 0 var(--space-lg)}.foot-links a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;text-decoration:none;color:var(--color-dark-muted)}.foot-links a:hover{color:var(--color-accent)}.foot p{font-size:12px;color:var(--color-dark-muted);max-width:80ch;margin-bottom:var(--space-sm)}.foot-label{color:var(--color-accent);font-size:11px}.fixed-bar{position:fixed;bottom:0;left:0;right:0;z-index:25;background:var(--color-overlay);color:var(--color-paper);border-top:1px solid var(--color-dark-rule);backdrop-filter:blur(10px);padding-bottom:env(safe-area-inset-bottom)}.fixed-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding-block:var(--space-sm)}.nameplate{font-family:var(--font-display);border:1px solid var(--color-dark-rule);padding:var(--space-sm) var(--space-md);font-size:14px;white-space:nowrap}.fixed-text{font-size:13px;color:var(--color-dark-muted);flex:1}.fixed-bar .btn{min-height:44px;padding:var(--space-sm) var(--space-md);font-size:13px}.fixed-back{display:none;font-size:12px;text-decoration:none;white-space:nowrap}
.breadcrumb{display:flex;gap:var(--space-sm);align-items:center;font-size:12px;color:var(--color-muted);padding-block:var(--space-md);flex-wrap:wrap}.breadcrumb a{white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}.page-head{padding-block:var(--space-md) var(--space-2xl)}.page-head h1{font-size:clamp(35px,4.4vw,62px);margin:var(--space-sm) 0 var(--space-lg);max-width:22ch}.page-head p{max-width:65ch;color:var(--color-muted);margin:0}.page-label{color:var(--color-red);font-size:12px}.page-body{padding-bottom:var(--space-2xl-wide)}.filters{display:none;gap:var(--space-sm);flex-wrap:wrap;margin-bottom:var(--space-lg)}.js .filters{display:flex}.filter{min-height:44px;padding:var(--space-sm) var(--space-md);background:var(--color-clear);color:var(--color-ink);border:1px solid var(--color-rule);white-space:nowrap}.filter[aria-pressed=true]{background:var(--color-ink);color:var(--color-paper);border-color:var(--color-ink)}.filter:hover{border-color:var(--color-red)}.gallery-grid{display:grid;gap:var(--space-xl) var(--space-lg)}.gallery-card{min-width:0}.gallery-card a{display:block;outline-offset:4px}.gallery-card img{width:100%;aspect-ratio:16/9;border:1px solid var(--color-rule);object-fit:contain}.gallery-card a:hover{outline:2px solid var(--color-red)}.gallery-card figcaption{display:flex;justify-content:space-between;gap:var(--space-md);font-size:13px;padding-top:var(--space-sm)}.gallery-card figcaption small{color:var(--color-muted);white-space:nowrap}.filter-status{font-size:12px;color:var(--color-muted);margin-bottom:var(--space-md)}.download-layout{display:grid;gap:var(--space-xl);align-items:start}.get-card{background:var(--color-ink);color:var(--color-paper);padding:var(--space-lg)}.get-card img{width:100%;margin-bottom:var(--space-lg)}.get-card h2{font-size:30px}.get-card dl{font-size:13px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-sm) var(--space-md);margin-bottom:var(--space-lg)}.get-card dt{color:var(--color-dark-muted)}.get-card dd{margin:0}.get-card .btn{width:100%}.get-note{font-size:12px;color:var(--color-dark-muted);margin-top:var(--space-md)}.requirements{display:grid;gap:var(--space-md)}.requirement{border-top:3px solid var(--color-ink);padding:var(--space-md);background:var(--color-paper-2);color:var(--color-ink)}.requirement h3{font-family:var(--font-display);font-size:24px}.requirement dl{display:grid;grid-template-columns:auto minmax(0,1fr);font-size:13px;gap:var(--space-sm)}.requirement dt{color:var(--color-muted)}.requirement dd{margin:0;text-align:right}.small-heading{font-size:28px;margin-top:var(--space-2xl)}.steps{padding-left:var(--space-lg)}.steps li{padding-left:var(--space-sm);margin-bottom:var(--space-md)}.steps strong{display:block}.steps span{font-size:14px;color:var(--color-muted)}.guide-layout{display:grid;gap:var(--space-xl);align-items:start}.contents{border-top:3px solid var(--color-red);padding:var(--space-md);background:var(--color-paper-2);color:var(--color-ink)}.contents h2{font-size:22px}.contents a{display:flex;align-items:center;min-height:48px;text-decoration:none;font-size:14px;border-bottom:1px solid var(--color-rule)}.contents a:hover{color:var(--color-red)}.guide-section{margin-bottom:var(--space-2xl)}.guide-section h2{font-size:32px}.guide-section p,.guide-section li{font-size:15px;color:var(--color-muted)}.guide-section figure{margin-top:var(--space-lg)}.guide-section ul,.guide-section ol{padding-left:var(--space-lg)}.callout{border-top:2px solid var(--color-red);padding:var(--space-md) var(--space-lg);background:var(--color-paper-2);color:var(--color-ink);font-size:14px;margin-top:var(--space-lg)}.callout p{margin:0}.guide-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.6}.guide-table th,.guide-table td{padding:var(--space-md) var(--space-sm);border-bottom:1px solid var(--color-rule);text-align:left}.guide-table th{background:var(--color-paper-2);color:var(--color-ink);font-weight:600}.guide-table td{color:var(--color-muted)}
.lightbox{position:fixed;inset:0;margin:auto;width:min(1200px,94%);height:fit-content;max-height:92dvh;padding:var(--space-md);border:1px solid var(--color-dark-rule);background:var(--color-ink);color:var(--color-paper)}.lightbox::backdrop{background:var(--color-overlay)}.lightbox img{width:100%;height:auto;max-height:70dvh;object-fit:contain;background:var(--color-ink-2)}.lightbox-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);padding-bottom:var(--space-md)}.lightbox-head p{margin:0;font-size:13px}.lightbox button{background:var(--color-clear);color:var(--color-paper);border:1px solid var(--color-dark-rule);min-height:44px;min-width:44px;padding:var(--space-sm) var(--space-md);white-space:nowrap}.lightbox button:hover{border-color:var(--color-accent)}.lightbox button:active{transform:translateY(2px)}.lightbox-controls{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);margin-top:var(--space-md)}.lightbox-status{font-size:12px;color:var(--color-dark-muted);margin:0;text-align:center}.lightbox[data-state=error] .lightbox-status{color:var(--color-error)}
@media(min-width:40rem){.mast-side,.mast-note{display:block}.hero{padding-top:var(--space-2xl);padding-bottom:var(--space-2xl-wide)}.spec-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.requirements{grid-template-columns:repeat(2,minmax(0,1fr))}.fixed-back{display:block}.hero-facts{grid-template-columns:repeat(4,minmax(0,1fr))}.fixed-text{display:block}.release-banner{grid-template-columns:minmax(0,1fr) auto;align-items:center}.nav{gap:var(--space-xl)}.brand{font-size:27px}}
@media(min-width:60rem){.hero-grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:var(--space-2xl)}.hero h1{font-size:clamp(52px,4.5vw,72px)}.hero-facts{margin-top:var(--space-2xl)}.section{padding-block:var(--space-3xl)}.split{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2xl-wide)}.split.reverse .prose{order:2}.spec-strip{grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--space-lg)}.faq-layout{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:var(--space-2xl-wide)}.links-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.link-panel{border-bottom:0;border-right:1px solid var(--color-rule)}.link-panel:last-child{border-right:0}.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.download-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--space-2xl-wide)}.get-card{position:sticky;top:calc(var(--header-height) + 24px)}.guide-layout{grid-template-columns:240px minmax(0,1fr);gap:var(--space-2xl-wide);max-width:1180px}.contents{position:sticky;top:calc(var(--header-height) + 24px)}}
@media(max-width:39.999rem){:root{--header-height:114px}.brand{font-size:20px}.brand .seal{width:26px;height:26px;font-size:18px;margin-right:var(--space-xs)}.nav{column-gap:var(--space-sm)}.nav a{font-size:12px}.hero .actions{display:grid;grid-template-columns:minmax(0,1fr)}.hero .actions .btn{width:100%}.hero-grid{gap:var(--space-xl)}.hero h1{font-size:46px}.hero-facts div{flex-direction:column;gap:0}.hero-facts strong{font-size:28px}.lead{font-size:15px}.section{padding-block:var(--space-2xl)}.section-head{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md)}.fixed-text{display:none}.nameplate{font-size:12px;padding:var(--space-sm) var(--space-sm)}.fixed-inner{gap:var(--space-sm)}.fixed-bar .btn{font-size:12px;padding:var(--space-sm) var(--space-sm);gap:var(--space-sm)}.get-card{padding:var(--space-lg)}.requirement dd{text-align:left}.requirements{gap:var(--space-lg)}.gallery-card figcaption{font-size:12px}.guide-table th,.guide-table td{padding:var(--space-sm) var(--space-xs);font-size:12px}.lightbox{padding:var(--space-sm)}.lightbox-head p{font-size:11px}.lightbox button{padding:var(--space-sm) var(--space-sm)}.page-head h1{font-size:36px}.foot-heading{font-size:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.btn:active,.lightbox button:active{transform:none}}

a:active{opacity:.85}button[data-state=loading]{opacity:.7}button[data-state=error]{border-color:var(--color-error)}button[data-state=success]{border-color:var(--color-success)}a[aria-disabled=true]{pointer-events:none;opacity:.5}

.hero h1 .original{display:block;font-family:var(--font-body);font-size:12px;font-weight:400;line-height:1.6;letter-spacing:.03em;color:var(--color-dark-muted);margin-top:var(--space-lg);max-width:45ch}

/* Logo image replaces the prior text seal without changing site structure. */
.brand{display:inline-flex;align-items:center;gap:var(--space-sm);min-height:44px}.brand-mark{display:block;flex:0 0 32px;width:32px;height:32px}.brand .brand-logo{width:32px;height:32px;object-fit:contain}@media(max-width:39.999rem){.brand-mark{flex-basis:28px;width:28px;height:28px}.brand .brand-logo{width:28px;height:28px}}