:root { --ink:#1f2937; --muted:#526175; --line:#dbe3ee; --primary:#1d4ed8; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#fff; font:18px/1.6 'Inter',Arial,sans-serif; }
main { max-width:1120px; margin:auto; padding:90px 24px 40px; min-width:0; }
h1,h2,h3 { line-height:1.2; color:#152e54; }
h1 { font-size:clamp(28px,4vw,40px); margin:8px 0 18px; }
h2 { font-size:26px; }
h3 { font-size:22px; }
.eyebrow { color:var(--primary); text-transform:uppercase; font-weight:700; font-size:14px; }
section { padding:24px 0; border-bottom:1px solid var(--line); scroll-margin-top:90px; }
.intro { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:30px; }
.intro>div { min-width:0; }
.quick-protocol { color:var(--primary); font-weight:600; }
.protocol { padding-left:24px; }
.protocol li { padding:5px 0; }
.movement { margin:0; align-self:center; }
.movement img { display:block; width:100%; height:auto; border-radius:8px; background:#f8fafc; }
figcaption { font-size:14px; color:var(--muted); padding-top:10px; }
button,input,textarea,select { font:inherit; }
button { cursor:pointer; padding:10px 16px; border:1px solid #b8c5d8; background:#fff; color:#173b78; border-radius:6px; min-height:46px; }
button:hover { background:#eff6ff; }
button:disabled { opacity:.5; cursor:not-allowed; }
.primary { background:var(--primary); color:#fff; margin-top:24px; }
.primary:hover { background:#153fae; }
.commands .primary { margin-top:0; }
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible { outline:3px solid #c88100; outline-offset:3px; }
.commands,.results-heading { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.results-heading { justify-content:space-between; }
.notice { background:#fff7e2; border-left:4px solid #ba810e; padding:14px 18px; }
#captureStatus,#assessmentStatus { min-height:30px; }
video { display:block; width:100%; max-height:520px; background:#101827; margin:16px 0; }
.review-stage { position:relative; margin:16px 0; }
.review-stage video { margin:0; }
#faceMaskCanvas { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; pointer-events:none; }
#tracker { width:100%; height:650px; border:1px solid var(--line); margin-top:18px; }
.table-wrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; margin:14px 0; }
caption { text-align:left; font-weight:700; }
th,td { text-align:left; padding:12px; border-bottom:1px solid var(--line); vertical-align:top; }
th { background:#eff6ff; }
td input { width:140px; }
input,textarea,select { border:1px solid #9faec2; border-radius:4px; padding:9px; color:var(--ink); background:#fff; }
textarea { display:block; width:100%; margin:8px 0 16px; }
label { display:block; }
.check { display:flex; align-items:flex-start; gap:12px; margin:18px 0; }
input[type=checkbox] { width:22px; height:22px; flex:none; margin-top:3px; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:20px; }
.field-grid input { display:block; width:100%; }
.contact-helper { display:flex; flex-wrap:wrap; align-items:end; gap:12px; padding:16px; background:#f8fafc; border-radius:8px; }
.contact-helper label { flex:1 1 160px; }
.contact-helper input,.contact-helper select { display:block; width:100%; }
details { padding:14px; background:#f8fafc; }
main>details { margin:20px 0; }
section>details { margin:12px 0; }
summary { cursor:pointer; font-weight:600; }
.conversion-command { overflow-x:auto; padding:12px; background:#e9eff7; font-size:14px; }
.phase-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:18px 0; }
.phase-card { text-align:left; color:var(--ink); background:#f8fafc; }
.phase-card strong,.phase-card span { display:block; }
.phase-card strong { color:var(--primary); font-size:25px; }
.phase-card span { font-size:15px; }
#analysisProgress { width:100%; height:12px; accent-color:var(--primary); }
#autoLimitations { margin:16px 0; }
.unavailable { color:#774a00; }
.metric-note { font-size:14px; color:var(--muted); max-width:450px; }
#assessmentResults { font-family:'DM Sans',Arial,sans-serif; --line:#e5e7eb; padding-top:28px; }
#assessmentResults h2,#assessmentResults h3 { font-family:'Space Grotesk',Arial,sans-serif; color:#2a1c43; }
#assessmentResults h2 { font-size:26px; margin:0; }
#assessmentResults h3 { font-size:21px; margin:0 0 12px; }
#assessmentResults .results-heading { margin-bottom:18px; }
#assessmentResults .commands button { font-size:14px; font-weight:600; min-height:42px; color:var(--ink); }
.tug-summary { display:grid; grid-template-columns:280px 1fr; gap:28px; align-items:center; padding:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.tug-total { padding:20px; border-radius:6px; background:#f5f3ff; }
.tug-total .eyebrow { color:#5b21b6; font-size:12px; }
.tug-total strong { display:block; font:700 52px/1.3 'Space Grotesk',Arial,sans-serif; color:#6d28d9; }
.tug-total small { display:block; color:#6b7280; font-size:13px; }
.tug-overview p { margin:8px 0; }
.measurement-badge { display:inline-block; padding:6px 10px; background:#ede9fe; color:#5b21b6; font-size:13px; font-weight:600; border-radius:4px; }
.quality { font-size:13px; color:#6b7280; overflow-wrap:anywhere; }
.source-note { margin:12px 0 20px; }
.trial-notes { white-space:pre-wrap; overflow-wrap:anywhere; }
#assessmentResults .phase-card { border-color:#ddd6f0; background:#faf8ff; }
#assessmentResults .phase-card strong { color:#6d28d9; font-family:'Space Grotesk',Arial,sans-serif; }
.tug-metric-panel { padding:26px 0; }
.group-description { color:#6b7280; font-size:14px; margin:0 0 16px; max-width:860px; }
.tug-metric-table { font-size:14px; table-layout:fixed; margin:0; }
.tug-metric-table thead th { background:#ede9fe; color:#4c1d95; font-size:13px; }
.tug-metric-table th,.tug-metric-table td { width:33.333%; overflow-wrap:anywhere; padding:14px 12px; }
.tug-metric-table tbody th { background:#faf8ff; font-weight:600; color:#2a1c43; }
.cell-result { display:block; font:700 22px/1.4 'Space Grotesk',Arial,sans-serif; color:#6d28d9; }
.cell-result.unavailable { color:#9a5000; font-size:17px; }
.cell-method { display:block; margin-top:5px; font-size:12px; line-height:1.55; color:#6b7280; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.report-callout { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:26px 24px; margin:26px 0 0; background:linear-gradient(135deg,#6d28d9,#764ba2); color:#fff; border-radius:6px; }
#assessmentResults .report-callout h3 { color:#fff; font-size:28px; margin:0 0 6px; }
.report-callout p { margin:0; font-size:16px; }
.report-callout .report-eyebrow { text-transform:uppercase; font-weight:600; letter-spacing:.06em; font-size:11px; margin-bottom:8px; }
.report-callout .report-save { min-height:60px; padding:14px 22px; background:#fff; color:#5b21b6; border-color:#fff; box-shadow:0 4px 14px #230c4a38; flex:none; font-size:18px; font-weight:700; }
.report-callout .report-save:hover { background:#ede9fe; }
#reportSaveStatus:not(:empty) { margin-top:10px; font-size:14px; font-weight:600; }
.turn-note { position:relative; }
.tooltip-trigger { font-size:16px; text-decoration:underline dotted; }
[role=tooltip] { display:none; position:absolute; z-index:5; left:0; top:100%; max-width:650px; background:#152e54; color:#fff; padding:16px; border-radius:6px; font-size:16px; box-shadow:0 6px 20px #0003; }
.tooltip-trigger:hover + [role=tooltip],.tooltip-trigger:focus + [role=tooltip],.turn-note.tooltip-open [role=tooltip] { display:block; }
footer { color:var(--muted); font-size:15px; padding:28px 0; }
[hidden] { display:none !important; }
#assessmentNavigation .nav-dropdown.active>.dropdown-menu { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
@media(max-width:768px) {
    main { padding:86px 16px 24px; }
    .intro,.field-grid { grid-template-columns:1fr; }
    .phase-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .tug-summary { grid-template-columns:1fr; gap:18px; }
    .report-callout { flex-direction:column; align-items:stretch; }
    .tug-metric-table th,.tug-metric-table td { padding:12px 7px; }
    .cell-result { font-size:18px; }
    .cell-result.unavailable { font-size:14px; }
    .movement { max-width:300px; justify-self:center; }
    th,td { padding:10px 7px; }
    td input { width:105px; }
    #assessmentNavigation .nav-dropdown.active>.dropdown-menu { transform:none; }
    #assessmentNavigation .nav-menu { max-height:calc(100dvh - 70px); overflow:auto; }
}
@media print {
    #assessmentNavigation,.intro,main>section:not(#assessmentResults),main>details,form,.commands,.tooltip-trigger,footer,.report-callout { display:none !important; }
    main { padding:0; max-width:none; }
    #assessmentResults { display:block; }
    [role=tooltip] { display:block; position:static; color:#111; background:#fff; box-shadow:none; padding:0; }
    table { font-size:11px; }
    tr { break-inside:avoid; }
    h3 { break-after:avoid; }
    .tug-metric-panel { break-before:auto; }
    .tug-metric-table { font-size:11px; }
    .cell-result { font-size:15px; }
    .cell-method { font-size:10px; }
    .phase-card { border:1px solid #ccc; }
}