/* Hallmark · macrostructure: Bento Grid · theme: custom · nav: N7 · footer: Ft1 · honest/chrome/tokens: pass */
/* Hallmark · pre-emit critique: P4 H5 E4 S4 R5 V5
 * macrostructure: Bento Grid · genre: playful · theme: custom · nav: N7 · footer: Ft1
 * axes: light / heavy Chinese sans / yellow · imagery: genuine title and portrait crops
 * User system Chinese fonts and specified industrial palette override catalog font defaults.
 */
:root{--color-paper:oklch(95.6% .015 83);--color-paper-2:oklch(91.4% .017 83);--color-ink:oklch(18.5% .005 248);--color-ink-2:oklch(28% .011 248);--color-muted:oklch(42% .014 248);--color-rule:oklch(72% .015 83);--color-accent:oklch(86.1% .173 91.94);--color-accent-ink:var(--color-ink);--color-red:oklch(57.5% .195 27);--color-pink:oklch(86% .045 350);--color-purple:oklch(85% .038 300);--color-veil:oklch(18.5% .005 248 / .94);--color-scrim:oklch(18.5% .005 248 / .84);--color-dot:oklch(18.5% .005 248 / .11);--color-focus:oklch(48% .18 292);--color-on-dark:var(--color-paper);--color-on-dark-muted:oklch(78% .012 83);--font-display:'PingFang SC','Microsoft YaHei',sans-serif;--font-body:'PingFang SC','Microsoft YaHei',sans-serif;--font-editorial:'Songti SC','STSong',serif;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--gutter:clamp(16px,4vw,48px);--measure:1200px;--text-display:clamp(34px,4.2vw,60px);--radius:2px}
*{box-sizing:border-box}html,body{overflow-x:clip}html{scroll-behavior:smooth;scroll-padding-top:106px}body{margin:0;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body);font-size:16px;line-height:1.75;padding-bottom:108px}a{color:inherit;text-underline-offset:5px}button{font:inherit;color:inherit;cursor:pointer}a,button,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}h1,h2,h3{font-style:normal;line-height:1.22;overflow-wrap:anywhere;min-width:0}h1,h2{font-family:var(--font-display);font-weight:900;letter-spacing:-.04em}h1{font-size:var(--text-display);margin:16px 0 24px}h2{font-size:clamp(26px,3vw,40px);margin:0 0 20px}h3{font-size:20px;margin:0 0 12px}p{margin:0 0 16px}img{max-width:100%;height:auto;display:block}figure{margin:0}ul,ol{padding-left:24px}section[id]{scroll-margin-top:106px}.wrap{max-width:var(--measure);margin-inline:auto;padding-inline:var(--gutter)}.skip{position:fixed;top:-120px;left:16px;z-index:20;padding:12px;background:var(--color-accent);color:var(--color-ink)}.skip:focus{top:8px}.nav-slab{position:sticky;top:0;z-index:10;background:var(--color-ink);color:var(--color-paper);border-bottom:3px solid var(--color-accent)}.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:80px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:800;white-space:nowrap;font-size:15px}.brand img{width:36px;height:36px;border:1px solid var(--color-rule)}.desktop-nav{display:none;align-items:center;gap:8px}.desktop-nav a,.foot-links a,.related a,.crumb a,.rail a,.toc a{white-space:nowrap;display:inline-flex;align-items:center;min-height:44px;text-decoration:none}.desktop-nav a{padding:8px 12px;font-size:14px}.desktop-nav a[aria-current=page]{background:var(--color-ink-2);color:var(--color-accent)}.menu{position:relative}.menu summary{cursor:pointer;min-height:44px;padding:8px 12px;border:1px solid var(--color-rule);list-style:none;white-space:nowrap}.menu summary::-webkit-details-marker{display:none}.menu[open] nav{position:absolute;right:0;top:54px;width:208px;display:grid;padding:16px;background:var(--color-ink);color:var(--color-paper);border:1px solid var(--color-rule)}.menu nav a{padding:10px 8px;min-height:44px;text-decoration:none;white-space:nowrap}.button,.filter,.dialog-button{display:inline-flex;justify-content:center;align-items:center;min-height:48px;padding:12px 24px;border:2px solid var(--color-ink);background:var(--color-paper);color:var(--color-ink);box-shadow:3px 4px 0 var(--color-ink);font-weight:800;font-size:15px;line-height:1.4;white-space:nowrap;text-decoration:none;border-radius:var(--radius);transition:transform 100ms,box-shadow 100ms}.button.primary{background:var(--color-accent);color:var(--color-accent-ink)}.button:active,.filter:active,.dialog-button:active{transform:translateY(2px);box-shadow:3px 2px 0 var(--color-ink)}[aria-disabled=true],button:disabled{opacity:.5;cursor:not-allowed}.button[data-state=loading],button[data-state=loading]{cursor:progress}.button[data-state=error],button[data-state=error]{border-color:var(--color-red)}.button[data-state=success],button[data-state=success]{border-color:var(--color-ink)}.actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:24px}.muted{color:var(--color-muted)}.small{font-size:14px}.label{display:inline-block;padding:4px 12px;background:var(--color-ink);color:var(--color-paper);font-size:13px;font-weight:700}.tag-row{display:flex;gap:8px;flex-wrap:wrap}.tag-row span{padding:4px 10px;border:1px solid var(--color-rule);font-size:13px}.tag-row span:first-child{background:var(--color-pink);color:var(--color-ink)}.hero{padding-block:32px 44px}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}.hero-copy{padding:28px;background:var(--color-paper);border:2px solid var(--color-ink);position:relative}.hero-copy:before{content:'';position:absolute;right:16px;top:16px;width:32px;height:32px;border-top:3px solid var(--color-ink);border-right:3px solid var(--color-ink)}.hero-copy h1 .original{display:block;font-size:15px;font-weight:500;letter-spacing:0;line-height:1.6;margin-top:16px}.hero-copy p{max-width:36em}.scene-board{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;min-height:388px;padding:28px;background:var(--color-ink);color:var(--color-paper);border:2px solid var(--color-ink)}.scene-title{background:var(--color-paper-2);color:var(--color-ink);padding:12px;max-width:100%;transform:rotate(-3deg)}.scene-title img{width:355px;height:auto}.portrait-pair{display:flex;align-items:center;gap:24px}.portrait-frame{padding:8px;background:var(--color-paper);color:var(--color-ink);transform:rotate(3deg);border:1px solid var(--color-ink)}.portrait-frame img{width:156px;height:142px}.portrait-pair .side-type{font-family:var(--font-editorial);font-size:24px;line-height:1.5;letter-spacing:.08em}.board-caption{font-size:13px;color:var(--color-on-dark-muted);margin:0}.rail{display:none}.bento{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin:0 auto 64px}.tile{border:2px solid var(--color-ink);padding:28px;min-width:0}.tile.dark{background:var(--color-ink);color:var(--color-paper)}.tile.dark p,.tile.dark .small{color:var(--color-on-dark-muted)}.tile h2{font-size:28px}.title-row{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px;margin-bottom:20px}.title-row h2{margin:0}.tile-number{font-weight:900;font-size:96px;line-height:1;color:var(--color-paper);letter-spacing:-.08em}.specs{margin:0;display:grid;grid-template-columns:minmax(0,1fr)}.specs div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--color-rule);padding:12px 0}.specs dt{font-size:14px;color:var(--color-muted)}.specs dd{margin:0;font-weight:700;text-align:right}.editorial{font-family:var(--font-editorial);font-size:25px;line-height:1.65;max-width:28em}.media-shelf{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}.media-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--color-rule);background:var(--color-paper-2);color:var(--color-ink)}.media-link{display:flex;align-items:center;justify-content:center;min-height:218px;padding:24px;position:relative;background-image:radial-gradient(var(--color-dot) 1px,transparent 1px);background-size:6px 6px}.media-link img{width:auto;max-height:154px;object-fit:contain}.media-link:after{content:'查看大图';position:absolute;bottom:8px;right:12px;padding:4px 8px;background:var(--color-ink);color:var(--color-paper);font-size:12px}.media-card figcaption{padding:16px;border-top:1px solid var(--color-rule)}.media-card h3{font-size:18px}.media-card p{font-size:14px;margin:0}.step-list{list-style:none;counter-reset:step;padding:0;margin:20px 0}.step-list li{counter-increment:step;display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;padding:20px 0;border-top:1px solid var(--color-rule)}.step-list li:before{content:counter(step,decimal-leading-zero);font-weight:900;color:var(--color-muted)}.step-list h3{font-size:18px}.step-list p{margin:0}.faq details{border-top:1px solid var(--color-rule);padding:0}.faq summary{cursor:pointer;font-weight:700;min-height:56px;padding:16px 24px 16px 0;position:relative;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';position:absolute;right:0;top:12px;font-size:24px}.faq details[open] summary:after{content:'−'}.faq details p{padding-right:20px}.site-footer{background:var(--color-ink);color:var(--color-paper);padding:48px 0}.footer-mark{font-size:24px;font-weight:900;line-height:1.5;margin:0 0 12px}.site-footer p{color:var(--color-on-dark-muted)}.foot-links,.related{display:flex;gap:4px 24px;flex-wrap:wrap}.related{margin-top:24px;border-top:1px solid var(--color-rule);padding-top:16px;font-size:13px}.legal{font-size:13px;margin-top:24px;max-width:72em}.dock{position:fixed;bottom:0;left:0;right:0;z-index:9;background:var(--color-veil);color:var(--color-paper);border-top:1px solid var(--color-rule);padding:12px var(--gutter) max(12px,env(safe-area-inset-bottom))}.dock-inner{max-width:1104px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.dock-label{font-size:13px}.dock-label strong{display:block;font-size:14px}.dock .button{padding:12px 16px;min-height:44px}.dock-links{display:none}.subhead{padding-block:40px}.subhead h1{font-size:clamp(30px,4vw,48px);max-width:20em}.crumb{font-size:13px;display:flex;align-items:center;flex-wrap:wrap;gap:12px}.sub-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding-bottom:64px}.reading{max-width:74ch}.reading section{padding:28px 0;border-top:2px solid var(--color-ink)}.reading section p{max-width:65ch}.reading h2{font-size:30px}.toc{border:2px solid var(--color-ink);padding:20px;align-self:start}.toc nav{display:grid}.toc a{padding:8px 0;min-height:44px;font-size:14px}.filters{display:none;flex-wrap:wrap;gap:12px;margin:0 0 24px}.js .filters{display:flex}.filter{min-height:44px;box-shadow:none;font-size:14px;padding:8px 16px}.filter[aria-pressed=true]{background:var(--color-purple);color:var(--color-ink)}[hidden]{display:none!important}.gallery-intro{max-width:60ch}.gallery-list{margin-bottom:48px}.image-note{margin-top:16px;max-width:65ch;font-size:14px}.alert{padding:20px;border-left:4px solid var(--color-red);background:var(--color-paper-2);color:var(--color-ink)}dialog{position:fixed;inset:0;margin:auto;width:min(900px,calc(100% - 24px));height:fit-content;max-height:90dvh;border:2px solid var(--color-rule);padding:24px;background:var(--color-ink);color:var(--color-paper)}dialog:not([open]){display:none}dialog::backdrop{background:var(--color-scrim)}.dialog-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}.dialog-toolbar h2{font-size:20px;margin:0}.dialog-button{background:var(--color-paper);color:var(--color-ink);min-height:44px;padding:10px 16px;box-shadow:none}.lightbox-image{margin:auto;max-height:55dvh;max-width:100%;width:auto;height:auto}.dialog-actions{display:flex;gap:12px;justify-content:center;margin-top:20px}.status{min-height:28px;text-align:center;color:var(--color-on-dark-muted);margin:16px 0 0;font-size:14px}dialog[data-state=error] .status{color:var(--color-paper);border:1px solid var(--color-red);padding:12px}
@media(hover:hover){.button:hover,.dialog-button:hover{background:var(--color-paper-2);color:var(--color-ink)}.button.primary:hover{background:var(--color-accent);color:var(--color-accent-ink)}nav a:hover,.foot-links a:hover,.related a:hover{text-decoration:underline}.filter:hover{background:var(--color-paper-2);color:var(--color-ink)}}
@media(min-width:40rem){.hero{padding-block:40px 56px}.hero-copy{padding:40px}.media-shelf{grid-template-columns:repeat(2,minmax(0,1fr))}.bento{grid-template-columns:repeat(2,minmax(0,1fr))}.tile.wide{grid-column:1/-1}.dock-label strong{font-size:16px}.portrait-pair{gap:32px}.scene-board{min-height:416px}}
@media(min-width:60rem){.desktop-nav{display:flex}.menu{display:none}.hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.hero-copy{padding:48px 40px}.scene-board{min-height:520px}.bento{grid-template-columns:repeat(3,minmax(0,1fr))}.tile.wide{grid-column:span 2}.tile.full{grid-column:1/-1}.tile.tall{grid-row:span 2}.rail{display:flex;position:fixed;right:0;top:38%;z-index:7;flex-direction:column;background:var(--color-ink);color:var(--color-paper);border:1px solid var(--color-rule)}.rail a{font-size:12px;padding:8px;writing-mode:horizontal-tb}.sub-grid{grid-template-columns:minmax(0,1fr) 256px}.toc{position:sticky;top:108px}.dock-links{display:flex;gap:24px;font-size:13px}.dock-links a{white-space:nowrap}.reading{max-width:74ch}.title-row{align-items:center}}
@media(max-width:39.99rem){.scene-title,.portrait-frame{transform:none}.portrait-pair{gap:16px}.portrait-pair .side-type{font-size:21px}.hero-copy{padding:24px 20px}.tile{padding:24px 20px}.hero-copy h1{font-size:34px}.scene-board{padding:24px 16px}.dock-label{max-width:112px}.dock-label strong{font-size:13px}.dock-label span{font-size:12px}.dock .button{font-size:13px;padding-inline:12px}.title-row{display:block}.title-row a{margin-top:12px;display:inline-flex}.dialog-toolbar{align-items:start}.dialog-toolbar h2{font-size:16px}.dialog-button{padding:8px 12px}.subhead{padding-block:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
@media(max-width:39.99rem){.brand .small{display:none}.scene-title{padding:8px}.scene-title img{width:355px;max-width:100%}.portrait-pair .side-type{margin:0}.media-link{padding:16px}.hero-copy h1 .original{font-size:13px}.dock-label{max-width:110px}}

nav a:active,.foot-links a:active,.related a:active,.toc a:active{opacity:.75}summary:active{opacity:.75}.actions{align-items:center}.scene-board .side-type{font-style:normal}.hero-copy:before{display:none}
:root{--color-focus-dark:oklch(80% .08 290)}.nav-slab a:focus-visible,.nav-slab summary:focus-visible,.site-footer a:focus-visible,.dock a:focus-visible,.rail a:focus-visible,dialog button:focus-visible,.tile.dark a:focus-visible{outline-color:var(--color-focus-dark)}
@media(max-width:39.99rem){.hero-copy p.editorial{font-size:21px}.hero-copy>p:not(.editorial):not(.small){font-size:15px;line-height:1.7}.tag-row span{padding:4px 8px;font-size:12px}.hero-copy .actions{margin-top:20px}.hero-copy h1{margin-block:16px}.dock-label strong{font-size:12px}}