/* The Schools map (rehaul-schools): Map / Compare / Plan, cards, pins, key, drawer. Values from
   briefs/rehaul-mockups/Schools.dc.html. Light only, as the mockup: every surface sets its own background. */
@font-face{font-family:"Gabarito";src:url("/fonts/gabarito-latin.woff2") format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/fonts/plexmono-500-latin.woff2") format("woff2");font-weight:500;font-display:swap}
:root{--sm-teal:#0E3B43;--sm-coral:#CF3F2E;--sm-coral2:#FF6B5B;--sm-mint:#D5F5E8;--sm-ink:#1F3A40;--sm-dim:#4B6469;
  --sm-line:#E3ECEA;--sm-line2:#DCE6E4;--sm-line3:#EEF3F2;--sm-wash:#F7FAF9;--sm-green:#2E8B74;--sm-grey:#E3ECEA}
html,body.sm-body{margin:0;background:#F7FAF9}
.sm-body{font:400 13px/1.4 "Gabarito",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--sm-ink);overflow-x:hidden}
.sm a{color:var(--sm-teal)}.sm a:hover{color:var(--sm-coral)}
.sm *,.sm *::before,.sm *::after{box-sizing:border-box}
.sm button{font-family:inherit}
.sm [hidden]{display:none!important}

/* the bar */
.sm-barwrap{padding:0 24px}
.sm-bar{max-width:1360px;margin:12px auto 0;padding:7px 10px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;background:#fff;border:1px solid var(--sm-line);border-radius:14px}
.sm-seg{display:inline-flex;background:#F2F6F5;border-radius:9px;padding:3px;gap:2px}
.sm-seg button{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px 0 4px;border:0;border-radius:7px;font:600 12.5px "Gabarito",sans-serif;cursor:pointer;background:transparent;color:var(--sm-teal)}
.sm-seg i{font-style:normal;width:20px;height:20px;border-radius:20px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;background:var(--sm-grey);color:var(--sm-teal)}
.sm-seg small{font-size:10.5px;font-weight:700;background:var(--sm-coral2);color:#fff;border-radius:999px;padding:0 6px}
.sm-seg button[aria-current="page"]{background:var(--sm-teal);color:#fff}
.sm-seg button[aria-current="page"] i{background:#fff;color:var(--sm-teal)}
.sm-where{position:relative;display:flex;align-items:center;gap:7px;height:32px;flex:0 1 280px;min-width:200px;border:1px solid var(--sm-line2);border-radius:10px;padding:0 12px;background:var(--sm-wash);margin:0}
.sm-where input{border:0;outline:none;background:transparent;font:600 13px "Gabarito",sans-serif;color:var(--sm-teal);width:100%;min-width:0}
.sm-where:focus-within{border-color:var(--sm-teal)}
.sm-help{height:30px;display:inline-flex;align-items:center;border:0;border-radius:999px;padding:0 12px;background:var(--sm-coral);color:#fff!important;font:600 12px "Gabarito",sans-serif;text-decoration:none}
.sm-filters{display:contents}
.sm-pills{display:inline-flex;flex-wrap:wrap;gap:2px}
.sm-pill{height:28px;padding:0 10px;border:1px solid transparent;border-radius:999px;background:transparent;font:600 12px "Gabarito",sans-serif;color:#33484D;cursor:pointer}
.sm-pill.on{background:var(--sm-teal);color:#fff}
.sm-pill:hover:not(.on){background:#F2F6F5}
.sm-sep{width:1px;height:24px;background:var(--sm-line)}
.sm-layerswrap{margin-left:auto;position:relative}
.sm-layers{height:30px;border:1px solid var(--sm-line2);border-radius:999px;padding:0 14px;background:#fff;font:600 13px "Gabarito",sans-serif;color:var(--sm-teal);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.sm-layermenu{position:absolute;right:0;top:36px;z-index:80;background:#fff;border:1px solid var(--sm-line2);border-radius:10px;box-shadow:0 12px 28px rgba(14,59,67,.16);padding:8px 10px;display:flex;flex-direction:column;gap:6px;white-space:nowrap;font-size:12.5px}
.sm-fbtn,.sm-lmt,.sm-phone-only{display:none}
.sm-fbtn{height:30px;border:1px solid var(--sm-line2);border-radius:999px;padding:0 12px;background:#fff;font:600 12px "Gabarito",sans-serif;color:var(--sm-teal)}
.sm-lmt{background:#F2F6F5;border-radius:9px;padding:3px;gap:2px}
.sm-lmt button{height:26px;border:0;border-radius:7px;padding:0 12px;font:600 12px "Gabarito",sans-serif;background:transparent;color:#33484D}
.sm-lmt button.on{background:var(--sm-teal);color:#fff}

/* the list and the map */
.sm-wrap{max-width:1360px;margin:12px auto 0;padding:0 24px 28px}
.sm-find{display:flex;border:1px solid var(--sm-line2);border-radius:14px;overflow:hidden;background:#fff;height:min(760px,calc(100vh - 140px));min-height:520px}
.sm-side{flex:0 0 340px;max-width:100%;display:flex;flex-direction:column;border-right:1px solid var(--sm-line);min-width:0;background:#fff}
.sm-shead{padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid var(--sm-line3);font-size:12.5px;color:var(--sm-dim)}
.sm-shead b{color:var(--sm-teal)}
.sm-sels{display:flex;gap:6px}
.sm-sel{height:30px;border:1px solid var(--sm-line2);border-radius:8px;font:600 12.5px "Gabarito",sans-serif;color:var(--sm-teal);background:#fff;padding:0 6px}
.sm-ask{margin:8px 8px 0;padding:8px 10px;border-radius:10px;background:#FFF4F1;border:1px solid #FFD9D1;font-size:12px;color:var(--sm-ink);display:flex;flex-direction:column;gap:6px}
.sm-ask form{display:flex;gap:6px}
.sm-ask input{flex:1;min-width:0;height:30px;border:1px solid var(--sm-line2);border-radius:8px;padding:0 8px;font:600 12.5px "Gabarito",sans-serif;color:var(--sm-teal)}
.sm-towns{padding:8px 12px;border-bottom:1px solid var(--sm-line3);display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:var(--sm-dim)}
.sm-town{font-size:12px;font-weight:600;border:1.5px solid var(--sm-line2);border-radius:999px;padding:2px 10px;color:var(--sm-teal);background:#fff;cursor:pointer}
.sm-town.f{border-color:var(--sm-coral2)}
.sm-rows{overflow-y:auto;flex:1;padding-top:8px}
.sm-empty{margin:8px 12px;display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--sm-dim)}
.sm-empty b{font-size:14px;color:var(--sm-teal)}
.sm-tip{margin:0 8px 6px;padding:5px 8px;border-radius:8px;background:#F2FBF7;font-size:11px;color:#0B6B4E;display:flex;gap:6px;align-items:center}
.sm-gate{margin:0 8px 6px;padding:5px 8px;border-radius:8px;background:#F2F6F5;font-size:11px;color:var(--sm-dim)}
.sm-gate a{font-weight:700}
.sm-mc{border:1px solid var(--sm-line);border-radius:10px;padding:7px 9px;margin:0 8px 6px;background:#fff;display:flex;flex-direction:column;gap:3px;cursor:pointer;outline:none}
.sm-mc:hover{border-color:#C7D6D3}
.sm-mc.on{border-color:var(--sm-teal);box-shadow:0 0 0 1px var(--sm-teal)}
.sm-mc.focus{background:#F7FBFA}
.sm-mc:focus-visible{box-shadow:0 0 0 2px var(--sm-coral)}
.sm-r1{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:8px;align-items:center}
.sm-mk{width:24px;height:24px;border-radius:24px;color:#fff;font:700 11px "Gabarito",sans-serif;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 1px 3px rgba(14,59,67,.25);flex-shrink:0}
.sm-mk.hollow{background:#fff!important;color:var(--sm-dim);border-color:#6F8A87}
.sm-name{font-size:13px;font-weight:700;color:var(--sm-teal);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sm-flag{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 7px;border:1px solid #CFDCD9;border-radius:8px;background:#fff;font:600 11px "Gabarito",sans-serif;color:var(--sm-teal);cursor:pointer;white-space:nowrap}
.sm-flag i{width:14px;height:14px;border:1.5px solid #9DB3B0;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:10px;color:#fff}
.sm-flag.on{background:var(--sm-teal);color:#fff;border-color:var(--sm-teal)}
.sm-flag.on i{background:var(--sm-coral2);border-color:var(--sm-coral2)}
.sm-r2{display:flex;flex-wrap:wrap;gap:5px;align-items:center;padding-left:32px}
.sm-r3{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;padding-left:32px;font-size:11.5px;color:var(--sm-dim)}
.sm-r3 b{color:var(--sm-teal);font-size:12.5px}
.sm-chip{font-size:11.5px;font-weight:600;border-radius:6px;padding:1px 6px;background:#fff;border:1px solid var(--sm-line2);color:var(--sm-teal);white-space:nowrap}
.sm-dot{display:inline-block;width:7px;height:7px;border-radius:7px;margin-right:4px;vertical-align:0}
.sm-lgb{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;border-radius:999px;padding:2px 8px;background:#F2F6F5;color:var(--sm-dim);white-space:nowrap}
.sm-lgb.gold{background:#FFF1C9;color:#7A5A12}.sm-lgb.blue{background:#E8F0FF;color:#23408E}
.sm-lgb.no{font-weight:600}
.sm-got{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font-size:11px}
.sm-got b{font-size:11px}
.sm-sq{display:inline-flex;gap:2px}
.sm-sq i{width:9px;height:9px;border-radius:2px;display:inline-block;background:var(--sm-grey)}
.sm-sq i.in{background:var(--sm-green)}
.sm-sq i.cant{background:#fff;box-shadow:inset 0 0 0 1px #9DB3B0}
.sm-sq i.locked{background:repeating-linear-gradient(45deg,#fff 0 2px,#DCE6E4 2px 3px);box-shadow:inset 0 0 0 1px #C7D6D3}
.sm-minibar{display:inline-block;width:46px;height:5px;border-radius:3px;background:var(--sm-line);position:relative;vertical-align:middle;margin-left:4px}
.sm-minibar i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--sm-teal)}
.sm-minibar em{position:absolute;top:-2px;width:2px;height:9px;background:var(--sm-coral)}
.sm-cbar{display:flex;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid var(--sm-line);background:#fff}
.sm-faces{display:flex}
.sm-faces span{width:26px;height:26px;border-radius:26px;border:2px solid #fff;margin-right:-8px;color:#fff;font:700 11px "Gabarito",sans-serif;display:flex;align-items:center;justify-content:center;background:var(--sm-teal)}
.sm-cwords{font-size:13px;font-weight:600;color:var(--sm-teal);margin-left:6px}
.sm-grow{flex-grow:1}
.sm-btn{height:30px;border-radius:8px;padding:0 12px;font:600 12px "Gabarito",sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;gap:6px;white-space:nowrap}
.sm-btnp{background:var(--sm-coral);color:#fff!important;border:0}
.sm-btng{background:#fff;color:var(--sm-teal)!important;border:1px solid #CFDCD9}
.sm-btn[disabled]{opacity:.45;cursor:default}

.sm-map{flex:1 1 560px;min-width:0;position:relative;background:#EEF3F1}
.sm-leaf{position:absolute;inset:0;background:#EEF3F1;z-index:0;isolation:isolate}
.sm-leaf .leaflet-tile-pane{filter:grayscale(.9) brightness(1.07) contrast(.88)}
.sm-leaf .leaflet-control-zoom{margin-top:14px;margin-right:14px}
.sm-pinwrap{background:none;border:0}
.sm-pin{transform:translate(-50%,-50%);position:absolute;left:0;top:0;border:3px solid #fff;border-radius:999px;cursor:pointer;padding:0;box-shadow:0 2px 6px rgba(14,59,67,.25);color:#fff;font:700 11px "Gabarito",sans-serif;display:flex;align-items:center;justify-content:center}
.sm-pin.hollow{background:#fff!important;color:var(--sm-dim);border-color:#6F8A87}
.sm-pin.sel{outline:3px solid var(--sm-coral);outline-offset:2px;z-index:5}
.sm-key{position:absolute;left:14px;top:14px;z-index:900;background:rgba(255,255,255,.97);border-radius:12px;box-shadow:0 2px 10px rgba(14,59,67,.15);width:250px;overflow:hidden}
.sm-keyhead{width:100%;display:flex;justify-content:space-between;align-items:center;height:36px;padding:0 12px;border:0;background:#fff;font:600 13px "Gabarito",sans-serif;color:var(--sm-teal);cursor:pointer}
.sm-keybody{display:flex;flex-direction:column;gap:5px;padding:4px 12px 12px;font-size:12px;color:var(--sm-ink)}
.sm-keybody>span{display:flex;align-items:center;gap:7px}
.sm-kt{font:500 10.5px "IBM Plex Mono",monospace!important;letter-spacing:.5px;color:var(--sm-dim);text-transform:uppercase;margin-top:6px}
.sm-kdot{display:inline-block;width:12px;height:12px;border-radius:12px;flex-shrink:0}
.sm-cby{display:inline-flex!important;background:#F2F6F5;border-radius:7px;padding:2px;gap:2px!important;align-self:flex-start}
.sm-cby button{height:22px;border:0;border-radius:5px;padding:0 8px;font:600 11px "Gabarito",sans-serif;cursor:pointer;background:transparent;color:#33484D}
.sm-cby button.on{background:var(--sm-teal);color:#fff}
.sm-cby button[disabled]{opacity:.45;cursor:not-allowed}
.sm-keynote{font-size:10.5px;color:var(--sm-dim);margin-top:4px}

/* the school drawer */
.sm-drawer{position:absolute;right:0;top:0;bottom:0;width:320px;background:#fff;border-left:1px solid var(--sm-line2);box-shadow:-12px 0 30px rgba(14,59,67,.12);z-index:1000;display:flex;flex-direction:column}
.sm-dhead{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:12px 14px;border-bottom:1px solid var(--sm-line3)}
.sm-dhead b{font-size:16px;color:var(--sm-teal);display:block;line-height:1.2}
.sm-dhead small{font-size:12px;color:var(--sm-dim)}
.sm-x{height:26px;width:26px;padding:0;flex-shrink:0;border-radius:8px;border:1px solid #CFDCD9;background:#fff;color:var(--sm-teal);cursor:pointer}
.sm-dbody{overflow-y:auto;flex:1}
.sm-dsec{padding:9px 12px;border-bottom:1px solid var(--sm-line3);display:flex;flex-direction:column;gap:5px;font-size:12px}
.sm-dsec h4{margin:0;font:500 11px "IBM Plex Mono",monospace;letter-spacing:.6px;color:var(--sm-dim);text-transform:uppercase;display:flex;justify-content:space-between;gap:8px}
.sm-dsec h4 span,.sm-dsec h4 a{font-family:"Gabarito",sans-serif;text-transform:none;letter-spacing:0}
.sm-bars{display:flex;gap:4px;align-items:flex-end;height:112px;position:relative;padding-top:4px}
.sm-bars span{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px;font:500 10px "IBM Plex Mono",monospace;color:var(--sm-dim);flex:1;height:100%}
.sm-bars i{width:100%;max-width:44px;border-radius:5px 5px 0 0;background:#B87508;display:block}
.sm-bars i.in{background:var(--sm-green)}.sm-bars i.cant{background:#C7D6D3}
.sm-bars i.locked{background:repeating-linear-gradient(45deg,#fff 0 3px,#DCE6E4 3px 5px);box-shadow:inset 0 0 0 1px #C7D6D3}
.sm-bars em{font-style:normal;font-size:9.5px;line-height:1.1;color:var(--sm-teal);font-family:"Gabarito",sans-serif;font-weight:600;text-align:center}
.sm-you{position:absolute;left:0;right:0;border-top:2px dashed var(--sm-coral);pointer-events:none}
.sm-you b{position:absolute;right:0;top:-15px;font:600 10px "Gabarito",sans-serif;color:var(--sm-coral);background:#fff;padding:0 3px}
.sm-line{font-weight:700}
.sm-note{color:var(--sm-dim);font-size:11.5px}
.sm-kv{display:flex;justify-content:space-between;gap:10px}
.sm-kv>span:first-child{color:var(--sm-dim)}
.sm-kv b{color:var(--sm-teal);text-align:right}
.sm-gl{display:grid;grid-template-columns:minmax(0,1fr) 110px 46px;gap:8px;align-items:center}
.sm-gl b{text-align:right;color:var(--sm-teal)}
.sm-gl .sm-minibar{width:110px;margin:0}
.sm-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}
.sm-links a{font-weight:600}
.sm-dfoot{padding:8px 12px;border-top:1px solid var(--sm-line3);display:flex;gap:6px;align-items:center;background:#FBFDFC}
.sm-dfoot .sm-flag{height:28px}
.sm-dfoot .sm-btn{height:28px}
.sm-demand{font-size:11.5px;font-weight:600;border-radius:6px;padding:2px 7px;background:#E3F4EC;color:#0B6B4E}
.sm-demand.warm{background:#FFF4D6;color:#7A5A12}

/* compare and plan */
.sm-page{margin-top:16px}
.sm-phead{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.sm-phead h1{margin:0;font-size:24px;font-weight:800;color:var(--sm-teal)}
.sm-phead p{margin:2px 0 0;color:var(--sm-dim);font-size:13px}
.sm-cmp{background:#fff;border:1px solid var(--sm-line2);border-radius:16px;overflow-x:auto}
.sm-cmpgrid{display:grid;min-width:min-content}
.sm-cmpgrid>div{padding:10px 12px;border-top:1px solid var(--sm-line3);font-size:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.sm-cmpgrid .k{color:var(--sm-dim);font-size:12.5px;background:#FBFDFC}
.sm-cmphead{flex-direction:column;align-items:flex-start!important;gap:5px!important;border-top:0!important}
.sm-cmphead b{font-size:14.5px;color:var(--sm-teal)}
.sm-barv{height:8px;flex:1;max-width:120px;min-width:40px;background:#E7EEEC;border-radius:4px;position:relative}
.sm-barv i{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--sm-teal)}
.sm-best{font-size:11px;font-weight:700;color:#0B6B4E;background:#E3F4EC;border-radius:999px;padding:1px 7px}
.sm-plan{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px}
.sm-card{background:#fff;border:1px solid var(--sm-line);border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:10px;min-width:0}
.sm-h2{margin:0;font-size:17px;font-weight:700;color:var(--sm-teal)}
.sm-prow{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--sm-line3);font-size:13px}
.sm-rank{width:26px;height:26px;border-radius:26px;background:var(--sm-teal);color:#fff;font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center}
.sm-safe{background:#E3F4EC;border-radius:12px;padding:12px 14px;display:flex;gap:10px;align-items:flex-start;font-size:13px}
.sm-safe.warn{background:#FFF4D6}
.sm-safe ul{margin:4px 0 0;padding-left:18px}
.sm-dl{display:flex;justify-content:space-between;gap:10px;font-size:13px}
.sm-empty2{color:var(--sm-dim);font-size:13px;padding:24px;text-align:center;background:#fff;border:1px dashed #CFDCD9;border-radius:16px}

/* below the tool */
.sm-seo{margin-top:24px;color:var(--sm-dim);font-size:13px}
.sm-seo h1{font-size:20px;color:var(--sm-teal);margin:0 0 6px}
.sm-seo h2{font-size:15px;color:var(--sm-teal);margin:16px 0 6px}
.sm-cols{columns:4 180px;padding-left:18px;margin:0}
.sm-cols li{margin:2px 0}

@media (max-width:900px){
  .sm-find{flex-wrap:wrap;height:auto;min-height:0}
  .sm-side{flex:1 1 100%;border-right:0;border-bottom:1px solid var(--sm-line);max-height:420px}
  .sm-map{flex:1 1 100%;height:460px}
  .sm-plan{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:700px){
  .sm-barwrap{padding:0 10px}
  .sm-wrap{padding:0 10px 20px}
  .sm-bar{gap:8px}
  .sm-seg{width:100%}.sm-seg button{flex:1;justify-content:center;height:44px}
  .sm-where{flex:1 1 100%;height:44px}
  .sm-help,.sm-layerswrap,.sm-sep{display:none}
  .sm-fbtn{display:inline-flex;align-items:center;height:44px}
  .sm-lmt{display:inline-flex;margin-left:auto}.sm-lmt button{height:38px}
  .sm-filters{display:none}
  .sm-filters.open{display:flex;flex-direction:column;gap:8px;width:100%;padding:6px 0}
  .sm-filters.open .sm-pill{height:44px;padding:0 14px}
  .sm-phone-only.sm-fsel{display:flex;gap:10px;flex-wrap:wrap}
  .sm-fsel label{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--sm-dim)}
  .sm-fsel select{height:44px;border:1px solid var(--sm-line2);border-radius:8px;font:600 13px "Gabarito",sans-serif;color:var(--sm-teal);background:#fff}
  .sm-shead .sm-sels{display:none}
  .sm-side{max-height:none;border-bottom:0}
  .sm-find{border-radius:12px}
  .sm[data-show="list"] .sm-map{display:none}
  .sm[data-show="map"] .sm-side{display:none}
  .sm[data-show="map"] .sm-map{height:calc(100vh - 210px);min-height:420px}
  .sm-mc{padding:9px 10px}
  .sm-flag{height:44px!important;min-width:44px}
  .sm-cbar{position:sticky;bottom:calc(58px + env(safe-area-inset-bottom));z-index:5}
  .sm-cbar .sm-btn{height:44px}
  .sm-drawer{position:fixed;inset:0;width:100%;z-index:1000;border-left:0}
  .sm-x{width:44px;height:44px}
  .sm-dfoot .sm-btn,.sm-dfoot .sm-flag{height:44px}
  .sm-key{width:auto;right:60px}
  .sm-cby button,.sm-keyhead{height:36px}
  .sm-sel,.sm-ask input,.sm-btn{height:44px}
  .sm-prow .sm-btn{height:44px;min-width:44px}
  .sm-town{padding:10px 12px}
}

.sm-map.dopen .leaflet-right{right:320px}
.sm-dfoot .sm-flag{flex-shrink:0}
