:root {
  --navy: #1c2733; --navy-2: #26343f; --gold: #f0b429; --gold-deep: #d99a10;
  




  --bar-ctl: #2a3a4a; --bar-ctl-line: #4a5a6a;
  --ink: #14191f; --slate: #45525e; --slate-2: #833; --line: #e0e4e8;
  --paper: #f4f6f8; --card: #ffffff; --hover: #fdf6e3;
  --good: #1a7a3c; --warn: #d98014; --crit: #c0272d;
  






  --amber-text: #8a5a05; --danger-fg: #b3261e;
  --shadow: 0 2px 14px rgba(20,30,42,.14);
  --font: "Segoe UI", -apple-system, system-ui, Roboto, Arial, sans-serif;
  --mono: "SF Mono", "Cascadia Mono", Consolas, monospace;
  --input-bg: #ffffff; --input-line: #cfd6dc;
  




  --topbar-h: 54px;
  



  --topbar-m: 0px;
  --topbar-top: max(var(--topbar-h), var(--topbar-m));
}

:root[data-theme="dark"] {
  --ink: #e7ecf1; --slate: #9fb0c0; --line: #2b3742;
  --paper: #0f151b; --card: #1a2129; --hover: #232e39;
  --shadow: 0 2px 16px rgba(0,0,0,.55);
  --input-bg: #1e2731; --input-line: #35434f;
  --amber-text: #f0b429; --danger-fg: #ff9e96;
  
  --navy: #0e161d; --navy-2: #16212a; --bar-ctl: #202c37; --bar-ctl-line: #33424f;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink: #e7ecf1; --slate: #9fb0c0; --line: #2b3742;
    --paper: #0f151b; --card: #1a2129; --hover: #232e39;
    --shadow: 0 2px 16px rgba(0,0,0,.55);
    --input-bg: #1e2731; --input-line: #35434f;
    --amber-text: #f0b429; --danger-fg: #ff9e96;
    
    --navy: #0e161d; --navy-2: #16212a; --bar-ctl: #202c37; --bar-ctl-line: #33424f;
  }
}












:root { scrollbar-width: thin; scrollbar-color: var(--slate) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: var(--slate); border-radius: 4px; }
*::-webkit-scrollbar-thumb:hover { background: var(--ink); }

.fgrid input, .fgrid select, .factions select, #f_saved, #noteText, #searchbox input, #searchbox select,
#rtable, .rt-empty, #filterPane, #searchView, #salesFilter, #asmPanel, #schoolFilter, #mapLegend, #measureReadout, #mapTools button {
  background: var(--card); color: var(--ink);
}
.fgrid input, .fgrid select, .factions select, #noteText { border-color: var(--input-line); }
#searchbox input, #searchbox select { background: var(--input-bg); color: var(--ink); }
#filterPane { border-bottom-color: var(--line); }
#panelBody h1, #compareHead, table.cmp td, table.kv td:last-child { color: var(--ink); }
#f_csv, #f_save, #f_calllist, #panelBar button#compareAddBtn { background: var(--hover); color: var(--ink); border-color: var(--input-line); }











:root[data-theme="dark"] #panelBody a, :root[data-theme="dark"] .links a, :root[data-theme="dark"] #panelBody .sub a,
:root[data-theme="dark"] #rtable a, :root[data-theme="dark"] .leaflet-popup-content a { color: #f2c14e; }
:root[data-theme="dark"] .leaflet-popup-content-wrapper, :root[data-theme="dark"] .leaflet-popup-tip { background: var(--card); color: var(--ink); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) #panelBody a, :root:not([data-theme="light"]) .links a,
  :root:not([data-theme="light"]) #panelBody .sub a, :root:not([data-theme="light"]) #rtable a,
  :root:not([data-theme="light"]) .leaflet-popup-content a { color: #f2c14e; }
  


  :root:not([data-theme="light"]) .leaflet-popup-content-wrapper,
  :root:not([data-theme="light"]) .leaflet-popup-tip { background: var(--card); color: var(--ink); }
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; font-family: var(--font); color: var(--ink); }


body { background: var(--paper); display: flex; flex-direction: column; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
.skip-link { position: absolute; left: -999px; top: 0; z-index: 5000; background: var(--gold); color: #1c2733;
  padding: 8px 14px; border-radius: 0 0 6px 0; font-weight: 700; font-size: 13px; text-decoration: none; }
.skip-link:focus { left: 0; }

#topbar {
  


  min-height: 54px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px;
  padding: 6px 16px; color: #fff;
  background: linear-gradient(180deg, var(--navy-2), var(--navy));
  

  box-shadow: 0 1px 0 rgba(0,0,0,.25), 0 2px 8px rgba(0,0,0,.18); z-index: 1600;
}
#brand { font-weight: 800; font-size: 19px; letter-spacing: 1.5px; white-space: nowrap; color: inherit; text-decoration: none; }
#brand:hover span { text-decoration: underline; }
#brand span { color: var(--gold); }
#searchbox { display: flex; gap: 6px; flex: 1 1 320px; min-width: 240px; max-width: 760px; }
#searchbox input { min-width: 0; }
.jb-chip, .jb-chip a { white-space: nowrap; }
#searchbox select, #searchbox input, #searchbox button {
  height: 32px; border: none; border-radius: 4px; padding: 0 8px; font-size: 14px;
}
#searchbox { position: relative; }
#searchInput { flex: 1; }



#autocomplete {
  position: absolute; top: 36px; left: 96px; right: 0; z-index: 3000; background: var(--card); color: var(--ink);
  border-radius: 0 0 7px 7px; box-shadow: var(--shadow); max-height: 420px; max-width: 520px;
  display: flex; flex-direction: column; overflow: hidden;
}
#acHead {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 6px 8px 6px 12px; border-bottom: 1px solid var(--line);
  font-size: 12.5px; font-weight: 700; color: var(--slate); flex: none;
}
#acHead.hidden { display: none; }
#acClose {
  border: none; background: none; cursor: pointer; color: var(--ink);
  font-size: 20px; line-height: 1; padding: 0 6px; border-radius: 4px;
}
#acClose:hover { background: var(--hover); color: var(--gold-deep); }
#acList { overflow-y: auto; min-height: 0; }

.ac-note { padding: 9px 12px; font-size: 12.5px; color: var(--slate); }
.ac-note b { color: var(--ink); }
#autocomplete.hidden { display: none; }
.ac-item { padding: 7px 12px; cursor: pointer; border-bottom: 1px solid var(--line); }
.ac-item:hover { background: var(--hover); }
.ac-addr { font-weight: 600; font-size: 13.5px; display: block; }
.ac-meta { color: var(--slate); font-size: 12px; }
#searchBtn { background: #f0b429; font-weight: 600; cursor: pointer; }






#baseToggle {
  position: absolute; left: 10px; bottom: 26px; z-index: 1000;
  display: flex; gap: 4px;
}
#baseToggle button {
  width: 62px; height: 46px; padding: 4px 2px 5px; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  border: 1px solid transparent; border-radius: 5px;
  background: var(--card); color: var(--ink); box-shadow: var(--shadow);
  font-size: 10.5px; font-weight: 700; line-height: 1.1; letter-spacing: .1px;
}















#baseToggle button::before {
  content: ""; width: 26px; height: 16px; border-radius: 3px; flex: none;
  border: 1px solid rgba(128,128,128,.55);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);
  background-repeat: no-repeat;
}


#btnTopo::before {
  background-image:
    repeating-radial-gradient(circle at 68% 84%, rgba(122,88,44,.58) 0 1px, rgba(122,88,44,0) 1px 3.5px),
    repeating-radial-gradient(circle at 13% 17%, rgba(122,88,44,.42) 0 1px, rgba(122,88,44,0) 1px 4.5px),
    linear-gradient(150deg, #f2ead7, #d6c69d);
}


#btnStreet::before {
  background-image:
    linear-gradient(90deg, transparent 0 10px, #fffdf6 10px 13px, transparent 13px),
    linear-gradient(180deg, transparent 0 6px, #fffdf6 6px 9px, transparent 9px),
    linear-gradient(66deg, transparent 0 62%, #f8f4e8 62% 70%, transparent 70%),
    linear-gradient(155deg, #f2f0e8, #dad4c4);
}



#btnSat::before {
  background-image:
    linear-gradient(72deg, transparent 0 46%, rgba(214,204,168,.50) 46% 52%, transparent 52%),
    radial-gradient(ellipse 58% 84% at 14% 22%, rgba(146,174,92,1) 0 52%, rgba(146,174,92,0) 88%),
    radial-gradient(ellipse 54% 78% at 84% 76%, rgba(172,150,78,1) 0 50%, rgba(172,150,78,0) 86%),
    radial-gradient(ellipse 46% 68% at 78% 12%, rgba(40,66,36,1) 0 48%, rgba(40,66,36,0) 84%),
    radial-gradient(ellipse 42% 62% at 26% 90%, rgba(34,58,33,1) 0 46%, rgba(34,58,33,0) 82%),
    linear-gradient(135deg, #587340, #29401f);
}



#btnBlueprint::before {
  background-image:
    linear-gradient(90deg, transparent 0 15px, rgba(163,201,240,.62) 15px 17px, transparent 17px),
    linear-gradient(180deg, transparent 0 9px, rgba(163,201,240,.45) 9px 11px, transparent 11px),
    linear-gradient(66deg, transparent 0 28%, rgba(163,201,240,.30) 28% 34%, transparent 34%),
    linear-gradient(150deg, #27466a, #0e1b29);
}
#baseToggle button:hover { border-color: var(--gold); }
#baseToggle button.active { background: #f0b429; color: #1c2733; border-color: #f0b429; }
#baseToggle button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }




body:has(#searchView:not(.hidden)) #baseToggle { display: none !important; }




@media (max-width: 760px) { #baseToggle { bottom: 70px; } }  /* B1299: 58px let the collapsed Legend chip (bottom 26 + 40 high) cover the Dark button */

#main { position: relative; flex: 1 1 auto; min-height: 0; display: flex; }
#map { flex: 1; height: 100%; }

#panel {
  width: 460px; max-width: 45%; height: 100%; overflow-y: auto;
  background: var(--card); border-left: 1px solid var(--line); box-shadow: -2px 0 8px rgba(0,0,0,.15);
}
#panel.hidden { display: none; }
#panelBar { position: sticky; top: 0; background: var(--card); padding: 8px 10px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; z-index: 5;}
#panelBar button#panelClose { border: none; background: none; cursor: pointer; font-size: 13px; color: var(--slate); }
#panelBar button#fullCardBtn {
  background: #f0b429; color: #1c2733; border: none; border-radius: 5px;
  padding: 9px 18px; font-size: 14px; font-weight: 700; cursor: pointer; letter-spacing: .3px;
  box-shadow: 0 1px 4px rgba(0,0,0,.2);
}
#panelBar button#fullCardBtn:hover { background: #1c2733; color: #f0b429; }
#panelBar button#compareAddBtn {
  background: var(--input-bg); color: var(--ink); border: 1px solid var(--input-line); border-radius: 5px;
  padding: 9px 12px; font-size: 13px; font-weight: 600; cursor: pointer; display: none;
}
#panelBar button#compareAddBtn:hover { background: var(--gold); border-color: var(--gold); }


#compareTray {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 1900; background: var(--navy); color: #fff;
  display: flex; align-items: center; gap: 12px; padding: 8px 16px; box-shadow: 0 -2px 10px rgba(0,0,0,.3);
}
#compareTray.hidden { display: none; }
#compareLabel { font-weight: 700; font-size: 13px; white-space: nowrap; }
#compareChips { display: flex; gap: 8px; flex: 1; flex-wrap: wrap; }
.cchip { background: #33475a; border-radius: 14px; padding: 3px 6px 3px 11px; font-size: 12px; display: flex; align-items: center; gap: 4px; }
.cchip button { background: none; border: none; color: #ccc; cursor: pointer; font-size: 14px; line-height: 1; }
#compareOpen { background: var(--gold); color: var(--navy); border: none; border-radius: 5px; padding: 8px 16px; font-weight: 700; cursor: pointer; }
#compareClear { background: none; border: none; color: #9fb0c0; cursor: pointer; font-size: 12px; }
#compareModal {
  position: fixed; inset: 0; z-index: 3500; background: rgba(10,16,22,.55);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
#compareModal.hidden { display: none; }
#compareInner { background: var(--card); border-radius: 10px; max-width: 900px; width: 100%; max-height: 88vh; overflow: auto; box-shadow: var(--shadow); }
#compareHead { position: sticky; top: 0; background: var(--card); display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--line); font-weight: 700; }
#compareHead button { border: none; background: none; cursor: pointer; color: var(--slate); font-size: 14px; }
#compareHead .cmp-actions { display: flex; gap: 8px; align-items: center; }

.copy-pid { margin-left: 8px; border: 1px solid var(--input-line); background: var(--input-bg); color: var(--slate); border-radius: 4px; padding: 0 6px; font-size: 12px; line-height: 1.5; cursor: pointer; vertical-align: baseline; }
.copy-pid:hover { color: var(--ink); border-color: var(--slate); }

.help-wrap { position: relative; display: inline-block; margin-left: 3px; vertical-align: middle; }
.help-ic { width: 14px; height: 14px; padding: 0; border: 1px solid var(--slate); border-radius: 50%; background: none;
  color: var(--slate); font-size: 10px; line-height: 1; font-weight: 700; cursor: pointer; opacity: .55;
  display: inline-flex; align-items: center; justify-content: center; }
.help-ic:hover, .help-ic:focus-visible, .help-wrap.open .help-ic { opacity: 1; border-color: var(--gold); color: var(--ink); }
.help-pop { position: absolute; z-index: 200; top: 19px; left: 0; min-width: 170px; max-width: 260px;
  background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: 7px;
  box-shadow: var(--shadow); padding: 8px 10px; font-size: 12px; font-weight: 400; line-height: 1.42; text-align: left; }
.own-portfolio { cursor: pointer; }
.own-portfolio:hover { color: var(--gold-deep); text-decoration: underline; }
.pf-portfolio-link { display: inline-block; margin-top: 4px; cursor: pointer; color: var(--gold-deep); font-weight: 600; font-size: 12.5px; }
.pf-portfolio-link:hover { text-decoration: underline; }
#portfolioModal { position: fixed; inset: 0; z-index: 3600; background: rgba(10,16,22,.55); display: flex; align-items: center; justify-content: center; padding: 18px; }
#portfolioModal.hidden { display: none; }
#portfolioInner { background: var(--card); color: var(--ink); border-radius: 10px; max-width: 760px; width: 100%; max-height: 86vh; overflow: auto; box-shadow: var(--shadow); }
#portfolioHead { position: sticky; top: 0; background: var(--card); display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--line); font-weight: 700; }
#portfolioHead button { border: none; background: none; cursor: pointer; color: var(--slate); font-size: 14px; }
#portfolioBody { padding: 14px 18px 20px; }
#pfTotals { font-size: 14px; margin-bottom: 12px; color: var(--ink); }
.pf-scroll { overflow-x: auto; }
.pf-table { border-collapse: collapse; width: 100%; font-size: 12.5px; }
.pf-table th { position: sticky; top: 0; background: #1c2733; color: #fff; padding: 6px 9px; text-align: left; white-space: nowrap; }
.pf-table td { padding: 5px 9px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.pf-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.pf-note { margin-top: 10px; font-size: 11.5px; color: var(--slate); }
.pf-loading { padding: 24px; text-align: center; color: var(--slate); }

#kbHelp { position: fixed; inset: 0; z-index: 3700; background: rgba(10,16,22,.55); display: flex; align-items: center; justify-content: center; padding: 18px; }
#kbHelp.hidden { display: none; }
#kbHelpInner { background: var(--card); color: var(--ink); border-radius: 10px; max-width: 360px; width: 100%; box-shadow: var(--shadow); overflow: hidden; }
#kbHelpHead { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line); font-weight: 700; }
#kbHelpHead button { border: none; background: none; cursor: pointer; color: var(--slate); font-size: 14px; }
#kbHelpTable { width: 100%; border-collapse: collapse; }
#kbHelpTable td { padding: 8px 16px; font-size: 13px; color: var(--ink); }
#kbHelpTable td:first-child { width: 64px; }
#kbHelp kbd { display: inline-block; min-width: 20px; text-align: center; padding: 2px 7px; border: 1px solid var(--input-line); border-bottom-width: 2px; border-radius: 5px; background: var(--input-bg); font-family: var(--mono); font-size: 12px; color: var(--ink); }
#compareCsv, #comparePrint { background: var(--input-bg); border: 1px solid var(--input-line); border-radius: 5px; padding: 4px 11px; font-size: 12.5px; font-weight: 600; color: var(--ink); }
#compareBody { padding: 0 18px 20px; }
table.cmp { width: 100%; border-collapse: collapse; font-size: 13px; }
table.cmp th, table.cmp td { padding: 8px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; font-variant-numeric: tabular-nums; }
table.cmp th { background: var(--navy); color: #fff; font-size: 12px; position: sticky; top: 52px; }
table.cmp th a { color: var(--gold); font-weight: 400; font-size: 11px; }
table.cmp .cmp-k { color: var(--slate); font-weight: 600; width: 150px; }
table.cmp tr:hover td { background: var(--hover); }
#panelBody { padding: 0 16px 30px; }
#noteBlock { background: var(--paper); border-radius: 8px; padding: 10px; margin: 10px 0 4px; }
#noteStatus { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 7px; }
.npill { border: 1px solid var(--line); background: var(--card); border-radius: 13px; padding: 3px 11px; font-size: 12px; cursor: pointer; font-weight: 600; color: var(--slate); }
.npill.on { color: #fff; border-color: transparent; }
.npill.tocall.on { background: #d99a10; } .npill.called.on { background: #2e6bd6; }
.npill.deal.on { background: #1a7a3c; } .npill.dead.on { background: #888; }
.npill[data-s=""].on { background: var(--slate); }
#noteText { width: 100%; min-height: 52px; border: 1px solid var(--line); border-radius: 6px; padding: 7px; font-size: 13px; font-family: var(--font); resize: vertical; }
#noteSaved { font-size: 11px; color: var(--good); height: 14px; margin-top: 2px; }





.ambig-note { margin: 10px 0 0; padding: 8px 10px; border: 1px solid var(--line);
  border-left: 3px solid var(--amber-text); border-radius: 4px;
  background: var(--hover); color: var(--amber-text); font-size: 12.5px; line-height: 1.45; }
#panelBody h1 { font-size: 17px; margin: 12px 0 2px; }
#panelBody .sub { color: var(--slate); font-size: 13px; margin-bottom: 10px; }
#panelBody h2 {
  font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--ink);
  border-bottom: 2px solid var(--gold); padding-bottom: 4px; margin: 20px 0 7px;
  display: flex; align-items: center; gap: 6px;
}





#panelBody h3 {
  font-size: 11px; text-transform: uppercase; letter-spacing: .6px; color: var(--slate);
  font-weight: 700; margin: 14px 0 6px;
}
#rtable td { font-variant-numeric: tabular-nums; }
table.kv { width: 100%; border-collapse: collapse; font-size: 13px; }
table.kv td { padding: 4px 4px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.kv td:first-child { color: var(--slate); width: 46%; }
table.kv td:last-child { font-weight: 600; font-variant-numeric: tabular-nums; }
.badge { display: inline-block; padding: 1px 7px; border-radius: 9px; font-size: 11px; font-weight: 700; margin-left: 6px; }
.badge.absentee { background: #ffe1e1; color: #a30000; }
.badge.occupied { background: #e2f5e2; color: #14691b; }
.badge.vacant { background: #fff3d6; color: #8a6000; }
.badge.entity { background: #e4e0f7; color: #4a2f9e; }
.links a { display: inline-block; margin: 4px 8px 0 0; font-size: 13px; }
#buyerFit { background: var(--paper); border-radius: 8px; padding: 9px 11px; margin: 8px 0; }
#buyerFit .bf-title { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--slate); font-weight: 700; margin-bottom: 5px; }
#buyerFit .bf-row { display: flex; align-items: baseline; gap: 8px; margin: 3px 0; font-size: 12.5px; }
#buyerFit .bf-pill { color: #fff; font-weight: 700; border-radius: 11px; padding: 2px 10px; font-size: 12px; flex: none; }
#buyerFit .bf-why { color: var(--slate); }
#userBuyBox { background: var(--paper); border: 1px solid var(--gold); border-radius: 8px; padding: 9px 11px; margin: 8px 0; }
#userBuyBox .bf-title { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--gold); font-weight: 700; margin-bottom: 6px; }
#userBuyBox .bf-why { color: var(--slate); font-size: 11.5px; }
.ubb-pill { display: inline-block; background: var(--gold); color: #1c2733; font-weight: 700; border-radius: 11px; padding: 2px 11px; font-size: 12px; margin: 2px 3px 2px 0; }





.result-item { padding: 8px 12px; border-bottom: 1px solid #f4f4f4; cursor: pointer; font-size: 13px; }
.result-item:hover { background: var(--hover); }
.result-item .addr { font-weight: 600; }
.result-item .meta { color: var(--slate); font-size: 12px; }

#status {
  position: fixed; bottom: 10px; left: 50%; transform: translateX(-50%);
  background: rgba(28,39,51,.92); color: #fff; padding: 6px 16px; border-radius: 16px;
  font-size: 13px; display: none; z-index: 2000;
}



button { transition: background .15s, color .15s; }
.result-item { transition: background .12s; }
#panel { animation: slideIn .18s ease-out; }
@keyframes slideIn { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }
.parcel-label { background: none; border: none; box-shadow: none; font-size: 10px; color: #0b5a12; font-weight: 600; text-shadow: 0 0 3px #fff; }






#overlayBtn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 32px; border: 1px solid var(--gold); background: var(--bar-ctl); color: #f0d9a0;
  padding: 0 11px; cursor: pointer; font-size: 13px; font-weight: 700; border-radius: 6px;
  white-space: nowrap;
}
.ovbtn-ico { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
.ovbtn-word { line-height: 1; }
.ovbtn-count {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  min-width: 18px; height: 17px; padding: 0 5px; border-radius: 9px;
  background: var(--gold); color: #1c2733; font-size: 11px; font-weight: 800;
}
#overlayBtn.on { background: var(--gold); color: #1c2733; }
#overlayBtn.on .ovbtn-count { background: #1c2733; color: var(--gold); }
#overlayBtn:hover { background: #f0b429; color: #1c2733; }
#overlayBtn:hover .ovbtn-count { background: #1c2733; color: var(--gold); }
#overlayBtn:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.ov-state { font-size: 11.5px; font-weight: 700; color: var(--ink); background: var(--hover);
  border: 1px solid var(--gold); border-radius: 6px; padding: 4px 9px; margin-bottom: 8px; }
.ov-state.hidden { display: none; }
.ov-cov { color: var(--slate); font-size: 11px; font-style: italic; }
label.ov-unavailable { opacity: .5; }



label.ov-unavailable input:not(:checked) { cursor: not-allowed; }
#overlayPanel {
  position: fixed; top: calc(var(--topbar-top) + 2px); right: 130px; z-index: 3000; width: 300px;
  max-height: calc(100vh - var(--topbar-top) - 24px); overflow-y: auto;
  background: var(--card); border-radius: 8px; box-shadow: 0 4px 18px rgba(0,0,0,.35); padding: 10px 14px 12px;
}
#overlayPanel.hidden { display: none; }


#main:has(#panel:not(.hidden)) ~ #overlayPanel,
body:has(#panel:not(.hidden)) #overlayPanel { right: 484px; }
body:has(#panel:not(.hidden)) #profilePanel { right: 460px; }
.ogroup { margin-bottom: 8px; }

.fz-bar { display: inline-block; width: 120px; max-width: 60%; height: 13px; border-radius: 3px;
  background: linear-gradient(90deg, var(--line), var(--hover), var(--line)); filter: blur(3px); opacity: .8; }
.fz-cta { margin-top: 14px; padding: 14px; border: 1px solid var(--gold); border-radius: 10px; background: var(--hover); }
.fz-cta-title { font-weight: 800; font-size: 15px; color: var(--ink); }
.fz-cta-sub { font-size: 12.5px; color: var(--slate); margin: 4px 0 10px; }
.fz-btn { background: var(--gold); color: #1c2733; border: 0; border-radius: 7px; padding: 9px 16px;
  font-weight: 700; font-size: 14px; cursor: pointer; }
.fz-btn:hover { filter: brightness(1.05); }
.fz-link { background: none; border: 0; color: var(--slate); text-decoration: underline; cursor: pointer;
  font-size: 12.5px; margin-left: 10px; }
#countyChips { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.county-chip { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; padding: 2px 4px 2px 8px;
  background: var(--input-bg); border: 1px solid var(--gold); border-radius: 12px; color: var(--ink); }
.county-chip button { border: none; background: none; color: var(--slate); font-size: 14px; line-height: 1; padding: 0 4px; cursor: pointer; border-radius: 8px; }
.county-chip button:hover { color: #c0392b; background: var(--hover); }
#savedViews .sv-row { display: flex; align-items: center; gap: 4px; padding: 2px 0; }
#savedViews .sv-load { flex: 1; text-align: left; font-size: 13px; padding: 4px 7px; border: 1px solid var(--input-line); border-radius: 4px; background: var(--input-bg); color: var(--ink); cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#savedViews .sv-load:hover { border-color: var(--gold); }
#savedViews .sv-del { border: none; background: none; color: var(--slate); font-size: 16px; line-height: 1; padding: 2px 6px; cursor: pointer; border-radius: 4px; }
#savedViews .sv-del:hover { color: #c0392b; background: var(--hover); }
#savedViews .sv-empty { font-size: 12px; color: var(--slate); padding: 3px 0; }
#svSave { display: flex; gap: 5px; margin-top: 5px; }
#svSave input { flex: 1; min-width: 0; font-size: 13px; padding: 4px 7px; border: 1px solid var(--input-line); border-radius: 4px; background: var(--input-bg); color: var(--ink); }
#svSave button { font-size: 13px; padding: 4px 10px; border: 1px solid var(--input-line); border-radius: 4px; background: var(--input-bg); color: var(--ink); cursor: pointer; }
#svSave button:hover { border-color: var(--gold); }
.ogtitle { font-size: 11px; text-transform: uppercase; letter-spacing: .6px; color: #888; font-weight: 700; margin: 8px 0 4px; border-bottom: 1px solid var(--line); }
.ogroup label { display: flex; gap: 7px; align-items: center; font-size: 13px; padding: 3px 0; cursor: pointer; }
.oattr { font-size: 10px; color: var(--slate); margin-top: 8px; border-top: 1px solid var(--line); padding-top: 5px; }


.jb-pin, .hosp-icon, .cam-icon, .rail-icon, .airport-icon, .bigfoot-icon, .planeicon,
.svc-police, .svc-fire, .svc-ems, .svc-school, .svc-govt, .svc-prison, .svc-military,
.poi-library, .poi-stadium, .poi-park, .poi-marina {
  display: flex; align-items: center; justify-content: center;
  width: 22px !important; height: 22px !important; margin: -11px 0 0 -11px;
  border-radius: 50%; border: 1.5px solid rgba(255,255,255,.92);
  color: #fff; font: 700 11px/1 system-ui, -apple-system, "Segoe UI", sans-serif;
  box-shadow: 0 1px 3px rgba(0,0,0,.45); background: #5b6b7a;
}
.hosp-icon { background: #c62828; }
.svc-police { background: #1565c0; }
.svc-fire  { background: #d84315; }
.svc-ems   { background: #ad1457; }
.svc-school { background: #6a1b9a; }
.svc-govt  { background: #37474f; }
.cam-icon  { background: #00695c; }
.rail-icon { background: #5d4037; }
.airport-icon { background: #0277bd; }
.bigfoot-icon { background: #6d4c41; }
.planeicon { background: #0277bd; border-radius: 4px; }
.poi-library { background: #00838f; }
.poi-stadium { background: #3949ab; }
.poi-park  { background: #2e7d32; }
.poi-marina { background: #0277bd; }
.psch-priv { background: #00695c; border-radius: 4px; }


.psch-sped { box-shadow: 0 0 0 3px #f0b429, 0 1px 3px rgba(0,0,0,.45); }
.daycare-icon { background: #ef6c00; }


.alpr-icon {
  width: 12px !important; height: 12px !important; margin: -6px 0 0 -6px;
  background: #4a148c; border: 1.5px solid rgba(255,255,255,.92); border-radius: 2px;
  box-shadow: 0 1px 3px rgba(0,0,0,.45);
}
.aadt-label { background: rgba(255,255,255,.85); border: none; box-shadow: none; padding: 0 3px; font-size: 10px; font-weight: 700; color: #1c2733; border-radius: 3px; }
.aadt-label::before { display: none; }
.asm-label { background: rgba(28,39,51,.9); color: #fff; border: none; box-shadow: none; padding: 1px 5px; font-size: 10px; font-weight: 700; border-radius: 3px; white-space: nowrap; }


.jb-flash-label {
  background: var(--navy, #1c2733); color: #fff; border: none; box-shadow: 0 1px 4px rgba(0,0,0,.4);
  padding: 2px 7px; font-size: 11px; font-weight: 700; border-radius: 4px; white-space: nowrap;
}
.jb-flash-label::before { border-top-color: var(--navy, #1c2733); }
#zoomBadge {
  position: absolute; top: 12px; left: 52px; z-index: 1200; pointer-events: none;
  background: var(--navy); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .3px;
  padding: 3px 9px; border-radius: 12px; box-shadow: var(--shadow); opacity: .9;
}
#mapLegend {
  position: absolute; bottom: 20px; right: 12px; z-index: 1000;
  border-radius: 8px; box-shadow: var(--shadow); padding: 9px 12px; font-size: 11.5px; max-width: 190px;
}
#mapLegend.hidden { display: none; }
.lg-group + .lg-group { margin-top: 7px; border-top: 1px solid var(--line); padding-top: 6px; }
.lg-title { font-weight: 700; color: var(--ink); margin-bottom: 3px; font-size: 11px; }
.lg-row { display: flex; align-items: center; gap: 6px; color: var(--slate); line-height: 1.7; }
.lg-dot { width: 11px; height: 11px; border-radius: 50%; border: 1px solid rgba(0,0,0,.25); flex: none; }
#mapTools { position: absolute; top: 84px; left: 10px; z-index: 1000; display: flex; flex-direction: column; gap: 4px; }


#poiPanel { position: absolute; top: 84px; left: 80px; z-index: 1400; background: var(--card); color: var(--ink);
  border-radius: 8px; box-shadow: var(--shadow); padding: 10px 12px; font-size: 12.5px; width: 230px; }
#poiPanel.hidden { display: none; }
#poiPanel label { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 6px 0; }
#poiPanel input[type="text"] { flex: 1; height: 26px; border: 1px solid var(--input-line); border-radius: 4px;
  background: var(--input-bg); color: var(--ink); padding: 0 7px; font-size: 12.5px; min-width: 0; }
#poiPanel input[type="color"] { width: 40px; height: 26px; border: 1px solid var(--input-line); border-radius: 4px;
  background: var(--input-bg); padding: 1px; cursor: pointer; }
#poiPanel input[type="range"] { flex: 1; }
.poi-modes { display: flex; gap: 6px; margin: 6px 0 2px; }
.poi-modes button, #poiShapeActions button { flex: 1; border: 1px solid var(--input-line); border-radius: 5px;
  background: var(--input-bg); color: var(--ink); font-size: 12px; font-weight: 600; padding: 6px 4px; cursor: pointer; }
.poi-modes button.on { background: var(--gold); color: #1c2733; border-color: var(--gold); }
#poiShapeActions { display: flex; gap: 6px; margin-top: 6px; }
#poiShapeActions.hidden { display: none; }
#poiIcons { display: flex; gap: 3px; flex-wrap: wrap; }
.poi-ic { border: 1px solid var(--input-line); border-radius: 5px; background: var(--input-bg);
  padding: 2px 3px; cursor: pointer; line-height: 0; }
.poi-ic.on { border-color: var(--gold); background: var(--hover); }
.poi-ico { background: none; border: none; }




#mapTools button { width: 62px; height: 46px; border: none; border-radius: 5px; background: var(--card); box-shadow: var(--shadow); cursor: pointer; font-size: 16px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 3px 2px 4px; color: var(--ink); }
#mapTools .mt-cap { font-size: 10.5px; font-weight: 700; line-height: 1.1; letter-spacing: .1px;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mapTools button svg { flex: none; }
#mapTools button.active { background: var(--gold); }
#measureReadout { position: absolute; top: 84px; left: 80px; z-index: 1000; border-radius: 8px; box-shadow: var(--shadow); padding: 8px 12px; font-size: 12.5px; width: 246px; max-height: calc(100vh - 200px); overflow-y: auto; color: var(--ink); }
#measureReadout.hidden { display: none; }
.mr-hint { color: var(--slate); font-size: 10.5px; }





.ms-sep { border-top: 1px solid var(--line); margin: 9px 0 5px; }
.ms-row { display: flex; flex-direction: column; gap: 4px; padding: 6px 0; }
.ms-row + .ms-row { border-top: 1px dashed var(--line); }
.ms-name { width: 100%; box-sizing: border-box; font: inherit; font-size: 12px; padding: 3px 6px;
  border: 1px solid var(--input-line); border-radius: 4px; background: var(--input-bg); color: var(--ink); }
.ms-meta { font-size: 11.5px; color: var(--slate); }
.ms-acts { display: flex; gap: 4px; align-items: center; }
.ms-acts button { font: inherit; font-size: 11px; padding: 3px 7px; cursor: pointer; color: var(--ink);
  background: var(--input-bg); border: 1px solid var(--input-line); border-radius: 4px; white-space: nowrap; }
.ms-acts .ms-del { margin-left: auto; padding: 2px 8px; font-size: 14px; line-height: 1.1; }
#measureClearAllBtn { margin-top: 8px; width: 100%; font: inherit; font-size: 11.5px; padding: 5px 8px;
  cursor: pointer; color: var(--ink); background: var(--input-bg); border: 1px solid var(--input-line);
  border-radius: 5px; }



.ms-label { width: 0 !important; height: 0 !important; overflow: visible; }



.ms-label-x { pointer-events: auto; cursor: pointer; margin-left: 6px; border: 0; padding: 0 2px;
  background: none; color: #fff; font-size: 13px; line-height: 1; opacity: .75; }
.ms-label-x:hover { opacity: 1; }

.ms-save { white-space: nowrap; }
.ms-save[disabled] { opacity: .65; cursor: default; }
.ms-label-in { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%);
  display: inline-block; white-space: nowrap; font-size: 11.5px; font-weight: 700; color: #fff;
  background: rgba(192, 39, 45, .92); border-radius: 4px; padding: 1px 7px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .35); }
#shapeSelectBtn { margin: 6px 0 2px; background: var(--gold); color: #1c2733; border: none; border-radius: 5px;
  padding: 6px 10px; font-size: 12px; font-weight: 700; cursor: pointer; }
#shapeSelectBtn:hover { background: #1c2733; color: var(--gold); }
#shapeModal { position: fixed; inset: 0; z-index: 3500; background: rgba(10,16,22,.55);
  display: flex; align-items: center; justify-content: center; padding: 20px; }
#shapeModal.hidden { display: none; }
#shapeInner { background: var(--card); color: var(--ink); border-radius: 10px; max-width: 900px; width: 100%;
  max-height: 88vh; overflow: auto; box-shadow: var(--shadow); }
#shapeHead { position: sticky; top: 0; background: var(--card); display: flex; justify-content: space-between;
  align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--line); font-weight: 700; }
#shapeHead button { border: none; background: var(--hover); color: var(--ink); cursor: pointer; font-size: 12.5px;
  border-radius: 5px; padding: 6px 10px; margin-left: 6px; }
#shapeBody { padding: 12px 18px 22px; }
#shapeBody table.kv th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .5px;
  color: var(--slate); border-bottom: 2px solid var(--gold); padding: 4px; }
#shapeBody table.kv td { font-size: 13px; }
@media print {
  

  :root, :root[data-theme="dark"], :root:not([data-theme="light"]) {
    --ink: #14191f; --slate: #45525e; --navy: #1c2733; --navy-2: #26343f; --line: #dcdcdc;
    --bar-ctl: #2a3a4a; --bar-ctl-line: #4a5a6a;
    --card: #ffffff; --paper: #ffffff; --input-bg: #ffffff; --input-line: #cccccc; --hover: #f4f6f8;
  }
  body { background: #fff !important; color: #14191f !important; }
  #topbar, #panel, #autocomplete, #overlayPanel, #overlayBtn, #baseToggle, #viewToggle, #compareTray, #mapTools, #salesFilter, #asmPanel, #schoolFilter, #myDataBtn, #themeToggle, .leaflet-control-zoom { display: none !important; }
  #main, #map { height: 100vh !important; }
}




#salesFilter {
  position: fixed; bottom: 26px; left: 56px; z-index: 1500; background: var(--card);
  border-radius: 8px; box-shadow: 0 2px 12px rgba(0,0,0,.3); padding: 8px 12px; font-size: 12px; width: 200px;
}
#salesFilter .sftitle { font-weight: 700; font-size: 12px; margin-bottom: 6px; color: var(--ink); }
#salesFilter label { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin: 3px 0; }
#salesFilter input, #salesFilter select { width: 96px; height: 24px; border: 1px solid #ccc; border-radius: 4px; font-size: 12px; }
#salesFilter .sflegend { margin-top: 6px; font-size: 10px; color: var(--slate); line-height: 1.5; }
#asmPanel {
  position: fixed; bottom: 26px; left: 56px; z-index: 1500; background: var(--card);
  border-radius: 8px; box-shadow: var(--shadow); padding: 8px 12px; font-size: 12px; width: 210px;
}
#asmPanel .sftitle { font-weight: 700; margin-bottom: 5px; color: var(--ink); }
#asmPanel .sflegend { margin-top: 6px; font-size: 10.5px; color: var(--slate); line-height: 1.5; }
#crimeFilter {
  position: fixed; bottom: 26px; left: 56px; z-index: 1500; background: var(--card); color: var(--ink);
  border-radius: 8px; box-shadow: var(--shadow); padding: 8px 12px; font-size: 12px; width: 200px;
}
#crimeFilter .sftitle { font-weight: 700; margin-bottom: 5px; color: var(--ink); }
#crimeFilter label { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin: 4px 0; }
#crimeFilter select, #crimeFilter input { width: 110px; height: 24px; border: 1px solid var(--input-line); border-radius: 4px; font-size: 12px; background: var(--input-bg); color: var(--ink); }
#schoolFilter {
  position: fixed; bottom: 26px; left: 56px; z-index: 1500; background: var(--card); color: var(--ink);
  border-radius: 8px; box-shadow: var(--shadow); padding: 8px 12px; font-size: 12px; width: 214px;
}
#schoolFilter .sftitle { font-weight: 700; margin-bottom: 5px; color: var(--ink); }
#schoolFilter label { display: flex; align-items: center; margin: 4px 0; }
#schoolFilter .sflegend { margin-top: 6px; font-size: 10.5px; color: var(--slate); line-height: 1.5; }




.ov-buf-panel {
  position: fixed; bottom: 26px; left: 56px; z-index: 1500; background: var(--card); color: var(--ink);
  border-radius: 8px; box-shadow: var(--shadow); padding: 8px 12px; font-size: 12px; width: 214px;
}
.ov-buf-panel .sftitle { font-weight: 700; margin-bottom: 5px; color: var(--ink); }
.ov-buf-panel label { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin: 4px 0; }
.ov-buf-panel .buf-ctl[hidden] { display: none; }
.ov-buf-panel input[type="number"], .ov-buf-panel select { width: 104px; height: 24px; border: 1px solid var(--input-line); border-radius: 4px; font-size: 12px; background: var(--input-bg); color: var(--ink); }


.ov-buf-panel input[type="checkbox"] { width: 15px; height: 15px; flex: none; }

.ov-sub-panel { margin-top: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); font-size: 12px; }
.ov-sub-panel .sftitle { font-weight: 700; margin-bottom: 5px; color: var(--ink); }
.ov-sub-panel label { display: flex; align-items: center; gap: 7px; margin: 4px 0; }
.ov-sub-panel input[type="checkbox"] { width: 15px; height: 15px; flex: none; }
.ov-buf-panel .sflegend { margin-top: 6px; font-size: 10.5px; color: var(--slate); line-height: 1.5; }



.ov-tf-panel {
  position: fixed; bottom: 26px; left: 56px; z-index: 1500; background: var(--card); color: var(--ink);
  border-radius: 8px; box-shadow: var(--shadow); padding: 8px 12px; font-size: 12px; width: 214px;
}
.ov-tf-panel .sftitle { font-weight: 700; margin-bottom: 5px; color: var(--ink); }
.ov-tf-panel label { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin: 4px 0; }
.ov-tf-panel select { width: 130px; height: 24px; border: 1px solid var(--input-line); border-radius: 4px; font-size: 12px; background: var(--input-bg); color: var(--ink); }
.ov-tf-panel .sflegend { margin-top: 6px; font-size: 10.5px; color: var(--slate); line-height: 1.5; }








#viewToggle { display: flex; align-items: stretch; }
#viewToggle button {
  height: 32px; border: 1px solid var(--bar-ctl-line); background: var(--bar-ctl); color: #ccc;
  padding: 0 14px; cursor: pointer; font-size: 13px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
}
#viewToggle button.active { background: var(--gold); color: #1c2733; border-color: var(--gold); }



#btnSearchView { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
#btnSearchView:not(.active) { border-color: var(--gold); color: #f0d9a0; }
#btnSearchView .vt-ico { flex: none; }
#viewToggle button:first-child { border-radius: 4px 0 0 4px; }
#viewToggle button:last-child { border-radius: 0 4px 4px 0; }
#themeToggle { height: 32px; width: 36px; border: 1px solid var(--bar-ctl-line); background: var(--bar-ctl); color: #fff; border-radius: 4px; cursor: pointer; font-size: 15px; }
#myDataBtn { height: 32px; border: 1px solid var(--bar-ctl-line); background: var(--bar-ctl); color: #fff; border-radius: 4px; cursor: pointer; font-size: 13px; font-weight: 600; padding: 0 12px; }
#myDataBtn:hover { background: var(--gold); color: #1c2733; border-color: var(--gold); }

#profilePanel {
  

  position: fixed; top: var(--topbar-top); right: 0; bottom: 0; width: 420px; max-width: 92%; z-index: 3100;
  background: var(--card); color: var(--ink); box-shadow: -3px 0 16px rgba(0,0,0,.28); display: flex; flex-direction: column;
}
#profilePanel.hidden { display: none; }



#overlayPanel.jb-panel-top, #profilePanel.jb-panel-top { z-index: 3200; }
#profileBar { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 8px 10px; }
#profileTabs { display: flex; gap: 4px; }
#profileTabs button { border: none; background: none; padding: 7px 12px; font-size: 13px; font-weight: 600; color: var(--slate); cursor: pointer; border-radius: 5px; }
#profileTabs button.active { background: var(--gold); color: #1c2733; }
#profileClose { border: none; background: none; font-size: 20px; cursor: pointer; color: var(--slate); }
#profileBody { flex: 1; overflow-y: auto; padding: 10px 14px 30px; }
.pf-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }
.pf-chip { border: 1px solid var(--line); background: var(--card); color: var(--slate); border-radius: 13px; padding: 3px 11px; font-size: 12px; cursor: pointer; font-weight: 600; }
.pf-chip.on { background: var(--navy); color: #fff; border-color: transparent; }
.pf-item { border: 1px solid var(--line); border-radius: 7px; padding: 9px 11px; margin-bottom: 8px; cursor: pointer; }
.pf-item:hover { background: var(--hover); }
.pf-line1 { display: flex; align-items: center; gap: 7px; font-size: 13.5px; }
.pf-line2 { color: var(--slate); font-size: 12px; margin-top: 3px; }
.pf-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.pf-badge { font-size: 11px; color: var(--slate); font-weight: 600; }
.pf-actions { margin-top: 7px; display: flex; gap: 8px; }
.pf-actions button, #bb_save { border: none; border-radius: 5px; padding: 5px 12px; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.pf-run, .pf-trun { background: var(--gold); color: #1c2733; }
.pf-del, .pf-tdel { background: var(--input-bg); color: var(--crit); border: 1px solid var(--input-line) !important; }
.pf-share, .pf-thide, .pf-tedit, #bb_cancel { background: var(--input-bg); color: var(--ink); border: 1px solid var(--input-line) !important; }
.pf-share:hover, .pf-thide:hover, .pf-tedit:hover { border-color: var(--gold) !important; }
.pf-tag { display: inline-block; font-size: 10.5px; font-weight: 700; background: var(--hover); color: var(--slate);
  border: 1px solid var(--line); border-radius: 8px; padding: 1px 7px; margin-left: 6px; vertical-align: 1px; }
.pf-dim { opacity: .55; }
#bb_cancel { border: none; border-radius: 5px; padding: 5px 12px; font-size: 12.5px; font-weight: 600; cursor: pointer; margin-left: 8px; }
.pf-empty, .pf-sub { color: var(--slate); font-size: 13px; padding: 8px 2px; }


.pf-warn { border: 1px solid var(--gold); border-radius: 8px; padding: 10px 12px; margin-bottom: 11px;
  background: var(--hover); color: var(--ink); font-size: 12.5px; line-height: 1.5; }
.pf-warn a { color: inherit; }
.pf-folder { margin-bottom: 10px; }
.pf-folder-head { display: flex; align-items: center; gap: 7px; padding: 6px 4px; cursor: pointer; user-select: none;
  font-size: 12.5px; font-weight: 700; color: var(--slate); border-bottom: 1px solid var(--line); }
.pf-folder-head:hover { color: var(--ink); }
.pf-folder-caret { font-size: 10px; width: 10px; display: inline-block; text-align: center; }
.pf-folder-count { color: var(--slate); font-weight: 600; margin-left: auto; background: var(--paper);
  border-radius: 9px; padding: 0 8px; font-size: 11px; }
.pf-folder-body { padding-top: 4px; }



.pf-toolbar { display: flex; justify-content: flex-end; margin: 0 0 8px; }
.pf-newfolder { background: var(--input-bg); border: 1px solid var(--input-line); border-radius: 7px;
  padding: 6px 12px; font-size: 12.5px; font-weight: 700; color: var(--ink); cursor: pointer; }
.pf-newfolder:hover { border-color: var(--slate); }
.pf-folder-del { margin-left: 4px; border: 0; background: none; color: var(--slate); font-size: 17px;
  line-height: 1; padding: 1px 6px; border-radius: 5px; cursor: pointer; opacity: 0; transition: opacity .12s; }
.pf-folder-head:hover .pf-folder-del, .pf-folder-del:focus { opacity: 1; }
.pf-folder-del:hover { background: rgba(192, 39, 45, .12); color: #c0272d; }
.pf-folder-move { height: 27px; border: 1px solid var(--input-line); border-radius: 5px; font-size: 11.5px;
  background: var(--input-bg); color: var(--ink); padding: 0 4px; max-width: 128px; }
#bb_folder { width: 100%; height: 30px; border: 1px solid var(--input-line); border-radius: 5px; padding: 0 8px;
  margin-bottom: 8px; background: var(--input-bg); color: var(--ink); font-size: 13px; }
#bbForm { border-top: 2px solid var(--gold); margin-top: 14px; padding-top: 12px; }
.pf-formtitle { font-weight: 700; margin-bottom: 7px; }
#bb_name { width: 100%; height: 30px; border: 1px solid var(--input-line); border-radius: 5px; padding: 0 8px; margin-bottom: 8px; background: var(--input-bg); color: var(--ink); }
.bb-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; }
.bb-grid label { display: flex; flex-direction: column; font-size: 11.5px; color: var(--slate); font-weight: 600; gap: 2px; }
.bb-grid input { height: 27px; border: 1px solid var(--input-line); border-radius: 4px; padding: 0 6px; background: var(--input-bg); color: var(--ink); }
.bb-checks { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 9px 0; font-size: 12.5px; }
.bb-checks label { display: flex; align-items: center; gap: 5px; }
#bb_save { background: var(--navy); color: #fff; margin-top: 4px; }

#searchView { flex: 1; display: flex; flex-direction: column; overflow: hidden; background: var(--paper); }
#searchView.hidden { display: none; }
#filterPane { background: var(--card); padding: 14px 18px; border-bottom: 2px solid #e0e0e0; }
#filterPane h3 { margin: 0 0 10px; font-size: 15px; color: var(--ink); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#presetWrap { font-size: 12px; font-weight: 600; color: var(--slate); display: flex; align-items: center; gap: 6px; }
#f_preset { height: 30px; border: 1px solid var(--gold); border-radius: 5px; font-size: 12.5px; font-weight: 600; background: var(--hover); padding: 0 6px; }
.fgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px 16px; }
.fgrid label { display: flex; flex-direction: column; font-size: 11.5px; color: var(--slate); font-weight: 600; gap: 2px; }
.fgrid input, .fgrid select { height: 28px; border: 1px solid var(--input-line); border-radius: 4px; padding: 0 7px; font-size: 13px; background: var(--input-bg); color: var(--ink); }
.fgrid .rng { display: flex; gap: 6px; }
.fgrid .rng input { width: 50%; }
.fchecks { display: flex; flex-wrap: wrap; gap: 4px 22px; margin: 10px 0 4px; }
.fchecks label { font-size: 12.5px; color: var(--slate); display: flex; align-items: center; gap: 5px; }
.fspatial { border-top: 1px dashed var(--line); padding-top: 7px; align-items: center; }
.fspatial-lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--gold); }
.fspatial.disabled .spatial-row { opacity: .4; }
.fspatial.disabled .ftinput, .fspatial.disabled input[type="checkbox"] { cursor: not-allowed; }
.fspatial-hint { font-size: 11px; font-style: italic; color: var(--gold); }
.spatial-row { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--slate); }
.ftbox { display: flex; align-items: center; gap: 4px; color: var(--slate); font-size: 11.5px; opacity: .85; }
.ftinput { width: 52px; padding: 2px 4px; font-size: 11.5px; border: 1px solid var(--input-line); border-radius: 4px; background: var(--input-bg, var(--card)); color: var(--ink); }
.factions { display: flex; align-items: end; gap: 14px; margin-top: 8px; }
.factions label { display: flex; flex-direction: column; font-size: 11.5px; color: var(--slate); font-weight: 600; gap: 2px; }
.factions select { height: 30px; border: 1px solid #ccc; border-radius: 4px; }
#f_run { background: #f0b429; border: none; border-radius: 5px; height: 34px; padding: 0 26px; font-weight: 700; font-size: 14px; cursor: pointer; }
#f_run:hover { background: #1c2733; color: #f0b429; }
#f_csv, #f_save, #f_calllist { background: var(--input-bg); border: 1px solid var(--input-line); border-radius: 5px; height: 34px; padding: 0 14px; font-size: 13px; cursor: pointer; font-weight: 600; color: var(--ink); }
#f_csv:hover, #f_save:hover, #f_calllist:hover { background: var(--gold); border-color: var(--gold); }
#f_csv:disabled, #f_calllist:disabled { opacity: .5; cursor: default; }
#f_saved { height: 34px; border: 1px solid #cfd6dc; border-radius: 5px; font-size: 12.5px; max-width: 180px; }
#f_count { font-size: 13px; color: var(--ink); font-weight: 600; }
#f_msg { font-size: 12.5px; color: var(--muted, #5b6b78); margin-left: 8px; }
.rt-loading { padding: 22px; color: var(--slate); font-style: italic; }
.rt-empty { padding: 30px 22px; text-align: center; color: var(--ink); font-weight: 600; font-size: 14px; }
.rt-empty span { display: block; margin-top: 6px; color: var(--slate); font-weight: 400; font-size: 12.5px; }
#resultsPane { flex: 1; overflow: auto; padding: 0 6px 20px; }
#rtable { border-collapse: collapse; width: 100%; font-size: 12.5px; background: var(--card); }
#rtable th { position: sticky; top: 0; background: #1c2733; color: #fff; padding: 7px 8px; text-align: left; cursor: pointer; white-space: nowrap; user-select: none; }
#rtable td { padding: 5px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
#rtable tr:hover td { background: var(--hover); }
#rtable .cardlink { font-weight: 700; }






#lensBar {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 0 8px; margin-bottom: 8px; border-bottom: 1px solid var(--line);
}
#lensBar .lens-lab {
  flex: none; font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  font-weight: 800; color: var(--slate);
}
#lensSelect {
  flex: 1 1 auto; min-width: 0; height: 28px; padding: 0 6px; cursor: pointer;
  font: inherit; font-size: 12.5px; font-weight: 700;
  border: 1px solid var(--input-line); border-radius: 7px;
  background: var(--input-bg); color: var(--ink);
}
#lensSelect:focus { outline: none; border-color: var(--gold); }
#lensBar.lens-on #lensSelect { border-color: var(--gold); color: var(--ink); }
#lensBar.lens-flash { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 7px; }
.lens-group .ogtitle { color: var(--gold); }

.ogroup.demoted .ogtitle { opacity: .55; }
.ov-live { color: var(--slate); font-size: 10.5px; }
.ov-live-empty { color: var(--gold); }
.svc-prison { background: #8d6e63; }
.svc-military { background: #5d4037; }

label.cov-dead { opacity: .5; }
label.cov-dead .cov-note { font-size: 11px; color: var(--slate); font-style: italic; }



#filterPane { border-bottom: 1px solid var(--line); padding: 16px 18px; }
#filterPane h3 { font-size: 16px; font-weight: 800; letter-spacing: .2px; }
#presetWrap { color: var(--slate); }
#f_preset, #f_saved, .factions select, .fgrid input, .fgrid select, .ftinput
  { border: 1px solid var(--input-line); border-radius: 7px; background: var(--input-bg); color: var(--ink); }
#f_preset { border-color: var(--input-line); font-weight: 600; }
.fgrid input, .fgrid select { height: 30px; }
.fgrid input:focus, .fgrid select:focus, .ftinput:focus { outline: 2px solid var(--gold); outline-offset: 0; border-color: var(--gold); }
.fgrid label, .fchecks label, .factions label, .spatial-row { color: var(--ink); font-weight: 600; }


#filterPane input[type="checkbox"], #resMapBar input[type="checkbox"] { accent-color: var(--gold); }
.fchecks { gap: 6px 20px; margin: 12px 0 4px; padding-top: 10px; border-top: 1px solid var(--line); }
.fspatial { border-top: 1px solid var(--line); }
.fspatial-lbl { color: var(--slate); }
.fspatial-hint, .cov-note { color: var(--warn); font-style: normal; }




.fsecs { display: flex; flex-direction: column; gap: 6px; margin: 6px 0 2px; min-width: 0; }
.fsec { border: 1px solid var(--line); border-radius: 8px; background: var(--paper); min-width: 0; }
.fsec > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 9px;
  padding: 9px 12px; font-size: 13px; font-weight: 700; color: var(--ink); user-select: none; }
.fsec > summary::-webkit-details-marker { display: none; }
.fsec > summary::before { content: ""; flex: none; width: 6px; height: 6px; margin: -2px 1px 0 2px;
  border-right: 2px solid var(--slate); border-bottom: 2px solid var(--slate);
  transform: rotate(-45deg); transition: transform .15s ease; }
.fsec[open] > summary::before { transform: rotate(45deg); margin-top: -4px; }
.fsec > summary:hover { background: var(--hover); border-radius: 7px; }
.fsec > summary:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; border-radius: 7px; }
.fsec-title { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.fsec-badge { flex: none; margin-right: auto; min-width: 20px; padding: 1px 7px; border-radius: 10px;
  background: var(--gold); color: #1c2733; font-size: 11px; font-weight: 800; text-align: center; }
.fsec-body { padding: 2px 12px 12px; min-width: 0; }

.fsec-body > .fchecks:first-child, .fsec-body > .fspatial:first-child {
  border-top: 0; padding-top: 2px; margin-top: 2px; }
.fchips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0 2px; }
.fchips[hidden] { display: none; }
.fchip { display: inline-flex; align-items: center; max-width: 100%; padding: 3px 3px 3px 11px;
  border-radius: 13px; background: var(--gold); color: #1c2733; font-size: 12px; font-weight: 600; }
.fchip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fchip > button { border: 0; background: none; color: #1c2733; font: inherit; font-size: 15px;
  line-height: 1; padding: 0 6px; margin-left: 2px; cursor: pointer; border-radius: 50%; }
.fchip > button:hover { background: rgba(16, 32, 46, .18); }
#fchipsClear { border: 1px solid var(--input-line); background: var(--card); color: var(--slate);
  border-radius: 13px; padding: 3px 12px; font-size: 12px; font-weight: 600; cursor: pointer; }
#fchipsClear:hover { color: var(--crit); border-color: var(--crit); }



.fchip-off { background: transparent; color: var(--warn); border: 1px dashed var(--warn);
  padding: 2px 2px 2px 10px; cursor: help; }
.fchip-off::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%;
  background: var(--warn); opacity: .8; margin-right: 6px; }
.fchip-off > button { color: var(--warn); }
.fchip-off > button:hover { background: rgba(217, 128, 20, .18); }
.fchip-note { flex-basis: 100%; min-width: 0; font-size: 12px; line-height: 1.45; color: var(--slate);
  margin-top: 2px; }

#f_run { border-radius: 7px; height: 36px; padding: 0 28px; }
#f_csv, #f_save, #f_calllist, #f_savebox, #f_clearall, #f_loadmore, #f_cols {
  height: 34px; padding: 0 15px; border: 1px solid var(--input-line); border-radius: 7px;
  background: var(--card); color: var(--ink); font-weight: 600; font-size: 13px; cursor: pointer; }
#f_csv:hover, #f_save:hover, #f_calllist:hover, #f_savebox:hover, #f_clearall:hover, #f_loadmore:hover, #f_cols:hover {
  background: var(--gold); border-color: var(--gold); color: #1c2733; }
#f_clearall { border-color: var(--crit); color: var(--crit); }
#f_clearall:hover { background: var(--crit); border-color: var(--crit); color: #fff; }
.factions { gap: 12px; align-items: end; padding-top: 4px; }
#rtable tr:hover td { background: var(--hover); }


.jb-combo { position: fixed; z-index: 10050; overflow-y: auto; background: var(--card); color: var(--ink); border: 1px solid var(--input-line); border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.18); font-size: 13px; padding: 4px 0; }
.jb-combo-row { padding: 6px 10px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jb-combo-row b { color: var(--gold-deep); font-weight: 700; }
.jb-combo-row:hover, .jb-combo-row.active { background: var(--hover); }
.jb-combo-sub { padding-left: 26px; }
.jb-combo-base { color: var(--slate); }
.jb-combo-empty, .jb-combo-more { padding: 7px 10px; color: var(--slate); font-size: 12px; }
.jb-combo-more { border-top: 1px solid var(--line); }













#menuBtn {
  display: none; align-items: center; justify-content: center; height: 40px; min-width: 44px;
  border: 1px solid var(--bar-ctl-line); border-radius: 6px; background: var(--bar-ctl); color: #fff;
  cursor: pointer; padding: 0 10px;
}





#menuBtn[aria-expanded="true"] { background: var(--bar-ctl); color: var(--gold); border-color: var(--gold); }


#ovHead {
  position: sticky; top: 0; z-index: 3; display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin: -10px -14px 8px; padding: 9px 14px; background: var(--card);
  border-bottom: 1px solid var(--line); font-size: 13px; font-weight: 800; color: var(--ink);
}
#ovClose {
  border: 1px solid var(--input-line); background: var(--input-bg); color: var(--ink); cursor: pointer;
  border-radius: 6px; min-width: 32px; height: 32px; font-size: 17px; line-height: 1;
}
#ovClose:hover { border-color: var(--gold); background: var(--hover); }


@media (max-width: 900px) {
  #menuBtn { display: inline-flex; order: 2; }
  #brand { order: 1; }
  #searchbox { order: 3; }
  





  #myDataBtn, #themeToggle, #topbar .jb-chip { display: none; }
  #viewToggle { order: 5; }
  



  #overlayBtn { order: 3; height: 40px; padding: 0 9px; gap: 5px; }
  #searchbox { order: 4; }
  body.nav-open #overlayBtn { order: 6; flex: 1 1 calc(50% - 52px); height: 42px; width: auto; }
  body.nav-open #myDataBtn { display: block; order: 7; flex: 1 1 calc(50% - 52px); height: 42px; }
  body.nav-open #themeToggle { display: block; order: 8; width: 46px; height: 42px; }
  body.nav-open #topbar .jb-chip {
    display: flex; order: 9; flex: 1 1 100%; max-width: none; margin-left: 0; justify-content: center;
  }
  




  

  body.nav-open #viewToggle { display: flex; order: 5; flex: 1 1 100%; }
  body.nav-open #overlayBtn { order: 7; }
  body.nav-open #myDataBtn { order: 8; }
  body.nav-open #themeToggle { order: 9; }
  body.nav-open #topbar .jb-chip { order: 10; }
  body.nav-open #viewToggle button { flex: 1 1 0; height: 42px; }
  #viewToggle button:first-child { border-radius: 6px 0 0 6px; }
  #viewToggle button:last-child { border-radius: 0 6px 6px 0; }
}



@media (max-width: 560px) {
  


  body:not(.nav-open) #overlayBtn { padding: 0 8px; }
}


@media (min-width: 761px) and (max-width: 1024px) {
  
  #searchbox { flex: 1 1 300px; max-width: 460px; }
  #searchbox select, #searchbox input, #searchbox button { height: 40px; }
  #panel { width: 380px; max-width: 52%; }
  #overlayPanel { top: calc(var(--topbar-top) + 8px); right: 12px; width: 300px; max-height: 68vh; }
  


  body:has(#panel:not(.hidden)) #profilePanel { right: 0; }
  #profilePanel { top: 0; width: 400px; }
  



  #mapTools button { width: 58px; height: 44px; }
  .leaflet-touch .leaflet-bar a, .leaflet-control-zoom a { width: 40px; height: 40px; line-height: 40px; font-size: 20px; }
  .fgrid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
  .fgrid input, .fgrid select { height: 36px; }
  .ogroup label, .fchecks label { min-height: 40px; }
  #lensSelect { height: 38px; font-size: 13px; }   
  #f_run { height: 42px; }
  #f_csv, #f_save, #f_calllist, #f_savebox, #f_clearall, #f_loadmore, #f_cols, #f_saved { height: 40px; }
  .factions { flex-wrap: wrap; }
}


@media (max-width: 760px) {

  
  #topbar { min-height: 0; padding: 6px 10px; gap: 6px 8px; flex-wrap: wrap; }
  #brand { font-size: 17px; flex: 1 1 auto; }
  #searchbox { flex: 1 1 100%; width: 100%; max-width: none; flex-wrap: wrap; gap: 6px; }
  

  #searchInput { flex: 1 1 100%; order: 1; height: 42px; font-size: 16px; }
  #searchMode { order: 2; } #stateFilter { order: 3; } #countyFilter { order: 4; } #searchBtn { order: 5; }
  #searchbox select { flex: 1 1 0; min-width: 0; height: 42px; font-size: 13px; }
  #searchBtn { flex: 0 0 84px; height: 42px; font-size: 14px; }
  #autocomplete { left: 0; right: 0; top: 48px; max-width: none; max-height: 56vh; }

  
  #map { min-height: 0; }
  #mapTools { top: 50%; bottom: auto; left: auto; right: 8px; transform: translateY(-50%); gap: 6px; }
  



  #mapTools button { width: 58px; height: 48px; font-size: 18px; }
  .leaflet-touch .leaflet-bar a, .leaflet-control-zoom a { width: 44px; height: 44px; line-height: 44px; font-size: 22px; }
  .leaflet-control-attribution { font-size: 9px; max-width: 62vw; }
  #zoomBadge { top: auto; bottom: 26px; left: 8px; }
  #mapLegend { bottom: 26px; right: 8px; max-width: 48%; font-size: 11px; padding: 7px 9px; }
  
  body:has(#compareTray:not(.hidden)) #zoomBadge,
  body:has(#compareTray:not(.hidden)) #mapLegend { bottom: 74px; }
  

  #measureReadout, #poiPanel {
    top: auto !important; bottom: 74px !important; left: 8px !important; right: 60px !important;
    width: auto !important; max-width: none; max-height: 40vh !important; overflow-y: auto;
  }
  #poiPanel label { min-height: 40px; }
  .poi-modes button, #poiShapeActions button { min-height: 40px; }
  #shapeSelectBtn { min-height: 40px; width: 100%; }
  
  #salesFilter, #asmPanel, #crimeFilter, #schoolFilter, .ov-buf-panel, .ov-tf-panel {
    left: 8px; right: 60px; width: auto; bottom: 74px; max-height: 42vh; overflow-y: auto;
  }
  #salesFilter input, #salesFilter select, #crimeFilter select, #crimeFilter input { height: 34px; width: 120px; }
  #salesFilter label, #crimeFilter label, #schoolFilter label, .ov-buf-panel label, .ov-tf-panel label { min-height: 38px; }

  
  #acHead { padding: 10px 12px; }
  #acClose { min-width: 40px; min-height: 40px; font-size: 22px; }
  .result-item { padding: 11px 12px; min-height: 44px; }

  


  #panel {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 2400;
    width: 100%; max-width: 100%; height: 78vh; max-height: 78vh; overflow-y: auto;
    border-left: none; border-top: 2px solid var(--gold); border-radius: 14px 14px 0 0;
    box-shadow: 0 -6px 22px rgba(0, 0, 0, .35); animation: sheetUp .2s ease-out;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  @keyframes sheetUp { from { transform: translateY(40px); opacity: .6; } to { transform: none; opacity: 1; } }
  #panelBar { padding: 14px 10px 8px; gap: 8px; flex-wrap: wrap; }
  
  #panelBar::before {
    content: ""; position: absolute; top: 5px; left: 50%; transform: translateX(-50%);
    width: 42px; height: 4px; border-radius: 3px; background: var(--line);
  }
  #panelBar button#fullCardBtn { min-height: 44px; padding: 11px 14px; font-size: 13.5px; }
  #panelBar button#compareAddBtn { min-height: 44px; }
  #panelBar button#panelClose { min-width: 60px; min-height: 44px; font-size: 14px; font-weight: 700; }
  #panelBody { padding: 0 14px 40px; }

  

  #overlayPanel {
    top: auto !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
    width: auto !important; max-width: none; max-height: 78vh; z-index: 2600;
    border-radius: 14px 14px 0 0; padding: 0 14px calc(14px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -6px 22px rgba(0, 0, 0, .4);
  }
  #ovHead { margin: 0 -14px 6px; padding: 13px 14px; font-size: 14px; }
  #ovClose { min-width: 44px; height: 44px; font-size: 20px; }
  .ogroup label { min-height: 42px; padding: 8px 2px; font-size: 13.5px; }
  .ogroup label input[type="checkbox"] { width: 19px; height: 19px; flex: none; }
  #lensSelect { height: 40px; font-size: 16px; }   
  #savedViews .sv-load { min-height: 40px; }
  #svSave input, #svSave button { min-height: 40px; }

  
  #profilePanel {
    top: 0 !important; right: 0 !important; left: 0 !important; bottom: 0 !important;
    width: 100% !important; max-width: 100% !important; z-index: 2700;
  }
  #profileBar { flex-wrap: wrap; gap: 4px; padding: 8px 10px; }
  #profileBar::before { content: "My Data"; font-weight: 800; font-size: 15px; color: var(--ink); }
  #profileClose { min-width: 44px; min-height: 44px; font-size: 26px; margin-left: auto; }
  #profileTabs { flex: 1 1 100%; overflow-x: auto; gap: 2px; }
  #profileTabs button { min-height: 40px; white-space: nowrap; padding: 7px 10px; }
  #profileBody { padding: 10px 12px calc(30px + env(safe-area-inset-bottom, 0px)); }
  .pf-chip { min-height: 36px; }
  .pf-item { padding: 11px; }
  .pf-actions button, #bb_save, #bb_cancel { min-height: 40px; }
  .pf-folder-head { min-height: 42px; }
  .bb-grid { grid-template-columns: 1fr 1fr; }
  .bb-grid input, #bb_name, #bb_folder { height: 40px; font-size: 16px; }

  
  #searchView { min-width: 0; }
  


  #filterPane { padding: 12px; }
  #filterPane h3 { flex-direction: column; align-items: stretch; gap: 8px; }
  #presetWrap { flex-wrap: wrap; gap: 6px; }
  #f_preset { flex: 1 1 100%; height: 42px; font-size: 13px; }
  .fgrid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
  .fgrid input, .fgrid select { height: 40px; font-size: 16px; }
  .fgrid .rng { gap: 6px; }
  #moreFilters { padding: 4px 10px 10px; }
  #moreFilters > summary { min-height: 44px; display: flex; align-items: center; }
  .fchecks { gap: 2px 12px; }
  .fchecks label { flex: 1 1 100%; min-height: 42px; font-size: 13px; }
  .fchecks input[type="checkbox"] { width: 19px; height: 19px; flex: none; }
  .fspatial { align-items: stretch; }
  .spatial-row { flex: 1 1 100%; flex-wrap: wrap; min-height: 42px; }
  .ftinput { height: 34px; width: 72px; font-size: 13px; }
  .factions { flex-wrap: wrap; gap: 8px; }
  .factions label { flex: 1 1 calc(50% - 4px); }
  .factions select { height: 42px; width: 100%; }
  #f_run { flex: 1 1 100%; height: 48px; }
  #f_csv, #f_save, #f_calllist, #f_savebox, #f_clearall, #f_loadmore, #f_cols {
    height: 44px; flex: 1 1 calc(50% - 4px); padding: 0 10px;
  }
  #f_saved { flex: 1 1 100%; height: 44px; max-width: none; }
  #f_count, #f_msg { flex: 1 1 100%; margin-left: 0; }
  #resultsPane { padding: 0 0 20px; -webkit-overflow-scrolling: touch; }
  #rtable { font-size: 12px; }
  #rtable th { padding: 9px 8px; }
  #rtable td { padding: 9px 8px; max-width: 150px; }

  
  #compareTray {
    flex-wrap: wrap; gap: 8px; z-index: 2300;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
  }
  #compareChips { flex: 1 1 100%; order: 3; }
  #compareOpen { min-height: 42px; }
  #compareClear { min-height: 42px; padding: 0 10px; }
  .cchip { min-height: 34px; }
  #compareModal, #portfolioModal, #shapeModal, #kbHelp { padding: 8px; }
  #compareInner, #portfolioInner, #shapeInner { max-height: 92vh; }
  #compareHead, #portfolioHead, #shapeHead { padding: 10px 12px; flex-wrap: wrap; gap: 6px; }
  #compareHead button, #portfolioHead button, #shapeHead button { min-height: 42px; padding: 0 10px; }
  #compareBody, #shapeBody { padding: 0 12px 20px; overflow-x: auto; }
  table.cmp th { top: 56px; }
  table.cmp .cmp-k { width: 110px; }

  
  #status { bottom: 78px; max-width: 92%; text-align: center; }
  
  #tnGateBanner { bottom: 78px !important; font-size: 12px; max-width: 94% !important; }
  .jb-combo { max-width: calc(100vw - 16px); }
  
  html, body { overflow-x: hidden; }
}


@media (max-width: 400px) {
  #brand { font-size: 15px; letter-spacing: 1px; }
  #searchBtn { flex: 0 0 72px; }
  .fgrid { grid-template-columns: 1fr; }
  .bb-grid { grid-template-columns: 1fr; }
  #mapLegend { max-width: 56%; }
}







@media (max-width: 900px) {
  



  #topbar { flex: 0 0 auto; }

  
  #topbar .jb-chip { min-width: 0; overflow: hidden; }

  




  #topbar .jb-chip:not(:has(.tier)) {
    display: flex; order: 2; flex: 0 0 auto; margin-left: auto; max-width: none;
    background: none; box-shadow: none; padding: 0; gap: 6px; align-items: center;
  }
  #topbar .jb-chip:not(:has(.tier)) > span:first-child { display: none; }  
  #topbar .jb-chip:not(:has(.tier)) button {
    background: var(--gold); color: #1c2733; border-radius: 6px; padding: 0 12px;
    min-height: 40px; font-weight: 700; text-decoration: none; font-size: 13px; white-space: nowrap;
  }
  #topbar .jb-chip:not(:has(.tier)) button + button {   
    background: none; color: #cfe0f5; text-decoration: underline; padding: 0 4px; font-weight: 400;
  }
  
  #menuBtn { order: 3; }
  #searchbox { order: 4; }
  body.nav-open #topbar .jb-chip:not(:has(.tier)) {
    order: 2; flex: 0 0 auto; margin-left: auto; justify-content: flex-end;
  }
}




@media (max-width: 1024px) {
  #overlayPanel { display: flex; flex-direction: column; }
  #ovHead { order: -1; }
}

@media (min-width: 761px) and (max-width: 1024px) {
  

  #searchbox { flex: 1 1 100%; max-width: none; }
  #searchbox #searchInput { flex: 1 1 200px; min-width: 150px; font-size: 16px; }
  
  #map { min-width: 0; }
}

@media (max-width: 760px) {
  



  #searchbox #searchInput { height: 42px; font-size: 16px; }
  #searchbox #searchBtn { height: 42px; }

  

  #f_preset { min-width: 0; }

  


  #mapLegend { right: 60px; max-height: 34vh; overflow-y: auto; }
}







body:has(#searchView:not(.hidden)) #salesFilter,
body:has(#searchView:not(.hidden)) #asmPanel,
body:has(#searchView:not(.hidden)) #crimeFilter,
body:has(#searchView:not(.hidden)) #schoolFilter,
body:has(#searchView:not(.hidden)) .ov-buf-panel,
body:has(#searchView:not(.hidden)) .ov-tf-panel { display: none !important; }




@media (min-width: 761px) and (max-width: 1024px) {
  #overlayPanel { top: 116px; max-height: calc(100vh - 128px); }
}










@media (min-width: 761px) and (max-width: 1024px) {
  #searchbox select, #searchbox input, #searchbox button { height: 44px; }
  



  #mapTools button { width: 58px; height: 48px; }
  .leaflet-touch .leaflet-bar a, .leaflet-control-zoom a { width: 44px; height: 44px; line-height: 44px; }
  #ovClose { min-width: 44px; height: 44px; }
  .ogroup label, .fchecks label { min-height: 44px; }
  #lensSelect { height: 44px; }
  #savedViews .sv-load, #svSave input, #svSave button { min-height: 44px; }
  #profileTabs button, #profileClose { min-height: 44px; }
  .pf-actions button, #bb_save, #bb_cancel { min-height: 44px; }
  .pf-folder-head { min-height: 44px; }
  .fgrid input, .fgrid select { height: 44px; }
  #moreFilters > summary { min-height: 44px; display: flex; align-items: center; }
  .spatial-row { min-height: 44px; }
  .ftinput { height: 44px; }
  #f_run { height: 44px; }
  #f_csv, #f_save, #f_calllist, #f_savebox, #f_clearall, #f_loadmore, #f_cols, #f_saved { height: 44px; }
  #resultsHeader button { min-width: 44px; min-height: 44px; }
  #panelBar button { min-height: 44px; }
  #compareOpen, #compareClear { min-height: 44px; }
  #expPanel button, #expPanel select { min-height: 44px; }
  





  #f_preset { height: 44px; }
  .factions select, .factions input { height: 44px; }
  .fchecks input[type="checkbox"], .ogroup label input[type="checkbox"] { width: 19px; height: 19px; flex: none; }
  


  #main:has(#panel:not(.hidden)) ~ #overlayPanel,
  body:has(#panel:not(.hidden)) #overlayPanel { right: 396px; }
}


@media (max-width: 900px) {
  #menuBtn { height: 44px; }
  body.nav-open #overlayBtn, body.nav-open #myDataBtn, body.nav-open #themeToggle { height: 44px; }
  body.nav-open #baseToggle button, body.nav-open #viewToggle button { height: 44px; }
  #topbar .jb-chip:not(:has(.tier)) button { min-height: 44px; }
}












@media (max-width: 1024px) {
  


  #filterPane { transition: max-height .18s ease; }
  #searchView:has(#rtable th) #filterPane { max-height: 26vh; overflow-y: auto; }
  #searchView:has(#rtable th) #filterPane:has(input:focus, select:focus, textarea:focus, summary:focus) {
    max-height: 58vh;
  }
}










@media (max-width: 1024px) {
  .county-chip { min-height: 44px; padding: 2px 6px 2px 12px; margin: 3px 4px 3px 0; }
  .county-chip button { min-width: 44px; min-height: 44px; font-size: 17px; }
}




@media (max-width: 1024px) {
  .fsec > summary { min-height: 44px; padding: 11px 12px; }
  .fsec-body { padding: 2px 10px 12px; }
  .fchip { min-height: 32px; }
  .fchip > button { min-width: 30px; }
  #fchipsClear { min-height: 32px; }
}
@media (max-width: 760px) {
  .fsecs { gap: 8px; }
  .fchip { max-width: 100%; }
  .fchip > button { min-width: 34px; min-height: 34px; font-size: 17px; }
  #fchipsClear { min-height: 34px; }
  .fsec-body .fgrid, .fsec-body .fchecks, .fsec-body .spatial-row { min-width: 0; }
  .fsec-body select, .fsec-body input { max-width: 100%; }
}























#panelBody table.kv tr.kv-fullrow > td { width: auto; }
#panelBody table.kv tr.kv-fullrow .kv-fulllabel { display: block; color: var(--slate); margin-bottom: 4px; }

.kv-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

table.ringtbl th, table.ringtbl td + td { white-space: nowrap; }


table.utiltbl { border-collapse: collapse; width: 100%; font-size: 13px; }
table.utiltbl th { width: 78px; text-align: left; vertical-align: top; font-weight: 600;
  color: var(--slate); padding: 4px 8px 4px 0; }
table.utiltbl td { vertical-align: top; padding: 4px 0; overflow-wrap: anywhere; }
table.utiltbl tr + tr th, table.utiltbl tr + tr td { border-top: 1px solid var(--line, #e3e6ea); }
.util-pending { opacity: 0.75; }
@media (max-width: 520px) {
  table.utiltbl th { width: 62px; font-size: 12px; }
}
#panelBody img, #panelBody svg, #panelBody canvas, #panelBody iframe { max-width: 100%; }

@media (max-width: 760px) {
  #panelBody table.kv { table-layout: fixed; width: 100%; }
  #panelBody table.kv td { overflow-wrap: anywhere; }
  

  #panelBody table.kv td:first-child { width: 40%; }
  
  #panelBody h1, #panelBody .sub, #panelBody .links a, #panelBody td a { overflow-wrap: anywhere; }
  
  #buyerFit .bf-row, #buyerFit .bf-why, #userBuyBox, .an-list, #clientActions { min-width: 0; }
  #buyerFit .bf-why, .an-list a, .ubb-pill { overflow-wrap: anywhere; min-width: 0; }
  .an-list, #noteStatus, #clientActions { flex-wrap: wrap; }
  
  #portfolioBody, #portfolioInner, #compareInner, #shapeInner { max-width: 100%; }
  #pfTotals, .pf-note { overflow-wrap: anywhere; }
}











#ovOptDock {
  position: fixed; left: 56px; bottom: 26px; z-index: 1500;
  display: flex; flex-direction: column-reverse; align-items: flex-start; gap: 8px;
  width: max-content; max-width: calc(100vw - 120px); max-height: calc(100vh - 180px);
  pointer-events: none;
}
#ovOptDock > * { pointer-events: auto; }
#ovOptDock > #salesFilter, #ovOptDock > #asmPanel,
#ovOptDock > #crimeFilter, #ovOptDock > #schoolFilter, #ovOptDock > .ov-buf-panel, #ovOptDock > .ov-tf-panel {
  position: static; top: auto; right: auto; bottom: auto; left: auto;
  width: 214px; max-width: 100%; flex: 0 0 auto;
}




@media (max-width: 760px) {
  #ovOptDock {
    left: 8px; bottom: 74px; flex-direction: row; align-items: flex-end;
    max-width: calc(100vw - 68px); max-height: 44vh;
    overflow-x: auto; overflow-y: hidden; pointer-events: auto;
  }
  #ovOptDock > #salesFilter, #ovOptDock > #asmPanel,
  #ovOptDock > #crimeFilter, #ovOptDock > #schoolFilter, #ovOptDock > .ov-buf-panel, #ovOptDock > .ov-tf-panel {
    width: 214px; max-height: 42vh; overflow-y: auto;
  }
}
@media print { #ovOptDock, #ovTab, #ovRail { display: none !important; } #main { margin-right: 0 !important; } }













:root { --ovw: 320px; --ovrail: 0px; }


#ovTab, #ovRail { display: none; }

@media (min-width: 1025px) {
  



  #ovClose { display: none; }

  

  #main { margin-right: var(--ovrail); }

  #ovRail {
    display: none; 
    flex-direction: column; align-items: center; gap: 6px;
    position: fixed; top: var(--topbar-top); right: 0; bottom: 0; width: var(--ovrail); z-index: 3000;
    padding: 8px 0 12px; overflow-y: auto; overscroll-behavior: contain;
    background: var(--card); border-left: 1px solid var(--line);
  }
  #ovRail::-webkit-scrollbar { width: 0; }
  


  #ovRailToggle {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    width: 36px; min-height: 46px; padding: 8px 0; flex: none; cursor: pointer;
    border: 1px solid var(--gold); border-radius: 9px;
    background: var(--gold); color: #1c2733;
    box-shadow: 0 1px 7px rgba(0, 0, 0, .22);
  }
  #ovRailToggle:hover { background: #ffd873; }
  .ovrail-ico { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.7;
    stroke-linejoin: round; stroke-linecap: round; }
  #ovRailToggle .ovtab-chev { margin: 3px 0 0 0 !important; width: 7px; height: 7px; }
  #ovRailCount {
    flex: none; min-width: 24px; height: 20px; border-radius: 10px; padding: 0 5px;
    display: flex; align-items: center; justify-content: center;
    background: var(--ink); color: var(--card); font-size: 11px; font-weight: 800;
  }
  #ovRailCount.zero { background: var(--hover); color: var(--slate); }
  


  #ovRailGroups { display: flex; flex-direction: column; align-items: center; gap: 5px; width: 100%; }
  .ovrail-g {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0;
    width: 36px; min-height: 34px; flex: none; padding: 4px 1px; cursor: pointer;
    border: 1px solid var(--line); border-radius: 8px;
    background: var(--input-bg); color: var(--slate);
  }
  .ovrail-code { font-size: 10px; font-weight: 800; letter-spacing: .3px; line-height: 1.1; }
  .ovrail-cap { font-size: 7.5px; font-weight: 700; line-height: 1.15; letter-spacing: .1px;
    max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ovrail-g:hover { border-color: var(--gold); color: var(--ink); background: var(--hover); }
  .ovrail-g.on { background: var(--gold); color: #1c2733; border-color: var(--gold); }
  #ovRailToggle:focus-visible, .ovrail-g:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }

  #overlayPanel {
    top: var(--topbar-top); right: var(--ovrail); width: var(--ovw);
    max-height: calc(100vh - var(--topbar-top) - 46px);
    transition: right .18s ease;
  }
  


  #main:has(#panel:not(.hidden)) ~ #overlayPanel,
  body:has(#panel:not(.hidden)) #overlayPanel { right: calc(460px + var(--ovrail) + 12px); }
  
  body.ov-collapsed #overlayPanel { right: calc(-1 * var(--ovw)) !important; }

  


  #ovTab {
    display: flex; align-items: center; justify-content: center;
    position: fixed; top: calc(var(--topbar-top) + 14px); right: calc(var(--ovw) + var(--ovrail)); z-index: 3001;
    width: 26px; height: 76px; padding: 0; cursor: pointer;
    border: 1px solid var(--line); border-right: none; border-radius: 8px 0 0 8px;
    background: var(--card); color: var(--ink);
    box-shadow: -3px 2px 10px rgba(0, 0, 0, .22);
    transition: right .18s ease, background .12s ease;
  }
  #main:has(#panel:not(.hidden)) ~ #ovTab,
  body:has(#panel:not(.hidden)) #ovTab { right: calc(var(--ovw) + 460px + var(--ovrail) + 12px); }
  body.ov-collapsed #ovTab { display: none; }
  #ovTab:hover { background: var(--gold); color: #1c2733; }
  #ovTab:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
  .ovtab-chev {
    width: 8px; height: 8px; margin-left: 4px;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
  }
  
  #ovRailToggle .ovtab-chev { transform: rotate(135deg); }
  body:not(.ov-collapsed) #ovRailToggle .ovtab-chev { transform: rotate(-45deg); }

  


  body:not(.ov-collapsed) #mapLegend { right: 332px; }

  


  body:has(#searchView:not(.hidden)) #overlayPanel,
  body:has(#searchView:not(.hidden)) #ovTab,
  body:has(#searchView:not(.hidden)) #ovRail { display: none !important; }
  body:has(#searchView:not(.hidden)) #main { margin-right: 0; }

  



  #overlayPanel { display: flex; flex-direction: column; }
  #ovHead { order: -1; }
}










#overlayPanel > * { flex: 0 0 auto; }
#ovSearch { order: 1; display: flex; align-items: center; gap: 6px; margin: 0 0 8px; }
#ovSearchInput {
  flex: 1; min-width: 0; height: 30px; padding: 0 9px; font-size: 13px;
  border: 1px solid var(--input-line); border-radius: 7px;
  background: var(--input-bg); color: var(--ink);
}
#ovSearchInput:focus { outline: none; border-color: var(--gold); }
#ovSearchClear {
  flex: none; width: 28px; height: 28px; padding: 0; cursor: pointer; font-size: 16px; line-height: 1;
  border: 1px solid var(--input-line); border-radius: 7px; background: var(--input-bg); color: var(--ink);
}
#ovSearchClear:hover { border-color: var(--gold); background: var(--hover); }
#ovSearchClear[hidden] { display: none; }






#ovTabs { order: 2; display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 7px; }
.ovtab {
  display: inline-flex; align-items: center; gap: 4px; cursor: pointer;
  padding: 4px 8px; font-size: 11px; font-weight: 700; line-height: 1.15;
  border: 1px solid var(--line); border-radius: 999px;
  background: var(--input-bg); color: var(--slate);
}
.ovtab:hover { border-color: var(--gold); color: var(--ink); background: var(--hover); }
.ovtab.on { background: var(--gold); border-color: var(--gold); color: #1c2733; }
.ovtab.empty { opacity: .5; }
.ovtab:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
.ovtab-count {
  min-width: 14px; height: 14px; padding: 0 3px; border-radius: 7px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 10.5px; font-weight: 800; background: var(--gold); color: #1c2733;
}
.ovtab.on .ovtab-count { background: #1c2733; color: var(--gold); }
.ovtab-count[hidden] { display: none; }

#lensBar { order: 3; }
#lensGroup { order: 4; }
.ovtabpane { order: 5; display: none; }
.ovtabpane.on { display: block; }
.ovsearch-empty { order: 6; font-size: 12.5px; color: var(--slate); padding: 8px 2px; }
.ovsearch-empty[hidden] { display: none; }
#savedViews { order: 7; }
.oattr { order: 8; }


.ovpane-name {
  display: none; font-size: 11px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase;
  color: var(--gold); margin: 10px 0 2px;
}
.ovpane-empty { display: none; font-size: 12px; color: var(--slate); padding: 6px 0; }
.ovtabpane.ov-empty .ovpane-empty { display: block; }




#overlayPanel.ov-searching .ovtabpane { display: block; }
#overlayPanel.ov-searching .ovpane-name { display: block; }
#overlayPanel.ov-searching .ovpane-empty { display: none; }
#overlayPanel.ov-searching #lensBar,
#overlayPanel.ov-searching #savedViews { display: none; }
.ov-nomatch { display: none !important; }



.ov-optslot { margin: 0 0 8px 24px; }
.ov-optslot:empty { display: none; }
.ov-optslot > #salesFilter, .ov-optslot > #asmPanel,
.ov-optslot > #crimeFilter, .ov-optslot > #schoolFilter, .ov-optslot > .ov-buf-panel, .ov-optslot > .ov-tf-panel {
  position: static; inset: auto; z-index: auto; width: auto; max-width: 100%;
  border: 1px solid var(--line); border-radius: 7px; background: var(--hover);
  box-shadow: none; padding: 8px 10px;
}
.ov-optslot #salesFilter input, .ov-optslot #salesFilter select,
.ov-optslot #crimeFilter select, .ov-optslot #crimeFilter input,
.ov-optslot .ov-buf-panel input[type="number"], .ov-optslot .ov-buf-panel select { width: 104px; }
.ov-optslot .ov-tf-panel select { width: 130px; }


@media (max-width: 1024px) {
  #ovTabs {
    flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    margin: 0 -14px 8px; padding: 0 14px 4px;
  }
  #ovTabs::-webkit-scrollbar { height: 0; }
  .ovtab { flex: 0 0 auto; white-space: nowrap; min-height: 36px; padding: 7px 12px; font-size: 12.5px; }
  #ovSearchInput { height: 40px; font-size: 16px; }   
  #ovSearchClear { width: 40px; height: 40px; }
  .ov-optslot { margin-left: 0; }
}
@media (max-width: 760px) {
  .ovtab { min-height: 40px; }
}
@media print { #ovTabs, #ovSearch { display: none !important; } }

















@media (min-width: 1025px) and (max-width: 1499px) {
  #topbar { gap: 6px 9px; padding: 6px 12px; }
  #baseToggle button { padding: 0 9px; font-size: 12.5px; }
  #viewToggle button { padding: 0 10px; font-size: 12.5px; }
  #myDataBtn { padding: 0 10px; font-size: 12.5px; }
  #searchbox { flex: 1 1 240px; min-width: 210px; max-width: 560px; }
  #searchbox select { max-width: 132px; }
  #topbar .jb-chip.in-bar { max-width: 210px; gap: 6px; padding: 4px 9px; }
}
@media (min-width: 1025px) and (max-width: 1319px) {
  

  #topbar .jb-chip.in-bar > span:first-child { display: none; }
  #topbar .jb-chip.in-bar { max-width: 210px; }
  #baseToggle button, #viewToggle button, #myDataBtn { padding: 0 8px; }
}





#viewToggle button.active {
  background: rgba(240, 180, 41, .14); color: #fff; border-color: var(--bar-ctl-line);
  box-shadow: inset 0 -3px 0 var(--gold);
}
#viewToggle button:hover { color: #fff; }





#topbar .jb-chip.in-bar {
  border-radius: 6px; border: 1px solid var(--bar-ctl-line); background: rgba(255, 255, 255, .07);
  height: 32px; padding: 0 10px; font-size: 12.5px; align-items: center;
}
#topbar .jb-chip.in-bar .tier {
  border-radius: 4px; padding: 2px 7px; font-size: 10.5px; font-weight: 800; letter-spacing: .05em;
}
#topbar .jb-chip.in-bar button {
  color: #cfe0f5; text-decoration: none; border-bottom: 1px solid rgba(207, 224, 245, .45);
  padding: 0; line-height: 1.35; font-size: 12.5px;
}
#topbar .jb-chip.in-bar button:hover { color: var(--gold); border-bottom-color: var(--gold); }
#themeToggle, #myDataBtn, #baseToggle button, #viewToggle button, #menuBtn { border-radius: 6px; }
#baseToggle button:first-child, #viewToggle button:first-child { border-radius: 6px 0 0 6px; }
#baseToggle button:last-child, #viewToggle button:last-child { border-radius: 0 6px 6px 0; }
#baseToggle button:not(:first-child), #viewToggle button:not(:first-child) { border-left-width: 0; }
#baseToggle button.active + button, #viewToggle button.active + button { border-left-width: 1px; }







#mapLegend {
  background: var(--card); color: var(--ink); border: 1px solid var(--line);
  overscroll-behavior: contain;
}
#mapLegend::before {
  content: "Legend"; display: block; margin-bottom: 6px; padding-bottom: 5px;
  border-bottom: 1px solid var(--line);
  font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase;
  color: var(--slate);
}
#mapLegend .lg-title { color: var(--ink); }
#mapLegend .lg-row { color: var(--slate); }
#mapLegend .lg-dot { border-color: rgba(128, 140, 152, .55); }



@media (min-width: 1025px) {
  #mapLegend { max-height: min(42vh, 360px); overflow-y: auto; max-width: 210px; }
}


















.leaflet-container:not(.leaflet-drag-target) .leaflet-parcels-pane path.leaflet-interactive:hover {
  stroke: var(--gold); stroke-width: 2.2;
}


#noteBlock > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 600; color: var(--slate); min-height: 20px;
}
#noteBlock > summary::-webkit-details-marker { display: none; }
#noteBlock > summary:hover { color: var(--ink); }
#noteBlock[open] > summary { margin-bottom: 9px; padding-bottom: 7px; border-bottom: 1px solid var(--line); }
#noteBlock .ns-ico { color: var(--gold); font-size: 13px; flex: none; }
#noteBlock .ns-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }









#searchbox { min-width: 0; }
#searchInput { flex: 1 1 240px; min-width: 150px; }
#searchbox select { min-width: 0; flex: 0 1 auto; }
#searchMode { flex: 0 1 94px; }
#stateFilter { flex: 0 1 127px; }
#countyFilter { flex: 0 1 157px; }
@media (min-width: 1025px) and (max-width: 1499px) {
  







  #searchbox { flex: 1 1 470px; max-width: 620px; }
  #searchbox select { font-size: 12.5px; }
  #searchMode { flex: 0 1 88px; min-width: 62px; }
  #stateFilter { flex: 0 1 108px; min-width: 66px; }
  #countyFilter { flex: 0 1 120px; min-width: 68px; }
  #searchBtn { flex: 0 0 auto; padding: 0 10px; }
}
@media (min-width: 1025px) and (max-width: 1339px) {
  #searchbox { flex: 1 1 250px; }
}









@media (min-width: 1025px) and (max-width: 1199px) {
  :root { --topbar-h: 92px; }
  #searchbox { flex: 1 1 100%; max-width: none; order: 5; }
  #searchInput { min-width: 180px; }
  #topbar { row-gap: 6px; }
}




















.ovhead-tools { display: flex; align-items: center; gap: 8px; flex: none; }
#ovAllOff {
  height: 26px; padding: 0 9px; cursor: pointer; white-space: nowrap;
  font: inherit; font-size: 11.5px; font-weight: 700;
  border: 1px solid var(--input-line); border-radius: 6px;
  background: var(--input-bg); color: var(--ink);
}
#ovAllOff:hover:not(:disabled) { border-color: var(--gold); background: var(--hover); }
#ovAllOff:disabled { opacity: .45; cursor: default; }
#ovAllOff:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
@media (max-width: 1024px) { #ovAllOff { height: 34px; padding: 0 11px; font-size: 12.5px; } }


@media (min-width: 1025px) {
  


  .ovrail-lens { margin-top: 12px; position: relative; }
  .ovrail-lens::before {
    content: ""; position: absolute; top: -7px; left: 0; right: 0;
    border-top: 1px solid var(--line);
  }
}








@media (min-width: 761px) and (max-width: 1024px) {
  #overlayPanel { top: calc(var(--topbar-top) + 8px); max-height: calc(100vh - var(--topbar-top) - 20px); }
}






.leaflet-control-attribution {
  font-size: 10px;
  opacity: 0.5;
  background: rgba(255, 255, 255, 0.55);
  padding: 0 5px;
  transition: opacity 0.15s ease, background 0.15s ease;
}
.leaflet-control-attribution:hover { opacity: 1; background: rgba(255, 255, 255, 0.9); }
.leaflet-control-attribution a { color: #33405a; }















#mapLegend .lg-head { display: none; }
@media (max-width: 760px) {
  #mapLegend { padding: 0; }
  



  #mapLegend::before { display: none; }
  #mapLegend .lg-head {
    display: flex; align-items: center; gap: 7px; width: 100%; min-height: 40px;
    margin: 0; padding: 9px 11px; border: 0; background: none; text-align: left;
    font: inherit; font-weight: 700; font-size: 11.5px; color: var(--ink); cursor: pointer;
  }
  #mapLegend .lg-head-n {
    font-size: 10px; font-weight: 700; color: var(--slate);
    border: 1px solid var(--line); border-radius: 10px; padding: 1px 6px;
  }
  #mapLegend .lg-chev {
    margin-left: auto; width: 0; height: 0;
    border-left: 5px solid transparent; border-right: 5px solid transparent;
    border-bottom: 6px solid var(--slate); transition: transform .15s ease;
  }
  #mapLegend .lg-body { padding: 0 11px 9px; }
  #mapLegend.lg-collapsed .lg-body { display: none; }
  
  #mapLegend.lg-collapsed { max-height: none; overflow: visible; }
  #mapLegend.lg-collapsed .lg-chev { transform: rotate(180deg); }
}
@media (prefers-reduced-motion: reduce) {
  #mapLegend .lg-chev { transition: none; }
}
















.ov-perfnote { font-size: 11.5px; line-height: 1.35; color: var(--ink);
  background: rgba(217, 128, 20, .10); border: 1px solid var(--warn); border-radius: 6px;
  padding: 5px 9px; margin-bottom: 8px; }
.ov-perfnote[hidden] { display: none !important; }






















#overlayPanel .ovall-group > .ogtitle {
  display: flex; align-items: center; gap: 6px; cursor: pointer; user-select: none;
}
#overlayPanel .ovall-group > .ogtitle::after {
  content: ""; order: 2; margin-left: auto; width: 0; height: 0;
  border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-bottom: 5px solid currentColor; transition: transform .15s ease;
}
#overlayPanel .ovall-group.og-collapsed > .ogtitle::after { transform: rotate(180deg); }
#overlayPanel .ovall-group.og-collapsed > .ogtitle::before {
  content: attr(data-n); order: 1; margin-left: auto;
  font-size: 9.5px; font-weight: 700; letter-spacing: 0; color: var(--slate);
  border: 1px solid var(--line); border-radius: 9px; padding: 0 5px;
}

#overlayPanel .ovall-group.og-collapsed > .ogtitle::after { margin-left: 0; }
#overlayPanel .ovall-group > .ogtitle:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
#overlayPanel:not(.ov-searching) .ovall-group.og-collapsed > label[data-oid-label],
#overlayPanel:not(.ov-searching) .ovall-group.og-collapsed > .ov-optslot { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  #overlayPanel .ovall-group > .ogtitle::after { transition: none; }
}
















#savedViews .sv-ren { border: none; background: none; color: var(--slate); font-size: 13px;
  line-height: 1; padding: 2px 5px; cursor: pointer; border-radius: 4px; }
#savedViews .sv-ren:hover { color: var(--ink); background: var(--hover); }
#savedViews .sv-ren:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
#savedViews .sv-edit { flex: 1; min-width: 0; font-size: 13px; padding: 4px 7px;
  border: 1px solid var(--gold); border-radius: 4px; background: var(--input-bg); color: var(--ink); }
@media (max-width: 900px) {
  #savedViews .sv-edit { min-height: 40px; }
}
/* B1299: the keyboard and mouse shortcuts sheet means nothing on a touch-only phone, so its button goes. */
@media (hover: none) and (pointer: coarse) { #ctHelpBtn { display: none !important; } }
@media (pointer: coarse) {
  #savedViews .sv-ren { min-width: 34px; min-height: 34px; }
  #savedViews .sv-edit { min-height: 44px; }
}