[hidden]{display:none!important}
input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
:root{--navy:#0f2036;--navy2:#173a5e;--gold:#c8a763;--blue:#1677d9;--ink:#13263b;--line:#d5dee8;--bg:#e8eef5;
 --sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);
 font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;color:var(--ink);-webkit-text-size-adjust:100%}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);overscroll-behavior:none}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
#app{position:fixed;inset:0}
#stage{position:absolute;inset:0;overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
 background:#e8eef5 radial-gradient(#cad5e3 1px,transparent 1px) 0 0/22px 22px}
#sheetImg{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;max-width:none;pointer-events:none;box-shadow:0 3px 22px #1e403425}
#overlay{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
#loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#0f2036e6;color:#fff;padding:10px 16px;border-radius:20px;font-size:14px}
/* Top */
#top{position:absolute;left:0;right:0;top:0;padding:calc(var(--sat) + 8px) calc(var(--sar) + 10px) 0 calc(var(--sal) + 10px);pointer-events:none}
#top>*{pointer-events:auto}
#searchForm{display:flex;align-items:center;gap:4px;background:#fff;border-radius:14px;box-shadow:0 2px 14px #0f203633;padding:4px;max-width:560px}
#q{flex:1;min-width:0;border:0;outline:0;font-size:16px;padding:9px 4px;background:transparent;color:inherit}
.icon{border:0;background:transparent;width:40px;height:40px;border-radius:10px;font-size:19px;display:grid;place-items:center}
.icon:active{background:#eef3f8}
#sheetRow{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap;pointer-events:none}
#sheetRow>*{pointer-events:auto}
#sheetBtn{border:0;background:var(--navy);color:#fff;border-radius:18px;padding:7px 13px;font-size:14px;box-shadow:0 2px 10px #0f203640}
#gpsPill{background:#fff;border-radius:18px;padding:7px 11px;font-size:13px;box-shadow:0 2px 10px #0f203626;color:#24496d}
#gpsPill.warn{color:#8a5300;background:#fff6e0}
#results{margin-top:8px;max-width:560px;background:#fff;border-radius:14px;box-shadow:0 6px 24px #0f203640;max-height:min(58dvh,520px);overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
#results h3{margin:0;padding:11px 14px 5px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#5d7186}
#results .chips{display:flex;gap:6px;padding:10px 12px 2px;flex-wrap:wrap}
#results .chip{border:1px solid #c6d6e6;background:#f4f8fc;border-radius:16px;padding:6px 11px;font-size:13px}
.res{display:flex;gap:10px;align-items:center;padding:10px 14px;border-top:1px solid #eef2f6}
.res .main{flex:1;min-width:0}
.res .t{font-weight:650;font-size:15px}.res .s{font-size:13px;color:#5b6f84;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.res button,.res a.btn,.card a.btn,.card button.btn{flex-shrink:0;border:1px solid #bcd3ea;background:#eef6fd;color:#0f4f8c;border-radius:10px;padding:8px 10px;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.res .addr{flex:1;text-align:left;border:0;background:none;padding:0;color:inherit;font-size:15px;font-weight:500;white-space:normal}
.empty{padding:14px;color:#5b6f84;font-size:14px}
.badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 6px;border-radius:6px;margin-left:6px;vertical-align:1px}
.badge.historic{background:#fbefd6;color:#7a4f00}.badge.abandoned{background:#fde2e4;color:#9b1520}.badge.replaced{background:#e7ebef;color:#46525e}.badge.unmapped{background:#eef1f4;color:#5b6f84}
/* Compass */
#compass{position:absolute;left:calc(var(--sal) + 10px);bottom:calc(var(--sab) + 14px);display:grid;grid-template-columns:repeat(3,38px);grid-template-rows:repeat(3,34px);gap:3px;
 background:#ffffffd9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:5px;border-radius:14px;box-shadow:0 2px 14px #0f203633}
#compass button{border:0;border-radius:8px;background:var(--navy2);color:#fff;font-size:13px;font-weight:650;padding:0}
#compass button.here{background:var(--gold);color:var(--navy)}
#compass button:disabled{background:#d9e1ea;color:#9aa9b8}
/* FABs */
#fabs{position:absolute;right:calc(var(--sar) + 10px);bottom:calc(var(--sab) + 14px);display:flex;flex-direction:column;gap:9px;align-items:center}
.fab{width:50px;height:50px;border-radius:50%;border:0;background:#fff;box-shadow:0 2px 12px #0f203640;font-size:21px;display:grid;place-items:center;color:var(--navy2)}
.fab.small{width:42px;height:42px;font-size:22px}
.fab.primary{background:var(--blue);color:#fff;width:58px;height:58px}
.fab[aria-pressed=true]{background:var(--blue);color:#fff}
.fab.busy{animation:pulse 1.1s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 10px #1677d933}}
#recenter{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--sab) + 20px);border:0;background:var(--navy);color:#fff;border-radius:22px;padding:11px 18px;font-size:15px;box-shadow:0 2px 12px #0f203655}
/* Popover, card, toast */
.popover{position:absolute;right:calc(var(--sar) + 70px);bottom:calc(var(--sab) + 150px);background:#fff;border-radius:14px;box-shadow:0 6px 24px #0f203640;padding:12px 14px;width:240px;font-size:14px}
.row{display:flex;gap:8px;align-items:center;font-weight:600}
.legend{display:grid;gap:6px;margin:10px 0 4px}.legend div{display:flex;align-items:center;gap:8px}
.sw{display:inline-block;width:30px;height:0;border-top:5px solid #1ea7e8}
.sw.historic{border-top:5px dashed #c98a12}.sw.abandoned{border-top:4px solid #cf151f}.sw.replaced{border-top:5px dashed #7a8794}
.fine{font-size:12.5px;color:#5b6f84;line-height:1.45;margin:6px 0}
#card{position:absolute;left:calc(var(--sal) + 10px);right:calc(var(--sar) + 10px);bottom:calc(var(--sab) + 12px);max-width:560px;margin:0 auto;background:#fff;border-radius:16px;box-shadow:0 8px 30px #0f203655;padding:12px 14px 14px;max-height:48dvh;overflow:auto;z-index:5}
.card .head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.card h2{font-size:17px;margin:2px 0}.card p{margin:4px 0;font-size:14px;color:#405568}
.card .actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.card .others{margin-top:10px;border-top:1px solid #eef2f6;padding-top:6px}
.card .other{display:block;width:100%;text-align:left;border:0;background:none;padding:8px 0;font-size:14px;color:#0f4f8c}
#toast{position:absolute;left:50%;transform:translateX(-50%);top:calc(var(--sat) + 104px);background:#0f2036ee;color:#fff;padding:9px 14px;border-radius:12px;font-size:14px;max-width:min(92vw,520px);text-align:center;z-index:6}
#edgeChips button{position:absolute;border:0;background:var(--navy2);color:#fff;border-radius:18px;padding:8px 12px;font-size:13px;font-weight:650;box-shadow:0 2px 10px #0f203655;white-space:nowrap}
dialog{border:0;border-radius:16px;padding:16px;max-width:min(560px,calc(100vw - 24px));max-height:85dvh;overflow:auto;box-shadow:0 14px 55px #0b233d66;color:var(--ink)}
dialog::backdrop{background:#0b1a2b88}
.dlg-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.dlg-head h2{margin:0;font-size:18px}.dlg-head small{font-weight:500;color:#5b6f84;font-size:13px}
#sheetGrid{display:grid;gap:4px;margin-top:8px}
#sheetGrid .gridrow{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
#sheetGrid button{border:1px solid #cfdbe7;background:#f4f8fc;border-radius:8px;padding:9px 0;font-size:14px}
#sheetGrid button.cov{font-weight:800;background:#e3f1fc;border-color:#9cc8ec}
#sheetGrid button.cur{background:var(--gold);border-color:var(--gold)}
#sheetGrid button:disabled{opacity:.35}
#sheetGrid .idx{grid-column:1/-1;font-weight:700}
pre{white-space:pre-wrap;font-size:12px;background:#f4f7fa;padding:10px;border-radius:8px}
@media (min-width:900px){#q{font-size:15px}}
@media (prefers-reduced-motion:reduce){.fab.busy{animation:none}}
#hlBtn{border:0;border-radius:18px;padding:7px 12px;font-size:14px;font-weight:600;box-shadow:0 2px 10px #0f203626;background:#1ea7e8;color:#fff}
#hlBtn[aria-pressed=false]{background:#fff;color:#4c6176}
.legend label{display:flex;align-items:center;gap:8px}
.legend.off{opacity:.45}
.sw.draft{border-top:5px dashed #8b3fd9}.badge.draft{background:#efe3fc;color:#5b1fa0}
.sw.private{border-top:3px solid #1677d9}.badge.private{background:#e1f1fc;color:#0d5791}

#catBtn{border:0;border-radius:18px;padding:7px 12px;font-size:14px;font-weight:600;box-shadow:0 2px 10px #0f203626;background:#fff;color:#1665ac;text-decoration:none;white-space:nowrap}

/* Top button row: three matching pills on one line (Kevin, 2026-10-31) */
#sheetRow{flex-wrap:nowrap;gap:6px}
#sheetBtn,#hlBtn,#catBtn{flex:0 1 auto;min-width:0;height:34px;display:inline-flex;align-items:center;justify-content:center;gap:4px;
 padding:0 12px;border-radius:17px;font-size:14px;font-weight:600;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 2px 8px #0f203626}
#sheetBtn b{font-weight:700;overflow:hidden;text-overflow:ellipsis}
#hlBtn{background:#1ea7e8;color:#fff}#hlBtn[aria-pressed=false]{background:#fff;color:#4c6176}
#catBtn{background:#fff;color:#1665ac}
#gpsPill{flex:0 0 auto}

/* Layers panel: master on/off switch on top, then the layer list (Kevin, 2026-10-31) */
.row.master{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:15px;padding-bottom:8px;border-bottom:1px solid #e3eaf0}
.switch{appearance:none;-webkit-appearance:none;width:44px;height:26px;border-radius:13px;background:#c5d0da;position:relative;cursor:pointer;transition:background .15s;margin:0}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:left .15s}
.switch:checked{background:#1ea7e8}.switch:checked::after{left:21px}

/* GPS status on its own line under the buttons so it never squeezes them */
#gpsRow{display:flex;margin-top:6px;pointer-events:none}#gpsRow>*{pointer-events:auto;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}