:root { --blue:#009FE3; --pad:12px; }
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#f5f7fb;color:#222}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#fff;border-bottom:4px solid var(--blue)}
.topbar .brand{display:flex;gap:10px;align-items:center}
.logo{height:36px}
.panel{padding:10px 16px;background:#e9f6ff;border-bottom:1px solid #d7efff}
.panel form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.filters{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:8px}
.split{display:grid;grid-template-columns:1fr 360px;gap:12px;padding:12px}
#map{height:70vh;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
#list{background:#fff;border-radius:8px;padding:10px;overflow:auto;max-height:70vh;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.item{padding:8px 0;border-bottom:1px dashed #eee}
.item:last-child{border-bottom:0}
.item h4{margin:0 0 4px;font-size:14px}
.item p{margin:0 0 3px;color:#444;font-size:12px}
.warn{color:#b00}
.logout{border:1px solid var(--blue);padding:6px 10px;border-radius:4px;color:var(--blue);background:#fff;cursor:pointer}
.logout:hover{background:var(--blue);color:#fff}
button{background:var(--blue);color:#fff;border:0;border-radius:4px;padding:8px 12px;cursor:pointer}
input,select{padding:8px;border:1px solid #cbd5e1;border-radius:4px}

/* login */
body.login-page{display:flex;align-items:center;justify-content:center;height:100vh;background:linear-gradient(180deg,#e9f6ff,#fff)}
.login-container{background:#fff;padding:28px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.08);width:min(380px,90vw);text-align:center}
.login-container .logo{height:42px;margin-bottom:12px}
.login-container input{width:100%;margin:8px 0}
.login-container button{width:100%;margin-top:6px}
.error{color:#b00;margin:8px 0 0}