:root{color-scheme:dark;--green:#28b965;--green2:#0aa594;--ink:#071416;--panel:rgba(7,20,22,.88);--line:rgba(255,255,255,.18)}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--ink);font-family:Inter,Arial,sans-serif;color:#fff;overflow:hidden}
button,a{font:inherit}
button{color:inherit}
.viewer-header{height:72px;padding:0 42px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:#fff;color:#101a20;position:relative;z-index:20}
.viewer-brand{display:flex;align-items:center;gap:24px;color:inherit;text-decoration:none;min-width:0}
.viewer-brand img{display:block;width:145px;height:auto}
.viewer-brand span{border-left:1px solid #dce2e5;padding-left:24px;display:flex;flex-direction:column;line-height:1.12}
.viewer-brand small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#6b747a}
.viewer-brand strong{font-size:14px;margin-top:4px;white-space:nowrap}
.tour-tabs{display:flex;padding:4px;background:#f4f6f5;border:1px solid #e3e8e5;border-radius:999px}
.tour-tabs button{border:0;background:transparent;color:#606a66;padding:9px 20px;border-radius:999px;cursor:pointer}
.tour-tabs button.active{background:linear-gradient(120deg,var(--green),var(--green2));color:#fff}
.exit-tour{justify-self:end;display:flex;align-items:center;gap:18px;color:#111;text-decoration:none;font-weight:700;font-size:14px}
.exit-tour span{width:34px;height:34px;border:1px solid #e4e7e5;border-radius:50%;display:grid;place-items:center;font-size:23px;font-weight:400}
.viewer-shell{height:calc(100% - 72px);position:relative;background:#101b1d;isolation:isolate}
#viewer{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab;opacity:1;transition:opacity .65s ease}
#viewerShell.scene-changing #viewer{opacity:.18}
#viewer.dragging{cursor:grabbing}
.scene-heading{position:absolute;z-index:3;top:28px;left:50px;text-shadow:0 2px 16px rgba(0,0,0,.5);pointer-events:none}
.scene-heading small{font-size:10px;text-transform:uppercase;letter-spacing:.18em}
.scene-heading h1{font-size:40px;line-height:1.05;margin:7px 0 7px;font-weight:500}
.scene-heading p{margin:0;font-size:14px;color:rgba(255,255,255,.8)}
.loading{position:absolute;z-index:9;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;background:#111d1f;color:#fff;text-align:center}
.loading.hidden{display:none}
.loading strong{font-size:17px}
.loading>span:last-child{font-size:13px;color:#aeb8b5}
.spinner{width:40px;height:40px;border:2px solid rgba(255,255,255,.15);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.gesture-hint{position:absolute;z-index:3;left:50%;bottom:112px;transform:translateX(-50%);margin:0;font-size:12px;color:rgba(255,255,255,.72);text-shadow:0 1px 6px #000;pointer-events:none;white-space:nowrap;transition:opacity .35s ease}
.viewer-controls{position:absolute;z-index:5;right:30px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px;transition:opacity .35s ease}
.viewer-controls button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(8,15,16,.72);font-size:23px;cursor:pointer;backdrop-filter:blur(8px)}
.viewer-controls button.active{background:linear-gradient(120deg,var(--green),var(--green2))}
.scene-dock{position:absolute;z-index:6;left:48px;right:48px;bottom:18px;height:76px;display:grid;grid-template-columns:88px 42px minmax(0,1fr) 42px 70px;align-items:center;gap:10px;transition:opacity .35s ease}
.viewer-shell.ui-idle .viewer-controls,.viewer-shell.ui-idle .scene-dock,.viewer-shell.ui-idle .gesture-hint{opacity:.24}
.viewer-shell.ui-idle .viewer-controls:hover,.viewer-shell.ui-idle .scene-dock:hover{opacity:1}
.scene-menu,.about-button{height:70px;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;text-shadow:0 1px 8px #000}
.scene-menu:before{content:'•••';width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(8,15,16,.72);border:1px solid var(--line);letter-spacing:2px}
.about-button b{width:42px;height:42px;border:2px solid #fff;border-radius:50%;display:grid;place-items:center;font-family:Georgia,serif;font-size:26px}
.scene-menu,.about-button span{font-size:12px}
.strip-arrow{width:42px;height:52px;border:0;border-radius:22px;background:rgba(8,15,16,.7);font-size:34px;cursor:pointer}
.scene-strip{display:flex;gap:9px;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}
.scene-strip::-webkit-scrollbar{display:none}
.scene-card{position:relative;flex:0 0 132px;height:68px;border:1px solid rgba(255,255,255,.42);border-radius:7px;padding:0;overflow:hidden;background:rgba(8,15,16,.68);cursor:pointer;text-align:left;backdrop-filter:blur(8px)}
.scene-card.active{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
.scene-card span{display:flex;align-items:flex-end;width:100%;height:100%;padding:10px;box-sizing:border-box;font-size:11px;line-height:1.25;white-space:normal;overflow:hidden}
.info-panel{position:absolute;z-index:12;right:26px;bottom:105px;width:min(360px,calc(100% - 32px));padding:26px;background:var(--panel);border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(14px);display:none}
.info-panel.open{display:block}
.info-panel button{position:absolute;right:12px;top:8px;border:0;background:transparent;font-size:25px;cursor:pointer}
.info-panel small{text-transform:uppercase;letter-spacing:.14em;color:#7ee8b0}
.info-panel h2{margin:8px 0 10px}.info-panel p{margin:0;color:#c9d2cf;line-height:1.6;font-size:14px}
@media(max-width:900px){
  .viewer-header{height:60px;padding:0 14px;grid-template-columns:1fr auto}.viewer-shell{height:calc(100% - 60px)}
  .viewer-brand img{width:116px}.viewer-brand span,.exit-tour{display:none}
  .tour-tabs{justify-self:end}.tour-tabs button{padding:8px 10px;font-size:12px}
  .scene-heading{top:18px;left:18px}.scene-heading h1{font-size:29px}
  .viewer-controls{right:12px;top:46%}.viewer-controls button{width:40px;height:40px}
  .gesture-hint{bottom:101px;font-size:11px}
  .scene-dock{left:10px;right:10px;bottom:max(8px,env(safe-area-inset-bottom));height:78px;grid-template-columns:60px minmax(0,1fr) 52px;gap:7px}
  .strip-arrow{display:none}.scene-card{flex-basis:112px;height:62px}.scene-menu,.about-button{height:64px}.scene-menu:before,.about-button b{width:38px;height:38px}
}
@media(max-width:560px){
  .tour-tabs button{padding:7px 8px}.scene-heading h1{font-size:25px}
  .scene-dock{grid-template-columns:52px minmax(0,1fr) 46px}.scene-card{flex-basis:102px}
  .gesture-hint{display:none}.viewer-controls{top:auto;bottom:100px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.spinner{animation:none}}