:root{
  --bg:#f4f7f9;--surface:#fff;--surface2:#eef3f5;--text:#172128;--muted:#60717c;--line:#d8e1e6;
  --navy:#102c3a;--green:#0b7a53;--green2:#0f9a69;--amber:#cc7a00;--red:#c84444;--shadow:0 12px 35px rgba(18,42,54,.08);
  --radius:18px;--max:1180px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}img{max-width:100%;display:block}.wrap{width:min(var(--max),calc(100% - 32px));margin:auto}.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:12px;z-index:100;background:#fff;padding:10px 14px;border-radius:8px}
.site-header{position:sticky;top:0;z-index:40;background:rgba(244,247,249,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(216,225,230,.9)}.header-row{height:70px;display:flex;align-items:center;gap:22px}.brand{text-decoration:none;font-weight:850;letter-spacing:-.03em;font-size:1.23rem;display:flex;align-items:center;gap:10px;white-space:nowrap}.brand-mark{width:31px;height:31px;border-radius:10px;background:linear-gradient(145deg,var(--green2),var(--navy));display:grid;place-items:center;color:white;font-size:15px}.main-nav{display:flex;gap:17px;align-items:center;margin-left:auto}.main-nav a{text-decoration:none;color:#40515b;font-weight:650;font-size:.91rem;white-space:nowrap}.main-nav a:hover{color:var(--green)}.lang{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#fff;flex:0 0 auto}.lang a{padding:6px 8px;font-size:.76rem;text-decoration:none;font-weight:800}.lang a[aria-current="page"]{background:var(--navy);color:#fff}.menu-btn{display:none;margin-left:auto;border:0;background:transparent;font-size:1.4rem;padding:8px}
.hero{padding:68px 0 36px}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:44px;align-items:center}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.09em;color:var(--green)}.pulse{width:9px;height:9px;border-radius:50%;background:var(--green2);box-shadow:0 0 0 6px rgba(15,154,105,.12)}h1{font-size:clamp(2.4rem,6vw,4.65rem);line-height:1.02;letter-spacing:-.055em;margin:13px 0 18px;max-width:900px}h2{font-size:clamp(1.65rem,4vw,2.55rem);line-height:1.1;letter-spacing:-.035em;margin:0 0 10px}h3{line-height:1.2;letter-spacing:-.02em}.lead{font-size:1.16rem;color:var(--muted);max-width:760px;margin:0}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 17px;border-radius:12px;text-decoration:none;font-weight:800;border:1px solid var(--line);background:#fff}.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}.btn:hover{transform:translateY(-1px)}
.status-card{background:var(--navy);color:white;border-radius:24px;padding:25px;box-shadow:0 22px 45px rgba(16,44,58,.18)}.status-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.live-badge{font-size:.78rem;font-weight:850;letter-spacing:.07em;background:rgba(15,154,105,.2);color:#7ce0b9;border:1px solid rgba(124,224,185,.24);border-radius:999px;padding:5px 9px}.live-badge.offline{background:rgba(200,68,68,.17);color:#ffc4c4;border-color:rgba(255,196,196,.2)}.status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:19px 0}.stat{background:rgba(255,255,255,.075);padding:15px;border-radius:14px}.stat b{font-size:1.55rem;display:block}.stat span{font-size:.78rem;color:#bfd0d8}.updated{font-size:.82rem;color:#a9bdc7;margin:0}.source-mini{font-size:.75rem;color:#a9bdc7;margin:10px 0 0}.language-note{color:var(--muted);max-width:620px;margin-top:14px}
.section{padding:42px 0}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:20px}.section-head p{margin:0;max-width:660px;color:var(--muted)}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.live-panel{padding:18px}.toolbar{display:grid;grid-template-columns:minmax(200px,1fr) auto;gap:12px;margin-bottom:14px}.search{width:100%;border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px 14px;font:inherit;outline:none}.search:focus{border-color:#84a9a0;box-shadow:0 0 0 3px rgba(11,122,83,.09)}.chips{display:flex;flex-wrap:wrap;gap:7px}.road-chips{margin-bottom:14px}.chip{border:1px solid var(--line);background:#fff;color:#495b65;border-radius:999px;padding:8px 11px;font:inherit;font-size:.86rem;font-weight:750;cursor:pointer}.chip[aria-pressed="true"],.chip:hover{background:var(--navy);border-color:var(--navy);color:white}.event-list{display:grid;gap:10px}.event{display:grid;grid-template-columns:auto 1fr auto;gap:13px;padding:15px;border:1px solid var(--line);border-radius:14px;align-items:start}.event-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#eef3f5;font-size:1rem}.event[data-type="jam"] .event-icon{background:#fff1d8}.event[data-type="closure"] .event-icon{background:#ffe7e7}.event[data-type="roadworks"] .event-icon{background:#fff4da}.event h3{font-size:1rem;margin:0 0 4px}.event p{font-size:.9rem;color:var(--muted);margin:0}.event-road{font-weight:850;color:var(--navy);white-space:nowrap;font-size:.82rem}.empty{padding:30px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:14px}.notice{padding:14px 16px;border-radius:13px;background:#fff8e8;border:1px solid #f1dcae;color:#6d5422;font-size:.9rem;margin-bottom:14px}.hidden{display:none!important}
.route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.route-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:18px;text-decoration:none;min-height:128px;display:flex;flex-direction:column;justify-content:space-between}.route-card:hover{border-color:#9bb4ad;box-shadow:var(--shadow)}.route-code{font-size:.78rem;font-weight:900;color:var(--green);letter-spacing:.07em}.route-card h3{margin:9px 0 0}.route-card span:last-child{color:var(--muted);font-size:.85rem}.camera-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.camera{border:1px solid var(--line);border-radius:15px;overflow:hidden;background:#fff}.camera-media{aspect-ratio:16/9;background:#e8eef1;display:grid;place-items:center;color:#74858e;font-size:.86rem;overflow:hidden;text-align:center;padding:8px}.camera-media img{width:100%;height:100%;object-fit:cover}.camera-unavailable{padding:20px}.camera-body{padding:12px 14px}.camera-body h3{font-size:.93rem;margin:0 0 3px}.camera-body p{font-size:.8rem;color:var(--muted);margin:0}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.info-card{padding:20px}.info-card p{color:var(--muted);margin-bottom:0}.source-box{display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center;background:#eaf4f0;border:1px solid #c9e0d7;border-radius:18px;padding:22px}.source-box p{margin:5px 0 0;color:#46645a}.source-box a{font-weight:800;color:var(--green)}
.content-page{padding:55px 0}.page-intro{max-width:880px}.page-intro h1{font-size:clamp(2.2rem,5vw,3.9rem)}.prose{max-width:820px}.prose h2{margin-top:34px;font-size:1.7rem}.prose p,.prose li{color:#445760}.prose a{color:var(--green);font-weight:700}.callout{padding:17px 19px;border-left:4px solid var(--green);background:#eef7f3;border-radius:0 12px 12px 0;margin:24px 0}.landing-live{margin-top:30px}
.site-footer{margin-top:55px;border-top:1px solid var(--line);background:#edf2f4;padding:34px 0}.footer-grid{display:grid;grid-template-columns:1fr auto;gap:30px}.footer-links{display:flex;flex-wrap:wrap;gap:14px}.footer-links a{font-size:.84rem;color:#50636d}.fine{font-size:.78rem;color:#71838d;max-width:850px}
@media(max-width:980px){.main-nav{gap:11px}.main-nav a{font-size:.84rem}.header-row{gap:13px}.lang a{padding:6px 6px}}
@media(max-width:880px){.hero{padding-top:45px}.hero-grid{grid-template-columns:1fr}.status-card{max-width:620px}.main-nav{display:none;position:absolute;left:16px;right:16px;top:62px;background:white;border:1px solid var(--line);border-radius:14px;padding:13px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.main-nav.open{display:flex}.main-nav a{padding:7px}.menu-btn{display:block}.header-row>.lang{margin-left:0}.route-grid,.camera-grid,.info-grid{grid-template-columns:repeat(2,1fr)}.toolbar{grid-template-columns:1fr}.event{grid-template-columns:auto 1fr}.event-road{grid-column:2}.footer-grid{grid-template-columns:1fr}}
@media(max-width:560px){.wrap{width:min(var(--max),calc(100% - 22px))}.header-row{height:62px;gap:6px}.brand{font-size:.98rem;gap:6px}.brand-mark{width:27px;height:27px}.menu-btn{padding:5px}.lang a{padding:5px 5px;font-size:.66rem}.hero{padding:35px 0 25px}h1{font-size:2.45rem}.lead{font-size:1.03rem}.status-card{padding:18px;border-radius:19px}.status-grid{grid-template-columns:repeat(3,1fr)}.stat{padding:10px}.stat b{font-size:1.25rem}.stat span{font-size:.71rem}.section{padding:31px 0}.section-head{display:block}.route-grid,.camera-grid,.info-grid{grid-template-columns:1fr}.event{padding:13px}.source-box{grid-template-columns:1fr}.footer-links{gap:9px 13px}}
@media(max-width:390px){.brand{font-size:.9rem}.brand-mark{width:25px;height:25px}.lang a{padding:4px;font-size:.62rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}