/* Hallmark · macrostructure: Narrative Workflow / home-and-abyss journal · tone: warm handmade · theme: custom midnight paper · nav: N7 · footer: Ft1
 * paper: oklch(95.8% .012 80) · accent: oklch(76.2% .133 91) · display: Songti SC roman · body: PingFang SC
 * axes: light paper on wine / roman serif with monospace annotations / warm gold · audience: Chinese game readers · action: download landing */
/* Hallmark · pre-emit critique: P4 H4 E4 S5 R5 V4 */
@import url('tokens.css');
*{box-sizing:border-box}html,body{margin:0;overflow-x:clip}html{scroll-behavior:smooth;scroll-padding-top:var(--space-120)}body{font:var(--text-base)/1.85 var(--font-body);color:var(--color-ink);background:var(--color-wine);padding-bottom:0}::selection{background:var(--color-gold);color:var(--color-night)}a{color:inherit;text-underline-offset:5px}a:hover{text-decoration-thickness:2px}button{font:inherit;cursor:pointer}a,button,summary{touch-action:manipulation}button,a,summary{min-height:44px}button{color:inherit}img{max-width:100%;height:auto;display:block}figure{margin:0}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);margin:var(--space-md) 0}h2{font-size:clamp(25px,3vw,36px);margin:0 0 var(--space-lg)}h3{font-size:23px;margin:0 0 var(--space-sm)}p{margin:0 0 var(--space-md)}section[id],h2[id],h3[id]{scroll-margin-top:var(--space-120)}:focus-visible{outline:3px solid var(--color-focus);outline-offset:5px}.skip{position:fixed;top:-80px;left:16px;z-index:100;background:var(--color-paper);padding:var(--space-12)}.skip:focus{top:12px}.site-header{position:sticky;top:0;z-index:20;background:var(--color-night);color:var(--color-paper);border-bottom:2px solid var(--color-gold)}.nav-inner{max-width:1120px;margin:auto;padding:var(--space-12) var(--space-24);display:flex;gap:var(--space-24);align-items:center}.brand{text-decoration:none;display:flex;align-items:center;gap:var(--space-8);white-space:nowrap;font-weight:700}.brand img{width:35px;height:35px}.brand small{font:11px var(--font-label);display:block;color:var(--color-gold);letter-spacing:.12em}.links{display:flex;gap:var(--space-20);margin-left:auto;align-items:center}.links a{display:inline-flex;align-items:center;text-decoration:none;font-size:14px;white-space:nowrap}.links a[aria-current=page]{color:var(--color-gold);border-bottom:1px solid var(--color-gold)}.btn{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-12);padding:var(--space-12) var(--space-24);background:var(--color-gold);color:var(--color-night);border:1px solid var(--color-night);box-shadow:4px 4px 0 var(--color-night);font-weight:700;text-decoration:none;white-space:nowrap;transition:transform var(--dur-short) var(--ease-out)}.btn.secondary{background:var(--color-paper);color:var(--color-ink)}.btn.small{padding:var(--space-8) var(--space-12);font-size:13px;box-shadow:none}.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--color-night)}@media(hover:hover){.btn:hover{transform:translate(-1px,-2px)}.links a:hover{color:var(--color-gold)}.image-link:hover img{opacity:.92}.filter:hover{background:var(--color-paper-dark)}}.actions{display:flex;flex-wrap:wrap;gap:var(--space-16);margin-top:var(--space-24)}.shell{max-width:1120px;margin:0 auto;background:var(--color-paper);box-shadow:12px 0 0 var(--color-overlay),-12px 0 0 var(--color-overlay)}.hero{min-height:690px;height:calc(100svh - 77px);max-height:900px;position:relative;display:flex;align-items:flex-end;color:var(--color-paper);isolation:isolate;background:var(--color-night)}.hero-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center;z-index:-2}.hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--color-shade) 0%,var(--color-overlay) 75%,var(--color-clear))}.hero-content{padding:var(--space-60) var(--space-60) var(--space-44);max-width:830px}.eyebrow{font:12px/1.5 var(--font-label);letter-spacing:.13em;text-transform:uppercase;margin-bottom:var(--space-16)}.hero .eyebrow{color:var(--color-gold)}.hero h1{font-weight:700;letter-spacing:.01em;text-shadow:0 2px 10px var(--color-night)}.hero h1 .original{display:block;font:14px/1.6 var(--font-body);letter-spacing:0;margin-top:var(--space-16);overflow-wrap:anywhere}.hero p{max-width:520px;color:var(--color-paper)}.hero .btn.secondary{background:var(--color-night);color:var(--color-paper);border-color:var(--color-rule)}.hero-meta{display:flex;gap:var(--space-8);flex-wrap:wrap;margin-top:var(--space-24);font-size:12px;color:var(--color-light-muted)}.hero-meta span{border:1px solid var(--color-light-muted);padding:var(--space-1) var(--space-8)}.hero-note{position:absolute;right:35px;top:30px;background:var(--color-paper);color:var(--color-wine);transform:rotate(3deg);padding:var(--space-8) var(--space-16);font:15px var(--font-display);box-shadow:3px 3px 0 var(--color-night)}.paper-section{padding:var(--space-56) var(--space-60);border-bottom:1px solid var(--color-rule)}.section-kicker{color:var(--color-wine);font:12px var(--font-body);letter-spacing:.08em;margin-bottom:var(--space-12)}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-24)}.section-heading a{font-size:14px;white-space:nowrap}.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-20) var(--space-28);margin:var(--space-28) 0 0}.facts div{border-top:1px solid var(--color-rule);padding-top:var(--space-12)}.facts dt{font-size:12px;color:var(--color-muted)}.facts dd{margin:var(--space-3) 0 0;font-weight:600;font-size:15px}.notice{margin-top:var(--space-24);padding-left:var(--space-16);border-left:3px solid var(--color-wine);font-size:14px;color:var(--color-muted)}.prose{max-width:680px}.story-opening{font:25px/1.7 var(--font-display);color:var(--color-wine);margin-bottom:var(--space-24)}.stage{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:var(--space-40);align-items:center;padding:var(--space-32) 0}.stage+.stage{border-top:1px dashed var(--color-rule)}.stage.reverse .stage-copy{order:2}.stage-label{font:12px var(--font-body);color:var(--color-wine);margin-bottom:var(--space-8)}.stage p{font-size:15px;color:var(--color-muted)}figcaption{font-size:12px;color:var(--color-muted);padding:var(--space-8) 0}.image-link{display:block;position:relative}.image-link img{width:100%;aspect-ratio:16/9;object-fit:contain;background:var(--color-night)}.image-link:after{content:'查看大图 ↗';position:absolute;bottom:10px;right:10px;background:var(--color-night);color:var(--color-paper);padding:var(--space-3) var(--space-8);font-size:11px;opacity:0;transition:opacity var(--dur-short) var(--ease-out)}.image-link:hover:after,.image-link:focus-visible:after{opacity:1}.mio-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);background:var(--color-night);color:var(--color-paper);gap:var(--space-32);align-items:center;padding:var(--space-32);margin:var(--space-20) 0}.mio-band p{color:var(--color-light-muted);font-size:15px}.mio-band figcaption{color:var(--color-light-muted)}.thumb-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-12);margin-top:var(--space-16)}.thumb-row figcaption{padding:var(--space-8) 0}.download-ticket{border:1px solid var(--color-ink);padding:var(--space-32);box-shadow:6px 6px 0 var(--color-paper-dark);background:var(--color-paper);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-20);align-items:center}.download-ticket p{color:var(--color-muted);font-size:14px;margin:var(--space-8) 0 0}.platform{font:12px var(--font-body);letter-spacing:.07em;color:var(--color-wine)}.fit-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-32)}.fit-list article{border-top:2px solid var(--color-wine);padding-top:var(--space-20)}.fit-list p{font-size:15px;color:var(--color-muted)}details{border-top:1px solid var(--color-rule);padding:var(--space-16) 0}details:last-child{border-bottom:1px solid var(--color-rule)}summary{font-weight:600;cursor:pointer;padding:var(--space-8) var(--space-32) var(--space-8) 0;min-height:44px}details p,details ul{margin:var(--space-12) 0 var(--space-8);color:var(--color-muted);font-size:15px}details[open] summary{color:var(--color-wine)}.final-cta{background:var(--color-night);color:var(--color-paper);padding:var(--space-48) var(--space-60);display:flex;gap:var(--space-36);justify-content:space-between;align-items:center}.final-cta p{color:var(--color-light-muted);font-size:14px}.final-cta h2{font-size:28px;margin-bottom:var(--space-12)}.final-cta small{font-size:12px;color:var(--color-light-muted)}.site-footer{max-width:1120px;margin:auto;padding:var(--space-48) var(--space-60) var(--space-60);background:var(--color-night);color:var(--color-light-muted);font-size:12px;border-top:1px solid var(--color-gold)}.footer-top{display:flex;justify-content:space-between;gap:var(--space-32)}.footer-brand{font:24px var(--font-display);color:var(--color-paper);margin-bottom:var(--space-12)}.footer-links,.related{display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-20)}.footer-links a,.related a{display:inline-flex;align-items:center;white-space:nowrap;min-height:44px}.related{border-top:1px solid var(--color-muted);padding-top:var(--space-16);margin-top:var(--space-20)}.legal{padding-top:var(--space-20)}.legal p{margin-bottom:var(--space-8);max-width:760px}.footer-end{display:flex;justify-content:space-between;gap:var(--space-20);margin-top:var(--space-24)}.footer-end a{white-space:nowrap}.mobile-cta{display:none}.page-intro{padding:var(--space-44) var(--space-60) var(--space-40);background:var(--color-paper-dark);border-bottom:1px solid var(--color-rule)}.breadcrumbs{display:flex;gap:var(--space-12);align-items:center;font-size:12px;color:var(--color-muted);margin-bottom:var(--space-24);flex-wrap:wrap}.breadcrumbs a{display:inline-flex;align-items:center;white-space:nowrap}.page-intro h1{font-size:clamp(30px,4vw,45px)}.page-intro p{max-width:680px;color:var(--color-muted)}.page-title-name{font-size:15px;color:var(--color-wine);margin-bottom:var(--space-8)}.filters{display:none;flex-wrap:wrap;gap:var(--space-8);margin-bottom:var(--space-28)}.js .filters{display:flex}.filter{background:var(--color-paper);border:1px solid var(--color-rule);padding:var(--space-8) var(--space-16);white-space:nowrap}.filter[aria-pressed=true]{background:var(--color-wine);color:var(--color-paper);border-color:var(--color-wine)}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-28) var(--space-16)}.gallery-grid figure[hidden]{display:none}.toc{display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-16);padding:var(--space-16) 0;border-top:1px solid var(--color-rule);margin-top:var(--space-24)}.toc a{display:inline-flex;align-items:center;font-size:14px;white-space:nowrap}.guide-part{margin:0 0 var(--space-44)}.guide-part ol{padding-left:var(--space-24)}.guide-part li{padding:var(--space-4) 0}.guide-part figure{margin:var(--space-24) 0}.guide-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-20);margin-bottom:var(--space-44)}.guide-card{border:1px solid var(--color-rule);padding:var(--space-24)}.guide-card p{font-size:14px;color:var(--color-muted)}.guide-card a{display:inline-flex;align-items:center;white-space:nowrap;font-weight:600;font-size:14px}.requirements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-32)}.requirements dl{margin:0}.requirements dl div{padding:var(--space-8) 0;border-bottom:1px solid var(--color-rule)}.requirements dt{font-size:12px;color:var(--color-muted)}.requirements dd{margin:var(--space-3) 0;font-size:14px;overflow-wrap:anywhere}.update-item{border-left:2px solid var(--color-wine);padding:0 0 var(--space-16) var(--space-24)}.update-item time{font:12px var(--font-body);color:var(--color-muted)}.update-item h3{font-size:22px;margin:var(--space-8) 0}.update-item p{font-size:15px}.reading-next{border-top:1px solid var(--color-rule);padding-top:var(--space-20);margin-top:var(--space-36)}.lightbox{border:1px solid var(--color-rule);background:var(--color-night);color:var(--color-paper);width:min(1150px,94vw);max-height:92svh;padding:var(--space-16)}.lightbox::backdrop{background:var(--color-shade)}.lightbox-toolbar{display:flex;justify-content:space-between;gap:var(--space-8);align-items:center}.lightbox-toolbar button,.lightbox-controls button{background:var(--color-night);color:var(--color-paper);border:1px solid var(--color-rule);min-width:44px;min-height:44px;padding:var(--space-8) var(--space-12)}.lightbox img{width:100%;height:min(65svh,660px);object-fit:contain;margin:var(--space-12) 0}.lightbox-controls{display:flex;align-items:center;justify-content:space-between;gap:var(--space-12)}.lightbox-caption{font-size:13px;color:var(--color-light-muted)}.lightbox-status{font-size:13px;min-height:24px;margin:var(--space-8) 0}.lightbox[data-state=error] .lightbox-status{color:var(--color-error)}.lightbox[data-state=loading] img{opacity:.3}.lightbox[data-state=success] .lightbox-caption{border-left:2px solid var(--color-success);padding-left:var(--space-8)}[aria-disabled=true],button:disabled{opacity:.5;cursor:not-allowed}[data-state=loading]{cursor:progress}[data-state=error]{border-color:var(--color-error)}[data-state=success]{--state-color:var(--color-success)}
@media(max-width:900px){.nav-inner{gap:var(--space-16)}.links{gap:var(--space-16)}.nav-inner>.btn{display:none}.hero-content{padding:var(--space-44) var(--space-40)}.paper-section,.page-intro{padding:var(--space-40) var(--space-36)}.hero{min-height:660px}.facts{grid-template-columns:repeat(3,minmax(0,1fr))}.stage{gap:var(--space-24)}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.site-footer,.final-cta{padding:var(--space-40) var(--space-36)}.download-ticket{grid-template-columns:minmax(0,1fr)}.final-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){html{scroll-padding-top:var(--space-128)}body{padding-bottom:var(--space-80)}.nav-inner{padding:var(--space-8) var(--space-16) var(--space-8);flex-wrap:wrap;gap:var(--space-4)}.brand img{width:28px;height:28px}.brand{font-size:14px;min-height:44px}.brand small{display:none}.links{width:100%;margin:0;gap:0;justify-content:space-between}.links a{font-size:13px;min-height:44px}.shell{box-shadow:none}.hero{height:calc(100svh - 160px);min-height:520px;max-height:650px}.hero-scene{object-position:62% center}.hero-content{padding:var(--space-32) var(--space-24) var(--space-32)}.hero h1{font-size:32px;max-width:360px}.hero h1 .original{font-size:11px;max-width:270px}.hero p{font-size:14px;max-width:330px}.hero-meta{gap:var(--space-8)}.hero-note{top:22px;right:20px;font-size:12px}.hero .actions{gap:var(--space-12)}.btn{font-size:14px;padding:var(--space-12) var(--space-16)}.paper-section,.page-intro{padding:var(--space-36) var(--space-24)}.section-heading{display:block}.section-heading a{display:inline-flex;align-items:center;margin-bottom:var(--space-16)}.facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-16)}.facts dd{font-size:13px}.story-opening{font-size:22px}.stage,.mio-band{grid-template-columns:minmax(0,1fr);gap:var(--space-20)}.stage.reverse .stage-copy{order:0}.stage{padding:var(--space-24) 0}.mio-band{padding:var(--space-24);margin:var(--space-8) -var(--space-4)}.mio-band h3{font-size:26px}.thumb-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-12)}.download-ticket{padding:var(--space-24)}.fit-list,.requirements,.guide-card-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-24)}.gallery-grid{grid-template-columns:minmax(0,1fr)}.footer-top{display:block}.site-footer,.final-cta{padding:var(--space-32) var(--space-24)}.footer-end{flex-wrap:wrap}.mobile-cta{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:30;align-items:center;justify-content:space-between;gap:var(--space-8);padding:var(--space-8) var(--space-16) calc(var(--space-8) + env(safe-area-inset-bottom));background:var(--color-night);color:var(--color-paper);border-top:1px solid var(--color-gold)}.mobile-cta span{font-size:12px;line-height:1.5}.mobile-cta span small{display:block;font-size:10px;color:var(--color-light-muted)}.mobile-cta .btn{box-shadow:none;padding:var(--space-8) var(--space-16);font-size:13px}.lightbox{padding:var(--space-8)}.lightbox-caption{font-size:12px}.lightbox-controls button{padding:var(--space-8) var(--space-8)}.page-intro h1{font-size:32px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}.btn:hover,.btn:active{transform:none}}

a:active,button:active,summary:active{opacity:.84}button:disabled:active,a[aria-disabled=true]:active{transform:none}

.site-footer .section-kicker{color:var(--color-gold)}:focus-visible{outline-color:var(--color-wine)}.site-header :focus-visible,.hero :focus-visible,.mio-band :focus-visible,.final-cta :focus-visible,.site-footer :focus-visible,.mobile-cta :focus-visible,.lightbox :focus-visible{outline-color:var(--color-paper);box-shadow:0 0 0 5px var(--color-night)}

.mio-band .eyebrow{font-family:var(--font-body)}.actions,.footer-links,.related{align-items:center}

.lightbox-stage:fullscreen{width:100vw;height:100svh;max-height:none;display:flex;flex-direction:column;background:var(--color-night);color:var(--color-paper);padding:var(--space-12)}.lightbox-stage:fullscreen img{flex:1;min-height:0;height:auto}.lightbox-toolbar>div{display:flex;gap:var(--space-8)}
