.speed-header{display:flex;justify-content:space-between;align-items:end;gap:24px;margin:0 0 20px;padding:24px 28px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}
.speed-header h2{font-size:27px;line-height:1.2;margin:6px 0;letter-spacing:-.5px}
.speed-header p{margin:0;color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.speed-actions{display:flex;flex-wrap:wrap;gap:9px}
.speed-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line);border-radius:9px;overflow:hidden;margin-bottom:16px}
.speed-metrics>div{background:var(--surface);padding:17px 22px}
.speed-metrics span{display:block;font-size:10px;font-weight:700;letter-spacing:1.1px;color:var(--muted)}
.speed-metrics strong{display:block;font-size:30px;font-weight:650;line-height:1.45;font-variant-numeric:tabular-nums}
.speed-metrics em{font-size:12px;margin-left:6px;font-weight:500;font-style:normal;color:var(--muted)}
.speed-metrics small{font-size:10px;color:var(--muted)}
.speed-disclaimer{font-size:11px;color:var(--muted);line-height:1.7;margin:0 0 22px}
.speed-layout{display:grid;grid-template-columns:minmax(265px,315px) minmax(0,1fr);gap:18px;align-items:start}
.speed-index{padding:20px 14px}
.speed-index .panel-heading{padding:0 9px;margin-bottom:10px}
.speed-event{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;text-align:left;background:transparent;color:var(--ink);border:0;border-left:3px solid transparent;padding:14px 9px;border-radius:4px}
.speed-event+.speed-event{border-top:1px solid var(--line)}
.speed-event:hover,.speed-event.selected{background:color-mix(in srgb,var(--green) 10%,var(--surface))}
.speed-event.selected{border-left-color:var(--green)}
.speed-event-number{font-size:10px;font-family:Consolas,monospace;color:var(--muted)}
.speed-event strong{display:block;font-size:12px}
.speed-event small{display:block;color:var(--muted);font-size:10px;white-space:nowrap}
.speed-event b{font-size:17px;font-variant-numeric:tabular-nums}
.speed-event b small{display:inline;font-size:9px}
.speed-detail{padding:25px 28px}
.speed-detail .panel-heading h2{font-size:19px;margin:4px 0}
.speed-period{color:var(--muted);font-size:12px}
.speed-event-metrics{display:flex;align-items:baseline;flex-wrap:wrap;gap:20px;padding:14px 0;margin:16px 0 8px;border-top:1px solid var(--line)}
.speed-event-metrics span{font-size:10px;font-weight:700;letter-spacing:1px;color:var(--muted)}
.speed-event-metrics strong{font-size:19px;margin-left:6px;color:var(--ink);letter-spacing:0;font-variant-numeric:tabular-nums}
.speed-event-metrics small{color:var(--muted)}
.speed-plot{display:flex;gap:8px;align-items:stretch}
.speed-y-axis{height:220px;display:flex;flex-direction:column;justify-content:space-between;padding:0 0 7px;color:var(--muted);font-size:10px}
.speed-plot svg{width:100%;height:220px;overflow:visible;cursor:crosshair;background:color-mix(in srgb,var(--green) 3%,var(--surface));border:1px solid var(--line)}
.speed-grid{fill:none;stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke}
.speed-line{fill:none;stroke:var(--green);stroke-width:2;vector-effect:non-scaling-stroke}
.speed-marker{fill:var(--green);stroke:var(--surface);stroke-width:2;vector-effect:non-scaling-stroke}
.speed-axis{display:flex;justify-content:space-between;margin:5px 0 13px;padding-left:25px;color:var(--muted);font-size:10px}
.speed-reading{border-left:3px solid var(--green);padding:8px 12px;margin-bottom:27px;background:color-mix(in srgb,var(--green) 10%,var(--surface));font-size:12px;font-variant-numeric:tabular-nums}
.speed-samples{max-height:380px;overflow:auto}
.speed-samples th{position:sticky;top:0;z-index:1}
.speed-samples td{padding:5px 9px;font-variant-numeric:tabular-nums}
.speed-sample{background:none;border:0;color:var(--ink);padding:3px 0;font-family:Consolas,monospace;font-size:11px}
.speed-sample:hover,.speed-sample.selected{color:var(--green);font-weight:700}
.speed-day-panel{margin:0 0 20px;padding:25px 28px 19px}
.speed-day-heading{display:flex;align-items:end;justify-content:space-between;gap:20px}
.speed-day-heading h2{font-size:22px;letter-spacing:-.5px;margin:5px 0 3px}
.speed-day-heading p{color:var(--muted);font-size:11px;margin:0}
.speed-day-heading label{flex:0 0 178px;color:var(--muted);font-size:11px}
.speed-day-heading input{display:block;width:100%;margin-top:6px}
.speed-day-facts{display:flex;flex-wrap:wrap;gap:8px 22px;margin:21px 0 13px;color:var(--muted);font-size:11px}
.speed-day-facts strong{color:var(--ink);font-variant-numeric:tabular-nums;font-size:13px}
.speed-day-plot{display:flex;gap:9px}
.speed-day-y{display:flex;flex:0 0 48px;height:232px;flex-direction:column;justify-content:space-between;padding:18px 0 20px;color:var(--muted);font-size:10px;font-variant-numeric:tabular-nums;text-align:right}
.speed-day-plot svg{width:100%;height:232px;border:1px solid var(--line);border-radius:3px;background:linear-gradient(180deg,color-mix(in srgb,var(--green) 4%,var(--surface)),var(--surface));cursor:crosshair}
.speed-day-plot svg:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.speed-day-grid{stroke:var(--line);stroke-width:1;stroke-dasharray:3 5;vector-effect:non-scaling-stroke}
.speed-day-range{fill:none;stroke:var(--green);stroke-width:2.5;opacity:.36;vector-effect:non-scaling-stroke}
.speed-day-line{fill:none;stroke:var(--green);stroke-width:1.5;vector-effect:non-scaling-stroke}
.speed-day-single,.speed-day-selected{fill:var(--green);stroke:var(--surface);stroke-width:2;vector-effect:non-scaling-stroke}
.speed-day-cursor{stroke:var(--ink);stroke-width:1;stroke-dasharray:4 3;opacity:.6;vector-effect:non-scaling-stroke}
.speed-day-hours{display:flex;justify-content:space-between;padding-left:56px;margin:6px 0 15px;color:var(--muted);font:10px Consolas,monospace;font-variant-numeric:tabular-nums}
.speed-day-reading{min-height:34px;border-left:3px solid var(--green);padding:8px 11px;background:color-mix(in srgb,var(--green) 8%,var(--surface));font-size:11px;font-variant-numeric:tabular-nums}
.speed-day-note{margin:10px 0 0;color:var(--muted);font-size:10px;line-height:1.55}
.speed-vu-date{display:block;margin:0 9px 14px;color:var(--muted);font-size:11px}
.speed-vu-date input{display:block;width:100%;margin-top:6px}
.speed-index:has(.speed-vu-date) #speed-events{max-height:680px;overflow:auto}
.speed-index:has(.speed-vu-date) .speed-event small{white-space:normal}
.speed-index:has(.speed-vu-date) .pagination{flex-wrap:wrap}
.speed-invalid{padding:13px 16px;border:1px solid #9c4741;border-left:4px solid #e5261f;border-radius:5px;background:#351d1b;color:#ffd2ca}
html[data-theme="light"] .speed-invalid{background:#fff0ec;color:#96392e;border-color:#e5b4a9;border-left-color:#d52820}
@media(max-width:1150px){.speed-layout{grid-template-columns:1fr}.speed-index #speed-events{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}}
@media(max-width:650px){.speed-header{display:block;padding:20px}.speed-actions{margin-top:14px}.speed-header h2{font-size:22px}.speed-metrics{grid-template-columns:repeat(2,1fr)}.speed-day-panel{padding:19px 14px}.speed-day-heading{align-items:start;flex-direction:column;gap:15px}.speed-day-heading label{flex:auto;width:100%}.speed-day-heading h2{font-size:20px}.speed-day-facts{gap:5px 14px}.speed-day-plot svg,.speed-day-y{height:190px}.speed-day-y{flex-basis:38px}.speed-day-hours{padding-left:47px;font-size:9px}.speed-index #speed-events{grid-template-columns:1fr}.speed-detail{padding:18px 15px}.speed-plot svg,.speed-y-axis{height:170px}}
