/* Moraine Research: Amazon network map. Light mode by design (brand). */
:root{
  --ink:#0F3833; --ink-2:#164A43; --accent:#0D9999; --accent-d:#0A7A7A;
  --body:#3D5550; --muted:#5F726D; --line:#DFE7E4; --line-2:#C8D6D1;
  --wash:#F2F6F4; --surface:#FBFCFB; --land:#F4F5F1; --water:#DBE7E5;
  --shadow:0 1px 2px rgba(15,56,51,.06),0 6px 20px rgba(15,56,51,.10);
  --radius:10px; --panel-w:328px;
  --font:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:Geist,Inter,system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%;background:var(--surface);color:var(--body);font:13.5px/1.45 var(--font);-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
a{color:var(--accent-d)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#app{display:flex;flex-direction:column;height:100%;height:100dvh}

/* Header */
#top{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid var(--line);background:#fff;min-height:52px}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;flex:none}
.brand-name{font:600 17px/1 var(--display);letter-spacing:-.02em;color:var(--ink)}
.brand-sub{font:500 10.5px/1 var(--font);text-transform:uppercase;letter-spacing:.17em;color:var(--accent-d);padding-left:9px;border-left:1px solid var(--line-2)}
#top h1{flex:1;margin:0;font:600 15px/1.25 var(--display);letter-spacing:-.01em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-links{display:flex;gap:8px;flex:none}
.btn-ghost{display:inline-flex;align-items:center;height:30px;padding:0 11px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;font-weight:500;color:var(--ink);text-decoration:none;background:#fff;transition:background .15s,border-color .15s}
.btn-ghost:hover{background:var(--wash);border-color:var(--line-2)}

#main{flex:1;display:flex;min-height:0;position:relative}

/* Panel */
#panel{width:var(--panel-w);flex:none;display:flex;flex-direction:column;border-right:1px solid var(--line);background:#fff;min-height:0}
.drawer-handle{display:none}
.panel-body{overflow-y:auto;padding:4px 16px 18px;flex:1;min-height:0;scrollbar-width:thin}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--line);background:var(--wash)}
.stat{padding:10px 4px 9px 9px;display:flex;flex-direction:column;gap:2px;min-width:0}
.stat+.stat{border-left:1px solid var(--line)}
.stat-v{font:600 15.5px/1.1 var(--display);white-space:nowrap;letter-spacing:-.02em;color:var(--ink)}
.stat-l{font-size:10px;line-height:1.25;color:var(--muted)}
.sec{padding:14px 0 2px}
.sec+.sec{border-top:1px solid var(--line);margin-top:12px}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.eyebrow{display:block;margin:0 0 8px;font:600 10.5px/1.2 var(--font);text-transform:uppercase;letter-spacing:.16em;color:#2E544D}
.sec-head .eyebrow{margin-bottom:8px}
.chip-note{margin:8px 0 0!important}
.hint{margin:-2px 0 8px;font-size:11.5px;color:var(--muted)}
.cnt{margin-left:auto;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.link{background:none;border:0;padding:0;color:var(--accent-d);font-size:12px;font-weight:500;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.link:hover{color:var(--ink)}

/* Search */
.search{position:relative}
input[type=search],select{width:100%;height:36px;padding:0 11px;border:1px solid var(--line-2);border-radius:8px;background:#fff;color:var(--ink);font-size:13.5px}
input[type=search]:focus,select:focus{border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}
#qList{position:absolute;z-index:20;left:0;right:0;top:40px;margin:0;padding:4px;list-style:none;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);max-height:300px;overflow:auto}
#qList li{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:6px;cursor:pointer}
#qList li[aria-selected=true],#qList li:hover{background:var(--wash)}
#qList .r-code{font-weight:600;color:var(--ink);min-width:44px}
#qList .r-sub{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#qList .r-empty{color:var(--muted);cursor:default}

/* Tier chips */
.chips{display:flex;flex-direction:column;gap:2px}
.chip{display:flex;align-items:center;gap:9px;width:100%;padding:6px 8px;border:1px solid transparent;border-radius:7px;background:none;text-align:left;cursor:pointer;color:var(--ink);font-size:13px;transition:background .12s,opacity .12s}
.chip:hover{background:var(--wash)}
.chip[aria-pressed=false]{opacity:.42}
.chip[aria-pressed=false] .dot{background:transparent!important;box-shadow:inset 0 0 0 1.5px var(--muted)}
.chip .bar{flex:none;width:44px;height:4px;border-radius:2px;background:var(--line);overflow:hidden;margin-left:auto}
.chip .bar i{display:block;height:100%;border-radius:2px}
.chip .cnt{margin-left:8px;min-width:34px;text-align:right}
.dot{flex:none;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px rgba(15,56,51,.12)}
.dia{flex:none;width:9px;height:9px;transform:rotate(45deg);border-radius:1px;box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px rgba(15,56,51,.2)}

/* Checks */
.checks{display:flex;flex-direction:column;gap:1px}
label.cb{display:flex;align-items:center;gap:8px;padding:4px 0;cursor:pointer;font-size:13px;color:var(--ink)}
label.cb input{accent-color:var(--accent);width:15px;height:15px;margin:0;flex:none}
.key{flex:none;display:inline-block}
.key-line{width:16px;height:2px;background:#B98D84;border-radius:1px}
.key-ring{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--ink-2);background:rgba(15,56,51,.06)}
.key-reach{width:14px;height:10px;border-radius:3px;background:#CDE7E2}

/* Actions */
.actions{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.btn{height:36px;border:0;border-radius:999px;background:var(--ink);color:#fff;font-weight:500;font-size:13px;cursor:pointer;transition:background .15s}
.btn:hover{background:var(--ink-2)}
.btn-secondary{background:#fff;color:var(--ink);border:1px solid var(--line-2)}
.btn-secondary:hover{background:var(--wash)}
.actions .link{align-self:flex-start;margin-top:2px}
details.about summary{cursor:pointer;font-weight:600;color:var(--ink);font-size:13px}
details.about p{font-size:12.5px;line-height:1.55;margin:8px 0}
.foot{font-size:11.5px;line-height:1.5;color:var(--muted);border-top:1px solid var(--line);margin-top:14px;padding-top:12px}

/* Map */
#mapWrap{flex:1;position:relative;min-width:0;background:var(--land)}
#map{position:absolute;inset:0}
.maplibregl-ctrl-group{border-radius:8px!important;box-shadow:var(--shadow)!important;border:1px solid var(--line)}
.maplibregl-ctrl-attrib{font-size:10.5px;background:rgba(255,255,255,.82)!important}
.maplibregl-ctrl-attrib a{color:var(--muted)}

.seg{position:absolute;top:12px;left:50%;transform:translateX(-50%);display:flex;padding:3px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow);z-index:5}
.seg button{border:0;background:none;height:30px;padding:0 14px;border-radius:999px;font-size:12.5px;font-weight:500;color:var(--muted);cursor:pointer;transition:background .15s,color .15s}
.seg button:hover{color:var(--ink)}
.seg button[aria-checked=true]{background:var(--ink);color:#fff}

.seg2{top:56px;padding:2px;align-items:center}
.seg2 .seg-l{font-size:11px;color:var(--muted);padding:0 6px 0 10px;white-space:nowrap}
.seg2 button{height:26px;padding:0 11px;font-size:12px}
.key.cs-key,.legend .cs-key{width:11px;height:11px;border-radius:50%;background:#0F3833;box-shadow:0 0 0 1.25px #fff,0 0 0 2.25px rgba(15,56,51,.25);flex:none;display:inline-block}
.key.pipe-key,.legend .pipe-key{width:11px;height:11px;border-radius:50%;border:2px solid #0D9999;background:transparent;flex:none;display:inline-block}
.legend .lite{width:7px;height:7px;border-radius:50%;background:rgba(122,150,143,.4);flex:none;margin:0 2px}
.tools{position:absolute;top:12px;left:12px;display:flex;flex-direction:column;gap:6px;z-index:5}
.tool{width:34px;height:34px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);color:var(--ink);cursor:pointer}
.tool:hover{background:var(--wash)}
.tool[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.tool svg{width:18px;height:18px}

/* Detail card */
.card{position:absolute;top:58px;right:56px;width:300px;max-height:calc(100% - 180px);overflow:auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 16px 14px;z-index:6}
.card-x{position:absolute;top:8px;right:8px;width:28px;height:28px;border:0;background:none;border-radius:6px;font-size:20px;line-height:1;color:var(--muted);cursor:pointer}
.card-x:hover{background:var(--wash);color:var(--ink)}
.card .c-eyebrow{display:flex;align-items:center;gap:7px;font:600 10.5px/1.2 var(--font);text-transform:uppercase;letter-spacing:.14em;color:#2E544D}
.card h3{margin:6px 28px 2px 0;font:600 20px/1.15 var(--display);letter-spacing:-.02em;color:var(--ink)}
.card .c-sub{color:var(--muted);font-size:12.5px;margin-bottom:10px}
.card dl{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;margin:0;font-size:12.5px}
.card dt{color:var(--muted);white-space:nowrap}
.card dd{margin:0;color:var(--ink);font-variant-numeric:tabular-nums}
.card .c-spark{margin:12px 0 4px;padding:10px 10px 6px;background:var(--wash);border-radius:8px}
.card .c-spark-h{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:4px}
.card .c-src{margin-top:10px;font-size:11.5px;color:var(--muted);line-height:1.5}
.card .c-src a{word-break:break-all}
.card .pill{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--wash);color:var(--ink);font-size:11.5px;font-weight:500}
.card .pill.on{background:#E3F3F0;color:#0A6461}
.card .pill.off{background:#F3F1EF;color:#6B5E57}
.card .pill.pipe{background:#E6F5F5;color:#0A6461;box-shadow:inset 0 0 0 1px rgba(13,153,153,.35)}
.card .c-h{margin:14px 0 8px;padding-top:12px;border-top:1px solid var(--line);font:600 10.5px/1.2 var(--font);text-transform:uppercase;letter-spacing:.14em;color:#2E544D}
.card .c-bldg .c-h{margin-top:4px}
.card .c-total{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:6px}
.card .c-total-v{font:600 18px/1.1 var(--display);letter-spacing:-.02em;color:var(--ink)}
.card .c-total-l{font-size:11.5px;color:var(--muted)}
.card .c-blist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.card .c-blist>li{padding:8px 10px;background:var(--wash);border-radius:8px}
.card .c-brow{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.card .c-bmeta{margin-top:3px;font-size:11.5px;color:var(--body);font-variant-numeric:tabular-nums}
.card .c-sublet{margin-top:4px;font-size:11.5px;font-weight:500;color:var(--ink)}
.card .c-none{margin:0;font-size:12px;color:var(--muted)}
.card .c-bldg .c-src{margin-top:6px}

/* Legend */
.legend{position:absolute;right:12px;bottom:56px;max-width:210px;z-index:4;background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:10px 12px;font-size:11.5px;color:var(--body);min-width:178px}
.legend .lg-t{font:600 10.5px/1.2 var(--font);text-transform:uppercase;letter-spacing:.14em;color:#2E544D;margin-bottom:7px}
.legend .lg-row{display:flex;align-items:center;gap:8px;margin:4px 0}
.legend .lg-sizes{display:flex;align-items:flex-end;gap:10px;margin:4px 0 6px}
.legend .lg-sizes span{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;color:var(--muted)}
.legend .lg-sizes i{display:block;border-radius:50%;background:#7A968F;box-shadow:0 0 0 1.25px #fff}
.legend .ramp{height:8px;border-radius:4px;margin:4px 0 3px}
.legend .ramp-l{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted)}
.legend .hollow{width:9px;height:9px;border-radius:50%;border:1.25px solid #8B9794}

/* Timeline */
.timeline{position:absolute;left:12px;bottom:28px;z-index:4;display:flex;align-items:center;gap:14px;width:min(520px,calc(100% - 250px));min-width:330px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:10px 16px 8px 10px}
.play{flex:none;width:38px;height:38px;border-radius:50%;border:0;background:var(--ink);color:#fff;display:grid;place-items:center;cursor:pointer}
.play:hover{background:var(--ink-2)}
.play svg{width:16px;height:16px}
.tl-main{flex:1;min-width:0}
.tl-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.tl-top .eyebrow{margin:0;white-space:nowrap}
.tl-count{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
input[type=range]{width:100%;margin:6px 0 2px;accent-color:var(--accent);height:18px}
.tl-ticks{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums}
.tl-year{flex:none;font:600 34px/1 var(--display);letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums;min-width:82px;text-align:right}
.timeline.active .tl-year{color:var(--accent-d)}

/* Tooltip */
.tip{position:absolute;z-index:8;pointer-events:none;background:var(--ink);color:#fff;border-radius:7px;padding:6px 9px;font-size:12px;line-height:1.35;box-shadow:0 4px 14px rgba(15,56,51,.25);max-width:240px;transform:translate(12px,12px)}
.tip b{font-weight:600}
.tip .t-sub{color:#B9D2CC;font-size:11.5px}

.loading{position:absolute;inset:0;display:grid;place-items:center;background:var(--land);color:var(--muted);font-size:13px;z-index:9;transition:opacity .3s}
.loading.done{opacity:0;pointer-events:none}

/* Embedded / compact */
body.embed #top{min-height:44px;padding:7px 12px}
body.embed #top h1{font-size:13.5px}
body.embed .hide-embed{display:none}

/* Medium widths: tighten */
@media (max-width:1100px){
  :root{--panel-w:296px}
  .legend{display:none}
  .legend.force{display:block}
  .timeline{width:calc(100% - 24px);min-width:0;bottom:44px}
  .card{bottom:120px}
}

/* Mobile: bottom drawer */
@media (max-width:760px){
  #top{padding:8px 12px;gap:10px;min-height:46px}
  #top h1{font-size:13px}
  .hide-sm{display:none}
  .brand-sub{display:none}
  #main{flex-direction:column}
  #mapWrap{position:absolute;inset:0}
  #panel{position:absolute;left:0;right:0;bottom:0;width:auto;z-index:10;border-right:0;border-top:1px solid var(--line);border-radius:16px 16px 0 0;box-shadow:0 -6px 24px rgba(15,56,51,.14);max-height:78%;transform:translateY(calc(100% - 112px));transition:transform .25s ease}
  #panel.open{transform:none}
  .drawer-handle{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;padding:8px 0 6px;border:0;background:none;cursor:pointer;font-size:12px;font-weight:600;color:var(--ink)}
  .drawer-handle .grip{width:36px;height:4px;border-radius:2px;background:var(--line-2)}
  .stats{border-top:1px solid var(--line)}
  .stat{padding:9px 10px 8px 12px}
  .stat-v{font-size:16px}
  .seg{top:10px}
  .tools{top:10px;left:10px}
  .seg button{padding:0 11px;height:28px}
  .seg2{top:50px}
  .seg2 .seg-l{display:none}
  .seg2 button{height:24px;padding:0 10px}
  .timeline{bottom:146px;left:10px;right:10px;transform:none;width:auto;padding:8px 12px 6px 8px;gap:10px}
  .tl-year{font-size:24px;min-width:56px}
  .tl-count{display:none}
  .play{width:32px;height:32px}
  .card{top:auto;bottom:146px;left:10px;right:10px;width:auto;max-height:52%}
  .maplibregl-ctrl-bottom-right{bottom:114px}
  .maplibregl-ctrl-scale{display:none}
  .maplibregl-ctrl-top-right{top:46px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
@media (forced-colors:active){
  .dot,.dia{forced-color-adjust:none}
}

.legend .gone{width:9px;height:9px;border-radius:50%;border:2px solid #00968a;background:#fff;flex:none}
.card .pill.role{background:var(--ink);color:#fff;margin-right:4px}
.card .c-kpis{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:4px 0 10px}
.card .c-kpi{background:#fff;padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.card .c-kpi-v{font:600 16px/1.15 var(--display);letter-spacing:-.01em;color:var(--ink);font-variant-numeric:tabular-nums}
.card .c-kpi-l{font-size:10.5px;color:var(--muted);line-height:1.25}
.card .c-kpis .c-kpi[data-key=pipeBldgs]{display:none}
.card .c-kpis .c-kpi[data-key=topOwner]{grid-column:1/-1}

/* Views, screener, comparison */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lenses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.lenses button{height:30px;padding:0 4px;border:1px solid var(--line-2);border-radius:7px;background:#fff;font-size:12px;font-weight:500;color:var(--ink);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lenses button:hover{background:var(--wash)}
.lenses button[aria-checked=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.lens-hint{margin:8px 0 0!important}
.lens-ctl{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.lens-ctl:empty{display:none}
.lens-ctl .row{display:flex;gap:6px;align-items:center}
.lens-ctl input[type=search]{height:32px}
.lens-sum{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:8px 0 0;font-size:12px}
.lens-sum:empty{display:none}
.lens-sum dt{color:var(--muted)}
.lens-sum dd{margin:0;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
details.scr summary{cursor:pointer;display:flex;align-items:center;gap:8px;list-style:none}
details.scr summary::-webkit-details-marker{display:none}
details.scr summary::before{content:'';width:7px;height:7px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(-45deg);transition:transform .15s;flex:none}
details.scr[open] summary::before{transform:rotate(45deg)}
details.scr summary .cnt{margin-left:auto}
details.scr .hint{margin-top:8px}
.scr-grid{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 10px;align-items:center;font-size:12.5px;color:var(--ink)}
.scr-grid input,.scr-grid select,.cmp-sel select,.lens-ctl input{height:32px;font-size:12.5px;width:100%;min-width:0;padding:0 8px;border:1px solid var(--line-2);border-radius:7px;background:#fff;color:var(--ink)}
.scr-grid input:focus,.scr-grid select:focus,.cmp-sel select:focus,.lens-ctl input:focus{border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}
.rng{display:flex;align-items:center;gap:4px;min-width:0}
.rng span{color:var(--muted)}
.scr-res{margin:10px 0 6px;padding:8px 10px;background:var(--wash);border-radius:8px;font-size:12.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.scr-res:empty{display:none}
.cmp-sel{display:flex;flex-direction:column;gap:6px;margin-bottom:6px}
.swatch{flex:none;width:10px;height:10px;border-radius:50%;display:inline-block;box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px rgba(15,56,51,.12)}
.card.wide{width:440px;top:100px;max-height:calc(100% - 220px)}
.card .c-ctx{margin-top:8px;font-size:11.5px;color:var(--body);line-height:1.45}
.card .c-comps{list-style:none;margin:4px 0 0;padding:0;font-size:11.5px;display:flex;flex-direction:column;gap:3px}
.card .c-comps li{display:flex;flex-direction:column;gap:1px;font-variant-numeric:tabular-nums}
.card .c-comps li span{color:var(--muted)}
.card .c-comps button{background:none;border:0;padding:0;color:var(--accent-d);font:inherit;cursor:pointer;text-align:left;text-decoration:underline;text-underline-offset:2px}
.card .c-inv{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:6px 0 0;font-size:11.5px}
.card .c-inv dt{color:var(--muted)}
.card .c-inv dd{margin:0;color:var(--ink)}
.cmp-table{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums;margin:6px 0 4px}
.cmp-table th,.cmp-table td{padding:5px 6px;border-bottom:1px solid var(--line);text-align:right;vertical-align:top}
.cmp-table th:first-child,.cmp-table td:first-child{text-align:left;color:var(--muted);font-weight:400}
.cmp-table thead th{font:600 12px/1.25 var(--display);color:var(--ink)}
.cmp-table td.c-cell{color:var(--ink);font-weight:600}
@media (max-width:760px){
  .card.wide{width:auto;top:auto}
  .stat{padding:8px 3px 7px 8px}
  .stat-v{font-size:14px}
}


/* ---------- 2026-10 upgrade: header actions, ZIP lookup, cards, owner view, replay, story, dialog ---------- */
.btn-ghost{gap:6px;cursor:pointer;font-family:inherit}
.btn-ghost svg{width:14px;height:14px;flex:none}
.btn-tour{background:var(--ink);border-color:var(--ink);color:#fff}
.btn-tour:hover{background:var(--ink-2);border-color:var(--ink-2)}
.btn-sm{height:32px;padding:0 14px;font-size:12.5px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap}
a.btn{color:#fff}
.btn:focus-visible,.btn-ghost:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn[disabled]{opacity:.4;cursor:default}

/* ZIP lookup */
.sec.near{padding-top:14px}
.near-form{display:flex;gap:6px}
.near-form input{flex:1;min-width:0;height:36px;padding:0 11px;border:1px solid var(--line-2);border-radius:8px;background:#fff;color:var(--ink);font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.near-form input:focus{border-color:var(--accent);outline:2px solid var(--accent);outline-offset:2px}
.near-form .btn{height:36px}
#nearMsg{margin:6px 0 0}
#nearMsg:empty{display:none}
.card .near-h{display:flex;align-items:baseline;gap:4px;margin-top:8px}
.card .near-mi{font:600 44px/1 var(--display);letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}
.card .near-u{font:500 17px/1 var(--display);color:var(--body)}
.near-list{list-style:none;margin:6px 0 4px;padding:0;display:flex;flex-direction:column;gap:6px}
.near-list button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:9px;background:#fff;text-align:left;cursor:pointer;transition:border-color .15s,background .15s}
.near-list button:hover{border-color:var(--line-2);background:var(--wash)}
.near-t{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.near-l{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#2E544D}
.near-s{font-size:12.5px;color:var(--ink);line-height:1.35}
.near-v{font:600 15px/1 var(--display);color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.c-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0 4px}
.c-actions .link{margin-left:auto}

/* Card shell: calmer, lifted, animated in */
.card{border-radius:14px;padding:16px 18px;box-shadow:0 1px 2px rgba(15,56,51,.06),0 12px 32px rgba(15,56,51,.12);animation:cardIn .28s var(--ease)}
@keyframes cardIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.card dl{row-gap:6px}

/* Metro card */
.m-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-right:30px}
.m-head .c-eyebrow{white-space:nowrap}
.m-head .pill.role{margin:0;font-size:11px;white-space:nowrap}
.card{max-height:calc(100% - 158px)}
.card h3.m-title{font-size:23px;margin-top:8px}
.m-hero{display:flex;align-items:flex-end;gap:12px;margin:12px 0 10px;padding:12px 0 2px;border-top:1px solid var(--line)}
.m-hero-v{font:600 40px/.95 var(--display);letter-spacing:-.045em;color:var(--ink);font-variant-numeric:tabular-nums}
.m-hero-l{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--body);line-height:1.3;padding-bottom:2px}
.m-rank{color:var(--muted);font-size:11.5px}
.m-mix{margin:2px 0 12px}
.m-bar{display:flex;height:10px;border-radius:5px;overflow:hidden;background:var(--line);gap:1.5px}
.m-bar i{display:block;min-width:2px}
.m-mix-l{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:7px;font-size:11.5px;color:var(--body)}
.m-mix-l>span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.m-mix-l .swatch{width:8px;height:8px;box-shadow:none}
.card .m-kpis .c-kpi[data-key=sfK],.card .m-kpis .c-kpi[data-key=sfPerCap]{display:none}
.card .m-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Owner view: landlord list and title chip */
.mini-l{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#2E544D;margin-top:6px}
.mini-seg{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;background:var(--wash);border-radius:8px}
.mini-seg button{height:28px;border:0;border-radius:6px;background:none;font-size:12px;font-weight:500;color:var(--muted);cursor:pointer}
.mini-seg button:hover{color:var(--ink)}
.mini-seg button[aria-checked=true]{background:var(--ink);color:#fff;box-shadow:0 1px 2px rgba(15,56,51,.12)}
.ll-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1px}
.ll-list button{display:flex;align-items:center;gap:8px;width:100%;padding:6px 7px;border:1px solid transparent;border-radius:7px;background:none;text-align:left;cursor:pointer;font-size:12.5px;color:var(--ink)}
.ll-list button:hover{background:var(--wash)}
.ll-list button[aria-pressed=true]{background:#E6F3F1;border-color:rgba(13,153,153,.35)}
.ll-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ll-v{color:var(--muted);font-size:11.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.view-title{position:absolute;top:56px;left:50%;transform:translateX(-50%);z-index:5;display:flex;align-items:center;gap:14px;max-width:calc(100% - 140px);padding:8px 8px 8px 16px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);animation:cardIn .28s var(--ease)}
.vt-t{display:flex;flex-direction:column;min-width:0}
.vt-t b{font:600 14.5px/1.25 var(--display);letter-spacing:-.01em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vt-t span{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.vt-copy{flex:none;height:30px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;background:#fff;font-size:12px;font-weight:500;color:var(--ink);cursor:pointer}
.vt-copy:hover{background:var(--wash)}

/* Legend folds to a button while a card is open */
.lg-toggle{display:none}
.legend.collapsed{padding:0;min-width:0;background:#fff}
.legend.collapsed>*{display:none}
.legend.collapsed>.lg-toggle{display:block;height:32px;padding:0 14px;border:0;background:none;font-size:12px;font-weight:600;color:var(--ink);cursor:pointer;border-radius:var(--radius)}

/* Timeline + record */
.rec{flex:none;display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px 0 10px;border:1px solid var(--line-2);border-radius:999px;background:#fff;font-size:12px;font-weight:500;color:var(--ink);cursor:pointer;white-space:nowrap}
.rec:hover{background:var(--wash)}
.rec-dot{width:9px;height:9px;border-radius:50%;background:#c8352e;box-shadow:0 0 0 2px rgba(200,53,46,.15)}
.rec.on{border-color:#c8352e;color:#9b2620}
.rec.on .rec-dot{animation:recBlink 1s steps(2,start) infinite}
.rec[aria-disabled=true]{opacity:.5}
@keyframes recBlink{to{visibility:hidden}}
.timeline{width:min(640px,calc(100% - 250px))}

/* Replay HUD */
.replay-hud{position:absolute;top:12px;right:12px;z-index:6;width:300px;padding:14px 16px 12px;background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);transition:opacity .6s var(--ease)}
.replay-hud.fade{opacity:0}
.rh-t{font:600 13px/1.2 var(--display);color:var(--ink);letter-spacing:-.005em}
.rh-y{font:600 60px/1 var(--display);letter-spacing:-.05em;color:var(--accent-d);font-variant-numeric:tabular-nums;margin:4px 0 8px}
.rh-c{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:8px;border-top:1px solid var(--line)}
.rh-k{display:flex;flex-direction:column;gap:2px}
.rh-k b{font:600 20px/1.1 var(--display);letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.rh-k span{font-size:11px;line-height:1.3;color:var(--muted)}
.rh-tag{margin-top:9px;display:inline-block;padding:2px 8px;border-radius:999px;background:#FFF4DE;color:#7A5300;font-size:11px;font-weight:500}
.rh-cap{margin:9px 0 0;font-size:11px;line-height:1.45;color:var(--muted)}
body.replaying .tl-count{visibility:hidden}
body.replaying .seg,body.replaying .tools,body.replaying .legend,body.replaying .maplibregl-ctrl-top-right,body.replaying .view-title{opacity:0;pointer-events:none;transition:opacity .4s}
.toast{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:9;max-width:min(460px,calc(100% - 24px));padding:9px 14px;background:var(--ink);color:#fff;border-radius:10px;font-size:12.5px;box-shadow:0 6px 20px rgba(15,56,51,.25)}
.toast a{color:#9FE3DA;font-weight:600}

/* Story */
.story{position:absolute;left:12px;bottom:28px;z-index:7;width:390px;max-height:calc(100% - 40px);overflow:auto;padding:16px 18px 14px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 2px rgba(15,56,51,.06),0 16px 40px rgba(15,56,51,.16);animation:cardIn .35s var(--ease)}
.st-top{display:flex;align-items:center;justify-content:space-between}
.st-k{margin:0}
.st-x{width:28px;height:28px;border:0;background:none;border-radius:6px;font-size:20px;line-height:1;color:var(--muted);cursor:pointer}
.st-x:hover{background:var(--wash);color:var(--ink)}
.st-t{margin:6px 0 8px;font:600 22px/1.15 var(--display);letter-spacing:-.025em;color:var(--ink)}
.st-t:focus{outline:none}
.st-p{margin:0 0 12px;font-size:13.5px;line-height:1.55;color:var(--body)}
.st-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:12px}
.st-stats div{background:var(--surface);padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.st-stats b{font:600 17px/1.1 var(--display);letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.st-stats span{font-size:10.5px;line-height:1.3;color:var(--muted)}
.st-nav{display:flex;align-items:center;justify-content:space-between;gap:8px}
.st-dots{display:flex;gap:6px}
.st-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:var(--line-2);cursor:pointer;transition:background .2s,transform .2s}
.st-dots button[aria-selected=true]{background:var(--ink);transform:scale(1.25)}
.st-src{margin:10px 0 0;font-size:10.5px;color:var(--muted);line-height:1.4}
body.storying .timeline,body.storying .card,body.storying .view-title,body.storying .legend{display:none!important}

/* Dialog */
.dlg{width:min(680px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 60px rgba(15,56,51,.25);color:var(--body);background:#fff}
.dlg::backdrop{background:rgba(15,56,51,.35)}
.dlg[open]{animation:cardIn .25s var(--ease)}
.dlg-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px 0 20px}
.dlg-head h2{margin:0;font:600 17px/1.2 var(--display);letter-spacing:-.015em;color:var(--ink)}
.dlg-head .card-x{position:static}
.dlg-body{padding:12px 20px 20px;overflow:auto}
.share-img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.dlg-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.dlg-link{margin:10px 0 0;font-size:11.5px;color:var(--muted);word-break:break-all}
.dlg-status{margin:8px 0 0;font-size:12px;color:var(--accent-d);min-height:1em}
textarea.code{width:100%;padding:10px 12px;border:1px solid var(--line-2);border-radius:8px;background:var(--wash);font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink);resize:vertical}
blockquote.cite{margin:0;padding:10px 12px;border-left:3px solid var(--accent);background:var(--wash);border-radius:0 8px 8px 0;font-size:13px;line-height:1.5;color:var(--ink)}

/* Desktop at 1100-1400: keep the growth bar clear of the legend */
@media (max-width:1100px){
  .timeline{width:calc(100% - 24px)}
  .replay-hud{width:270px}
}

/* Mobile: bottom sheets */
@media (max-width:760px){
  .hide-xs{display:none}
  .top-links{gap:6px}
  .top-links .btn-ghost{height:32px;width:32px;padding:0;justify-content:center}
  #top h1{font-size:12.5px;white-space:normal;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .brand-name{display:none}
  .timeline{bottom:122px;padding:6px 10px 5px 6px;gap:8px;border-radius:12px}
  .tl-ticks{display:none}
  .tl-top .eyebrow{font-size:9.5px;letter-spacing:.12em}
  .rec{height:30px;width:30px;padding:0;justify-content:center}
  .rec-l{display:none}
  .card{position:fixed;top:auto;bottom:0;left:0;right:0;width:auto;max-height:64dvh;border-radius:18px 18px 0 0;border-bottom:0;z-index:12;padding:20px 16px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(15,56,51,.2);animation:sheetIn .3s var(--ease)}
  .card::before{content:'';position:absolute;top:7px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--line-2)}
  .card.wide{width:auto;top:auto}
  body.card-open .timeline{display:none}
  .story{position:fixed;left:0;right:0;bottom:0;width:auto;max-height:58dvh;border-radius:18px 18px 0 0;border-bottom:0;z-index:12;padding:14px 16px calc(14px + env(safe-area-inset-bottom));animation:sheetIn .3s var(--ease)}
  .st-t{font-size:19px}
  .st-p{font-size:13px}
  .replay-hud{top:10px;bottom:auto;left:10px;right:10px;width:auto;padding:10px 12px;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center}
  .rh-t{grid-column:1/-1}
  .rh-y{font-size:40px;margin:2px 0}
  .rh-c{border-top:0;padding-top:0}
  .rh-k b{font-size:16px}
  .rh-cap{grid-column:1/-1;margin-top:6px;font-size:10.5px;line-height:1.35}
  .rh-k span{font-size:10.5px}
  .rh-tag{grid-column:1/-1;justify-self:start;margin-top:4px}
  .view-title{top:50px;max-width:none;left:10px;right:52px;transform:none;padding:6px 6px 6px 12px}
  .vt-t b{white-space:normal}
  .vt-t b{font-size:13px}
  .dlg{width:100vw;max-width:100vw;margin:auto 0 0;border-radius:18px 18px 0 0;max-height:88dvh}
}
@keyframes sheetIn{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}

/* 2026-10 review fixes */
/* Focus: one solid accent ring everywhere */
.pill.role[tabindex]{cursor:help}
.pill.role:focus-visible,.st-more:focus-visible,.toast-x:focus-visible,.tour-tip button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Comparison card: below the size toggle, at the right edge, never clipped at 1366x800 */
.card.wide{top:100px;right:12px;width:490px;max-height:calc(100% - 128px)}
.cmp-table tbody th{white-space:nowrap}
.cmp-table th,.cmp-table td{padding:4px 6px}
.cmp-table{font-size:11.5px}
body.wide-open .timeline{width:min(520px,calc(100% - 540px));min-width:0}
body.wide-open .legend.collapsed{display:none}
/* Replay: the stats strip would show a second, different set of numbers */
body.replaying .stats{visibility:hidden}
body.replaying .tour-tip{display:none}
.rh-today{margin:9px 0 0;font-size:11px;line-height:1.45;color:var(--ink)}
/* Toast close */
.toast{display:flex;align-items:center;gap:10px}
.toast-x{flex:none;margin-left:auto;width:24px;height:24px;border:0;border-radius:6px;background:rgba(255,255,255,.12);color:#fff;font-size:16px;line-height:1;cursor:pointer}
.toast-x:hover{background:rgba(255,255,255,.24)}
.toast .toast-alt{background:none;border:0;padding:0;color:#9FE3DA;font:inherit;font-weight:600;text-decoration:underline;cursor:pointer}
/* ZIP result */
.near-tag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;background:var(--ink);color:#fff;font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;vertical-align:1px}
.card .near-h{flex-wrap:wrap}
.card .near-to{flex-basis:100%;font:500 14px/1.3 var(--display);color:var(--ink);margin-top:4px}
/* Tour prompt (first visit) */
.tour-tip{position:absolute;left:50%;top:96px;transform:translateX(-50%);z-index:6;display:flex;align-items:center;gap:6px;padding:5px 5px 5px 6px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow);animation:cardIn .3s var(--ease);white-space:nowrap}
.tour-tip .tt-go{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border:0;border-radius:999px;background:var(--ink);color:#fff;font-size:12.5px;font-weight:500;cursor:pointer}
.tour-tip .tt-go:hover{background:var(--ink-2)}
.tour-tip .tt-go svg{width:12px;height:12px}
.tour-tip .tt-x{width:26px;height:26px;border:0;border-radius:50%;background:none;color:var(--muted);font-size:17px;line-height:1;cursor:pointer}
.tour-tip .tt-x:hover{background:var(--wash);color:var(--ink)}
body.storying .tour-tip,body.card-open .tour-tip{display:none}
.st-more{background:none;border:0;padding:0;color:var(--accent-d);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.st-more{display:none}
@media (max-width:760px){
  /* Cards sit above the drawer's peek (handle + stats), so the drawer stays tappable; an open drawer covers them. */
  .card{bottom:112px;z-index:9;max-height:44dvh;border-radius:18px;border-bottom:1px solid var(--line);left:6px;right:6px;padding-bottom:14px;box-shadow:0 -6px 30px rgba(15,56,51,.18)}
  body.drawer-open .card{visibility:hidden}
  .tour-tip{top:88px}
  /* Story: a short sheet (about 30% of the screen); the full text opens behind More */
  .story{max-height:42dvh;padding:10px 14px calc(10px + env(safe-area-inset-bottom))}
  .st-t{font-size:17px;margin:2px 0 4px}
  .st-p{margin:0 0 6px;font-size:12.5px;line-height:1.45}
  .story:not(.more) .st-p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .story:not(.more) .st-src{display:none}
  .st-more{display:inline;margin:0 0 6px}
  .st-stats{margin-bottom:8px}
  .st-stats div{padding:5px 8px}
  .st-stats b{font-size:15px}
  .st-stats span{font-size:10px}
  .story .st-nav .btn-sm{height:30px}
}
@media (max-width:760px){
  .card.wide{top:auto;right:6px;width:auto}
}