@charset "UTF-8";
:root{color-scheme:dark;--bg:#081719;--surface:#102326;--line:#294144;--muted:#94aaa9;--ink:#e7efea;--mint:#8fe4cf;--gold:#d3b886;--serif:"STZhongsong","SimSun",serif;--sans:"Microsoft YaHei UI","Microsoft YaHei",system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14px}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,input,textarea,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.45}a{color:inherit;text-decoration:none}button{background:transparent;border:0}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--mint);outline-offset:5px}button:hover{color:var(--mint)}.header{height:92px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 3.8%;gap:24px}.brand{display:flex;gap:13px;align-items:center;white-space:nowrap}.brand>span{font-family:var(--serif);font-size:23px;letter-spacing:5px}.brand small{display:block;font:8px var(--sans);letter-spacing:2.4px;color:var(--muted);margin-top:6px}.header nav{display:flex;height:100%;gap:34px}.header nav button{position:relative;font-size:14px;letter-spacing:2px;padding:0 2px;white-space:nowrap;color:var(--muted)}.header nav .active{color:var(--ink)}.header nav .active:after{content:"";position:absolute;bottom:0;height:3px;left:0;right:0;background:var(--mint);box-shadow:0 0 18px #8fe4cf55}.header-actions{display:flex;align-items:center;gap:22px}.local-status{color:var(--muted);font-size:11px;white-space:nowrap}.local-status i,.live-dot{width:5px;height:5px;background:var(--mint);border-radius:50%;display:inline-block;margin-right:8px;box-shadow:0 0 10px var(--mint)}.icon-button{font-size:28px}.skip{position:fixed;top:-80px;left:20px;z-index:100;background:var(--mint);color:var(--bg);padding:12px}.skip:focus{top:8px}main{min-height:calc(100vh - 149px);outline:none}footer{border-top:1px solid var(--line);min-height:57px;padding:17px 3.8%;display:flex;justify-content:space-between;gap:18px;color:var(--muted);font-size:10px;letter-spacing:1px;line-height:1.8}.footer-divider{padding:0 10px;color:var(--line)}footer button{font-size:10px;padding:0}.explore{display:grid;grid-template-columns:320px minmax(300px,1fr) 280px;min-height:calc(100vh - 149px);max-width:1800px;margin:auto;padding:35px 3.8% 24px;gap:24px}.eyebrow{font:10px var(--sans);letter-spacing:3px;color:var(--mint);text-transform:uppercase;display:flex;align-items:center;gap:10px}.eyebrow:before{content:"";width:20px;height:1px;background:var(--mint)}h1,h2,h3,p{margin-top:0}h1{font:52px/1.35 var(--serif);letter-spacing:6px;margin:25px 0 17px}h1 em{font-style:normal;color:var(--gold)}.intro{line-height:2;color:var(--muted);font-size:12px;max-width:285px}.hero-caption{margin:10px 0 20px;color:var(--gold);font-size:11px;letter-spacing:3px}.stats{display:flex;gap:28px;margin:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:19px 0}.stat strong{font:29px Georgia,serif;display:block;color:var(--gold)}.stat strong small{font:11px var(--sans);margin-left:4px}.stat>span{display:block;color:var(--muted);font-size:10px;margin-top:7px}.section-label{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:2px;margin:19px 0 12px}.section-label span{font-size:9px;color:var(--muted);letter-spacing:1px}.periods{display:flex;gap:5px}.periods button{flex:1;border:1px solid var(--line);padding:9px 1px;font-size:11px;color:var(--muted)}.periods button.active{background:#8fe4cf12;border-color:#8fe4cf88;color:var(--mint)}.period-copy{color:var(--muted);font-size:11px;line-height:1.9;min-height:65px;margin:12px 0 15px}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:17px;padding:12px 17px;letter-spacing:2px;font-size:12px;border:1px solid var(--line)}.primary{background:var(--mint);color:#0c2523;border-color:var(--mint)}.primary:hover{background:#b1f3df;color:#0c2523}.secondary:hover{border-color:var(--mint)}.tour-button{width:100%;margin-top:8px;justify-content:space-between}.key-hint{font-size:9px;color:var(--muted);margin-top:10px;line-height:1.8}.map-panel{position:relative;min-height:590px;overflow:hidden;background:radial-gradient(ellipse at 48% 45%,#1b414438,transparent 66%)}.map-top{position:absolute;top:0;left:14px;right:14px;display:flex;justify-content:space-between;align-items:center;z-index:2;font-size:10px;letter-spacing:2px;color:var(--muted)}.map-top strong{font-weight:400;color:var(--ink)}.map{display:block;width:100%;height:100%;min-height:590px;max-height:810px;overflow:visible}.gridline{stroke:#214246;stroke-width:.6}.map-land{fill:#102b2b55;stroke:#31504d;stroke-width:.7}.axis-line{stroke:var(--gold);stroke-width:1;stroke-dasharray:5 5}.axis-glow{stroke:#cdb68535;stroke-width:12;filter:blur(5px)}.node{cursor:pointer;outline:none;color:#82b9af}.node:focus .node-circle,.node:hover .node-circle{stroke:white;stroke-width:2}.node-label{font:10px var(--sans);fill:#a7bcb7;letter-spacing:.7px}.node.active .node-label{fill:#f0d7a3}.node.active{color:#e7c58a}.node-circle{fill:var(--bg);stroke:currentColor;stroke-width:1.2}.node.active .node-circle{fill:#d3b886}.node-shape{fill:#163331;stroke:currentColor;stroke-width:.7}.map.period-yuan .node:not([data-id="bell"]):not([data-id="bridge"]){opacity:.17}.map.period-ming .node[data-id="square"]{opacity:.2}.map.period-qing .node[data-id="square"]{opacity:.2}.map-note{position:absolute;bottom:9px;left:14px;right:14px;font-size:9px;color:#789391;letter-spacing:1px;display:flex;justify-content:space-between}.compass{position:absolute;right:15px;bottom:42px;color:var(--gold);text-align:center;font:11px Georgia;line-height:1.7}.compass span{display:block;font-size:25px}.map-scan{stroke:#a2e9d1;opacity:.35;stroke-width:1;animation:scan 8s linear infinite}@keyframes scan{from{transform:translateY(-220px)}to{transform:translateY(320px)}}.detail{padding-top:6px}.detail-top{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:2px;padding-bottom:18px;border-bottom:1px solid var(--line)}.detail-top span:last-child{color:var(--mint)}.node-number{font:11px Georgia;color:var(--gold);letter-spacing:3px;margin-top:26px}.detail h2{font:33px var(--serif);letter-spacing:4px;margin:9px 0 10px}.detail-subtitle{font-size:11px;line-height:1.8;color:var(--gold);margin-bottom:14px}.building-view{height:150px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#22504450,transparent 70%);border-bottom:1px solid var(--line);margin-bottom:19px}.building-view svg{width:190px;height:140px;overflow:visible;color:var(--gold)}.building-view .node-shape{stroke-width:.6;fill:#193a33}.knowledge{padding-bottom:14px}.knowledge h3{font-size:11px;color:var(--mint);font-weight:400;letter-spacing:2px;margin:0 0 7px}.knowledge p{font-size:11px;line-height:1.9;color:var(--muted);margin-bottom:0}.node-nav{display:flex;gap:9px;margin-top:8px}.node-nav button{padding:10px 5px;border:1px solid var(--line);flex:1;font-size:11px}.node-nav .bookmark{flex:0 0 42px;font-size:18px}.tour-progress{height:2px;background:var(--line);margin-top:14px}.tour-progress>div{height:100%;background:var(--mint);transition:width .3s}.page{padding:42px 5% 38px;max-width:1530px;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:30px}.page-heading h1{font-size:37px;margin:14px 0 9px}.page-heading p{color:var(--muted);line-height:1.8;font-size:12px;margin-bottom:0;max-width:640px}.notice{font-size:11px;line-height:1.8;color:var(--gold);border-left:2px solid var(--gold);padding-left:12px;max-width:340px}.protection-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:40px}.panel{border:1px solid var(--line);background:#10252855;padding:24px}.panel h2{font:23px var(--serif);letter-spacing:3px;margin-bottom:18px}.panel h3{font-size:13px;font-weight:400;letter-spacing:1px}.small{font-size:11px;color:var(--muted);line-height:1.9}.model{height:285px;position:relative;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(0deg,transparent 0 23px,#8fe4cf07 24px),repeating-linear-gradient(90deg,transparent 0 23px,#8fe4cf07 24px);overflow:hidden}.model svg{height:240px;width:340px;color:var(--gold);transition:transform .4s}.model.scan-mode svg{filter:drop-shadow(0 0 9px #8fe4cf66);color:var(--mint)}.model-tag{position:absolute;bottom:10px;left:12px;font-size:9px;color:var(--muted);letter-spacing:2px}.range-row{display:flex;gap:15px;align-items:center;margin-top:16px;font-size:11px}.range-row input{accent-color:var(--mint);flex:1}.range-row output{width:35px;text-align:right}.switches{display:flex;gap:8px;margin:16px 0}.switches button{border:1px solid var(--line);padding:8px 14px;font-size:11px}.switches .active{border-color:var(--mint);color:var(--mint);background:#8fe4cf0c}.sensor-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border-bottom:1px solid var(--line);padding:10px 0 22px}.sensor-grid strong{font:29px Georgia;color:var(--mint);display:block;margin:8px 0}.sensor-grid span,.sensor-grid small{font-size:10px;color:var(--muted)}.chart{width:100%;height:155px;margin-top:16px}.chart text{fill:var(--muted);font:10px var(--sans)}.sensor-state{display:flex;justify-content:space-between;padding:14px 0;font-size:11px;color:var(--mint)}.sensor-state.warning{color:#f2b27f}.sensor-explain{min-height:44px;margin:4px 0 17px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:30px;border-top:1px solid var(--line)}.step{padding:20px 20px 0 0}.step b{font:22px Georgia;color:var(--gold)}.step h3{font-size:13px;font-weight:400;margin:12px 0 9px}.step p{color:var(--muted);font-size:11px;line-height:1.9}.routes{display:grid;grid-template-columns:1fr 1fr;gap:24px}.route-no{color:var(--gold);font:11px Georgia;letter-spacing:2px}.route-title{margin:12px 0;color:var(--mint);line-height:1.8}.task-list{list-style:none;padding:0;margin:17px 0}.task-list li{font-size:12px;color:var(--muted);line-height:1.9;padding:7px 0;border-bottom:1px solid #29414488}.task-list li:before{content:"+";color:var(--mint);padding-right:10px}.archive-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:29px 0 16px}.archive-head h2{font:23px var(--serif);letter-spacing:2px;margin:0}.actions{display:flex;gap:10px;flex-wrap:wrap}.actions button,.upload-label{font-size:11px;border:1px solid var(--line);padding:9px 12px;cursor:pointer}.actions button:hover,.upload-label:hover{border-color:var(--mint)}.empty{border:1px dashed var(--line);padding:26px;color:var(--muted);text-align:center;font-size:12px;line-height:2}.evidence-list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.evidence{padding:20px;border:1px solid var(--line);overflow:hidden}.evidence>img{width:100%;height:145px;object-fit:cover;margin-bottom:13px}.evidence h3{font-size:14px;margin:10px 0}.evidence p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;line-height:1.9;color:var(--muted)}.tag{font-size:10px;color:var(--gold);letter-spacing:1px}.evidence small{font-size:9px;color:var(--muted)}.create-layout{display:grid;grid-template-columns:1fr 1fr;gap:34px}.question{font:25px/1.8 var(--serif);max-width:490px;margin:20px 0;color:var(--gold)}.principle{border-top:1px solid var(--line);padding:18px 0;display:grid;grid-template-columns:30px 1fr;gap:15px}.principle b{font:18px Georgia;color:var(--mint)}.principle h3{font-size:13px;font-weight:400;margin-bottom:8px}.principle p{font-size:11px;line-height:1.9;color:var(--muted);margin:0}.feedback label,.form-field{display:block;font-size:12px;margin-bottom:20px}.feedback label>span,.form-field>span{display:block;color:var(--muted);font-size:11px;margin-bottom:10px}input[type=text],textarea,select{border:1px solid var(--line);background:#081719;color:var(--ink);padding:11px;width:100%;border-radius:0}textarea{resize:vertical;min-height:90px;line-height:1.8}select{height:42px}.rating{display:flex;gap:10px;margin:12px 0 20px}.rating label{flex:1;position:relative;margin:0}.rating input{position:absolute;opacity:0}.rating span{display:block;text-align:center;padding:13px;border:1px solid var(--line);font:19px Georgia}.rating input:checked+span{color:var(--mint);border-color:var(--mint);background:#8fe4cf15}.rating input:focus-visible+span{outline:2px solid var(--mint);outline-offset:3px}.feedback-summary{margin-top:19px;border-top:1px solid var(--line);padding-top:16px;font-size:11px;color:var(--muted);line-height:1.9}.feedback-summary strong{color:var(--gold);font:21px Georgia;margin:0 5px}.checkbox{display:flex!important;gap:10px;align-items:center;line-height:1.7;font-size:10px!important;color:var(--muted)}.checkbox input{accent-color:var(--mint)}dialog{background:#102326;color:var(--ink);border:1px solid #587672;max-width:680px;width:calc(100% - 40px);max-height:85vh;padding:35px}dialog::backdrop{background:#020d10bb;backdrop-filter:blur(5px)}dialog h2{font:26px var(--serif);letter-spacing:2px;margin-right:20px}dialog p,dialog li{font-size:12px;color:var(--muted);line-height:2}dialog a{color:var(--mint);text-decoration:underline;text-underline-offset:4px}dialog ul{padding-left:18px}.close{position:absolute;right:13px;top:8px;font-size:28px;color:var(--muted)}#toast{position:fixed;left:50%;bottom:80px;transform:translate(-50%,20px);border:1px solid var(--mint);background:#183833;color:var(--ink);padding:12px 22px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:100;max-width:90%;line-height:1.8}#toast.visible{opacity:1;transform:translate(-50%,0)}.fade-in{animation:appear .45s ease-out}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.hidden{display:none!important}.recording .header,.recording footer{opacity:.5}.recording .local-status{opacity:1}.recording .map-panel{background:radial-gradient(ellipse at 48% 45%,#24545255,transparent 68%)}
@media(min-width:1500px){.explore{grid-template-columns:340px minmax(450px,1fr) 315px;gap:36px;padding-top:44px}.detail h2{font-size:37px}.knowledge p{font-size:12px}.intro{font-size:13px}.building-view{height:180px}.map-panel{min-height:660px}}
@media(max-width:1150px){.header{padding:0 25px;gap:15px}.header nav{gap:22px}.local-status{display:none}.explore{grid-template-columns:260px minmax(260px,1fr) 245px;padding:28px 25px;gap:17px}h1{font-size:44px}.stats{gap:20px}.map-panel,.map{min-height:620px}.detail h2{font-size:28px}.detail-top{letter-spacing:1px}.node-label{font-size:11px}.page{padding-left:30px;padding-right:30px}}
@media(max-width:900px){.header{height:auto;min-height:82px;flex-wrap:wrap;padding:18px 22px 0}.brand>span{font-size:20px}.header nav{order:3;flex-basis:100%;height:48px;justify-content:space-between;gap:8px}.header nav button{font-size:12px}.header-actions{margin-left:auto}.explore{grid-template-columns:240px 1fr}.detail{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.detail-top{grid-column:1/-1}.detail .building-view{grid-column:1;grid-row:5/8}.detail .knowledge{grid-column:2}.detail .node-number{grid-column:1}.detail h2,.detail-subtitle{grid-column:1}.detail .node-nav,.detail .tour-progress{grid-column:2}.map-panel,.map{min-height:600px}.protection-layout,.create-layout{gap:22px}.sensor-grid{gap:8px}.sensor-grid strong{font-size:24px}footer{flex-wrap:wrap}footer>span:nth-child(2){display:none}.page-heading{align-items:flex-start;flex-direction:column}.notice{max-width:none}.evidence-list{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.explore{display:flex;flex-direction:column;padding:25px 22px;gap:24px}.hero h1{font-size:42px;margin:18px 0 12px}.intro{max-width:none}.hero-caption{margin-bottom:12px}.stats{margin:18px 0;padding:15px 0;justify-content:space-between}.hero .section-label,.period-copy,.key-hint{display:none}.periods{margin-bottom:10px}.map-panel{min-height:650px}.map{height:650px}.detail{display:block}.building-view{height:170px}.detail h2{font-size:32px}.knowledge p{font-size:12px}.page{padding:28px 22px}.page-heading h1{font-size:29px;letter-spacing:3px}.protection-layout,.create-layout,.routes{grid-template-columns:1fr}.panel{padding:21px}.steps{grid-template-columns:1fr 1fr}.archive-head{align-items:flex-start;flex-direction:column}.evidence-list{grid-template-columns:1fr}.model{height:250px}.question{font-size:23px}.header nav button{letter-spacing:1px}.local-status{display:none}footer{padding:15px 22px;letter-spacing:0;font-size:9px}.page-heading{margin-bottom:22px}.stats .stat strong{font-size:27px}.sensor-grid strong{font-size:27px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.map-scan{display:none}}

/* Chapter-led exhibition: the existing guide and local archive stay intact. */
:root { --cinnabar:#ab5946; --glaze:#e6c078; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
.header nav { gap:24px; }
main { min-height:calc(100svh - 235px); }
.chapter-rail { min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding:16px 3.8%;background:#0c1d1e; }
.chapter-rail[hidden] { display:none; }
.chapter-position { display:flex;align-items:center;gap:18px;min-width:200px; }
.chapter-position>span { color:var(--gold);font:29px Georgia,serif; }
.chapter-position>span small { font-size:12px;color:var(--muted); }
.chapter-position>div { display:flex;flex-direction:column;gap:6px; }
.chapter-position>div small { font-size:11px;letter-spacing:2px;color:var(--muted); }
.chapter-position strong { font-size:14px;font-weight:400;letter-spacing:2px; }
.chapter-dots { display:flex;gap:8px; }
.chapter-dots button { padding:12px 3px; }
.chapter-dots span { display:block;width:23px;height:2px;background:var(--line);transition:background .3s; }
.chapter-dots .active span { background:var(--gold);box-shadow:0 0 10px #d3b88666; }
.chapter-controls { display:flex;align-items:center;gap:22px; }
.chapter-controls button { padding:10px 0;font-size:13px; }
.chapter-controls #next-chapter { color:var(--gold); }
.intro-scene { position:relative;isolation:isolate;min-height:max(590px,calc(100svh - 235px));overflow:hidden;background:radial-gradient(ellipse at 77% 40%,#5c462320,transparent 40%),radial-gradient(ellipse at 14% 80%,#75493812,transparent 50%),#071315; }
.intro-scene:before { content:"";position:absolute;inset:0;z-index:-1;opacity:.22;background-image:repeating-linear-gradient(0deg,transparent 0 79px,#c2a46d12 80px),repeating-linear-gradient(90deg,transparent 0 79px,#c2a46d12 80px);mask-image:linear-gradient(90deg,transparent,#000); }
.intro-content { position:relative;z-index:1;padding:64px 8% 90px;max-width:850px; }
.intro-content .eyebrow { color:var(--gold);font-size:12px;letter-spacing:3px; }
.intro-content .eyebrow:before { background:var(--gold); }
.intro-lead { color:var(--muted);font-size:15px;letter-spacing:5px;margin:34px 0 0; }
.intro-content h1 { font:clamp(60px,6vw,99px)/1.22 var(--serif);letter-spacing:12px;margin:22px 0 24px;animation:exhibition-title 2s ease both; }
.intro-content h1 em { color:var(--gold); }
.intro-question { font-size:18px;line-height:1.9;letter-spacing:2px;color:#bacbc5;max-width:540px;margin-bottom:27px; }
.intro-distance { display:flex;align-items:baseline;gap:17px;margin-bottom:26px; }
.intro-distance strong { color:var(--gold);font:52px/1 Georgia,serif;font-variant-numeric:tabular-nums;min-width:79px; }
.intro-distance>span:not(.sr-only) { font-size:12px;letter-spacing:2px;color:var(--muted); }
.intro-enter { display:flex;align-items:center;gap:23px;flex-wrap:wrap; }
.intro-enter .primary { background:transparent;border-color:#c9a66d99;color:#f0d9a8;min-width:180px;font-size:15px;padding:15px 24px;justify-content:space-between; }
.intro-enter .primary:hover { background:#c9a66d15; }
.intro-enter>span { color:var(--muted);font-size:12px;letter-spacing:1px; }
.intro-skip { position:absolute;right:4%;top:24px;z-index:3;padding:10px 0;font-size:13px;color:var(--muted);letter-spacing:2px; }
.intro-orbit { position:absolute;width:320px;right:9%;top:7%;bottom:10%; }
.intro-axis { position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--gold);box-shadow:0 0 12px #e4bf7288,0 0 45px 8px #e4bf7210;transform:scaleY(var(--axis-reveal,0));transform-origin:top; }
.intro-axis:after { content:"";position:absolute;width:7px;height:7px;bottom:0;left:-3px;border-radius:50%;background:#ffe0a3;box-shadow:0 0 25px 7px #e4bf7277; }
.intro-stop { position:absolute;top:var(--position);left:50%;opacity:.12;transition:opacity .6s; }
.intro-stop>i { position:absolute;width:7px;height:7px;left:-3px;top:-3px;border:1px solid var(--gold);transform:rotate(45deg);background:#142523;transition:box-shadow .6s,background .6s; }
.intro-stop>span { display:block;position:absolute;top:-9px;font-size:13px;letter-spacing:2px;color:var(--gold);width:175px;line-height:1.6; }
.intro-stop.left>span { right:26px;text-align:right; }
.intro-stop.right>span { left:26px; }
.intro-stop.lit { opacity:1; }
.intro-stop.lit>i { background:var(--gold);box-shadow:0 0 14px #d3b886aa; }
.intro-bottom { position:absolute;left:8%;right:4%;bottom:25px;display:flex;justify-content:space-between;gap:15px;color:#7f9790;font-size:11px;letter-spacing:2px; }
.intro-scene.is-ready .intro-axis:after { animation:axis-beacon 3s ease-in-out infinite; }
.narrative-page { padding-top:45px;padding-bottom:35px; }
.narrative-page .page-heading h1 { font-size:40px;line-height:1.5; }
.narrative-page .page-heading p { font-size:15px;max-width:820px;line-height:1.9; }
.story-stage { display:grid;grid-template-columns:1fr 1.05fr;gap:70px;align-items:center;margin:35px 0; }
.story-building { position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:430px;background:radial-gradient(ellipse at center,#94744118,transparent 66%);border-block:1px solid var(--line); }
.story-building:before,.story-building:after { content:"";position:absolute;left:50%;height:35px;border-left:1px solid var(--gold);opacity:.5; }
.story-building:before { top:0; }.story-building:after { bottom:0; }
.story-building svg { width:85%;max-width:460px;height:310px;color:var(--gold); }
.story-building span { color:var(--muted);font-size:12px;letter-spacing:3px; }
.story-copy h2 { font:35px/1.6 var(--serif);letter-spacing:3px;margin:20px 0; }
.story-copy>p { color:var(--muted);font-size:15px;line-height:1.9; }
.story-points { list-style:none;padding:0;counter-reset:story; }
.story-points li { counter-increment:story;border-top:1px solid var(--line);padding:15px 0;display:grid;grid-template-columns:110px 1fr;gap:15px; }
.story-points strong { font-size:14px;color:var(--gold);font-weight:400; }
.story-points span { font-size:14px;line-height:1.8;color:var(--muted); }
.chapter-note { color:var(--muted);font-size:13px;line-height:1.9;letter-spacing:.3px; }
.youth-process { display:grid;grid-template-columns:repeat(3,1fr);gap:36px;border-top:1px solid var(--line);margin:34px 0; }
.youth-process article { position:relative;padding:30px 0 0; }
.process-number { position:absolute;top:20px;right:8px;font:60px Georgia;color:#d3b886b3; }
.youth-process h2 { font:23px/1.6 var(--serif);letter-spacing:1px;margin:16px 0 10px; }
.youth-process p { font-size:15px;line-height:1.9;color:var(--muted);max-width:370px; }
.youth-lower { display:grid;grid-template-columns:1.1fr 1fr;gap:70px;margin-top:36px; }
.route-summary h2 { font:25px var(--serif);letter-spacing:2px; }
.route-summary>div { border-top:1px solid var(--line);padding:17px 0; }
.route-summary>div>span { color:var(--gold);font-size:12px;letter-spacing:2px; }
.route-summary h3 { font-size:15px;line-height:1.9;font-weight:400;margin:10px 0 7px; }
.route-summary>div>p { color:var(--muted);font-size:14px;line-height:1.8;margin:0; }
.task-stage { border-left:2px solid var(--cinnabar);padding:8px 0 8px 30px; }
.task-stage h2 { font:29px/1.75 var(--serif);letter-spacing:2px;margin:20px 0; }
.task-stage p { font-size:14px;line-height:1.9;color:var(--muted);max-width:460px; }
.epilogue-page { position:relative;background:radial-gradient(ellipse at 85% 20%,#81623816,transparent 45%); }
.epilogue-page>h1 { font:clamp(44px,4.6vw,70px)/1.5 var(--serif);letter-spacing:8px;margin:26px 0 16px; }
.epilogue-lead { color:var(--gold);font-size:19px;letter-spacing:3px;margin-bottom:15px; }
.epilogue-question { color:var(--muted);font-size:16px;line-height:1.9;max-width:680px; }
.theory-links { display:grid;grid-template-columns:repeat(3,1fr);gap:40px;border-top:1px solid var(--line);margin-top:30px; }
.theory-links article { padding-top:24px; }
.theory-links article>span { font-size:12px;letter-spacing:3px;color:var(--mint); }
.theory-links h2 { font:25px var(--serif);letter-spacing:2px;margin:15px 0; }
.theory-links p { color:var(--muted);font-size:15px;line-height:1.9; }
.epilogue-end { display:flex;justify-content:space-between;align-items:center;gap:35px;border-top:1px solid var(--line);padding-top:23px;margin-top:22px; }
.epilogue-end p { color:var(--muted);font-size:13px;line-height:1.9;max-width:690px;margin:0; }
.epilogue-end button { white-space:nowrap; }
.admin-bar { display:flex;justify-content:space-between;gap:20px;padding:20px 5%;border-bottom:1px solid #d3b88677;background:#c9a66d0b; }
.admin-bar>div { display:flex;align-items:center;gap:20px;flex-wrap:wrap; }
.admin-bar strong { color:var(--gold);font-weight:400; }
.admin-bar span { color:var(--muted);font-size:12px; }
.admin-bar button { font-size:13px;padding:8px 0; }
.admin-bar button.active { color:var(--mint);border-bottom:1px solid var(--mint); }
.admin-mode .header nav { opacity:.65; }
@keyframes exhibition-title { from { opacity:0;transform:translateY(18px);filter:blur(8px); } to { opacity:1;transform:none;filter:none; } }
@keyframes axis-beacon { 50% { box-shadow:0 0 35px 10px #e4bf7266; } }
@media(min-width:1600px) {
  .intro-content { padding-top:75px; }.intro-content h1 { margin-top:28px;margin-bottom:30px;font-size:104px; }
  .intro-lead { margin-top:40px; }.intro-question { font-size:20px; }.intro-distance { margin-top:30px;margin-bottom:32px; }
}
@media(max-width:1150px) {
  .header nav { gap:18px; }.header nav button { font-size:13px;letter-spacing:1px; }
  .intro-orbit { right:4%;width:280px; }.intro-content { padding-left:6%;max-width:650px; }.intro-content h1 { font-size:74px; }
  .story-stage { gap:35px; }.story-copy h2 { font-size:29px; }.youth-lower { gap:35px; }
  .chapter-dots { display:none; }
}
@media(max-width:900px) {
  .header nav { gap:22px;justify-content:flex-start;overflow-x:auto; }.header nav button { flex-shrink:0; }
  .intro-scene { min-height:620px; }.intro-content { padding-top:55px;max-width:570px; }.intro-content h1 { font-size:65px; }
  .intro-orbit { width:200px;right:0;opacity:.5; }.intro-stop>span { font-size:11px;width:120px; }.intro-stop.left>span { right:16px; }.intro-stop.right>span { left:16px; }
  .intro-question { max-width:360px;font-size:16px; }.intro-bottom { left:6%;font-size:10px;letter-spacing:1px; }
  .story-building { min-height:370px; }.story-building svg { height:260px; }
  .youth-process { gap:20px; }.youth-process h2 { font-size:20px; }.youth-process p { font-size:14px; }
  .theory-links { gap:25px; }.theory-links h2 { font-size:22px; }
  .admin-bar { flex-direction:column; }
}
@media(max-width:620px) {
  .header { padding-top:14px; }.header nav { gap:22px; }.header nav button { font-size:12px; }
  .intro-scene { min-height:625px; }.intro-content { padding:60px 22px 95px; }.intro-content .eyebrow { font-size:10px;letter-spacing:1px; }
  .intro-content h1 { font-size:62px;letter-spacing:8px; }.intro-lead { margin-top:28px;font-size:12px;letter-spacing:3px; }
  .intro-question { font-size:14px;letter-spacing:1px;max-width:290px; }.intro-distance strong { font-size:45px;min-width:65px; }
  .intro-distance>span:not(.sr-only) { font-size:11px;letter-spacing:1px; }
  .intro-orbit { right:-70px;width:200px;opacity:.28;top:10%;bottom:12%; }.intro-stop>span { display:none; }
  .intro-skip { font-size:11px;top:15px;right:22px; }.intro-bottom { left:22px;right:22px;bottom:22px;flex-direction:column;gap:6px; }
  .intro-enter { gap:15px; }.intro-enter .primary { min-width:165px;padding:13px 18px;font-size:13px; }.intro-enter>span { font-size:10px; }
  .chapter-rail { padding:16px 22px;flex-wrap:wrap;gap:15px; }.chapter-position { min-width:0;gap:13px; }.chapter-position strong { font-size:12px;letter-spacing:1px; }.chapter-position>div small { font-size:10px; }
  .chapter-position>span { font-size:23px; }.chapter-controls { gap:20px;flex-basis:100%;justify-content:space-between;border-top:1px solid var(--line);padding-top:7px; }.chapter-controls button { font-size:12px; }
  .narrative-page .page-heading h1 { font-size:29px; }.narrative-page .page-heading p { font-size:14px; }
  .story-stage,.youth-lower { grid-template-columns:1fr;gap:28px; }.story-stage { margin-top:20px; }.story-building { min-height:280px; }.story-building svg { height:230px; }.story-building span { font-size:10px; }
  .story-copy h2 { font-size:28px; }.story-copy>p { font-size:14px; }.story-points li { grid-template-columns:85px 1fr;gap:10px; }.story-points strong,.story-points span { font-size:13px; }
  .youth-process,.theory-links { grid-template-columns:1fr;gap:0; }.youth-process article { padding-top:24px;border-bottom:1px solid var(--line);padding-bottom:8px; }.youth-process { border-top:0;margin-top:0; }.youth-process h2 { font-size:23px; }
  .task-stage { padding-left:20px; }.task-stage h2 { font-size:25px; }.epilogue-page>h1 { font-size:43px;letter-spacing:4px; }.epilogue-lead { font-size:15px;letter-spacing:1px; }.epilogue-question { font-size:14px; }
  .theory-links article { border-bottom:1px solid var(--line);padding-top:20px; }.theory-links h2 { font-size:23px; }.theory-links p { font-size:14px; }.epilogue-end { flex-direction:column;align-items:flex-start;gap:20px;border-top:0;margin-top:0; }
  .admin-bar>div { gap:13px; }.admin-bar span { font-size:11px; }.admin-bar button { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
  .intro-scene.is-ready .intro-axis:after { animation:none; }.intro-stop,.intro-content h1 { transition:none;animation:none; }
}

/* Local 3D gatehouse viewer. Controls remain outside the canvas for keyboard use. */
.protect-page { max-width:1720px; }
.protect-page .page-heading h1 { font-size:37px; }
.protect-page .page-heading p { font-size:14px;line-height:1.9;max-width:760px; }
.three-protection { grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr);gap:28px;align-items:start; }
.model-panel { padding:20px; }
.three-stage { height:510px;width:100%;position:relative;background:#0b2022;margin-top:14px; }
.three-canvas { position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;touch-action:none;outline-offset:-4px;cursor:grab; }
.three-canvas:active { cursor:grabbing; }
.three-ready .three-canvas { opacity:1; }
.model-fallback { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none; }
.model-fallback svg { width:80%;height:75%; }
.three-ready .model-fallback { visibility:hidden; }
.model-corner { position:absolute;left:20px;top:20px;z-index:1;pointer-events:none;display:flex;flex-direction:column;gap:8px;text-shadow:0 1px 5px #071719; }
.model-corner>span { font:20px var(--serif);letter-spacing:3px; }
.model-corner small { font-size:11px;color:#b6c8bd;letter-spacing:1px; }
.model-drag-hint { position:absolute;bottom:15px;left:20px;z-index:1;pointer-events:none;font-size:11px;color:#9cb5ad;letter-spacing:1px;text-shadow:0 1px 4px #071719; }
.model-toolbar { display:flex;justify-content:space-between;gap:14px;padding-top:16px;flex-wrap:wrap; }
.model-toolbar>div { display:flex;gap:7px; }
.model-toolbar button { border:1px solid var(--line);padding:8px 11px;font-size:12px;min-height:34px;white-space:nowrap; }
.model-toolbar button:hover,.model-toolbar button[aria-pressed=true] { border-color:var(--mint);color:var(--mint); }
.model-panel .range-row { font-size:13px;margin-top:20px; }
.model-bottom { display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap; }
.model-bottom .switches { margin-bottom:12px; }
#model-status { font-size:11px;color:var(--muted);line-height:1.8;max-width:300px; }
#model-status.model-warning { color:var(--gold); }
.model-disclosure { color:var(--muted);font-size:11px;line-height:1.9;margin:0;border-top:1px solid var(--line);padding-top:11px; }
.three-protection>.panel:not(.model-panel) { margin-top:0; }
.three-protection>.panel:not(.model-panel) .small { font-size:13px; }
@media(min-width:1600px) { .three-stage { height:560px; }.model-toolbar button { font-size:13px; }.model-disclosure { font-size:12px; } }
@media(max-width:1100px) { .three-protection { grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);gap:20px; }.three-stage { height:460px; }.model-panel { padding:16px; }.model-toolbar button { padding:8px; } }
@media(max-width:900px) { .three-protection { grid-template-columns:1fr; }.three-stage { height:510px; }.three-protection>.panel:not(.model-panel) { margin-top:4px; } }
@media(max-width:620px) {
  .protect-page .page-heading h1 { font-size:28px;line-height:1.6;letter-spacing:2px; }
  .model-panel { padding:13px; }.three-stage { height:430px; }.model-corner { left:13px;top:16px; }.model-corner>span { font-size:18px; }.model-corner small { font-size:9px; }
  .model-drag-hint { left:13px;font-size:9px; }.model-toolbar { gap:10px; }.model-toolbar button { font-size:11px;padding:8px; }.model-toolbar>div { gap:5px; }
  .model-bottom { gap:0; }.model-disclosure { margin-top:12px; }.model-bottom .switches { margin-top:14px; }.model-panel .range-row { font-size:11px;gap:10px; }
}

/* Presentation layout: a compact shell and readable content, with natural scrolling on small screens. */
body { font-size:15px; }
.header { height:64px;min-height:64px;padding-inline:3.2%; }
.brand>span { font-size:21px; }.brand small { font-size:10px;letter-spacing:2px; }.brand img { width:34px;height:34px; }
.header nav { gap:28px; }.header nav button { font-size:15px;letter-spacing:1px; }
.local-status { font-size:13px; }
footer { display:none; }
main { min-height:0; }
.chapter-rail { min-height:64px;padding:8px 3.2%;gap:24px; }
.chapter-position { min-width:180px;gap:12px; }.chapter-position>span { font-size:26px; }.chapter-position>div { gap:2px; }.chapter-position>div small { font-size:12px; }.chapter-position strong { font-size:14px; }
.chapter-controls button,.rail-utilities button { font-size:14px;padding:8px 0; }.rail-utilities { display:flex;gap:22px;margin-left:auto;color:var(--muted); }
.primary,.secondary { font-size:14px;letter-spacing:1px; }
.page { max-width:1720px;padding:28px 4%; }.narrative-page { padding-top:28px;padding-bottom:28px; }
.page-heading { margin-bottom:20px;align-items:center; }.page-heading h1,.narrative-page .page-heading h1,.protect-page .page-heading h1 { font-size:36px;line-height:1.35;margin:12px 0 10px;letter-spacing:3px; }
.page-heading p,.narrative-page .page-heading p,.protect-page .page-heading p { font-size:16px;line-height:1.8;max-width:1000px; }
.eyebrow { font-size:12px;letter-spacing:2px; }.section-label { font-size:14px;margin:5px 0 16px; }.section-label span { font-size:12px; }.small,.chapter-note { font-size:14px;line-height:1.8; }
.explore { grid-template-columns:260px minmax(360px,1fr) 330px;gap:22px;padding:24px 3.2% 18px;max-width:1920px;min-height:0; }
.hero h1 { font-size:39px;line-height:1.5;letter-spacing:3px;margin:22px 0 15px; }
.hero .intro { font-size:15px;line-height:1.85;max-width:none; }
.stats { margin:20px 0;padding:17px 0;gap:35px; }.stat strong { font-size:35px; }.stat>span { font-size:13px; }.stat strong small { font-size:14px; }
.periods { display:grid;grid-template-columns:1fr 1fr;gap:8px; }.periods button { font-size:14px;padding:10px 5px; }
.period-copy { font-size:14px;line-height:1.85;min-height:106px; }.key-hint { font-size:12px;line-height:1.9; }
.explore-progress { margin-top:24px;font-size:14px;color:var(--muted); }.explore-progress strong { color:var(--gold);font:26px Georgia; }.explore-progress>div { height:3px;background:var(--line);margin:10px 0; }.explore-progress i { display:block;height:100%;background:var(--gold);transition:width .4s; }
.map-panel { min-height:600px;display:flex;flex-direction:column;border-inline:1px solid #29414477;padding:0 12px;overflow:hidden; }
.map-top { position:static;font-size:13px;letter-spacing:1px;min-height:28px;gap:12px; }.map-top small { font-size:12px;color:var(--muted);border:1px solid var(--line);padding:2px 5px;margin-left:4px; }
#map-holder { flex:1;min-height:0;overflow:hidden; }.map { min-height:0;max-height:none;height:100%;overflow:hidden; }
.node-label { font-size:12px;letter-spacing:0;fill:#bed0c4; }.node-halo { fill:transparent;stroke:none; }.node.active .node-halo { stroke:#d3b88688;stroke-width:1;animation:node-breathe 2s ease-in-out infinite; }.node.visited .node-circle { fill:var(--gold); }.node-shape { stroke-width:1; }
.map-tools { position:absolute;right:24px;top:44px;display:flex;gap:8px;z-index:2; }.map-tools button { font-size:13px;padding:8px 12px;background:#0a2022e8;border:1px solid var(--line); }
.map-routes { display:flex;gap:8px;justify-content:center;padding-top:10px; }.map-routes button { font-size:13px;border:1px solid var(--line);padding:8px 15px; }.map-routes button.active { color:var(--gold);border-color:var(--gold); }
.route-caption { font-size:13px;line-height:1.7;min-height:44px;color:var(--muted);margin:10px 5px 0; }
.map-note { position:static;font-size:12px;margin:7px 5px 0;letter-spacing:0; }
.explored-path { fill:none;stroke:#d3b886;stroke-width:3;opacity:.65; }.travel-path { fill:none;stroke:#fce4ae;stroke-width:4;stroke-dasharray:1;animation:travel-axis 1.5s ease both;filter:drop-shadow(0 0 4px #e0bb6a); }
.history-axis,.history-extension { fill:none;stroke:#e2bc73;stroke-width:5;opacity:.85; }.history-extension { stroke:#c76c51;stroke-width:7;stroke-dasharray:1;animation:travel-axis 1.6s ease both; }.history-label { fill:#e9cd96;font-size:13px;paint-order:stroke;stroke:#102a2c;stroke-width:4; }.history-ring { stroke:#d3b886;fill:#d3b8860b;stroke-dasharray:3 4;stroke-width:1; }
.practice-route { fill:none;stroke:#db8c70;stroke-width:3; }.route-main { stroke-dasharray:1;animation:travel-axis 1.6s ease both; }.route-extra { stroke-dasharray:5 6;stroke-width:2;opacity:.75; }.practice-point { cursor:pointer;color:#f2a086; }.practice-point>path { fill:#733f35;stroke:currentColor;stroke-width:1.6; }.practice-point.extra>path { fill:#152d2e; }.practice-point text { fill:#f2b59c;font-size:12px;paint-order:stroke;stroke:#102729;stroke-width:3; }.practice-point:focus>path { stroke:white;stroke-width:2; }.practice-symbol { font:100px Georgia;color:var(--cinnabar); }
.detail { padding:0 0 0 5px;min-width:0; }.detail-top { padding-bottom:12px;font-size:13px;letter-spacing:0; }.detail-top span:last-child { font-size:12px; }.node-number { font-size:13px;letter-spacing:1px;margin-top:18px; }.detail h2 { font-size:34px;margin:8px 0 10px;letter-spacing:2px; }.detail-subtitle { font-size:14px;margin-bottom:12px; }.building-view { height:160px;margin-bottom:16px; }.building-view svg { width:220px;height:155px; }.knowledge { padding-bottom:16px; }.knowledge h3 { font-size:14px;letter-spacing:1px;margin-bottom:6px; }.knowledge p { font-size:15px;line-height:1.85; }.node-nav { margin-top:0; }.node-nav button { font-size:14px; }
.node-strip { grid-column:1/-1;display:flex;gap:8px;overflow-x:auto;min-height:38px;padding:4px 0;scrollbar-width:thin; }.node-strip button { flex-shrink:0;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line);padding:6px 10px; }.node-strip [aria-pressed=true] { color:var(--gold);border-color:var(--gold); }
.protect-page .three-protection { gap:24px; }.model-panel { padding:18px; }.three-stage { height:390px;margin-top:0; }.model-corner small,.model-drag-hint,#model-status { font-size:13px; }.model-toolbar { padding-top:12px; }.model-toolbar button { font-size:14px; }.model-panel .range-row { margin-top:12px;font-size:14px; }.model-bottom .switches { margin:12px 0 0; }.switches button { font-size:14px; }.sensor-grid span,.sensor-grid small { font-size:14px; }.sensor-grid strong { font-size:35px; }.chart { height:190px; }.chart text { font-size:12px; }.sensor-state { font-size:14px; }.steps { margin-top:18px; }.step { padding-top:16px; }.step h3 { display:inline-block;font-size:17px;margin:0 0 0 12px; }.step p { font-size:14px;line-height:1.8;margin:10px 0 0; }
.intro-scene { min-height:650px; }
.intro-content { padding:60px 6% 80px;max-width:54%; }.intro-content h1 { font-size:clamp(60px,5.3vw,92px);line-height:1.3;letter-spacing:10px; }
.intro-orbit { width:400px;left:63%;right:auto;transform:translateX(-50%);top:7%;bottom:10%; }
.intro-lead { font-size:17px;margin-top:25px; }.intro-question { font-size:19px; }.intro-distance>span:not(.sr-only),.intro-enter>span { font-size:14px; }.intro-stop>span { font-size:14px;width:200px; }.intro-bottom { left:6%;font-size:13px; }.intro-axis { width:3px; }.intro-stop>i { width:9px;height:9px;left:-3px; }
.story-layout { display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center; }.story-editor h2 { font:46px/1.4 var(--serif);letter-spacing:4px;color:var(--gold);margin:20px 0; }.story-points>div { border-top:1px solid var(--line);padding:15px 0; }.story-points b { font-size:15px;font-weight:400;color:var(--gold); }.story-points p { font-size:16px;line-height:1.8;color:var(--muted);margin:8px 0 0; }.story-editor .actions { margin-top:18px; }.story-editor .chapter-note { margin:14px 0 0; }
.phone-stage { display:flex;align-items:center;flex-direction:column;gap:14px;background:radial-gradient(ellipse at center,#8a673821,transparent 70%); }
.phone { width:348px;max-width:100%;background:#102c2d;border:7px solid #213c3b;box-shadow:0 20px 70px #030d0f88;border-radius:34px;padding:18px; }
.phone-top { display:flex;justify-content:space-between;color:var(--gold);font-size:13px;border-bottom:1px solid var(--line);padding:8px 0 12px; }.phone-top span { color:var(--muted);font-size:12px; }.phone-art svg { width:100%;height:224px; }.phone-copy .tag { font-size:12px; }.phone-copy h2 { font:27px var(--serif);margin:14px 0;letter-spacing:2px; }.phone-copy p { font-size:16px;line-height:1.85;color:#b7c9c1;min-height:118px; }.phone-controls { display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px;color:var(--gold); }.phone-controls button { padding:6px 16px;border:1px solid var(--line);font-size:19px; }.phone-controls span { font:15px Georgia; }.phone-caption { font-size:14px;color:var(--muted); }
.youth-process { margin:22px 0;gap:32px; }.youth-process article { padding-top:20px; }.youth-process h2 { font-size:23px;margin:12px 0; }.youth-process p { font-size:15px;line-height:1.85;max-width:none; }
.research-layout { display:grid;grid-template-columns:1fr 1.05fr;gap:45px; }.route-summary h2 { font-size:23px;margin-bottom:16px; }.route-summary>div { padding:14px 0; }.route-summary>div>span { font-size:13px; }.route-summary h3 { margin:7px 0;font-size:16px; }.route-link { font-size:14px;color:var(--mint);padding:6px 0; }.research-design { padding:20px 24px;border:1px solid var(--line); }.research-tabs { display:flex;gap:20px;border-bottom:1px solid var(--line);margin-bottom:20px; }.research-tabs button { font-size:15px;padding:0 0 12px; }.research-tabs [aria-pressed=true] { color:var(--gold);border-bottom:2px solid var(--gold); }.sample-target { display:flex;gap:24px;align-items:center;margin-bottom:20px; }.sample-target strong { font:40px Georgia;color:var(--gold); }.sample-target small { font:16px var(--sans); }.sample-target span { font-size:14px;line-height:1.8;color:var(--muted); }.research-design h2 { font:23px/1.7 var(--serif); }.research-design h3 { font-size:16px;font-weight:400;color:var(--gold); }.research-design p { color:var(--muted);font-size:15px;line-height:1.8; }.research-list { font-size:15px;line-height:1.9;padding-left:23px;color:var(--muted); }.research-list li { padding-bottom:6px; }.observation-tags { display:flex;gap:10px;flex-wrap:wrap;margin:18px 0; }.observation-tags span { padding:8px 12px;border:1px solid var(--line);font-size:14px;color:var(--mint); }
.epilogue-page>h1 { font-size:58px;line-height:1.4;margin:20px 0; }.epilogue-lead { font-size:19px; }.course-quote { margin:22px 0;padding:18px 24px;border-left:3px solid var(--cinnabar);font:22px/1.9 var(--serif);color:var(--gold);background:#b6764910; }.course-quote cite { font:13px var(--sans);display:block;color:var(--muted);font-style:normal;margin-top:8px; }.theory-links { margin-top:20px; }.theory-links article { padding-top:20px; }.theory-links article>span { font-size:14px; }.theory-links h2 { font-size:25px;margin:12px 0; }.theory-links p { font-size:16px;line-height:1.85; }.epilogue-end p { font-size:15px;max-width:850px; }.epilogue-end strong { color:var(--gold);font-weight:400; }
dialog p,dialog li { font-size:15px; }#toast { font-size:14px; }
.recording .header { display:none; }.recording .chapter-rail { position:fixed;bottom:12px;left:50%;transform:translateX(-50%);width:max-content;max-width:95%;min-height:46px;padding:5px 18px;gap:22px;border:1px solid #53716b;background:#0d2225ed;z-index:5;box-shadow:0 6px 30px #0005; }
.recording .chapter-position,.recording .chapter-dots,.recording #rail-sources { display:none; }.recording .rail-utilities { order:2; }.recording .chapter-controls { gap:18px; }.recording .chapter-controls button,.recording .rail-utilities button { font-size:13px; }.recording .chapter-controls #next-chapter { max-width:270px; }.recording .map-panel { background:radial-gradient(ellipse at center,#24545240,transparent 68%); }
@keyframes travel-axis { from { stroke-dashoffset:1; }to { stroke-dashoffset:0; } }
@keyframes node-breathe { 50% { opacity:.35; } }
@media(min-width:1150px) and (min-height:800px) {
  body { height:100svh;display:flex;flex-direction:column;overflow:hidden; }
  .header,.chapter-rail { flex-shrink:0; }
  main { flex:1;min-height:0;overflow:auto; }
  .explore { height:100%;grid-template-rows:minmax(0,1fr) 42px; }
  .map-panel { min-height:0; }
  .intro-scene { min-height:100%;height:100%; }
  .page { width:100%;min-height:100%; }
  .protect-page { display:flex;flex-direction:column;height:100%; }
  .three-protection { flex:1;min-height:0;align-items:stretch; }
  .model-panel { display:flex;flex-direction:column; }
  .three-stage { flex:1;height:auto;min-height:220px; }
  .recording main { padding-bottom:66px; }
}
@media(min-width:1150px) and (max-height:950px) {
  .hero h1 { font-size:32px;margin-top:15px; }.stats { margin:14px 0;padding:12px 0; }.period-copy { min-height:82px;font-size:13px; }.explore-progress { margin-top:15px; }.hero .intro { font-size:14px; }
  .explore { grid-template-columns:240px minmax(340px,1fr) 310px;padding-top:18px; }.building-view { height:112px;margin-bottom:12px; }.building-view svg { height:110px; }.node-number { margin-top:12px; }.knowledge { padding-bottom:12px; }.knowledge p { font-size:14px;line-height:1.8; }.detail h2 { font-size:30px; }.detail-subtitle { font-size:13px; }
  .page-heading h1,.narrative-page .page-heading h1,.protect-page .page-heading h1 { font-size:30px; }.page { padding-top:22px;padding-bottom:20px; }.chart { height:150px; }.sensor-grid { padding-bottom:15px; }.steps { margin-top:12px; }.step { padding-top:12px; }.step p { margin-top:7px; }
  .story-editor h2 { font-size:37px;margin:14px 0; }.story-points>div { padding:12px 0; }.story-points p { font-size:15px; }.phone { width:320px;padding:14px; }.phone-art svg { height:185px; }.phone-copy p { font-size:15px;min-height:111px; }.phone-copy h2 { font-size:24px;margin:12px 0; }
  .youth-process { margin:16px 0; }.youth-process article { padding-top:16px; }.youth-process p { font-size:14px; }.youth-process h2 { font-size:21px; }.research-tabs { margin-bottom:14px; }.research-design { padding:16px 20px; }.research-list { font-size:14px; }.sample-target { margin-bottom:14px; }.sample-target strong { font-size:34px; }
  .epilogue-page>h1 { font-size:48px;margin:16px 0; }.course-quote { font-size:20px;margin:18px 0;padding:13px 20px; }.theory-links p { font-size:15px; }.epilogue-end { margin-top:12px;padding-top:17px; }
}
@media(max-width:1149px) {
  .header { padding-inline:22px; }.header nav { gap:15px; }.header nav button { font-size:14px; }.brand small { display:none; }.chapter-dots { display:none; }.rail-utilities { gap:14px; }.chapter-rail { gap:16px; }.chapter-position { min-width:140px; }
  .explore { grid-template-columns:220px minmax(280px,1fr) 280px;padding:25px 22px;gap:16px; }.hero h1 { font-size:32px; }.detail h2 { font-size:28px; }.knowledge p { font-size:14px; }.building-view { height:130px; }.map-top { flex-wrap:wrap; }.node-label { font-size:12px; }.story-layout { gap:30px; }.story-editor h2 { font-size:37px; }.research-layout { gap:25px; }
  .intro-content { max-width:58%;padding-left:5%; }.intro-content h1 { font-size:64px; }.intro-orbit { left:76%;width:240px; }.intro-stop>span { font-size:12px;width:150px; }
}
@media(max-width:900px) {
  .header { height:auto;min-height:72px; }.header nav { gap:8px; }.chapter-rail { flex-wrap:wrap; }.chapter-position { flex:1; }.chapter-controls { gap:24px; }.chapter-position strong { font-size:14px; }.rail-utilities { margin-left:0; }
  .explore { grid-template-columns:220px minmax(0,1fr); }.map-panel { min-height:640px; }.detail { grid-column:1/-1;display:block;padding:18px;border:1px solid var(--line); }.detail .building-view { float:right;width:35%;height:200px; }.detail .knowledge { max-width:60%; }.node-strip { grid-row:2; }.detail .node-nav { clear:both; }.three-protection { grid-template-columns:1fr; }.three-stage { height:430px; }.story-layout { grid-template-columns:1fr 1fr;gap:20px; }.phone { width:300px; }.phone-art svg { height:170px; }.phone-copy p { font-size:15px; }.story-editor h2 { font-size:32px; }.youth-process { gap:20px; }.research-layout { grid-template-columns:1fr; }.epilogue-page>h1 { font-size:48px; }.course-quote { font-size:20px; }
}
@media(max-width:620px) {
  .header nav { overflow-x:auto;justify-content:flex-start; }.header nav button { padding-inline:8px;font-size:13px; }.header-actions { gap:10px; }.chapter-rail { padding:12px 22px; }.chapter-position { min-width:170px; }.chapter-controls { flex-basis:100%;padding-top:8px; }.rail-utilities { gap:16px; }.rail-utilities button { font-size:13px; }
  .explore { display:flex;padding:24px 20px; }.hero h1 { font-size:38px; }.hero .section-label,.period-copy,.key-hint { display:block; }.period-copy { min-height:0; }.hero .stats { justify-content:flex-start;gap:55px; }.map-panel { height:680px;min-height:680px;padding:0 5px; }.map { height:100%; }.map-top { font-size:12px; }.map-routes button { padding:8px 10px; }.route-caption { font-size:12px; }.node-strip { order:3; }.detail { order:4; }.detail .building-view { float:none;width:100%;height:170px; }.detail .knowledge { max-width:none; }.knowledge p { font-size:15px; }.map-tools { top:50px;right:10px; }.map-tools button { font-size:12px;padding:7px; }
  .intro-scene { min-height:730px; }.intro-content { max-width:100%;padding:80px 24px 160px; }.intro-content h1 { font-size:58px;letter-spacing:7px; }.intro-orbit { left:80%;width:160px;opacity:.28;top:18%;bottom:6%; }.intro-stop>span { display:none; }.intro-bottom { left:24px;right:24px;font-size:12px; }.intro-lead { font-size:15px; }.intro-question { font-size:16px; }.intro-distance>span:not(.sr-only) { font-size:13px; }
  .page { padding:26px 22px; }.page-heading h1,.narrative-page .page-heading h1,.protect-page .page-heading h1 { font-size:28px; }.page-heading p,.narrative-page .page-heading p,.protect-page .page-heading p { font-size:15px; }.three-stage { height:370px; }.model-toolbar button { font-size:12px; }.model-corner small,.model-drag-hint,#model-status { font-size:11px; }.steps { gap:15px; }.step p { font-size:14px; }.sensor-grid { gap:9px; }.sensor-grid strong { font-size:28px; }.sensor-grid span { font-size:12px; }
  .story-layout { grid-template-columns:1fr; }.story-editor h2 { font-size:34px; }.phone { width:330px; }.phone-art svg { height:210px; }.phone-copy p { min-height:115px; }.story-points p { font-size:15px; }.youth-process { grid-template-columns:1fr;gap:0; }.youth-process article { padding:20px 0; }.youth-process p { margin-bottom:0; }.research-design { padding:18px; }.research-tabs { gap:15px; }.research-tabs button { font-size:14px; }.sample-target { flex-wrap:wrap;gap:10px; }.research-list { font-size:14px; }.epilogue-page>h1 { font-size:40px; }.epilogue-lead { font-size:17px;line-height:1.8; }.course-quote { font-size:19px;margin-inline:0; }.epilogue-end p { font-size:14px; }.recording main { padding-bottom:80px; }.recording .chapter-controls { flex-basis:auto;border:0;padding:0; }.recording .chapter-rail { gap:14px;padding:6px 12px;flex-wrap:nowrap; }.recording #previous-chapter { display:none; }.recording #next-chapter { max-width:195px;font-size:12px; }.recording .rail-utilities button { font-size:12px; }
}

/* Keep labels legible in the full-axis view as well as in focused views. */
.node-label { font-size:16px; }
.story-editor .actions button { font-size:14px;padding:11px 16px; }

/* Opacity transitions keep the full-height stage inside its viewport during chapter changes. */
.fade-in { animation:chapter-arrive .45s ease-out; }
@keyframes chapter-arrive { from { opacity:0; } to { opacity:1; } }