:root{
  --green-900:#00351a;--green-800:#004d1e;--green-700:#006527;--green-600:#0a7a36;--green-500:#1f9249;--green-400:#4caf70;--green-300:#8acda3;--green-200:#c2e3d0;--green-100:#e2f1e8;--green-50:#f1f8f4;
  --ink-950:#0b0d0c;--ink-900:#16191a;--ink-800:#23282a;--ink-700:#353b3d;--ink-600:#4d5457;--ink-500:#6b7174;--ink-400:#939a9d;--ink-300:#bcc2c4;--ink-200:#dde1e2;--ink-150:#e8ebeb;--ink-100:#f1f3f3;--ink-50:#f8f9f9;
  --amber:#b7791f;
  --font-display:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --font-body:var(--font-display); /* the app sets body text in the display face */
  /* theme tokens (the app is light only) */
  --bg:#eef1f1;--panel:#ffffff;--panel-2:var(--ink-50);--text:var(--ink-950);--text-2:var(--ink-700);--muted:#686e71;
  --line:var(--ink-150);--line-2:var(--ink-200);--brand:var(--green-700);--brand-ink:#fff;--chip:var(--ink-100);
  /* canvas palette */
  --c-space:#e7ebeb;--c-sphere:#f8faf9;--c-limb:#cdd4d4;--c-land:#b4bcbd;--c-texas:#8f989a;--c-county:#5b6366;--c-waller:#006527;
  --c-outline:rgba(22,25,26,.28);--c-ring:rgba(22,25,26,.14);--c-label:#353b3d;
  --c-new:#006527;--c-reno:#6b7174;--c-add:#1f9249;--c-heb:#b7791f;--c-sel:#0b0d0c;
  --c-road1:#7b8386;--c-road2:#a9b0b2;--c-roadtxt:#353b3d;--c-roadbg:#ffffff;--c-selfill:rgba(0,101,39,.08);--c-selline:#006527;
  --logo-light:block;
  box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
/* design tokens: one scale for spacing, type, corners, shadows, status colours, control sizes and stacking.
   New and restyled UI uses these; older rules still carry literal values and move over as they are touched. */
:root{
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;
  --fs-label:10.5px;--fs-xs:11.5px;--fs-sm:12.5px;--fs-md:14px;--fs-lg:16px;--fs-xl:20px;--fs-2xl:24px;
  --r-sm:4px;--r-md:8px;--r-lg:12px;--r-sheet:16px;--r-pill:999px;
  --sh-1:0 1px 2px rgba(11,13,12,.08);--sh-2:0 8px 24px rgba(11,13,12,.16);--sh-sheet:0 14px 40px rgba(11,13,12,.22);
  --danger:#b42318;--danger-ink:#fff;--warn:var(--amber);--ok:var(--brand);
  --tap:44px;--ctl:36px;
  --focus:var(--green-600); /* keyboard focus ring: 4.8:1 on the page, 5.4:1 on panels */
  --dur-fast:150ms;--dur-base:220ms;--dur-reveal:550ms;--ease:cubic-bezier(.2,.7,.2,1); /* motion: hovers, panels, reveals */
  --z-ui:5;--z-card:7;--z-nav:9;--z-scrim:10;--z-sheet:11;--z-toast:20;--z-modal:60;
}
@media (pointer:coarse){:root{--ctl:40px}}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--font-display);-webkit-font-smoothing:antialiased;overflow:hidden}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* groups that clip their buttons (overflow:hidden for the rounded ends) draw the ring inside; on the pressed (dark) button it's the panel colour */
.seg button:focus-visible,.tools button:focus-visible,.backchip button:focus-visible{outline-offset:-4px}
.appbar .viewbar button:focus-visible{outline-offset:-3px} /* the app bar scrolls sideways, so it clips anything outside */
.appbar .viewbar button[aria-pressed="true"]:focus-visible{outline-color:var(--panel)}
.seg button[aria-pressed="true"]:focus-visible,.tools button[aria-pressed="true"]:focus-visible{outline-color:var(--panel)}
.maplibregl-canvas:focus-visible{outline:2px solid var(--focus);outline-offset:-3px}
.pg-focus:focus{outline:none} /* a page's heading takes focus after keyboard navigation (app.js setView); it isn't a control */

.app{--pw:clamp(360px,30vw,480px);--aiw:min(460px,calc(100vw - 32px));position:relative;height:100%;display:grid;grid-template-columns:var(--pw) minmax(0,1fr)}
.stage{position:relative;min-width:0;min-height:0;background:var(--c-space)}
canvas#globe{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:var(--cur-grab,grab)}
canvas#globe.dragging{cursor:var(--cur-grabbing,grabbing)}

/* ---------- panel ---------- */
.panel{position:relative;z-index:2;display:flex;flex-direction:column;min-height:0;background:var(--panel);border-right:1px solid var(--line)}
.brandbar{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 0}
.brandbar img{height:34px;width:auto}
.brandbar .l-light{display:var(--logo-light)}
.kicker{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);font-weight:500}
h1{margin:8px 0 6px;font-size:25px;line-height:1.12;letter-spacing:-.02em;font-weight:800}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);margin-top:16px;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.kpi{padding:10px 12px;border-left:2px solid transparent}
.kpi+.kpi{border-left:1px solid var(--line)}
.kpi:first-child{border-left:2px solid var(--brand)}
.kpi b{display:block;font-family:var(--font-mono);font-size:18px;font-weight:600;letter-spacing:-.01em}
.kpi span{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

.filters{padding:14px 22px;border-bottom:1px solid var(--line);display:grid;gap:10px}
.search{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2);border-radius:4px;padding:0 10px;background:var(--panel-2)}
.search input{flex:1;border:0;background:transparent;padding:9px 0;font-size:13px;outline:none}
.search:focus-within,.rrow:focus-within,.ask:focus-within,.mask:focus-within{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.lbl{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);width:64px;flex:none}
.chip{border:1px solid var(--line-2);background:transparent;border-radius:4px;padding:4px 8px;font-size:12px;cursor:var(--cur-pointer,pointer);color:var(--text-2);display:inline-flex;align-items:center;gap:6px;transition:background 120ms,border-color 120ms}
.chip[aria-pressed="true"]{background:var(--text);color:var(--panel);border-color:var(--text)}
.chip .sw{width:8px;height:8px;border-radius:50%}
.chip .n{font-family:var(--font-mono);font-size:10px;opacity:.7}
select.chip{appearance:none;padding-right:22px;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 11px) 50%,calc(100% - 7px) 50%;background-size:4px 4px;background-repeat:no-repeat}

.listhead{display:flex;justify-content:space-between;align-items:baseline;padding:12px 22px 6px;font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.list{flex:1;min-height:0;overflow:auto;padding:0 10px 16px}
.item{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:start;width:100%;text-align:left;border:0;background:transparent;padding:9px 12px;border-radius:4px;cursor:var(--cur-pointer,pointer);color:var(--text)}
.item:hover,.item.on{background:var(--chip)}
.item .dot{width:8px;height:8px;border-radius:50%;margin-top:5px}
.item .nm{font-size:13px;font-weight:600;line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.item .meta{font-size:11.5px;color:var(--muted);margin-top:2px}
.item .amt{font-family:var(--font-mono);font-size:12px;font-weight:500;white-space:nowrap}
.more{display:block;margin:8px auto 0;border:1px solid var(--line-2);background:transparent;border-radius:4px;padding:6px 12px;font-size:12px;cursor:var(--cur-pointer,pointer);color:var(--text-2)}

/* ---------- stage overlays ---------- */
.ctrls{position:absolute;right:16px;top:16px;display:flex;flex-direction:column;gap:6px;z-index:3}
.ctrls button{width:36px;height:36px;border-radius:4px;border:1px solid var(--line-2);background:var(--panel);color:var(--text);cursor:var(--cur-pointer,pointer);display:grid;place-items:center;box-shadow:0 1px 2px rgba(11,13,12,.08)}
.ctrls .sep{height:4px}
.legend{position:absolute;left:16px;bottom:16px;z-index:3;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:10px 12px;display:grid;gap:6px;font-size:12px;color:var(--text-2);box-shadow:0 1px 2px rgba(11,13,12,.06)}
.legend .t{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.legend .li{display:flex;align-items:center;gap:8px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%}
.tip{position:absolute;z-index:4;pointer-events:none;background:var(--panel);color:var(--text);border:1px solid var(--line-2);border-radius:4px;padding:7px 9px;font-size:12px;max-width:260px;box-shadow:0 4px 14px rgba(11,13,12,.16);opacity:0;transition:opacity 120ms}
.tip b{display:block;font-weight:600;margin-bottom:2px}
.tip span{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.card{position:absolute;z-index:5;right:16px;bottom:16px;width:min(420px,calc(100% - 32px));background:var(--panel);border:1px solid var(--line);border-radius:6px;box-shadow:0 10px 30px rgba(11,13,12,.22);display:none;max-height:calc(100% - 32px);overflow:auto}
.card.open{display:block}
.card .top{display:flex;justify-content:space-between;gap:10px;padding:16px 16px 10px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:3;background:var(--panel)}
.card h2{margin:6px 0 0;font-size:17px;line-height:1.25;letter-spacing:-.01em;font-weight:700}
.card .x{border:0;background:transparent;cursor:var(--cur-pointer,pointer);color:var(--muted);width:28px;height:28px;flex:none;border-radius:4px}
/* close (×) buttons share one hover and a 32 px target (--tap on touch, through an invisible ring that doesn't move the layout) */
.card .x,.saved .x,.tslider .x,.witem .x,.placebar .x,.cmp-chip .x,.xh .x,.mrow .x,.lb-h .x,.fpop-h .x,.layers .ly-h .x{min-width:32px;min-height:32px;border-radius:var(--r-sm);transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.cmp-chip .x{min-width:24px;min-height:24px;position:relative}.cmp-chip .x::before{content:"";position:absolute;inset:-4px} /* inside a chip: 24 px drawn, 32 px to hit */
@media (hover:hover){.card .x:hover,.saved .x:hover,.tslider .x:hover,.witem .x:hover,.placebar .x:hover,.cmp-chip .x:hover,.xh .x:hover,.mrow .x:hover,.lb-h .x:hover,.fpop-h .x:hover,.layers .ly-h .x:hover{background:var(--chip);color:var(--text)}}
@media (pointer:coarse){.card .x,.saved .x,.tslider .x,.witem .x,.cmp-chip .x,.xh .x,.mrow .x,.lb-h .x,.fpop-h .x,.layers .ly-h .x{position:relative}.card .x::before,.saved .x::before,.tslider .x::before,.witem .x::before,.placebar .x::before,.cmp-chip .x::before,.xh .x::before,.mrow .x::before,.lb-h .x::before,.fpop-h .x::before,.layers .ly-h .x::before{content:"";position:absolute;inset:calc((32px - var(--tap))/2)}}
.card dl{display:grid;grid-template-columns:96px 1fr;gap:6px 12px;margin:0;padding:12px 16px;font-size:12.5px}
.card dt{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-top:2px}
.card dd{margin:0;color:var(--text)}
.card .scope{padding:0 16px 12px;font-size:12.5px;color:var(--text-2);line-height:1.5}
.card .note{margin:0 16px 12px;padding:8px 10px;border-left:2px solid var(--c-heb);background:var(--panel-2);font-size:12px;color:var(--text-2)}
.card .go{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 16px 16px;padding:10px;border-radius:4px;background:var(--green-700);color:#fff;text-decoration:none;font-weight:600;font-size:13px}
.card .go:hover{background:var(--green-800)}
.tag{display:inline-block;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line-2);border-radius:3px;padding:1px 5px;margin-right:4px;color:var(--text-2)}
.tools{position:absolute;left:16px;top:16px;z-index:3;display:flex;background:var(--panel);border:1px solid var(--line-2);border-radius:6px;overflow:hidden;box-shadow:0 1px 2px rgba(11,13,12,.08)}
.tools button{border:0;background:transparent;height:36px;padding:0 12px;display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--text-2);cursor:var(--cur-pointer,pointer)}
.tools button+button{border-left:1px solid var(--line)}
.tools button[aria-pressed="true"]{background:var(--text);color:var(--panel)}
.hint{position:absolute;left:16px;top:60px;z-index:3;background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:6px 10px;font-size:12px;color:var(--text-2);display:none;max-width:min(420px,calc(100% - 80px))}
.hint.on{display:block}
.btnrow{display:flex;flex-wrap:wrap;gap:6px}
/* button roles: .btn is the secondary (outline) button, .btn.primary the one main action (brand fill, same in both themes),
   .btn.ghost a quiet text button. Sizes: default/.sm 32px, .md 40px; 44px on touch screens. */
.btn{border:1px solid var(--line-2);background:var(--panel);border-radius:var(--r-sm);padding:6px 10px;min-height:32px;font-size:12px;font-weight:600;cursor:var(--cur-pointer,pointer);color:var(--text);display:inline-flex;align-items:center;gap:6px}
.btn:hover:not(:disabled){border-color:var(--muted)}
.btn.sm{min-height:32px}
.btn.md{min-height:40px;padding:0 16px;font-size:13px}
.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.btn.primary:hover:not(:disabled){background:color-mix(in srgb,var(--brand) 85%,var(--text));border-color:color-mix(in srgb,var(--brand) 85%,var(--text))}
.btn.ghost{background:transparent;border-color:transparent;color:var(--brand)}
.btn.ghost:hover:not(:disabled){background:var(--chip);border-color:transparent}
.btn:disabled{opacity:.5;cursor:var(--cur-default,default)}
.listhead .ex{font-family:var(--font-display);text-transform:none;letter-spacing:0;font-size:12px;font-weight:600;color:var(--brand);background:none;border:0;cursor:var(--cur-pointer,pointer);padding:0}
.toast{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:6;background:var(--text);color:var(--panel);padding:8px 14px;border-radius:4px;font-size:12.5px;opacity:0;pointer-events:none;transition:opacity 200ms;max-width:calc(100% - 32px)}
.toast.on{opacity:1}
.layers{position:absolute;right:62px;top:16px;z-index:4;width:296px;background:var(--panel);border:1px solid var(--line-2);border-radius:6px;padding:16px;box-shadow:0 8px 24px rgba(11,13,12,.16);display:none}
.layers.on{display:grid;gap:10px}
.layers .lt{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.seg{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line-2);border-radius:4px;overflow:hidden}
.seg button{border:0;background:transparent;padding:7px 4px;font-size:12px;font-weight:600;cursor:var(--cur-pointer,pointer);color:var(--text-2)}
.seg button+button{border-left:1px solid var(--line-2)}
.seg button[aria-pressed="true"]{background:var(--text);color:var(--panel)}
.tg2{display:flex;align-items:center;gap:9px;font-size:13px;cursor:var(--cur-pointer,pointer);padding:2px 0}
.tg2 input{appearance:none;width:30px;height:17px;border-radius:9px;background:var(--line-2);position:relative;cursor:var(--cur-pointer,pointer);margin:0;flex:none;transition:background 120ms}
.tg2 input::after{content:"";position:absolute;left:2px;top:2px;width:13px;height:13px;border-radius:50%;background:#fff;transition:transform 120ms;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.tg2 input:checked{background:var(--green-700)}
.tg2 input:checked::after{transform:translateX(13px)}
.tg2 input:disabled{opacity:.45}
.radius{position:absolute;left:16px;top:60px;z-index:4;width:min(350px,calc(100% - 80px));background:var(--panel);border:1px solid var(--line-2);border-radius:6px;padding:12px;box-shadow:0 8px 24px rgba(11,13,12,.16);display:none;gap:10px}
.radius.on{display:grid}
.rrow{display:flex;align-items:center;gap:8px;border:1px solid var(--line-2);border-radius:4px;padding:0 10px;background:var(--panel-2)}
.rrow input{flex:1;border:0;background:transparent;padding:9px 0;font-size:13px;outline:none;min-width:0}
.rsug{display:grid;max-height:240px;overflow:auto}
.rsug:empty{display:none}
.rsug button{display:grid;grid-template-columns:1fr auto;gap:2px 8px;text-align:left;border:0;background:transparent;padding:7px 8px;border-radius:4px;cursor:var(--cur-pointer,pointer);color:var(--text)}
.rsug button:hover,.rsug button.on{background:var(--chip)}
.rsug b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rsug i{font-style:normal;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);align-self:center}
.rsug span{grid-column:1/-1;font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rrow2{display:flex;align-items:center;gap:8px}
.rrow2 .lt,.layers .lt{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.rrow2 input[type=range]{flex:1;accent-color:var(--green-700)}
.rrow2 input[type=number]{width:62px;border:1px solid var(--line-2);border-radius:4px;padding:5px 6px;background:var(--panel-2);font-family:var(--font-mono);font-size:12px}
.rrow2 .u{font-size:12px;color:var(--muted)}
.rpre{display:flex;gap:6px;flex-wrap:wrap}
.rpre button{border:1px solid var(--line-2);background:transparent;border-radius:4px;padding:4px 8px;font-size:12px;cursor:var(--cur-pointer,pointer);color:var(--text-2)}
.rpre button.on{background:var(--text);color:var(--panel);border-color:var(--text)}
.rnote{font-size:12px;color:var(--muted)}
/* working: a small spinner before the note ("Looking up…"); turns slowly with reduced motion */
.rnote.loading{display:flex;align-items:center;gap:7px}
.rnote.loading::before{content:"";flex:none;width:11px;height:11px;box-sizing:border-box;border-radius:50%;border:1.6px solid var(--line-2);border-top-color:var(--brand);animation:sp-spin .8s linear infinite}
.seg button,.tools button,.rpre button,.more,.mrow,.fdone{transition:background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
@media (hover:hover){
  .seg button:not([aria-pressed="true"]):hover,.tools button:not([aria-pressed="true"]):hover{background:var(--chip);color:var(--text)}
  .rpre button:not(.on):hover,.more:hover{border-color:var(--muted);color:var(--text)}
  .lnk:hover{text-decoration:underline;text-underline-offset:2px} .mrow .lnk:hover{text-decoration:none}
  .mrow:hover{background:var(--panel-2)}
}
.seg button:not([aria-pressed="true"]):active,.tools button:not([aria-pressed="true"]):active{background:var(--line)}
.rpre button:not(.on):active,.more:active{background:var(--chip)}
.loading:not(.rnote){position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);z-index:1}
.sheet-toggle{display:none}


@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
  /* a spinner that stops reads as stuck: these turn slowly instead (the AI and site plan indicators stay still, as before) */
  .btn.busy::after,.rnote.loading::before{animation-duration:2.4s!important;animation-iteration-count:infinite!important}}

#map{position:absolute;inset:0}
.seg.seg4{grid-template-columns:repeat(4,1fr)}
.seg.seg4 button{font-size:11.5px;padding:7px 2px}
.seg.seg6{grid-template-columns:repeat(3,1fr)}
.seg.seg6 button{font-size:11.5px;padding:7px 2px}
.seg.seg6 button:nth-child(4){border-left:0}
.seg.seg6 button:nth-child(n+4){border-top:1px solid var(--line-2)}
.layers{max-height:calc(100% - 32px);overflow-y:auto}
.live-ly{display:grid;gap:6px;border-top:1px solid var(--line);padding-top:8px}
.live-ly .rnote:empty{display:none}
.live-sec .btnrow{margin-bottom:8px}
.live-out{display:grid;gap:6px}
.live-out .chitem{text-decoration:none}
.live-big{font-family:var(--font-mono);font-size:17px;font-weight:600;color:var(--text)}
.live-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.live-thumbs button{border:1px solid var(--line);border-radius:4px;background:var(--chip);padding:0;cursor:var(--cur-pointer,pointer);text-align:left;color:var(--text);overflow:hidden}
.live-thumbs img{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:var(--line)}
.live-thumbs span{display:block;font-size:10.5px;padding:4px 6px;font-family:var(--font-mono)}
.maplibregl-ctrl-attrib{font-family:var(--font-display);font-size:10.5px}
.maplibregl-canvas{outline:none}
.stage.m-draw .maplibregl-canvas{cursor:var(--cur-cross,crosshair)}
.stage[data-dmode="area"] .maplibregl-canvas{cursor:var(--cur-area,crosshair)}.stage[data-dmode="poly"] .maplibregl-canvas{cursor:var(--cur-poly,crosshair)}
.stage[data-dmode="radius"] .maplibregl-canvas{cursor:var(--cur-radius,crosshair)}.stage[data-dmode="county"] .maplibregl-canvas{cursor:var(--cur-county,pointer)}


.pin{width:26px;height:34px;transform-origin:bottom center;pointer-events:none}
.legend{bottom:28px}


/* ---------- views, ask, timeline, players, changes ---------- */
.stage{display:grid;grid-template-rows:auto minmax(0,1fr)}
.viewbar{display:flex;gap:2px;padding:8px 12px;background:var(--panel);border-bottom:1px solid var(--line);overflow-x:auto;z-index:4;scrollbar-width:none}
.viewbar button{border:0;background:transparent;border-radius:4px;padding:7px 12px;font-size:13px;font-weight:600;color:var(--text-2);cursor:var(--cur-pointer,pointer);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.viewbar button:hover{background:var(--chip)}
.viewbar button[aria-pressed="true"]{background:var(--text);color:var(--panel)}
.badge{font-family:var(--font-mono);font-size:10px;font-weight:600;background:var(--green-700);color:#fff;border-radius:8px;padding:1px 6px}
.badge:empty{display:none}
.viewport{position:relative;min-height:0;min-width:0}
.view{position:absolute;inset:0;z-index:4;background:var(--panel);overflow:auto;display:none;padding:20px 24px 28px}
.view.on{display:block}
.stage:not([data-view="map"]) .mapleft,.stage:not([data-view="map"]) .ctrls{visibility:hidden}
.vhead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.vhead h2{margin:6px 0 2px;font-size:22px;letter-spacing:-.02em;font-weight:800}
.vsub{color:var(--muted);font-size:12.5px;max-width:760px}
.vctl{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.vctl label{display:inline-flex;gap:6px;align-items:center}
.seg.seg3{grid-template-columns:repeat(3,auto)}
.search.sm input{padding:6px 0;font-size:12.5px;width:150px}
.empty{padding:28px;text-align:center;color:var(--muted);font-size:13px}

/* ask */
.ask{display:flex;align-items:center;gap:8px;margin:12px 22px 0;border:1px solid var(--line-2);border-radius:6px;padding:4px 4px 4px 10px;background:var(--panel-2);color:var(--brand)}
.ask input{flex:1;min-width:0;border:0;background:transparent;padding:7px 0;font-size:13px;outline:none;color:var(--text)}
.ask .btn{padding:6px 12px}
.askout{display:none;margin:8px 22px 0;padding:10px 12px;border-left:3px solid var(--brand);background:var(--panel-2);border-radius:4px;font-size:12.5px;line-height:1.5;max-height:260px;overflow:auto}
.askout.on{display:block}
.askout .answer p,.btext p{margin:6px 0}
.applied{display:flex;justify-content:space-between;gap:8px;font-family:var(--font-mono);font-size:11px;color:var(--text-2)}
.rnote.err{color:var(--danger)}
.cite{border:0;background:var(--chip);border-radius:3px;padding:0 4px;font-family:var(--font-mono);font-size:10.5px;color:var(--brand);cursor:var(--cur-pointer,pointer)}
.lnk{border:0;background:none;padding:0;color:var(--brand);font-weight:600;font-size:12px;cursor:var(--cur-pointer,pointer);text-decoration:none;text-align:left}
.xlegend [data-dt-clear]{display:block;margin-top:6px}
.bdg{display:inline-block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line-2);border-radius:3px;padding:0 4px;margin-right:6px;color:var(--text-2);vertical-align:1px}
.bdg.new{background:var(--green-700);border-color:var(--green-700);color:#fff}

/* filters */
input.chip.mon{padding:3px 4px;font-size:12px;width:116px;background:transparent}
input.chip.mon:disabled{opacity:.45}
.row .to{font-size:12px;color:var(--muted)}
.active{display:none;justify-content:space-between;gap:10px;align-items:baseline;font-size:11.5px;color:var(--text-2)}
.active.on{display:flex}
.saved{font-size:12px}
.saved summary{cursor:var(--cur-pointer,pointer);color:var(--text-2);font-weight:600}
.saved .sv{display:flex;align-items:center;gap:8px;padding:4px 0}
.saved .sv>button:first-child{flex:1}
.saved .x{color:var(--muted);font-size:15px;line-height:1}
a.btn{text-decoration:none}

/* card extras */
.card dd sup{font-family:var(--font-mono);font-size:9px;color:var(--c-heb);margin-left:2px;cursor:var(--cur-help,help)}
.card .scope.sum{color:var(--text);font-weight:500}
.card .hist{margin:0 16px 12px;font-size:12px;color:var(--text-2);display:grid;gap:3px}
.card .hist .m{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.card .lt{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.card .brief{margin:0 16px 12px;font-size:12.5px;line-height:1.5;color:var(--text-2)}
.card .brief .btext p:first-child{margin-top:0}

/* month slider */
.tslider{position:absolute;left:50%;transform:translateX(-50%);bottom:28px;z-index:3;display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line-2);border-radius:6px;padding:6px 10px;box-shadow:0 1px 2px rgba(11,13,12,.08);width:min(460px,calc(100% - 330px))}
.tslider input{flex:1;accent-color:var(--green-700);min-width:60px}
.tslider .tl{font-size:12px;font-weight:600;color:var(--text-2);white-space:nowrap;min-width:150px}
.tslider .play{width:28px;height:28px;border-radius:50%;border:1px solid var(--line-2);background:transparent;color:var(--text);cursor:var(--cur-pointer,pointer);display:grid;place-items:center;flex:none}
.tslider .play.on{background:var(--text);color:var(--panel)}
.tslider .x{border:0;background:transparent;color:var(--muted);font-size:18px;cursor:var(--cur-pointer,pointer);visibility:hidden}
.tslider.on{border-color:var(--brand)}
.tslider.on .x{visibility:visible}
.tslider.on .tl{color:var(--brand)}

/* demographics legend */
.dlegend{position:absolute;right:16px;bottom:28px;z-index:3;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:10px 12px;display:none;gap:5px;font-size:12px;color:var(--text-2);box-shadow:0 1px 2px rgba(11,13,12,.06);max-width:240px}
.dlegend.on{display:grid}
.dlegend .t{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.dlegend .li{display:flex;align-items:center;gap:8px}
.dlegend i{display:inline-block;width:14px;height:10px;border-radius:2px}
.dlegend .src{font-size:10.5px;color:var(--muted);margin-top:2px}
.layers select.chip{width:100%}

/* timeline */
.tl-legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--text-2);margin-bottom:6px}
.tl-legend i,.tl-tip i,.g-head i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.tl-chart{position:relative}
.tl-chart svg{display:block;width:100%;height:auto;overflow:visible}
.tl-chart .grid line{stroke:var(--line);stroke-width:1}
.tl-chart .yax text,.tl-chart .xax text{font-family:var(--font-mono);font-size:10px;fill:var(--muted)}
.tl-chart .today{stroke:var(--text);stroke-width:1.2;stroke-dasharray:3 3}
.tl-chart .band{fill:var(--brand);fill-opacity:.08;stroke:var(--brand);stroke-dasharray:4 3;pointer-events:none}
.tl-chart .hit{fill:transparent}
.tl-chart .brush .selection{fill:var(--brand);fill-opacity:.12;stroke:var(--brand)}
.tl-tip{position:absolute;z-index:2;pointer-events:none;background:var(--panel);border:1px solid var(--line-2);border-radius:4px;padding:8px 10px;font-size:12px;min-width:180px;box-shadow:0 4px 14px rgba(11,13,12,.16);opacity:0;transition:opacity 100ms}
.tl-tip b{display:block}
.tl-tip>span{display:block;font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-bottom:4px}
.tl-tip div{display:flex;align-items:center;gap:0;color:var(--text-2)}
.tl-tip em{font-style:normal;font-family:var(--font-mono);font-size:11px;margin-left:auto;padding-left:12px;color:var(--text)}
.tl-note{font-size:11.5px;color:var(--muted);margin:4px 0 14px}
.gantt{border:1px solid var(--line);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;height:max(360px,calc(100% - 330px))}
.view#view-timeline{display:none;flex-direction:column}
.view#view-timeline.on{display:flex}
.view#view-timeline .gantt{flex:1;min-height:320px}
.g-axis{display:flex;border-bottom:1px solid var(--line-2);background:var(--panel-2);height:28px;flex:none}
.g-axis .g-lab{width:290px;flex:none;padding:6px 12px;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.g-ticks{position:relative;height:100%}
.g-ticks span{position:absolute;top:7px;transform:translateX(-50%);font-family:var(--font-mono);font-size:10px;color:var(--muted);white-space:nowrap}
.g-ticks .now{color:var(--text);font-weight:600}
.g-scroll{flex:1;overflow:auto;position:relative}
.g-inner{position:relative}
.g-row{position:absolute;left:0;right:0;display:flex;align-items:center;border:0;background:transparent;padding:0;text-align:left;color:var(--text);border-bottom:1px solid var(--line);cursor:var(--cur-pointer,pointer);font:inherit}
.g-row:hover,.g-row.on{background:var(--chip)}
.g-row .g-lab{width:290px;flex:none;padding:0 12px;display:flex;flex-direction:column;overflow:hidden}
.g-row .g-lab b{font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.g-row .g-lab em{font-style:normal;font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.g-track{position:relative;height:100%}
.g-bar{position:absolute;top:8px;height:10px;border-radius:2px}
.g-bar.est{background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.6) 0 2px,transparent 2px 5px)}
.g-now{position:absolute;top:0;bottom:0;width:0;border-left:1px dashed var(--line-2)}
.g-head{cursor:var(--cur-default,default);background:var(--panel-2);font-size:12px;font-weight:700}
.g-head:hover{background:var(--panel-2)}
.g-head .g-lab{flex-direction:row;align-items:center}
.g-head .g-sum{font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--muted)}

/* players */
.who-note{font-size:12px;color:var(--muted);margin-bottom:10px}
.tablewrap{overflow-x:auto}
table.who{width:100%;border-collapse:collapse;font-size:12.5px}
table.who th{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:left;font-weight:500;border-bottom:1px solid var(--line-2);padding:6px 8px;white-space:nowrap}
table.who td{border-bottom:1px solid var(--line);padding:7px 8px;vertical-align:middle}
table.who tr[data-k]{cursor:var(--cur-pointer,pointer)}
table.who tr[data-k]:hover,table.who tr.on{background:var(--chip)}
table.who .m{font-family:var(--font-mono);font-size:11.5px;white-space:nowrap}
table.who .r,th.r{text-align:right}
.spark rect{fill:var(--brand)}

/* changes */
.chbody{display:grid;gap:18px;max-width:980px}
.chsec h3{font-size:14px;margin:0 0 6px;font-weight:700}
.ch-jump{position:sticky;top:calc(-1 * var(--chpt,20px));z-index:3;display:flex;flex-wrap:wrap;gap:6px;margin:0 calc(-1 * var(--chpx,24px)) 12px;padding:8px var(--chpx,24px);background:var(--panel-2);border-bottom:1px solid var(--line)}
.ch-jump[hidden]{display:none}
.ch-jump .chip b{font-family:var(--font-mono);font-weight:600;color:var(--muted);margin-left:2px}
.view .chsec[data-sec]>h3{position:sticky;top:calc(var(--chj,0px) - var(--chpt,20px));z-index:2;background:var(--panel);margin:-14px -16px 8px;padding:12px 16px 8px;border-bottom:1px solid var(--line);border-radius:6px 6px 0 0}
.tl-legend button{display:inline-flex;align-items:center;gap:0;border:0;background:none;padding:2px 4px;margin:-2px -4px;border-radius:4px;font:inherit;color:inherit;cursor:var(--cur-pointer,pointer)}
.tl-legend button:hover{background:var(--chip);color:var(--text)}
.chsec h3 span{font-family:var(--font-mono);font-size:11px;color:var(--muted);font-weight:500}
.chitem{display:flex;justify-content:space-between;gap:12px;width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;padding:8px 6px;text-align:left;cursor:var(--cur-pointer,pointer);color:var(--text);font:inherit}
.chitem:hover{background:var(--chip)}
.chitem:disabled{cursor:var(--cur-default,default);opacity:.7}
.chitem b{display:block;font-size:13px;font-weight:600}
.chitem em{font-style:normal;font-size:11.5px;color:var(--muted)}
.chitem .m{font-family:var(--font-mono);font-size:12px;white-space:nowrap;align-self:center}


.viewport{isolation:isolate}
.more summary{cursor:var(--cur-pointer,pointer);font-size:12px;font-weight:600;color:var(--text-2);padding:2px 0}
.more summary span{font-family:var(--font-mono);font-size:10.5px;color:var(--brand)}
.more[open]{display:grid;gap:10px}
.g-bar{top:12px}



/* building panel */
.card .bsub{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-top:3px}
.card .bacts{display:flex;gap:6px;flex-wrap:wrap;padding:10px 16px 0}
.card .bacts .btn.on{background:var(--text);color:var(--panel)}
.card .bsec{margin:0 16px 12px;font-size:12.5px}
.card .bsec dl{padding:0;margin:0}
.card .bsec .chitem{padding:7px 2px}
.card .sc{color:var(--muted);font-size:11px}
.card .mono{font-family:var(--font-mono)}
.card .raw summary{cursor:var(--cur-pointer,pointer);font-size:11.5px;color:var(--brand);font-weight:600;margin-top:6px}
.card .raw dl{margin-top:6px;font-size:11px}
.card .pl{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px solid var(--line)}
.card .pl span{color:var(--muted);font-size:11.5px;text-align:right}
.card button.plb{width:100%;background:none;border:0;border-bottom:1px solid var(--line);color:inherit;font:inherit;text-align:left;cursor:var(--cur-pointer,pointer)}
.card button.plb:hover b{text-decoration:underline}
.pl-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:0}
.card .kgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.card .kgrid b{display:block;font-family:var(--font-mono);font-size:14px}
.card .kgrid span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.card .bphoto{display:block;margin:10px 16px 0;position:relative;border-radius:4px;overflow:hidden}
.card .bphoto img{display:block;width:100%;height:170px;object-fit:cover}
.card .bphoto span{position:absolute;left:6px;bottom:6px;background:rgba(0,0,0,.6);color:#fff;font-size:10.5px;padding:2px 6px;border-radius:3px}
.card .bsrc{margin:0 16px 14px;font-size:10.5px}
.card .dl{padding-top:8px}

/* ================= responsive: tablet + phone ================= */
.mtop,.mnav,.msheet,.mscrim,.ptoggle{display:none}
.ptoggle{border:0;background:transparent;border-radius:4px;padding:6px 8px;color:var(--text-2);cursor:var(--cur-pointer,pointer);align-items:center}
.app.pcollapsed{grid-template-columns:0 1fr}
.app.pcollapsed .panel{display:none}
.notes-mk{width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--c-heb);border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.35);cursor:var(--cur-pointer,pointer)}

@media (max-width:1100px){
  .ptoggle{display:inline-flex}
  .app{--pw:380px}
  .filters,.listhead{padding-left:18px;padding-right:18px}
  .ask,.askout{margin-left:18px;margin-right:18px}
  .card{top:12px;bottom:12px;right:12px;width:min(400px,calc(100% - 24px));max-height:none}
  .tslider{width:min(420px,calc(100% - 300px))}
  .viewbar button{padding:7px 10px}
}
/* map tool labels and the legend follow the map's own width now (container queries, end of file) */
@media (pointer:coarse){
  .chip{min-height:34px;padding:6px 10px}
  .btn{min-height:var(--tap)}
  .item{padding:12px}
  .ctrls button{width:42px;height:42px}
  .tools button{height:42px}
  input,select{font-size:16px}
}

@media (max-width:700px){
  :root{--navh:58px;--st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px)}
  body{overscroll-behavior:none}
  .app{display:block;height:100%}
  .stage{position:absolute;left:0;right:0;top:0;bottom:calc(var(--navh) + var(--sb));display:block}
  .viewbar,.ptoggle{display:none!important}
  .viewport{position:absolute;inset:0}
  .panel{position:absolute;left:0;right:0;top:0;bottom:calc(var(--navh) + var(--sb));z-index:8;display:none;overflow-y:auto;border:0;padding-top:var(--st)}
  .app[data-mtab="list"] .panel{display:flex}
  .app.pcollapsed .panel{display:none}
  .app.pcollapsed[data-mtab="list"] .panel{display:flex}
  .sheet-toggle{display:none!important}
  .list{flex:none;overflow:visible;min-height:0}
  .brandbar{padding-top:14px}
  .brandbar img{height:28px}

  .mnav{display:flex;position:fixed;left:0;right:0;bottom:0;height:calc(var(--navh) + var(--sb));padding-bottom:var(--sb);background:var(--panel);border-top:1px solid var(--line);z-index:9}
  .mnav button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10.5px;font-weight:600;color:var(--muted);border:0;background:none;position:relative;cursor:var(--cur-pointer,pointer);padding:0}
  .mnav button[aria-pressed="true"]{color:var(--brand)}
  .mnav .badge{position:absolute;top:6px;left:calc(50% + 6px)}

  .mtop{display:block;position:absolute;top:calc(10px + var(--st));left:10px;right:10px;z-index:5}
  .stage:not([data-view="map"]) .mtop{display:none}
  .mask{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line-2);border-radius:24px;padding:4px 4px 4px 14px;box-shadow:0 2px 10px rgba(11,13,12,.16);color:var(--brand)}
  .mask input{flex:1;min-width:0;border:0;background:transparent;font-size:16px;padding:8px 0;outline:none;color:var(--text)}
  .mfilt{width:40px;height:40px;border-radius:50%;border:0;background:var(--chip);color:var(--text);position:relative;display:grid;place-items:center;cursor:var(--cur-pointer,pointer);flex:none}
  .mfilt .badge{position:absolute;top:-3px;right:-3px}
  .mcount{margin-top:6px;display:inline-block;background:var(--panel);border-radius:12px;padding:4px 10px;font-family:var(--font-mono);font-size:11px;color:var(--text-2);box-shadow:0 1px 4px rgba(11,13,12,.14)}
  .mcount:empty{display:none}
  .mtop .askout{margin:8px 0 0;max-height:42vh;background:var(--panel);box-shadow:0 4px 14px rgba(11,13,12,.18)}

  .tools{top:calc(100px + var(--st));left:10px;flex-direction:column}
  .tools button+button{border-left:0;border-top:1px solid var(--line)}
  .tools button{height:42px;width:42px;padding:0;justify-content:center}
  .ctrls{top:calc(100px + var(--st));right:10px}
  #zin,#zout,.ctrls .sep{display:none}
  .hint{top:calc(100px + var(--st));left:62px;right:62px;max-width:none}
  .radius{top:calc(100px + var(--st));left:62px;right:10px;width:auto}
  .layers{top:calc(100px + var(--st));left:10px;right:62px;width:auto;max-height:calc(100% - 130px);overflow:auto}
  .tslider{left:10px;right:10px;transform:none;width:auto;bottom:12px}
  .tslider .tl{min-width:0;font-size:11px}
  .toast{bottom:64px}
  .maplibregl-ctrl-bottom-right,.maplibregl-ctrl-bottom-left{bottom:60px}

  .view{padding:calc(14px + var(--st)) 14px 28px}
  .vhead h2{font-size:19px}
  .vctl{width:100%}
  .who th:nth-child(5),.who td:nth-child(5),.who th:nth-child(7),.who td:nth-child(7){display:none}

  .card{left:0;right:0;bottom:0;top:auto;width:auto;max-height:62%;border-radius:14px 14px 0 0;border-bottom:0;z-index:7;box-shadow:0 -8px 28px rgba(11,13,12,.25);overscroll-behavior:contain;transition:max-height 200ms ease}
  .card.full{max-height:calc(100% - 6px)}
  .card::before{content:"";display:block;width:42px;height:5px;border-radius:3px;background:var(--line-2);margin:8px auto 0}
  .card .top{padding-top:8px}
  .card .x{width:40px;height:40px;margin:-6px -8px 0 0}

  .msheet{display:block;position:fixed;left:0;right:0;bottom:calc(var(--navh) + var(--sb));z-index:11;max-height:calc(100% - var(--navh) - var(--sb) - var(--st) - 24px);overflow-y:auto;overscroll-behavior:contain;background:var(--panel);border-radius:14px 14px 0 0;padding:0 8px 10px;transform:translateY(calc(100% + var(--navh) + var(--sb) + 10px));visibility:hidden;transition:transform 200ms cubic-bezier(.2,.7,.2,1);box-shadow:0 -10px 30px rgba(11,13,12,.25)}
  .msheet.on{transform:none;visibility:visible}
  .msheet .msh-top{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:center;min-height:44px;margin:0 -8px;background:var(--panel);border-radius:14px 14px 0 0}
  .msheet .mgrab{width:100%;height:44px;padding:0;border:0;background:none;position:relative;cursor:var(--cur-pointer,pointer)}
  .msheet .mgrab::before{content:"";position:absolute;left:50%;top:19px;width:42px;height:5px;margin-left:-21px;border-radius:3px;background:var(--line-2)}
  .msheet .msh-x{position:absolute;right:6px;top:2px;width:40px;height:40px;padding:0;justify-content:center;border:0;border-radius:50%;background:none;color:var(--text-2)}
  .msheet .msh-x:active{background:var(--chip)}
  .msheet button{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;padding:15px 12px;border:0;border-bottom:1px solid var(--line);background:none;font:600 15px var(--font-display);color:var(--text);cursor:var(--cur-pointer,pointer)}
  .msheet button:last-child{border-bottom:0}
  .mscrim{display:block;position:fixed;inset:0 0 calc(var(--navh) + var(--sb)) 0;background:rgba(0,0,0,.35);z-index:10;opacity:0;pointer-events:none;transition:opacity 200ms}
  .mscrim.on{opacity:1;pointer-events:auto}
}

/* field notes */
.card .top .star{color:var(--c-heb)}
.card .top .star[aria-pressed="true"]{color:var(--c-heb)}
.nform{display:grid;gap:10px;padding:12px 16px}
.nform label{display:grid;gap:4px;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.nform input,.nform select,.nform textarea{font-family:var(--font-display);font-size:14px;letter-spacing:0;text-transform:none;color:var(--text);background:var(--panel-2);border:1px solid var(--line-2);border-radius:4px;padding:8px 10px;width:100%;resize:vertical}
.nform .nadd{justify-self:start;text-transform:none;letter-spacing:0;font-family:var(--font-display);font-size:12px;color:var(--text)}
.nphotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:6px}
.nphotos:empty{display:none}
.nph{position:relative}
.nph img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px}
.nph button{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;cursor:var(--cur-pointer,pointer);line-height:1}
.fcols{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:1100px}
.fcols h3{font-size:14px;margin:0 0 6px}
.witem{display:flex;align-items:center;gap:4px}
.witem .chitem{flex:1}
.witem .x{border:0;background:none;color:var(--muted);font-size:18px;cursor:var(--cur-pointer,pointer);width:32px;height:32px}
@media (max-width:860px){ .fcols{grid-template-columns:1fr} }
.askout{position:relative}
.askx{position:absolute;top:4px;right:4px;width:26px;height:26px;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:17px;cursor:var(--cur-pointer,pointer);line-height:1}
.askout .applied{padding-right:26px}
@media (max-width:700px){ .mtop .askout{max-height:34vh;overflow:auto} }
@media (max-width:1100px) and (min-width:701px){ .card{bottom:auto;max-height:calc(100% - 24px)} }
@media (max-width:700px){
  .panel .ask{display:none}
  .app:has(.card.open) .mtop .askout{display:none}
}
@media (min-width:701px){
  .panel{overflow-y:auto}
  .list{flex:none;min-height:320px;overflow:visible}
}

/* ================= v2: assistant, map settings, period ================= */
.panel>*{flex-shrink:0}
.panel .list{flex-shrink:1}
.seg.seg2{grid-template-columns:1fr 1fr}
#periodRow .chip{font-family:var(--font-mono);font-size:11.5px}
.tslider{display:none}
.tslider.show{display:flex}
.ctrls button[aria-pressed="true"]{background:var(--text);color:var(--panel);border-color:var(--text)}
kbd{font-family:var(--font-mono);font-size:10.5px;border:1px solid var(--line-2);border-bottom-width:2px;border-radius:4px;padding:0 5px;color:var(--muted);background:var(--panel)}

/* launcher in the side panel */
.ask-launch{display:flex;align-items:center;gap:10px;margin:12px 22px 0;width:calc(100% - 44px);border:1px solid var(--line-2);border-radius:8px;padding:10px 12px;background:var(--panel-2);color:var(--brand);cursor:var(--cur-pointer,pointer);text-align:left;font-size:13px;transition:border-color 120ms,background 120ms}
.ask-launch span{flex:1;color:var(--text-2);font-weight:500}
.ask-launch:hover{border-color:var(--brand);background:var(--panel)}

/* floating button */
.ai-fab{position:absolute;right:var(--fabr,16px);bottom:28px;z-index:4;display:inline-flex;align-items:center;gap:8px;border:0;border-radius:24px;padding:11px 18px 11px 15px;background:var(--green-700);color:#fff;font-weight:700;font-size:13.5px;cursor:var(--cur-pointer,pointer);box-shadow:0 6px 20px rgba(0,53,26,.35);transition:transform 160ms,box-shadow 160ms}
.ai-fab:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,53,26,.42)}
.app.ai-open .ai-fab,.stage:not([data-view="map"]) .ai-fab{display:none}
.dlegend{bottom:84px}

/* assistant drawer */
.ai{position:absolute;top:12px;right:12px;bottom:12px;width:var(--aiw);z-index:6;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px rgba(11,13,12,.22);
  transform:translateX(calc(100% + 24px));visibility:hidden;transition:transform 220ms cubic-bezier(.2,.7,.2,1),visibility 0s 220ms}
.app.ai-open .ai{transform:none;visibility:visible;transition:transform 220ms cubic-bezier(.2,.7,.2,1)}
.ai-grab{display:none}
.ai-h{display:flex;align-items:center;gap:6px;padding:12px 12px 10px 16px;border-bottom:1px solid var(--line)}
.ai-t{flex:1;display:flex;align-items:center;gap:8px;color:var(--brand);min-width:0}
.ai-t span{font-weight:800;font-size:15px;color:var(--text)}
.ai-ib{border:0;background:transparent;color:var(--text-2);border-radius:6px;height:30px;min-width:30px;padding:0 8px;font-size:12px;font-weight:600;cursor:var(--cur-pointer,pointer);display:grid;place-items:center}
.ai-ib:hover{background:var(--chip)}
.ai-log{flex:1;min-height:0;overflow-y:auto;padding:14px 16px 8px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain}
.ai-m{font-size:14px;line-height:1.55;max-width:100%;overflow-wrap:anywhere}
.ai-m p{margin:0 0 6px}.ai-m p:last-child{margin-bottom:0}
.ai-m.user{align-self:flex-end;max-width:85%;background:var(--text);color:var(--panel);padding:8px 12px;border-radius:14px 14px 4px 14px}
.ai-m.bot{align-self:flex-start;color:var(--text)}
.ai-m.err{color:var(--danger)}
.ai-m.err .lnk{color:var(--brand);font-weight:600;margin-left:4px}
.ai-m.act{align-self:flex-start;display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:11px;color:var(--text-2);background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:6px;padding:6px 10px;max-width:100%}
.ai-m.act .ai-ai{flex:1;min-width:0}
.ai-m.act .lnk{font-family:var(--font-display);font-size:11.5px;white-space:nowrap}
.ai-m.act.undone{opacity:.5;text-decoration:line-through}
.ai-m.pending{padding:4px 0}
.dots{display:inline-flex;gap:4px}
.dots i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:aidot 1.1s infinite ease-in-out}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes aidot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.ai-empty{display:grid;gap:8px;padding:6px 0 4px;color:var(--text-2);font-size:13px;line-height:1.5}
.ai-empty b{font-size:15px;color:var(--text)}
.ai-sugs{display:grid;gap:6px;margin-top:6px}
.ai-sugs button{text-align:left;border:1px solid var(--line-2);background:var(--panel);border-radius:8px;padding:9px 12px;font-size:12.5px;color:var(--text);cursor:var(--cur-pointer,pointer);line-height:1.35}
.ai-sugs button:hover{border-color:var(--brand);background:var(--panel-2)}
.ai-f{display:flex;align-items:flex-end;gap:6px;margin:8px 12px 12px;border:1px solid var(--line-2);border-radius:12px;padding:6px 6px 6px 12px;background:var(--panel-2)}
.ai-f:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(10,122,54,.15)}
.ai-f textarea{flex:1;min-width:0;border:0;background:transparent;resize:none;outline:none;font:inherit;font-size:14px;line-height:1.4;padding:7px 0;max-height:140px;color:var(--text)}
.ai-mic,.ai-send{width:36px;height:36px;flex:none;border-radius:50%;border:0;display:grid;place-items:center;cursor:var(--cur-pointer,pointer)}
.ai-mic{background:transparent;color:var(--text-2)}
.ai-mic:hover{background:var(--chip)}
.ai-mic.on{background:#c03b3a;color:#fff}
.ai-send{background:var(--green-700);color:#fff}
.ai-send:disabled{opacity:.45;cursor:var(--cur-default,default)}
/* voice panel: an orb that breathes while listening, follows your voice while you talk, spins while thinking and
   follows the assistant's voice while it speaks (--lv is the live level, 0..1, set by the meter in assistant.js) */
.ai-live{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;margin:0 12px;padding:12px 14px;border-radius:16px;background:var(--panel-2);border:1px solid var(--line);transition:border-color .3s,box-shadow .3s}
.ai-live[hidden]{display:none}
.ai-live::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .4s;background:linear-gradient(110deg,transparent 20%,rgba(31,146,73,.14) 45%,rgba(42,120,214,.12) 55%,transparent 80%);background-size:250% 100%;animation:ai-sweep 3.2s linear infinite}
.ai-live[data-state="speaking"]::before,.ai-live[data-state="thinking"]::before{opacity:1}
.ai-live[data-state="hearing"]{border-color:rgba(31,146,73,.55);box-shadow:0 0 0 3px rgba(31,146,73,.12)}
.ai-live[data-state="speaking"]{border-color:rgba(42,120,214,.45);box-shadow:0 0 0 3px rgba(42,120,214,.10)}
.ai-orb{--lv:0;position:relative;width:52px;height:52px;flex:none;display:grid;place-items:center;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#4caf70 0%,#0a7a36 55%,#004d1e 100%);box-shadow:inset 0 -4px 10px rgba(0,0,0,.25),0 4px 14px rgba(0,77,30,.35);
  transform:scale(calc(1 + var(--lv) * .12));transition:transform 60ms linear,background .4s}
.ai-live[data-state="speaking"] .ai-orb{background:radial-gradient(circle at 35% 30%,#6a9fe8 0%,#2a78d6 50%,#0a7a36 100%)}
.ai-glow{position:absolute;inset:-6px;border-radius:50%;background:radial-gradient(circle,rgba(76,175,112,.45) 0%,rgba(76,175,112,0) 70%);opacity:calc(.25 + var(--lv) * 1.4);transform:scale(calc(1 + var(--lv) * .5));pointer-events:none}
.ai-live[data-state="speaking"] .ai-glow{background:radial-gradient(circle,rgba(106,143,224,.5) 0%,rgba(106,143,224,0) 70%)}
.ai-ring{position:absolute;inset:-4px;border-radius:50%;border:2px solid transparent;pointer-events:none}
.ai-live[data-state="thinking"] .ai-ring,.ai-live[data-state="connecting"] .ai-ring{border-color:rgba(76,175,112,.25);border-top-color:#4caf70;border-right-color:#2a78d6;animation:ai-spin .9s linear infinite}
.ai-live[data-state="listening"] .ai-orb{animation:ai-breathe 2.6s ease-in-out infinite}
.ai-bars{position:relative;display:flex;align-items:center;gap:3px;height:24px}
.ai-bars i{width:3px;height:22px;border-radius:2px;background:#fff;transform:scaleY(.22);transition:transform 70ms linear;opacity:.95}
.ai-live[data-state="thinking"] .ai-bars i,.ai-live[data-state="connecting"] .ai-bars i{animation:ai-wave 1s ease-in-out infinite}
.ai-bars i:nth-child(2){animation-delay:.08s}.ai-bars i:nth-child(3){animation-delay:.16s}.ai-bars i:nth-child(4){animation-delay:.24s}.ai-bars i:nth-child(5){animation-delay:.32s}.ai-bars i:nth-child(6){animation-delay:.40s}.ai-bars i:nth-child(7){animation-delay:.48s}
@keyframes ai-spin{to{transform:rotate(360deg)}}
@keyframes ai-wave{0%,100%{transform:scaleY(.22)}50%{transform:scaleY(.8)}}
@keyframes ai-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes ai-sweep{from{background-position:120% 0}to{background-position:-120% 0}}
@media (prefers-reduced-motion:reduce){.ai-live::before,.ai-ring,.ai-orb,.ai-bars i{animation:none!important}}
.ai-lt{position:relative;flex:1;min-width:0;display:grid;gap:1px}
.ai-lt b{font-size:13.5px}.ai-lt span{font-size:12px;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ai-live .btn{position:relative}
.ai-live .btn[hidden]{display:none}
.ai-m.act:has(.ai-src){flex-wrap:wrap;gap:4px 6px}
.ai-m.act:has(.ai-src) .ai-ai{flex:none}
.ai-src{color:var(--brand);text-decoration:none;font-weight:600}.ai-src:hover{text-decoration:underline}
.ai.voice .ai-f textarea{opacity:.6}

/* make room for the drawer on desktop: controls, card and legends shift left */
@media (min-width:1101px){
  .app.ai-open .ctrls{right:calc(var(--aiw) + 28px)}
  .app.ai-open .layers{right:calc(var(--aiw) + 74px)}
  .app.ai-open .card{right:calc(var(--aiw) + 28px)}
}
@media (max-width:1100px) and (min-width:701px){
  .app{--aiw:400px}
  .app.ai-open .ctrls{right:calc(var(--aiw) + 24px)}
  .app.ai-open .layers{right:calc(var(--aiw) + 70px)}
  .app.ai-open .card{right:auto;left:12px}
}
/* phone: the assistant is a bottom sheet over the map so results stay visible above it */
@media (max-width:700px){
  .ai-fab,.ask-launch{display:none}
  .ai{position:fixed;top:auto;left:0;right:0;bottom:calc(var(--navh) + var(--sb));width:auto;height:min(48vh,440px);border-radius:16px 16px 0 0;border-bottom:0;z-index:7;transform:translateY(110%);box-shadow:0 -10px 30px rgba(11,13,12,.25)}
  .app.ai-tall .ai{height:calc(100% - var(--navh) - var(--sb) - 70px - var(--st))}
  .ai-grab{display:block;height:20px;flex:none;touch-action:none;cursor:var(--cur-grab,grab);position:relative}
  .ai-grab::before{content:"";position:absolute;left:50%;top:7px;width:42px;height:5px;margin-left:-21px;border-radius:3px;background:var(--line-2)}
  .ai-h{padding-top:2px}
  .ai-f textarea{font-size:16px}
  .app.ai-open .mcount,.app.ai-open .mapleft,.app.ai-open .ctrls{display:none}
  .app.ai-open .card.open:not(.min){z-index:8} /* a card opened while Ask AI is up sits over it (Ask AI itself folds the card first) */
  .mask{padding:4px}
  .mlaunch{flex:1;min-width:0;display:flex;align-items:center;gap:8px;border:0;background:transparent;padding:8px 6px 8px 10px;font-size:15px;color:var(--brand);text-align:left;cursor:var(--cur-pointer,pointer)}
  .mlaunch span{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
.app.pcollapsed{grid-template-columns:minmax(0,1fr)}
.ai-f textarea:focus-visible{outline:none}
.legend .hramp{display:none;align-items:center;gap:6px;font-size:10.5px;color:var(--muted)}
.legend .hramp b{flex:1;height:8px;min-width:90px;border-radius:4px;background:linear-gradient(90deg,rgba(138,205,163,.3),#8acda3,#4caf70,#1f9249,#006527,#00351a)}
.legend.heat .hramp{display:flex}
.legend.heat .li{display:none}
.tl-chart .brush .overlay{touch-action:none}
.tl-chart .brush .handle{fill:var(--brand);fill-opacity:.0}
.tl-chart .blabel rect{fill:var(--text)}
.tl-chart .blabel text{fill:var(--panel);font-family:var(--font-mono);font-size:10.5px;text-anchor:middle;pointer-events:none}
.tl-chart .blabel{pointer-events:none}
.tl-note{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
#tlRange:empty{display:none}
#tlRange{font-size:12.5px;color:var(--text-2)}
#tlRange b{color:var(--brand)}
@media (max-width:860px){ .g-row .g-lab,.g-axis .g-lab{width:150px} }
/* place menu (right-click / long-press) */
.pmenu{position:absolute;z-index:8;width:220px;background:var(--panel);border:1px solid var(--line-2);border-radius:8px;box-shadow:0 10px 28px rgba(11,13,12,.22);padding:4px;display:none}
.pmenu.on{display:grid}
.pmenu .pm-h{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);padding:6px 10px 4px}
.pmenu button,.pmenu a{border:0;background:transparent;text-align:left;padding:9px 10px;border-radius:5px;font-size:13px;font-weight:600;color:var(--text);cursor:var(--cur-pointer,pointer);text-decoration:none}
.pmenu button:hover,.pmenu a:hover{background:var(--chip)}

/* ================= v3: breathing room ================= */
.panel .list{flex-shrink:0}

.kpis{margin-top:18px}
.kpi{padding:12px 14px}
.ask-launch{margin:16px 24px 0;width:calc(100% - 48px);padding:12px 14px}
.filters{padding:18px 24px 20px;gap:16px}
.filters .row{gap:8px;row-gap:8px;align-items:center}
.filters .lbl{width:72px;padding-top:1px}
.filters .chip{padding:6px 11px;font-size:12.5px;border-radius:6px}
.filters .search{padding:0 12px;border-radius:6px}
.filters .search input{padding:11px 0}
.filters select.chip{padding-right:26px;min-height:32px}
.filters .more{border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.filters .more[open]{gap:14px}
.filters .more summary{padding:0}
.filters input.chip.mon{width:132px;padding:5px 8px}
.active{padding-top:2px}
.btnrow{gap:8px}
.btn{padding:7px 12px}
.listhead{padding:18px 24px 8px}
.list{padding:0 12px 18px}
.item{padding:11px 12px}
.viewbar{gap:4px;padding:10px 14px}
.viewbar button{padding:8px 14px}
.legend{gap:7px;padding:12px 14px}
.ai-fab{bottom:36px}
@media (max-width:1100px){
  .filters,.listhead{padding-left:20px;padding-right:20px}
  .ask-launch{margin-left:20px;margin-right:20px}
  .ask-launch{width:calc(100% - 40px)}
}

/* ================= v4: map search, export, compare, headline metrics ================= */
/* left map column: tools + Export on one row, search under them, then hints / radius / place card */
.mapleft{position:absolute;left:16px;top:16px;z-index:5;display:grid;gap:8px;width:max-content;min-width:min(400px,calc(100% - 90px));max-width:calc(100% - 90px);grid-template-columns:minmax(0,1fr);align-content:start}
.maptop{display:flex;gap:8px;align-items:stretch}
.mapleft .tools{position:static}
.mapleft .hint,.mapleft .radius{position:static;width:auto;max-width:none}
.exbtn{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 15px;border:0;border-radius:6px;background:var(--brand);color:var(--brand-ink);font-weight:700;font-size:12.5px;cursor:var(--cur-pointer,pointer);box-shadow:var(--sh-1);white-space:nowrap}
.exbtn:hover{background:color-mix(in srgb,var(--brand) 85%,var(--text))}
.msearch{position:relative}
.msbox{display:flex;align-items:center;gap:9px;height:40px;padding:0 6px 0 12px;background:var(--panel);border:1px solid var(--line-2);border-radius:6px;box-shadow:0 1px 3px rgba(11,13,12,.10);color:var(--muted)}
.msbox:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(10,122,54,.18)}
.msbox input{flex:1;min-width:0;border:0;background:transparent;font-size:13.5px;outline:none;color:var(--text);padding:0}
.msbox input::-webkit-search-cancel-button{display:none}
.msbox input:focus-visible{outline:none}
.msx{width:28px;height:28px;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:var(--cur-pointer,pointer)}
.msx:hover{background:var(--chip)}
.msres{position:absolute;top:calc(100% + 6px);left:0;width:max(100%,400px);max-width:calc(100vw - 32px);max-height:min(460px,62vh);overflow:auto;overscroll-behavior:contain;background:var(--panel);border:1px solid var(--line-2);border-radius:8px;box-shadow:0 12px 32px rgba(11,13,12,.20);display:none;z-index:6;padding-bottom:4px}
.msres.on{display:block}
.ms-sec{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--panel);padding:10px 14px 6px;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.ms-sec .lnk{font-family:var(--font-display);letter-spacing:0;text-transform:none;font-size:12px}
.ms-it{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;width:100%;text-align:left;border:0;background:transparent;padding:9px 14px;cursor:var(--cur-pointer,pointer);color:var(--text)}
.ms-it:hover,.ms-it.on{background:var(--chip)}
.ms-it b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-it i{font-style:normal;font-family:var(--font-mono);font-size:11px;color:var(--muted);align-self:center;white-space:nowrap}
.ms-it span{grid-column:1/-1;font-size:11.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-it em{font-style:normal;color:var(--c-heb)}
.ms-more{display:block;width:100%;border:0;background:transparent;padding:10px 14px;font-size:12px;color:var(--muted);cursor:var(--cur-pointer,pointer);text-align:center}
.ms-more:hover{color:var(--brand)}
.ms-none{padding:14px;font-size:12.5px;color:var(--muted)}
.placebar{position:relative;display:none;gap:3px;background:var(--panel);border:1px solid var(--line-2);border-left:3px solid #d48806;border-radius:6px;padding:12px 14px;box-shadow:0 6px 18px rgba(11,13,12,.14)}
.placebar.on{display:grid}
.placebar .x{position:absolute;top:6px;right:6px;width:28px;height:28px;border:0;border-radius:4px;background:transparent;color:var(--muted);font-size:18px;cursor:var(--cur-pointer,pointer)}
.pb-k{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#b06f00}
.pb-t{font-size:15px;font-weight:700;padding-right:26px}
.pb-s{font-family:var(--font-mono);font-size:11.5px;color:var(--text-2)}
.pb-s span,.pb-n{color:var(--muted)}
.pb-n{font-size:11.5px}
.pb-a{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}

/* headline metrics: 3–6 tiles, user-picked */
.kpiwrap{position:relative;margin-top:18px;display:grid}
.kpis{margin-top:0;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:1px;background:var(--line)}
.kpi{background:var(--panel);min-width:0}
.kpi+.kpi{border-left:0}
.kpi:first-child{border-left:0;box-shadow:inset 2px 0 0 var(--brand)}
.kpi b{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi.txt b{font-family:var(--font-display);font-size:13.5px;font-weight:700;padding:2px 0 1px}
.kpi span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9.5px}
.kpi-edit{justify-self:end;margin-top:8px;display:inline-flex;align-items:center;gap:5px;border:1px dashed var(--line-2);background:transparent;border-radius:6px;padding:4px 10px;font-size:11.5px;font-weight:600;color:var(--muted);cursor:var(--cur-pointer,pointer)}
.kpi-edit:hover,.kpi-edit[aria-expanded="true"]{color:var(--brand);border-color:var(--brand)}
.kpi-pop{position:absolute;top:100%;right:0;margin-top:6px;z-index:20;width:300px;max-width:calc(100vw - 32px);background:var(--panel);border:1px solid var(--line-2);border-radius:10px;box-shadow:0 14px 36px rgba(11,13,12,.22);display:none;padding:10px}
.kpi-pop.on{display:block}
.kp-h{display:flex;justify-content:space-between;align-items:baseline;padding:4px 6px 8px;border-bottom:1px solid var(--line)}
.kp-h b{font-size:13px}
.kp-h span{font-family:var(--font-mono);font-size:10.5px;color:var(--muted)}
.kp-list{display:grid;max-height:330px;overflow:auto;padding:6px 0}
.kp-it{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:5px;font-size:13px;cursor:var(--cur-pointer,pointer)}
.kp-it:hover{background:var(--chip)}
.kp-it input{accent-color:var(--green-700);width:15px;height:15px}
.kp-it span{flex:1}
.kp-it i{font-style:normal;font-family:var(--font-mono);font-size:10px;font-weight:600;background:var(--green-700);color:#fff;border-radius:8px;padding:1px 6px}
.kp-it.dis{opacity:.5;cursor:var(--cur-default,default)}
.kp-f{display:flex;justify-content:space-between;align-items:center;padding:8px 4px 2px;border-top:1px solid var(--line)}

/* compare */
.cmp-chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 18px}
.cmp-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line-2);border-radius:18px;padding:4px 4px 4px 11px;font-size:13px}
.cmp-chip i,.cmp th i,.cmp-tops h3 i,.cmp-bar .lab i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--c);flex:none}
.cmp-chip .lnk{color:var(--text);font-size:13px}
.cmp-chip .x{width:24px;height:24px;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:16px;cursor:var(--cur-pointer,pointer)}
.cmp-chip .x:hover{background:var(--chip)}
.cmp-slot{display:inline-flex;align-items:center;border:1px dashed var(--line-2);border-radius:18px;padding:5px 12px;font-size:12px;color:var(--muted)}
.cmp-empty{border:1px solid var(--line);border-radius:10px;padding:18px 20px;max-width:640px;margin-bottom:18px;background:var(--panel-2)}
.cmp-empty ol{margin:10px 0 14px;padding-left:20px;color:var(--text-2);font-size:13px;line-height:1.7}
.cmp-empty em{font-style:normal;font-weight:700;color:var(--text)}
table.cmp{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
table.cmp th{text-align:right;font-size:12.5px;font-weight:700;padding:8px 10px;border-bottom:2px solid var(--line-2);white-space:nowrap}
table.cmp th i{margin-right:6px;vertical-align:-1px}
table.cmp th:first-child{text-align:left;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:500}
table.cmp td{padding:7px 10px;border-bottom:1px solid var(--line);text-align:right;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
table.cmp td:first-child{text-align:left;color:var(--text-2)}
table.cmp td.m{font-family:var(--font-mono);font-size:12.5px}
table.cmp td.best{font-weight:700;color:var(--brand)}
.cmp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;margin-top:22px}
.cmp-card{border:1px solid var(--line);border-radius:10px;padding:14px 16px;min-width:0}
.cmp-card h3{margin:0 0 10px;font-size:13.5px;display:flex;align-items:center;gap:7px}
.cmp-svg{width:100%;height:auto;display:block}
.cmp-svg text{font-family:var(--font-mono);font-size:10px;fill:var(--muted)}
.cmp-svg .gl{stroke:var(--line)}
.cmp-bar{display:grid;grid-template-columns:minmax(90px,30%) 1fr;align-items:center;gap:10px;margin:8px 0}
.cmp-bar .lab{display:flex;align-items:center;gap:6px;font-size:12.5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cmp-bar .bar{display:flex;height:16px;border-radius:4px;overflow:hidden;background:var(--chip)}
.cmp-bar .bar b{height:100%}
.cmp-key{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font-size:11.5px;color:var(--text-2)}
.cmp-key i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.cmp-tops{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:16px}
.cmp-tops .cmp-card{border-top:3px solid var(--c)}
.cmp-f{display:flex;justify-content:space-between;gap:10px;width:100%;border:0;background:transparent;text-align:left;padding:7px 4px;border-bottom:1px solid var(--line);cursor:var(--cur-pointer,pointer);color:var(--text)}
.cmp-f:hover{background:var(--chip)}
.cmp-f span{font-size:12.5px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis}
.cmp-f small{display:block;font-weight:400;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-f b{font-family:var(--font-mono);font-size:12px;white-space:nowrap}

/* export dialog */
.xdlg{position:fixed;inset:0;z-index:60;background:rgba(11,13,12,.42);display:none;place-items:center;padding:12px}
.xdlg.on{display:grid}
.xbox{width:min(660px,100%);max-height:calc(100dvh - 24px);overflow:auto;background:var(--panel);border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.35);padding:20px 22px 18px}
.xh{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px}
.xh h2{margin:4px 0 0;font-size:21px;font-weight:800;letter-spacing:-.02em}
.xh .x{width:34px;height:34px;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:22px;cursor:var(--cur-pointer,pointer)}
.xh .x:hover{background:var(--chip)}
.xsec{margin-top:16px}
.xsec>.lt{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.xreports{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.xr{position:relative;display:grid;gap:3px;border:1px solid var(--line-2);border-radius:9px;padding:11px 13px;cursor:var(--cur-pointer,pointer)}
.xr:hover{border-color:var(--ink-400)}
.xr.on{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand);background:var(--panel-2)}
.xr input,.xs input{position:absolute;opacity:0;pointer-events:none}
.xr:focus-within{box-shadow:0 0 0 3px rgba(10,122,54,.3)}
.xr b{font-size:13.5px}
.xr b .n{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);font-weight:500;margin-left:4px}
.xr span{font-size:12px;color:var(--muted);line-height:1.4}
.xscopes{display:grid;border:1px solid var(--line-2);border-radius:9px;overflow:hidden}
.xs{position:relative;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 13px;cursor:var(--cur-pointer,pointer);font-size:13px}
.xs+.xs{border-top:1px solid var(--line)}
.xs:has(input:checked){background:var(--panel-2);box-shadow:inset 3px 0 0 var(--brand)}
.xs:has(input:checked) span{font-weight:700}
.xs b{font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--text-2)}
.xs.dis{opacity:.45;cursor:var(--cur-default,default)}
.xs:focus-within{background:var(--chip)}
.xnote{margin-top:8px;font-size:12px;color:var(--muted)}
.xfmt{display:flex;flex-wrap:wrap;gap:6px;border:0;overflow:visible}
.xfmt button{border:1px solid var(--line-2)!important;border-radius:7px;padding:8px 14px;font-size:12.5px}
.xopts{display:grid;gap:8px}
.xopts:empty{display:none}
.xf{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:20px;padding-top:14px;border-top:1px solid var(--line)}
.xmsg{flex:1;font-size:12px;color:var(--c-heb)}
.xgo{padding:9px 18px;font-size:13px}

@media (max-width:1100px){
  .mapleft{min-width:min(340px,calc(100% - 80px))}
}
@media (max-width:700px){
  .xreports{grid-template-columns:1fr}
  .mapleft{top:calc(100px + var(--st));left:10px;right:62px;width:auto;min-width:0;max-width:none;grid-template-columns:auto minmax(0,1fr);pointer-events:none}
  .mapleft>*{pointer-events:auto}
  .maptop{grid-row:1/span 6;flex-direction:column;align-self:start}
  .mapleft .tools{position:static;top:auto;left:auto}
  .exbtn{display:none}
  .mapleft .hint,.mapleft .radius,.mapleft .placebar{grid-column:2;position:static;top:auto;left:auto;right:auto}
  .mapleft .msearch{display:none}
  .msslot{flex:1;min-width:0}
  .msslot .msearch{display:block;position:static}
  .msslot .msbox{height:40px;border:0;box-shadow:none;background:transparent;padding:0 2px 0 6px}
  .msslot .msbox input{font-size:16px}
  .msslot .msres{position:fixed;top:calc(64px + var(--st));left:10px;right:10px;width:auto;max-width:none;max-height:min(62vh,520px)}
  .mai{color:var(--brand)}
  .mask{padding:4px 4px 4px 8px}
  .kpi-pop{right:auto;left:0}
}
/* assistant follow-up pills */
.ai-next{display:flex;flex-wrap:wrap;gap:6px;align-self:flex-start;max-width:100%}
.ai-next button{border:1px solid var(--line-2);background:var(--panel);color:var(--brand);border-radius:16px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:var(--cur-pointer,pointer);text-align:left;line-height:1.3;transition:background 120ms,border-color 120ms}
.ai-next button:hover{border-color:var(--brand);background:var(--panel-2)}
.ai-next button:first-child{background:var(--green-700);border-color:var(--green-700);color:#fff}
/* building card: sizes + multi-select */
.card dl.bsize{margin:0 16px 10px}
.card .msum{margin:4px 16px 10px}
.mrow{display:flex;align-items:center;gap:6px;border-bottom:1px solid var(--line)}
.mrow .lnk{flex:1;min-width:0;display:grid;gap:2px;padding:8px 0;text-align:left;color:var(--text)}
.mrow .lnk b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .lnk span{font-size:11.5px;font-weight:400;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .x{width:28px;height:28px;border:0;border-radius:4px;background:transparent;color:var(--muted);font-size:17px;cursor:var(--cur-pointer,pointer);flex:none}
.mrow .x:hover{background:var(--chip)}

/* ================= v5: resizable list, flat-view reset, sources ================= */
/* drag handle on the list's right edge (tablet + desktop) */
.presize{position:absolute;top:0;bottom:0;left:calc(var(--pw) - 4px);width:9px;z-index:6;cursor:var(--cur-resize,col-resize);touch-action:none;outline:none}
.presize::after{content:"";position:absolute;top:0;bottom:0;left:4px;width:1px;background:transparent;transition:background 120ms,width 120ms,left 120ms}
.presize:hover::after,.presize:focus-visible::after,.app.presizing .presize::after{left:3px;width:3px;background:var(--green-700)}
.app.presizing{cursor:var(--cur-resize,col-resize);user-select:none}
.app.presizing #map{pointer-events:none}
.app.pcollapsed .presize{display:none}
@media (max-width:700px){ .presize{display:none} }
/* options popout: more room per row */
.layers .tg2{font-size:13.5px;padding:3px 0}
.layers .seg button{padding-top:8px;padding-bottom:8px}
/* flat 2D reset: lights up when the map is tilted or rotated; the needle points north */
.ctrls #flat .needle{transform-origin:8px 8px;transition:transform 60ms linear}
.ctrls #flat.on{border-color:var(--green-700);color:var(--green-700)}
/* Sources tab */
.src-sum{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 18px}
.src-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);border-radius:14px;padding:5px 11px;font-size:12px;color:var(--text-2)}
.src-grp{margin:0 0 22px}
.src-grp h3{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:500;margin:0 0 8px}
.src-tbl{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}
.src-tbl th:nth-child(1){width:27%}.src-tbl th:nth-child(2){width:17%}
.src-tbl th{text-align:left;font-weight:600;font-size:11.5px;color:var(--muted);padding:6px 10px;border-bottom:1px solid var(--line-2)}
.src-tbl td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.src-tbl td b{display:block;font-weight:600}
.src-tbl td a{color:var(--brand)}
.src-tbl td .s{color:var(--muted);font-size:12px}
.src-st{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-weight:600;font-size:12px}
.src-st i{width:8px;height:8px;border-radius:50%;background:var(--muted);flex:none}
.src-st.live i{background:#1f9249;box-shadow:0 0 0 3px rgba(31,146,73,.18)}
.src-st.fresh i{background:#1f9249}
.src-st.stale i{background:#eda100}
.src-st.off i{background:var(--line-2)}
.src-st.err i{background:#c03b3a}
@media (max-width:700px){ .src-tbl{table-layout:auto} .src-tbl thead{display:none} .src-tbl tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 0;border-bottom:1px solid var(--line)} .src-tbl td{border:0;padding:2px 0} .src-tbl td:nth-child(3){grid-column:1/-1} .src-tbl td:nth-child(2){grid-row:1;grid-column:2} }
/* team sync (Field notes) */
.team{margin-top:10px;display:grid;gap:6px;max-width:640px}
.team-f,.team-on{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px}
.team-f span,.team-on span{flex:1 1 100%;color:var(--text-2)}
.team-f input{flex:1 1 200px;min-width:0;border:1px solid var(--line-2);border-radius:4px;padding:8px 10px;font:inherit;background:var(--panel);color:var(--text)}
.team-on span{flex:1 1 auto}
/* satellite image preview */
.lbox{position:fixed;inset:0;z-index:70;background:rgba(11,13,12,.72);display:grid;place-items:center;padding:12px}
.lb-box{width:min(760px,100%);max-height:calc(100dvh - 24px);display:flex;flex-direction:column;background:var(--panel);border-radius:12px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.45)}
.lb-h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:12px 14px}
.lb-h b{display:block;font-size:14px}
.lb-h span{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.lb-h .x{width:34px;height:34px;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:22px;cursor:var(--cur-pointer,pointer);flex:none}
.lb-h .x:hover{background:var(--chip)}
.lb-img{position:relative;background:#0b0d0c;min-height:0;flex:1;display:grid;place-items:center}
.lb-img img{display:block;max-width:100%;max-height:calc(100dvh - 160px);aspect-ratio:1;object-fit:contain}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.88);color:#0b0d0c;font-size:26px;line-height:1;cursor:var(--cur-pointer,pointer);box-shadow:0 2px 8px rgba(0,0,0,.3)}
.lb-nav.prev{left:10px}.lb-nav.next{right:10px}
.lb-f{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--line)}
.lb-f>span{flex:1;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.live-thumbs button{cursor:var(--cur-zoom,zoom-in)}
.lb-f .btn{white-space:nowrap}
@media (max-width:700px){ .lb-f{gap:6px;padding:10px} .lb-f .btn{padding:7px 9px;font-size:12px} .lb-f>span{font-size:10px} }

/* high-res site imagery */
.live-sub{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:10px 0 6px}
.live-sub:first-child{margin-top:2px}
.live-thumbs img.ld{background:linear-gradient(90deg,var(--chip) 25%,var(--panel-2) 50%,var(--chip) 75%);background-size:200% 100%;animation:ldshim 1.2s linear infinite;min-height:110px}
@keyframes ldshim{to{background-position:-200% 0}}
.live-thumbs button:disabled{opacity:.55;cursor:var(--cur-default,default)}
.lb-img img.ld{min-width:min(760px,100vw - 24px);min-height:min(560px,60vh);visibility:hidden}
.lb-load{position:absolute;inset:0;display:grid;place-items:center;color:#dde1e2;font-size:13px;pointer-events:none}
@media (prefers-reduced-motion:reduce){ .live-thumbs img.ld{animation:none} }

/* ---------- Market view (src/area.js) ---------- */
:root{--mk-sf:#006527;--mk-mf:#2a78d6;--mk-part:rgba(0,101,39,.35)}
#view-market{position:absolute}
.mk-kpis{margin:0 0 16px}
.mk-kpis .kpi b{font-size:20px}
.mk-kpis .kpi span{white-space:normal;line-height:1.35;display:block}
.mk-morebtn{margin-top:10px}
.mk-more summary{cursor:var(--cur-pointer,pointer);font-size:11.5px;color:var(--brand);font-weight:600;margin:8px 0 4px}
.mk-sub{font-size:11.5px;color:var(--text-2);margin-top:2px}
.mk-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.mk-box{border:1px solid var(--line);border-radius:6px;padding:12px 14px;min-width:0}
.mk-box h3{margin:0 0 8px;font-size:14px;font-weight:700}
.mk-wide{grid-column:1/-1}
.mk-svg{width:100%;height:auto;display:block;overflow:visible}
.mk-grid line.mk-grid{stroke:var(--line);stroke-width:1}
.mk-ax{font-family:var(--font-mono);font-size:10px;fill:var(--muted)}
path.mk-sf{fill:var(--mk-sf)} path.mk-mf{fill:var(--mk-mf)} path.mk-part{fill:var(--mk-part)}
.mk-hit:hover path{opacity:.82}
.mk-leg{display:flex;gap:14px;font-size:11.5px;color:var(--text-2);margin-bottom:4px}
.mk-leg i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.mk-leg i.mk-sf{background:var(--mk-sf)} .mk-leg i.mk-mf{background:var(--mk-mf)}
.mk-hbars{display:grid;gap:6px}
.mk-hb{display:grid;grid-template-columns:minmax(110px,40%) 1fr auto;gap:8px;align-items:center;font-size:12px}
.mk-hb span{color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-hb i{display:block;height:10px}
.mk-hb i b{display:block;height:100%;background:var(--mk-sf);border-radius:0 3px 3px 0;min-width:2px}
.mk-hb em{font-style:normal;font-family:var(--font-mono);font-size:11px;color:var(--text-2)}
.mk-ctl{margin-bottom:6px}
.mk-box .chitem{text-decoration:none}
.mk-tbl summary{cursor:var(--cur-pointer,pointer);font-size:11.5px;color:var(--brand);font-weight:600;margin:6px 0 4px}
.mk-tbl table{width:100%;border-collapse:collapse;font-size:12px}
.mk-tbl th{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;font-weight:500;border-bottom:1px solid var(--line-2);padding:4px 6px}
.mk-tbl td{border-bottom:1px solid var(--line);padding:4px 6px}
.mk-tbl .r{text-align:right} .mk-tbl .m{font-family:var(--font-mono)}
.mk-box .rnote{margin-top:6px}
.card .bsec .btn + .rnote,.card .bsec .btnrow + .rnote{margin-top:8px}
.mk-box table.who .sc{color:var(--muted);font-size:11px}
.mk-tip{position:absolute;z-index:5;pointer-events:none;opacity:0;background:var(--panel);color:var(--text);border:1px solid var(--line-2);border-radius:6px;padding:6px 9px;font-size:12px;max-width:280px;box-shadow:0 4px 14px rgba(0,0,0,.14);transition:opacity .1s}
@media (max-width:900px){.mk-grid{grid-template-columns:1fr}.mk-kpis{grid-template-columns:repeat(2,1fr)!important}.mk-kpis .kpi:nth-child(odd){border-left:0}.mk-kpis .kpi:last-child:nth-child(odd){grid-column:1/-1}.mk-kpis .kpi:nth-child(n+3){border-top:1px solid var(--line)}}
/* Market tab: Markets table and Correlation explorer (src/markets.js) */
:root{--mx-a:#006527;--mx-b:#c26a00;--mx-up:#0a7a36;--mx-dn:#b3261e}
.mx-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.mx-head h3{margin:0}
.mx-asof{font-size:11.5px;color:var(--muted)}
.mx-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.mx-tabs button{border:1px solid var(--line-2);background:transparent;color:var(--text-2);border-radius:14px;padding:4px 11px;font:500 12px/1.3 var(--font-display);cursor:var(--cur-pointer,pointer)}
.mx-tabs button:hover{border-color:var(--brand)}
.mx-tabs button[aria-selected="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.mx-desc{font-size:12px;color:var(--text-2);margin:2px 0 6px}
.mx-table{width:100%;border-collapse:collapse;font-size:12.5px}
.mx-table th{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;font-weight:500;border-bottom:1px solid var(--line-2);padding:5px 6px}
.mx-table td{border-bottom:1px solid var(--line);padding:6px;vertical-align:middle}
.mx-table .r{text-align:right}.mx-table .m{font-family:var(--font-mono);white-space:nowrap}
.mx-table tbody tr{cursor:var(--cur-pointer,pointer)}.mx-table tbody tr:hover,.mx-table tbody tr:focus-visible{background:var(--panel-2)}.mx-table tbody tr:focus-visible{outline-offset:-2px}
.mx-table td b{display:block;font-weight:600}
.mx-sym{display:block;font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:.04em}
.mx-sp{width:120px}
.mx-spark{width:110px;height:28px;display:block}.mx-spark polyline{fill:none;stroke-width:1.5;vector-effect:non-scaling-stroke}
.mx-spark.up polyline{stroke:var(--mx-up)}.mx-spark.dn polyline{stroke:var(--mx-dn)}
.mx-up{color:var(--mx-up)}.mx-dn{color:var(--mx-dn)}.mx-dim{color:var(--muted)}
.mx-ctl{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-bottom:10px;font-size:12px;color:var(--text-2)}
.mx-ctl label{display:inline-flex;align-items:center;gap:6px;min-width:0}
.mx-ctl select{max-width:280px;padding:5px 8px}
.mx-kg{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line-2);border-radius:6px;overflow:hidden;margin-bottom:10px}
.mx-kg>div{background:var(--panel);padding:8px 10px}
.mx-kg b{display:block;font-family:var(--font-mono);font-size:15px;font-weight:600}
.mx-kg span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.mx-v3{color:var(--mx-up)}.mx-v2{color:var(--brand)}.mx-v1{color:var(--mx-b)}.mx-v0{color:var(--muted)}
.mx-leg{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11.5px;color:var(--text-2);margin-bottom:2px}
.mx-leg i{display:inline-block;width:14px;height:3px;border-radius:2px;margin-right:6px;vertical-align:3px}
.mx-leg i.mx-la{background:var(--mx-a)}.mx-leg i.mx-lb{background:var(--mx-b)}
/* Correlation explorer: controls and verdict on the left, the charts at a fixed readable size on the right */
.mx-wrap{display:grid;grid-template-columns:minmax(230px,290px) minmax(0,720px);gap:14px 22px;align-items:start}
.mx-side .mx-ctl{flex-direction:column;align-items:stretch;gap:10px}
.mx-side .mx-ctl label{display:grid;gap:4px}
.mx-side .mx-ctl label>span{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.mx-side .mx-ctl select{max-width:none;width:100%}
.mx-side .mx-ctl .mk-seg{display:grid;grid-template-columns:1fr 1fr}
.mx-side .mx-kg{grid-template-columns:repeat(2,minmax(0,1fr))}
.mx-side .mx-kg>.mx-kv{grid-column:1/-1}
.mx-side .mx-acts{margin-top:4px}
.mx-chart g.mx-hit line{stroke:var(--text-2);stroke-width:1;stroke-dasharray:2 2;opacity:0}
.mx-chart g.mx-hit:hover line{opacity:.6}
.mx-lags g.mk-hit:hover rect+rect{opacity:.75}
.mx-chart .mk-hit,.mx-lags .mk-hit,.mx-kg .mk-hit,.mk-spark .mk-hit,.mx-spark .mk-hit{cursor:var(--cur-default,default)}
.mk-spark .mk-hit:hover circle,.mx-spark .mk-hit:hover circle{opacity:1}
.mx-how{margin-top:10px}
.mx-how summary{cursor:var(--cur-pointer,pointer);font-size:12px;font-weight:600;color:var(--brand)}
.mx-how .rnote{margin-top:6px}
@media (max-width:980px){ .mx-wrap{grid-template-columns:minmax(0,1fr)} }
.mx-chart,.mx-lags{width:100%;height:auto;display:block;overflow:visible}
.mx-chart polyline{fill:none;stroke-width:1.8;stroke-linejoin:round}
.mx-chart polyline.mx-la{stroke:var(--mx-a)}.mx-chart polyline.mx-lb{stroke:var(--mx-b);stroke-dasharray:5 3}
.mx-zero{stroke:var(--line-2);stroke-width:1}
.mx-ax{font-family:var(--font-mono);font-size:10px;fill:var(--muted)}
.mx-lags rect.pos{fill:var(--green-300)}.mx-lags rect.neg{fill:var(--ink-300)}.mx-lags rect.on{fill:var(--mx-a)}
.mx-sub{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:10px 0 4px}
.mx-say{font-size:13px;line-height:1.5;margin:10px 0 0;color:var(--text)}
.mx-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.mx-scan{margin-top:10px;display:grid;gap:4px}
.mx-row{display:grid;grid-template-columns:minmax(120px,1.4fr) 70px minmax(120px,1.6fr) 100px;gap:10px;align-items:center;text-align:left;border:1px solid var(--line);background:transparent;color:var(--text);border-radius:6px;padding:7px 10px;font:12.5px/1.3 var(--font-display);cursor:var(--cur-pointer,pointer)}
.mx-row:hover{border-color:var(--brand);background:var(--panel-2)}
.mx-row .m{font-family:var(--font-mono);font-size:11.5px}.mx-row span{color:var(--text-2)}.mx-row em{font-style:normal;font-weight:600;text-align:right}
@media (max-width:700px){.mx-sp{display:none}.mx-kg{grid-template-columns:repeat(2,minmax(0,1fr))}.mx-kg>div:last-child{grid-column:1/-1}.mx-ctl label{flex:1 1 100%}.mx-ctl select{max-width:none;flex:1;min-width:0}.mx-row{grid-template-columns:1fr auto;gap:2px 10px}.mx-row span:not(.m){grid-column:1}.mx-row em{grid-row:1;grid-column:2}}

/* Ask AI: keyboard hint, suggested questions above it; with a card open it sits just left of the card */
.fab-sugs{position:absolute;right:var(--fabr,16px);bottom:90px;z-index:4;display:flex;flex-direction:column;align-items:flex-end;gap:6px;max-width:min(330px,calc(100% - var(--fabr,16px) - 24px));pointer-events:none}
.fab-sugs:empty{display:none}
.fab-sugs button{pointer-events:auto;max-width:100%;text-align:left;border:1px solid var(--line-2);background:var(--panel);color:var(--brand);border-radius:16px;padding:6px 12px;font:600 12.5px/1.3 var(--font-display);cursor:var(--cur-pointer,pointer);box-shadow:0 2px 8px rgba(11,13,12,.12);transition:border-color 120ms,background 120ms}
.fab-sugs button:hover{border-color:var(--brand);background:var(--panel-2)}
.app.ai-open .fab-sugs,.stage:not([data-view="map"]) .fab-sugs{display:none}
/* only while the pointer is on Ask AI (or keyboard focus is on it or a pill), so they never sit on top of the Layers panel.
   Hiding waits a moment, so the pointer can travel from the button up to a pill. Touch screens get them inside the assistant instead. */
.fab-sugs{opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity 140ms ease,transform 140ms ease,visibility 0s linear 350ms}
.fab-sugs:hover,.fab-sugs:focus-within,.stage:has(.ai-fab:hover) .fab-sugs,.stage:has(.ai-fab:focus-visible) .fab-sugs{opacity:1;visibility:visible;transform:none;transition-delay:0s}
@media (hover:none){ .fab-sugs{display:none} }
/* the Layers panel stops above the Ask AI button instead of running under it (it scrolls inside) */
@media (min-width:701px){ .app:not(.ai-open) .layers{max-height:calc(100% - 112px)} }
@media (max-width:1100px) and (min-width:701px){ .app:has(.card.open){--fabr:calc(min(400px,100% - 78px) + 78px)} }
@media (max-width:700px){ .fab-sugs{display:none} }
/* tablets: the card sits just left of the map buttons (desktop docks it at the edge: "property card dock" below) */
@media (max-width:1100px) and (min-width:701px){
  .app:not(.ai-open) .card{right:66px;width:min(400px,calc(100% - 78px))}
  .app:not(.ai-open):has(.card.open) .layers{right:var(--fabr,16px)}
}

/* collapsible Filters and List sections */
.sechead{display:flex;align-items:center;gap:8px;width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;padding:12px 24px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);cursor:var(--cur-pointer,pointer);text-align:left}
.sechead:hover{color:var(--text)}
.sechead .chev{flex:none;transition:transform 150ms}
.sechead[aria-expanded="false"] .chev{transform:rotate(-90deg)}
.sechead em{font-style:normal;color:var(--brand);margin-left:auto;letter-spacing:.06em}
.filters.collapsed,.list.collapsed{display:none}
input.chip.num{width:96px;padding:5px 8px;background:transparent;font-family:var(--font-mono);font-size:12px}
.search.sm{flex:1;min-width:160px}
@media (max-width:760px){.sechead{padding-left:18px;padding-right:18px}}

/* searched-place pin */
.ppin{display:flex;flex-direction:column;align-items:center;pointer-events:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
.ppin span{order:-1;margin-bottom:3px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:var(--panel);color:var(--text);border:1px solid #d48806;border-radius:4px;padding:2px 7px;font-size:12px;font-weight:600}
.ppin span:empty{display:none}
/* area summary card */
.acm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin:12px 0}
.acm div{background:var(--panel);padding:9px 10px;min-width:0}
.acm b{display:block;font-family:var(--font-mono);font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acm span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.acu{display:grid;grid-template-columns:minmax(0,1fr) 80px auto;align-items:center;gap:8px;font-size:12.5px;padding:3px 0}
.acu span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acu i{display:block;height:6px;border-radius:3px;background:var(--brand);justify-self:start}
.acu b{font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--text-2)}
.acp{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;width:100%;text-align:left;background:transparent;border:0;border-top:1px solid var(--line);padding:8px 0;cursor:var(--cur-pointer,pointer);color:var(--text)}
.acp:hover b{color:var(--brand)}
.acp b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acp span{grid-column:1;font-size:11.5px;color:var(--muted)}
.acp em{grid-row:1/3;grid-column:2;align-self:center;font-style:normal;font-family:var(--font-mono);font-size:12px}

/* ================= assistant: resizable drawer, formatted replies, cards in the chat ================= */
.ai-resize{position:absolute;top:14px;bottom:14px;left:-5px;width:10px;z-index:2;cursor:var(--cur-resize,col-resize);touch-action:none;outline:none}
.ai-resize::after{content:"";position:absolute;top:50%;left:3px;width:4px;height:44px;margin-top:-22px;border-radius:2px;background:var(--line-2);opacity:0;transition:opacity 120ms,background 120ms}
.ai:hover .ai-resize::after{opacity:1}
.ai-resize:hover::after,.ai-resize:focus-visible::after,.app.airesizing .ai-resize::after{opacity:1;background:var(--green-700)}
.app.airesizing{cursor:var(--cur-resize,col-resize);user-select:none}
.app.airesizing .ai{transition:none}
.app.airesizing #map{pointer-events:none}
@media (max-width:700px){ .ai-resize{display:none} }
.ai-m ol,.ai-m ul{margin:2px 0 8px;padding-left:22px}
.ai-m li{margin:2px 0;padding-left:2px}
.ai-m li::marker{color:var(--muted);font-family:var(--font-mono);font-size:12px}
.ai-m p.lead{font-weight:700;margin:8px 0 2px}
.ai-m.ccard{align-self:stretch;max-width:100%}
.cc{border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:12px 14px;display:grid;gap:10px;font-size:13px;box-shadow:0 1px 0 rgba(11,13,12,.03)}
.cc-h{display:grid;gap:1px;min-width:0}
.cc-k{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--brand)}
.cc-h b{font-size:15px;font-weight:800;letter-spacing:-.01em;overflow-wrap:anywhere}
.cc-h em{font-style:normal;color:var(--muted);font-size:12px}
.cc-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--line);border-radius:6px;overflow:hidden}
.cc-tiles.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cc-tiles div{background:var(--panel);padding:8px 10px;min-width:0;box-shadow:1px 0 0 var(--line),0 1px 0 var(--line)}
.cc-tiles b{display:block;font-family:var(--font-mono);font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-tiles span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-s{display:grid;gap:6px}
.cc-l{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cc-hbars{display:grid;gap:5px}
.cc-hb{display:grid;grid-template-columns:minmax(0,38%) minmax(0,1fr) auto;align-items:center;gap:8px;font-size:12.5px}
.cc-hb span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-hb i{display:block;height:8px;background:var(--panel-2);border-radius:4px;overflow:hidden}
.cc-hb s{display:block;height:100%;background:var(--brand);border-radius:4px;text-decoration:none}
.cc-hb b{font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--text-2);white-space:nowrap}
.cc-vb{border-bottom:1px solid var(--line-2);position:relative;padding-bottom:18px}
.cc-chart{width:100%;display:block;overflow:visible}
.cc-chart rect{fill:var(--brand)}.cc-chart rect:hover{fill:var(--green-600)}
.cc-chart .cc-ln{fill:none;stroke:var(--brand);stroke-width:2}
.cc-chart .cc-hit{fill:transparent}.cc-chart .cc-hit:hover{fill:rgba(0,101,39,.08)}
.cc-ax{position:absolute;left:0;right:0;bottom:0;height:16px}
.cc-ax span{position:absolute;transform:translateX(-50%);font-family:var(--font-mono);font-size:10px;color:var(--muted);white-space:nowrap}
.cc-vb{border-bottom:0}.cc-vb svg{border-bottom:1px solid var(--line-2)}
.cc-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;text-align:left;background:transparent;border:0;border-top:1px solid var(--line);padding:7px 0;cursor:var(--cur-pointer,pointer);color:var(--text)}
.cc-row:hover b{color:var(--brand)}
.cc-row span{display:grid;min-width:0}
.cc-row b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-row em{font-style:normal;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-row i{font-style:normal;font-family:var(--font-mono);font-size:12px}
.cc-ol{margin:0;padding-left:20px}.cc-ol li::marker{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.cc-dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 12px;margin:0;font-size:12.5px}
.cc-dl dt{color:var(--muted);font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding-top:2px}
.cc-dl dd{margin:0;overflow-wrap:anywhere}
.cc-p{margin:0;font-size:12.5px;color:var(--text-2)}
.cc-a{display:flex;flex-wrap:wrap;gap:6px}
.cc-a .btn{font-size:12px;padding:6px 10px}
.cc-tags{display:flex;flex-wrap:wrap;gap:5px}
.cc-tags span{border:1px solid var(--line);border-radius:4px;padding:2px 7px;font-size:12px}
.cc-tags em{font-style:normal;color:var(--muted);font-size:11px}
.cc-tbl summary{cursor:var(--cur-pointer,pointer);font-size:12px;color:var(--brand);font-weight:600}
.cc-tbl table{width:100%;border-collapse:collapse;margin-top:6px;font-size:12px}
.cc-tbl th{text-align:left;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500;border-bottom:1px solid var(--line);padding:4px 6px 4px 0}
.cc-tbl td{border-bottom:1px solid var(--line);padding:4px 6px 4px 0;font-variant-numeric:tabular-nums}
.cc-live .live-big{font-size:20px}
.cc-live .chitem{display:block;padding:6px 0;border-top:1px solid var(--line)}
.ms-none.sm{padding:6px 14px;font-size:12px}

/* ================= Reports tab ================= */
.rp-sec{margin:18px 0 6px}
.rp-sec>.lt,.rp-sh .lt{margin-bottom:10px}
.rp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.rp-card{border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;gap:6px;align-content:start;background:var(--panel)}
.rp-card b{font-size:15px;font-weight:800}
.rp-card p{margin:0;color:var(--text-2);font-size:12.5px;line-height:1.45}
.rp-card em{font-style:normal;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.rp-fmts{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.rp-fmts .btn{font-size:12px;padding:6px 10px}
.rp-sh{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.rp-sh .lt{margin-bottom:0}
.rp-list{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.rp-list .empty{padding:22px;color:var(--muted);font-size:13px}
.rp-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-top:1px solid var(--line)}
.rp-row:first-child{border-top:0}
.rp-ic{display:grid;place-items:center;height:44px;border-radius:8px;background:var(--panel-2);border:1px solid var(--line);font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text-2)}
.rp-ic.rp-pdf{color:var(--danger);background:color-mix(in srgb,var(--danger) 8%,transparent)}.rp-ic.rp-xlsx,.rp-ic.rp-csv{color:var(--brand);background:rgba(0,101,39,.07)}
.rp-m{display:grid;gap:1px;min-width:0}
.rp-m b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-m span{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.rp-m em{font-style:normal;font-size:12px;color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-m i{font-style:normal;font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-act{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.rp-act .btn{font-size:12px;padding:6px 10px}
.rp-soon p{margin:0;color:var(--muted);font-size:12.5px}
@media (max-width:700px){ .rp-row{grid-template-columns:40px minmax(0,1fr)} .rp-act{grid-column:1/-1;justify-content:flex-start} }


/* map legends: Filings and the demographics (census tract) legend side by side at the bottom left, clear of the
   Ask AI button and its suggestions on the right; the demographics one wraps above when there isn't room */
.legends{position:absolute;left:16px;bottom:28px;z-index:3;display:flex;flex-wrap:wrap-reverse;align-items:flex-end;gap:8px;max-width:calc(100% - var(--fabr,16px) - 420px);pointer-events:none}
.legends>*{pointer-events:auto}
.legends .legend,.legends .dlegend{position:static;left:auto;right:auto;bottom:auto}
/* the time slider sits bottom centre: lift the legends above it while it's showing */
.stage:has(.tslider.show) .legends{bottom:76px}
.cc-src,.cc-live .rnote.src{font-size:10.5px;color:var(--muted);border-top:1px solid var(--line);padding-top:6px;margin-top:2px}

/* ================= left panel: roomier filters (label above its options, bigger targets, grouped More Filters) ================= */
@media (min-width:701px){
  .filters{padding:20px 24px 22px;gap:20px}
  .filters .row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  .filters .lbl{flex:0 0 100%;width:auto;padding:0;margin-bottom:0;font-size:10.5px}
  .filters .chip{min-height:34px;padding:7px 12px;font-size:13px;border-radius:7px}
  .filters .chip .n{margin-left:2px}
  .filters select.chip{min-height:36px;padding:7px 30px 7px 12px}
  .filters .row .to{padding:0 2px}
  /* paired inputs (value, sq ft, months) share the row evenly */
  .filters .row>select.chip,.filters input.chip.num,.filters input.chip.mon{flex:1 1 0;min-width:0;width:auto}
  .filters #dField{flex:1 1 100%}
  .filters .search{flex:1 1 100%;min-height:38px}
  .filters .search.sm input{width:100%;padding:9px 0;font-size:13px}
  .filters #exactBtn{flex:0 0 auto}
  .filters .more{border:0;border-top:1px solid var(--line);border-radius:0;padding:16px 0 0;margin:0}
  .filters .more[open]{gap:18px}
  .filters .more summary{font-size:13px;color:var(--text)}
  .filters .fgroup{font-size:11.5px;font-weight:700;color:var(--text);letter-spacing:.01em;padding-top:6px;border-top:1px dashed var(--line);margin-top:2px}
  .filters .more summary+.fgroup{border-top:0;padding-top:0}
  .filters .active{padding:10px 12px;background:var(--panel-2);border-radius:8px;font-size:12px;line-height:1.45}
}
@media (min-width:701px){
  .filters .more>.row{margin-top:16px}
  .filters .more>.fgroup{margin-top:26px;padding-top:16px}
  .filters .more>summary+.fgroup{margin-top:14px;padding-top:0}
  .filters .more>.fgroup+.row{margin-top:10px}
}
/* 7-day forecast (chat card) */
.fc{display:grid}
.fc-r{display:grid;grid-template-columns:88px minmax(0,1fr) auto;column-gap:10px;row-gap:5px;align-items:center;padding:8px 0;border-top:1px solid var(--line);font-size:12.5px}
.fc-t{grid-column:1/3}
.fc-r:first-child{border-top:0}
.fc-r b{font-weight:700;white-space:nowrap}
.fc-c{color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc-p{font-family:var(--font-mono);font-size:11px;color:#2f6fbf;white-space:nowrap}
.fc-t{display:grid;grid-template-columns:28px 1fr 28px;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11.5px}
.fc-t i{font-style:normal}.fc-t i:last-child{text-align:right;font-weight:600}
.fc-t s{position:relative;height:6px;border-radius:3px;background:var(--panel-2);text-decoration:none}
.fc-t u{position:absolute;top:0;bottom:0;border-radius:3px;background:linear-gradient(90deg,#3987e5,#f0b429,#e0663a)}
.fc-w{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);white-space:nowrap}


/* ================= phone spacing pass (≤700px) ================= */
@media (max-width:700px){
  /* map buttons: separate, evenly spaced 40px buttons on both sides instead of one joined strip */
  .mapleft{top:calc(108px + var(--st));gap:10px}
  .mapleft .tools{flex-direction:column;gap:8px;background:transparent;border:0;box-shadow:none;overflow:visible}
  .mapleft .tools button,.mapleft .tools button+button{width:42px;height:42px;border:1px solid var(--line-2);border-radius:10px;background:var(--panel);box-shadow:0 1px 3px rgba(11,13,12,.12)}
  .mapleft .tools button[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
  .ctrls{top:calc(108px + var(--st));right:12px;gap:8px}
  .ctrls button{width:42px;height:42px;border-radius:10px;box-shadow:0 1px 3px rgba(11,13,12,.12)}
  .mcount{margin-top:6px}
  /* the Layers panel sits over the map tools, not under them */
  .layers{top:calc(108px + var(--st));left:12px;right:64px;z-index:8;padding:16px 16px 18px;gap:12px;border-radius:12px}
  .layers .tg2{padding:5px 0}
  /* list tab: each filter's label above its options, roomier sections, 2-column headline numbers */
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .kpis>.kpi:last-of-type:nth-of-type(odd){grid-column:1/-1}
  .layers .lt{margin-top:18px}
  .layers>.lt:first-child{margin-top:0}
  .kpi{padding:12px 14px}
  .filters{padding-top:6px;padding-bottom:10px}
  .filters .row{flex-wrap:wrap;gap:8px;margin-bottom:14px}
  .filters .row>.lbl{flex:1 0 100%;width:auto;margin:0 0 2px;padding:0}
  .filters .row .chip{min-height:38px}
  .item{padding:13px 12px}
  /* cards: more breathing room between fields, sections and buttons */
  .card .top{padding:18px 20px 12px}
  .card dl{padding:14px 20px;gap:9px 14px}
  .card .scope,.card .brief{padding-left:20px;padding-right:20px;margin-left:0;margin-right:0}
  .card .bsec{margin:4px 20px 18px}
  .card .bacts{padding:12px 20px 4px;gap:8px}
  .card .btnrow{gap:8px}
  .card .go{margin:4px 20px 20px}
  .card .note{margin:0 20px 16px}
  /* assistant: one-line placeholder, room above the input */
  .ai-f textarea::placeholder{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ai-log{padding-bottom:12px}
  /* tab views */
  .view{padding:18px 18px 28px}
  .vhead{margin-bottom:18px}
  .vctl{gap:10px 14px}
  #view-who .seg button,.seg.seg3 button{padding:9px 12px}
  #view-who table.who th:nth-child(4),#view-who table.who td:nth-child(4){display:none}
  #view-who table.who td,#view-who table.who th{padding-top:12px;padding-bottom:12px}
  .msheet button{padding:16px 14px}
}

/* "Route · 12 mi · 18 min ×" chip: clears the drive route */
.route-chip{position:absolute;white-space:nowrap;left:50%;bottom:24px;transform:translateX(-50%);z-index:5;display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line-2);background:var(--panel);color:var(--text);border-radius:20px;padding:8px 10px 8px 14px;font:600 13px var(--font-display);box-shadow:0 4px 14px rgba(11,13,12,.18);cursor:var(--cur-pointer,pointer)}
.route-chip b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--chip);font-size:15px;line-height:1}
.route-chip:hover b{background:var(--line-2)}
.route-chip .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.route-chip[hidden],.stage:not([data-view="map"]) .route-chip{display:none}
.route-chip span{white-space:nowrap}
@media (max-width:700px){ .route-chip{top:calc(108px + var(--st));bottom:auto;max-width:calc(100% - 140px);font-size:12.5px;padding:7px 8px 7px 12px;gap:8px} .route-chip span{overflow:hidden;text-overflow:ellipsis} .route-chip b{flex:none} }
/* Regrid: a saved parcel record that Regrid has since refreshed */
.rg-stale{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0 2px;padding:8px 10px;border-radius:6px;border:1px solid rgba(183,121,31,.45);background:rgba(183,121,31,.08);font-size:12px;color:var(--text-2)}
.rg-stale span{flex:1;min-width:180px}

/* data sources: hidden on cards and panels unless "Show sources" is on (Data Sources view); reports always list them */
:root[data-sources="off"] .src{display:none}
.src-opt{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:4px 0 14px;font-size:13px;cursor:var(--cur-pointer,pointer)}
.src-opt .s{flex-basis:100%;font-size:12px;color:var(--muted);margin-left:24px}
.card #bSite dd .risk-hi{color:#c03b3a}
.card #bSite dd .risk-md{color:#b7791f}
.card #bSite dd .src{font-size:11px;color:var(--muted)}
.mk-rates{width:100%;border-collapse:collapse;font-size:12.5px}
.mk-rates th{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;font-weight:600;padding:4px 6px}
.mk-rates td{padding:5px 6px;border-top:1px solid var(--line);white-space:nowrap}
.mk-rates td:first-child{white-space:normal}
.mk-rates .r{text-align:right}
@media (max-width:700px){.mk-rates{font-size:11.5px}.mk-rates th,.mk-rates td{padding:4px 3px}}
.mk-spark{color:var(--brand);vertical-align:middle}
.mk-box .mk-kg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.mk-box .mk-kg b{display:block;font-family:var(--font-mono);font-size:14px}
.mk-box .mk-kg span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
/* air traffic chat card */
.cc-plane{grid-template-columns:minmax(0,1fr) auto;row-gap:6px;cursor:var(--cur-default,default)}
.cc-plane .cc-rt{display:inline;font-style:normal;font-family:var(--font-mono);font-size:11px;color:var(--brand);font-weight:600;margin-left:6px}
.cc-plane .cc-pa{grid-column:1/-1;display:flex;gap:6px}
.cc-plane .cc-pa .btn{font-size:11.5px;padding:4px 10px}
/* crime report card */
.card .cr-v{color:#c03b3a}.card .cr-p{color:#d9822b}
.card .cr-bars{display:block;width:100%;height:auto;color:var(--muted);margin-top:4px}
.card .cu-ag{display:flex;flex-direction:column;gap:1px;margin:2px 0 8px}.card .cu-ag span{font-size:11px;color:var(--muted)}
.card .cu-tbl{width:100%;border-collapse:collapse;font-size:12px;margin-top:8px}.card .cu-tbl th{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500;text-align:right;padding:4px 6px;border-bottom:1px solid var(--line)}.card .cu-tbl td{font-family:var(--font-mono);text-align:right;padding:4px 6px;border-bottom:1px solid var(--line)}.card .cu-tbl th:first-child,.card .cu-tbl td:first-child{text-align:left}.card .cu-tbl td:nth-child(3),.card .cu-tbl td:nth-child(5){color:var(--muted)}
.card .cu-oth{display:flex;flex-direction:column;gap:4px;margin-top:8px}.card .cu-oth select{max-width:100%}
.card .cr-leg{display:flex;flex-wrap:wrap;gap:12px;font-size:11px;color:var(--muted);margin-top:4px}.card .cr-leg i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:4px;vertical-align:-1px}
#lyCrimeCat{margin:2px 0 4px 26px}#lyCrimeNote{margin:0 0 6px 26px;font-size:11px}

/* property-first panel: Area at a Glance, then a collapsible Construction Filings section */
.glance{padding:16px 24px 18px;border-bottom:1px solid var(--line)}
.glance:empty{display:none}
.glance .g-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.glance .g-h em{font-style:normal;font-size:13px;font-weight:600;color:var(--text)}
.glance .g-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:6px;overflow:hidden}
.glance .g-t{padding:10px 12px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-width:0}
.glance .g-t:nth-child(3n){border-right:0}
.glance .g-t:nth-last-child(-n+3){border-bottom:0}
.glance .g-t b{display:block;font-family:var(--font-mono);font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glance .g-t>span{display:block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:2px}
.glance .g-t i{display:block;font-style:normal;font-size:11px;color:var(--muted);margin-top:4px;line-height:1.35}
.glance .g-t i .up{color:var(--brand);font-weight:600}
.glance .g-t i .dn{color:#c03b3a;font-weight:600}
.glance .g-n{margin:0;font-size:13px;color:var(--muted);line-height:1.5}
.glance .g-s{font-size:11px;color:var(--muted);margin-top:8px;line-height:1.4}
.fbody.collapsed{display:none}
.fbody .fhead{padding:4px 24px 18px;border-bottom:1px solid var(--line)}
.fbody .fhead .kpiwrap{margin-top:8px}
@media (max-width:420px){ .glance .g-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .glance .g-t:nth-child(3n){border-right:1px solid var(--line)} .glance .g-t:nth-child(2n){border-right:0} .glance .g-t:nth-last-child(-n+3){border-bottom:1px solid var(--line)} .glance .g-t:nth-last-child(-n+2){border-bottom:0} }
:root[data-filings="off"] .legend:not(.heat),:root[data-filings="off"] .mcount{display:none}
/* FEMA report */
.card .fm-bar{display:flex;height:14px;border-radius:3px;overflow:hidden;background:var(--line);margin-top:4px}.card .fm-bar i{display:block;height:100%}
.card .fm-leg{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11px;color:var(--muted);margin-top:6px}.card .fm-leg i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:4px;vertical-align:-1px}.card .fm-leg b{color:var(--ink,inherit)}
#lyFemaNote{margin:0 0 6px 26px;font-size:11px}

/* ===== cards: the "report with section cards" style (option B, 2026-10-03) =====
   a white header with section chips, then one titled card per section on a light ground; labels sit beside values in
   rows that wrap, or above them in two-column grids; each section names its own source */
#card{background:var(--panel-2);padding-bottom:14px}
#card .top{flex-wrap:wrap;align-items:flex-start;padding:18px 20px 12px;background:var(--panel);border-bottom:1px solid var(--line)}
#card .top>div:first-child{flex:1;min-width:0}
#card .top h2{font-size:20px;margin-top:4px;overflow-wrap:anywhere}
#card .bsub{font-family:var(--font-display);font-size:13px;color:var(--text-2);margin-top:4px}
#card .bnav{flex-basis:100%;display:flex;flex-wrap:nowrap;gap:6px;margin:6px -20px 0 0;padding-right:20px;overflow-x:auto;scrollbar-width:none}
#card .bnav::-webkit-scrollbar{display:none}
#card .bnav button{flex:none}
#card .bnav button{border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:6px 11px;font:600 12px var(--font-display);color:var(--text-2);cursor:var(--cur-pointer,pointer);min-height:30px}
#card .bnav button:hover{border-color:var(--text-2);color:var(--text)}
#card .bnav button[aria-current="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
#card .bnav button[hidden]{display:none}
#card .bsec,#card .hist,#card .brief,#card .bover{background:var(--panel);border:1px solid var(--line-2);border-radius:6px;margin:12px 14px 0;padding:14px 16px;display:flex;flex-direction:column;gap:10px;font-size:13px;color:var(--text)}
#card .bsec:empty,#card .bover:empty,#card .bsec[hidden],#card .bover[hidden]{display:none}
#card .bover{background:var(--ink-900);border-color:var(--ink-900);color:#fff;font-size:13.5px;line-height:1.55}
#card .bover .kicker{color:var(--green-300)}
#card .bover b{font-weight:700}
#card .lt{display:flex;align-items:center;gap:10px;margin:0;font:700 14px/1.3 var(--font-display);letter-spacing:0;text-transform:none;color:var(--text)}
#card .lt::before{content:"";width:28px;height:28px;flex:none;border-radius:6px;background:rgba(0,101,39,.09) var(--ic) center/15px no-repeat}
#card .lt .src{font:500 11px var(--font-display);color:var(--muted);margin-left:auto;text-align:right}
#card .bsec .lt ~ .lt{margin-top:6px}
#card{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='10' height='10' rx='2'/%3E%3C/svg%3E")}
#card #bParcel{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5v13M11.2 4.3c-.6-1-1.8-1.6-3.2-1.6-1.8 0-3.1.9-3.1 2.3 0 3.3 6.5 1.8 6.5 5.2 0 1.4-1.4 2.4-3.4 2.4-1.5 0-2.8-.6-3.4-1.7'/%3E%3C/svg%3E")}
#card #bSize{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 14.5V3l6-1.5v13M9 6h4v8.5M1.5 14.5h13M5 5.5h2M5 8.5h2M5 11.5h2'/%3E%3C/svg%3E")}
#card #bSite{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 14.5s5-4.3 5-8.2A5 5 0 0 0 3 6.3c0 3.9 5 8.2 5 8.2z'/%3E%3Ccircle cx='8' cy='6.3' r='1.8'/%3E%3C/svg%3E")}
#card #bArea{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5.5' cy='5' r='2.2'/%3E%3Ccircle cx='11' cy='6' r='1.8'/%3E%3Cpath d='M1.5 13.5c.4-2.4 2-3.8 4-3.8s3.6 1.4 4 3.8M10 9.6c1.9-.2 3.6.9 4.2 3.4'/%3E%3C/svg%3E")}
#card #bPlaces,#card #bTenants,#card #tenSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 6.5 3.2 2.5h9.6L14 6.5M2 6.5h12M2 6.5v8h12v-8M6 14.5v-4h4v4'/%3E%3C/svg%3E")}
#card #airSec,#card .pl-sec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5c.7 0 1 .8 1 1.6v3.3l5 2.8v1.4l-5-1.4v2.9l1.5 1.1v1.1L8 13.6l-2.5.7v-1.1L7 12.1V9.2L2 10.6V9.2l5-2.8V3.1c0-.8.3-1.6 1-1.6z'/%3E%3C/svg%3E")}
#card #bFilings,#card #fNear{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 14.5h11M4 14.5V8l4-3 4 3v6.5M8 5V1.5M6.5 11h3'/%3E%3C/svg%3E")}
#card #bRegrid{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 2h12v12H2zM2 6.5h12M2 10.5h12M6.5 2v12M10.5 2v12'/%3E%3C/svg%3E")}
#card #liveSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='4' cy='12' r='1.8'/%3E%3Ccircle cx='12' cy='4' r='1.8'/%3E%3Cpath d='M5.8 12H10a2 2 0 0 0 0-4H6a2 2 0 0 1 0-4h4.2'/%3E%3C/svg%3E")}
#card #bTools,#card #fTools{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 2a3 3 0 0 0-2.8 4L2.5 11.2a1.4 1.4 0 0 0 2 2L9.7 8a3 3 0 0 0 4-2.8l-1.8 1.1-1.6-.9V3.6L12 2.5A3 3 0 0 0 10.5 2z'/%3E%3C/svg%3E")}
#card #briefBox{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5 9.4 6.6 14.5 8l-5.1 1.4L8 14.5 6.6 9.4 1.5 8l5.1-1.4z'/%3E%3C/svg%3E")}
#card #card .hist{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='6.3'/%3E%3Cpath d='M8 4.5V8l2.4 1.6'/%3E%3C/svg%3E")}
#card #fProj,#card #fScope{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 1.5h5.5L12.5 4.5v10H4zM9.5 1.5v3h3M6 8h4.5M6 11h4.5'/%3E%3C/svg%3E")}
#card #fSched{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 3.5h11v10h-11zM2.5 6.5h11M5.5 1.5v3M10.5 1.5v3'/%3E%3C/svg%3E")}
#card #fPeople{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='5' r='2.6'/%3E%3Cpath d='M2.8 14c.5-3 2.5-4.6 5.2-4.6s4.7 1.6 5.2 4.6'/%3E%3C/svg%3E")}
#card #card .cr-sec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5 13.5 3.5v4.2c0 3.3-2.3 5.7-5.5 6.8-3.2-1.1-5.5-3.5-5.5-6.8V3.5z'/%3E%3C/svg%3E")}
#card dl{display:grid;grid-template-columns:fit-content(48%) minmax(0,1fr);gap:0;margin:0;padding:0;font-size:13px}
#card dt,#card dd{padding:8px 0;border-top:1px solid var(--line)}
#card dl>dt:first-of-type,#card dl>dt:first-of-type+dd{border-top:0;padding-top:2px}
#card dt{font:400 13px/1.35 var(--font-display);letter-spacing:0;text-transform:none;color:var(--text-2);padding-right:14px}
#card dd{text-align:right;font-weight:600;line-height:1.35;overflow-wrap:anywhere;color:var(--text)}
#card dd .sc,#card dd .src{display:block;font-weight:400;font-size:11.5px;color:var(--muted);margin-top:2px}
#card dl.bsize{margin:0}
#card .raw dl{font-size:12px;margin-top:6px}#card .raw dt,#card .raw dd{padding:5px 0;font-size:12px}
#card .fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
#card .fgrid .f{display:flex;flex-direction:column;gap:3px;min-width:0}
#card .fgrid .f.w{grid-column:1/-1}
#card .fl,.cc-live .fl{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
#card .fv{font-size:13.5px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
#card .fv.dim{color:var(--muted);font-weight:500}
#card .fs{font-size:11.5px;color:var(--muted);line-height:1.4}
#card .kgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line-2);border-radius:6px;overflow:hidden}
#card .kgrid>div{background:var(--panel);padding:10px 12px;display:flex;flex-direction:column;gap:3px;min-width:0}
#card .kgrid b{font-family:var(--font-mono);font-size:15px;font-weight:600}
#card .kgrid span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);line-height:1.35}
#card .msum{margin:12px 14px 0}
#card .bacts,#card .btnrow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0;margin:0}
#card>.bacts{margin:12px 14px 0}
#card .bacts .btn,#card .btnrow .btn,#card .bsec>.btn{min-height:40px;justify-content:center;text-align:center;width:100%;box-sizing:border-box}
#card .bacts .btn.primary,#card .btn.askai{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
#card .ssrc{font-size:10.5px;color:var(--muted);line-height:1.4;border-top:1px solid var(--line);padding-top:8px}
#card .rnote{font-size:12px;line-height:1.45}
#card .pl,#card .chitem{padding:8px 0;border-bottom:0;border-top:1px solid var(--line)}
#card .pl:first-of-type,#card .lt+.chitem,#card .lt+.pl{border-top:0}
#card .chitem{display:flex;justify-content:space-between;gap:12px;width:100%;background:none;border-left:0;border-right:0;border-bottom:0;text-align:left;cursor:var(--cur-pointer,pointer);font:inherit;color:inherit}
#card .chitem b{font-weight:600}#card .chitem em{display:block;font-style:normal;font-size:11.5px;color:var(--muted);margin-top:2px}
#card .chitem .m{font-family:var(--font-mono);font-weight:600;white-space:nowrap}
#card .bphoto{margin:0}
#card .scope{padding:0;font-size:13px;line-height:1.55}
#card .note{margin:12px 14px 0;border-radius:6px;border:1px solid rgba(183,121,31,.4);border-left:3px solid var(--c-heb);background:rgba(183,121,31,.07);padding:10px 12px;font-size:12.5px;line-height:1.45}
#card .go{margin:0;border-radius:6px;min-height:40px;box-sizing:border-box}
#card .hist>div:not(.lt){font-size:12.5px;color:var(--text-2)}
#card .bsrc{margin:10px 18px 0;font-size:10.5px;color:var(--muted);line-height:1.4}
#card .bsrc:empty{display:none}
#card>dl,#card>.scope,#card>.btext{margin:12px 14px 0;background:var(--panel);border:1px solid var(--line-2);border-radius:6px;padding:12px 16px}
#card .live-out:empty{display:none}
@media (max-width:700px){ #card .top{padding:6px 16px 10px} #card .bsec,#card .hist,#card .brief,#card .bover{margin:10px 10px 0} #card .bnav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px} #card .bnav button{flex:none} }
#card .fhist{border-top:1px solid var(--line);padding-top:8px;display:grid;gap:4px;font-size:12.5px;color:var(--text-2)}
#card .fhist .m{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-right:4px}
#card .btext{font-size:13px;line-height:1.55;color:var(--text-2)}#card .btext p:first-child{margin-top:0}#card .btext p:last-child{margin-bottom:0}
#card #plAc{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5c.7 0 1 .8 1 1.6v3.3l5 2.8v1.4l-5-1.4v2.9l1.5 1.1v1.1L8 13.6l-2.5.7v-1.1L7 12.1V9.2L2 10.6V9.2l5-2.8V3.1c0-.8.3-1.6 1-1.6z'/%3E%3C/svg%3E")}
#card #plReg{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 1.5h5.5L12.5 4.5v10H4zM9.5 1.5v3h3M6 8h4.5M6 11h4.5'/%3E%3C/svg%3E")}
#card #plFa{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='4' cy='12' r='1.8'/%3E%3Ccircle cx='12' cy='4' r='1.8'/%3E%3Cpath d='M5.8 12H10a2 2 0 0 0 0-4H6a2 2 0 0 1 0-4h4.2'/%3E%3C/svg%3E")}
#card #plTools{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 2a3 3 0 0 0-2.8 4L2.5 11.2a1.4 1.4 0 0 0 2 2L9.7 8a3 3 0 0 0 4-2.8l-1.8 1.1-1.6-.9V3.6L12 2.5A3 3 0 0 0 10.5 2z'/%3E%3C/svg%3E")}
#card dd a,#card .fv a{color:var(--brand)}

/* ===== tabs and the left panel in the same section-card style ===== */
.view{background:var(--panel-2)}
#view-timeline{background:var(--panel)}
.view .rp-sec,.view .chsec,.view .fcols>section,.view .mk-box,.view .src-grp,.view .tablewrap,.view .cmp-empty{background:var(--panel);border:1px solid var(--line-2);border-radius:6px;padding:14px 16px;min-width:0}
.view .cmp-card{background:var(--panel);border-color:var(--line-2);border-radius:6px}
.view .rp-sec,.view .chsec,.view .src-grp{margin:0 0 12px}
.view .tablewrap{padding:4px 10px}
.view .kpis .kpi{background:var(--panel)}
.view .rp-card{border-radius:6px;border-color:var(--line-2);background:var(--panel-2)}
.view .rp-sec>.lt,.view .rp-sh .lt,.view .chsec>h3,.view .fcols>section>h3,.view .mk-box>h3,.view .src-grp>h3{display:flex;align-items:center;gap:10px;margin:0 0 12px;font:700 14px/1.3 var(--font-display);letter-spacing:0;text-transform:none;color:var(--text)}
.view .rp-sec>.lt::before,.view .rp-sh .lt::before,.view .chsec>h3::before,.view .fcols>section>h3::before,.view .mk-box>h3::before,.view .src-grp>h3::before{content:"";width:28px;height:28px;flex:none;border-radius:6px;background:rgba(0,101,39,.09) var(--ic) center/15px no-repeat}
.view{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='10' height='10' rx='2'/%3E%3C/svg%3E")}
#view-reports{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 1.5h5.5L12.5 4.5v10H4zM9.5 1.5v3h3M6 8h4.5M6 11h4.5'/%3E%3C/svg%3E")}
#view-changes{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='6.3'/%3E%3Cpath d='M8 4.5V8l2.4 1.6'/%3E%3C/svg%3E")}
#view-field{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 14.5s5-4.3 5-8.2A5 5 0 0 0 3 6.3c0 3.9 5 8.2 5 8.2z'/%3E%3Ccircle cx='8' cy='6.3' r='1.8'/%3E%3C/svg%3E")}
#view-market{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5.5' cy='5' r='2.2'/%3E%3Ccircle cx='11' cy='6' r='1.8'/%3E%3Cpath d='M1.5 13.5c.4-2.4 2-3.8 4-3.8s3.6 1.4 4 3.8M10 9.6c1.9-.2 3.6.9 4.2 3.4'/%3E%3C/svg%3E")}
#view-sources{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 2h12v12H2zM2 6.5h12M2 10.5h12M6.5 2v12M10.5 2v12'/%3E%3C/svg%3E")}
.view .chsec .chitem{border-top:1px solid var(--line);border-bottom:0}
.view .chsec h3+.chitem{border-top:0}
.panel{background:var(--panel-2)}
.panel .glance .g-h{align-items:center}
.panel .glance .g-h .kicker{display:flex;align-items:center;gap:10px;font:700 14px/1.3 var(--font-display);letter-spacing:0;text-transform:none;color:var(--text)}
.panel .glance .g-h .kicker::before{content:"";width:28px;height:28px;flex:none;border-radius:6px;background:rgba(0,101,39,.09) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5.5' cy='5' r='2.2'/%3E%3Ccircle cx='11' cy='6' r='1.8'/%3E%3Cpath d='M1.5 13.5c.4-2.4 2-3.8 4-3.8s3.6 1.4 4 3.8M10 9.6c1.9-.2 3.6.9 4.2 3.4'/%3E%3C/svg%3E") center/15px no-repeat}
.panel .glance .g-h em{color:var(--muted);font-weight:500}
.panel .fbody{background:var(--panel);margin:0 14px;border:1px solid var(--line-2);border-top:0;border-radius:0 0 6px 6px;overflow:hidden}
.panel .fbody .fhead{padding:14px 16px 16px}
.panel .fbody .sechead,.panel .fbody .filters{padding-left:16px;padding-right:16px}

/* plane card: the aircraft's photo (planespotters.net / airport-data.com, linked back as their terms ask) */
#card .pl-photo{display:block;margin:12px 14px 0;border-radius:6px;overflow:hidden;background:var(--panel);border:1px solid var(--line-2)}
#card .pl-photo img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
#card .pl-credit{margin:4px 16px 0;font-size:10.5px;color:var(--muted)}
#card #plPath{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 13.5c3-1 4-6 7-7.5s4.5-.5 6-3'/%3E%3Ccircle cx='1.8' cy='13.4' r='1.2'/%3E%3C/svg%3E")}

/* ===== map toolbar: Filters popup (between County and Export) and its Clear button ===== */
.maptop{position:relative}
.fwrap{display:flex;gap:6px;align-items:stretch}
.fbtn,.fclear{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 13px;border:1px solid var(--line-2);border-radius:6px;background:var(--panel);color:var(--text-2);font:600 12.5px var(--font-display);cursor:var(--cur-pointer,pointer);box-shadow:0 1px 2px rgba(11,13,12,.08);white-space:nowrap}
.fbtn:hover,.fclear:hover{border-color:var(--text-2);color:var(--text)}
.fbtn.on{color:var(--brand);border-color:var(--brand)}
.fbtn.open{background:var(--text);border-color:var(--text);color:var(--panel)}
.fcount{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--brand);color:#fff;font:700 11px/18px var(--font-mono);text-align:center}
.fbtn.open .fcount{background:var(--panel);color:var(--text)}
.fclear{padding:0 11px;color:var(--muted)}
.fclear[hidden],.fcount[hidden]{display:none}
.fpop{position:absolute;left:0;top:calc(100% + 8px);z-index:9;width:min(460px,calc(100vw - 32px));max-height:calc(100vh - 190px);overflow:auto;background:var(--panel);border:1px solid var(--line-2);border-radius:8px;box-shadow:0 14px 40px rgba(11,13,12,.22);overscroll-behavior:contain}
.fpop[hidden]{display:none}
.fpop-h{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:16px 18px 12px;background:var(--panel);border-bottom:1px solid var(--line)}
.fpop-h b{display:block;font:700 15px/1.3 var(--font-display);color:var(--text)}
.fpop-h span{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.fpop-h .x{border:0;background:transparent;cursor:var(--cur-pointer,pointer);color:var(--muted);width:28px;height:28px;flex:none;border-radius:4px;display:grid;place-items:center}
.fpop-h .x:hover{background:var(--panel-2);color:var(--text)}
.fpop .filters{border-bottom:0}
.fpop-h{flex-wrap:wrap}
.fpop-h>div:first-child{flex:1;min-width:0}
.fpop .active{flex:0 0 calc(100% + 36px);display:flex;align-items:center;gap:10px;background:var(--panel-2);margin:2px -18px -12px;padding:9px 18px;border-top:1px solid var(--line);box-sizing:border-box}
.fpop .active span{flex:1;min-width:0;font-size:12px;color:var(--text-2)}
.fpill{display:inline-flex;align-items:center;gap:6px;flex:none;height:28px;padding:0 12px;border:1px solid var(--brand);border-radius:999px;background:var(--panel);color:var(--brand);font:700 12px var(--font-display);cursor:var(--cur-pointer,pointer)}
.fpill:hover{background:var(--brand);color:var(--brand-ink)}
/* tablet: the toolbar is icon-only, so the Filters button is too */
/* phone: the floating filter button opens the same popup as a bottom sheet */
@media (max-width:700px){
  .fbtn,.fclear{display:none}
  /* it sits just above the bottom nav (its map layer is under the nav's, so it can't cover it) */
  .fpop{position:fixed;left:0;right:0;bottom:calc(var(--navh, 64px) + var(--sb, 0px));top:auto;width:auto;max-height:calc(100% - 200px);border-radius:14px 14px 0 0;z-index:80;box-shadow:0 -10px 32px rgba(11,13,12,.28)}
}

#card #bCrime{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5 13.5 3.5v4.2c0 3.3-2.3 5.7-5.5 6.8-3.2-1.1-5.5-3.5-5.5-6.8V3.5z'/%3E%3C/svg%3E")}

/* ===== left panel: the rest of it in the section-card style (head, selection box, list header) ===== */
.panel .fbody .kpiwrap{margin:0}

/* map legends added by layers (ctx.setLegend): same card as the Filings legend */
.xlegend{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:10px 12px;display:grid;gap:6px;font-size:12px;color:var(--text-2);min-width:170px;max-width:240px;box-shadow:0 1px 3px rgba(11,13,12,.08)}
.xlegend .t{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.xlegend .li{display:flex;align-items:center;gap:8px}
.xlegend .li i{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}
.xlegend .lg-grad{height:10px;border-radius:5px}
.xlegend .lg-ticks{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:var(--muted);margin-top:-2px}
.xlegend .lg-note{font-size:11px;color:var(--muted);line-height:1.35}
.xlegend .li .lg-sw{width:16px;height:12px;flex:none;border-radius:2px;object-fit:cover;border:1px solid var(--line)}
.xlegend .lg-ticks.lg-abs{position:relative;display:block;height:12px}
.xlegend .lg-abs span{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap}
.xlegend .lg-abs span:first-child{transform:none}.xlegend .lg-abs span:last-child{transform:translateX(-100%)}
/* Site section: area reports (radius chips + Crime Report / FEMA Report) */
#card .site-rep{border-top:1px solid var(--line);padding-top:12px;display:grid;gap:8px}
#card .mi-chips{display:flex;gap:6px;flex-wrap:wrap}
#card .mi-chips .chip{border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:5px 12px;font:600 12px var(--font-display);color:var(--text-2);cursor:var(--cur-pointer,pointer);min-height:30px}
#card .mi-chips .chip[aria-checked="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
/* Market: interactive charts (legend toggles, month range, pinned breakdowns, selected bar) */
.mk-lb{border:0;background:none;padding:2px 4px;margin:0 -4px;font:inherit;color:inherit;cursor:var(--cur-pointer,pointer);border-radius:4px}
.mk-lb:hover{background:var(--panel-2)}
.mk-lb[aria-pressed="false"]{opacity:.4;text-decoration:line-through}
.mk-seg{display:inline-flex;border:1px solid var(--line-2);border-radius:6px;overflow:hidden}
.mk-seg button{border:0;background:var(--panel);padding:6px 10px;font:600 12px var(--font-display);color:var(--text-2);cursor:var(--cur-pointer,pointer)}
.mk-seg button+button{border-left:1px solid var(--line-2)}
.mk-seg button[aria-pressed="true"]{background:var(--text);color:var(--panel)}
.mk-hint{font-size:11px;color:var(--muted);margin-top:2px}
.mk-pin{position:relative;margin-top:8px;padding:10px 30px 10px 12px;border:1px solid var(--line-2);border-left:3px solid var(--brand);border-radius:6px;background:var(--panel-2);font-size:12.5px;line-height:1.5}
.mk-pin .mk-x{position:absolute;right:8px;top:6px;font-size:16px;color:var(--muted)}
.mk-pl{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.mk-pl span{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:3px 9px;font-size:11.5px}
.mk-pl em{font-style:normal;color:var(--muted)}
.mk-h4{font:700 12.5px/1.3 var(--font-display);margin:14px 0 6px;color:var(--text)}
.mk-hit{cursor:var(--cur-pointer,pointer);outline:none}
.mk-hit:focus-visible rect,.mk-hit:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.mk-hit.on path,.mk-hit.on rect:not([fill="transparent"]){filter:brightness(1.18) saturate(1.2);stroke:var(--text);stroke-width:1.2}
.mk-hb.mk-hit.on span{color:var(--text);font-weight:700}
.mk-hb.mk-hit:hover i b,.mk-hb.mk-hit.on i b{filter:brightness(1.15)}
.vctl .btn{min-height:32px}

/* drive-time map card */
#card .dt-ctl{display:grid;gap:8px;margin-bottom:10px}
#card .dt-band b{display:flex;align-items:center;gap:7px}
#card .dt-band b i{display:inline-block;width:10px;height:10px;border-radius:3px;flex:none}
#card .pl.dt-band{display:grid;grid-template-columns:1fr auto;grid-template-areas:'b l' 's s';gap:2px 10px;align-items:center}
#card .dt-band b{grid-area:b}#card .dt-band span{grid-area:s;text-align:left;white-space:normal}#card .dt-band .lnk{grid-area:l;white-space:nowrap}

/* airport card */
#card .apt-photo{position:relative;margin:0 0 4px;border-radius:6px;overflow:hidden;max-height:220px;background:var(--line)}
#card .apt-photo img{display:block;width:100%;height:220px;object-fit:cover}
#card .apt-photo span{position:absolute;right:6px;bottom:4px;font-size:10px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7)}
#card .apt-sum{font-size:13px;color:var(--text-2);margin:10px 0 0;line-height:1.5}
#card .apt-raw{font-size:11px;color:var(--muted);margin-top:4px;word-break:break-word}
#card .apt-rwy svg{display:block;width:100%;max-width:360px;height:auto;margin:4px 0 8px}
#card .apt-tbl{margin:8px 0 12px;overflow-x:auto}#card .apt-tbl b{display:block;font-size:12px;margin-bottom:4px}
#card table.mini{border-collapse:collapse;font-size:11.5px;width:100%}#card table.mini th{text-align:left;font-weight:600;color:var(--muted);border-bottom:1px solid var(--line);padding:3px 6px}#card table.mini td{border-bottom:1px solid var(--line);padding:3px 6px}
#card .apt-path{background:rgba(234,179,8,.12);border-left:3px solid #eab308;padding:8px 10px;border-radius:4px;font-size:13px;margin-bottom:8px}

/* minimized card: just the title bar; everything it shows on the map stays */
.card .top .mn{border:0;background:transparent;cursor:var(--cur-pointer,pointer);color:var(--muted);width:28px;height:28px;flex:none;border-radius:4px;display:grid;place-items:center;margin-left:auto}
.card .top .mn:hover,.card .top .x:hover{background:var(--panel-2);color:var(--text)}
.card .top .mn svg{transition:transform 160ms ease}
.card.min .top .mn svg{transform:rotate(180deg)}
.card.min{overflow:hidden}
.card.min>:not(.top){display:none!important}
.card.min .top{border-bottom:0;cursor:var(--cur-pointer,pointer)}
#card.min .top .bnav,.card.min .top .bnav{display:none!important}
.card.min .top h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:700px){
  .card .top .mn{width:40px;height:40px;margin:-6px 0 0 0}
  .card.min{max-height:none}
  .card.min .top{padding-bottom:8px}
  .card.min .top .bsub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ================= quick layer buttons (under the map search) ================= */
.qlayers{display:flex;flex-wrap:wrap;gap:6px;contain:inline-size}
.qlayers:empty{display:none}
.qchip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px 0 9px;border:1px solid var(--line-2);border-radius:999px;background:var(--panel);color:var(--text-2);font:600 12px var(--font-display);cursor:var(--cur-pointer,pointer);box-shadow:0 1px 2px rgba(11,13,12,.08);white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.qchip svg{flex:none;opacity:.85}
.qchip:hover{border-color:var(--text-2);color:var(--text)}
.qchip[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.qchip[aria-pressed="true"] svg{opacity:1}
.qchip.qmore{color:var(--muted)}
.qchip.qmore[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
.layers .lt{margin-top:6px;padding-top:10px;border-top:1px solid var(--line)}
.layers .lt:first-child{margin-top:0;padding-top:0;border-top:0}
.layers .lsub{font-size:12px;color:var(--muted);margin-bottom:-4px}
@media (max-width:700px){
  /* one sideways-scrolling row in the gap between the search bar and the map buttons, edge to edge; the faded right
     edge shows there's more */
  .mapleft .qlayers{position:absolute;top:-44px;left:-10px;right:-62px;padding:2px 64px 2px 10px;scroll-padding-left:10px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;contain:none;-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}
  .mtop{z-index:6}
  /* the filing count moves out of that gap: centered between the two button columns, level with their first buttons */
  .mtop .mcount{position:absolute;top:98px;left:50%;transform:translateX(-50%);margin:0;white-space:nowrap}
  .app.ai-open .mtop .mcount{display:none}
  .mapleft .qlayers::-webkit-scrollbar{display:none}
  .qchip{height:34px}
}
.layers .live-ly{margin-top:6px;padding-top:10px}
.layers .live-ly .lt{margin-top:0;padding-top:0;border-top:0}

.mfilt.mclear[hidden]{display:none}
.mfilt.mclear{color:var(--brand)}
/* Map layers popover: opens under the quick layer buttons, left-aligned with them (placed by placeLayers() in app.js) */
.layers .ly-h{display:flex;align-items:center;justify-content:space-between;margin:-4px -6px -2px 0}
.layers .ly-h b{font:700 14px var(--font-display);color:var(--text)}
.layers .ly-h .x{border:0;background:transparent;cursor:var(--cur-pointer,pointer);color:var(--muted);width:28px;height:28px;border-radius:4px;font-size:18px;line-height:1}
.layers .ly-h .x:hover{background:var(--chip);color:var(--text)}
@media (min-width:701px){
  .app .layers.on{left:var(--ly-left,16px)!important;right:auto!important;top:var(--ly-top,16px)!important;width:320px;max-height:calc(100% - var(--ly-top,16px) - 16px)!important;
    border-radius:8px;padding:14px 16px 16px;gap:8px;box-shadow:0 14px 40px rgba(11,13,12,.22);overscroll-behavior:contain;z-index:7}
  .layers .lt{color:var(--brand);margin-top:8px;padding-top:12px}
  .layers .ly-h+.lt{border-top:1px solid var(--line)}
  .layers .tg2{margin:0 -8px;padding:5px 8px;border-radius:4px;font-size:13px}
  .layers .tg2:hover{background:var(--panel-2)}
  .layers .rnote{font-size:11.5px;line-height:1.4;margin-top:-2px}
}
/* the toolbar row wraps (Clear, Export onto the next line) instead of squeezing the tool buttons when the map is narrow */
@media (min-width:701px){ .maptop{flex-wrap:wrap} .maptop .tools{flex-shrink:0} }
.layers{z-index:6}

/* ================= phone: edge-to-edge map, no sideways scrolling in menus ================= */
/* hidden controls stay hidden even where a class sets display (the crime type picker showed with Crime off) */
.layers [hidden]{display:none!important}
.layers select.chip{max-width:100%}
@media (max-width:700px){
  /* the page itself is no longer padded by the safe areas: every phone element already adds the status bar (--st) and
     home indicator (--sb) itself, so the padding counted them twice and left grey bands above the map and above the nav */
  :root{padding-top:0;padding-bottom:0}
  /* the map now runs under the status bar: a soft fade keeps the clock and battery readable over it */
  .viewport::before{content:"";position:absolute;left:0;right:0;top:0;height:calc(var(--st) + 14px);z-index:4;pointer-events:none;background:linear-gradient(var(--panel) 0,color-mix(in srgb,var(--panel) 70%,transparent) 60%,transparent)}
  .stage:not([data-view="map"]) .viewport::before{display:none}
  /* menus scroll up and down only */
  .layers,.fpop,.msheet,.panel,.view{overflow-x:hidden;overscroll-behavior-x:none}
  .layers,.fpop,.msheet{touch-action:pan-y}
}

/* ================= phone "More" sheet: one-word tiles, named like the desktop tabs ================= */
@media (max-width:700px){
  .msheet{padding:0 14px 14px}
  .msheet .mt-h{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:10px 4px 8px}
  .msheet .mtiles{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
  .msheet .mtiles button{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;width:auto;padding:12px 2px 10px;border:0;border-radius:12px;background:var(--panel-2);font:600 12.5px/1.2 var(--font-display);color:var(--text);text-align:center}
  .msheet .mtiles button[hidden]{display:none}
  .msheet .mtiles button:active{background:var(--chip)}
  .msheet .mt-ic{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--panel);color:var(--brand);font-style:normal}
  .msheet .mt-ic .badge{position:absolute;top:-4px;right:-10px}
  .msheet .mt-ic .badge:empty{display:none}
}

/* ================= phone filters: a full-height sheet with a fixed header and a "Show N filings" button ================= */
.fpop-f{display:none}
@media (max-width:700px){
  .fpop{top:calc(var(--st) + 68px);max-height:none;display:flex;flex-direction:column;overflow:hidden}
  .fpop[hidden]{display:none}
  .fpop .fpop-h{position:static;flex:none;padding:12px 16px 10px;align-items:center;row-gap:0}
  .fpop .fpop-h>div:first-child span{display:none}
  .fpop .fpop-h b{font-size:18px}
  .fpop .active{margin:6px -16px -10px;padding:8px 16px;flex-basis:calc(100% + 32px)}
  .fpop .filters{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 16px 18px;gap:0}
  .fpop .filters .row{margin-bottom:16px}
  .fpop #dField{flex:1 0 100%}
  .fpop .filters .lbl{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
  .fpop .filters .more{border:0;border-radius:0;padding:0;margin:0}
  .fpop .filters .more>summary{display:none}
  .fpop .filters .fgroup{font:700 15px/1.3 var(--font-display);color:var(--text);letter-spacing:0;text-transform:none;border-top:1px solid var(--line);margin:4px 0 12px;padding-top:16px}
  .fpop-f{display:block;flex:none;padding:10px 16px 12px;border-top:1px solid var(--line);background:var(--panel)}
  .fdone{display:block;width:100%;height:48px;border:0;border-radius:12px;background:var(--brand);color:var(--brand-ink);font:700 15px var(--font-display);cursor:var(--cur-pointer,pointer)}
  .fdone:hover,.fdone:active{background:color-mix(in srgb,var(--brand) 85%,var(--text))}
}

/* ================= Filters panel: one section per layer, and the mode switch ================= */
.fpop .lfmode{flex-basis:100%;grid-template-columns:1fr 1fr;margin-top:10px;border-radius:8px}
.fpop .lfmode button{padding:8px 6px;font-size:12.5px}
.fpop .lfmode button[aria-pressed="true"]{background:var(--text);color:var(--panel)}
.lfsec{border-top:1px solid var(--line)}
.lfsec:first-of-type{border-top:0}
.lfsec>summary{list-style:none;cursor:var(--cur-pointer,pointer);display:flex;align-items:center;gap:8px;padding:14px 18px;font:700 14px var(--font-display);color:var(--text)}
.lfsec>summary::-webkit-details-marker{display:none}
.lfsec>summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg) translateY(-2px);transition:transform .15s}
.lfsec[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
.lfsec>summary em{font-style:normal;font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--brand)}
.lfsec .lfrows{display:grid;gap:10px;padding:0 18px 4px}
.lfsec .lfrows:empty{display:none}
.lfsec>.lfrow{padding:0 18px 10px}
.lfsec>.lfrow:last-child{padding-bottom:16px}
.lfrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:10px}
.lfrow label{font-size:12.5px;color:var(--text-2)}
.lfrow select.chip{width:100%;min-height:34px}
.lfrows .lfrow:last-child{margin-bottom:12px}
.fpop:not(.lf-match) .lfrow.mo{display:none}
.lfsec#lfFilings .filters{padding-top:6px}
.lfmatch{margin:12px 18px 4px;padding:12px 14px;border-radius:8px;background:var(--green-50);border:1px solid var(--green-200);display:grid;gap:4px;font-size:12.5px;color:var(--text-2)}
.lfmatch[hidden]{display:none}
.lfmatch p{margin:0}
.lfm-n{font-size:14px;color:var(--text)}
.lfm-n b{font:700 18px var(--font-display);color:var(--brand)}
.lfmatch .lnk{justify-self:start;border:0;background:none;padding:0;color:var(--brand);font-weight:700;cursor:var(--cur-pointer,pointer);text-decoration:underline}
.lfm-w{color:#9a6700;font-size:12px}
@media (max-width:700px){
  .fpop .lfbody{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
  .fpop .filters{flex:none;overflow:visible;min-height:auto}
  .lfsec>summary{padding:14px 16px}
  .lfsec .lfrows{padding:0 16px 4px}
  .lfsec>.lfrow{padding:0 16px 10px}
  .lfmatch{margin:12px 16px 4px}
  .lfrow{grid-template-columns:1fr}
  .lfrow label{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
}

/* ================= card tabs: several buildings, parcels, filings, planes or airports at once (src/cardtabs.js) ================= */
.ctabs{position:sticky;top:0;z-index:4;display:flex;align-items:center;gap:6px;height:40px;padding:0 8px;background:var(--panel-2);border-bottom:1px solid var(--line)}
/* the tabs scroll sideways inside their own box; Add / Done sits beside it, never over a tab */
.ctlist{position:relative;flex:0 1 auto;min-width:0;display:flex;align-items:center;gap:4px;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain}
.ctlist::-webkit-scrollbar{display:none}
.card.has-tabs .top{top:40px}
.ctab{flex:none;display:flex;align-items:center;gap:5px;max-width:170px;height:28px;padding:0 6px 0 7px;border:1px solid transparent;border-radius:5px;background:transparent;color:var(--text-2);font:inherit;font-size:12px;cursor:var(--cur-pointer,pointer);white-space:nowrap;transition:background .15s,color .15s,border-color .15s}
.ctab span{overflow:hidden;text-overflow:ellipsis;min-width:0}
.ctab svg{flex:none;opacity:.75}
.ctab:hover{background:var(--chip);color:var(--text)}
.ctab[aria-selected="true"]{background:var(--panel);border-color:var(--line-2);color:var(--text);font-weight:600;box-shadow:0 1px 3px rgba(11,13,12,.12)}
.ctab[aria-selected="true"] svg{color:var(--green-600);opacity:1}
.ctab.cpin{font-family:var(--font-mono);font-size:11px;letter-spacing:.04em}
.ctab .cnum,.mnum{flex:none;display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--green-100);color:var(--green-800);font:700 10px/1 var(--font-mono);font-style:normal}
.ctab[aria-selected="true"] .cnum{background:var(--green-600);color:#fff}
.ctabw{flex:none;position:relative;display:flex;align-items:center}
.ctab.has-x{padding-right:25px}
.ctabw .cx{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:18px;height:18px;padding:0;border:0;background:transparent;display:grid;place-items:center;border-radius:3px;font:inherit;font-size:14px;line-height:1;color:var(--muted);cursor:var(--cur-pointer,pointer)}
.ctabw .cx::before{content:"";position:absolute;inset:-5px -4px} /* a bigger target than the glyph */
.ctabw .cx:hover{background:var(--line);color:var(--text)}
.ctabw .cx:focus-visible{outline-offset:0}
.ctab:focus-visible{outline-offset:1px}
.ctadd{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px 0 8px;border:1px solid var(--line-2);border-radius:5px;background:var(--panel);color:var(--text-2);font:600 12px/1 var(--font-display);cursor:var(--cur-pointer,pointer);white-space:nowrap;transition:background .15s,color .15s,border-color .15s}
.ctadd svg{flex:none;color:var(--brand)}
.ctadd:hover{border-color:var(--text-2);color:var(--text)}
.ctadd[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
.ctadd[aria-pressed="true"] svg{color:var(--panel)}
.mrow .lnk b .mnum{margin-right:6px;vertical-align:1px}
/* a building on several parcels */
.mparc{margin:4px 16px 10px;border-top:1px solid var(--line)}
.mparc .fl{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:8px 0 4px}
.mprow{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.mprow>span:first-of-type{flex:1;min-width:0;display:grid;gap:1px}
.mprow b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mprow em{font-style:normal;font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mprow .m{white-space:nowrap}
.mprow.tot{border-bottom:0}
button.mprow{width:100%;border:0;border-bottom:1px solid var(--line);background:none;color:inherit;font:inherit;font-size:12.5px;text-align:left;border-radius:4px;cursor:var(--cur-pointer,pointer)}
button.mprow:hover,button.mprow:focus-visible{background:var(--chip)}
button.mprow:hover b{color:var(--brand)}
#card .pgrid-h{color:var(--text-2)}
#card .oc-for{margin-bottom:4px}
.mprow.tot i{width:17px;flex:none}
@media (max-width:700px){
  .ctabs{height:44px;padding:0 10px}
  .card.has-tabs .top{top:44px}
  /* picking more: the sheet drops low so the map is free to tap */
  .card.adding,.card.adding.full{max-height:30%}
  .ctab{height:32px;font-size:12.5px}
  .ctadd{height:32px}
}

/* Market: area picker (mini map of the counties + a button for each and the whole region) */
.mk-scope{display:grid;grid-template-columns:260px 1fr;grid-template-rows:auto auto;gap:6px 18px;align-items:center;margin:4px 0 16px;padding:12px 16px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.mk-scope-l{grid-row:1/3}
.mk-scope-k{font:500 10px var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--brand);margin-bottom:4px}
.mk-mini{display:block;width:100%;height:auto}
.mk-mini path{fill:var(--chip);stroke:var(--panel);stroke-width:1.5;cursor:var(--cur-pointer,pointer);transition:fill .12s}
.mk-mini path.in{fill:var(--green-100)}
.mk-mini path:hover{fill:var(--green-200)}
.mk-mini path.on{fill:var(--brand)}
.mk-mini text{font:600 7.5px var(--font-mono);letter-spacing:.06em;fill:var(--text-2);text-anchor:middle;pointer-events:none}
.mk-ctys{display:flex;flex-wrap:wrap;gap:8px;align-self:end}
.mk-cty{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:104px;padding:8px 12px;border:1px solid var(--line-2);border-radius:6px;background:var(--panel);color:var(--text);cursor:var(--cur-pointer,pointer);text-align:left;font:inherit}
.mk-cty b{font:700 13px var(--font-display)}
.mk-cty span{font:500 9.5px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.mk-cty:hover{border-color:var(--brand)}
.mk-cty[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.mk-cty[aria-pressed="true"] span{color:inherit;opacity:.8}
.mk-cty:focus-visible{outline:3px solid rgba(10,122,54,.32);outline-offset:1px}
.mk-scope-n{font-size:11.5px;color:var(--muted);align-self:start}
@media (max-width:760px){.mk-scope{grid-template-columns:1fr;padding:12px}.mk-scope-l{grid-row:auto;max-width:280px}.mk-ctys{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;margin:0 -12px;padding-left:12px;padding-right:12px}.mk-cty{flex:none}}
.mk-mini text.on{fill:var(--brand-ink)}

/* ================= Market tab (redesigned 2026-10-05; src/area.js + src/mkcharts.js) ================= */
:root{--mk-c0:#006527;--mk-c1:#2a78d6;--mk-c2:#c26a00;--mk-c3:#7c3aed;--mk-c4:#8a9396;--mk-c5:#0e7c86;--mk-c6:#b3261e;--mk-up:#0a7a36;--mk-dn:#b3261e}
#view-market .mk-vhead h2{font-size:24px}
/* area picker: mini map + county chips */
.mk-scope2{display:flex;align-items:center;gap:18px;margin:2px 0 12px;padding:10px 14px;border:1px solid var(--line-2);border-radius:8px;background:var(--panel)}
.mk-scope2 .mk-mini{width:150px;height:auto;flex:none}
.mk-scope2 .mk-ctys{display:flex;flex-wrap:wrap;gap:6px}
.mk-scope2 .mk-cty{border:1px solid var(--line-2);background:var(--panel);color:var(--text-2);border-radius:999px;padding:5px 12px;font:600 12px var(--font-display);cursor:var(--cur-pointer,pointer)}
.mk-scope2 .mk-cty:hover{border-color:var(--text-2);color:var(--text)}
.mk-scope2 .mk-cty[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.mk-scope2 .mk-scope-n{font-size:11.5px;color:var(--muted);margin-top:6px}
/* section buttons (sticky) */
.mk-nav{position:sticky;top:-20px;z-index:3;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -24px 6px;padding:10px 24px;background:var(--panel-2);border-bottom:1px solid var(--line)}
.mk-nav::-webkit-scrollbar{display:none}
.mk-nav button{flex:none;border:1px solid var(--line-2);background:var(--panel);border-radius:999px;padding:6px 13px;font:600 12px var(--font-display);color:var(--text-2);cursor:var(--cur-pointer,pointer)}
.mk-nav button:hover{border-color:var(--text-2);color:var(--text)}
.mk-nav button[aria-current="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
.mk-nav button[hidden]{display:none}
.mk-sec{margin-top:18px;scroll-margin-top:60px}
.mk-sh{margin:6px 0 12px}
.mk-sh h2{margin:0;font:700 18px/1.25 var(--font-display);color:var(--text)}
.mk-sh p{margin:3px 0 0;font-size:12.5px;color:var(--muted);max-width:820px}
#view-market .mk-grid{gap:14px}
@media (min-width:901px){ #view-market .mk-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
/* headline tiles */
.mk-kpis2{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:10px}
.mk-kpi{background:var(--panel);border:1px solid var(--line-2);border-radius:8px;padding:12px 14px 10px;min-width:0;display:flex;flex-direction:column;gap:2px;position:relative}
.mk-kpi .mk-kl{font:500 10px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.mk-kpi b{font:600 22px/1.2 var(--font-mono);color:var(--text);margin-top:2px}
.mk-kpi b small{font-size:12px;color:var(--muted);font-weight:500}
.mk-ks{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:baseline;font-size:11.5px;color:var(--muted)}
.mk-kspk{margin-top:6px;height:28px}
.mk-kspk svg{display:block;width:100%;height:28px;overflow:visible}
.mk-d{font:600 11.5px var(--font-mono);white-space:nowrap}
.mk-up{color:var(--mk-up)}.mk-dn{color:var(--mk-dn)}.mk-flat{color:var(--muted)}
/* what's moving */
.mk-moving{margin-top:12px;background:var(--panel);border:1px solid var(--line-2);border-left:3px solid var(--brand);border-radius:8px;padding:12px 16px;display:grid;grid-template-columns:1fr auto;gap:6px 16px;align-items:start}
.mk-moving h3{grid-column:1/-1;margin:0;font:700 14px var(--font-display)}
.mk-moving ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:4px 18px}
.mk-moving li{font-size:13px;line-height:1.45;padding-left:16px;position:relative}
.mk-moving li::before{content:"";position:absolute;left:0;top:7px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent}
.mk-moving li.up::before{border-bottom:7px solid var(--mk-up)}.mk-moving li.dn::before{border-top:7px solid var(--mk-dn);top:8px}
.mk-moving .btn{align-self:end;display:inline-flex;gap:6px;align-items:center;white-space:nowrap}
/* charts */
#view-market .mk-svg{width:100%;height:auto;display:block;overflow:visible}
#view-market line.mk-grid{stroke:var(--line);stroke-width:1}
.mk-cross{stroke:var(--text-2);stroke-width:1;stroke-dasharray:2 2;opacity:0}
.mk-dot{opacity:0;stroke:var(--panel);stroke-width:1.5}
.mk-hit:hover .mk-cross,.mk-hit:hover .mk-dot,.mk-hit:focus .mk-cross,.mk-hit:focus .mk-dot{opacity:1}
.mk-col{cursor:var(--cur-default,default)}
.mk-now{stroke:var(--text-2);stroke-width:1;stroke-dasharray:3 3}
.mk-hit:hover path{filter:brightness(1.12)}
.mk-spk{display:block}
#view-market .mk-leg{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11.5px;color:var(--text-2);margin:2px 0 6px}
#view-market .mk-leg i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
#view-market .mk-hb small{color:var(--muted);font-family:var(--font-mono);font-size:10.5px}
#view-market .mk-hb i b{background:var(--mk-c0)}
.kgrid.mk-kg4{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:0;background:var(--panel);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin:0 0 10px}
.kgrid.mk-kg4>div{background:var(--panel);padding:8px 10px;min-width:0;box-shadow:1px 0 0 var(--line),0 1px 0 var(--line)}
.kgrid.mk-kg4 b{display:block;font:600 15px var(--font-mono);color:var(--text)}
.kgrid.mk-kg4 span{display:block;font:500 9.5px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:2px;line-height:1.35}
/* tables */
.mk-tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.mk-tbl th{font:500 10px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;padding:6px;border-bottom:1px solid var(--line-2)}
.mk-tbl td{padding:6px;border-bottom:1px solid var(--line);vertical-align:top}
.mk-tbl .r{text-align:right}.mk-tbl .m{font-family:var(--font-mono);white-space:nowrap}
.mk-tbl td b{font-weight:600}
.mk-tbl .sc{display:block;color:var(--muted);font-size:11px;margin-top:1px}
.mk-tbl tr.mk-fr{cursor:var(--cur-pointer,pointer)}
.mk-tbl tr.mk-fr:hover,.mk-tbl tr.mk-fr:focus-visible{background:var(--panel-2)}.mk-tbl tr.mk-fr:focus-visible{outline-offset:-2px}
.mk-pin .mk-tbl{margin-top:6px}
/* small multiples */
.mk-sms{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.mk-sm{border:1px solid var(--line);border-radius:6px;padding:8px 10px 6px;min-width:0}
.mk-smh{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-bottom:2px}
.mk-smh span{font-size:12.5px;font-weight:600;color:var(--text-2)}
.mk-smh b{font:600 14px var(--font-mono);color:var(--text)}
.mk-smf{font-size:10.5px;color:var(--muted);font-family:var(--font-mono)}
.mk-zips{max-height:none}
@media (max-width:700px){
  .mk-scope2{flex-direction:column;align-items:stretch}.mk-scope2 .mk-mini{display:none}
  .mk-nav{margin:0 -14px 6px;padding:8px 14px;top:-14px}
  .mk-kpis2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mk-kpi b{font-size:18px}
  .mk-moving{grid-template-columns:1fr}.mk-moving ul{grid-template-columns:1fr}
  .mk-sms{grid-template-columns:1fr}
}
#view-market .mk-box .tablewrap{border:0;padding:0;background:none;border-radius:0}
#view-market .mk-box .mk-more summary{margin-top:8px}
/* environmental report and site popups */
.env-pop{font-size:12px;line-height:1.4}.env-pop b{font-size:12.5px}.env-pop div{color:var(--muted)}.env-pop .btn{margin-top:6px}
.card table.env-t{width:100%;font-size:11.5px}.card table.env-t td,.card table.env-t th{vertical-align:top;padding:3px 4px}
.card .env-k{margin-top:8px}.card .env-k .fl{font-weight:600;margin-bottom:2px}
.card .oc-box{margin-top:10px;padding:8px 10px;border:1px solid var(--line);border-radius:8px}.card .oc-head{margin:2px 0 4px}.card .oc-st{display:inline-block;font-size:10.5px;padding:1px 6px;border-radius:9px;background:rgba(47,158,68,.14);color:#2b8a3e;margin-left:4px}.card .oc-st.bad{background:rgba(224,49,49,.14);color:#c92a2a}.card dl.oc{margin:4px 0}
.seg.seg6 button[hidden]{display:none}
/* Google: logo and map data credits while Google content is on screen (their terms) */
.g-brand{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:8px;max-width:70%;pointer-events:none;font-size:10px;color:#fff;text-shadow:0 0 3px rgba(0,0,0,.85)}
.g-brand img{height:16px;width:auto}.g-brand span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-sec .g-pow{margin-left:auto;font-size:10px;color:var(--muted);text-transform:none;letter-spacing:0}
.card .g-attr img{height:14px;vertical-align:-3px;margin-right:4px}
.xlegend:has(.lg2){max-width:340px}.xlegend .lg2{display:grid;grid-template-columns:auto auto;gap:4px 14px;font-size:11.5px}.xlegend .lg2 .li{white-space:nowrap;gap:6px}

/* ================= custom cursors (src/cursors.js) ================= */
/* the app's own arrow everywhere; text fields keep the I-beam */
html{cursor:var(--cur-default,default)}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit]):not([type=color]),textarea,[contenteditable="true"]{cursor:text}
a[href],button:not(:disabled),[role="button"],[role="tab"],summary,select,label:has(input[type=checkbox]),label:has(input[type=radio]),input[type=checkbox],input[type=radio],input[type=range]{cursor:var(--cur-pointer,pointer)}
button:disabled{cursor:var(--cur-default,default)}
/* the map: the arrow when still, four-way arrows while dragging it */
.maplibregl-canvas-container.maplibregl-interactive{cursor:var(--cur-default,default)}
.maplibregl-canvas-container.maplibregl-interactive:active{cursor:var(--cur-grabbing,grabbing)}
.maplibregl-canvas-container.maplibregl-interactive.maplibregl-track-pointer{cursor:var(--cur-pointer,pointer)}
.maplibregl-ctrl button:not(:disabled),.maplibregl-popup-close-button{cursor:var(--cur-pointer,pointer)}

/* ---------- site plans (src/siteplan.js) ---------- */
#card .sp-title{font:inherit;color:inherit;background:transparent;border:1px solid transparent;border-radius:4px;padding:0 4px;margin-left:-5px;width:100%;min-width:0}
#card .sp-title:hover,#card .sp-title:focus{border-color:var(--line-2);outline:none}
.sp-body{padding-top:10px}
.sp-plans{display:flex;flex-wrap:wrap;gap:6px;margin:0 16px 12px}
.sp-start .sp-radio{display:flex;align-items:center;gap:8px;padding:6px 0;font-size:13px;flex-wrap:wrap}
.sp-start .sp-in{flex:1;min-width:160px}
.sp-in,.sp-grid input,.sp-grid select,.sp-ai textarea{border:1px solid var(--line-2);border-radius:4px;background:var(--panel);color:var(--text);font:inherit;font-size:13px;padding:6px 8px}
.sp-ai textarea{display:block;width:100%;box-sizing:border-box;resize:vertical;min-height:52px;margin-top:4px}
.sp-ai textarea:focus,.sp-grid input:focus,.sp-in:focus{outline:2px solid var(--green-300);outline-offset:0;border-color:var(--brand)}
.sp-sugs{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.sp-sugs .chip{font-size:11.5px;padding:3px 8px;min-height:0}
.card .bacts.sp-go{padding:8px 0 0;align-items:flex-start}
.btn.busy{position:relative;color:transparent!important;pointer-events:none;opacity:1} /* working: a spinner where the label was (the label stays, hidden, so the button keeps its size) */
.btn.busy::after{content:"";position:absolute;inset:0;margin:auto;width:16px;height:16px;box-sizing:border-box;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:sp-spin .7s linear infinite}
.btn.busy:not(.askai)::after{border-color:var(--line-2);border-top-color:var(--text)}
@keyframes sp-spin{to{transform:rotate(360deg)}}
.sp-stage{margin-top:6px;font-size:12px;color:var(--muted)}
.sp-stage:empty{display:none}
.sp-ainote{margin-top:6px;line-height:1.4}.sp-ainote:empty{display:none} /* the AI's note under the button, never beside it: a long note used to stretch the button */
.sp-vars{display:grid;gap:6px;margin-top:10px}
.sp-more{display:flex;justify-content:space-between;align-items:center;margin-top:6px;font-size:12px}.sp-more select{font:inherit;margin-left:4px;border:1px solid var(--line-2);border-radius:4px;background:var(--panel);color:var(--text);padding:2px 4px}
.sp-sched{display:flex;height:18px;border-radius:4px;overflow:hidden;margin:8px 0 2px;font:600 10px var(--font-mono);color:#fff}.sp-sched i{display:flex;align-items:center;justify-content:center;font-style:normal;min-width:16px}
.sp-sched .pre{background:#8a6fb3}.sp-sched .bld{background:#c8673d}.sp-sched .lease{background:#d8a13a}.sp-sched .hold{background:#3f8f5a}.sp-card small{display:block;font-size:10px;color:var(--muted)}
.sp-sub{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);margin:12px 0 4px}
.sp-sw{display:flex!important;flex-direction:row!important;align-items:center;gap:6px;font-size:12.5px}
.sp-grid label small{display:block;font-size:10.5px;color:var(--muted)}
.sp-mix{width:100%;border-collapse:collapse;font-size:12px}.sp-mix th{font-weight:500;color:var(--text-2);text-align:left;padding:2px}
.sp-mix td{padding:2px}.sp-mix input{width:100%;min-width:0;box-sizing:border-box;font:inherit;padding:3px 4px;border:1px solid var(--line-2);border-radius:4px;background:var(--panel);color:var(--text)}
.sp-x{border:0;background:none;color:var(--muted);cursor:var(--cur-pointer,pointer);font-size:15px}.sp-link{border:0;background:none;color:var(--brand);cursor:var(--cur-pointer,pointer);font:inherit;padding:0 0 0 6px}
.sp-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:6px;margin:10px 0}
.sp-card{border:1px solid var(--line-2);border-radius:6px;padding:6px 8px;background:var(--panel-2)}.sp-card span{display:block;font-size:10.5px;color:var(--text-2)}.sp-card b{font-family:var(--font-mono);font-size:13px}
.sp-mixt{width:100%;border-collapse:collapse;font-size:12px;margin:6px 0}.sp-mixt th,.sp-mixt td{text-align:right;padding:3px 4px;border-bottom:1px solid var(--line)}.sp-mixt th:first-child,.sp-mixt td:first-child{text-align:left}
/* a generated layout: the card puts it on the map; Save as new option keeps it as an Option of its own */
/* Layouts: comparison cards. The card on the map has the brand edge; hover is only a darker border, never that */
.sp-var{border:1px solid var(--line-2);background:var(--panel);border-radius:6px;color:var(--text);transition:border-color 120ms,background 120ms}
.sp-var:hover{border-color:color-mix(in srgb,var(--text) 30%,transparent)}
.sp-var.on{border-color:var(--brand);box-shadow:inset 3px 0 0 var(--brand);background:var(--panel-2)}
.sp-var.none{opacity:.6}.sp-var.none .sp-var-use{cursor:var(--cur-default,default)}
.sp-var-use{display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px;align-items:start;width:100%;text-align:left;border:0;background:none;padding:10px 10px 6px;color:inherit;cursor:var(--cur-pointer,pointer);font:inherit;border-radius:6px}
.sp-var-use:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.sp-vthumb{width:88px;height:88px;border:1px solid var(--line);border-radius:4px;background:#fbfbf8;display:grid;place-items:center;overflow:hidden}
.sp-vthumb svg{width:100%;height:100%;display:block}.sp-vthumb i{font-style:normal;font-size:10.5px;color:var(--ink-500);text-align:center;padding:4px}
.sp-vhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;line-height:1.3}.sp-vhead b{font-size:13.5px;font-weight:700}.sp-vhead span{font-size:12px;color:var(--text-2)}
.sp-vpills{display:flex;flex-wrap:wrap;gap:4px}
.sp-vpills i{font:600 10.5px/18px var(--font-display);font-style:normal;border-radius:var(--r-pill);padding:0 7px;white-space:nowrap;background:var(--chip);color:var(--text-2)}
.sp-vpills .sp-onmap{font:600 10px/18px var(--font-mono);border-radius:3px;color:var(--brand-ink);background:var(--brand)}
.sp-badge{color:var(--brand)!important;background:color-mix(in srgb,var(--brand) 12%,transparent)!important}.sp-badge.rec{box-shadow:inset 0 0 0 1px var(--brand)}
.sp-ck.ok{color:var(--brand)!important;background:color-mix(in srgb,var(--brand) 12%,transparent)!important}
.sp-ck.bad{color:var(--danger)!important;background:color-mix(in srgb,var(--danger) 12%,transparent)!important}
.sp-score.hi{color:var(--brand)!important;background:color-mix(in srgb,var(--brand) 12%,transparent)!important}
.sp-score.mid{color:var(--amber)!important;background:color-mix(in srgb,var(--amber) 14%,transparent)!important}
.sp-score.lo{color:var(--danger)!important;background:color-mix(in srgb,var(--danger) 12%,transparent)!important}
.sp-vpills .hot{box-shadow:inset 0 0 0 1.5px currentColor}
.sp-vgrid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:4px;overflow:hidden}
.sp-vc{display:grid;gap:1px;padding:5px 7px;background:var(--panel);min-width:0}.sp-var.on .sp-vc{background:var(--panel-2)}
.sp-vc small{font-size:10.5px;color:var(--muted);line-height:1.2}.sp-vc b{font-size:13.5px;font-weight:700;line-height:1.25;overflow-wrap:anywhere}
.sp-vc i{font-style:normal;font-size:11px;color:var(--text-2);line-height:1.3}.sp-vc em{font-style:normal}
.sp-vc.hot{background:color-mix(in srgb,var(--brand) 9%,var(--panel))!important}.sp-vc.hot small{color:var(--brand);font-weight:600}
.sp-vc.short b,.sp-vc.neg b,em.neg,.sp-vc em.neg{color:var(--danger)}
.sp-vp2{font-size:11.5px;color:var(--text-2)}.sp-vp2.hot{color:var(--brand);font-weight:600}
.sp-vwhy{font-size:12px;line-height:1.4;color:var(--text);padding-left:8px;border-left:2px solid var(--brand)}
.sp-vdelta{font-size:11.5px;color:var(--muted)}
.sp-numonly{font-style:normal;font-size:11px;color:var(--muted)}
.sp-n{margin:0;font-size:12px;line-height:1.4;position:relative;padding-left:14px}.sp-n::before{position:absolute;left:0;top:0;font-weight:700}
.sp-n.bad{color:var(--danger)}.sp-n.bad::before{content:"!"}.sp-n.warn{color:var(--amber)}.sp-n.warn::before{content:"!"}.sp-n.info{color:var(--muted)}.sp-n.info::before{content:"·"}
.sp-var>.sp-n{margin:0 10px 4px}
.sp-why{margin:0 10px 4px;font-size:12px}.sp-why summary{cursor:var(--cur-pointer,pointer);color:var(--brand);font-weight:600;font-size:11.5px;width:max-content}
.sp-why[open]{padding-bottom:4px}.sp-why-v{margin:6px 0 4px;color:var(--text)}
.sp-why-l{list-style:none;margin:0 0 4px;padding:0;display:grid;gap:2px}.sp-why-l li{position:relative;padding-left:16px;line-height:1.4}
.sp-why-l li::before{position:absolute;left:0;font-weight:700}.sp-why-l li.ok::before{content:"✓";color:var(--brand)}.sp-why-l li.bad::before{content:"!";color:var(--danger)}
.sp-var-acts{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:4px 14px;padding:2px 10px 8px}.sp-var-acts .sp-link{font-size:11.5px;padding:2px 0}
.sp-var-acts .sp-link:hover{text-decoration:underline}.sp-var-acts .sp-simt{margin-right:auto;color:var(--text-2)}
/* the AI's plan (its brief laid out by the engine): the pill, its reasons and what the engine changed */
.sp-vpills .sp-aip{color:var(--brand);background:color-mix(in srgb,var(--brand) 13%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 45%,transparent)}
.sp-aib{margin:0 10px 6px;padding:6px 8px;border-radius:6px;background:var(--panel-2);font-size:12px;line-height:1.4;min-width:0}
.sp-aib-h{font:600 10.5px/1.3 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--muted);margin:2px 0 3px}.sp-aib-h+.sp-aib-h,.sp-aib-l+.sp-aib-h,.sp-aib-more+.sp-aib-h{margin-top:7px}
.sp-aib-l{list-style:none;margin:0;padding:0;display:grid;gap:2px}.sp-aib-l li{position:relative;padding-left:12px;overflow-wrap:anywhere}.sp-aib-l li::before{content:"·";position:absolute;left:2px;font-weight:700;color:var(--brand)}
.sp-aib-l b{font-weight:600;color:var(--text)}.sp-aib-l.ch li{color:var(--amber)}.sp-aib-l.ch li::before{content:"!";color:var(--amber)}
.sp-aib-ok{margin:0;color:var(--text-2)}.sp-aib-more summary{cursor:var(--cur-pointer,pointer);color:var(--brand);font-weight:600;font-size:11.5px;width:max-content;margin-top:2px}
.sp-rvc{margin:8px 0 0}
.sp-solvebar{margin:10px 0 0;padding:9px 10px;border:1px solid var(--amber);border-radius:6px;background:var(--panel-2);font-size:12.5px;line-height:1.45;color:var(--text)}
.sp-solvebar .btnrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
/* the Start card: projects this parcel is already in come first */
.sp-haves{display:grid;gap:8px}
.sp-have{display:grid;gap:8px;padding:10px 12px;border:1px solid var(--line-2);border-radius:8px;background:var(--panel-2)}
.sp-have-t{display:grid;gap:2px;min-width:0}.sp-have-t b{font-size:13.5px;overflow-wrap:anywhere}.sp-have-t span{font-size:12px;color:var(--text-2)}
.sp-have .btnrow{display:flex;flex-wrap:wrap;gap:6px}
#card .sp-start .sp-lt-proj{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 4.5v8.5h13V5.5H8L6.5 3.5h-5z'/%3E%3C/svg%3E")}
#card .sp-start .sp-lt-site{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 7 2.5l6.5 2.5v8L9 14.5l-6.5-2z'/%3E%3C/svg%3E")}
#card #spChgSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 13.5l.6-3L10.8 2.8a1.5 1.5 0 0 1 2.1 0l.3.3a1.5 1.5 0 0 1 0 2.1L5.5 12.9z'/%3E%3Cpath d='M9.5 4l2.5 2.5'/%3E%3C/svg%3E")}
#card #spAskSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 2.5h10a1 1 0 0 1 1 1v6.5a1 1 0 0 1-1 1H7.2L4.5 13.5V11H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1z'/%3E%3Cpath d='M6.5 5.4a1.5 1.5 0 1 1 2.1 1.4c-.4.2-.6.5-.6.9v.2'/%3E%3Cpath d='M8 9.4v.01'/%3E%3C/svg%3E")}
.sp-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.sp-tools .btn[aria-pressed="true"]{background:var(--text);color:var(--panel);border-color:var(--text)}
.sp-add i{display:inline-block;width:10px;height:10px;border-radius:2px}
.sp-warn{margin-top:8px;color:var(--amber)}
.sp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:6px}
.sp-grid label{display:grid;gap:3px;font-size:11.5px;color:var(--text-2)}
.sp-grid input,.sp-grid select{width:100%;box-sizing:border-box;min-width:0}
.sp-prog summary{cursor:var(--cur-pointer,pointer);margin-bottom:4px}
.sp-prog .rnote{margin-top:8px}
dl.sp-nums{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:4px 0 8px}
dl.sp-nums dt{color:var(--muted)}dl.sp-nums dd{margin:0;font-weight:600}dl.sp-nums .sc{font-weight:400;color:var(--muted)}
.sp-issues{margin:0 0 8px;padding-left:18px;font-size:12.5px}
.sp-issues li.bad{color:var(--danger)}.sp-issues li.warn{color:var(--amber)}
.sp-ok{color:var(--brand);margin-bottom:6px}
.sp-del{color:var(--danger)}
.sp-draw p{margin:4px 0 10px;font-size:13px;line-height:1.45}


/* the site plan in the card: a full-height column beside the map buttons (not squeezed under them), the header with
   the plan's options, Edit Layout and section chips staying put while the sections scroll, like a property card */
@media (min-width:1101px){
  /* the same dock as a property card, a little wider (see "property card dock") */
  .app:has(#card.sp-mode.open){--cardw:min(480px,calc(100% - 102px))}
}
#card.sp-mode .top{position:sticky;top:0;z-index:3}
#card.sp-mode .sp-plans{flex-basis:100%;margin:10px 0 0;align-items:center}
#card.sp-mode .sp-plans .sp-edit{margin-left:auto}
#card.sp-mode .sp-body{padding-top:0}
.sp-revsw{margin-top:8px;color:var(--text-2)}
.sp-aiv{font-style:normal;font-size:11.5px;color:var(--text);line-height:1.4}.sp-aiv b{color:var(--brand)}
.sp-ideas{display:grid;gap:8px;margin-top:10px}
.sp-idea{border:1px solid var(--line-2);border-radius:6px;padding:10px 12px;display:grid;gap:6px;background:var(--panel)}
.sp-idea-h{display:flex;justify-content:space-between;gap:8px;align-items:baseline}.sp-fit{font:600 11px var(--font-mono);color:var(--brand)}
.sp-idea-w{font-size:12.5px;line-height:1.45;color:var(--text-2)}.sp-idea ul{margin:0;padding-left:18px;font-size:12px;color:var(--amber)}.sp-idea .btn{justify-self:start}
.sp-lib{display:grid;gap:4px;font-size:11.5px;color:var(--text-2);margin-top:8px}.sp-lib select{font:inherit;font-size:13px;padding:6px 8px;border:1px solid var(--line-2);border-radius:4px;background:var(--panel);color:var(--text)}
#card.sp-mode .bsec .sp-tools{margin-top:0}
#card.sp-mode details.bsec>summary{list-style:none;cursor:var(--cur-pointer,pointer)}
#card.sp-mode details.bsec>summary::-webkit-details-marker{display:none}
/* what folds has a chevron that turns when it's open (no "Show" / "Hide" words); the summary stays focusable */
#card.sp-mode details.bsec>summary::after{content:"";flex:none;width:8px;height:8px;margin:0 6px 0 auto;border-right:2px solid var(--text-2);border-bottom:2px solid var(--text-2);transform:translateY(-2px) rotate(45deg);transition:transform var(--dur-fast,150ms) var(--ease,ease)}
#card.sp-mode details.bsec[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
#card.sp-mode details.bsec>summary:focus-visible{outline:2px solid var(--focus);outline-offset:4px;border-radius:4px}
#card #spAiSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5 9.4 6.6 14.5 8l-5.1 1.4L8 14.5 6.6 9.4 1.5 8l5.1-1.4z'/%3E%3C/svg%3E")}
#card #spSel{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 14.5V3l6-1.5v13M9 6h4v8.5M1.5 14.5h13M5 5.5h2M5 8.5h2M5 11.5h2'/%3E%3C/svg%3E")}
#card #spNums{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 3.5h11v10h-11zM2.5 6.5h11M5.5 1.5v3M10.5 1.5v3'/%3E%3C/svg%3E")}
#card #spDrawSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 2a3 3 0 0 0-2.8 4L2.5 11.2a1.4 1.4 0 0 0 2 2L9.7 8a3 3 0 0 0 4-2.8l-1.8 1.1-1.6-.9V3.6L12 2.5A3 3 0 0 0 10.5 2z'/%3E%3C/svg%3E")}
#card #spSiteSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 14.5s5-4.3 5-8.2A5 5 0 0 0 3 6.3c0 3.9 5 8.2 5 8.2z'/%3E%3Ccircle cx='8' cy='6.3' r='1.8'/%3E%3C/svg%3E")}
#card #spParams{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 2h12v12H2zM2 6.5h12M2 10.5h12M6.5 2v12M10.5 2v12'/%3E%3C/svg%3E")}
#card #spPfSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5v13M11.2 4.3c-.6-1-1.8-1.6-3.2-1.6-1.8 0-3.1.9-3.1 2.3 0 3.3 6.5 1.8 6.5 5.2 0 1.4-1.4 2.4-3.4 2.4-1.5 0-2.8-.6-3.4-1.7'/%3E%3C/svg%3E")}
#card #spRender{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 5.5h2.5l1.2-2h4.6l1.2 2H14v8H2z'/%3E%3Ccircle cx='8' cy='9' r='2.6'/%3E%3C/svg%3E")}
#card #spExport{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 1.5h5.5L12.5 4.5v10H4zM9.5 1.5v3h3M6 8h4.5M6 11h4.5'/%3E%3C/svg%3E")}

/* ---------- projects view ---------- */
/* ---------- Projects view: all projects as cards or a list, and a page per project. Laid out by the view's own
   width (container queries), and text wraps instead of being cut off ---------- */
#view-projects{container-type:inline-size}
.pj-wrap{max-width:1180px;margin:0} /* left-aligned like every other page, so the title doesn't jump between pages */
.pj-wrap .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pj-wrap b,.pj-wrap h2,.pj-wrap dd,.pj-wrap span{overflow-wrap:anywhere}
.pj-new{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:14px}
.pj-new input{flex:1 1 240px;min-width:0;font:inherit;font-size:14px;color:var(--text);background:var(--panel-2);border:1px solid var(--line-2);border-radius:6px;padding:8px 10px}
.pj-new input:focus,.pj-ren textarea:focus{outline:none;border-color:var(--brand)}
.pj-new .rnote{flex:0 0 100%;line-height:1.45}
.pj-bar{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;margin-bottom:14px}
.pj-q{flex:1 1 220px;max-width:360px}
.pj-bar .search.sm input{width:100%;min-width:0}
.pj-ctl{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;margin-left:auto}
.pj-sort{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.pj-mode{min-width:170px}
.pj-mode button{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 12px}
.pj-empty{border:1px dashed var(--line-2);border-radius:10px;padding:18px 20px;background:var(--panel);font-size:13.5px;line-height:1.5;color:var(--text-2)}
.pj-empty>b{display:block;font-size:15px;color:var(--text)}
.pj-empty ol{margin:8px 0 14px;padding-left:20px}
.pj-empty li{margin:2px 0}
/* a drawing of a plan (light paper in both themes, like the PDF sheet) */
.pj-thumb{position:relative;display:grid;place-items:center;aspect-ratio:16/10;background:#eceee9;border-radius:6px;overflow:hidden}
.pj-thumb svg{width:100%;height:100%;display:block}
.pj-thumb i{font-style:normal;font-size:12px;color:#6b7174;text-align:center;padding:4px}
.pj-addr{display:flex;gap:6px;align-items:flex-start;font-size:12.5px;line-height:1.4;color:var(--text-2)}
.pj-addr svg{flex:none;margin-top:2px;color:var(--brand)}
/* cards */
.pj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.pj-card{display:grid;grid-template-rows:auto 1fr;gap:10px;text-align:left;border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:8px;color:var(--text);font:inherit;cursor:var(--cur-pointer,pointer);transition:border-color 120ms,box-shadow 120ms}
.pj-card:hover,.pj-plan:hover{border-color:var(--brand);box-shadow:0 2px 12px rgba(11,13,12,.08)}
.pj-card:focus-visible,.pj-row:focus-visible,.pj-plan:focus-visible,.pj-popen:focus-visible,.pj-rth:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.pj-cb{display:grid;gap:7px;align-content:start;padding:0 6px 6px}
.pj-cn{font-family:var(--font-display);font-size:15.5px;font-weight:700;line-height:1.3}
.pj-facts{display:flex;flex-wrap:wrap;gap:6px}
.pj-fact{font-size:11.5px;line-height:1.4;color:var(--text-2);border:1px solid var(--line);background:var(--panel-2);border-radius:999px;padding:2px 9px}
.pj-fact b{font-family:var(--font-mono);font-weight:600;color:var(--text)}
.pj-upd{font-size:11.5px;color:var(--muted)}
/* list */
.pj-list{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel)}
.pj-lh,.pj-row{display:grid;grid-template-columns:84px minmax(0,1fr) 90px 82px 112px 120px 12px;gap:14px;align-items:center;padding:10px 14px}
.pj-lh{padding-top:9px;padding-bottom:9px;border-bottom:1px solid var(--line);font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pj-row{width:100%;border:0;border-top:1px solid var(--line);background:transparent;text-align:left;font:inherit;color:var(--text);cursor:var(--cur-pointer,pointer)}
.pj-lh+.pj-row{border-top:0}
.pj-row:hover{background:var(--panel-2)}
.pj-rthumb{width:84px;border-radius:5px}
.pj-rmain{display:grid;gap:3px;min-width:0}
.pj-rmain>b{font-size:14px;line-height:1.3}
.pj-rstats{display:contents}
.pj-rc{font-size:12px;line-height:1.35;color:var(--muted)}
.pj-rc b{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--text)}
.pj-rc em{font-style:normal}
.pj-chev{font-size:18px;color:var(--muted)}
@container (max-width:760px){
  .pj-lh{display:none}
  .pj-row{grid-template-columns:76px minmax(0,1fr) 12px;row-gap:6px}
  .pj-rthumb{width:76px;grid-column:1;grid-row:1/3;align-self:start}
  .pj-rmain{grid-column:2;grid-row:1}
  .pj-rstats{display:flex;flex-wrap:wrap;gap:2px 12px;grid-column:2;grid-row:2}
  .pj-chev{grid-column:3;grid-row:1/3}
}
/* a project's page */
.pj-back{display:inline-block;font-size:13px;margin-bottom:10px}
.pj-title{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap}
.pj-title h2{margin:4px 0 2px;font-size:22px;line-height:1.25;letter-spacing:-.02em;font-weight:800}
.pj-ren{display:grid;gap:8px;margin:6px 0 4px}
.pj-ren textarea{width:100%;box-sizing:border-box;resize:none;overflow:hidden;font:inherit;font-family:var(--font-display);font-size:19px;font-weight:700;line-height:1.3;color:var(--text);background:var(--panel-2);border:1px solid var(--line-2);border-radius:6px;padding:6px 8px}
.pj-dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px 18px;margin:14px 0 0}
.pj-dl>div{display:grid;gap:3px;align-content:start;min-width:0}
.pj-dl dt{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pj-dl dd{margin:0;font-size:14.5px;font-weight:700;line-height:1.3}
.pj-dl small{display:block;font-size:11.5px;font-weight:400;color:var(--muted);margin-top:1px}
.pj-sec{margin-top:20px}
.pj-sec>.lt{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.pj-prows{border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.pj-prow{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:10px 12px;align-items:center;padding:10px 14px;border-top:1px solid var(--line)}
.pj-prow:first-child{border-top:0}
.pj-pi{color:var(--brand);display:grid}
.pj-pm{display:grid;gap:2px;min-width:0}
.pj-pm b{font-size:13.5px;line-height:1.3}
.pj-pm span{font-size:12px;line-height:1.4;color:var(--muted)}
.pj-plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.pj-plan{position:relative;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:7px;text-align:left;border:1px solid var(--line-2);background:var(--panel);border-radius:8px;padding:7px 7px 10px;color:var(--text);font:inherit;cursor:var(--cur-pointer,pointer);transition:border-color 120ms,box-shadow 120ms}
/* an option's tile: the drawing and its numbers open it; Copy and Delete sit under them */
.pj-plan:not(.pj-add){display:flex;flex-direction:column;padding:0;cursor:var(--cur-default,default)}
.pj-popen{position:relative;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:7px;width:100%;text-align:left;border:0;border-radius:8px;background:none;padding:7px 7px 8px;color:inherit;font:inherit;cursor:var(--cur-pointer,pointer)}
.pj-oline{padding:0 4px;font-size:12px;line-height:1.45;color:var(--text-2)}
.pj-oline .short{color:var(--amber);font-weight:600}
.pj-pact{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;margin-top:auto;padding:7px 11px 9px;border-top:1px solid var(--line)}
.pj-rn{margin-right:auto;font-size:11.5px;color:var(--muted)}
.pj-pact .lnk{font-size:12px}
.lnk.pj-pdel{color:var(--danger)}
.pj-ph{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 10px;padding:0 4px}
.pj-ph b{font-size:13.5px}
.pj-ph em{font-style:normal;font-size:11.5px;line-height:1.35;color:var(--text-2)}
.pj-fin{padding:0 4px;font:600 11px/1.35 var(--font-mono);color:var(--brand)}
.pj-none{font-size:12px;line-height:1.4;color:var(--muted);padding:0 4px}
.pj-iss{position:absolute;top:6px;left:6px;background:var(--danger);color:var(--danger-ink);font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.pj-add{border-style:dashed;background:transparent;align-content:center;justify-items:center;text-align:center;gap:4px;min-height:96px}
.pj-add b{font-size:13.5px}
.pj-plus{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 12%,transparent);color:var(--brand);font-size:22px;line-height:1;margin-bottom:4px}
.pj-start{grid-column:1/-1;border:1px dashed var(--line-2);border-radius:8px;padding:14px 16px;display:grid;gap:8px;background:var(--panel)}
.pj-start>b{font-size:14px}
.pj-start p{margin:0;font-size:12.5px;line-height:1.5;color:var(--text-2)}
.pj-notes{width:100%;box-sizing:border-box;border:1px solid var(--line-2);border-radius:8px;background:var(--panel);color:var(--text);font:inherit;font-size:13.5px;line-height:1.5;padding:9px 11px;resize:vertical}
.pj-notes:focus{outline:none;border-color:var(--brand)}
.pj-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px}
.lnk.pj-del{color:var(--danger);font-weight:600}
@container (max-width:640px){
  .pj-title h2{font-size:19px}
  .pj-dl{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container (max-width:520px){
  .pj-q{max-width:none;flex-basis:100%}
  .pj-ctl{margin-left:0;width:100%;justify-content:space-between}
  .pj-grid{grid-template-columns:minmax(0,1fr)}
  .pj-plans{grid-template-columns:minmax(0,1fr)}
  .pj-popen{grid-template-columns:116px minmax(0,1fr);column-gap:10px;row-gap:4px;padding:6px}
  .pj-popen .pj-thumb{grid-row:1/5;align-self:start}
  .pj-popen .pj-ph{flex-direction:column;gap:0;padding:2px 0 0}
  .pj-popen .pj-oline,.pj-popen .pj-fin,.pj-popen .pj-none{padding:0}
  .pj-add{grid-template-columns:auto auto;min-height:0;justify-content:center;padding:10px}
  .pj-add .pj-plus{width:28px;height:28px;font-size:18px;margin:0}
  .pj-add .pj-none{display:none}
  .pj-prow{grid-template-columns:18px minmax(0,1fr)}
  .pj-prow .btn{grid-column:2;justify-self:start}
}
/* a project's page: the header, the tabs (the Market page's tab look, in one row that scrolls on narrow screens) */
.pj-head{margin-bottom:12px}
.pj-hmeta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 16px;margin-top:6px;font-size:12.5px;color:var(--text-2)}
.pj-hmeta .pj-addr{font-size:12.5px}
.pj-hac b{font-family:var(--font-mono);font-weight:600;color:var(--text)}
.pj-st{--sc:var(--text-2);--sb:var(--chip);display:inline-flex}
.pj-st select{appearance:none;-webkit-appearance:none;border:1px solid color-mix(in srgb,var(--sc) 35%,transparent);background:var(--sb) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23666' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right 9px center;color:var(--sc);border-radius:999px;padding:4px 26px 4px 11px;font:600 12px/1.3 var(--font-display);cursor:var(--cur-pointer,pointer)}
.pj-st select:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.pj-st[data-st="review"]{--sc:#8a5a00;--sb:color-mix(in srgb,var(--amber) 14%,var(--panel))}
.pj-st[data-st="contract"]{--sc:var(--green-800);--sb:var(--green-100)}
.pj-st[data-st="owned"]{--sc:#fff;--sb:var(--green-600)}
.pj-st[data-st="owned"] select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23fff' stroke-width='1.4'/%3E%3C/svg%3E")}
.pj-st[data-st="hold"]{--sc:var(--muted);--sb:var(--panel-2)}
.pj-st[data-st="dead"]{--sc:var(--danger);--sb:color-mix(in srgb,var(--danger) 9%,var(--panel))}
.pj-st select option{color:var(--text);background:var(--panel)}
.pj-stp{display:inline-block;width:max-content;border:1px solid color-mix(in srgb,var(--sc) 35%,transparent);background:var(--sb);color:var(--sc);border-radius:999px;padding:1px 9px;font:600 11px/1.5 var(--font-display)}
.pj-cb>.pj-st,.pj-rmain>.pj-st{justify-self:start}
.mx-tabs.pj-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 0 16px;padding:2px 2px 10px;border-bottom:1px solid var(--line)}
.pj-tabs::-webkit-scrollbar{display:none}
.mx-tabs.pj-tabs.more{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)} /* fades out on the right while more tabs are off-screen (phones) */
@media (pointer:coarse){.pj-kbhint{display:none}} /* Enter-to-ask means nothing on a touch screen */
.mx-tabs.pj-tabs button{flex:none;padding:6px 14px;font-size:13px}
.pj-tabs button:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.pj-tn{font-weight:400;opacity:.8}
.pj-h3{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:0 0 12px;font:700 14px/1.3 var(--font-display);color:var(--text)}
.pj-h3 .pj-tn{font-size:12px;color:var(--muted)}
.pj-box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;min-width:0}
.pj-sec0{margin-top:0}
/* Overview: the project's information beside the site's jurisdiction, then the parcels */
.pj-ov{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px;align-items:start}
.pj-ib{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:16px;align-items:start}
.pj-ib .pj-dl{margin:0;grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.pj-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.pj-f{display:grid;gap:5px;min-width:0}
.pj-fw{grid-column:1/-1}
.pj-f label{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pj-f input{width:100%;box-sizing:border-box;border:1px solid var(--line-2);border-radius:8px;background:var(--panel);color:var(--text);font:inherit;font-size:13.5px;padding:8px 11px}
.pj-f input:focus{outline:none;border-color:var(--brand)}
.pj-jur{display:grid;margin:0}
.pj-jr{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px;padding:9px 0;border-top:1px solid var(--line)}
.pj-jr:first-child{border-top:0;padding-top:0}
.pj-jr dt{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-top:2px}
.pj-jr dd{margin:0;display:grid;gap:2px;min-width:0}
.pj-jr dd b{font-size:13.5px;line-height:1.35}
.pj-jr dd small,.pj-jr dd li{font-size:12px;line-height:1.45;color:var(--text-2)}
.pj-jr dd ul{margin:0;padding-left:16px}
.pj-jr.warn dd b{color:var(--amber)}
.pj-jr.good dd b{color:var(--green-700)}
.pj-jr.muted dd b{color:var(--muted);font-weight:600}
.pj-src{font-size:11px;color:var(--muted)}
.pj-src::before{content:"Source: "}
.pj-jfoot{display:flex;justify-content:space-between;align-items:baseline;gap:6px 14px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.pj-jnote{margin:8px 0 0;line-height:1.45}
/* Renderings: grouped by option */
.pj-rg+.pj-rg{margin-top:22px}
/* Plans tab: make a plan set (sections as checkboxes), the sets made */
.ps-form{display:grid;gap:14px;max-width:880px;margin-bottom:18px}
.ps-row{display:grid;gap:5px;font-size:13px;min-width:0;align-content:start}.ps-row label{font-weight:600;color:var(--text-2)}.ps-row select,.ps-row input{font:inherit;width:100%;max-width:420px;min-width:0;box-sizing:border-box;padding:8px 10px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg);color:var(--text);text-overflow:ellipsis}
.ps-row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 18px}
.rs-grid{grid-template-columns:repeat(4,minmax(0,1fr))}@media (max-width:820px){.rs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:460px){.rs-grid{grid-template-columns:1fr}}
.ps-form .pj-h3{margin:0}.ps-form .btnrow{margin-top:2px}
.ps-secs{border:0;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:6px}.ps-secs legend{font-weight:600;color:var(--text-2);font-size:13px;margin-bottom:6px}
.ps-sec input{accent-color:var(--green-700)}
.ps-sec{display:flex;gap:9px;align-items:flex-start;padding:8px 10px;border:1px solid var(--line);border-radius:9px;cursor:var(--cur-pointer,pointer);font-size:13px;line-height:1.35}.ps-sec input{margin-top:2px}
.ps-sec b{font-weight:600}.ps-sec em{font-style:normal;color:var(--text-2);margin-left:6px;font-size:12px}.ps-sec small{display:block;color:var(--text-2);font-size:12px}
.ps-sec.off{cursor:var(--cur-default,default);opacity:.62}
.ps-list{display:grid;gap:8px}.ps-item{display:flex;justify-content:space-between;align-items:center;gap:10px 16px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font-size:13px}
.ps-job{display:grid;gap:10px;max-width:880px;margin-bottom:16px;border-color:var(--green-300)}
.ps-bar{height:10px;border-radius:5px;background:var(--ink-100);overflow:hidden}.ps-bar i{display:block;height:100%;background:var(--green-700);transition:width .6s}
.ps-stat{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px;color:var(--text-2)}.ps-stat b{color:var(--text);font-size:15px}.ps-stat .err{color:#b3261e}
.ps-steps summary{cursor:var(--cur-pointer,pointer);font-size:13px;font-weight:600;color:var(--text-2)}.ps-sg{margin-top:8px}.ps-sg>b{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-2)}
.ps-sg ul{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:2px 14px;max-height:340px;overflow:auto}
.ps-sg li{display:flex;gap:6px;align-items:baseline;font-size:12.5px;line-height:1.35;min-width:0}.ps-sg li i{font-style:normal;flex:none;width:12px;color:var(--text-2)}.ps-sg li span{min-width:0;overflow-wrap:anywhere}
.ps-sg li em{font-style:normal;color:var(--text-2);font-size:11.5px}.ps-sg li small{margin-left:auto;color:var(--text-2);flex:none}
.ps-sg li.st-done i{color:var(--green-700)}.ps-sg li.st-doing i{color:var(--green-600)}.ps-sg li.st-doing span{font-weight:600}.ps-sg li.st-failed i,.ps-sg li.st-failed em{color:#b3261e}.ps-sg li.st-skipped{opacity:.8}
.ps-types{font-size:12.5px;line-height:1.7;color:var(--text-2)}.ps-types>b{color:var(--text);margin-right:6px}.ps-types .tag{display:inline-block;border:1px solid var(--line-2);border-radius:4px;padding:0 5px;font-weight:700;color:var(--text);font-size:11px}.ps-types small{display:block;font-size:12px}
.ps-item b{display:block}.ps-item span{color:var(--text-2)}.ps-item small{display:block;color:var(--text-2);font-size:12px;margin-top:2px;word-break:break-word}
.pj-rgh{display:flex;justify-content:space-between;align-items:baseline;gap:6px 16px;flex-wrap:wrap;margin-bottom:10px}
.pj-rgh .pj-h3{margin:0}
.pj-rgl{display:flex;gap:16px}
.pj-rgl .lnk{font-size:12.5px}
.pj-rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:12px}
.pj-rth{margin:0;cursor:var(--cur-pointer,pointer);border:1px solid var(--line-2);border-radius:8px;overflow:hidden;background:var(--panel);transition:border-color 120ms,box-shadow 120ms}
.pj-rth:hover{border-color:var(--brand);box-shadow:0 2px 12px rgba(11,13,12,.08)}
.pj-rimg{position:relative;display:grid;place-items:center;aspect-ratio:16/9;background:#e6e9eb}
.pj-rimg img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover} /* a square or 3:2 picture (a model without 1080p) keeps the tile 16:9 */
.pj-rimg i{font-style:normal;font-size:12px;color:var(--muted);text-align:center;padding:8px}
.pj-rth figcaption{padding:7px 10px;font:600 12.5px/1.35 var(--font-display);color:var(--text)}
.pj-rth figcaption span{display:block;font-weight:400;color:var(--text-2);font-size:11.5px}
.pj-rth.stale img{filter:grayscale(.5)}
.pj-rth figcaption em{font-style:normal;color:var(--danger)}
.pj-rth.gone{cursor:var(--cur-default,default);opacity:.6}
.pj-rth.gone:hover{border-color:var(--line-2);box-shadow:none}
.pj-rnote{margin-top:18px;line-height:1.5;max-width:760px}
.pj-rempty p{margin:6px 0 0}
/* Ask: the plan panel's question box, on the page */
.pj-ask{max-width:820px;display:grid;gap:12px}
.pj-ask .sp-ai-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.pj-ask .sp-ai-h .pj-h3{margin:0}
.pj-ask .sp-ai-h .sp-link{font-size:12px;padding:0}
.pj-ask .sp-convo{max-height:min(560px,60vh)}
.pj-ask .sp-q{font-size:13px}
.pj-ask .sp-a{font-size:13.5px}
.pj-ask .sp-sugs{margin-top:0}
.pj-ask .sp-sugs .chip{background:var(--panel);border-style:dashed;color:var(--text-2);white-space:normal;text-align:left;line-height:1.3;padding:5px 10px}
.pj-ask .sp-sugs .chip:hover:not(:disabled){border-style:solid;border-color:var(--brand);color:var(--text)}
.pj-ask textarea{min-height:64px;margin-top:0;padding:9px 11px;border-radius:8px;font-size:13.5px;line-height:1.45}
.pj-ask textarea:focus-visible{outline:2px solid var(--brand);outline-offset:0}
.pj-ask .sp-go2{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.pj-ask .sp-go2 .btn{min-height:40px;padding:0 18px}
.pj-rimg img[hidden]{display:none}
@container (max-width:560px){
  .pj-box{padding:12px}
  .pj-ib{grid-template-columns:minmax(0,1fr)}
  .pj-ib .pj-thumb{max-width:320px}
  .pj-fields{grid-template-columns:minmax(0,1fr)}
  .pj-jr{grid-template-columns:minmax(0,1fr);gap:3px}
  .pj-hmeta{gap:6px 12px}
  .mx-tabs.pj-tabs button{padding:6px 12px}
}
.sp-parcels{display:flex;flex-wrap:wrap;gap:5px;margin:4px 0 6px}
.sp-parcels .chip{font-size:11.5px;padding:2px 4px 2px 8px;min-height:0;cursor:var(--cur-default,default)}
.sp-x{border:0;background:transparent;color:var(--muted);font-size:14px;line-height:1;padding:0 4px;cursor:var(--cur-pointer,pointer)}
.sp-x:hover{color:var(--text)}
.sp-grid .sp-wide{grid-column:1 / -1}

/* ================= foundations: touch targets, roomy pages ================= */
/* touch screens: every tappable control is at least a fingertip (44px) */
@media (pointer:coarse){
  /* min-width only on fixed-size controls, and they never shrink: a min-width on a flex item would otherwise let it squash
     below its label (buttons with text are wider than a fingertip anyway) */
  .qchip,.mfilt,.ctrls button,.tools button,.btn{min-height:var(--tap)}
  .qchip,.mfilt,.ctrls button,.tools button{min-width:var(--tap);flex-shrink:0}
  .mfilt,.ctrls button{width:var(--tap);height:var(--tap)}
  .tools button{height:var(--tap)}
  .qchip{height:var(--tap)}
}
@media (max-width:700px){ .mnav button{font-size:var(--fs-xs)} }
@media (max-width:700px) and (pointer:coarse){
  .tools button{width:var(--tap);height:var(--tap)}
  /* the taller search-bar buttons and layer chips still fit between the search bar and the map buttons */
  .mask{padding-top:2px;padding-bottom:2px}
  .mapleft .qlayers{top:-48px}
}
/* pages (every view except the Map) use the full width: the list panel hides there and comes back on the Map at the
   width the user left it. On a page the list button shows it over that page only, without changing the Map's setting. */
@media (min-width:701px){
  .app:not([data-view="map"]) .panel,.app:not([data-view="map"]) .presize{display:none}
  .app:not([data-view="map"]){grid-template-columns:minmax(0,1fr)}
  .app.pview-open:not([data-view="map"]) .panel{display:flex}
  .app.pview-open:not([data-view="map"]){grid-template-columns:var(--pw) minmax(0,1fr)}
}
/* the closed assistant drawer sits just off the right edge; clip it so it can't widen the page on tablets */
.viewport{overflow:hidden;overflow:clip}

/* ================= navigation: app bar, sub-tabs, phone bar and More sheet (drawn from src/nav.js) ================= */
:root{--appbar-h:52px;--vtabs-h:50px}
.appbar,.vtabs{display:none}
.badge.muted{background:transparent;color:var(--muted);padding:0;font-weight:500;font-size:11px}
@media (min-width:701px){
  /* one full-width bar on top; the Map's panel and the map (or a page) share the row under it */
  .app{grid-template-rows:auto minmax(0,1fr)}
  .appbar{grid-column:1/-1;grid-row:1;display:flex;align-items:center;gap:var(--sp-2);height:var(--appbar-h);padding:0 var(--sp-3);background:var(--panel);border-bottom:1px solid var(--line);position:relative;z-index:12;min-width:0}
  .panel,.stage,.presize{grid-row:2}
  .stage{grid-template-rows:minmax(0,1fr)}
  .appbar .ptoggle{display:inline-flex;flex:none;width:36px;height:36px;justify-content:center;padding:0;border-radius:var(--r-sm)}
  .appbar .ptoggle:hover{background:var(--chip);color:var(--text)}
  .ab-logo{display:block;height:26px;width:auto;flex:none;margin:0 var(--sp-3) 0 var(--sp-1)}
  .appbar .viewbar{flex:1 1 auto;min-width:0;gap:2px;padding:0;border:0;background:transparent;overflow-x:auto;z-index:auto}
  .appbar .viewbar button{padding:8px 13px;font-size:13.5px;border-radius:var(--r-sm)}
  .ab-util{display:flex;align-items:center;gap:6px;flex:none;position:relative;margin-left:auto}
  .ab-ask{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px 0 12px;border:0;border-radius:var(--r-pill);background:var(--brand);color:var(--brand-ink);font-weight:700;font-size:13px;cursor:var(--cur-pointer,pointer);white-space:nowrap}
  .ab-ask:hover{background:color-mix(in srgb,var(--brand) 85%,var(--text))}
  .app.ai-open .ab-ask{background:var(--panel);color:var(--brand);box-shadow:inset 0 0 0 1.5px var(--brand)}
  .ab-ic{display:grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--panel);color:var(--text-2);font:700 15px var(--font-display);cursor:var(--cur-pointer,pointer)}
  .ab-ic:hover{border-color:var(--text-2);color:var(--text)}
  .ab-ic[aria-pressed="true"],.ab-ic[aria-expanded="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
  .ab-pop{position:absolute;top:calc(100% + 10px);right:0;width:280px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-md);box-shadow:var(--sh-sheet);padding:12px 14px 14px;display:grid;gap:10px}
  .ab-pop[hidden]{display:none}
  .ab-pop-h{font:700 14px var(--font-display);color:var(--text)}
  .ab-pop-r{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--text-2)}
  .ab-pop-r .seg{width:150px}
  .ab-pop-r .seg button{padding:6px 0}
  /* Ask AI lives in the app bar on every page, so the floating button is for phones only */
  .ai-fab{display:none!important}
  /* narrow windows: the logo and the Ask AI label give way before the tabs would */
  @media (max-width:900px){ .ab-logo{display:none} }
  @media (max-width:780px){ .ab-ask span{display:none} .ab-ask{width:36px;padding:0;justify-content:center} .appbar .viewbar button{padding:8px 10px} }
}
/* sub-tabs: the pages of a group (Market, Filings, My Work) above each of its pages */
.app[data-vgroup] .vtabs{display:flex;position:absolute;left:0;right:0;top:0;z-index:4;height:var(--vtabs-h);align-items:center;padding:0 24px;background:var(--panel-2);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.vtabs::-webkit-scrollbar{display:none}
.app[data-vgroup] .view{top:var(--vtabs-h)}
.vt-row{display:flex;gap:6px;flex:none}
.vt-row[hidden]{display:none}
.vt-row button{flex:none;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);background:var(--panel);border-radius:var(--r-pill);padding:6px 14px;font:600 12.5px var(--font-display);color:var(--text-2);cursor:var(--cur-pointer,pointer);white-space:nowrap}
.vt-row button:hover{border-color:var(--text-2);color:var(--text)}
.vt-row button[aria-current="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
.vt-row button[aria-current="true"] .badge.muted{color:inherit;opacity:.7}
.viewbar button[aria-pressed="true"] .badge.muted{color:inherit;opacity:.7}
@media (pointer:coarse){ :root{--vtabs-h:58px} .vt-row button{min-height:var(--tap)} }
/* My Work › Saved searches */
.svp{display:grid;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);max-width:900px}
.svp-r{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--line);font-size:13.5px}
.svp-r:first-child{border-top:0}
.svp-a{display:flex;gap:8px;flex-wrap:wrap}
@media (max-width:700px){
  :root{--vtabs-h:calc(54px + var(--st))}
  .app[data-vgroup] .vtabs{padding:var(--st) 14px 0}
  .app[data-vgroup] .view{padding-top:14px}
  /* the More sheet: rows in groups, scrolling if the phone is short */
  .msheet{max-height:calc(100% - var(--navh) - var(--sb) - var(--st) - 24px);overflow-y:auto}
  .msheet .msh-top{margin:0 -14px}
  .msheet .mt-h{margin:12px 4px 6px}
  .msheet .mrows{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);overflow:hidden}
  .msheet .mrow{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;min-height:48px;padding:7px 12px;border:0;border-top:1px solid var(--line);background:none;font:600 15px var(--font-display);color:var(--text);text-align:left}
  .msheet .mrows>.mrow:first-child{border-top:0}
  .msheet .mrow[hidden]{display:none}
  .msheet .mrow:active{background:var(--panel-2)}
  .msheet .mr-ic{display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:50%;background:var(--panel-2);color:var(--brand);font-style:normal}
  .msheet .mr-l{flex:1;min-width:0}
  .msheet .mr-chev{flex:none;color:var(--muted)}
  .msheet .mrow .badge{position:static}
}

/* ================= Settings sheet (src/settings.js): a right-hand sheet on desktop, full screen on phones ================= */
.set-scrim{position:fixed;inset:0;z-index:50;background:rgba(11,13,12,.32);opacity:0;transition:opacity 180ms}
.set-scrim.on{opacity:1}
.set-scrim[hidden],.setsheet[hidden]{display:none}
.setsheet{position:fixed;top:0;right:0;bottom:0;z-index:51;width:420px;max-width:100%;display:flex;flex-direction:column;background:var(--panel);color:var(--text);border-left:1px solid var(--line-2);box-shadow:var(--sh-sheet);transform:translateX(24px);opacity:0;transition:transform 200ms cubic-bezier(.2,.7,.2,1),opacity 160ms;outline:none}
.setsheet.on{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){ .setsheet,.set-scrim{transition:none} }
.set-h{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:14px 14px 10px 22px;flex:none}
.set-h h2{margin:0;font:800 20px var(--font-display);letter-spacing:-.01em}
.set-x{display:grid;place-items:center;width:var(--ctl);height:var(--ctl);border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--panel);color:var(--text-2);cursor:var(--cur-pointer,pointer)}
.set-x:hover{color:var(--text);border-color:var(--text-2)}
.set-jump{display:flex;gap:5px;padding:0 22px 12px;overflow-x:auto;scrollbar-width:none;flex:none;border-bottom:1px solid var(--line)}
.set-jump::-webkit-scrollbar{display:none}
.set-jump button{flex:none;border:1px solid var(--line-2);background:var(--panel);border-radius:var(--r-pill);padding:5px 10px;font:600 12px var(--font-display);color:var(--text-2);cursor:var(--cur-pointer,pointer);white-space:nowrap}
.set-jump button:hover{color:var(--text);border-color:var(--text-2)}
.set-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:6px 22px 32px;scroll-padding-top:8px}
.set-sec{padding:18px 0 6px;border-bottom:1px solid var(--line);scroll-margin-top:4px;border-radius:var(--r-sm)}
.set-sec:last-child{border-bottom:0}
.set-sec.flash h3{color:var(--brand)}
.set-sec h3{margin:0 0 10px;font:600 10.5px var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);transition:color 600ms}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:10px 0;border-top:1px solid var(--line)}
.set-in>.set-row:first-child{border-top:0;padding-top:2px}
.set-rl{display:grid;gap:3px;min-width:0;flex:1 1 auto}
.set-rc{flex:none;display:flex;align-items:center;gap:8px;max-width:60%}
.set-l{font-size:13.5px;font-weight:600;color:var(--text)}
.set-hint{font-size:12px;line-height:1.45;color:var(--muted)}
.set-rc .set-hint{text-align:right}
.set-ok{font-size:13px;font-weight:600;color:var(--brand)}
.set-note{font-size:12.5px;line-height:1.45;color:var(--text-2);background:var(--panel-2);border-radius:var(--r-sm);padding:9px 11px}
.set-usage{margin-top:14px;display:flex;flex-direction:column;gap:8px}
.set-uh{display:flex;align-items:center;gap:8px}
.set-uh .set-l{margin-right:auto}
.set-ut-w{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-sm)}
.set-ut{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}
.set-ut th{font:500 10.5px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:right;padding:7px 6px;border-bottom:1px solid var(--line);white-space:nowrap}
.set-ut td{text-align:right;padding:6px 6px;border-bottom:1px solid var(--line);white-space:nowrap}
.set-ut th:first-child,.set-ut td:first-child{text-align:left}
.set-ut tr:last-child td{border-bottom:0}
.set-ut tr.tot td{font-weight:600;background:var(--panel-2)}
.set-ut tr.dim td{color:var(--muted)}
.set-ut td[colspan]{white-space:normal;text-align:left}
.set-ut sup{color:var(--muted);margin-left:2px}
.set-ut-r{color:var(--muted);font-size:11px}
.set-uf{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--text-2)}
.set-uf b{font-weight:600;color:var(--text)}
.set-prices>summary{cursor:var(--cur-pointer,pointer);font-size:12.5px;font-weight:600;color:var(--brand)}
.set-prices .set-hint{margin:6px 0}
.set-pt{width:100%;border-collapse:collapse;font-size:12px}
.set-pt th{font:500 10.5px var(--font-mono);text-transform:uppercase;color:var(--muted);text-align:left;padding:4px}
.set-pt td{padding:3px 4px}
.set-pt td:first-child{white-space:nowrap;padding-right:8px}
.set-pt input{width:100%;min-width:56px;font:inherit;padding:4px 6px;border:1px solid var(--line-2);border-radius:6px;background:var(--panel)}
.set-pa{margin-top:6px;display:flex;justify-content:flex-end}
.set-note.warn{color:var(--text);box-shadow:inset 3px 0 0 var(--warn)}
.set-note.err{color:var(--danger)}
.setsheet .seg{grid-template-columns:repeat(3,auto);border-radius:var(--r-sm)}
.setsheet .seg button{padding:7px 11px;white-space:nowrap}
.setsheet .seg button[aria-checked="true"]{background:var(--text);color:var(--panel)}
.setsheet select.chip{min-height:var(--ctl);padding-left:10px;font-size:13px;color:var(--text);min-width:150px}
.set-links{display:grid;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;margin:6px 0 10px}
.set-go{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:11px 14px;border:0;border-top:1px solid var(--line);background:var(--panel);text-align:left;cursor:var(--cur-pointer,pointer);color:var(--text)}
.set-go:first-child{border-top:0}
.set-go:hover{background:var(--panel-2)}
.set-go span{display:grid;gap:2px;min-width:0}
.set-go b{font-size:13.5px}
.set-go em{font-style:normal;font-size:12px;color:var(--muted)}
.set-go svg{flex:none;color:var(--muted)}
.set-saved{list-style:none;margin:0 0 10px;padding:0;display:grid}
.set-saved li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:13.5px;color:var(--text-2)}
.set-saved li:first-child{border-top:0;padding-top:0}
.set-saved b{color:var(--text);font-variant-numeric:tabular-nums}
.set-saved .lnk{font-size:13px}
.set-keys{padding:10px 0;border-top:1px solid var(--line)}
.set-in>.set-keys:first-child{border-top:0}
.set-keys dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px;margin:8px 0 0}
.set-keys dl div{display:flex;align-items:center;gap:8px;min-width:0}
.set-keys dt{flex:none}
.set-keys dd{margin:0;font-size:12.5px;color:var(--text-2);min-width:0}
.set-keys kbd{display:inline-block;min-width:26px;padding:2px 6px;border:1px solid var(--line-2);border-bottom-width:2px;border-radius:5px;background:var(--panel-2);font:600 11.5px var(--font-mono);color:var(--text);text-align:center}
/* You & your team, inside the sheet (drawn by src/team.js) */
.setsheet .team{margin:0;max-width:none;gap:12px}
.setsheet .team-on{padding:9px 11px;background:var(--panel-2);border-radius:var(--r-sm)}
.setsheet .team-on span{font-size:12.5px}
.team-on .dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--muted);margin-right:7px;vertical-align:1px}
.team-on .dot.on{background:var(--brand)}
.set-field{display:grid;gap:5px;margin:0}
.set-field input{width:100%;min-width:0;min-height:var(--ctl);border:1px solid var(--line-2);border-radius:var(--r-sm);padding:7px 10px;font:inherit;font-size:13.5px;background:var(--panel);color:var(--text)}
.set-field input:focus{outline:2px solid color-mix(in srgb,var(--brand) 50%,transparent);outline-offset:0;border-color:var(--brand)}
.set-inline{display:flex;align-items:center;gap:8px}
.set-inline input{flex:1 1 auto}
.set-mask{flex:1 1 auto;font-family:var(--font-mono);letter-spacing:.2em;color:var(--text-2)}
/* the one-line team chip in the Notes & watchlist and Projects headers */
.team-slot:empty{display:none}
.team-slot{margin-top:8px}
.team-chip{display:inline-flex;align-items:center;gap:7px;max-width:100%;border:1px solid var(--line-2);background:var(--panel);border-radius:var(--r-pill);padding:4px 11px 4px 9px;font:600 12px var(--font-display);color:var(--text-2);cursor:var(--cur-pointer,pointer)}
.team-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.team-chip svg{flex:none;color:var(--brand)}
.team-chip:hover{color:var(--text);border-color:var(--text-2)}
.team-chip.warn{border-color:var(--warn);color:var(--text)}
/* Data & help: one muted line in place of the old options */
/* while Settings is open the toast moves to <body> (src/settings.js), so a message raised from it shows over the sheet, centred on it */
body>.toast{position:fixed;z-index:52;left:calc(100% - min(420px,100%) / 2);bottom:calc(22px + var(--sb,0px));width:max-content;max-width:min(388px,calc(100% - 32px))}
.src-opt.muted{color:var(--muted);font-size:12.5px}
.src-opt.muted b{color:var(--text-2)}
.src-opt.muted .lnk{font-size:12.5px}
/* a layer the site can't offer */
.ly-na{display:block;font-size:11.5px;font-weight:400;color:var(--muted);margin-top:1px}
/* the phone Explore gear, in the scope header (desktop uses the app bar's) */
.head-gear{display:none}
@media (max-width:700px){
  .head-gear{display:grid;place-items:center;flex:none;width:var(--tap);height:var(--tap);border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--panel);color:var(--text-2);cursor:var(--cur-pointer,pointer)}
  .set-scrim{display:none}
  .setsheet{width:100%;border-left:0;transform:translateY(16px);padding-top:var(--st);padding-bottom:var(--sb)}
  .set-h{padding:10px 12px 8px 18px}
  .set-x{width:var(--tap);height:var(--tap)}
  .set-jump{padding:0 18px 10px;flex-wrap:wrap;gap:6px 4px} /* every section button stays in view on a narrow phone */
  .set-jump button{padding:5px 7px}
  .set-body{padding:4px 18px 28px}
  .set-rc{max-width:55%}
  .setsheet .seg button{padding:10px 9px;min-height:var(--tap)}
  .set-keys dl{grid-template-columns:minmax(0,1fr)}
  .set-desk{display:none}
}
@media (pointer:coarse){ .set-go{min-height:var(--tap)} .set-jump button{min-height:36px} .team-chip{min-height:36px} }

/* ---------- Pages that flow: one header template, scope bar, empty states, Export ▾ menus (WS4) ---------- */
/* header: title column (kicker = page name, title, a 2-line summary) | actions on the same row; stacked on phones */
/* a wrapping row, not a fixed 2-column grid: when the page is narrowed (a card or the assistant open beside it on a small
   desktop) the actions drop under the title instead of squeezing it until it runs into them */
.vhead{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--sp-3) var(--sp-4)}
.vhead>div:first-child{min-width:0;flex:1 1 300px}
.vhead .vsub{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.vhead>.vctl,.vhead>.btn{margin-left:auto;justify-content:flex-end;max-width:100%}
.vhead .team-slot:empty{display:none}
.vctl .team-slot{margin:0}
.vfoot{margin:10px 2px 0;font-size:12px;color:var(--muted)}
@media (max-width:700px){
  .vhead{align-items:flex-start}
  .vhead>div:first-child{flex-basis:100%}
  .vhead>.vctl{margin-left:0;flex:1 1 100%;justify-content:flex-start}
  .vhead>.btn{margin-left:0}
}
/* scope bar under a page header: what the page is counting, the filters as removable chips, Edit filters / Reset */
.vscope{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin:0 0 14px;padding:8px 10px 8px 14px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-md);font-size:12.5px;color:var(--text-2)}
.vscope:empty{display:none}
.vs-n b{font-family:var(--font-mono);font-weight:600;color:var(--text)}
.vs-chips{display:flex;flex-wrap:wrap;gap:6px;min-width:0;flex:1 1 240px}
.vs-chip{display:inline-flex;align-items:center;gap:2px;max-width:100%;padding:2px 2px 2px 10px;border-radius:var(--r-pill);background:var(--chip);color:var(--text);font-size:12px;line-height:20px}
.vs-chip.fixed{padding-right:10px;color:var(--text-2);background:transparent;border:1px dashed var(--line-2)}
.vs-chip button{width:22px;height:22px;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:15px;line-height:1;cursor:var(--cur-pointer,pointer);flex:none}
.vs-chip button:hover{background:var(--line-2);color:var(--text)}
.vs-act{display:flex;gap:6px;margin-left:auto}
.vs-act [aria-expanded="true"]{border-color:var(--text);background:var(--chip)}
@media (pointer:coarse){ .vs-chip button{width:32px;height:32px} }
/* empty state: icon, title, one sentence, buttons */
.vempty{display:grid;justify-items:center;gap:8px;text-align:center;padding:32px 20px 28px;margin:4px auto 16px;max-width:620px;background:var(--panel);border:1px dashed var(--line-2);border-radius:var(--r-md);color:var(--text-2);font-size:13px}
.vempty .ve-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(0,101,39,.09);color:var(--brand)}
.vempty>b{font:700 16px/1.3 var(--font-display);color:var(--text)}
.vempty>p{margin:0;max-width:460px;line-height:1.5}
.vempty ol{text-align:left;margin:4px 0 0;padding-left:20px;line-height:1.7;max-width:480px}
.vempty ol em{font-style:normal;font-weight:700;color:var(--text)}
.vempty .ve-act{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:6px}
.view .fcols>section .vempty,td .vempty,.rp-list .vempty{border:0;background:transparent;margin:0 auto}
table.who tr.nomatch td{border:0}
/* Export ▾ and other small menus (a <details>) */
.vmenu{position:relative;display:inline-block}
.vmenu>summary{list-style:none;cursor:var(--cur-pointer,pointer);user-select:none}
.vmenu>summary::-webkit-details-marker{display:none}
.vmenu[open]>summary{border-color:var(--text);background:var(--chip)}
.vm-pop{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:230px;max-width:min(320px,calc(100vw - 24px));padding:6px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-md);box-shadow:var(--sh-2);display:grid;gap:2px;text-align:left}
.vm-pop>button,.vm-pop>label{display:block;width:100%;border:0;background:transparent;border-radius:6px;padding:8px 10px;font:600 13px/1.3 var(--font-display);color:var(--text);text-align:left;cursor:var(--cur-pointer,pointer)}
.vm-pop>button:hover,.vm-pop>label:hover,.vm-pop>button:focus-visible,.vm-pop>label:focus-visible{background:var(--chip)}
.vm-pop>:focus-visible{outline-offset:-2px}
.vm-pop em{display:block;font:400 11.5px/1.35 var(--font-body,inherit);color:var(--muted);font-style:normal;margin-top:1px}
.vm-pop hr{border:0;border-top:1px solid var(--line);margin:4px 2px}
@media (max-width:700px){ .vm-pop{right:auto;left:0} .vctl .vmenu:last-child .vm-pop{left:auto;right:0} }
/* Filters over a Filings page, Compare or Reports: the map's popup floats under "Edit filters" (construction filters only) */
.fpop.fpop-floating{visibility:visible}
.stage:not([data-view="map"]) .mapleft:has(.fpop-floating:not([hidden])){z-index:8}
.fpop-floating .lfmode,.fpop-floating #lfMatch,.fpop-floating .lfsec:not(#lfFilings),.stage:not([data-view="map"]) #filterPop .lfsec:not(#lfFilings){display:none}
@media (min-width:701px){ .fpop.fpop-floating{position:fixed;width:min(460px,calc(100vw - 16px));z-index:30;box-shadow:var(--sh-sheet)} }
/* "← Back to <page>" after jumping from a page to the map */
.backchip{position:absolute;left:16px;top:16px;z-index:6;display:flex;align-items:stretch;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-pill);box-shadow:var(--sh-2);overflow:hidden}
.backchip[hidden],.stage:not([data-view="map"]) .backchip,.app.ai-open .backchip{display:none}
.backchip button{border:0;background:transparent;color:var(--text);display:inline-flex;align-items:center;gap:7px;cursor:var(--cur-pointer,pointer);min-height:36px}
.backchip .bk-go{padding:0 12px 0 13px;font:700 13px var(--font-display)}
.backchip .bk-x{padding:0 11px;border-left:1px solid var(--line);color:var(--muted)}
.backchip button:hover{background:var(--chip);color:var(--text)}
@media (min-width:701px){ .app.has-back .stage[data-view="map"] .mapleft{margin-top:46px} }
@media (max-width:700px){ .backchip{left:50%;transform:translateX(-50%);top:calc(var(--st) + 112px);max-width:calc(100% - 128px)} .backchip .bk-go{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} }
@media (pointer:coarse){ .backchip button{min-height:44px} }
/* the filing card over a page: Show on map (hidden on the map itself) */
#card .cshow{margin-top:8px}
.stage[data-view="map"] #card .cshow{display:none}
/* Reports: Recent exports first, then the two groups of new reports */
.rp-gh{display:flex;align-items:baseline;justify-content:space-between;gap:6px 12px;flex-wrap:wrap;margin-bottom:10px}
.view .rp-gh .lt{margin:0}
.rp-n{font:500 12px var(--font-mono);color:var(--muted);letter-spacing:0;text-transform:none}
.rp-hint{font-size:12px;color:var(--muted)}
.rp-group .vscope{background:var(--panel-2);margin-bottom:12px}
.rp-card p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.rp-more{margin:10px 2px 2px;font-size:12.5px}
.rp-recent .rp-list .empty{padding:8px 2px;text-align:left}
/* Market: the area as one line, with the county picker folded behind "Change"; boxes without the stand-in icon */
.mk-scopebar{margin:2px 0 12px;background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-md)}
.mk-scopebar>summary{display:flex;align-items:center;gap:10px;padding:9px 14px;list-style:none;cursor:var(--cur-pointer,pointer);font-size:12.5px;color:var(--text-2)}
.mk-scopebar>summary::-webkit-details-marker{display:none}
.mk-scopebar>summary b{color:var(--text)}
.mk-scopebar:not([open])>summary .mk-cls,.mk-scopebar[open]>summary .mk-chg{display:none}
.mk-scopebar .mk-scope2{margin:0;border:0;border-top:1px solid var(--line);border-radius:0 0 var(--r-md) var(--r-md)}
#view-market .mk-box>h3::before{display:none}
/* Companies */
#view-who .seg button{padding:7px 12px}
#view-timeline .g-row .g-lab,#view-timeline .g-axis .g-lab{width:var(--glab,290px)}
@media (max-width:700px){
  /* Changes and Notes rows: name over value */
  .view .chitem{flex-direction:column;align-items:flex-start;gap:3px}
  .view .chitem .m{align-self:flex-start;white-space:normal}
  /* Companies: two-line rows (name, then projects · value · trend) */
  #view-who table.who thead{display:none}
  #view-who table.who tbody tr[data-k]{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;column-gap:12px;row-gap:2px;padding:10px 4px;border-bottom:1px solid var(--line)}
  #view-who table.who tbody tr[data-k] td{border:0;padding:0}
  #view-who table.who tbody tr[data-k] td:nth-child(1){grid-column:1/-1}
  #view-who table.who tbody tr[data-k] td:nth-child(2)::after{content:" projects";font-family:var(--font-body,inherit);color:var(--muted)}
  #view-who table.who tbody tr[data-k] td:nth-child(6){justify-self:end}
  #view-who table.who tbody tr[data-k] td:nth-child(4),#view-who table.who tbody tr[data-k] td:nth-child(5),#view-who table.who tbody tr[data-k] td:nth-child(7){display:none}
  #view-who .tablewrap{padding:0 10px}
}
.vhead .vsub-n{display:block;margin-top:2px;color:var(--text-2)}
.vhead .vsub-n[hidden]{display:none}
.cmp-chips[hidden]{display:none}
.rp-gh .lt{font:700 15px/1.3 var(--font-display);color:var(--text);letter-spacing:0;text-transform:none}
.mk-scopebar .vs-n b{font-family:inherit;font-weight:700}
@media (max-width:700px){
  .vscope{gap:6px 8px;padding:8px 8px 8px 12px}
  .vs-chips{order:3;flex:1 1 100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:1px}
  .vs-chips::-webkit-scrollbar{display:none}
  .vs-chip{flex:none}
  #view-field .vhead>.vctl,#view-projects .vhead>.vctl{flex-wrap:nowrap;gap:8px}
  #view-field .vctl .team-slot,#view-projects .vctl .team-slot{min-width:0;flex:0 1 auto;display:flex}
}
.vctl>.btn,.vctl .vmenu>summary,.vs-act .btn{white-space:nowrap}

/* ================= Map context panel: tip, pinned scope header, saved, glance, area reports, filings ================= */
/* one card style for every block, on the same 14px gutters, so the edges line up */
.panel{--pg:14px}
.panel .psec{background:var(--panel);margin:var(--sp-3) var(--pg) 0;border:1px solid var(--line-2);border-radius:var(--r-md);padding:14px var(--sp-4);display:grid;gap:10px}
.panel .glance.psec{display:block;border-bottom:1px solid var(--line-2)}
.panel .glance.psec:empty{display:none}
.panel .glance .g-h{margin-bottom:10px}
/* tiles: one line each for the value, label and note, so the census numbers take two short rows */
.panel .glance .g-t{padding:8px 10px}
.panel .glance .g-t b{font-size:15px}
.panel .glance .g-t>span,.panel .glance .g-t i{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.panel .glance .g-t i{margin-top:2px}
/* a 28px tinted square holding a line icon in the brand colour (works in both themes) */
.sc-ic,.ar-i,.fs-ic{flex:none;width:28px;height:28px;border-radius:6px;display:grid;place-items:center;background:color-mix(in srgb,var(--brand) 11%,transparent);color:var(--brand);position:relative}
.ar-i::before,.fs-ic::before{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:var(--ic) center/16px no-repeat;mask:var(--ic) center/16px no-repeat}

/* first visit */
.ptip{display:grid;gap:4px;margin:var(--sp-3) var(--pg) 0;padding:var(--sp-3) var(--sp-4);background:var(--panel);border:1px solid var(--line-2);border-left:3px solid var(--brand);border-radius:var(--r-md)}
.ptip[hidden]{display:none}
.ptip-h{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}
.ptip b{font:700 13.5px/1.3 var(--font-display);color:var(--text)}
.ptip-t{margin:0;font-size:12.5px;line-height:1.5;color:var(--text-2)}
.ptip .btn{flex:none;min-height:28px;padding:3px 10px}

/* scope header: pinned to the top of the panel while it scrolls (the grey strip above the card hides what scrolls past) */
.scope{position:sticky;top:0;z-index:4;padding:var(--sp-3) var(--pg) 0;background:var(--panel-2)}
.sc-card{display:grid;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-md);box-shadow:var(--sh-1)}
.sc-r1{display:flex;align-items:center;gap:var(--sp-3);min-width:0}
.sc-nm{flex:1;min-width:0;display:grid}
.sc-k{font:500 10px/1.3 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.sc-nm b{font:700 14.5px/1.3 var(--font-display);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-x{flex:none;width:30px;height:30px;padding:0;border:1px solid var(--line-2);border-radius:var(--r-pill);background:var(--panel);color:var(--text-2);display:grid;place-items:center;cursor:var(--cur-pointer,pointer)}
.sc-x:hover{color:var(--danger);border-color:currentColor}
.sc-r2{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;min-width:0}
.sc-st{flex:1 1 auto;font:500 12px/1.3 var(--font-mono);color:var(--text-2);white-space:nowrap}
.sc-acts{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px;margin-left:auto;min-width:0;max-width:100%} /* wraps instead of spilling past the card when both Compare buttons show in a narrow panel */
.sc-acts>.btn{white-space:nowrap}
.sc-more>summary.btn{min-width:32px;padding:0 8px;justify-content:center}
.sc-more .vm-pop{left:auto;right:0;min-width:260px;z-index:30}
.vm-pop>a{display:block;width:100%;border-radius:6px;padding:8px 10px;font:600 13px/1.3 var(--font-display);color:var(--text);text-decoration:none;box-sizing:border-box}
.vm-pop>a:hover,.vm-pop>a:focus-visible{background:var(--chip)}
.vm-pop>[hidden]{display:none!important}
.sc-save{display:grid;gap:6px;padding:4px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:4px}
.sc-save label{font-size:11.5px;font-weight:600;color:var(--text-2)}
.sc-save span{display:flex;gap:6px}
.sc-save input{flex:1;min-width:0;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:6px 8px;background:var(--panel-2);font-size:13px;color:var(--text)}
.sc-pick{display:flex;align-items:center;gap:6px}
.sc-pick[hidden]{display:none}
.sc-pick>span{flex:none;font-size:12px;color:var(--muted);margin-right:2px}
.sc-pick .btn{flex:1 1 0;min-width:0;justify-content:center;padding-left:6px;padding-right:6px}

/* saved searches: a compact list under the scope header */
.panel details.saved.psec{display:block;padding:10px var(--sp-4)}
.panel details.saved summary{font:600 13px/1.3 var(--font-display)}
.panel details.saved[open] summary{margin-bottom:4px}
.saved .sv-all{display:inline-block;margin-top:6px}

/* reports for this area: two columns of compact rows */
.arep .ar-h{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-2)}
.ar-t{font:700 14px/1.3 var(--font-display);color:var(--text)}
.ar-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.ar-row{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:8px;align-items:center;min-height:40px;padding:4px 8px;text-align:left;background:transparent;border:1px solid var(--line);border-radius:var(--r-sm);color:var(--text);cursor:var(--cur-pointer,pointer)}
.ar-row[hidden]{display:none}
.ar-row .ar-i{grid-row:1/3;width:24px;height:24px;border-radius:5px}
.ar-row .ar-i::before{width:14px;height:14px;-webkit-mask-size:14px;mask-size:14px}
.ar-row b{font:600 12.5px/1.2 var(--font-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-row .ar-d{font-size:11px;line-height:1.25;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-row:hover:not(:disabled){border-color:var(--brand);background:var(--panel-2)}
.ar-row:disabled{cursor:var(--cur-default,default)}
.ar-row:disabled b,.ar-row:disabled .ar-i{opacity:.5}
.ar-row[data-ic=flood]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 6.5c1.6-1.3 3.2-1.3 4.8 0s3.2 1.3 4.8 0 2.9-1.2 3.4-.6M1.5 10.5c1.6-1.3 3.2-1.3 4.8 0s3.2 1.3 4.8 0 2.9-1.2 3.4-.6'/%3E%3C/svg%3E")}
.ar-row[data-ic=env]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13c0-6 4-9.5 10.5-10-.2 6.6-3.8 10-9 10H3zM3 13l5.5-5.5'/%3E%3C/svg%3E")}
.ar-row[data-ic=crime]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5 13.5 3.5v4.2c0 3.3-2.3 5.7-5.5 6.8-3.2-1.1-5.5-3.5-5.5-6.8V3.5z'/%3E%3C/svg%3E")}
.ar-row[data-ic=drivetime]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='6.3'/%3E%3Cpath d='M8 4.5V8l2.4 1.6'/%3E%3C/svg%3E")}
.ar-row[data-ic=traffic]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 1.5 3 14.5M11 1.5l2 13M8 2.5v2M8 7v2M8 11.5v2'/%3E%3C/svg%3E")}
.ar-row[data-ic=airtraffic]{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5c.8 0 1.2.8 1.2 1.8v3.4l5 2.8v1.4l-5-1.4v2.7l1.6 1.2v1.1L8 13.8l-2.8.7v-1.1l1.6-1.2V9.5l-5 1.4V9.5l5-2.8V3.3c0-1 .4-1.8 1.2-1.8z'/%3E%3C/svg%3E")}
.ar-row:not([data-ic=flood]):not([data-ic=env]):not([data-ic=crime]):not([data-ic=drivetime]):not([data-ic=traffic]):not([data-ic=airtraffic]){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 1.5h5.5L12.5 4.5v10H4zM9.5 1.5v3h3M6 8h4.5M6 11h4.5'/%3E%3C/svg%3E")}

/* Construction Filings: header card (live count, data period, On map switch) joined to its body while open */
.fsec-h{display:flex;align-items:center;gap:var(--sp-2);margin:var(--sp-3) var(--pg) 0;padding:var(--sp-2) var(--sp-4) var(--sp-2) var(--sp-2);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-md)}
.panel:not(.list-collapsed) .fsec-h{border-radius:var(--r-md) var(--r-md) 0 0;border-bottom-color:var(--line)}
.fsec-b{flex:1;min-width:0;display:flex;align-items:center;gap:var(--sp-2);padding:6px;border:0;border-radius:6px;background:transparent;color:var(--text);text-align:left;cursor:var(--cur-pointer,pointer)}
.fsec-b:hover{background:var(--panel-2)}
.fsec-b .chev{flex:none;color:var(--muted);transition:transform 150ms}
.fsec-b[aria-expanded="false"] .chev{transform:rotate(-90deg)}
.fs-ic{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 14.5h11M4 14.5V8l4-3 4 3v6.5M8 5V1.5M6.5 11h3'/%3E%3C/svg%3E")}
.fs-t{flex:1;min-width:0;display:grid}
.fs-t b{font:700 14px/1.3 var(--font-display)}
#filingsLive{font:500 12.5px/1.4 var(--font-display);color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#filingsLive:empty{display:none}
.fs-t em{font:500 10.5px/1.4 var(--font-mono);font-style:normal;letter-spacing:.04em;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fsw.tg2{flex:none;flex-direction:column;gap:4px;font-size:10.5px;font-weight:600;color:var(--muted);padding:0}
.panel .fbody{margin:0 var(--pg);border-radius:0 0 var(--r-md) var(--r-md)}
.panel .fbody .listhead{display:block;padding:var(--sp-3) var(--sp-4) 6px;font:700 13px/1.3 var(--font-display);letter-spacing:0;text-transform:none;color:var(--text)}
.panel .fbody .list{padding:0 var(--sp-2) var(--sp-2)}
/* headline metrics: tighter tiles, and "+ Metrics" sits at the right end of the list header line instead of a row of its own */
.panel .fbody .fhead{padding:12px var(--sp-4) 4px}
.panel .fbody .kpi{padding:8px 11px}
.panel .fbody .kpi b{font-size:16px}
.panel .fbody .kpi-edit{position:absolute;right:0;top:calc(100% + 7px);margin:0;z-index:1}
.panel .fbody .kpi-pop{top:calc(100% + 36px)}
.panel .fbody .listhead{padding-right:110px}
.fnote{margin:0;padding:var(--sp-2) var(--sp-4) var(--sp-3);border-top:1px solid var(--line);font-size:11px;line-height:1.5;color:var(--muted)}
.fnote a{color:inherit}
.fnote span:empty{display:none}

/* footer: one line */
.pfoot{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px var(--sp-3);margin-top:auto;padding:var(--sp-4) calc(var(--pg) + 2px) var(--sp-4);font-size:11px;color:var(--muted)}
.pfoot .lnk{font-size:12px}

@media (pointer:coarse){ .sc-x{width:var(--tap);height:var(--tap)} .ar-row{min-height:var(--tap)} }
/* phone Explore: the scope header is a flat, edge-to-edge 2-line bar at the very top (under the status bar), the tip follows it */
@media (max-width:700px){
  .panel{padding-top:0}
  .panel .scope{order:-2;padding:var(--st) 0 0;background:var(--panel);border-bottom:1px solid var(--line-2)}
  .panel .sheet-toggle{order:-3}
  .sc-card{border:0;border-radius:0;box-shadow:none;padding:10px 14px 10px 16px;gap:6px}
  .sc-r1{gap:10px}
  .sc-nm{display:flex;align-items:baseline;gap:8px}
  .sc-nm .sc-k{flex:none}
  .sc-nm .sk-l{display:none}
}
@media (pointer:coarse){ .sc-pick .btn,.sc-acts>.btn,.sc-more>summary.btn{min-height:40px} .sc-more>summary.btn{min-width:40px} }

/* ================= map chrome: one Layers button, one chip row, laid out on the map's real width ================= */
/* The controls top left: search · tools, [Layers · N], [Filters · n], Export · the layer chips (one row that scrolls) · the
   filters in effect as removable chips. Labels drop by the room the stack really has (container queries on .mapleft, whose
   width is the map minus the camera rail and, when it's open, the assistant), so nothing wraps into a column. */
.viewport{container:map/inline-size}
.ctrls [hidden],.rpop[hidden],.modechip[hidden],.fchips[hidden]{display:none!important}
.selpill,.tools-h,.modechip,.ly-grab,.ly-f{display:none}
.lybtn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 13px;border:1px solid var(--line-2);border-radius:6px;background:var(--panel);color:var(--text-2);font:600 12.5px var(--font-display);cursor:var(--cur-pointer,pointer);box-shadow:0 1px 2px rgba(11,13,12,.08);white-space:nowrap;flex:none}
.lybtn:hover{border-color:var(--text-2);color:var(--text)}
.lybtn.on{color:var(--brand);border-color:var(--brand)}
.lybtn.open{background:var(--text);border-color:var(--text);color:var(--panel)}
.lybtn.open .fcount{background:var(--panel);color:var(--text)}
.fbtn.match{color:var(--brand);border-color:var(--brand)}
@media (min-width:701px){
  .mapleft{--railw:36px;width:calc(100% - var(--railw) - 60px);min-width:0;max-width:none;container:chrome/inline-size;pointer-events:none;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
  .app.ai-open .mapleft{width:max(0px,calc(100% - var(--aiw) - var(--railw) - 72px))}
  .mapleft>*{pointer-events:auto;max-width:100%}
  .mapleft .msearch{width:min(100%,732px)}
  .maptop{flex-wrap:nowrap;gap:8px;max-width:100%}
  .maptop .tools,.maptop .fwrap,.maptop .exbtn{flex:none}
  .fclear{display:none!important} /* the chips under the layer buttons replace it (phones keep #mClear) */
  .exbtn{height:38px}
  #layersBtn{display:none!important}
  .mapleft .qlayers{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;contain:none;width:auto;max-width:min(100%,736px);padding:2px;margin:-2px}
  .mapleft .qlayers::-webkit-scrollbar{display:none}
  .qchip{flex:none}
  .mapleft .hint{max-width:min(100%,520px)}
  .mapleft .radius{width:min(100%,400px)}
  .mapleft .placebar{width:min(100%,520px)}
}
@media (min-width:701px) and (pointer:coarse){ .mapleft{--railw:44px} }
/* the faded edge shows there are more chips that way (src/quicklayers.js sets fl / fr) */
.qlayers.fr{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent)}
.qlayers.fl{-webkit-mask-image:linear-gradient(90deg,transparent,#000 44px);mask-image:linear-gradient(90deg,transparent,#000 44px)}
.qlayers.fl.fr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,transparent,#000 44px,#000 calc(100% - 44px),transparent)}
/* labels give way in order: Export first, then the five area tools, then Layers and Filters */
@container chrome (max-width:740px){ .maptop .exbtn span{display:none} .maptop .exbtn{padding:0 11px} }
@container chrome (max-width:676px){ .maptop .tools button span{display:none} .maptop .tools button{padding:0 11px} }
@container chrome (max-width:440px){ .maptop .fbtn span,.maptop .lybtn span{display:none} .maptop .fbtn,.maptop .lybtn{padding:0 10px} .maptop .tools button{padding:0 9px} }
@media (pointer:coarse){ .lybtn,.fbtn,.maptop .exbtn{height:var(--tap);min-width:var(--tap);justify-content:center} }
/* too narrow even for the five tool icons (a tablet with the panel or the assistant open): they fold into a "Select ▾"
   button that drops them down as a list with their names, as on phones */
@container chrome (max-width:310px){
  .maptop .selpill{display:inline-flex;align-items:center;gap:5px;height:38px;padding:0 9px 0 10px;border:1px solid var(--line-2);border-radius:6px;background:var(--panel);color:var(--text);font:600 12.5px var(--font-display);box-shadow:0 1px 2px rgba(11,13,12,.08);cursor:var(--cur-pointer,pointer);flex:none}
  .maptop .selpill span{display:none}
  .maptop .selpill.on,.app.sel-open .maptop .selpill{background:var(--text);border-color:var(--text);color:var(--panel)}
  .maptop .tools{display:none}
  .app.sel-open .maptop .tools{display:flex;position:absolute;left:0;top:calc(100% + 8px);z-index:9;flex-direction:column;min-width:200px;padding:4px;border-radius:8px;box-shadow:0 14px 40px rgba(11,13,12,.22)}
  .app.sel-open .maptop .tools button[data-mode]{justify-content:flex-start;gap:10px;padding:0 12px;border:0;border-radius:6px}
  .app.sel-open .maptop .tools button[data-mode] span{display:inline}
  .maptop{flex-wrap:wrap;row-gap:8px}
}
@media (pointer:coarse){ @container chrome (max-width:384px){
  .maptop .selpill{display:inline-flex;align-items:center;gap:5px;height:38px;padding:0 9px 0 10px;border:1px solid var(--line-2);border-radius:6px;background:var(--panel);color:var(--text);font:600 12.5px var(--font-display);box-shadow:0 1px 2px rgba(11,13,12,.08);cursor:var(--cur-pointer,pointer);flex:none}
  .maptop .selpill span{display:none}
  .maptop .selpill.on,.app.sel-open .maptop .selpill{background:var(--text);border-color:var(--text);color:var(--panel)}
  .maptop .tools{display:none}
  .app.sel-open .maptop .tools{display:flex;position:absolute;left:0;top:calc(100% + 8px);z-index:9;flex-direction:column;min-width:200px;padding:4px;border-radius:8px;box-shadow:0 14px 40px rgba(11,13,12,.22)}
  .app.sel-open .maptop .tools button[data-mode]{justify-content:flex-start;gap:10px;padding:0 12px;border:0;border-radius:6px}
  .app.sel-open .maptop .tools button[data-mode] span{display:inline}
  .maptop{flex-wrap:wrap;row-gap:8px}
} }
@media (pointer:coarse){ .maptop .selpill{height:var(--tap)} }
@supports not (container-type:inline-size){
  @media (max-width:1100px){ .tools button span,.exbtn span,.fbtn span,.lybtn span{display:none} }
}
@media (min-width:701px){
  /* the Filters popup stays inside the controls' column too, so it doesn't spill over the rail or the assistant */
  .mapleft .fpop:not(.fpop-floating){width:min(460px,max(320px,100cqw))}
  /* a tablet with both the side panel and the assistant open leaves the map a sliver: the controls step aside, as they
     did before, instead of stacking into a column over it (they come back as soon as either panel closes) */
  @container chrome (max-width:120px){ .mapleft>*{visibility:hidden!important} }
}

/* the filters in effect, each removable, then Clear all */
.fchips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;max-width:min(100%,732px)}
.fchip{display:inline-flex;align-items:center;gap:2px;height:28px;padding:0 3px 0 11px;border:1px solid var(--brand);border-radius:999px;background:var(--panel);color:var(--brand);font:600 12px var(--font-display);white-space:nowrap;box-shadow:0 1px 2px rgba(11,13,12,.08);max-width:100%}
.fchip button{width:22px;height:22px;border:0;border-radius:50%;background:transparent;color:inherit;font-size:15px;line-height:1;cursor:var(--cur-pointer,pointer);display:grid;place-items:center;flex:none}
.fchip button:hover{background:color-mix(in srgb,var(--brand) 14%,transparent)}
.fc-all{height:28px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;background:var(--panel);color:var(--text-2);font:600 12px var(--font-display);cursor:var(--cur-pointer,pointer);box-shadow:0 1px 2px rgba(11,13,12,.08)}
.fc-all:hover{border-color:var(--text-2);color:var(--text)}
@media (pointer:coarse){ .fchip{height:36px} .fchip button{width:30px;height:30px} .fc-all{height:36px} }

/* Filters popup: a line under the mode switch says what the mode does; Clear All only when something's set */
.fpop .lfhelp{flex:0 0 100%;margin:8px 0 0;font-size:12px;line-height:1.4;color:var(--muted)}
.fpop-floating .lfhelp{display:none} /* on pages the mode switch it explains isn't shown */
.fpop .active.none #resetAll{display:none}
.fpop .active.none span{color:var(--muted)}

/* camera rail: [+ / −] and [compass, near me, reset view ▾]; every button has a tooltip */
.ctrls{gap:10px}
.ctrls .rgrp{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line-2);border-radius:7px;box-shadow:0 1px 3px rgba(11,13,12,.10)}
.ctrls .rgrp>*+*{border-top:1px solid var(--line)}
.ctrls .rgrp>button,.ctrls .rmenu>button{border:0;border-radius:0;box-shadow:none;background:transparent}
.ctrls .rgrp>:first-child,.ctrls .rgrp>:first-child>button{border-radius:6px 6px 0 0}
.ctrls .rgrp>:last-child,.ctrls .rgrp>:last-child>button{border-radius:0 0 6px 6px}
.ctrls .rgrp>button:hover,.ctrls .rmenu>button:hover{background:var(--panel-2)}
.ctrls .rgrp>button[aria-pressed="true"]{background:var(--text);color:var(--panel)}
.ctrls #flat.on{background:color-mix(in srgb,var(--green-700) 10%,var(--panel))}
.rmenu{position:relative}
.ctrls #resetView{position:relative}
.ctrls #resetView.open{background:var(--text);color:var(--panel)}
.ctrls .rcaret{position:absolute;right:3px;bottom:3px;opacity:.55}
.rpop{position:absolute;right:calc(100% + 8px);top:-6px;z-index:8;display:grid;gap:2px;min-width:168px;padding:6px;background:var(--panel);border:1px solid var(--line-2);border-radius:8px;box-shadow:0 14px 40px rgba(11,13,12,.22)}
.ctrls .rpop button{width:auto;height:36px;min-width:0;display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:0 10px;border:0;border-radius:6px;box-shadow:none;background:transparent;color:var(--text);font:600 13px var(--font-display);white-space:nowrap}
.ctrls .rpop button:hover,.ctrls .rpop button:focus-visible{background:var(--panel-2)}
.ctrls #layersBtn.on{color:var(--brand);border-color:var(--brand)}

/* Map layers panel: sticky header, "On now", folding groups with counts */
.layers{overscroll-behavior:contain}
.app .layers.on{display:block;padding:0}
.layers .ly-h{position:sticky;top:0;z-index:3;margin:0;padding:10px 10px 10px 16px;background:var(--panel);border-bottom:1px solid var(--line)}
.layers .ly-h b em{font-style:normal;font-weight:600;color:var(--brand)}
.ly-on{padding:10px 16px 8px;background:var(--panel-2);border-bottom:1px solid var(--line)}
.ly-on[hidden]{display:none}
.ly-ont{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);margin-bottom:2px}
.ly-onl{display:grid}
.lysec{border-bottom:1px solid var(--line)}
.lysec>summary{list-style:none;cursor:var(--cur-pointer,pointer);display:flex;align-items:center;gap:8px;padding:12px 16px;font:700 13.5px var(--font-display);color:var(--text)}
.lysec>summary::-webkit-details-marker{display:none}
.lysec>summary:hover{background:var(--panel-2)}
.lysec>summary::after{content:"";margin-left:auto;flex:none;width:7px;height:7px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg) translateY(-2px);transition:transform .15s}
.lysec[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
.lysec>summary em{font-style:normal;font-family:var(--font-mono);font-size:11px;font-weight:500;color:var(--brand);white-space:nowrap}
.lysec>summary em:empty{display:none}
.lys-t{min-width:0}
.lys-t small{display:block;font-weight:400;font-size:11.5px;line-height:1.35;color:var(--muted);margin-top:1px}
.lyb{display:grid;gap:8px;padding:0 16px 14px}
.lyb:empty{display:none}
.lyrow2{display:flex;align-items:center;justify-content:space-between;gap:8px}
.lyrow2 .tg2{flex:1;min-width:0}
.lyplay{display:inline-flex;align-items:center;gap:6px;flex:none;height:28px;padding:0 11px 0 9px;border:1px solid var(--line-2);border-radius:999px;background:var(--panel);color:var(--brand);font:600 12px var(--font-display);cursor:var(--cur-pointer,pointer);white-space:nowrap}
.lyplay:hover{border-color:var(--brand)}
.lyplay[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
@media (pointer:coarse){ .lyplay{height:36px} }
.layers .lsub{margin:2px 0 -2px}

/* one Legend card, bottom left: a header with a fold chevron, then each map legend as a section; one open at a time */
.legends{left:16px;bottom:28px;width:236px;max-width:calc(100% - 32px);max-height:min(46%,380px);overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:0;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 1px 3px rgba(11,13,12,.10);pointer-events:auto}
.legends.lg-empty{display:none}
.legends .lg-h{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 5px 5px 12px;background:var(--panel);cursor:var(--cur-pointer,pointer)}
.legends .lg-h b{font:700 12px var(--font-display);color:var(--text)}
.lg-tog{width:26px;height:26px;border:0;border-radius:4px;background:transparent;color:var(--muted);display:grid;place-items:center;cursor:var(--cur-pointer,pointer)}
.lg-tog:hover{background:var(--panel-2);color:var(--text)}
.lg-tog svg{transition:transform .15s}
.legends.lg-min .lg-tog svg{transform:rotate(180deg)}
.legends.lg-min>:not(.lg-h){display:none!important}
.legends>.legend,.legends>.dlegend,.legends>.xlegend{position:static;left:auto;right:auto;bottom:auto;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent;min-width:0;max-width:none;width:auto;padding:8px 12px 10px;margin:0}
.legends>:not(.lg-open):not(.lg-h)>:not(.t){display:none!important}
.legends>:not(.lg-h)>.t{display:flex;align-items:center;gap:8px;cursor:var(--cur-pointer,pointer);margin:0}
.legends>:not(.lg-h)>.t::after{content:"";margin-left:auto;flex:none;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
.legends>.lg-open>.t::after{transform:rotate(-135deg) translateY(-1px)}
.legends>.lg-one>.t{cursor:var(--cur-default,default)}
.legends>.lg-one>.t::after{display:none}
.legends>:not(.lg-open):not(.lg-h){padding-bottom:8px}
.legends .legend .lyplay{justify-self:start;margin-top:2px}
/* the toast lifts above the month slider while it's showing */
.stage:has(.tslider.show) .toast{bottom:84px}

/* ================= phone: Select ▾ sheet, Layers bottom sheet, Legend pill ================= */
@media (max-width:700px){
  .mapleft{display:flex;flex-direction:column;align-items:flex-start;gap:8px;grid-template-columns:none}
  .maptop{flex-direction:row;grid-row:auto;align-self:auto}
  .mapleft .hint,.mapleft .radius,.mapleft .placebar{width:100%;grid-column:auto}
  .lybtn{display:none}
  .selpill{display:inline-flex;align-items:center;gap:7px;height:42px;padding:0 11px 0 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--panel);color:var(--text);font:600 13.5px var(--font-display);box-shadow:0 1px 3px rgba(11,13,12,.12);cursor:var(--cur-pointer,pointer)}
  .selpill.on,.app.sel-open .selpill{background:var(--text);border-color:var(--text);color:var(--panel)}
  .mapleft .tools{display:none}
  .app.sel-open .mapleft .tools{display:flex;position:fixed;left:0;right:0;bottom:calc(var(--navh,58px) + var(--sb,0px));z-index:9;flex-direction:column;gap:2px;padding:4px 12px 14px;background:var(--panel);border:0;border-radius:16px 16px 0 0;box-shadow:0 -10px 32px rgba(11,13,12,.28)}
  .app.sel-open .mapleft .tools .tools-h{display:flex;align-items:center;justify-content:space-between;padding:8px 4px 6px 6px}
  .tools-h b{font:700 17px var(--font-display);color:var(--text)}
  .tools-h .x{width:40px;height:40px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:22px;cursor:var(--cur-pointer,pointer)}
  .app.sel-open .mapleft .tools button[data-mode]{width:100%;height:48px;min-height:48px;justify-content:flex-start;gap:14px;padding:0 12px;border:0;border-radius:10px;box-shadow:none;background:transparent;color:var(--text);font:600 15px var(--font-display)}
  .app.sel-open .mapleft .tools button[data-mode][aria-pressed="true"]{background:var(--panel-2);color:var(--brand)}
  .app.sel-open .mapleft .tools button[data-mode] span{display:inline}
  .modechip:not([hidden]){display:inline-flex;align-items:center;gap:4px;height:38px;padding:0 4px 0 14px;border-radius:999px;background:var(--text);color:var(--panel);font:600 13px var(--font-display);box-shadow:0 2px 8px rgba(11,13,12,.2)}
  .modechip button{height:30px;padding:0 12px;border:0;border-radius:999px;background:color-mix(in srgb,var(--panel) 18%,transparent);color:var(--panel);font:700 13px var(--font-display);cursor:var(--cur-pointer,pointer)}
  .fchips{display:none!important}
  .ctrls #layersBtn{display:grid}
  .ctrls .rgrp:first-child{display:none}
  .backchip{top:calc(var(--st) + 162px)}
  /* the chip row's fade follows the scroll position too */
  .mapleft .qlayers{-webkit-mask-image:none;mask-image:none}
  .mapleft .qlayers.fr{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 80px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 80px),transparent)}
  .mapleft .qlayers.fl.fr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 30px,#000 calc(100% - 80px),transparent);mask-image:linear-gradient(90deg,transparent,#000 30px,#000 calc(100% - 80px),transparent)}
  .mapleft .qlayers.fl:not(.fr){-webkit-mask-image:linear-gradient(90deg,transparent,#000 30px);mask-image:linear-gradient(90deg,transparent,#000 30px)}
  /* Map layers: a bottom sheet above the tab bar with a grabber, the sticky header and Done; search and chips stay in view */
  .app .layers.on{position:fixed;left:0!important;right:0!important;top:auto!important;bottom:calc(var(--navh,58px) + var(--sb,0px));width:auto;max-height:min(64vh,560px)!important;border:0;border-radius:16px 16px 0 0;padding:0;z-index:9;box-shadow:0 -10px 32px rgba(11,13,12,.28)}
  .layers .ly-h{padding:16px 8px 10px 16px;border-radius:16px 16px 0 0}
  .layers .ly-h b{font-size:17px}
  .layers .ly-h .x{width:40px;height:40px;font-size:22px}
  .ly-grab{display:block;position:absolute;left:50%;top:6px;width:42px;height:5px;margin-left:-21px;border-radius:3px;background:var(--line-2)}
  .ly-f{display:block;position:sticky;bottom:0;z-index:3;padding:10px 16px 12px;background:var(--panel);border-top:1px solid var(--line)}
  .lysec>summary{padding:14px 16px;font-size:15px}
  .layers .lyb .tg2{padding:6px 0}
  /* the legend: a small card bottom left, folded to its header until tapped */
  .legends{left:10px;bottom:12px;width:220px;max-width:calc(100% - 80px);max-height:40vh}
  .legends.lg-min{width:auto}
  .app:has(.card.open) .legends,.app.ai-open .legends,.app.sel-open .legends,.app:has(#layers.on) .legends,.app:has(.fpop:not([hidden])) .legends{display:none}
  .stage:has(.tslider.show) .toast{bottom:76px}
  /* the filing count sits between the Select button and the camera buttons; it steps aside while Filters is open */
  .mtop .mcount{left:auto;right:52px;transform:none;max-width:calc(100% - 170px);overflow:hidden;text-overflow:ellipsis}
  .app:has(.fpop:not([hidden])) .mtop .mcount{display:none}
}

/* ================= property card: a full-height dock on the right, actions in the pinned header, back links ================= */
.vh-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ctabs[hidden]{display:none!important}
/* desktop: the card is a column from the top of the map to the bottom at its right edge; the map buttons and the
   controls' column (search, tools, chips) step left of it, so nothing hides under it */
@media (min-width:1101px){
  .app{--cardw:clamp(360px,28vw,440px)}
  .app .card,.app #card.card.sp-mode{top:12px;bottom:12px;right:12px;width:min(var(--cardw),calc(100% - 24px));max-height:none;border-radius:var(--r-md,8px)}
  /* minimized: only the header bar, so the map beside and below it takes clicks again */
  .app #card.card.min{height:auto!important;bottom:auto!important;max-height:none}
  .app.ai-open .card,.app.ai-open #card.card.sp-mode{right:calc(var(--aiw) + 28px)}
  .app:has(.card.open){--fabr:calc(var(--cardw) + 24px)}
  .app:has(.card.open) .ctrls{right:calc(var(--cardw) + 24px)}
  .app.ai-open:has(.card.open) .ctrls{right:calc(var(--aiw) + var(--cardw) + 40px)}
  .app:has(.card.open) .mapleft{width:max(0px,calc(100% - var(--railw,36px) - 68px - var(--cardw)))}
  .app.ai-open:has(.card.open) .mapleft{width:max(0px,calc(100% - var(--aiw) - var(--railw,36px) - 84px - var(--cardw)))}
  /* a card open over a page (Timeline, Changes…) docks the same way, and the page makes room for it */
  .app:has(.card.open:not(.min)) .stage:not([data-view="map"]) .view{padding-right:calc(var(--cardw) + 36px)}
  /* the assistant opened over a page (Ask AI in the top bar) makes room the same way, instead of covering its right side */
  .app.ai-open .stage:not([data-view="map"]) .view{padding-right:calc(var(--aiw) + 36px)}
  .app.ai-open:has(.card.open:not(.min)) .stage:not([data-view="map"]) .view{padding-right:calc(var(--aiw) + var(--cardw) + 52px)}
}
/* header: back link, kicker, title, owner · value, the action row, then the section chips */
#card .top{padding:14px 16px 10px}
#card .top h2{font-size:19px}
#card .top .cact{flex-basis:100%;display:flex;align-items:center;gap:6px;margin-top:10px;min-width:0}
#card .cact .btn{white-space:nowrap;padding:5px 10px;font-size:12.5px}
#card .cact .askai{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
#card .cact .askai:hover:not([disabled]){background:color-mix(in srgb,var(--brand) 86%,var(--text))}
#card .cact .askai[disabled]{opacity:.6;cursor:progress}
#card .cact .askai[aria-busy="true"] svg{animation:cact-spin 1.1s linear infinite}
@keyframes cact-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ #card .cact .askai[aria-busy="true"] svg{animation:none} }
#card .cact .star{color:var(--text)}
#card .cact .star svg{color:var(--c-heb)}
#card .cact .star[aria-pressed="true"]{border-color:var(--c-heb);background:color-mix(in srgb,var(--c-heb) 10%,var(--panel))}
#card .cact .cmore{margin-left:auto}
#card .cact .cmore>summary{padding:0 9px;justify-content:center}
#card .cmore .vm-pop{min-width:230px}
#card .cmore .vm-pop>a{display:block;border-radius:6px;padding:8px 10px;font:600 13px/1.3 var(--font-display);color:var(--text);text-decoration:none}
#card .cmore .vm-pop>a:hover,#card .cmore .vm-pop>a:focus-visible{background:var(--chip)}
#card .cmore #bOrbit.on{color:var(--brand)}
/* "← 1200 Main St": a report, filing or note opened from a card goes back to it */
#card .cback{display:flex;align-items:center;gap:4px;max-width:100%;margin:-4px 0 6px -6px;padding:4px 8px 4px 4px;border:0;border-radius:6px;background:transparent;color:var(--brand);font:600 12.5px/1.2 var(--font-display);cursor:var(--cur-pointer,pointer)}
#card .cback span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#card .cback:hover,#card .cback:focus-visible{background:var(--chip)}
/* scrolled: the header folds to the title and the actions */
#card.compact .top .kicker,#card.compact .top .bsub,#card.compact .top .cshow{display:none}
#card.compact .top{padding-top:10px}
#card.compact .top h2{font-size:16px;margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#card.compact .top .cact{margin-top:8px}
/* section chips: the one in view is lit; the row fades where more chips are past the edge */
#card .bnav{margin-top:10px}
#card .bnav button{min-height:28px;padding:5px 10px}
#card .bnav.fr{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent)}
#card .bnav.fl{-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px);mask-image:linear-gradient(90deg,transparent,#000 40px)}
#card .bnav.fl.fr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent)}
/* density: smaller section headings and icons, label | value rows (40 / 60, both left-aligned) */
#card .bsec,#card .hist,#card .brief,#card .bover{margin:10px 12px 0;padding:12px 14px;gap:8px}
#card .lt{font-size:13px;gap:8px}
#card .lt::before{width:20px;height:20px;border-radius:5px;background-size:12px}
#card dl{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
#card dt{padding-right:12px;font-size:12.5px}
#card dd{text-align:left;font-size:12.5px}
#card .fgrid{gap:10px 14px}
#card .fv{font-size:13px}
/* Ownership: Regrid fills the gaps */
#card .rg-cta{display:block;width:100%;text-align:center;white-space:normal;line-height:1.3;padding:9px 12px}
#card.min .cact{display:none} /* minimized: just the title bar */
#card .rg-cta span,#card .rg-row .lnk span{font-weight:500;opacity:.85}
#card .rg-row{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:8px;font-size:12.5px;color:var(--text-2)}
#card .rg-row .lnk{font-size:12.5px;white-space:nowrap}
#card #bRegrid:has(#rgGo){display:none} /* its button is the one in Ownership; the section shows with the record */
#card #bParcel:has(+ #bRegrid dl) .rg-cta{display:none} /* looked up: the record is right below (the Zoning row links to it) */
#card .more-rec .fl{margin-top:8px}
/* the company behind the owner: one line, details on demand */
#card .oc-box.oc-one{padding:0;border:0;margin-top:2px}
#card .oc-sum{border:1px solid var(--line);border-radius:8px;padding:0 10px}
#card .oc-sum>summary{list-style:none;display:flex;align-items:baseline;gap:8px;padding:8px 0;cursor:var(--cur-pointer,pointer)}
#card .oc-sum>summary::-webkit-details-marker{display:none}
#card .oc-sum[open]{padding-bottom:8px}
#card .oc-line{flex:1;min-width:0;font-size:12.5px;line-height:1.4;color:var(--text-2)}
#card .oc-nm,#card .oc-meta{display:block;overflow-wrap:anywhere}
#card .oc-meta{margin-top:2px;font-size:12px}
#card .oc-off{margin-top:12px}
#card .oc-line b{color:var(--text);font-weight:600}
#card .oc-line .fl{margin-right:2px}
#card .oc-more{flex:none;font:600 12px var(--font-display);color:var(--brand)}
#card .oc-more::after{content:" ▸"}
#card .oc-sum[open] .oc-more::after{content:" ▾"}
/* phones: the sheet opens at peek height with the action row as a footer; swipe up for half, then full */
@media (max-width:700px){
  .card{max-height:44%}
  .card.half{max-height:72%}
  .card.full{max-height:calc(100% - 6px)}
  .card.adding,.card.adding.half,.card.adding.full{max-height:30%}
  #card .top{padding:6px 16px 8px}
  #card .top h2{font-size:18px}
  #card>.cact{position:sticky;bottom:-14px;z-index:3;display:flex;align-items:center;gap:8px;margin:12px 0 -14px;padding:8px 12px;background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -6px 16px rgba(11,13,12,.08)}
  #card>.cact .btn{min-height:44px;flex:1 1 0;justify-content:center;padding:0 8px;font-size:13px}
  #card>.cact .cmore{flex:none;margin:0}
  #card>.cact .cmore>summary{min-height:44px;width:48px;flex:none}
  /* the menu floats above the footer over the map (inside the sheet it would be cut off at peek height) */
  #card>.cact .vm-pop{position:fixed;top:auto;left:12px;right:12px;bottom:calc(var(--navh) + var(--sb) + 72px);max-width:none;max-height:calc(100% - var(--navh) - var(--sb) - 140px);overflow:auto;box-shadow:0 10px 30px rgba(11,13,12,.28)}
  #card .bsec,#card .hist,#card .brief,#card .bover{margin:10px 10px 0}
}
@media (pointer:coarse){ #card .cact .btn,#card .cback{min-height:40px} }

/* ================= planning: the site plan as its own workspace ================= */
/* while a plan is open the list folds away (src/siteplan.js) and the area tools, filters, export and layer chips step aside;
   Layers stays */
.app.planning #mapTools,.app.planning .selpill,.app.planning #fwrap,.app.planning #exportBtn,.app.planning #qlayers,.app.planning #fchips,.app.planning #modeChip,
.app.planning #mFilters,.app.planning #mClear,.app.planning .mcount{display:none!important}
.ctrls .sp-fitg{display:none}
.app.planning .ctrls .sp-fitg{display:flex}
/* header: Projects › the project with Undo, Redo, the save icon and × on one line; the option's name and address with
   Edit Layout and Done under it; then the options and section chips */
#card.sp-mode .top{padding:12px 16px 10px;row-gap:0}
#card.sp-mode .top>.sp-head{flex:1 1 100%;width:100%}
#card .sp-head{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"back back" "crumb tools" "ttl act";align-items:center;column-gap:12px}
#card .sp-head>.cback{grid-area:back;justify-self:start;margin:-2px 0 6px -6px}
#card .sp-crumb{grid-area:crumb;display:flex;align-items:center;gap:2px;min-width:0;overflow:hidden;white-space:nowrap;font:500 12px/1.2 var(--font-display);color:var(--muted)}
#card .sp-cr{flex:none;max-width:100%;border:0;background:none;padding:3px 5px;border-radius:5px;color:var(--text-2);font:inherit;cursor:var(--cur-pointer,pointer);overflow:hidden;text-overflow:ellipsis}
#card .sp-cr:nth-of-type(2){flex:0 1 auto;min-width:0;white-space:nowrap}
#card .sp-cr:first-child{margin-left:-5px}
#card .sp-cr:hover,#card .sp-cr:focus-visible{color:var(--brand);background:var(--chip)}
#card .sp-ttl{grid-area:ttl;min-width:0;margin-top:2px}
#card .sp-ttl h2{margin:0}
#card .sp-hact{grid-area:act;display:flex;align-items:center;gap:6px;justify-self:end;align-self:start;margin-top:4px}
#card .sp-htools{grid-area:tools;display:flex;align-items:center;gap:2px;justify-self:end;margin-right:-6px}
#card .sp-ib{width:32px;height:32px;display:grid;place-items:center;flex:none;border:1px solid var(--line-2);border-radius:var(--r-sm,6px);background:var(--panel);color:var(--text);cursor:var(--cur-pointer,pointer)}
#card .sp-ib:hover:not(:disabled){border-color:var(--text-2)}
#card .sp-ib:disabled{opacity:.38;cursor:var(--cur-default,default)}
#card .sp-hact .btn{white-space:nowrap;padding:5px 10px;font-size:12.5px}
#card .sp-hact .btn svg{display:none}
#card .sp-hact .sp-edit.on{background:var(--text);border-color:var(--text);color:var(--panel)}
#card .sp-hact .sp-done{margin-left:2px}
#card .sp-htools .mn{margin-left:0}
#card .sp-htools .x,#card .sp-htools .mn{width:30px;height:30px;margin:0;display:grid;place-items:center}
#card .sp-htools .sp-ib{width:30px;height:30px;border-color:transparent;background:transparent;color:var(--text-2)}
#card .sp-htools .sp-ib:hover:not(:disabled){background:var(--chip);border-color:transparent;color:var(--text)}
#card .sp-htools .sp-save+.sp-ib{margin-left:2px}
#card.sp-mode .sp-plans{flex-basis:100%;display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;align-items:center}
#card .sp-plans .chip{font-weight:600;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* "Option B · Rows facing the street…": the full name is in its tooltip */
#card .sp-plans .chip[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
#card .sp-plans .sp-newopt{border-style:dashed}
#card .sp-plans-ph{display:none!important}
#card .sp-quiet{padding:0;color:var(--green-300);text-decoration:underline;text-underline-offset:2px}
#card .sp-foot{display:flex;justify-content:flex-end;margin:12px 14px 0;padding:0 2px}
#card .sp-foot .sp-del{font-size:12px;color:var(--danger)}
#card #spLayouts{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='2' width='5' height='5' rx='1'/%3E%3Crect x='9' y='2' width='5' height='5' rx='1'/%3E%3Crect x='2' y='9' width='5' height='5' rx='1'/%3E%3Crect x='9' y='9' width='5' height='5' rx='1'/%3E%3C/svg%3E")}
#card #spSiteSec{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23006527' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 7 2.5l6.5 2.5v8L9 14.5l-6.5-2z'/%3E%3C/svg%3E")}
/* a toast with an action ("Saved to … · Open project") */
.toast.act{pointer-events:auto}
body:has(.xdlg.on)>.toast{z-index:61} /* a note with Undo stays clickable above the Export dialog */
/* phones: an open card is a sheet over the bottom of the map, so the toast (Undo, Open project…) shows under the search bar instead of behind it */
@media (max-width:700px){.app:has(#card.open) .toast{bottom:auto;top:calc(66px + var(--st,0px))}}
.toast button{margin-left:6px;padding:0;border:0;background:none;color:inherit;font:700 12.5px var(--font-display);text-decoration:underline;text-underline-offset:2px;cursor:var(--cur-pointer,pointer)}
/* after closing: "Resume plan" under the search, and the site's faint outline on the map */
.sp-resume{display:flex;align-items:stretch;justify-self:start;background:var(--panel);border:1px solid var(--line-2);border-radius:999px;box-shadow:0 2px 8px rgba(11,13,12,.14);overflow:hidden}
.sp-resume[hidden]{display:none}
.sp-resume button{border:0;background:none;color:var(--text);font:600 12.5px var(--font-display);cursor:var(--cur-pointer,pointer);display:flex;align-items:center;gap:6px}
.sp-resume .sp-rs-go{padding:7px 6px 7px 12px;color:var(--brand)}
.sp-resume .sp-rs-go b{color:var(--text);font-weight:600}
.sp-resume .sp-rs-x{padding:0 10px;color:var(--muted)}
.sp-resume button:hover{background:var(--chip)}
/* away from the map with a plan open: a banner back to it */
.sp-away{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:9;display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);padding:6px 6px 6px 14px;background:var(--ink-900,#0b0d0c);color:#fff;border-radius:999px;box-shadow:0 6px 20px rgba(11,13,12,.28);font:500 13px var(--font-display)}
.sp-away[hidden]{display:none}
.sp-away span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-away .sp-aw-go{flex:none;border:0;border-radius:999px;background:var(--brand);color:var(--brand-ink);font:600 12.5px var(--font-display);padding:6px 12px;cursor:var(--cur-pointer,pointer)}
.sp-away .sp-aw-x{flex:none;border:0;background:none;color:rgba(255,255,255,.7);width:28px;height:28px;display:grid;place-items:center;cursor:var(--cur-pointer,pointer)}
.pj-live{position:absolute;right:6px;top:6px;background:var(--brand);color:var(--brand-ink);font-size:10.5px;font-weight:700;border-radius:999px;padding:2px 8px;box-shadow:0 1px 3px rgba(0,0,0,.2)}
/* phones: one header row (the option's name and icon buttons), the options under the overview */
@media (max-width:700px){
  #card.sp-mode .top{padding:4px 12px 8px}
  #card .sp-head{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"ttl act tools";column-gap:2px}
  #card .sp-crumb,#card .sp-ttl .bsub,#card .sp-head>.cback{display:none!important}
  #card .sp-ttl{margin:0}
  #card .sp-ttl h2{font-size:17px}
  #card .sp-hact{gap:2px}
  #card .sp-hact .btn{width:36px;min-height:36px;padding:0;justify-content:center}
  #card .sp-hact .btn svg{display:block}
  #card .sp-hact .btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  #card .sp-ib{width:34px;height:36px;border:0;background:transparent}
  #card .sp-hact{margin-top:0;align-self:center}
  #card .sp-htools .x{width:36px;height:36px}
  #card .sp-htools .mn{width:30px;height:36px}
  #card .sp-htools .sp-ib{width:32px;height:36px}
  #card.sp-mode .top>.sp-plans{display:none}
  #card.sp-mode .sp-plans-ph{display:flex!important;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:10px 10px 0;padding:0;gap:6px}
  #card .sp-plans-ph .chip{flex:none}
  #card.sp-mode .top .bnav{margin-top:6px}
  .mapleft .sp-resume{grid-column:2;justify-self:start}
  .sp-away{bottom:12px}
}
/* ================= site plan: a generation run (describe → watch it run → choose) ================= */
/* the run under way, pinned in the plan's header: the step, the time it's taken and Cancel; a thin bar for the step */
#card .sp-run{position:relative;flex-basis:100%;display:flex;align-items:center;gap:8px;margin:10px 0 0;padding:6px 6px 6px 10px;border:1px solid var(--line-2);border-radius:8px;background:var(--panel-2);font:500 12.5px/1.3 var(--font-display);color:var(--text);overflow:hidden}
.sp-run-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--brand);animation:sp-blink 1.2s ease-in-out infinite}
@keyframes sp-blink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.8)}}
.sp-run-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-rt{flex:none;font:500 11.5px var(--font-mono);color:var(--muted);font-variant-numeric:tabular-nums}
.sp-run-x{flex:none;border:1px solid var(--line-2);border-radius:6px;background:var(--panel);color:var(--text);font:600 12px var(--font-display);padding:4px 10px;cursor:var(--cur-pointer,pointer)}
.sp-run-x:hover{border-color:var(--danger);color:var(--danger)}
.sp-run-x:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.sp-run-bar{position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--brand) calc(var(--p,0)*100%),transparent 0),linear-gradient(90deg,transparent,color-mix(in srgb,var(--brand) 45%,transparent),transparent);background-size:100% 100%,40% 100%;background-repeat:no-repeat;animation:sp-sweep 1.6s linear infinite}
@keyframes sp-sweep{from{background-position:0 0,-40% 0}to{background-position:0 0,140% 0}}
@media (prefers-reduced-motion:reduce){.sp-run-dot,.sp-run-bar,.sp-skel::after{animation:none}}
/* phones: the same, as a pill floating just above the sheet */
.sp-runpill{position:fixed;left:50%;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:8px;max-width:calc(100vw - 32px);padding:5px 5px 5px 12px;border-radius:999px;background:var(--ink-900,#0b0d0c);color:#fff;box-shadow:0 6px 18px rgba(11,13,12,.3);font:500 12.5px/1.2 var(--font-display)}
.sp-runpill[hidden]{display:none}
.sp-runpill .sp-rt{color:rgba(255,255,255,.7)}
.sp-runpill .sp-run-dot{background:var(--green-300)}
.sp-runpill .sp-run-x{border-radius:999px;border-color:rgba(255,255,255,.25);background:transparent;color:#fff}
@media (max-width:700px){#card .sp-run{display:none}}
/* a control that started a run that isn't a button (More layouts…, Review again): a small spinner after it */
.sp-link.busy::after{content:"";display:inline-block;width:10px;height:10px;margin-left:6px;vertical-align:-1px;border-radius:50%;border:2px solid var(--line-2);border-top-color:var(--brand);animation:sp-spin .7s linear infinite}
#card .sp-sugs .chip:disabled,#card [data-idea]:disabled{opacity:.45;cursor:var(--cur-default,default)}
/* the Build box: a suggestion fills it, Build lights up */
#card .sp-ai-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
#card .sp-ai-h .sp-link{font-size:12px}
#card .sp-sugs .chip{background:var(--panel);border-style:dashed;color:var(--text-2)}
#card .sp-sugs .chip:hover:not(:disabled){border-style:solid;border-color:var(--brand);color:var(--text)}
.btn.sp-pulse{animation:sp-ring 1s ease-out 2}
@keyframes sp-ring{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--brand) 60%,transparent)}100%{box-shadow:0 0 0 10px transparent}}
@media (prefers-reduced-motion:reduce){.btn.sp-pulse{animation:none;outline:2px solid var(--green-300);outline-offset:2px}}
#card #spGo{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1.2}
#card #spGo small{font-size:10.5px;font-weight:500;opacity:.85}
/* how hard the AI works: Low, Medium, High, Ultra (four equal segments, the time under each), what the picked one does
   under them, and Phase 2's setting beside the label. Ultra has a warm gradient and a spark; picking it sweeps a shine
   across it once (none with reduced motion). */
#card .sp-runopts{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:10px}
.sp-effl{font:500 10.5px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.sp-effort{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;border:1px solid var(--line-2);border-radius:8px;padding:2px;background:var(--panel-2)}
.sp-eff{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:42px;padding:4px 4px;border:0;border-radius:6px;background:none;color:var(--text-2);font:500 12.5px var(--font-display);line-height:1.2;cursor:var(--cur-pointer,pointer);overflow:hidden;transition:background var(--dur-fast,150ms),color var(--dur-fast,150ms),box-shadow var(--dur-fast,150ms)}
.sp-eff b{display:inline-flex;align-items:center;gap:4px;font-weight:600}
.sp-eff small{font-size:10.5px;color:var(--muted);white-space:nowrap}
.sp-eff:hover:not(:disabled):not([aria-checked="true"]){background:color-mix(in srgb,var(--panel) 65%,transparent);color:var(--text)}
.sp-eff[aria-checked="true"]{background:var(--panel);color:var(--text);box-shadow:0 1px 2px rgba(11,13,12,.12)}
.sp-eff:disabled{opacity:.45;cursor:var(--cur-default,default)}
.sp-eff:focus-visible{outline:2px solid var(--focus);outline-offset:0}
.sp-eff-ultra b{background:linear-gradient(100deg,var(--green-700) 0%,#0e7c86 50%,var(--amber) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sp-eff-ultra .sp-spark{flex:none;color:var(--amber)}
.sp-eff-ultra[aria-checked="true"]{background:linear-gradient(135deg,var(--green-50) 0%,#fff 48%,#fbf1df 100%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--amber) 42%,transparent),0 1px 4px rgba(183,121,31,.22)}
.sp-eff-ultra[aria-checked="true"] small{color:#8a5a12}
.sp-eff-ultra b,.sp-eff-ultra small{position:relative;z-index:1}
.sp-eff-ultra::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 28%,rgba(224,162,60,.38) 42%,rgba(255,250,238,.95) 50%,rgba(224,162,60,.38) 58%,transparent 72%);transform:translateX(-110%);pointer-events:none;opacity:0}
.sp-eff-ultra.sp-shine::after{animation:sp-shine 640ms cubic-bezier(.45,0,.25,1) 1}
.sp-eff-ultra.sp-shine .sp-spark{animation:sp-spark 620ms var(--ease) 1}
@keyframes sp-shine{0%{transform:translateX(-110%);opacity:1}100%{transform:translateX(110%);opacity:1}}
@keyframes sp-spark{0%{transform:scale(1) rotate(0)}45%{transform:scale(1.4) rotate(25deg)}100%{transform:scale(1) rotate(0)}}
@media (prefers-reduced-motion:reduce){.sp-eff-ultra.sp-shine::after,.sp-eff-ultra.sp-shine .sp-spark{animation:none}}
.sp-effhint{margin-top:-2px;font-size:12px;line-height:1.45;color:var(--text-2)}
.sp-effon{display:inline-flex;align-items:center;gap:3px;margin-left:6px;padding:0 6px;border-radius:999px;background:var(--chip);color:var(--text-2);font:600 10.5px/18px var(--font-display);vertical-align:1px;white-space:nowrap}
.sp-effon.u{background:linear-gradient(135deg,var(--green-50),#fbf1df);color:#7a4f0f;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--amber) 35%,transparent)}
.sp-effon.u .sp-spark{color:var(--amber);width:10px;height:10px}
#card .sp-runopts .sp-sw{font-size:12px;color:var(--text-2)}
.sp-aioff{display:flex;align-items:center;gap:6px;margin-top:8px;color:var(--text-2)}
.sp-aioff::before{content:"i";flex:none;display:grid;place-items:center;width:15px;height:15px;border-radius:50%;border:1px solid var(--line-2);font:700 10px var(--font-display);color:var(--muted)}
/* what the request was read as */
.sp-readas{display:flex;flex-wrap:wrap;align-items:center;gap:4px 5px;margin-top:10px;font-size:12px}
.sp-ra-l{font:500 10.5px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:2px}
.sp-rc{display:inline-flex;align-items:center;padding:2px 7px;border-radius:999px;background:var(--chip);color:var(--text);font-size:11.5px;line-height:1.4}
.sp-rc.miss{background:color-mix(in srgb,var(--amber) 14%,transparent);color:var(--text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--amber) 45%,transparent)}
.sp-readas .sp-link{font-size:12px;padding:0 0 0 4px}
.sp-assumed{margin-top:4px}
.sp-planned{margin-top:8px;font-size:12px;border:1px solid var(--line);border-radius:8px;padding:6px 9px}
.sp-planned>summary{cursor:var(--cur-pointer,pointer);list-style:none;display:flex;align-items:center;gap:6px;font-weight:500}
.sp-planned>summary::-webkit-details-marker{display:none}
.sp-planned>summary::after{content:'';margin-left:auto;width:7px;height:7px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);transition:transform .15s}
.sp-planned[open]>summary::after{transform:rotate(-135deg)}
.sp-planned p{margin:6px 0 0;line-height:1.45}
.sp-planned ul{margin:6px 0 0;padding-left:16px;line-height:1.45}
.sp-planned li{margin:2px 0}
.sp-pf-why{color:var(--muted)}
/* folded once there are layouts: one line */
.sp-built-l{font-size:13px;line-height:1.45;color:var(--text-2)}
.sp-built-l q{color:var(--text);font-weight:600}
#card .sp-built .lt{margin-bottom:4px}
/* the AI's ideas */
.sp-callout{margin-top:10px;padding:9px 12px;border-left:3px solid var(--brand);background:var(--panel-2);border-radius:0 6px 6px 0;font-size:12.5px;line-height:1.45;color:var(--text-2)}
.sp-callout b{display:block;font:600 11px var(--font-display);color:var(--text);margin-bottom:2px}
.sp-idea.on{border-color:var(--brand);box-shadow:inset 3px 0 0 var(--brand)}
.sp-idea-h{flex-wrap:wrap}.sp-idea-h b{flex:1;min-width:0}
.sp-fitbar{flex:none;width:56px;height:6px;border-radius:3px;background:var(--chip);overflow:hidden;align-self:center}
.sp-fitbar i{display:block;height:100%;background:var(--brand);border-radius:3px}
.sp-idea ul.sp-risks{list-style:none;padding:0;margin:0;display:grid;gap:3px;color:var(--text-2);font-size:12px}
.sp-risks li{display:flex;gap:6px;line-height:1.4}
.sp-risks li::before{content:"";flex:none;width:5px;height:5px;margin-top:6px;border-radius:50%;background:var(--muted)}
.sp-idea-req{font-size:12px;color:var(--muted);line-height:1.4}.sp-idea-req q{color:var(--text)}.sp-idea-req .sp-link{font-size:12px;padding:0 0 0 2px}
.sp-ideas-fold{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:10px;font-size:12.5px;color:var(--text-2)}
.sp-ideas-fold .sp-link{padding:0;font-size:12.5px;font-weight:600}
.sp-ideas-foot .sp-link{padding:0;font-size:12px}
/* the layouts while the AI reviews them, and its pick */
.sp-skel{position:relative;justify-self:start;font-style:normal;font-size:11px;color:var(--muted);padding:1px 8px;border-radius:999px;background:var(--chip);overflow:hidden}
.sp-skel::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--panel) 70%,transparent),transparent);animation:ldshim 1.4s linear infinite;background-size:200% 100%}
.sp-pick{font:600 10px/1.5 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--brand);border:1px solid var(--brand);border-radius:3px;padding:0 5px;white-space:nowrap;font-style:normal}
.sp-aiv.sp-rev{color:var(--text-2)}

/* Layouts heading, banner, shared notes, the AI's revision; the overview as a decision strip; Numbers tiles */
#card .sp-lay-h{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
#card .sp-lay-h .lt{margin:0}.sp-lcount{color:var(--muted);font-weight:500}
.sp-lay-ctl{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text-2)}.sp-lay-ctl .sp-link{font-size:12px;padding:0}
.sp-lay-ctl select{font:inherit;margin-left:4px;border:1px solid var(--line-2);border-radius:4px;background:var(--panel);color:var(--text);padding:3px 4px}
.sp-lbanner{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding:9px 12px;border-radius:6px;background:color-mix(in srgb,var(--danger) 9%,var(--panel));border:1px solid color-mix(in srgb,var(--danger) 35%,transparent);font-size:12.5px;line-height:1.45}
.sp-lbanner b{color:var(--danger)}.sp-lbanner .btn{flex:none}
.sp-lnotes{display:grid;gap:3px;margin-top:10px;padding:8px 10px;border-radius:6px;background:var(--panel-2);border:1px solid var(--line)}
.sp-lnh{font:600 10px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.sp-ninfo summary{cursor:var(--cur-pointer,pointer);font-size:11.5px;color:var(--brand);font-weight:600;width:max-content}.sp-ninfo .sp-n{margin-top:3px}
.sp-lgrp{margin-top:14px;font-size:12px;color:var(--text-2);line-height:1.4}.sp-lgrp b{color:var(--text)}
#spLayouts .sp-callout{margin-top:10px}
.sp-ov-n{display:flex;align-items:baseline;gap:8px;margin:0 0 12px;min-width:0}.sp-ov-n b{flex:none;font-size:15px}.sp-ov-n span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-300);font-size:12.5px}
.sp-ov-n i{flex:none;font:600 10px/16px var(--font-mono);font-style:normal;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-950);background:#e0a23c;border-radius:3px;padding:0 5px}
.sp-ov-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,.8fr) minmax(0,1fr);gap:12px 14px}
.sp-ov-g.n3{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1fr)}
.sp-ov-s{display:flex;flex-direction:column;gap:2px;min-width:0}.sp-ov-s small{font:600 11px/1.3 var(--font-display);color:var(--green-300);white-space:nowrap}
.sp-ov-s b{font-size:15px;line-height:1.25;white-space:nowrap;font-variant-numeric:tabular-nums}.sp-ov-s i{font-style:normal;font-size:11.5px;color:var(--ink-300);line-height:1.35}
.sp-ov-ws{display:block;margin-top:3px;padding-top:3px;border-top:1px solid rgba(255,255,255,.14);white-space:nowrap;color:var(--ink-300)}
#card .bover .neg{color:#ff9b8f}
#card .bover .sp-ov-msg{display:grid;gap:2px}#card .bover .sp-ov-msg b{font-size:14.5px}#card .bover .sp-ov-msg>span{color:var(--ink-300);font-size:12.5px;line-height:1.45}
#card .bover em.neg{color:#ff9b8f;font-style:normal}#card .bover em{font-style:normal}
.sp-ov-p2{margin-top:6px;font-size:12px;color:var(--ink-300)}
.sp-ov-a{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.sp-ovb{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:var(--r-sm);border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.04);color:#fff;font:600 12px var(--font-display);white-space:nowrap;cursor:var(--cur-pointer,pointer);transition:border-color var(--dur-fast,150ms),background var(--dur-fast,150ms)}
.sp-ovb:hover{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.08)}
.sp-ovb:focus-visible{outline:2px solid var(--green-300);outline-offset:2px}
.sp-ov-a .sp-ck.ok{color:var(--green-300)!important;border-color:color-mix(in srgb,var(--green-300) 50%,transparent);background:color-mix(in srgb,var(--green-300) 10%,transparent)!important;cursor:var(--cur-default,default)}
.sp-ov-a .sp-ck.bad{color:#ffb0a5!important;border-color:color-mix(in srgb,#ff7b6b 60%,transparent);background:rgba(255,123,107,.12)!important}
.sp-ov-a .sp-ck .sp-chev{margin-left:2px}
.sp-ov-probs{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:2px}
.sp-ov-probs button,.sp-ov-probs span{display:block;width:100%;text-align:left;border:0;background:none;color:#ffd0c8;font:inherit;font-size:12.5px;padding:3px 0 3px 14px;position:relative;line-height:1.4}
.sp-ov-probs button{cursor:var(--cur-pointer,pointer)}.sp-ov-probs button:hover{color:#fff;text-decoration:underline}
.sp-ov-probs button::before,.sp-ov-probs span::before{content:"!";position:absolute;left:0;font-weight:700;color:#ff9b8f}
@media (max-width:700px){.sp-ov-g{grid-template-columns:1fr 1fr}}
.sp-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));grid-auto-flow:row dense;gap:6px;margin:4px 0 8px}
.sp-tile{border:1px solid var(--line-2);border-radius:6px;padding:6px 8px;background:var(--panel-2);display:grid;gap:1px;align-content:start;min-width:0}
.sp-tile>span{font-size:10.5px;color:var(--text-2)}.sp-tile>b{font-size:13.5px;font-weight:700}.sp-tile>small{font-size:10.5px;color:var(--muted);line-height:1.3}
.sp-tile.two{grid-column:span 2}.sp-tv{display:flex;gap:16px}.sp-tv b{font-size:13.5px;font-weight:700;display:grid}.sp-tv b small{font-size:10px;font-weight:500;color:var(--muted)}
.sp-tile .sc{font-weight:500;color:var(--muted);font-size:11.5px}.sp-tile .sc.over,.sp-tile.bad>b,.sp-tile.bad .sp-tv b{color:var(--danger)}
.sp-card b.neg,.sp-card small.neg{color:var(--danger)}
.pj-p2{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.sp-ninfo1{margin-top:10px}.sp-ninfo1 summary{color:var(--text-2);font-weight:500}
.sp-vpills .sp-onmap{font:700 10.5px/18px var(--font-display);letter-spacing:.02em;text-transform:none}
.sp-var-acts{align-items:baseline}.sp-var-acts .sp-why{margin:0 auto 0 0;padding:0}.sp-var-acts .sp-why[open]{flex-basis:100%;order:2;margin:4px 0 0}
.sp-var-acts .sp-why~.sp-simt{margin-right:0}
@media (max-width:700px){.sp-var-use{grid-template-columns:64px minmax(0,1fr);gap:8px}.sp-vthumb{width:64px;height:64px}.sp-vc b{font-size:13px}}
/* ================= the plan on the map: the mode pill, the scale, the Plan key, Change With AI's checklist ================= */
/* a box over the map's free rectangle (not under the card, the search or the buttons; src/siteplan.js keeps it there) */
.sp-mapui{position:absolute;z-index:4;pointer-events:none}
.sp-mapui[hidden]{display:none}
/* the mode: a small light chip riding on the tool strip (placed by placeChip in src/siteplan.js), the panel's colour with a hairline */
.sp-mpill{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:7px;height:30px;box-sizing:border-box;max-width:calc(100% - 32px);padding:0 4px 0 10px;border:1px solid var(--line-2);border-radius:var(--r-md,8px);background:var(--panel);color:var(--text);box-shadow:0 1px 3px rgba(11,13,12,.12);font:500 12px/1 var(--font-display);pointer-events:auto;white-space:nowrap}
.sp-mpill[hidden]{display:none}
.sp-mpill .sp-mp-t{flex:none;font-weight:700}
.sp-mpill .sp-mp-d{min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}
.sp-mpill .sp-mp-dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--brand)}
.sp-mpill .sp-mp-dot:not(.k-edit):not(.k-shape){background:var(--amber,#c98a00)}
.sp-mpill .sp-mp-b{flex:none;height:22px;border:1px solid var(--line-2);border-radius:6px;background:transparent;color:var(--text);font:600 11.5px/1 var(--font-display);padding:0 9px;cursor:var(--cur-pointer,pointer)}
.sp-mpill .sp-mp-b+.sp-mp-b{margin-left:-3px}
.sp-mpill .sp-mp-b.done{background:var(--brand);border-color:var(--brand);color:var(--brand-ink,#fff)}
.sp-mpill .sp-mp-b:hover{background:var(--chip)}.sp-mpill .sp-mp-b.done:hover{filter:brightness(1.08);background:var(--brand)}
.sp-mpill .sp-mp-b:disabled{opacity:.45;cursor:var(--cur-default,default)}
.sp-mpill .sp-mp-b:focus-visible{outline:var(--focus,2px solid var(--brand));outline-offset:1px}
/* the scale bar: bottom right of the free part of the map, clear of the legend at the bottom left */
.sp-scale{position:absolute;right:10px;bottom:10px;pointer-events:none}
.sp-scale .maplibregl-ctrl-scale{margin:0;background:color-mix(in srgb,var(--panel) 85%,transparent);color:var(--text);border-color:var(--text-2);font:600 10.5px var(--font-mono);padding:0 5px;box-shadow:0 1px 2px rgba(11,13,12,.12)}
/* the Plan key: square swatches, line samples, Phase 2 dashed, Problem in red */
.xlegend .li i.lg-sq{border-radius:2px;width:12px;height:12px}
.xlegend .li i.lg-p2{outline:1.5px dashed var(--text-2);outline-offset:-1.5px}
.xlegend .li i.lg-ln{width:16px;height:0;border-radius:0;background:none!important;align-self:center}
.xlegend .li i.lg-bad{background:transparent;border:2px solid #d64541}
/* long names (Single-family homes, Detention pond) wrap to a second line instead of being cut off */
.xlegend .sp-key{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.xlegend .sp-key .li{min-width:0;white-space:normal;align-items:flex-start}.xlegend .sp-key .li span{min-width:0;line-height:1.25;overflow-wrap:break-word}.xlegend .sp-key .li i{flex:none;margin-top:1px}.xlegend .sp-key .li i.lg-ln{align-self:flex-start;margin-top:7px}
/* phones: the legend shows (folded) while planning, just above the sheet; not while a run's pill is there */
@media (max-width:700px){
  .app.planning:has(.card.open) .legends{display:flex;position:fixed;left:10px;bottom:var(--sp-above,12px);z-index:7;max-height:min(40vh,calc(100vh - var(--sp-above,12px) - 140px))}
  body:has(.sp-runpill:not([hidden])) .app.planning .legends{display:none!important}
  .sp-mpill{top:8px;bottom:auto;height:34px;font-size:12px}
  .sp-mpill .sp-mp-b{height:26px;padding:0 11px}
  .sp-scale{bottom:8px;right:8px}
}
/* Change With AI: what it did */
#card .sp-chgdone{margin-top:10px;border:1px solid var(--line-2);border-radius:8px;padding:8px 10px;background:var(--panel-2)}
#card .sp-chk{list-style:none;margin:2px 0 6px;padding:0;display:grid;gap:3px;font-size:13px}
#card .sp-chk li{position:relative;padding-left:20px;line-height:1.35}
#card .sp-chk li::before{content:"";position:absolute;left:2px;top:3px;width:10px;height:6px;border-left:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(-45deg)}
#card .sp-chk li.skip{color:var(--text-2)}
#card .sp-chk li.skip::before{content:"!";border:0;transform:none;top:0;left:4px;width:auto;height:auto;font-weight:700;color:var(--amber)}
#card .sp-chg-acts{padding:4px 0 0;align-items:center;flex-wrap:wrap}
#card .sp-chg-acts .sp-link{margin-left:auto;font-size:12px}

/* ---------- motion & charts ---------- */
/* Chart motion runs in src/motion.js (Web Animations and attribute tweens that leave nothing behind); these rules set where
   marks grow from, the hover feedback and the loading placeholder. Timings use the shared motion tokens. */
.m-bar{transform-box:view-box} /* bars scale about the chart's zero line (an origin in the chart's own units) */
.m-dot{transform-box:fill-box;transform-origin:center}
.m-hbar{transform-origin:0 50%}
/* hover: marks ease to their highlight instead of snapping */
.mk-hit path,.mk-hit rect,.mk-hb i b,.mk-hb span,.mk-cross,.mk-dot,.mk-spk circle,.mx-spark circle,.mx-chart g.mx-hit line,.mx-lags rect,.mx-tabs button,.mx-row,.cmp-bar .bar b,.cc-hb s,.cc-chart rect,.tl-chart .tl-l rect{transition:opacity 120ms var(--ease,cubic-bezier(.2,.7,.2,1)),filter 120ms var(--ease,cubic-bezier(.2,.7,.2,1)),fill 120ms var(--ease,cubic-bezier(.2,.7,.2,1)),color 120ms var(--ease,cubic-bezier(.2,.7,.2,1)),background-color 120ms var(--ease,cubic-bezier(.2,.7,.2,1)),border-color 120ms var(--ease,cubic-bezier(.2,.7,.2,1))}
.tl-chart .tl-l rect.hov{filter:brightness(1.14) saturate(1.1)}
.cc-chart rect:hover,.cmp-bar .bar b:hover{filter:brightness(1.12)}
/* loading: a muted block with a slow shimmer, clearly not a chart (no bars, no numbers) */
.mk-skels{display:grid;gap:14px;margin-top:14px}
.mk-skel{border-radius:6px;margin-top:8px;background:var(--chip) linear-gradient(100deg,transparent 30%,var(--line) 50%,transparent 70%) no-repeat;background-size:200% 100%;background-position:150% 0;animation:mk-shimmer 1.6s var(--ease,cubic-bezier(.2,.7,.2,1)) infinite}
@keyframes mk-shimmer{to{background-position:-50% 0}}
@media (prefers-reduced-motion:reduce){.mk-skel{animation:none;background-image:none}}
@media print{*{animation:none!important;transition:none!important}}
/* ---------- site plan tools ---------- */
/* the tool strip on the map: grouped icon buttons, bottom left of the open map (clear of the Plan key and the scale) */
.sp-strip{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--panel);color:var(--text);box-shadow:var(--sh-2);pointer-events:auto;transition:left var(--dur-base,220ms) var(--ease,cubic-bezier(.2,.7,.2,1)),bottom var(--dur-base,220ms) var(--ease,cubic-bezier(.2,.7,.2,1))}
.sp-strip[hidden]{display:none}
.sp-tgrp{display:flex;gap:2px}
.sp-tgrp+.sp-tgrp{border-left:1px solid var(--line);padding-left:3px;margin-left:1px}
.sp-tb{width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--text-2);cursor:var(--cur-pointer,pointer);transition:background var(--dur-fast,150ms) var(--ease,ease),color var(--dur-fast,150ms) var(--ease,ease)}
.sp-tb:hover{background:var(--chip);color:var(--text)}
.sp-tb.on{background:var(--brand);color:var(--brand-ink)}
.sp-tb[aria-disabled]{opacity:.38;cursor:var(--cur-default,default)}
.sp-tb[aria-disabled]:hover{background:transparent;color:var(--text-2)}
.sp-tb:focus-visible,.sp-tpop button:focus-visible,.sp-tpop input:focus-visible{outline:var(--focus,2px solid var(--brand));outline-offset:1px}
.sp-tb-more{display:none}
/* its pop-overs: what to draw, and Layers */
.sp-tpop{position:absolute;z-index:2;width:268px;max-width:calc(100% - 12px);overflow:auto;padding:8px;border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--panel);color:var(--text);box-shadow:var(--sh-2);pointer-events:auto;font:500 12.5px/1.35 var(--font-display)}
.sp-tpop[hidden]{display:none}
.sp-tp-h{font:700 10.5px/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:4px 6px 8px}
.sp-tp-i{display:flex;align-items:center;gap:10px;width:100%;padding:7px 8px;border:0;border-radius:6px;background:transparent;color:var(--text);text-align:left;font:inherit;cursor:var(--cur-pointer,pointer)}
.sp-tp-i:hover{background:var(--chip)}
.sp-tp-i span{display:grid;gap:1px}
.sp-tp-i small,.sp-lrow small,.sp-tp-sw2 small{font-size:11px;color:var(--muted);font-weight:500}
.sp-tp-sw{flex:none;width:16px;height:12px;border-radius:2px;border:1px solid rgba(11,13,12,.18)}
.sp-tp-sw.k-building{background:#d0694c}.sp-tp-sw.k-green{background:#62b072}.sp-tp-sw.k-plaza{background:#d9c8a9}.sp-tp-sw.k-pond{background:#5b9bd1}.sp-tp-sw.k-drive{background:#7c8689}.sp-tp-sw.k-trail{background:#d9c7a0}
.sp-tp-sw.k-keepout{border:1px dashed #9b3b32;background:repeating-linear-gradient(45deg,#9b3b32 0 1.5px,transparent 1.5px 4px)}
.sp-tp-n{margin:6px 6px 2px;font-size:11.5px;line-height:1.4;color:var(--muted)}
.sp-lrows{display:grid}
.sp-lrow{display:grid;grid-template-columns:minmax(0,1fr) 28px 28px;align-items:center;gap:2px;padding:3px 2px 3px 6px;border-radius:6px}
.sp-lrow:hover{background:var(--chip)}
.sp-lrow>span{display:grid;min-width:0}
.sp-lrow.off>span{color:var(--muted)}
.sp-lb{width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--text-2);cursor:var(--cur-pointer,pointer)}
.sp-lb:hover{background:var(--panel);color:var(--text)}
.sp-lb[aria-pressed="false"][data-f^="eye"]{color:var(--muted)}
.sp-lb[aria-pressed="true"][data-f^="lock"]{color:var(--brand)}
.sp-tp-sub{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0 0;padding:8px 6px 0;border-top:1px solid var(--line)}
.sp-seg{display:inline-flex;border:1px solid var(--line-2);border-radius:999px;overflow:hidden}
.sp-seg button{border:0;background:transparent;color:var(--text-2);font:600 11.5px var(--font-display);padding:4px 10px;cursor:var(--cur-pointer,pointer)}
.sp-seg button[aria-pressed="true"]{background:var(--brand);color:var(--brand-ink)}
.sp-tp-sw2{display:flex;align-items:center;gap:6px;padding:8px 6px 0;cursor:var(--cur-pointer,pointer)}
.sp-tp-sw2 input{accent-color:var(--brand);margin:0}
.sp-tp-sw2 span{display:grid;gap:1px}
/* Layers | Items tabs; Items: every piece of the plan under its layer (sticky headings that fold), rename in place */
.sp-ltabs{display:flex;gap:2px;margin:0 0 8px;padding:2px;border-radius:8px;background:var(--chip)}
.sp-ltabs button{flex:1;padding:6px 8px;border:0;border-radius:6px;background:transparent;color:var(--text-2);font:600 12px/1.2 var(--font-display);cursor:var(--cur-pointer,pointer)}
.sp-ltabs button:hover{color:var(--text)}
.sp-ltabs button[aria-selected="true"]{background:var(--panel);color:var(--text);box-shadow:0 1px 2px rgba(11,13,12,.14)}
.sp-tpop.sp-items{width:300px;display:flex;flex-direction:column;overflow:hidden;padding-bottom:4px}
.sp-il{flex:1 1 auto;min-height:0;max-height:420px;overflow:auto;overscroll-behavior:contain;margin:0 -4px;padding:0 4px 4px}
.sp-ig+.sp-ig{margin-top:2px}
.sp-ig-h{position:sticky;top:0;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 28px 28px;align-items:center;gap:2px;background:var(--panel)}
.sp-ig-f{display:flex;align-items:center;gap:6px;min-width:0;height:28px;padding:0 6px 0 4px;border:0;border-radius:6px;background:transparent;color:var(--text-2);font:700 10.5px/1 var(--font-display);letter-spacing:.08em;text-transform:uppercase;text-align:left;cursor:var(--cur-pointer,pointer)}
.sp-ig-f:hover{background:var(--chip);color:var(--text)}
.sp-ig-f span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-ig-f small{flex:none;font-weight:600;letter-spacing:0;color:var(--muted)}
.sp-ig-c{flex:none;width:6px;height:6px;margin:0 2px 0 3px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(-45deg);transition:transform var(--dur-fast,150ms) var(--ease,ease)}
[aria-expanded="true"]>.sp-ig-c{transform:translateY(-1px) rotate(45deg)}
.sp-it{display:grid;grid-template-columns:minmax(0,1fr) 26px;align-items:center;border-radius:6px}
.sp-it:hover{background:var(--chip)}
.sp-it.on{background:color-mix(in srgb,var(--brand) 13%,var(--panel))}
.sp-it.on .sp-it-n{color:var(--brand);font-weight:600}
.sp-it-b{display:flex;align-items:center;gap:8px;min-width:0;padding:4px 4px 4px 16px;border:0;border-radius:6px;background:transparent;color:var(--text);text-align:left;font:inherit;cursor:var(--cur-pointer,pointer)}
.sp-it-b[hidden]{display:none}
.sp-tpop .sp-it-b:focus-visible,.sp-tpop .sp-ig-f:focus-visible{outline-offset:-2px}
.sp-it-sw{flex:none;width:12px;height:12px;border-radius:3px;background:var(--c);border:1px solid rgba(11,13,12,.18)}
.sp-it-sw.ko{background:repeating-linear-gradient(45deg,var(--c) 0 1.5px,transparent 1.5px 4px);border:1px dashed var(--c)}
.sp-it-t{display:grid;gap:1px;min-width:0}
.sp-it-n,.sp-it-t small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-it-t small{font-size:11px;font-weight:500;color:var(--muted)}
.sp-it-r{width:26px;height:26px;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--muted);opacity:0;cursor:var(--cur-pointer,pointer)}
.sp-it-r svg{width:13px;height:13px}
.sp-it:hover .sp-it-r,.sp-it:focus-within .sp-it-r{opacity:1}
.sp-it-r:hover{background:var(--panel);color:var(--text)}
.sp-ig.off .sp-it-n,.sp-ig.off .sp-ig-f span{color:var(--muted)}
.sp-ig.off .sp-it-sw{opacity:.4}
.sp-it-e{display:flex;align-items:center;gap:8px;min-width:0;padding:3px 4px 3px 16px}
.sp-it-in{flex:1;min-width:0;padding:4px 6px;border:1px solid var(--brand);border-radius:5px;background:var(--panel);color:var(--text);font:inherit;outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 18%,transparent)}
.sp-it.ren{background:transparent}
.sp-it.ren .sp-it-r{visibility:hidden}
@media (hover:none){.sp-it-r{opacity:1}}
/* a message while planning sits above the tool strip, not over it */
@media (min-width:701px){.app.planning .toast{bottom:64px}}
/* Shift-drag on the map: the selection box */
.sp-box{position:absolute;z-index:3;pointer-events:none;border:1.5px dashed var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent);border-radius:2px}
.sp-box[hidden]{display:none}
/* the save status: an icon beside Undo and Redo (its words in the tooltip); a failed sync is a red button that retries */
#card .sp-save{display:inline-flex;align-items:center}
#card .sp-save:empty{display:none}
#card .sp-sv{width:28px;height:28px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:none;color:var(--muted)}
#card .sp-sv.synced{color:var(--brand)}
#card button.sp-sv.bad{color:var(--danger);cursor:var(--cur-pointer,pointer)}
#card button.sp-sv.bad:hover{background:color-mix(in srgb,var(--danger) 10%,transparent)}
#card button.sp-sv.bad:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
/* replacing a layout you changed: asked, in the panel */
#card .sp-confirm{margin:var(--sp-3) var(--pg,16px) 0;padding:12px 14px;border:1px solid var(--amber);border-left-width:3px;border-radius:var(--r-md);background:var(--panel-2)}
#card .sp-confirm p{margin:0 0 8px;font-size:13px;line-height:1.4}
#card .sp-confirm .btnrow{display:flex;flex-wrap:wrap;gap:6px}
/* several pieces picked: their buttons in one row */
#card .sp-fsrow{display:contents;border:0;padding:0;margin:0}
/* the development mix (the strip's Mix): a card above the legend (or the strip), one row a use: colour, name, footprint
   acres and share of the site in two right-aligned columns, the count and floor area on a line under them */
.sp-dmix{position:absolute;z-index:1;width:288px;max-width:calc(100% - 24px);overflow:auto;overscroll-behavior:contain;padding:6px 8px 10px;border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--panel);color:var(--text);box-shadow:var(--sh-2);pointer-events:auto;font:500 12.5px/1.35 var(--font-display);font-variant-numeric:tabular-nums}
.sp-dmix[hidden]{display:none}
.sp-dmix.fold{padding-bottom:8px}
.sp-mx-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 -2px 2px 0}
.sp-mx-f{display:inline-flex;align-items:center;min-height:28px;padding:0 6px;border:0;border-radius:6px;background:transparent;color:var(--muted);cursor:var(--cur-pointer,pointer)}
.sp-mx-f:hover{background:var(--chip);color:var(--text)}
.sp-mx-f b{font:700 10.5px/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase}
.sp-mx-x{width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--text-2);cursor:var(--cur-pointer,pointer)}
.sp-mx-x:hover{background:var(--chip);color:var(--text)}
.sp-mx-hd,.sp-mx-r,.sp-mx-t{display:grid;grid-template-columns:12px minmax(0,1fr) 60px 42px;align-items:baseline;column-gap:8px}
.sp-mx-hd{padding:0 6px 3px;font-size:10.5px;font-weight:600;color:var(--muted)}
.sp-mx-hd span:first-child,.sp-mx-t>span:first-child{grid-column:1 / 3}
.sp-mx-hd span:not(:first-child),.sp-mx-a,.sp-mx-p{text-align:right;white-space:nowrap}
.sp-mx-rows{display:grid;gap:1px}
.sp-mx-r{width:100%;padding:5px 6px;border:0;border-radius:6px;background:transparent;color:var(--text);text-align:left;font:inherit}
button.sp-mx-r{cursor:var(--cur-pointer,pointer)}
button.sp-mx-r:hover{background:var(--chip)}
.sp-mx-r.on{background:color-mix(in srgb,var(--brand) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 40%,transparent)}
.sp-mx-sw{align-self:center;width:12px;height:12px;border-radius:3px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(11,13,12,.18)}
.sp-mx-zr .sp-mx-sw{background:color-mix(in srgb,var(--c) 22%,#fff);box-shadow:inset 0 0 0 2px var(--c)}
.sp-mx-n{min-width:0;font-weight:600;overflow-wrap:anywhere}
.sp-mx-s{grid-column:2 / -1;font-size:11px;font-weight:500;color:var(--muted)}
.sp-mx-a{font-weight:700}
.sp-mx-p{color:var(--text-2);font-weight:600}
.sp-mx-t{margin-top:3px;padding:7px 6px 0;border-top:1px solid var(--line);font-weight:700}
.sp-mx-note{margin:5px 6px 0;font-size:11px;line-height:1.4;color:var(--muted)}
.sp-mx-zh{display:grid;gap:2px;margin:9px 0 1px;padding:8px 6px 3px;border-top:1px solid var(--line)}
.sp-mx-zh b{font:700 10.5px/1.2 var(--font-display);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.sp-mx-zh small{font-size:11px;color:var(--muted)}
.sp-mx-zr .sp-mx-n{font-weight:500}
.sp-mx-e{padding:6px;color:var(--muted)}
.sp-dmix button:focus-visible{outline:var(--focus,2px solid var(--brand));outline-offset:-1px}
/* phones: fewer buttons until More opens the rest; the save status only when a sync failed */
@media (max-width:700px){
  .sp-strip{left:8px;bottom:8px;padding:2px}
  .sp-tb{width:36px;height:36px}
  .sp-tb-more{display:grid}
  .sp-strip:not(.open) .sp-tb-x{display:none}
  .sp-strip:not(.open) .sp-tgrp:not(:has(.sp-tb:not(.sp-tb-x))){display:none}
  .sp-strip.open{flex-wrap:wrap;max-width:calc(100% - 16px)}
  .sp-tpop{width:min(268px,calc(100vw - 16px))}
  .sp-tpop.sp-items{width:min(300px,calc(100vw - 16px))}
  .sp-dmix{width:min(300px,calc(100% - 16px));max-width:none}
  .sp-tpop.ph{position:fixed;z-index:var(--z-sheet,11)}
  .sp-mapui:has(.sp-strip:not([hidden])) .sp-mpill{top:52px}
}

/* ---------- market + assistant (round 2) ---------- */
/* Market tab: charts are drawn at their box's measured width (src/area.js measure()), so viewBox units are CSS pixels and
   one type scale holds everywhere: axis ticks 11px, chart labels and legends 12px, stat values 16px, stat labels 11px */
#view-market{scrollbar-gutter:stable}
.mk-probe{height:0;overflow:hidden;visibility:hidden;pointer-events:none}
.mk-cw{display:block;height:0}
#view-market .mk-ax,#view-market .mx-ax{font-size:11px}
#view-market .mk-leg,#view-market .mx-leg{font-size:12px}
#view-market .mk-hint{font-size:11px}
/* headline tiles: area.js sets the columns so every row is full; tiles share one height, sparklines sit on the bottom */
#view-market .mk-kpis2{gap:10px}
@media (min-width:701px){ #view-market .mk-kpis2{grid-auto-rows:1fr} }
#view-market .mk-kpi{padding:12px 14px 10px;min-height:118px}
#view-market .mk-kpi .mk-kl{font-size:11px;letter-spacing:.1em}
#view-market .mk-kpi .mk-kspk{margin-top:auto;padding-top:8px;height:auto}
#view-market .mk-ks{font-size:12px}
/* stat cells */
#view-market .kgrid.mk-kg4 b,#view-market .mx-kg b{font-size:16px}
#view-market .kgrid.mk-kg4 span,#view-market .mx-kg span{font-size:11px;letter-spacing:.06em}
#view-market .kgrid.mk-kg4>div{padding:9px 12px}
/* horizontal-bar lists: 26px rows, one label column, values right-aligned in their own column */
#view-market .mk-hbars{gap:2px}
#view-market .mk-hb{grid-template-columns:minmax(0,min(38%,240px)) minmax(0,1fr) 84px;gap:10px;min-height:26px;font-size:12px}
#view-market .mk-hb i{height:12px}
#view-market .mk-hb em{font-size:12px;text-align:right;color:var(--text)}
#view-market .mk-hb small{font-size:11px}
/* small multiples: area.js sets the columns (3 a row on a desktop, 2 on a tablet, 1 on a phone, rows always full) */
#view-market .mk-sms{gap:12px}
#view-market .mk-sm{padding:10px 12px 8px}
#view-market .mk-smh span{font-size:12px}
#view-market .mk-smh b{font-size:15px}
#view-market .mk-smf{font-size:11px;margin-top:2px}
/* tables (body text 12.5px), change badges and small print (12px) */
#view-market .mk-tbl td,#view-market .mx-table td{font-size:12.5px}
#view-market .mk-d,#view-market .mx-asof,#view-market .mk-more summary,#view-market .chitem em{font-size:12px}
#view-market .mk-tbl th,#view-market .mx-table th{font-size:11px;white-space:nowrap}
#view-market .kgrid.mk-kg4.k3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:700px){ #view-market .kgrid.mk-kg4.k3{grid-template-columns:repeat(2,minmax(0,1fr))} }
#view-market .mx-sym{font-size:11px}
#view-market .mx-sub{font-size:11px}
#view-market .mx-side .mx-ctl label>span{font-size:11px}
/* Markets: a wider sparkline with one hover strip and a dot that follows the mouse */
#view-market .mx-sp{width:auto}
#view-market .mx-spark{width:auto;height:28px}
.mx-sdot{pointer-events:none}.mx-spark.up .mx-sdot{fill:var(--mx-up)}.mx-spark.dn .mx-sdot{fill:var(--mx-dn)}
/* line charts' single hover strip (src/mkcharts.js hx): area.js moves the dot and cross line and shows them */
.mk-hxc,.mk-hxd{pointer-events:none}
.hx-on .mk-hxc,.hx-on .mk-hxd{opacity:1}
.mx-spark .mk-hxd{opacity:0}.mx-spark.hx-on .mk-hxd{opacity:1}
/* Correlation explorer: a fixed control column, the chart takes the rest */
#view-market .mx-wrap{grid-template-columns:280px minmax(0,1fr)}
@media (max-width:980px){ #view-market .mx-wrap{grid-template-columns:minmax(0,1fr)} }
/* Ask AI: no status in the header while it works; the pending bubble at the bottom shows a quiet live line instead
   ("Thinking", then the step it's on) with a soft shimmer, and a finished turn's steps fold into one muted line above
   its answer that opens to list them */
.ai-m.pending{padding:2px 0}
.ai-work{display:inline-flex;align-items:center;font-size:13px;line-height:1.5;color:var(--text-2)}
.ai-wl{background:linear-gradient(90deg,var(--muted) 0%,var(--muted) 35%,var(--text) 50%,var(--muted) 65%,var(--muted) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:ai-shimmer 1.8s linear infinite}
@keyframes ai-shimmer{from{background-position:100% 0}to{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.ai-wl{animation:none;background:none;color:var(--text-2)}}
.ai-steps{align-self:flex-start;max-width:100%;margin:-4px 0 -2px;font-size:12px;color:var(--muted)}
.ai-steps summary{display:inline-flex;align-items:center;gap:4px;cursor:var(--cur-pointer,pointer);list-style:none;border-radius:4px;padding:1px 2px;margin-left:-2px}
.ai-steps summary::-webkit-details-marker{display:none}
.ai-steps summary::after{content:"›";font-size:14px;line-height:1;transition:transform 150ms}
.ai-steps[open] summary::after{transform:rotate(90deg)}
.ai-steps summary:hover{color:var(--text-2)}
.ai-steps ol{margin:4px 0 2px;padding-left:18px;display:grid;gap:1px}
.ai-steps li span{font-family:var(--font-mono);font-size:11px}
@media (prefers-reduced-motion:reduce){.ai-steps summary::after{transition:none}}
/* Market on a phone: a wider label column for the bar lists, the Correlate link goes (the row opens it), full tile rows */
@media (max-width:700px){
  #view-market .mk-hb{grid-template-columns:minmax(0,46%) minmax(0,1fr) 68px;gap:8px}
  #view-market .mx-table th:last-child,#view-market .mx-table td:last-child{display:none}
  #view-market .mx-side .mx-kg>div:last-child{grid-column:auto}
  #view-market .mk-kpi{min-height:0}
}
/* ---------- site plan panel (round 2) ---------- */
/* the header: a long project name is cut short in the breadcrumb (the whole of it in the tooltip); the option's name and
   address never push the actions off the row */
#card.sp-mode .sp-crumb{font-size:12px}
#card .sp-title{text-overflow:ellipsis}
#card .sp-ttl .bsub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#card .sp-hact .btn{min-height:32px}
/* the options: one row that scrolls sideways (never two rows); names capped with an ellipsis, New Option quiet at the end */
#card.sp-mode .sp-plans,#card.sp-mode .sp-plans-ph{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 20px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 20px),transparent);padding-right:20px}
#card.sp-mode .sp-plans::-webkit-scrollbar{display:none}
#card .sp-plans .chip{flex:none;max-width:160px;min-height:28px;display:block;line-height:18px}
#card .sp-plans .sp-newopt{max-width:none;font-weight:500;color:var(--muted);background:transparent}
#card .sp-plans .sp-newopt:hover{color:var(--text);border-color:var(--text-2)}
/* sections: a heading with its icon tile, a row of actions, then fields */
#card.sp-mode .bsec{gap:12px}
#card.sp-mode .bsec .lt .src{font:500 12px var(--font-display);color:var(--muted)}
#card .sp-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#card .sp-acts{display:flex;flex-wrap:wrap;gap:6px}
#card.sp-mode .bsec .btn{white-space:nowrap}
#card .btn.ghost.sp-del{color:var(--danger)}
#card .btn.ghost.sp-del:hover:not(:disabled){background:color-mix(in srgb,var(--danger) 9%,transparent)}
#card .sp-foot{justify-content:center;margin:20px 14px 0;padding:12px 0 0;border-top:1px solid var(--line)}
#card .sp-foot .sp-del{font-size:12px}
#card .vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* small-caps group headers (Program, Setbacks, …) */
#card.sp-mode .sp-sub{display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin:6px 0 0;padding-top:14px;border-top:1px solid var(--line);font:700 10.5px/1.4 var(--font-display);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
/* a switch: a checkbox (role=switch) over a track and knob; brand when on, the focus ring on the track */
#card .sp-toggle{position:relative;display:flex;align-items:center;gap:10px;min-height:var(--ctl);min-width:0;font:500 12.5px/1.3 var(--font-display);color:var(--text);cursor:var(--cur-pointer,pointer)}
#card .sp-toggle input{position:absolute;left:0;top:50%;width:34px;height:20px;margin:-10px 0 0;opacity:0;cursor:inherit}
#card .sp-tk{position:relative;flex:none;width:34px;height:20px;border-radius:999px;background:var(--ink-300,#b9bfbc);transition:background var(--dur-fast,150ms) var(--ease,ease)}
#card .sp-tk::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(11,13,12,.3);transition:transform var(--dur-fast,150ms) var(--ease,ease)}
#card .sp-toggle input:checked+.sp-tk{background:var(--brand)}
#card .sp-toggle input:checked+.sp-tk::after{transform:translateX(14px)}
#card .sp-toggle input:focus-visible+.sp-tk{outline:2px solid var(--focus);outline-offset:2px}
#card .sp-toggle input:disabled~*{opacity:.5}
#card .sp-tl{min-width:0}
@media (prefers-reduced-motion:reduce){#card .sp-tk,#card .sp-tk::after{transition:none}}
/* fields: two columns, the label above the box (never cut off), every box the same height, the unit inside it on the right */
#card .sp-fg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 12px;margin:0}
#card .sp-f{display:flex;flex-direction:column;justify-content:flex-end;gap:5px;min-width:0}
#card .sp-f.w2,#card .sp-fg>.sp-toggle.w2{grid-column:1/-1}
#card .sp-fg>.sp-toggle{align-self:end}
#card .sp-fl{font:500 12px/1.3 var(--font-display);color:var(--text-2)}
#card .sp-fl small{font-weight:400;font-size:11px;color:var(--muted);white-space:nowrap}
#card.sp-mode .sp-f input,#card.sp-mode .sp-f select,#card.sp-mode .sp-exp select,#card.sp-mode .sp-mix input{box-sizing:border-box;width:100%;min-width:0;height:var(--ctl);margin:0;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font:500 13px var(--font-display);padding:0 10px}
#card.sp-mode .sp-mix input{height:32px;padding:0 6px}
#card.sp-mode .sp-f :is(input,select):focus-visible,#card.sp-mode .sp-exp select:focus-visible,#card.sp-mode .sp-mix input:focus-visible{outline:2px solid var(--focus);outline-offset:0;border-color:var(--brand)}
#card .sp-ctl{position:relative;display:block;min-width:0}
#card.sp-mode .sp-ctl input{padding-right:calc(var(--u,0ch) + 10px);font-variant-numeric:tabular-nums;-moz-appearance:textfield;appearance:textfield}
#card .sp-ctl input::-webkit-inner-spin-button,#card .sp-ctl input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#card .sp-u{position:absolute;right:10px;top:50%;transform:translateY(-50%);font:500 12px var(--font-display);color:var(--muted);pointer-events:none;white-space:nowrap}
#card .sp-fs{border:0;padding:0;margin:0;min-width:0;display:grid;gap:12px}
/* an (i) beside a heading or a line: a short note opens in place, under it */
#card .sp-i{flex:none;display:inline-grid;place-items:center;width:24px;height:24px;margin:-4px 0 -4px 2px;padding:0;border:0;border-radius:50%;background:none;color:var(--muted);vertical-align:middle;cursor:var(--cur-pointer,pointer)}
#card .sp-i:hover,#card .sp-i[aria-expanded="true"]{color:var(--brand);background:var(--chip)}
#card .sp-i:focus-visible{outline:2px solid var(--focus);outline-offset:0}
#card .sp-ipop{flex:1 0 100%;display:block;margin:6px 0 2px;padding:8px 10px;border-radius:var(--r-sm);background:var(--panel-2);border:1px solid var(--line);font:400 12px/1.45 var(--font-display);letter-spacing:0;text-transform:none;color:var(--text-2)}
#card .sp-ipop[hidden]{display:none}
#card.sp-mode .lt{flex-wrap:wrap}
#card.sp-mode .lt .sp-i{margin-left:-4px}
/* a chevron on what folds; it turns when open. A text toggle (Ideas, similar layouts), an icon one (Build), and the
   Why / Details / notes summaries look the same */
.sp-chev{display:inline-block;flex:none;width:7px;height:7px;margin:0 2px 0 7px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform var(--dur-fast,150ms) var(--ease,ease)}
[aria-expanded="true"]>.sp-chev{transform:translateY(1px) rotate(-135deg)}
#card .sp-tgl,#card .sp-why>summary,#card .sp-ninfo>summary{display:inline-flex;align-items:center;min-height:28px;margin:0 -6px;padding:0 6px;border:0;border-radius:6px;background:none;font:600 12px var(--font-display);color:var(--text-2);list-style:none;white-space:nowrap;cursor:var(--cur-pointer,pointer)}
#card .sp-tgl:hover,#card .sp-why>summary:hover,#card .sp-ninfo>summary:hover{background:var(--chip);color:var(--text)}
#card .sp-tgl:focus-visible,#card .sp-why>summary:focus-visible,#card .sp-ninfo>summary:focus-visible{outline:2px solid var(--focus);outline-offset:0}
#card .sp-why>summary::-webkit-details-marker,#card .sp-ninfo>summary::-webkit-details-marker{display:none}
#card .sp-why>summary::after,#card .sp-ninfo>summary::after{content:"";display:inline-block;width:7px;height:7px;margin:0 2px 0 7px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform var(--dur-fast,150ms) var(--ease,ease)}
#card .sp-why[open]>summary::after,#card .sp-ninfo[open]>summary::after{transform:translateY(1px) rotate(-135deg)}
#card .sp-tgl-i{width:30px;height:30px;min-height:30px;justify-content:center;margin:-4px -6px -4px 0;padding:0}
#card .sp-tgl-i .sp-chev{margin:0}
@media (prefers-reduced-motion:reduce){.sp-chev,#card .sp-why>summary::after,#card .sp-ninfo>summary::after,#card.sp-mode details.bsec>summary::after{transition:none}}
/* Build: the request, how to run it with Phase 2's setting as a note that goes to Settings, then Build Layouts */
#card .sp-ai-h{align-items:center}
#card .sp-ai textarea{min-height:60px;margin-top:0;padding:8px 10px;border-radius:var(--r-sm);font-size:13px;line-height:1.4}
#card .sp-ai textarea:focus-visible{outline:2px solid var(--focus);outline-offset:0}
#card .sp-sugs{margin-top:-4px}
#card .sp-runopts{margin-top:0;justify-content:space-between}
#card .sp-fillnote{display:inline-flex;align-items:center;gap:5px;min-height:28px;margin-right:-6px;padding:0 6px;border:0;border-radius:6px;background:none;font:500 12px var(--font-display);color:var(--text-2);white-space:nowrap;cursor:var(--cur-pointer,pointer)}
#card .sp-fillnote b{font-weight:700;color:var(--text)}
#card .sp-fillnote .sp-chev{margin:0 0 0 2px;transform:rotate(-45deg)}
#card .sp-fillnote:hover{background:var(--chip);color:var(--text)}
#card .sp-fillnote:focus-visible{outline:2px solid var(--focus)}
#card .sp-built-l{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#card .sp-built .lt{margin-bottom:0}
#card .sp-readas{margin-top:0}
#card .sp-readas .sp-ra-e{min-height:24px;padding:0 8px;font-size:12px}
#card .sp-ideas-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:12.5px;color:var(--text-2)}
#card .sp-ideas{margin-top:0}
#card .sp-idea .sp-row{margin-top:2px}
#card .sp-idea-w{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
#card .sp-idea-req span{font:600 10.5px var(--font-display);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
/* Change with AI: the box, then Make Changes with its switch beside it */
#card .sp-go2{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
#card .sp-go2 .btn{min-height:40px;padding:0 16px}
/* the layout card's update icon (top right, only while the layout is out of date): it turns while the re-fit runs */
.sp-ov-n.has-upd{align-items:center}
.sp-ovupd{flex:none;display:grid;place-items:center;width:32px;height:32px;margin:-6px -6px -6px auto;padding:0;border-radius:var(--r-sm);border:1px solid color-mix(in srgb,#e0a23c 70%,transparent);background:rgba(224,162,60,.14);color:#f2c16f;cursor:var(--cur-pointer,pointer);transition:background var(--dur-fast,150ms),border-color var(--dur-fast,150ms),color var(--dur-fast,150ms)}
.sp-ovupd:hover:not(:disabled){background:rgba(224,162,60,.26);border-color:#e0a23c;color:#ffd58c}
.sp-ovupd:focus-visible{outline:2px solid var(--green-300);outline-offset:2px}
.sp-ovupd:disabled{cursor:var(--cur-default,default)}
.sp-ovupd:disabled:not([aria-busy]){opacity:.45}
.sp-ovupd[aria-busy="true"] svg{animation:sp-spin .9s linear infinite}
/* Ask about this plan: the conversation (each question, its answer), questions to try or ask next, the box */
#card .sp-askp .sp-ai-h .sp-link{font-size:12px;padding:0}
.sp-convo{display:grid;gap:10px;max-height:420px;overflow-y:auto;overscroll-behavior:contain;padding:2px 2px 2px 0}
.sp-qa{display:grid;gap:6px}
.sp-q{justify-self:end;max-width:88%;padding:6px 10px;border-radius:10px 10px 2px 10px;background:var(--green-50);border:1px solid var(--green-200);color:var(--text);font-size:12.5px;line-height:1.45}
.sp-a{max-width:100%;padding:8px 12px;border-left:3px solid var(--brand);background:var(--panel-2);border-radius:0 6px 6px 0;font-size:13px;line-height:1.5;color:var(--text)}
.sp-a p{margin:0}.sp-a p+p,.sp-a p+ul,.sp-a ul+p{margin-top:6px}
.sp-a ul{margin:4px 0 0;padding-left:18px;display:grid;gap:2px}
.sp-a .sp-aerr{color:var(--text-2)}
#card .sp-qsugs{margin-top:0}
#card .sp-qsugs .chip{white-space:normal;text-align:left;height:auto;min-height:28px;line-height:1.3;padding-top:4px;padding-bottom:4px}
#card .sp-chg-acts{margin-top:4px}
/* Settings: New layouts and the two switches first */
#card .sp-prm-a{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
#card .sp-tgs{display:grid;gap:2px}
#card .sp-tgs .sp-toggle{min-height:32px}
#card .sp-mix{margin-top:2px}
#card .sp-mix th{font:500 11.5px var(--font-display);padding:0 2px 4px}
#card .sp-mix-f{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:-4px}
#card .sp-solvebar{margin:0}
/* Site: its tools in a grid of equal buttons with icons */
#card .sp-g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#card .sp-g2 .btn{min-height:var(--ctl);width:100%;box-sizing:border-box;justify-content:center;overflow:hidden;text-overflow:ellipsis}
#card .sp-g2 .sp-stb{justify-content:flex-start;gap:8px;padding:0 12px}
#card .sp-stb svg{flex:none;color:var(--brand)}
#card .sp-stb span{min-width:0;overflow:hidden;text-overflow:ellipsis}
#card .sp-stb[aria-pressed="true"]{background:var(--text);border-color:var(--text);color:var(--panel)}
#card .sp-stb[aria-pressed="true"] svg{color:inherit}
#card .sp-parcels{display:flex;flex-wrap:wrap;gap:6px}
#card .sp-parcels .chip{max-width:100%;min-width:0}
#card .sp-parcels .chip>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Add: the pieces as tiles in their groups (groups flow side by side when they fit), then the building library */
#card .sp-addg{display:flex;flex-wrap:wrap;gap:14px 18px}
#card .sp-add-g{display:grid;gap:6px;flex:none;min-width:0}
#card.sp-mode .sp-add-g .sp-sub{margin:0;padding:0;border:0}
#card .sp-add-r{display:flex;flex-wrap:wrap;gap:6px}
#card .sp-add{width:76px;min-height:64px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:7px 4px 6px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--panel);color:var(--text);font:600 11px/1.2 var(--font-display);text-align:center;cursor:var(--cur-pointer,pointer);transition:border-color var(--dur-fast,150ms),background var(--dur-fast,150ms)}
#card .sp-add svg{width:30px;height:30px;box-sizing:border-box;padding:3px;border-radius:7px;background:color-mix(in srgb,var(--ac) 20%,transparent);color:color-mix(in srgb,var(--ac) 62%,#0b0d0c)}
#card .sp-add span{display:block;max-width:100%}
#card .sp-add:hover{border-color:color-mix(in srgb,var(--ac) 70%,var(--text));background:color-mix(in srgb,var(--ac) 7%,var(--panel))}
#card .sp-add:active{transform:translateY(1px)}
#card .sp-add:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
#card .sp-lib{display:flex;margin:2px 0 0;color:inherit;font-size:inherit}
#card .sp-libw{position:relative;display:block}
#card .sp-libw svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
#card.sp-mode .sp-libw select{padding-left:34px}
/* Export: PDF and its sheet size on one row, then the files */
#card .sp-exp select{cursor:var(--cur-pointer,pointer)}
/* Selected: a pinned piece's note with its button */
#card .sp-pin{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px}
#card .sp-fsrow{display:contents}
/* Pro forma: the schedule's legend under its bar */
#card .sp-sched{margin:0}
#card .sp-schl{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:-6px;font-size:11.5px;color:var(--text-2)}
#card .sp-schl i{display:inline-block;width:8px;height:8px;margin-right:5px;border-radius:2px}
#card .sp-schl .pre{background:#8a6fb3}#card .sp-schl .bld{background:#c8673d}#card .sp-schl .lease{background:#d8a13a}#card .sp-schl .hold{background:#3f8f5a}
#card .sp-cards{margin:0}
#card .sp-mixt{margin:0}
/* Layouts: the head with Sort and More layouts as a button */
#card .sp-lay-ctl{gap:8px}
#card .sp-sortl{display:flex;align-items:center;gap:6px}
#card .sp-sortl select{height:32px;margin:0;padding:0 6px;border-radius:var(--r-sm)}
#card .sp-rvc{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;margin:8px 0 0}
/* a layout card: the drawing; the name and arrangement (two lines at most); badges; the numbers; notes; then actions on the right */
#card .sp-var-use{grid-template-columns:88px minmax(0,1fr);column-gap:12px;row-gap:7px;padding:12px 12px 8px}
#card .sp-var-use>.sp-vthumb{grid-column:1;grid-row:1/span 3}
#card .sp-var-use>:not(.sp-vthumb){grid-column:2;min-width:0}
#card .sp-vhead{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35;font-size:12px;color:var(--text-2)}
#card .sp-vhead b{font-size:13.5px;font-weight:700;color:var(--text)}
#card .sp-vpills{row-gap:4px}
#card .sp-vc{padding:6px 8px}
#card .sp-vc b{white-space:nowrap;overflow-wrap:normal;font-variant-numeric:tabular-nums}
#card .sp-var>.sp-n{margin:0 12px 6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#card .sp-var-acts{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:2px 12px 10px}
#card .sp-var-acts .sp-why{margin:0;padding:0}
#card .sp-var-acts .sp-why[open]{flex-basis:100%;order:2;margin:2px 0 0}
#card .sp-va-r{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-left:auto}
@media (max-width:700px){
  #card .sp-var-use{grid-template-columns:64px minmax(0,1fr);column-gap:10px}
  #card .sp-var-use>.sp-vthumb{grid-row:1/span 2}
  #card .sp-var-use>:is(.sp-vgrid,.sp-vp2,.sp-vwhy,.sp-vdelta,.sp-numonly){grid-column:1/-1}
  .sp-ov-g,.sp-ov-g.n3{grid-template-columns:repeat(2,minmax(0,1fr))}
  #card .sp-add{width:72px}
  #card .sp-addg{gap:12px 14px}
  #card .sp-add-g:last-child{order:1}#card .sp-add-g:nth-child(4){order:2} /* Site beside Water & landscape, Amenities last: four rows, not five */
}
/* a section that folds (Settings, Pro forma): its parts spaced by margins (a details box doesn't lay out its children with gap) */
#card.sp-mode details.bsec>:not(summary){margin-top:12px}
#card.sp-mode details.bsec>.sp-sub{margin-top:18px}
#card.sp-mode details.bsec>.sp-schl{margin-top:6px}
#card.sp-mode details.bsec>.sp-sub+.sp-fg,#card.sp-mode details.bsec>.sp-sub+.sp-mix{margin-top:12px}
#card #spIdeas:empty,#card #spVariants:empty{display:none}
#card #spLayouts .sp-ninfo1,#card #spLayouts .sp-lnotes{margin-top:0}
#card #spLayouts .sp-vars{margin-top:10px}
.sp-ov-s i>.ln{display:block}.sp-ov-s i>.sep{display:none}
@media (max-width:700px){.sp-ov-s i>.ln{display:inline}.sp-ov-s i>.sep{display:inline}}
#card.sp-mode details.bsec:not([open]){gap:0}

/* ---------- site plan map (round 2) ---------- */
/* one baseline and one gutter: while planning, the legend sits 16 px in from the map's bottom left like the tool strip
   (placed beside it by placeStrip in src/siteplan.js) and the scale bar at the bottom right */
@media (min-width:701px){.app.planning .legends{left:16px;bottom:16px}}
/* the Add palette: the pieces in groups, as tiles with a small drawing in the piece's own colour */
.sp-tpop[data-kind="add"]{width:316px}
.sp-ad{display:grid;gap:8px}
.sp-ad-gh{font:700 10px/1 var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:2px 4px 5px}
.sp-ad-ts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
.sp-ad-t{display:grid;justify-items:center;gap:5px;min-width:0;padding:7px 2px 6px;border:0;border-radius:8px;background:transparent;color:var(--text);font:600 11.5px/1.2 var(--font-display);text-align:center;cursor:var(--cur-pointer,pointer);transition:background var(--dur-fast,150ms) var(--ease,ease)}
.sp-ad-t span{max-width:100%;text-wrap:balance}
.sp-ad-t:hover{background:var(--chip)}
.sp-ad-t:focus-visible{outline:var(--focus,2px solid var(--brand));outline-offset:-2px;background:var(--chip)}
.sp-ad-ic{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;background:color-mix(in srgb,var(--c) 16%,var(--panel));border:1px solid color-mix(in srgb,var(--c) 34%,transparent);color:color-mix(in srgb,var(--c) 62%,var(--text))}
.sp-ad-t:hover .sp-ad-ic{background:color-mix(in srgb,var(--c) 24%,var(--panel))}
.sp-ad-ic svg{width:20px;height:20px} /* the panel's 24px Add icons, a little smaller in the palette */
.sp-tpop .sp-ad-lib{display:block;margin:8px 6px 0;padding:0;font-size:12px}
/* the right-click menu (a long press on touch): light, like the app's other menus */
.sp-cm{position:fixed;z-index:60;min-width:216px;max-width:min(300px,calc(100vw - 16px));padding:5px;display:grid;gap:1px;background:var(--panel);color:var(--text);border:1px solid var(--line-2);border-radius:var(--r-md);box-shadow:var(--sh-2);font:600 13px/1.3 var(--font-display);outline:none}
.sp-cm[hidden]{display:none}
.sp-cm-h{padding:6px 9px 5px;font:700 10.5px/1.2 var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-cm>button{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;min-height:32px;padding:6px 9px;border:0;border-radius:6px;background:transparent;color:var(--text);font:inherit;text-align:left;cursor:var(--cur-pointer,pointer)}
.sp-cm>button:hover,.sp-cm>button:focus-visible,.sp-cm>button[aria-expanded="true"]{background:var(--chip);outline:none}
.sp-cm>button:focus-visible{box-shadow:inset 0 0 0 1.5px var(--brand)}
.sp-cm>button>span{display:grid;gap:1px}
.sp-cm kbd{border:0;background:none;box-shadow:none;padding:0;font:500 11px/1 var(--font-mono);color:var(--muted)}
.sp-cm i{font-style:normal;font-size:15px;line-height:1;color:var(--muted)}
.sp-cm em{font:400 11.5px/1.3 var(--font-body,inherit);font-style:normal;color:var(--muted)}
.sp-cm>button[aria-disabled]{color:var(--muted);cursor:var(--cur-default,default)}
.sp-cm>button[aria-disabled]:hover{background:transparent}
.sp-cm hr{border:0;border-top:1px solid var(--line);margin:4px 3px}
.sp-cm-sub{width:316px;padding:6px}
/* a message while planning sits above the strip and the mode chip on it */
@media (min-width:701px){.app.planning .toast{bottom:104px}}
.sp-cm-sub{max-height:calc(100vh - 16px);overflow:auto}
@media (pointer:coarse){.sp-cm>button{min-height:42px}.sp-ad-t{padding:9px 2px 8px}}
/* + New Option's menu: each choice with a line under it saying what it keeps */
.sp-cm-opt{min-width:256px}
.sp-cm-opt>button{padding:7px 10px}
.sp-cm-opt b{font-weight:600}
.sp-cm-opt em{white-space:normal}
@media (max-width:700px){.sp-tpop[data-kind="add"]{width:min(316px,calc(100vw - 16px))}
  .app.planning:has(#card.open.full) .sp-mapui{display:none}} /* the sheet pulled to full height: the strip, the chip and their pop-overs step away (they'd sit over its header) */
/* the property card's Development section (src/devlayers.js) */
.dv-row{display:flex;gap:8px;align-items:flex-start;width:100%;text-align:left;background:none;border:0;padding:6px 2px;border-bottom:1px solid var(--line,#e5e7eb);color:inherit;font:inherit;cursor:var(--cur-pointer)}
.dv-row:hover{background:var(--hover,rgba(0,0,0,.03))}
.dv-row i{flex:none;width:9px;height:9px;border-radius:50%;margin-top:5px}
.dv-row span{display:flex;flex-direction:column;min-width:0}
.dv-row b{font-weight:600;overflow:hidden;text-overflow:ellipsis}
.dv-row em{font-style:normal;color:var(--muted,#6b7174);font-size:12px}

/* ================= site plan: robustness fixes ================= */
/* the section chips: two rows on a computer (nothing hidden past the edge); phones keep the scrolling row with its edge fade */
@media (min-width:701px){
  #card .bnav{flex-wrap:wrap;overflow:visible;margin-right:0;padding-right:0;row-gap:6px}
  #card .bnav.fl,#card .bnav.fr,#card .bnav.fl.fr{-webkit-mask-image:none;mask-image:none}
}
/* options can't be switched while a build runs */
#card .sp-plans .chip:disabled{opacity:.5;cursor:var(--cur-default,default)}
#card .sp-plans .chip[aria-pressed="true"]:disabled{opacity:.8}
/* the option's name says it can be edited */
#card .sp-title{cursor:text;border-bottom:1px dashed var(--line-2);border-radius:4px 4px 0 0;padding-right:22px}
#card .sp-title:hover,#card .sp-title:focus{border-color:transparent;border-bottom-color:var(--text-2);background:no-repeat right 4px center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%238a928d' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 13.5l.6-3L10.8 2.8a1.5 1.5 0 0 1 2.1 0l.3.3a1.5 1.5 0 0 1 0 2.1L5.5 12.9z'/%3E%3C/svg%3E")}
/* layouts made for another site */
.sp-ck.stale{color:var(--amber)!important;background:color-mix(in srgb,var(--amber) 14%,transparent)!important}
.sp-var.stale .sp-vgrid{opacity:.6}
#card .sp-body>.sp-solvebar{margin:12px 16px 0}
@media (max-width:700px){#card .sp-body>.sp-solvebar{margin:10px 10px 0}}
/* parcels that aren't part of the site */
.sp-parcels .chip.sp-off{opacity:.5}
.sp-parcels .chip.sp-off .sp-x{opacity:1}
/* Pro forma boxes that refused a value */
.sp-pf input.sp-bad{border-color:var(--danger);outline-color:var(--danger)}
.sp-pf .sp-inerr{display:block;color:var(--danger);font-weight:600}
.sp-pf .sp-inerr[hidden]{display:none}
.sp-pf .sp-pfnote{display:block;margin-top:3px;font-size:11px;line-height:1.35;color:var(--amber)} /* a number outside the usual range here: a calm note, still applied */
.sp-pfflags{margin:6px 0 0;padding-left:18px;font-size:12px;line-height:1.45;color:var(--amber)}
.sp-tag{display:inline-block;padding:1px 6px;border:1px solid var(--line-2);border-radius:999px;font-size:10px;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--text-2);background:var(--panel-2);vertical-align:1px}
.sp-pfbasis{margin-top:8px;line-height:1.45}
.sp-pfarea td small{display:block;font-size:10.5px;color:var(--muted)}
.sp-vc i em{white-space:nowrap}

/* ---- Compare (B3): rename, section rows, part-quarter notes, use colours ---- */
:root{--cmp-u0:#4c51bf;--cmp-u1:#d9480f;--cmp-u2:#0c8599;--cmp-u3:#8d6e63;--cmp-u4:#9aa000;--cmp-u5:#d6336c;--cmp-uo:#bcc2c4}
.cmp-bar .bar b{box-shadow:-1px 0 0 var(--panel)}
.cmp-key i{box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.cmp-chip .ed{width:24px;height:24px;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:12px;cursor:var(--cur-pointer,pointer)}
.cmp-chip .ed:hover{background:var(--chip);color:var(--text)}
.cmp-chip .cmp-rename{font:inherit;font-size:13px;color:var(--text);background:var(--panel);border:1px solid var(--brand);border-radius:6px;padding:2px 6px;width:170px;min-width:0}
table.cmp tr.sub th{text-align:left;font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--brand);font-weight:600;background:var(--panel-2);padding:7px 10px;border-bottom:1px solid var(--line-2)}
.cmp-note{margin:8px 0 0}
.cmp-svg text.pt{font-style:italic}

/* ---- Market (B3): the sticky bar names the area and holds the monthly-chart span; region-wide tags; jump targets clear the bar ---- */
.mk-nav{align-items:center}
.mk-nav .mk-here{display:inline-flex;align-items:center;gap:8px;max-width:min(300px,45%);background:var(--panel);border-color:var(--brand);color:var(--text)}
.mk-nav .mk-here span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.mk-nav:not(.stuck) .mk-here,.mk-nav:not(.stuck) .mk-div{display:none}
.mk-nav .mk-here em{font-style:normal;font-weight:600;color:var(--brand);white-space:nowrap}
.mk-nav .mk-div{flex:none;width:1px;height:18px;background:var(--line-2);margin:0 2px}
.mk-nav .mk-rng{flex:none;display:inline-flex;align-items:center;gap:8px;margin-left:auto;padding-left:10px;font-size:11.5px;color:var(--muted);white-space:nowrap}
.mk-nav .mk-seg button{border:0;border-radius:0;padding:5px 10px;background:var(--panel);font-size:12px}
.mk-nav .mk-seg button+button{border-left:1px solid var(--line-2)}
.mk-nav .mk-seg button[aria-pressed="true"]{background:var(--text);color:var(--panel)}
.mk-tag{display:inline-block;margin-left:6px;padding:1px 8px;border:1px solid var(--line-2);border-radius:999px;font:500 10px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);vertical-align:2px;white-space:nowrap}
.mk-sec,#mxCorr,#mxBox{scroll-margin-top:calc(var(--mk-nav,48px) + 10px)}
@media (max-width:700px){ .mk-nav .mk-here{max-width:60%} }
/* Area at a Glance tiles and Reports-for-this-area rows wrap to two lines instead of cutting words off */
.panel .glance .g-t>span,.panel .glance .g-t i{white-space:normal;overflow:hidden;text-overflow:clip;overflow-wrap:anywhere;line-height:1.3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}
.ar-row b,.ar-row .ar-d{white-space:normal;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow-wrap:anywhere}
.ar-row{min-height:40px;height:auto}

/* ---------- B4: reports and one friendly error path ---------- */
.rp-card .rp-cust{justify-self:start;font-size:12px}
.rp-card em .lnk{font-size:11px}
.rp-fmts .btn[disabled]{opacity:.5;cursor:not-allowed}
.rp-m .rp-warn{color:var(--warn);font-size:12px}
.rp-act .lnk.danger{color:var(--danger)}
.rp-act .lnk.danger:hover{text-decoration:underline}
.rnote.eb{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.rnote.eb .eb-retry{font-size:12px;text-decoration:underline}
.rnote.eb .eb-retry[disabled]{opacity:.5}
.draw-banner{position:absolute;left:50%;bottom:64px;transform:translateX(-50%);z-index:6;display:inline-flex;align-items:center;gap:12px;max-width:calc(100% - 32px);border:1px solid var(--line-2);background:var(--panel);color:var(--text);border-radius:20px;padding:8px 14px;font-size:13px;box-shadow:0 4px 18px rgba(0,0,0,.18)}
.draw-banner[hidden],.stage:not([data-view="map"]) .draw-banner{display:none}
.draw-banner .db-x{font-size:13px;text-decoration:underline;white-space:nowrap}
@media (max-width:700px){ .draw-banner{bottom:calc(76px + var(--sb));font-size:12.5px;border-radius:12px} } /* phones: low on the map, clear of the Select / Shape / Radius buttons at the top */
.ly-hint{font-size:12px;color:var(--muted);margin:2px 0 6px}
.view.mk-quiet{position:fixed;left:-20000px;top:0;right:auto;bottom:auto;width:1180px;height:900px;visibility:hidden;pointer-events:none;overflow:hidden;z-index:-1}
.ly-na.ly-fail{color:var(--danger)}

/* ================= batch: map chrome, side panel and app shell ================= */
/* toasts sit in the free part of the map: centred between the left edge and whatever docks on the right (the assistant,
   the property card), so none of them hides a message or gets covered by it */
.toast{z-index:7;--toast-minw:260px;min-width:min(var(--toast-minw),calc(100% - 32px));left:max(calc((100% - var(--toast-r,0px)) / 2),calc(var(--toast-minw) / 2 + 16px));max-width:max(var(--toast-minw),calc(100% - var(--toast-r,0px) - 32px))}
/* (when the assistant and a card leave almost no free map, the note keeps its width and shows on top of them) */
@media (min-width:701px){ .app.ai-open{--toast-r:calc(var(--aiw) + 24px)} }
@media (min-width:1101px){
  .app.ai-open{--toast-r:calc(var(--aiw) + 28px)}
  .app:has(#card.open){--toast-r:calc(var(--cardw) + 24px)}
  .app.ai-open:has(#card.open){--toast-r:calc(var(--aiw) + var(--cardw) + 40px)}
}
/* the "Drawing a box · Cancel" chip shows on desktop too (it used to be phone-only), under the layer chips */
@media (min-width:701px){
  .modechip:not([hidden]){display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 4px 0 14px;border-radius:999px;background:var(--text);color:var(--panel);font:600 13px var(--font-display);box-shadow:0 2px 8px rgba(11,13,12,.2)}
  .modechip button{height:26px;padding:0 12px;border:0;border-radius:999px;background:color-mix(in srgb,var(--panel) 18%,transparent);color:var(--panel);font:700 12.5px var(--font-display);cursor:var(--cur-pointer,pointer)}
  .modechip button:hover{background:color-mix(in srgb,var(--panel) 30%,transparent)}
  /* the layer chips use the width the map has up to the camera rail; an arrow at an end with more chips replaces the faded edge */
  .mapleft .qlayers{max-width:100%}
  .qlayers.fr,.qlayers.fl,.qlayers.fl.fr{-webkit-mask-image:none;mask-image:none}
}
.qarrow{position:sticky;z-index:2;flex:none;width:30px;height:30px;padding:0;border:1px solid var(--line-2);border-radius:999px;background:var(--panel);color:var(--text);display:grid;place-items:center;cursor:var(--cur-pointer,pointer);box-shadow:0 1px 4px rgba(11,13,12,.2)}
.qarrow:hover{border-color:var(--text-2)}
.qarrow[hidden]{display:none}
.qarrow.ql{left:0;margin-right:-36px}  /* the negative margin (width + gap) keeps the chips from shifting when an arrow appears */
.qarrow.qr{right:0;margin-left:-36px}
@media (max-width:700px){ .qarrow{display:none!important} }
/* keyboard focus: these controls set their own box-shadow, which beat the page-wide focus ring (it has less weight), so the ring is restated here */
.ctrls button:focus-visible,.fbtn:focus-visible,.lybtn:focus-visible,.exbtn:focus-visible,.qchip:focus-visible,.qarrow:focus-visible,.selpill:focus-visible,.mapleft .tools button:focus-visible,.ctrls .rpop button:focus-visible,.modechip button:focus-visible,.fclear:focus-visible{outline:none;box-shadow:0 0 0 2px var(--panel),0 0 0 4px var(--brand)}
/* the pinned area bar is solid: filing rows and cards scrolling beneath it don't show through around its rounded card */
.scope{padding-bottom:var(--sp-2);box-shadow:0 8px 10px -8px rgba(11,13,12,.22)}
@media (max-width:700px){ .panel .scope{box-shadow:none;padding-bottom:0} }
/* area menu: items that don't apply yet stay in place, dimmed */
.vm-pop>.is-off,.vm-pop>button:disabled{opacity:.5;cursor:not-allowed}
.vm-pop>.is-off:hover,.vm-pop>button:disabled:hover{background:transparent}
.sc-err{color:var(--danger);font-size:11.5px;font-weight:600}
/* saved searches: a one-line summary under each */
.saved .sv{flex-wrap:wrap;row-gap:0}
.saved .sv>.sv-n{flex:1 1 40%;text-align:left;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.saved .sv-s,.svp-s{flex:0 0 100%;order:5;min-width:0;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.svp-t{min-width:0;flex:1 1 240px}
.svp-s{display:block;margin-top:2px}
/* the filter popup's help line scrolls with the sections (it used to ride in the pinned header) */
.fpop .lfbody>.lfhelp{margin:0;padding:12px 18px 0}
@media (max-width:700px){ .fpop .lfbody>.lfhelp{padding:10px 16px 0} }
/* dragging an Add tile onto the site plan: the piece's outline at the map's scale (red off the site) and a chip by the pointer */
.sp-dragghost{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:2000;overflow:visible}
.sp-dragghost polygon{display:none;fill:color-mix(in srgb,var(--ac) 38%,transparent);stroke:color-mix(in srgb,var(--ac) 80%,#0b0d0c);stroke-width:2;stroke-dasharray:6 4;stroke-linejoin:round}
.sp-dragghost.on polygon{display:block}
.sp-dragghost.off polygon{display:block;fill:rgba(198,60,48,.16);stroke:#c63c30}
.sp-dragchip{position:fixed;left:0;top:0;z-index:2001;pointer-events:none;display:flex;align-items:center;gap:6px;padding:4px 9px 4px 4px;border:1px solid var(--line-2);border-radius:999px;background:var(--panel);color:var(--text);font:600 12px/1.2 var(--font-display);box-shadow:0 6px 18px rgba(11,13,12,.18);white-space:nowrap}
.sp-dragchip svg{width:22px;height:22px;box-sizing:border-box;padding:2px;border-radius:999px;background:color-mix(in srgb,var(--ac) 22%,transparent);color:color-mix(in srgb,var(--ac) 62%,#0b0d0c)}
.sp-dragchip.on{opacity:.92}
html.sp-dragging,html.sp-dragging *{cursor:var(--cur-grabbing,grabbing)!important;user-select:none!important}
#card .sp-add,.sp-ad-t{cursor:var(--cur-grab,grab)}
.sp-ad-t{touch-action:none}

/* site plan renderings: the picks, the busy line, the gallery and the full-size viewer */
#card .sp-rsel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}#card .sp-rsel>:first-child{grid-column:1/-1} /* the View names its building: the whole width */
.sp-hint{font-size:12px;line-height:1.45;color:var(--muted);margin-top:8px}#card .sp-rbudget.used{color:var(--danger)}
#card .sp-rbusy{display:flex;align-items:center;gap:8px}#card .sp-rbusy::before{content:'';width:12px;height:12px;border-radius:50%;border:2px solid var(--brand);border-right-color:transparent;animation:sp-spin 1s linear infinite;flex:none}
@keyframes sp-spin{to{transform:rotate(360deg)}}
#card .sp-rgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
#card .sp-rth{margin:0;cursor:var(--cur-pointer,pointer);border:1px solid var(--line-2);border-radius:var(--r-sm);overflow:hidden;background:var(--panel)}
#card .sp-rth img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#e6e9eb}
#card .sp-rth figcaption{padding:6px 8px;font:600 12px var(--font-display);color:var(--text)}#card .sp-rth figcaption span{display:block;font-weight:400;color:var(--text-2);font-size:11px}
#card .sp-rth .sp-rgone{display:grid;place-items:center;aspect-ratio:16/9;padding:6px;background:#e6e9eb;color:var(--muted);font-size:11px;text-align:center}
.sp-rvtop .sp-rvold{font-style:normal;color:var(--danger)}
#card .sp-rth.stale img{filter:grayscale(.5)}#card .sp-rth.stale figcaption span{color:var(--danger)}#card .sp-rth.gone{opacity:.55}
#card .sp-rth:hover,#card .sp-rth:focus-visible{border-color:var(--brand)}
.sp-rview{position:fixed;inset:0;z-index:1200;background:rgba(10,14,16,.86);display:grid;place-items:center;padding:16px}
.sp-rvin{width:min(1400px,100%);max-height:100%;display:flex;flex-direction:column;background:var(--panel,#fff);border-radius:10px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.sp-rvtop{display:flex;align-items:center;gap:12px;padding:10px 12px;border-bottom:1px solid var(--line-2)}.sp-rvtop b{font:600 14px var(--font-display)}.sp-rvtop span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-2);font-size:12px}
.sp-rvimg{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#111}.sp-rvimg img{max-width:100%;max-height:min(78vh,900px);object-fit:contain}
.sp-rvbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-top:1px solid var(--line-2)}.sp-rvbtns{display:flex;gap:8px}.sp-rvbar .sp-hint{margin:0}.sp-rvbar [data-del]{color:var(--danger)}
@media (max-width:600px){#card .sp-rsel{grid-template-columns:1fr}#card .sp-rgrid{grid-template-columns:1fr}}
/* AI-crafted building types (lib/customtypes.mjs): the AI-sized mark, Numbers' block and the team library */
.sp-ais{display:inline-block;font:600 10.5px/18px var(--font-display);font-style:normal;border-radius:var(--r-pill);padding:0 7px;white-space:nowrap;vertical-align:middle;color:var(--amber)!important;background:color-mix(in srgb,var(--amber) 14%,transparent)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--amber) 45%,transparent)}
.sp-tile .sp-ais{font-size:9.5px;line-height:15px;padding:0 5px;margin-left:2px}.sp-tile.wide{grid-column:span 2}
.sp-cust{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:12px;color:var(--text-2);margin:2px 0 6px}
.sp-savelib{margin:0 0 6px}
.sp-custom{border:1px solid color-mix(in srgb,var(--amber) 35%,var(--line));border-radius:6px;padding:4px 10px 8px;margin:4px 0 8px;background:color-mix(in srgb,var(--amber) 5%,transparent)}
#card.sp-mode .sp-custom .sp-sub{border-top:0;padding-top:4px;margin-top:0}
.sp-cu{margin:4px 0 6px;padding-left:16px;font-size:12px;color:var(--text-2);display:grid;gap:2px}.sp-cu b{color:var(--text)}
.sp-team{margin-top:10px}.sp-team>summary{list-style:revert}
.sp-tl{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.sp-tl li{border:1px solid var(--line-2);border-radius:6px;padding:6px 8px;display:grid;gap:2px;background:var(--panel-2)}
.sp-tl-h{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}.sp-tl-h b{font-size:13px}.sp-tl small{font-size:11px;color:var(--muted);line-height:1.35}
.sp-tl-h input{font:inherit;font-size:13px;padding:3px 6px;border:1px solid var(--line-2);border-radius:4px;background:var(--panel);color:var(--text);min-width:0;flex:1}
.sp-tl-a{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
/* Option delete in + New Option's menu, and Settings › Testing (Delete all projects…) */
.sp-cm-opt>button.sp-cm-danger b{color:var(--danger)}
.set-sec[data-sec="danger"] h3{color:var(--danger)}
.btn.set-danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 45%,var(--line-2))}
.btn.set-danger:not(:disabled):hover{background:var(--danger);border-color:var(--danger);color:#fff}
.btn.set-danger:disabled{opacity:.5}
.set-confirm{display:grid;gap:8px;padding:12px;border:1px solid color-mix(in srgb,var(--danger) 40%,var(--line));border-radius:var(--r-sm);background:color-mix(in srgb,var(--danger) 5%,var(--panel))}
.set-confirm p{margin:0;font-size:12.5px;line-height:1.45;color:var(--text-2)}
.set-confirm input{width:100%;max-width:220px;box-sizing:border-box;padding:7px 9px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--panel);color:var(--text);font:600 13px var(--font-mono);letter-spacing:.06em}
.set-confirm .btnrow{display:flex;flex-wrap:wrap;gap:6px}
.pj-foot .btn.pj-pdel{color:var(--danger)}
/* the Waller guardrails on a plan (lib/guardrails.mjs): the concept label, classification tags, scenarios, the land-use
   reconciliation, unresolved risks and the required plan content */
.sp-cls{display:inline-block;font:600 9.5px/15px var(--font-display);font-style:normal;letter-spacing:.02em;border-radius:var(--r-pill);padding:0 6px;white-space:nowrap;vertical-align:middle;text-transform:none}
.sp-cls.v{color:var(--green-800);background:var(--green-100);box-shadow:inset 0 0 0 1px var(--green-300)}
.sp-cls.o{color:#5b3c99;background:#f0ebfa;box-shadow:inset 0 0 0 1px #cdbdf0}
.sp-cls.e{color:#24538a;background:#e8f0fa;box-shadow:inset 0 0 0 1px #b6cdea}
.sp-cls.u{color:#8a4b00;background:#fdf1df;box-shadow:inset 0 0 0 1px #efc98f}
.sp-tile .sp-cls{font-size:9px;line-height:14px;padding:0 5px;margin-left:2px}
#card .sp-guard{margin:12px 14px 0;padding:10px 12px;border:1.5px solid var(--danger);border-radius:6px;background:var(--panel);font-size:12px;line-height:1.45;display:grid;gap:6px;color:var(--text)}
@media (max-width:700px){#card .sp-guard{margin:10px 10px 0}}
.sp-gl b{color:var(--danger);font-weight:700;letter-spacing:.01em}.sp-glf{margin:0;font-size:11px;font-weight:700;color:var(--danger);letter-spacing:.02em}
.sp-gj{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;color:var(--text-2)}.sp-gstale{color:var(--amber);font-weight:600}
.sp-gnums{display:grid;gap:4px;min-width:0}.sp-gsec{min-width:0}.sp-gsec>summary{cursor:var(--cur-pointer)}.sp-gsec>summary::marker{color:var(--muted)}
.sp-gtw{overflow-x:auto;max-width:100%}
.sp-gt{width:100%;border-collapse:collapse;font-size:11.5px;margin:4px 0;table-layout:auto}
.sp-gt th,.sp-gt td{padding:4px 5px;border-bottom:1px solid var(--line);text-align:right;vertical-align:top}
.sp-gt th[scope=row]{text-align:left}.sp-gt th[scope=row]{font-weight:600;color:var(--text-2)}
.sp-gscen th[scope=col]{text-align:center;font-weight:600;vertical-align:bottom}.sp-gscen th[scope=col] b{display:block;font-size:13px}.sp-gscen th[scope=col] small{display:block;font-size:10px;color:var(--muted);font-weight:500}
.sp-gscen th[scope=col] em{display:block;font-style:normal;font-size:10px;color:var(--brand);margin-top:2px}.sp-gscen th[scope=col] em.neg{color:var(--danger)}.sp-gscen th[scope=col] .btn{margin-top:4px;padding:2px 8px;min-height:26px;font-size:11px}
.sp-gscen .on{background:var(--green-50)}.sp-gscen td small{display:block;font-size:10px;color:var(--muted)}
.sp-gland th[scope=row] small{display:block;font-weight:400;font-size:10.5px;color:var(--muted);line-height:1.35;margin-top:1px}.sp-gland td{white-space:nowrap}.sp-gland tr.q td{white-space:normal;text-align:right}.sp-gland tr:first-child th:first-child{text-align:left}
.sp-gland tr.tot th,.sp-gland tr.tot td{font-weight:700;color:var(--text);border-top:1.5px solid var(--text-2)}
.sp-grange{margin:4px 0;font-size:12.5px}.sp-grange small{color:var(--muted)}.sp-gbusy{font-weight:500;letter-spacing:0;text-transform:none;color:var(--muted)}
.sp-grisk,.sp-gcl{list-style:none;margin:4px 0;padding:0;display:grid;gap:6px;font-size:12px}
.sp-grisk li{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;border-left:3px solid var(--amber);padding:2px 0 2px 8px}.sp-grisk li span{flex-basis:100%;color:var(--text-2);line-height:1.4}
.sp-gstop{font:700 9.5px/15px var(--font-display);font-style:normal;color:#fff;background:var(--danger);border-radius:var(--r-pill);padding:0 6px}
.sp-gcl li{display:grid;grid-template-columns:84px 1fr;gap:0 8px;align-items:baseline}.sp-gcl li i{font-style:normal;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.sp-gcl li span{grid-column:2;color:var(--text-2);font-size:11.5px;line-height:1.35}.sp-gcl li.shown i{color:var(--brand)}.sp-gcl li.unresolved i{color:var(--danger)}.sp-gcl li.na i{color:var(--muted)}
.sp-ov-rg{color:var(--ink-200)}
.sp-gscen td{white-space:nowrap}.sp-gscen td small{white-space:normal}
@media (max-width:700px){.sp-gscen td,.sp-gscen th{padding:4px 3px}.sp-gscen td{font-size:11px}}