/* 《一种新的共同探索关系》沉浸页 · 样式（seapex.ai 深墨蓝星河基准同源） */
:root{
  --bg:#0A0F1E;--bg-deep:#060D1A;--panel:#101830;--line:#2A3A64;
  --border:rgba(242,245,255,.08);--border-light:rgba(242,245,255,.05);
  --text:#F2F5FF;--text-2:#8B9AC4;--text-3:#7C8DB5;--eyebrow-2:#8FA3D9;
  --blue:#5B8CFF;--blue-hi:#9FB6FF;--blue-deep:#3E63C9;--blue-line:rgba(91,140,255,.5);--blue-glow:rgba(91,140,255,.3);--blue-soft:rgba(91,140,255,.10);--blue-ring:rgba(159,182,255,.95);
  --human:#F2D9A2;--human-hi:#FFF7E6;--human-deep:#C29A55;--human-line:rgba(242,217,162,.35);--human-glow:rgba(233,201,140,.42);--human-soft:rgba(242,217,162,.10);
  --world:#6FD3BE;--world-hi:#A8EAD9;--world-deep:#3E9E88;--world-line:rgba(111,211,190,.38);--world-glow:rgba(111,211,190,.42);--world-soft:rgba(111,211,190,.10);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --ease:cubic-bezier(0.25,0.46,0.45,0.94);--ease-out:cubic-bezier(0.16,1,0.3,1);
  --nav-h:56px;--pad-x:3rem;
  --seg-c:var(--human);--seg-g:var(--human-glow);--btn-c:var(--blue);--btn-line:var(--blue-line);--btn-soft:var(--blue-soft);
  --step:20ms;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth;color-scheme:dark;-webkit-text-size-adjust:100%}
body{font-family:var(--font);line-height:1.6;color:var(--text);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
main{overflow-x:clip;position:relative;z-index:1}
::selection{background:var(--blue);color:#fff}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3{text-wrap:balance}
canvas{display:block}
.vh,.vh-list{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.nw{white-space:nowrap}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible,input:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.device:focus-visible,#starmap:focus-visible{outline:2px solid var(--human);outline-offset:3px}

#cosmos{position:fixed;inset:0;z-index:-1;width:100%;height:100%}
#glyphs{position:absolute;width:0;height:0;overflow:hidden}

/* ===== 排版 ===== */
.eyebrow{font-size:.8rem;font-weight:500;letter-spacing:.14em;color:var(--text-3)}
.s{font-size:clamp(1.05rem,1.8vw,1.2rem);font-weight:400;line-height:1.85;letter-spacing:.01em;color:var(--text);max-width:42rem;margin:0 0 1.35em;text-wrap:pretty;overflow-wrap:anywhere;word-break:normal;hanging-punctuation:first allow-end}
.text > .s:last-child{margin-bottom:0}
h2.title{font-size:clamp(1.7rem,4.2vw,2.75rem);font-weight:700;line-height:1.22;letter-spacing:-.5px;margin:0;max-width:42rem}
.quote{font-size:clamp(1.45rem,3.2vw,2.2rem);font-weight:600;line-height:1.42;letter-spacing:0;max-width:44rem;margin:1.2em 0 1.4em}
.question{font-size:clamp(1.5rem,2.9vw,2rem);font-weight:600;line-height:1.4;margin:0 0 1em}
.thesis{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:600;line-height:1.3;color:var(--human);text-shadow:0 0 28px rgba(233,201,140,.28);margin:0 0 1.2em}
@supports (-webkit-background-clip:text) or (background-clip:text){
  .thesis.is-lit{background:linear-gradient(90deg,#F2F5FF,#F2D9A2 60%,#F2D9A2);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none}
}
.gap-before{margin-top:2.2em}
.arrow{color:var(--text-2)}
.seg{border-bottom:1px solid transparent;transition:border-color .6s var(--ease),text-shadow .6s var(--ease),color .6s var(--ease);transition-delay:calc(var(--k,1)*420ms)}
.js .s.visible .seg,.static .seg,html:not(.js) .seg{border-color:var(--seg-c);text-shadow:0 0 14px var(--seg-g)}
.seg.is-on{color:var(--seg-c);transition-delay:0s}
#ch-2{--seg-c:var(--world);--seg-g:var(--world-glow);--btn-c:var(--world);--btn-line:var(--world-line);--btn-soft:var(--world-soft)}
#ch-4{--btn-c:var(--human);--btn-line:var(--human-line);--btn-soft:var(--human-soft)}
#ch-6 .question-group[data-group="3"]{--seg-c:var(--human)}
#ch-7 .card{--seg-c:rgba(242,245,255,.55);--seg-g:rgba(91,140,255,.28)}

/* 逐字显影 */
.js-anim:not(.static) .s .ch,.js-anim:not(.static) .js-chars .ch{opacity:0}
.js-anim:not(.static) .title .ch,.js-anim:not(.static) .quote .ch,.js-anim:not(.static) .question .ch{display:inline-block;transform:translateY(.15em)}
.js-anim .s.visible .ch{opacity:1;transform:none;transition:opacity .5s var(--ease),transform .5s var(--ease);transition-delay:calc(var(--i,0)*var(--step))}
.js-anim .js-chars.visible .ch{opacity:1;transition:opacity .5s var(--ease);transition-delay:calc(2s + var(--i,0)*var(--step))}
.title{--step:30ms}.thesis{--step:36ms}.quote{--step:30ms}
.js-anim:not(.static) .card .card-body .s,.js-anim:not(.static) .card .card-note,.js-anim:not(.static) .card .card-story{opacity:0;transform:translateY(10px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.js-anim .card .card-body .s.visible,.js-anim .card .s.card-note.visible,.js-anim .card .s.card-story.visible{opacity:1;transform:none}
/* reveal */
.js-anim:not(.static) .reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.js-anim .reveal.visible{opacity:1;transform:none}

/* ===== 顶栏 ===== */
#topbar{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:30;display:flex;align-items:center;gap:1rem;padding:0 var(--pad-x);background:rgba(10,15,30,.62);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border-bottom:1px solid var(--border-light)}
.topbar-eyebrow{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#chapters{display:flex;align-items:center;gap:6px;margin-left:auto;list-style:none}
#chapters a{position:relative;display:block;padding:9px}
#chapters .dot{display:block;width:10px;height:10px;border-radius:50%;background:rgba(242,245,255,.22);transition:background .3s var(--ease),transform .3s var(--ease)}
#chapters a[data-mood="agent"]{--c:var(--blue)}#chapters a[data-mood="human"]{--c:var(--human)}#chapters a[data-mood="world"]{--c:var(--world)}#chapters a[data-mood="neutral"]{--c:#F2F5FF}
#chapters a:hover .dot,#chapters a:focus-visible .dot{background:rgba(242,245,255,.5)}
#chapters a[aria-current="true"] .dot{background:var(--c);transform:scale(1.3);box-shadow:0 0 10px var(--c)}
#chapters .lbl{position:absolute;top:100%;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:11px;letter-spacing:.06em;color:var(--text-2);background:rgba(8,13,30,.92);box-shadow:0 0 0 1px rgba(120,150,230,.16);padding:4px 9px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .25s var(--ease-out)}
#chapters a:hover .lbl,#chapters a:focus-visible .lbl{opacity:1}
#static-read,#chapters-btn,.btn-ghost,.dlg-close{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:.3rem .9rem;border-radius:999px;border:1px solid rgba(242,245,255,.18);background:rgba(8,13,30,.5);color:var(--text-2);font-size:.8rem;letter-spacing:.08em;cursor:pointer;transition:border-color .3s,color .3s,background .3s;white-space:nowrap}
#static-read:hover,#chapters-btn:hover,.btn-ghost:hover{border-color:var(--blue-ring);color:var(--text)}
#static-read[aria-pressed="true"]{background:var(--blue-soft);border-color:var(--blue-hi);color:var(--text)}
#chapters-btn{display:none}
#progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:rgba(242,245,255,.05)}
#progress i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--human),var(--blue) 55%,var(--world))}
#chapters-dlg{border:0;padding:0;background:transparent;width:100%;max-width:100vw;height:100%;max-height:100vh;color:var(--text)}
#chapters-dlg::backdrop{background:rgba(8,12,24,.97)}
#chapters-dlg[open]{display:flex;align-items:center;justify-content:center;background:rgba(8,12,24,.97)}
.dlg-inner{position:relative;padding:4rem 2rem;width:100%;max-width:520px}
.dlg-close{position:absolute;top:1rem;right:1rem;width:44px;height:44px;padding:0;font-size:1.4rem;border-radius:50%}
.dlg-list{list-style:none;display:flex;flex-direction:column;gap:.2rem}
.dlg-list a{display:block;padding:.8rem .4rem;font-size:1.1rem;border-bottom:1px solid var(--border)}
.dlg-list a[aria-current="true"]{color:var(--human)}

/* 关系线 */
#thread{position:fixed;left:20px;top:calc(var(--nav-h) + 24px);bottom:24px;width:40px;z-index:5;display:none;pointer-events:none;transition:opacity 1.2s var(--ease)}
#thread-path{transition:stroke-width .8s var(--ease)}
.thread-thick #thread-path{stroke-width:3}
.thread-fade #thread{opacity:0}
#thread-ticks circle{fill:#0A0F1E;stroke:rgba(242,245,255,.32);stroke-width:1}
#thread-ticks circle.on{fill:#F2F5FF;stroke:#F2F5FF}

/* 休息钮 */
#rest{position:fixed;right:20px;bottom:20px;width:48px;height:48px;border-radius:50%;z-index:25;border:1px solid var(--human-line);background:rgba(8,13,30,.62);color:var(--human);font-size:.72rem;letter-spacing:.08em;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 0 0 0 rgba(233,201,140,0);transition:box-shadow .6s var(--ease),background .3s}
#rest[aria-pressed="true"]{background:var(--human-soft);box-shadow:0 0 0 6px rgba(233,201,140,.08)}
#rest.glow{animation:restGlow 2s ease-out 1}
@keyframes restGlow{0%{box-shadow:0 0 0 0 rgba(233,201,140,0)}35%{box-shadow:0 0 0 10px rgba(233,201,140,.22),0 0 30px rgba(233,201,140,.35)}100%{box-shadow:0 0 0 0 rgba(233,201,140,0)}}

/* ===== 章节骨架 ===== */
.chapter{position:relative;padding:7rem var(--pad-x);max-width:1320px;margin:0 auto}
.chapter-head{margin-bottom:2.6rem;max-width:42rem}
.chapter--quiet .chapter-head{margin-bottom:3.4rem}
.chapter-sub{margin-top:.8rem;font-size:1rem;color:var(--text-2);letter-spacing:.04em}
/* 统一阅读版式：所有章节共用同一条左轴（正文 42rem）；装置固定在右栏、顶端与标题对齐；不镜像、不居中跳变 */
.chapter--read{display:flex;flex-direction:column}
.chapter--read > .chapter-head{order:1}
.chapter--read > .device{order:2;margin:0 0 2.2rem;max-width:720px}
.chapter--read > .chapter-body{order:3}
.chapter--read .text{min-width:0}
.chapter--single .chapter-head,.chapter--single .text{max-width:42rem}
.chapter--single .text--narrow{max-width:none}
.chapter--notes .chapter-head,.chapter--questions .chapter-head{max-width:36rem}
.chapter--notes .text .s,.chapter--questions .text .s{max-width:36rem}
.question-group--device > .device{margin:1.6rem 0 2rem;max-width:560px}
@media (min-width:1024px){
  .chapter--read{display:grid;grid-template-columns:minmax(0,42rem) minmax(340px,1fr);grid-template-rows:auto 1fr;grid-template-areas:"head device" "body device";column-gap:clamp(3rem,5vw,5rem);align-items:start}
  .chapter--read > .chapter-head{grid-area:head;order:0}
  .chapter--read > .chapter-body{grid-area:body;order:0}
  .chapter--read > .device{grid-area:device;order:0;position:sticky;top:calc(var(--nav-h) + 28px);align-self:start;width:100%;max-width:600px;margin:0}
  .question-group--device{display:grid;grid-template-columns:minmax(0,42rem) minmax(340px,1fr);column-gap:clamp(3rem,5vw,5rem);align-items:start}
  .question-group--device > .s{grid-column:1}
  .question-group--device > .device{grid-column:2;grid-row:1 / span 12;position:sticky;top:calc(var(--nav-h) + 28px);align-self:start;width:100%;max-width:600px;margin:0}
}
.chapter--notes .s,.chapter--questions .s{line-height:1.9}
.chapter--notes::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,13,26,0),rgba(6,13,26,.36) 30%,rgba(6,13,26,.36) 70%,rgba(6,13,26,0));pointer-events:none;z-index:-1}
.question-group{position:relative;padding-top:12vh}
.question-group:first-child{padding-top:2vh}
.margin-wrap{position:relative}
.margin-actors{position:absolute;right:-150px;bottom:-14px;width:120px;height:80px;opacity:.95}

/* 序幕 */
.chapter--hero{min-height:100vh;min-height:100svh;max-width:none;display:flex;align-items:center;justify-content:center;padding:var(--nav-h) var(--pad-x) 0;overflow:clip}
#hero-stage{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero-cam{position:relative;z-index:1;text-align:center;max-width:980px;will-change:transform,opacity}
.hero-eyebrow{animation:fadeUp .7s ease-out .2s both}
.hero-title{font-size:clamp(30px,8.5vw,84px);font-weight:700;line-height:1.08;letter-spacing:-.02em;white-space:nowrap;margin:.7rem 0 1.1rem}
.js-anim:not(.static) .hero-title{animation:heroShow .5s var(--ease) 1.45s both}
.hero-sub{font-size:clamp(1.05rem,1.8vw,1.25rem);color:var(--text-2);letter-spacing:.01em}
.scroll-hint{position:absolute;left:50%;bottom:2rem;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;font-size:.75rem;letter-spacing:.16em;color:var(--text-3);z-index:1;animation:floatY 8s ease-in-out infinite,fadeIn .8s var(--ease) 3.5s both}
.scroll-hint i{display:block;width:1px;height:34px;background:linear-gradient(180deg,rgba(242,245,255,.5),rgba(242,245,255,0))}
@supports (animation-timeline:scroll()){.js-anim .scroll-hint{animation:floatY 8s ease-in-out infinite,fadeIn .8s var(--ease) 3.5s both,hintFade linear both;animation-timeline:auto,auto,scroll();animation-range:normal,normal,0 40vh}}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes heroShow{from{opacity:0}to{opacity:1}}
@keyframes floatY{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}
@keyframes hintFade{to{opacity:0}}

/* 第七章 */
.chapter--full{min-height:100vh;min-height:100svh;max-width:none;display:flex;flex-direction:column;justify-content:center;overflow:clip}
.expand-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.chapter--full .chapter-head,.chapter--full .text{position:relative;z-index:1;max-width:44rem;margin-left:auto;margin-right:auto;text-align:center}
.chapter--full .s{margin-left:auto;margin-right:auto}
.chapter--full .quote{font-size:clamp(1.5rem,3.4vw,2.35rem);line-height:1.5}
#ex-paths path,#ex-ext path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s var(--ease-out)}
#ex-paths{opacity:.8}#ex-links{stroke:rgba(242,245,255,.45)}
#ex-paths.on path,#ex-ext.on path{stroke-dashoffset:0}
#ex-ext{transition:opacity 1s var(--ease)}
#ex-links,#ex-legend{transition:opacity 1.2s var(--ease)}
.expand-overlay .breathe{animation:exBreathe 4s ease-in-out infinite}
@keyframes exBreathe{0%,100%{opacity:.94}50%{opacity:1}}

/* 终幕 */
.chapter--coda{min-height:70vh;min-height:70svh;max-width:none;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:2.5rem;overflow:clip}
#coda-stage{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.coda-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1.4rem;padding-bottom:3rem}
.coda-label{color:var(--human);letter-spacing:.3em}
.btn-ghost{min-height:44px;padding:.6rem 1.9rem;font-size:.92rem}
.coda-foot{position:relative;z-index:1;font-size:.85rem;color:var(--text-3);letter-spacing:.06em}
.coda-foot a{color:rgba(242,245,255,.6)}
.coda-foot a:hover{color:var(--text)}

/* ===== 装置通用 ===== */
.device{margin:0;background:rgba(16,24,48,.55);border:1px solid var(--line);border-radius:14px;padding:.9rem;max-width:100%;overflow:clip;position:relative}
.js .device:not(.is-ready){display:none}
.device-stage{position:relative;width:100%;aspect-ratio:16/9;max-height:60vh;overflow:hidden;border-radius:8px;background:#060D1A}
.device-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
.device-stage--svg{aspect-ratio:auto;max-height:none;background:transparent}
.device-svg{display:block;width:100%;height:auto;max-height:60vh}
.device-stage--rings{aspect-ratio:1;max-width:min(440px,86vw);max-height:56vh;margin:0 auto;background:transparent}
.device-stage--rings .device-svg{max-height:56vh}
.device-ui{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.8rem}
.device-ui--col{flex-direction:column;align-items:stretch}
.ui-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.device-ui button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:44px;padding:.5rem 1.1rem;border-radius:999px;border:1px solid var(--btn-line);background:rgba(8,13,30,.62);color:var(--text);font-size:.9rem;letter-spacing:.03em;cursor:pointer;transition:border-color .3s var(--ease),background .3s var(--ease),transform .15s var(--ease);white-space:nowrap}
.device-ui button:hover{border-color:var(--btn-c)}
.device-ui button:active{transform:scale(.97)}
.device-ui button[aria-pressed="true"]{background:var(--btn-soft);border-color:var(--btn-c);box-shadow:inset 0 0 0 1px var(--btn-line)}
.device-ui button.is-holding{background:var(--btn-soft);border-color:var(--btn-c)}
.device-ui button.is-noop{opacity:.75}
.device-ui button[hidden]{display:none}
.device-hint{display:none;font-size:10.5px;line-height:1.35;letter-spacing:.03em;color:var(--text-3);margin:.6rem 0 0}
.device:focus-within .device-hint{display:block}
.handle{position:absolute;left:0;top:0;width:44px;height:44px;border-radius:50%;border:0;background:transparent;padding:0;transform:translate(-50%,-50%);touch-action:none;cursor:grab;z-index:2}
.handle:active{cursor:grabbing}
.handle:focus-visible{outline:2px solid var(--human);outline-offset:0;background:rgba(242,217,162,.08)}
.handle[hidden]{display:none}
.range-grid{display:grid;grid-template-columns:1fr 1fr;gap:.1rem 1.4rem}
.range-wrap{display:block;min-width:0}
.range-lbl{display:block;font-size:.76rem;letter-spacing:.04em;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
input[type="range"]{-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;margin:0;cursor:pointer}
input[type="range"]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--human),var(--blue))}
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:var(--human-hi);border:0;margin-top:-9px;box-shadow:0 0 0 4px rgba(242,217,162,.18),0 0 12px rgba(233,201,140,.35)}
input[type="range"]::-moz-range-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--human),var(--blue))}
input[type="range"]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--human-hi);border:0;box-shadow:0 0 0 4px rgba(242,217,162,.18)}
input[type="range"]:focus-visible{outline:none}
input[type="range"]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--blue)}
.d03-lbl,.d12-lbl{font-family:var(--font);font-size:15px;letter-spacing:.08em;fill:var(--text-3)}
.device--bare{background:none;border:0;padding:0;display:flex;flex-direction:column;align-items:center;margin-top:2rem}
.device--bare .device-ui{margin-top:0}
.rest .device-ui button{opacity:.8}

/* ===== 素材章 ===== */
.chapter--materials .chapter-body{display:grid;grid-template-columns:minmax(300px,34%) minmax(0,1fr);gap:3rem;align-items:start}
.atlas{position:sticky;top:calc(var(--nav-h) + 12px);height:calc(100vh - var(--nav-h) - 24px);display:flex;flex-direction:column;gap:.8rem;min-width:0}
.atlas-eyebrow{letter-spacing:.2em}
.starmap-wrap{position:relative;flex:1;min-height:180px;border:1px solid var(--line);border-radius:12px;background:rgba(16,24,48,.4);overflow:hidden}
#starmap{position:absolute;inset:0;width:100%;height:100%;cursor:pointer;touch-action:pan-y}
.filter{display:flex;flex-wrap:wrap;gap:.4rem}
.filter button{min-height:40px;padding:.3rem .85rem;border-radius:999px;border:1px solid rgba(242,245,255,.16);background:rgba(8,13,30,.5);color:var(--text-2);font-size:.8rem;letter-spacing:.04em;cursor:pointer;transition:border-color .3s,color .3s,background .3s;white-space:nowrap}
.filter button:hover{border-color:var(--blue-ring);color:var(--text)}
.filter button[aria-pressed="true"]{background:var(--blue-soft);border-color:var(--blue-hi);color:var(--text)}
.search-wrap{display:block}
#q{width:100%;min-height:44px;padding:0 .9rem;border-radius:10px;border:1px solid var(--line);background:rgba(8,13,30,.62);color:var(--text);font:inherit;font-size:.95rem;-webkit-appearance:none;appearance:none}
#q::placeholder{color:var(--text-3)}
#q:focus{border-color:var(--blue)}
.startrack{display:none}
.cards{position:relative;min-width:0}
.cards::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background-image:linear-gradient(rgba(242,245,255,.3) 50%,transparent 50%);background-size:1px 14px}
.card{position:relative;padding:2rem 1.6rem 2.2rem 2rem;padding-right:calc(280px + 3.4rem);border-top:1px solid var(--border);transition:opacity .4s var(--ease),box-shadow .6s var(--ease)}
.card:last-child{border-bottom:1px solid var(--border)}
.card.is-dim{opacity:.55}
.card.is-hit{box-shadow:inset 2px 0 0 var(--human)}
.card.is-target{box-shadow:inset 2px 0 0 var(--human),0 0 0 1px var(--human-line)}
.card-head{display:flex;align-items:baseline;gap:.9rem;margin-bottom:.7rem}
.card-no{font-size:.78rem;letter-spacing:.14em;color:var(--text-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.card-head .card-no{display:none}
.card-head:has(.card-tag) .card-no{display:inline}
.card-tag{font-size:.72rem;letter-spacing:.1em;color:var(--text-3);border:1px solid var(--border);border-radius:999px;padding:.15rem .6rem;white-space:nowrap}
.card-title{font-size:1.22rem;font-weight:600;line-height:1.45;margin:0;max-width:none}
.card-mode{font-size:1rem;line-height:1.7;margin:0 0 1.1em;padding-left:.8rem;border-left:2px solid var(--human-line);max-width:none}
.card-body .s,.card-note,.card-story{font-size:1.02rem;line-height:1.85;max-width:40rem}
.card-body .s:last-child{margin-bottom:0}
.card-note{color:var(--text);padding-left:.8rem;border-left:2px solid var(--blue-line);margin:1em 0 0}
.card-body + .card-mode{margin-top:1.2em}
.card-part--second{margin-top:2.2rem;padding-top:1.6rem;border-top:1px dashed var(--border)}
.card-scene{position:absolute;right:1.6rem;top:2rem;width:280px;margin:0;border-radius:10px;overflow:hidden;background:rgba(6,13,26,.5);border:1px solid var(--border)}
.scene{display:block;width:100%;height:auto}
.card-scene--canvas .scene-canvas{position:absolute;inset:0;width:100%;height:100%;display:none;touch-action:pan-y}
.card-scene.is-live .scene-canvas{display:block}
.card-scene.is-live .scene{visibility:hidden}
.card-scene .scene-ui{position:absolute;left:0;right:0;bottom:0;display:flex;gap:.4rem;flex-wrap:wrap;padding:.4rem;justify-content:center}
.card-scene .scene-ui button{min-height:44px;padding:.3rem .8rem;border-radius:999px;border:1px solid var(--blue-line);background:rgba(8,13,30,.72);color:var(--text);font-size:.78rem;letter-spacing:.03em;cursor:pointer;touch-action:none;white-space:nowrap}
.card-scene .scene-ui button[aria-pressed="true"],.card-scene .scene-ui button.is-holding{background:var(--blue-soft);border-color:var(--blue-hi)}
.card-scene .scene-ui button.is-noop{opacity:.75}
.card-scene .scene-ui .mini{min-height:32px;padding:.15rem .6rem}
.js-anim .card.visible .g-human{animation:idleH 4s ease-in-out infinite}
.js-anim .card.visible .g-ai{animation:idleH 4s ease-in-out -1s infinite}
.js-anim .card.visible .g-world{animation:driftW 8s ease-in-out infinite}
.card .scene *{transform-box:fill-box;transform-origin:center}
@keyframes idleH{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes driftW{0%,100%{transform:translate(0,0)}50%{transform:translate(2px,-1.5px)}}
.card:not(.visible) .scene *{animation-play-state:paused}
/* 第 19 卡：探索循环 */
.card--g1{padding-right:1.6rem}
.card--g1 .card-scene{display:none}
.device--g1{padding:.9rem}
.g1-views{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.g1-view{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:#060D1A;border:1px solid var(--border)}
.g1-view--h{box-shadow:inset 0 0 0 1px var(--human-line)}
.g1-view--a{box-shadow:inset 0 0 0 1px var(--blue-line)}
.g1-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
.g1-views.is-drawing .g1-canvas[data-view="h"]{touch-action:none}
.g1-count{font-size:.78rem;letter-spacing:.1em;color:var(--text-3);font-variant-numeric:tabular-nums}
.g1-count b{font-weight:500;color:var(--text-2)}
.ui-tags{display:inline-flex;gap:.3rem}
.ui-tags button{min-width:44px;padding:.5rem .7rem}
.ui-tags button[aria-pressed="true"]{border-color:var(--human);background:var(--human-soft)}
.loop-line,.card-body .loop-line{max-width:none}
.js-anim:not(.static) .card-body--loop{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto}
.js-anim:not(.static) .card-body--loop > [data-s="110"]{grid-row:1}
.js-anim:not(.static) .card-body--loop > [data-s="111"]{grid-row:2}
.js-anim:not(.static) .card-body--loop > .device--g1{grid-row:3;grid-column:1;padding:3.2em 3.6em;align-self:stretch}
.js-anim:not(.static) .card-body--loop > .loop-line{grid-row:3;grid-column:1;display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr auto;align-items:center;justify-items:center;pointer-events:none;position:relative;z-index:2;margin:0;padding:.6em .8em;font-size:1rem}
.js-anim:not(.static) .card-body--loop > [data-s="113"]{grid-row:4;margin-top:1.6em}
.js-anim:not(.static) .loop-line > :nth-child(1){grid-area:1/1;justify-self:start}
.js-anim:not(.static) .loop-line > :nth-child(2){grid-area:1/2}
.js-anim:not(.static) .loop-line > :nth-child(3){grid-area:1/3;justify-self:end}
.js-anim:not(.static) .loop-line > :nth-child(4){grid-area:2/3;justify-self:end;transform:rotate(90deg)}
.js-anim:not(.static) .loop-line > :nth-child(5){grid-area:3/3;justify-self:end}
.js-anim:not(.static) .loop-line > :nth-child(6){grid-area:3/2;transform:rotate(180deg)}
.js-anim:not(.static) .loop-line > :nth-child(7){grid-area:3/1;justify-self:end}
.js-anim:not(.static) .loop-line > :nth-child(8){grid-area:3/1;justify-self:end;transform:translateX(100%)}
.js-anim:not(.static) .loop-line::before{content:"";grid-area:2/1;justify-self:center;align-self:stretch;width:1px;margin:.4em 0;background-image:linear-gradient(rgba(242,245,255,.35) 50%,transparent 50%);background-size:1px 8px}
.loop-line .seg.is-on{color:var(--human);text-shadow:0 0 16px var(--human-glow)}

/* ===== 断点 ===== */
@media (max-width:1339.98px){
  .margin-actors{position:static;display:block;margin:.6rem 0 0 auto}
}
@media (max-width:1023.98px){
  :root{--pad-x:2rem}
  .chapter{padding:5rem var(--pad-x)}
  .device-stage{max-height:52vh}
  .chapter--materials .chapter-body{display:block}
  .atlas{position:static;height:auto;display:grid;grid-template-columns:1fr;gap:.8rem;margin-bottom:1.5rem}
  .starmap-wrap,.atlas-eyebrow{display:none}
  .startrack{display:flex;gap:4px;overflow-x:auto;position:sticky;top:var(--nav-h);z-index:6;background:rgba(10,15,30,.92);padding:4px 0;margin:0 calc(-1*var(--pad-x)) 1rem;padding-left:var(--pad-x);padding-right:var(--pad-x);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .startrack::-webkit-scrollbar{display:none}
  .startrack button{flex:0 0 44px;width:44px;height:44px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text-3);font-size:.78rem;font-variant-numeric:tabular-nums;cursor:pointer;position:relative}
  .startrack button::after{content:"";position:absolute;left:50%;bottom:5px;width:4px;height:4px;border-radius:50%;background:rgba(242,245,255,.35);transform:translateX(-50%)}
  .startrack button[aria-current="true"]{color:var(--text);border-color:rgba(242,245,255,.4);background:rgba(242,245,255,.06)}
  .startrack button[aria-current="true"]::after{background:#fff;box-shadow:0 0 8px #fff}
  .startrack button.is-dim{opacity:.4}
  .card{padding:1.8rem 1.2rem 2rem 1.4rem}
  .card-scene{position:static;width:100%;max-width:480px;margin:.4rem 0 1.4rem;max-height:200px}
  .card-scene .scene{max-height:200px;object-fit:contain}
  .card--g1 .device--g1{margin:1rem 0 1.4rem}
  .expand-overlay g[transform]{transform-box:view-box}
}
@media (max-width:767.98px){
  :root{--nav-h:44px;--pad-x:1.5rem}
  .chapter{padding:4rem var(--pad-x)}
  .topbar-eyebrow{font-size:.72rem;letter-spacing:.1em}
  #chapters{display:none}
  #chapters-btn{display:inline-flex;margin-left:auto}
  #static-read{padding:.3rem .7rem}
  .s{font-size:1rem}
  .card-body .s,.card-note,.card-story{font-size:1rem}
  h2.title{font-size:clamp(1.55rem,6vw,2.2rem)}
  .question{font-size:1.5rem}
  .device{padding:.7rem;border-radius:12px}
  .device-ui button{padding:.5rem .9rem;font-size:.85rem}
  #d02 .ui-row{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:4px;scrollbar-width:none}
  #d02 .ui-row::-webkit-scrollbar{display:none}
  .range-grid{grid-template-columns:1fr}
  .device-stage--rings{max-width:min(86vw,40vh)}
  .g1-views{gap:.5rem}
  .device-ui .ui-row{gap:.4rem}
  .margin-actors{width:96px;height:64px}
  .coda-inner{padding-bottom:2rem}
  #rest{right:14px;bottom:14px}
  .filter button{min-height:44px}
}
@media (max-width:599.98px){
  .margin-actors,.scroll-hint i{display:none}
  .topbar-eyebrow{display:none}
}
@media (max-height:819.98px){
  .chapter--hero{padding-top:calc(var(--nav-h) + 1rem)}
}

/* ===== 状态：休息 / 静态阅读 / reduced / 无 JS ===== */
.rest #cosmos{opacity:.6;transition:opacity 1s}
.static .reveal,.static .s .ch,.static .js-chars .ch,.static .card .s,.static .card .card-note,.static .card .card-story,.static .hero-title{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}
.static .thesis{color:var(--human)}
.static .scroll-hint{animation:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  html{scroll-behavior:auto}
  #cosmos{opacity:.8}
  .hero-title,.reveal,.s,.ch{opacity:1;transform:none}
  #ex-paths path,#ex-ext path{stroke-dashoffset:0}
}
html:not(.js) .device,html:not(.js) .atlas,html:not(.js) .startrack,html:not(.js) #hero-stage,html:not(.js) #coda-stage,html:not(.js) #thread,html:not(.js) #rest,html:not(.js) #static-read,html:not(.js) #chapters-btn,html:not(.js) .margin-actors,html:not(.js) .scene-canvas{display:none!important}
html:not(.js) .hero-title{opacity:1;animation:none}
html:not(.js) .card-scene{display:block}
html:not(.js) #ex-paths path,html:not(.js) #ex-ext path{stroke-dashoffset:0}
html:not(.js) #ex-ext,html:not(.js) #ex-links,html:not(.js) #ex-legend{opacity:1}

/* Published exploration: cinematic opening and readable, quiet fallbacks. */
.skip-link{position:fixed;left:1rem;top:-6rem;z-index:200;background:var(--human);color:#080e1b;padding:.75rem 1rem;border-radius:8px}
.skip-link:focus{top:1rem}
.exploration-brand{font-size:1.15rem;font-weight:650;letter-spacing:.04em;margin-right:auto}
.journey-nav{display:inline-flex;align-items:center;gap:.65rem;font-size:.875rem;color:var(--world-hi);min-height:44px;margin-right:.6rem;white-space:nowrap}
.hero-landscape{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,12,24,.8),rgba(5,12,24,.32) 52%,rgba(5,12,24,.1)),linear-gradient(0deg,#0A0F1E 0%,transparent 33%,rgba(5,12,24,.28)),url('assets/silent-reef.webp') center 55%/cover no-repeat;transform:scale(1.025);animation:landscapeIn 2.4s ease-out both;pointer-events:none}
.chapter--hero{justify-content:flex-start;min-height:100svh;padding-left:max(7.5vw,1.5rem);padding-right:max(7.5vw,1.5rem)}
#hero-stage{display:none}
.hero-cam{text-align:left;max-width:1100px;padding-bottom:2rem}
.hero-eyebrow{font-size:.875rem;letter-spacing:.3em;color:#b5cfcd}
.hero-title{font-size:clamp(2.4rem,5.55vw,5rem);line-height:1.17;letter-spacing:-.035em;white-space:normal;max-width:1000px;margin:1.25rem 0 1.4rem;text-shadow:0 4px 36px rgba(0,0,0,.3)}
.hero-sub{color:#d0dce5;max-width:34rem;font-size:clamp(1rem,1.65vw,1.25rem);line-height:1.8}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:1.7rem;margin-top:2.2rem}
.hero-enter{display:inline-flex;gap:2rem;align-items:center;justify-content:space-between;min-height:54px;padding:.85rem 1.4rem;border-radius:4px;background:#e2eedf;color:#122d30;font-weight:650;font-size:1rem;box-shadow:0 0 40px rgba(157,213,195,.1);transition:background .2s,transform .2s}
.hero-enter:hover{background:#f6ffed;transform:translateY(-3px)}
.hero-enter span{font-size:1.3rem;font-weight:400}
.hero-read{color:#d7e2e7;font-size:.95rem;border-bottom:1px solid rgba(215,226,231,.4);padding:.5rem 0;display:inline-flex;gap:1.6rem}
.hero-duration{font-size:.8rem;line-height:1.8;color:#afc0c8;margin-top:1.2rem;letter-spacing:.03em}
.scroll-hint{font-size:.8rem;color:#bbc9d3;animation:fadeIn .8s ease-out 1s both}
.chapter--notes .chapter-head{margin-bottom:1.7rem}
.chapter--notes .chapter-head h2{font-size:1rem;font-weight:500;color:var(--world);letter-spacing:.18em}
.chapter--notes .text .s{max-width:46rem}
.chapter--notes .thesis{font-size:clamp(1.8rem,3.5vw,2.6rem)}
.coda-foot{display:flex;align-items:center;flex-direction:column;gap:.8rem;text-align:center;width:100%;font-size:.875rem}
.coda-foot .footer-logo{font-size:1.5rem;font-weight:650;letter-spacing:.04em;color:var(--text)}
.footer-projects{display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem 1.5rem;margin:.7rem 0}
.footer-projects a{display:inline-flex;align-items:center;min-height:44px}
.footer-legal{font-size:.75rem;line-height:1.8;max-width:50rem}
.static *,.static *::before,.static *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.static .hero-cam{transform:none!important;opacity:1!important}
.static .hero-landscape{transform:none}
.rest .hero-landscape{animation-play-state:paused}
@keyframes landscapeIn{from{opacity:0;transform:scale(1.07)}to{opacity:1;transform:scale(1.025)}}
@media(max-width:767.98px){
  #topbar{gap:.7rem;padding:0 1rem}
  .exploration-brand{font-size:1rem;letter-spacing:0}
  .journey-nav{font-size:.8rem;margin-right:0;gap:.25rem}
  #chapters-btn{margin-left:0;font-size:.75rem;padding:.3rem .6rem}
  #static-read{font-size:.75rem;letter-spacing:0;padding:.3rem .6rem}
  .chapter--hero{min-height:94svh;align-items:center}
  .hero-cam{padding-bottom:0}
  .hero-title{font-size:clamp(2.2rem,8.5vw,3.6rem);max-width:11em;line-height:1.28;letter-spacing:-.025em}
  .hero-second{display:block}
  .hero-landscape{background-position:40% center}
  .hero-eyebrow{font-size:.8rem}
  .hero-actions{gap:1.3rem;margin-top:1.7rem}
  .hero-enter{min-height:50px;padding:.7rem 1rem;gap:1.3rem;font-size:.95rem}
  .hero-read{font-size:.875rem;gap:.65rem}
  .hero-duration{max-width:20rem;font-size:.75rem}
  .scroll-hint{bottom:1.5rem;font-size:.75rem;white-space:nowrap}
  .coda-foot{font-size:.8rem}
}
@media(max-width:359px){.journey-nav{display:none}.hero-title{font-size:2.15rem}.hero-actions{gap:1rem}}

/* ===== 重构：愿景开篇/收束、章节眉标、终幕 ===== */
.hero-title{font-size:clamp(1.7rem,3.4vw,3rem);line-height:1.3;letter-spacing:-.02em;max-width:none;margin:1.1rem 0 1.3rem}
.hero-line{display:block}
.hero-line + .hero-line{margin-top:.25em}
.hero-sub{max-width:40rem}
.chapter-eyebrow{margin-bottom:.9rem;color:var(--human);letter-spacing:.2em}
.coda-vision{display:flex;flex-direction:column;gap:.4em;align-items:center;text-align:center;margin:0}
.coda-line.s{font-size:clamp(1.25rem,2.5vw,2rem);font-weight:600;line-height:1.5;color:var(--human);text-shadow:0 0 24px rgba(233,201,140,.25);max-width:none;margin:0}
.coda-inner{gap:1.7rem}
.chapter--coda{min-height:80vh;min-height:80svh}
@media (max-width:767.98px){
  .hero-title{font-size:clamp(1.35rem,5.6vw,2rem);max-width:none;line-height:1.35}
  .coda-line.s{font-size:1.2rem}
}


/* =====================================================================
   主题：星河编辑风——配色取自 seapex.ai/pitch（--ink #0A1526 / --star #EAF2FB / --dim #93A9C6 /
   --agent-hi #8FC0F2 / --human #F2D9A2），衬线标题（XingheSerif）、克制留白；序幕（海岸图）、
   高潮章（星场）、终幕（愿景）透出星场。装置一律做成「面板里的深色观测窗」，嵌在阅读流中。
   ===================================================================== */
@font-face{font-family:'XingheSerif';src:url('fonts/XingheSerif.woff2') format('woff2');font-weight:200 900;font-display:swap}
:root{
  --paper:#0A1526;--paper-2:#0E1C31;--card:linear-gradient(180deg,rgba(17,27,49,.97),rgba(10,17,32,.97));
  --ink:#EAF2FB;--ink-2:#93A9C6;--ink-3:rgba(147,169,198,.62);
  --rule:rgba(127,182,238,.14);--rule-2:rgba(143,192,242,.28);--night:#060D1A;
  --font-serif:'XingheSerif',"Songti SC","STSong","Noto Serif CJK SC","SimSun",Georgia,serif;
  --bg:#0A1526;--panel:#0E1C31;--line:rgba(127,182,238,.2);--border:rgba(143,192,242,.12);--border-light:rgba(143,192,242,.07);
  --text:#EAF2FB;--text-2:#93A9C6;--text-3:rgba(147,169,198,.62);--eyebrow-2:#8FC0F2;
  --blue:#5A9AD8;--blue-hi:#8FC0F2;--blue-deep:#3E63C9;--blue-line:rgba(143,192,242,.45);--blue-glow:rgba(143,192,242,.25);--blue-soft:rgba(143,192,242,.10);--blue-ring:#8FC0F2;
  --human:#F2D9A2;--human-hi:#FFF7E6;--human-deep:#C29A55;--human-line:rgba(242,217,162,.38);--human-glow:rgba(233,201,140,.35);--human-soft:rgba(242,217,162,.10);
  --world:#6FD3BE;--world-hi:#A8EAD9;--world-deep:#3E9E88;--world-line:rgba(111,211,190,.4);--world-glow:rgba(111,211,190,.35);--world-soft:rgba(111,211,190,.10);
}
html{background:var(--night);color-scheme:dark}
body{color:var(--ink);background:transparent}
::selection{background:var(--blue);color:#fff}

/* 章节：整宽深色纸面，内容仍以 1224px 居中 */
.chapter{max-width:none;margin:0;padding-left:max(var(--pad-x),calc((100% - 1224px) / 2));padding-right:max(var(--pad-x),calc((100% - 1224px) / 2));background:var(--paper)}
.chapter--hero,.chapter--full,.chapter--coda{background:transparent}
.chapter--hero{padding-left:max(7.5vw,1.5rem);padding-right:max(7.5vw,1.5rem)}
.chapter--notes::before{display:none}
.chapter--read + .chapter--read,.chapter--single + .chapter--single,.chapter--read + .chapter--single{padding-top:6rem}

/* 排版（pitch：正文 17px / 1.9） */
h2.title,.quote,.thesis,.question,.hero-title,.coda-line.s,.card-title{font-family:var(--font-serif)}
h2.title{font-size:clamp(1.9rem,3.6vw,2.7rem);font-weight:700;line-height:1.32;letter-spacing:0;color:var(--text)}
.s{font-size:clamp(1.04rem,1.28vw,1.14rem);line-height:1.9;color:var(--text)}
.quote{font-size:clamp(1.4rem,2.6vw,1.95rem);font-weight:600;line-height:1.55}
.question{font-size:clamp(1.35rem,2.4vw,1.75rem);font-weight:600;line-height:1.45}
.thesis{font-size:clamp(1.7rem,3.2vw,2.45rem);font-weight:600;color:var(--human);text-shadow:0 0 28px rgba(233,201,140,.22)}
@supports (-webkit-background-clip:text) or (background-clip:text){
  .thesis.is-lit{background:linear-gradient(90deg,var(--text),var(--human) 55%,var(--human));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none}
}
.eyebrow{font-size:.74rem;letter-spacing:.42em;color:var(--eyebrow-2)}
.chapter-eyebrow{color:var(--human)}
.arrow{color:var(--text-3)}
.js .s.visible .seg,.static .seg,html:not(.js) .seg{text-shadow:none;border-bottom-color:var(--seg-c)}
.seg.is-on{color:var(--seg-c);text-shadow:0 0 14px var(--seg-g)}
.chapter-sub{color:var(--text-2)}

/* 顶栏 / 对话框 / 全局按钮 */
#topbar{background:rgba(10,21,38,.72);border-bottom:1px solid var(--rule);color:var(--text);transition:background .5s var(--ease),border-color .5s var(--ease)}
html.night #topbar{background:rgba(6,13,26,.5);border-bottom-color:rgba(143,192,242,.08)}
.exploration-brand{color:inherit}
#chapters .dot{background:rgba(234,242,251,.2)}
#chapters a:hover .dot,#chapters a:focus-visible .dot{background:rgba(234,242,251,.5)}
#chapters a[data-mood="neutral"]{--c:#EAF2FB}
#chapters a[aria-current="true"] .dot{box-shadow:0 0 10px var(--c)}
#chapters .lbl{color:var(--text-2);background:rgba(10,21,38,.95);box-shadow:0 0 0 1px var(--rule-2)}
#static-read,#chapters-btn,.btn-ghost{border:1px solid var(--rule-2);background:rgba(143,192,242,.06);color:var(--text-2)}
#static-read:hover,#chapters-btn:hover,.btn-ghost:hover{border-color:var(--blue-hi);color:var(--text)}
#static-read[aria-pressed="true"]{background:rgba(143,192,242,.14);border-color:var(--blue-hi);color:var(--text)}
#progress{background:rgba(234,242,251,.06)}
#chapters-dlg[open],#chapters-dlg::backdrop{background:rgba(6,13,26,.97)}
#chapters-dlg .dlg-close{border-color:var(--rule-2);background:rgba(143,192,242,.06);color:var(--text-2)}
#rest{background:rgba(10,21,38,.8);border-color:var(--human-line);color:var(--human);box-shadow:none}

/* 序幕：海岸图向深墨蓝纸面过渡 */
.hero-landscape{background:linear-gradient(90deg,rgba(5,12,24,.78),rgba(5,12,24,.3) 52%,rgba(5,12,24,.08)),linear-gradient(0deg,#0A1526 0%,rgba(10,21,38,0) 18%,rgba(5,12,24,.25) 100%),url('assets/silent-reef.webp') center 55%/cover no-repeat}
.hero-eyebrow{color:#b5cfcd}
.hero-sub{color:#d0dce5}
.scroll-hint{color:var(--text-2)}
.scroll-hint i{background:linear-gradient(180deg,rgba(234,242,251,.5),rgba(234,242,251,0))}

/* 装置：面板 + 深色观测窗 */
.device{background:var(--card);border:1px solid var(--rule);border-radius:16px;padding:1rem;box-shadow:0 12px 40px rgba(0,0,0,.25)}
.device-stage,.device-stage--svg,.device-stage--rings{background:#060D1A;border-radius:10px;border:1px solid rgba(143,192,242,.08)}
.device-stage--svg{padding:.5rem}
.device-ui button{background:rgba(143,192,242,.06);border:1px solid var(--rule-2);color:var(--text)}
.device-ui button:hover{border-color:var(--btn-c)}
.device-ui button[aria-pressed="true"],.device-ui button.is-holding{background:var(--btn-soft);border-color:var(--btn-c);color:var(--text);box-shadow:none}
.device-hint{color:var(--text-3)}
.range-lbl{color:var(--text-2)}
input[type="range"]::-webkit-slider-thumb{background:var(--human-hi);box-shadow:0 0 0 4px rgba(242,217,162,.18),0 0 12px rgba(233,201,140,.35)}
input[type="range"]::-moz-range-thumb{background:var(--human-hi);box-shadow:0 0 0 4px rgba(242,217,162,.18)}
input[type="range"]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--paper),0 0 0 5px var(--blue-hi)}
.d03-lbl,.d12-lbl{fill:#7C8DB5}
.device--bare{background:none;border:0;box-shadow:none;padding:0}
.g1-view{border-color:rgba(143,192,242,.1)}
.g1-count{color:var(--text-3)}
.g1-count b{color:var(--text-2)}
.loop-line .seg.is-on{color:var(--human);text-shadow:0 0 16px var(--human-glow)}
.js-anim:not(.static) .loop-line::before{background-image:linear-gradient(rgba(234,242,251,.35) 50%,transparent 50%)}

/* 故事章：星图窗 + 面板卡片 */
.starmap-wrap{background:#060D1A;border-color:var(--rule)}
.filter button{background:rgba(143,192,242,.06);border:1px solid var(--rule-2);color:var(--text-2)}
.filter button:hover{border-color:var(--blue-hi);color:var(--text)}
.filter button[aria-pressed="true"]{background:rgba(143,192,242,.14);border-color:var(--blue-hi);color:var(--text)}
#q{background:rgba(6,13,26,.6);border:1px solid var(--rule-2);color:var(--text)}
#q::placeholder{color:var(--text-3)}
#q:focus{border-color:var(--blue-hi)}
.cards::before{display:none}
.card{background:var(--card);border:1px solid var(--rule);border-radius:16px;margin-bottom:1.1rem;padding:2rem 2rem 2.2rem;padding-right:calc(280px + 3.4rem);box-shadow:none}
.card:last-child{border-bottom:1px solid var(--rule)}
.card.is-hit{box-shadow:inset 3px 0 0 var(--human)}
.card.is-target{box-shadow:inset 3px 0 0 var(--human),0 0 0 1px var(--human-line)}
.card-title{font-size:1.3rem;font-weight:700;line-height:1.45;color:var(--text)}
.card-mode{color:var(--text);border-left:2px solid var(--human-line)}
.card-note{border-left-color:var(--blue-line)}
.card-scene{background:#060D1A;border:1px solid var(--rule);top:2rem;right:2rem}
.card-scene .scene-ui button{background:rgba(8,13,30,.72);border-color:var(--blue-line);color:var(--text)}
.card-scene .scene-ui button[aria-pressed="true"],.card-scene .scene-ui button.is-holding{background:var(--blue-soft);border-color:var(--blue-hi)}
.card--g1{padding-right:2rem}
.device--g1{background:rgba(6,13,26,.45);box-shadow:none}

/* 终幕 */
.chapter--coda{justify-content:flex-end}
.coda-foot a{color:rgba(234,242,251,.6)}

/* 断点补充 */
@media (max-width:1023.98px){
  .chapter{padding-left:var(--pad-x);padding-right:var(--pad-x)}
  .chapter--hero{padding-left:max(7.5vw,1.5rem);padding-right:max(7.5vw,1.5rem)}
  .startrack{background:rgba(10,21,38,.95)}
  .startrack button{border-color:var(--rule-2);color:var(--text-3)}
  .startrack button::after{background:rgba(234,242,251,.3)}
  .startrack button[aria-current="true"]{color:var(--text);border-color:rgba(234,242,251,.4);background:rgba(234,242,251,.06)}
  .startrack button[aria-current="true"]::after{background:#fff;box-shadow:0 0 8px #fff}
  .card{padding:1.6rem 1.2rem 1.8rem}
  .card-scene{position:static;width:100%;max-width:480px;margin:.4rem 0 1.4rem}
}
@media (max-width:767.98px){
  #topbar{padding:0 1rem}
  .s{font-size:1.02rem}
  h2.title{font-size:clamp(1.6rem,6vw,2.2rem)}
  .device{padding:.7rem;border-radius:12px}
}
/* ===== 修复：手机端探索循环、触控目标、终幕高度 ===== */
.chapter--coda{min-height:100vh;min-height:100svh}
@media (max-width:1023.98px){
  .js-anim:not(.static) .card-body--loop{display:block}
  .js-anim:not(.static) .card-body--loop > .device--g1{padding:.8rem;margin:1rem 0 1.4rem}
  .js-anim:not(.static) .card-body--loop > .loop-line{display:block;position:static;padding:0;pointer-events:auto;margin:0 0 1.35em;font-size:inherit}
  .js-anim:not(.static) .loop-line > *{transform:none;justify-self:auto}
  .js-anim:not(.static) .loop-line::before{display:none}
  .js-anim:not(.static) .card-body--loop > [data-s="113"]{margin-top:0}
  .g1-views{grid-template-columns:1fr 1fr;gap:.6rem}
  .g1-view{aspect-ratio:1;min-width:0}
}
@media (max-width:767.98px){
  #static-read,#chapters-btn{min-height:44px}
  .device-stage--rings{max-width:min(86vw,34vh)}
}

/* ===== 细节：高潮章圆环随标题显影；手机端高潮章覆层下移；按压反馈 ===== */
.js-anim:not(.static) #ex-ring{opacity:0;transition:opacity 1.2s var(--ease)}
body:has(#ch-8 .title.visible) #ex-ring,.static #ex-ring,html:not(.js) #ex-ring{opacity:1}
.device-ui button.is-pressed,.card-scene .scene-ui button.is-pressed{border-color:var(--blue-hi);background:var(--blue-soft);transform:scale(.97)}
.d09-knob{fill:#0A1526;stroke:#F2D9A2;stroke-width:1.5;cursor:ew-resize}
@media (max-width:767.98px){
  .expand-overlay{transform:translateY(10%)}
}
/* XingheSerif supplement (auto-generated 2026-09-26): Noto Serif SC variable slices (SIL OFL 1.1) for characters missing from XingheSerif.woff2 */
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-100.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+2264}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-101.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+54E8,U+5E27}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-102.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+5306}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-103.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+62FD,U+6328,U+69DB,U+7784,U+9063}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-104.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+2193,U+50E7,U+67C4}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-105.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+2190,U+566A,U+59A8,U+6084,U+614C,U+8877,U+94A9}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-106.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+2191,U+6070,U+60E7,U+77DB,U+7A84,U+88F9}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-107.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+62FE,U+64A4,U+64CE,U+679A,U+7B5B,U+8C1C}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-108.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+5272,U+53E0,U+5F7C,U+62E8,U+6655,U+6670,U+6CF3,U+75D5,U+76FE,U+788D,U+7EEA,U+87BA,U+8F74,U+901B,U+94AE,U+9614,U+964C}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-109.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4E32,U+5269,U+5389,U+5FAA,U+5FFD,U+60DC,U+64E6,U+6746,U+7C92,U+7EB5,U+8109,U+8352,U+8DF5,U+8FC1,U+8FC8,U+8FEB}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-110.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4F38,U+4FA3,U+503E,U+5141,U+51ED,U+5C18,U+5C1D,U+5C97,U+5F04,U+60EF,U+62D6,U+64C5,U+65C1,U+65E6,U+6846,U+6CBF,U+6EDA,U+78B0,U+8017,U+820D,U+8239,U+8986,U+8D21,U+8E2A,U+8F68,U+8FA8,U+966A,U+96FE,U+9F20}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-111.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4FA7,U+504F,U+59D3,U+5E45,U+5F03,U+5F84,U+5FD9,U+5FE7,U+6062,U+6089,U+60D1,U+6167,U+6234,U+624E,U+6269,U+62B5,U+62D2,U+6325,U+63E1,U+65E2,U+66FF,U+6E10,U+6F5C,U+73CD,U+78E8,U+7F13,U+83F2,U+8DE8,U+9006,U+904D,U+9636}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-112.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4ECD,U+5175,U+52B3,U+56F0,U+56FA,U+5BBE,U+5C3A,U+6015,U+6050,U+6162,U+61C2,U+6297,U+62BD,U+62DF,U+638C,U+6697,U+675F,U+690D,U+6B32,U+6D89,U+6DF7,U+6ED1,U+751A,U+7545,U+7EA0,U+7EB9,U+7ED8,U+7F29,U+8033,U+8651,U+865A,U+89E6,U+8D25,U+8DDD,U+9010,U+907F-9080,U+91CA,U+94FA,U+9694,U+9ED8}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-113.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4E4E,U+4E71,U+5012,U+51B2,U+521A,U+5220,U+523B,U+53E5,U+53EB,U+53F3,U+5438,U+552F,U+5584,U+5706,U+5750,U+59D4,U+5BDF,U+5BFB,U+5C4F,U+5DE6,U+5EAD,U+5EF6,U+6025,U+6258,U+6298,U+62E5,U+62EC,U+65E7,U+6682,U+6740,U+6768,U+6982,U+6D59,U+6E7E,U+6F6E,U+719F,U+732E,U+76D6,U+7840,U+79D2,U+7A33,U+7A97,U+7ADE-7ADF,U+7B26,U+7EC3,U+7F3A,U+80DC,U+8457,U+8BA8,U+8BAD,U+8BEF,U+8DD1,U+8DF3,U+8F6E,U+8FF9,U+900F,U+9057,U+9488,U+955C,U+95F2,U+9644,U+964D,U+9732,U+9759,U+987A}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-114.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4E25,U+4E89,U+4EAE,U+4F11,U+4F19,U+4F24,U+4F34,U+4F59,U+505C,U+51CF,U+5374,U+538B,U+53E6,U+5426,U+542B,U+542F,U+5473,U+5708,U+571F,U+57DF,U+591F,U+5979,U+5A01,U+5B69,U+5BA1,U+5BA3,U+5C42,U+5C81,U+5DEE,U+5E0C,U+5E55,U+5E8F,U+5F02,U+63CF,U+6444,U+64CD,U+65E9,U+66B4,U+66FE,U+677E,U+67B6,U+680F,U+68C0,U+6B7B,U+6C38,U+6C47,U+6D3E,U+7075,U+7565,U+7591,U+7981,U+7A7F,U+7EB3,U+7EC7,U+7EE7,U+7EFF,U+7FFB,U+805A,U+822C,U+82E5,U+84DD,U+8865,U+8BB2,U+8BDA,U+8C01,U+8C08,U+8D1F,U+8DA3,U+8F93,U+8FF0,U+8FF7,U+8FFD,U+9000,U+9047,U+949F,U+9646,U+9669,U+987B,U+987E,U+989D}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-115.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4E49,U+4E60,U+4EB2,U+4EC5,U+4EFD,U+4F3C,U+4F8B,U+5019,U+5145,U+516D,U+5174,U+517B,U+5199,U+51B3,U+51B5,U+5207,U+5212,U+521D,U+52BF,U+5347,U+5370,U+53F2,U+542C,U+547D,U+54CD,U+5883,U+589E,U+5931,U+5947,U+5957,U+5A92,U+5B83,U+5BB3,U+5BCC,U+5C1A,U+5C40,U+5F80,U+5F85,U+5FB7,U+5FD7,U+601D,U+626B,U+6309,U+6545,U+65C5,U+666E,U+671B,U+6790,U+6838-6839,U+6B62,U+6BB5,U+6D4B,U+6E29,U+6EE1,U+6F14,U+6F2B,U+72B6,U+7387,U+753B,U+76CA,U+76D8,U+773C,U+77ED,U+7814,U+79BB,U+79D8,U+79FB,U+7A76,U+7B54,U+7BC7,U+7D20,U+7EAA,U+7EDD,U+7FA4,U+804C,U+80CC,U+8111,U+817E,U+8303,U+843D,U+89C9,U+89D2,U+8BC9,U+8BCD,U+8C61,U+8D22,U+8D8A,U+8F6F,U+8F7B,U+8F83,U+8FB9,U+8FDC,U+9002,U+9519,U+95ED,U+968F-9690,U+96BE,U+9876,U+9884,U+98DE,U+9988}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-116.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+300A-300B,U+4E16,U+4E66,U+4E70,U+4E92,U+4E94,U+4E9B,U+4ECA,U+4F18,U+4F46,U+4F4E,U+4F9B,U+4FEE,U+503C,U+50CF,U+5148,U+518D,U+51C6,U+51E0,U+5217,U+529E-529F,U+5341,U+5361,U+5386,U+53C2,U+53C8,U+53CC,U+5404,U+5411,U+5417,U+5468,U+559C,U+56E0,U+56ED,U+5740,U+57FA,U+58EB,U+5904,U+592A,U+5B58,U+5BC6,U+5E08,U+5E93,U+5F15,U+5F20,U+5F3A,U+5F88,U+5F8B,U+5FC5,U+600E,U+620F,U+6218,U+62A4,U+62E9,U+6307,U+636E,U+64AD,U+6539,U+6548,U+6574,U+6613,U+663E,U+6750,U+6784,U+6B65,U+6DF1,U+7167,U+73AF,U+7403,U+754C,U+7740,U+786E,U+798F,U+79F0,U+7B7E,U+7EA6,U+8003,U+81F3,U+822A,U+82F1,U+83B7,U+8425,U+89C2,U+89C8,U+8BB8,U+8BC6,U+8BD5,U+8BED,U+8C03,U+8DB3,U+8FD1,U+9020,U+90A3,U+914D,U+91C7,U+952E,U+9605,U+9645,U+9664,U+9752,U+97F3,U+9886}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-117.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4E1C,U+4E24,U+4E50,U+4E5F,U+4E8C,U+4ECE,U+4EF6-4EF7,U+4F20,U+4F55,U+4F7F,U+4FDD,U+514D,U+5171,U+5177,U+518C,U+51FB,U+5229,U+522B,U+5305,U+5355,U+5357,U+5373,U+539F,U+53BB,U+53CA,U+53CD,U+53D6,U+53E3,U+5458,U+56DB,U+573A,U+58F0,U+590D,U+5934,U+5B98,U+5BB9,U+5BFC,U+5C06,U+5C11,U+5C55,U+5DF2,U+5E03,U+5E38,U+5F71,U+6001,U+603B,U+611F,U+624D,U+6253,U+6301,U+6392,U+6559,U+6599,U+6761,U+67E5,U+6807,U+6837,U+683C,U+6B22,U+6B64,U+6BD4,U+6C34,U+6CA1,U+6D41,U+6D77,U+6D88,U+6E38,U+7136,U+7231,U+7531,U+767E,U+76F4,U+7801,U+793A,U+7A0B,U+7A7A,U+7AE0,U+7CBE,U+7EA7,U+7ED9,U+7EDF,U+7F6E,U+8001,U+8272,U+8350,U+88C5,U+897F,U+89E3,U+8A00,U+8BA4,U+8BAE-8BAF,U+8BC1,U+8BC4,U+8BFB,U+8D28,U+8D85,U+8DEF,U+8F6C,U+8F7D,U+8FD0,U+9009,U+91CC-91CD,U+91CF,U+96C6,U+9891,U+98CE}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-118.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4E4B,U+4E86,U+4EE4,U+4EEC,U+4F4D,U+4F60,U+5176,U+5185,U+51FA,U+5236,U+52A1,U+533A,U+53F7,U+540C-540E,U+544A,U+5907,U+5916,U+5929,U+597D,U+5982,U+5B50,U+5B89,U+5B9A,U+5BF9,U+5C0F,U+5E02,U+5E7F,U+5EA6,U+5F0F,U+5F53,U+5F55,U+6027,U+606F,U+610F,U+6240,U+624B,U+62A5,U+63A8,U+6587,U+65B9,U+670D,U+6B63,U+6CBB,U+6CD5,U+6CE8,U+7247-7248,U+7269,U+7279,U+767B,U+76F8,U+7AD9,U+7B49,U+7EBF,U+85CF,U+8981,U+89C6,U+8BDD,U+8BF7,U+8FD8,U+9053,U+90E8,U+91D1,U+95E8,U+95EE,U+95F4,U+9762,U+9875,U+9898,U+9996,U+9AD8}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-119.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+4E2D,U+65E5,U+6708}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-50.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+7901}
@font-face{font-family:'XingheSerif';src:url('fonts/xinghe-latin.woff2') format('woff2');font-weight:200 900;font-display:swap;unicode-range:U+2018-2019}