#chapter-navigator {position:absolute;inset:0;z-index:55;overflow:hidden;background:#071c182e;color:#193e3b;font-family:var(--ui-font-title);overscroll-behavior:contain;touch-action:none;container-type:size;}
.navigator-sheet {position:absolute;container-type:inline-size;isolation:isolate;}
.navigator-paper {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;}
.navigator-content {position:absolute;inset:0;opacity:1;}
.navigator-closed {position:absolute;left:50%;top:50%;width:40%;height:auto;transform:translate(-50%,-50%);opacity:0;pointer-events:none;}
#chapter-navigator button {font-family:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}
#chapter-navigator header {position:absolute;inset:0;margin:0;padding:0;border:0;background:none;pointer-events:none;}
#chapter-navigator header>div {position:absolute;left:50%;top:17%;transform:translateX(-50%);width:48%;text-align:center;}
#chapter-navigator header small {font-size:26px;letter-spacing:.16em;color:#36544a;}
#chapter-navigator h2 {font-size:clamp(36px,3cqw,44px);font-weight:500;letter-spacing:.10em;margin:2px 0;color:#193e3b;text-shadow:0 1px 5px #fff5dc;}
#chapter-navigator :is(header,footer)>button {position:absolute;font-size:clamp(22px,1.9cqw,28px);min-height:46px;padding:8px 12px;color:#284b43;border:0;border-bottom:1px solid #8d795b80;background:radial-gradient(ellipse,#f4eddaac,transparent 75%);pointer-events:auto;}
#chapter-navigator header>button {left:10%;top:18%;}
#chapter-navigator footer>button {right:10%;top:18%;}
.navigator-viewport {position:absolute;inset:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior:contain;pointer-events:none;touch-action:none;}
.navigator-viewport::-webkit-scrollbar {display:none;}
.navigator-track {position:relative;height:100%;min-width:100%;pointer-events:none;}
.navigator-ink {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.navigator-ink path {fill:none;stroke:#31594bc0;stroke-width:2;stroke-linecap:round;stroke-dasharray:1;paint-order:stroke;filter:none;}
.navigator-ink path.ink-growing {animation:ink-extend .9s ease-out both;}
.navigator-ink path.ink-gold {stroke:#c1ab73;stroke-width:.65;opacity:.45;}
#chapter-navigator .chapter-node {position:absolute;transform:translate(-50%,-50%);width:clamp(104px,10.5cqw,150px);height:clamp(104px,10.5cqw,150px);min-width:0;min-height:0;max-width:none;padding:0;border:0;background:transparent;color:#23423e;pointer-events:auto;transition:scale .22s;overflow:visible;}
.node-orb {display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;}
.chapter-node strong {position:absolute;top:100%;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:clamp(28px,2.3cqw,32px);line-height:1.3;font-weight:600;letter-spacing:.025em;text-shadow:0 1px 3px #fff8e9,0 0 8px #f7f0d9;background:radial-gradient(ellipse,#f5eddbcf,transparent 75%);padding:2px 8px;}
#chapter-navigator .chapter-node small {position:absolute;top:calc(100% + 43px);left:50%;transform:translateX(-50%);white-space:nowrap;color:#526259;font-size:22px;line-height:1.35;text-shadow:0 1px 4px #fff7e1;}
#chapter-navigator .node-active small {color:#315b4b;font-size:24px;}
.node-mark {position:absolute;top:calc(100% + 42px);left:50%;transform:translateX(-50%) rotate(-6deg);padding:1px 7px;white-space:nowrap;font-size:clamp(24px,2cqw,28px);line-height:1.3;letter-spacing:.12em;color:#874c40;border:1px solid #a56f5e80;background:#f3eadc80;}
.node-active .node-orb {animation:node-breathe 3.2s ease-in-out infinite;}
.node-completed .node-orb {filter:drop-shadow(0 0 3px #c4a95c55);}
.node-locked .node-orb {opacity:.72;}
.node-future .node-orb {opacity:.4;}
.node-future::after {content:'';position:absolute;inset:10%;pointer-events:none;background:radial-gradient(ellipse,#d3d7cb55,transparent 75%);}
#chapter-navigator .chapter-node[aria-pressed=true] {scale:1.055;}
.chapter-node[aria-pressed=true] .node-orb {filter:drop-shadow(0 0 7px #b6a36e80);}
.navigator-detail {position:absolute;left:12%;right:12%;bottom:12%;display:flex;align-items:center;justify-content:center;gap:18px;min-height:64px;text-align:center;pointer-events:none;background:radial-gradient(ellipse,#f2ead6d9,transparent 74%);}
.navigator-detail>div {display:flex;align-items:baseline;justify-content:center;gap:10px;white-space:nowrap;min-width:0;padding:5px 14px;background:radial-gradient(ellipse,#f5eedcf2 0 75%,#f5eedc90 88%,transparent 100%);}
#chapter-navigator .navigator-detail :is(p,small) {margin:2px 0;color:#355046;}
.navigator-detail small {font-size:22px;}
.navigator-detail h3 {font-size:clamp(28px,2.5cqw,34px);font-weight:500;line-height:1.25;margin:3px 0;color:#193e3b;}
#chapter-navigator .navigator-detail p {font-size:clamp(24px,2cqw,28px);line-height:1.35;}
#chapter-navigator .navigator-detail button {pointer-events:auto;padding:12px 25px;min-height:56px;min-width:175px;font-size:clamp(26px,2.2cqw,30px);color:#fff3d6;background:#214e45;border:1px solid #b59c60;white-space:nowrap;}
#chapter-navigator button:focus-visible {outline:2px solid #967132;outline-offset:4px;}
#chapter-navigator :is(header,footer)>button:hover {color:#815e2b;}
#chapter-navigator footer {position:absolute;inset:0;margin:0;padding:0;background:none;border:0;pointer-events:none;}
.navigator-notice {position:absolute;left:25%;right:25%;bottom:5%;font-size:22px;color:#744a3c;text-align:center;}
.navigator-entry-ink {position:absolute;inset:0;z-index:10;pointer-events:none;opacity:0;background:radial-gradient(ellipse at var(--ink-x,50%) var(--ink-y,50%),#102b28 0 55%,#18382fcc 65%,#18382f00 72%);transform:scale(.02);transform-origin:var(--ink-x,50%) var(--ink-y,50%);}
.navigator-entering .navigator-entry-ink {animation:volume-ink-entry .65s ease-in both;}
.navigator-entering .chapter-node:not([aria-pressed=true]) {opacity:.35;transition:opacity .3s;}
.navigator-entering .chapter-node[aria-pressed=true] {scale:1.12;}
.navigator-opening .navigator-paper {animation:volume-unfurl .9s ease-out both;}
.navigator-opening .navigator-closed {animation:volume-closed-open .9s ease-out both;}
.navigator-opening .navigator-content {opacity:0;pointer-events:none;}
.navigator-opening .navigator-content * {pointer-events:none!important;}
.navigator-closing .navigator-paper {animation:volume-refold .4s ease-in both;}
.navigator-closing .navigator-closed {animation:volume-closed-return .4s ease-out both;}
.navigator-closing .navigator-content {opacity:0;pointer-events:none;}
.navigator-closing .navigator-content * {pointer-events:none!important;}
.navigator-active :is(#joystick,#dash,#interact,#interact-hint,#journey-open,.quest-hud) {visibility:hidden!important;pointer-events:none!important;}
@keyframes volume-closed-open {0%,15%{opacity:1;transform:translate(-50%,-50%) scale(.85);}55%{opacity:.6;transform:translate(-50%,-50%) scale(1.08);}100%{opacity:0;transform:translate(-50%,-50%) scale(1.14);}}
@keyframes volume-unfurl {0%,15%{opacity:0;transform:scale(.82);}100%{opacity:1;transform:scale(1);}}
@keyframes volume-refold {to{opacity:0;transform:scale(.85);}}
@keyframes volume-closed-return {from{opacity:0;transform:translate(-50%,-50%) scale(1.08);}to{opacity:1;transform:translate(-50%,-50%) scale(.9);}}
@keyframes volume-ink-entry {0%{opacity:0;transform:scale(.02);}25%{opacity:.8;}100%{opacity:1;transform:scale(4);}}
@keyframes ink-extend {from{stroke-dashoffset:1;}to{stroke-dashoffset:0;}}
@keyframes node-breathe {50%{filter:drop-shadow(0 0 4px #bea25b65);}}
@media(prefers-reduced-motion:reduce) {#chapter-navigator * {animation:none!important;transition:none!important;}}
/* Five-volume exhibition: labels follow the same normalized plane as Phaser. */
.volume-hub-labels {position:absolute;inset:0;z-index:12;pointer-events:none;container-type:inline-size;transition:opacity .25s;}
.volume-hub-label {position:absolute;translate:-50% 18px;display:flex;align-items:center;flex-direction:column;white-space:nowrap;text-align:center;color:#173e37;font-family:var(--ui-font-title);text-shadow:0 1px 3px #fff7df,0 0 7px #f4ecd8;background:radial-gradient(ellipse,#f5eddb8c,transparent 75%);}
.volume-hub-label>span {font-size:clamp(26px,2.2cqw,30px);font-weight:600;line-height:1.2;}
.volume-hub-label>strong {font-size:clamp(32px,2.6cqw,38px);font-weight:600;line-height:1.2;margin-top:2px;}
.volume-hub-label>small {font-size:22px;line-height:1.3;margin-top:3px;color:#34534a;}
.volume-hub-label>em {font:500 clamp(22px,1.8cqw,26px)/1.3 var(--ui-font-body);margin-top:12px;font-style:normal;}
.volume-locked>em:empty {display:none;}
.volume-hub-expanded {opacity:0;}
#stage:not(.hub-active)>.volume-hub-labels {display:none;}
#chapter-navigator :is(header,footer)>button {min-height:62px;padding:14px 22px;font-size:clamp(26px,2.1cqw,30px);line-height:1.25;border:1px solid #b59b6599;border-radius:4px;background:linear-gradient(110deg,#f4eedddb,#e0eadee0);box-shadow:inset 0 0 0 2px #f5efdb77,0 2px 7px #264c3e18;transition:scale .2s,box-shadow .2s,border-color .2s;}
#chapter-navigator header>button {left:13%;top:18%;}
#chapter-navigator footer>button {right:13%;top:18%;}
#chapter-navigator :is(header,footer)>button:is(:hover,:focus-visible,:active) {scale:1.04;border-color:#d0ad60;box-shadow:inset 0 0 0 2px #fff5d177,0 0 12px #d2b77766;}
#chapter-navigator h2 {width:max-content;max-width:100%;margin:2px auto;}
.volume-primary>em {opacity:0;transition:opacity .2s;}
.volume-primary.is-near>em {opacity:1;}
.volume-actions {position:absolute;right:clamp(24px,3vw,52px);bottom:clamp(24px,4vh,46px);display:flex;gap:14px;align-items:center;z-index:4;}
#chapter-navigator .volume-actions>button {min-height:62px;padding:14px 22px;font-size:clamp(26px,2.1cqw,30px);line-height:1.25;color:#284b43;border:1px solid #b59b6599;border-radius:4px;background:linear-gradient(110deg,#f4eedddb,#e0eadee0);box-shadow:inset 0 0 0 2px #f5efdb77,0 2px 7px #264c3e18;transition:scale .2s,border-color .2s,box-shadow .2s;white-space:nowrap;}
#chapter-navigator .volume-actions>button:is(:hover,:focus-visible,:active) {scale:1.03;border-color:#d0ad60;box-shadow:0 0 12px #d2b77766;}
#chapter-navigator .navigator-detail {left:0;right:28%;bottom:11%;min-height:56px;}
#chapter-navigator .navigator-detail>div {flex-wrap:wrap;white-space:normal;max-width:420px;gap:2px 10px;}
#chapter-navigator .navigator-detail>div>p {flex-basis:100%;}
@media(max-width:700px){.volume-actions{flex-direction:column;gap:12px;right:20px;bottom:20px;}#chapter-navigator .volume-actions>button{padding:12px 18px;min-height:44px;}}

/* Literary text only: instructions and secondary controls retain the body font. */
#chapter-navigator {font-family:var(--ui-font-body);}
#chapter-navigator header :is(small,h2),.volume-hub-label>:is(span,strong,small),.node-caption :is(strong,.node-author),#chapter-navigator [data-nav=enter] {font-family:var(--wenjing-literary);}
.node-caption {position:absolute;left:50%;top:100%;translate:-50% 0;display:flex;align-items:center;flex-direction:column;width:max-content;max-width:260px;padding:0 5px 4px;background:radial-gradient(ellipse,#eee6d09c,transparent 75%);pointer-events:none;}
.chapter-node .node-caption strong {position:static;transform:none;font-size:clamp(32px,2.6cqw,38px);font-weight:500;line-height:1.2;padding:0 3px;background:none;}
.node-author {font-size:clamp(22px,1.9cqw,26px);line-height:1.3;color:#365449;}
.node-chapter-label {position:absolute;bottom:100%;font-size:22px;color:#4c5e50;opacity:0;transition:opacity .25s;text-shadow:0 1px 4px #fff4d4;}
.chapter-node[aria-pressed=true] .node-chapter-label {opacity:1;}
.chapter-node[aria-pressed=true] .node-caption {background:radial-gradient(ellipse,#f3e9cfb0,transparent 75%);}
#chapter-navigator .chapter-node>small {top:calc(100% + 77px);font-size:22px;opacity:.8;}
.chapter-node .node-mark {top:calc(100% + 78px);font-size:22px;padding:0 5px;line-height:1.2;}
#chapter-navigator .navigator-detail {left:12%;right:auto;bottom:9%;min-height:64px;background:none;}
#chapter-navigator .navigator-detail>p {font-size:24px;}
#chapter-navigator .navigator-detail [data-nav=enter] {position:relative;box-sizing:border-box;min-width:180px;width:210px;max-width:220px;height:64px;min-height:58px;padding:8px 20px;font-size:clamp(30px,2.6cqw,34px);line-height:1.3;color:#234a40;background:linear-gradient(110deg,#f7efdc,#dfead9 60%,#f2ead2);border:1px solid #bda16a;border-radius:3px 9px 3px 9px;box-shadow:inset 0 0 0 3px #fff6de80,0 2px 6px #224a3426;transition:border-color .2s,box-shadow .2s;}
#chapter-navigator [data-nav=enter]::before,#chapter-navigator [data-nav=enter]::after {content:'';position:absolute;top:18%;bottom:18%;width:4px;border-block:1px solid #aa8a4f;}
#chapter-navigator [data-nav=enter]::before {left:8px;border-left:1px solid #aa8a4f;}
#chapter-navigator [data-nav=enter]::after {right:8px;border-right:1px solid #aa8a4f;}
#chapter-navigator [data-nav=enter]:is(:hover,:focus-visible) {border-color:#d5af58;box-shadow:inset 0 0 0 3px #fff6de80,0 0 12px #d8ba7860;}
#chapter-navigator .volume-actions>button {min-height:52px;font-size:clamp(24px,2cqw,27px);padding:10px 18px;background:linear-gradient(110deg,#f0ead69c,#dfe8d79c);color:#426054;border-color:#a9976e77;box-shadow:none;}

/* Supplied local faces; visual-only revision, node/image coordinates unchanged. */
#chapter-navigator.navigator-font-fallback {--wenjing-literary:'Noto Serif TC','Songti TC','PMingLiU',serif;--wenjing-stamp:var(--wenjing-literary);}
#chapter-navigator header small {font:500 clamp(28px,2.4cqw,32px)/1.25 var(--wenjing-literary);opacity:.8;}
#chapter-navigator h2 {font:500 clamp(42px,3.7cqw,50px)/1.2 var(--wenjing-literary);letter-spacing:.07em;color:#183f39;text-shadow:0 1px 3px #d6b87555;}
.chapter-node .node-caption strong {font-family:var(--wenjing-literary);font-size:clamp(32px,2.8cqw,38px);font-weight:500;letter-spacing:.03em;color:#183f39;text-shadow:0 1px 3px #f3e8cd;}
.node-caption .node-author {font:500 clamp(24px,2.1cqw,27px)/1.3 var(--wenjing-literary);opacity:.75;}
.chapter-node .node-mark {font:400 clamp(26px,2.3cqw,30px)/1.15 var(--wenjing-stamp);color:#975e50;opacity:.82;transform:translateX(-50%) rotate(-1.5deg);border:1px solid #a578628c;border-radius:1px;background:#e9d8bd35;box-shadow:inset 0 0 0 2px #f1e5ce70;letter-spacing:.06em;}
.node-locked .node-caption,.node-locked>small {opacity:.52;}
.node-locked .node-orb {filter:none;animation:none;}
#chapter-navigator .node-future>small {font-family:var(--wenjing-literary);}
.chapter-node[aria-pressed=true] .node-caption {padding:5px 12px 7px;background:rgba(250,246,230,.72);border-block:1px solid #bda47055;}
.chapter-node[aria-pressed=true] .node-chapter-label {font:500 clamp(24px,2.1cqw,27px)/1.3 var(--ui-font-body);opacity:.7;bottom:calc(100% + 4px);}
.chapter-node[aria-pressed=true] .node-caption strong {font-size:clamp(38px,3.3cqw,44px);}
.chapter-node[aria-pressed=true] .node-author {font-size:clamp(26px,2.4cqw,30px);margin-top:6px;}
#chapter-navigator .chapter-node[aria-pressed=true] .node-mark,#chapter-navigator .chapter-node[aria-pressed=true]>small {top:calc(100% + 114px);}
#chapter-navigator .chapter-node[aria-pressed=true] .node-mark {top:calc(100% + 76px);left:calc(50% + 100px);}
#chapter-navigator .navigator-detail [data-nav=enter] {width:220px;max-width:230px;min-width:190px;height:66px;min-height:60px;padding:8px 18px;font:500 clamp(31px,2.8cqw,35px)/1.3 var(--wenjing-literary);letter-spacing:.08em;color:#183f39;background:linear-gradient(110deg,#faf4e6e8,#e6eee0e8 60%,#f6efdde8);border:1px solid #bfa76e;border-radius:5px;transition:transform .18s,border-color .18s,background .18s,box-shadow .18s;}
#chapter-navigator [data-nav=enter]::before,#chapter-navigator [data-nav=enter]::after {top:50%;bottom:auto;width:9px;height:1px;border:0;background:#af9157;}
#chapter-navigator [data-nav=enter]:is(:hover,:focus-visible) {transform:translateY(-2px) scale(1.02);border-color:#d5b66f;background:linear-gradient(110deg,#fff9e9,#eef3e7);box-shadow:0 2px 9px #c9b17b40;}
#chapter-navigator [data-nav=enter]:active {transform:scale(.98);}
#chapter-navigator .volume-actions>button {font:500 clamp(26px,2.3cqw,29px)/1.25 var(--wenjing-literary);background:linear-gradient(110deg,#f3edda88,#e2e9dc88);border:1px solid #b6a37d66;box-shadow:none;}
@media(prefers-reduced-motion:reduce){#chapter-navigator [data-nav=enter]{transition:none;}}

/* Trial chapters use the same node and CTA; only the selected detail adds context. */
#chapter-navigator {z-index:calc(var(--ui-z-menu,65) + 1);}
#chapter-navigator .navigator-detail:has(.navigator-trial-info) {bottom:3%;gap:18px;}
#chapter-navigator .navigator-trial-info {display:block;width:240px;max-width:240px;padding:4px 8px;}
#chapter-navigator .navigator-trial-info small {font-size:20px;}
#chapter-navigator .navigator-trial-info h3 {font:500 28px/1.2 var(--wenjing-literary);white-space:nowrap;margin:2px 0;}
#chapter-navigator .navigator-trial-info p {font-size:22px;white-space:nowrap;}
#chapter-navigator [data-nav=enter]:disabled {opacity:.55;cursor:default;transform:none;}

/* The paper and title stay fixed; only one four-slot route layer turns. */
.navigator-route-layer {position:absolute;inset:0;overflow:hidden;}
#chapter-navigator .navigator-viewport {overflow:hidden;}
#chapter-navigator .navigator-track {width:100%;}
#chapter-navigator .navigator-page-arrow {position:absolute;top:46%;translate:-50% -50%;z-index:5;width:52px;height:56px;min-width:48px;min-height:48px;padding:0;border:1px solid #a68c5855;border-radius:4px;background:#efe6ce90;color:#315649;font:500 38px/1 var(--wenjing-literary);}
.navigator-page-arrow.page-previous {left:11%;}
.navigator-page-arrow.page-next {left:89%;}
#chapter-navigator .navigator-page-arrow:disabled {opacity:.23;cursor:default;}
#chapter-navigator .navigator-page-arrow:not(:disabled):hover {border-color:#b39855;background:#f4ecd8;}
.navigator-ink path.ink-future {opacity:.14;stroke-dasharray:3 9;}
.navigator-ink path.ink-continuation {opacity:.3;stroke-dasharray:2 8;}
#chapter-navigator .node-future {cursor:default;}
#chapter-navigator .chapter-node[aria-pressed=true] .node-mark {left:50%;top:calc(100% + 80px);}

/* Shared data, native wheel/touch scrolling, unchanged text scale for every row. */
#journey .journey-progress-scroll {height:clamp(220px,32vh,280px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#68867855 transparent;text-align:left;margin:12px 0 18px;padding:0 8px;}
#journey .title-screen .journey-progress-scroll {height:clamp(180px,28vh,260px);}
#journey .journey-progress-row {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;padding:4px 6px;border-bottom:1px solid #d3c19522;font:500 var(--ui-body)/1.7 var(--ui-font-body);color:var(--ui-ivory);}
#journey .journey-progress-row>span:first-child {white-space:nowrap;}
#journey .journey-progress-row .progress-state {color:#d9c395;white-space:nowrap;}
#journey .journey-progress-row button {flex-shrink:0;margin:0;min-height:48px;padding:8px 14px;font-size:24px;}
#journey .progress-heading {margin-bottom:0;text-align:left;}
#journey .journey-progress-scroll:focus-visible {outline:2px solid #bca56b;outline-offset:2px;}
#journey .journey-progress-scroll::-webkit-scrollbar {width:5px;}
#journey .journey-progress-scroll::-webkit-scrollbar-thumb {background:#68867855;border-radius:4px;}
#journey .chapter-sheet .journey-progress-scroll {height:clamp(280px,44vh,420px);}
#journey .chapter-sheet .journey-progress-row {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 14px;}
#journey .chapter-sheet .journey-progress-row>span:first-child {grid-column:1;font:600 var(--ui-h2)/1.4 var(--ui-font-title);}
#journey .chapter-sheet .journey-progress-row>.progress-state {grid-column:1;}
#journey .chapter-sheet .journey-progress-row>button {grid-column:2;grid-row:1/span 2;}
@media(max-width:850px){#journey .journey-progress-row {flex-wrap:wrap;justify-content:flex-start;}#journey .journey-progress-row button {margin-left:auto;}}
