:root {
  color-scheme: dark;
  --bg: #101311;
  --panel: #191d1a;
  --line: #343b35;
  --text: #f4f0e6;
  --muted: #a7aea7;
  --accent: #9fd356;
  --review: #f0b44d;
  --bad: #ef6a67;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: 15px/1.5 system-ui, sans-serif; }
main { width: min(1180px, 94vw); margin: 32px auto 80px; }
header, .result-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
h1 { margin: 0; font-size: clamp(32px, 6vw, 58px); letter-spacing: -.04em; }
h2 { margin-top: 0; }
.eyebrow { color: var(--accent); font-weight: 700; letter-spacing: .12em; }
.panel { margin-top: 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); padding: 24px; }
.hidden { display: none !important; }
.visually-hidden { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.deprecated-clock-workflow { display:none !important; }
label { display: grid; gap: 7px; margin-bottom: 16px; color: var(--muted); }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 8px; background: #0f1210; color: var(--text); padding: 11px; font: inherit; }
button, .button { display: inline-block; border: 0; border-radius: 8px; background: var(--accent); color: #15200b; padding: 10px 16px; font: 700 14px system-ui; text-decoration: none; cursor: pointer; }
button:disabled { opacity: .42; cursor: not-allowed; }
button.secondary, .button.secondary, .filters button { background: #2a302b; color: var(--text); }
button.danger { background: var(--bad); color: #25100f; }
.filters button.active { box-shadow: inset 0 -2px var(--accent); }
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.compact label { margin: 0; }
.wizard-step:not(.wizard-active) { display:none !important; }
.wizard-step-heading { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.wizard-step-heading > span { color:var(--muted); font-size:12px; font-weight:800; }
.wizard-step-heading h2 { margin:0; font-size:clamp(22px,4vw,30px); }
.wizard-navigation { position:fixed; z-index:50; left:50%; bottom:max(10px,env(safe-area-inset-bottom)); transform:translateX(-50%); display:grid; grid-template-columns:52px minmax(210px,auto) 52px; align-items:center; gap:10px; width:min(560px,calc(100vw - 20px)); padding:7px; border:1px solid var(--line); border-radius:16px; background:rgba(16,19,17,.95); box-shadow:0 14px 36px rgba(0,0,0,.35); backdrop-filter:blur(14px); }
.wizard-navigation > button { min-height:46px; padding:8px; font-size:20px; }
.wizard-navigation ol { display:flex; justify-content:center; gap:5px; margin:0; padding:0; list-style:none; }
.wizard-navigation li { display:flex; }
.wizard-navigation li button { width:32px; min-width:32px; min-height:32px; padding:0; border:1px solid var(--line); border-radius:50%; background:#232924; color:var(--muted); }
.wizard-navigation li button.active { border-color:var(--accent); background:var(--accent); color:#15200b; }
.wizard-navigation li button.complete { border-color:var(--accent); color:var(--accent); }
.wizard-navigation li button:disabled { opacity:.32; }
.diagnostic-level-toggle { position:fixed; z-index:51; top:max(8px,env(safe-area-inset-top)); right:8px; width:44px; min-width:44px; min-height:44px; padding:0; border:1px solid var(--line); border-radius:50%; background:rgba(16,19,17,.88); color:var(--muted); }
.diagnostic-level-toggle[data-level="details"], .diagnostic-level-toggle[data-level="debug"] { border-color:var(--accent); color:var(--accent); }
.locale-control { position:fixed; z-index:51; top:max(8px,env(safe-area-inset-top)); left:8px; margin:0; }
.locale-control select { width:64px; min-height:44px; padding:7px; background:rgba(16,19,17,.88); }
.file-picker { position:relative; display:grid; place-items:center; min-height:132px; border:2px dashed var(--line); border-radius:14px; color:var(--text); cursor:pointer; }
.file-picker:hover, .file-picker:focus-within { border-color:var(--accent); }
.file-picker > span { padding:12px 18px; border-radius:9px; background:var(--accent); color:#15200b; font-weight:800; }
.file-picker input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.import-file-name { margin:8px 0 16px; color:var(--muted); text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.import-progress, .success-message { display:flex; align-items:center; justify-content:center; gap:9px; min-height:44px; margin:8px 0; }
.success-message { color:var(--accent); font-weight:800; }
.busy-spinner { width:18px; height:18px; border:2px solid rgba(159,211,86,.25); border-top-color:var(--accent); border-radius:50%; animation:recalculation-spin .8s linear infinite; }
.import-fields { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.import-optional { margin:0; }
.import-optional textarea { min-height:72px; resize:vertical; }
.import-submit { width:100%; min-height:48px; margin-top:10px; }
.marker-heading { display:flex; justify-content:space-between; align-items:start; gap:18px; }
.marker-heading h2, .marker-heading p { margin-top:0; }
.marker-setup-grid { display:grid; grid-template-columns:auto minmax(84px,120px) auto minmax(74px,100px) 48px; gap:7px; align-items:center; }
.marker-setup-grid label { margin:0; }
.marker-setup-grid button { min-height:46px; }
.cadence-label { color:var(--muted); font-weight:700; }
.cadence-plus { text-align:center; }
.marker-video-shell { position:relative; margin-top:16px; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#070907; }
#marker-video { display:block; width:100%; max-height:min(54vh,560px); object-fit:contain; border-radius:0; }
.marker-time-readout { position:absolute; right:8px; bottom:8px; display:flex; gap:5px; padding:5px 8px; border-radius:7px; background:rgba(8,10,8,.82); font-variant-numeric:tabular-nums; }
.transport-controls { display:grid; grid-template-columns:repeat(7,minmax(44px,1fr)); gap:6px; margin:10px 0; align-items:stretch; }
.transport-controls button { min-width:0; padding:9px 8px; white-space:nowrap; }
.speed-control { grid-column:1 / -1; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:4px 10px; margin:0; padding-inline:4px; overflow:visible; }
.speed-control > span:first-child { display:flex; gap:6px; font-weight:700; }
.speed-control input { margin:0; padding:0; accent-color:var(--accent); }
.speed-ticks { grid-column:2; display:flex; justify-content:space-between; color:var(--muted); font-size:10px; line-height:1; }
.timeline-editor { margin:14px 0; }
.scrubber-label { margin:0 0 3px; }
.marker-scrubber { height:36px; margin:0; padding:0; touch-action:pan-x; accent-color:var(--accent); }
.manual-marker-track { position:relative; height:42px; margin-top:2px; border:1px solid var(--line); border-radius:9px; background:linear-gradient(180deg,#222823,#101311); overflow:hidden; touch-action:none; cursor:crosshair; }
.manual-marker-track::after { content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--line); pointer-events:none; }
.manual-marker, .game-start-marker { position:absolute; z-index:1; top:0; width:44px; min-width:44px; height:40px; padding:0; border:0; transform:translateX(-50%); background:transparent; touch-action:none; }
.manual-marker::before, .game-start-marker::before { content:""; position:absolute; top:2px; left:50%; width:15px; height:36px; border:2px solid #121612; border-radius:5px; transform:translateX(-50%); background:var(--review); pointer-events:none; }
.game-start-marker { z-index:2; top:4px; height:50px; }
.game-start-marker::before { top:0; width:9px; height:50px; background:#58a6ff; }
.manual-marker.selected::before { width:24px; background:var(--accent); box-shadow:0 0 0 3px rgba(159,211,86,.23); }
.marker-primary-actions.actions { display:grid; grid-template-columns:minmax(44px,1fr) auto minmax(44px,1fr); align-items:center; gap:20px; margin:12px auto; width:min(760px,100%); }
.marker-primary-actions .game-start-settings { grid-column:1; justify-self:start; max-width:100%; }
.marker-navigation-core { grid-column:2; display:grid; grid-template-columns:72px auto 72px; align-items:center; justify-content:center; gap:20px; }
.marker-primary-actions button { min-height:56px; font-size:22px; }
.marker-primary-actions #add-manual-marker { justify-self:center; width:clamp(112px,18vw,160px); height:clamp(96px,16vw,136px); border-radius:32px; font-size:58px; transition:transform .12s ease,filter .12s ease; }
.marker-primary-actions #add-manual-marker:active { transform:scale(.94); filter:brightness(1.16); }
.marker-primary-actions .marker-trash { grid-column:3; justify-self:end; width:44px; min-width:44px; min-height:44px; font-size:18px; }
.selected-marker-panel { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.7fr); gap:12px; margin:14px 0; padding:14px; border:1px solid var(--accent); border-radius:10px; background:rgba(159,211,86,.05); }
.selected-marker-panel h3, .selected-marker-panel p { margin:3px 0; }
.selected-marker-panel > .actions { grid-column:1 / -1; }
.manual-marker-list { display:flex; gap:7px; margin-top:12px; padding:2px 2px 9px; overflow-x:auto; scroll-snap-type:x proximity; scrollbar-width:thin; }
.manual-marker-list .manual-marker-row { flex:0 0 auto; width:auto; min-width:74px; max-width:150px; scroll-snap-align:center; grid-template-columns:1fr; }
.marker-footer-actions { align-items:center; justify-content:flex-end; }
#finish-markers { min-height:48px; }
.manual-marker-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; width:100%; text-align:left; color:var(--text); }
.manual-marker-row > span { display:grid; min-width:0; }
.manual-marker-row > span:last-child { text-align:right; }
.manual-marker-row small { color:var(--muted); font-weight:500; overflow:hidden; text-overflow:ellipsis; }
.manual-marker-row.selected { outline:2px solid var(--accent); }
.marker-footer-actions { align-items:center; justify-content:space-between; margin-top:16px; }
.marker-footer-actions .notice { margin:0; }
.pill { border: 1px solid var(--line); border-radius: 99px; padding: 5px 10px; color: var(--accent); white-space: nowrap; }
.canvas-wrap { overflow: hidden; display:grid; place-items:center; margin: 10px 0; height:min(67vh,680px); border: 1px solid var(--line); border-radius: 10px; background: #252a27; }
#calibration-canvas { display: block; width: 100%; min-width: 720px; touch-action: none; cursor: crosshair; }
#calibration-canvas[data-pointer-mode="pan"] { cursor:grab; }
#calibration-canvas[data-pointer-mode="panning"] { cursor:grabbing; }
#calibration-canvas[data-pointer-mode="file"] { cursor:col-resize; }
#calibration-canvas[data-pointer-mode="rank"] { cursor:row-resize; }
#calibration-canvas[data-pointer-mode="corner"] { cursor:move; }
.calibration-toolbar .active { outline: 2px solid var(--accent); }
.calibration-stage { margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; background: #141815; }
.calibration-board-stage { border:0; padding:0; background:transparent; }
.calibration-toolbar { display:grid; grid-template-columns:repeat(8,minmax(78px,1fr)); gap:7px; }
.calibration-toolbar > button { min-height:46px; padding:8px; }
.calibration-toolbar #validate-calibration { min-width:100px; }
.calibration-advanced { grid-column:1 / -1; }
.calibration-stage h3 { margin: 0 0 8px; }
.calibration-stage h3 small { color: var(--muted); font-weight: 500; }
.calibration-stage p { margin: 8px 0 12px; }
.clock-settings { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.clock-settings label { margin: 0; }
#rotate-board { background: var(--accent); }
#draw-clock-left.active { outline: 2px solid #58a6ff; }
#draw-clock-right.active { outline: 2px solid var(--review); }
.validation-stage { border-color: #4c5a4d; }
.clock-test-debug { max-height: 260px; overflow: auto; white-space: pre-wrap; color: var(--muted); }
.clock-test-results { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
.clock-test-results > div { border:1px solid var(--line); border-radius:9px; padding:12px; min-width:0; }
.clock-test-results h4 { margin:0 0 8px; }
.clock-test-events { display:grid; gap:6px; max-height:220px; overflow:auto; }
.clock-test-events button { display:grid; grid-template-columns:auto 1fr auto; gap:8px; text-align:left; background:#242a25; color:var(--text); }
.clock-test-events button.selected { outline:2px solid var(--accent); }
.clock-state-timeline { max-height:220px; overflow:auto; white-space:pre-wrap; color:var(--muted); }
.clock-test-captures { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.clock-test-captures figure { margin:0; min-width:0; }
.clock-test-captures img { width:100%; min-height:80px; max-height:220px; object-fit:contain; background:#080a08; }
.clock-test-captures figcaption { color:var(--muted); font-size:12px; }
.clock-annotation-panel { grid-column:1 / -1; }
.clock-data-panel { margin:12px 0; border:1px solid var(--line); border-radius:9px; padding:12px; background:#101411; }
.clock-data-panel > summary { cursor:pointer; font-weight:700; }
.clock-signal-panel { margin:12px 0; border:1px solid var(--line); border-radius:9px; padding:10px 12px; background:#101411; }
.clock-signal-panel > summary { cursor:pointer; font-weight:700; }
.clock-reference-separation, .clock-provenance-counts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:12px; }
.clock-reference-separation article, .clock-provenance-counts article { display:grid; gap:5px; border:1px solid var(--line); border-radius:8px; padding:10px; min-width:0; }
.clock-reference-heatmaps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:10px 0; }
.clock-reference-heatmaps figure { margin:0; border:1px solid var(--line); border-radius:8px; padding:8px; }
.clock-reference-heatmaps img { width:100%; max-height:220px; object-fit:contain; background:#080a08; }
.clock-reference-heatmaps figcaption { display:grid; gap:3px; color:var(--muted); font-size:12px; }
.clock-optimization-proposals { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:8px 0; }
.clock-optimization-proposals article { border:1px dashed var(--review); border-radius:8px; padding:10px; }
.clock-data-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:12px; }
.clock-data-groups > section { border-top:1px solid var(--line); min-width:0; }
.clock-data-list { display:grid; gap:6px; }
.clock-data-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:8px; align-items:center; border:1px solid var(--line); border-radius:7px; padding:7px; }
.clock-data-item small { display:block; color:var(--muted); overflow-wrap:anywhere; }
.provenance-badge { display:inline-block; width:max-content; border:1px solid currentColor; border-radius:99px; padding:2px 6px; font-size:10px; font-weight:800; }
.provenance-badge.auto { color:#80c8ff; }
.provenance-badge.manual { color:#d9a7ff; }
.provenance-badge.override { color:var(--review); }
.provenance-badge.reference { color:var(--accent); }
.provenance-badge.legacy { color:#aaa; }
.clock-delete-item { margin:0; padding:5px 8px; min-width:auto; }
.clock-test-aggregated-causes { display:grid; gap:4px; margin:8px 0; color:var(--muted); }
#clock-test-selection { white-space:pre-line; }
.danger { border-color:var(--bad); color:#ffaaa7; }
.notice { margin: 16px 0; color: var(--muted); }
.muted { color: var(--muted); font-size: 13px; }
.progress { height: 9px; border-radius: 99px; overflow: hidden; background: #090b09; }
#progress-bar { width: 0; height: 100%; transition: width .3s; background: var(--accent); }
.recalculation-panel { margin:14px 0; border:1px solid var(--review); border-radius:10px; padding:13px; background:#121613; }
.recalculation-heading, .recalculation-heading > div { display:flex; align-items:center; justify-content:space-between; gap:9px; }
.recalculation-spinner { width:17px; height:17px; border:2px solid rgba(240,180,77,.3); border-top-color:var(--review); border-radius:50%; animation:recalculation-spin .8s linear infinite; }
.recalculation-panel[data-state="reconstructed"] .recalculation-spinner,
.recalculation-panel[data-state="cancelled"] .recalculation-spinner,
.recalculation-panel[data-state="rejected"] .recalculation-spinner { animation:none; border-color:var(--accent); }
.correction-receipt { margin:10px 0; color:var(--text); font-weight:700; white-space:pre-line; }
.recalculation-stages { display:flex; gap:7px; flex-wrap:wrap; margin:8px 0; padding:0; list-style:none; }
.recalculation-stages li { border:1px solid var(--line); border-radius:99px; padding:4px 9px; color:var(--muted); font-size:12px; }
.recalculation-stages li.done { border-color:var(--accent); color:var(--accent); }
.recalculation-stages li.active { border-color:var(--review); color:var(--text); }
.recalculation-progress { margin-top:10px; }
#recalculation-progress-bar { width:0; height:100%; transition:width .25s; background:var(--review); }
.recalculation-progress.indeterminate #recalculation-progress-bar { width:32%; animation:recalculation-slide 1.1s ease-in-out infinite alternate; }
.recalculation-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:7px; margin:10px 0; }
.recalculation-metrics span { border:1px solid var(--line); border-radius:7px; padding:8px; min-width:0; }
.recalculation-metrics strong, .recalculation-metrics small { display:block; overflow:hidden; text-overflow:ellipsis; }
.recalculation-metrics small { color:var(--muted); }
@keyframes recalculation-spin { to { transform:rotate(360deg); } }
@keyframes recalculation-slide { from { transform:translateX(0); } to { transform:translateX(210%); } }
.analysis-launch { display:flex; justify-content:center; margin:10px 0; }
.analysis-launch button { min-width:min(280px,100%); min-height:48px; }
.analysis-compact-status { display:grid; grid-template-columns:auto 1fr auto auto; gap:10px; align-items:center; margin:10px 0; color:var(--muted); }
.analysis-compact-status strong { color:var(--accent); font-size:20px; }
.analysis-compact-status span:nth-child(2) { color:var(--text); font-weight:700; }
.stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-top: 10px; }
.stats span { padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.stats strong { display: block; font-size: 24px; }
.stats small { display:block; color:var(--muted); }
.analysis-actions { margin: 10px 0; }
.observability { display:grid; grid-template-columns:repeat(7,minmax(90px,1fr)); gap:7px; margin:12px 0; }
.observability section { border:1px solid var(--line); border-radius:7px; padding:8px; min-width:0; }
.observability strong, .observability small { display:block; overflow:hidden; text-overflow:ellipsis; }
.observability small { color:var(--muted); }
.phase-steps { display:flex; gap:7px; flex-wrap:wrap; margin:10px 0; }
.phase-steps span { border:1px solid var(--line); border-radius:99px; padding:4px 9px; color:var(--muted); font-size:12px; }
.phase-steps .active { border-color:var(--accent); color:var(--text); }
.current-line-panel { border:1px solid var(--line); border-radius:9px; padding:11px; margin-top:12px; }
.current-line-panel h3 { margin:0 0 8px; display:flex; gap:10px; align-items:center; }
.debug-level-heading { display:flex; justify-content:space-between; gap:12px; align-items:start; }
.debug-level-heading label { display:flex; align-items:center; gap:7px; margin:0; }
.debug-level-heading select { width:auto; padding:5px 8px; }
body[data-debug-level="simple"] .simple-hide { display:none !important; }
body[data-debug-level="simple"] #results-step #summary,
body[data-debug-level="simple"] #results-step #resolution-summary,
body[data-debug-level="simple"] #results-step #export-status,
body[data-debug-level="simple"] #results-step #review-message,
body[data-debug-level="simple"] #results-step #recalculation-panel,
body[data-debug-level="simple"] #results-step .filters { display:none !important; }
body[data-debug-level="simple"] .live-images { grid-template-columns:minmax(0,640px); justify-content:center; }
.engine-details { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.engine-details article, #beam-debug { border:1px solid var(--line); border-radius:7px; padding:8px; min-width:0; }
.engine-details h4, #beam-debug h4 { margin:0 0 6px; }
.engine-details pre, #beam-debug pre { white-space:pre-wrap; overflow:auto; max-height:360px; color:var(--muted); font-size:11px; }
.current-line { line-height:2; }
.current-line button.line-move { display:inline-grid; gap:0; margin:2px; padding:3px 6px; border:1px solid transparent; border-radius:4px; background:#101411; color:inherit; line-height:1.3; text-align:left; vertical-align:middle; }
.current-line button.line-move small { color:var(--muted); font-size:9px; font-weight:500; }
.current-line button.line-move:hover, .current-line button.line-move:focus-visible, .current-line button.line-move.selected { border-color:var(--accent); outline:none; }
.line-move.provisional { color:var(--review); border-bottom:1px dashed var(--review); }
.line-move.stable { color:var(--text); }
.line-move.final { color:var(--accent); }
.line-move.user_correction { color:var(--accent); }
.line-move.recompute_pending { color:var(--muted); text-decoration:line-through; }
.revision-log, .clock-timeline { display:flex; gap:7px; flex-wrap:wrap; margin-top:7px; }
.revision-log span, .clock-timeline button { color:var(--muted); background:#101411; border-radius:4px; padding:3px 6px; font-size:12px; }
.clock-timeline button { margin:0; border:1px solid transparent; }
.clock-timeline button.clock-confirmed { border-color:var(--accent); }
.clock-timeline button.clock-transition { border-color:var(--review); }
.clock-timeline button.clock-state-unknown { border-color:#d39b5b; }
.clock-timeline button.clock-hand-pass { border-color:#80c8ff; }
.clock-timeline button.clock-unknown { border-color:var(--bad); }
.clock-timeline button.selected { color:var(--text); border-color:var(--accent); }
.clock-navigation { display:grid; grid-template-columns:auto minmax(180px,1fr) auto; gap:8px; align-items:center; margin-top:8px; }
.clock-navigation span { text-align:center; }
.warning { color:var(--review); }
.actions, .filters { display: flex; gap: 8px; flex-wrap: wrap; }
.review-workspace { display: grid; grid-template-columns: minmax(230px,.6fr) minmax(0,2fr); gap: 16px; margin: 16px 0; min-height: 430px; }
.move-list { max-height: 680px; overflow: auto; }
.move-row { width: 100%; display: grid; grid-template-columns: 48px 1fr 64px 42px; gap: 7px; align-items:center; text-align: left; margin: 0 0 6px; background: #242a25; color: var(--text); }
.move-row.selected { outline: 2px solid var(--accent); }
.move-row.high { border-left: 3px solid var(--accent); }
.move-row.review { border-left: 3px solid var(--review); }
.move-row.unresolved { border-left: 3px solid var(--bad); }
.move-row.to-recompute { border-left:3px solid var(--review); opacity:.7; }
.review-pane { border: 1px solid var(--line); border-radius: 10px; padding: 16px; }
.resolution-summary { margin:8px 0; padding:8px 10px; border:1px solid var(--line); border-radius:8px; color:var(--muted); }
.resolution-summary.complete { border-color:var(--accent); color:var(--accent); }
.resolution-summary.blocked { border-color:var(--bad); color:#ffaaa7; }
.review-visual-pair { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); gap:12px; }
.review-board-card, .review-camera-card { min-width:0; border:1px solid var(--line); border-radius:10px; padding:9px; background:#101411; }
.review-camera-frame { position:relative; display:grid; place-items:center; aspect-ratio:1; overflow:hidden; border-radius:8px; background:#080a08; }
.review-camera-frame img { width:100%; height:100%; object-fit:contain; }
.corner-label { position:absolute; z-index:2; padding:2px 5px; border-radius:4px; background:rgba(8,10,8,.78); color:#fff; font-size:10px; font-weight:800; }
.corner-a8 { left:5px; top:5px; }.corner-h8 { right:5px; top:5px; }.corner-a1 { left:5px; bottom:5px; }.corner-h1 { right:5px; bottom:5px; }
.review-moment-toggle { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:7px; }
.review-moment-toggle button[aria-pressed="true"] { background:var(--accent); color:#15200b; }
.review-clip-controls { display:grid; grid-template-columns:44px 1fr 44px; gap:6px; margin-top:7px; }
.review-clip-controls button { min-height:44px; padding:6px; }
.candidate-chips { display:flex; gap:6px; flex-wrap:wrap; overflow:visible; padding:3px 0; }
.candidate-chips .candidate { flex:0 1 auto; min-height:44px; border-radius:99px; padding:7px 12px; }
.review-confirm { min-height:44px; padding:7px 11px; }
.review-mode-tabs { display:none; }
.review-nav { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.review-nav strong { min-width:0; text-align:center; }
.review-nav strong small { display:block; color:var(--muted); font-size:11px; font-weight:700; }
.review-main { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(240px,.8fr); gap:16px; }
.video-zone, .move-zone { border:1px solid var(--line); border-radius:10px; padding:14px; background:#121613; }
.time-markers { display:flex; gap:8px; flex-wrap:wrap; margin-top:9px; }
.candidate-list { display:grid; gap:7px; margin-bottom:14px; }
.candidate-list .candidate { display:flex; justify-content:space-between; align-items:center; margin:0; width:100%; border:1px solid var(--line); text-align:left; }
.candidate-list .candidate > span:first-child { display:grid; gap:1px; }
.candidate-list .candidate small { color:var(--muted); font-weight:500; }
.candidate-list .candidate:hover, .candidate-list .candidate:focus-visible { border-color:var(--review); outline:none; }
.retained-move { border:2px solid var(--accent); border-radius:10px; padding:12px; margin-bottom:10px; background:rgba(159,211,86,.06); }
.retained-move h2 { margin:0 0 6px; }
.muted-pane { display: grid; place-items: center; color: var(--muted); }
.evidence { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.evidence figure { margin:0; }
.evidence figcaption { font-weight:700; margin-top:6px; color:var(--muted); }
.evidence img, video { width: 100%; max-height: 420px; object-fit: contain; background: #080a08; border-radius: 8px; }
.zoomable { cursor:zoom-in; }
.board-and-data { display: grid; grid-template-columns: minmax(260px,420px) 1fr; gap: 18px; margin-top: 14px; }
#digital-board { width: 100%; aspect-ratio: 1; cursor: pointer; touch-action:none; }
.board-correction-panel { margin-top:10px; border:1px solid var(--line); border-radius:8px; padding:10px; background:#101411; }
.board-correction-panel p { margin:0 0 8px; }
.board-preview { display:grid; gap:8px; border-top:1px solid var(--line); padding-top:9px; }
.board-preview > span { color:var(--accent); font-weight:700; }
.board-error { color:#ffaaa7; }
.correction-state[data-state="pending"], .correction-state[data-state="recorded"], .correction-state[data-state="accepted"], .correction-state[data-state="stopping"], .correction-state[data-state="restarting"], .correction-state[data-state="provisional"], .correction-state[data-state="consolidating"] { color:var(--review); }
.correction-state[data-state="reconstructed"] { color:var(--accent); }
.correction-state[data-state="rejected"] { color:var(--bad); }
.candidate { margin: 4px; background: #363e37; color: var(--text); }
.error { margin-top: 18px; border: 1px solid var(--bad); color: #ffaaa7; padding: 15px; white-space: pre-wrap; }
.live-debug { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 18px; }
.live-heading, .live-heading > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.live-images { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-top: 14px; }
.live-images figure { min-width:0; margin: 0; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: #090b09; }
.live-images img, #live-digital-board { width: 100%; aspect-ratio: 1.2; object-fit: contain; object-position:center; display: block; }
#live-digital-board { height:auto; max-width:100%; max-height:100%; aspect-ratio: 1; }
.live-images figcaption { padding: 8px; color: var(--muted); font-size: 12px; }
.live-data { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.live-data article { border: 1px solid var(--line); border-radius: 9px; padding: 12px; min-width: 0; }
.live-data h3 { margin-top: 0; }
#last-event { white-space: pre-wrap; overflow: auto; max-height: 220px; color: var(--muted); }
.event-log { margin: 0; padding-left: 22px; max-height: 220px; overflow: auto; color: var(--muted); }
.square-diagnostics { display: grid; grid-template-columns: repeat(8, minmax(65px,1fr)); gap: 3px; margin-top: 12px; }
.square-cell { border: 1px solid var(--line); border-radius: 4px; padding: 4px; font-size: 10px; min-height: 52px; overflow: hidden; }
.square-cell strong { display: block; color: var(--accent); font-size: 12px; }
.square-cell.changed { border-color: var(--review); }
.square-cell.occluded { border-color: var(--bad); }
.technical-diagnostics { margin:12px 0; border:1px solid var(--line); border-radius:9px; padding:10px; }
.technical-diagnostics summary { cursor:pointer; font-weight:700; }
.result-product-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto auto; gap:9px; align-items:end; margin:14px 0; padding:12px; border:1px solid var(--line); border-radius:10px; }
.result-product-controls label, .result-product-controls p { margin:0; }
.result-product-controls .export-toggle { display:flex; align-items:center; gap:7px; min-height:46px; }
.result-product-controls .export-toggle input { width:auto; margin:0; accent-color:var(--accent); }
.result-product-controls button, .result-product-controls .button { min-height:46px; }
.result-product-controls p { grid-column:1 / -1; }
#export-step { position:relative; }
.export-kind-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:10px 0; }
.export-kind-card { display:grid; place-items:center; gap:3px; min-height:72px; color:var(--text); }
.export-kind-card > span { font-size:22px; }
.export-kind-card.active { outline:2px solid var(--accent); background:#273223; }
.export-metadata, .technical-exports { margin:8px 0; border:1px solid var(--line); border-radius:9px; padding:8px 10px; }
.export-metadata h3 { margin:0 0 8px; font-size:15px; }
.export-metadata[data-mode="media"] .pgn-only-metadata { display:none; }
.technical-exports summary { cursor:pointer; font-weight:700; }
.player-metadata-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.player-metadata-grid label { margin:0; }
.player-metadata-grid label:nth-child(n+5) { grid-column:auto; }
.export-move-navigation { display:grid; grid-template-columns:44px 44px minmax(0,1fr) 44px 44px; align-items:center; gap:6px; margin:8px auto; max-width:620px; }
.export-move-navigation strong { text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.export-move-navigation button { min-width:44px; min-height:44px; padding:6px; }
.export-settings-panel, .export-preview-panel { display:contents; }
.export-clock-editor { position:relative; z-index:1; width:100%; margin:0 0 8px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.export-clock-editor summary { display:flex; justify-content:space-between; gap:10px; padding:9px 11px; cursor:pointer; }
.export-clock-editor-body { display:grid; gap:10px; padding:10px; border-top:1px solid var(--line); }
.export-clock-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.export-clock-grid label { display:grid; gap:4px; }
.theme-picker { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:10px 0; }
.theme-card { display:grid; place-items:center; padding:5px; border:2px solid transparent; color:var(--text); background:#242a25; }
.theme-card.active { border-color:var(--accent); box-shadow:0 0 0 2px rgba(159,211,86,.18),inset 0 0 0 1px var(--accent); }
.theme-card canvas { display:block; width:min(100%,180px); aspect-ratio:1/1; border-radius:6px; }
.board-palette { display:grid; grid-template-columns:1fr 1fr auto; gap:8px; align-items:end; }
.board-palette label { margin:0; }
.color-field { display:grid; grid-template-columns:48px 1fr; gap:6px; }
.color-field input[type="color"] { min-height:44px; padding:3px; }
.palette-presets { display:flex; gap:6px; }
.palette-preset { width:44px; min-width:44px; height:44px; padding:0; border:3px solid var(--text); background:linear-gradient(135deg,var(--palette-light,#e8dcc0) 0 50%,var(--palette-dark,#7b8d68) 50%); }
.palette-preset[data-dark="#54758b"] { --palette-light:#dbe5ec; --palette-dark:#54758b; }
.palette-preset[data-dark="#8b5e3c"] { --palette-light:#ead9bd; --palette-dark:#8b5e3c; }
.export-options { display:grid; grid-template-columns:repeat(5,1fr); gap:7px; margin:9px 0; }
.export-options .export-toggle { display:flex; align-items:center; gap:7px; min-height:44px; margin:0; padding:7px; border:1px solid var(--line); border-radius:8px; }
.export-options input { width:auto; margin:0; }
.checkerboard { background-color:#fff; background-image:linear-gradient(45deg,#d8d8d8 25%,transparent 25%),linear-gradient(-45deg,#d8d8d8 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d8d8d8 75%),linear-gradient(-45deg,transparent 75%,#d8d8d8 75%); background-size:20px 20px; background-position:0 0,0 10px,10px -10px,-10px 0; }
.overlay-format-control { display:grid; grid-template-columns:auto minmax(180px,260px); align-items:center; justify-content:center; gap:10px; margin:6px auto; }
.overlay-format-control select { min-height:44px; }
.overlay-preview { position:relative; display:block; width:min(100%,36vh,520px); aspect-ratio:1; min-height:0; margin-inline:auto; overflow:hidden; border:1px solid var(--line); border-radius:10px; touch-action:none; }
.overlay-preview[data-layout="PORTRAIT"] { width:min(100%,28.8vh,416px); aspect-ratio:4/5; }
.overlay-preview canvas { position:absolute; display:block; height:auto; max-height:none; object-fit:contain; }
.overlay-element { position:absolute; left:var(--element-x,4%); top:var(--element-y,4%); z-index:4; min-height:32px; padding:5px 8px; border:1px solid rgba(255,255,255,.7); border-radius:6px; background:rgba(10,14,18,.82); color:#fff; font-weight:700; cursor:move; touch-action:none; user-select:none; }
.overlay-element[data-overlay-element="whiteClock"] { --element-x:4%; --element-y:16%; }
.overlay-element[data-overlay-element="blackPlayer"] { --element-x:72%; --element-y:4%; }
.overlay-element[data-overlay-element="blackClock"] { --element-x:76%; --element-y:16%; }
.overlay-element[data-overlay-element="currentMove"] { --element-x:43%; --element-y:84%; }
.master-configurator { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,.32fr); gap:10px; }
.master-video-preview { position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:linear-gradient(135deg,#202722,#080a08); touch-action:none; }
.master-video-preview[data-layout="VERTICAL"] { width:min(55%,360px); aspect-ratio:9/16; margin-inline:auto; }
.master-video-preview video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.7; transform:scale(var(--preview-zoom,1)); transform-origin:center; transition:transform .12s ease; }
#master-board-placement { position:absolute; left:64%; top:64%; width:32%; height:auto; cursor:move; touch-action:none; box-shadow:0 6px 20px rgba(0,0,0,.4); }
.master-controls { display:grid; align-content:start; gap:8px; }
.master-controls label { margin:0; }
.master-preview-zoom { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; }
.master-preview-zoom button { min-height:44px; padding:6px; }
.placement-presets { display:grid; grid-template-columns:repeat(4,1fr); gap:5px; }
.placement-presets button { min-height:44px; padding:6px; }
.export-primary-actions { display:flex; gap:8px; margin-top:9px; }
.export-primary-actions > * { min-height:46px; }
.pgn-locked-preview { display:grid; gap:7px; place-items:center; padding:18px; border:1px solid var(--line); border-radius:12px; text-align:center; }
.pgn-locked-preview strong { color:var(--accent); font-size:20px; }
.locked-lines { color:transparent; text-shadow:0 0 8px rgba(230,236,228,.62); user-select:none; }
.export-paywall { width:min(460px,calc(100vw - 24px)); border:1px solid var(--line); border-radius:16px; padding:24px; background:#151a16; color:var(--text); }
.export-paywall::backdrop { background:rgba(0,0,0,.72); backdrop-filter:blur(4px); }
.export-paywall .dialog-close { float:right; width:44px; min-width:44px; }
.export-paywall #paywall-price { display:block; margin:12px 0; color:var(--accent); font-size:32px; }
.export-paywall li { margin:8px 0; }
.media-job-progress { margin-top:9px; padding:9px; border:1px solid var(--line); border-radius:9px; }
.media-job-progress > div:first-child { display:flex; justify-content:space-between; gap:10px; }
.media-job-progress p { margin:5px 0; color:var(--muted); }
#media-job-progress-bar { width:0; height:100%; background:var(--accent); transition:width .2s; }
.mobile-result-actions { display:none; }
#results-step.marker-results-stale .filters,
#results-step.marker-results-stale .result-heading .actions,
#results-step.marker-results-stale .technical-diagnostics,
#results-step.marker-results-stale .review-workspace,
#results-step.marker-results-stale .pgn-output-field,
#results-step.marker-results-stale #copy-pgn,
#results-step.marker-results-stale #mobile-review-action,
#results-step.marker-results-stale #mobile-pgn-action,
#results-step.marker-results-stale #mobile-diagnostics-action { display:none; }
#results-step.marker-results-stale .mobile-result-actions { grid-template-columns:1fr; }
@media (max-width: 760px) {
  body { padding:0; overflow:hidden; }
  main { width:100%; height:100dvh; margin:0; padding:env(safe-area-inset-top) 0 calc(72px + env(safe-area-inset-bottom)); overflow:hidden; }
  header { padding:14px 14px 4px; }
  header > div > p:last-child { margin:.25rem 0; }
  h1 { font-size:34px; }
  .panel { width:calc(100% - 12px); height:calc(100dvh - 82px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); margin:6px; padding:12px; border-radius:11px; overflow:hidden; }
  #analysis-step { padding-top:max(14px,env(safe-area-inset-top)); scroll-padding-top:max(14px,env(safe-area-inset-top)); }
  .wizard-step-heading { margin-bottom:7px; padding-left:56px; }
  .wizard-navigation { bottom:max(6px,env(safe-area-inset-bottom)); grid-template-columns:46px 1fr 46px; gap:5px; width:calc(100vw - 12px); padding:5px; border-radius:13px; }
  .wizard-navigation > button { min-height:44px; }
  .wizard-navigation ol { gap:3px; }
  .wizard-navigation li button { width:30px; min-width:30px; min-height:30px; }
  .diagnostic-level-toggle { top:max(6px,env(safe-area-inset-top)); right:6px; }
  .locale-control { top:max(6px,env(safe-area-inset-top)); left:6px; }
  #import-form { display:grid; align-content:start; height:calc(100% - 38px); }
  .file-picker { min-height:132px; }
  .import-fields { grid-template-columns:1fr; gap:5px; }
  .import-optional { margin:0; }
  .import-optional textarea { min-height:58px; height:58px; }
  .cols, .clock-settings, .clock-navigation, .clock-reference-separation, .clock-reference-heatmaps, .clock-optimization-proposals, .clock-provenance-counts, .clock-data-groups, .observability, .recalculation-metrics, .review-main, .board-and-data, .live-images, .live-data, .marker-setup-grid, .selected-marker-panel, .manual-marker-list, .result-product-controls { grid-template-columns: 1fr; }
  .marker-heading { align-items:center; }
  .marker-heading .eyebrow { margin-bottom:3px; }
  .marker-heading h2 { font-size:23px; margin-bottom:3px; }
  .marker-heading > div > p:last-child { font-size:13px; }
  .marker-heading { height:38px; }
  .marker-heading .wizard-step-heading { margin:0; }
  .marker-setup-grid { grid-template-columns:auto 74px auto 62px 44px; gap:4px; }
  .marker-setup-grid input { padding:8px 5px; }
  .marker-setup-grid button { min-height:42px; }
  #time-control-summary { margin:4px 0; font-size:11px; line-height:1.25; }
  .marker-video-shell { margin-top:5px; }
  #marker-video { height:min(29vh,245px); max-height:none; }
  .transport-controls { grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; margin:5px 0; }
  .transport-controls button { min-height:44px; padding:8px 1px; font-size:11px; }
  .speed-control { grid-column:1 / -1; grid-template-columns:auto 1fr; gap:2px 8px; min-height:45px; }
  .speed-control input { min-height:28px; }
  .timeline-editor { margin:5px 0; }
  .marker-scrubber { height:24px; }
  .manual-marker-track { height:38px; }
  .manual-marker { height:38px; }
  .manual-marker::before { height:34px; }
  .marker-primary-actions.actions { grid-template-columns:minmax(36px,1fr) auto minmax(36px,1fr); gap:8px; margin:7px auto; min-height:104px; }
  .marker-navigation-core { grid-template-columns:64px auto 64px; gap:8px; }
  .marker-primary-actions button { min-height:56px; padding:6px 3px; }
  #add-manual-marker { width:clamp(96px,30vw,132px); height:96px; min-height:96px; font-size:52px; border-radius:28px; }
  .marker-primary-actions .marker-trash { width:36px; min-width:36px; min-height:36px; opacity:.72; }
  body[data-debug-level="simple"] .selected-marker-panel,
  body[data-debug-level="simple"] .selected-marker-panel { display:none !important; }
  .selected-marker-panel > .actions { grid-column:auto; }
  .selected-marker-panel .actions button { width:100%; }
  .manual-marker-list { margin-top:5px; min-height:52px; }
  .manual-marker-row { grid-template-columns:1fr; gap:4px; min-height:46px; padding:6px 9px; }
  .manual-marker-row small, .manual-marker-row > span:last-child { display:none; }
  .manual-marker-row > span:last-child { text-align:left; grid-template-columns:1fr auto; gap:8px; }
  .marker-footer-actions { display:grid; margin-top:5px; }
  .marker-footer-actions #marker-save-status { display:none; }
  #finish-markers { width:100%; }
  .result-product-controls p { grid-column:auto; }
  .analysis-compact-status { grid-template-columns:auto 1fr; gap:3px 8px; font-size:12px; }
  .analysis-launch { margin:5px 0; }
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
  .stats span { padding:8px; min-width:0; }
  .stats strong { font-size:16px; }
  #phase { margin:6px 0; text-align:center; }
  #analysis-step .analysis-actions { display:flex; justify-content:center; }
  #analysis-step .live-debug { margin-top:5px; padding-top:5px; border:0; }
  #analysis-step .live-images { margin-top:3px; }
  #analysis-step #live-digital-board { width:min(58vh,100%); margin:auto; }
  #calibration-step .canvas-wrap { height:calc(100% - 166px); margin:7px 0 0; }
  #calibration-canvas { width:100%; height:100%; min-width:0; object-fit:contain; }
  .calibration-toolbar { grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; }
  .calibration-toolbar > button { min-height:44px; padding:5px 3px; font-size:11px; }
  .calibration-toolbar #validate-calibration { min-width:0; }
  .debug-level-heading { align-items:center; }
  .debug-level-heading h3 { min-width:0; }
  .current-line { overflow-x:auto; white-space:nowrap; }
  .review-workspace { display:block; min-height:0; margin:5px 0; height:calc(100% - 128px); }
  body[data-debug-level="simple"] .move-list { display:none; }
  .move-list { gap:7px; max-height:none; overflow-x:auto; scroll-snap-type:x proximity; padding:2px 1px 10px; }
  .move-row { flex:0 0 200px; min-height:48px; margin:0; scroll-snap-align:start; grid-template-columns:38px 1fr 50px; }
  .move-row small { grid-column:2 / -1; }
  .review-pane { height:100%; padding:7px; overflow-y:auto; overscroll-behavior:contain; }
  .review-nav { gap:6px; }
  .review-nav button { padding:9px; font-size:12px; }
  .review-mode-tabs { display:none; }
  .review-mode-tabs button { background:#2a302b; color:var(--text); }
  .review-mode-tabs button[aria-selected="true"] { background:var(--accent); color:#15200b; }
  .review-visual-pair { grid-template-columns:1fr; gap:6px; }
  .review-board-card, .review-camera-card { padding:4px; }
  #digital-board { width:min(100%,31vh); max-height:31vh; margin:auto; display:block; }
  .review-camera-frame { width:min(100%,31vh); max-height:31vh; margin:auto; }
  .review-nav { margin-bottom:5px; }
  .review-nav button { min-width:44px; min-height:44px; }
  .review-move-summary { display:flex; align-items:center; justify-content:space-between; gap:5px; margin:5px 0; }
  .review-move-summary h2 { margin:0; font-size:21px; }
  .candidate-chips { margin:3px 0; }
  .board-correction-panel { margin-top:4px; padding:6px; }
  .board-correction-panel p { font-size:11px; margin:0 0 4px; }
  .board-preview { padding-top:4px; }
  .review-details-scroll { max-height:110px; overflow:auto; }
  .move-zone { padding:10px; }
  .evidence { grid-template-columns:1fr; }
  .board-and-data { margin-top:0; }
  textarea, pre { max-width:100%; overflow-wrap:anywhere; }
  .result-heading .actions { display:none; }
  .mobile-result-actions { display:none; }
  .mobile-result-actions button, .mobile-result-actions .button { min-width:0; padding:9px 4px; font-size:11px; text-align:center; }
  .square-diagnostics { grid-template-columns: repeat(4, minmax(60px,1fr)); }
  #results-step .result-heading .actions, #results-step .filters, #results-step #review-message, #results-step #export-status { display:none; }
  #results-step #summary { margin:2px 0; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  #results-step .resolution-summary { margin:4px 0; padding:5px 7px; font-size:11px; }
  #export-step { position:relative; overflow:hidden; padding-bottom:12px; }
  body[data-debug-level="simple"] #export-step #export-resolution-gate { display:none; }
  .export-kind-cards { margin:5px 0; }
  .export-kind-card { min-height:46px; padding:3px; }
  .export-kind-card > span { font-size:17px; }
  .theme-picker { margin:5px 0; gap:4px; }
  .theme-card { padding:4px; font-size:11px; }
  .theme-card canvas { width:min(100%,48px); max-height:48px; aspect-ratio:1/1; }
  .board-palette { display:flex; justify-content:center; gap:5px; }
  .board-palette > label { display:none; }
  .board-palette .palette-presets { justify-content:center; }
  .board-palette .palette-preset { width:38px; min-width:38px; height:38px; }
  .board-palette .color-field { grid-template-columns:38px; justify-content:center; }
  .board-palette .color-field input:not([type="color"]) { display:none; }
  .export-options { grid-template-columns:repeat(5,1fr); gap:3px; margin:4px 0; }
  .export-options .export-toggle { min-height:40px; padding:3px; font-size:10px; }
  .overlay-format-control { grid-template-columns:auto minmax(150px,1fr); margin:3px auto; font-size:11px; }
  .overlay-format-control select { min-height:38px; padding:5px; }
  .overlay-preview { width:min(100%,16vh); max-height:none; }
  .overlay-preview[data-layout="PORTRAIT"] { width:min(100%,12.8vh); max-height:none; }
  .master-configurator { grid-template-columns:1fr; }
  .master-video-preview { width:min(100%,25vh,340px); max-height:none; margin-inline:auto; }
  .master-video-preview[data-layout="VERTICAL"] { width:min(100%,11.25vh,135px); max-height:none; }
  .master-controls { grid-template-columns:90px 1fr; }
  .master-controls > label:last-child { grid-column:1 / -1; }
  .export-metadata { display:block; }
  .player-metadata-grid { grid-template-columns:1fr 1fr; }
  .export-metadata[data-mode="media"] { padding:5px 7px; margin:4px 0; }
  .export-metadata[data-mode="media"] h3 { margin-bottom:3px; font-size:12px; }
  .export-metadata[data-mode="media"] .player-metadata-grid { grid-template-columns:1.4fr .65fr 1.4fr .65fr; gap:4px; }
  .export-metadata[data-mode="media"] label { gap:2px; font-size:9px; }
  .export-metadata[data-mode="media"] input { min-height:38px; padding:5px; }
  #export-step[data-export-kind="MASTER"] .theme-picker { max-height:58px; }
  #export-step[data-export-kind="MASTER"] .board-palette label { font-size:9px; }
  #export-step[data-export-kind="MASTER"] .master-controls { gap:3px; font-size:10px; }
  #export-step[data-export-kind="MASTER"] .master-controls select,
  #export-step[data-export-kind="MASTER"] .master-controls input { min-height:38px; padding:4px; }
  .export-move-navigation { grid-template-columns:44px minmax(0,1fr) 44px; }
  .export-move-navigation #export-first-move, .export-move-navigation #export-last-move { display:none; }
  .pgn-output-field { margin:5px 0; }
  .pgn-output-field textarea { height:72px; padding:6px; font-size:11px; }
.export-primary-actions { margin-top:4px; }
  .export-primary-actions > * { flex:1; min-height:44px; }
  .overlay-element { min-height:28px; padding:3px 5px; font-size:10px; }
  header, .result-heading { display: block; }
}

@media (min-width:761px) {
  body[data-debug-level="simple"] { overflow-x:hidden; overflow-y:auto; }
  body[data-debug-level="simple"] main { min-height:100vh; margin:0 auto; padding:18px 0 84px; }
  body[data-debug-level="simple"] .wizard-step { min-height:calc(100vh - 102px); margin:0; overflow:visible; }
  body[data-debug-level="simple"] #analysis-step #live-digital-board { width:min(100%,640px,calc(100dvh - 280px)); min-width:280px; margin:auto; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) {
    display:grid;
    grid-template-columns:minmax(300px,360px) minmax(0,1fr);
    grid-template-rows:auto 64px auto auto auto auto;
    align-content:start;
    gap:10px 18px;
  }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > .wizard-step-heading { grid-column:1 / -1; grid-row:1; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > #export-resolution-gate { display:none; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > .export-kind-cards { grid-column:1; grid-row:2; margin:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .export-kind-card { min-height:56px; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > .export-move-navigation { grid-column:2; grid-row:2; margin:auto; width:min(100%,620px); }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > .export-settings-panel { grid-column:1; grid-row:3 / span 4; display:grid; align-content:start; gap:8px; min-width:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .export-metadata { margin:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .theme-picker { margin:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .theme-card canvas { width:min(100%,84px); }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .export-options { grid-template-columns:repeat(5,1fr); margin:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .export-options .export-toggle { min-height:44px; padding:5px; font-size:11px; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > .export-preview-panel { grid-column:2; grid-row:3; display:grid; align-content:start; justify-items:center; gap:8px; min-width:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .overlay-format-control { margin:0 auto; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .overlay-preview { width:min(100%,52dvh,520px); margin:0 auto; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .overlay-preview[data-layout="PORTRAIT"] { width:min(100%,41.6dvh,416px); }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) .master-configurator { align-self:start; width:100%; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > .export-primary-actions { grid-column:2; grid-row:4; margin:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > #product-export-status { grid-column:2; grid-row:5; margin:0; }
  body[data-debug-level="simple"] #export-step:is([data-export-kind="OVERLAY"],[data-export-kind="MASTER"]) > #media-job-progress { grid-column:2; grid-row:6; margin:0; }
}