:root { --bg:#071119; --bg-deep:#04090e; --panel:rgba(10,25,35,.74); --line:rgba(175,218,230,.19); --text:#edf8fa; --muted:#8fa9b1; --cyan:#66e4e3; --lime:#b8e86a; --amber:#ffc76b; --danger:#ff8877; --space:16px; --radius:14px; --shadow:0 18px 50px rgba(0,0,0,.32); --display:Manrope,Arial,sans-serif; --mono:"DM Mono",monospace; --header-height:84px; }
#viewport { height:auto!important }
html,body { height:100% } * { box-sizing:border-box } body { margin:0; overflow:hidden; color:var(--text); background:var(--bg-deep); font-family:var(--display); font-size:14px } button,input { font:inherit } button { cursor:pointer } #app-shell,#viewport,#map,#fallback-canvas { width:100%; height:100% } #app-shell { min-height:100vh; background:radial-gradient(circle at 70% 20%,#12343c 0,#071119 42%,#04090e 100%) } .topbar { position:fixed; z-index:5; top:0; width:100%; height:var(--header-height); display:flex; align-items:center; gap:28px; padding:0 32px; background:linear-gradient(180deg,rgba(4,12,18,.92),rgba(4,12,18,.62)); border-bottom:1px solid var(--line); backdrop-filter:blur(16px) } .brand { display:flex; align-items:center; gap:12px; min-width:360px } .brand-mark { width:28px;height:31px;display:flex;align-items:end;gap:3px;filter:drop-shadow(0 0 8px rgba(102,228,227,.4)) }.brand-mark i{width:7px;background:var(--cyan);transform:skewY(-26deg);border-radius:2px}.brand-mark i:nth-child(1){height:13px}.brand-mark i:nth-child(2){height:23px;background:var(--lime)}.brand-mark i:nth-child(3){height:30px}.brand h1 { margin:0; font-size:15px; font-weight:800; letter-spacing:-.35px }.brand h1 span { color:var(--muted);font-weight:500}.brand p { margin:3px 0 0; color:var(--cyan);font:10px var(--mono);letter-spacing:.04em }.tabs { display:flex; height:100%; align-items:center; gap:4px; margin:auto }.tab { position:relative; height:100%; padding:0 14px; color:var(--muted);border:0;background:transparent;font-size:12px;font-weight:700;letter-spacing:.01em;transition:color .2s }.tab::after{content:"";position:absolute;bottom:0;left:14px;right:14px;height:2px;background:var(--cyan);transform:scaleX(0);transition:transform .22s ease}.tab:hover,.tab.is-active{color:var(--text)}.tab.is-active::after{transform:scaleX(1)}.header-actions{position:relative}.icon-button{width:30px;height:30px;border:1px solid var(--line);border-radius:50%;background:rgba(255,255,255,.06);color:var(--cyan);font:600 14px var(--mono);transition:.2s}.icon-button:hover{background:rgba(102,228,227,.15);border-color:var(--cyan)}.about-popover{position:absolute;right:0;top:40px;width:310px;padding:18px;border:1px solid var(--line);border-radius:var(--radius);background:#0a1922eF;box-shadow:var(--shadow);backdrop-filter:blur(15px);color:var(--muted);line-height:1.55;font-size:12px}.about-popover strong{color:var(--text);display:block;margin-bottom:7px}.about-popover dt{color:var(--cyan);font:10px var(--mono);margin-top:9px}.about-popover dd{margin:1px 0 0}#viewport{position:fixed;inset:var(--header-height) 0 0}#map,#fallback-canvas{position:absolute;inset:0;background:#0a1820}#fallback-canvas{object-fit:cover}.glass-panel{position:absolute;z-index:2;left:32px;top:26px;bottom:28px;width:340px;overflow:auto;padding:24px;background:linear-gradient(135deg,rgba(12,32,43,.88),rgba(5,17,25,.73));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.glass-panel::-webkit-scrollbar{width:5px}.glass-panel::-webkit-scrollbar-thumb{background:var(--line);border-radius:5px}.section-kicker{font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);margin-bottom:9px}.panel-title{margin:0;font-size:25px;letter-spacing:-1px;line-height:1.08}.panel-copy{margin:11px 0 21px;color:var(--muted);line-height:1.55;font-size:13px}.placeholder-card{padding:14px;border-radius:10px;background:rgba(102,228,227,.06);border:1px solid rgba(102,228,227,.14);color:#c8dde2;font-size:12px;line-height:1.55}.placeholder-card b{display:block;color:var(--lime);font:10px var(--mono);letter-spacing:.08em;margin-bottom:5px}.layer-manager{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}.layer-manager h2{font-size:16px;margin:0 0 12px}.layer-row{padding:11px 0;border-top:1px solid rgba(175,218,230,.10)}.layer-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.layer-label{font-size:12px;font-weight:700}.switch{position:relative;width:34px;height:19px}.switch input{opacity:0;width:0;height:0}.switch span{position:absolute;inset:0;border-radius:12px;background:#26404b;transition:.2s}.switch span::after{content:"";position:absolute;width:13px;height:13px;left:3px;top:3px;border-radius:50%;background:#94aab0;transition:.2s}.switch input:checked+span{background:#287e80}.switch input:checked+span::after{left:18px;background:var(--cyan)}.opacity{display:flex;align-items:center;gap:10px;margin-top:9px}.opacity output{width:29px;color:var(--muted);font:10px var(--mono)}input[type=range]{appearance:none;width:100%;height:3px;border-radius:4px;background:linear-gradient(90deg,var(--cyan) var(--value),#24404a var(--value));outline:none}input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border:2px solid #d9ffff;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 3px rgba(102,228,227,.16)}.map-status{position:absolute;z-index:2;right:25px;bottom:25px;padding:8px 10px;border:1px solid var(--line);border-radius:5px;background:rgba(5,15,22,.72);color:var(--cyan);font:10px var(--mono);letter-spacing:.08em}.loading-screen{position:fixed;z-index:20;inset:0;display:grid;place-content:center;justify-items:center;background:radial-gradient(circle,#12333b,#04090e 65%);transition:opacity .5s,visibility .5s}.loading-screen.is-hidden{opacity:0;visibility:hidden}.loader-orb{width:68px;height:68px;border:1px solid rgba(102,228,227,.25);border-radius:50%;display:grid;place-items:center;animation:pulse 1.5s ease-in-out infinite}.loader-orb span{width:43px;height:43px;border:2px solid transparent;border-top-color:var(--cyan);border-right-color:var(--lime);border-radius:50%;animation:spin .9s linear infinite}.loading-screen p{margin:18px 0 5px;font-weight:700}.loading-screen small{color:var(--cyan);font:10px var(--mono);letter-spacing:.13em}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{box-shadow:0 0 28px rgba(102,228,227,.22)}}.key-dialog{width:min(440px,calc(100vw - 32px));color:var(--text);padding:28px;border:1px solid var(--line);border-radius:18px;background:#0b1c26;box-shadow:0 25px 80px #0009}.key-dialog::backdrop{background:#03090cb9;backdrop-filter:blur(7px)}.key-dialog h2{margin:0;font-size:25px;letter-spacing:-.8px}.key-dialog p{color:var(--muted);line-height:1.5;font-size:13px}.key-dialog label{display:block;margin:18px 0 6px;color:var(--cyan);font:10px var(--mono);letter-spacing:.1em}.key-dialog input{width:100%;padding:11px 12px;color:var(--text);border:1px solid var(--line);border-radius:8px;background:#061118;outline:none}.key-dialog input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px #66e4e322}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}.button{border:1px solid var(--cyan);border-radius:7px;padding:10px 13px;background:var(--cyan);color:#062026;font-size:12px;font-weight:800}.button:hover{filter:brightness(1.1)}.button-quiet{border-color:var(--line);background:transparent;color:var(--text)}
@media(max-width:850px){:root{--header-height:120px}.topbar{height:var(--header-height);padding:11px 16px;flex-wrap:wrap;gap:9px}.brand{min-width:0}.tabs{order:3;width:100%;height:32px;overflow:auto;margin:0}.tab{height:32px;padding:0 9px}.glass-panel{left:12px;right:12px;top:22px;bottom:auto;width:auto;max-height:calc(100vh - 150px)}.header-actions{position:absolute;right:16px;top:22px}}

#panel-content { opacity:1; transform:translateY(0); transition:opacity .2s ease,transform .2s ease; }
#panel-content:not(.panel-in) { opacity:0; transform:translateY(7px); }

/* Flood simulator */
.mode-toggle{display:grid;grid-template-columns:1fr 1fr;padding:3px;margin-bottom:18px;border:1px solid var(--line);border-radius:9px;background:rgba(2,10,15,.42)}.mode-toggle button{padding:8px 5px;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:11px;font-weight:700;transition:.2s}.mode-toggle button:hover{color:var(--text)}.mode-toggle button.is-active{color:#062026;background:var(--cyan);box-shadow:0 4px 14px rgba(102,228,227,.18)}
.level-block{padding:15px;border:1px solid rgba(102,228,227,.17);border-radius:11px;background:linear-gradient(145deg,rgba(102,228,227,.075),rgba(4,14,21,.35))}.level-block>div:first-child{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:14px}.level-block>div>span{color:var(--muted);font-size:11px;font-weight:600}.level-block strong{font:500 22px var(--mono);color:var(--text);letter-spacing:-1px}.level-block strong small{color:var(--cyan);font-size:10px;letter-spacing:.08em}.level-block>input[type=range]{height:5px}.level-block>input[type=range]::-webkit-slider-thumb{width:17px;height:17px;box-shadow:0 0 0 4px rgba(102,228,227,.13),0 0 13px rgba(102,228,227,.35)}.level-actions{display:flex;align-items:flex-end;gap:7px;margin-top:15px}.level-actions label{flex:1;color:var(--muted);font:9px var(--mono);letter-spacing:.06em;text-transform:uppercase}.level-actions input{display:block;width:100%;height:34px;margin-top:5px;padding:0 8px;border:1px solid var(--line);border-radius:6px;outline:0;background:rgba(2,10,15,.55);color:var(--text);font:12px var(--mono)}.level-actions input:focus{border-color:var(--cyan)}.flood-play,.flood-reset{height:34px;border:1px solid var(--cyan);border-radius:6px;background:rgba(102,228,227,.12);color:var(--cyan);font-size:10px;font-weight:800;transition:.2s}.flood-play{display:flex;align-items:center;gap:6px;padding:0 10px}.flood-play:hover,.flood-reset:hover{background:var(--cyan);color:#062026}.flood-play i{width:0;height:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid currentColor}.flood-play.is-running i{width:7px;height:8px;border:0;border-left:2px solid;border-right:2px solid}.flood-reset{width:34px;font-size:17px}
.preset-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:11px 0 17px}.preset-row button{padding:8px 3px;border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.035);color:var(--muted);font-size:9px;font-weight:700;transition:.2s}.preset-row button b{display:block;margin-top:2px;color:var(--text);font:8px var(--mono)}.preset-row button:hover,.preset-row button.is-active{border-color:rgba(102,228,227,.65);background:rgba(102,228,227,.1);color:var(--cyan);transform:translateY(-1px)}
.flood-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px}.flood-stats article{min-width:0;padding:11px;border:1px solid rgba(175,218,230,.13);border-radius:9px;background:rgba(2,10,15,.34)}.flood-stats article:first-child{grid-column:1/-1}.flood-stats span{display:block;margin-bottom:7px;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.06em}.flood-stats strong{display:block;overflow:hidden;color:var(--text);font:500 15px var(--mono);white-space:nowrap;text-overflow:ellipsis}.flood-stats article:first-child strong{color:var(--cyan);font-size:20px}.flood-stats small{display:block;margin-top:4px;color:#76949d;font:8px var(--mono);letter-spacing:.035em}.model-note{display:flex;gap:8px;align-items:flex-start;margin:13px 0 0;color:var(--muted);font-size:9px;line-height:1.45}.model-note i{flex:0 0 auto;width:6px;height:6px;margin-top:3px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime)}
.flood-canvas{position:absolute;pointer-events:none;filter:drop-shadow(0 0 3px rgba(61,195,255,.62));image-rendering:auto;will-change:opacity;mix-blend-mode:normal}.flood-canvas.is-fallback{z-index:1}.glass-panel,.map-status{z-index:3}
@media(max-height:800px) and (min-width:851px){.glass-panel{padding:18px}.panel-copy{margin:8px 0 13px}.level-block{padding:11px}.layer-manager{margin-top:18px;padding-top:15px}}

/* 3D terrain explorer */
#terrain-view{position:absolute;z-index:1;inset:0;overflow:hidden;opacity:0;visibility:hidden;background:radial-gradient(circle at 70% 15%,#183a47,#07131d 50%,#03090e);transition:opacity .28s ease,visibility .28s}#terrain-view.is-active{opacity:1;visibility:visible}#terrain-view canvas{display:block;width:100%;height:100%}.is-terrain-hidden{opacity:0!important;pointer-events:none}.terrain-sky-glow{position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(40,92,112,.18),transparent 38%),radial-gradient(circle at 78% 12%,rgba(255,190,110,.12),transparent 25%);mix-blend-mode:screen}.terrain-loading{position:absolute;z-index:4;left:50%;top:50%;display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid var(--line);border-radius:8px;background:#07141ddd;color:var(--cyan);font:10px var(--mono);letter-spacing:.1em;transform:translate(-50%,-50%);transition:.3s}.terrain-loading.is-hidden{opacity:0;visibility:hidden}.mini-spinner{width:16px;height:16px;border:2px solid #66e4e333;border-top-color:var(--cyan);border-radius:50%;animation:spin .7s linear infinite}.terrain-compass{position:absolute;z-index:2;right:28px;top:25px;width:45px;height:45px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:#06121abb;color:var(--cyan);font:9px var(--mono);box-shadow:var(--shadow)}.terrain-compass i{position:absolute;top:7px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:10px solid var(--danger)}.terrain-compass b{margin-top:16px}.terrain-hint{position:absolute;z-index:2;right:25px;bottom:25px;color:#90aab2;font:9px var(--mono);letter-spacing:.1em}.terrain-readout{position:fixed;z-index:8;min-width:220px;padding:10px 12px;pointer-events:none;border:1px solid rgba(102,228,227,.35);border-radius:8px;background:#06131bea;box-shadow:0 10px 30px #0008}.terrain-readout span{display:block;color:var(--cyan);font:8px var(--mono);letter-spacing:.12em}.terrain-readout strong{display:block;margin:3px 0;color:#fff;font:500 17px var(--mono)}.terrain-readout small{color:#8fa9b1;font:8px var(--mono)}
.terrain-control{padding:14px;border:1px solid rgba(102,228,227,.16);border-radius:10px;background:rgba(2,11,16,.35)}.terrain-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;color:var(--muted);font-size:11px}.terrain-label strong{color:var(--cyan);font:500 17px var(--mono)}.terrain-control input{height:5px}.terrain-group{margin-top:16px}.control-caption{display:block;margin-bottom:7px;color:#78949d;font:9px var(--mono);letter-spacing:.09em;text-transform:uppercase}.terrain-segments,.terrain-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:3px;border:1px solid var(--line);border-radius:8px;background:#020b10aa}.terrain-segments button,.terrain-presets button{min-width:0;padding:8px 2px;border:0;border-radius:5px;background:transparent;color:var(--muted);font-size:9px;font-weight:700;transition:.2s}.terrain-segments button:hover:not(:disabled),.terrain-segments button.is-active,.terrain-presets button:hover{color:#062026;background:var(--cyan)}.terrain-segments button:disabled{cursor:not-allowed;opacity:.34}.terrain-presets{grid-template-columns:repeat(3,1fr)}.section-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:18px;padding:11px;border:1px solid var(--cyan);border-radius:8px;background:rgba(102,228,227,.1);color:var(--cyan);font-size:11px;font-weight:800;transition:.2s}.section-button:hover,.section-button.is-active{background:var(--cyan);color:#052027}.section-button i{width:18px;height:2px;background:currentColor;box-shadow:-7px -4px 0 -0.5px currentColor,7px 4px 0 -0.5px currentColor}.section-help{margin:8px 0 0;color:#78949d;font-size:9px;line-height:1.4;text-align:center}#terrain-view.is-drawing canvas{cursor:crosshair}
.profile-panel{position:absolute;z-index:3;left:404px;right:28px;bottom:24px;height:230px;padding:16px 18px 12px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(135deg,rgba(8,25,35,.94),rgba(3,12,18,.9));box-shadow:0 18px 55px #0008;backdrop-filter:blur(18px);transform:translateY(calc(100% + 35px));opacity:0;transition:transform .3s ease,opacity .3s}.has-profile .profile-panel{transform:translateY(0);opacity:1}.profile-heading{display:flex;justify-content:space-between;align-items:start;height:43px}.profile-heading>div:first-child span{display:block;color:var(--cyan);font:8px var(--mono);letter-spacing:.12em}.profile-heading strong{display:block;margin-top:3px;font:500 16px var(--mono)}#profile-stats{display:flex;gap:18px;padding-right:28px}#profile-stats span{color:#78949d;font:8px var(--mono)}#profile-stats b{display:block;margin-top:3px;color:var(--text);font-size:11px}.profile-close{position:absolute;right:13px;top:10px;width:25px;height:25px;border:0;background:transparent;color:#8fa9b1;font-size:21px}.profile-close:hover{color:var(--cyan)}#profile-chart{width:100%;height:160px;cursor:crosshair}
@media(max-width:850px){.profile-panel{left:12px;right:12px;bottom:12px;height:210px}.terrain-hint{display:none}.terrain-compass{right:13px;top:13px}}

.terrain-control.is-scale-locked input{cursor:not-allowed;opacity:.38}.terrain-scale-note{display:block;margin-top:9px;color:#78949d;font:8px/1.45 var(--mono)}.terrain-scale-note[hidden]{display:none}

/* Photorealistic city context */
.city-context-row{display:flex;align-items:center;justify-content:space-between;margin:0 0 14px;padding:12px 13px;border:1px solid rgba(102,228,227,.18);border-radius:10px;background:linear-gradient(110deg,rgba(102,228,227,.1),rgba(2,11,16,.4));transition:border-color .2s,background .2s}.city-context-row:hover{border-color:rgba(102,228,227,.42);background:rgba(102,228,227,.12)}.city-context-row strong,.city-context-row small{display:block}.city-context-row strong{font-size:12px}.city-context-row small{margin-top:3px;color:#78949d;font:8px var(--mono);letter-spacing:.07em;text-transform:uppercase}.city-context-row.is-disabled{opacity:.45}.city-switch{position:relative;width:38px;height:21px;flex:0 0 auto}.city-switch input{position:absolute;opacity:0;pointer-events:none}.city-switch span{position:absolute;inset:0;border-radius:15px;background:#263e49;box-shadow:inset 0 0 0 1px #ffffff12;transition:.22s}.city-switch span::after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:#8ba2a9;transition:.22s}.city-switch input:checked+span{background:#287e80;box-shadow:0 0 15px #66e4e333}.city-switch input:checked+span::after{transform:translateX(17px);background:#bfffff}.city-switch input:focus-visible+span{outline:2px solid var(--cyan);outline-offset:3px}.city-notice{display:flex;align-items:flex-start;gap:8px;margin:-4px 0 14px;padding:10px;border:1px solid rgba(255,169,89,.3);border-radius:8px;background:rgba(255,142,54,.08);color:#ffd1a6;font-size:9px;line-height:1.45}.city-notice[hidden]{display:none}.city-notice i{display:grid;place-items:center;width:15px;height:15px;flex:0 0 auto;border-radius:50%;background:#ff9b4a;color:#1c0c03;font:800 9px var(--mono)}.city-stream-chip,.city-attribution{position:absolute;z-index:3;pointer-events:none;border:1px solid var(--line);background:rgba(5,15,22,.78);backdrop-filter:blur(10px);font:9px var(--mono);letter-spacing:.07em}.city-stream-chip{left:50%;top:24px;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:7px;color:var(--cyan);opacity:0;visibility:hidden;transform:translate(-50%,-5px);transition:opacity .25s,transform .25s,visibility .25s}.city-stream-chip.is-visible{opacity:1;visibility:visible;transform:translate(-50%,0)}.city-stream-chip .mini-spinner{width:12px;height:12px}.city-attribution{right:25px;bottom:47px;max-width:420px;padding:6px 8px;border-radius:5px;color:#b3c6cc;letter-spacing:0;line-height:1.35}
.terrain-layer-stack{display:grid;grid-template-columns:1fr 1fr;gap:6px}.terrain-layer-stack .city-context-row{min-width:0;padding:10px;margin-bottom:9px}.terrain-layer-stack .city-context-row strong{font-size:10px}.terrain-layer-stack .city-context-row small{font-size:7px}.height-ramp{margin:0 0 13px;padding:9px 11px;border:1px solid rgba(175,218,230,.12);border-radius:8px;background:rgba(2,11,16,.35)}.height-ramp .control-caption{margin-bottom:6px}.height-ramp>i{display:block;height:7px;border-radius:5px;background:linear-gradient(90deg,#092a40 0%,#2eb86b 20%,#ff7f1f 55%,#fff4c2 100%);box-shadow:0 0 12px rgba(255,135,44,.24)}.height-ramp>div{display:flex;justify-content:space-between;margin-top:4px;color:#78949d;font:7px var(--mono)}.height-ramp b{font-weight:500}

/* Drainage & low-point analysis */
.drainage-mode .layer-row[data-layer-row="color_relief"],.drainage-mode .layer-row[data-layer-row="hillshade"]{display:none}.drain-summary{display:grid;grid-template-columns:.7fr 1.35fr 1fr;gap:6px;margin-bottom:10px}.drain-summary article{min-width:0;padding:10px 8px;border:1px solid rgba(102,228,227,.15);border-radius:8px;background:linear-gradient(145deg,rgba(102,228,227,.07),rgba(2,10,15,.38))}.drain-summary span{display:block;margin-bottom:5px;color:var(--muted);font:8px var(--mono);letter-spacing:.07em;text-transform:uppercase}.drain-summary strong{display:block;overflow:hidden;color:var(--cyan);font:500 13px var(--mono);white-space:nowrap;text-overflow:ellipsis}.severity-legend{display:flex;justify-content:space-between;gap:5px;margin-bottom:10px;color:#829ca4;font:7px var(--mono);text-transform:uppercase}.severity-legend span{display:flex;align-items:center;gap:4px}.severity-legend i{width:6px;height:6px;border-radius:50%;box-shadow:0 0 7px currentColor}.severity-legend .low{color:#66e4e3;background:#66e4e3}.severity-legend .moderate{color:#ffc857;background:#ffc857}.severity-legend .high{color:#ff6f61;background:#ff6f61}.sink-list{display:flex;flex-direction:column;gap:5px;max-height:292px;padding-right:3px;overflow:auto;scrollbar-width:thin;scrollbar-color:#31525c transparent}.sink-card{position:relative;display:grid;grid-template-columns:25px minmax(0,1fr) auto 46px;align-items:center;gap:7px;width:100%;padding:7px;border:1px solid rgba(175,218,230,.12);border-radius:8px;background:rgba(2,10,15,.35);color:var(--text);text-align:left;transition:border-color .2s,background .2s,transform .2s}.sink-card::before{content:"";position:absolute;left:-1px;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--severity);opacity:.65}.sink-card:hover,.sink-card.is-selected{border-color:color-mix(in srgb,var(--severity) 62%,transparent);background:rgba(22,49,58,.72);transform:translateX(2px)}.sink-rank{display:grid;width:22px;height:22px;place-items:center;border:1px solid color-mix(in srgb,var(--severity) 60%,transparent);border-radius:50%;color:var(--severity);font:9px var(--mono)}.sink-main{min-width:0}.sink-main strong{display:block;font-size:10px}.sink-main small{display:block;overflow:hidden;margin-top:2px;color:#718e97;font:7px var(--mono);white-space:nowrap;text-overflow:ellipsis}.severity-chip{padding:3px 5px;border:1px solid currentColor;border-radius:9px;font:7px var(--mono);text-transform:uppercase}.severity-chip.low{color:#66e4e3}.severity-chip.moderate{color:#ffc857}.severity-chip.high{color:#ff6f61}.sink-depth{color:var(--severity);font:500 10px var(--mono);text-align:right}.sink-depth small{font-size:7px}.sink-marker{position:absolute;z-index:2;width:30px;height:30px;padding:0;border:1px solid currentColor;border-radius:50% 50% 50% 4px;background:#081a22eb;color:#66e4e3;box-shadow:0 4px 14px #0009,0 0 0 3px color-mix(in srgb,currentColor 15%,transparent);transform:translate(-50%,-85%) rotate(-45deg) scale(var(--marker-scale));transform-origin:50% 85%;transition:filter .2s,box-shadow .2s;cursor:pointer}.sink-marker span{display:grid;width:100%;height:100%;place-items:center;font:700 9px var(--mono);transform:rotate(45deg)}.sink-marker.moderate{color:#ffc857}.sink-marker.high{color:#ff6f61}.sink-marker:hover,.sink-marker.is-selected{z-index:4;filter:brightness(1.25);box-shadow:0 5px 18px #000b,0 0 0 5px color-mix(in srgb,currentColor 25%,transparent),0 0 22px currentColor}.sink-marker.is-pulsing{animation:sinkPulse .72s ease-in-out infinite}.sink-marker.is-fallback{z-index:2}@keyframes sinkPulse{50%{filter:brightness(1.5);box-shadow:0 5px 18px #000b,0 0 0 11px transparent,0 0 25px currentColor}}.drain-flow-shimmer{position:absolute;z-index:1;pointer-events:none;opacity:.72;filter:brightness(1.6) drop-shadow(0 0 3px #25e9ff);mix-blend-mode:screen}.drain-flow-shimmer.is-fallback{z-index:1}.fallback-detail{position:absolute;z-index:5;right:28px;top:28px}.sink-detail{position:relative;min-width:245px;padding:14px;border:1px solid color-mix(in srgb,var(--severity) 65%,transparent);border-radius:10px;background:#071923f2;color:#edf8fa;box-shadow:0 16px 45px #000a;font-family:Manrope,sans-serif}.sink-detail>span{display:block;color:var(--severity);font:8px var(--mono);letter-spacing:.1em}.sink-detail>strong{display:block;margin:4px 0 10px;font-size:14px}.sink-detail dl{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:0}.sink-detail dl div{padding:7px;border-radius:6px;background:#ffffff08}.sink-detail dt{color:#78949d;font:7px var(--mono);text-transform:uppercase}.sink-detail dd{margin:3px 0 0;color:#fff;font:10px var(--mono)}.detail-close{position:absolute;right:7px;top:5px;border:0;background:transparent;color:#91aab2;font-size:18px}.detail-close:hover{color:#fff}.gm-style-iw-c{padding:0!important;border:1px solid rgba(102,228,227,.2)!important;border-radius:11px!important;background:transparent!important;box-shadow:0 16px 45px #000a!important}.gm-style-iw-d{overflow:visible!important}.gm-style-iw-tc{filter:invert(.9)}.gm-ui-hover-effect{display:none!important}
@media(max-height:900px) and (min-width:851px){.drainage-mode .glass-panel{padding:17px}.drainage-mode .panel-copy{margin:7px 0 10px}.drainage-mode .sink-list{max-height:225px}.drainage-mode .layer-manager{margin-top:12px;padding-top:11px}.drainage-mode .layer-row{padding:7px 0}.drainage-mode .opacity{margin-top:5px}}
.drain-flow-shimmer{transition:opacity .26s}.drain-flow-shimmer.is-hidden{opacity:0}

/* Cut / fill earthwork */
.cutfill-mode .glass-panel{width:360px}.cutfill-actions{display:grid;grid-template-columns:1fr 72px;gap:7px}.cutfill-actions button,.grade-actions button{height:37px;border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.04);color:var(--text);font-size:10px;font-weight:800;transition:.2s}.cutfill-actions button:hover:not(:disabled){border-color:var(--cyan);color:var(--cyan);transform:translateY(-1px)}.cutfill-actions button:disabled{opacity:.32;cursor:not-allowed}.cutfill-actions .cutfill-primary{display:flex;align-items:center;justify-content:center;gap:8px;border-color:rgba(102,228,227,.52);background:rgba(102,228,227,.12);color:var(--cyan)}.cutfill-primary i{position:relative;width:13px;height:13px;border:1px dashed currentColor;transform:rotate(45deg)}.cutfill-primary.is-active{background:var(--cyan);color:#052027;box-shadow:0 0 20px rgba(102,228,227,.2)}.draw-help{margin:7px 0 11px;color:#78949d;font-size:8px;line-height:1.45;text-align:center}.clip-note{display:flex;align-items:center;gap:7px;margin:0 0 10px;padding:8px;border:1px solid rgba(255,200,87,.3);border-radius:7px;background:rgba(255,200,87,.08);color:#e6c97d;font-size:9px}.clip-note[hidden]{display:none}.clip-note i{display:grid;flex:0 0 17px;height:17px;place-items:center;border:1px solid currentColor;border-radius:50%;font:9px var(--mono)}
.grade-card{padding:13px;border:1px solid rgba(102,228,227,.17);border-radius:10px;background:linear-gradient(145deg,rgba(102,228,227,.075),rgba(4,14,21,.35));transition:.25s}.grade-card.is-disabled{opacity:.38;pointer-events:none;filter:saturate(.4)}.grade-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:12px}.grade-heading>span{color:var(--muted);font-size:10px;font-weight:700}.grade-heading span small{display:block;margin-top:3px;color:#6f8d96;font:7px var(--mono);letter-spacing:.08em}.grade-heading strong{color:#fff;font:500 20px var(--mono)}.grade-heading strong small{color:var(--cyan);font-size:9px}.grade-card>input{height:5px}.grade-actions{display:grid;grid-template-columns:1fr 1.18fr;align-items:end;gap:7px;margin-top:12px}.grade-actions label{color:var(--muted);font:8px var(--mono);letter-spacing:.05em;text-transform:uppercase}.grade-actions input{display:block;width:100%;height:34px;margin-top:4px;padding:0 8px;border:1px solid var(--line);border-radius:6px;outline:0;background:#020b1099;color:#fff;font:11px var(--mono)}.grade-actions input:focus{border-color:var(--cyan)}.grade-actions button{height:34px;border-color:rgba(201,255,103,.48);background:rgba(201,255,103,.08);color:var(--lime)}.grade-actions button:hover{background:var(--lime);color:#13230a}
.cutfill-legend{display:flex;justify-content:space-between;margin:11px 1px 9px;color:#76929b;font:7px var(--mono);text-transform:uppercase}.cutfill-legend span{display:flex;align-items:center;gap:4px}.cutfill-legend i{width:7px;height:7px;border-radius:2px;box-shadow:0 0 6px currentColor}.cutfill-legend .cut{color:#ff625b;background:#ff625b}.cutfill-legend .fill{color:#3b9bff;background:#3b9bff}.cutfill-legend .neutral{color:#d8ffe2;background:#d8ffe2}
.cutfill-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px}.cutfill-stats article{min-width:0;padding:9px 10px;border:1px solid rgba(175,218,230,.12);border-radius:8px;background:rgba(2,10,15,.38)}.cutfill-stats article.site{grid-column:1/-1}.cutfill-stats article.cut{border-left:2px solid #ff625b}.cutfill-stats article.fill{border-left:2px solid #3b9bff}.cutfill-stats span{display:block;margin-bottom:5px;color:var(--muted);font:8px var(--mono);letter-spacing:.06em;text-transform:uppercase}.cutfill-stats strong{display:block;overflow:hidden;color:#fff;font:500 14px var(--mono);white-space:nowrap;text-overflow:ellipsis}.cutfill-stats .site strong{color:var(--cyan);font-size:17px}.cutfill-stats small{display:block;margin-top:3px;color:#6f8c95;font:7px var(--mono);letter-spacing:.04em}.cutfill-stats .is-export{color:#ff7b70}.cutfill-stats .is-import{color:#55aaff}
.balance-wrap{margin-top:9px;padding:9px 10px;border:1px solid rgba(175,218,230,.11);border-radius:8px;background:#020b1066}.balance-label{display:flex;justify-content:space-between;color:#708c95;font:7px var(--mono)}.balance-label b{color:#9ab1b7;font-weight:500}.balance-track{position:relative;width:112px;height:5px;margin:9px auto 1px;border-radius:4px;background:linear-gradient(90deg,#ff625b,#d8ffe2 50%,#3b9bff)}.balance-track i{position:absolute;left:50%;top:-3px;width:1px;height:11px;background:#fff9}.balance-track span{position:absolute;left:calc(50% - 4px);top:-2px;width:9px;height:9px;border:2px solid #fff;border-radius:50%;background:#071119;box-shadow:0 0 8px #fff8;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.existing-stats{display:grid;grid-template-columns:1.25fr repeat(3,1fr);align-items:center;gap:5px;margin-top:8px;padding:8px 9px;border-top:1px solid rgba(175,218,230,.1)}.existing-stats>span{color:#79949c;font:8px var(--mono);text-transform:uppercase}.existing-stats div{text-align:right}.existing-stats b{display:block;color:#dcebee;font:500 9px var(--mono)}.existing-stats small{color:#5f7b84;font:6px var(--mono)}
.cutfill-canvas{position:absolute;pointer-events:none;image-rendering:auto;filter:saturate(1.12) drop-shadow(0 0 2px #0008);mix-blend-mode:screen}.cutfill-canvas.is-fallback{z-index:1}.cutfill-drawing{position:absolute;z-index:2;inset:0;pointer-events:auto;cursor:default}.cutfill-drawing.is-drawing{cursor:crosshair}.cutfill-drawing:not(.is-drawing){cursor:grab}
@media(max-height:900px) and (min-width:851px){.cutfill-mode .glass-panel{padding:16px}.cutfill-mode .panel-copy{margin:7px 0 10px}.cutfill-mode .grade-card{padding:10px}.cutfill-mode .layer-manager{margin-top:12px;padding-top:10px}.cutfill-mode .layer-row{padding:6px 0}.cutfill-mode .opacity{margin-top:4px}.cutfill-mode .existing-stats{margin-top:5px;padding:5px 8px}}
.reset-view{position:absolute;z-index:4;right:28px;bottom:70px;display:flex;align-items:center;gap:7px;height:36px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:#071923e8;color:var(--text);box-shadow:var(--shadow);font-size:10px;font-weight:700;backdrop-filter:blur(12px);transition:.2s}.reset-view:hover{border-color:var(--cyan);color:var(--cyan);transform:translateY(-1px)}