:root{
  --bg:#F2F3F1; --ink:#15181B; --ink2:#2E3338; --muted:#5B6168; --faint:#747A80;
  --card:#FFFFFF; --line:#ECEEEB; --line2:#D5D9D4; --side:#1B1F23; --side2:#252A2F; --sideInk:#C9CDD2;
  --maroon:#7A1218; --gold:#E0B020; --pass:#1E8A3C; --passInk:#14632B; --passBg:#E6F4EA;
  --fail:#D32F2F; --failInk:#9B1C1C; --failBg:#FDECEC; --grey:#A3A8AE;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-variant-numeric:tabular-nums}
a{color:var(--maroon)} a:hover{color:#500000}
.shell{display:flex;flex-wrap:wrap;min-height:100vh}
.side{flex:1 1 232px;max-width:100%;background:var(--side);color:var(--sideInk);padding:24px 16px;display:flex;flex-direction:column;gap:28px}
.brand{display:flex;flex-direction:column;gap:6px;padding:0 8px}
.brand .firm{font-size:10px;font-weight:600;letter-spacing:1.4px;color:#8E959C;text-transform:uppercase;line-height:1.4}
.brand .top{display:flex;align-items:center;gap:10px}
.brand .top img{width:72px;height:auto;flex:none;display:block}
.brand .name{font-size:24px;font-weight:700;color:#fff;line-height:1.1}
.brand .csj{font-size:13px;color:#A7AEB5}
.brand .bar{height:3px;width:40px;background:var(--gold);border-radius:2px;margin-top:6px}
.nav{display:flex;flex-direction:column;gap:4px}
.nav a,.nav span{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;border-radius:8px;color:var(--sideInk);text-decoration:none;font-size:15px;font-weight:500}
.nav a:hover{background:var(--side2);color:#fff}
.nav a.on{background:var(--maroon);color:#fff;font-weight:600}
.nav span.soon{color:#8A9097;cursor:default}
.nav span.soon em{margin-left:auto;font-style:normal;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:#8A9097}
.nav svg{flex:none}
.asof{margin-top:auto;background:var(--side2);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:8px;font-size:13px}
.asof .h{font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:#8E959C}
.asof div{display:flex;justify-content:space-between;gap:8px}
.asof b{color:#fff}
main{flex:999 1 640px;min-width:0;padding:32px 40px 48px;display:flex;flex-direction:column;gap:22px}
h1{margin:0;font-size:34px;font-weight:700;letter-spacing:-.2px}
.sub{font-size:15px;color:var(--muted)}
.head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px}
.card{background:var(--card);border-radius:12px;box-shadow:0 1px 2px rgba(21,24,27,.06),0 0 0 1px rgba(21,24,27,.05)}
.pad{padding:20px 22px}
.h2{font-size:20px;font-weight:700}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.kpi{padding:20px;display:flex;flex-direction:column;gap:10px}
.kpi .l{font-size:13px;font-weight:600;color:var(--muted)}
.kpi .v{display:flex;align-items:baseline;gap:6px}
.kpi .v b{font-size:40px;line-height:1}
.kpi .v span{font-size:16px;color:var(--muted)}
.kpi .n{font-size:12px;color:var(--muted)}
.meter{height:6px;background:#E8EAE7;border-radius:3px;display:flex;overflow:hidden}
.meter i{display:block;height:100%}
.seg{display:flex;background:#E3E5E2;border-radius:10px;padding:4px;gap:4px;flex-wrap:wrap}
.seg button{font:inherit;font-size:14px;font-weight:600;min-height:40px;padding:0 16px;border:0;border-radius:7px;background:transparent;color:var(--muted);display:flex;align-items:center;gap:8px;cursor:pointer}
.seg button[aria-pressed="true"]{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(21,24,27,.15)}
.sw{width:10px;height:10px;border-radius:2px;display:inline-block}
.sw.y{background:var(--gold)} .sw.w{background:#fff;border:1px solid #9AA0A6}
.mapwrap{display:flex;flex-wrap:wrap;overflow:hidden}
.mapbox{flex:999 1 520px;min-width:0;position:relative;background:#E9EBE6}
.map{height:560px;width:100%}
.mapside{flex:1 1 300px;min-width:0;border-left:1px solid var(--line);display:flex;flex-direction:column;max-height:560px}
.legend{position:absolute;left:12px;top:12px;z-index:500;background:rgba(255,255,255,.96);border-radius:10px;padding:10px 12px;box-shadow:0 2px 8px rgba(21,24,27,.12);display:flex;flex-direction:column;gap:6px;font-size:13px;max-width:calc(100% - 24px)}
.legend .t{font-weight:600}
.legend .r{display:flex;gap:8px;align-items:center}
.legend .k{width:24px;height:6px;border-radius:3px;flex:none}
.legend .ramp{height:8px;width:160px;border-radius:4px}
.legend .ends{display:flex;justify-content:space-between;width:160px;font-size:12px;color:var(--muted)}
.ctl{position:absolute;left:12px;bottom:12px;z-index:500}
select,input[type=search]{font:inherit;font-size:14px;min-height:40px;padding:0 12px;border:1px solid var(--line2);border-radius:8px;background:#fff;color:var(--ink)}
.ctl select{border:0;box-shadow:0 2px 8px rgba(21,24,27,.12)}
.list{overflow:auto}
.list a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 18px;border-top:1px solid #F0F1EE;text-decoration:none;color:var(--ink);min-height:44px}
.list a:hover{background:#F7F8F6}
.list .rn{display:flex;flex-direction:column;gap:2px}
.list .rn b{font-size:15px} .list .rn span{font-size:12px;color:var(--muted)}
.list .rv{font-size:15px;font-weight:600;text-align:right;white-space:nowrap}
.tblwrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{background:#F7F8F6;text-align:left;font-size:12px;color:var(--muted);letter-spacing:.3px;font-weight:600;padding:10px 12px;white-space:nowrap}
th button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;display:inline-flex;gap:4px;align-items:center;min-height:28px}
th.num,td.num{text-align:right}
td{padding:11px 12px;border-top:1px solid #F0F1EE;color:var(--ink2);vertical-align:middle}
td:first-child,th:first-child{padding-left:20px} td:last-child,th:last-child{padding-right:20px}
td a.road{text-decoration:none;color:var(--ink);display:flex;flex-direction:column}
td a.road b{font-weight:600} td a.road span{font-size:12px;color:var(--muted)}
.pill{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap;display:inline-block}
.pill.read{background:#E3EDF7;color:#1D4E85}
.pill.wait{background:#ECEEEB;color:var(--ink2)}
.pill.reread{background:#FCEBDD;color:var(--failInk)}
.pbar{display:flex;align-items:center;gap:8px;white-space:nowrap}
.pbar .meter{width:90px;flex:none}
.note{font-size:12px;color:var(--faint);line-height:1.5}
.muted{color:var(--muted)}
.grid2{display:flex;flex-wrap:wrap;gap:20px;align-items:stretch}
.grid2>.wide{flex:999 1 560px;min-width:0}
.grid2>.narrow{flex:1 1 330px;min-width:0}
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tile{border-radius:10px;padding:12px}
.tile .a{font-size:12px;font-weight:600} .tile .b{font-size:28px;font-weight:700} .tile .c{font-size:12px}
.tile.p{background:var(--passBg);color:var(--passInk)} .tile.f{background:var(--failBg);color:var(--failInk)} .tile.n{background:#F2F3F1;color:var(--muted)}
.kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #F0F1EE;font-size:14px}
.kv span{color:var(--muted)} .kv b{font-weight:600;text-align:right}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:600;padding:0 12px}
.btn.dark{background:var(--ink);color:#fff} .btn.line{border:1px solid #C9CDC8;color:var(--ink)}
.btn.off{border:1px dashed #C9CDC8;color:var(--faint)}
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.rule{background:#F7F8F6;border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.rule .k{font-size:13px;font-weight:600;color:var(--muted)} .rule .v{font-size:15px;line-height:1.4}
.aside{border-radius:10px;padding:12px 14px;font-size:14px;line-height:1.5;background:#F7F8F6}
.aside b{display:block}
.aside.warn{background:var(--failBg);color:#4A2306} .aside.warn b{color:var(--failInk)}
.leaflet-container{font-family:Arial,Helvetica,sans-serif}
.empty{padding:40px;text-align:center;color:var(--muted)}
@media (max-width:700px){
  main{padding:20px 16px 36px}
  h1{font-size:28px}
  .map{height:420px}
  .mapside{border-left:0;border-top:1px solid var(--line);max-height:440px}
  #strip{overflow-x:auto} #strip svg{min-width:900px}
  .side{padding:16px;gap:16px}
  .nav{flex-direction:row;flex-wrap:wrap}
  .nav a,.nav span{flex:1 1 140px}
  .nav span.soon{display:none}
  .asof{margin-top:0}
}
#top>.wide>div{height:100%} #top .map{height:100%;min-height:560px}
@media (max-width:700px){#top .map{min-height:420px}}
.basemap{filter:grayscale(1) contrast(.9) brightness(1.05)}
#roads td:first-child{min-width:120px} #roads td:nth-child(4),#roads td:nth-child(5){white-space:nowrap}

.chart svg{width:100%;height:auto;display:block}
.chart text{font-family:Arial,Helvetica,sans-serif}
.basis{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.5;color:var(--ink2)}
td.sig{font-weight:700;color:var(--ink)}
td.grey,th.grey{color:#B4B8BC;background:#FAFAF9}
td.cell{text-align:center;min-width:110px}
td.cell small{display:block;font-size:11px;color:var(--muted)}
.slider{display:flex;flex-direction:column;gap:6px;font-size:14px}
.slider .top{display:flex;justify-content:space-between;gap:8px} .slider .top b{font-weight:600}
.slider input[type=range]{width:100%;accent-color:var(--maroon);min-height:32px}
.callout{border-radius:10px;padding:14px 16px;font-size:15px;line-height:1.5;background:#F7F8F6}
.callout.ok{background:var(--passBg);color:#123F1F} .callout.no{background:#F2F3F1;color:var(--ink2)}
.callout.edge{background:#FFF6DD;color:#4A3A06}
td.num{white-space:nowrap}