:root { color-scheme: dark; --bg:#0b1020; --panel:#151c2f; --line:#29334b; --text:#f6f7fb; --muted:#aab4ca; --accent:#45d6a8; --accent-dark:#063f31; --danger:#ff7b86; }
* { box-sizing:border-box; }
body { margin:0; background:radial-gradient(circle at top,#182442 0,var(--bg) 34rem); color:var(--text); font:16px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.shell { width:min(100% - 28px,680px); margin:auto; padding:34px 0 max(28px,env(safe-area-inset-bottom)); }
header { margin:0 4px 24px; }
.eyebrow { color:var(--accent); font-size:.75rem; font-weight:800; letter-spacing:.16em; margin:0 0 7px; }
h1 { font-size:clamp(2rem,8vw,3.1rem); line-height:1.05; margin:0; letter-spacing:-.04em; }
.intro { color:var(--muted); margin:10px 0 0; }
.panel,.alert-card,.empty { background:rgba(21,28,47,.94); border:1px solid var(--line); border-radius:20px; box-shadow:0 15px 40px rgba(0,0,0,.2); margin:14px 0; padding:20px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.section-heading>div,.alert-top>div { display:flex; align-items:center; gap:10px; }
h2,h3 { margin:0; }
h2 { font-size:1.2rem; }
.step,.alert-number { display:grid; place-items:center; width:29px; height:29px; border-radius:50%; background:var(--accent-dark); color:var(--accent); font-size:.82rem; font-weight:800; }
.status { color:var(--muted); font-size:.8rem; }
.status.ready { color:var(--accent); }
button,input { font:inherit; }
button { border:0; border-radius:13px; min-height:50px; padding:12px 16px; font-weight:750; cursor:pointer; }
button:disabled { opacity:.65; cursor:wait; }
.wide { width:100%; }
.primary,.search { background:var(--accent); color:#061610; }
.search { margin-top:19px; font-size:1.05rem; }
.secondary { background:#252f46; color:var(--text); border:1px solid #35415d; }
.divider { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:.76rem; margin:15px 0; }
.divider::before,.divider::after { content:""; height:1px; background:var(--line); flex:1; }
.coordinates { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:11px; }
label,legend { color:var(--muted); font-size:.82rem; font-weight:650; }
input[type="number"] { display:block; width:100%; min-height:47px; margin-top:6px; padding:10px 12px; color:var(--text); background:#0d1425; border:1px solid #34405b; border-radius:11px; }
fieldset { border:0; padding:0; margin:18px 0 0; }
.filters { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.filters label { padding:9px 11px; border:1px solid #34405b; border-radius:999px; background:#10182b; color:var(--text); }
.filters input { accent-color:var(--accent); }
.hint,.privacy { color:var(--muted); font-size:.75rem; margin:10px 2px 0; }
.message { border-radius:12px; padding:13px 15px; margin:14px 0; background:#1c2940; }
.message.success { color:#a4f4d8; background:#12392f; }
.message.error { color:#ffd3d6; background:#4b2027; }
.hidden { display:none; }
.results-heading,.alert-top { display:flex; align-items:center; justify-content:space-between; }
.results-heading { margin:27px 3px 9px; }
.results-heading p { color:var(--muted); margin:0; font-size:.8rem; }
.alert-top strong { color:var(--accent); }
.alert-card.police-alert { border-color:#f04455; box-shadow:inset 5px 0 0 #f04455,0 15px 40px rgba(0,0,0,.2); }
.alert-card.police-alert .alert-number { background:#5b1720; color:#ff9ca5; }
.alert-card.police-alert .alert-top strong { color:#ff7b86; }
.alert-card.other-alert { border-color:#d97922; box-shadow:inset 5px 0 0 #e88932,0 15px 40px rgba(0,0,0,.2); }
.alert-card.other-alert .alert-number { background:#513015; color:#ffc078; }
.alert-card.other-alert .alert-top strong { color:#ffad5c; }
.place { color:var(--muted); margin:10px 0 14px; }
dl { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:0; }
dl div { background:#0f1729; border-radius:10px; padding:9px 10px; }
dt { color:var(--muted); font-size:.69rem; text-transform:uppercase; letter-spacing:.05em; }
dd { margin:2px 0 0; font-size:.83rem; overflow-wrap:anywhere; }
.description { border-left:3px solid var(--accent); padding-left:11px; }
.map-link { display:block; text-align:center; margin-top:15px; padding:11px; color:var(--accent); border:1px solid #2c8c71; border-radius:11px; text-decoration:none; font-weight:700; }
footer { color:var(--muted); font-size:.72rem; text-align:center; margin:27px 12px 0; }
.user-bar { display:flex; justify-content:flex-end; align-items:center; gap:10px; color:var(--muted); font-size:.78rem; margin-bottom:22px; }
.user-bar form { margin:0; }.user-bar button { min-height:auto; padding:6px 10px; color:var(--text); background:#252f46; }.user-bar a { color:var(--accent); }
.auth-page { min-height:100vh; display:grid; place-items:center; padding:20px; }
.auth-card { width:min(100%,430px); padding:30px; background:rgba(21,28,47,.97); border:1px solid var(--line); border-radius:22px; box-shadow:0 24px 70px rgba(0,0,0,.35); }
.auth-card h1 { font-size:2.3rem; }.auth-card form { display:grid; gap:15px; margin-top:24px; }
.auth-card input { display:block; width:100%; min-height:50px; margin-top:6px; padding:11px 13px; color:var(--text); background:#0d1425; border:1px solid #34405b; border-radius:11px; }
.auth-link { display:block; margin-top:20px; color:var(--accent); text-align:center; }
.auth-link.left { text-align:left; }.admin-add { display:grid; gap:14px; margin-top:18px; }.admin-add input { display:block; width:100%; min-height:47px; margin-top:6px; padding:10px 12px; color:var(--text); background:#0d1425; border:1px solid #34405b; border-radius:11px; }.user-list>div { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:14px 0; border-bottom:1px solid var(--line); }.user-list small { display:block; color:var(--muted); margin-top:3px; }.danger { min-height:auto; background:#5b1720; color:#ffd3d6; }
@media (max-width:420px) { .coordinates,dl { grid-template-columns:1fr; } .shell { width:min(100% - 20px,680px); padding-top:24px; } .panel,.alert-card,.empty { padding:17px; border-radius:17px; } }
.usage-grid { display:grid; gap:10px; margin-top:16px; }.usage-grid>div,.log-table>div { display:grid; gap:3px; padding:12px; background:#0f1729; border-radius:10px; }.usage-grid span,.log-table span { color:var(--muted); font-size:.78rem; }.usage-grid progress { width:100%; margin-top:5px; accent-color:var(--accent); }.log-table { display:grid; gap:8px; margin-top:16px; }
.fixed-radius { display:flex; justify-content:space-between; align-items:center; padding:13px 14px; background:#0d1425; border:1px solid #34405b; border-radius:11px; }
.fixed-radius span { color:var(--muted); }
.fixed-radius strong { color:var(--accent); }

.alert-card.mobile-camera-alert {
    border:2px solid #ff2438;
    box-shadow:inset 6px 0 0 #ff2438,
               0 0 24px rgba(255,36,56,.22);
}
.alert-card.mobile-camera-alert .alert-number {
    background:#ff2438;
    color:#fff;
}
.alert-card.mobile-camera-alert .alert-top strong,
.alert-card.mobile-camera-alert h3 {
    color:#ff7b86;
}