@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600&display=swap');
:root { --brace-blue:#2f70d0; --brace-ink:#182332; --brace-muted:#657182; --brace-line:#dfe5ec; --mantine-primary-color-filled:#2f70d0; }
body { font-family:Barlow,Arial,sans-serif!important; color:var(--brace-ink); }
.brace-header { position:fixed; z-index:50; inset:0 0 auto; height:64px; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--brace-line); background:white; }
.brace-header h1 { margin:0; line-height:1; }
.brace-brand { color:var(--brace-ink); font-size:25px; font-weight:600; letter-spacing:1.5px; text-decoration:none; display:flex; align-items:center; gap:20px; }
.brace-brand span { font-size:13px; font-weight:400; letter-spacing:0; color:var(--brace-muted); border-left:1px solid var(--brace-line); padding-left:20px; }
.brace-header-actions { display:flex; align-items:center; gap:22px; font-size:14px; }
.brace-header-actions a { color:var(--brace-muted); text-decoration:none; }
.brace-header button,.brace-disclosure,.brace-advanced { font:inherit; cursor:pointer; color:var(--brace-ink); background:white; border:1px solid var(--brace-line); border-radius:4px; padding:9px 13px; }
.brace-header button[aria-expanded=true] { color:var(--brace-blue); border-color:var(--brace-blue); }
.brace-controls { top:86px!important; right:24px!important; left:auto!important; width:320px!important; border:1px solid var(--brace-line); border-radius:8px!important; box-shadow:none!important; background:white!important; font:14px/1.5 Barlow,Arial,sans-serif!important; }
.brace-controls > div:first-child { height:46px!important; border-bottom:1px solid var(--brace-line); font-weight:600!important; }
.brace-controls > div:first-child > a,.brace-controls > div:first-child > div:first-of-type { display:none!important; }
.brace-controls .mantine-ScrollArea-content > div { width:100%!important; }
.brace-controls .mantine-ScrollArea-content > div > div { padding:14px!important; }
.brace-controls .mantine-ScrollArea-content { min-width:0!important; }
.brace-panel-intro { margin:0 0 14px; }
.brace-eyebrow { font-size:11px; letter-spacing:1.3px; text-transform:uppercase; font-weight:600; color:var(--brace-blue); }
.brace-panel-intro p { margin:7px 0 0; color:var(--brace-muted); font-size:14px; line-height:1.5; }
.brace-controls .mantine-Text-root { letter-spacing:0!important; }
.brace-controls .mantine-Checkbox-label { font-size:14px!important; line-height:1.4; }
.brace-controls .mantine-Checkbox-input { width:17px!important; height:17px!important; border-radius:4px; }
.brace-controls .mantine-Checkbox-inner { width:17px!important; height:17px!important; }
.brace-section { margin:16px 0!important; border-color:var(--brace-line)!important; border-radius:4px!important; }
.brace-section > div:first-child { font-size:13px!important; color:var(--brace-muted); }
.brace-disclosure { width:100%; text-align:left; margin:4px 0 10px; display:flex; align-items:center; justify-content:space-between; }
.brace-disclosure::after { content:'+'; color:var(--brace-blue); font-size:18px; }
.brace-disclosure[aria-expanded=true]::after { content:'−'; }
.brace-advanced { display:block; margin:10px auto 0; padding:4px; border:0; color:var(--brace-muted); font-size:12px; }
.brace-controls:not(.brace-forces-open) .brace-force-section,.brace-controls:not(.brace-advanced-open) .brace-debug-section,.brace-controls:not(.brace-advanced-open) .brace-single-choice { display:none!important; }
.brace-controls .mantine-Button-root { background:#f5f8fc!important; color:var(--brace-ink)!important; height:34px!important; border:1px solid var(--brace-line)!important; }
.brace-controls .mantine-Divider-root { display:none; }
.brace-controls .mantine-Slider-thumb { width:17px!important; height:17px!important; }
.brace-hud { left:24px!important; bottom:24px!important; flex-direction:row!important; gap:12px!important; font:14px/1.5 Barlow,Arial,sans-serif!important; }
.brace-hud > div { background:white!important; color:var(--brace-ink)!important; border:1px solid var(--brace-line)!important; border-radius:8px!important; padding:14px 18px!important; backdrop-filter:none!important; }
.brace-hud > div > div:first-child { color:var(--brace-muted)!important; font-size:11px!important; text-transform:uppercase; letter-spacing:1.2px!important; }
.brace-steering span { color:var(--brace-ink)!important; box-shadow:none!important; }
.brace-steering span[role=button] { cursor:pointer; pointer-events:auto; touch-action:none; user-select:none; }
.brace-steering span[role=button] { border-color:var(--brace-line)!important; min-width:28px!important; height:28px!important; padding:0 5px!important; font-size:12px!important; }
.brace-steering span[role=button]:focus-visible { outline:2px solid var(--brace-blue); outline-offset:2px; }
.brace-steering > div:nth-child(3),.brace-steering > div:nth-child(3) span { color:var(--brace-muted)!important; font-family:Barlow,Arial,sans-serif!important; }
.brace-styles { min-width:190px; }
.brace-styles > div:first-child span { display:none!important; }
.brace-style { min-height:32px; padding:4px 8px!important; margin:2px -6px!important; color:var(--brace-muted)!important; border:1px solid transparent; text-transform:capitalize; background:transparent!important; }
.brace-style > span { color:var(--brace-blue)!important; }
.brace-style.is-active { background:#edf4ff!important; color:var(--brace-blue)!important; }
.brace-style:hover { border-color:var(--brace-line); }
.brace-guide { position:fixed; z-index:55; top:86px; left:24px; width:300px; max-height:calc(100dvh - 110px); overflow:auto; padding:22px; background:white; border:1px solid var(--brace-line); border-radius:8px; font:14px/1.5 Barlow,Arial,sans-serif; }
.brace-guide[hidden] { display:none; }
.brace-guide h2 { font-size:21px; font-weight:500; margin:7px 0 18px; }
.brace-guide dt { display:flex; align-items:center; gap:8px; font-weight:500; }
.brace-guide dd { color:var(--brace-muted); margin:5px 0 17px 18px; }
.brace-guide p { margin:14px 0 0; }
.brace-guide .brace-note { border-top:1px solid var(--brace-line); padding-top:12px; font-size:12px; color:var(--brace-muted); }
.brace-dot { display:inline-block; width:9px; height:9px; border-radius:50%; flex-shrink:0; background:#7b8794; }
.brace-dot.reference { background:#60ae72; } .brace-dot.braced { background:#d92929; } .brace-dot.left { background:#f27326; } .brace-dot.right { background:#40b3d9; }
.brace-header button:focus-visible,.brace-disclosure:focus-visible,.brace-advanced:focus-visible,.brace-style:focus-visible,.brace-section [role=button]:focus-visible { outline:2px solid var(--brace-blue); outline-offset:3px; }
@media(max-width:700px) {
 .brace-header { height:56px; padding:0 14px; } .brace-brand { font-size:22px; } .brace-brand span { display:none; } .brace-header-actions { gap:12px; font-size:12px; } .brace-header button { padding:7px 9px; }
 .brace-controls { top:70px!important; right:12px!important; width:260px!important; max-height:45dvh; } .brace-controls .mantine-ScrollArea-viewport { max-height:calc(45dvh - 48px)!important; } .brace-controls .mantine-ScrollArea-content > div > div { padding:10px!important; }
 .brace-panel-intro { margin-bottom:10px; } .brace-panel-intro p { font-size:12px; } .brace-controls .mantine-Checkbox-label { font-size:13px!important; }
 .brace-hud { left:12px!important; bottom:12px!important; gap:8px!important; } .brace-hud > div { padding:10px 12px!important; } .brace-styles { min-width:164px; } .brace-style { min-height:28px; font-size:13px; }
 .brace-steering > div:nth-child(3) { line-height:1.6; }
 .brace-guide { top:70px; left:12px; width:calc(100% - 24px); max-height:65dvh; padding:18px; }
}
/* Quick force tiles. The original per-axis controls remain available on request. */
.brace-force-actions { margin:0 0 16px; padding:12px; border:1px solid #d5e5fa; border-radius:8px; background:#f3f8ff; }
.brace-force-actions fieldset { border:0; margin:0; padding:0; min-width:0; }
.brace-controls:not(.brace-forces-open) .brace-force-actions { display:none; }
.brace-controls:not(.brace-force-details) .brace-force-section { display:none!important; }
.brace-controls.brace-writing-forces .brace-force-section { display:block!important; position:fixed!important; left:-10000px!important; top:0!important; width:270px!important; visibility:hidden!important; }
.brace-force-modes { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.brace-force-actions button,.brace-force-actions input,.brace-force-actions select { font:inherit; border:1px solid #cfdeef; border-radius:4px; background:white; color:var(--brace-ink); min-height:36px; }
.brace-force-actions button { cursor:pointer; padding:7px 10px; }
.brace-force-modes button { text-align:left; padding:10px 8px; }
.brace-force-modes strong { display:block; font-size:14px; font-weight:500; }
.brace-force-modes span { display:block; margin-top:4px; font-size:11px; color:var(--brace-muted); line-height:1.3; }
.brace-force-modes button[aria-pressed=true] { background:#e1edff; border-color:var(--brace-blue); color:var(--brace-blue); }
.brace-force-target { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; }
.brace-force-actions label { font-size:12px; color:var(--brace-muted); }
.brace-force-actions select,.brace-force-actions input { display:block; width:100%; margin-top:5px; padding:6px; font-size:13px; }
.brace-force-frame { font-size:11px; color:var(--brace-muted); margin:8px 0 12px; line-height:1.4; }
.brace-force-presets { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.brace-force-presets button { color:var(--brace-blue); font-weight:500; }
.brace-force-presets button[aria-pressed=true] { background:#e1edff; border-color:var(--brace-blue); }
.brace-force-actions button:hover { border-color:var(--brace-blue); background:#eaf3ff; }
.brace-force-custom { display:grid; grid-template-columns:1fr auto; gap:8px; align-items:end; margin-top:12px; }
.brace-force-custom button { background:var(--brace-blue); border-color:var(--brace-blue); color:white; font-size:12px; }
.brace-force-custom button:hover { background:#286dd0; color:white; }
.brace-force-footer { display:flex; justify-content:space-between; gap:8px; margin-top:10px; }
.brace-force-footer button { font-size:11px; padding:5px 8px; min-height:30px; }
.brace-force-detail-toggle { border-color:transparent!important; background:transparent!important; color:var(--brace-muted)!important; }
.brace-force-status { font-size:11px; line-height:1.5; margin:10px 0 0; color:var(--brace-muted); }
.brace-force-status[data-error=true] { color:#a62b35; }
.brace-force-actions :disabled { opacity:.5; cursor:wait; }
.brace-force-actions :focus-visible { outline:2px solid var(--brace-blue); outline-offset:2px; }
.brace-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:700px) {
 .brace-force-actions { padding:9px; } .brace-force-modes strong { font-size:13px; } .brace-force-modes span { font-size:10px; }
 .brace-controls.brace-forces-open { max-height:calc(100dvh - 260px); }
 .brace-controls.brace-forces-open .mantine-ScrollArea-viewport { max-height:calc(100dvh - 308px)!important; }
}
/* Gym equipment: a small, visible selection before the force laboratory. */
.brace-gym { margin:14px 0 18px; border:1px solid #d5e5fa; border-radius:8px; padding:12px; background:#f3f8ff; }
.brace-gym-heading { display:flex; justify-content:space-between; align-items:center; }
.brace-gym h2 { margin:0; font-size:16px; font-weight:600; }
.brace-gym-tag { color:var(--brace-blue); font-size:10px; letter-spacing:1.2px; }
.brace-gym-caption { margin:4px 0 12px; color:var(--brace-muted); font-size:12px; }
.brace-gym-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.brace-gym-grid button { border:1px solid #d8e3ef; border-radius:4px; background:white; padding:9px 3px; color:var(--brace-ink); cursor:pointer; font:inherit; min-width:0; }
.brace-gym-grid svg { display:block; width:54px; height:38px; max-width:100%; margin:0 auto 6px; fill:none; stroke:var(--brace-blue); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.brace-gym-grid strong,.brace-gym-grid span { display:block; font-size:11px; }
.brace-gym-grid span { color:var(--brace-muted); font-size:12px; margin-top:2px; }
.brace-gym-grid button[aria-pressed=true] { border-color:var(--brace-blue); background:#e7f0ff; }
.brace-gym-grid button:disabled { opacity:.5; cursor:wait; }
.brace-gym-summary { display:flex; align-items:center; justify-content:space-between; margin:12px 0 0; gap:8px; font-size:11px; }
.brace-gym-remove { background:white; border:1px solid var(--brace-line); border-radius:4px; font:inherit; color:var(--brace-blue); cursor:pointer; padding:4px 7px; white-space:nowrap; }
.brace-gym-remove:disabled { opacity:.45; cursor:default; }
.brace-gym [role=status] { margin:8px 0; font-size:12px; color:var(--brace-muted); }
.brace-gym [data-phase=carrying] { color:#247344; }
.brace-gym [data-phase=error] { color:#a93232; }
.brace-gym details { border-top:1px solid #d5e5fa; padding-top:7px; font-size:11px; color:var(--brace-muted); }
.brace-gym summary { cursor:pointer; }
.brace-gym details p { margin:8px 0; }
.brace-gym button:focus-visible,.brace-gym summary:focus-visible { outline:2px solid var(--brace-blue); outline-offset:2px; }
.brace-interaction-tabs { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:12px 0; }
.brace-interaction-tabs button { padding:10px 7px; border:1px solid #d5e5fa; border-radius:4px; background:white; color:var(--brace-ink); cursor:pointer; font:inherit; }
.brace-interaction-tabs strong,.brace-interaction-tabs span { display:block; }
.brace-interaction-tabs strong { font-size:13px; font-weight:600; }
.brace-interaction-tabs span { font-size:11px; color:var(--brace-muted); margin-top:3px; }
.brace-interaction-tabs button[aria-pressed=true] { background:#e7f0ff; border-color:var(--brace-blue); color:var(--brace-blue); }
.brace-interaction-tabs button:focus-visible { outline:2px solid var(--brace-blue); outline-offset:2px; }
.brace-exert-view .brace-gym { display:none; }

.brace-gauge-card {margin:12px 0;padding:14px;background:#f0f7ff;border:1px solid #b9d2ee;border-radius:14px;color:#18334f}
.brace-gauge-card[hidden] {display:none}
.brace-gauge-heading,.brace-gauge-values {display:flex;justify-content:space-between;gap:10px}
.brace-gauge-heading span {color:#306db8;font-size:10px;letter-spacing:.08em}
.brace-gauge-card p,.brace-gauge-note,.brace-gauge-hand small {font-size:11px;line-height:1.5;color:#526d86}
.brace-gauge-hand {margin:12px 0}
.brace-gauge-hand>strong {font-size:12px}
.brace-gauge-values {font-size:11px;margin:5px 0}
.brace-gauge-values span:first-child {color:#306db8}
.brace-gauge-values span:last-child {color:#9a5b13}
.brace-gauge-track {height:9px;position:relative;background:#dbe9f8;border-radius:6px;overflow:visible;margin:8px 0}
.brace-gauge-track i {display:block;height:100%;background:#eda249;border-radius:6px;transition:width .1s}
.brace-gauge-track em {position:absolute;top:-3px;width:3px;height:15px;background:#306db8;border-radius:2px}
.brace-exert-view .brace-force-modes {display:none}
.brace-exert-view .brace-panel-intro p {display:none}

.brace-requested {display:block;margin-top:3px}
.brace-error-track {position:relative;height:7px;margin-top:12px;background:#e6ebef;border-radius:4px;overflow:hidden}
.brace-error-track i {position:absolute;height:100%;background:#b18d65}
.brace-error-track em {position:absolute;left:50%;height:100%;width:2px;background:#667d90}
.brace-error-labels {display:flex;justify-content:space-between;font-size:10px;color:#657888;margin-top:4px}
.brace-interaction-tabs button[aria-pressed=true] {background:#edf3f7;border-color:#a8bdcd;color:#36556e}
.brace-gauge-track em {background:#7894ad}
.brace-gauge-card {background:#f7fafc;border-color:#d5e0e8}

.brace-reference-view {font-size:11px;color:var(--brace-muted);display:flex;gap:6px;align-items:center}.brace-reference-view select {font:inherit;padding:5px;border:1px solid #d5e0e8;border-radius:5px;background:#f7fafc;color:#36556e}
@media(max-width:600px){.brace-reference-view {position:fixed;top:72px;left:10px;padding:6px;background:#ffffffed;border-radius:6px}}

.brace-stability-card { margin:0 0 16px; padding:12px; background:#eef5fd; border:1px solid #c9dcec; border-radius:8px; }
#brace-stability-test { display:flex; justify-content:space-between; align-items:center; width:100%; padding:10px 12px; font:600 14px Barlow,Arial,sans-serif; color:#255a9b; background:white; border:1px solid #aac6e8; border-radius:6px; cursor:pointer; }
#brace-stability-test:hover:not(:disabled) { background:#e2eefc; border-color:var(--brace-blue); }
#brace-stability-test:focus-visible { outline:2px solid var(--brace-blue); outline-offset:2px; }
.brace-stability-card p { margin:8px 0 0; font-size:12px; color:var(--brace-muted); }
.brace-stability-status { display:block; margin-top:8px; color:#31516c; font-size:12px; }
.brace-stability-status:empty { display:none; }
.brace-stability-status[data-phase="failed"] { color:#a53333; }
#brace-stability-test:disabled { opacity:.55;cursor:default; }


.brace-steering-hint { margin:10px 0 0; color:var(--brace-blue); font-size:12px; font-weight:600; }

.brace-steering span[aria-disabled="true"] { opacity:.32; cursor:not-allowed; text-decoration:line-through; }

.brace-steering { position:relative; }
.brace-steering-tooltip { position:absolute; bottom:100%; left:0; width:250px; margin:0 0 8px; padding:12px; background:white; border:1px solid var(--brace-line); border-radius:8px; box-shadow:0 3px 12px #18233214; pointer-events:none; font-size:12px; line-height:1.5; font-weight:400; color:var(--brace-ink); }

.brace-style-override { margin:10px 0 0; padding-top:8px; border-top:1px solid var(--brace-line); color:var(--brace-muted); font-size:11px; line-height:1.5; max-width:150px; }

.brace-stream-status { margin:6px 0 0; color:var(--brace-muted); font-size:11px; }