:root{--c-ink: #14242f;--c-ink-soft: #4a5d6a;--c-bg: #eef2f5;--c-surface: #ffffff;--c-line: #d7dee4;--c-primary: #0a3d62;--c-primary-deep: #072c47;--c-danger: #b3261e;--c-danger-bg: #fbe9e7;--c-caution: #8a5a00;--c-caution-bg: #fdf3d7;--c-info: #0b5394;--c-info-bg: #e3eef9;--c-shallow: #2e9e5b;--c-chest: #e0a800;--c-deep: #c0392b;--radius: 12px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--shadow: 0 1px 3px rgba(10, 28, 42, .12);--font-urdu: "Noto Nastaliq Urdu", "Noto Naskh Arabic", "Urdu Typesetting", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-latin: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--c-bg);color:var(--c-ink);-webkit-font-smoothing:antialiased}:lang(ur) body,body:lang(ur){font-family:var(--font-urdu);line-height:1.9}:lang(en) body,body:lang(en){font-family:var(--font-latin);line-height:1.5}body.no-scroll{overflow:hidden}#app{display:flex;flex-direction:column;min-height:100dvh}button{font:inherit;cursor:pointer}:focus-visible{outline:3px solid #4d90fe;outline-offset:2px}.topbar{display:flex;align-items:center;gap:var(--space-3);background:linear-gradient(180deg,var(--c-primary),var(--c-primary-deep));color:#fff;padding-block:var(--space-2);padding-inline:max(var(--space-4),env(safe-area-inset-left)) max(var(--space-4),env(safe-area-inset-right));padding-top:max(var(--space-2),env(safe-area-inset-top));min-height:56px}.brand-name{font-family:var(--font-latin);font-weight:700;font-size:1.05rem;letter-spacing:.02em;white-space:nowrap}.reach-title{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;line-height:1.5}.reach-river{font-size:.78rem;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.reach-name{font-weight:700;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.lang-toggle{background:#ffffff1f;color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:6px 14px;font-size:.85rem;min-height:36px;white-space:nowrap}.lang-toggle:hover{background:#ffffff38}.content{flex:1;display:flex;flex-direction:column;gap:var(--space-3);width:100%;max-width:960px;margin-inline:auto;padding-block:var(--space-3) var(--space-4);padding-inline:max(var(--space-3),env(safe-area-inset-left)) max(var(--space-3),env(safe-area-inset-right))}.warnings{display:flex;flex-direction:column;gap:var(--space-2)}.banner{display:flex;align-items:flex-start;gap:var(--space-3);border-radius:var(--radius);padding:var(--space-3) var(--space-4);box-shadow:var(--shadow);border-inline-start:5px solid currentColor}.banner-danger{background:var(--c-danger-bg);color:var(--c-danger)}.banner-caution{background:var(--c-caution-bg);color:var(--c-caution)}.banner-info{background:var(--c-info-bg);color:var(--c-info)}.banner-icon{flex:none;width:24px;height:24px;margin-top:2px}.banner-icon svg{width:100%;height:100%}.banner-body{display:flex;flex-direction:column;min-width:0}.banner-label{font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em}.banner-text{color:var(--c-ink);overflow-wrap:break-word}.status{display:flex;align-items:center;gap:var(--space-3);background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--radius);padding:var(--space-3) var(--space-4);box-shadow:var(--shadow)}.status-icon{flex:none;width:28px;height:28px;color:var(--c-primary)}.status-icon svg{width:100%;height:100%}.status-body{display:flex;flex-direction:column;min-width:0}.status-main{font-weight:600}.status-sub{font-size:.85rem;color:var(--c-ink-soft)}.scene{flex:1;min-height:260px;border-radius:var(--radius);background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.16),transparent 60%),linear-gradient(180deg,#19567f,#0a3d62 55%,#093251);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;padding:var(--space-5)}.scene-message{text-align:center;color:#e8f1f8;max-width:32ch}.scene-icon{width:44px;height:44px;margin-inline:auto;opacity:.85}.scene-icon svg{width:100%;height:100%}.scene-title{font-weight:700;font-size:1.05rem;margin:var(--space-3) 0 var(--space-1)}.scene-sub{margin:0;font-size:.9rem;opacity:.8}.legend{background:var(--c-surface);border-top:1px solid var(--c-line);padding-block:var(--space-3) max(var(--space-3),env(safe-area-inset-bottom));padding-inline:max(var(--space-4),env(safe-area-inset-left)) max(var(--space-4),env(safe-area-inset-right))}.legend-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-4);max-width:960px;margin-inline:auto}.legend-title{font-weight:700;font-size:.85rem;color:var(--c-ink-soft)}.legend-chip{display:inline-flex;align-items:center;gap:var(--space-2);font-size:.85rem}.swatch{width:16px;height:16px;border-radius:4px;border:1px solid rgba(0,0,0,.15)}.swatch-shallow{background:var(--c-shallow)}.swatch-chest{background:var(--c-chest)}.swatch-deep{background:var(--c-deep)}.swatch-hazard{background:repeating-linear-gradient(45deg,#1d1d1d 0,#1d1d1d 4px,#555 4px,#555 8px)}.legend-note{max-width:960px;margin:var(--space-2) auto 0;font-size:.8rem;color:var(--c-ink-soft)}.safety{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:linear-gradient(180deg,#0d4a77,#072c47);display:flex;align-items:center;justify-content:center;padding:var(--space-4);overflow-y:auto}.safety-card{width:100%;max-width:480px;color:#f1f6fa;text-align:center;padding:var(--space-5) var(--space-2)}.safety-brand{font-weight:700;font-size:1.3rem;letter-spacing:.03em;margin-bottom:var(--space-5)}.safety-lines{list-style:none;margin:0 0 var(--space-6);padding:0;display:flex;flex-direction:column;gap:var(--space-5)}.safety-line{display:flex;align-items:center;gap:var(--space-4);text-align:start;font-size:1.05rem}.safety-icon{flex:none;width:48px;height:48px;color:#ffd166}.safety-icon svg{width:100%;height:100%}.safety-accept{width:100%;min-height:56px;border:none;border-radius:var(--radius);background:#ffd166;color:#3a2c00;font-weight:700;font-size:1.1rem}.safety-accept:hover{background:#ffdc85}@media(min-width:768px){.content{padding-block:var(--space-4) var(--space-5);padding-inline:var(--space-5);gap:var(--space-4)}.scene{min-height:340px}.reach-name{font-size:1.1rem}}@media(min-width:1280px){.content,.legend-row,.legend-note{max-width:1100px}}@media(min-width:768px)and (max-height:860px){.scene{min-height:240px}}@media(max-height:700px){.scene{min-height:180px;padding:var(--space-4)}}@media(prefers-reduced-motion:no-preference){.banner-danger .banner-icon{animation:pulse 2.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}}