/* Screen-only shared presentation. Existing print/report styles own printed output. */
:root {
 color-scheme:light;
 --lab-navy:#102b3a; --lab-teal:#146b69; --lab-ink:#18343f;
 --lab-slate:#526971; --lab-fog:#f2f6f7; --lab-line:#d5e1e3;
 --navy:var(--lab-navy); --blue:var(--lab-teal); --teal:var(--lab-teal);
 --bg:var(--lab-fog); --mist:var(--lab-fog); --ink:var(--lab-ink);
 --muted:var(--lab-slate); --slate:var(--lab-slate); --line:var(--lab-line);
 --white:#fff; --paper:#fff; --soft:#e6f2ed; --amber:#88551f; --red:#a33323;
 font-family:"Avenir Next","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}
body { color:var(--lab-ink); background:var(--lab-fog); font-family:"Avenir Next","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; font-size:15px; line-height:1.65 }
button,input,select,textarea { font:inherit }
button,a,input,select,textarea,summary { touch-action:manipulation; -webkit-tap-highlight-color:#146b6920 }
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid #216a99; outline-offset:3px }
button,input,select { min-height:44px }
input[type=checkbox],input[type=radio] { min-height:20px }
button { border-radius:7px }
button:not(:disabled):hover { filter:none }
select { background-color:#fff; color:var(--lab-ink) }
h1,h2,h3 { text-wrap:balance; scroll-margin-top:24px; overflow-wrap:anywhere }
:where(p,li,td,th,a,label) { overflow-wrap:anywhere }
:where(main,section,aside,article,div,nav) { min-width:0 }
:where(table,.metrics,.statstrip,.source-summary) { font-variant-numeric:tabular-nums }
.side { background:var(--lab-navy) }
.side .navlink:hover,.side .navlink.active,.side .navlink[aria-current=page] { background:#214552; box-shadow:inset 3px 0 #8dddbd; color:#fff }
.side :is(a,button):focus-visible { outline-color:#8dddbd }
.side .brand strong { font-size:23px; letter-spacing:0 }
.side .brand-mark { display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:10px; background:#8dddbd; color:var(--lab-navy); font-size:26px }
.primary,.primary:not(button),button.primary { background:var(--lab-teal); border-color:var(--lab-teal); color:#fff }
.primary:hover,.primary:not(button):hover,button.primary:hover { background:#0e5554; color:#fff }
.subtle { background:#e6f2ed; color:var(--lab-teal) }
.local-banner { background:#e6f2ed; color:var(--lab-slate); border-color:var(--lab-line) }
.local-note { color:var(--lab-slate); background:#edf3f4; border-color:var(--lab-line) }
.mainwrap main { max-width:1400px; margin-inline:auto; padding:32px clamp(24px,3.2vw,56px) 48px }
.pagehead { margin-bottom:24px; align-items:flex-start }
.pagehead h1 { font-size:clamp(26px,2.5vw,34px); font-weight:650 }
.pagehead p { max-width:75ch; color:var(--lab-slate) }
.panel { box-shadow:none; border-color:var(--lab-line); border-radius:10px }
.panel-pad { padding:24px }
.technical-context { display:flex; flex-wrap:wrap; gap:6px 24px; border-bottom:1px solid var(--lab-line); margin-bottom:24px; padding-bottom:12px }
.technical-context a { display:inline-flex; align-items:center; min-height:44px; color:var(--lab-teal) }
.analysis-flow { display:block; padding:0; background:transparent; border:0; margin-bottom:24px }
.analysis-flow-main { display:flex; flex-wrap:wrap; gap:8px; border-bottom:1px solid var(--lab-line); padding-bottom:12px }
.analysis-flow a { display:inline-flex; align-items:center; min-height:44px; padding:9px 14px; border:1px solid var(--lab-line); border-radius:7px; color:var(--lab-ink); background:#fff; text-decoration:none }
.analysis-flow a:hover { background:#edf6f2; border-color:#8aafa6 }
.analysis-flow a.active { color:var(--lab-teal); border-color:#8aafa6; background:#e6f2ed; font-weight:650 }
.analysis-specials { margin-top:12px; padding:0; background:transparent; border:0 }
.analysis-specials summary { display:list-item; cursor:pointer; min-height:44px; align-content:center; color:var(--lab-teal); font-weight:600 }
.specials-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding:12px 0 }
.chart-real polyline,.chart-real circle { stroke:var(--lab-teal) }
.chart-real circle { fill:var(--lab-teal) }
#workspace .service-workspaces { display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:0; padding:0; background:#fff; border:1px solid var(--lab-line); border-radius:10px; margin-bottom:32px }
#workspace .service-workspaces:has(>.service-entry:only-child) { grid-template-columns:minmax(0,1fr) }
#workspace .service-entry { margin:0; padding:22px 24px; border:0; border-right:1px solid var(--lab-line); border-radius:0; display:flex; flex-direction:column; align-items:flex-start; gap:8px }
#workspace .service-entry:last-child { border-right:0 }
#workspace .service-entry h2 { margin:0; font-size:18px; color:var(--lab-ink) }
#workspace .service-entry p { margin:0 0 8px; font-size:13px; color:var(--lab-slate) }
#workspace .service-entry a { padding:7px 0; min-height:44px; border:0; color:var(--lab-teal); font-size:14px; text-decoration:underline; text-underline-offset:5px }
#workspace .service-entry a:hover { background:transparent; text-decoration-thickness:2px }
#workspace .service-entry a[aria-current=page] { color:var(--lab-ink); font-weight:700; text-decoration-thickness:2px }
#workspace .service-entry-links { display:flex; gap:4px 18px; flex-wrap:wrap; margin-top:auto }
#workspace .service-entry .service-start { padding:9px 14px; border-radius:7px; color:white; text-decoration:none; background:var(--lab-teal) }
#workspace .service-entry .service-start:hover { background:#0e5554 }
#workspace .technical-entry { background:#f4f9f7 }
.training-hub .hub-brand { font-size:24px; letter-spacing:0 }
.training-hub #workspace-nav { display:flex; flex-wrap:wrap; gap:6px; margin:16px 0; padding:8px; background:var(--lab-navy); border-radius:8px }
.training-hub #workspace-nav a { padding:9px 14px; color:#d7e6e8; text-decoration:none; border-radius:5px; min-height:44px }
.training-hub #workspace-nav a:hover,.training-hub #workspace-nav a[aria-current=page] { background:#214552; color:white; box-shadow:inset 0 -3px #8dddbd }
.training-hub .alignment-panel { margin-top:24px; padding:24px; background:#f7fafb; border:1px solid var(--lab-line); border-radius:8px }
.alignment-heading h3 { font-size:20px; margin:0 0 6px }
.alignment-heading p { margin:0; color:var(--lab-slate) }
.alignment-steps { display:flex; flex-wrap:wrap; gap:12px 32px; padding:16px 20px 16px 40px; margin:20px 0; background:#e6f2ed; border-radius:7px; color:var(--lab-teal); font-weight:600 }
.sync-time-table,.sync-data-table { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain }
.sync-time-table table { width:100%; min-width:500px; border-collapse:collapse }
.sync-time-table :is(th,td) { vertical-align:top; padding:12px 10px; text-align:left; border-bottom:1px solid var(--lab-line) }
.sync-time-table td:first-child { width:23%; font-weight:600 }
.sync-time-table input { width:100%; min-width:90px; max-width:180px; background:#fff; color:var(--lab-ink); border:1px solid #9eb5bb; padding:9px 10px; border-radius:6px }
.sync-time-table button { display:block; margin-top:8px; font-size:13px }
.sync-primary-point { background:#edf6f2 }
.sync-optional { color:var(--lab-slate) }
.alignment-panel .actions { display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 }
.sync-advanced { padding:16px 0; margin-top:20px; border:0; border-block:1px solid var(--lab-line); border-radius:0 }
.sync-advanced summary { min-height:44px; cursor:pointer; color:var(--lab-teal); align-content:center }
.candidate-preview:empty { display:none }
.candidate-preview:not(:empty) { padding:16px; background:#e6f2ed; border-left:3px solid var(--lab-teal) }
[data-sync-time] { font-variant-numeric:tabular-nums; color:var(--lab-slate) }
@media(max-width:1000px) {
 #workspace .service-workspaces { grid-template-columns:1fr 1fr }
 #workspace .technical-entry { grid-column:1/-1; border-top:1px solid var(--lab-line) }
 .specials-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(min-width:1001px) { .shell:has(>.side) { grid-template-columns:240px minmax(0,1fr) } .shell>.side { width:240px; padding:28px 16px 20px } }
@media(max-width:650px) {
 .mainwrap main { padding:24px 16px calc(108px + env(safe-area-inset-bottom)) }
 input,select,textarea { font-size:16px }
 .panel-pad { padding:18px }
 .technical-context { gap:4px 18px; margin-bottom:20px }
 #workspace .service-workspaces { grid-template-columns:minmax(0,1fr); margin-bottom:24px }
 #workspace .service-entry { padding:18px; border:0; border-bottom:1px solid var(--lab-line) }
 #workspace .service-entry:last-child { border-bottom:0 }
 #workspace .technical-entry { grid-column:auto; border-top:0 }
 .specials-grid { grid-template-columns:minmax(0,1fr) }
 .analysis-flow a { width:100%; justify-content:flex-start }
 .analysis-flow-main { display:grid; grid-template-columns:1fr 1fr }
 .training-hub #workspace-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)) }
 .training-hub #workspace-nav a { padding:9px 10px }
 .training-hub #workspace-nav a:last-child { grid-column:1/-1 }
 .training-hub .alignment-panel { padding:18px 12px }
 .alignment-steps { display:block; padding-left:36px }
 .alignment-steps li+li { margin-top:8px }
 .alignment-panel .actions { display:grid; grid-template-columns:minmax(0,1fr) }
 .sync-time-table table { min-width:0; display:block }
 .sync-time-table thead { display:none }
 .sync-time-table tbody { display:grid; gap:12px }
 .sync-time-table tr { display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--lab-line); border-radius:7px; padding:10px; gap:12px }
 .sync-time-table td { display:block; border:0; padding:0 }
 .sync-time-table td:first-child { width:auto; grid-column:1/-1 }
 .sync-time-table td:nth-child(2)::before { content:'视频时间（秒）'; display:block; font-size:13px; margin-bottom:6px }
 .sync-time-table td:nth-child(3)::before { content:'训练时间（秒）'; display:block; font-size:13px; margin-bottom:6px }
 .sync-time-table input { min-width:0; max-width:100%; width:100%; font-size:16px }
 .sync-time-table button { width:100%; padding:8px; font-size:12px }
 .workspace-bottomnav { grid-template-columns:repeat(5,minmax(0,1fr)); padding-bottom:calc(7px + env(safe-area-inset-bottom)) }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto } *,*::before,*::after { animation:none!important; transition:none!important } }

/* v02: video pages retain the site sidebar; analysis types are equal top-level tabs. */
body.training-hub { padding:0 }
.video-shell { display:grid; grid-template-columns:240px minmax(0,1fr); min-height:100svh }
.video-sidebar { position:sticky; top:0; align-self:start; height:100svh; min-height:100svh; display:flex; flex-direction:column; padding:28px 16px 20px; background:var(--lab-navy) }
.video-sidebar .brand { display:flex; align-items:center; gap:10px; margin:0 8px 28px; padding:0; text-decoration:none; color:#fff; max-width:none }
.video-sidebar .brand-mark { width:40px; height:40px; display:grid; place-items:center; font-size:26px; border-radius:10px; background:#8dddbd; color:var(--lab-navy) }
.video-sidebar .brand strong { font-size:23px; letter-spacing:0; display:block }
.video-sidebar .brand small { display:block; color:#adc5cc; font-size:12px }
.video-sidebar .nav-caption { padding:0 12px; font-size:12px; color:#adc5cc }
.training-hub .video-sidebar #workspace-nav { display:grid; gap:6px; padding:0; margin:12px 0; background:transparent; border-radius:0; overflow-y:auto }
.training-hub .video-sidebar #workspace-nav a { display:flex; align-items:center; padding:12px; font-size:14px; color:#c5d8dd; min-height:46px; border-radius:6px }
.training-hub .video-sidebar #workspace-nav a[aria-current=page] { box-shadow:inset 3px 0 #8dddbd; color:#fff }
.video-sidebar-foot { margin-top:auto; padding:20px 12px 0; border-top:1px solid #365561 }
.video-sidebar-foot a { color:#c5d8dd; display:inline-flex; align-items:center; min-height:44px }
.video-sidebar :is(a,button):focus-visible { outline-color:#8dddbd }
.video-sidebar .platform-nav-toggle { display:none }
.video-workspace { min-width:0; padding:28px clamp(20px,3vw,40px) 48px }
.video-workspace>.video-page-header { margin:0 0 20px; max-width:none; padding:0 0 20px; border-bottom:1px solid var(--lab-line) }
.video-page-header h1 { margin:16px 0 8px }
.video-page-header p { color:var(--lab-slate) }
.video-page-header>a { display:inline-flex; align-items:center; min-height:44px; margin-right:16px }
.video-page-header>button { margin:8px 8px 0 0 }
.video-workspace>#training-content { display:grid; grid-template-columns:minmax(210px,280px) minmax(0,1fr); gap:24px; margin:0; max-width:none }
.video-workspace>#notice { color:var(--lab-slate) }
.video-workspace>.video-alignment-review { display:block; padding:0; max-width:none; margin:0 }
.analysis-top-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin:0 0 28px; padding:0 0 20px; border-bottom:1px solid var(--lab-line) }
.analysis-top-tabs:has(>a:only-child) { grid-template-columns:minmax(180px,240px) }
.analysis-top-tabs a { min-height:48px; padding:9px 10px; justify-content:center; font-size:13px; text-align:center }
@media(min-width:651px) { .video-sidebar .platform-nav { display:grid!important } }
@media(max-width:1100px) { .video-workspace>#training-content { grid-template-columns:minmax(0,1fr) } .analysis-top-tabs { grid-template-columns:repeat(3,minmax(0,1fr)) } }
@media(max-width:650px) {
 .video-shell { display:block }
 .video-sidebar { position:relative; height:auto; min-height:84px; padding:18px 16px }
 .video-sidebar .brand { margin:0; max-width:calc(100% - 120px) }
 .video-sidebar .brand strong { font-size:20px }
 .video-sidebar .nav-caption,.video-sidebar-foot { display:none }
 .video-sidebar .platform-nav-toggle { display:block; position:absolute; top:22px; right:16px; background:#214552; color:#fff; border-color:#527581 }
 .training-hub .video-sidebar #workspace-nav { display:none; margin:20px 0 0; grid-template-columns:1fr 1fr }
 .training-hub.platform-menu-open .video-sidebar #workspace-nav { display:grid }
 .training-hub .video-sidebar #workspace-nav a:last-child { grid-column:1/-1 }
 .video-workspace { padding:24px 16px 40px }
 .analysis-top-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:24px }
 .analysis-top-tabs a { width:auto; font-size:13px }
}

/* v03: page heading first; automatic analysis occupies its own row, nine topics form 3 x 3. */
.analysis-top-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:0 }
.analysis-top-tabs>a:first-child { grid-column:1/-1; justify-self:start; min-width:min(180px,100%); width:auto; margin-bottom:8px }
.analysis-top-tabs>a { min-width:0; overflow-wrap:anywhere }
/* v04: classify import inputs; filter saved training before entering analysis. */
.import-classification { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px }
.analysis-filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px }
.analysis-filter-panel { margin-top:20px }
.analysis-filter-panel h2 { margin-top:0 }
.analysis-filter-actions,.selected-analysis-links { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:20px 0 }
.record-picker { display:grid; gap:8px; margin-top:20px }
.record-picker select { width:100% }
.selected-training header { margin:0; padding:0; max-width:none }
.selected-training h2 { margin:0; font-size:23px }
.record-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:24px 0 }
.record-facts>div { border-top:1px solid var(--lab-line); padding-top:14px }
.record-facts dt { color:var(--lab-slate); font-size:13px }
.record-facts dd { margin:8px 0 0; font-size:19px; font-weight:600; font-variant-numeric:tabular-nums; overflow-wrap:anywhere }
.selected-record-row { background:#e6f2ed }
[data-analysis-record] { text-align:left; width:100%; white-space:normal }
[data-analysis-record][aria-pressed=true] { border-color:var(--lab-teal); color:var(--lab-teal) }
.history-metrics+[data-training-source-summary] { margin-top:24px }
#source-errors { color:var(--lab-warning,#88551f) }
@media(max-width:850px) { .analysis-filters,.import-classification,.record-facts { grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media(max-width:500px) { .analysis-filters,.import-classification { grid-template-columns:minmax(0,1fr) } .analysis-filter-actions { display:grid; grid-template-columns:minmax(0,1fr) } .record-facts { gap:14px } .record-facts dd { font-size:16px } }

@media(min-width:1001px){.shell:has(>.sidebar){grid-template-columns:240px minmax(0,1fr)}}
.record-list-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:20px }
.record-list-heading h2 { margin:0 }
.record-list-heading>div { text-align:right }
.record-cell-note { display:block; color:var(--lab-slate); font-size:12px; margin-top:5px }
.record-row-actions { display:flex; flex-wrap:wrap; gap:8px; min-width:160px }
.record-row-actions a { padding:8px 12px; min-height:44px; white-space:nowrap }
.record-more { border:0; padding:0; margin-top:6px; font-size:12px }
.record-more summary { min-height:32px; cursor:pointer; color:var(--lab-teal) }
.record-more p { margin:6px 0 }
#comparison-result[hidden] { display:none!important }
#comparison-result { scroll-margin-top:24px }
body[data-record-mode] #training-content { grid-template-columns:minmax(0,1fr) }
body[data-record-mode] #training-content>aside { display:none }
body[data-record-mode] .video-page-header>label:has(#source-filter),body[data-record-mode] #compare { display:none }
.training-hub #detail:empty { display:none }
.record-media-layout { display:grid; grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr); gap:20px; margin-top:20px; align-items:start }
.record-media-layout>section { min-width:0; padding:18px; border:1px solid var(--lab-line); background:#fff; border-radius:8px }
.record-video-pane video { width:100%; max-height:65vh }
.record-media-layout .alignment-panel { margin-top:16px; padding:16px }
@media(max-width:1050px){.record-media-layout{grid-template-columns:minmax(0,1fr)}.record-video-pane{grid-row:1}.record-data-pane{grid-row:2}}
@media(max-width:650px){.record-list-heading{flex-wrap:wrap;gap:12px}.record-list-heading>div{text-align:left}.record-row-actions{min-width:150px}.record-media-layout>section{padding:12px}}

/* v008: video fills the record workspace, data stays below when present. */
.record-media-layout{grid-template-columns:minmax(0,1fr)}
.record-video-pane,.record-data-below{grid-row:auto}
.video-playlist{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:12px 0}
.video-playlist label,.video-overlay-toggle{display:inline-flex;align-items:center;gap:8px}
.video-playlist input,.video-overlay-toggle input{width:20px;height:20px;accent-color:#146b69}
.video-overlay-toggle{margin:12px 0;font-weight:600}
.video-stage{position:relative;background:#0c1c25}
.video-stage video{display:block;width:100%;max-height:75vh}
.video-data-overlay{position:absolute;left:12px;right:12px;top:12px;color:white;background:rgba(8,28,38,.8);padding:10px 14px;border-radius:8px;pointer-events:none;font-variant-numeric:tabular-nums}
.video-data-overlay[hidden]{display:none}