/* MT Lab shared screen system. Print remains owned by the report stylesheets. */
:root {
  color-scheme:light;
  --lab-navy:#102b3a; --lab-ink:#18343f; --lab-slate:#526971;
  --lab-teal:#146b69; --lab-mint:#8dddbd; --lab-paper:#fff;
  --lab-fog:#f2f6f7; --lab-line:#d5e1e3; --lab-soft:#e6f2ed;
  --lab-danger:#a33323; --lab-warning:#88551f; --lab-focus:#216a99;
  --bg:var(--lab-fog); --text:var(--lab-ink); --muted:var(--lab-slate);
  --panel:var(--lab-paper); --panel-raised:#edf3f4; --line:var(--lab-line); --line-soft:#dce6e8;
  --mint:var(--lab-teal); --mint-deep:var(--lab-soft); --blue:#356eae; --amber:var(--lab-warning);
  --navy:var(--lab-ink); --teal:var(--lab-teal); --slate:var(--lab-slate); --paper:var(--lab-paper);
  --manage-bg:var(--lab-fog); --manage-panel:#fff; --manage-text:var(--lab-ink);
  --manage-line:var(--lab-line); --manage-muted:var(--lab-slate); --manage-mint:var(--lab-teal);
  font-family:"Avenir Next","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  font-synthesis:none; -webkit-text-size-adjust:100%;
}
* { box-sizing:border-box }
html { scroll-padding-block:24px; scrollbar-gutter:stable }
body { margin:0; min-width:320px; background:var(--lab-fog); color:var(--lab-ink); font:15px/1.65 "Avenir Next","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; -webkit-tap-highlight-color:#146b6920 }
body:has(dialog[open]) { overflow:hidden }
button,input,select,textarea { font:inherit }
button,a,input,select,textarea,summary { touch-action:manipulation }
a { color:var(--lab-teal); text-underline-offset:.22em }
a:hover { text-decoration-thickness:2px }
button { cursor:pointer; border:1px solid #a6c0c5; border-radius:7px; background:#fff; color:var(--lab-ink); padding:9px 14px; min-height:44px; line-height:1.4 }
button:hover { border-color:var(--lab-teal); background:#eaf3f0 }
button:disabled { cursor:not-allowed; opacity:.55 }
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid var(--lab-focus); outline-offset:3px }
[hidden] { display:none!important }
:where(input,select,textarea) { max-width:100%; min-width:0; border:1px solid #9eb5bb; border-radius:6px; background:#fff; color:var(--lab-ink); padding:10px 12px; min-height:44px; accent-color:var(--lab-teal) }
input[type=checkbox],input[type=radio] { width:20px; height:20px; min-height:20px; flex:none; padding:0; vertical-align:middle }
input[type=file] { width:100%; white-space:normal; padding:8px; font-size:14px }
input::file-selector-button { min-height:36px; margin-right:10px; border:1px solid #9eb5bb; border-radius:5px; background:#edf3f4; color:var(--lab-ink); font:inherit }
textarea { resize:vertical; line-height:1.7 }
:where(input,textarea)::placeholder { color:#647b83; opacity:1 }
:where(h1,h2,h3,h4) { color:var(--lab-ink); text-wrap:balance; line-height:1.3; scroll-margin-top:24px; overflow-wrap:anywhere }
h1 { font-size:clamp(26px,2.5vw,34px); letter-spacing:-.025em; font-weight:650 }
h2 { font-weight:650 }
:where(p,dd,li,legend,small,pre) { overflow-wrap:anywhere }
:where(main,section,article,aside,header,form,fieldset,div) { min-width:0 }
:where(table,.metric-grid,.history-metrics,.service-terms,.purchase-price) { font-variant-numeric:tabular-nums }
pre { white-space:pre-wrap; font-family:inherit }
video { display:block; max-width:100%; background:#102b3a; border-radius:8px }
img { max-width:100% }
.platform-skip,.skip { position:fixed; z-index:1000; top:12px; left:12px; transform:translateY(-200%); background:#fff; color:var(--lab-teal); padding:12px 18px; border:2px solid var(--lab-focus); border-radius:6px }
.platform-skip:focus,.skip:focus { transform:translateY(0) }
.primary-button,.login-submit,.button.primary,button.primary { background:var(--lab-teal); border-color:var(--lab-teal); color:white; font-weight:600 }
.primary-button:hover,.login-submit:hover,.button.primary:hover,button.primary:hover { color:#fff; background:#0e5554; border-color:#0e5554 }
.secondary-button,.button.secondary { background:#fff; border-color:#a6c0c5; color:var(--lab-ink) }
.secondary-button:hover,.button.secondary:hover { background:#eaf3f0; color:var(--lab-teal) }
/* One navigation language, with the navy reserved for orientation. */
.app-shell,#workspace { display:grid; grid-template-columns:240px minmax(0,1fr); min-height:100svh }
.sidebar { background:var(--lab-navy); color:#eaf4f4; border:0; padding:28px 16px 20px; min-height:100svh }
.sidebar .brand { padding:0 8px 26px; gap:10px; color:#fff; letter-spacing:0 }
.sidebar .brand strong,.sidebar .brand small { color:inherit }
.sidebar .brand strong { font-size:15px; letter-spacing:.04em }
.sidebar .brand small { color:#adc5cc; font-size:12px; letter-spacing:0 }
.brand-mark { border-radius:10px; background:var(--lab-mint); color:var(--lab-navy) }
.brand-mark svg { stroke:var(--lab-navy) }
.sidebar .nav-label,.sidebar .nav-caption { color:#adc5cc; letter-spacing:0; font-size:12px }
.sidebar .nav-item,.sidebar nav a { color:#c5d8dd; min-height:46px; height:auto; text-decoration:none; border-radius:6px; font-size:14px }
.sidebar .nav-item:hover,.sidebar .nav-item.active,.sidebar nav a:hover,.sidebar nav a.active { background:#214552; color:#fff; border-color:#365e69 }
.sidebar .nav-item.active { box-shadow:inset 3px 0 var(--lab-mint) }
.sidebar .nav-icon { color:var(--lab-mint) }
.sidebar .nav-count,.sidebar .nav-lock { color:#adc5cc; border-color:#47626b }
.sidebar .session-copy strong,.sidebar .sidebar-footer strong { color:#edf6f5 }
.sidebar .session-copy small,.sidebar .sidebar-footer small,.sidebar-foot { color:#adc5cc }
.sidebar .session-item { color:#c5d8dd }
.sidebar .session-item:hover,.sidebar .session-item.selected { background:#214552; border-color:#365e69 }
.sidebar .session-dot { background:#789ba4 }
.sidebar .session-dot.on { background:var(--lab-mint); box-shadow:none }
.sidebar .upload-cta { background:#173b45; border-color:#709a98; color:#fff; margin-top:22px }
.sidebar .upload-cta small { color:#adc5cc }
.sidebar .plus,.sidebar .avatar { background:#295452; color:var(--lab-mint) }
.sidebar .sidebar-footer { border-color:#365561 }
.sidebar .sidebar-account-actions button { background:#214552; border-color:#365e69; color:#edf6f5 }
.sidebar .sidebar-account-actions button[aria-current=true] { color:var(--lab-mint); border-color:var(--lab-mint) }
.sidebar :is(a,button,summary):focus-visible { outline-color:var(--lab-mint) }
.platform-nav-toggle { display:none }
.platform-nav { display:contents }
.topbar { height:auto; min-height:72px; padding:14px 32px; border-bottom:1px solid var(--lab-line); background:#fff; gap:16px }
.breadcrumbs { color:var(--lab-slate); min-width:0; flex-wrap:wrap }
.breadcrumbs strong { color:var(--lab-ink) }
.top-actions,.topbar>div { flex-wrap:wrap; gap:10px }
.top-account-button,.system-messages-trigger,.account-link { min-height:44px; border:1px solid #bbced3; border-radius:7px; background:#fff; color:var(--lab-ink); padding:9px 14px; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-size:14px }
.top-account-button:hover,.system-messages-trigger:hover,.account-link:hover { background:#eaf3f0 }
.top-avatar { background:#e5eeef; color:#31535b }
.privacy-pill { color:var(--lab-teal); border-color:#adccc1 }
.privacy-pill i { background:var(--lab-teal) }
.content,#workspace main { width:100%; max-width:1400px; margin-inline:auto; padding:32px clamp(24px,3.2vw,56px) 48px }
.page-heading { margin:0 0 24px; align-items:flex-start }
.page-heading p,.page-title p { max-width:70ch; color:var(--lab-slate) }
.overline,.manage-eyebrow,.eyebrow { color:var(--lab-slate); letter-spacing:0; font-size:12px; text-transform:none }
.overline { display:none }
.panel,.metric-card,.history-metric,.manage-panel,.login-card { background:#fff; border:1px solid var(--lab-line); box-shadow:none; border-radius:10px }
.history-metrics,.metric-grid { gap:16px }
.history-metric,.metric-card { padding:20px; min-height:126px }
.history-metric strong,.metric-card>strong { font-size:clamp(24px,2.3vw,32px); letter-spacing:-.025em; color:var(--lab-ink) }
.history-metric span,.metric-top,.metric-foot,.history-metric small { color:var(--lab-slate); font-size:13px }
.chart-panel,.history-chart-panel,.history-recent-panel,.logfile-panel,.compare-chart,.compare-matrix { padding:24px; margin-top:20px }
.section-heading h2 { font-size:19px }
.section-heading p { font-size:13px; color:var(--lab-slate) }
.chart-area-wrap { height:240px }
.trend-chart text { fill:var(--lab-slate); font-size:11px }
.chart-grid path { stroke:var(--lab-line) }
.lower-grid { gap:20px; margin-top:20px }
.splits-panel,.insight-panel { padding:24px }
.table-wrap,.table-scroll { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain }
:where(th,td) { font-size:13px; color:var(--lab-ink); vertical-align:top; border-color:var(--lab-line); padding:12px 10px }
th { color:var(--lab-slate); font-weight:600 }
.pace-value { color:var(--lab-ink) }
.weekly-bars { scrollbar-width:thin }
.weekly-column strong,.weekly-column span,.weekly-column small { color:var(--lab-slate) }
.history-recent-row,.logfile-row { border-color:var(--lab-line); color:var(--lab-ink); background:#fff }
.history-recent-row:hover { background:#edf6f2 }
.insight-card,.data-boundary,.sync-state { background:#edf6f2; border-color:#c6ddd3 }
.insight-card p,.insight-card strong,.insight-kicker,.data-boundary strong { color:var(--lab-ink) }
.insight-meta,.data-boundary small,.footer-note,.history-storage-note { color:var(--lab-slate) }
.space-switch { margin-bottom:24px; border-color:#b6cdd0; background:#fff }
.space-switch label,.space-switch button { color:var(--lab-slate) }
.space-switch .active,.space-switch label:has(input:checked) { background:#e0f1eb; color:var(--lab-teal) }
:where(.video-workflow,.role-panel,.account-center) { max-width:960px; margin:0 auto 24px; padding:28px }
:where(.account-fields,.logfile-filters,.role-row) { gap:18px }
:where(.account-form,.expert-editor,.upload-classification) label { color:var(--lab-ink); font-size:14px }
:where(.account-form,.expert-editor,.upload-classification) :is(input,select,textarea) { background:#fff; color:var(--lab-ink); border-color:#9eb5bb }
.account-form h2 { font-size:20px }
.team-training-card,.team-empty,.team-training-list,.compare-picker { background:#fff; border-color:var(--lab-line) }
.team-training-card h3,.team-training-card h4,.team-heading h1 { color:var(--lab-ink) }
.team-training-card small,.team-training-card p { color:var(--lab-slate) }
/* Dialogs use their own scrollport; action buttons must remain reachable on short screens. */
dialog,.purchase-dialog { margin:auto; width:min(720px,calc(100% - 32px)); max-width:calc(100% - 32px); max-height:calc(100svh - 32px); padding:28px; border:1px solid #b9cdd2; border-radius:12px; background:#fff; color:var(--lab-ink); overflow:auto; overscroll-behavior:contain; box-shadow:0 24px 64px #102b3a26 }
dialog::backdrop { background:#102b3a80 }
dialog h2 { margin-top:0; font-size:24px }
dialog>header,.purchase-dialog>header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px }
dialog>header button { flex:none; min-width:44px }
dialog :is(button,input,select,textarea) { max-width:100% }
.purchase-dialog fieldset { margin:20px 0; border:1px solid var(--lab-line); border-radius:8px; padding:16px }
.purchase-dialog fieldset label { display:flex; grid-template-columns:none; align-items:center; gap:12px; margin:0; min-height:52px; padding:10px 0; font-size:14px }
.purchase-dialog fieldset label+label { border-top:1px solid var(--lab-line) }
.purchase-dialog :is(input[type=checkbox],input[type=radio]) { width:20px; min-height:20px; height:20px; margin:0; flex:none }
.purchase-dialog legend { font-size:14px; font-weight:600 }
.purchase-dialog .purchase-order dl { grid-template-columns:88px minmax(0,1fr); gap:12px }
.purchase-dialog .purchase-price { font-size:28px }
.purchase-actions { margin:20px 0 12px; gap:12px }
.purchase-dialog [data-purchase-status] { color:var(--lab-danger) }
.system-messages { margin:0 0 24px; background:#fff; border:1px solid var(--lab-line); border-radius:10px; padding:24px; color:var(--lab-ink) }
.system-messages-heading { flex-wrap:wrap }
.system-messages [role=group] { display:flex; flex-wrap:wrap; gap:8px }
.system-messages [aria-pressed=true] { background:var(--lab-teal); color:white; border-color:var(--lab-teal) }
.system-messages article { border-color:var(--lab-line); background:#fff }
.system-messages p { color:var(--lab-slate) }
.system-messages :is(input,button) { max-width:100% }
/* Expert dossiers retain their reading structure; services and prices stay explicit. */
#workspace .topbar { padding-inline:32px }
#workspace .page-title { margin-bottom:24px }
#workspace h1 { font-size:30px; max-width:none }
#workspace .task-nav { gap:32px; border-color:var(--lab-line); margin-bottom:32px }
#workspace .task-nav a { padding-inline:4px; min-height:52px; font-size:15px }
#workspace .task-nav a[aria-current=page] { border-color:var(--lab-teal); color:var(--lab-teal) }
#workspace .catalog-section { margin-top:32px; padding-top:28px }
#workspace .directory-list,#workspace .dossier,#workspace .edit-panel { border-radius:10px; border-color:var(--lab-line) }
#workspace .directory-row { gap:28px; padding:28px }
#workspace .identity h2 { font-size:24px }
#workspace .portrait { width:80px; height:96px; flex:none; border-radius:7px; object-fit:cover }
#workspace .directory-row .portrait { width:64px; height:78px }
#workspace .service-terms { font-size:14px }
#workspace .catalog-section .team-training-card { border-radius:8px; padding:24px; box-shadow:none }
#workspace .edit-panel,#workspace .product-host>.expert-editor { padding:28px }
#workspace .field-grid { gap:20px }
#workspace .intro-grid p { max-width:70ch }
#workspace .review-aside { font-size:14px }
#workspace .profile-layout { grid-template-columns:minmax(0,1fr) 240px }
#workspace .form-actions { gap:12px }
#workspace summary { font-size:15px; min-height:52px }
#workspace .order-row { padding:28px; gap:24px }
#workspace .mobile-navigation { display:none }
/* Cross-device training list, detail, analysis and video. */
body.training-hub { padding:0 32px 48px }
.training-hub>header { padding:28px 0 24px; border-bottom:1px solid var(--lab-line); margin-bottom:24px }
.training-hub>header h1 { margin:20px 0 8px }
.training-hub>header p { color:var(--lab-slate); margin-bottom:20px }
.training-hub>header>label { white-space:normal; font-size:14px }
.training-hub>header a { min-height:44px; display:inline-flex; align-items:center }
.training-hub>#notice { max-width:1400px; margin:16px auto; color:var(--lab-slate) }
.training-hub>main { max-width:1400px; margin:auto; gap:28px; grid-template-columns:minmax(250px,320px) minmax(0,1fr) }
.training-hub #detail { background:#fff; border:1px solid var(--lab-line); border-radius:10px; padding:28px; min-height:320px }
.training-hub .record-row { border:0; padding:0 0 14px }
.training-hub .record { background:#fff; border-color:#b9cfd1; color:var(--lab-ink); margin:0; font-size:14px; gap:8px }
.training-hub .record:hover { background:#eaf3f0; border-color:var(--lab-teal) }
.training-hub .record small { font-size:13px; color:var(--lab-slate) }
.training-hub .record-row>label { display:flex; align-items:center; gap:8px; margin-top:8px; font-size:13px }
.training-hub .source-group h2 { font-size:18px }
.training-hub .analysis-report { padding:20px 0; border:0; border-top:1px solid var(--lab-line); border-radius:0 }
.training-hub .alignment-panel { background:#f7fafb; border-color:var(--lab-line); padding:20px }
.training-hub .actions { gap:10px }
.training-hub .sync-region { gap:12px }
/* Login and system browser confirmation share the same brand, with no remote assets. */
.login-shell { background:var(--lab-fog); display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,480px); gap:clamp(40px,8vw,140px); align-items:center; justify-items:stretch; width:min(1240px,100%); margin:auto; padding:64px 48px; min-height:100svh }
.login-context { padding:24px 0; color:var(--lab-navy) }
.login-context-brand { color:var(--lab-teal); font-size:22px; font-weight:700; text-decoration:none }
.login-context h2 { font-size:clamp(32px,4vw,52px); line-height:1.45; margin:32px 0 20px; font-weight:600; letter-spacing:-.035em }
.login-context p { max-width:34ch; color:var(--lab-slate); font-size:16px; line-height:1.9 }
.login-context small { display:block; color:var(--lab-slate); margin-top:24px; font-size:13px }
.waterline { margin:40px 0 20px; max-width:380px; position:relative; padding-top:20px }
.waterline span { display:block; height:1px; margin:14px 0; background:#b2ccca }
.waterline span:nth-child(2) { width:75%; background:#619e93 }
.waterline:before { content:""; display:block; width:82px; height:8px; background:var(--lab-teal); border-radius:100% 100% 40% 40%; transform:rotate(-7deg) }
.login-card { width:100%; padding:36px; border-top:4px solid var(--lab-teal) }
.login-card .brand { color:var(--lab-navy); padding-bottom:24px }
.login-card .brand small,.login-copy,.login-status,.login-terms { color:var(--lab-slate) }
.login-card h1 { font-size:28px }
.login-card h2 { font-size:20px }
.login-card .eyebrow { font-size:13px }
.login-copy { font-size:14px; line-height:1.8 }
.login-form { gap:12px }
.login-form>label { color:var(--lab-ink); font-size:14px }
.login-form input { color:var(--lab-ink); background:#fff; min-height:48px }
.login-form input[type=checkbox] { min-height:20px }
.login-form label:has(input[type=checkbox]) { display:flex; align-items:center; gap:10px; min-height:44px }
.login-submit { display:inline-flex; justify-content:center; align-items:center; width:100%; min-height:48px; padding:10px 14px; text-decoration:none }
.login-code-button,.login-wechat { min-height:48px; background:#edf6f2; border-color:#a8c7bb; color:var(--lab-teal); font-size:14px }
.login-status,.login-terms { font-size:13px }
.login-divider:before,.login-divider:after { background:var(--lab-line) }
.login-shell:has(>#bridge-status),main.login-shell { display:grid; grid-template-columns:minmax(0,480px); justify-content:center }
.standalone-orders { width:min(100% - 48px,960px); margin:40px auto; padding:32px }
/* Review queues: calm density, full-width touch controls, readable long submissions. */
.manage-header { background:var(--lab-navy); border:0; padding:16px max(24px,calc((100vw - 1240px)/2)); min-height:72px; color:#edf6f5 }
.manage-header .manage-brand,.manage-header .manage-brand span,.manage-header>div { color:#edf6f5 }
.manage-header button,.manage-role-menu[open] a { background:#214552; border-color:#527581; color:#e6f5ee }
.manage-role-menu a { color:var(--lab-mint) }
.manage-main { width:min(100% - 64px,1240px); padding-top:36px }
.manage-intro h1 { font-size:30px }
.manage-intro>p:last-child { font-size:14px; max-width:75ch }
.manage-panel { padding:28px; margin:22px 0; background:#fff; border-radius:10px }
.manage-panel-heading { align-items:flex-start; flex-wrap:wrap; gap:12px; margin-bottom:20px }
.manage-panel-heading h2 { font-size:21px }
.manage-count { display:inline-flex; min-width:32px; min-height:32px; justify-content:center; align-items:center; background:#e6f2ed; border-radius:6px; color:var(--lab-teal); font-size:14px }
.manage-panel label { font-size:14px; color:var(--lab-ink); min-width:0 }
.manage-panel :is(input,select,textarea) { background:#fff; color:var(--lab-ink); min-height:44px; max-width:100%; min-width:0; padding:10px 12px; border-color:#9eb5bb }
.manage-panel button { min-height:44px; color:var(--lab-teal); background:#edf6f2; border-color:#a8c7bb; padding:9px 14px }
.manage-panel button:hover { background:#dceee5 }
.manage-ticket { padding:22px 0; gap:20px; align-items:flex-start }
.manage-ticket h2 { font-size:18px }
.manage-ticket p,.manage-ticket small,.manage-empty,.manage-feedback { font-size:14px; color:var(--lab-slate) }
.manage-ticket>div:last-child:not(:first-child) { display:flex; gap:10px; flex-wrap:wrap }
.manage-resource-output pre,.manage-audit-list { font-size:13px; color:var(--lab-ink); border:1px solid var(--lab-line); padding:16px; border-radius:6px }
.manage-orders .manage-ticket { display:block }
.manage-orders label { display:grid; gap:8px }
.manage-panel .service-terms { font-size:14px; grid-template-columns:minmax(110px,auto) minmax(0,1fr) }
.manage-panel .service-description { max-width:80ch }
/* Tablet portrait uses disclosure navigation, landscape retains a compact rail. */
@media (min-width:901px) and (max-width:1180px) {
 .app-shell,#workspace { grid-template-columns:216px minmax(0,1fr) }
 .sidebar { padding-inline:12px }
 .content,#workspace main { padding-inline:24px }
 .history-metrics,.metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
 #workspace .profile-layout { grid-template-columns:minmax(0,1fr) }
 #workspace .directory-row { grid-template-columns:minmax(0,1fr) auto }
}
@media (max-width:900px) {
 .app-shell,#workspace { display:block }
 .sidebar { position:relative; display:block; min-height:0; padding:16px 20px; border:0 }
 .sidebar .brand { padding:0; width:fit-content; max-width:calc(100% - 140px) }
 .sidebar .brand-mark { width:36px; height:36px; flex:none }
 .platform-nav-toggle { display:inline-flex; position:absolute; right:20px; top:17px; gap:10px; align-items:center; background:#214552; border-color:#527581; color:#fff; font-size:14px }
 .platform-nav-toggle:hover { background:#315965; color:#fff }
 .platform-nav { display:none }
 body.platform-menu-open .platform-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-top:20px; border-top:1px solid #365561; padding-top:16px }
 body.platform-menu-open .platform-nav .nav-item { display:flex; width:100%; min-height:48px }
 .platform-nav .nav-label,.platform-nav .session-list,.platform-nav .compare-sidebar,.platform-nav .session-label { display:none }
 .platform-nav .upload-cta { position:static; grid-column:1/-1; margin:12px 0 0; min-height:48px; padding:10px }
 .platform-nav .upload-cta small { display:block }
 .sidebar-account-menu { display:none }
 .topbar,#workspace .topbar { min-height:68px; padding:12px 24px; gap:12px; flex-wrap:wrap }
 .content,#workspace main { padding:26px 24px 40px }
 .history-metrics,.metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
 .lower-grid,.compare-layout,.team-columns { grid-template-columns:minmax(0,1fr) }
 .compare-picker { position:static }
 .top-actions .privacy-pill { display:none }
 #workspace .sidebar { display:flex; flex-direction:row; align-items:center; justify-content:space-between; padding:18px 24px }
 #workspace .sidebar nav,#workspace .nav-caption,#workspace .sidebar-foot { display:none }
 #workspace .sidebar .brand { max-width:none }
 #workspace .mobile-navigation { display:block; margin:0; padding:0 24px; border:0; background:#e8f0f2 }
 #workspace .mobile-navigation summary { min-height:48px; color:var(--lab-teal); cursor:pointer }
 #workspace .mobile-navigation nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding-bottom:18px }
 #workspace .mobile-navigation nav a { min-height:44px; display:flex; align-items:center; font-size:14px }
 #workspace .profile-layout { grid-template-columns:minmax(0,1fr) }
 #workspace .review-aside { max-width:none; border-top:1px solid var(--lab-line); padding-top:20px }
 #workspace .directory-row { grid-template-columns:minmax(0,1fr) auto }
 .training-hub>main { grid-template-columns:minmax(220px,280px) minmax(0,1fr); gap:20px }
 body.training-hub { padding-inline:24px }
 .training-hub #detail { padding:20px }
 .login-shell { grid-template-columns:minmax(0,1fr) minmax(320px,400px); gap:32px; padding:40px 32px }
 .login-context h2 { font-size:34px }
 .login-card { padding:28px }
 .manage-header { padding:16px 24px; flex-wrap:wrap }
 .manage-main { width:calc(100% - 48px) }
}
@media (max-width:600px) {
 html { scrollbar-gutter:auto }
 body { font-size:15px }
 .sidebar { padding:16px; padding-left:max(16px,env(safe-area-inset-left)); padding-right:max(16px,env(safe-area-inset-right)) }
 .sidebar .brand { gap:8px; max-width:calc(100% - 130px) }
 .sidebar .brand strong { font-size:13px; letter-spacing:.02em }
 .sidebar .brand small { font-size:11px }
 .platform-nav-toggle { right:16px; top:16px; padding:9px 10px; font-size:13px }
 body.platform-menu-open .platform-nav { gap:4px }
 .platform-nav .nav-item { padding-inline:8px; gap:7px; font-size:13px }
 .platform-nav .nav-lock { font-size:10px }
 .topbar,#workspace .topbar { padding:12px 16px; align-items:center; gap:8px }
 .topbar .breadcrumbs { font-size:12px; gap:5px }
 .top-actions { gap:6px }
 .top-account-button,.system-messages-trigger,.account-link { font-size:13px; min-height:44px; padding:9px 10px }
 .top-account-button .top-avatar { display:none }
 .content,#workspace main { padding:24px 16px max(32px,env(safe-area-inset-bottom)) }
 .page-heading,.page-title { margin-bottom:20px; gap:16px }
 .heading-actions { display:flex; flex-wrap:wrap; gap:8px }
 .heading-actions button { flex:1 1 120px }
 h1,#workspace h1 { font-size:26px }
 .metric-grid,.history-metrics { gap:10px }
 .metric-card,.history-metric { padding:16px 12px; min-height:116px }
 .metric-card>strong,.history-metric strong { font-size:25px }
 .history-metric span,.metric-top,.metric-foot,.history-metric small { font-size:12px }
 .chart-panel,.history-chart-panel,.history-recent-panel,.logfile-panel,.splits-panel,.insight-panel,.compare-chart,.compare-matrix { padding:20px 16px; margin-top:16px }
 .section-heading { flex-wrap:wrap; gap:14px }
 .section-heading h2 { font-size:18px }
 .chart-area-wrap { height:200px }
 .chart-controls { gap:12px }
 .range-button { display:inline-flex; min-height:44px; align-items:center }
 .logfile-filters,.account-fields,.expert-prices,.role-row { grid-template-columns:minmax(0,1fr) }
 .compare-options { grid-template-columns:minmax(0,1fr) }
 .compare-title { gap:16px }
 .team-heading-actions { justify-content:flex-start; flex-wrap:wrap }
 .team-training-card,.team-empty { padding:20px 16px }
 .space-switch { width:100%; margin-bottom:22px }
 .space-switch label { flex:1; justify-content:center; min-height:44px }
 :where(.video-workflow,.role-panel,.account-center) { padding:22px 16px }
 .account-heading { flex-wrap:wrap; gap:12px }
 .account-phone-actions { flex-wrap:wrap }
 dialog,.purchase-dialog { width:calc(100% - 24px); max-width:calc(100% - 24px); max-height:calc(100svh - 24px); padding:20px 16px; border-radius:10px }
 dialog h2 { font-size:22px }
 .purchase-dialog fieldset { padding:12px; margin-block:18px }
 .purchase-dialog fieldset label { font-size:14px }
 .purchase-actions { flex-direction:column }
 .purchase-actions button { width:100% }
 .system-messages { padding:20px 16px }
 .system-messages [role=group]>button { flex:1 1 auto }
 #workspace .sidebar { padding:18px 16px }
 #workspace .mobile-navigation { padding:0 16px }
 #workspace .mobile-navigation nav { grid-template-columns:repeat(2,minmax(0,1fr)) }
 #workspace .task-nav { gap:0; justify-content:space-between; margin-bottom:24px }
 #workspace .task-nav a { font-size:14px; padding:12px 3px }
 #workspace .directory-row { grid-template-columns:minmax(0,1fr); padding:22px 16px; gap:18px }
 #workspace .directory-row>div:nth-child(2) { grid-row:auto }
 #workspace .directory-row>button { justify-self:start }
 #workspace .identity h2 { font-size:22px }
 #workspace .edit-panel,#workspace .product-host>.expert-editor { padding:22px 16px }
 #workspace .field-grid { grid-template-columns:minmax(0,1fr); gap:0 }
 #workspace .form-actions { display:flex; flex-direction:column }
 #workspace .order-row { flex-direction:column; padding:24px 16px; gap:16px; align-items:stretch }
 #workspace .catalog-section .team-training-card { padding:22px 16px }
 #workspace .service-terms { grid-template-columns:86px minmax(0,1fr); font-size:14px; gap:12px }
 #workspace .notice { display:block; padding:14px; font-size:14px }
 body.training-hub { padding:0 16px 32px }
 .training-hub>header { padding:20px 0; margin-bottom:20px }
 .training-hub>main { grid-template-columns:minmax(0,1fr) }
 .training-hub #detail { padding:22px 16px }
 .training-hub>header>button { margin:8px 8px 0 0 }
 .training-hub .sync-region { grid-template-columns:repeat(2,minmax(0,1fr)) }
 .training-hub .actions { display:grid; grid-template-columns:minmax(0,1fr) }
 .training-hub .alignment-panel { padding:16px 12px }
 .training-hub #records { max-height:480px; overflow:auto; padding:2px }
 .login-shell { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; padding:28px 16px 40px; align-content:start }
 .login-context { padding:0 8px }
 .login-context h2 { font-size:28px; margin:16px 0 10px }
 .login-context h2 br { display:none }
 .login-context p { font-size:14px; max-width:none; margin:0 }
 .login-context small,.waterline { display:none }
 .login-card { padding:26px 22px }
 .login-card h1 { font-size:25px }
 .login-card .login-brand { display:none }
 .login-card .eyebrow { margin-top:0 }
 .login-code-row { grid-template-columns:minmax(0,1fr) auto; gap:8px }
 .login-code-button { padding-inline:10px; font-size:13px }
 .manage-header { padding:18px 16px; gap:14px }
 .manage-header>div { width:100%; flex-wrap:wrap; gap:12px; font-size:13px }
 .manage-main { width:calc(100% - 32px); padding-top:26px }
 .manage-intro h1 { font-size:26px }
 .manage-panel { padding:22px 16px; margin-block:18px }
 .manage-panel-heading h2 { font-size:20px }
 .manage-panel form { display:grid; width:100%; grid-template-columns:minmax(0,1fr); gap:14px }
 .manage-panel label,.manage-panel input,.manage-panel select,.manage-panel textarea { width:100%; min-width:0 }
 .manage-ticket { flex-direction:column; gap:14px }
 .manage-ticket>div:last-child:not(:first-child) { width:100% }
 .manage-ticket button { flex:1 1 120px }
 .manage-panel .service-terms { grid-template-columns:minmax(0,1fr); gap:4px }
 .manage-panel .service-terms dd { margin-bottom:12px }
 .standalone-orders { width:calc(100% - 32px); margin:24px auto; padding:24px 16px }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important } }
/* Complete the legacy widgets whose colors were literal rather than token-based. */
.workspace-switch,.history-metric-switch { background:#fff; border:1px solid #b7cdd1; border-radius:8px; padding:4px; display:inline-flex; flex-wrap:wrap; gap:4px; margin-bottom:16px }
.workspace-switch button,.history-metric-switch button { color:var(--lab-slate); background:transparent; min-height:44px; border:0; font-size:14px; padding:10px 14px }
.workspace-switch button.selected,.history-metric-switch button.selected { background:#e0f1eb; color:var(--lab-teal) }
.history-metric-switch { margin-bottom:0 }
.weekly-bar { background:#e3edeb }
.weekly-bar i { background:var(--lab-teal) }
.weekly-column strong { color:var(--lab-ink) }
.history-recent-row small,.history-storage-note,.logfile-device { color:var(--lab-slate); font-size:13px }
.history-recent-row strong,.logfile-table td strong { color:var(--lab-ink); font-size:14px }
.logfile-filters :is(input,select) { color-scheme:light; background:#fff; color:var(--lab-ink); font-size:15px; min-height:44px }
.logfile-filters label { color:var(--lab-slate); font-size:13px }
.logfile-row-actions button { min-height:44px; font-size:14px }
.logfile-delete { color:var(--lab-danger) }
.logfile-table { background:#fff }
.history-empty-icon { background:#e0f1eb; border-color:#bad4c9 }
.history-empty h2 { font-size:21px }
.history-empty p,.history-empty-inline { font-size:14px; color:var(--lab-slate) }
[data-training-source-summary] { padding:16px 20px; margin:0 0 24px; background:#eaf2f3; border:0; border-left:3px solid #78a9a0; border-radius:0 8px 8px 0 }
[data-training-source-summary] h2 { font-size:15px; margin:0 0 6px }
[data-training-source-summary] p { margin:4px 0; color:var(--lab-slate); font-size:13px }
[data-training-source-summary]>a { display:inline-flex; min-height:36px; align-items:center; font-size:13px }
.history-view .page-heading { margin:0 0 20px }
.account-center input,.account-center select,.account-center textarea { color-scheme:light }
.compare-picker,.compare-matrix,.compare-chart { color:var(--lab-ink) }
.compare-option,.compare-type-option { color:var(--lab-ink); border-color:var(--lab-line); background:#fff }
.compare-option.selected { background:#e0f1eb; border-color:#9bbeb0 }
.compare-chart text { fill:var(--lab-slate) }
.compare-legend,.compare-meta,.compare-empty p,.compare-picker p { color:var(--lab-slate) }
.team-tabs,.team-selector { background:#fff; color:var(--lab-ink); border-color:var(--lab-line) }
.team-member,.team-invitation,.team-comment,.team-training-card { background:#fff; color:var(--lab-ink); border-color:var(--lab-line) }
.team-training-card header,.team-training-card strong { color:var(--lab-ink) }
.team-empty p,.team-sidebar-note p { color:var(--lab-slate) }
.sidebar .team-sidebar-note p { color:#c5d8dd }
.video-drop,.video-workflow select { background:#fff; color:var(--lab-ink); border-color:#9eb5bb }
.import-result { background:#e6f2ed; border-color:#adccbe; color:#24493f }
.storage-warning,.notice { background:#fff5e5; border-color:#e0c497; color:#785422 }
.notice p strong,.notice p span { color:#785422 }
.footer-note { font-size:13px }
@media(max-width:600px){ .workspace-switch { width:100%; display:flex }.workspace-switch button { flex:1 } [data-training-source-summary]{padding:14px 16px;margin-bottom:24px} .history-metric-switch button { padding-inline:12px;font-size:13px } }
[data-training-source-summary] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 20px; align-items:center; padding:14px 20px }
.source-summary-heading { display:flex; gap:12px; flex-wrap:wrap; align-items:baseline }
.source-summary-heading h2 { margin:0 }
.source-summary-heading span { color:var(--lab-slate); font-size:13px }
.source-summary-links { grid-column:1 }
[data-training-source-summary]>a { grid-column:2; grid-row:1/3; min-height:44px }
[data-training-source-summary]>details { grid-column:1/-1; padding:0; border:0; font-size:13px; color:var(--lab-slate) }
[data-training-source-summary]>details>summary { min-height:32px; cursor:pointer }
@media(max-width:600px){[data-training-source-summary]{grid-template-columns:minmax(0,1fr);gap:4px;padding:14px 16px}[data-training-source-summary]>a{grid-column:1;grid-row:auto;min-height:36px}.source-summary-heading{gap:8px}}
input.visually-hidden { position:absolute; left:0; top:0; width:1px; height:1px; min-width:0; min-height:0; max-width:1px; padding:0; margin:0; border:0; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%) }
@media(max-width:900px){:where(input,select,textarea){font-size:16px}}
.manage-ticket[data-profile-ticket] { display:block }
.manage-ticket[data-profile-ticket]>div { display:block; width:100%; max-width:80ch }
.manage-ticket[data-profile-ticket] h4 { margin:24px 0 8px; font-size:15px; color:var(--lab-teal) }
.manage-ticket[data-profile-ticket] label { display:grid; margin:24px 0 16px; gap:8px }
.manage-ticket[data-profile-ticket] button { margin:0 8px 8px 0 }
.manage-ticket[data-profile-ticket] h3 { font-size:20px }
.manage-ticket[data-profile-ticket] p { font-size:14px }
.video-workflow h1 { font-size:26px; margin:0 }
.sidebar .nav-current { background:#214552; color:#fff; border-left:3px solid var(--lab-mint); padding:12px; border-radius:6px }
#workspace div.portrait { background:#e0f1eb; color:var(--lab-teal) }
.compare-option:has(input:checked) { background:#e0f1eb; border-color:#9bbeb0 }
.compare-option strong { color:var(--lab-ink); font-size:14px }
.compare-option small,.compare-legend span,.compare-chart-range,.compare-limitations { color:var(--lab-slate); font-size:13px }
.compare-table thead th,.compare-table tbody th,.compare-table td { color:var(--lab-ink); font-size:14px; border-color:var(--lab-line) }
.compare-table thead small,.compare-table tbody th small { color:var(--lab-slate); font-size:12px }
.compare-biomech-grid article { background:#edf6f2; border-color:#bed8cc }
.compare-biomech-grid strong { color:var(--lab-ink); font-size:14px }
.compare-biomech-grid span,.compare-biomech-grid small { color:var(--lab-slate); font-size:13px }
.sidebar .compare-sidebar-picker { border-color:#365561 }
.sidebar .compare-sidebar-picker>p { color:#adc5cc }
.sidebar .compare-selection-count { color:var(--lab-mint); border-color:#709a98 }
.sidebar .compare-option { background:#173b45; color:#eaf4f4 }
.sidebar .compare-option:has(input:checked) { background:#214552; border-color:#709a98 }
.sidebar .compare-option strong { color:#edf6f5 }
.sidebar .compare-option small { color:#adc5cc }
.team-panel h2 { font-size:20px }
.team-panel h3,.team-panel>p,.team-ownership>p,.team-members,.team-choice,.team-create-form label,.team-invite-form label,.team-comment-form label,.session-ownership-row label,.session-ownership-row legend,.team-section-heading p,.team-training-summary,.team-comments>p,.team-comments blockquote small { color:var(--lab-slate); font-size:14px }
.team-choice { background:#fff; border-color:var(--lab-line); min-height:48px }
.team-choice.selected { background:#e0f1eb; color:var(--lab-teal); border-color:#9bbeb0 }
.team-create-form input,.team-invite-form input,.team-comment-form textarea { background:#fff; color:var(--lab-ink); border-color:#9eb5bb; font-size:16px; min-height:44px }
.team-create-form button,.team-invite-form button,.team-invite-card button,.team-comment-form button,.session-ownership-row button { background:#edf6f2; border-color:#a8c7bb; color:var(--lab-teal); min-height:44px; font-size:14px; padding:10px 14px }
.team-ownership { background:#edf3f4; border-color:var(--lab-line); padding:18px }
.team-ownership summary,.team-comments h4 { color:var(--lab-ink); font-size:15px; min-height:44px; align-content:center }
.session-ownership-row { border-color:var(--lab-line) }
.team-comments blockquote { background:#edf6f2 }
.team-comments blockquote p { color:var(--lab-ink); font-size:14px }
.team-invite-card,.team-security-note { background:#fff5e5; color:#785422; border-color:#e0c497; font-size:13px }
.team-invite-card p { color:#785422; font-size:14px }
@media(max-width:900px){ .platform-nav .compare-sidebar-picker{display:none} }
@media(max-width:900px){body[data-platform="mtlab"] :is(input,select,textarea){font-size:16px}}
.team-training-card header p,.team-training-card header>span { color:var(--lab-slate); font-size:13px }
.compare-empty-icon { background:#e0f1eb; color:var(--lab-teal); border-color:#b5d2c5 }