:root{
  --ink:#152033;--muted:#64748b;--line:#dbe3ec;--panel:#fff;--wash:#f4f7fa;
  --blue:#17365d;--blue2:#2f5597;--green:#16834a;--amber:#b86f00;--red:#b42318;--blank:#6b7280
}
*{box-sizing:border-box}
body{margin:0;background:var(--wash);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.45}
.site-header,main,footer{max-width:1240px;margin:0 auto}
.site-header{padding:28px 24px 12px}
.brand-row{display:flex;gap:22px;align-items:center}.logo{width:112px;height:auto;flex:0 0 auto}
.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-weight:700;font-size:.73rem;color:var(--blue2)}
h1{font-size:clamp(2rem,5vw,3.6rem);line-height:1.02;margin:.2rem 0 .55rem;color:var(--blue)}
h2{font-size:clamp(1.35rem,3vw,2rem);margin:.15rem 0;color:var(--blue)}
.lede{margin:0;color:var(--muted);font-size:1.04rem}
.status-strip{margin-top:20px;background:var(--blue);color:#fff;border-radius:10px;padding:12px 14px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.dot{width:10px;height:10px;border-radius:50%;background:#9ca3af;display:inline-block}.dot.good{background:#48d17d}.dot.warn{background:#ffbd52}.dot.bad{background:#ff6b6b}
main{padding:0 24px 30px}
section{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;margin:18px 0}
.attention-section{border-left:5px solid var(--blue2)}.attention-strip{font-size:1rem;color:#334155;margin-top:10px}.attention-strip strong{color:var(--blue)}
.section-heading{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;margin-bottom:18px}.muted{color:var(--muted);font-size:.9rem}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.metric{border:1px solid var(--line);border-radius:12px;padding:15px;min-width:0}.metric span,.metric small{display:block;color:var(--muted)}
.metric strong{display:block;color:var(--blue);font-size:1.8rem;margin:.25rem 0}.metric small{font-size:.75rem}
.condition-card.light{border-top:4px solid var(--green)}.condition-card.medium{border-top:4px solid var(--amber)}.condition-card.heavy{border-top:4px solid var(--red)}
.quality-panel{margin-top:14px;border-left:4px solid var(--green);background:#f6fbf8;border-radius:8px;padding:12px 14px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.quality-primary{display:flex;gap:8px;flex-wrap:wrap}.quality-details{color:var(--muted);font-size:.9rem}
.wgt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.wgt-card{border:1px solid var(--line);border-radius:12px;padding:16px}.wgt-card h3{margin:0 0 12px;color:var(--blue)}
.wgt-main{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.wgt-main div{background:var(--wash);border-radius:8px;padding:10px}
.wgt-main span{display:block;color:var(--muted);font-size:.75rem}.wgt-main strong{font-size:1.17rem}.wgt-read{margin:.2rem 0 1rem;font-weight:700;color:#334155}
.segment-list{margin:0;padding:0;list-style:none}.segment-list li{padding:8px 0;border-top:1px solid var(--line);font-size:.9rem;display:flex;justify-content:space-between;gap:12px}
.method-note{color:var(--muted);font-size:.84rem;margin-bottom:0}.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:980px}th,td{text-align:left;padding:10px 9px;border-bottom:1px solid var(--line);font-size:.86rem;vertical-align:top}
th{color:var(--blue);background:#f8fafc;position:sticky;top:0}.badge{display:inline-block;padding:3px 8px;border-radius:999px;font-weight:700;font-size:.75rem}
.badge.Light{background:#e7f7ee;color:var(--green)}.badge.Medium{background:#fff3d8;color:var(--amber)}.badge.Heavy{background:#fde7e5;color:var(--red)}.badge.Blank{background:#eef1f4;color:var(--blank)}
.share{white-space:nowrap}.worst-segment{max-width:310px}.small-note{display:block;color:var(--muted);font-size:.76rem;margin-top:2px}
.methodology p{color:#475569;max-width:1050px}footer{padding:0 24px 32px;color:var(--muted);font-size:.8rem;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
@media(max-width:980px){.metric-grid{grid-template-columns:repeat(2,1fr)}.wgt-main{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.brand-row{align-items:flex-start}.logo{width:78px}.section-heading{align-items:flex-start;flex-direction:column}.wgt-grid{grid-template-columns:1fr}}
@media(max-width:440px){.site-header,main,footer{padding-left:14px;padding-right:14px}section{padding:15px}.brand-row{gap:12px}.logo{width:62px}.metric-grid{grid-template-columns:1fr}}


/* v1.2.0 interactive freeway map */
.map-toolbar{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.map-toolbar label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:.78rem;font-weight:700}
.map-toolbar select,.map-toolbar button{min-height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);padding:8px 11px;font:inherit}
.map-toolbar select{min-width:190px}.map-toolbar button{cursor:pointer;font-weight:700;color:var(--blue);background:#f8fafc}
.map-toolbar button:hover{background:#eef4fa}
.freeway-map{height:620px;width:100%;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#e8edf2}
.map-footer{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap;margin-top:12px}
.map-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.82rem;color:#475569}
.map-legend span{display:inline-flex;align-items:center;gap:6px}
.legend-line{width:28px;height:5px;border-radius:999px;display:inline-block}
.legend-light{background:#1f9d55}.legend-medium{background:#d99000}.legend-heavy{background:#c92a2a}.legend-blank{background:#7b8794}
.leaflet-popup-content{min-width:250px;line-height:1.42}
.map-popup-title{font-weight:800;color:var(--blue);font-size:1rem;margin-bottom:2px}
.map-popup-sub{color:#64748b;font-size:.8rem;margin-bottom:9px}
.map-popup-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px 12px;font-size:.82rem}
.map-popup-grid span{color:#64748b}.map-popup-grid strong{text-align:right;color:#152033}
.map-popup-condition{display:inline-block;margin-top:9px;padding:3px 8px;border-radius:999px;font-weight:700;font-size:.75rem}
.map-popup-condition.Light{background:#e7f7ee;color:var(--green)}
.map-popup-condition.Medium{background:#fff3d8;color:var(--amber)}
.map-popup-condition.Heavy{background:#fde7e5;color:var(--red)}
.map-popup-condition.Blank{background:#eef1f4;color:var(--blank)}
.map-link{cursor:pointer}.map-link:hover td{background:#f5f9fd}
@media(max-width:700px){
  .freeway-map{height:480px}
  .map-toolbar label,.map-toolbar select,.map-toolbar button{width:100%}
}


/* v1.3.0 presentation + interaction refinements */
.top3-strip{
  margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:10px;
  padding:12px 14px;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start
}
.top3-title{
  color:var(--blue);font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;
  white-space:nowrap;padding-top:2px
}
.top3-strip ol{margin:0;padding-left:22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 22px}
.top3-strip li{color:#334155;font-size:.88rem;padding-left:2px}
.top3-strip li strong{color:var(--blue)}
.map-stage{position:relative}
.map-context-badge{
  position:absolute;z-index:500;top:12px;right:12px;background:rgba(23,54,93,.94);color:#fff;
  border-radius:8px;padding:7px 10px;font-size:.75rem;font-weight:700;box-shadow:0 1px 4px rgba(0,0,0,.18);
  max-width:min(440px,70%)
}
.freeway-map{height:680px}
.wgt-overall{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right}
.wgt-overall strong{color:var(--blue);font-size:.95rem}
.wgt-card{border-top:4px solid var(--blue2)}
.wgt-card h3{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wgt-main strong{font-size:1.28rem}
table th[data-sort]{cursor:pointer;user-select:none;white-space:nowrap}
table th[data-sort]::after{content:" ↕";font-size:.7rem;color:#94a3b8}
table th[data-sort].sort-asc::after{content:" ↑";color:var(--blue2)}
table th[data-sort].sort-desc::after{content:" ↓";color:var(--blue2)}
table th[data-sort]:hover{background:#edf4fb}
.map-link td:first-child strong,.map-link td:nth-child(4){color:var(--blue2)}
.map-link:focus-within td,.map-link:hover td{background:#f5f9fd}
@media(max-width:900px){
  .top3-strip{grid-template-columns:1fr}
  .top3-strip ol{grid-template-columns:1fr}
  .wgt-overall{align-items:flex-start;text-align:left}
}
@media(max-width:700px){
  .freeway-map{height:520px}
  .map-context-badge{left:10px;right:10px;top:10px;max-width:none}
}


/* v1.4.0 West Gate Freeway / Bridge dedicated view */
#wgfBridgeCards .wgt-card{border-top-color:#475569}
#wgfBridgeCards .wgt-card.map-focus-card{cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
#wgfBridgeCards .wgt-card.map-focus-card:hover{background:#f8fafc;border-color:#94a3b8}
#wgfBridgeCards .bridge-route-label{color:var(--muted);font-size:.78rem;margin:-4px 0 10px}


/* v1.5.0 historical performance and reliability */
.historical-section{border-top:5px solid var(--blue2)}
.history-status{font-weight:800;color:var(--blue);text-align:right}
.history-window-bar{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-bottom:14px}
.history-window-bar>div:first-child{display:flex;flex-direction:column;gap:2px}
.history-window-buttons{display:flex;gap:7px;flex-wrap:wrap}
.history-window-buttons button{border:1px solid var(--line);background:#fff;color:var(--blue);border-radius:999px;padding:7px 11px;font-weight:700;cursor:pointer}
.history-window-buttons button.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.history-window-buttons button:disabled{cursor:not-allowed;color:#94a3b8;background:#f1f5f9}
.history-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.history-building{border-left:4px solid #d99000;background:#fff8e7;border-radius:8px;padding:16px;color:#5d4500;margin:12px 0}
.history-callout{margin:14px 0;background:#f5f8fc;border:1px solid var(--line);border-radius:9px;padding:12px 14px;color:#334155}
.history-callout strong{color:var(--blue)}
.history-subsection{margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.history-subheading{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;margin-bottom:10px}
.history-subheading h3{margin:.1rem 0;color:var(--blue);font-size:1.25rem}
.history-table{min-width:1050px}
.history-table th{position:static}
@media(max-width:980px){.history-metric-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.history-metric-grid{grid-template-columns:1fr}.history-status{text-align:left}.history-subheading{align-items:flex-start;flex-direction:column}}