:root{--bg:#eee9e1;--ink:#343f3b;--sub:#73796e;--line:#c9c9bc;--panel:#fffdf6;--accent:#b57850;--mint:#bfcdb6;--sans:"Microsoft YaHei","PingFang SC",sans-serif;--mono:"Cascadia Code",Consolas,monospace;color-scheme:light}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.8 var(--sans);transition:background .6s,color .6s}body.night{--bg:#252e39;--ink:#e9e1cd;--sub:#b7b8b1;--line:#54606a;--panel:#333e49;--accent:#efc383;--mint:#789a90}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}a{color:inherit;text-underline-offset:5px}button{font:inherit;color:inherit;cursor:pointer}a,button{transition:background .2s,transform .2s,color .2s}button:focus-visible,a:focus-visible,#stage:focus-visible{outline:3px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}h1,h2,p{margin:0}.skip{position:fixed;top:-100px;left:15px;background:var(--panel);padding:10px 20px;z-index:99}.skip:focus{top:10px}.topbar{height:87px;display:flex;justify-content:space-between;align-items:center;margin:0 4%;border-bottom:1px solid var(--line);gap:25px}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;font-size:15px;font-weight:600;line-height:1.5}.brand-mark{font-size:39px;line-height:1;color:var(--accent);font-weight:400}.brand small{display:block;font:8px var(--mono);letter-spacing:.15em;margin-top:6px;color:var(--sub)}.topbar nav{display:flex;gap:27px;font-size:11px}.topbar nav>a{text-decoration:none}.studio-layout{display:grid;grid-template-columns:270px minmax(0,1fr);max-width:1600px;margin:auto;padding:0 4%;min-height:calc(100svh - 142px)}.intro{position:relative;z-index:1;padding-top:48px;padding-bottom:25px}.eyebrow{font:9px var(--mono);letter-spacing:.12em;color:var(--sub)}.eyebrow>i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#829878;margin-right:8px}.intro h1{font-size:43px;line-height:1.45;letter-spacing:-.045em;font-weight:600;margin:24px 0}.intro h1 em{font-style:normal;color:var(--accent)}.lead{font-size:12px;line-height:2.1;color:var(--sub)}.intro-divider{width:45px;height:1px;background:var(--line);margin:25px 0}.guide{font-size:11px;color:var(--sub);line-height:1.9}.destinations{display:flex;flex-direction:column;width:180px;margin:19px 0 28px}.destinations button{display:flex;align-items:center;gap:17px;text-align:left;border:0;border-bottom:1px solid var(--line);background:none;font-size:12px;padding:10px 1px;min-height:43px}.destinations button span{font:9px var(--mono);color:var(--accent)}.destinations button b{font-size:16px;font-weight:400;margin-left:auto}.room-note{font-size:10px;color:var(--sub);line-height:1.85}.scene-area{position:relative;min-width:0;display:flex;flex-direction:column;justify-content:center;padding-top:18px;min-height:750px}.scene-caption{position:absolute;top:27px;left:17px;right:17px;display:flex;justify-content:space-between;gap:15px;font:9px var(--mono);letter-spacing:.14em;color:var(--sub);pointer-events:none;z-index:1}#stage{position:relative;width:100%;height:650px;min-height:450px;outline-offset:-5px;touch-action:none;isolation:isolate}#stage canvas{display:block;width:100%;height:100%;outline:none;touch-action:none}#hotspots{position:absolute;inset:0;overflow:clip;pointer-events:none;z-index:2}.hotspot{position:absolute;left:0;top:0;display:flex;align-items:center;gap:7px;border:0;border-radius:20px;background:var(--panel);box-shadow:0 3px 12px #24393615;padding:4px 10px 4px 4px;pointer-events:auto;opacity:0;white-space:nowrap}.hotspot span{display:grid;place-items:center;width:25px;height:25px;border:1px solid var(--line);border-radius:50%;background:var(--panel);font:9px var(--mono)}.hotspot b{font-size:10px;font-weight:500}.hotspot.active{box-shadow:0 0 0 2px var(--accent),0 3px 12px #24393615}.scene-controls{display:flex;align-items:center;justify-content:center;gap:13px;margin-top:-6px;position:relative;z-index:3}.controls-group{display:flex;align-items:center;gap:2px;border:1px solid var(--line);border-radius:25px;padding:3px;background:var(--panel)}.scene-controls button{display:flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:22px;background:var(--panel);height:37px;min-width:37px;font-size:12px;padding:0 12px}.scene-controls #turn-left,.scene-controls #turn-right,.scene-controls #zoom-out,.scene-controls #zoom-in{font-size:20px;line-height:1;padding:0 8px}.zoom>span{font-size:9px;color:var(--sub);padding:0 4px}.scene-controls>.light-toggle{border-color:var(--line);height:45px;padding-inline:16px;gap:8px;font-size:11px}.light-toggle>span{font-size:20px}.scene-controls>#motion-toggle{border:1px solid var(--line);width:45px;height:45px;font-size:12px}.interaction-hint{font-size:10px;color:var(--sub);text-align:center;letter-spacing:.02em;margin-top:16px;margin-bottom:22px}.interaction-hint>span{padding:0 10px}.scene-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:var(--sub);pointer-events:none}.scene-loading p{font-size:12px}.loading-star{font-size:45px;color:var(--accent);animation:spin 5s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.detail{position:fixed;right:35px;bottom:90px;width:340px;max-width:calc(100vw - 32px);padding:29px;border:1px solid var(--line);background:var(--panel);border-radius:13px;box-shadow:0 18px 70px #18262230;z-index:20}.detail h2{font-size:27px;letter-spacing:-.04em;line-height:1.5;margin:18px 0 13px}.detail>p{font-size:12px;line-height:1.95;color:var(--sub)}#detail-close{position:absolute;right:11px;top:11px;width:33px;height:33px;display:grid;place-items:center;background:transparent;border:1px solid var(--line);border-radius:50%;font-size:21px;line-height:1}#detail-links{display:flex;flex-direction:column;gap:10px;margin:20px 0 0}#detail-links a{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:5px;padding:10px 13px;font-size:12px;text-decoration:none}#detail-links a:first-child{background:var(--ink);color:var(--panel);border-color:var(--ink)}#detail-note{font-size:10px;margin-top:17px}.scrim{position:fixed;inset:0;z-index:15;background:#1f282517;backdrop-filter:blur(1px)}footer{height:55px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 4%;border-top:1px solid var(--line);font-size:9px;color:var(--sub)}footer a{text-decoration:none}.announcement{position:fixed;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#fallback{position:absolute;inset:90px 15px 100px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px;border:1px dashed var(--line);border-radius:15px;background:var(--panel);padding:30px;text-align:center}#fallback h2{font-size:24px}#fallback p{max-width:300px;font-size:13px;color:var(--sub)}#fallback a{font-size:13px}.nojs{position:fixed;bottom:0;left:0;right:0;padding:16px;background:var(--panel);text-align:center;z-index:30}body.unavailable .scene-controls{display:none}body.unavailable .scene-loading{display:none}
@media(hover:hover) and (pointer:fine){.destinations button:hover{color:var(--accent);padding-left:5px}.hotspot:hover{transform:translateY(-3px)}.scene-controls button:hover{background:var(--mint);color:#283e34}#detail-links a:hover{transform:translateY(-2px)}.topbar a:hover{color:var(--accent)}}
@media(min-width:1500px){.studio-layout{grid-template-columns:300px minmax(0,1fr)}#stage{height:720px}.intro{padding-top:68px}.intro h1{font-size:49px}}
@media(max-width:1050px){.studio-layout{grid-template-columns:210px minmax(0,1fr);padding-inline:3%}.intro h1{font-size:35px}.scene-area{min-height:690px}#stage{height:570px}.intro{padding-top:37px}.scene-controls{gap:8px}.controls-group.zoom{display:none}.topbar{margin-inline:3%}.topbar nav{gap:15px}}
@media(max-width:700px){.topbar{height:72px;margin:0 20px;gap:12px}.brand{font-size:12px;gap:8px}.brand-mark{font-size:32px}.brand small{font-size:6px;letter-spacing:.08em}.topbar nav{gap:12px;font-size:10px}.topbar nav>a:nth-child(2){display:none}.studio-layout{display:flex;flex-direction:column;padding:0;min-height:auto}.intro{padding:26px 24px 0;display:grid;grid-template-columns:1fr 1fr;gap:0 17px}.intro>.eyebrow{grid-column:1 / -1;font-size:8px}.intro h1{font-size:30px;line-height:1.4;grid-column:1;grid-row:2 / span 2;margin:15px 0}.lead{font-size:10px;grid-column:2;grid-row:2;margin-top:18px;line-height:2}.intro-divider,.guide,.room-note{display:none}.destinations{width:auto;grid-column:1 / -1;display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:14px 0 4px}.destinations button{border:1px solid var(--line);border-radius:4px;gap:5px;padding:7px 6px;min-height:38px;font-size:10px;justify-content:center}.destinations button b{display:none}.destinations button span{font-size:8px}.scene-area{min-height:0;padding-top:5px}#stage{height:440px;min-height:0}.scene-caption{top:20px;left:24px;right:24px;font-size:7px;letter-spacing:.06em}.hotspot b{font-size:9px}.hotspot span{width:22px;height:22px;font-size:8px}.hotspot{padding:3px 8px 3px 3px;gap:4px}.scene-controls{margin-top:0;gap:8px}.scene-controls button{height:32px;min-width:32px;font-size:10px;padding:0 9px}.scene-controls>.light-toggle{height:40px;padding:0 12px;font-size:10px}.scene-controls>#motion-toggle{width:40px;height:40px}.interaction-hint{font-size:8px;margin:15px 0 27px}.interaction-hint>span{padding:0 6px}.detail{right:16px;bottom:18px;width:calc(100% - 32px);padding:26px;max-height:80svh;overflow:auto}.detail h2{font-size:25px}.detail>p{font-size:13px}footer{height:auto;min-height:65px;flex-wrap:wrap;gap:8px;padding:13px 0;margin:0 24px;font-size:8px}footer p{order:3;width:100%}footer a{margin-left:auto}#fallback{inset:50px 20px 80px;padding:20px}#fallback p{font-size:12px}}
@media(max-width:360px){.topbar{margin-inline:15px}.topbar nav>a:first-child{display:none}.intro{padding-inline:18px}.intro h1{font-size:27px}.lead{font-size:9px}.destinations button{font-size:9px;gap:3px}#stage{height:390px}.scene-caption{left:18px;right:18px}.hotspot b{font-size:8px}.scene-controls{gap:6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* No permanent labels on the models: only the hovered/focused object has a tip. */
#scene-tooltip{position:absolute;z-index:2;pointer-events:none;border:1px solid var(--line);border-radius:6px;padding:5px 12px;background:var(--panel);color:var(--ink);font-size:11px;box-shadow:0 3px 15px #24393612;white-space:nowrap}
@media(min-width:701px){
 body{height:100dvh;display:grid;grid-template-rows:64px minmax(0,1fr) 44px;overflow:hidden}
 .topbar{height:64px}.studio-layout{height:100%;min-height:0;width:100%;grid-template-columns:240px minmax(0,1fr)}
 .intro{min-height:0;padding-top:clamp(15px,3vh,48px);padding-bottom:10px;overflow:auto;scrollbar-width:thin}
 .intro h1{font-size:clamp(28px,4.4vh,43px);margin:16px 0}.intro-divider{margin:16px 0}
 .destinations{margin:12px 0 17px}.destinations button{padding-block:7px;min-height:36px}
 .scene-area{height:100%;min-height:0;padding-top:32px;justify-content:flex-start}
 .scene-caption{top:16px}
 #stage{flex:1 1 0;height:auto;min-height:0;overflow:clip}
 .scene-controls{flex:none;margin-top:0}.interaction-hint{flex:none;margin:10px 0 16px}
 footer{height:44px;min-height:0}
 .detail{bottom:64px;max-height:calc(100dvh - 95px);overflow:auto}
}
@media(min-width:701px) and (max-height:700px){
 .studio-layout{grid-template-columns:205px minmax(0,1fr)}
 .intro h1{font-size:30px;margin:12px 0}.intro>.eyebrow{font-size:8px}.lead{font-size:11px}
 .intro-divider,.guide,.room-note{display:none}.destinations{margin:16px 0 0}
 .interaction-hint{margin-bottom:10px;font-size:9px}.scene-controls button{height:30px;min-width:30px}
 .scene-controls>.light-toggle,.scene-controls>#motion-toggle{height:38px}
}