/* ═══ IMMERSIVE SPACES (2026-10-01, v2 — Michael's frame) — PREVIEW ?is=1. Read MOTION.md.
   The place fills the frame; the interface is a console around it: navigation on top, the property and
   its ways in on the left, SPACES / STORY on the right over the lit plan, a filmstrip and the compass at
   the foot. Light is silver (never cyan); the wide title face is Michroma (OFL, shipped in hybrid/). */
@font-face{font-family:"SXR Michroma";src:url("hybrid/assets/michroma.ttf") format("truetype");font-display:swap}
html.is-mode,html.is-home{
  --is-accent:var(--accent,#d7dfe5);--is-accent-rgb:var(--accent-rgb,215,223,229);--is-soft:var(--accent-soft,#eef2f6);
  --is-ink:var(--ink,#f4f7f9);--is-dim:var(--ink-dim,#c2cbd3);--is-faint:var(--ink-faint,#939ca6);
  --is-glass:rgba(12,17,22,.74);--is-glass-hi:rgba(16,22,27,.88);--is-edge:rgba(255,255,255,.14);
  --is-wide:"SXR Michroma","Michroma","Eurostile","Microgramma",var(--sans,system-ui),sans-serif;
  --is-serif:"Bodoni 72","Bodoni Moda",Didot,Georgia,serif;
  --is-mono:var(--mono,"SF Mono",ui-monospace,Menlo,monospace);--is-sans:var(--sans,-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Helvetica,Arial,sans-serif);
  --is-ease:cubic-bezier(.16,1,.3,1);--is-exit:cubic-bezier(.7,0,.84,0);
  --is-gl:clamp(18px,2.9vw,46px);--is-gr:clamp(16px,1.9vw,30px);
  --is-side-w:clamp(260px,21vw,312px);--is-radar:clamp(150px,13vw,196px);
}
/* a hand-off (viewer, Ask Sono) shows only the classic content — one interface at a time */
html.is-mode #brandbar,html.is-mode #hud,html.is-mode #clientFoot,html.is-mode #sxrSide,html.is-mode #sxrSideTab{display:none!important}
html.is-mode:not(.is-away) #toast{visibility:hidden}

#isRoot{position:fixed;inset:0;z-index:9000;overflow:hidden;overflow:clip;background:#05070a;color:var(--is-ink);font-family:var(--is-sans);font-weight:300;-webkit-font-smoothing:antialiased;
  transition:opacity .36s var(--is-exit),visibility 0s .36s}
html.is-away #isRoot{opacity:0;visibility:hidden;pointer-events:none}
#isRoot button,#isHome button{cursor:pointer}
#isRoot [hidden],#isHome [hidden]{display:none!important}
#isRoot :focus-visible,#isHome :focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:3px}
#isRoot svg,#isHome svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* ── stage ── */
.is-stage{position:absolute;inset:0}
.is-layer{position:absolute;inset:0;opacity:0;transform:scale(1.035);filter:blur(10px);transition:opacity .9s var(--is-ease),transform 1.4s var(--is-ease),filter .9s var(--is-ease)}
.is-layer.in{opacity:1;transform:none;filter:none}
.is-layer.out{opacity:0;transform:scale(.985);filter:blur(6px);transition-duration:.55s;transition-timing-function:var(--is-exit)}
.is-layer video,.is-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#05070a center/cover no-repeat}
.is-img{animation:isDrift 26s ease-in-out infinite alternate}
@keyframes isDrift{from{transform:scale(1.02)}to{transform:scale(1.1) translate(-1.6%,-1.2%)}}
.is-scrim{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(180deg,rgba(4,7,11,.72) 0%,rgba(4,7,11,0) 20%),
  linear-gradient(0deg,rgba(4,7,11,.9) 0%,rgba(4,7,11,.35) 24%,rgba(4,7,11,0) 42%),
  linear-gradient(90deg,rgba(4,7,11,.78) 0%,rgba(4,7,11,.35) 34%,rgba(4,7,11,0) 56%),
  linear-gradient(270deg,rgba(4,7,11,.5) 0%,rgba(4,7,11,0) 26%)}
.is-top,.is-side,.is-radar,.is-strip,.is-now,.is-foot,.is-quote{transition:opacity .6s var(--is-ease)}
#isRoot.is-idle :is(.is-top,.is-side,.is-radar,.is-strip,.is-now,.is-foot,.is-quote){opacity:.06}

/* ── top: brand · navigation · tools ── */
.is-top{position:absolute;left:var(--is-gl);right:var(--is-gr);top:calc(18px + env(safe-area-inset-top,0px));z-index:4;display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:20px}
.is-brand{all:unset;cursor:pointer;display:block}
.is-brand img{height:clamp(52px,6.4vw,84px);width:auto;display:block;filter:drop-shadow(0 2px 16px rgba(0,0,0,.55))}
.is-brand b{font:400 24px var(--is-serif)}
.is-brand:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:6px}
.is-nav{justify-self:center;display:flex;gap:clamp(14px,2.8vw,48px);padding-top:16px}
.is-nav button{all:unset;cursor:pointer;position:relative;padding:8px 2px 12px;font:500 11.5px/1 var(--is-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--is-dim);white-space:nowrap;transition:color .2s var(--is-ease)}
.is-nav button:hover{color:#fff}
.is-nav button[aria-current]{color:#fff}
.is-nav button::after{content:'';position:absolute;left:-14px;right:-14px;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--is-accent),transparent);box-shadow:0 0 12px rgba(var(--is-accent-rgb),.8);transform:scaleX(0);transition:transform .35s var(--is-ease)}
.is-nav button[aria-current]::after{transform:scaleX(1)}
.is-nav button:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:4px}
.is-tools{display:flex;align-items:center;gap:14px;padding-top:14px}
.is-tool{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:9px;font:500 11.5px/1 var(--is-sans);letter-spacing:.2em;text-transform:uppercase;color:#fff;padding:6px 2px;white-space:nowrap}
.is-tool svg{width:19px;height:19px}
.is-tool small{font:500 10px var(--is-mono);color:var(--is-dim);letter-spacing:0}
.is-tool:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:4px}
#isSave svg{fill:currentColor}
.is-icon svg{width:24px;height:24px}
.is-sep{width:1px;height:22px;background:rgba(255,255,255,.3)}

/* ── left: the property, then its ways in ── */
.is-left{position:absolute;left:var(--is-gl);top:clamp(118px,19vh,176px);width:min(620px,44vw);z-index:3;display:grid;gap:clamp(10px,1.6vh,16px)}
.is-loc{font:400 clamp(12px,1vw,15px)/1.3 var(--is-sans);letter-spacing:.3em;color:var(--is-dim);text-shadow:0 1px 12px rgba(0,0,0,.6)}
.is-title{margin:0;font:400 clamp(34px,min(4.5vw,7.6vh),70px)/1.08 var(--is-wide);letter-spacing:.03em;text-transform:uppercase;color:#fff;text-wrap:balance;text-shadow:0 2px 26px rgba(0,0,0,.5)}
.is-title-place{font-size:clamp(28px,min(3.4vw,6vh),54px)}
.is-sub{margin:0;max-width:32ch;font:300 clamp(12px,1.05vw,16px)/1.65 var(--is-sans);letter-spacing:.3em;text-transform:uppercase;color:var(--is-dim)}
.is-line{margin:0;max-width:46ch;font:300 16px/1.55 var(--is-sans);color:var(--is-dim);text-shadow:0 1px 14px rgba(0,0,0,.6)}
.is-arrive .is-title{animation:isRise .8s var(--is-ease) both}
.is-arrive .is-sub,.is-arrive .is-line,.is-arrive .is-acts,.is-arrive .is-dock,.is-arrive .is-step{animation:isFade .7s .22s var(--is-ease) both}
@keyframes isRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes isFade{from{opacity:0}to{opacity:1}}
.is-acts{list-style:none;margin:clamp(6px,2vh,22px) 0 0;padding:0;display:grid;gap:clamp(2px,.6vh,8px)}
.is-acts button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:18px;padding:4px 0;font:500 clamp(11.5px,.95vw,13.5px)/1 var(--is-sans);letter-spacing:.26em;text-transform:uppercase;color:#fff}
.is-acts i{display:grid;place-items:center;width:clamp(40px,3.4vw,52px);height:clamp(40px,3.4vw,52px);border-radius:50%;flex:none;transition:box-shadow .3s var(--is-ease),background .3s var(--is-ease)}
.is-acts svg{width:22px;height:22px}
.is-acts button:hover i{background:rgba(255,255,255,.06)}
.is-acts .main{padding-right:16px}
.is-acts .main i{border:1px solid rgba(var(--is-accent-rgb),.85);box-shadow:0 0 0 4px rgba(var(--is-accent-rgb),.08),0 0 22px rgba(var(--is-accent-rgb),.45),inset 0 0 14px rgba(var(--is-accent-rgb),.25);background:rgba(var(--is-accent-rgb),.08)}
.is-acts .main span{padding:13px 0;position:relative}
.is-acts .main b{font-weight:300;font-size:18px;transition:transform .25s var(--is-ease)}
.is-acts .main:hover b{transform:translateX(5px)}
.is-acts button:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:4px}
.is-dock{display:flex;flex-wrap:wrap;gap:8px}
.is-chip,.is-btn{display:inline-flex;align-items:center;gap:9px;border-radius:var(--is-r-pill,999px);border:1px solid var(--is-edge);background:rgba(12,17,22,.5);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;transition:border-color .2s var(--is-ease),background .2s var(--is-ease),transform .12s var(--is-ease)}
.is-chip{height:38px;padding:0 15px;font:500 10px/1 var(--is-mono);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.is-chip:hover,.is-btn:hover{border-color:rgba(var(--is-accent-rgb),.6);background:rgba(16,22,27,.72)}
.is-chip:active,.is-btn:active{transform:scale(.97)}
.is-chip svg,.is-btn svg{width:16px;height:16px;flex:none}
.is-chip small{font:500 10px var(--is-mono);color:var(--is-faint);letter-spacing:0}
.is-save[aria-pressed="true"]{border-color:rgba(var(--is-accent-rgb),.8);background:rgba(var(--is-accent-rgb),.14)}
.is-save[aria-pressed="true"] svg{fill:currentColor}
.is-back{all:unset;cursor:pointer;justify-self:start;display:inline-flex;align-items:center;gap:8px;margin-top:4px;font:500 10px var(--is-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--is-dim)}
.is-back svg{width:14px;height:14px}.is-back:hover{color:#fff}
.is-step{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
.is-next{color:#fff}
.is-back:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:4px}
.is-btn{height:46px;padding:0 20px;font:500 11px/1 var(--is-mono);letter-spacing:.16em;text-transform:uppercase;justify-content:center}
.is-btn-main{background:rgba(var(--is-accent-rgb),.16);border-color:rgba(var(--is-accent-rgb),.65)}

/* ── the pull line (the record's own story eyebrow) ── */
.is-quote{position:absolute;right:calc(var(--is-side-w) + var(--is-gr) + 4vw);top:clamp(130px,17vh,170px);z-index:2;margin:0;text-align:right;max-width:28ch}
.is-quote blockquote{margin:0;font:italic 400 clamp(22px,2.2vw,36px)/1.15 var(--is-serif);color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.6)}
.is-quote figcaption{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.35);display:inline-block;font:500 9.5px var(--is-mono);letter-spacing:.26em;text-transform:uppercase;color:var(--is-dim)}
#isRoot:not(.is-overview) .is-quote{display:none}

/* ── right: SPACES / STORY over the lit plan ── */
.is-side{position:absolute;right:var(--is-gr);top:clamp(104px,13vh,124px);width:var(--is-side-w);bottom:calc(var(--is-radar) + 74px + env(safe-area-inset-bottom,0px));z-index:3;
  display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;border:1px solid var(--is-edge);border-radius:var(--is-r-panel,16px);background:var(--is-glass);-webkit-backdrop-filter:blur(22px) saturate(1.2);backdrop-filter:blur(22px) saturate(1.2);overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.is-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;border-bottom:1px solid rgba(255,255,255,.1)}
.is-tabs button{all:unset;cursor:pointer;text-align:center;padding:16px 0 14px;font:500 11px var(--is-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--is-dim);position:relative}
.is-tabs button[aria-selected="true"]{color:#fff}
.is-tabs button[aria-selected="true"]::after{content:'';position:absolute;left:18%;right:18%;bottom:-1px;height:2px;background:var(--is-accent);box-shadow:0 0 12px rgba(var(--is-accent-rgb),.8)}
.is-tabs button:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:-4px}
.is-model{padding:14px 14px 8px;border-bottom:1px solid rgba(255,255,255,.08)}
.is-model-btn{all:unset;cursor:pointer;display:block;width:100%;perspective:800px}
.is-model-btn:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:4px}
.is-model-plane{position:relative;display:block;aspect-ratio:1522/1033;transform:rotateX(50deg) rotateZ(-14deg) scale(.92);transform-origin:50% 62%;transition:transform .7s var(--is-ease);margin:-18px 0 -26px}
.is-model-btn:hover .is-model-plane{transform:rotateX(40deg) rotateZ(-10deg) scale(.96)}
.is-model-plane img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;mix-blend-mode:screen;filter:grayscale(1) contrast(1.3) brightness(1.15);opacity:.95}
.is-model-plane.light img{filter:invert(1) grayscale(1) contrast(1.35) brightness(1.1)}
.is-model-plane::after{content:'';position:absolute;inset:-1px;border:1px solid rgba(var(--is-accent-rgb),.45);box-shadow:0 0 30px rgba(var(--is-accent-rgb),.2)}
.is-model-plane svg{position:absolute;inset:0;width:100%;height:100%}
.is-model-plane polygon.here{vector-effect:non-scaling-stroke;fill:rgba(255,255,255,.32);stroke:#fff;stroke-width:1.4}
.is-pin{position:absolute;transform:translate(-50%,-50%) rotateZ(14deg) rotateX(-50deg);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;
  border:1px solid rgba(var(--is-accent-rgb),.85);background:rgba(10,14,18,.8);box-shadow:0 0 12px rgba(var(--is-accent-rgb),.55);font-style:normal}
.is-pin b{font:600 8.5px var(--is-mono);color:#fff;letter-spacing:0}
.is-pin.seen{background:rgba(var(--is-accent-rgb),.3)}
.is-pin.on{width:34px;height:34px;background:rgba(255,255,255,.9);box-shadow:0 0 0 6px rgba(255,255,255,.18),0 0 26px rgba(255,255,255,.9)}
.is-pin.on b{color:#0b0e11;font-size:10px}
.is-model-l{display:block;text-align:center;margin-top:4px;font:500 9px var(--is-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--is-faint)}
.is-list{overflow:auto;overscroll-behavior:contain;padding:8px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
.is-row{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:54px 26px minmax(0,1fr) 14px;align-items:center;gap:10px;width:100%;padding:7px 8px;border-radius:var(--is-r-row,10px);border:1px solid transparent;transition:background .2s var(--is-ease),border-color .2s var(--is-ease)}
.is-row:hover{background:rgba(255,255,255,.05)}
.is-row.on{border-color:rgba(var(--is-accent-rgb),.75);background:rgba(var(--is-accent-rgb),.08);box-shadow:inset 0 0 18px rgba(var(--is-accent-rgb),.08)}
.is-row:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:-2px}
.is-row-img{width:54px;height:40px;border-radius:var(--is-r-row,6px);background:#11161b center/cover no-repeat;border:1px solid rgba(255,255,255,.1)}
.is-row-n{font:500 10px var(--is-mono);color:var(--is-faint)}
.is-row-t{display:grid;gap:3px;min-width:0}
.is-row-t b{font:500 11.5px var(--is-sans);letter-spacing:.18em;text-transform:uppercase;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.is-row-t small{font:300 11.5px var(--is-sans);color:var(--is-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.is-row>svg{width:14px;height:14px;color:var(--is-faint)}
.is-row.seen .is-row-n{color:var(--is-accent)}
.is-row.done{opacity:.6}
.is-row-play{grid-template-columns:20px 1fr;margin-top:6px;border-color:rgba(var(--is-accent-rgb),.4);font:500 10.5px var(--is-mono);letter-spacing:.16em;text-transform:uppercase;color:#fff}
.is-row-play svg{width:16px;height:16px}
.is-side-foot{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 10px;padding:12px 16px 14px;border-top:1px solid rgba(255,255,255,.08);font:400 10.5px var(--is-mono);color:var(--is-dim)}
.is-side-foot b{color:#fff;font-weight:500}
.is-side-foot>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.is-side-foot i{grid-column:1/-1;grid-row:2;display:block;height:2px;background:rgba(255,255,255,.12);position:relative}
.is-side-foot i::after{content:'';position:absolute;left:0;top:0;bottom:0;width:var(--w,0%);background:var(--is-accent);transition:width .9s var(--is-ease)}
.is-visit{all:unset;cursor:pointer;font:500 10px var(--is-mono);letter-spacing:.16em;text-transform:uppercase;color:#fff}
.is-visit:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:3px}

/* ── the compass ── */
.is-radar{position:absolute;right:var(--is-gr);bottom:calc(64px + env(safe-area-inset-bottom,0px));z-index:3;display:grid;grid-template-columns:var(--is-radar) 44px;align-items:center;gap:12px;width:var(--is-side-w);justify-content:end}
.is-radar canvas{width:var(--is-radar);height:var(--is-radar);display:block;cursor:pointer;filter:drop-shadow(0 10px 30px rgba(0,0,0,.6))}
.is-zoom{display:grid;border:1px solid var(--is-edge);border-radius:var(--is-r-row,10px);background:var(--is-glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);overflow:hidden}
.is-zoom button{all:unset;cursor:pointer;display:grid;place-items:center;height:44px;color:#fff;border-bottom:1px solid rgba(255,255,255,.1)}
.is-zoom button:last-child{border-bottom:0}
.is-zoom button:hover{background:rgba(255,255,255,.07)}
.is-zoom svg{width:18px;height:18px}
.is-zoom button:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:-3px}
.is-radar-l{grid-column:1/-1;justify-self:center;font:400 9.5px var(--is-mono);letter-spacing:.06em;color:var(--is-faint);margin-top:-4px}

/* ── foot: current view · filmstrip · brand line ── */
.is-now{position:absolute;left:var(--is-gl);bottom:calc(104px + env(safe-area-inset-bottom,0px));z-index:3;display:flex;align-items:center;gap:14px;max-width:250px}
.is-now-img{width:62px;height:62px;flex:none;border-radius:var(--is-r-row,8px);background:#11161b center/cover no-repeat;border:1px solid rgba(255,255,255,.18)}
.is-now span:last-child{display:grid;gap:3px;min-width:0}
.is-now small{font:500 8.5px var(--is-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--is-faint)}
.is-now b{font:500 13px var(--is-sans);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.is-now em{font:300 12px var(--is-sans);font-style:normal;color:var(--is-dim)}
.is-strip{position:absolute;left:calc(var(--is-gl) + 270px);right:calc(var(--is-side-w) + var(--is-gr) + 24px);bottom:calc(64px + env(safe-area-inset-bottom,0px));z-index:3;
  display:grid;grid-template-columns:minmax(0,1fr) 40px;align-items:center;gap:8px;padding:10px 10px 10px 12px;border:1px solid var(--is-edge);border-radius:var(--is-r-panel,16px);background:var(--is-glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.is-strip-track{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}
.is-strip-track::-webkit-scrollbar{display:none}
.is-frame{all:unset;box-sizing:border-box;cursor:pointer;flex:none;width:clamp(108px,9.6vw,146px);display:grid;gap:7px;scroll-snap-align:start}
.is-frame span{position:relative;display:block;aspect-ratio:16/10;border-radius:var(--is-r-row,8px);background:#11161b center/cover no-repeat;border:1px solid rgba(255,255,255,.12);transition:border-color .2s var(--is-ease),transform .25s var(--is-ease)}
.is-frame:hover span{transform:translateY(-2px);border-color:rgba(var(--is-accent-rgb),.6)}
.is-frame.here span{border-color:rgba(var(--is-accent-rgb),.85)}
.is-frame i{position:absolute;right:6px;bottom:6px;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.55)}
.is-frame i svg{width:11px;height:11px;fill:#fff;stroke:none}
.is-frame small{font:500 9.5px var(--is-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--is-dim);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.is-frame:focus-visible span{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:3px}
.is-strip-next{all:unset;cursor:pointer;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.4)}
.is-strip-next svg{width:16px;height:16px}
.is-strip-next:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:3px}
.is-foot{position:absolute;left:var(--is-gl);right:var(--is-gr);bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:2;display:flex;justify-content:space-between;align-items:flex-end;pointer-events:none}
.is-foot b{display:block;font:400 17px var(--is-wide);letter-spacing:.08em;color:#fff}
.is-foot small{font:400 8.5px var(--is-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--is-dim)}
.is-foot-r{font:400 10px/1.7 var(--is-sans);letter-spacing:.28em;text-transform:uppercase;color:var(--is-dim);text-align:right}

/* ── the guided tour ── */
#isRoot.is-storying :is(.is-strip,.is-radar,.is-quote,.is-now){opacity:0;pointer-events:none}
.is-story{position:absolute;left:calc(var(--is-gl) + 270px);right:calc(var(--is-side-w) + var(--is-gr) + 24px);bottom:calc(58px + env(safe-area-inset-bottom,0px));z-index:4;display:grid;gap:14px;justify-items:center}
.is-sbars{display:flex;gap:6px;width:min(520px,100%)}
.is-sbar{flex:1;height:2px;background:rgba(255,255,255,.18);position:relative;overflow:hidden}
.is-sbar i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--is-accent)}
.is-sbar.done i{width:100%}
.is-cap{margin:0;min-height:1.4em;max-width:34ch;text-align:center;font:italic 400 clamp(20px,2.1vw,30px)/1.3 var(--is-serif);color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.75)}
.is-choice{display:grid;gap:10px;justify-items:center}
.is-choice small{font:500 9.5px var(--is-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--is-dim)}
.is-choice div{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.is-choice button{all:unset;cursor:pointer;padding:11px 18px;border-radius:var(--is-r-pill,999px);border:1px solid rgba(var(--is-accent-rgb),.55);background:rgba(12,17,22,.55);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);font:400 14px var(--is-sans);color:#fff}
.is-choice button:hover,.is-choice button[aria-pressed="true"]{background:rgba(var(--is-accent-rgb),.2)}
.is-choice button:focus-visible{outline:1px solid #fff;outline-offset:3px}
.is-sctl{display:flex;align-items:center;gap:6px;padding:6px 6px 6px 16px;border-radius:var(--is-r-pill,999px);border:1px solid var(--is-edge);background:var(--is-glass-hi);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.is-snum{font:500 9.5px var(--is-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--is-dim);margin-right:6px;white-space:nowrap}
.is-sctl button{all:unset;cursor:pointer;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#fff}
.is-sctl button:hover{background:rgba(255,255,255,.08)}
.is-sctl button:focus-visible{outline:1px solid #fff}
.is-sctl svg{width:17px;height:17px}
.is-sctl .is-send{width:auto;padding:0 14px;border-radius:var(--is-r-pill,999px);font:500 9.5px var(--is-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--is-dim)}

/* ── panels ── */
.is-panel{position:absolute;top:0;right:0;bottom:0;z-index:6;width:min(460px,100%);overflow:auto;overscroll-behavior:contain;padding:calc(24px + env(safe-area-inset-top,0px)) 28px calc(28px + env(safe-area-inset-bottom,0px));display:grid;align-content:start;gap:16px;
  background:var(--is-glass-hi);-webkit-backdrop-filter:blur(22px) saturate(1.15);backdrop-filter:blur(22px) saturate(1.15);border-left:1px solid var(--is-edge);box-shadow:-30px 0 80px -30px rgba(0,0,0,.7);
  transform:translateX(24px);opacity:0;transition:transform .55s var(--is-ease),opacity .4s var(--is-ease)}
.is-panel.wide{width:min(620px,100%)}
.is-panel.open{transform:none;opacity:1}
#isRoot.is-paneled :is(.is-side,.is-radar,.is-tools){opacity:0;pointer-events:none}
.is-x{all:unset;cursor:pointer;justify-self:end;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--is-edge)}
.is-x svg{width:16px;height:16px}
.is-x:focus-visible{outline:1px solid #fff}
.is-ph{margin:0;font:400 clamp(26px,2.4vw,36px)/1.1 var(--is-wide);letter-spacing:.03em;text-transform:uppercase;color:#fff}
.is-ph em{font-style:normal;color:var(--is-soft)}
.is-p-eyebrow{font:500 9.5px var(--is-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--is-faint)}
.is-p-line{margin:0;font:300 15.5px/1.6 var(--is-sans);color:var(--is-dim)}
.is-p-quiet{margin:0;font:300 13.5px/1.55 var(--is-sans);color:var(--is-faint)}
.is-panel h3{margin:8px 0 0;font:500 9.5px var(--is-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--is-dim);padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
.is-hl{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.is-hl li{font:300 14.5px/1.45 var(--is-sans);color:var(--is-dim);padding-left:16px;position:relative}
.is-hl li::before{content:'';position:absolute;left:0;top:.55em;width:6px;height:6px;border:1px solid rgba(var(--is-accent-rgb),.8);transform:rotate(45deg)}
.is-hl b{color:#fff;font-weight:500}
.is-facts{margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1)}
.is-facts div{background:rgba(10,14,18,.75);padding:12px}
.is-facts dt{font:500 8.5px var(--is-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--is-faint)}
.is-facts dd{margin:6px 0 0;font:500 14.5px var(--is-sans);color:#fff}
.is-tags{display:flex;flex-wrap:wrap;gap:6px}
.is-tags span{padding:7px 11px;border-radius:var(--is-r-pill,999px);border:1px solid rgba(255,255,255,.14);font:300 12.5px var(--is-sans);color:var(--is-dim)}
.is-near{display:grid;gap:1px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.is-near div{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:11px 12px;background:rgba(10,14,18,.75)}
.is-near b{font:500 13.5px var(--is-sans);color:#fff}
.is-near small{grid-row:2;font:300 11.5px var(--is-sans);color:var(--is-faint)}
.is-near span{grid-row:1/3;grid-column:2;align-self:center;font:500 12px var(--is-mono);color:var(--is-dim)}
.is-near span i{font-style:normal;color:var(--is-faint);margin-left:4px}
.is-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.is-grid button{all:unset;cursor:pointer;position:relative;aspect-ratio:4/3;border-radius:var(--is-r-row,8px);background:#11161b center/cover no-repeat;border:1px solid rgba(255,255,255,.14)}
.is-grid button:hover{border-color:rgba(var(--is-accent-rgb),.6)}
.is-grid button:focus-visible{outline:1px solid #fff;outline-offset:2px}
.is-grid i{position:absolute;right:6px;bottom:6px;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.55)}
.is-grid i svg{width:11px;height:11px;fill:#fff;stroke:none}
.is-p-acts{display:grid;gap:8px}
.is-menu{display:grid;gap:2px}
.is-menu button{all:unset;cursor:pointer;display:grid;grid-template-columns:22px 1fr;align-items:center;gap:14px;padding:12px;border-radius:var(--is-r-row,10px)}
.is-menu button:hover{background:rgba(255,255,255,.05)}
.is-menu button:focus-visible{outline:1px solid #fff}
.is-menu svg{width:20px;height:20px}
.is-menu span{display:grid;gap:3px;font:500 12px var(--is-sans);letter-spacing:.18em;text-transform:uppercase;color:#fff}
.is-menu small{font:300 12px var(--is-sans);letter-spacing:0;text-transform:none;color:var(--is-faint)}
.is-prog{display:grid;gap:7px;font:400 11px var(--is-mono);color:var(--is-dim)}
.is-prog b{font:500 13px var(--is-mono);color:#fff}
.is-prog i{display:block;height:2px;background:rgba(255,255,255,.14);position:relative}
.is-prog i::after{content:'';position:absolute;left:0;top:0;bottom:0;width:var(--w,0%);background:var(--is-accent)}
.is-seen{display:flex;flex-wrap:wrap;gap:6px}
.is-seen button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--is-r-pill,999px);border:1px solid rgba(255,255,255,.12);font:400 12.5px var(--is-sans);color:var(--is-faint)}
.is-seen button.seen{color:#fff;border-color:rgba(var(--is-accent-rgb),.45)}
.is-seen button:focus-visible{outline:1px solid #fff}
.is-dia{flex:none;width:7px;height:7px;border:1px solid rgba(var(--is-accent-rgb),.8);transform:rotate(45deg)}
.seen .is-dia{background:var(--is-accent)}
/* the classic request form, painted inside the panel — restyled, never rebuilt */
.is-form{display:grid;gap:12px;font-family:var(--is-sans);padding-top:14px;border-top:1px solid rgba(255,255,255,.1);scroll-margin-top:12px}
.is-form .panel-h{font:500 9.5px var(--is-mono)!important;letter-spacing:.22em!important;text-transform:uppercase;color:var(--is-dim)!important}
.is-form .sales-request-note,.is-form .cq-intro{font:300 14px/1.5 var(--is-sans)!important;color:var(--is-dim)!important}
.is-form .field{display:grid;gap:6px;margin:10px 0}
.is-form label{font:500 9px var(--is-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--is-faint)}
.is-form input[type=text],.is-form input[type=email],.is-form textarea,.is-form select{width:100%;box-sizing:border-box;border-radius:var(--is-r-row,10px);border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:#fff;padding:12px 13px;font:400 15px var(--is-sans)}
.is-form input:focus,.is-form textarea:focus{outline:none;border-color:rgba(var(--is-accent-rgb),.8)}
.is-form .slot-row{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.is-form .slot{border-radius:var(--is-r-pill,999px);border:1px solid rgba(255,255,255,.16);background:transparent;color:var(--is-dim);padding:8px 12px;font:500 9.5px var(--is-mono);letter-spacing:.12em;cursor:pointer}
.is-form .slot.sel{background:var(--is-accent);color:#0b0e11;border-color:var(--is-accent)}
.is-form .btn.lime{border-radius:var(--is-r-pill,999px);background:var(--is-accent)!important;color:#0b0e11!important;border:0;font:600 10.5px var(--is-mono);letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.is-form details,.is-form summary{font:300 13px/1.5 var(--is-sans);color:var(--is-dim)}
.is-toast{position:absolute;left:50%;top:calc(96px + env(safe-area-inset-top,0px));z-index:7;transform:translate(-50%,-8px);opacity:0;pointer-events:none;padding:10px 18px;border-radius:var(--is-r-pill,999px);border:1px solid var(--is-edge);
  background:var(--is-glass-hi);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);font:400 13px var(--is-sans);color:#fff;transition:opacity .3s var(--is-ease),transform .3s var(--is-ease)}
.is-toast.show{opacity:1;transform:translate(-50%,0)}


/* ── parity pass 1 (Oceanfront) ── */
.is-hero{position:absolute;inset:0;isolation:isolate;background:#15252c}
.is-hero .ch-content,.is-hero .ch-caption,.is-hero .ch-motion{display:none!important}
.is-sono img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:1px solid rgba(var(--is-accent-rgb),.7);box-shadow:0 0 14px rgba(var(--is-accent-rgb),.35);margin:-6px 0}
.is-offer{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:14px;padding:8px 14px 8px 8px;border-radius:var(--is-r-panel,14px);border:1px solid rgba(var(--is-accent-rgb),.45);background:rgba(12,17,22,.55);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:border-color .2s var(--is-ease),transform .25s var(--is-ease)}
.is-offer:hover{border-color:rgba(var(--is-accent-rgb),.85);transform:translateY(-2px)}
.is-offer:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:3px}
.is-offer span:last-child{display:grid;gap:3px;min-width:0}
.is-offer small{display:flex;align-items:center;gap:6px;font:500 8.5px var(--is-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--is-dim)}
.is-offer small svg{width:12px;height:12px}
.is-offer b{font:500 13px var(--is-sans);color:#fff}
.is-offer em{font:300 12px var(--is-sans);font-style:normal;color:var(--is-dim)}
.is-offer-img{aspect-ratio:16/9;border-radius:var(--is-r-panel,12px);background:#11161b center/cover no-repeat;border:1px solid rgba(255,255,255,.12)}
.is-code{margin:0;font:400 12px var(--is-mono);letter-spacing:.12em;color:var(--is-dim)}.is-code b{color:#fff}
.is-two{grid-template-columns:1fr 1fr}
.is-form .cq-request-types{display:flex;flex-wrap:wrap;gap:6px}
.is-form .cq-request-types .btn,.is-form .btn{border-radius:var(--is-r-pill,999px);border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#fff;padding:9px 14px;font:500 9.5px var(--is-mono);letter-spacing:.14em;text-transform:uppercase}
.is-form .cq-request-types .btn[aria-pressed="true"]{background:var(--is-accent);color:#0b0e11;border-color:var(--is-accent)}
.is-form a{color:#fff}
@media (max-width:760px){.is-sono span{display:none}.is-two{grid-template-columns:1fr}}
/* Explore together: the live-session dock sits beside the presentation, never under it */
html.is-mode #sxrSession,html.is-mode #sxrShare{z-index:9500!important}
@media (min-width:761px){body.sxr-docked #isRoot,body.sxr-rail #isRoot,body.sxr-docked #isHome,body.sxr-rail #isHome{right:var(--sxr-dock-w,340px)}}
/* multi-space: the record's sections as list headers, rooms indented; a section lists its rooms */
.is-list-h{padding:12px 10px 6px;font:500 8.5px var(--is-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--is-faint);border-top:1px solid rgba(255,255,255,.06);margin-top:4px}
.is-list-h:first-child{border-top:0;margin-top:0;padding-top:6px}
.is-row-kid{padding-left:22px}
.is-row-kid .is-row-img{width:44px;height:32px}
.is-row-kid{grid-template-columns:44px 26px minmax(0,1fr) 14px}
.is-kids{display:grid;gap:2px;max-height:min(30vh,260px);overflow:auto;overscroll-behavior:contain;border-top:1px solid rgba(255,255,255,.12);padding-top:8px;max-width:46ch}
.is-kids small{font:500 9px var(--is-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--is-faint);padding:2px 0 6px}
.is-kids button{all:unset;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:2px 14px;padding:8px 10px;margin:0 -10px;border-radius:var(--is-r-row,10px)}
.is-kids button:hover{background:rgba(255,255,255,.06)}
.is-kids button:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95)}
.is-kids b{font:500 12px var(--is-sans);letter-spacing:.18em;text-transform:uppercase;color:#fff}
.is-kids span{grid-column:1;font:300 13.5px/1.4 var(--is-sans);color:var(--is-dim)}
.is-kids i{grid-column:2;grid-row:1/3;align-self:center;font:normal 500 9.5px var(--is-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--is-dim);white-space:nowrap}
/* multi-location: fast travel between the collection's Showcases */
.is-locs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.is-locs button{all:unset;box-sizing:border-box;cursor:pointer;display:grid;border-radius:var(--is-r-panel,14px);overflow:hidden;border:1px solid rgba(255,255,255,.14);background:rgba(10,14,18,.6);transition:border-color .2s var(--is-ease),transform .25s var(--is-ease)}
.is-locs button:hover{border-color:rgba(var(--is-accent-rgb),.7);transform:translateY(-3px)}
.is-locs button:focus-visible{outline:1px solid #fff;outline-offset:3px}
.is-locs button.cur{border-color:rgba(var(--is-accent-rgb),.85)}
.is-locs-img{aspect-ratio:16/10;background:#11161b center/cover no-repeat}
.is-locs-t{display:grid;gap:4px;padding:12px 14px 14px}
.is-locs-t b{font:400 17px var(--is-wide);letter-spacing:.06em;text-transform:uppercase;color:#fff}
.is-locs-t small{font:300 13px var(--is-sans);color:var(--is-dim)}
.is-locs-t i{font:normal 500 9.5px var(--is-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--is-accent);margin-top:4px}
#isRoot.is-leaving{opacity:0;transition:opacity .36s var(--is-exit)}
/* ── narrower desktops ── */
@media (max-width:1180px) and (min-width:761px){
  .is-quote,.is-now{display:none}
  .is-strip,.is-story{left:var(--is-gl)}
  .is-nav{gap:16px}.is-nav button{letter-spacing:.16em;font-size:10.5px}
  .is-tool span{display:none}
}
/* ── short windows ── */
@media (max-height:760px) and (min-width:761px){
  .is-quote,.is-now,.is-foot{display:none}
  .is-strip,.is-radar{bottom:calc(16px + env(safe-area-inset-bottom,0px))}.is-story{bottom:20px}
  .is-strip,.is-story{left:var(--is-gl)}
  .is-side{bottom:calc(var(--is-radar) + 30px)}
  html.is-mode{--is-radar:140px}
  .is-frame{width:104px}.is-strip{padding:8px}
  .is-left{top:clamp(96px,15vh,140px)}
  .is-acts i{width:38px;height:38px}
}
@media (max-height:600px) and (min-width:761px){
  .is-radar,.is-sub,.is-model{display:none}
  .is-side{bottom:110px}
}
/* ── phones: a thumb-first layout ── */
@media (max-width:760px){
  .is-top{grid-template-columns:auto 1fr;gap:10px}
  .is-brand img{height:46px}
  .is-nav{grid-column:1/-1;grid-row:2;justify-self:stretch;overflow-x:auto;scrollbar-width:none;gap:18px;padding-top:0;mask-image:linear-gradient(90deg,#000 85%,transparent)}
  .is-nav::-webkit-scrollbar{display:none}
  .is-nav button{font-size:10px;letter-spacing:.16em}
  .is-tools{justify-self:end;padding-top:8px;gap:12px}.is-tool span,.is-sep{display:none}
  .is-quote,.is-side,.is-radar,.is-now,.is-foot{display:none}
  .is-left{top:auto;bottom:calc(132px + env(safe-area-inset-bottom,0px));left:18px;right:18px;width:auto;gap:9px}
  .is-title{font-size:clamp(24px,7.4vw,34px)}.is-title-place{font-size:clamp(22px,6.6vw,30px)}
  .is-sub{font-size:11px;letter-spacing:.22em}.is-line{font-size:14px}
  .is-acts{grid-template-columns:1fr 1fr;gap:6px 10px;margin-top:4px}
  .is-acts li:first-child{grid-column:1/-1}
  .is-acts button{gap:10px;font-size:10px;letter-spacing:.16em}
  .is-acts i{width:34px;height:34px}.is-acts svg{width:17px;height:17px}
  .is-dock{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-18px;padding-right:18px}
  .is-dock::-webkit-scrollbar{display:none}
  .is-strip{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));grid-template-columns:1fr;padding:8px}
  .is-strip-next{display:none}.is-frame{width:96px}
  .is-story{left:12px;right:12px;bottom:calc(16px + env(safe-area-inset-bottom,0px))}
  #isRoot.is-storying .is-left{bottom:calc(210px + env(safe-area-inset-bottom,0px))}
  .is-cap{font-size:19px}
  .is-panel,.is-panel.wide{top:auto;width:100%;max-height:86vh;border-left:0;border-top:1px solid var(--is-edge);border-radius:var(--is-r-panel,20px) var(--is-r-panel,20px) 0 0;transform:translateY(30px);padding-left:20px;padding-right:20px}
  .is-panel.open{transform:none}
}
@media (prefers-reduced-motion:reduce){
  .is-layer,.is-layer.out,.is-panel{transition-duration:.01ms!important}
  .is-img{animation:none!important}
  .is-arrive :is(.is-title,.is-sub,.is-line,.is-acts,.is-dock,.is-back){animation:none!important}
  .is-layer{transform:none;filter:none}
}
@media (prefers-reduced-transparency:reduce){
  .is-side,.is-strip,.is-zoom,.is-chip,.is-btn,.is-panel,.is-sctl,.is-toast,.is-choice button{background:#10161b;-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* ── THE SIDE-PANEL SWITCHES (builder: Showcase design → Side panel) ── the glance heads the Spaces list,
   Next up + Your visit hold its foot; each reads the record or this visit, and each can be left out.
   Kept to two quiet lines so the Spaces list still leads the panel. */
.is-glance{display:grid;gap:8px;padding:4px 6px 10px;margin-bottom:2px;border-bottom:1px solid rgba(255,255,255,.06)}
.is-glance-facts{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:4px;padding:8px 6px 7px;border-radius:var(--is-r-row,10px);border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025);transition:border-color .25s var(--is-ease),background .25s var(--is-ease)}
.is-glance-facts:hover{border-color:rgba(var(--is-accent-rgb),.5);background:rgba(var(--is-accent-rgb),.06)}
.is-glance-facts:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:2px}
.is-glance-facts span{display:grid;gap:4px;justify-items:center;text-align:center;min-width:0}
.is-glance-facts b{font:300 16px/1 var(--is-sans);letter-spacing:.02em;color:#fff;white-space:nowrap}
.is-glance-facts span.long b{font-size:13px}
.is-glance-facts small{font:500 8px var(--is-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--is-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.is-glance-media{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 4px}
.is-glance-media button{all:unset;cursor:pointer;display:inline-flex;align-items:baseline;gap:4px;padding:3px 4px;border-radius:var(--is-r-row,6px);font:500 8.5px var(--is-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--is-dim);transition:color .2s var(--is-ease),background .2s var(--is-ease)}
.is-glance-media button:hover{color:#fff;background:rgba(255,255,255,.06)}
.is-glance-media button:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95)}
.is-glance-media b{font:400 11.5px var(--is-sans);letter-spacing:0;color:#fff}
.is-nextup{all:unset;box-sizing:border-box;cursor:pointer;grid-column:1/-1;display:grid;grid-template-columns:auto minmax(0,1fr) 14px;gap:10px;align-items:center;padding:7px 10px;margin:-4px -6px 2px;border-radius:var(--is-r-row,9px);border:1px solid rgba(var(--is-accent-rgb),.26);background:rgba(var(--is-accent-rgb),.05);transition:border-color .2s var(--is-ease),background .2s var(--is-ease)}
.is-nextup:hover{border-color:rgba(var(--is-accent-rgb),.7);background:rgba(var(--is-accent-rgb),.1)}
.is-nextup:focus-visible{outline:1px solid rgba(var(--is-accent-rgb),.95);outline-offset:2px}
.is-nextup small{font:500 8.5px var(--is-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--is-accent)}
.is-nextup b{font:500 11px var(--is-sans);letter-spacing:.16em;text-transform:uppercase;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.is-nextup svg{width:14px;height:14px;color:var(--is-dim)}
.is-side-foot:not(:has(#isVisitBtn)) .is-nextup{margin-bottom:-4px}
.is-kid{display:grid;gap:2px;padding:8px 0}
.is-kid b{font:500 12px var(--is-sans);letter-spacing:.18em;text-transform:uppercase;color:#fff}
.is-kid span{font:300 13.5px/1.4 var(--is-sans);color:var(--is-dim)}
@media (max-height:760px) and (min-width:761px){
  .is-glance-media{display:none}.is-glance-facts b{font-size:14px}.is-glance{padding-bottom:6px}
  .is-model{padding:10px 14px 4px}.is-model-plane{width:74%;margin:-20px auto -22px}
  .is-side-foot{padding:9px 14px 10px;gap:6px 10px}
}

/* ── ONSITE (2026-10-01): the touch surface + the lobby display (ONSITE.md) ──
   The display's check-in card (welcome · QR · arrivals) is the screen's front page: it sits ABOVE the console
   (it was painting at z 2200, under the console's 9000 — invisible). Read across a room, so the chrome grows:
   type leads, targets follow (the classic touch surface's rule: it scales chrome, never content). */
html.is-mode .sxr-hub{z-index:9600}
.is-qr{display:grid;place-items:center;padding:22px;margin-top:6px;border-radius:var(--is-r-panel,18px);background:#fff}
.is-qr canvas{width:min(300px,70vw);height:auto;image-rendering:pixelated}
#isRoot.is-touch{--is-side-w:clamp(300px,24vw,420px);--is-radar:clamp(150px,12vw,210px)}
#isRoot.is-touch .is-nav button{font-size:14px;padding:14px 4px 16px}
#isRoot.is-touch .is-tool{font-size:14px;padding:12px 4px}
#isRoot.is-touch .is-tool svg{width:22px;height:22px}
#isRoot.is-touch .is-loc{font-size:clamp(15px,1.15vw,19px)}
#isRoot.is-touch .is-sub{font-size:clamp(15px,1.15vw,19px)}
#isRoot.is-touch .is-line{font-size:19px}
#isRoot.is-touch .is-acts button{font-size:clamp(15px,1.1vw,18px);min-height:60px}
#isRoot.is-touch .is-acts i{width:60px;height:60px}
#isRoot.is-touch .is-chip{height:52px;padding:0 20px;font-size:12.5px}
#isRoot.is-touch .is-chip small{font-size:12px}
#isRoot.is-touch .is-back{font-size:13px;min-height:48px}
#isRoot.is-touch .is-btn{height:56px;font-size:13px}
#isRoot.is-touch .is-tabs button{font-size:13px;min-height:48px}
#isRoot.is-touch .is-row{padding:10px;min-height:64px}
#isRoot.is-touch .is-row-t b{font-size:14px}
#isRoot.is-touch .is-row-t small{font-size:13.5px}
#isRoot.is-touch .is-row-n{font-size:12px}
#isRoot.is-touch :is(.is-list-h,.is-model-l,.is-glance-facts small,.is-nextup small,.is-now small,.is-radar-l,.is-p-eyebrow,.is-panel h3,.is-facts dt){font-size:11.5px}
#isRoot.is-touch .is-glance-facts b{font-size:20px}
#isRoot.is-touch .is-glance-media{display:none}   /* room for the Spaces list on a 1080p screen; the rows still count each place's media */
#isRoot.is-touch .is-model{padding:10px 14px 4px}
#isRoot.is-touch .is-model-plane{width:70%;margin:-22px auto -24px}
#isRoot.is-touch .is-nextup{padding:12px;min-height:52px}
#isRoot.is-touch .is-nextup b{font-size:13.5px}
#isRoot.is-touch .is-side-foot,#isRoot.is-touch .is-visit{font-size:13px}
#isRoot.is-touch .is-visit{min-height:44px;display:inline-flex;align-items:center}
#isRoot.is-touch .is-now b{font-size:16px}
#isRoot.is-touch .is-now em{font-size:14.5px}
#isRoot.is-touch .is-frame{width:clamp(130px,10.5vw,190px)}
#isRoot.is-touch .is-frame small{font-size:12px}
#isRoot.is-touch .is-strip-next,#isRoot.is-touch .is-x{width:52px;height:52px}
#isRoot.is-touch .is-zoom button{height:56px}
#isRoot.is-touch .is-foot small{font-size:11px}
#isRoot.is-touch .is-foot-r{font-size:12px}
#isRoot.is-touch .is-p-line{font-size:18px}
#isRoot.is-touch .is-hl li{font-size:17px}
#isRoot.is-touch .is-facts dd{font-size:17px}
#isRoot.is-touch .is-menu button{min-height:64px;font-size:15px}
#isRoot.is-touch .is-panel{width:min(560px,100%)}
#isRoot.is-touch .is-panel.wide{width:min(760px,100%)}
#isRoot.is-touch .is-kids b{font-size:14px}
#isRoot.is-touch .is-kids span{font-size:16px}
#isRoot.is-touch .is-sctl button{width:48px;height:48px}
#isRoot.is-touch .is-snum,#isRoot.is-touch .is-sctl .is-send{font-size:12px}
#isRoot.is-touch .is-choice button{padding:16px 24px;font-size:14px}
#isRoot.is-touch .is-cap{font-size:clamp(24px,2.4vw,38px)}

/* ── BLUEPRINT — "Make it yours" on the demos (2026-10-01, parity) ── the pill is a tool in the top bar; the marks and
   the panel sit above the console. The panel takes the stage between the property column and the side panel, so
   the marks on both stay visible; narrower windows put it over the left column, phones get the classic sheet. */
#isRoot #bpPill{position:relative;inset:auto;z-index:auto;min-height:36px;padding:0 14px 0 5px;gap:9px;font:500 10.5px/1 var(--is-mono);letter-spacing:.18em;
  background:rgba(var(--is-accent-rgb),.08);border-color:rgba(var(--is-accent-rgb),.55);box-shadow:none;white-space:nowrap}
#isRoot #bpPill i{width:26px;height:26px;font-size:12px;background:var(--is-accent)}
body.bp-on #isRoot #bpPill{background:var(--is-accent);color:#0a0a0a;box-shadow:0 0 0 5px rgba(var(--is-accent-rgb),.16)}
body.bp-on #isRoot #bpPill i{background:#0a0a0a;color:var(--is-accent)}
/* room for it in the top bar: Save and Share go to icons and the menu tightens (labels return on very wide screens) */
@media (max-width:1700px){#isRoot .is-tools:has(#bpPill) :is(#isSave,#isShare) span{display:none}#isRoot .is-top:has(#bpPill) .is-nav{gap:clamp(14px,2vw,30px)}}
@media (max-width:1440px){#isRoot .is-tools:has(#bpPill) #isSono span{display:none}#isRoot .is-tools:has(#bpPill){gap:10px}#isRoot .is-top:has(#bpPill) .is-nav{gap:16px}}
html.is-mode #bpLayer{z-index:9450}
html.is-mode #bpPanel{z-index:9460;left:auto;right:calc(var(--is-gr) + var(--is-side-w) + 24px);top:clamp(104px,13vh,124px);
  bottom:calc(64px + 128px + env(safe-area-inset-bottom,0px));width:min(360px,calc(100vw - var(--is-gl) - min(620px,44vw) - var(--is-side-w) - var(--is-gr) - 72px))}
body.bp-on #isStage{filter:saturate(.7) brightness(.82);transition:filter .6s var(--is-ease)}
body.bp-on #isRoot .is-quote,body.bp-on #isHome .is-quote{opacity:0}
@media (max-width:1180px) and (min-width:761px){
  html.is-mode #bpPanel{left:var(--is-gl);right:auto;width:min(340px,40vw)}
  #isRoot #bpPill span{display:none}#isRoot #bpPill{padding:0 5px}
}
@media (max-width:760px){
  #isRoot #bpPill span{display:none}#isRoot #bpPill{padding:0 4px;min-height:34px}
  html.is-mode #bpPanel{left:12px;right:12px;width:auto;top:auto;bottom:calc(120px + env(safe-area-inset-bottom,0px));max-height:56vh}
}

/* ══ THE MERGE (2026-10-01) — the console as the classic Showcase's HOME door ══════════════════════════════
   Michael: "important all our team/connect/lead gen/sales funnels are still in plain view and usable at all
   time". So the classic chrome stays on top of everything — header (z 60: logo · call to action · Share ·
   Studio), dock (z 70: Home … Ask Sono · hide · full screen), contact footer + Audio hub (z 55) — and the console
   sits between the hero film (z 4) and that chrome, on Home only. Its geometry is read from the classic's own
   measured insets (--sales-header-h · --hud-h · --foot-h). Phones keep the classic Home (its 09-30 frame). */
html.is-home #isHome{position:absolute;inset:0;z-index:30;pointer-events:none;display:none;color:var(--is-ink);font-family:var(--is-sans);font-weight:300;-webkit-font-smoothing:antialiased}
html.is-home body.on-main #isHome{display:block}
#isHome>*:not(.is-scrim){pointer-events:auto}
#isHome .is-scrim{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(4,7,11,.72) 0%,rgba(4,7,11,.3) 34%,rgba(4,7,11,0) 54%),linear-gradient(270deg,rgba(4,7,11,.45) 0%,rgba(4,7,11,0) 24%)}
@media (min-width:761px){
  /* the classic Home's own words, doors and caption step aside — the console carries them (doors included) */
  html.is-home body.on-main #heroLayer :is(.ch-content,.ch-caption){display:none!important}
  /* a Showcase on the standard hero (no commissioned intro): its photo and shade stay, its words, doors and
     location cards step aside the same way */
  html.is-home body.on-main #heroLayer > .hero{display:none!important}
  html.is-home body.on-main #heroLayer .ch-motion{right:auto;left:50%;transform:translateX(-50%);top:calc(var(--sales-header-h,112px) + 10px)}
}
#isHome .is-left{top:calc(var(--sales-header-h,112px) + clamp(14px,3.6vh,44px));width:min(560px,40vw);gap:clamp(8px,1.3vh,14px)}
#isHome .is-title{font-size:clamp(30px,min(3.5vw,5.6vh),58px)}
#isHome .is-acts{margin-top:clamp(4px,1.4vh,16px)}
#isHome .is-quote{top:calc(var(--sales-header-h,112px) + clamp(30px,5vh,60px))}
#isHome .is-side{top:calc(var(--sales-header-h,112px) + 6px);bottom:calc(var(--foot-h,81px) + var(--is-radar) + 34px)}
#isHome .is-radar{bottom:calc(var(--foot-h,81px) + 14px)}
#isHome .is-strip{left:calc(var(--is-gl) + min(560px,40vw) + 28px);right:calc(var(--is-gr) + var(--is-side-w) + 28px);
  bottom:calc(var(--foot-h,81px) + var(--hud-h,88px) + 40px)}
#isHome .is-now{bottom:calc(var(--foot-h,81px) + 74px)}
@media (max-height:940px) and (min-width:761px){#isHome .is-now{display:none}}
@media (max-height:860px) and (min-width:761px){#isHome .is-strip{display:none}#isHome .is-sub{display:none}
  #isHome .is-glance-media{display:none}#isHome .is-model{padding:8px 14px 2px}#isHome .is-model-plane{width:66%;margin:-22px auto -24px}}
@media (max-height:800px) and (min-width:761px){#isHome .is-radar{display:none}#isHome .is-side{bottom:calc(var(--foot-h,81px) + 14px)}}
/* ALWAYS A WAY BACK: the classic's Back pill (#sxrBack) sits under the header on Home after a door — the console steps down for it */
html.is-home body.has-back #isHome .is-left{top:calc(var(--sales-header-h,112px) + 58px)}
@media (max-height:760px) and (min-width:761px){
  #isHome .is-side{bottom:calc(var(--foot-h,81px) + 16px)}
  #isHome .is-acts button{min-height:0}
}
@media (max-width:1180px) and (min-width:761px){#isHome .is-strip{display:none}#isHome .is-left{width:min(520px,46vw)}}
@media (max-width:760px){html.is-home #isHome{display:none!important}}

/* Home's side panel opens and closes like every door's (Michael, 2026-10-01: "should be site wide"): the classic edge
   tab's look, on the panel's edge when open and on the screen edge when closed */
#isHome .is-sidetab{position:absolute;top:50%;right:calc(var(--is-gr) + var(--is-side-w));z-index:4;display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:14px 8px;border:1px solid rgba(255,255,255,.2);border-right:0;border-radius:16px 0 0 16px;background:rgba(14,19,23,.88);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;cursor:pointer;transform:translateY(-50%);
  transition:right .5s var(--is-ease),border-color .2s,background .2s}
#isHome .is-sidetab:hover{border-color:rgba(var(--is-accent-rgb),.6);background:rgba(var(--is-accent-rgb),.12)}
#isHome .is-sidetab i{font-style:normal;width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(var(--is-accent-rgb),.5);border-radius:50%;color:var(--is-accent);font-size:13px}
#isHome .is-sidetab span{writing-mode:vertical-rl;font:600 10px var(--is-mono);letter-spacing:.24em;text-transform:uppercase}
#isHome .is-side,#isHome .is-radar{transition:opacity .4s var(--is-ease),transform .5s var(--is-ease)}
#isHome.is-side-closed :is(.is-side,.is-radar){opacity:0;transform:translateX(24px);pointer-events:none;visibility:hidden;transition:opacity .3s var(--is-exit),transform .4s var(--is-exit),visibility 0s .4s}
#isHome.is-side-closed .is-sidetab{right:0}
#isHome.is-side-closed .is-strip{right:calc(var(--is-gr) + 40px)}
@media (prefers-reduced-motion:reduce){#isHome .is-sidetab,#isHome .is-side,#isHome .is-radar{transition:none}}

/* ── THE LOOKS on the console (2026-10-01, phase 1: Noir · Midnight · Maison · Deco) ─────────────────────────────
   Corners come from --is-r-panel / --is-r-row / --is-r-pill (defaults = Granite's own radii, so the house is byte-for-
   byte unchanged). html.skin-flat = a look without glow: the accent stays as line and fill, the halos go. */
html.skin-flat :is(#isHome,#isRoot) .is-acts .main i{box-shadow:none}
html.skin-flat :is(#isHome,#isRoot) .is-tabs button[aria-selected="true"]::after{box-shadow:none}
html.skin-flat :is(#isHome,#isRoot) .is-model-plane::after{box-shadow:none}
html.skin-flat :is(#isHome,#isRoot) .is-pin{box-shadow:none}
html.skin-flat :is(#isHome,#isRoot) .is-row.on{box-shadow:none}
html.skin-flat :is(#isHome,#isRoot) .is-sono img{box-shadow:none}
html.skin-flat :is(#isHome,#isRoot) .is-title{text-shadow:0 2px 18px rgba(0,0,0,.45)}
/* NOIR — light, widely tracked capitals (Rolls-Royce, Four Seasons) */
html[data-skin="noir"] :is(#isHome,#isRoot) .is-title{font-weight:200;letter-spacing:.16em}
html[data-skin="noir"] :is(#isHome,#isRoot) .is-loc{letter-spacing:.36em}
/* MIDNIGHT — a serif in cream, set at its natural case; a faint brass lattice on the panel (Ritz-Carlton Reserve's texture) */
html[data-skin="midnight"] :is(#isHome,#isRoot) .is-title{text-transform:none;letter-spacing:.005em;line-height:1.02}
html[data-skin="midnight"] :is(#isHome,#isRoot) .is-side{background-image:repeating-linear-gradient(45deg,rgba(201,172,119,.04) 0 1px,transparent 1px 16px),repeating-linear-gradient(-45deg,rgba(201,172,119,.04) 0 1px,transparent 1px 16px)}
/* MAISON — high-contrast Didone, title case, gold hairlines under the tabs and above the foot */
html[data-skin="maison"] :is(#isHome,#isRoot) .is-title{text-transform:none;letter-spacing:0;font-weight:400;line-height:1}
html[data-skin="maison"] :is(#isHome,#isRoot) .is-tabs{border-bottom-color:rgba(var(--is-accent-rgb),.45)}
html[data-skin="maison"] :is(#isHome,#isRoot) .is-side-foot{border-top-color:rgba(var(--is-accent-rgb),.45)}
/* DECO — wide geometric capitals and a brass double rule crowning the panel */
html[data-skin="deco"] :is(#isHome,#isRoot) .is-title{font-weight:500;letter-spacing:.14em}
html[data-skin="deco"] :is(#isHome,#isRoot) .is-side::before{content:'';position:absolute;left:14px;right:14px;top:7px;height:3px;border-top:1px solid rgba(var(--is-accent-rgb),.7);border-bottom:1px solid rgba(var(--is-accent-rgb),.7);pointer-events:none}

/* ══ THE LOOKS — INNER DOORS (2026-10-01, Michael: "yes go to the inner page pass") ═══════════════════════════════
   Explore, Media, Overview, Ask Sono, 3D/360 and Offers are built from a dozen shared glass components that hard-code
   ~300 colours. Rather than rewrite them, a look (html.skin-flat — never Granite) re-tints those components from the
   look's own tokens: its ground, glass, edge and corners, set by applyTheme as --black / --is-glass / --is-edge /
   --is-r-*; and its title face (--is-wide) replaces the house Bodoni on inner-page titles. Halos go (flat).
   Only colour, corners, shadow and type change — never size or position (THEMING.md §1). */
html.skin-flat{--sk-glass:var(--is-glass);--sk-glass-hi:var(--is-glass-hi);--sk-line:var(--is-edge);--sk-r:var(--is-r-panel,0);--sk-row:var(--is-r-row,0);--sk-pill:var(--is-r-pill,0)}
/* the page backdrop behind every deck */
html.skin-flat .ov-bg{background:var(--black)}
/* modules, tiles, the page menu, selection plates, in-page cards, toolbars, panels */
html.skin-flat :is(.ov-mod,.ov-tile,.ov-menu,.ov-plate,.story-nav,.story-toolbar,.iv-toolbar,.iv-rail,.iv-tools,.g-panel,.story-strip-nav),
html.skin-flat[data-showcase-ui="glass"] body :is(.ov-mod,.ov-tile,.ov-menu,.story-nav,.story-toolbar,.iv-toolbar,.g-panel,.story-page .ci-card){
  background:var(--sk-glass);border-color:var(--sk-line);box-shadow:none}
html.skin-flat :is(.ov-mod,.ov-tile,.ov-plate,.story-page .ci-card,.g-panel){border-radius:var(--sk-r)}
html.skin-flat .ov-plate{box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.55)}
html.skin-flat :is(.ov-menu,.ov-menu button,.ov-step button,.ov-bar-cta,.ov-chart-chip,.story-kind-select,.home-door){border-radius:var(--sk-pill)}
/* the lens: the look's edge and corners, a plain drop shadow instead of the house glow ring */
html.skin-flat .ov-lens{border-color:var(--sk-line);border-radius:var(--sk-r);box-shadow:0 30px 70px rgba(0,0,0,.5)}
html.skin-flat .ov-lens-tag{border-radius:var(--sk-pill);border-color:var(--sk-line)}
/* the at-a-glance dock and its cards */
html.skin-flat.m2 #sxrSide{background:var(--sk-glass-hi);border-left-color:var(--sk-line)}
html.skin-flat.m2 #sxrSide .ci-card{border-color:var(--sk-line);border-radius:var(--sk-r)}
html.skin-flat.m2 #sxrSideTab{background:var(--sk-glass-hi);border-color:var(--sk-line)}
/* the dock: the look's glass and line (its own corners stay — it is the one shape every look shares) */
html.skin-flat #hud,html.skin-flat[data-showcase-ui="glass"] body #hud{background:var(--sk-glass);border-color:var(--sk-line)}
/* inner-page titles in the look's own face (Granite keeps the house Bodoni) */
html.skin-flat :is(.ov-h h2,.ov-title,.ov-layer h2,.ov-lens-l,.ov-pull,.ov-spec-h2,.ov-sono figcaption h2,.ov-asked-q,.ov-of-n),
html.skin-flat.m2 #sxrSide .sd-title,
html.skin-flat[data-showcase-ui="glass"] #mpBody .mg-tile .mt-label b{font-family:var(--is-wide)}
html[data-skin="noir"].skin-flat :is(.ov-h h2,.ov-title,.ov-layer h2,.ov-lens-l){font-weight:200;letter-spacing:.06em}
html[data-skin="deco"].skin-flat :is(.ov-h h2,.ov-title,.ov-layer h2,.ov-lens-l){font-weight:500;letter-spacing:.08em;text-transform:uppercase;font-style:normal}
html[data-skin="midnight"].skin-flat .ov-mod{background-image:repeating-linear-gradient(45deg,rgba(201,172,119,.03) 0 1px,transparent 1px 16px),repeating-linear-gradient(-45deg,rgba(201,172,119,.03) 0 1px,transparent 1px 16px)}

/* HOME MODE: no photo strip above the dock (Michael, 2026-10-02: "not sure it even needs to be there since we already have
   side panel with same info/links") — the side panel's list and the doors carry the same places */
#isHome .is-strip{display:none!important}

/* THE HYBRID HOME (2026-10-11) — experience.homeHero 'center': the hero headline + line centered between the ways-in
   column and the side panel, the way the classic Home leads with it. Desktop only; phones keep their own Home. */
.is-heroc{position:absolute;z-index:2;left:calc(var(--is-gl) + min(300px,24vw));right:calc(var(--is-side-w,340px) + var(--is-gr,24px) + 2vw);top:clamp(150px,22vh,240px);text-align:center;pointer-events:none}
.is-heroc[hidden]{display:none}
.is-heroc-h{margin:0;font:400 clamp(36px,4.8vw,96px)/1.02 var(--is-serif);letter-spacing:-.01em;color:#fff;text-wrap:balance;text-shadow:0 2px 30px rgba(0,0,0,.55)}
.is-heroc-h em{display:block;font-style:italic}
.is-heroc-sub{margin:clamp(14px,2.4vh,26px) auto 0;max-width:44ch;font:400 clamp(14px,1.05vw,18px)/1.6 var(--is-sans);color:rgba(255,255,255,.88);text-shadow:0 1px 16px rgba(0,0,0,.6)}
.is-arrive .is-heroc-h{animation:isRise .8s var(--is-ease) both}
.is-arrive .is-heroc-sub{animation:isFade .7s .22s var(--is-ease) both}
#isRoot.is-idle .is-heroc{opacity:.06;transition:opacity .6s var(--is-ease)}
@media (max-width:900px){.is-heroc{display:none}}
/* HOME SITS IN THE MIDDLE (Michael, 2026-10-11: "It's top heavy and should be more middle of screen"): on desktop the
   ways-in column and the centered hero are vertically centered in the band between the header and the dock/offer
   card — 'safe' keeps them below the header on short screens instead of overflowing upward. Phones keep their own Home. */
@media (min-width:901px){
  #isHome .is-left{top:calc(var(--sales-header-h,112px) + 14px);bottom:calc(var(--foot-h,81px) + 110px);display:flex;flex-direction:column;justify-content:safe center}
  #isHome .is-heroc:not([hidden]){top:calc(var(--sales-header-h,112px) + 14px);bottom:calc(var(--foot-h,81px) + 110px);display:flex;flex-direction:column;justify-content:safe center}
}
/* PANELS ON BOTH SIDES (Michael, 2026-10-11: "more viewing screen … Those five menu items should have same panel
   (hide/expand) as right side"; "the tab is centered but panel still higher than bottom part"). Desktop only. */
@media (min-width:761px){
  /* the right panel reaches the same line as the left column when there is no neighborhood radar under it */
  #isHome:has(#isRadar[hidden]) .is-side{bottom:calc(var(--foot-h,81px) + 110px)}
  /* its tab sits at the panel's own middle, not the screen's */
  #isHome .is-sidetab{top:calc((var(--sales-header-h,112px) + 6px + 100% - var(--foot-h,81px) - var(--is-radar) - 34px) / 2)}
  #isHome:has(#isRadar[hidden]) .is-sidetab{top:calc((var(--sales-header-h,112px) + 6px + 100% - var(--foot-h,81px) - 110px) / 2)}
  /* the left tab — the right tab's mirror, on the screen edge beside the ways-in column */
  #isHome .is-lefttab{position:absolute;left:0;z-index:4;display:flex;flex-direction:column;align-items:center;gap:10px;
    top:calc((var(--sales-header-h,112px) + 14px + 100% - var(--foot-h,81px) - 110px) / 2);transform:translateY(-50%);
    padding:14px 8px;border:1px solid rgba(255,255,255,.2);border-left:0;border-radius:0 16px 16px 0;background:rgba(14,19,23,.88);
    -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;cursor:pointer;transition:border-color .2s,background .2s}
  #isHome .is-lefttab:hover{border-color:rgba(var(--is-accent-rgb),.6);background:rgba(var(--is-accent-rgb),.12)}
  #isHome .is-lefttab i{font-style:normal;width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(var(--is-accent-rgb),.5);border-radius:50%;color:var(--is-accent);font-size:13px}
  #isHome .is-lefttab span{writing-mode:vertical-rl;transform:rotate(180deg);font:600 10px var(--is-mono);letter-spacing:.24em;text-transform:uppercase}
  #isHome .is-lefttab:focus-visible{outline:1px solid #fff;outline-offset:3px}
  #isHome .is-left{transition:opacity .4s var(--is-ease),transform .5s var(--is-ease)}
  #isHome.is-left-closed .is-left{opacity:0;transform:translateX(-24px);pointer-events:none;visibility:hidden;transition:opacity .3s var(--is-exit),transform .4s var(--is-exit),visibility 0s .4s}
  /* the ways-in column now starts clear of the tab */
  #isHome .is-left{left:calc(var(--is-gl) + 30px)}
}
@media (max-width:760px){#isHome .is-lefttab{display:none}}
/* the centered hero re-centers as either column closes (more viewing room, same balance) */
@media (min-width:901px){
  #isHome .is-heroc{transition:left .5s var(--is-ease),right .5s var(--is-ease)}
  #isHome.is-left-closed .is-heroc{left:calc(var(--is-gl) + 48px)}
  #isHome.is-side-closed .is-heroc{right:calc(var(--is-gr) + 56px)}
}
