*{box-sizing:border-box}html,body{height:100%;margin:0;font:15px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#111827;background:#f8fafc}
.hidden{display:none!important}.muted{color:#64748b}.small{font-size:12px}.err{color:#b91c1c;min-height:1.2em}
#login{display:flex;align-items:center;justify-content:center;height:100%}
#loginForm{width:min(340px,90vw);display:flex;flex-direction:column;gap:10px}
h1{margin:0;color:#0f766e;font-size:34px}
input,select,button{font:inherit;padding:10px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff}
button{cursor:pointer;background:#0f766e;color:#fff;border:0}button.ghost{background:#fff;color:#0f766e;border:1px solid #0f766e}button.danger{background:#fff;color:#b91c1c;border:1px solid #fca5a5}
button:disabled{opacity:.5}
#app{display:flex;height:100%}#side{width:360px;max-width:42vw;display:flex;flex-direction:column;background:#fff;border-right:1px solid #e2e8f0;z-index:2}
#side header{display:flex;gap:6px;padding:10px}#side header select{flex:1}#side header button{background:#fff;color:#334155;border:1px solid #cbd5e1;width:42px;padding:0}
nav{display:flex;border-bottom:1px solid #e2e8f0}nav button{flex:1;background:#fff;color:#475569;border-radius:0;padding:10px}nav button.on{color:#0f766e;box-shadow:inset 0 -3px #0f766e;font-weight:600}
#panel{flex:1;overflow:auto;padding:4px 0}
main{flex:1;position:relative}#map{position:absolute;inset:0}
.row{display:flex;gap:12px;align-items:center;padding:10px 14px;border-bottom:1px solid #f1f5f9;cursor:pointer}.row:hover{background:#f8fafc}
.row .t{flex:1;min-width:0}.row .t b,.row .t span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row .t span{font-size:13px;color:#64748b}
.row .r{font-size:12px;color:#64748b;text-align:right}.mv{color:#15803d!important}
.av{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px}
.sec{padding:14px}.sec h3{margin:.2em 0}.sec .line{display:flex;gap:8px;align-items:center;margin:8px 0}.sec input{flex:1;min-width:0}
.tg{display:flex;align-items:center;gap:10px;padding:6px 0}.tg .n{flex:1}.tg label{display:flex;flex-direction:column;align-items:center;font-size:11px;color:#64748b;width:52px}
.pin{position:relative}.mk{width:46px;height:46px;border-radius:50%;border:4px solid #0f766e;background:#fff center/cover;box-shadow:0 2px 6px #0005;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px}
.mk.moving{border-color:#16a34a}.mk.stale{border-color:#9ca3af}.mk.sel{width:56px;height:56px}
.lbl{position:absolute;top:100%;left:50%;transform:translateX(-50%);font-size:11px;font-weight:700;white-space:nowrap;text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff}
.spd{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:#16a34a;color:#fff;border-radius:9px;padding:0 6px;font-size:11px;font-weight:700;white-space:nowrap}
#toast{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);background:#0f172a;color:#fff;padding:10px 16px;border-radius:12px;z-index:1000;max-width:80%}
.card{position:absolute;z-index:1000;left:12px;bottom:12px;background:#fff;border-radius:16px;box-shadow:0 4px 18px #0003;padding:12px 14px;max-width:340px}
@media(max-width:700px){#app{flex-direction:column-reverse}#side{width:100%;max-width:none;height:42%}main{height:58%}}