:root{--bg:#0a2420;--panel:#10342d;--ink:#edf4e5;--muted:#a1b7a7;--gold:#e6b970;--line:#d2bd7430;--sans:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
button:disabled{opacity:.3;cursor:default}
:focus-visible{outline:3px solid #ffd286;outline-offset:5px}
p,h1,h2{margin:0}
svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.icon-library{position:absolute;width:0;height:0;overflow:hidden}
[hidden]{display:none!important}
.screen-shell{height:100svh;min-height:720px;display:grid;grid-template-rows:132px minmax(0,1fr) 86px 26px;gap:14px;padding:18px 3% 10px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 62%,#2b544139 0%,transparent 66%),linear-gradient(180deg,#102c27,#0b2823 45%,#071f1c)}
.screen-atmosphere{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.screen-atmosphere:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% -10%,#9dbb6a27,transparent 50%),radial-gradient(ellipse at 50% 100%,#d7b86516,transparent 54%)}
.screen-atmosphere:after{content:"";position:absolute;left:12%;right:12%;bottom:-55px;height:115px;border:1px solid #e8cb8e39;border-radius:50%;box-shadow:0 -15px 70px #d9bc6820,0 -1px 16px #f4c16a24}
.orbit{position:absolute;border:1px solid #a4c2900b;left:-10%;width:120%;height:650px;border-radius:50%}
.orbit-one{top:-545px;box-shadow:0 11px 0 #a4c29005,0 28px 0 #a4c29003}
.orbit-two{bottom:-545px}
.ambient-grid{position:absolute;inset:0;opacity:.055;background-image:linear-gradient(#b5d2ac 1px,transparent 1px),linear-gradient(90deg,#b5d2ac 1px,transparent 1px);background-size:84px 84px;mask-image:linear-gradient(transparent,#000 60%,transparent)}
.screen-header{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
.screen-header:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,#c6b87144 15%,transparent 35%,transparent 65%,#c6b87144 85%,transparent)}
.screen-brand{display:flex;align-items:center;gap:14px;color:#e6e9d8;text-decoration:none;justify-self:start;font-size:21px;font-weight:500;letter-spacing:3px}
.screen-brand small{display:block;font-size:7px;color:#8aa390;letter-spacing:1.4px;margin-top:9px}
.brand-seal{display:block;position:relative;font-family:Georgia,serif;font-size:46px;font-weight:400;line-height:1;border-left:1px solid #d6bd7666;padding-left:14px;color:var(--gold);letter-spacing:0}
.brand-seal:before,.brand-seal:after{content:"";position:absolute;width:6px;height:1px;left:0;background:#d6bd7680}
.brand-seal:before{top:0}.brand-seal:after{bottom:0}
.brand-seal span{font-size:23px;letter-spacing:0;margin-left:2px}
.screen-title{text-align:center;align-self:center;min-width:0}
.screen-title>p{font-size:13px;letter-spacing:3px;color:#b0bfa2;margin-bottom:10px}
.screen-title h1{font-size:43px;font-weight:600;letter-spacing:7px;color:#f0edda;line-height:1.4;text-shadow:0 2px 24px #dfd6a916;white-space:nowrap}
.title-baseline{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:11px}
.title-baseline span{font-size:13px;letter-spacing:4px;color:#c6c8ac}
.title-baseline i{display:block;width:70px;height:1px;background:linear-gradient(90deg,transparent,#bca56a80)}
.title-baseline i:last-child{transform:rotate(180deg)}
.screen-utilities{justify-self:end;display:flex;flex-direction:column;align-items:flex-end;gap:13px}
.offline-status{font-size:10px;letter-spacing:2px;color:#a4b49c;display:flex;align-items:center;gap:8px}
.offline-status i{height:5px;width:5px;border-radius:50%;background:#b9cd8d;box-shadow:0 0 9px #a9c78488}
.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:9px 12px;min-height:40px;font-size:13px;white-space:nowrap;border-radius:4px}
.screen-fullscreen{font-size:12px;color:#c3c9b2;border:1px solid #c6b9783b}
.screen-fullscreen:hover{background:#d6c48613;border-color:#d5bb72a0}
.screen-fullscreen svg{width:16px;height:16px}
.screen-main{display:grid;grid-template-columns:220px minmax(0,1fr) 220px;gap:22px;min-height:0;align-items:stretch}
.wing{display:flex;flex-direction:column;min-height:0;padding-top:30px}
.wing-heading{padding:0 2px 24px;position:relative}
.wing-heading:before{content:"";position:absolute;left:0;top:26px;height:24px;width:2px;background:#ddbb6f}
.wing-heading p{font-size:8px;letter-spacing:2px;color:#7f9b88;margin-bottom:13px}
.wing-heading h2{font-size:24px;letter-spacing:2px;font-weight:500;line-height:1.5;padding-left:13px}
.wing-heading>span{display:block;font-size:11px;letter-spacing:1px;color:#8ea891;margin-top:10px;padding-left:13px}
.place-list{display:flex;flex-direction:column;gap:14px;min-height:0;flex:1}
.place-item{display:flex;align-items:center;gap:14px;min-height:88px;flex:1;max-height:116px;text-align:left;width:100%;padding:13px 13px 13px 15px;border:1px solid #8daf8050;background:linear-gradient(105deg,#41664c27,#1b463a10);position:relative;clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,11px 100%,0 calc(100% - 11px));transition:background .2s,border-color .2s}
.place-item:after{content:"";position:absolute;right:0;top:0;width:32px;height:1px;background:#9eb07b90}
.place-item:hover,.place-item.linked{border-color:#ebc581b0;background:linear-gradient(100deg,#a7b17522,#708d5910)}
.place-item.selected{border-color:#e4b762;background:linear-gradient(100deg,#ccaf6340,#9cab6021)}
.item-number{font-family:Georgia,serif;color:#e0be78;font-size:29px;line-height:1;font-weight:400;position:relative;flex-shrink:0}
.item-number:before{content:"";position:absolute;width:13px;height:1px;bottom:-12px;left:0;background:#c1b47666}
.place-copy{min-width:0}
.place-copy strong{display:block;font-weight:500;font-size:18px;letter-spacing:1px;line-height:1.65}
.place-copy small{display:block;font-size:9px;color:#91aa92;margin-top:6px;line-height:1.7}
.item-arrow{display:none}
.visited .item-number:after{content:"";position:absolute;right:-4px;top:-5px;width:4px;height:4px;background:#e7be72;border-radius:50%}
.wing-foot{display:flex;align-items:center;gap:15px;padding:23px 8px 8px;color:#829d85}
.wing-foot p{font-size:11px;line-height:1.9;letter-spacing:2px}
.wing-symbol{font-size:43px;color:#a4ae72;line-height:1;opacity:.7;font-weight:200}
.wing-symbol.rings{font-size:52px}
.atlas{display:grid;grid-template-rows:51px minmax(0,1fr) 32px;min-height:0;min-width:0;position:relative}
.atlas-heading{display:flex;align-items:flex-start;justify-content:center}
.filters{display:flex;gap:5px;border:1px solid #91a97b3d;padding:4px;background:#0a211b75;border-radius:6px}
.filter{min-height:35px;padding:8px 22px;font-size:13px;letter-spacing:1px;color:#b6c5aa;border-radius:3px}
.filter:hover{background:#bdc28a15}
.filter.active{background:linear-gradient(100deg,#bfaa67,#dac38b);color:#183b2e;box-shadow:0 0 18px #dbc17e20}
.sandtable{min-height:0;display:flex;flex-direction:column;position:relative;border:1px solid #b0ad6b4f;background:linear-gradient(180deg,#49644812,#162f2530);padding:5px 8px;box-shadow:0 25px 45px #0003,inset 0 0 50px #87a37007;border-radius:3px}
.sandtable-corners{position:absolute;inset:-2px;pointer-events:none;border-radius:3px;background:linear-gradient(#e2c486,#e2c486) left top/30px 2px no-repeat,linear-gradient(#e2c486,#e2c486) left top/2px 25px no-repeat,linear-gradient(#e2c486,#e2c486) right top/30px 2px no-repeat,linear-gradient(#e2c486,#e2c486) right top/2px 25px no-repeat,linear-gradient(#e2c48699,#e2c48699) left bottom/30px 1px no-repeat,linear-gradient(#e2c48699,#e2c48699) right bottom/30px 1px no-repeat}
.sandtable-label{display:flex;align-items:center;justify-content:space-between;min-height:33px;flex-shrink:0;padding:0 7px}
.sandtable-label>span{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:2px;color:#b7c0a0}
.sandtable-label>span i{width:4px;height:4px;border-radius:50%;background:#e0be7c}
.sandtable-label .button{min-height:29px;padding:4px 5px;font-size:10px;color:#b9c3a5}
.sandtable-label .button svg{width:13px;height:13px}
.sandtable-label .button:hover{color:#f1d49d;background:#b4b97316}
.map-viewport{display:flex;align-items:center;justify-content:center;min-height:0;flex:1;position:relative;overflow:hidden}
.map-canvas{position:relative;flex-shrink:0;overflow:hidden;isolation:isolate;width:100%;aspect-ratio:1672/850;box-shadow:0 7px 45px #0005;border:1px solid #c8cba668;border-radius:2px}
.community-map{position:absolute;left:0;width:100%;max-width:none;display:block}
#map-points{position:absolute;left:0;width:100%}
.map-point{position:absolute;left:var(--x);top:var(--y);width:43px;height:43px;transform:translate(-50%,-50%);padding:0;border-radius:50%;background:linear-gradient(145deg,#fff2cb,#dfb967);color:#29412b;border:2px solid #fff2ce;box-shadow:0 0 0 5px #163c466b,0 3px 13px #1532268c;z-index:1;display:grid;place-items:center;transition:box-shadow .2s}
.map-point span{font-family:Georgia,serif;font-size:18px;font-weight:bold}
.map-point:hover,.map-point.linked,.map-point:focus-visible{z-index:3;box-shadow:0 0 0 7px #f9e0a977,0 0 0 9px #27553d99,0 3px 18px #15322680}
.map-point.selected{background:linear-gradient(135deg,#3c6650,#163f30);color:#fff1bf;border-color:#f5d28b}
.map-point.visited:after{content:"";position:absolute;right:-1px;bottom:-1px;width:7px;height:7px;border-radius:50%;background:#224a31;border:1px solid #f4d588}
.map-point:before{content:attr(data-name);position:absolute;left:50%;bottom:calc(100% + 15px);transform:translateX(-50%);background:#173e2ff5;border:1px solid #d4bd7c;color:#fff0ca;font-size:14px;padding:10px 15px;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:.15s;letter-spacing:1px;border-radius:3px}
.map-point:hover:before,.map-point.linked:before,.map-point:focus-visible:before{visibility:visible;opacity:1}
.map-error{position:absolute;inset:20%;background:#173e2ff5;color:#f2d18d;padding:25px;display:grid;place-items:center;text-align:center;line-height:2;font-size:17px}
.sandtable-base{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 7px 3px;font-size:10px;color:#a4b398;letter-spacing:1px;min-height:30px}
.map-instruction{display:flex;align-items:center;gap:8px}
.map-instruction svg{width:14px;height:14px;color:#d6bd7f}
.mobile-tip{display:none}
.atlas-caption{display:flex;align-items:center;justify-content:center;gap:20px;padding-top:8px;font-size:12px;letter-spacing:3px;color:#a5b59a}
.atlas-caption b{font-weight:400;color:#c8b572}
.atlas-caption i{width:70px;height:1px;background:linear-gradient(90deg,transparent,#c6b67655)}
.atlas-caption i:last-child{transform:rotate(180deg)}
.control-deck{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:25px;margin:0 9%;position:relative}
.deck-statement{display:flex;align-items:center;gap:16px}
.meter-line{height:37px;width:22px;border-left:1px solid #bca66b88;position:relative}
.meter-line:before{content:"";position:absolute;left:0;top:0;height:100%;width:8px;background:repeating-linear-gradient(0deg,#bca66b88 0 1px,transparent 1px 9px)}
.deck-statement p{font-size:16px;letter-spacing:2px;color:#d1d7bc}
.deck-statement small{display:block;color:#7f9c83;font-size:10px;margin-top:9px;letter-spacing:2px}
.guide-button{display:flex;align-items:center;gap:19px;min-width:292px;border:1px solid #ead09a9c;background:linear-gradient(105deg,#7e704b50,#be9c5145,#6a63402b);box-shadow:inset 0 0 35px #e2c17213,0 0 30px #bca65c0f;padding:15px 28px;border-radius:6px;text-align:left;transition:.2s;position:relative}
.guide-button:before{content:"";position:absolute;left:20%;right:20%;top:-1px;height:1px;background:#f7dfaa;box-shadow:0 0 12px #f7dfaa}
.guide-button:hover{background:linear-gradient(105deg,#a38b505a,#cead615a,#9e87413b);box-shadow:0 0 30px #bca65c20}
.guide-play{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;border:1px solid #c8b88488;color:#f1d899}
.guide-play svg{width:17px;height:17px;fill:currentColor;stroke-width:1}
.guide-button strong{font-size:20px;letter-spacing:4px;font-weight:500;color:#f5e1b4}
.guide-button small{display:block;font-size:9px;letter-spacing:2px;color:#b8b594;margin-top:7px}
.guide-arrow{margin-left:12px;color:#d9c488;width:21px}
.exploration-status{justify-self:end;display:flex;align-items:center;gap:17px}
.exploration-status #visited-count{font-size:17px;letter-spacing:2px;color:#d4d9bf}
.exploration-status small{display:block;font-size:9px;letter-spacing:3px;color:#879f82;margin-top:9px}
.exploration-status b{font-weight:400;color:#d8be7b;margin-left:8px}
.status-dots{width:28px;height:28px;background:radial-gradient(circle,#c7bb7f 1px,transparent 2px);background-size:9px 9px}
.screen-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:8px;color:#718b77;letter-spacing:1px;border-top:1px solid #7797691a;padding-top:5px}
.screen-footer span:last-child{font-size:7px;letter-spacing:2px}
.eyebrow{font-size:11px;letter-spacing:2px;font-weight:500}
dialog{border:1px solid #b8b07b77;background:#10352b;color:var(--ink);padding:0;border-radius:8px;box-shadow:0 0 100px #0008,inset 0 0 70px #718a5910}
dialog::backdrop{background:#041a16d9;backdrop-filter:blur(10px)}
.detail-dialog{width:min(1500px,calc(100vw - 100px));max-height:calc(100svh - 90px);overflow:auto}
.dialog-header{display:flex;align-items:center;justify-content:space-between;padding:17px 26px;border-bottom:1px solid #a4b48133;gap:15px}
.dialog-header>.eyebrow{color:#b7be91;font-size:10px}
.dialog-header-actions{display:flex;align-items:center;gap:20px}
.icon-button{display:grid;place-items:center;width:42px;height:42px;min-width:42px;border:1px solid #b7be8c44;background:#94ad6b10;border-radius:50%;color:#d3d9b7}
.icon-button:hover{background:#bbc08620;border-color:#d6c28a99}
.icon-button svg{width:20px;height:20px}
.tour-status{font-size:13px;color:#c5c799;letter-spacing:1px}
.tour-status:before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:#d8be7b;margin-right:8px}
.detail-split{display:grid;grid-template-columns:1.05fr 1fr}
.scene-side{display:flex;flex-direction:column;min-height:580px;background:#123d2e;overflow:hidden}
.detail-scene{position:relative;min-height:380px;flex:1;overflow:hidden}
.detail-scene>img{position:absolute;max-width:none;user-select:none}
.scene-marker{position:absolute;width:28px;height:28px;transform:translate(-50%,-50%);border:3px solid #ffe5a0;border-radius:50%;background:#d8933570;box-shadow:0 0 0 10px #fff6,0 0 0 11px #55794880}
.scene-label{position:absolute;left:20px;bottom:20px;background:#133e2fee;color:#e2d1a3;font-size:12px;padding:9px 14px;border:1px solid #cbb87560;border-radius:3px}
.scene-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 20px;background:#183f2d;color:#b7c5a0;font-size:13px;border-top:1px solid #b4b88022}
.scene-caption .button{font-size:12px}
.scene-caption .button:hover{background:#d9cb8414}
.detail-copy{padding:34px 38px 25px}
.detail-category-row{display:flex;align-items:center;justify-content:space-between}
#detail-category{color:#d0ba7f;letter-spacing:3px}
.scheme-badge{font-size:11px;color:#bdc49b;border:1px solid #c1b77855;border-radius:2px;padding:5px 10px}
.detail-copy h2{font-size:40px;letter-spacing:3px;line-height:1.5;font-weight:500;margin:18px 0 12px;color:#f2ebd2}
.detail-subtitle{font-size:18px;line-height:1.9;color:#aabf99;margin-bottom:20px}
.detail-tags{display:flex;flex-wrap:wrap;gap:10px}
.detail-tags span{font-size:12px;padding:6px 11px;border:1px solid #99ac763b;color:#aaba96;background:#8da3650c;border-radius:3px}
.detail-description{font-size:15px;line-height:2;color:#abc0a3;margin:24px 0}
.design-heading{display:flex;align-items:center;gap:17px;font-size:15px;letter-spacing:2px;color:#d9d8b5}
.design-heading i{height:1px;background:#94a77430;flex:1}
#detail-features{padding:0;list-style:none;margin:15px 0 20px}
#detail-features li{position:relative;font-size:14px;line-height:1.95;padding-left:17px;color:#99b18f;margin:8px 0}
#detail-features li:before{content:"";position:absolute;left:0;top:11px;width:4px;height:4px;background:#d8b873;transform:rotate(45deg)}
.detail-location{font-size:11px;line-height:1.8;border-top:1px dashed #9caf6a33;padding-top:15px;color:#7d9b7d}
.media-row{display:flex;align-items:center;gap:16px;margin-top:22px}
.narrate-button{display:flex;align-items:center;gap:10px;padding:13px 20px;font-size:14px;letter-spacing:1px;color:#f0dab0;background:linear-gradient(105deg,#9e874244,#bca25a24);border:1px solid #d4ba7299;border-radius:4px}
.narrate-button:hover{background:#c4a45c44}
.narrate-button svg{width:20px;height:20px}
.media-row small{font-size:10px;color:#7b997b}
.media-feedback{font-size:12px;line-height:1.8;color:#d0b270;min-height:22px;margin-top:10px}
.detail-navigation{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 26px;border-top:1px solid #a0b17833}
.detail-navigation .button{font-size:14px;color:#c2cbaa;letter-spacing:1px}
.detail-navigation .button:hover{background:#bbbf8615}
.detail-pagination{display:flex;align-items:center;gap:10px}
.detail-pagination button{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;font-size:14px;font-family:Georgia,serif;color:#9ab28f}
.detail-pagination button:hover{background:#b9c08220}
.detail-pagination button[aria-current=true]{background:linear-gradient(120deg,#bba66a,#e4c88d);color:#193c2c}
.tour-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 30px;background:#0c2d24;font-size:12px;color:#93aa88;gap:16px}
.tour-bar .button{font-size:12px;color:#c4ca9d;min-height:34px}
.tour-bar .button:hover{background:#c0b57817}
.tour-bar .button svg{width:15px;height:15px}
#detail-step{font-family:Georgia,serif;letter-spacing:3px;min-width:80px}
#tour-timing{font-size:11px;min-width:80px;text-align:right}
.tour-progress{height:3px;background:#183c2a}
.tour-progress:after{content:"";display:block;height:100%;width:0;background:#d9b86f;box-shadow:0 0 10px #dfbb6c}
.detail-dialog.touring .tour-progress:after{animation:tour-countdown 18s linear infinite}
.detail-dialog.tour-paused .tour-progress:after{animation-play-state:paused}
@keyframes tour-countdown{from{width:0}to{width:100%}}
.map-viewer{width:calc(100vw - 70px);height:calc(100svh - 70px);max-width:2800px;max-height:none;overflow:hidden}
.map-viewer[open]{display:flex;flex-direction:column}
.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 27px;border-bottom:1px solid #b1b87c44}
.viewer-header .eyebrow{font-size:9px;color:#819e7e}
.viewer-header h2{font-size:26px;letter-spacing:4px;font-weight:500;margin-top:7px}
.viewer-actions{display:flex;align-items:center;gap:14px}
#zoom-value{width:50px;text-align:center;color:#d0c28f;font-size:13px}
#close-viewer{margin-left:16px}
.viewer-scroll{flex:1;min-height:0;overflow:auto;background:#0b281e;position:relative;overscroll-behavior:contain}
.viewer-scroll.zoomed{cursor:grab}
.viewer-scroll.dragging{cursor:grabbing;user-select:none}
.viewer-scroll img{display:block;max-width:none;margin:auto;user-select:none}
.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;color:#8da486;padding:16px 27px}
.toast{position:fixed;bottom:34px;left:50%;transform:translate(-50%,15px);opacity:0;visibility:hidden;pointer-events:none;z-index:20;color:#efdbad;background:#163e2ef5;border:1px solid #d7bd7c99;border-radius:5px;padding:14px 25px;box-shadow:0 5px 35px #0005;font-size:14px;transition:.2s;max-width:90vw;text-align:center}
.toast.visible{transform:translate(-50%,0);opacity:1;visibility:visible}
@media(min-width:2200px){
.screen-main{grid-template-columns:285px minmax(0,1fr) 285px;gap:35px}
.screen-shell{padding-left:5%;padding-right:5%}
.screen-title h1{font-size:49px;letter-spacing:10px}
.place-copy strong{font-size:22px}
.place-copy small{font-size:12px}
.place-item{padding:16px 22px;gap:20px}
.item-number{font-size:36px}
.wing-heading h2{font-size:28px}
.wing-heading>span{font-size:13px}
.wing-foot p{font-size:13px}
.map-point{width:48px;height:48px}
.map-point span{font-size:20px}
.filter{font-size:16px;padding-left:26px;padding-right:26px}
.sandtable-label>span,.sandtable-label .button,.sandtable-base{font-size:13px}
.sandtable-label{min-height:40px}
.sandtable-base{min-height:37px}
}
@media(min-aspect-ratio:29/9) and (min-width:2800px){
.screen-shell{padding-left:8%;padding-right:8%;grid-template-rows:138px minmax(0,1fr) 92px 26px}
.screen-main{grid-template-columns:minmax(340px,1fr) minmax(0,3.2fr) minmax(340px,1fr);gap:45px}
.screen-title h1{font-size:54px;letter-spacing:16px}
.wing{padding-top:40px}
.place-item{padding-left:26px;gap:24px}
.place-copy strong{font-size:25px;letter-spacing:3px}
.place-copy small{font-size:14px;letter-spacing:1px}
.wing-heading h2{font-size:31px;letter-spacing:4px}
.item-number{font-size:44px}
.control-deck{margin-left:22%;margin-right:22%}
}
@media(max-height:900px) and (min-width:1001px){
.screen-shell{min-height:650px;grid-template-rows:110px minmax(0,1fr) 73px 22px;gap:11px;padding-top:12px}
.screen-title h1{font-size:36px;letter-spacing:5px}
.screen-title>p{font-size:10px;margin-bottom:7px}
.title-baseline{margin-top:7px}
.title-baseline span{font-size:10px}
.screen-main{grid-template-columns:190px minmax(0,1fr) 190px;gap:18px}
.wing{padding-top:20px}
.wing-heading{padding-bottom:18px}
.wing-heading p{font-size:7px;margin-bottom:10px}
.wing-heading h2{font-size:21px}
.wing-heading>span{font-size:9px;margin-top:6px}
.wing-heading:before{top:22px;height:20px}
.place-list{gap:10px}
.place-item{min-height:66px;padding:10px;gap:11px}
.place-copy strong{font-size:16px;letter-spacing:.5px}
.place-copy small{font-size:8px;margin-top:4px}
.item-number{font-size:26px}
.wing-foot{padding-top:15px}
.wing-foot p{font-size:9px}
.wing-symbol{font-size:33px}
.wing-symbol.rings{font-size:40px}
.atlas{grid-template-rows:45px minmax(0,1fr) 26px}
.filter{font-size:11px;padding:7px 16px;min-height:30px}
.atlas-caption{font-size:10px}
.guide-button{padding:11px 22px;min-width:260px;gap:15px}
.guide-button strong{font-size:18px}
.guide-button small{font-size:8px;margin-top:5px}
.deck-statement p{font-size:13px}
.deck-statement small{font-size:9px;margin-top:6px}
.exploration-status #visited-count{font-size:14px}
.screen-brand{font-size:18px;gap:10px}
.brand-seal{font-size:39px}
.offline-status{font-size:8px}
}
@media(max-width:1500px) and (min-width:1001px){
.screen-shell{padding-left:2.5%;padding-right:2.5%}
.screen-main{grid-template-columns:175px minmax(0,1fr) 175px;gap:17px}
.screen-title h1{font-size:34px}
.screen-brand{font-size:17px;gap:8px;letter-spacing:2px}
.brand-seal{font-size:35px;padding-left:10px}
.brand-seal span{font-size:19px}
.screen-brand small{font-size:5px;letter-spacing:1px}
.wing-heading h2{font-size:20px}
.wing-heading>span{font-size:9px}
.place-item{gap:10px;padding-left:11px;padding-right:8px}
.place-copy strong{font-size:15px}
.place-copy small{font-size:8px}
.item-number{font-size:25px}
.control-deck{margin:0 5%}
.sandtable-base{font-size:8px;letter-spacing:.5px}
.detail-dialog{width:calc(100vw - 90px);max-height:calc(100svh - 70px)}
.detail-copy{padding:25px 29px 20px}
.detail-copy h2{font-size:32px}
.detail-subtitle{font-size:15px}
.detail-description{font-size:13px}
#detail-features li{font-size:12px}
.scene-side{min-height:520px}
}
@media(max-width:1000px){
.screen-shell{height:auto;min-height:100svh;display:flex;flex-direction:column;gap:23px;padding:20px 22px 12px;overflow:hidden}
.screen-header{grid-template-columns:1fr auto;gap:20px;min-height:160px;padding-bottom:17px;flex-shrink:0}
.screen-title{grid-column:1/-1;grid-row:2;justify-self:center}
.screen-title h1{font-size:34px;letter-spacing:5px}
.screen-title>p{font-size:10px}
.title-baseline span{font-size:11px}
.screen-brand{font-size:18px}
.brand-seal{font-size:35px}
.screen-brand small{font-size:6px}
.screen-utilities{flex-direction:row;align-items:center;gap:15px}
.offline-status{font-size:9px}
.screen-fullscreen{font-size:11px}
.screen-main{display:grid;grid-template-columns:1fr 1fr;gap:25px;min-height:0}
.atlas{grid-row:1;grid-column:1/-1;display:block}
.atlas-heading{padding-bottom:16px}
.filter{font-size:12px;padding:9px 21px;min-height:37px}
.sandtable{padding:5px 7px}
.map-viewport{height:clamp(390px,55vw,520px);overflow:auto;align-items:flex-start;justify-content:flex-start;overscroll-behavior-x:contain;flex:auto}
.sandtable-label{min-height:36px}
.sandtable-base{padding:12px 5px 7px}
.atlas-caption{padding-top:17px}
.wing{padding-top:0}
.wing-heading h2{font-size:23px}
.wing-heading>span{font-size:11px}
.wing-heading p{font-size:7px}
.place-list{gap:11px}
.place-item{min-height:90px;padding:15px 17px;flex:auto}
.place-copy strong{font-size:19px}
.place-copy small{font-size:10px}
.item-number{font-size:30px}
.wing-foot{padding-top:20px}
.wing-foot p{font-size:11px}
.control-deck{margin:0;min-height:100px;gap:18px}
.guide-button{min-width:260px;padding:16px 22px;gap:13px}
.guide-button strong{font-size:18px}
.guide-button .guide-arrow{display:none}
.deck-statement p{font-size:13px;letter-spacing:1px}
.deck-statement small{font-size:9px;letter-spacing:1px}
.exploration-status #visited-count{font-size:13px;letter-spacing:1px}
.status-dots{display:none}
.screen-footer{flex-wrap:wrap;gap:7px;padding-top:12px}
.screen-footer span:last-child{display:none}
.detail-dialog{width:calc(100vw - 40px);max-height:calc(100svh - 40px)}
.detail-copy{padding:25px}
.detail-copy h2{font-size:29px}
.detail-subtitle{font-size:14px}
.detail-description{font-size:12px}
#detail-features li{font-size:12px}
.scene-side{min-height:550px}
.detail-pagination{gap:4px}
}
@media(max-width:650px){
.screen-shell{padding:15px 14px 12px;gap:21px}
.screen-header{gap:15px;min-height:167px}
.screen-brand{font-size:16px;letter-spacing:2px;gap:8px}
.brand-seal{font-size:32px;padding-left:10px}
.brand-seal span{font-size:16px}
.screen-brand small{font-size:5px;letter-spacing:.7px}
.screen-utilities{gap:0}
.offline-status{display:none}
.screen-fullscreen{font-size:10px;padding:8px}
.screen-fullscreen svg{width:14px;height:14px}
.screen-title h1{font-size:25px;letter-spacing:3px}
.screen-title>p{font-size:9px;letter-spacing:2px;margin-bottom:8px}
.title-baseline span{font-size:9px;letter-spacing:2px}
.title-baseline i{width:32px}
.screen-main{gap:17px}
.filter{font-size:10px;padding:9px 12px;min-height:35px;letter-spacing:.5px}
.filters{gap:1px;padding:3px}
.atlas-heading{padding-bottom:16px}
.map-viewport{height:385px}
.map-point{width:37px;height:37px}
.map-point span{font-size:16px}
.map-point:before{font-size:11px;padding:8px 12px;letter-spacing:0}
.sandtable-base{font-size:8px;letter-spacing:0}
.desktop-tip{display:none}
.mobile-tip{display:inline}
#filter-summary{display:none}
.sandtable-label>span{font-size:9px;letter-spacing:1px}
.sandtable-label .button{font-size:9px}
.atlas-caption{gap:10px;font-size:10px;letter-spacing:2px}
.atlas-caption i{width:28px}
.wing-heading{padding-bottom:17px}
.wing-heading h2{font-size:17px;padding-left:9px;letter-spacing:1px}
.wing-heading p{font-size:5px;letter-spacing:1px}
.wing-heading>span{font-size:8px;padding-left:9px;letter-spacing:.5px}
.wing-heading:before{height:17px;top:24px}
.place-item{min-height:86px;padding:12px 9px;gap:9px}
.place-copy strong{font-size:13px;letter-spacing:0}
.place-copy small{font-size:8px;line-height:1.7;margin-top:5px}
.item-number{font-size:23px}
.wing-foot{gap:10px;padding-left:3px}
.wing-foot p{font-size:8px;letter-spacing:1px}
.wing-symbol{font-size:30px}
.wing-symbol.rings{font-size:37px}
.control-deck{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;padding:15px 0 8px}
.guide-button{order:-1;width:100%;justify-content:center;padding:17px;min-width:0}
.guide-button strong{font-size:20px;letter-spacing:4px}
.guide-button small{font-size:9px}
.deck-statement{margin-right:auto;gap:9px}
.deck-statement p{font-size:11px}
.deck-statement small{font-size:8px}
.exploration-status #visited-count{font-size:12px}
.exploration-status small{font-size:8px}
.screen-footer{font-size:7px;line-height:1.9;letter-spacing:.5px}
.screen-footer span{display:block}
.detail-dialog{width:calc(100vw - 22px);max-height:calc(100svh - 24px)}
.dialog-header{padding:11px 14px}
.dialog-header>.eyebrow{font-size:7px;letter-spacing:1px;max-width:60%}
.dialog-header-actions{gap:8px}
.tour-status{font-size:9px}
.icon-button{width:34px;height:34px;min-width:34px}
.icon-button svg{width:17px;height:17px}
.detail-split{display:flex;flex-direction:column}
.scene-side{min-height:0;height:270px;flex-shrink:0}
.detail-scene{min-height:210px}
.scene-caption{padding:8px 14px;font-size:10px}
.scene-caption .button{min-height:30px;font-size:10px}
.scene-label{font-size:10px;bottom:14px;left:14px;padding:7px 10px}
.detail-copy{padding:23px 22px 13px}
.detail-copy h2{font-size:29px;margin-top:12px;letter-spacing:2px}
.detail-subtitle{font-size:14px}
.detail-description{font-size:12px;margin:20px 0}
.detail-tags span{font-size:10px;padding:5px 8px}
.scheme-badge{font-size:9px}
.design-heading{font-size:12px}
#detail-category{font-size:10px}
#detail-features li{font-size:12px}
.media-row{gap:10px}
.narrate-button{font-size:12px;padding:12px 15px}
.media-row small{font-size:8px}
.detail-navigation{padding:10px 12px;gap:8px}
.detail-navigation .button{font-size:11px;padding:8px 4px}
.detail-navigation .button span{display:none}
.detail-pagination{gap:1px}
.detail-pagination button{width:28px;height:30px;font-size:11px}
.tour-bar{padding:9px 14px;gap:8px}
#tour-timing{display:none}
#detail-step{min-width:45px;font-size:10px}
.tour-bar .button{font-size:10px}
.map-viewer{width:calc(100vw - 16px);height:calc(100svh - 24px)}
.viewer-header{padding:12px;gap:10px}
.viewer-header .eyebrow{display:none}
.viewer-header h2{font-size:17px;letter-spacing:2px}
.viewer-actions{gap:5px}
#zoom-value{font-size:10px;width:38px}
#close-viewer{margin-left:4px}
.viewer-actions .icon-button{width:29px;height:29px;min-width:29px}
.viewer-actions svg{width:14px;height:14px}
.viewer-footer{padding:12px;font-size:9px;flex-wrap:wrap;gap:5px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Both views share one coordinate system and the exact same reserved layout. */
.atlas-heading{justify-content:space-between;gap:12px;align-items:flex-start}
.mode-switch{display:flex;border:1px solid #bca76d65;border-radius:5px;padding:3px;gap:3px;background:#0a211b80}
.mode-button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:37px;padding:8px 16px;font-size:13px;letter-spacing:1px;color:#aebd9f;border-radius:3px;white-space:nowrap}
.mode-button svg{width:16px;height:16px}
.mode-button:hover{background:#d8c68616}
.mode-button.active{background:linear-gradient(110deg,#6b856338,#9aa36928);color:#f0dbac;box-shadow:inset 0 0 0 1px #c3b47b55}
.atlas-heading .filter{padding-left:15px;padding-right:15px}
.community-map,#viewer-image{transition:filter .65s ease}
.mobility-overlay{position:absolute;left:0;width:100%;max-width:none;fill:none;stroke:none;pointer-events:none;opacity:0;transition:opacity .65s ease}
[data-mode=mobility]>.community-map,[data-mode=mobility]>#viewer-image{filter:saturate(.58) brightness(1.13) contrast(.88)}
[data-mode=mobility]>.mobility-overlay{opacity:1}
[data-mode=mobility] .map-point{background:linear-gradient(145deg,#fff,#e3f0ff);color:#1d67a8;border-color:white;box-shadow:0 0 0 4px #2e72c261,0 3px 12px #1532267a}
[data-mode=mobility] .map-point.selected{background:#296bb0;color:#fff}
.route-main,.route-branch,.route-activity{transition:opacity .3s}
[data-route-filter=main]{--branch-opacity:.12;--activity-opacity:.12}
[data-route-filter=branch]{--main-opacity:.13;--activity-opacity:.12}
[data-route-filter=activity]{--main-opacity:.13;--branch-opacity:.12}
.route-legend{height:29px;min-height:29px;display:flex;align-items:center;justify-content:center;gap:18px;font-size:9px;letter-spacing:.5px;color:#b1c3a2;padding:0 8px;white-space:nowrap}
.route-legend[hidden]{display:flex!important;visibility:hidden}
.route-legend>span{display:flex;align-items:center;gap:6px}
.route-legend i{display:block;width:20px;border-top:3px dashed}
.route-legend .blue{color:#4c9bf5}.route-legend .purple{color:#bd78e4}.route-legend .amber{color:#f1a24a;border-top-style:dotted}
.route-legend small{font-size:8px;color:#7e9b81}
.viewer-paper{position:relative;margin:auto;flex-shrink:0}
.viewer-paper>img{margin:0}
.viewer-paper>.mobility-overlay{inset:0;height:100%}
@media(min-width:2200px){.mode-button{font-size:16px;min-height:39px;padding-left:20px;padding-right:20px}.atlas-heading .filter{padding-left:19px;padding-right:19px}.route-legend{font-size:12px;gap:23px;height:33px;min-height:33px}.route-legend small{font-size:10px}}
@media(max-height:900px) and (min-width:1001px){.mode-button{font-size:11px;min-height:31px;padding:7px 12px}.atlas-heading .filter{padding-left:10px;padding-right:10px}.route-legend{height:24px;min-height:24px;font-size:8px;gap:12px}.route-legend small{display:none}}
@media(max-width:1250px) and (min-width:1001px){.mode-button{padding-left:10px;padding-right:10px;font-size:10px}.mode-button svg{width:13px;height:13px}.atlas-heading .filter{font-size:10px;padding-left:7px;padding-right:7px}.route-legend small{display:none}}
@media(max-width:1000px){.atlas-heading{flex-wrap:wrap;justify-content:center;gap:12px}.mode-button{font-size:13px;min-height:38px;padding:9px 22px}.atlas-heading .filters{flex-shrink:0}.route-legend{gap:14px;font-size:9px}.route-legend small{display:none}}
@media(max-width:650px){.mode-switch{width:100%;justify-content:center}.mode-button{flex:1;font-size:12px;min-height:38px}.atlas-heading .filter{font-size:10px;padding:8px 12px}.route-legend{height:31px;min-height:31px;font-size:8px;gap:10px}.route-legend i{width:14px;border-top-width:2px}}
