/* Publishing-studio landing only; account, library and workspace keep their runtime. */
.app:not(.is-workspace):has(.story-cover) { --studio-bg:#f1eee5; --studio-ink:#24231f; --studio-muted:#635e56; --studio-rule:#d3cdc1; --studio-accent:#7c3436; height:auto; min-height:100dvh; display:block; overflow:visible; background:var(--studio-bg)!important; color:var(--studio-ink); }
html[data-theme="dark"] .app:not(.is-workspace):has(.story-cover) { --studio-bg:#22211d; --studio-ink:#f1eee5; --studio-muted:#c0b8ab; --studio-rule:#514b43; --studio-accent:#e4a6a2; }
.app:not(.is-workspace):has(.story-cover)::before,.app:not(.is-workspace):has(.story-cover)::after,.cover.story-cover::before,.cover.story-cover::after,.story-cover .merak-light-transition-wash { display:none!important; }
.app:not(.is-workspace):has(.story-cover) .topbar { width:min(92rem,calc(100% - 7rem)); margin:auto; padding:1.65rem 0; border-bottom:1px solid var(--studio-rule); color:inherit; }
.app:not(.is-workspace):has(.story-cover) .brand { font-size:1.4rem; letter-spacing:.17em; }
.app:not(.is-workspace):has(.story-cover) .brand-glyph { display:none; }
.app:not(.is-workspace):has(.story-cover) .text-button { color:inherit!important; font-size:.95rem; }
.app:not(.is-workspace):has(.story-cover) .account-trigger { color:inherit; background:transparent; box-shadow:none; border-color:var(--studio-rule); }
.app:not(.is-workspace):has(.story-cover) .theme-toggle { color:inherit; border-color:var(--studio-rule); background:transparent; }
.cover.story-cover { display:block; width:100%; height:auto; min-height:calc(100dvh - 5.5rem); max-height:none; padding:0; overflow:clip; background:var(--studio-bg); color:var(--studio-ink); }
.app.is-workspace:has(.story-cover) .cover { display:none; }
.story-shell { width:min(92rem,calc(100% - 7rem)); margin:auto; padding:3.6rem 0 0; }
.story-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:2rem; align-items:center; min-height:min(52rem,calc(100dvh - 10rem)); }
.story-copy { grid-column:1 / span 5; min-width:0; padding:0 0 1rem; }
.story-stage-wrap { grid-column:6 / span 7; min-width:0; }
.story-kicker { margin:0 0 1.8rem; color:var(--studio-accent); font-size:.95rem; line-height:1.5; }
.story-title,.story-process h2,.story-gallery-heading h2,.flow-paper h3,.story-gallery-slide h3,.story-gallery-report h3 { font-family:"Noto Serif SC","Source Han Serif SC","Songti SC","SimSun",serif; }
.story-title { margin:0; font-size:clamp(3.1rem,6.5vw,6.75rem); font-weight:700; letter-spacing:-.065em; line-height:1.23; }
.story-title > span { display:block; white-space:nowrap; }
.story-lead { margin:1.8rem 0 0; color:var(--studio-muted); font-size:clamp(.95rem,1.5vw,1.3rem); line-height:1.8; }
.story-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.8rem; margin-top:2.4rem; }
.cover.story-cover .launch-button { position:static; display:inline-flex; gap:1.6rem; width:auto; height:auto; min-height:3.25rem; padding:.9rem 1.65rem; margin:0; border:0; border-radius:0; background:#7c3436; color:#fffdf8; font-weight:500; box-shadow:none; transform:none; animation:none; overflow:visible; transition:background .2s; }
.cover.story-cover .launch-button::after { display:none; }
.cover.story-cover .launch-button:hover { background:#61272a; transform:none; box-shadow:none; }
.cover.story-cover .launch-button:active { transform:translateY(1px); }
.story-sample-link { min-height:2.75rem; display:inline-flex; gap:1rem; align-items:center; border-bottom:1px solid var(--studio-muted); }
.story-caption { margin:3.9rem 0 0; padding-top:1rem; border-top:1px solid var(--studio-rule); max-width:26rem; color:var(--studio-muted); font-size:.9rem; }
.story-caption p { margin:0 0 .5rem; }
.story-caption > span { font-size:.78rem; }
.story-stage { position:relative; aspect-ratio:960 / 900; min-height:0; background:transparent; overflow:visible; border-radius:0; }
.story-player { position:absolute; inset:0; }
.story-static { position:absolute; inset:7% 6% 11% 17%; padding:7%; background:#fffdf8; color:#24231f; transform:rotate(6deg); box-shadow:0 30px 70px #24231f20; }
.story-static small { color:#7c3436; }
.story-static strong { display:block; margin:1.5rem 0; font-family:SimSun,serif; font-size:clamp(1.5rem,3vw,3rem); line-height:1.45; }
.story-static b { font-size:clamp(3rem,7vw,7rem); font-weight:500; color:#7c3436; }
.story-static b span { font-size:.35em; }
.story-static p { font-size:.85rem; }
.story-static img { width:67%; position:absolute; left:-18%; bottom:-15%; transform:rotate(-6deg); }
.story-stage[data-story-mounted="true"] > .story-static { display:none; }
.story-controls { display:flex; align-items:center; justify-content:flex-end; gap:1rem; margin:1rem 0 0; color:var(--studio-muted); font-size:.75rem; }
.story-controls > span { margin-right:auto; }
.story-control { min-width:2.75rem; min-height:2.75rem; padding:.4rem 0; border:0; border-bottom:1px solid transparent; background:transparent; color:inherit; cursor:pointer; }
.story-control[aria-pressed="true"] { border-bottom-color:currentColor; }
.story-control:disabled { opacity:.5; cursor:default; }
.story-cover a:focus-visible,.story-cover button:focus-visible,.story-stage:focus-visible { outline:2px solid var(--studio-accent); outline-offset:5px; }
.story-composition { background:transparent; color:#24231f; }
.story-depth { width:100%; height:100%; opacity:1; }
.story-composition[data-graphics="webgl"] .story-narrative { width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.story-grid { position:relative; isolation:isolate; --studio-ink:#edf1f7; --studio-muted:#a7b3c6; --studio-rule:#2d394c; --studio-accent:#a9bde0; color:var(--studio-ink); }
.story-grid::before { content:""; position:absolute; z-index:-1; top:-4rem; bottom:-3rem; left:calc((100% - 100vw) / 2); width:100vw; background:#0b1018; }
.story-stage::before { content:""; position:absolute; inset:0 -10%; background:radial-gradient(ellipse at 60% 45%,#394c8b65,transparent 65%); pointer-events:none; }
.app:not(.is-workspace):has(.story-cover) .topbar { width:100%; padding-right:max(3.5rem,calc((100vw - 92rem) / 2)); padding-left:max(3.5rem,calc((100vw - 92rem) / 2)); color:#edf1f7; background:#0b1018; border-color:#2d394c; }
.app:not(.is-workspace):has(.story-cover) .account-trigger,.app:not(.is-workspace):has(.story-cover) .theme-toggle { border-color:#415068; }
.story-grid .launch-button { background:#d5e0f2!important; color:#142033!important; }
.story-grid .launch-button:hover { background:#edf1f7!important; }
.story-narrative { position:absolute; inset:0; pointer-events:none; }
.story-sheet { position:absolute; background:#fffdf8; padding:44px; box-shadow:0 28px 70px #24231f20; transform:translateY(var(--sheet-shift,0px)) rotate(var(--sheet-rotation,0deg)); }
.story-sheet small { display:block; font-size:26px; color:#7c3436; padding-bottom:24px; border-bottom:1px solid #d3cdc1; }
.story-sheet h2 { margin:28px 0; font-family:"Noto Serif SC","SimSun",serif; font-weight:400; font-size:63px; line-height:1.33; letter-spacing:-.035em; }
.story-sheet p { color:#635e56; font-size:25px; line-height:1.55; }
.story-sheet footer { border-top:1px solid #d3cdc1; margin-top:30px; padding-top:20px; color:#635e56; font-size:23px; line-height:1.5; }
.story-sheet-back { left:40px; top:180px; width:475px; height:575px; background:#e6e0d3; --sheet-rotation:-9deg; }
.story-sheet-back h2 { font-size:52px; }
.story-sheet-lines { height:145px; margin-top:38px; background:repeating-linear-gradient(transparent 0 28px,#c4baaa 28px 29px); }
.story-sheet-front { left:335px; top:50px; width:545px; min-height:660px; --sheet-rotation:7deg; }
.story-big-stat { color:#7c3436; font:500 130px/1.1 "Segoe UI",sans-serif; letter-spacing:-.06em; white-space:nowrap; }
.story-big-stat span { font-size:46px; letter-spacing:-.02em; }
.story-sheet-front h2 { font-size:57px; }
.story-sheet-front > p { margin:12px 0 25px; font-size:23px; }
.story-sheet-rows { display:grid; grid-template-columns:1fr auto; gap:15px 25px; padding-top:23px; border-top:1px solid #d3cdc1; font-size:25px; }
.story-sheet-rows strong { font-weight:500; font-variant-numeric:tabular-nums; }
.story-sheet-feature { left:110px; top:65px; width:765px; min-height:650px; --sheet-rotation:-3deg; }
.story-evidence-line { display:grid; grid-template-columns:1fr 60px 1.15fr; gap:15px; align-items:center; font-size:29px; padding:20px 0; border-top:1px solid #d3cdc1; }
.story-evidence-line > span { color:#7c3436; font-size:45px; text-align:center; }
.story-evidence-line strong { font-size:31px; font-weight:500; }
.story-mini-chart { margin:30px 0; }
.story-mini-chart > div { display:grid; grid-template-columns:135px 1fr 125px; align-items:center; gap:20px; margin:22px 0; font-size:26px; }
.story-mini-chart i { display:block; height:22px; background:#7c3436; width:var(--bar); }
.story-mini-chart b { font-weight:500; text-align:right; }
.story-sheet-report { left:420px; top:65px; width:455px; height:665px; background:#7c3436; color:#fffdf8; --sheet-rotation:5deg; }
.story-sheet-report small,.story-sheet-report p,.story-sheet-report footer { color:#f1e3df; border-color:#b67e7c; }
.story-sheet-report h2 { font-size:100px; }
.story-sheet-deck { left:30px; top:230px; width:550px; height:375px; --sheet-rotation:-7deg; }
.story-sheet-deck h2 { font-size:65px; }
.story-laptop { position:absolute; left:0; bottom:5px; width:370px; height:auto; transform:translateY(var(--laptop-shift,0px)); }
.story-composition[data-act="1"] .story-laptop,.story-composition[data-act="2"] .story-laptop { left:auto; right:0; width:300px; }
.story-process { display:grid; grid-template-columns:4fr 7fr; align-items:start; gap:6vw; margin:7rem 0 0; padding:3.5rem 0 5rem; border-top:1px solid var(--studio-rule); }
.story-process-intro { position:sticky; top:3.5rem; }
.story-process h2 { margin:0; font-size:clamp(2rem,4.4vw,4.8rem); font-weight:700; line-height:1.35; letter-spacing:-.05em; }
.story-process-lead { margin:1.7rem 0 0; color:var(--studio-muted); line-height:1.8; }
.story-chapters { display:grid; gap:.25rem; margin-top:3rem; padding-top:1rem; border-top:1px solid var(--studio-rule); }
.story-chapter { display:flex; align-items:center; gap:1.2rem; min-height:3.25rem; color:var(--studio-muted); }
.story-chapter > span { font-variant-numeric:tabular-nums; font-size:.85rem; }
.story-chapter[aria-current] { color:var(--studio-accent); }
.story-chapter:hover { color:var(--studio-ink); }
.story-acts { display:grid; gap:4.5rem; }
.flow-paper { min-width:0; min-height:35rem; padding:2.5rem; background:#fffdf8; color:#24231f; scroll-margin-top:3rem; transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.2,1); }
.flow-paper header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding:1rem 0; border-top:1px solid #d3cdc1; font-size:.82rem; color:#7c3436; }
.flow-paper header > span:last-child { color:#635e56; }
.flow-paper h3 { font-size:clamp(1.8rem,3.4vw,3.5rem); font-weight:400; line-height:1.4; margin:2rem 0; letter-spacing:-.04em; }
.flow-description { line-height:1.8; color:#635e56; max-width:30rem; }
.flow-source-list { margin:2rem 0; }
.flow-source-list > div { display:grid; grid-template-columns:3rem 1fr; gap:1rem; padding:1rem 0; border-top:1px solid #e2dcd1; font-size:.9rem; line-height:1.6; }
.flow-source-list dt { color:#635e56; }
.flow-source-list dd { margin:0; }
.flow-paper footer { margin-top:2.3rem; border-top:1px solid #d3cdc1; padding-top:1rem; color:#635e56; font-size:.8rem; line-height:1.7; }
.flow-comparison { display:grid; grid-template-columns:1fr 2.4rem 1.2fr; gap:.6rem; align-items:center; padding:1.6rem 0; border-top:1px solid #d3cdc1; }
.flow-comparison > div { display:grid; gap:1.4rem; }
.flow-comparison small { color:#635e56; }
.flow-comparison strong { font-size:clamp(.95rem,1.5vw,1.4rem); font-weight:500; line-height:1.7; }
.flow-arrow { color:#7c3436; font-size:2.4rem; }
.flow-chart { padding:1rem 0; }
.flow-chart-row { display:grid; grid-template-columns:4.5rem minmax(0,1fr) 4.6rem; gap:1rem; align-items:center; padding:1rem 0; font-size:.9rem; }
.flow-chart-row > div { min-width:0; }
.flow-chart-row i { display:block; height:1.2rem; width:var(--bar); background:#7c3436; transform-origin:left; }
.flow-chart-row strong { text-align:right; font-weight:500; font-variant-numeric:tabular-nums; }
.flow-chart > p { font-size:.88rem; color:#635e56; margin-top:1.5rem; }
.flow-chart > p strong { color:#7c3436; padding-left:.8rem; font-weight:500; }
.flow-delivery { background:#7c3436; color:#fffdf8; }
.flow-delivery header,.flow-delivery header > span:last-child,.flow-delivery footer { color:#f1e3df; border-color:#b67e7c; }
.flow-delivery-types { display:grid; grid-template-columns:1fr 1fr; gap:1.8rem; }
.flow-delivery-types > div { border-top:1px solid #b67e7c; padding-top:1.4rem; }
.flow-delivery-types strong { display:block; font-size:1.5rem; font-weight:500; }
.flow-delivery-types span { display:block; font-size:.8rem; margin:1rem 0; color:#f1e3df; }
.flow-delivery-types p { font-size:.9rem; line-height:1.6; }
.story-materials { margin:3rem 0 0; scroll-margin-top:3rem; }
.story-gallery-heading { padding-bottom:2rem; border-bottom:1px solid var(--studio-rule); }
.story-gallery-heading h2 { font-size:clamp(2.1rem,4.8vw,5rem); line-height:1.25; letter-spacing:-.05em; margin:0; }
.story-gallery-heading > p:last-child { color:var(--studio-muted); margin:1.3rem 0 0; }
.story-gallery-grid { display:grid; grid-template-columns:1.7fr 1fr; gap:4rem; margin-top:3.2rem; align-items:start; }
.story-gallery-grid figure { margin:0; min-width:0; }
.story-gallery-slide { position:relative; aspect-ratio:16 / 9; padding:4.5%; background:#fffdf8; color:#24231f; }
.story-gallery-slide > small { display:block; padding-top:1rem; border-top:1px solid #d3cdc1; color:#7c3436; font-size:clamp(.6rem,1vw,1rem); }
.story-gallery-slide h3 { font-weight:400; font-size:clamp(1.4rem,2.9vw,3.2rem); line-height:1.38; margin:1.35rem 0 .7rem; letter-spacing:-.04em; }
.story-gallery-slide b { color:#7c3436; font:500 clamp(2.6rem,4.8vw,5.5rem)/1.05 "Segoe UI",sans-serif; letter-spacing:-.05em; }
.story-gallery-slide b > span { font-size:.35em; }
.story-gallery-slide > p { color:#635e56; font-size:clamp(.6rem,.95vw,1rem); margin:.5rem 0; }
.story-gallery-slide > img { position:absolute; width:44%; height:auto; aspect-ratio:16 / 9; right:4.5%; top:31%; }
.story-gallery-slide footer { position:absolute; bottom:6%; color:#635e56; font-size:clamp(.55rem,.8vw,.85rem); }
.story-gallery-report { background:#7c3436; color:#fffdf8; padding:9%; aspect-ratio:4 / 5; transform:rotate(3deg); }
.story-gallery-report small { font-size:clamp(.7rem,1.1vw,1.1rem); }
.story-gallery-report h3 { font-weight:400; font-size:clamp(3.1rem,6.5vw,6.7rem); line-height:1.18; margin:2rem 0 1.8rem; letter-spacing:-.05em; }
.story-gallery-report p { font-size:clamp(.9rem,1.3vw,1.2rem); padding-top:1.2rem; border-top:1px solid #b67e7c; line-height:1.6; }
.story-gallery-report footer { color:#f1e3df; font-size:.85rem; line-height:1.6; }
.story-gallery-grid figcaption { margin-top:1.8rem; font-size:.95rem; line-height:1.8; }
.story-gallery-grid figcaption > span { color:var(--studio-muted); font-size:.8rem; }
.story-delivery-link { display:inline-flex; align-items:center; gap:1rem; min-height:2.75rem; margin-top:2rem; border-bottom:1px solid var(--studio-rule); font-size:.9rem; }
.story-visual-studies { margin-top:2.5rem; border-top:1px solid var(--studio-rule); padding-top:1rem; }
.story-visual-studies > summary { min-height:2.75rem; cursor:pointer; font-size:.9rem; }
.story-visual-studies > summary > span { float:right; }
.story-visual-studies[open] > summary > span { display:none; }
.story-visual-studies .case-showcase { margin:1.5rem 0 0; padding:1.5rem 0; background:transparent; }
.story-visual-studies .case-showcase-inner { width:100%; }
.story-visual-studies .case-showcase-head h2 { font-family:"SimSun",serif; letter-spacing:-.04em; }
.story-footer { display:flex; flex-wrap:wrap; gap:1.5rem; align-items:center; justify-content:space-between; padding:2rem 0; margin-top:6rem; border-top:1px solid var(--studio-rule); font-size:.85rem; }
.story-footer > a:first-child { font-size:1.3rem; letter-spacing:.16em; }
.story-footer p { color:var(--studio-muted); }
.story-cover[data-flow-enhanced="true"] .flow-paper:not(.is-revealed) { opacity:.5; transform:translateY(28px); }
@supports (animation-timeline:view()) {
  @media (prefers-reduced-motion:no-preference) {
    .flow-chart-row i { animation:studio-bar-reveal linear both; animation-timeline:view(); animation-range:entry 0% entry 100%; }
  }
}
@keyframes studio-bar-reveal { from { transform:scaleX(.1); } to { transform:scaleX(1); } }
@media (min-width:1600px) { .story-process { gap:8rem; } }
@media (max-width:1050px) {
  .story-shell,.app:not(.is-workspace):has(.story-cover) .topbar { width:calc(100% - 4rem); }
  .app:not(.is-workspace):has(.story-cover) .topbar { width:100%; padding-left:2rem; padding-right:2rem; }
  .story-grid { gap:1rem; }
  .story-title { font-size:6.5vw; }
  .story-actions { gap:1.2rem; }
  .story-process { gap:2.5rem; grid-template-columns:4fr 7fr; }
  .flow-paper { padding:1.8rem; }
  .story-gallery-grid { gap:2.5rem; }
}
@media (max-width:760px) {
  .story-shell,.app:not(.is-workspace):has(.story-cover) .topbar { width:calc(100% - 2.5rem); }
  .app:not(.is-workspace):has(.story-cover) .topbar { padding:1.2rem 0; }
  .app:not(.is-workspace):has(.story-cover) .topbar { width:100%; padding-left:1.25rem; padding-right:1.25rem; }
  .app:not(.is-workspace):has(.story-cover) .brand { font-size:1.05rem; }
  .app:not(.is-workspace):has(.story-cover) .top-actions { gap:.75rem; }
  .app:not(.is-workspace):has(.story-cover) .text-button { font-size:.8rem; }
  .story-shell { padding-top:2.8rem; }
  .story-grid { display:block; min-height:0; }
  .story-title { font-size:clamp(3rem,11.3vw,5.4rem); }
  .story-kicker { font-size:.85rem; margin-bottom:1.3rem; }
  .story-lead { font-size:1rem; }
  .story-caption { margin-top:2.5rem; }
  .story-copy .story-caption { display:none; }
  .story-copy .story-lead { margin-top:1.1rem; }
  .story-copy .story-actions { margin-top:1.4rem; }
  .story-stage-wrap { margin-top:1.2rem; }
  .story-controls { margin-top:0; }
  .story-process { display:block; margin-top:4rem; padding-top:2.5rem; }
  .story-process-intro { position:static; }
  .story-process h2 { font-size:clamp(2.4rem,8vw,4rem); }
  .story-chapters { display:grid; grid-template-columns:1fr 1fr; margin:2rem 0 2.5rem; }
  .story-chapter { gap:.75rem; font-size:.9rem; }
  .story-acts { gap:2rem; }
  .flow-paper { min-height:0; padding:1.5rem; scroll-margin-top:1.5rem; }
  .flow-paper h3 { font-size:clamp(1.8rem,6vw,2.5rem); }
  .flow-comparison { grid-template-columns:1fr; gap:1.1rem; }
  .flow-comparison > div { gap:.7rem; }
  .flow-arrow { transform:rotate(90deg); width:1.3rem; font-size:2rem; }
  .flow-comparison strong { font-size:1.1rem; }
  .flow-chart-row { gap:.65rem; grid-template-columns:4.1rem minmax(0,1fr) 4.1rem; font-size:.8rem; }
  .flow-delivery-types { gap:1rem; }
  .flow-delivery-types strong { font-size:1.25rem; }
  .story-materials { margin-top:0; }
  .story-gallery-heading h2 { font-size:clamp(2rem,7.6vw,3.2rem); }
  .story-gallery-grid { grid-template-columns:1fr; gap:2.5rem; margin-top:2rem; }
  .story-gallery-slide h3 { margin:1rem 0 .5rem; font-size:clamp(1.3rem,4.4vw,2.6rem); }
  .story-gallery-slide b { font-size:clamp(2.5rem,9vw,4.8rem); }
  .story-gallery-slide > small { font-size:.65rem; padding-top:.6rem; }
  .story-gallery-slide > p { font-size:.65rem; }
  .story-gallery-slide footer { font-size:.55rem; }
  .story-poster-tall { width:82%; margin-left:auto!important; }
  .story-gallery-report h3 { font-size:clamp(3.4rem,16vw,6rem); }
  .story-gallery-report small,.story-gallery-report footer { font-size:.85rem; }
  .story-gallery-report p { font-size:1rem; }
  .story-footer { margin-top:3.5rem; }
}
/* Real-work exhibition: native renders are the visual, not simulated desktop props. */
.app:not(.is-workspace):has(.story-cover) { --studio-bg:#f3f3f0; --studio-surface:#fafaf7; --studio-ink:#20201f; --studio-muted:#656563; --studio-rule:#d1d1cd; --studio-accent:#326a56; }
html[data-theme="dark"] .app:not(.is-workspace):has(.story-cover) { --studio-bg:#09121c; --studio-surface:#101f2b; --studio-ink:#f0f4f2; --studio-muted:#b6c2cb; --studio-rule:#394852; --studio-accent:#bde7d8; }
.app:not(.is-workspace):has(.story-cover) .topbar { padding-top:1.2rem; padding-bottom:1.2rem; color:var(--studio-ink); background:var(--studio-bg); border-color:var(--studio-rule); }
.app:not(.is-workspace):has(.story-cover) .account-trigger,.app:not(.is-workspace):has(.story-cover) .theme-toggle { border-color:var(--studio-rule); }
.story-grid { --studio-ink:inherit; --studio-muted:inherit; --studio-rule:inherit; --studio-accent:inherit; color:var(--studio-ink); }
.story-grid::before,.story-stage::before { display:none; }
.story-shell { padding-top:2rem; }
.story-grid { min-height:min(43rem,calc(100dvh - 8rem)); gap:1.25rem; }
.story-title,.story-process h2,.story-gallery-heading h2,.flow-paper h3 { font-family:"Microsoft YaHei","PingFang SC","Segoe UI",sans-serif; }
.story-title { font-size:clamp(3rem,5.4vw,6.2rem); line-height:1.18; letter-spacing:-.065em; }
.story-lead { max-width:28rem; font-size:1.05rem; }
.story-kicker { font-size:.85rem; margin-bottom:1.5rem; }
.story-grid .launch-button { background:var(--studio-ink)!important; color:var(--studio-bg)!important; }
.story-grid .launch-button:hover { background:var(--studio-accent)!important; color:var(--studio-bg)!important; }
.story-stage { aspect-ratio:960 / 720; }
.story-artwork { overflow:visible; background:transparent; }
.story-window { position:absolute; overflow:hidden; background:var(--studio-bg); outline:1px solid var(--studio-rule); box-shadow:0 18px 44px #080a0b1a; }
.story-artifact { position:absolute; inset:0; width:100%; height:100%; margin:0; backface-visibility:hidden; }
.story-artifact img { width:100%; height:100%; display:block; object-fit:contain; }
.story-static { inset:18% 5% 15%; padding:0; background:transparent; transform:rotate(-2deg); box-shadow:none; }
.story-static img { position:static; width:100%; height:auto; transform:none; }
.story-artwork-note { margin:.5rem 0 0; font-size:.72rem; line-height:1.6; color:var(--studio-muted); }
.flow-paper { background:var(--studio-surface); color:var(--studio-ink); }
.flow-paper header,.flow-arrow,.flow-chart > p strong { color:var(--studio-accent); }
.flow-paper header,.flow-paper footer,.flow-source-list > div,.flow-comparison { border-color:var(--studio-rule); }
.flow-paper header > span:last-child,.flow-paper footer,.flow-description,.flow-source-list dt,.flow-comparison small,.flow-chart > p { color:var(--studio-muted); }
.flow-chart-row i { background:var(--studio-accent); }
.flow-delivery { background:var(--studio-ink); color:var(--studio-bg); }
.flow-delivery header,.flow-delivery header > span:last-child,.flow-delivery footer,.flow-delivery-types span { color:inherit; }
.flow-delivery header,.flow-delivery footer,.flow-delivery-types > div { border-color:color-mix(in srgb,currentColor 35%,transparent); }
.story-gallery-slide { padding:0; background:transparent; }
.story-gallery-slide > img { position:static; width:100%; height:100%; aspect-ratio:auto; object-fit:contain; }
.story-gallery-report { padding:0; background:transparent; aspect-ratio:1020 / 1320; transform:none; }
.story-gallery-report > img { display:block; width:100%; height:100%; object-fit:contain; }
.story-materials .story-delivery-link + .story-delivery-link { margin-left:1.5rem; }
@media (max-width:760px) {
  .story-grid { min-height:0; }
  .story-title { font-size:clamp(2.8rem,10.5vw,4.7rem); }
  .story-stage-wrap { margin-top:1rem; }
  .story-controls { gap:.75rem; }
  .story-artwork-note { font-size:.68rem; }
}
@media (max-width:430px) {
  /* The landing must fit the viewport after the vertical scrollbar takes its space. */
  html:has(.app:not(.is-workspace) .story-cover),body:has(.app:not(.is-workspace) .story-cover) { min-width:0; }
  .app:not(.is-workspace):has(.story-cover) .topbar { gap:.75rem; }
  .app:not(.is-workspace):has(.story-cover) .brand { flex-shrink:0; }
  .app:not(.is-workspace):has(.story-cover) .top-actions { min-width:0; gap:.5rem; }
  .app:not(.is-workspace):has(.story-cover) .text-button,.app:not(.is-workspace):has(.story-cover) .theme-toggle { flex-shrink:0; white-space:nowrap; }
  .app:not(.is-workspace):has(.story-cover) .account-trigger { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
@media (prefers-reduced-motion:reduce) {
  .cover.story-cover .launch-button,.cover.story-cover.is-exiting .launch-button { transform:none; animation:none; transition:none; }
  .story-cover[data-flow-enhanced="true"] .flow-paper:not(.is-revealed) { opacity:1; transform:none; }
  .flow-paper,.flow-chart-row i { animation:none!important; transition:none; }
}
/* A reading room, not an autoplay showcase. Account and workspace styles stay scoped out. */
.app:not(.is-workspace):has(.library-cover) { --studio-bg:#eee9df; --studio-surface:#f7f3eb; --studio-ink:#282a24; --studio-muted:#64645a; --studio-rule:#c9c3b6; --studio-accent:#7e4d34; --accent:#7e4d34; --ink:#282a24; --muted:#64645a; --line:#c9c3b6; }
html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover) { --studio-bg:#20241f; --studio-surface:#2a2e28; --studio-ink:#eee9dc; --studio-muted:#b7b9a9; --studio-rule:#505749; --studio-accent:#d4b18a; --accent:#d4b18a; --ink:#eee9dc; --muted:#b7b9a9; --line:#505749; }
.library-cover { color:var(--studio-ink); background:var(--studio-bg); }
.library-shell { width:min(82rem,calc(100% - 7rem)); }
.library-intro { padding:2.5rem 0 4rem; border-top:1px solid var(--studio-rule); }
.library-intro-top { display:flex; justify-content:space-between; gap:1.5rem; margin-bottom:3rem; font:600 .7rem/1.5 "Microsoft YaHei",sans-serif; letter-spacing:.13em; }
.library-intro-top p { margin:0; }
.library-intro-top span { color:var(--studio-muted); font-weight:400; }
.library-intro-body { display:grid; grid-template-columns:minmax(0,1fr) 14rem; gap:3rem; align-items:end; }
.library-intro h1 { margin:0; font:400 clamp(2.8rem,5.3vw,5.5rem)/1.3 "SimSun","Songti SC","Noto Serif CJK SC",serif; letter-spacing:-.05em; }
.library-intro h1 em { font-style:normal; color:var(--studio-accent); }
.library-intro-description { margin:1.8rem 0 0; color:var(--studio-muted); font:400 .94rem/1.95 "Microsoft YaHei",sans-serif; }
.library-intro-aside { border-left:1px solid var(--studio-rule); padding-left:1.8rem; }
.library-intro-aside p { margin:0 0 1.5rem; font:400 1.25rem/1.8 "SimSun",serif; }
.library-intro-aside .launch-button { background:var(--studio-ink); color:var(--studio-bg); min-width:0; width:100%; height:auto; padding:1rem 1.15rem; font-size:.92rem; display:flex; justify-content:space-between; }
.library-intro-aside .launch-button:hover { background:var(--studio-accent); color:var(--studio-bg); }
.library-intro-aside > a { display:block; margin-top:1rem; font-size:.8rem; color:var(--studio-muted); }
.story-stage.library-stage { aspect-ratio:auto; background:none; border:0; overflow:visible; width:100%; }
.library-stage .story-player { position:static; }
.library-stage > .library-fallback { position:static; width:auto; height:auto; transform:none; }
.library-fallback > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; }
.library-fallback a { padding:2rem; border:1px solid var(--studio-rule); }
.library-fallback h3 { font:400 1.8rem/1.5 "SimSun",serif; }
.library-shelf-heading { display:flex; justify-content:space-between; gap:1.5rem; padding:1.2rem 0; margin-bottom:2rem; border-top:1px solid var(--studio-rule); font-size:.75rem; color:var(--studio-muted); }
.library-shelf-heading p { margin:0; color:var(--studio-ink); }
.library-shelf-heading p span { margin-left:.7rem; font-size:.6rem; letter-spacing:.12em; }
.library-shelf { margin:0; padding:0 1.5rem; list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(2rem,5vw,5rem); align-items:end; }
.library-shelf li { min-width:0; }
.library-book { display:block; color:inherit; text-decoration:none; perspective:1200px; position:relative; }
.library-book-face { position:relative; display:flex; flex-direction:column; min-width:0; height:26.5rem; padding:1.6rem 1.6rem 1.7rem 2rem; transform:rotateY(-7deg) rotateZ(-1.5deg); transform-origin:left center; border-radius:1px 4px 4px 1px; transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s; box-shadow:0 16px 22px -16px #1b211e66,6px 3px 0 #d4ccb9,9px 4px 0 #faf5e8,12px 5px 0 #bfb9a7; isolation:isolate; }
.library-book:hover .library-book-face,.library-book:focus-visible .library-book-face { transform:translateY(-12px) rotateY(0) rotateZ(0); box-shadow:0 30px 26px -22px #1b211e88,6px 3px 0 #d4ccb9,9px 4px 0 #faf5e8,12px 5px 0 #bfb9a7; }
.library-book-internet .library-book-face { background:#263c3c; color:#f0ecd9; }
.library-book-report .library-book-face { height:29rem; background:#8d4c34; color:#f7e9d5; transform:rotateY(-7deg) rotateZ(1deg); }
.library-book-design .library-book-face { height:25.5rem; background:#d8d6bd; color:#35392f; transform:rotateY(-7deg) rotateZ(-2deg); }
.library-book-binding { position:absolute; left:0; top:0; bottom:0; width:14px; border-right:1px solid #ffffff1c; background:linear-gradient(90deg,#00000025,transparent 70%,#ffffff0a); }
.library-book-face::after { content:""; position:absolute; inset:12px 12px 12px 24px; border:1px solid currentColor; opacity:.18; pointer-events:none; }
.library-book-top,.library-book-bottom { display:flex; align-items:center; justify-content:space-between; gap:.5rem; font-size:.6rem; letter-spacing:.09em; }
.library-book-top { padding-bottom:1rem; border-bottom:1px solid #ffffff30; }
.library-book-design .library-book-top { border-bottom-color:#35392f30; }
.library-book-title { margin-top:2rem; font:400 clamp(1.6rem,2.7vw,2.6rem)/1.45 "SimSun","Songti SC",serif; letter-spacing:-.05em; }
.library-book-subtitle { margin:.6rem 0 0; font-size:.76rem; line-height:1.8; opacity:.8; }
.library-cover-chart { margin:auto 0 1.2rem; }
.library-cover-chart > div { display:flex; gap:1rem; align-items:end; height:6rem; border-bottom:1px solid #f0ecd966; padding:0 .75rem; }
.library-cover-chart i { display:block; width:24%; background:#e4d7ac; }
.library-cover-chart i:nth-child(2) { background:#abc3b2; }
.library-cover-chart i:nth-child(3) { background:#f0ecd9; }
.library-cover-chart p { font-size:.43rem; letter-spacing:.1em; margin:.6rem 0 0; }
.library-cover-text { margin:auto 0 1.6rem; display:grid; grid-template-columns:repeat(2,1fr); gap:.65rem; font:400 1.45rem/1.4 "SimSun",serif; }
.library-cover-text span { padding:.5rem 0; border-top:1px solid #f7e9d54d; }
.library-cover-text i { grid-column:1/-1; height:1px; background:#f7e9d54d; margin-top:.7rem; }
.library-cover-swatch { display:grid; grid-template-columns:repeat(3,1fr); margin:auto 0 1.5rem; height:6rem; gap:.3rem; }
.library-cover-swatch i { font:400 2.3rem/1 "Georgia",serif; display:grid; place-items:center; background:#f2ecdf; color:#333931; font-style:normal; }
.library-cover-swatch i:nth-child(2) { background:#172a2b; color:#d1dfd2; }
.library-cover-swatch i:nth-child(3) { background:#af4b37; color:#fff0de; }
.library-book-bottom { margin-top:.8rem; padding-top:1rem; border-top:1px solid #ffffff30; }
.library-book-design .library-book-bottom { border-top-color:#35392f30; }
.library-catalogue-label { padding:2rem 0 1rem; }
.library-catalogue-label > span { font-size:.68rem; color:var(--studio-accent); }
.library-catalogue-label p { margin:.6rem 0 0; font-size:.76rem; line-height:1.7; color:var(--studio-muted); }
.library-shelf-rule { margin-top:.5rem; height:9px; border-top:1px solid var(--studio-rule); border-bottom:1px solid var(--studio-rule); background:var(--studio-surface); }
.library-shelf-note { margin:1rem 0 0; font-size:.7rem; color:var(--studio-muted); line-height:1.9; }
.library-colophon { display:grid; grid-template-columns:1fr 1fr; gap:3rem; padding:5rem 0; border-bottom:1px solid var(--studio-rule); }
.library-colophon > p { margin:0; font:400 2.6rem/1.5 "SimSun",serif; }
.library-colophon > p span { color:var(--studio-accent); }
.library-colophon h2 { margin:.3rem 0 1rem; font-size:1rem; font-weight:500; }
.library-colophon div > p { max-width:29rem; color:var(--studio-muted); font-size:.86rem; line-height:1.9; }
.library-colophon a { display:inline-block; margin-top:1rem; font-size:.8rem; }
.library-archive { padding-top:2rem; }
.library-cover[data-library-reading="true"] .library-intro,.library-cover[data-library-reading="true"] .library-colophon,.library-cover[data-library-reading="true"] .library-archive,.library-cover[data-library-reading="true"] .story-footer { display:none; }
.library-reading-page { background:var(--studio-surface); padding:0 2.25rem 2rem; margin:1rem -1rem 3rem; border:1px solid var(--studio-rule); box-shadow:0 18px 35px -32px #0008; }
.library-reading-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.5rem 0; border-bottom:1px solid var(--studio-rule); font-size:.74rem; }
.library-reading-header p { font-size:.62rem; letter-spacing:.09em; margin:0; color:var(--studio-muted); }
.library-reading-header p span { margin-left:.7rem; }
.library-close { padding:.5rem 0; border:0; background:none; color:var(--studio-ink); cursor:pointer; }
.library-reading-heading { padding:2.7rem 0; display:flex; justify-content:space-between; gap:2rem; align-items:end; }
.library-eyebrow { color:var(--studio-accent); font-size:.72rem; margin:0 0 1rem; }
.library-reading-title { margin:0; font:400 clamp(2rem,4vw,3.6rem)/1.4 "SimSun","Songti SC",serif; letter-spacing:-.05em; }
.library-reading-heading > p { font-size:.72rem; line-height:1.9; max-width:21rem; color:var(--studio-muted); margin:0; }
.library-reading-layout { display:grid; grid-template-columns:12.5rem minmax(0,1fr); gap:2.5rem; border-top:1px solid var(--studio-rule); padding-top:1.5rem; }
.library-toc > p { color:var(--studio-muted); margin:0 0 1rem; font-size:.63rem; letter-spacing:.1em; }
.library-toc a { display:flex; gap:.7rem; align-items:baseline; padding:.7rem .55rem; font-size:.78rem; line-height:1.6; text-decoration:none; border-left:2px solid transparent; }
.library-toc a span { font:400 .62rem/1.5 "Georgia",serif; color:var(--studio-muted); }
.library-toc a[aria-current="page"] { border-left-color:var(--studio-accent); background:var(--studio-bg); color:var(--studio-accent); }
.library-reading-content { min-width:0; }
.library-page-caption { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1.2rem; }
.library-page-caption h2 { margin:0; font-size:.82rem; font-weight:500; }
.library-page-caption > span { font-size:.65rem; color:var(--studio-muted); white-space:nowrap; }
.library-slide-page { margin:0; }
.library-slide-page img { display:block; width:100%; height:auto; background:#09121c; border:1px solid var(--studio-rule); }
.library-slide-page figcaption { margin-top:.85rem; color:var(--studio-muted); font-size:.65rem; line-height:1.8; }
.library-report-frame { display:block; width:100%; height:75dvh; min-height:35rem; border:1px solid var(--studio-rule); background:#f7f1e7; }
.library-page-turn { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.4rem 0; border-bottom:1px solid var(--studio-rule); margin-bottom:1.3rem; }
.library-page-turn button { background:none; color:var(--studio-ink); padding:.6rem 0; border:0; cursor:pointer; font-size:.78rem; }
.library-page-turn button:disabled { opacity:.35; cursor:default; }
.library-page-turn > span { font-size:.7rem; color:var(--studio-muted); }
.library-download { display:flex; justify-content:space-between; width:fit-content; gap:3rem; border-bottom:1px solid var(--studio-ink); padding-bottom:.6rem; font-size:.8rem; }
.library-reading-footer { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; margin-top:3rem; padding-top:1.5rem; border-top:1px solid var(--studio-rule); font-size:.74rem; color:var(--studio-muted); }
.library-reading-footer button { border:0; background:none; cursor:pointer; color:var(--studio-accent); }
.library-cover a { color:inherit; }
.library-cover button:focus-visible,.library-cover a:focus-visible { outline:2px solid var(--studio-accent); outline-offset:5px; }
::view-transition-group(book-internet),::view-transition-group(book-report),::view-transition-group(book-design) { animation-duration:.6s; animation-timing-function:cubic-bezier(.2,.7,.2,1); }
::view-transition-old(book-internet),::view-transition-old(book-report),::view-transition-old(book-design) { animation:library-book-close .24s ease both; transform-origin:left center; }
::view-transition-new(book-internet),::view-transition-new(book-report),::view-transition-new(book-design) { animation:library-page-open .6s cubic-bezier(.2,.7,.2,1) both; transform-origin:left center; }
@keyframes library-book-close { to { opacity:0; transform:perspective(1200px) rotateY(-24deg); } }
@keyframes library-page-open { from { opacity:0; clip-path:inset(0 65% 0 0); transform:perspective(1600px) rotateY(8deg); } 35% { opacity:1; } to { opacity:1; clip-path:inset(0); transform:perspective(1600px) rotateY(0); } }
@media (max-width:1000px) {
  .library-shell { width:calc(100% - 4rem); }
  .library-shelf { gap:2.3rem; padding:0 .3rem; }
  .library-book-face { height:23rem; padding:1.35rem 1rem 1.35rem 1.7rem; }
  .library-book-report .library-book-face { height:25rem; }
  .library-book-design .library-book-face { height:22rem; }
  .library-reading-layout { grid-template-columns:minmax(0,1fr); gap:1.5rem; }
  .library-toc { display:flex; flex-wrap:nowrap; overflow:auto; gap:.25rem; padding-bottom:.5rem; }
  .library-toc > p { display:none; }
  .library-toc a { flex-shrink:0; border-left:0; border-bottom:2px solid transparent; white-space:nowrap; }
  .library-toc a[aria-current="page"] { border-bottom-color:var(--studio-accent); }
}
@media (max-width:640px) {
  .library-shell { width:calc(100% - 2.5rem); }
  .library-intro { padding:1.5rem 0 2.5rem; }
  .library-intro-top { font-size:.62rem; gap:1rem; margin-bottom:2rem; }
  .library-intro-top > span { font-size:.5rem; letter-spacing:.05em; }
  .library-intro-body { grid-template-columns:minmax(0,1fr); gap:2rem; }
  .library-intro h1 { font-size:clamp(2rem,7.8vw,3rem); line-height:1.45; }
  .library-intro-description { font-size:.78rem; margin-top:1.2rem; }
  .library-intro-aside { border-left:0; padding:0; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
  .library-intro-aside p { display:none; }
  .library-intro-aside .launch-button { width:auto; min-width:9rem; padding:.85rem 1rem; font-size:.78rem; }
  .library-intro-aside > a { margin:0; font-size:.7rem; }
  .library-shelf-heading { margin-bottom:2.25rem; font-size:.63rem; }
  .library-shelf-heading p span { display:none; }
  .library-shelf { grid-template-columns:minmax(0,1fr); padding:0 .5rem; gap:2rem; }
  .library-shelf li { width:min(100%,21rem); margin:auto; }
  .library-book-face { height:26rem; padding:1.6rem 1.4rem 1.6rem 2rem; }
  .library-book-report .library-book-face { height:27rem; }
  .library-book-design .library-book-face { height:25rem; }
  .library-book-title { font-size:2.4rem; }
  .library-colophon { grid-template-columns:minmax(0,1fr); gap:1.5rem; padding:3.5rem 0; }
  .library-colophon > p { font-size:2.2rem; }
  .library-reading-page { padding:0 1rem 1.5rem; margin:.5rem -.35rem 2rem; }
  .library-reading-header { font-size:.62rem; gap:.6rem; padding:1rem 0; }
  .library-reading-header p { font-size:.45rem; letter-spacing:0; }
  .library-reading-header p span { display:none; }
  .library-reading-heading { display:block; padding:1.7rem 0; }
  .library-reading-heading > p { margin-top:1rem; font-size:.63rem; }
  .library-reading-title { font-size:2rem; }
  .library-eyebrow { font-size:.62rem; }
  .library-reading-layout { padding-top:1rem; gap:1rem; }
  .library-report-frame { min-height:31rem; height:75dvh; }
  .library-reading-footer { align-items:start; flex-direction:column; font-size:.7rem; }
}
@media (prefers-reduced-motion:reduce) {
  .library-book-face { transition:none; transform:none !important; }
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) { animation:none !important; }
}
/* Full-screen antique library. The scene, not editorial cards, is the homepage. */
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) { --studio-bg:#17110c; --studio-ink:#f3e8cf; --studio-muted:#c6bba2; --studio-rule:#9c835d; --studio-accent:#d6b272; --ink:#f3e8cf; --muted:#c6bba2; --accent:#d6b272; background:#17110c !important; }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .topbar { position:absolute; top:0; left:0; z-index:30; border:0; background:linear-gradient(180deg,#0e0b09dd,transparent); padding-inline:clamp(1.3rem,4vw,4rem); color:#f3e8cf; }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .text-button,.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .account-trigger { color:#f3e8cf; }
.library-cover:not([data-library-reading="true"]) { background:#17110c url("/assets/library/antique-reading-room-v1.jpg") center/cover; }
.library-cover:not([data-library-reading="true"]) .library-shell { width:100%; max-width:none; padding:0; }
.library-cover:not([data-library-reading="true"]) .library-stage { height:100dvh; min-height:640px; margin:0; }
.library-cover:not([data-library-reading="true"]) .story-player { height:100%; }
.library-cover:not([data-library-reading="true"]) .library-colophon,.library-cover:not([data-library-reading="true"]) .library-archive,.library-cover:not([data-library-reading="true"]) .story-footer { display:none; }
.library-cover .room-intro { position:absolute; z-index:8; top:22vh; left:50%; transform:translateX(-50%); width:25rem; max-width:calc(100% - 3rem); padding:0; margin:0; text-align:center; border:0; color:#f3e8cf; text-shadow:0 2px 12px #140e09,0 1px 3px #140e09; pointer-events:none; }
.room-intro .library-intro-top { display:block; margin:0 0 1.1rem; font-size:.7rem; letter-spacing:.2em; }
.room-intro .library-intro-top > span { display:none; }
.room-intro .library-intro-body { display:block; }
.room-intro h1 { font-size:clamp(2rem,3.5vw,3.6rem); line-height:1.45; }
.room-intro h1 em { color:#f3e8cf; }
.room-intro .library-intro-description { color:#e2d3b8; margin-top:1rem; font-size:.8rem; }
.room-intro .library-intro-aside { border:0; margin:1.4rem auto 0; padding:0; width:fit-content; pointer-events:auto; }
.room-intro .launch-button { background:#21190fd9; border:1px solid #c5a56a99; color:#f3e8cf; padding:.7rem 1.25rem; min-width:8rem; font-size:.75rem; }
.room-intro .launch-button:hover { background:#594126; color:#fff3d7; }
.room-scene { position:relative; height:100%; width:100%; min-height:640px; overflow:hidden; isolation:isolate; background:#17110c; }
.room-backdrop { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; display:block; z-index:-3; }
.room-vignette { position:absolute; inset:0; pointer-events:none; z-index:-2; background:radial-gradient(ellipse at 50% 40%,transparent 20%,#100b0855 75%,#100b08a6 100%),linear-gradient(180deg,#100b0833,transparent 35%,transparent 66%,#100b089c); }
.room-atmosphere { position:absolute; inset:0; pointer-events:none; z-index:-1; overflow:hidden; }
.room-window-light { position:absolute; inset:0; mix-blend-mode:screen; filter:blur(12px); background:linear-gradient(135deg,#ffe9c636 15%,#efd4a129 40%,transparent 84%); transform-origin:60% 15%; }
.room-window-light-one { clip-path:polygon(56% 8%,59% 11%,31% 95%,9% 100%); }
.room-window-light-two { clip-path:polygon(60% 10%,64% 14%,47% 100%,34% 100%); opacity:.5; }
.room-dust { position:absolute; inset:0; width:100%; height:100%; }
.room-shelf { list-style:none; padding:0; margin:0; position:absolute; inset:0; }
.room-shelf-position { position:absolute; }
.room-position-internet { left:18%; top:57%; }
.room-position-report { left:76%; top:54%; }
.room-position-design { left:85%; top:74%; }
.room-scene-book { display:block; width:38px; height:150px; text-decoration:none; color:#f1dfb3; perspective:800px; }
.room-book-spine { height:100%; width:100%; position:relative; display:flex; align-items:center; justify-content:space-between; flex-direction:column; padding:14px 5px 12px; border-radius:3px 2px 2px 3px; border:1px solid #bf98525e; background:linear-gradient(90deg,#251812,#785334 30%,#46301e 70%,#2c1b12); box-shadow:7px 4px 8px #0009,inset 2px 0 2px #e7c89135; transform:rotateY(-18deg); transform-origin:left center; transition:transform .45s cubic-bezier(.2,.7,.2,1),filter .45s; }
.room-scene-book-report .room-book-spine { background:linear-gradient(90deg,#1c221a,#586448 30%,#303b29 70%,#1f281c); }
.room-scene-book-design .room-book-spine { background:linear-gradient(90deg,#26130f,#824c38 30%,#503123 70%,#2e1811); }
.room-scene-book:hover .room-book-spine,.room-scene-book:focus-visible .room-book-spine { transform:translate3d(-10px,-5px,28px) rotateY(-32deg); filter:brightness(1.3); }
.room-book-rib { position:absolute; inset:9px 0; border-top:3px double #c6a26a99; border-bottom:3px double #c6a26a99; pointer-events:none; }
.room-spine-title { writing-mode:vertical-rl; font:400 14px/1.4 "SimSun","Songti SC",serif; letter-spacing:.09em; }
.room-spine-number { font:400 10px/1 "Georgia",serif; color:#d5b680; }
.room-bookmark { position:absolute; top:-12px; right:4px; width:10px; height:29px; background:#cda45a; clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%); box-shadow:0 0 12px #e8ba6555; }
.room-book-label { position:absolute; left:55px; top:18px; display:flex; flex-direction:column; gap:8px; width:166px; padding:12px 14px; color:#f3e3c6; background:linear-gradient(135deg,#302317f5,#1d1712ed); border:1px solid #a98a5459; box-shadow:0 7px 15px #0005; border-radius:1px; }
.room-position-report .room-book-label,.room-position-design .room-book-label { left:auto; right:55px; }
.room-book-label small { font-size:.58rem; color:#c3ab7a; }
.room-book-label strong { font:400 1.05rem/1.5 "SimSun",serif; }
.room-book-label > span { font-size:.62rem; color:#cfc1a4; }
.room-book-label i { float:right; font-style:normal; }
.room-scene-bottom { position:absolute; bottom:3.5rem; left:clamp(1.3rem,4vw,4rem); right:clamp(1.3rem,4vw,4rem); display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid #cfb5834d; padding-top:1rem; color:#f3e4c8; font-size:.75rem; }
.room-scene-bottom p { margin:0; }
.room-scene-bottom p span { color:#d3c2a3; font-size:.66rem; margin-left:.5rem; }
.room-scene-bottom button { border:0; background:none; color:#f3e4c8; cursor:pointer; font-size:.74rem; }
.room-provenance { position:absolute; bottom:1.1rem; left:clamp(1.3rem,4vw,4rem); right:clamp(1.3rem,4vw,4rem); margin:0; display:flex; justify-content:space-between; gap:1rem; color:#bcae94; font-size:.53rem; line-height:1.7; }
.library-cover .room-provenance a { color:#bcae94; }
.library-cover:not([data-library-reading="true"]) .library-fallback { position:absolute; z-index:9; left:5%; right:5%; bottom:18%; background:#21180eee; padding:1rem; }
.library-fallback > div { gap:1rem; }
.library-fallback a { padding:1rem; font-size:.75rem; }
.library-fallback h3 { font-size:1.5rem; }
.library-cover[data-library-reading="true"] { padding-top:1rem; }
.library-cover[data-library-reading="true"] .library-shell { padding-top:1rem; }
@media (max-width:640px) {
  .library-cover .room-intro { top:16vh; width:21rem; max-width:calc(100% - 3rem); }
  .room-intro .library-intro-top { font-size:.62rem; margin-bottom:.9rem; }
  .room-intro h1 { font-size:2.2rem; }
  .room-intro .library-intro-description { font-size:.7rem; margin-top:.8rem; }
  .room-intro .library-intro-aside { margin-top:1rem; display:block; }
  .room-intro .launch-button { min-width:8rem; font-size:.7rem; padding:.65rem 1rem; }
  .room-backdrop { object-position:70% center; }
  .room-window-light-one { clip-path:polygon(28% 9%,34% 13%,9% 100%,0 96%); }
  .room-window-light-two { clip-path:polygon(37% 10%,43% 14%,30% 100%,15% 100%); }
  .room-position-internet { left:8%; top:48%; }
  .room-position-report { left:82%; top:62%; }
  .room-position-design { left:15%; top:75%; }
  .room-scene-book { width:30px; height:112px; }
  .room-spine-title { font-size:11px; letter-spacing:0; }
  .room-book-label { left:42px; width:143px; padding:9px 10px; top:4px; gap:5px; }
  .room-position-report .room-book-label { right:43px; left:auto; }
  .room-position-design .room-book-label { left:43px; right:auto; }
  .room-book-label strong { font-size:.93rem; }
  .room-book-label small,.room-book-label > span { font-size:.55rem; }
  .room-scene-bottom { bottom:3.2rem; padding-top:.8rem; font-size:.65rem; }
  .room-scene-bottom p span { display:none; }
  .room-scene-bottom button { font-size:.6rem; max-width:10rem; text-align:right; }
  .room-provenance { font-size:.45rem; bottom:.8rem; }
  .room-provenance > span { max-width:10rem; text-align:right; }
  .library-fallback > div { grid-template-columns:minmax(0,1fr); gap:.5rem; }
  .library-fallback h3 { margin:.3rem 0; font-size:1.1rem; }
  .library-fallback p { margin:.3rem 0; }
}
@media (prefers-reduced-motion:reduce) { .room-book-spine { transition:none; } }
.room-motion-toggle { position:absolute; z-index:10; top:5.5rem; right:clamp(1.3rem,4vw,4rem); background:#21180eab; border:1px solid #bd9d6555; padding:.55rem .75rem; font-size:.63rem; color:#e6d5b4; cursor:pointer; }
.room-motion-toggle:disabled { cursor:default; opacity:.7; }
.library-cover .room-intro .launch-button { background:#21190fdd!important; color:#f3e8cf!important; border:1px solid #c5a56a99!important; box-shadow:none!important; }
.library-cover .room-intro .launch-button:hover { background:#594126!important; color:#fff3d7!important; }
/* The same immense stone hall in daylight and deep night; books are live foreground objects. */
.library-cover:not([data-library-reading="true"]) { --room-image:url("/assets/library/stone-castle-day-v2.png"); --room-ink:#35281b; --room-muted:#594934; background-image:var(--room-image); }
html[data-theme="dark"] .library-cover:not([data-library-reading="true"]) { --room-image:url("/assets/library/stone-castle-night-v2.png"); --room-ink:#eee3cd; --room-muted:#b9ac93; background-color:#08090b; }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) { background:#d9c7ac!important; }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .topbar { color:#35281b; background:linear-gradient(180deg,#e8d8bcbb,transparent); }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .text-button,.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .account-trigger { color:#35281b; }
html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) { background:#08090b!important; }
html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .topbar { color:#eee3cd; background:linear-gradient(180deg,#06070aee,transparent); }
html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .text-button,html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .account-trigger { color:#eee3cd; }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .theme-toggle { width:56px; height:30px; border-radius:2px; gap:6px; justify-content:center; color:#35281b; border-color:#705a3f80; background:#eeddbfc9; }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .theme-toggle::before { width:10px; height:10px; background:#735b35; }
.app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .theme-toggle::after { content:"昼"; font:400 12px/1 "SimSun",serif; }
html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .theme-toggle { color:#e7d7b8; border-color:#a7906359; background:#121217d9; }
html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .theme-toggle::before { background:#c8b591; box-shadow:3px -2px 0 #121217 inset; }
html[data-theme="dark"] .app:not(.is-workspace):has(.library-cover:not([data-library-reading="true"])) .theme-toggle::after { content:"夜"; }
.room-backdrop { object-position:center; }
.room-vignette { background:linear-gradient(180deg,#3a25151a,transparent 32%,transparent 68%,#251b13a6); }
html[data-theme="dark"] .room-vignette { background:radial-gradient(ellipse at 45% 64%,transparent 8%,#02030740 78%),linear-gradient(180deg,#02030733,transparent 42%,#02030770); }
.library-cover .room-intro { left:clamp(2rem,6vw,6rem); top:24vh; transform:none; text-align:left; width:24rem; color:var(--room-ink); text-shadow:0 1px 10px #eee2c670; }
.room-intro h1 { font-size:clamp(2.2rem,3.2vw,3.5rem); }
.room-intro h1 em { color:var(--room-ink); }
.room-intro .library-intro-description { color:var(--room-muted); }
.room-intro .library-intro-aside { margin:1.5rem 0 0; }
html[data-theme="dark"] .library-cover .room-intro { text-shadow:0 2px 12px #000,0 1px 3px #000; }
.library-cover .room-intro .launch-button { background:#ead6b0dc!important; color:#35281b!important; border-color:#685338a6!important; }
.library-cover .room-intro .launch-button:hover { background:#f3e2c4!important; color:#20170e!important; }
html[data-theme="dark"] .library-cover .room-intro .launch-button { background:#171512ee!important; color:#ead8b5!important; border-color:#a68c5759!important; }
html[data-theme="dark"] .library-cover .room-intro .launch-button:hover { background:#352b1c!important; color:#fff0d1!important; }
.room-window-light { background:linear-gradient(60deg,transparent 10%,#ffe9be17 47%,#fff0cb26 76%,transparent 96%); }
.room-window-light-one { clip-path:polygon(13% 11%,17% 17%,64% 96%,41% 100%); }
.room-window-light-two { clip-path:polygon(20% 29%,23% 33%,53% 98%,47% 100%); opacity:.35; }
html[data-theme="dark"] .room-window-light { background:linear-gradient(60deg,transparent 20%,#bac5d20a 53%,#bdc8d810 78%,transparent 95%); }
html[data-theme="dark"] .room-window-light-two { opacity:.15; }
.room-candle-halo { position:absolute; left:84%; top:70%; width:10%; height:13%; pointer-events:none; mix-blend-mode:screen; background:radial-gradient(ellipse,#c57c281f,transparent 68%); animation:room-candle-breathe 4.8s ease-in-out infinite alternate; }
@keyframes room-candle-breathe { from { opacity:.5; } to { opacity:.7; } }
.room-shelf-position { animation:room-book-drift 7s ease-in-out infinite alternate; }
.room-position-internet { left:42%; top:54%; --book-angle:-9deg; }
.room-position-report { left:61%; top:59%; --book-angle:5deg; animation-delay:-3s; }
.room-position-design { left:79%; top:47%; --book-angle:9deg; animation-delay:-5s; }
.room-scene-book { width:clamp(150px,13.4vw,204px); height:clamp(222px,19.9vw,302px); transform:rotateZ(var(--book-angle)) rotateY(-14deg); transform-style:preserve-3d; }
.room-scene-book::after { content:""; position:absolute; left:10%; top:calc(100% + 70px); width:90%; height:12px; border-radius:50%; background:#100c08; opacity:.25; filter:blur(8px); transform:rotateZ(calc(-1 * var(--book-angle))) scaleX(1.2); pointer-events:none; }
.room-book-pages { position:absolute; inset:5px -10px -5px 7px; background:linear-gradient(90deg,#64564450,transparent 18%,#efe1bd44 92%,#58442655),repeating-linear-gradient(0deg,#9d8d6e 0 .6px,#decfae .6px 2px); border:1px solid #baa17a; border-radius:2px 5px 5px 2px; box-shadow:2px 3px 0 #a6916d,4px 5px 0 #27201b,5px 6px 1px #d9bd8a44; }
/* Collector bindings: original raster tooling, live Chinese type, one shared gold foil. */
.room-book-spine { --binding:#142431; transform:rotateY(-7deg); padding:24px 17px 17px 25px; justify-content:flex-start; border-radius:3px 5px 5px 3px; border-color:#dcc69d66; background:var(--binding); color:#f3dfa9; box-shadow:inset 1px 1px 1px #f9e0ac88,0 22px 30px #080b1266,2px 2px 1px #241e19; gap:0; isolation:isolate; }
.room-scene-book-report .room-book-spine { --binding:#173529; background:var(--binding); }
.room-scene-book-design .room-book-spine { --binding:#432029; background:var(--binding); }
.room-cover-art { position:absolute; inset:0; width:100%; height:100%; object-fit:fill; border-radius:inherit; pointer-events:none; z-index:-1; }
.room-book-spine::after { content:""; position:absolute; inset:0; border:0; outline:0; border-radius:inherit; background:linear-gradient(100deg,#03091166,transparent 14%,#fff2cb0c 34%,transparent 55%,#02050a22); box-shadow:inset 4px 0 5px #070b1288,inset -1px -1px 2px #e8ca7a66; pointer-events:none; }
.room-book-rib { inset:1px auto 1px 0; width:14px; border:0; border-right:1px solid #e8cf8b66; border-radius:3px 0 0 3px; background:linear-gradient(90deg,#040b1188,#f4d8a022 50%,#07101677),linear-gradient(0deg,transparent 10%,#d9bf7544 10% 11%,transparent 11% 26%,#d9bf7544 26% 27%,transparent 27% 73%,#d9bf7544 73% 74%,transparent 74% 89%,#d9bf7544 89% 90%,transparent 90%); z-index:2; }
.room-spine-title { writing-mode:horizontal-tb; text-align:center; font:500 clamp(23px,1.9vw,30px)/1.3 "SimSun","Songti SC",serif; letter-spacing:.06em; max-width:100%; margin:18px 0 9px; color:#f3dfa9; text-shadow:0 1px 1px #100b08,0 -1px 0 #ffedc822; }
.room-spine-title > span { display:block; white-space:nowrap; }
.room-scene-book-design .room-spine-title { font-size:clamp(21px,1.7vw,27px); }
.room-cover-kind { font-size:.55rem; letter-spacing:.2em; color:#ebd6a2; }
.room-cover-subtitle { max-width:100%; font-size:.5rem; line-height:1.6; text-align:center; color:#e4cda1; text-wrap:balance; }
.room-spine-number { display:flex; align-items:center; gap:10px; margin-top:auto; font-size:8px; letter-spacing:.2em; color:#ebd6a2; }
.room-spine-number > span { font-size:7px; letter-spacing:.05em; border-left:1px solid #cfb67980; padding-left:9px; }
.room-bookmark { top:-7px; right:17px; width:10px; height:27px; background:linear-gradient(90deg,#785d37,#ddc398 35%,#a48a58 80%,#634a2e); box-shadow:none; }
.room-book-sheen { position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:linear-gradient(110deg,transparent 15%,#ffebbd1f 42%,transparent 65%); opacity:0; transform:translateX(-8px); transition:transform .55s ease,opacity .35s ease; }
.room-scene-book:hover .room-book-spine,.room-scene-book:focus-visible .room-book-spine { transform:translate3d(-3px,-9px,18px) rotateY(-15deg); filter:brightness(1.07); }
.room-scene-book:hover .room-book-sheen,.room-scene-book:focus-visible .room-book-sheen { opacity:1; transform:translateX(0); }
.room-scene-book:active .room-book-spine { transform:translate3d(-2px,-4px,10px) rotateY(-11deg); }
.room-scene-book:focus-visible { outline:2px solid #e9cc89; outline-offset:15px; }
.room-book-label,.room-position-report .room-book-label,.room-position-design .room-book-label { left:-10px; right:auto; top:calc(100% + 15px); width:calc(100% + 20px); padding:0; border:0; box-shadow:none; background:none; text-align:center; font-size:.6rem; color:#f2e2c2; text-shadow:0 1px 6px #000,0 1px 3px #000; gap:6px; transform:rotateZ(calc(-1 * var(--book-angle))); }
.room-book-label > span { font-size:.63rem; color:#fff0d3; }
.room-motion-toggle { background:#ead6b0bc; color:#35281b; border-color:#705a3f77; }
html[data-theme="dark"] .room-motion-toggle { background:#111215cc; color:#c9b99a; border-color:#a08d6150; }
@keyframes room-book-drift { from { translate:0 0; } to { translate:0 -7px; } }
#merak-story-stage[data-library-atmosphere="still"] .room-candle-halo,#merak-story-stage[data-library-atmosphere="still"] .room-shelf-position,#merak-story-stage[data-library-atmosphere="static"] .room-shelf-position { animation-play-state:paused; }
@media (max-width:1000px) and (min-width:641px) {
  .library-cover .room-intro { left:4vw; width:21rem; }
  .room-position-internet { left:40%; }
  .room-position-report { left:60%; }
  .room-position-design { left:79%; }
}
@media (max-width:640px) {
  .room-backdrop { object-position:56% center; }
  .library-cover .room-intro { left:50%; top:16vh; width:21rem; transform:translateX(-50%); text-align:center; color:#f5ead3; text-shadow:0 2px 10px #16120b,0 1px 3px #16120b; }
  .room-intro h1 em { color:#f5ead3; }
  .room-intro h1 { font-size:2.05rem; }
  .room-intro .library-intro-description { color:#ecdec3; }
  .room-intro .library-intro-aside { margin:1rem auto 0; }
  .room-vignette { background:linear-gradient(180deg,#14100c30,transparent 13%,#15100d4d 22%,transparent 43%,#15100d30 75%,#15100dbe); }
  .room-window-light-one { clip-path:polygon(0 14%,4% 20%,76% 96%,38% 100%); }
  .room-window-light-two { clip-path:polygon(0 35%,3% 39%,59% 100%,44% 100%); }
  .room-position-internet { left:9%; top:44%; --book-angle:-8deg; }
  .room-position-report { left:57%; top:51%; --book-angle:7deg; }
  .room-position-design { left:21%; top:68%; --book-angle:-5deg; }
  .room-scene-book { width:clamp(94px,26vw,110px); height:clamp(140px,38.8vw,164px); }
  .room-book-spine { padding:16px 10px 11px 18px; gap:0; }
  .room-spine-title { font-size:18px; line-height:1.3; margin:12px 0 6px; letter-spacing:.04em; }
  .room-scene-book-design .room-spine-title { font-size:16px; }
  .room-cover-kind { font-size:.45rem; }
  .room-cover-subtitle { font-size:.42rem; }
  .room-spine-number { font-size:7px; }
  .room-book-spine::after { inset:0; }
  .room-book-rib { width:10px; }
  .room-bookmark { right:12px; width:8px; height:22px; top:-5px; }
  .room-book-label,.room-position-report .room-book-label,.room-position-design .room-book-label { left:-5px; right:auto; width:calc(100% + 10px); top:calc(100% + 12px); gap:4px; font-size:.52rem; }
  .room-book-label > span { font-size:.54rem; }
  .room-cover-subtitle { display:none; }
  .room-scene-book::after { top:calc(100% + 52px); }
  .room-candle-halo { left:69%; top:77%; width:20%; height:14%; }
  .room-scene-bottom button { display:none; }
  .room-scene-bottom p { font-size:.65rem; }
}
@media (max-width:640px) and (max-height:720px) {
  .library-cover .room-intro { top:10vh; }
  .room-intro .library-intro-top { font-size:.58rem; margin-bottom:.55rem; }
  .room-intro h1 { font-size:1.65rem; line-height:1.3; }
  .room-intro .library-intro-description { margin-top:.5rem; font-size:.65rem; line-height:1.7; }
  .room-intro .library-intro-aside { margin-top:.6rem; }
  .room-intro .launch-button { min-height:44px; }
  .room-position-internet { top:41%; }
  .room-position-report { left:59%; top:50%; }
  .room-position-design { left:26%; top:63%; }
  .room-scene-book { width:88px; height:131px; }
  .room-spine-title { font-size:16px; margin-top:8px; }
  .room-scene-book-design .room-spine-title { font-size:14px; }
  .room-cover-kind { display:none; }
  .room-book-spine { padding-top:12px; padding-bottom:10px; }
}
@media (max-height:720px) and (min-width:641px) {
  .library-cover .room-intro { top:23vh; }
  .room-position-internet { top:48%; }
  .room-position-report { top:52%; }
  .room-position-design { top:42%; }
  .room-scene-book { height:228px; width:154px; }
}
@media (prefers-reduced-motion:reduce) {
  .room-candle-halo,.room-shelf-position { animation:none; }
  .room-book-spine,.room-book-sheen { transition:none; }
  .room-scene-book:hover .room-book-spine,.room-scene-book:focus-visible .room-book-spine,.room-scene-book:active .room-book-spine { transform:rotateY(-7deg); }
}