:root { color-scheme: dark; --bg:#0b1020; --panel:#151c2f; --line:#29334b; --text:#f6f7fb; --muted:#aab4ca; --accent:#ff5f21; --accent-dark:#55200e; --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,select { 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 #ff5f21; 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; }.section-note { color:var(--muted); font-size:.82rem; }
.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;
}


/* Scrollable administration logs */
.log-table {
    max-height: 420px;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
}

.log-table::-webkit-scrollbar {
    width: 8px;
}

.log-table::-webkit-scrollbar-track {
    background: #0d1425;
    border-radius: 8px;
}

.log-table::-webkit-scrollbar-thumb {
    background: #ff5f21;
    border-radius: 8px;
}

.log-table::-webkit-scrollbar-thumb:hover {
    background: #ff7a47;
}

.activity-entry { padding:0; background:#0f1729; border-radius:10px; }
.activity-entry summary { display:grid; gap:3px; padding:12px; cursor:pointer; list-style-position:inside; }
.activity-entry summary:hover { background:#141e33; border-radius:10px; }
.activity-entry[open] summary { border-bottom:1px solid var(--line); border-radius:10px 10px 0 0; }
.activity-entry summary span { color:var(--muted); font-size:.78rem; }
.activity-details { grid-template-columns:minmax(95px,.35fr) 1fr; margin:0; padding:14px; }
.activity-details dt,.activity-details dd { padding:6px 0; border-bottom:1px solid rgba(255,255,255,.05); overflow-wrap:anywhere; }
.activity-entry>p { margin:0; padding:0 14px 14px; }

.user-account { align-items:flex-start !important; }
.account-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.account-actions form { margin:0; }
.account-actions button { min-height:auto; padding:8px 11px; font-size:.78rem; }
.search-history { display:grid; gap:12px; }
.search-summary { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; }
.search-summary p { color:var(--muted); margin:5px 0 0; font-size:.78rem; }
.review-form { display:grid; grid-template-columns:1fr 1fr auto; gap:10px; align-items:end; margin-top:16px; }
.review-form input,.review-form select { display:block; width:100%; min-height:44px; margin-top:5px; padding:9px 11px; color:var(--text); background:#0d1425; border:1px solid #34405b; border-radius:10px; }
.map-link.compact { display:inline-block; margin-top:6px; }
@media (max-width:620px) { .user-bar { flex-wrap:wrap; justify-content:flex-start; } .user-account { display:grid !important; } .account-actions { justify-content:flex-start; } .review-form { grid-template-columns:1fr; } .search-summary { display:grid; } .activity-details { grid-template-columns:1fr; } .activity-details dt { padding-bottom:0; border-bottom:0; } }
.api-key-list { display:grid; gap:10px; margin-top:16px; }
.api-key-list article { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:14px; background:#0f1729; border-radius:11px; }
.api-key-list span { display:block; color:var(--muted); font-size:.78rem; margin-top:3px; }
.key-label-form { display:flex; gap:8px; margin-top:9px; }
.key-label-form input { min-width:0; padding:8px 10px; }
.key-label-form button { min-height:auto; padding:8px 11px; white-space:nowrap; }
@media (max-width:620px) { .api-key-list article { display:grid; } }
.health-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.health-grid .panel { margin:0; }
.health-grid p { color:var(--muted); margin:8px 0 0; }
.health-value { display:block; color:var(--accent); font-size:1.15rem; margin-top:12px; }
@media (max-width:560px) { .health-grid { grid-template-columns:1fr; } }