:root {
  color-scheme: dark;
  font-family: "Open Sans", "Segoe UI", system-ui, sans-serif;
  --bg: #090d0c; --chrome: #0d1210; --panel: #111714; --panel-raised: #17201c;
  --line: #28332e; --line-soft: #202923; --text: #edf0e9; --muted: #98a39d;
  --quiet: #6e7b74; --accent: #e0c367; --accent-bright: #f1d97f; --green: #78c0a6;
  --header-h: 70px; --explore-w: 286px; --intel-w: 342px;
}
* { box-sizing: border-box; }
html, body, .app-shell { margin: 0; width: 100%; height: 100%; }
body { min-width: 320px; overflow: hidden; background: var(--bg); color: var(--text); }
button, input, select { font: inherit; }
[hidden] { display: none !important; }
.app-shell { display: grid; grid-template-rows: var(--header-h) minmax(0,1fr); }
.app-header { position: relative; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 20px; border-bottom: 1px solid var(--line); background: rgba(13,18,16,.98); box-shadow: 0 8px 30px rgba(0,0,0,.18); }
.brand-lockup, .header-actions { display: flex; align-items: center; gap: 13px; min-width: 0; }
.brand { display: flex; align-items: center; flex-shrink: 0; height: 40px; overflow: hidden; text-decoration: none; }
.brand-logo { display: block; width: 180px; height: auto; }
.brand-divider { width: 1px; height: 30px; background: var(--line); }
.viewer-identity { display: grid; min-width: 0; }
.viewer-identity span, .eyebrow { color: var(--accent); font-size: 8px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.viewer-identity strong { font-size: 18px; font-weight: 600; line-height: 1.2; }
.status { max-width: 38rem; color: var(--muted); font-size: 11px; text-align: right; }
.status.error { color: #e18572; }
.mobile-actions, .mobile-only, .panel-mobile-handle { display: none; }
.viewer { position: relative; display: grid; grid-template-columns: var(--explore-w) minmax(0,1fr) var(--intel-w); min-height: 0; }
.panel { position: relative; z-index: 20; min-width: 0; min-height: 0; background: var(--panel); overflow-y: auto; }
.explore-panel { border-right: 1px solid var(--line); }
.intelligence-panel { border-left: 1px solid var(--line); }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 22px 20px 17px; border-bottom: 1px solid var(--line-soft); }
.panel-heading p, .panel-heading h2 { margin: 0; }
.panel-heading h2 { margin-top: 5px; font-size: 23px; font-weight: 600; }
.control-section { padding: 17px 20px; border-bottom: 1px solid var(--line-soft); }
.section-title-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
.section-title-row h3 { margin: 0; color: #cbd1cb; font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.micro-label { color: var(--quiet); font-size: 8px; letter-spacing: .09em; text-transform: uppercase; }
.filter-label, .legend-title { display: block; color: var(--quiet); font-size: 9px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.commodity-filter { width: 100%; min-height: 36px; margin-top: 6px; padding: 6px 9px; border: 1px solid #354139; border-radius: 5px; background: #0b100e; color: #d9ddd8; font-size: 11px; }
.commodity-filter:focus-visible, .layer-row input:focus-visible + .switch { outline: 2px solid var(--accent-bright); outline-offset: 2px; }
.commodity-filter:disabled { opacity: .58; }
.layer-row { display: grid; grid-template-columns: 19px minmax(0,1fr) auto auto; align-items: center; gap: 8px; min-height: 42px; padding: 2px 0; border-radius: 5px; cursor: pointer; }
.layer-row:hover { background: rgba(255,255,255,.02); }
.layer-name { color: #d9ddd8; font-size: 11px; line-height: 1.25; }
.layer-symbol { width: 13px; height: 13px; justify-self: center; border: 1px solid #829087; }
.geology-symbol { background: linear-gradient(135deg,#826d55 50%,#5f7a69 50%); }
.structures-symbol { height: 2px; border: 0; background: #e18572; transform: rotate(-25deg); }
.agreement-symbol { border-color: #7c3aed; background: rgba(124,58,237,.3); }
.geothermal-symbol { border-color: #db2777; border-radius: 50%; background: rgba(219,39,119,.28); }
.ownership-symbol { border-color: #f59e0b; background: rgba(245,158,11,.24); }
.restriction-symbol { border-color: #b91c1c; background: rgba(185,28,28,.3); }
.ats-symbol { background: repeating-linear-gradient(0deg,transparent 0 3px,#94a3b8 3px 4px), repeating-linear-gradient(90deg,transparent 0 3px,#94a3b8 3px 4px); }
.boundary-symbol { border: 2px solid #f8fafc; background: transparent; }
.layer-row input { position: absolute; opacity: 0; pointer-events: none; }
.switch { position: relative; width: 31px; height: 18px; border: 1px solid #3b4841; border-radius: 10px; background: #1c2521; transition: .18s ease; }
.switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 10px; height: 10px; border-radius: 50%; background: #76827c; transition: .18s ease; }
.layer-row input:checked + .switch { border-color: #766a3d; background: rgba(224,195,103,.16); }
.layer-row input:checked + .switch::after { left: 16px; background: var(--accent-bright); }
.legend { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line-soft); }
.compact-legend { margin-top: 0; padding-top: 0; border-top: 0; }
#commodity-legend { display: grid; gap: 5px; margin-top: 7px; }
.legend-row { display: grid; grid-template-columns: 11px 1fr auto; align-items: center; gap: 7px; color: #cbd5cf; font-size: 10px; }
.legend-swatch { width: 9px; height: 9px; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; }
.legend-count { color: var(--quiet); font-variant-numeric: tabular-nums; }
.agreement-legend { display: grid; gap: 5px; margin: 4px 0 7px 27px; padding: 8px 9px; border-left: 1px solid #354139; color: var(--muted); font-size: 9px; }
.agreement-legend-row { display: flex; align-items: center; gap: 7px; }
.agreement-swatch, .agreement-line { width: 18px; height: 6px; border: 1px solid currentColor; }
.agreement-swatch.permit { color:#0f766e;background:#0f766e }.agreement-swatch.lease{color:#7c3aed;background:#7c3aed}.agreement-swatch.secondary{color:#b45309;background:#b45309}.agreement-swatch.geothermal-application{color:#db2777;background:#db2777}.agreement-swatch.geothermal-lease{color:#9d174d;background:#9d174d}.agreement-swatch.ownership-review{color:#f59e0b;background:#f59e0b}.agreement-swatch.ownership-not-crown{color:#475569;background:#475569}.agreement-swatch.restriction-no-access{color:#b91c1c;background:#b91c1c}.agreement-swatch.restriction-reserved{color:#92400e;background:#92400e}.agreement-swatch.restriction-subject{color:#ca8a04;background:#ca8a04}
.agreement-line { height: 0; color: #e2e8f0; }.agreement-line.application{border-style:dashed}
.legend-caution { color: #e0c367; line-height: 1.4; }
.map-stage { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: #18201d; }
#map { position: absolute; inset: 0; }
.map-stage::after { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; box-shadow:inset 0 0 90px rgba(3,7,5,.18); }
.map-note { position: absolute; z-index: 5; left: 12px; bottom: 28px; display: grid; gap: 2px; padding: 8px 10px; border: 1px solid rgba(89,106,97,.48); border-radius: 4px; background: rgba(13,18,16,.88); color: #d8ddd9; font-size: 9px; box-shadow: 0 8px 22px rgba(0,0,0,.18); }
.map-note span { color: var(--muted); }
.detail-content { padding: 20px; }
.detail-kicker { margin: 0 0 6px; color: var(--accent); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.detail-content h3 { margin: 0 0 10px; font-size: 19px; font-weight: 600; }
.detail-content > p:not(.detail-kicker):not(.source-note) { margin: 0 0 20px; color: var(--muted); font-size: 13px; line-height: 1.55; }
.detail-callout { display: grid; gap: 5px; margin-top: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 5px; background: #0d1310; }
.detail-callout strong { color: #cbd1cb; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.detail-callout span { color: var(--muted); font-size: 11px; line-height: 1.5; }
.detail-callout.caution { border-left: 2px solid var(--accent); }
.source-note { margin: 22px 0 0; padding-top: 15px; border-top: 1px solid var(--line-soft); color: var(--quiet); font-size: 9px; line-height: 1.5; }
.map-debug-control { min-width:72px; padding:6px 8px; border:1px solid rgba(89,106,97,.6); border-radius:4px; background:rgba(13,18,16,.92); color:#e8edf2; font-size:10px; font-weight:700; text-align:center; }
.maplibregl-ctrl-group { border:1px solid rgba(91,106,98,.65)!important; background:rgba(13,18,16,.9)!important; }
.maplibregl-popup-content { min-width:230px; color:#111827; }.popup-title{margin:0 0 7px;font-size:16px}.popup-grid{display:grid;grid-template-columns:auto 1fr;gap:4px 9px;margin:0;font-size:12px}.popup-grid dt{font-weight:650}.popup-grid dd{margin:0}.popup-note{margin:9px 0 0;font-size:11px;line-height:1.35;color:#4b5563}.popup-record+.popup-record{border-top:1px solid #d1d5db;margin-top:11px;padding-top:11px}.popup-records{max-height:320px;overflow-y:auto}.popup-record-title{font-size:14px;margin:0 0 7px}
@media (max-width:1120px){:root{--explore-w:248px;--intel-w:300px}.control-section,.panel-heading,.detail-content{padding-left:16px;padding-right:16px}.status{max-width:26rem}}
@media (max-width:900px) and (min-width:720px){:root{--explore-w:230px;--intel-w:260px}.status{display:none}.brand-logo{width:140px}.detail-content{padding:16px}}
@media (max-width:719px){
  :root{--header-h:62px}.app-header{padding:0 10px 0 13px}.brand-lockup{gap:8px}.brand-logo{width:112px}.brand-divider{height:27px}.viewer-identity span{font-size:7px}.viewer-identity strong{font-size:15px}.status{display:none}.mobile-actions{display:flex;gap:2px}.icon-button{display:grid;place-items:center;gap:2px;min-width:48px;min-height:48px;padding:4px;color:var(--muted);text-decoration:none;font-size:8px}.control-icon{position:relative;width:17px;height:17px}.layers-icon{border-top:1px solid currentColor;border-bottom:1px solid currentColor}.layers-icon::after{content:"";position:absolute;left:0;right:0;top:7px;border-top:1px solid currentColor}.details-icon{border:1px solid currentColor;border-radius:50%}.details-icon::after{content:"i";position:absolute;inset:0;display:grid;place-items:center;font-size:12px}.viewer{display:block}.map-stage{position:absolute;inset:0}.panel{position:fixed;z-index:60;left:0;right:0;bottom:0;width:100%;max-height:min(78dvh,650px);border:1px solid #39463f;border-bottom:0;border-radius:14px 14px 0 0;box-shadow:0 -20px 60px rgba(0,0,0,.42);transform:translateY(calc(100% + 10px));transition:transform .22s ease;overscroll-behavior:contain}.panel:target{transform:translateY(0)}.panel-mobile-handle{display:block;position:sticky;z-index:2;top:0;width:38px;height:4px;margin:8px auto 0;border-radius:3px;background:#48554e}.panel-heading{padding-top:14px}.mobile-only{display:grid}.close-button{place-items:center;width:44px;height:44px;margin:-8px -8px 0 0;color:var(--muted);text-decoration:none;font-size:27px;font-weight:200}.map-note{left:8px;bottom:30px}.maplibregl-ctrl-top-right{top:4px;right:4px}.maplibregl-ctrl-group button{width:42px;height:42px}
}
@media (max-width:360px){.viewer-identity span{display:none}.viewer-identity strong{font-size:13px}.icon-button{min-width:45px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}