:root{color-scheme:dark;--ink:#131b20;--accent:#a6e1d3;--dim:#c4cbd0;--line:rgba(255,255,255,.18);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:16px}*{box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{margin:0;background:var(--ink);color:#fff}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent}button:focus-visible,#pano:focus-visible{outline:3px solid var(--accent);outline-offset:4px}button:disabled{opacity:.45;cursor:default}svg{width:21px;height:21px;display:block;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}[hidden]{display:none!important}#tour,#pano,.shade{position:absolute;inset:0}#tour{position:fixed;overflow:hidden;height:100%;height:100dvh;--edge-top:max(18px,env(safe-area-inset-top));--edge-bottom:max(16px,env(safe-area-inset-bottom));--edge-left:max(16px,env(safe-area-inset-left));--edge-right:max(16px,env(safe-area-inset-right))}#pano{touch-action:none;background:#222e32}.shade{pointer-events:none;background:linear-gradient(180deg,rgba(5,13,18,.48),transparent 25%,transparent 50%,rgba(5,13,18,.16) 66%,rgba(5,13,18,.84) 100%)}.topbar{z-index:10;gap:12px;position:absolute;top:max(30px,env(safe-area-inset-top));left:36px;right:36px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.brand,.top-actions{display:flex;align-items:center;pointer-events:auto}.brand{gap:14px;min-width:0;text-shadow:0 1px 12px #0008}.brand-icon{flex-shrink:0;display:grid;place-items:center;font-size:32px;width:48px;height:48px;border:1px solid #ffffff65;border-radius:14px}.brand-copy{min-width:0}.brand strong{font-size:23px;letter-spacing:.02em;font-weight:600;display:block;line-height:1.3;white-space:nowrap}.brand .property-details{display:flex;align-items:baseline;gap:14px;font-size:13px;letter-spacing:.02em;margin-top:5px;color:#e0e5e6;white-space:nowrap}.property-details sup{font-size:.7em;line-height:0;vertical-align:super}.top-actions{flex-shrink:0}.top-actions{gap:10px}.glass{background:#172127b8;border:1px solid var(--line);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 8px 28px #0002}.top-actions button{display:flex;gap:9px;align-items:center;justify-content:center;border-radius:12px;min-height:46px;padding:0 15px;font-size:14px}.top-actions button:hover,.view-controls button:hover{background:#314249}.top-actions .icon-button{width:46px;padding:0}.map-panel{z-index:20;max-height:calc(100% - 124px);overflow-y:auto;overscroll-behavior:contain;position:absolute;right:36px;top:100px;width:302px;color:#29343a;background:#fffffff5;border:1px solid #fff8;border-radius:16px;box-shadow:0 12px 48px #0003;overflow-x:hidden}.map-heading{position:sticky;top:0;z-index:5;background:#fff;padding:12px 12px 8px 16px;display:flex;justify-content:space-between;align-items:flex-start}.map-heading strong{display:block;margin-top:3px;font-size:14px;font-weight:600}.map-heading span{display:block;font-size:12px;color:#76818a;margin-top:5px}.plain{display:grid;place-items:center;min-width:44px;min-height:44px;padding:8px;border-radius:6px}.plain:hover{background:#77889920}.map-canvas{position:relative;margin:0 8px;aspect-ratio:4/3;background:white}.map-canvas>img{width:100%;height:100%;display:block;object-fit:contain}.map-point{position:absolute;width:10px;height:10px;border:1.5px solid white;background:#657b80;border-radius:50%;transform:translate(-50%,-50%);padding:0;box-shadow:0 1px 3px #0004}.map-point:before{content:"";position:absolute;inset:-6px;border-radius:50%}.map-point:hover{z-index:3;background:#174f48;scale:1.4}.map-point.active{width:14px;height:14px;background:#226f61;z-index:2;box-shadow:0 0 0 4px #83cdb955}.map-foot{display:flex;gap:6px;align-items:center;border-top:1px solid #e6e9e9;margin-top:8px;padding:11px 16px;font-size:12px;color:#506168}.map-key{height:6px;width:6px;background:#226f61;border-radius:50%}.map-note{margin-left:auto;flex-shrink:0;color:#889196;font-size:12px}.scene-info{position:absolute;left:40px;bottom:205px;text-shadow:0 2px 15px #0007;pointer-events:none}.eyebrow{font-size:12px;letter-spacing:.15em;color:#cbd8d9}.eyebrow span{margin-left:16px;color:#cbd8d9b0;letter-spacing:.05em;font-variant-numeric:tabular-nums}h1{font-size:44px;font-weight:500;letter-spacing:.06em;line-height:1.2;margin:14px 0 12px}.point-line{display:flex;gap:10px;align-items:center;color:#edf2f1;font-size:14px}.line-dot{width:3px;height:3px;border-radius:50%;background:#aebaba}.point-picker{display:flex;gap:7px;margin-top:17px;pointer-events:auto}.point-picker button{height:36px;min-width:36px;border:1px solid #ffffff48;background:#15222970;border-radius:7px;font-size:12px;color:#d3dedc}.point-picker button.active{color:#153930;background:var(--accent);border-color:var(--accent)}.view-controls{position:absolute;right:36px;bottom:205px;display:flex;align-items:center;padding:5px;border-radius:14px}.view-controls button{width:42px;height:42px;border-radius:9px;display:grid;place-items:center}.view-controls button[aria-pressed=true]{color:var(--accent);background:#a6e1d318}.control-divider{width:1px;height:20px;background:var(--line);margin:0 3px}.room-dock{position:absolute;left:36px;right:36px;bottom:max(24px,env(safe-area-inset-bottom));padding:0}.dock-heading{display:flex;justify-content:space-between;align-items:center;margin:0 1px 12px;font-size:12px;letter-spacing:.08em;color:#e4eeee}.dock-heading span:last-child{color:#d1dfdd99;font-size:12px;letter-spacing:0}#rooms{touch-action:pan-x;overscroll-behavior-x:contain;display:flex;gap:10px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:thin;scrollbar-color:#ffffff50 transparent;scroll-snap-type:x proximity}.room-card{flex:0 0 118px;text-align:left;padding:4px;background:#142128aa;border:1px solid #ffffff26;border-radius:12px;transition:background .2s,border-color .2s;scroll-snap-align:start}.room-card:hover{background:#354549;border-color:#ffffff70}.room-card.active{background:#a6e1d32b;border-color:var(--accent)}.room-card img{width:108px;height:61px;object-fit:cover;border-radius:8px;display:block}.room-card .card-label{display:flex;justify-content:space-between;align-items:center;padding:8px 6px 5px;font-size:14px;white-space:nowrap}.room-card small{font-size:12px;color:#afc1c1}.room-card.active .card-label{color:var(--accent)}.hint{position:absolute;top:100px;left:50%;transform:translateX(-50%);border:1px solid #ffffff20;background:#142127a6;backdrop-filter:blur(14px);padding:11px 18px;border-radius:40px;font-size:12px;color:#e2eae9;pointer-events:none;transition:opacity 1s;white-space:nowrap}.hint.gone{opacity:0}.loading{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:12px;padding:16px 20px;border-radius:12px;background:#15232bdf;font-size:14px;pointer-events:none}.loading>span{width:17px;height:17px;border:2px solid #fff4;border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hotspot{display:flex;flex-direction:column;align-items:center;gap:8px;transform:translate(-50%,-50%);min-width:70px;padding:12px;filter:drop-shadow(0 2px 5px #0005)}.hotspot .ring{width:43px;height:43px;border:2px solid #ffffffdf;border-radius:50%;background:#17282c77;backdrop-filter:blur(3px);display:grid;place-items:center;transition:background .2s,transform .2s;box-shadow:0 0 0 5px #ffffff15}.hotspot .ring:after{content:"";width:11px;height:11px;border:2px solid white;border-radius:50%}.hotspot .target-label{font-size:12px;white-space:nowrap;border-radius:6px;background:#17282cbc;padding:5px 9px;color:white;opacity:.92}.hotspot:hover .ring,.hotspot:focus-visible .ring{background:#4a9b88;transform:scale(1.14)}.hotspot:hover .target-label{background:#163c34}.error{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);z-index:20;background:#18262cf5;border:1px solid #ffffff40;padding:26px;border-radius:16px;max-width:90vw;width:350px;font-size:14px}.error strong{font-size:18px}.error p{color:#cbd4d7;line-height:1.7}.error button{background:var(--accent);color:#17372e;padding:10px 18px;border-radius:8px}dialog{max-height:calc(100% - 32px);max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;border:1px solid #ffffff25;background:#152129;color:#fff;border-radius:20px;width:min(470px,90vw);padding:34px;box-shadow:0 20px 80px #0007}dialog::backdrop{background:#06101799;backdrop-filter:blur(5px)}dialog h2{font-size:25px;font-weight:500;line-height:1.5;margin:14px 0 26px}dialog dl{font-size:14px}dialog dt{color:var(--accent);margin-top:18px}dialog dd{margin:6px 0 0;color:#cbd8dc;line-height:1.7}dialog p{font-size:12px;line-height:1.7;color:#8eaaad;margin:28px 0 0}#help-close{position:absolute;top:16px;right:16px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1500px){.room-card{flex-basis:132px}.room-card img{width:122px;height:69px}.map-panel{width:330px}.scene-info,.view-controls{bottom:215px}}
/* Compact layouts reserve separate space for the title, tools and room dock. */
@media(max-width:760px),(max-height:500px){
  .topbar{left:var(--edge-left);right:var(--edge-right);top:var(--edge-top)}
  .brand{gap:10px}
  .brand-icon{width:44px;height:44px;font-size:28px;border-radius:11px}
  .brand strong{font-size:clamp(16px,4.4vw,20px)}
  .brand .property-details{font-size:12px;gap:12px;letter-spacing:0;margin-top:4px}
  .top-actions{gap:4px}
  .top-actions button,.top-actions .icon-button{width:44px;min-height:44px;padding:0;border-radius:10px}
  .top-actions .action-label{display:none}
  .map-panel{top:calc(var(--edge-top) + 64px);right:var(--edge-right);width:min(350px,calc(100% - var(--edge-left) - var(--edge-right)));max-height:calc(100% - var(--edge-top) - var(--edge-bottom) - 76px)}
  .scene-info{left:var(--edge-left);right:var(--edge-right);bottom:calc(var(--edge-bottom) + 144px)}
  .scene-info h1{font-size:30px;margin:8px 0}
  .eyebrow{font-size:11px}
  .point-line{font-size:12px;gap:8px}
  .point-picker{margin-top:12px;gap:6px;flex-wrap:nowrap;max-width:100%;overflow-x:auto;padding:2px 0}
  .point-picker button{flex:0 0 44px;min-width:44px;height:44px;font-size:13px;border-radius:10px}
  .view-controls{top:calc(var(--edge-top) + 64px);right:var(--edge-right);bottom:auto;padding:3px;border-radius:12px}
  .view-controls button{width:44px;height:44px}
  .view-controls #rotate,.view-controls .control-divider{display:none}
  .room-dock{left:var(--edge-left);right:var(--edge-right);bottom:var(--edge-bottom)}
  .dock-heading{margin-bottom:8px;font-size:11px}
  .dock-heading span:last-child{font-size:11px}
  #rooms{gap:8px;scrollbar-width:none}
  #rooms::-webkit-scrollbar{display:none}
  .room-card{flex-basis:106px}
  .room-card img{width:96px;height:54px}
  .room-card .card-label{font-size:13px}
  .hint{top:calc(var(--edge-top) + 128px);font-size:11px;padding:9px 12px;width:max-content;max-width:calc(100% - var(--edge-left) - var(--edge-right));white-space:normal;text-align:center;line-height:1.5}
  dialog{width:calc(100% - 32px);max-width:470px;padding:24px}
  dialog h2{font-size:22px;margin-bottom:20px}
}
@media(max-width:600px){.brand-icon{display:none}}
/* Keep the full property description on one line on narrow phones. */
@media(max-width:420px){
  .topbar{flex-wrap:wrap;gap:12px}
  .brand{flex-basis:100%;min-height:48px}
  .top-actions{height:52px;margin-left:auto}
  .view-controls{left:var(--edge-left);right:auto;top:calc(var(--edge-top) + 60px)}
  .map-panel,.hint{top:calc(var(--edge-top) + 120px)}
}
@media(max-width:1024px),(pointer:coarse){
  .point-picker button{min-width:44px;height:44px}
  .view-controls button{min-width:44px;min-height:44px}
}
/* Phone landscape, including wide phones whose width exceeds the tablet breakpoint. */
@media(max-height:500px) and (min-width:540px){
  #tour{--edge-top:max(10px,env(safe-area-inset-top));--edge-bottom:max(8px,env(safe-area-inset-bottom))}
  .topbar{align-items:flex-start}
  .brand strong{font-size:18px}
  .scene-info{right:auto;max-width:calc(100% - var(--edge-left) - var(--edge-right) - 160px);bottom:calc(var(--edge-bottom) + 88px)}
  .scene-info>.eyebrow,.dock-heading,.hint{display:none}
  .scene-info h1{font-size:24px;margin:0 0 5px}
  .point-picker{margin-top:6px}
  .view-controls,.map-panel{top:calc(var(--edge-top) + 60px)}
  .map-panel{top:var(--edge-top);width:min(300px,calc(100dvh - var(--edge-top) - var(--edge-bottom) - 36px));max-height:calc(100% - var(--edge-top) - var(--edge-bottom))}
  .map-heading{align-items:center;padding:10px 10px 6px 14px}
  .map-heading>div>span{display:none}
  .room-card{flex-basis:106px}
  .room-card img{height:32px}
  .room-card .card-label{padding:4px 6px;font-size:12px}
}
@media(max-height:620px) and (min-height:501px){
  .hint{display:none}
  .scene-info{bottom:calc(var(--edge-bottom) + 126px)}
  .room-card img{height:42px}
  .room-card .card-label{padding:5px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.loading>span{animation-duration:1.8s}}
/* Keep dismissal available while scrolling the help sheet on a short screen. */
#help-close{position:sticky;top:0;right:auto;float:right;margin:-8px -8px 0 8px;z-index:1;background:#152129}
/* Startup stays outside the inert tour so neither pointer nor keyboard can enter early. */
.startup{position:fixed;inset:0;z-index:100;background:radial-gradient(ellipse at 50% 25%,#253c40 0%,#131b20 68%);display:grid;place-items:center;overflow:auto;padding:max(28px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}
.startup-content{width:min(100%,380px);text-align:center;margin:auto}
.startup-mark{display:grid;place-items:center;width:60px;height:60px;margin:0 auto 26px;border:1px solid #a6e1d34d;border-radius:18px;font-size:38px;color:var(--accent)}
.startup-property{font-size:21px;font-weight:500;letter-spacing:.08em;margin:0 0 9px}
.startup-address{font-size:12px;color:#c4cbd0;margin:0}
.startup h1{font-size:24px;font-weight:400;letter-spacing:.04em;margin:46px 0 30px;line-height:1.4}
.startup-progress-label{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:#c4cbd0;margin-bottom:12px}
#startup-percent{font-size:22px;font-variant-numeric:tabular-nums;color:var(--accent)}
#startup-progress{display:block;width:100%;height:4px;border:0;border-radius:4px;overflow:hidden;background:#ffffff16;appearance:none}
#startup-progress::-webkit-progress-bar{background:#ffffff16;border-radius:4px}
#startup-progress::-webkit-progress-value{background:var(--accent);border-radius:4px}
#startup-progress::-moz-progress-bar{background:var(--accent);border-radius:4px}
#startup-detail{font-size:12px;color:#c4cbd0;line-height:1.8;min-height:22px;margin:15px 0 0}
.startup-note{font-size:11px;color:#91a6aa;margin:24px 0 0}
#startup-retry{margin-top:22px;min-height:44px;padding:10px 24px;border-radius:10px;background:var(--accent);color:#17372e}
.loading{z-index:30;max-width:calc(100% - 40px);white-space:nowrap}
.loading>span{flex-shrink:0}
@media(max-height:500px){.startup-mark{width:44px;height:44px;font-size:28px;margin-bottom:14px}.startup h1{margin:22px 0 16px}.startup-note{margin-top:12px}}
/* Floor targets are interactive overlays, never painted onto the photographs. */
#pano{transform-origin:center;will-change:transform}
.hotspot{width:82px;height:72px;min-width:0;padding:0;display:grid;place-items:center;filter:drop-shadow(0 2px 3px #0005)}
.hotspot .ring{position:absolute;inset:auto;width:64px;height:64px;background:#ffffff18;border:3px solid #fffffff0;backdrop-filter:none;box-shadow:0 0 0 1px #0002,inset 0 0 0 6px #ffffff25;transform:scaleY(var(--floor-flatten,.45));transition:background .2s,box-shadow .2s}
.hotspot .ring:after{width:8px;height:8px;border:0;background:#fff;box-shadow:0 0 10px #fff8}
.hotspot .target-label{position:absolute;bottom:60px;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;pointer-events:none;font-size:12px;padding:6px 10px}
.hotspot:hover .ring,.hotspot:focus-visible .ring{transform:scaleY(var(--floor-flatten,.45));background:#a6e1d360;box-shadow:0 0 0 8px #ffffff20,inset 0 0 0 6px #ffffff25}
.hotspot:hover .target-label,.hotspot:focus-visible .target-label{opacity:1;transform:none}
.current-position{width:78px;height:78px;border:2px solid #ffffffc0;border-radius:50%;transform:translate(-50%,-50%);box-shadow:inset 0 0 0 7px #ffffff18;display:grid;place-items:center;pointer-events:none;opacity:.65}
.current-position span{width:8px;height:8px;border-radius:50%;background:white}
.moving .hotspot,.moving .current-position{opacity:0;pointer-events:none}
.moving #pano,.moving .view-controls,.moving .room-dock,.moving .map-panel,.moving .point-picker{pointer-events:none}
@media(hover:none){.hotspot .target-label{opacity:.8;bottom:54px;background:#15232b99;font-size:11px}}

/* Project circles as real horizontal ground geometry, in camera-height units. */
.floor-anchor{width:0;height:0}
.floor-marker{padding:0!important;min-width:0;display:block;transform:translate(-50%,-50%);border:0;border-radius:0;box-shadow:none;background:none;filter:drop-shadow(0 1px 2px #0008)}
.floor-marker .floor-shape{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:none}
.floor-marker .floor-disc{fill:#ffffff18;stroke:#ffffff40;stroke-width:8;vector-effect:non-scaling-stroke}
.floor-marker .floor-outline{fill:none;stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}
.floor-marker:hover .floor-disc,.floor-marker:focus-visible .floor-disc{fill:#a6e1d345;stroke:#a6e1d385}
.floor-marker .target-label{bottom:100%;left:50%;transform:translate(-50%,0);margin-bottom:5px}
.floor-marker:hover .target-label,.floor-marker:focus-visible .target-label{transform:translate(-50%,0)}
.current-position.floor-marker{opacity:.48;pointer-events:none}
.current-position.floor-marker .floor-disc{fill:#ffffff0d;stroke-width:5}
.current-position.floor-marker .floor-outline{stroke-width:1.5}
.moving .floor-marker{opacity:0;pointer-events:none}
@media(hover:none){.floor-marker .target-label{bottom:100%;font-size:11px}}
/* Floor-projected forward control and a live map direction cone. */
.forward-arrow{position:absolute;z-index:8;min-width:48px;min-height:48px;padding:0;filter:drop-shadow(0 3px 5px #0003);border-radius:10px;touch-action:manipulation}
.forward-arrow svg{width:100%;height:100%;overflow:visible}
.forward-arrow path{fill:#ffffff38;stroke:#ffffff7a;stroke-width:1.5;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:fill .15s}
.forward-arrow:hover path,.forward-arrow:focus-visible path{fill:#a6e1d359;stroke:#ffffffa6}
.moving .forward-arrow{display:none}
.map-bearing{position:absolute;width:100px;height:100px;transform:translate(-50%,-50%);pointer-events:none;z-index:1}
.map-bearing svg{width:100%;height:100%;transform:rotate(var(--heading,0rad));overflow:visible;stroke:none}
#map-cone{fill:url(#map-cone-fill)}
.map-center-ray{stroke:#159d91;stroke-width:1.5;stroke-opacity:.65}
.map-point{z-index:2}
.map-point.active{width:15px;height:15px;background:#32d1bd;border:2px solid white;z-index:4;box-shadow:0 0 0 5px #21bca936,0 1px 6px #133b3870}