:root{
  --ink:#10243e; --muted:#65758b; --line:rgba(16,36,62,.12); --soft:#f5f8fc;
  --panel:rgba(255,255,255,.88); --shadow:0 22px 70px rgba(16,36,62,.16);
  --blue:#2563eb; --green:#16a34a; --red:#dc2626;
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:#eaf1f8;overflow:hidden}
button,input,select,textarea{font:inherit} button{cursor:pointer} a{color:inherit}
.app-shell{height:100%;display:grid;grid-template-columns:410px 1fr;grid-template-rows:76px 1fr;gap:12px;padding:12px}
.topbar{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--panel);backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:28px;padding:10px 12px;box-shadow:0 10px 35px rgba(16,36,62,.10);z-index:5}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;min-width:0}.brand-icon{width:48px;height:48px;border-radius:16px;box-shadow:0 8px 22px rgba(37,99,235,.22)}.brand strong{display:block;font-size:18px;letter-spacing:-.03em}.brand small{display:block;color:var(--muted);font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:58vw}.top-actions{display:flex;gap:8px;align-items:center}.btn{border:1px solid var(--line);min-height:43px;border-radius:15px;padding:0 14px;font-weight:900;background:#fff;color:var(--ink);box-shadow:0 6px 18px rgba(16,36,62,.08)}.btn.primary{background:linear-gradient(135deg,#10243e,#2563eb);color:#fff;border-color:transparent}.btn.secondary{background:linear-gradient(135deg,#16a34a,#06b6d4);color:#fff;border:0}.btn.ghost{background:rgba(255,255,255,.72)}
.sidepanel{min-height:0;overflow:auto;background:var(--panel);backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:30px;padding:14px;box-shadow:var(--shadow);z-index:3}.hero-card{padding:22px;border-radius:26px;color:#fff;background:radial-gradient(circle at 0 0,rgba(6,182,212,.55),transparent 38%),radial-gradient(circle at 100% 0,rgba(250,204,21,.30),transparent 36%),linear-gradient(135deg,#10243e,#1d4ed8 62%,#0f766e);box-shadow:0 24px 55px rgba(16,36,62,.22)}.kicker{display:inline-flex;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.14);border-radius:999px;padding:7px 10px;font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.06em}.hero-card h1{font-size:clamp(31px,4vw,46px);line-height:.95;letter-spacing:-.06em;margin:15px 0 10px}.hero-card p{margin:0;color:rgba(255,255,255,.86);line-height:1.48}.hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}.panel-block{margin-top:12px;padding:13px;border-radius:22px;background:rgba(255,255,255,.72);border:1px solid var(--line)}.block-title{font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.07em;color:#52637a;margin:0 0 10px}.search{width:100%;height:46px;border-radius:16px;border:1px solid var(--line);padding:0 14px;background:#fff;outline:0;font-weight:750}.search:focus{border-color:#2563eb;box-shadow:0 0 0 4px rgba(37,99,235,.12)}.filters{display:grid;gap:8px}.filter{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:1px solid var(--line);background:#fff;border-radius:16px}.filter-left{display:flex;align-items:center;gap:9px;font-weight:900}.pin-sample{width:32px;height:32px;border-radius:12px;display:grid;place-items:center;color:#fff;font-weight:950;box-shadow:0 7px 15px rgba(0,0,0,.12)}.switch{width:42px;height:24px;border-radius:999px;background:#d9e2ee;position:relative;flex:0 0 auto}.switch:before{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;left:3px;top:3px;box-shadow:0 2px 8px rgba(0,0,0,.18);transition:.18s}.filter[data-on="true"] .switch{background:#10243e}.filter[data-on="true"] .switch:before{transform:translateX(18px)}.compact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.mini-card{border:1px solid var(--line);background:#fff;border-radius:17px;padding:11px 6px;display:grid;gap:5px;place-items:center;font-weight:950;color:#10243e}.mini-card span{font-size:11px;color:#64748b}.result-list{display:grid;gap:9px;max-height:38vh;overflow:auto;padding-right:2px}.result{border:1px solid var(--line);background:#fff;border-radius:18px;padding:12px;display:grid;gap:6px;text-align:left}.result strong{font-size:14px}.result small{color:#64748b;font-weight:800}.chips{display:flex;flex-wrap:wrap;gap:5px}.chip{font-size:11px;font-weight:950;border-radius:999px;padding:5px 7px;background:#eef4fb;color:#34465d}.map-wrap{position:relative;min-height:0;border:1px solid var(--line);border-radius:32px;overflow:hidden;box-shadow:var(--shadow);background:#dbeafe}#map{height:100%;width:100%}.mobile-menu{display:none;position:absolute;top:12px;left:12px;z-index:600;border:0;border-radius:16px;background:#10243e;color:#fff;width:46px;height:46px;font-size:22px;box-shadow:0 12px 32px rgba(16,36,62,.22)}.legend{position:absolute;left:14px;bottom:14px;z-index:500;display:flex;flex-wrap:wrap;gap:7px;max-width:min(720px,calc(100% - 28px))}.legend-item{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:999px;padding:7px 10px;font-weight:900;font-size:12px;box-shadow:0 8px 20px rgba(16,36,62,.10)}.legend-dot{width:14px;height:14px;border-radius:50%}.marker{width:42px;height:42px;border-radius:16px 16px 16px 5px;transform:rotate(-45deg);display:grid;place-items:center;color:#fff;border:3px solid #fff;box-shadow:0 10px 25px rgba(0,0,0,.24)}.marker span{transform:rotate(45deg);font-weight:1000;font-size:18px;line-height:1}.marker.parking span{font-family:Arial Black,system-ui}.marker.barrier span,.marker.warning span{font-size:22px}.score{height:8px;border-radius:999px;background:#e2e8f0;overflow:hidden}.score span{display:block;height:100%;background:linear-gradient(90deg,#dc2626,#eab308,#16a34a)}.drawer{position:fixed;right:18px;bottom:18px;width:min(460px,calc(100vw - 36px));max-height:82vh;overflow:auto;background:rgba(255,255,255,.94);backdrop-filter:blur(22px);border:1px solid var(--line);border-radius:28px;box-shadow:0 28px 90px rgba(16,36,62,.26);padding:18px;z-index:900;transform:translateY(calc(100% + 40px));transition:.28s ease}.drawer.open{transform:translateY(0)}.drawer-close,.modal-close{position:absolute;right:12px;top:12px;border:0;background:#10243e;color:#fff;border-radius:14px;width:38px;height:38px;font-size:22px}.detail-head{padding-right:34px}.detail-head h2{margin:0 0 4px;letter-spacing:-.04em}.muted{color:#64748b;line-height:1.48}.detail-photo{width:100%;border-radius:18px;margin-top:12px;max-height:240px;object-fit:cover}.detail-list{display:grid;gap:8px;margin-top:12px}.detail-list div{padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#f8fafc;font-weight:800;color:#34465d}.modal{position:fixed;inset:0;background:rgba(8,18,32,.54);backdrop-filter:blur(10px);z-index:1000;display:none;align-items:center;justify-content:center;padding:18px}.modal.open{display:flex}.modal-card{position:relative;width:min(850px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:30px;padding:24px;box-shadow:0 34px 100px rgba(0,0,0,.34)}.modal-card h2{margin:0 48px 5px 0;font-size:30px;letter-spacing:-.05em}.report-form{display:grid;gap:14px;margin-top:18px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.report-form label{display:grid;gap:6px;font-weight:900;color:#34465d}.report-form input,.report-form select,.report-form textarea{width:100%;border:1px solid var(--line);border-radius:15px;padding:12px;background:#f8fafc;outline:0}.checks{display:flex;flex-wrap:wrap;gap:10px}.checks label{display:flex;align-items:center;gap:8px;background:#f8fafc;border:1px solid var(--line);border-radius:999px;padding:10px 12px}.form-actions{display:flex;gap:9px;flex-wrap:wrap}.photo-preview img{max-width:220px;max-height:150px;border-radius:16px;border:1px solid var(--line);object-fit:cover}.route-line{filter:drop-shadow(0 4px 8px rgba(0,0,0,.22))}.heat-on .marker[data-cat="barrier"],.heat-on .marker[data-cat="warning"]{box-shadow:0 0 0 8px rgba(220,38,38,.18),0 0 0 18px rgba(249,115,22,.12),0 10px 25px rgba(0,0,0,.24)}
@media(max-width:900px){body{overflow:hidden}.app-shell{grid-template-columns:1fr;grid-template-rows:70px 1fr;padding:8px;gap:8px}.topbar{border-radius:22px}.sidepanel{position:fixed;left:8px;top:86px;bottom:8px;width:min(390px,calc(100vw - 16px));transform:translateX(calc(-100% - 16px));transition:.25s ease;z-index:700}.sidepanel.open{transform:translateX(0)}.map-wrap{border-radius:24px}.mobile-menu{display:block}.top-actions .ghost{display:none}.brand small{max-width:45vw}.hero-actions,.form-grid{grid-template-columns:1fr}.compact-grid{grid-template-columns:repeat(2,1fr)}.legend{bottom:10px;left:10px}.legend-item{font-size:11px}.drawer{right:8px;bottom:8px;width:calc(100vw - 16px)}}
@media(max-width:520px){.top-actions .primary{padding:0 10px}.brand strong{font-size:15px}.brand-icon{width:44px;height:44px}.modal-card{padding:19px;border-radius:24px}.modal-card h2{font-size:25px}.checks label{border-radius:16px;width:100%}}