/* yegmap.css — the YEG Map (zoning.html), Oct 2026, on top of /assets/calculators/vx.css. Phone: the search, then the map,
   then the list (or the chosen neighbourhood) right under it. Computer: the map and the list side by side, one column. */
.ym .vhero h1{font-size:clamp(40px,10vw,84px);}
.ym-top{max-width:var(--maxw);margin:16px auto 0;padding:0 var(--pad);}
#emap-search{position:relative;max-width:760px;}
.sug{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;margin:0;padding:6px;list-style:none;border-radius:16px;background:var(--bg);border:1px solid var(--line2);box-shadow:0 24px 50px -24px rgba(0,0,0,.6);max-height:min(60vh,360px);overflow-y:auto;}
.sug[hidden]{display:none;}
.sug li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;min-height:44px;padding:10px 12px;border-radius:10px;cursor:pointer;font-size:15px;color:var(--ink);}
.sug li span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);white-space:nowrap;}
.sug li:hover,.sug li[aria-selected="true"]{background:var(--chip);}
.ym-links{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;}
.ym-links .btn{min-height:46px;padding:0 18px;}

/* ---- the map and the list ---- */
.ym-wrap{max-width:var(--maxw);margin:18px auto 0;padding:0 var(--pad);display:grid;gap:14px;grid-template-columns:minmax(0,1fr);}
.ym-wrap{position:relative;}
.skip-map{position:absolute;left:-9999px;top:10px;z-index:20;padding:12px 16px;border-radius:12px;background:var(--fill);color:var(--fill-ink);font-size:14px;text-decoration:none;}
.skip-map:focus{left:calc(var(--pad) + 12px);}
.ym-side{scroll-margin-top:calc(var(--navh) + 12px);}
.ym-map{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line2);background:#EAE8E0;isolation:isolate;}
#emap{height:min(56svh,520px);width:100%;}
@media (min-width:980px){
  .ym-wrap{grid-template-columns:minmax(0,1.55fr) minmax(340px,1fr);gap:24px;align-items:stretch;}
  #emap{height:680px;}
  .ym-side{height:680px;overflow-y:auto;overscroll-behavior:contain;padding-right:4px;}
}
@media (min-width:1680px){#emap,.ym-side{height:760px;}}
.ym-legend{position:absolute;left:12px;top:12px;z-index:2;display:flex;align-items:center;gap:8px;padding:7px 11px;border-radius:999px;background:rgba(239,237,229,.9);color:#3F3A25;font:500 11px/1 var(--sans);letter-spacing:.04em;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;}
.ym-legend i{width:70px;height:8px;border-radius:999px;background:linear-gradient(90deg,rgba(84,78,46,.06),rgba(84,78,46,.55));border:1px solid rgba(84,78,46,.25);}
.maplibregl-ctrl-attrib{font:400 10px/1.4 var(--sans)!important;}
.maplibregl-ctrl-group button{width:44px!important;height:44px!important;}
/* dark: the map's frame, legend and MapLibre's own controls follow the theme (yegmap.js paints the tiles; audit C M13, Batch 3, Oct 25);
   the attribution stays readable — wheat on ink, about 10:1 */
html.sar-dark .ym-map{background:#15140E;}
html.sar-dark .ym-legend{background:rgba(16,15,10,.84);color:#CABF9F;}
html.sar-dark .ym-legend i{background:linear-gradient(90deg,rgba(179,170,141,.08),rgba(179,170,141,.6));border-color:rgba(179,170,141,.3);}
html.sar-dark .maplibregl-ctrl-attrib{background:rgba(16,15,10,.82)!important;color:#CABF9F!important;}
html.sar-dark .maplibregl-ctrl-attrib a{color:#E8E8E3!important;}
html.sar-dark .maplibregl-ctrl-attrib-button{filter:invert(.86);}
html.sar-dark .maplibregl-ctrl-group{background:#1A1912!important;box-shadow:0 0 0 1px rgba(179,170,141,.26)!important;}
html.sar-dark .maplibregl-ctrl-group button+button{border-top-color:rgba(179,170,141,.22)!important;}
html.sar-dark .maplibregl-ctrl-group button .maplibregl-ctrl-icon{filter:invert(.86) sepia(.25);}
html.sar-dark .maplibregl-ctrl-group button:hover{background:#26231A!important;}
.maplibregl-cooperative-gesture-screen{font-family:var(--sans);font-size:14px;}

/* the side: a ranked list, or the chosen place */
.ym-side h2{font-size:clamp(23px,5.4vw,30px);line-height:1.12;}
.ym-listbox>p{margin:6px 0 12px;font-size:13.5px;color:var(--ink3);}
.ym-side.has-sel .ym-listbox{display:none;}
.ym-list{display:flex;flex-direction:column;gap:6px;}
.vx .ym-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:56px;padding:10px 14px;border-radius:14px;border:1px solid var(--line);background:var(--card);cursor:pointer;text-align:left;overflow:hidden;isolation:isolate;transition:border-color .2s;}
.vx .ym-row:hover{border-color:var(--gold);}
.ym-row i{position:absolute;left:0;bottom:0;height:3px;width:var(--w);background:var(--olive);opacity:.55;border-radius:0 3px 3px 0;}
.ym-row .t{display:flex;flex-direction:column;min-width:0;}
.ym-row .t b{font:400 18px/1.2 var(--serif);color:var(--ink);}
.ym-row .t span{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);}
.ym-row .n{display:flex;flex-direction:column;align-items:flex-end;flex:none;font-size:13px;color:var(--ink2);}
.ym-row .n b{font-weight:500;color:var(--ink);}
.ym-row .n .fr{font-size:12px;color:var(--gold);}
#ym-more{margin-top:10px;width:100%;}
#ym-more[hidden]{display:none;}
.ym-wait{color:var(--ink3);font-size:14px;}
.ym-info{display:none;}
.ym-info.on{display:block;}
.vx .ym-back{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;border:0;background:transparent;color:var(--gold);font:500 12px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;}
.ym-info .eyebrow{margin:6px 0 6px;}
.ym-sum{margin:10px 0 0;font-size:15px;line-height:1.5;color:var(--ink2);}
.ym-sum b{color:var(--ink);font-weight:500;}
.ym-ladder{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px;}
.ym-ladder:empty{display:none;}
.ym-ladder li{display:grid;grid-template-columns:112px minmax(0,1fr) 34px;align-items:center;gap:10px;font-size:12.5px;color:var(--ink3);}
.ym-ladder li i{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--olive) var(--w),var(--line) var(--w));}
.ym-ladder li b{text-align:right;color:var(--ink);font-weight:500;}
.ym-ours{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:var(--chip);font-size:13.5px;color:var(--ink2);}
.ym-acts{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;}
.ym-acts .btn{flex:1 1 150px;min-height:46px;padding:0 14px;}
.ym-acts .btn[hidden]{display:none;}
.ym-info .rail-wrap{margin-top:14px;}
#emap-results{gap:12px;}
#emap-results:not(.on){display:none;}
.vx .eil{display:flex;flex-direction:column;width:min(70vw,250px);border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--card);text-decoration:none;color:inherit;transition:border-color .2s;}
.vx .eil:hover{border-color:var(--gold);}
.eil img,.eil .noimg{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--bg2);}
.eil .noimg{display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--ink3);}
.eil .b{display:flex;flex-direction:column;gap:3px;padding:11px 13px 13px;}
.eil .ours{align-self:flex-start;margin-bottom:3px;padding:4px 8px;border-radius:999px;background:var(--fill);color:var(--fill-ink);font:500 9.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;}
.eil .p{font:400 21px/1.1 var(--serif);color:var(--ink);}
.eil .a{font-size:13.5px;color:var(--ink);font-weight:500;line-height:1.3;}
.eil .f{font-size:12px;color:var(--ink3);}
.eil .c{margin-top:5px;font-size:10.5px;line-height:1.4;color:var(--ink3);}
.vx .eil--all{align-items:center;justify-content:center;min-height:240px;padding:20px;text-align:center;color:var(--gold);font:500 12px/1.5 var(--sans);letter-spacing:.12em;text-transform:uppercase;background:transparent;border-style:dashed;}
.ym-none{font-size:14px;color:var(--ink2);}
.ym-none a{color:var(--gold);}
#emap-results>.ym-fail{flex:1 1 100%;}   /* the cards could not be read (Oct 13, 2026): the line wraps in the row instead of running past it */
.ym-out{margin-top:12px;}

/* ---- the RAE statements and the data's date (shown verbatim, never shortened) ---- */
.ym-disc{max-width:calc(var(--maxw) - 2*var(--pad));width:calc(100% - 2*var(--pad));margin:22px auto 0;padding:14px 0 0;border-top:1px solid var(--line);font-size:11px;line-height:1.75;color:var(--ink3);}
.ym-disc div+div{margin-top:2px;}
.ym-credit{max-width:calc(var(--maxw) - 2*var(--pad));width:calc(100% - 2*var(--pad));margin:10px auto 0;font-size:11px;line-height:1.6;color:var(--ink3);}

/* ---- zoning and lot types: a tap opens each on a phone; open cards on a computer ---- */
.zgrid{display:grid;gap:0;grid-template-columns:minmax(0,1fr);}
@media (min-width:980px){.zgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}}
.zd{border-bottom:1px solid var(--line);}
@media (min-width:980px){.zd{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:4px 18px 6px;}}
.zd>summary{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 30px 8px 0;cursor:pointer;list-style:none;position:relative;}
.zd>summary::-webkit-details-marker{display:none;}
.zd>summary::after{content:"+";position:absolute;right:2px;top:50%;margin-top:-13px;font:300 24px/1 var(--sans);color:var(--gold);transition:transform .3s var(--ease);}
.zd[open]>summary::after{transform:rotate(45deg);}
.ztag{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:46px;padding:6px 9px;border-radius:999px;background:var(--fill);color:var(--fill-ink);font:500 11px/1 var(--sans);letter-spacing:.08em;}
.zd>summary b{font:400 18px/1.25 var(--serif);color:var(--ink);font-weight:400;}
.zd p{margin:0 0 14px;font-size:14.5px;line-height:1.6;color:var(--ink2);}
.znote{margin:18px 0 0;padding:14px 16px;border-radius:14px;border:1px dashed var(--line2);font-size:14px;line-height:1.6;color:var(--ink2);}
.zchanged{font-size:15.5px;line-height:1.65;color:var(--ink2);max-width:70ch;margin:0;}