:root{--traffic-bg:#050609;--traffic-surface:#0a0c10;--traffic-elevated:#10131a;--traffic-border:#1a1e27;--traffic-text:#e8ecf2;--traffic-muted:#778295;--traffic-blue:#2f88f8;--traffic-green:#6ee7a0;--traffic-red:#f08a7a;--traffic-orange:#f5b544;--traffic-purple:#a78bfa;--traffic-cyan:#55d6be;--traffic-radius:12px}*{box-sizing:border-box}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{background:var(--traffic-bg);min-width:320px;min-height:100vh;color:var(--traffic-text);margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}:focus-visible{outline:2px solid var(--traffic-blue);outline-offset:2px}.traffic-loading,.traffic-login{place-items:center;min-height:100vh;padding:24px;display:grid}.traffic-login{background:radial-gradient(circle at 20% 10%,#2f88f824,#0000 45%)}.traffic-login__card{width:min(440px,100%)}.traffic-brand{align-items:center;gap:12px;display:flex}.traffic-brand h1,.traffic-brand p{margin:0}.traffic-brand h1{font-size:16px}.traffic-brand p{color:var(--traffic-muted);margin-top:3px;font-size:12px}.traffic-brand__icon{width:42px;height:42px;color:var(--traffic-blue);background:#2f88f81a;border:1px solid #2f88f859;border-radius:10px;place-items:center;display:grid}.traffic-form{border:1px solid var(--traffic-border);border-radius:var(--traffic-radius);background:var(--traffic-surface);gap:18px;margin-top:24px;padding:26px;display:grid}.traffic-form h2,.traffic-form p{margin:0}.traffic-form h2{font-size:17px}.traffic-form p{color:var(--traffic-muted);margin-top:5px;font-size:13px}.traffic-form label{color:var(--traffic-muted);gap:7px;font-size:12px;display:grid}.traffic-form input{border:1px solid var(--traffic-border);background:var(--traffic-elevated);width:100%;color:var(--traffic-text);border-radius:8px;padding:11px 12px}.traffic-button{border:1px solid var(--traffic-border);background:var(--traffic-elevated);color:var(--traffic-text);border-radius:8px;justify-content:center;align-items:center;gap:7px;padding:9px 13px;display:inline-flex}.traffic-button--primary{border-color:var(--traffic-blue);background:var(--traffic-blue);color:#fff;font-weight:600}.traffic-alert{border-radius:8px;margin:14px 0;padding:11px 13px;font-size:13px}.traffic-alert--error{color:var(--traffic-red);background:#f08a7a1a;border:1px solid #f08a7a59}.traffic-shell{width:min(1500px,100% - 40px);margin:0 auto;padding:28px 0 60px}.traffic-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px;display:flex}.traffic-actions{gap:8px;display:flex}.traffic-live{border:1px solid var(--traffic-border);color:var(--traffic-muted);background:var(--traffic-surface);border-radius:999px;align-items:center;gap:7px;padding:8px 11px;font-size:11px;font-weight:700;display:inline-flex}.traffic-live--connected{color:var(--traffic-green);background:#6ee7a012;border-color:#6ee7a04d}.traffic-since{color:var(--traffic-muted);margin:0 0 16px;font-size:12px}.traffic-metrics{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:16px;display:grid}.traffic-metric{border:1px solid var(--traffic-border);border-radius:var(--traffic-radius);background:var(--traffic-surface);flex-direction:column;justify-content:space-between;min-height:105px;padding:18px;display:flex}.traffic-metric span{color:var(--traffic-muted);font-size:12px}.traffic-metric strong{font-size:26px}.traffic-metric--success strong{color:var(--traffic-green)}.traffic-metric--danger strong{color:var(--traffic-red)}.traffic-metric--warning strong{color:var(--traffic-orange);font-size:17px}.traffic-section-heading{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:12px;padding:0 2px;display:flex}.traffic-section-heading h2,.traffic-section-heading p{margin:0}.traffic-section-heading h2{font-size:15px}.traffic-section-heading p{color:var(--traffic-muted);margin-top:5px;font-size:12px}.traffic-channel-section{margin-top:28px}.traffic-channel-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.traffic-channel-card{border:1px solid var(--traffic-border);border-radius:var(--traffic-radius);background:var(--traffic-surface);min-width:0;color:var(--traffic-text);text-align:left;align-items:flex-start;gap:14px;padding:18px;display:flex}.traffic-channel-card--active{background:linear-gradient(145deg, #2f88f81c, var(--traffic-surface));border-color:#2f88f8a6;box-shadow:inset 0 0 0 1px #2f88f81f}.traffic-channel-card__icon{width:40px;height:40px;color:var(--traffic-blue);background:#2f88f81a;border-radius:10px;flex:0 0 40px;place-items:center;display:grid}.traffic-channel-card__icon--platform{color:var(--traffic-purple);background:#a78bfa1a}.traffic-channel-card__icon--mobile{color:var(--traffic-cyan);background:#55d6be1a}.traffic-channel-card__body{flex:1;gap:14px;min-width:0;display:grid}.traffic-channel-card__top,.traffic-channel-card__footer{justify-content:space-between;align-items:center;gap:8px;display:flex}.traffic-channel-card__top>strong{font-size:13px}.traffic-channel-card__mode{color:var(--traffic-green);text-transform:uppercase;letter-spacing:.05em;background:#6ee7a014;border-radius:999px;padding:3px 7px;font-size:9px;font-weight:700}.traffic-channel-card__mode--restricted{color:var(--traffic-orange);background:#f5b54417}.traffic-channel-card__metric{align-items:baseline;gap:8px;display:flex}.traffic-channel-card__metric>strong{font-size:26px}.traffic-channel-card__metric small,.traffic-channel-card__footer{color:var(--traffic-muted);font-size:10px}.traffic-channel-card__footer{flex-wrap:wrap;justify-content:flex-start;gap:12px}.traffic-detail{border-top:1px solid var(--traffic-border);margin-top:30px;padding-top:28px}.traffic-section-heading--detail{align-items:flex-start}.traffic-detail__eyebrow{color:var(--traffic-blue);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px;font-size:10px;font-weight:800;display:inline-flex}.traffic-detail__eyebrow--platform{color:var(--traffic-purple)}.traffic-detail__eyebrow--mobile{color:var(--traffic-cyan)}.traffic-detail__status{color:var(--traffic-green);background:#6ee7a014;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:700;display:inline-flex}.traffic-detail__status--restricted{color:var(--traffic-orange);background:#f5b54417}.traffic-detail-metrics{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:16px;display:grid}.traffic-detail-metrics .traffic-metric{min-height:92px}.traffic-analytics{margin-top:16px}.traffic-analytics__heading{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:12px;padding:0 2px;display:flex}.traffic-analytics__heading h2,.traffic-analytics__heading p{margin:0}.traffic-analytics__heading h2{font-size:15px}.traffic-analytics__heading p{color:var(--traffic-muted);margin-top:5px;font-size:12px}.traffic-range{border:1px solid var(--traffic-border);background:var(--traffic-surface);border-radius:9px;padding:3px;display:inline-flex}.traffic-range__button{color:var(--traffic-muted);background:0 0;border:0;border-radius:6px;padding:6px 10px;font-size:11px}.traffic-range__button--active{background:var(--traffic-elevated);color:var(--traffic-text)}.traffic-charts{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.traffic-chart{border:1px solid var(--traffic-border);border-radius:var(--traffic-radius);background:linear-gradient(145deg,#10131ab8,#0a0c10f5);min-width:0;min-height:300px;padding:18px;overflow:hidden}.traffic-chart--wide{grid-column:span 1}.traffic-chart__header{justify-content:space-between;align-items:flex-start;gap:16px;min-height:48px;display:flex}.traffic-chart__header h3,.traffic-chart__header p{margin:0}.traffic-chart__header h3{font-size:13px}.traffic-chart__header p{color:var(--traffic-muted);margin-top:5px;font-size:11px}.traffic-chart__legend{color:var(--traffic-muted);flex-wrap:wrap;gap:12px;font-size:10px;display:flex}.traffic-chart__key{align-items:center;gap:5px;display:inline-flex}.traffic-chart__key:before{background:var(--traffic-muted);content:"";border-radius:50%;width:7px;height:7px}.traffic-chart__key--accepted:before{background:var(--traffic-green)}.traffic-chart__key--limited:before{background:var(--traffic-red)}.traffic-chart__key--universal:before{background:var(--traffic-blue)}.traffic-chart__key--platform:before{background:var(--traffic-purple)}.traffic-chart__key--mobile:before{background:var(--traffic-cyan)}.traffic-chart__svg,.traffic-chart__bars{width:100%;height:auto;margin-top:12px;display:block;overflow:visible}.traffic-chart__grid{stroke:var(--traffic-border);stroke-width:1px}.traffic-chart__axis{fill:var(--traffic-muted);text-anchor:end;font-size:9px}.traffic-chart__axis--time{text-anchor:middle}.traffic-chart__line{fill:none;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.traffic-chart__line--accepted{stroke:var(--traffic-green)}.traffic-chart__line--limited{stroke:var(--traffic-red);stroke-dasharray:5 4}.traffic-chart__line--universal{stroke:var(--traffic-blue)}.traffic-chart__line--platform{stroke:var(--traffic-purple);stroke-dasharray:8 5}.traffic-chart__line--mobile{stroke:var(--traffic-cyan);stroke-dasharray:2 5}.traffic-chart__empty{min-height:200px;color:var(--traffic-muted);text-align:center;place-items:center;margin:0;font-size:12px;display:grid}.traffic-donut{grid-template-columns:minmax(130px,180px) 1fr;align-items:center;gap:16px;min-height:220px;display:grid;position:relative}.traffic-donut svg{width:100%;transform:rotate(-90deg)}.traffic-donut circle{fill:none;stroke-width:17px}.traffic-donut__track{stroke:var(--traffic-border)}.traffic-donut__accepted{stroke:var(--traffic-green)}.traffic-donut__limited{stroke:var(--traffic-red)}.traffic-donut__rest{stroke:var(--traffic-blue)}.traffic-donut__sse{stroke:var(--traffic-purple)}.traffic-donut__total{pointer-events:none;place-items:center;width:180px;display:grid;position:absolute;left:0}.traffic-donut__total strong{font-size:22px}.traffic-donut__total span{color:var(--traffic-muted);text-transform:uppercase;letter-spacing:.08em;font-size:9px}.traffic-chart__summary{gap:14px;margin:0;display:grid}.traffic-chart__summary div{border-bottom:1px solid var(--traffic-border);justify-content:space-between;align-items:center;gap:20px;padding-bottom:10px;display:flex}.traffic-chart__summary dt{color:var(--traffic-muted);font-size:11px}.traffic-chart__summary dd{margin:0;font-size:16px;font-weight:700}.traffic-chart__bar-label{fill:var(--traffic-muted);font-size:10px}.traffic-chart__bar-value{fill:var(--traffic-text);text-anchor:end;font-size:10px;font-weight:700}.traffic-chart__bar-track{fill:var(--traffic-border)}.traffic-chart__bar--accepted{fill:var(--traffic-green)}.traffic-chart__bar--limited{fill:var(--traffic-red)}.traffic-chart__bar--pressure{fill:var(--traffic-purple)}.traffic-channel-bars{align-content:center;gap:22px;min-height:210px;display:grid}.traffic-channel-bar{gap:8px;display:grid}.traffic-channel-bar__label{color:var(--traffic-muted);justify-content:space-between;align-items:center;gap:20px;font-size:11px;display:flex}.traffic-channel-bar__label strong{color:var(--traffic-text);font-size:12px}.traffic-channel-bar__progress{background:var(--traffic-border);appearance:none;border:0;border-radius:999px;width:100%;height:10px;overflow:hidden}.traffic-channel-bar__progress::-webkit-progress-bar{background:var(--traffic-border);border-radius:999px}.traffic-channel-bar__progress::-webkit-progress-value{background:var(--traffic-blue);border-radius:999px}.traffic-channel-bar__progress::-moz-progress-bar{background:var(--traffic-blue);border-radius:999px}.traffic-channel-bar__progress--platform::-webkit-progress-value{background:var(--traffic-purple)}.traffic-channel-bar__progress--platform::-moz-progress-bar{background:var(--traffic-purple)}.traffic-channel-bar__progress--mobile::-webkit-progress-value{background:var(--traffic-cyan)}.traffic-channel-bar__progress--mobile::-moz-progress-bar{background:var(--traffic-cyan)}.traffic-panel{border:1px solid var(--traffic-border);border-radius:var(--traffic-radius);background:var(--traffic-surface);margin-top:16px;overflow:hidden}.traffic-panel h2{border-bottom:1px solid var(--traffic-border);margin:0;padding:17px 18px;font-size:14px}.traffic-panel__description{border-bottom:1px solid var(--traffic-border);color:var(--traffic-muted);margin:0;padding:13px 18px;font-size:12px}.traffic-table-wrap{overflow-x:auto}.traffic-table{border-collapse:collapse;width:100%;font-size:12px}.traffic-table th{background:var(--traffic-elevated);color:var(--traffic-muted);text-align:left;white-space:nowrap;padding:10px 13px}.traffic-table td{border-top:1px solid var(--traffic-border);white-space:nowrap;padding:12px 13px}.traffic-mono{font-family:JetBrains Mono,Consolas,monospace}.traffic-badge,.traffic-status{color:var(--traffic-green);background:#6ee7a01a;border-radius:999px;padding:3px 8px;font-size:10px;font-weight:700;display:inline-flex}.traffic-badge{color:var(--traffic-blue);background:#2f88f81a}.traffic-status--limited{color:var(--traffic-red);background:#f08a7a1a}.traffic-empty{color:var(--traffic-muted);text-align:center;margin:0;padding:40px 18px;font-size:13px}@media (width<=1200px){.traffic-detail-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=1000px){.traffic-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.traffic-charts,.traffic-channel-grid{grid-template-columns:1fr}}@media (width<=640px){.traffic-shell{width:min(100% - 24px,1500px)}.traffic-header,.traffic-analytics__heading,.traffic-section-heading{flex-direction:column;align-items:flex-start}.traffic-actions{flex-wrap:wrap;width:100%}.traffic-metrics,.traffic-detail-metrics{grid-template-columns:1fr}.traffic-chart{min-height:260px;padding:14px}.traffic-chart__header{flex-direction:column}.traffic-donut{grid-template-columns:1fr}.traffic-donut svg{max-width:180px;margin:0 auto}.traffic-donut__total{width:180px;top:58px;left:50%;transform:translate(-50%)}}