/* v0.12.0: compact BI workspace, drill-down navigation and responsive shell */
:root{
  --bg:#f3f3f0;
  --panel:#fff;
  --text:#242424;
  --muted:#72726d;
  --line:#deded8;
  --line-strong:#c7c7bf;
  --sidebar:#20211f;
  --sidebar-soft:#2b2c29;
  --active:#178a5b;
  --active-soft:#e8f4ee;
  --warn:#b87918;
  --warn-soft:#fbf3e3;
  --risk:#c1414a;
  --risk-soft:#fae9ea;
  --link:#2463b4;
  --link-hover:#174b8d;
  --accent:#6357c7;
  --accent-soft:#efedfb;
}
html{scroll-behavior:smooth}
body{background:var(--bg);font-family:GothamProLight,Arial,sans-serif;font-size:14px;line-height:1.45}
h1,h2,h3,.brand b,.kpi-card strong,.health-score strong,.quality-strip strong,.summary-link strong{font-family:GothamPro,Arial,sans-serif;font-weight:500}
aside{width:210px;padding:24px 14px 16px;background:var(--sidebar);border:0;box-shadow:none}
.brand{display:grid;gap:1px;min-height:0;padding:5px 10px;color:#fff;font-size:18px;line-height:1.15}
.brand b{color:#fff}.brand small{color:#94978f;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.primary-nav{display:grid;margin-top:27px;gap:4px}
.primary-nav a{display:flex;align-items:center;gap:10px;padding:10px 11px;border:0;border-radius:0;color:#b9bbb5;transition:background 130ms ease,color 130ms ease}
.primary-nav a:hover{background:var(--sidebar-soft);border:0;color:#fff;transform:none}
.primary-nav a.active{background:#fff;border:0;color:#20211f;box-shadow:none;font-weight:500}
.nav-icon{display:grid;place-items:center;width:20px;height:20px;font-family:Arial,sans-serif;font-size:16px}
.nav-secondary{display:grid;gap:2px;margin-top:28px;padding-top:17px;border-top:1px solid #363733}
.nav-secondary>span{padding:0 10px 7px;color:#777a73;font-size:9px;letter-spacing:.1em;text-transform:uppercase}
.nav-secondary a{padding:7px 10px;color:#a4a69f;font-size:12px}.nav-secondary a:hover,.nav-secondary a.active{background:var(--sidebar-soft);color:#fff}
.aside-foot{display:grid;grid-template-columns:minmax(0,1fr) 28px 28px;align-items:center;gap:6px;margin-top:auto}
.aside-foot a{color:#b8bab4}.aside-foot>a:first-child{min-width:0}.aside-foot small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.aside-foot span{display:none}
.aside-foot>a:not(:first-child){display:grid;place-items:center;height:28px;border:1px solid #3d3e3a;color:#fff}
.app{width:calc(100% - 210px);max-width:none;margin-left:210px;padding:20px 26px 48px}
.top{display:flex;align-items:end;justify-content:space-between;gap:24px;min-height:74px;margin:0 0 14px;padding:14px 17px;background:#fff;border:1px solid var(--line);border-radius:0;box-shadow:none}
.page-heading{min-width:185px}.page-heading h1{margin:3px 0 0;font-size:24px;line-height:1.08;letter-spacing:-.01em}.eyebrow{margin:0;color:var(--muted);font-size:10px;letter-spacing:.09em;text-transform:uppercase}
.filters{display:flex;align-items:end;justify-content:flex-end;gap:7px;flex-wrap:nowrap}
.filters label{display:grid;gap:3px;font-weight:400}.filters label>span{color:var(--muted);font-size:9px;letter-spacing:.06em;text-transform:uppercase}
.filters select,.filters input,.filters button{display:block;min-height:34px;height:34px;border:1px solid var(--line-strong);border-radius:0;padding:6px 9px;background:#fff;font-size:12px}
.filters select{min-width:170px}.filters button{padding-inline:14px;background:#252522;border-color:#252522;color:#fff}
.section-tabs{display:flex;gap:0;margin:0 0 14px;overflow-x:auto;border-bottom:1px solid var(--line);scrollbar-width:none}.section-tabs::-webkit-scrollbar{display:none}
.section-tabs a{position:relative;flex:0 0 auto;padding:10px 15px;color:var(--muted);font-size:12px;white-space:nowrap}.section-tabs a:hover{color:var(--text);background:#ecece8}.section-tabs a.active{color:var(--text);font-family:GothamPro,Arial,sans-serif;font-weight:500}.section-tabs a.active:after{content:"";position:absolute;inset:auto 12px -1px;height:2px;background:var(--text)}
.panel,.sh-trend-chart{border:1px solid var(--line);border-radius:0;background:#fff;box-shadow:none}.panel{padding:17px 18px}.panel h2,.sh-trend-chart h2{font-size:15px}.panel>h2:before,.panel-head h2:before{display:none}.panel-head{align-items:center;margin-bottom:12px}.panel-head h2{margin:0}.panel-head p{margin:3px 0 0;font-size:11px}.text-link{color:#4f4f49;font-size:11px;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
.kpi-card{position:relative;display:grid;align-content:center;min-height:92px;padding:13px 36px 12px 14px;border:1px solid var(--line);border-left:3px solid #4c4d49;background:#fff;color:var(--text);transition:border-color 130ms ease,background 130ms ease}
.kpi-card:hover{border-color:#aeadA7;background:#fafaf8}.kpi-card.good{border-left-color:var(--active)}.kpi-card.warn{border-left-color:var(--warn)}.kpi-card.bad{border-left-color:var(--risk)}.kpi-card.accent{border-left-color:var(--accent)}
.kpi-card strong{display:block;margin:5px 0 4px;font-size:25px;line-height:1}.kpi-label{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:11px}.kpi-card>i{position:absolute;right:13px;top:50%;font-style:normal;color:#8a8b85;transform:translateY(-50%)}
.delta{font-size:9px;color:var(--muted)}.delta.up{color:var(--active)}.delta.down{color:var(--risk)}.delta.neutral{color:var(--muted)}
.metric-help{position:relative;display:inline-grid;place-items:center;width:15px;height:15px;border:1px solid #b6b7b0;border-radius:50%;color:#767770;font-family:Arial,sans-serif;font-size:10px;line-height:1;cursor:help;outline:none}
.metric-help:after{content:attr(data-tip);position:absolute;z-index:30;left:50%;bottom:calc(100% + 8px);width:260px;padding:9px 10px;background:#20211f;color:#fff;font-size:11px;font-weight:400;line-height:1.45;white-space:normal;opacity:0;pointer-events:none;transform:translate(-50%,4px);transition:opacity 120ms ease,transform 120ms ease}
.metric-help:hover:after,.metric-help:focus:after{opacity:1;transform:translate(-50%,0)}
.overview-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);gap:12px;margin-bottom:14px}
.health-panel,.action-panel{min-height:286px}.health-score{display:grid;grid-template-columns:auto auto;align-items:end;padding:7px 10px;border-left:3px solid var(--muted);background:#f1f1ee}.health-score.good{border-color:var(--active);background:var(--active-soft)}.health-score.warn{border-color:var(--warn);background:var(--warn-soft)}.health-score.bad{border-color:var(--risk);background:var(--risk-soft)}.health-score strong{font-size:23px;line-height:1}.health-score>span{font-size:11px}.health-score small{grid-column:1/-1;margin-top:2px;font-size:8px;text-transform:uppercase}
.health-list{display:grid}.health-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto 14px;align-items:center;gap:9px;min-height:42px;padding:7px 2px;border-top:1px solid #ecece8;color:var(--text)}.health-row:first-child{border-top:0}.health-row span:nth-child(2){display:grid}.health-row small{color:var(--muted);font-size:9px}.health-row strong{font-size:11px;text-align:right}.health-row i{font-style:normal;color:#a0a19b}
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#a3a49e;box-shadow:0 0 0 3px rgba(163,164,158,.12)}.status-dot.good{background:var(--active);box-shadow:0 0 0 3px rgba(23,138,91,.12)}.status-dot.warn{background:var(--warn);box-shadow:0 0 0 3px rgba(184,121,24,.12)}.status-dot.bad{background:var(--risk);box-shadow:0 0 0 3px rgba(193,65,74,.12)}.status-dot.neutral{background:#92938d}
.counter-badge{display:grid;place-items:center;min-width:27px;height:23px;padding:0 6px;background:#ecece8;color:#4d4e49;font-size:11px}.checklist{display:grid}.check-item{display:grid;grid-template-columns:10px minmax(0,1fr) 14px;align-items:center;gap:9px;min-height:54px;padding:8px 2px;border-top:1px solid #ecece8;color:var(--text)}.check-item:first-child{border-top:0}.check-item>span:nth-child(2){display:grid}.check-item small{color:var(--muted);font-size:9px}.check-item i{font-style:normal;color:#9a9b95}.check-empty{display:grid;place-items:center;gap:5px;padding:31px 12px;text-align:center}.check-empty>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--active-soft);color:var(--active);font-size:18px}.check-empty small{color:var(--muted);font-size:10px}
.dashboard-chart{margin-bottom:14px}.dashboard-chart .sh-trend-chart{padding:16px 18px 12px}.dashboard-chart .sh-trend-chart svg{max-height:245px}.sh-trend-grid{gap:12px;margin:14px 0}.sh-trend-chart{padding:16px}.sh-trend-chart svg{max-height:280px}.sh-trend-legend{font-size:10px}
.grid{gap:12px;margin:12px 0}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.compact-grid{align-items:start}
.table-wrap{max-width:100%;overflow:auto;border:1px solid #e3e3de;border-radius:0}.table-wrap table{border:0}table{font-size:11px}th,td{padding:8px 9px;line-height:1.3}th{top:0;background:#f1f1ee;color:#62635d;font-weight:500}tbody tr:nth-child(even) td{background:#fafaf8}tbody tr:hover td{background:#f4f4f0}.compact-table td,.compact-table th{padding-block:7px}.clip{max-width:260px}
.pill{border-radius:0;padding:3px 6px}.pill.good{color:#0c6847;background:var(--active-soft)}.pill.warn{color:#7a4d0b;background:var(--warn-soft)}.pill.bad{color:#942f37;background:var(--risk-soft)}.pill.neutral{color:#5f605b;background:#eeeEea}
.data-health{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 14px;padding:11px 13px;border:1px solid var(--line);border-left:3px solid #8f908a;background:#fff}.data-health>div{display:flex;align-items:center;gap:11px}.data-health p{margin:2px 0 0;color:var(--muted);font-size:10px}.data-health a{font-size:11px;white-space:nowrap}.data-health.good{border-left-color:var(--active)}.data-health.warn{border-left-color:var(--warn)}.data-health.bad{border-left-color:var(--risk)}
.direct-summary{margin-top:0}.summary-link{display:grid;min-height:104px;padding:15px;border:1px solid var(--line);background:#fff;color:var(--text)}.summary-link:hover{border-color:var(--line-strong);background:#fafaf8}.summary-link strong{font-size:25px}.summary-link span{color:var(--muted);font-size:11px}.summary-link small{align-self:end;margin-top:10px;font-size:9px}.setup-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:12px}.direct-setup{margin-top:0}.setup-status{display:flex;align-items:center;gap:9px;margin:18px 0;padding:12px;background:#f3f3ef}
.quality-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin-bottom:12px;border:1px solid var(--line);background:var(--line)}.quality-strip a{display:grid;gap:3px;min-height:72px;padding:11px 12px;background:#fff;color:var(--text)}.quality-strip strong{font-size:20px}.quality-strip span{color:var(--muted);font-size:9px}.web-vitals .metric{min-height:142px;text-align:left}.web-vitals .metric strong{color:var(--text);font-size:25px}.web-vitals .metric p{margin-bottom:0;font-size:10px}.section-intro{margin-bottom:2px;padding:4px 0 8px}.section-intro h2{margin:4px 0 0;font-size:18px}.recommendations{gap:9px}.recommendations article{border-radius:0;padding:15px}.recommendations article>span{border-radius:0;background:#ecece8}.recommendations h2{font-size:14px}.recommendations p{font-size:11px}
.diagnostic-strip{grid-template-columns:repeat(4,minmax(0,1fr))}
.project-grid{align-items:start}.calibration-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:12px;padding:18px 20px;border:1px solid var(--line);background:#fff}.calibration-hero h2{margin:4px 0 6px;font-size:21px}.calibration-hero p{max-width:680px;margin:0;color:var(--muted);font-size:11px}.calibration-ring{display:grid;place-items:center;flex:0 0 92px;height:92px;border:7px solid #deded8;border-radius:50%}.calibration-ring.good{border-color:var(--active)}.calibration-ring.warn{border-color:var(--warn)}.calibration-ring strong{font-size:20px}.calibration-ring span{margin-top:-15px;color:var(--muted);font-size:8px}.threshold-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:10px}.threshold-flow>div{display:grid;gap:5px;padding:12px;background:#f3f3ef;text-align:center}.threshold-flow span{color:var(--muted);font-size:9px}.threshold-flow strong{font-size:24px}.threshold-flow .result{background:var(--active-soft)}.progress-track{height:9px;margin:8px 0 20px;background:#e6e6e1;overflow:hidden}.progress-track i{display:block;height:100%;background:var(--active)}
.metric-explainer{font-size:10px}.notice{padding:10px 12px;border-radius:0;font-size:11px}.storage-notice{margin:0 0 12px}.admin-status{margin-top:12px}.admin-status summary{font-size:12px}

@media(max-width:1180px){
  .app{padding:18px 20px 42px}
  .top{align-items:stretch;flex-direction:column;gap:10px}
  .filters{display:grid;grid-template-columns:minmax(180px,1.4fr) repeat(2,minmax(125px,1fr)) auto;width:100%}
  .filters input{display:block}
  .filters select{width:100%}
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .overview-grid{grid-template-columns:1fr}
  .health-panel,.action-panel{min-height:0}
  .setup-grid{grid-template-columns:1fr}
}

@media(max-width:760px){
  body{display:block;padding-bottom:62px}
  aside{position:static;display:flex;align-items:center;justify-content:space-between;width:100%;height:54px;padding:8px 12px;background:var(--sidebar)}
  aside .brand{display:grid;padding:0;font-size:16px}.brand small{font-size:7px}
  .primary-nav{position:fixed;z-index:50;inset:auto 0 0;display:grid;grid-template-columns:repeat(4,1fr);height:62px;margin:0;padding:5px 4px 4px;border-top:1px solid #3b3c38;background:var(--sidebar)}
  .primary-nav a{display:grid;justify-items:center;align-content:center;gap:2px;padding:3px 2px;color:#bcbeb8;font-size:9px;text-align:center}.primary-nav a.active{background:#fff;color:#20211f}.nav-icon{height:19px}
  .nav-secondary{display:flex;gap:5px;margin:0 8px 0 auto;padding:0;border:0}.nav-secondary>span{display:none}.nav-secondary a{padding:5px 7px;border:1px solid #3b3c38;font-size:9px}
  .aside-foot{display:flex;gap:4px;margin:0}.aside-foot>a:first-child{display:none}.aside-foot>a:not(:first-child){height:27px;width:27px}
  .app{width:100%;margin:0;padding:10px 10px 26px}
  .top{position:static;min-height:0;margin-bottom:9px;padding:11px}.page-heading h1{font-size:20px}.page-heading .eyebrow{font-size:8px}
  .filters{grid-template-columns:1fr 1fr;gap:6px}.filters label:first-of-type{grid-column:1/-1}.filters button{align-self:end;width:100%}.filters select,.filters input,.filters button{height:36px;min-height:36px}
  .section-tabs{margin-bottom:10px}.section-tabs a{padding:9px 12px;font-size:11px}
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.kpi-card{min-height:83px;padding:10px 27px 9px 11px}.kpi-card strong{font-size:21px}.kpi-label{font-size:9px}.delta{font-size:8px}
  .metric-help:after{position:fixed;left:12px;right:12px;bottom:72px;width:auto;transform:none}.metric-help:hover:after,.metric-help:focus:after{transform:none}
  .overview-grid{gap:8px}.panel{padding:13px}.panel-head{gap:9px}.health-score{padding:6px 8px}.health-row{grid-template-columns:9px minmax(0,1fr) auto 10px}.health-row small{max-width:180px}.check-item{min-height:48px}
  .sh-trend-chart{padding:12px 9px}.sh-trend-chart svg{min-width:520px}.sh-trend-chart{overflow-x:auto}.sh-trend-legend{position:sticky;left:0}
  .grid.two,.grid.three{grid-template-columns:1fr}.grid{gap:8px;margin:8px 0}.compact-grid{grid-template-columns:1fr}
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}table{min-width:620px}th:first-child,td:first-child{position:sticky;left:0;z-index:2;background:#fff}th:first-child{z-index:3;background:#f1f1ee}tbody tr:nth-child(even) td:first-child{background:#fafaf8}
  .quality-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.quality-strip a:last-child{grid-column:1/-1}.quality-strip a{min-height:62px}.web-vitals{grid-template-columns:1fr!important}.web-vitals .metric{min-height:0}
  .data-health{align-items:flex-start;flex-direction:column;gap:8px}.data-health a{margin-left:19px}
  .calibration-hero{align-items:flex-start;padding:14px}.calibration-ring{flex-basis:75px;height:75px;border-width:5px}.calibration-ring strong{font-size:16px}.threshold-flow{grid-template-columns:1fr}.threshold-flow>i{transform:rotate(90deg);text-align:center}
  .trust-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:82px}.cards article,.cards article:nth-child(n){padding:10px}.cards strong{font-size:20px}
  .subfilters{display:grid;grid-template-columns:1fr 1fr}.subfilters button,.subfilters select{width:100%}
  .clip{max-width:190px}
}

@media(max-width:420px){
  .nav-secondary{display:none}
  .kpi-card strong{font-size:19px}
  .health-row strong{max-width:78px}
}

/* Semantic colors and overflow fixes */
.text-link{color:var(--link)}
.notice.good{border-left-color:var(--active)}
.notice.warn{border-color:#e7c47e;border-left-color:var(--warn);background:var(--warn-soft);color:#5e451c}
.storage-cards article:nth-child(4) strong,.storage-cards article:nth-child(6) strong{color:var(--warn)}
.kpi-card.good strong{color:var(--active)}
.kpi-card.warn strong{color:var(--warn)}
.kpi-card.bad strong{color:var(--risk)}
.kpi-card.accent strong{color:var(--accent)}
.health-row:has(.status-dot.good)>strong{color:var(--active)}
.health-row:has(.status-dot.warn)>strong{color:var(--warn)}
.health-row:has(.status-dot.bad)>strong{color:var(--risk)}
.reasons b{color:var(--active)}
.reasons b.negative{color:var(--risk)}
.panel td a,.panel p a,.panel li a,.storage-notice a,.data-health>a,.setup-status a,.admin-status a,details.panel summary{color:var(--link);text-decoration:underline;text-decoration-color:rgba(36,99,180,.4);text-underline-offset:3px}
.panel td a:hover,.panel p a:hover,.panel li a:hover,.storage-notice a:hover,.data-health>a:hover,.setup-status a:hover,.admin-status a:hover,details.panel summary:hover,.text-link:hover{color:var(--link-hover);text-decoration-color:currentColor}
.kpi-card>i,.summary-link small,.health-row i,.check-item i{color:var(--link)}
.metric-explainer{margin:10px 0 18px;line-height:1.55;clear:both}
.threshold-flow{margin-bottom:0}
.threshold-flow>i:first-of-type{color:var(--active);font-family:GothamPro,Arial,sans-serif;font-size:18px;font-style:normal}
.threshold-flow>i:last-of-type{color:var(--link);font-style:normal}
.top>*,.panel-head>*,.health-row>*,.check-item>*,.data-health>*,.calibration-hero>*{min-width:0}
.kpi-label,.panel-head p,.health-row small,.check-item small,.data-health p,.calibration-hero p,.metric-explainer{overflow-wrap:anywhere}
.panel-head{flex-wrap:wrap}
.health-row strong{max-width:150px;overflow-wrap:anywhere}
.summary-link{min-width:0;overflow-wrap:anywhere}
.local-time{white-space:nowrap;font-variant-numeric:tabular-nums}
.timezone-note{display:block;margin-top:5px;color:var(--muted);font-size:9px}
.timezone-note b{color:var(--text);font-weight:500}
html,body{max-width:100%;overflow-x:hidden}
.app{min-width:0}

@media(max-width:760px){
  .calibration-hero{flex-wrap:wrap}
  .health-row strong{max-width:92px}
  .metric-explainer{margin-top:8px}
}

/* v0.13.0: transparent goal decision */
.trust-cards article:nth-child(2),.trust-cards article:nth-child(3),.trust-cards article:nth-child(4){border-top-color:var(--active)}
.trust-cards article:nth-child(5){border-top-color:var(--risk)}
.trust-cards article:nth-child(6){border-top-color:var(--warn)}
.trust-cards article.metric-positive{border-top-color:var(--active)}
.trust-cards article.metric-warning{border-top-color:var(--warn)}
.trust-cards article.metric-negative{border-top-color:var(--risk)}
.trust-cards article.metric-neutral{border-top-color:var(--line)}
.trust-cards article.metric-positive strong{color:var(--active)}
.trust-cards article.metric-warning strong{color:var(--warn)}
.trust-cards article.metric-negative strong{color:var(--risk)}
.decision-panel>.panel-head{align-items:flex-start}
.decision-gates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:0 0 14px;padding:1px;list-style:none;background:#fff;border:1px solid var(--line)}
.decision-gates li{display:grid;grid-template-columns:20px minmax(0,1fr);align-items:center;gap:0 8px;min-height:52px;padding:9px 10px;background:#fff;outline:1px solid var(--line)}
.decision-gates li:last-child:nth-child(odd){grid-column:1/-1}
.decision-gates li>span{grid-row:1/3;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;font-family:Arial,sans-serif;font-size:11px}
.decision-gates li>b{font-size:11px;font-weight:500}
.decision-gates li>small{color:var(--muted);font-size:9px;overflow-wrap:anywhere}
.decision-gates .pass>span{background:var(--active-soft);color:var(--active)}
.decision-gates .fail>span{background:var(--risk-soft);color:var(--risk)}
.decision-gates .fail>b{color:var(--risk)}
.decision-panel details{margin-top:0;padding-top:10px;border-top:1px solid var(--line)}
.decision-panel summary{color:var(--link);font-size:11px}

@media(max-width:760px){
  .decision-gates{grid-template-columns:1fr}
}

/* v0.15.0: continuous multi-page replay */
.sh-replay-controls{align-items:center;padding:9px 10px;border:1px solid var(--line);background:#fff}
.sh-replay-controls label{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:400;white-space:nowrap}
.sh-replay-controls select{height:30px;padding:4px 24px 4px 7px;border-radius:0;font-size:11px}
.sh-replay-skip-input{width:15px;height:15px;margin:0;padding:0;accent-color:var(--link)}
.sh-replay-pages{display:flex;align-items:center;gap:6px;margin:0 0 10px;padding:8px 9px;overflow-x:auto;border:1px solid var(--line);background:#f5f5f1;scrollbar-width:thin}
.sh-replay-pages-label{flex:0 0 auto;margin-right:2px;color:var(--muted);font-size:9px;letter-spacing:.05em;text-transform:uppercase}
.sh-replay-page{flex:0 0 auto;min-height:29px;padding:5px 8px;border:1px solid var(--line-strong);border-radius:0;background:#fff;color:var(--text);font-size:10px;font-weight:400}
.sh-replay-page:hover{border-color:var(--link);background:#f7f9fd;color:var(--link)}
.sh-replay-page.active{border-color:var(--link);background:var(--link);color:#fff}
.sh-replay-time{font-variant-numeric:tabular-nums;white-space:nowrap}

@media(max-width:760px){
  .sh-replay-controls{align-items:stretch}
  .sh-replay-progress{order:10;flex-basis:100%;width:100%}
  .sh-replay-pages{padding:7px}
  .sh-replay-pages-label{display:none}
}

/* v0.16.0: drill-down filters */
.quick-exit-row td,.quick-exit-row:nth-child(even) td{background:#fffaf0}
.quick-exit-row td:first-child{box-shadow:inset 3px 0 0 var(--warn)}
.quality-strip a.active{position:relative;background:var(--accent-soft)}
.quality-strip a.active:after{content:"";position:absolute;inset:auto 10px 0;height:2px;background:var(--accent)}
.web-vitals a.metric{display:block;color:var(--text);text-decoration:none}
.web-vitals a.metric:hover{border-color:var(--link);background:#fafcff}
.web-vitals a.metric.active{border-top:3px solid var(--accent);background:var(--accent-soft)}
.subfilters select[name="sort"]{min-width:180px}