/* Visitor mode uses the canonical replay, with authoring kept out of the demo. */
html[data-viewer-mode="sample"] #replay-dock :is(#replay-gauge-size,#clock-mode-toggle,#clip-fullscreen,#replay-view-controls,#replay-toggle-gauges,#demo-arrange-tools) { display:none!important; }
html[data-viewer-mode="sample"] #replay-dock #replay-clean-progress { display:flex;align-items:center;gap:12px; }
html[data-viewer-mode="sample"] #replay-dock #replay-clean-play { min-height:44px;min-width:72px; }
html[data-viewer-mode="sample"] #replay-dock #replay-clean-progress > input { flex:1;min-width:0;width:0;accent-color:var(--brand-lime,#9bcc15); }
html[data-viewer-mode="sample"] #replay-clean-progress #demo-speed { flex:none;white-space:nowrap; }
@media(max-width:759px) {
  html[data-viewer-mode="sample"] #replay-dock #replay-clean-progress { display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px; }
  html[data-viewer-mode="sample"] #replay-dock #replay-clean-progress > input { width:100%;grid-column:1 / -1;grid-row:2; }
  html[data-viewer-mode="sample"] #replay-clean-progress #demo-speed { justify-self:end; }
}
.tc-mobile-toggle,.tc-mobile-dismiss { display:none; }
html[data-viewer-mode="sample"] #root #sample-notice { position:relative;padding-right:84px; }
html[data-viewer-mode="sample"] #demo-notice-close { position:absolute;right:12px;top:10px; }
html[data-viewer-mode="sample"] :is(#demo-notice-close,#demo-notice-reopen) { min-height:36px;padding:6px 10px;background:var(--bg2);color:var(--text1);border:1px solid var(--border);border-radius:6px;cursor:pointer; }
@media(max-width:900px) {
  html[data-viewer-mode="sample"] .tc-card .tc-topbar { position:sticky;top:8px;z-index:42;align-self:flex-start;width:fit-content;max-width:100%;background:var(--bg1);border-radius:8px; }
  html[data-viewer-mode="sample"] .tc-topbar > :is(.tc-rail-toggle,.fc-title,.tc-topbar-meta) { display:none; }
  html[data-viewer-mode="sample"] .tc-mobile-toggle { display:block;min-height:44px;padding:10px 16px;border:1px solid var(--border);border-radius:8px;background:var(--bg2);color:var(--text1);cursor:pointer; }
  html[data-viewer-mode="sample"] .tc-mobile-toggle::after { content:' ▾'; }
  html[data-viewer-mode="sample"] .tc-mobile-toggle[aria-expanded="true"]::after { content:' ▴'; }
  html[data-viewer-mode="sample"] .tc-card .tc-layout { grid-template-columns:minmax(0,1fr); }
  html[data-viewer-mode="sample"] .tc-card .tc-rail { display:none; }
  html[data-viewer-mode="sample"] .tc-mobile-open .tc-rail { display:flex;position:fixed;inset:64px 12px auto;max-height:calc(100dvh - 84px);overflow:auto;overscroll-behavior:contain;padding:14px;background:var(--bg1);border:1px solid var(--border);border-radius:10px;z-index:41; }
  html[data-viewer-mode="sample"] .tc-mobile-open .tc-mobile-dismiss { display:block;position:fixed;inset:0;background:#0006;border:0;border-radius:0;z-index:40; }
  html[data-viewer-mode="sample"] .tc-mobile-open .tc-mobile-toggle { position:relative;z-index:42; }
}
body.unified-replay #replay-dock .dock-row { flex-direction:column;align-items:stretch; }
body.unified-replay #replay-dock #replay-clean-progress { flex:0 0 auto;width:100%; }
html[data-viewer-mode="sample"] .demo-author-only,
html[data-viewer-mode="sample"] [hidden] { display:none!important; }
html[data-viewer-mode="sample"] :is(#section-navigator,#rider-comparison,#scrubber-bar,#heel-toe-report-wrap) { display:none!important; }
html[data-viewer-mode="sample"] #replay-sensor-manager { padding:0;border:0;max-width:100%;width:100%;align-items:flex-start;gap:10px;margin-top:8px; }
html[data-viewer-mode="sample"] #replay-sensor-manager .sources-comparison { flex:0 1 620px;min-width:0;box-sizing:border-box; }
html[data-viewer-mode="sample"] #replay-sensor-manager .sources-receipt { flex:1 1 180px;max-width:280px;overflow-wrap:anywhere; }
html[data-viewer-mode="sample"] #demo-sensor-disclosure { width:100%;min-width:0;border-top:1px solid var(--border);margin-top:6px; }
html[data-viewer-mode="sample"] #demo-sensor-disclosure > summary { padding:12px 0;min-height:44px;box-sizing:border-box;cursor:pointer;color:var(--text1);font:600 13px/20px system-ui; }
html[data-viewer-mode="sample"] #header { display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 18px;overflow:visible;height:auto; }
html[data-viewer-mode="sample"] #brand { flex:none;font:750 18px system-ui; }
html[data-viewer-mode="sample"] #picker-group { display:flex;flex:1;flex-wrap:wrap;gap:8px;min-width:0;align-items:center; }
html[data-viewer-mode="sample"] #session-picker { width:auto;max-width:100%;min-width:0;flex:1 1 270px;min-height:38px;font:13px system-ui; }
html[data-viewer-mode="sample"] #demo-clip-label { display:flex;align-items:center;gap:8px;flex:1 1 280px;min-width:0;font:13px system-ui; }
html[data-viewer-mode="sample"] #demo-clip-picker { min-height:38px;min-width:0;max-width:100%;flex:1;font:13px system-ui; }
html[data-viewer-mode="sample"] .picker-label { font:12px system-ui;letter-spacing:0;text-transform:none; }
html[data-viewer-mode="sample"] #sample-notice { padding:10px 18px;font:12px/1.55 system-ui; }
html[data-viewer-mode="sample"] #view-replay.active.has-clip { display:block;min-height:0; }
html[data-viewer-mode="sample"] body[data-replay-layout] #view-replay.active #main { height:clamp(280px,calc(100dvh - 295px),800px); }
html[data-viewer-mode="sample"] #replay-dock { padding:6px 18px;gap:6px; }
html[data-viewer-mode="sample"] #replay-dock .dock-row { gap:6px; }
html[data-viewer-mode="sample"] #replay-clean-progress { min-height:46px;padding:3px 10px; }
html[data-viewer-mode="sample"] #replay-dock > #sensor-health { padding:3px 10px;margin:0; }
html[data-viewer-mode="sample"] #replay-clean-progress > input { min-height:28px;min-width:80px; }
html[data-viewer-mode="sample"] #replay-dock .dock-tools { gap:10px;align-items:center;width:100%; }
html[data-viewer-mode="sample"] #demo-speed { display:flex;align-items:center;gap:8px;font:13px system-ui; }
html[data-viewer-mode="sample"] #demo-speed select { color:#fff;background:#1b303e;border:1px solid #77939f;border-radius:8px;padding:8px;min-height:38px;font:13px system-ui; }
html[data-viewer-mode="sample"] #replay-dock #replay-gauge-size { font-size:12px; }
html[data-viewer-mode="sample"] #replay-view-panel { background:#152b39;max-height:calc(100dvh - 100px);top:24px; }
html[data-viewer-mode="sample"] #replay-view-panel .studio-tabs { grid-template-columns:repeat(3,1fr); }
html[data-viewer-mode="sample"] #replay-view-panel .replay-view-heading { position:sticky;top:-18px;z-index:3;background:#152b39;padding:8px 0; }
html[data-viewer-mode="sample"] #replay-view-panel small { color:#cfdee6;font-size:12px; }
html[data-viewer-mode="sample"] #replay-view-panel :is(button,select) { min-height:38px; }
html[data-viewer-mode="sample"] #replay-view-panel :is(#demo-facing,#demo-rider-label) { display:grid;gap:8px;font:14px system-ui; }
html[data-viewer-mode="sample"] #replay-view-panel #demo-rider-label { display:flex;align-items:center; }
html[data-viewer-mode="sample"] #replay-view-panel input[type="checkbox"] { width:24px;height:24px;accent-color:#8fdfca; }
html[data-viewer-mode="sample"] #demo-rider-position { border:1px solid #547581;border-radius:10px;padding:10px;display:flex;flex-wrap:wrap;gap:8px; }
html[data-viewer-mode="sample"] #demo-rider-position legend { font-size:13px; }
html[data-viewer-mode="sample"] #replay-reset-layout { position:static;inset:auto; }
html[data-viewer-mode="sample"] #replay-view-panel .replay-gauge-choice { grid-template-columns:minmax(0,1fr) 32px 85px; }
html[data-viewer-mode="sample"] #replay-view-panel .replay-gauge-columns { grid-template-columns:minmax(0,1fr) 32px 85px; }
html[data-viewer-mode="sample"] #replay-view-panel .replay-gauge-choice select { font-size:12px;padding:6px; }
html[data-viewer-mode="sample"] #demo-arrange-tools { display:flex;gap:8px; }
html[data-viewer-mode="sample"] #demo-arrange-tools button { padding:8px 12px;min-height:38px;border:1px solid #8edbc7;border-radius:8px;background:#203c48;color:#fff; }
html[data-viewer-mode="sample"] body:not([data-demo-editing="true"]) .video-gauge-mirror-resize { display:none!important; }
html[data-viewer-mode="sample"] body:not([data-demo-editing="true"]) #video-gauge-overlay .video-gauge-mirror { cursor:default; }
html[data-viewer-mode="sample"] body[data-demo-editing="true"] .video-gauge-mirror-resize { width:28px;height:28px;background:#102c40b3;border:1px solid #fff9; }
html[data-viewer-mode="sample"] :is(#replay-inset-smaller,#replay-inset-bigger) { background:rgba(16,35,48,.48);border:1px solid #ffffffb3;text-shadow:0 1px 3px #000; }
html[data-viewer-mode="sample"] body[data-demo-rider-hidden="true"] #stage-3d { visibility:hidden;pointer-events:none; }
html[data-viewer-mode="sample"] #sensor-health details > summary { cursor:pointer;font:13px/1.5 system-ui;min-height:28px; }
html[data-viewer-mode="sample"] #sensor-health details[open] .sensor-health-head { white-space:normal;margin:10px 0; }
html[data-viewer-mode="sample"] #sensor-health #sensor-health-track { display:flex;overflow-x:auto;height:32px;gap:2px; }
html[data-viewer-mode="sample"] #sensor-health .sensor-health-cell { min-width:26px;height:26px;flex:1 0 26px; }
html[data-viewer-mode="sample"] #sensor-health .sensor-health-head #sensor-health-detail { white-space:normal;overflow:visible; }
html[data-viewer-mode="sample"] #demo-responsive-hint { margin:12px 16px;color:var(--text2);font:13px/1.5 system-ui; }
html[data-viewer-mode="sample"] #demo-rider-help { margin:0;color:#cbdbe5;font:12px/1.5 system-ui; }
html[data-viewer-mode="sample"] #view-report { display:block; }
html[data-viewer-mode="sample"] #view-report .report-shell { max-width:1600px;margin:auto;padding:18px; }
html[data-viewer-mode="sample"] #view-report .demo-deep-note { color:var(--text2);font:13px/1.5 system-ui;margin:0 0 12px; }
html[data-viewer-mode="sample"] :is(button,select,input,summary):focus-visible { outline:3px solid #0bbf9b;outline-offset:3px; }
html[data-viewer-mode="sample"] #replay-turn-map:has(canvas[data-continuous-path-points="0"])::after { content:'Press Play to see turns';position:absolute;top:35%;left:10%;right:10%;text-align:center;color:#d6e8f1;font:13px/1.5 system-ui; }
/* Keep the original live cards. Reflow them rather than scaling text to 6 px. */
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] :is(#main,#canvas-wrapper,#clip-wrap) { height:calc(100vw * 9 / 16)!important;min-height:0!important;max-height:none!important;width:100%; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #clip-stage { left:0!important;top:0!important;transform:none!important;width:100%!important;height:100%!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"][data-replay-layout="side-by-side"] #canvas-wrapper > :is(#clip-wrap,#stage-3d) { width:0!important;flex:1 1 0%;height:100%!important;min-width:0; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #demo-map-slot { padding:8px 16px; }
html[data-viewer-mode="sample"] body[data-demo-video-fullscreen="true"] :is(#video-gauge-overlay,#replay-turn-map) { display:none!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #replay-turn-map { position:relative!important;inset:auto!important;transform:none!important;width:min(270px,100%)!important;height:230px!important;margin:0 auto!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #replay-turn-map .video-gauge-mirror-label { font-size:12px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #demo-gauge-cards { padding:8px 12px 20px; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay { position:static!important;inset:auto!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%!important;height:auto!important;max-height:none!important;pointer-events:auto; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay .video-gauge-mirror { position:relative!important;inset:auto!important;transform:none!important;width:100%!important;height:var(--demo-card-height,150px)!important;margin:0;--gauge-fit-unit:1px!important;background:#1b3447!important;color:#fff; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #replay-view-panel :is(.replay-gauge-choice,.replay-gauge-columns) { grid-template-columns:minmax(0,1fr) 32px; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #replay-view-panel :is(.replay-gauge-choice select,.replay-gauge-columns span:nth-child(3)) { display:none; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay .video-gauge-mirror-label { font-size:12px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay .video-gauge-mirror-readout strong { font-size:22px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay :is([data-metric="combined"],[data-metric="body-combined"]) { grid-template-rows:18px minmax(0,1fr) 44px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay :is([data-metric="combined"],[data-metric="body-combined"]) .video-gauge-mirror-readout { display:flex;flex-direction:column;justify-content:center;min-height:40px; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay :is([data-metric="combined"],[data-metric="body-combined"]) .video-gauge-mirror-readout strong { font-size:16px!important;line-height:1.2;white-space:normal!important;overflow:visible!important;text-overflow:clip;padding:0 4px; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay [data-metric="combined"] .video-gauge-mirror-readout small { display:block; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay [data-metric="body-combined"] { grid-template-rows:18px minmax(0,1fr) 62px 15px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay [data-metric="body-combined"] .video-gauge-mirror-readout strong { font-size:14px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay [data-source-kind="number"] .video-gauge-mirror-readout strong { font-size:36px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] #video-gauge-overlay :is(.video-gauge-mirror-caption,.video-gauge-mirror-readout small) { font-size:11px!important; }
html[data-viewer-mode="sample"] body[data-demo-narrow="true"] .video-gauge-mirror-resize { display:none!important; }
@media(max-width:759px) {
  html[data-viewer-mode="sample"] #replay-dock .dock-tools { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }
  html[data-viewer-mode="sample"] #replay-dock .dock-tools > * { min-width:0;max-width:100%;box-sizing:border-box; }
  html[data-viewer-mode="sample"] #replay-dock .dock-tools > :is(button,#clock-mode-toggle,#demo-speed) { min-height:44px;justify-content:center; }
  html[data-viewer-mode="sample"] #replay-dock #clock-mode-toggle button { width:100%;min-height:38px; }
  html[data-viewer-mode="sample"] #replay-dock #replay-gauge-size { grid-column:1 / -1;display:flex;width:100%;flex-wrap:wrap;min-height:44px; }
  html[data-viewer-mode="sample"] #replay-dock #replay-gauge-size input { flex:1;min-width:60px;width:60px; }
  html[data-viewer-mode="sample"] #replay-dock #demo-arrange-tools { grid-column:1 / -1; }
  html[data-viewer-mode="sample"] #replay-clean-progress > input { min-width:0;flex:1;width:0; }
  html[data-viewer-mode="sample"] #header { gap:8px;padding:10px 12px; }
  html[data-viewer-mode="sample"] #brand { width:100%; }
  html[data-viewer-mode="sample"] #picker-group { display:grid;grid-template-columns:minmax(0,1fr);width:100%; }
  html[data-viewer-mode="sample"] #session-picker { width:100%; }
  html[data-viewer-mode="sample"] #demo-clip-label { display:grid;grid-template-columns:minmax(0,1fr); }
  html[data-viewer-mode="sample"] #replay-dock { padding:8px; }
  html[data-viewer-mode="sample"] #replay-sensor-manager .sources-comparison { flex-basis:100%;max-width:100%; }
  html[data-viewer-mode="sample"] #replay-clean-progress { flex-wrap:nowrap;gap:7px; }
  html[data-viewer-mode="sample"] #replay-clean-progress #replay-clean-play { min-width:66px;padding:8px; }
  html[data-viewer-mode="sample"] #sample-notice { padding:8px 12px; }
}
/* Language names remain in their own language and fit on narrow previews. */
#viewer-language-control { display:flex; align-items:center; gap:6px; font:12px system-ui,sans-serif; margin-left:auto; }
#viewer-language { max-width:125px; min-height:34px; font:13px system-ui,sans-serif; }
html[lang="fr"] #view-replay .video-gauge-mirror .video-gauge-mirror-label,
html[lang="zh-CN"] #view-replay .video-gauge-mirror .video-gauge-mirror-label { letter-spacing:normal; overflow-wrap:anywhere; }
html[lang="fr"][data-viewer-mode="sample"] #replay-turn-map:has(canvas[data-continuous-path-points="0"])::after { content:'Lancez la lecture pour voir les virages'; }
html[lang="zh-CN"][data-viewer-mode="sample"] #replay-turn-map:has(canvas[data-continuous-path-points="0"])::after { content:'点击播放查看转弯'; }
@media (max-width:759px) { #viewer-language-control { flex-wrap:wrap; margin-left:0; } }