/* Popov Academy — content-factory/euler-2023-2026-v1: student labs (loaded only on these pages).
   Base styles shared by all labs; each lab may add visuals/labs/<kind>.css, which assets.mjs appends to this file.
   Colours are local variables. Dark values follow the site's own theme switch (html[data-design=v2] with
   data-theme=dark, or the system dark mode unless data-theme=light) and reuse the site tokens from
   redesign.css, as in the 2025 package; the global theme itself is not changed. */
.arch-lab{min-width:0;--arch-surface:#fff;--arch-ink:#1f2937;--arch-label:#203c58;--arch-muted:#5b6b82;--arch-field-line:#aebed1;--arch-soft-line:#d7e1ed;--arch-primary-bg:#244974;--arch-primary-ink:#fff;--arch-link:#244974;--arch-pressed-bg:#e6eefb;--arch-pressed-line:#244974;--arch-good:#047857;--arch-bad:#b91c1c;--arch-focus:#f59e0b;--arch-fig-line:#1f2937;--arch-grid:#c7d2e0;--arch-fill:#dbeafe;--arch-piece-a:#bfdbfe;--arch-piece-b:#fde68a;--arch-piece-c:#fecaca;--arch-piece-d:#bbf7d0;--arch-accent:#c2410c;--arch-water:#e0f2fe;--arch-ok-bg:#dcfce7;--arch-bad-bg:#fee2e2;--arch-knight:#1d4ed8;--arch-liar:#9f1239;--arch-clear:#e2e8f0}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-surface:var(--play-stage);--arch-ink:var(--ink);--arch-label:var(--ink);--arch-muted:var(--ink-2);--arch-field-line:var(--ink-3);--arch-soft-line:var(--play-line);--arch-primary-bg:var(--accent);--arch-primary-ink:var(--on-ink);--arch-link:var(--accent-ink);--arch-pressed-bg:var(--accent-soft);--arch-pressed-line:var(--accent);--arch-good:var(--ok);--arch-bad:var(--bad);--arch-fig-line:#dbe4f0;--arch-grid:#4a5568;--arch-fill:#1e3a5f;--arch-piece-a:#1e40af;--arch-piece-b:#854d0e;--arch-piece-c:#9f1239;--arch-piece-d:#166534;--arch-accent:#fb923c;--arch-water:#0c2a3f;--arch-ok-bg:#14341f;--arch-bad-bg:#431818;--arch-knight:#93c5fd;--arch-liar:#fda4af;--arch-clear:#3f4654}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-surface:var(--play-stage);--arch-ink:var(--ink);--arch-label:var(--ink);--arch-muted:var(--ink-2);--arch-field-line:var(--ink-3);--arch-soft-line:var(--play-line);--arch-primary-bg:var(--accent);--arch-primary-ink:var(--on-ink);--arch-link:var(--accent-ink);--arch-pressed-bg:var(--accent-soft);--arch-pressed-line:var(--accent);--arch-good:var(--ok);--arch-bad:var(--bad);--arch-fig-line:#dbe4f0;--arch-grid:#4a5568;--arch-fill:#1e3a5f;--arch-piece-a:#1e40af;--arch-piece-b:#854d0e;--arch-piece-c:#9f1239;--arch-piece-d:#166534;--arch-accent:#fb923c;--arch-water:#0c2a3f;--arch-ok-bg:#14341f;--arch-bad-bg:#431818;--arch-knight:#93c5fd;--arch-liar:#fda4af;--arch-clear:#3f4654}
.arch-try{margin:18px 0}
.arch-lab [data-arch-lab-body]{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;min-width:0}
.arch-lab .arch-lab-fallback{color:var(--arch-muted);font-size:15px}
.arch-lab label,.arch-lab .arch-label{font-weight:600;color:var(--arch-label)}
.arch-lab .arch-help{font-size:14px;color:var(--arch-muted);margin:0}
.arch-lab .arch-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;min-width:0}
.arch-lab input[type=text],.arch-lab input[type=number],.arch-lab select{font:inherit;font-size:18px;min-height:44px;padding:8px 12px;border:1px solid var(--arch-field-line);border-radius:12px;background:var(--arch-surface);color:var(--arch-ink);min-width:0}
.arch-lab input[type=number]{width:88px}
.arch-lab input[type=range]{flex:1 1 180px;min-width:0;min-height:44px;accent-color:var(--arch-primary-bg)}
.arch-lab button{font:inherit;font-size:16px;min-height:44px;min-width:44px;padding:10px 16px;border-radius:999px;line-height:1.4;max-width:100%;white-space:normal;cursor:pointer}
.arch-lab .arch-primary{background:var(--arch-primary-bg);color:var(--arch-primary-ink);border:1px solid var(--arch-primary-bg)}
.arch-lab .arch-secondary{background:var(--arch-surface);color:var(--arch-link);border:1px solid var(--arch-field-line)}
.arch-lab button[aria-disabled=true]{opacity:.45;cursor:default}
.arch-lab button:focus-visible,.arch-lab input:focus-visible,.arch-lab select:focus-visible,.arch-lab [tabindex]:focus-visible{outline:3px solid var(--arch-focus);outline-offset:2px}
.arch-lab .arch-actions{display:flex;flex-wrap:wrap;gap:8px}
.arch-lab .arch-toggle{display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-toggle button{background:var(--arch-surface);color:var(--arch-link);border:1px solid var(--arch-field-line)}
.arch-lab .arch-toggle button[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-result{background:var(--arch-surface);color:var(--arch-ink);border:1px solid var(--arch-soft-line);border-radius:14px;padding:14px 16px;line-height:1.55;min-width:0;overflow-wrap:anywhere}
.arch-lab .arch-result:empty{display:none}
.arch-lab :is(button,input,select){scroll-margin-block:120px}
.arch-lab .arch-result p{margin:6px 0}
.arch-lab .arch-checks{list-style:none;padding:0;margin:6px 0;display:grid;gap:6px}
.arch-lab .arch-checks li{display:flex;gap:8px;align-items:flex-start}
.arch-lab .arch-pass::before{content:'✓';color:var(--arch-good);font-weight:700;flex-shrink:0;width:1.2em}
.arch-lab .arch-fail::before{content:'✗';color:var(--arch-bad);font-weight:700;flex-shrink:0;width:1.2em}
.arch-lab .arch-good{color:var(--arch-good);font-weight:600}
.arch-lab .arch-bad{color:var(--arch-bad);font-weight:600}
.arch-lab .arch-sub{display:grid;gap:8px;border-top:1px solid var(--arch-soft-line);padding-top:12px}
.arch-lab .arch-stage{background:var(--arch-surface);border:1px solid var(--arch-soft-line);border-radius:8px;padding:8px;min-width:0}
.arch-lab .arch-stage svg{display:block;width:100%;height:auto;max-height:70vh;touch-action:manipulation}
.arch-lab svg text{fill:var(--arch-ink);font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
.arch-lab .arch-readouts{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;font-variant-numeric:tabular-nums}
.arch-lab .arch-readouts div{display:flex;gap:6px;align-items:baseline}
.arch-lab .arch-readouts dt{color:var(--arch-muted);font-size:14px}
.arch-lab .arch-readouts dd{margin:0;font-weight:600;color:var(--arch-ink);white-space:nowrap;overflow-wrap:normal}
.arch-lab .arch-table-wrap{overflow-x:auto;max-width:100%}
.arch-lab table.arch-table{border-collapse:collapse;font-variant-numeric:tabular-nums}
.arch-lab table.arch-table th,.arch-lab table.arch-table td{border:1px solid var(--arch-soft-line);padding:4px 8px;text-align:center;color:var(--arch-ink)}
.arch-lab table.arch-table th{color:var(--arch-label);font-weight:600}
.arch-lab .arch-chip{display:inline-flex;align-items:center;justify-content:center;min-width:2.2em;padding:2px 8px;border-radius:999px;border:1px solid var(--arch-soft-line);font-weight:600}
@media(max-width:480px){.arch-lab .arch-row .arch-primary{flex:1 1 100%}.arch-lab button{padding:8px 10px}}
/* shared: play button keeps its width next to a time slider, also on phones */
.arch-lab .arch-timeline{flex-wrap:nowrap}
.arch-lab .arch-timeline .arch-play{flex:0 0 auto;min-width:96px}
/* Inside the «Исследовать» disclosure the lab already has a frame: on phones drop the second one so models keep their width. */
@media (max-width:560px){.lesson-disclosure .arch-lab{padding:0;border:0;background:none;box-shadow:none}.lesson-disclosure .arch-lab .arch-stage{padding:4px}}
/* Phones: «Крупные клетки» (ui.mjs zoomable). Cells keep at least 44 px and the board scrolls sideways in its frame;
   the board geometry is unchanged, only its scale. */
.arch-lab .arch-zoom{min-width:0}
.arch-lab .arch-zoom-tools{margin-bottom:8px}
.arch-lab .arch-zoom-hint{margin:0 0 8px;font-weight:600;color:var(--arch-label)}
.arch-lab .arch-zoom-probe{height:0}
.arch-lab .arch-zoom-scroll{overflow-x:auto;overscroll-behavior-x:contain;padding:4px;min-width:0}
/* shared extras for this package: cell boards built from buttons, a status line that is never hidden under the
   sticky header after a programmatic scroll, and a compact step list */
.arch-lab .arch-board{display:grid;gap:0;justify-content:center;margin:auto}
.arch-lab .arch-cell{aspect-ratio:1;min-width:0;min-height:0;width:100%;padding:0;border-radius:0;background:var(--arch-surface);color:var(--arch-ink);border:1px solid var(--arch-grid);outline-offset:-3px;font-variant-numeric:tabular-nums}
.arch-lab .arch-result{scroll-margin-top:96px;scroll-margin-bottom:96px}
.arch-lab .arch-log{margin:0;padding-left:1.4em;display:grid;gap:4px;font-variant-numeric:tabular-nums}
.arch-lab .arch-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none;font-size:14px;color:var(--arch-ink)}
.arch-lab .arch-legend li{display:flex;align-items:center;gap:6px}

/* Same page presentation as the final 2023–2024 edition on main (GPT polish of 18.10.2026): the shared research
   renderer follows the current site on these pages only. Diagrams keep their light paper; controls and readouts
   follow the selected theme. */
[data-problem-id^="euler-"] .cf-figure figcaption,
[data-problem-id^="euler-"] .lesson-source{color:var(--ink-2)}
[data-problem-id^="euler-"] .lesson-source summary{color:var(--ink)}
[data-problem-id^="euler-"] :is(button[data-cf-zoom],button[data-cf-scene-zoom]){color:var(--ink);background:var(--play-stage);border-color:var(--ink-3);border-radius:999px;min-height:44px;padding:10px 16px;margin-top:12px;max-width:100%;line-height:1.4}
[data-problem-id^="euler-"] .interactive-actions button{color:var(--ink);background:var(--play-stage);border-color:var(--ink-3);font-size:16px}
[data-problem-id^="euler-"] .interactive-actions button[data-action=play]{color:var(--on-ink);background:var(--ink);border-color:var(--ink)}
[data-problem-id^="euler-"] .interactive-range-row{grid-template-columns:minmax(60px,1fr) 88px}
[data-problem-id^="euler-"] .cf-number{background:var(--play-stage);color:var(--ink);border-color:var(--ink-3);border-radius:12px;min-height:44px;height:auto;padding:8px 6px;font-size:18px;font-variant-numeric:tabular-nums}
[data-problem-id^="euler-"] .interactive-range-row input[type=range]{min-height:44px;accent-color:var(--accent)}
[data-problem-id^="euler-"] .interactive-results>div{background:var(--play-stage);border-color:var(--play-line);border-radius:14px;padding:14px 16px;font-size:16px}
[data-problem-id^="euler-"] .interactive-results :is(div,span,strong){color:var(--ink)}
[data-problem-id^="euler-"] .learning-interactive :is(button,input){scroll-margin-block:120px}
/* Keep diagrams readable as diagrams, without the inherited white text outline. */
[data-problem-id^="euler-"] :is(.cf-figure-svg,.cf-zoom-content) svg text{stroke:none;paint-order:normal}
[data-problem-id^="euler-"] .cf-figure figcaption button[data-cf-zoom]{display:block;margin:14px auto 0}
[data-problem-id^="euler-"] .arch-model-entry{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:20px 24px;margin:24px 0;border:1px solid var(--play-line);border-radius:var(--r-lg);background:var(--play-bg);color:var(--ink)}
[data-problem-id^="euler-"] .arch-model-entry>div{flex:1 1 240px;min-width:0}
[data-problem-id^="euler-"] .arch-model-entry strong{font-size:17px}
[data-problem-id^="euler-"] .arch-model-entry p{margin:5px 0 0;color:var(--ink-2);font-size:16px;line-height:1.5}
[data-problem-id^="euler-"] .arch-model-entry a{display:inline-flex;gap:12px;align-items:center;min-height:44px;padding:10px 16px;border:1px solid var(--ink-3);border-radius:999px;background:var(--play-stage);color:var(--ink);font:600 16px/1.4 var(--font);text-decoration:none}
[data-problem-id^="euler-"] .arch-model-entry a:hover{border-color:var(--accent);color:var(--accent)}
[data-problem-id^="euler-"] .arch-model-entry a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media(max-width:480px){[data-problem-id^="euler-"] .arch-model-entry{padding:16px}[data-problem-id^="euler-"] .arch-model-entry a{width:100%;justify-content:space-between}}

/* 2023/24 distance I, problem 1 «Семь камней» — lab labs/24d1-1-stones.mjs. Bars: blue = a weighing below 6 kg,
   red = not below 6 kg (the condition breaks), green = the total while the condition holds; everything else goes
   through --arch-* variables. Own colours are set for the light theme and both dark branches. */
.arch-lab{--arch-stones-bar:#60a5fa;--arch-stones-bar-edge:#1d4ed8;--arch-stones-bad:#fca5a5;--arch-stones-bad-edge:#b91c1c;--arch-stones-good:#86efac;--arch-stones-good-edge:#047857;--arch-stones-off:#cbd5e1;--arch-stones-off-edge:#64748b;--arch-stones-row-light:#fff7ed}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-stones-bar:#2563eb;--arch-stones-bar-edge:#93c5fd;--arch-stones-bad:#7f1d1d;--arch-stones-bad-edge:#fca5a5;--arch-stones-good:#14532d;--arch-stones-good-edge:#86efac;--arch-stones-off:#475569;--arch-stones-off-edge:#cbd5e1;--arch-stones-row-light:#3b2a12}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-stones-bar:#2563eb;--arch-stones-bar-edge:#93c5fd;--arch-stones-bad:#7f1d1d;--arch-stones-bad-edge:#fca5a5;--arch-stones-good:#14532d;--arch-stones-good-edge:#86efac;--arch-stones-off:#475569;--arch-stones-off-edge:#cbd5e1;--arch-stones-row-light:#3b2a12}
.arch-lab .arch-stones-predict{border-top:0;padding-top:0}
.arch-lab .arch-stones-predict .arch-label{margin:0}
/* the seven weights: label, slider, exact number */
.arch-lab .arch-stones-row{flex-wrap:nowrap;padding:2px 6px;border-radius:10px}
.arch-lab .arch-stones-name{flex:0 0 5.4em;font-weight:600;color:var(--arch-label)}
.arch-lab .arch-stones-row input[type=range]{flex:1 1 80px;min-width:60px}
.arch-lab .arch-stones-row input[type=number]{flex:0 0 88px}
.arch-lab .arch-stones-row[data-lightest=true]{background:var(--arch-stones-row-light)}
.arch-lab .arch-stones-row[data-lightest=true] .arch-stones-name::after{content:' · самый лёгкий';font-weight:400;font-size:12px;color:var(--arch-muted);display:block;line-height:1.1}
.arch-lab .arch-stones-row[data-bad=true] .arch-stones-name{color:var(--arch-bad)}
/* the bars */
.arch-lab .arch-stones-stage{padding:8px 10px}
.arch-lab .arch-stones-chart{--six:81%;--seven:94.6%;display:grid;gap:3px;font-variant-numeric:tabular-nums;min-width:0}
.arch-lab .arch-stones-brow{display:grid;grid-template-columns:6.6em minmax(60px,1fr) 4.8em;align-items:center;gap:8px;min-height:26px;padding:0 4px;border-radius:8px;color:var(--arch-ink);min-width:0;font-size:14px}
.arch-lab .arch-stones-head{min-height:22px;font-size:12px;color:var(--arch-muted);font-weight:600}
.arch-lab .arch-stones-head .arch-stones-rowname{overflow:visible}
.arch-lab .arch-stones-rowname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arch-lab .arch-stones-brow[data-heaviest=true] .arch-stones-rowname{font-weight:700}
.arch-lab .arch-stones-val{text-align:right;font-weight:700;white-space:nowrap}
.arch-lab .arch-stones-brow[data-state=bad] .arch-stones-val{color:var(--arch-bad)}
.arch-lab .arch-stones-brow[data-state=ok].arch-stones-total .arch-stones-val{color:var(--arch-good)}
.arch-lab .arch-stones-track{position:relative;height:18px;min-width:0}
.arch-lab .arch-stones-bar{position:absolute;left:0;top:3px;height:12px;border-radius:3px;background:var(--arch-stones-bar);border:1px solid var(--arch-stones-bar-edge);box-sizing:border-box;transition:width .2s}
.arch-lab .arch-stones-brow[data-state=bad] .arch-stones-bar{background:var(--arch-stones-bad);border-color:var(--arch-stones-bad-edge)}
.arch-lab .arch-stones-total .arch-stones-bar{background:var(--arch-stones-off);border-color:var(--arch-stones-off-edge)}
.arch-lab .arch-stones-total[data-state=ok] .arch-stones-bar{background:var(--arch-stones-good);border-color:var(--arch-stones-good-edge)}
.arch-lab .arch-stones-total[data-state=bad] .arch-stones-bar{background:var(--arch-stones-bad);border-color:var(--arch-stones-bad-edge)}
/* the dashed border line: at 6 kg on the weighings, at 7 kg on the total */
.arch-lab .arch-stones-line{position:absolute;left:var(--six);top:-4px;bottom:-4px;border-left:2px dashed var(--arch-ink);margin-left:-1px}
.arch-lab .arch-stones-total .arch-stones-line{left:var(--seven)}
.arch-lab .arch-stones-total{border-top:1px solid var(--arch-soft-line);padding-top:4px;margin-top:3px;font-weight:600}
.arch-lab .arch-stones-axis{position:relative;height:18px;min-width:0}
.arch-lab .arch-stones-tick{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:700;color:var(--arch-ink);line-height:18px}
.arch-lab .arch-stones-tick[data-tick="6"]{left:var(--six)}
.arch-lab .arch-stones-tick[data-tick="7"]{left:var(--seven)}
.arch-lab .arch-stones-sw{display:inline-block;width:18px;height:12px;border-radius:3px;box-sizing:border-box}
.arch-lab .arch-stones-sw[data-sw=ok]{background:var(--arch-stones-bar);border:1px solid var(--arch-stones-bar-edge)}
.arch-lab .arch-stones-sw[data-sw=bad]{background:var(--arch-stones-bad);border:1px solid var(--arch-stones-bad-edge)}
.arch-lab .arch-stones-sw[data-sw=line]{width:0;height:14px;border-left:2px dashed var(--arch-ink);border-radius:0}
.arch-lab .arch-stones-readouts{gap:4px 16px}
.arch-lab .arch-stones-readouts dd{white-space:normal}
/* the live region: one coarse sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-stones-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-stones-bar{transition:none}}
@media (max-width:420px){.arch-lab .arch-stones-brow{grid-template-columns:6.4em minmax(40px,1fr) 4.4em;gap:5px;padding:0 2px;font-size:13px}.arch-lab .arch-stones-name{flex-basis:5.3em;font-size:14px}.arch-lab .arch-stones-row input[type=number]{flex-basis:76px;width:76px;padding:8px 8px}.arch-lab .arch-stones-row{padding:2px 2px;gap:6px}}

/* 2023/24 distance round 1, problem 2 — lab labs/24d1-2-twenty.mjs («Собери свои 20 чисел»). The four group tints
   g0…g3 colour the good pairs of a group in the triangle and the chips of the chosen numbers (blue, yellow, green,
   violet — the tints of the solution figures); «miss» is a pair inside a group that is not good. Everything else goes
   through --arch-* variables. Dark values keep the hues. */
.arch-lab{--arch-twenty-g0:#dbeafe;--arch-twenty-g0-line:#60a5fa;--arch-twenty-g1:#fde68a;--arch-twenty-g1-line:#d97706;--arch-twenty-g2:#bbf7d0;--arch-twenty-g2-line:#34d399;--arch-twenty-g3:#ede9fe;--arch-twenty-g3-line:#a78bfa;--arch-twenty-miss:#f1f5f9}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-twenty-g0:#27325a;--arch-twenty-g0-line:#60a5fa;--arch-twenty-g1:#4a3b16;--arch-twenty-g1-line:#f59e0b;--arch-twenty-g2:#1a4130;--arch-twenty-g2-line:#34d399;--arch-twenty-g3:#3d2c5c;--arch-twenty-g3-line:#a78bfa;--arch-twenty-miss:#2b3240}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-twenty-g0:#27325a;--arch-twenty-g0-line:#60a5fa;--arch-twenty-g1:#4a3b16;--arch-twenty-g1-line:#f59e0b;--arch-twenty-g2:#1a4130;--arch-twenty-g2-line:#34d399;--arch-twenty-g3:#3d2c5c;--arch-twenty-g3-line:#a78bfa;--arch-twenty-miss:#2b3240}
.arch-lab .arch-twenty-predict{border-top:0;padding-top:0}
.arch-lab .arch-twenty-predict .arch-label{margin:0}
/* palette: groups of number cards, each card a toggle button ≥ 44 px */
.arch-lab .arch-twenty-palette{display:grid;gap:10px}
.arch-lab .arch-twenty-group{display:grid;gap:4px}
.arch-lab .arch-twenty-grouplabel{margin:0;font-size:14px}
.arch-lab .arch-twenty-cards{display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-twenty-card{min-width:52px;padding:8px 12px;font-variant-numeric:tabular-nums;background:var(--arch-surface);color:var(--arch-link);border:1px solid var(--arch-field-line)}
.arch-lab .arch-twenty-card[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:700;color:var(--arch-ink)}
.arch-lab .arch-twenty-card[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab .arch-twenty-own{flex:1 1 9em;width:9em;max-width:100%;font-variant-numeric:tabular-nums}
.arch-lab .arch-twenty-ownmsg{margin:0}
/* the chosen numbers: chips in the order of the groups, tinted like the triangle; a badge with the number of pairs */
.arch-lab .arch-twenty-chosen{display:flex;flex-wrap:wrap;gap:6px;min-height:44px;align-items:center}
.arch-lab .arch-twenty-chosen>p{margin:0}
.arch-lab .arch-twenty-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 8px 6px 12px;font-variant-numeric:tabular-nums;font-weight:600;color:var(--arch-ink);background:var(--arch-surface);border:1px solid var(--arch-soft-line);border-left:6px solid var(--tint,var(--arch-soft-line))}
.arch-lab .arch-twenty-chip[data-g="0"]{--tint:var(--arch-twenty-g0-line);background:var(--arch-twenty-g0)}
.arch-lab .arch-twenty-chip[data-g="1"]{--tint:var(--arch-twenty-g1-line);background:var(--arch-twenty-g1)}
.arch-lab .arch-twenty-chip[data-g="2"]{--tint:var(--arch-twenty-g2-line);background:var(--arch-twenty-g2)}
.arch-lab .arch-twenty-chip[data-g="3"]{--tint:var(--arch-twenty-g3-line);background:var(--arch-twenty-g3)}
.arch-lab .arch-twenty-chip[aria-pressed=true]{outline:3px solid var(--arch-accent);outline-offset:1px}
.arch-lab .arch-twenty-badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;border-radius:999px;background:var(--arch-surface);border:1px solid var(--arch-soft-line);font-size:13px;color:var(--arch-muted)}
.arch-lab .arch-twenty-remove[hidden]{display:none}
/* the triangle of pairs: an SVG picture that scales with the board; on narrow screens «Крупные клетки» widens it and
   the frame scrolls sideways (ui.mjs zoomable) */
.arch-lab .arch-twenty-stage{transition:border-color .3s}
.arch-lab .arch-twenty-stage.arch-twenty-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-twenty-board{--n:20;width:min(100%,calc(var(--n) * 44px + 90px));margin:0 auto}
.arch-lab .arch-zoomed .arch-twenty-board{width:max(100%,calc(var(--n) * 34px + 90px))}
.arch-lab .arch-stage .arch-twenty-svg{display:block;width:100%;height:auto;max-height:none;overflow:visible}
.arch-lab .arch-twenty-key{flex:none}
.arch-lab .arch-twenty-groups,.arch-lab .arch-twenty-sel{margin:6px 0}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-twenty-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-twenty-stage{transition:none}}
@media (max-width:480px){.arch-lab .arch-twenty-card{min-width:48px;padding:8px 10px}}

/* 2023–2024 distance I, problem 3 «Подбери форму треугольника» — lab labs/24d1-3-triangle.mjs. The two triangles
   AKM and CBK keep the tints of the solution figure (blue / yellow) in every theme; the segments KB and KM are the
   accent colour; everything else goes through --arch-* variables. */
.arch-lab{--arch-24d1-3-triangle-akm:rgba(37,99,235,.18);--arch-24d1-3-triangle-cbk:rgba(217,119,6,.22);--arch-24d1-3-triangle-akm-line:#1d4ed8;--arch-24d1-3-triangle-cbk-line:#b45309;--arch-24d1-3-triangle-handle:#fff;--arch-24d1-3-triangle-km:#7c3aed}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-24d1-3-triangle-akm:rgba(96,165,250,.26);--arch-24d1-3-triangle-cbk:rgba(251,191,36,.26);--arch-24d1-3-triangle-akm-line:#93c5fd;--arch-24d1-3-triangle-cbk-line:#fcd34d;--arch-24d1-3-triangle-handle:#1e293b;--arch-24d1-3-triangle-km:#c4b5fd}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-24d1-3-triangle-akm:rgba(96,165,250,.26);--arch-24d1-3-triangle-cbk:rgba(251,191,36,.26);--arch-24d1-3-triangle-akm-line:#93c5fd;--arch-24d1-3-triangle-cbk-line:#fcd34d;--arch-24d1-3-triangle-handle:#1e293b;--arch-24d1-3-triangle-km:#c4b5fd}
.arch-lab .arch-24d1-3-triangle-hyp{border-top:0;padding-top:0}
.arch-lab .arch-24d1-3-triangle-hyp .arch-label{margin:0}
.arch-lab .arch-24d1-3-triangle-ratio{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.arch-lab .arch-24d1-3-triangle-ratio input[type=number]{width:104px}
.arch-lab .arch-24d1-3-triangle-ratio .arch-24d1-3-triangle-unit{font-weight:600;color:var(--arch-label)}
.arch-lab .arch-24d1-3-triangle-stage{transition:border-color .3s;padding:4px}
.arch-lab .arch-24d1-3-triangle-stage.arch-24d1-3-triangle-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-stage .arch-24d1-3-triangle-svg{max-height:none;max-width:560px;margin:0 auto;overflow:visible;user-select:none;-webkit-user-select:none}
.arch-lab .arch-24d1-3-triangle-svg text{font-size:21px;font-weight:600;paint-order:stroke;stroke:var(--arch-surface);stroke-width:4px;stroke-linejoin:round}
.arch-lab .arch-24d1-3-triangle-svg .arch-24d1-3-triangle-deg{font-size:16px;font-weight:600}
.arch-lab .arch-24d1-3-triangle-handle{cursor:ew-resize;touch-action:none;outline:none}
.arch-lab .arch-24d1-3-triangle-handle:focus-visible .arch-24d1-3-triangle-ring{stroke:var(--arch-focus);stroke-width:4}
.arch-lab .arch-24d1-3-triangle-handle.arch-24d1-3-triangle-dragging .arch-24d1-3-triangle-dot{r:11}
.arch-lab .arch-24d1-3-triangle-key{flex:none}
.arch-lab .arch-24d1-3-triangle-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.arch-lab .arch-24d1-3-triangle-tri-btn[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-24d1-3-triangle-tri-btn[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab .arch-24d1-3-triangle-log li{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.arch-lab .arch-24d1-3-triangle-log .arch-chip[data-r="equal"]{background:var(--arch-ok-bg);border-color:var(--arch-good);color:var(--arch-good)}
.arch-lab .arch-24d1-3-triangle-log .arch-chip[data-r="longer"],.arch-lab .arch-24d1-3-triangle-log .arch-chip[data-r="shorter"]{background:var(--arch-bad-bg);border-color:var(--arch-bad);color:var(--arch-bad)}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-24d1-3-triangle-stage{transition:none}}
@media (max-width:480px){.arch-lab .arch-24d1-3-triangle-ratio{width:100%}.arch-lab .arch-24d1-3-triangle-ratio .arch-primary{flex:1 1 100%}}

/* 2023/24 distance round 1, problem 4 «Кубы против квадратов» — lab labs/24d1-4-cubes.mjs. The five numbers keep
   their own point colours (c0…c4) in both themes; everything else goes through --arch-* variables. */
.arch-lab{--arch-cubes-c0:#2563eb;--arch-cubes-c1:#d97706;--arch-cubes-c2:#dc2626;--arch-cubes-c3:#16a34a;--arch-cubes-c4:#7c3aed;--arch-cubes-neg:rgba(100,116,139,.16)}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-cubes-c0:#60a5fa;--arch-cubes-c1:#fbbf24;--arch-cubes-c2:#f87171;--arch-cubes-c3:#4ade80;--arch-cubes-c4:#a78bfa;--arch-cubes-neg:rgba(148,163,184,.16)}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-cubes-c0:#60a5fa;--arch-cubes-c1:#fbbf24;--arch-cubes-c2:#f87171;--arch-cubes-c3:#4ade80;--arch-cubes-c4:#a78bfa;--arch-cubes-neg:rgba(148,163,184,.16)}
.arch-lab .arch-cubes-predict{border-top:0;padding-top:0}
.arch-lab .arch-cubes-predict .arch-label{margin:0}
.arch-lab .arch-cubes-rows{display:grid;gap:4px}
.arch-lab .arch-cubes-row{display:grid;grid-template-columns:auto minmax(0,1fr) 104px;gap:8px;align-items:center;padding:2px 6px;border-radius:10px;min-width:0}
.arch-lab .arch-cubes-row[aria-current=true]{background:var(--arch-pressed-bg)}
.arch-lab .arch-cubes-row label{display:flex;align-items:center;gap:6px;min-width:4.8em;font-size:15px;white-space:nowrap}
.arch-lab .arch-cubes-sw{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--sw);border:1.5px solid var(--arch-fig-line);flex:none}
.arch-lab .arch-cubes-sw-neg{border-radius:3px;background:var(--arch-cubes-neg);border-color:var(--arch-grid)}
.arch-lab .arch-cubes-sw-ring{background:none;border:3px solid var(--arch-accent)}
.arch-lab .arch-cubes-row input[type=range]{flex:none;width:100%;min-width:0;accent-color:var(--sw)}
.arch-lab .arch-cubes-row input[type=number]{box-sizing:border-box;width:104px;max-width:100%;padding:8px 8px}
.arch-lab .arch-cubes-stage{transition:border-color .3s}
.arch-lab .arch-cubes-stage.arch-cubes-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-cubes-board{position:relative;min-width:0}
.arch-lab .arch-stage .arch-cubes-svg{display:block;width:100%;height:auto;max-height:none;touch-action:pan-y;cursor:crosshair;user-select:none;-webkit-user-select:none}
.arch-lab .arch-cubes-parts{list-style:none;margin:0;padding:0;display:grid;gap:4px 14px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));font-variant-numeric:tabular-nums;font-size:15px;color:var(--arch-ink)}
.arch-lab .arch-cubes-part{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;padding:3px 6px;border-radius:8px}
.arch-lab .arch-cubes-part[aria-current=true]{background:var(--arch-pressed-bg)}
.arch-lab .arch-cubes-plus{color:var(--arch-accent);font-weight:600}
.arch-lab .arch-cubes-minus{color:var(--arch-good);font-weight:600}
.arch-lab .arch-cubes-key{font-weight:600}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-cubes-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-cubes-stage{transition:none}}
@media (max-width:480px){
 .arch-lab .arch-cubes-row{grid-template-columns:minmax(0,1fr) 104px;gap:4px 8px}
 .arch-lab .arch-cubes-row input[type=range]{grid-column:1/-1;order:3}
}

/* 2023–2024 distance I, problem 5 — dominoes and crosses on n × n (labs/24d1-5-crosscut.mjs). The cells are buttons;
   the SVG on top of them (pointer-events: none) draws the pieces with the shared piece tints (--arch-piece-a dominoes,
   --arch-piece-b crosses). Own colour: the shaded («чёрные») cells of the chessboard colouring, set for the light theme
   and both dark branches; everything else goes through --arch-* tokens. */
.arch-lab .arch-crosscut{--arch-crosscut-dark:#b4bfcc}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab .arch-crosscut{--arch-crosscut-dark:#3f4654}}
:root[data-design="v2"][data-theme="dark"] .arch-lab .arch-crosscut{--arch-crosscut-dark:#3f4654}
.arch-lab .arch-crosscut-predict{border-top:0;padding-top:0}
.arch-lab .arch-crosscut-size input[type=range]{flex:1 1 120px}
.arch-lab .arch-crosscut-stage{padding:10px;transition:border-color .3s}
.arch-lab .arch-crosscut-stage.arch-crosscut-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board: row numbers | cells; column numbers on top */
.arch-lab .arch-crosscut-board{--n:6;display:grid;grid-template-columns:18px minmax(0,1fr);grid-template-rows:18px auto;width:min(100%,498px);margin:auto}
.arch-lab .arch-zoomed .arch-crosscut-board{width:calc(var(--n) * 48px + 18px);max-width:none}
.arch-lab .arch-crosscut-collabels{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));align-items:end;padding-bottom:2px}
.arch-lab .arch-crosscut-rowlabels{display:grid;grid-template-rows:repeat(var(--n),minmax(0,1fr))}
.arch-lab .arch-crosscut-collabels span,.arch-lab .arch-crosscut-rowlabels span{display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--arch-muted);font-variant-numeric:tabular-nums}
.arch-lab .arch-crosscut-field{position:relative;aspect-ratio:1}
.arch-lab .arch-crosscut-cells{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));grid-template-rows:repeat(var(--n),minmax(0,1fr));aspect-ratio:1;box-shadow:0 0 0 2px var(--arch-fig-line);background:var(--arch-surface)}
.arch-lab .arch-crosscut-cell{position:relative;min-width:0;min-height:0;width:100%;height:100%;padding:0;margin:0;border:0;box-shadow:inset -1px -1px 0 var(--arch-grid);border-radius:0;background:var(--arch-surface);color:var(--arch-ink);line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}
.arch-lab .arch-crosscut-cell.arch-crosscut-dark{background:var(--arch-crosscut-dark)}
@media (hover:hover){.arch-lab .arch-crosscut-cell:hover:not(.arch-crosscut-on){filter:brightness(.94)}}
.arch-lab .arch-crosscut-cell:focus-visible{outline:4px solid var(--arch-focus);outline-offset:-4px;z-index:2}
/* the preview of the next tap: green — the piece fits, red — these cells are busy or the piece leaves the board */
.arch-lab .arch-crosscut-cell.arch-crosscut-next{box-shadow:inset 0 0 0 4px var(--arch-good),inset -1px -1px 0 var(--arch-grid);z-index:1}
.arch-lab .arch-crosscut-cell.arch-crosscut-nope{box-shadow:inset 0 0 0 4px var(--arch-bad),inset -1px -1px 0 var(--arch-grid);z-index:1}
/* a cut-off cell: no piece can cover it any more */
.arch-lab .arch-crosscut-cell.arch-crosscut-dead{background-image:repeating-linear-gradient(45deg,var(--arch-bad-bg) 0 5px,transparent 5px 10px);box-shadow:inset 0 0 0 2px var(--arch-bad)}
.arch-lab .arch-stage .arch-crosscut-overlay{position:absolute;inset:0;width:100%;height:100%;max-height:none;pointer-events:none;overflow:visible}
.arch-lab .arch-crosscut-colour[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-crosscut-colour[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab .arch-crosscut-key{flex:none}
.arch-lab .arch-crosscut-colourtext{color:var(--arch-ink)}
.arch-lab .arch-crosscut-result .arch-readouts dd{white-space:normal}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-crosscut-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-crosscut-stage,.arch-lab .arch-crosscut-cell{transition:none}}

/* Euler 2023–2024, distance round 2, problem 1 «Что услышал журналист» — lab labs/24d2-1-journalist.mjs.
   Knights and liars keep the site tokens --arch-knight / --arch-liar for their ink; the seat fills, the table
   and the «stuck» frame are own variables with light and dark values (same theme selectors as lab.css). */
.arch-lab{--arch-journalist-k-bg:#dbeafe;--arch-journalist-l-bg:#ffe4e6;--arch-journalist-wood:#f4ecdf;--arch-journalist-wood-line:#c9b48e;--arch-journalist-fit-bg:#ecfdf5}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-journalist-k-bg:#1e3a8a;--arch-journalist-l-bg:#7f1d3a;--arch-journalist-wood:#34302a;--arch-journalist-wood-line:#7d6c52;--arch-journalist-fit-bg:#14341f}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-journalist-k-bg:#1e3a8a;--arch-journalist-l-bg:#7f1d3a;--arch-journalist-wood:#34302a;--arch-journalist-wood-line:#7d6c52;--arch-journalist-fit-bg:#14341f}
.arch-lab .arch-journalist-predict{border-top:0;padding-top:0}
.arch-lab .arch-journalist-predict .arch-label{margin:0}
.arch-lab .arch-journalist-size input[type=range]{flex:1 1 120px}
.arch-lab .arch-journalist-stage{transition:border-color .3s}
.arch-lab .arch-journalist-stage.arch-journalist-stuck{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board is square; its width follows the number of seats («big» keeps every seat 44 px, the zoom helper scrolls it) */
.arch-lab .arch-journalist-board{--big:260px;position:relative;width:min(100%,var(--big));aspect-ratio:1;margin:0 auto}
.arch-lab .arch-zoomed .arch-journalist-board{width:var(--big)}
.arch-lab .arch-stage .arch-journalist-svg{position:absolute;left:0;top:0;width:100%;height:100%;max-height:none;overflow:visible;pointer-events:none}
.arch-lab .arch-journalist-seat{position:absolute;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:0;min-height:0;padding:0;border-radius:50%;border:2px solid var(--arch-knight);background:var(--arch-journalist-k-bg);color:var(--arch-knight);line-height:1;font-weight:700;box-shadow:0 2px 4px rgba(15,23,42,.18)}
.arch-lab .arch-journalist-seat[data-kind="L"]{border-color:var(--arch-liar);background:var(--arch-journalist-l-bg);color:var(--arch-liar)}
.arch-lab .arch-journalist-seat.arch-journalist-last{box-shadow:0 0 0 3px var(--arch-accent),0 2px 4px rgba(15,23,42,.18)}
.arch-lab .arch-journalist-letter{font-size:1em}
.arch-lab .arch-journalist-num{font-size:.55em;font-weight:600;color:var(--arch-muted);font-variant-numeric:tabular-nums;margin-top:1px}
.arch-lab .arch-journalist-fresh circle{animation:arch-journalist-pulse .5s ease-out both}
@keyframes arch-journalist-pulse{from{stroke-width:5}to{stroke-width:2.4}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-journalist-fresh circle{animation:none}.arch-lab .arch-journalist-stage{transition:none}}
.arch-lab .arch-journalist-key{flex:none}
.arch-lab .arch-journalist-cands-btn[aria-pressed=true]{background:var(--arch-pressed-bg);color:var(--arch-link);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-journalist-note{color:var(--arch-ink);font-weight:600}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-journalist-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* candidates: two rows of letter chips */
.arch-lab .arch-journalist-cands{display:grid;gap:8px;border:1px solid var(--arch-soft-line);border-radius:14px;padding:12px 14px;background:var(--arch-surface)}
.arch-lab .arch-journalist-cands p{margin:0}
.arch-lab .arch-journalist-rows{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.arch-lab .arch-journalist-rows li{display:grid;gap:4px;padding:8px 10px;border-radius:10px;border:1px solid var(--arch-soft-line);color:var(--arch-ink);line-height:1.45}
.arch-lab .arch-journalist-rows li.arch-journalist-fit{background:var(--arch-journalist-fit-bg);border-color:var(--arch-good)}
.arch-lab .arch-journalist-rowhead{font-weight:600;color:var(--arch-label)}
.arch-lab .arch-journalist-chips{display:flex;flex-wrap:wrap;gap:3px}
.arch-lab .arch-journalist-chip{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--arch-knight);background:var(--arch-journalist-k-bg);color:var(--arch-knight);font-size:12px;font-weight:700;line-height:1}
.arch-lab .arch-journalist-chip[data-kind="L"]{border-color:var(--arch-liar);background:var(--arch-journalist-l-bg);color:var(--arch-liar)}
.arch-lab .arch-journalist-rowtail{font-size:15px}
.arch-lab .arch-journalist-nofit{color:var(--arch-muted)}
/* the log of n tried */
.arch-lab .arch-journalist-log{display:grid;gap:6px}
.arch-lab .arch-journalist-log:empty{display:none}
.arch-lab .arch-journalist-log p{margin:0}
.arch-lab .arch-journalist-tried{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-journalist-tried li{padding:3px 10px;border-radius:999px;border:1px solid var(--arch-soft-line);color:var(--arch-ink);font-variant-numeric:tabular-nums;font-size:15px}
.arch-lab .arch-journalist-tried li.arch-journalist-tried-yes{border-color:var(--arch-good);background:var(--arch-journalist-fit-bg);font-weight:600}
@media (max-width:480px){.arch-lab .arch-journalist-cands-btn{flex:1 1 100%}}

/* 2023–2024 distance round II, problem 2 «Стёртые две цифры» — lab labs/24d2-2-erase.mjs. The two erased digits keep
   one object colour in both themes (the orange of the solution figures); everything else goes through --arch-* variables. */
.arch-lab{--arch-erase-cut-bg:#fed7aa;--arch-erase-cut-ink:#9a3412}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-erase-cut-bg:#5a2d0c;--arch-erase-cut-ink:#fdba74}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-erase-cut-bg:#5a2d0c;--arch-erase-cut-ink:#fdba74}
.arch-lab .arch-erase-predict{border-top:0;padding-top:0}
.arch-lab .arch-erase-predict .arch-label{margin:0}
.arch-lab .arch-erase-stage{display:grid;gap:12px;min-width:0}
.arch-lab .arch-erase-stage[hidden]{display:none}
/* the number as digit tiles: the two last ones in a dashed orange frame with the label «стираем» under it */
.arch-lab .arch-erase-tiles{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:4px 4px 20px;font-variant-numeric:tabular-nums}
.arch-lab .arch-erase-group{display:inline-flex;flex-wrap:wrap;align-items:center;gap:3px;min-width:0}
.arch-lab .arch-erase-d{display:inline-flex;align-items:center;justify-content:center;width:26px;height:36px;border:1px solid var(--arch-field-line);border-radius:6px;background:var(--arch-surface);color:var(--arch-ink);font-size:20px;font-weight:700;line-height:1}
.arch-lab .arch-erase-cut{display:inline-flex;gap:3px;position:relative;margin-left:5px;padding:3px;border:2px dashed var(--arch-accent);border-radius:8px}
.arch-lab .arch-erase-cut::after{content:attr(data-label);position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:2px;font-size:12px;font-weight:600;color:var(--arch-erase-cut-ink);white-space:nowrap}
.arch-lab .arch-erase-dcut{background:var(--arch-erase-cut-bg);color:var(--arch-erase-cut-ink);text-decoration:line-through;text-decoration-thickness:2px}
.arch-lab .arch-erase-arrow{font-size:22px;color:var(--arch-muted)}
.arch-lab .arch-erase-rest{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:6px;color:var(--arch-ink);min-width:0;overflow-wrap:anywhere}
.arch-lab .arch-erase-rest b{font-size:20px;font-weight:700}
.arch-lab .arch-erase-restlabel{font-size:14px;color:var(--arch-muted)}
.arch-lab .arch-erase-eq{margin:0;display:flex;flex-wrap:wrap;gap:4px 20px;font-size:17px;color:var(--arch-ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
/* the number line of sums (drawn at 1:1 from the measured width) */
.arch-lab .arch-erase-striphost{position:relative;width:100%;min-width:0}
.arch-lab .arch-stage .arch-erase-strip{display:block;width:100%;height:auto;max-height:none;overflow:visible}
.arch-lab .arch-erase-flash{animation:arch-erase-flash .6s ease-out 2}
@keyframes arch-erase-flash{0%,100%{opacity:1}50%{opacity:.2}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-erase-flash{animation:none}}
.arch-lab .arch-erase-play{min-width:11.5em}
.arch-lab .arch-erase-step{min-width:64px;font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-erase-key{flex:none}
.arch-lab .arch-erase-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.arch-lab .arch-erase-chip{display:inline-block;padding:2px 10px;border-radius:999px;border:1px solid var(--arch-bad);background:var(--arch-bad-bg);color:var(--arch-ink);font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-erase-big{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;line-height:1.5;color:var(--arch-ink);overflow-wrap:anywhere;word-break:break-all;margin:6px 0}
.arch-lab .arch-erase-big .arch-help{font-family:inherit}
.arch-lab #arch-erase-n,.arch-lab #arch-erase-t{flex:1 1 12em;width:12em;max-width:100%}
/* the live region: one changed sentence for screen readers; the visible result boxes stay quiet */
.arch-lab .arch-erase-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:480px){.arch-lab .arch-erase-play{flex:1 1 100%;min-width:0}}

/* 2023–2024 distance round 2, problem 3 «Точка за основанием» — lab labs/24d2-3-apex.mjs. The compared segments keep
   their object colours in both themes (KL blue, LC orange, the laid-off equal segments KA/LB/AD green, KD violet);
   the shaded triangles of the solution are translucent so the lines stay visible. Everything else goes through
   the --arch-* variables of lab.css. */
.arch-lab{--arch-apex-kl:#2563eb;--arch-apex-lc:#c2410c;--arch-apex-eq:#047857;--arch-apex-kd:#7c3aed;--arch-apex-handle:#244974;--arch-apex-tri-a:rgba(59,130,246,.2);--arch-apex-tri-b:rgba(245,158,11,.26)}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-apex-kl:#93c5fd;--arch-apex-lc:#fdba74;--arch-apex-eq:#6ee7b7;--arch-apex-kd:#c4b5fd;--arch-apex-handle:#fbbf24;--arch-apex-tri-a:rgba(96,165,250,.28);--arch-apex-tri-b:rgba(251,191,36,.3)}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-apex-kl:#93c5fd;--arch-apex-lc:#fdba74;--arch-apex-eq:#6ee7b7;--arch-apex-kd:#c4b5fd;--arch-apex-handle:#fbbf24;--arch-apex-tri-a:rgba(96,165,250,.28);--arch-apex-tri-b:rgba(251,191,36,.3)}
.arch-lab .arch-apex-predict{border-top:0;padding-top:0}
.arch-lab .arch-apex-predict .arch-label{margin:0}
.arch-lab .arch-apex-size input[type=range]{flex:1 1 120px}
.arch-lab .arch-apex-stage{transition:border-color .3s}
.arch-lab .arch-apex-stage.arch-apex-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-apex-stage.arch-apex-example{border-style:dashed}
.arch-lab .arch-apex-stage .arch-apex-svg{max-height:none;user-select:none;-webkit-user-select:none}
/* «Крупные клетки» on a phone: the figure keeps its full size (1 svg unit = 1 px) and scrolls sideways in the frame */
.arch-lab .arch-zoomed .arch-apex-svg{width:520px;max-width:none}
.arch-lab .arch-apex-svg text{font-weight:600;paint-order:stroke;stroke:var(--arch-surface);stroke-width:3px;stroke-linejoin:round}
.arch-lab .arch-apex-handle{cursor:grab;touch-action:none}
.arch-lab .arch-apex-dragging .arch-apex-handle{cursor:grabbing}
.arch-lab .arch-apex-aux-btn[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-apex-aux-btn[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab .arch-apex-key{flex:none}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-apex-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-apex-stage{transition:none}}

/* Popov Academy — 2023/24 distance round 2, problem 4 «Три бегуна на кольце» (labs/24d2-4-laps.mjs).
   The runners keep their object colours in both themes (Petya blue, Vasya amber, Kolya green; white letters on them,
   contrast ≥ 4.5:1); the track and everything else go through --arch-* variables. */
.arch-lab{--arch-laps-petya:#2563eb;--arch-laps-vasya:#b45309;--arch-laps-kolya:#047857;--arch-laps-track:#f3ebdd;--arch-laps-lane:#d6c9b3;--arch-laps-ring:#c2410c}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-laps-petya:#3b82f6;--arch-laps-vasya:#c2620c;--arch-laps-kolya:#059669;--arch-laps-track:#3b3428;--arch-laps-lane:#6b5f4a;--arch-laps-ring:#fb923c}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-laps-petya:#3b82f6;--arch-laps-vasya:#c2620c;--arch-laps-kolya:#059669;--arch-laps-track:#3b3428;--arch-laps-lane:#6b5f4a;--arch-laps-ring:#fb923c}
.arch-lab .arch-laps-block{display:grid;gap:8px;min-width:0}
.arch-lab .arch-laps-block>.arch-label{margin:0}
.arch-lab .arch-laps-err:empty{display:none}
/* speeds */
.arch-lab .arch-laps-speed{display:grid;gap:4px;min-width:0}
.arch-lab .arch-laps-speed label{display:flex;align-items:center;gap:6px}
.arch-lab .arch-laps-srow{flex-wrap:nowrap}
.arch-lab .arch-laps-srow input[type=range]{flex:1 1 100px}
.arch-lab .arch-laps-srow input[type=text]{flex:0 0 76px;width:76px;text-align:center;font-variant-numeric:tabular-nums}
.arch-lab .arch-laps-unit{flex:none;font-size:14px;color:var(--arch-muted)}
.arch-lab .arch-laps-sw{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;color:#fff;font-size:12px;font-weight:700;flex-shrink:0}
.arch-lab .arch-laps-sw-petya{background:var(--arch-laps-petya)}
.arch-lab .arch-laps-sw-vasya{background:var(--arch-laps-vasya)}
.arch-lab .arch-laps-sw-kolya{background:var(--arch-laps-kolya)}
/* the track */
.arch-lab .arch-laps-scene{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:center;padding:12px}
@media (min-width:640px){.arch-lab .arch-laps-scene{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px}}
.arch-lab .arch-laps-wheel svg{max-width:340px;margin:0 auto;overflow:visible}
.arch-lab .arch-laps-track{fill:none;stroke:var(--arch-laps-track)}
.arch-lab .arch-laps-lanes circle{fill:none;stroke:var(--arch-laps-lane);stroke-width:1;stroke-dasharray:3 4}
.arch-lab .arch-laps-start{stroke:var(--arch-fig-line);stroke-width:3;stroke-linecap:round}
.arch-lab .arch-laps-dir{fill:none;stroke:var(--arch-accent);stroke-width:2.5;stroke-linecap:round}
.arch-lab .arch-laps-head{fill:var(--arch-accent);stroke:none}
.arch-lab svg text.arch-laps-label{fill:var(--arch-muted)}
.arch-lab svg text.arch-laps-clock{font-variant-numeric:tabular-nums}
.arch-lab .arch-laps-runner circle:not(.arch-laps-ring){stroke:#fff;stroke-width:2}
.arch-lab .arch-laps-runner-petya circle:not(.arch-laps-ring){fill:var(--arch-laps-petya)}
.arch-lab .arch-laps-runner-vasya circle:not(.arch-laps-ring){fill:var(--arch-laps-vasya)}
.arch-lab .arch-laps-runner-kolya circle:not(.arch-laps-ring){fill:var(--arch-laps-kolya)}
.arch-lab svg .arch-laps-runner text{fill:#fff;font-weight:700}
.arch-lab .arch-laps-ring{fill:none;stroke:var(--arch-laps-ring);stroke-width:3}
/* readouts */
.arch-lab .arch-laps-side{display:grid;gap:10px;min-width:0}
.arch-lab .arch-laps-now{display:grid;gap:8px;margin:0}
.arch-lab .arch-laps-nowrow{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:baseline;padding:6px 10px;border-radius:10px;border:1px solid var(--arch-soft-line);background:var(--arch-surface)}
.arch-lab .arch-laps-nowrow dt{display:flex;align-items:center;gap:6px;font-weight:600;color:var(--arch-label)}
.arch-lab .arch-laps-nowrow dd{margin:0;font-variant-numeric:tabular-nums}
.arch-lab .arch-laps-laps{font-size:22px;line-height:1.15;font-weight:700;color:var(--arch-ink)}
.arch-lab .arch-laps-sub{grid-column:2;font-size:14px;color:var(--arch-muted)}
/* the strip of overtakings under the time slider */
.arch-lab .arch-laps-stripbox{position:relative;height:74px;margin:0 8px}
.arch-lab .arch-laps-strip{position:absolute;left:0;right:0;top:8px;height:2px;background:var(--arch-field-line)}
.arch-lab .arch-laps-mark{position:absolute;top:-6px;width:0;height:0}
.arch-lab .arch-laps-tick{position:absolute;left:-2px;top:0;width:4px;height:14px;border-radius:2px;background:var(--arch-ink)}
.arch-lab .arch-laps-mark-petya .arch-laps-tick{background:var(--arch-laps-petya)}
.arch-lab .arch-laps-mark-kolya .arch-laps-tick{background:var(--arch-laps-kolya)}
.arch-lab .arch-laps-mark-bad .arch-laps-tick{background:var(--arch-bad)}
.arch-lab .arch-laps-mark-end .arch-laps-tick{background:var(--arch-muted);height:18px;top:-2px}
.arch-lab .arch-laps-marklabel{position:absolute;left:0;top:calc(16px + var(--i,0) * 16px);transform:translateX(-50%);white-space:nowrap;font-size:13px;font-weight:600;color:var(--arch-ink);font-variant-numeric:tabular-nums}
.arch-lab .arch-laps-mark-end .arch-laps-marklabel{transform:translateX(-100%);top:52px;color:var(--arch-muted);font-weight:400}
.arch-lab .arch-laps-cursor{position:absolute;top:0;width:2px;height:18px;margin-left:-1px;background:var(--arch-accent);border-radius:1px}
/* readouts of the verdict: long values wrap, the names never break into letters */
.arch-lab .arch-laps-readouts div{flex-wrap:wrap}
.arch-lab .arch-laps-readouts dt{flex:none;white-space:nowrap}
.arch-lab .arch-laps-readouts dd{white-space:normal;overflow-wrap:anywhere}
/* the log of overtakings */
.arch-lab .arch-laps-log{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:15px;line-height:1.45}
.arch-lab .arch-laps-ev{display:flex;gap:8px;align-items:flex-start;color:var(--arch-muted)}
.arch-lab .arch-laps-ev.arch-laps-passed{color:var(--arch-ink);font-weight:600}
.arch-lab .arch-laps-ev-out{font-style:italic}
.arch-lab .arch-laps-dot{flex:none;width:12px;height:12px;margin-top:.35em;border-radius:50%;background:var(--arch-field-line)}
.arch-lab .arch-laps-ev-petya .arch-laps-dot{background:var(--arch-laps-petya)}
.arch-lab .arch-laps-ev-kolya .arch-laps-dot{background:var(--arch-laps-kolya)}
.arch-lab .arch-laps-ev:not(.arch-laps-passed) .arch-laps-dot{opacity:.45}
@media (max-width:480px){.arch-lab .arch-laps-scene{padding:8px}.arch-lab .arch-laps-laps{font-size:20px}.arch-lab .arch-laps-marklabel{font-size:12px}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-laps-cursor{transition:none}}

/* 2023/24 distance round 2, problem 5 «Невидимая клетка» — lab labs/24d2-5-search.mjs. Colours only through --arch-*
   variables; the lab's own colours have light and dark values (both dark selectors, as in lab.css): suspects are
   light blue, excluded cells grey with a muted dot, the found cell green, the chosen cell has a blue ring,
   the previewed window a dashed orange outline, the last question a solid outline (green «да», red «нет»). */
.arch-lab{--arch-search-cand:#dbeafe;--arch-search-cand-ink:#1f2937;--arch-search-out:#eef2f7;--arch-search-out-ink:#94a3b8;--arch-search-found:#bbf7d0;--arch-search-found-ink:#14532d;--arch-search-anchor:#244974;--arch-search-label:#5b6b82;--arch-search-line:#94a3b8}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-search-cand:#1e3a5f;--arch-search-cand-ink:#e5edf7;--arch-search-out:#262c38;--arch-search-out-ink:#6b7688;--arch-search-found:#166534;--arch-search-found-ink:#dcfce7;--arch-search-anchor:#8fb0ff;--arch-search-label:#aab6c8;--arch-search-line:#64748b}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-search-cand:#1e3a5f;--arch-search-cand-ink:#e5edf7;--arch-search-out:#262c38;--arch-search-out-ink:#6b7688;--arch-search-found:#166534;--arch-search-found-ink:#dcfce7;--arch-search-anchor:#8fb0ff;--arch-search-label:#aab6c8;--arch-search-line:#64748b}
.arch-lab .arch-search-predict{border-top:0;padding-top:0}
.arch-lab .arch-search-predict .arch-label{margin:0}
.arch-lab .arch-search-predict input[type=number]{width:96px}
/* board: a label row, then a label column beside the 5×5 cells; the overlay SVG draws windows over the cells */
.arch-lab .arch-search-stage{display:grid;gap:8px;justify-items:center}
.arch-lab .arch-search-frame{--arch-search-lbl:22px;--arch-search-size:min(100%,calc(5 * 64px + var(--arch-search-lbl)));width:var(--arch-search-size);max-width:100%;display:grid;grid-template-columns:var(--arch-search-lbl) minmax(0,1fr);grid-template-rows:var(--arch-search-lbl) auto;gap:0}
.arch-lab .arch-search-corner{grid-column:1;grid-row:1}
.arch-lab .arch-search-cols{grid-column:2;grid-row:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.arch-lab .arch-search-rows{grid-column:1;grid-row:2;display:grid;grid-template-rows:repeat(5,minmax(0,1fr))}
.arch-lab .arch-search-lbl{display:grid;place-items:center;font-size:13px;font-weight:600;color:var(--arch-search-label);font-variant-numeric:tabular-nums;line-height:1}
.arch-lab .arch-search-cells{grid-column:2;grid-row:2;position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));aspect-ratio:1;border:2px solid var(--arch-search-line);background:var(--arch-surface)}
.arch-lab .arch-search-cell{position:relative;aspect-ratio:1;min-width:0;min-height:0;width:100%;height:auto;padding:0;border-radius:0;border:1px solid var(--arch-grid);background:var(--arch-search-cand);color:var(--arch-search-cand-ink);display:grid;place-items:center;font-size:17px;line-height:1;font-weight:600;outline-offset:-4px;transition:background-color .2s}
.arch-lab .arch-search-cell[data-state="out"]{background:var(--arch-search-out);color:var(--arch-search-out-ink);font-weight:400}
.arch-lab .arch-search-cell[data-state="found"]{background:var(--arch-search-found);color:var(--arch-search-found-ink);font-size:22px}
.arch-lab .arch-search-cell[aria-pressed="true"]{box-shadow:inset 0 0 0 4px var(--arch-search-anchor),inset 0 0 0 6px var(--arch-surface)}
[data-design] .arch-lab .arch-search-cells .arch-search-cell:is(:focus-visible,:focus){outline-offset:-2px;z-index:3}
.arch-lab .arch-search-overlay{position:absolute;inset:0;width:100%;height:100%;max-height:none;overflow:visible;pointer-events:none;z-index:2}
.arch-lab .arch-search-stage .arch-search-overlay{display:block}
.arch-lab .arch-search-board-help{text-align:center}
/* chooser of the windows through the chosen cell */
.arch-lab .arch-search-chooser{display:grid;gap:8px}
.arch-lab .arch-search-chooser[hidden]{display:none}
.arch-lab .arch-search-chooser .arch-actions button{text-align:left}
/* legend keys */
.arch-lab .arch-search-key{display:inline-block;width:20px;height:20px;flex:0 0 auto;border-radius:4px;border:1px solid var(--arch-grid);box-sizing:border-box}
.arch-lab .arch-search-key-cand{background:var(--arch-search-cand)}
.arch-lab .arch-search-key-out{background:var(--arch-search-out)}
.arch-lab .arch-search-key-found{background:var(--arch-search-found)}
.arch-lab .arch-search-key-anchor{background:var(--arch-surface);box-shadow:inset 0 0 0 3px var(--arch-search-anchor)}
.arch-lab .arch-search-key-preview{border:2px dashed var(--arch-accent);background:transparent}
.arch-lab .arch-search-key-yes{border:2px solid var(--arch-good);background:transparent}
.arch-lab .arch-search-key-no{border:2px solid var(--arch-bad);background:transparent}
/* the walkthrough banner */
.arch-lab .arch-search-example{border:1px solid var(--arch-pressed-line);background:var(--arch-pressed-bg);border-radius:14px;padding:12px 14px;display:grid;gap:8px}
.arch-lab .arch-search-example[hidden]{display:none}
.arch-lab .arch-search-example p{margin:0}
.arch-lab .arch-search-log{font-size:15px}
.arch-lab .arch-search-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-search-cell{transition:none}}

/* Popov Academy — 2023/24 distance round 3, problem 1 «Мотоциклист три часа в пути» (labs/24d3-1-ride.mjs).
   Own colours: the road (asphalt), the motorcycle and the ride line keep their object colours in both themes (white
   letter on the motorcycle, contrast ≥ 4.5:1); the shaded second hour is a soft tint; everything else goes through
   --arch-* variables. Own colours are set for the light theme and both dark branches. */
.arch-lab{--arch-ride-road:#e7e5e4;--arch-ride-road-line:#a8a29e;--arch-ride-bike:#1d4ed8;--arch-ride-bike-stand:#64748b;--arch-ride-line:#2563eb;--arch-ride-overlap:#fef3c7;--arch-ride-overlap-zero:#dcfce7}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-ride-road:#3f3f46;--arch-ride-road-line:#71717a;--arch-ride-bike:#3b82f6;--arch-ride-bike-stand:#94a3b8;--arch-ride-line:#60a5fa;--arch-ride-overlap:#4a3b16;--arch-ride-overlap-zero:#14341f}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-ride-road:#3f3f46;--arch-ride-road-line:#71717a;--arch-ride-bike:#3b82f6;--arch-ride-bike-stand:#94a3b8;--arch-ride-line:#60a5fa;--arch-ride-overlap:#4a3b16;--arch-ride-overlap-zero:#14341f}
.arch-lab .arch-ride-predict{border-top:0;padding-top:0}
.arch-lab .arch-ride-predict .arch-label{margin:0}
.arch-lab .arch-ride-block{display:grid;gap:8px;min-width:0}
.arch-lab .arch-ride-block>.arch-label{margin:0}
.arch-lab .arch-ride-err:empty{display:none}
/* the three speeds: label, slider, exact number, unit, kilometres of the hour */
.arch-lab .arch-ride-speed{display:grid;gap:4px;min-width:0;padding:4px 8px;border-radius:10px}
.arch-lab .arch-ride-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.arch-lab .arch-ride-speed label{display:flex;align-items:center;gap:6px}
.arch-lab .arch-ride-srow{flex-wrap:nowrap}
.arch-lab .arch-ride-srow input[type=range]{flex:1 1 90px}
.arch-lab .arch-ride-srow input[type=text]{flex:0 0 72px;width:72px;min-width:64px;text-align:center;font-variant-numeric:tabular-nums}
.arch-lab .arch-ride-unit{flex:none;font-size:14px;color:var(--arch-muted)}
.arch-lab .arch-ride-km{flex:none;font-weight:600;color:var(--arch-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.arch-lab .arch-ride-standing-row{background:var(--arch-ride-overlap-zero)}
.arch-lab .arch-ride-standing-row .arch-ride-km::after{content:' · стоит';font-weight:400;color:var(--arch-muted);font-size:13px}
.arch-lab .arch-ride-sw{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--arch-ride-bike);color:#fff;font-size:12px;font-weight:700;flex-shrink:0}
/* the stage: road + graph on the left, the shared clock on the right */
.arch-lab .arch-ride-scene{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:center;padding:12px}
@media (min-width:640px){.arch-lab .arch-ride-scene{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:20px}}
.arch-lab .arch-ride-graph svg{max-width:420px;margin:0 auto;overflow:visible}
.arch-lab .arch-ride-road{fill:var(--arch-ride-road);stroke:none}
.arch-lab .arch-ride-road-line{stroke:var(--arch-ride-road-line);stroke-width:1.5;stroke-dasharray:6 5}
.arch-lab .arch-ride-ticks line{stroke:var(--arch-fig-line);stroke-width:1}
.arch-lab svg text.arch-ride-label{fill:var(--arch-muted)}
.arch-lab .arch-ride-overlap{fill:var(--arch-ride-overlap);stroke:none;transition:fill .3s}
.arch-lab .arch-ride-overlap-zero{fill:var(--arch-ride-overlap-zero)}
.arch-lab .arch-ride-grid line{stroke:var(--arch-grid);stroke-width:1;stroke-dasharray:3 4}
.arch-lab .arch-ride-axis{stroke:var(--arch-fig-line);stroke-width:1.5}
.arch-lab .arch-ride-path{fill:none;stroke:var(--arch-ride-line);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.arch-lab .arch-ride-dots circle{fill:var(--arch-surface);stroke:var(--arch-ride-line);stroke-width:2}
.arch-lab svg text.arch-ride-cum{fill:var(--arch-ink)}
.arch-lab .arch-ride-guide{stroke:var(--arch-accent);stroke-width:1;stroke-dasharray:3 3}
.arch-lab .arch-ride-dot{fill:var(--arch-accent);stroke:var(--arch-surface);stroke-width:2}
.arch-lab .arch-ride-bike circle{fill:var(--arch-ride-bike);stroke:#fff;stroke-width:2}
.arch-lab .arch-ride-bike.arch-ride-standing circle{fill:var(--arch-ride-bike-stand)}
.arch-lab svg .arch-ride-bike text{fill:#fff}
.arch-lab .arch-ride-bracket{fill:none;stroke-width:2}
.arch-lab .arch-ride-br-ok{stroke:var(--arch-good)}
.arch-lab .arch-ride-br-bad{stroke:var(--arch-bad)}
.arch-lab svg text.arch-ride-brlabel{stroke:none}
.arch-lab svg text.arch-ride-br-ok{fill:var(--arch-good)}
.arch-lab svg text.arch-ride-br-bad{fill:var(--arch-bad)}
/* the shared clock */
.arch-lab .arch-ride-side{display:grid;gap:10px;min-width:0}
.arch-lab .arch-ride-now{display:grid;gap:8px;margin:0}
.arch-lab .arch-ride-now>div{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:baseline;padding:6px 10px;border-radius:10px;border:1px solid var(--arch-soft-line);background:var(--arch-surface)}
.arch-lab .arch-ride-now dt{font-weight:600;color:var(--arch-label);white-space:nowrap}
.arch-lab .arch-ride-now dd{margin:0;font-variant-numeric:tabular-nums;color:var(--arch-ink)}
.arch-lab .arch-ride-clock,.arch-lab .arch-ride-big{font-size:22px;line-height:1.15;font-weight:700}
/* readouts of the verdict: long values wrap */
.arch-lab .arch-ride-readouts div{flex-wrap:wrap}
.arch-lab .arch-ride-readouts dt{flex:none;white-space:nowrap}
.arch-lab .arch-ride-readouts dd{white-space:normal;overflow-wrap:anywhere}
/* the live region: one coarse sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-ride-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:480px){.arch-lab .arch-ride-scene{padding:8px}.arch-lab .arch-ride-clock,.arch-lab .arch-ride-big{font-size:20px}.arch-lab .arch-ride-srow input[type=text]{flex-basis:64px;width:64px;padding:8px 6px}.arch-lab .arch-ride-speed{padding:4px 4px}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-ride-overlap{transition:none}}

/* 2023/24 distance round 3, problem 2 «Куб суммы двух чисел» — lab labs/24d3-2-mirror.mjs. The three numbers keep
   their own point colours (c0…c2, white letters on them) in both themes; everything else goes through --arch-* variables. */
.arch-lab{--arch-mirror-c0:#2563eb;--arch-mirror-c1:#c2410c;--arch-mirror-c2:#7c3aed}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-mirror-c0:#3b82f6;--arch-mirror-c1:#ea580c;--arch-mirror-c2:#8b5cf6}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-mirror-c0:#3b82f6;--arch-mirror-c1:#ea580c;--arch-mirror-c2:#8b5cf6}
.arch-lab .arch-mirror-predict{border-top:0;padding-top:0}
.arch-lab .arch-mirror-predict .arch-label{margin:0}
.arch-lab .arch-mirror-rows{display:grid;gap:4px}
.arch-lab .arch-mirror-row{display:grid;grid-template-columns:auto minmax(0,1fr) 104px;gap:8px;align-items:center;padding:2px 6px;border-radius:10px;min-width:0}
.arch-lab .arch-mirror-row[aria-current=true]{background:var(--arch-pressed-bg)}
.arch-lab .arch-mirror-row label{display:flex;align-items:center;gap:6px;min-width:4.6em;font-size:15px;white-space:nowrap}
.arch-lab .arch-mirror-sw{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--sw);border:1.5px solid var(--arch-fig-line);flex:none}
.arch-lab .arch-mirror-sw-good{border-radius:3px;width:22px;height:0;border:0;border-top:3px solid var(--arch-good)}
.arch-lab .arch-mirror-sw-bad{border-radius:0;width:22px;height:0;border:0;border-top:2px dashed var(--arch-bad)}
.arch-lab .arch-mirror-sw-axis{border-radius:0;width:0;height:16px;border:0;border-left:2px dashed var(--arch-accent)}
.arch-lab .arch-mirror-sw-ring{background:none;border:3px solid var(--arch-accent)}
.arch-lab .arch-mirror-row input[type=range]{flex:none;width:100%;min-width:0;accent-color:var(--sw)}
.arch-lab .arch-mirror-row input[type=number]{box-sizing:border-box;width:104px;max-width:100%;padding:8px 8px}
.arch-lab .arch-mirror-stage{transition:border-color .3s}
.arch-lab .arch-mirror-stage.arch-mirror-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-mirror-board{position:relative;min-width:0}
.arch-lab .arch-stage .arch-mirror-svg{display:block;width:100%;height:auto;max-height:none;touch-action:pan-y;cursor:crosshair;user-select:none;-webkit-user-select:none}
.arch-lab .arch-mirror-pairs{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));font-variant-numeric:tabular-nums}
.arch-lab .arch-mirror-pair{border:1px solid var(--arch-soft-line);border-left:5px solid var(--arch-bad);border-radius:12px;padding:10px 12px;font-size:15px;color:var(--arch-ink);min-width:0;overflow-wrap:anywhere}
.arch-lab .arch-mirror-pair[data-ok=true]{border-left-color:var(--arch-good)}
.arch-lab .arch-mirror-pair p{margin:3px 0}
.arch-lab .arch-mirror-pair-title{font-weight:700;color:var(--arch-label)}
.arch-lab .arch-mirror-gap{color:var(--arch-muted)}
.arch-lab .arch-mirror-fixes{margin-top:6px}
.arch-lab .arch-mirror-key{font-weight:600}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-mirror-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-mirror-stage{transition:none}}
@media (max-width:480px){
 .arch-lab .arch-mirror-row{grid-template-columns:minmax(0,1fr) 104px;gap:4px 8px}
 .arch-lab .arch-mirror-row input[type=range]{grid-column:1/-1;order:3}
}

/* 2023–2024 distance round III, problem 3 «12345 много раз подряд» — lab labs/24d3-3-repeat.mjs. The blocks «12345»
   keep one object colour in both themes (the blue of the solution figures); everything else goes through --arch-* variables. */
.arch-lab{--arch-repeat-block-bg:#dbeafe;--arch-repeat-block-line:#1f2937;--arch-repeat-new-bg:#fed7aa}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-repeat-block-bg:#1e3a5f;--arch-repeat-block-line:#93c5fd;--arch-repeat-new-bg:#5a2d0c}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-repeat-block-bg:#1e3a5f;--arch-repeat-block-line:#93c5fd;--arch-repeat-new-bg:#5a2d0c}
.arch-lab .arch-repeat-predict{border-top:0;padding-top:0}
.arch-lab .arch-repeat-predict .arch-label{margin:0}
.arch-lab .arch-repeat-stage{display:grid;gap:8px;min-width:0;transition:border-color .3s}
.arch-lab .arch-repeat-stage.arch-repeat-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the long number as blocks of five digits; the newest block flashes orange */
.arch-lab .arch-repeat-blocks{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:4px 4px 0;font-variant-numeric:tabular-nums}
.arch-lab .arch-repeat-block{display:inline-flex;align-items:center;justify-content:center;min-width:64px;height:36px;padding:0 8px;border:1px solid var(--arch-repeat-block-line);border-radius:6px;background:var(--arch-repeat-block-bg);color:var(--arch-ink);font-size:17px;font-weight:700;letter-spacing:.04em;line-height:1}
.arch-lab .arch-repeat-new{animation:arch-repeat-new .7s ease-out 1}
@keyframes arch-repeat-new{0%{background:var(--arch-repeat-new-bg);transform:scale(.92)}100%{transform:scale(1)}}
.arch-lab .arch-repeat-dots{color:var(--arch-muted);font-size:14px;padding:0 4px}
.arch-lab .arch-repeat-blocksnote{margin:0;padding:0 4px;font-size:14px;color:var(--arch-muted)}
/* the clock of remainders is drawn at 1:1 from the measured width and centred */
.arch-lab .arch-repeat-clockhost{position:relative;width:100%;min-width:0;display:flex;justify-content:center}
.arch-lab .arch-stage .arch-repeat-clock{display:block;width:auto;height:auto;max-width:100%;max-height:none;overflow:visible}
.arch-lab .arch-repeat-draw{stroke-dasharray:1;animation:arch-repeat-draw .45s ease-out both}
@keyframes arch-repeat-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-repeat-draw,.arch-lab .arch-repeat-new{animation:none}.arch-lab .arch-repeat-stage{transition:none}}
.arch-lab .arch-repeat-play{min-width:12.5em}
.arch-lab .arch-repeat-step{min-width:64px;font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-repeat-key{flex:none}
.arch-lab .arch-repeat-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.arch-lab .arch-repeat-chip{display:inline-block;padding:2px 10px;border-radius:999px;border:1px solid var(--arch-good);background:var(--arch-ok-bg);color:var(--arch-ink);font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-repeat-dbtn[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-repeat-dbtn[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab #arch-repeat-k,.arch-lab #arch-repeat-d{flex:1 1 8em;width:8em;max-width:100%}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-repeat-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:480px){.arch-lab .arch-repeat-play{flex:1 1 100%;min-width:0}}

/* Euler 2023–2024, distance round 3, problem 4 «Шесть друзей, два общих» — lab labs/24d3-4-friends.mjs.
   Students are buttons on a circle or in a table; friendships are strokes in the SVG under them. The selected
   student, his friends and the «exactly 6 friends» frame use the site tokens; the friendship stroke and the
   «checked» chips are own variables with light and dark values (same theme selectors as lab.css). */
.arch-lab{--arch-friends-edge:#94a3b8;--arch-friends-fit-bg:#ecfdf5;--arch-friends-friend-bg:#dbeafe}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-friends-edge:#64748b;--arch-friends-fit-bg:#14341f;--arch-friends-friend-bg:#1e3a8a}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-friends-edge:#64748b;--arch-friends-fit-bg:#14341f;--arch-friends-friend-bg:#1e3a8a}
.arch-lab .arch-friends-predict{border-top:0;padding-top:0}
.arch-lab .arch-friends-predict .arch-label{margin:0}
.arch-lab .arch-friends-size input[type=range]{flex:1 1 120px}
.arch-lab .arch-friends-stage{transition:border-color .3s}
.arch-lab .arch-friends-stage.arch-friends-built{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board: its width follows the number of students and the layout («big» keeps every student 44 px, the zoom helper scrolls it) */
.arch-lab .arch-friends-board{--big:260px;position:relative;width:min(100%,var(--big));height:260px;margin:0 auto}
.arch-lab .arch-zoomed .arch-friends-board{width:var(--big)}
.arch-lab .arch-stage .arch-friends-svg{position:absolute;left:0;top:0;width:100%;height:100%;max-height:none;overflow:visible;pointer-events:none}
.arch-lab .arch-friends-person{position:absolute;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:0;min-height:0;padding:0;border-radius:50%;border:2px solid var(--arch-field-line);background:var(--arch-surface);color:var(--arch-ink);line-height:1;font-weight:700;box-shadow:0 2px 4px rgba(15,23,42,.18)}
.arch-lab .arch-friends-person[data-six="true"]{border-color:var(--arch-good);border-width:3px}
.arch-lab .arch-friends-person[data-friend="true"]{background:var(--arch-friends-friend-bg)}
.arch-lab .arch-friends-person[data-sel="true"]{border-color:var(--arch-accent);box-shadow:0 0 0 3px var(--arch-accent),0 2px 4px rgba(15,23,42,.18)}
.arch-lab .arch-friends-num{font-size:1em}
.arch-lab .arch-friends-deg{font-size:.6em;font-weight:600;color:var(--arch-muted);font-variant-numeric:tabular-nums;margin-top:1px}
.arch-lab .arch-friends-person[data-six="true"] .arch-friends-deg{color:var(--arch-good)}
/* the badge: common friends with the selected student, in the top-right corner of the circle */
.arch-lab .arch-friends-badge{position:absolute;right:-6px;top:-6px;min-width:20px;height:20px;padding:0 4px;border-radius:999px;border:1.5px solid var(--arch-muted);background:var(--arch-surface);color:var(--arch-ink);font-size:12px;font-weight:700;line-height:17px;font-variant-numeric:tabular-nums}
.arch-lab .arch-friends-badge[data-good="true"]{border-color:var(--arch-good);background:var(--arch-ok-bg);color:var(--arch-good)}
.arch-lab .arch-friends-fresh{animation:arch-friends-pulse .5s ease-out both}
@keyframes arch-friends-pulse{from{stroke-width:7}to{stroke-width:3}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-friends-fresh{animation:none}.arch-lab .arch-friends-stage{transition:none}}
.arch-lab .arch-friends-key{flex:none}
.arch-lab .arch-friends-count-btn[aria-pressed=true]{background:var(--arch-pressed-bg);color:var(--arch-link);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-friends-sel{color:var(--arch-ink)}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-friends-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* the ledger */
.arch-lab .arch-friends-count{display:grid;gap:8px;border:1px solid var(--arch-soft-line);border-radius:14px;padding:12px 14px;background:var(--arch-surface);color:var(--arch-ink);line-height:1.5;overflow-wrap:anywhere}
.arch-lab .arch-friends-count p{margin:0}
.arch-lab .arch-friends-count b{color:var(--arch-label)}
/* the log of class sizes checked */
.arch-lab .arch-friends-log{display:grid;gap:6px}
.arch-lab .arch-friends-log:empty{display:none}
.arch-lab .arch-friends-log p{margin:0}
.arch-lab .arch-friends-tried{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-friends-tried li{padding:3px 10px;border-radius:999px;border:1px solid var(--arch-soft-line);color:var(--arch-ink);font-variant-numeric:tabular-nums;font-size:15px}
.arch-lab .arch-friends-tried li.arch-friends-tried-yes{border-color:var(--arch-good);background:var(--arch-friends-fit-bg);font-weight:600}
@media (max-width:480px){.arch-lab .arch-friends-count-btn{flex:1 1 100%}}

/* 2023–2024 distance round 3, problem 5 «Шесть угловых треугольников» — lab labs/24d3-5-hexagon.mjs. The three families
   of parallel lines keep their object colours in both themes (AD/BC/EF blue, BE/CD/FA orange, CF/DE/AB green); the
   shaded pieces of a cut are translucent so the lines stay visible (parallelograms blue, the two triangles of the
   solution yellow, the central triangle of the official cut red). Everything else goes through the --arch-* variables
   of lab.css. */
.arch-lab{--arch-hex-fill:#f1f5f9;--arch-hex-fam1:#2563eb;--arch-hex-fam2:#c2410c;--arch-hex-fam3:#047857;--arch-hex-handle:#244974;--arch-hex-par:rgba(59,130,246,.22);--arch-hex-par-ink:#1e3a8a;--arch-hex-tri:rgba(245,158,11,.3);--arch-hex-tri-ink:#7c2d12;--arch-hex-central:rgba(220,38,38,.3);--arch-hex-central-ink:#7f1d1d}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-hex-fill:rgba(148,163,184,.12);--arch-hex-fam1:#93c5fd;--arch-hex-fam2:#fdba74;--arch-hex-fam3:#6ee7b7;--arch-hex-handle:#fbbf24;--arch-hex-par:rgba(96,165,250,.3);--arch-hex-par-ink:#dbeafe;--arch-hex-tri:rgba(251,191,36,.32);--arch-hex-tri-ink:#fef3c7;--arch-hex-central:rgba(248,113,113,.35);--arch-hex-central-ink:#fee2e2}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-hex-fill:rgba(148,163,184,.12);--arch-hex-fam1:#93c5fd;--arch-hex-fam2:#fdba74;--arch-hex-fam3:#6ee7b7;--arch-hex-handle:#fbbf24;--arch-hex-par:rgba(96,165,250,.3);--arch-hex-par-ink:#dbeafe;--arch-hex-tri:rgba(251,191,36,.32);--arch-hex-tri-ink:#fef3c7;--arch-hex-central:rgba(248,113,113,.35);--arch-hex-central-ink:#fee2e2}
.arch-lab .arch-hex-predict{border-top:0;padding-top:0}
.arch-lab .arch-hex-predict .arch-label{margin:0}
.arch-lab .arch-hex-stage{transition:border-color .3s}
.arch-lab .arch-hex-stage.arch-hex-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-hex-stage.arch-hex-example{border-style:dashed}
.arch-lab .arch-hex-stage .arch-hex-svg{max-height:none;user-select:none;-webkit-user-select:none}
/* «Крупные клетки» on a phone: the figure keeps its full size (1 svg unit = 1 px) and scrolls sideways in the frame */
.arch-lab .arch-zoomed .arch-hex-svg{width:520px;max-width:none}
.arch-lab .arch-hex-svg text{font-weight:600;paint-order:stroke;stroke:var(--arch-surface);stroke-width:3px;stroke-linejoin:round}
.arch-lab .arch-hex-handle{cursor:grab;touch-action:none;outline:none}
/* keyboard focus: an orange ring on the vertex instead of a box around the circle (the site's redesign.css draws a
   3 px outline on every focused [tabindex] inside .learning-interactive; this selector is more specific) */
[data-design="v2"] .learning-interactive.arch-lab .arch-hex-handle:is(:focus,:focus-visible),.arch-lab .arch-hex-handle:focus-visible{outline:none;stroke:var(--arch-focus);stroke-width:3px}
.arch-lab .arch-hex-dragging .arch-hex-handle{cursor:grabbing}
.arch-lab .arch-hex-views{align-items:baseline}
.arch-lab .arch-hex-total dd{font-size:18px}
.arch-lab .arch-hex-key{flex:none}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-hex-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-hex-stage{transition:none}}

/* 2023/24 final stage, day 1, problem 1 «Таблица 3×3 и число 2024» — lab labs/24f-1-table.mjs. A 3×3 table of
   buttons with a readout beside every row and under every column (sum and the three parts 8 · 11 · 23), a phone-style
   keypad under it. Own colours (filled cells, the parts, the chosen cell) have light and dark values, both dark
   selectors as in lab.css; everything else goes through --arch-* tokens. */
.arch-lab{--arch-table-filled:#eef4fb;--arch-table-filled-ink:#1f2937;--arch-table-gift:#5b6b82;--arch-table-chosen:#c2410c;--arch-table-part-ok:#dcfce7;--arch-table-part-ok-ink:#065f46;--arch-table-part-ok-line:#047857;--arch-table-part-some:#fef3c7;--arch-table-part-some-ink:#92400e;--arch-table-line-bg:#f8fafc}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-table-filled:#1e3a5f;--arch-table-filled-ink:#e5edf7;--arch-table-gift:#aab6c8;--arch-table-chosen:#fb923c;--arch-table-part-ok:#14341f;--arch-table-part-ok-ink:#bbf7d0;--arch-table-part-ok-line:#4ade80;--arch-table-part-some:#4a3b16;--arch-table-part-some-ink:#fde68a;--arch-table-line-bg:#1b2130}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-table-filled:#1e3a5f;--arch-table-filled-ink:#e5edf7;--arch-table-gift:#aab6c8;--arch-table-chosen:#fb923c;--arch-table-part-ok:#14341f;--arch-table-part-ok-ink:#bbf7d0;--arch-table-part-ok-line:#4ade80;--arch-table-part-some:#4a3b16;--arch-table-part-some-ink:#fde68a;--arch-table-line-bg:#1b2130}
.arch-lab .arch-table-predict{border-top:0;padding-top:0}
.arch-lab .arch-table-predict .arch-label{margin:0}
/* the table: three cell columns, a readout column; three cell rows, a readout row */
.arch-lab .arch-table-stage{display:grid;gap:8px;justify-items:center;padding:8px}
.arch-lab .arch-table-frame{display:grid;grid-template-columns:repeat(3,minmax(56px,84px)) minmax(72px,auto);grid-template-rows:repeat(3,auto) auto;gap:4px;max-width:100%;justify-content:center}
.arch-lab .arch-table-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;aspect-ratio:1;min-width:0;min-height:44px;width:100%;height:auto;padding:2px;border-radius:10px;border:1.5px solid var(--arch-grid);background:var(--arch-surface);color:var(--arch-ink);outline-offset:-3px;font-variant-numeric:tabular-nums;transition:background-color .2s}
.arch-lab .arch-table-cell[data-state="filled"]{background:var(--arch-table-filled);color:var(--arch-table-filled-ink)}
.arch-lab .arch-table-cell[aria-pressed="true"]{box-shadow:inset 0 0 0 3px var(--arch-table-chosen)}
.arch-lab .arch-table-value{font-size:22px;font-weight:700;line-height:1.1}
.arch-lab .arch-table-cell[data-state="empty"] .arch-table-value::before{content:'·';color:var(--arch-muted);font-weight:400}
.arch-lab .arch-table-cell[data-typing="1"] .arch-table-value::after{content:'_';color:var(--arch-table-chosen);margin-left:1px}
.arch-lab .arch-table-gift{font-size:11px;line-height:1.1;color:var(--arch-table-gift);min-height:12px;white-space:nowrap}
/* line readouts */
.arch-lab .arch-table-line{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;padding:4px 2px;border-radius:8px;background:var(--arch-table-line-bg);border:1px dashed var(--arch-soft-line)}
.arch-lab .arch-table-line[data-kind="row"]{align-items:flex-start;padding-left:8px}
.arch-lab .arch-table-line[data-state="ok"]{border-style:solid;border-color:var(--arch-good)}
.arch-lab .arch-table-line[data-state="bad"]{border-style:solid;border-color:var(--arch-bad)}
.arch-lab .arch-table-sum{font-size:13px;font-weight:600;color:var(--arch-muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.arch-lab .arch-table-sum[data-ok="true"]{color:var(--arch-ink)}
.arch-lab .arch-table-line[data-state="ok"] .arch-table-sum{color:var(--arch-good)}
.arch-lab .arch-table-sum[data-ok="false"]{color:var(--arch-bad)}
.arch-lab .arch-table-parts{display:flex;gap:3px;flex-wrap:nowrap}
.arch-lab .arch-table-part{display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:18px;padding:0 3px;border-radius:999px;font-size:11px;font-weight:700;line-height:1;border:1.5px dashed var(--arch-field-line);color:var(--arch-muted);background:transparent;font-variant-numeric:tabular-nums}
.arch-lab .arch-table-part[data-ok="true"]{border-style:solid;border-color:var(--arch-table-part-ok-line);background:var(--arch-table-part-ok);color:var(--arch-table-part-ok-ink)}
.arch-lab .arch-table-part[data-some="true"]{background:var(--arch-table-part-some);color:var(--arch-table-part-some-ink)}
.arch-lab .arch-table-corner{display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:var(--arch-muted);text-align:center;padding:4px 2px}
.arch-lab .arch-table-corner[data-state="ok"]{color:var(--arch-good)}
.arch-lab .arch-table-corner[data-state="bad"]{color:var(--arch-bad)}
.arch-lab .arch-table-key-sample{flex:none}
.arch-lab .arch-legend .arch-table-sum{color:var(--arch-good)}
/* keypad: 3 columns like a phone */
.arch-lab .arch-table-padlabel{margin:0;font-variant-numeric:tabular-nums}
.arch-lab .arch-table-pad{display:grid;grid-template-columns:repeat(3,minmax(56px,76px));gap:6px;justify-content:start}
.arch-lab .arch-table-key{min-height:48px;padding:4px 8px;border-radius:12px;font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;background:var(--arch-surface);color:var(--arch-ink);border:1px solid var(--arch-field-line)}
.arch-lab .arch-table-key-text{display:flex;flex-direction:column;align-items:center;gap:0;font-size:18px;color:var(--arch-link)}
.arch-lab .arch-table-keyword{font-size:11px;font-weight:500;line-height:1}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-table-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.arch-lab .arch-table-result .arch-checks li{overflow-wrap:anywhere}
/* phones: 60 px cells, compact badges (3 × 18 px fit under a 60 px column), the readout column at least 72 px */
@media (max-width:480px){.arch-lab .arch-table-value{font-size:20px}.arch-lab .arch-table-frame{grid-template-columns:repeat(3,minmax(56px,60px)) minmax(72px,auto);gap:3px}.arch-lab .arch-table-stage{padding:4px}.arch-lab .arch-table-line{padding:3px 0}.arch-lab .arch-table-line[data-kind="row"]{padding:3px 2px 3px 4px}.arch-lab .arch-table-parts{gap:2px}.arch-lab .arch-table-part{min-width:18px;padding:0;font-size:10px;height:17px}.arch-lab .arch-table-sum{font-size:12px}.arch-lab .arch-table-corner{font-size:11px;padding:3px 0}.arch-lab .arch-table-pad{grid-template-columns:repeat(3,minmax(56px,1fr));max-width:260px}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-table-cell{transition:none}}

/* 2023/24 final stage, day 1, problem 2 «Сто чисел на доске» — lab labs/24f-2-pairs.mjs («Собери свою доску»).
   The cards and the palette are buttons ≥ 44 px; the chosen card carries an accent ring. Everything goes through
   --arch-* variables; the only own colour is the soft tint of the chip for the current board size, given for the
   light theme and both dark branches. */
.arch-lab{--arch-pairs-chip-now:#fef3c7}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-pairs-chip-now:#4a3b16}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-pairs-chip-now:#4a3b16}
.arch-lab .arch-pairs-predict{border-top:0;padding-top:0}
.arch-lab .arch-pairs-predict .arch-label{margin:0}
.arch-lab .arch-pairs-stage{transition:border-color .3s}
.arch-lab .arch-pairs-stage.arch-pairs-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board: cards wrap onto several rows on a phone (8 cards → two rows at 320 px) */
.arch-lab .arch-pairs-board{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:4px 0}
.arch-lab .arch-pairs-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:62px;min-width:62px;height:64px;padding:4px 2px;border-radius:12px;border:2px solid var(--arch-field-line);background:var(--arch-surface);color:var(--arch-ink);font-variant-numeric:tabular-nums;line-height:1}
.arch-lab .arch-pairs-card[aria-current=true]{border-color:var(--arch-accent);box-shadow:0 0 0 2px var(--arch-accent) inset;background:var(--arch-pressed-bg)}
.arch-lab .arch-pairs-no{font-size:11px;color:var(--arch-muted)}
.arch-lab .arch-pairs-value{font-size:20px;font-weight:700;line-height:1.15;max-width:100%;overflow-wrap:anywhere}
.arch-lab .arch-pairs-value[data-long=true]{font-size:14px}
/* the palette */
.arch-lab .arch-pairs-palette{display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-pairs-val{min-width:48px;padding:8px 10px;font-variant-numeric:tabular-nums;background:var(--arch-surface);color:var(--arch-link);border:1px solid var(--arch-field-line)}
.arch-lab .arch-pairs-val[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:700;color:var(--arch-ink)}
.arch-lab .arch-pairs-own,.arch-lab .arch-pairs-sum{flex:1 1 7em;width:7em;max-width:100%;font-variant-numeric:tabular-nums}
/* the pair table of the chosen card */
.arch-lab .arch-pairs-tablewrap .arch-label{display:block;margin:0 0 6px}
.arch-lab .arch-pairs-table{width:100%;max-width:480px;font-size:15px;table-layout:auto}
.arch-lab .arch-pairs-table th,.arch-lab .arch-pairs-table td{padding:4px 6px}
.arch-lab .arch-pairs-table td:first-child{white-space:nowrap}
.arch-lab .arch-pairs-table td:nth-child(2){overflow-wrap:anywhere}
.arch-lab .arch-pairs-table td:last-child{white-space:nowrap}
/* the finds: one chip per board size; the chip of the current size is tinted */
.arch-lab .arch-pairs-found{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.arch-lab .arch-pairs-found .arch-label{flex:1 1 100%;margin:0}
.arch-lab .arch-pairs-found .arch-help{margin:0}
.arch-lab .arch-pairs-chip{display:inline-flex;gap:6px;align-items:baseline;padding:5px 12px;border-radius:999px;border:1px solid var(--arch-soft-line);background:var(--arch-surface);color:var(--arch-ink);font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-pairs-chip[data-current=true]{background:var(--arch-pairs-chip-now);border-color:var(--arch-accent)}
.arch-lab .arch-pairs-chip-n{color:var(--arch-muted);font-weight:400}
/* the search result */
.arch-lab .arch-pairs-enum[hidden]{display:none}
.arch-lab .arch-pairs-boards{margin:6px 0;padding-left:1.2em;display:grid;gap:4px;font-variant-numeric:tabular-nums}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-pairs-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-pairs-stage{transition:none}}
@media (max-width:480px){.arch-lab .arch-pairs-card{width:58px;min-width:58px}.arch-lab .arch-pairs-table{font-size:14px}}

/* 2023–2024 final stage, day 1, problem 3 «Ломаная и отрезок» — lab labs/24f-3-path.mjs. The path AC + CE keeps its
   object colour (blue) in both themes, the segment EK and the diagonal A′K are orange (the accent), the equal
   and parallel sides A′B, DK and the midline EF are green, the two equal angles of the statement are violet; the
   parallelogram is a translucent tint so the lines stay visible. Everything else goes through the --arch-* variables
   of lab.css. */
.arch-lab{--arch-path-path:#2563eb;--arch-path-ek:#c2410c;--arch-path-pair:#047857;--arch-path-angle:#7c3aed;--arch-path-handle:#244974;--arch-path-handle-c:#2563eb;--arch-path-para:rgba(16,185,129,.16)}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-path-path:#93c5fd;--arch-path-ek:#fdba74;--arch-path-pair:#6ee7b7;--arch-path-angle:#c4b5fd;--arch-path-handle:#fbbf24;--arch-path-handle-c:#93c5fd;--arch-path-para:rgba(52,211,153,.22)}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-path-path:#93c5fd;--arch-path-ek:#fdba74;--arch-path-pair:#6ee7b7;--arch-path-angle:#c4b5fd;--arch-path-handle:#fbbf24;--arch-path-handle-c:#93c5fd;--arch-path-para:rgba(52,211,153,.22)}
.arch-lab .arch-path-predict{border-top:0;padding-top:0}
.arch-lab .arch-path-predict .arch-label,.arch-lab .arch-path-modes .arch-label{margin:0}
.arch-lab .arch-path-stage{transition:border-color .3s}
.arch-lab .arch-path-stage.arch-path-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-path-stage.arch-path-example{border-style:dashed}
.arch-lab .arch-path-stage .arch-path-svg{max-height:none;max-width:560px;margin:0 auto;user-select:none;-webkit-user-select:none}
/* «Крупные клетки» on a phone: the figure keeps its full size (1 svg unit = 1 px) and scrolls sideways in the frame */
.arch-lab .arch-zoomed .arch-path-svg{width:500px;max-width:none}
.arch-lab .arch-path-svg text{font-weight:600;paint-order:stroke;stroke:var(--arch-surface);stroke-width:3px;stroke-linejoin:round}
.arch-lab .arch-path-handle{cursor:grab;touch-action:none;outline-offset:2px}
.arch-lab .arch-path-dragging .arch-path-handle{cursor:grabbing}
.arch-lab .arch-path-block{min-height:1.2em;font-weight:600;color:var(--arch-bad)}
.arch-lab .arch-path-block:empty{display:none}
.arch-lab .arch-path-key{flex:none}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-path-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-path-stage{transition:none}}

/* Euler 2023–2024, final stage, problem 4 «Две шестёрки из блоков» — lab labs/24f-4-blocks.mjs.
   The numbers are buttons in a grid. Group А is blue, group Б is amber (the tints of the solution figures);
   a number in a block is grey with the block's number; the numbers of a shown example carry an orange inner
   ring; the numbers of the assembled sextuples get a green ring. Own colours have light and dark values
   (same theme selectors as lab.css); everything else goes through --arch-* variables. */
.arch-lab{--arch-blocks-a:#dbeafe;--arch-blocks-a-line:#1d4ed8;--arch-blocks-b:#fde68a;--arch-blocks-b-line:#b45309;--arch-blocks-used:#e9eef5;--arch-blocks-used-ink:#5b6b82;--arch-blocks-t0:#dbeafe;--arch-blocks-t1:#bbf7d0;--arch-blocks-t2:#fde68a;--arch-blocks-t3:#ede9fe}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-blocks-a:#1e3a8a;--arch-blocks-a-line:#93c5fd;--arch-blocks-b:#4a3b16;--arch-blocks-b-line:#fcd34d;--arch-blocks-used:#3a4150;--arch-blocks-used-ink:#cbd5e1;--arch-blocks-t0:#27325a;--arch-blocks-t1:#1a4130;--arch-blocks-t2:#4a3b16;--arch-blocks-t3:#3d2c5c}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-blocks-a:#1e3a8a;--arch-blocks-a-line:#93c5fd;--arch-blocks-b:#4a3b16;--arch-blocks-b-line:#fcd34d;--arch-blocks-used:#3a4150;--arch-blocks-used-ink:#cbd5e1;--arch-blocks-t0:#27325a;--arch-blocks-t1:#1a4130;--arch-blocks-t2:#4a3b16;--arch-blocks-t3:#3d2c5c}
.arch-lab .arch-blocks-predict{border-top:0;padding-top:0}
.arch-lab .arch-blocks-predict .arch-label{margin:0}
.arch-lab .arch-blocks-stage{transition:border-color .3s}
.arch-lab .arch-blocks-stage.arch-blocks-done{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board: every number is at least 44 px, the grid fills the width (6 columns at 320 px) */
.arch-lab .arch-blocks-board{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:4px;min-width:0}
.arch-lab .arch-blocks-chip{position:relative;min-width:44px;min-height:44px;padding:0;border-radius:10px;border:2px solid var(--arch-field-line);background:var(--arch-surface);color:var(--arch-ink);font-weight:700;font-size:15px;line-height:1;font-variant-numeric:tabular-nums;transition:background-color .15s,border-color .15s}
.arch-lab .arch-blocks-chip[data-side="A"]{background:var(--arch-blocks-a);border-color:var(--arch-blocks-a-line)}
.arch-lab .arch-blocks-chip[data-side="B"]{background:var(--arch-blocks-b);border-color:var(--arch-blocks-b-line)}
.arch-lab .arch-blocks-chip[data-block]{background:var(--arch-blocks-used);color:var(--arch-blocks-used-ink);border-style:dotted;cursor:default}
.arch-lab .arch-blocks-chip[data-ex]{box-shadow:inset 0 0 0 3px var(--arch-accent)}
.arch-lab .arch-blocks-chip[data-final]{box-shadow:inset 0 0 0 3px var(--arch-good)}
.arch-lab .arch-blocks-tag{position:absolute;left:3px;top:2px;font-size:10px;font-weight:700;line-height:1;color:var(--arch-label)}
.arch-lab .arch-blocks-chip[data-block] .arch-blocks-tag{color:var(--arch-blocks-used-ink)}
.arch-lab .arch-blocks-extag{position:absolute;right:3px;top:2px;font-size:10px;font-weight:700;line-height:1;color:var(--arch-accent)}
.arch-lab .arch-blocks-chip[data-final] .arch-blocks-extag{color:var(--arch-good)}
.arch-lab .arch-blocks-fresh{animation:arch-blocks-pop .26s ease-out both}
@keyframes arch-blocks-pop{from{transform:scale(.84)}to{transform:scale(1)}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-blocks-fresh{animation:none}.arch-lab .arch-blocks-stage{transition:none}.arch-lab .arch-blocks-chip{transition:none}}
/* legend keys */
.arch-lab .arch-blocks-key{display:inline-block;width:22px;height:22px;border-radius:7px;border:2px solid var(--arch-field-line);background:var(--arch-surface);flex:none;box-sizing:border-box}
.arch-lab .arch-blocks-key[data-side="A"]{background:var(--arch-blocks-a);border-color:var(--arch-blocks-a-line)}
.arch-lab .arch-blocks-key[data-side="B"]{background:var(--arch-blocks-b);border-color:var(--arch-blocks-b-line)}
.arch-lab .arch-blocks-key[data-block]{background:var(--arch-blocks-used);border-style:dotted}
.arch-lab .arch-blocks-key[data-ex]{box-shadow:inset 0 0 0 3px var(--arch-accent)}
.arch-lab .arch-blocks-key[data-final]{box-shadow:inset 0 0 0 3px var(--arch-good)}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-blocks-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* the shelf of blocks */
.arch-lab .arch-blocks-shelf{display:grid;gap:6px}
.arch-lab .arch-blocks-shelf:empty{display:none}
.arch-lab .arch-blocks-shelf p{margin:0;overflow-wrap:anywhere}
.arch-lab .arch-blocks-bchip{display:inline-block;padding:2px 10px;margin-right:6px;border-radius:999px;border:1px solid var(--arch-soft-line);color:var(--arch-ink);font-weight:700;font-variant-numeric:tabular-nums}
.arch-lab .arch-blocks-bchip[data-t="0"]{background:var(--arch-blocks-t0)}
.arch-lab .arch-blocks-bchip[data-t="1"]{background:var(--arch-blocks-t1)}
.arch-lab .arch-blocks-bchip[data-t="2"]{background:var(--arch-blocks-t2)}
.arch-lab .arch-blocks-bchip[data-t="3"]{background:var(--arch-blocks-t3)}
.arch-lab .arch-blocks-bchip[data-used="true"]{box-shadow:inset 0 0 0 2px var(--arch-good)}
/* the counting ledger */
.arch-lab .arch-blocks-count{display:grid;gap:8px;border:1px solid var(--arch-soft-line);border-radius:14px;padding:12px 14px;background:var(--arch-surface);color:var(--arch-ink);line-height:1.5;overflow-wrap:anywhere}
.arch-lab .arch-blocks-count p{margin:0}
.arch-lab .arch-blocks-count b{color:var(--arch-label)}
.arch-lab .arch-blocks-count-btn[aria-pressed=true]{background:var(--arch-pressed-bg);color:var(--arch-link);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-blocks-count table.arch-table{font-size:14px}
.arch-lab .arch-blocks-count table.arch-table tr[data-k="now"] td{font-weight:700;background:var(--arch-pressed-bg)}
@media (max-width:480px){.arch-lab .arch-blocks-count-btn{flex:1 1 100%}.arch-lab .arch-blocks-chip{font-size:14px}}

/* Popov Academy — 2023/24 final stage, problem 5 «Звезда из ста шнуров» (labs/24f-5-star.mjs).
   The fuses, the ash, the fire and the highlight of the two longest fuses are own colours with values for the light
   theme and both dark branches; everything else goes through --arch-* variables. */
.arch-lab{--arch-star-fuse:#1f2937;--arch-star-ash:#cbd5e1;--arch-star-fire:#ea580c;--arch-star-glow:rgba(234,88,12,.32);--arch-star-mark:rgba(37,99,235,.22);--arch-star-mark-ink:#1d4ed8;--arch-star-hot:#ea580c}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-star-fuse:#e2e8f0;--arch-star-ash:#4b5563;--arch-star-fire:#fb923c;--arch-star-glow:rgba(251,146,60,.38);--arch-star-mark:rgba(147,197,253,.28);--arch-star-mark-ink:#93c5fd;--arch-star-hot:#fb923c}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-star-fuse:#e2e8f0;--arch-star-ash:#4b5563;--arch-star-fire:#fb923c;--arch-star-glow:rgba(251,146,60,.38);--arch-star-mark:rgba(147,197,253,.28);--arch-star-mark-ink:#93c5fd;--arch-star-hot:#fb923c}
.arch-lab .arch-star-block{display:grid;gap:8px;min-width:0}
.arch-lab .arch-star-block>.arch-label{margin:0}
/* the times: name · − · slider · + · value */
.arch-lab .arch-star-trow{display:grid;grid-template-columns:auto 44px minmax(0,1fr) 44px auto;gap:6px;align-items:center;min-width:0}
.arch-lab .arch-star-trow input[type=range]{flex:none;width:100%;min-width:0}
.arch-lab .arch-star-name{min-width:2.6em;font-variant-numeric:tabular-nums}
.arch-lab .arch-star-step{width:44px;min-width:44px;padding:0;font-size:22px;line-height:1;font-weight:700}
.arch-lab .arch-star-val{min-width:3.2em;text-align:right;font-weight:600;color:var(--arch-ink);font-variant-numeric:tabular-nums}
/* where to light: five buttons with the total under each name */
.arch-lab .arch-star-litgroup{display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-star-lit{display:flex;flex-direction:column;align-items:center;gap:1px;flex:1 1 52px;min-width:52px;padding:6px 8px;line-height:1.25;background:var(--arch-surface);color:var(--arch-link);border:1px solid var(--arch-field-line);font-variant-numeric:tabular-nums}
.arch-lab .arch-star-lit[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line)}
.arch-lab .arch-star-litname{font-weight:700;font-size:17px}
.arch-lab .arch-star-littotal{font-size:13px;color:var(--arch-muted)}
.arch-lab .arch-star-lit[aria-pressed=true] .arch-star-littotal{color:var(--arch-ink);font-weight:600}
/* the star */
.arch-lab .arch-star-scene{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:start;padding:12px}
@media (min-width:640px){.arch-lab .arch-star-scene{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:center}}
.arch-lab .arch-star-star svg{max-width:360px;margin:0 auto;overflow:visible}
.arch-lab .arch-star-ash{stroke:var(--arch-star-ash);stroke-width:7;stroke-linecap:round}
.arch-lab .arch-star-live{stroke:var(--arch-star-fuse);stroke-width:7;stroke-linecap:round}
.arch-lab .arch-star-halo{stroke:var(--arch-star-mark);stroke-width:22;stroke-linecap:round}
.arch-lab .arch-star-glow{fill:var(--arch-star-glow);stroke:none}
.arch-lab .arch-star-front{fill:var(--arch-star-fire);stroke:#fff;stroke-width:1.5}
.arch-lab .arch-star-center{fill:var(--arch-star-fuse);stroke:none}
.arch-lab .arch-star-center-hot{fill:var(--arch-star-hot)}
.arch-lab svg text.arch-star-label{fill:var(--arch-ink)}
.arch-lab svg text.arch-star-label.arch-star-marked{fill:var(--arch-star-mark-ink)}
.arch-lab svg text.arch-star-time{fill:var(--arch-muted);font-variant-numeric:tabular-nums}
.arch-lab svg text.arch-star-clock{fill:var(--arch-ink);font-variant-numeric:tabular-nums}
/* readouts and the log */
.arch-lab .arch-star-side{display:grid;gap:10px;min-width:0}
.arch-lab .arch-star-now{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:0}
.arch-lab .arch-star-now>div{display:grid;gap:2px;padding:6px 10px;border-radius:10px;border:1px solid var(--arch-soft-line);background:var(--arch-surface);min-width:0}
.arch-lab .arch-star-now dt{font-size:13px;color:var(--arch-muted)}
.arch-lab .arch-star-now dd{margin:0;font-size:18px;font-weight:700;color:var(--arch-ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.arch-lab .arch-star-log{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:14px;line-height:1.4}
.arch-lab .arch-star-ev{display:flex;gap:8px;align-items:flex-start;color:var(--arch-muted)}
.arch-lab .arch-star-ev.arch-star-passed{color:var(--arch-ink);font-weight:600}
.arch-lab .arch-star-dot{flex:none;width:11px;height:11px;margin-top:.3em;border-radius:50%;background:var(--arch-field-line)}
.arch-lab .arch-star-ev-center .arch-star-dot{background:var(--arch-star-fire)}
.arch-lab .arch-star-ev.arch-star-passed .arch-star-dot{background:var(--arch-star-fuse)}
.arch-lab .arch-star-ev-center.arch-star-passed .arch-star-dot{background:var(--arch-star-fire)}
/* the verdict */
.arch-lab .arch-star-readouts div{flex-wrap:wrap}
.arch-lab .arch-star-readouts dt{flex:none;white-space:nowrap}
.arch-lab .arch-star-readouts dd{white-space:normal;overflow-wrap:anywhere}
.arch-lab .arch-star-repeat{font-weight:600;color:var(--arch-ink)}
.arch-lab .arch-star-why{display:grid;gap:6px;padding:10px 12px;border-radius:10px;border:1px solid var(--arch-soft-line);background:var(--arch-pressed-bg)}
.arch-lab .arch-star-why p{margin:0}
.arch-lab .arch-star-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* the small version and the prediction */
.arch-lab .arch-star-mini{display:grid;gap:8px}
.arch-lab .arch-star-mini>.arch-label{margin:0}
.arch-lab .arch-star-mini>p{margin:0}
.arch-lab .arch-star-pred{display:grid;gap:6px}
.arch-lab .arch-star-pred input[type=text]{flex:0 1 7em;width:7em;text-align:center;font-variant-numeric:tabular-nums}
.arch-lab .arch-star-pred input[type=text]:disabled{opacity:.55}
@media (max-width:480px){.arch-lab .arch-star-scene{padding:8px}.arch-lab .arch-star-now dd{font-size:16px}.arch-lab .arch-star-step{font-size:20px}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-star-front{transition:none}}

/* 2023–2024 final stage, problem 6 «Простые частные, составные остатки» — lab labs/24f-6-boxes.mjs. Own colours: the
   ten boxes of composite remainders (paper blue, as in the solution figures), a box with two or more divisors (the
   orange of a collision), the box of non-composite remainders (soft red); everything else goes through --arch-* variables. */
.arch-lab{--arch-boxes-bg:#dbeafe;--arch-boxes-line:#93c5fd;--arch-boxes-hit-bg:#fed7aa;--arch-boxes-hit-line:#c2410c;--arch-boxes-off-bg:#fee2e2;--arch-boxes-off-line:#fca5a5;--arch-boxes-chip:#ffffff;--arch-boxes-okcell:#dcfce7;--arch-boxes-badcell:#fee2e2}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-boxes-bg:#1e3a5f;--arch-boxes-line:#3b82f6;--arch-boxes-hit-bg:#5a2d0c;--arch-boxes-hit-line:#fb923c;--arch-boxes-off-bg:#4c1d1d;--arch-boxes-off-line:#f87171;--arch-boxes-chip:#0f172a;--arch-boxes-okcell:#14532d;--arch-boxes-badcell:#4c1d1d}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-boxes-bg:#1e3a5f;--arch-boxes-line:#3b82f6;--arch-boxes-hit-bg:#5a2d0c;--arch-boxes-hit-line:#fb923c;--arch-boxes-off-bg:#4c1d1d;--arch-boxes-off-line:#f87171;--arch-boxes-chip:#0f172a;--arch-boxes-okcell:#14532d;--arch-boxes-badcell:#4c1d1d}
.arch-lab .arch-boxes-predict{border-top:0;padding-top:0}
.arch-lab .arch-boxes-predict .arch-label{margin:0}
.arch-lab #arch-boxes-n{flex:1 1 9em;width:9em;max-width:100%}
.arch-lab .arch-boxes-step{min-width:56px;font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-boxes-stage{display:grid;gap:10px;min-width:0}
.arch-lab .arch-boxes-head{margin:0;font-size:14px;font-weight:600;color:var(--arch-label)}
/* the table of the eleven rows: value above, a short verdict below, in every cell */
.arch-lab table.arch-boxes-table{width:100%;max-width:420px;margin:0 auto;table-layout:fixed}
.arch-lab table.arch-boxes-table th,.arch-lab table.arch-boxes-table td{padding:3px 4px;vertical-align:top;font-size:15px;line-height:1.25;overflow-wrap:anywhere}
.arch-lab table.arch-boxes-table th:first-child,.arch-lab table.arch-boxes-table td:first-child{width:3.2em;font-weight:700}
.arch-lab table.arch-boxes-table td.arch-boxes-ok{background:var(--arch-boxes-okcell)}
.arch-lab table.arch-boxes-table td.arch-boxes-bad{background:var(--arch-boxes-badcell)}
.arch-lab .arch-boxes-val{display:block;font-weight:600;color:var(--arch-ink);font-variant-numeric:tabular-nums}
.arch-lab .arch-boxes-tag{display:block;font-size:12px;color:var(--arch-muted)}
.arch-lab td.arch-boxes-bad .arch-boxes-tag{color:var(--arch-bad);font-weight:600}
.arch-lab td.arch-boxes-ok .arch-boxes-tag{color:var(--arch-good)}
.arch-lab tr.arch-boxes-row-ok td:first-child{color:var(--arch-good)}
/* the boxes: ten composite numbers below 20 and one tray for everything else */
.arch-lab .arch-boxes-shelf{display:flex;flex-wrap:wrap;gap:6px;align-items:stretch}
.arch-lab .arch-boxes-box{flex:1 1 48px;min-width:48px;max-width:88px;min-height:58px;border:1.5px solid var(--arch-boxes-line);border-radius:8px;background:var(--arch-boxes-bg);padding:3px 4px 5px;display:flex;flex-direction:column;align-items:center;gap:3px}
.arch-lab .arch-boxes-box.arch-boxes-hit{background:var(--arch-boxes-hit-bg);border-color:var(--arch-boxes-hit-line);border-width:2px}
.arch-lab .arch-boxes-box.arch-boxes-off{flex:1 1 100%;max-width:none;background:var(--arch-boxes-off-bg);border-color:var(--arch-boxes-off-line);border-style:dashed}
.arch-lab .arch-boxes-box.arch-boxes-off.arch-boxes-empty{background:transparent;border-color:var(--arch-soft-line)}
.arch-lab .arch-boxes-boxlabel{font-weight:700;font-size:15px;color:var(--arch-ink);line-height:1}
.arch-lab .arch-boxes-off .arch-boxes-boxlabel{font-size:13px;font-weight:600;color:var(--arch-muted)}
.arch-lab .arch-boxes-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:3px;min-height:20px}
.arch-lab .arch-boxes-chip{display:inline-block;min-width:26px;padding:1px 5px;border-radius:999px;border:1px solid var(--arch-soft-line);background:var(--arch-boxes-chip);color:var(--arch-ink);font-size:12px;font-weight:600;line-height:1.4;font-variant-numeric:tabular-nums;text-align:center}
.arch-lab .arch-boxes-off .arch-boxes-chip{border-color:var(--arch-boxes-off-line)}
.arch-lab .arch-boxes-search{min-width:12.5em}
.arch-lab .arch-boxes-key{flex:none}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-boxes-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:480px){.arch-lab .arch-boxes-search{flex:1 1 100%;min-width:0}.arch-lab table.arch-boxes-table th,.arch-lab table.arch-boxes-table td{font-size:14px;padding:3px 3px}.arch-lab .arch-boxes-box{min-width:46px}}

/* 2023/24 final stage, problem 7 «Честный ювелир» — lab labs/24f-7-scales.mjs. Colours only through --arch-* variables;
   the lab's own colours have light and dark values (both dark selectors, as in lab.css): coins are gold with dark
   numbers, coin 1 is the orange accent coin, the left pan (and a coin chip on it) is blue, the right pan violet;
   the balance lines use a muted ink that stays visible on the dark surface. */
.arch-lab{--arch-scales-coin:#fde68a;--arch-scales-coin-edge:#b45309;--arch-scales-coin-ink:#1f2937;--arch-scales-x:#fed7aa;--arch-scales-left:#dbeafe;--arch-scales-left-ink:#1e3a8a;--arch-scales-right:#ede9fe;--arch-scales-right-ink:#4c1d95;--arch-scales-line:#475569;--arch-scales-stand:#e2e8f0}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-scales-coin:#4a3b16;--arch-scales-coin-edge:#fbbf24;--arch-scales-coin-ink:#fef3c7;--arch-scales-x:#7c2d12;--arch-scales-left:#1e3a5f;--arch-scales-left-ink:#bfdbfe;--arch-scales-right:#3d2c5c;--arch-scales-right-ink:#ddd6fe;--arch-scales-line:#aab6c8;--arch-scales-stand:#3f4654}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-scales-coin:#4a3b16;--arch-scales-coin-edge:#fbbf24;--arch-scales-coin-ink:#fef3c7;--arch-scales-x:#7c2d12;--arch-scales-left:#1e3a5f;--arch-scales-left-ink:#bfdbfe;--arch-scales-right:#3d2c5c;--arch-scales-right-ink:#ddd6fe;--arch-scales-line:#aab6c8;--arch-scales-stand:#3f4654}
/* one weighing: title row, the row of coin chips, the balance, what both sides see */
.arch-lab .arch-scales-weighing{display:grid;gap:10px}
.arch-lab .arch-scales-head{justify-content:space-between}
.arch-lab .arch-scales-coins{display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-scales-coin{display:grid;place-items:center;align-content:center;gap:1px;width:48px;min-width:48px;height:54px;padding:2px 0;border-radius:12px;border:2px solid var(--arch-soft-line);background:var(--arch-surface);color:var(--arch-ink);line-height:1;transition:background-color .15s,border-color .15s}
.arch-lab .arch-scales-coin .arch-scales-num{font-size:19px;font-weight:700;font-variant-numeric:tabular-nums}
.arch-lab .arch-scales-coin .arch-scales-role{font-size:11px;font-weight:700;color:var(--arch-muted)}
.arch-lab .arch-scales-coin[data-role="1"]{background:var(--arch-scales-left);border-color:var(--arch-scales-left-ink)}
.arch-lab .arch-scales-coin[data-role="1"] .arch-scales-role{color:var(--arch-scales-left-ink)}
.arch-lab .arch-scales-coin[data-role="-1"]{background:var(--arch-scales-right);border-color:var(--arch-scales-right-ink)}
.arch-lab .arch-scales-coin[data-role="-1"] .arch-scales-role{color:var(--arch-scales-right-ink)}
.arch-lab .arch-scales-coin-x .arch-scales-num{color:var(--arch-accent)}
.arch-lab .arch-scales-coin-x{box-shadow:inset 0 0 0 2px var(--arch-accent)}
.arch-lab .arch-scales-figure{display:grid;justify-items:center;min-width:0}
.arch-lab .arch-scales-svg{display:block;width:100%;max-width:380px;height:auto;max-height:none}
.arch-lab .arch-scales-svg-small{max-width:300px}
.arch-lab .arch-scales-view{margin:0;font-size:14px;color:var(--arch-ink)}
.arch-lab .arch-scales-view-j{color:var(--arch-muted)}
/* legend keys repeat the chip states */
.arch-lab .arch-scales-key{display:inline-grid;place-items:center;width:24px;height:24px;flex:0 0 auto;border-radius:7px;border:2px solid var(--arch-soft-line);background:var(--arch-surface);font-size:12px;font-weight:700;color:var(--arch-muted);line-height:1}
.arch-lab .arch-scales-key[data-role="1"]{background:var(--arch-scales-left);border-color:var(--arch-scales-left-ink);color:var(--arch-scales-left-ink)}
.arch-lab .arch-scales-key[data-role="-1"]{background:var(--arch-scales-right);border-color:var(--arch-scales-right-ink);color:var(--arch-scales-right-ink)}
.arch-lab .arch-scales-key-x{color:var(--arch-accent);border-color:var(--arch-accent)}
/* what the buyer still allows for every coin */
.arch-lab .arch-scales-values{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.arch-lab .arch-scales-chip{display:inline-block;padding:3px 9px;border-radius:999px;border:1px solid var(--arch-soft-line);color:var(--arch-ink);font-size:14px;font-variant-numeric:tabular-nums}
.arch-lab .arch-scales-chip[data-single]{border-color:var(--arch-bad);color:var(--arch-bad);font-weight:600}
.arch-lab .arch-scales-chip[data-single][data-x]{border-color:var(--arch-good);color:var(--arch-good)}
/* the example panel */
.arch-lab .arch-scales-example{border:1px solid var(--arch-pressed-line);background:var(--arch-pressed-bg);border-radius:14px;padding:12px 14px;display:grid;gap:8px}
.arch-lab .arch-scales-example[hidden]{display:none}
.arch-lab .arch-scales-example p{margin:0}
.arch-lab .arch-scales-example-body{display:grid;gap:8px}
.arch-lab .arch-scales-example-weighing{display:grid;gap:4px;justify-items:center;min-width:0}
.arch-lab .arch-scales-example-weighing .arch-help{justify-self:start}
@media (min-width:640px){.arch-lab .arch-scales-example-body{grid-template-columns:1fr 1fr}}
.arch-lab .arch-scales-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-scales-coin{transition:none}}

/* 2023–2024 final stage, problem 8 «Одна против всех» — lab labs/24f-8-bisector.mjs. Colours only through --arch-*
   variables; the lab's own colours have light and dark values (both dark selectors, as in lab.css): the two sides of
   the chosen bisector are light blue and light orange, a point on the bisector is red, the point that is alone on its
   side has an orange ring, the bisectors of the other pairs are faint grey. */
.arch-lab{--arch-bis-side-a:#dbeafe;--arch-bis-side-b:#fde8d1;--arch-bis-side-ink:#1f2937;--arch-bis-point:#244974;--arch-bis-point-ink:#fff;--arch-bis-on:#fecaca;--arch-bis-on-ink:#7f1d1d;--arch-bis-faint:#94a3b8;--arch-bis-label:#5b6b82;--arch-bis-line:#94a3b8;--arch-bis-chip-ok:#dcfce7;--arch-bis-chip-bad:#fee2e2}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-bis-side-a:#1e3a5f;--arch-bis-side-b:#4a3418;--arch-bis-side-ink:#e5edf7;--arch-bis-point:#8fb0ff;--arch-bis-point-ink:#0b1220;--arch-bis-on:#7f1d1d;--arch-bis-on-ink:#fee2e2;--arch-bis-faint:#64748b;--arch-bis-label:#aab6c8;--arch-bis-line:#64748b;--arch-bis-chip-ok:#14341f;--arch-bis-chip-bad:#431818}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-bis-side-a:#1e3a5f;--arch-bis-side-b:#4a3418;--arch-bis-side-ink:#e5edf7;--arch-bis-point:#8fb0ff;--arch-bis-point-ink:#0b1220;--arch-bis-on:#7f1d1d;--arch-bis-on-ink:#fee2e2;--arch-bis-faint:#64748b;--arch-bis-label:#aab6c8;--arch-bis-line:#64748b;--arch-bis-chip-ok:#14341f;--arch-bis-chip-bad:#431818}
.arch-lab .arch-bis-predict{border-top:0;padding-top:0}
.arch-lab .arch-bis-predict label{display:block}
.arch-lab .arch-bis-predict input[type=number]{width:96px}
.arch-lab .arch-bis-stage{transition:border-color .3s}
.arch-lab .arch-bis-stage.arch-bis-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-bis-stage.arch-bis-example{border-style:dashed}
/* the field: a label column on the left, the 10 × 9 cells, a label row below; the overlay draws the bisectors */
.arch-lab .arch-bis-frame{--arch-bis-lbl:24px;width:min(100%,calc(10 * 64px + var(--arch-bis-lbl)));max-width:100%;margin:0 auto;display:grid;grid-template-columns:var(--arch-bis-lbl) minmax(0,1fr);grid-template-rows:auto var(--arch-bis-lbl);gap:0}
.arch-lab .arch-zoomed .arch-bis-frame{width:calc(10 * 46px + var(--arch-bis-lbl));max-width:none}
.arch-lab .arch-bis-rows{grid-column:1;grid-row:1;display:grid;grid-template-rows:repeat(9,minmax(0,1fr))}
.arch-lab .arch-bis-corner{grid-column:1;grid-row:2}
.arch-lab .arch-bis-cols{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(10,minmax(0,1fr))}
.arch-lab .arch-bis-lbl{display:grid;place-items:center;font-size:12px;font-weight:600;color:var(--arch-bis-label);font-variant-numeric:tabular-nums;line-height:1}
.arch-lab .arch-bis-cells{grid-column:2;grid-row:1;position:relative;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));aspect-ratio:10/9;border:2px solid var(--arch-bis-line);background:var(--arch-surface)}
.arch-lab .arch-bis-cell{position:relative;aspect-ratio:1;min-width:0;min-height:0;width:100%;height:auto;padding:0;border-radius:0;border:1px solid var(--arch-grid);background:var(--arch-surface);color:var(--arch-bis-side-ink);display:grid;place-items:center;font-size:clamp(12px,2.2vw,18px);line-height:1;font-weight:700;outline-offset:-4px;transition:background-color .2s}
.arch-lab .arch-zoomed .arch-bis-cell{font-size:18px}
.arch-lab .arch-bis-cell[data-side="a"]{background-color:var(--arch-bis-side-a)}
.arch-lab .arch-bis-cell[data-side="b"]{background-color:var(--arch-bis-side-b)}
/* a point: a disc with an optional ring, drawn over the side tint by one radial gradient (hard stops) */
.arch-lab .arch-bis-cell[data-point="true"]{--arch-bis-disc:var(--arch-bis-point);--arch-bis-ring:transparent;color:var(--arch-bis-point-ink);z-index:1;background-image:radial-gradient(circle closest-side,var(--arch-bis-disc) 0,var(--arch-bis-disc) calc(100% - 8px),var(--arch-bis-ring) calc(100% - 8px),var(--arch-bis-ring) calc(100% - 3px),transparent calc(100% - 3px))}
.arch-lab .arch-bis-cell[data-role="alone"]{--arch-bis-ring:var(--arch-accent)}
.arch-lab .arch-bis-cell[data-role="on"],.arch-lab .arch-bis-cell[data-point="true"][data-side="on"]{--arch-bis-disc:var(--arch-bis-on);--arch-bis-ring:var(--arch-bad);color:var(--arch-bis-on-ink)}
[data-design] .arch-lab .arch-bis-cells .arch-bis-cell:is(:focus-visible,:focus){outline-offset:-2px;z-index:3}
.arch-lab .arch-bis-overlay{position:absolute;inset:0;width:100%;height:100%;max-height:none;overflow:visible;pointer-events:none;z-index:2}
.arch-lab .arch-bis-stage .arch-bis-overlay{display:block}
.arch-lab .arch-bis-board-help{text-align:center}
/* pair chips */
.arch-lab .arch-bis-pairs{display:grid;gap:8px}
.arch-lab .arch-bis-pairs[hidden]{display:none}
.arch-lab .arch-bis-pairs .arch-label{margin:0}
.arch-lab .arch-bis-chips{display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-bis-chip{display:inline-flex;align-items:center;gap:4px;min-width:64px;padding:8px 10px;background:var(--arch-surface);color:var(--arch-ink);border:1px solid var(--arch-field-line);font-variant-numeric:tabular-nums;font-weight:600}
.arch-lab .arch-bis-chip[data-ok="true"]{background:var(--arch-bis-chip-ok)}
.arch-lab .arch-bis-chip[data-ok="false"]{background:var(--arch-bis-chip-bad)}
.arch-lab .arch-bis-chip[aria-pressed="true"]{border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 2px var(--arch-pressed-line)}
.arch-lab .arch-bis-chip-mark{font-weight:700}
.arch-lab .arch-bis-chip[data-ok="true"] .arch-bis-chip-mark{color:var(--arch-good)}
.arch-lab .arch-bis-chip[data-ok="false"] .arch-bis-chip-mark{color:var(--arch-bad)}
.arch-lab .arch-bis-all[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-bis-all[aria-pressed=true]::before{content:'✓\00a0' / ''}
/* legend keys */
.arch-lab .arch-bis-key{display:inline-block;width:20px;height:20px;flex:0 0 auto;border-radius:4px;border:1px solid var(--arch-grid);box-sizing:border-box}
.arch-lab .arch-bis-key-a{background:var(--arch-bis-side-a)}
.arch-lab .arch-bis-key-b{background:var(--arch-bis-side-b);margin-left:-4px}
.arch-lab .arch-bis-key-alone{border-radius:50%;background:var(--arch-bis-point);box-shadow:0 0 0 3px var(--arch-accent);width:16px;height:16px;margin:2px}
.arch-lab .arch-bis-key-on{border-radius:50%;background:var(--arch-bis-on);box-shadow:0 0 0 3px var(--arch-bad);width:16px;height:16px;margin:2px}
.arch-lab .arch-bis-key-line{background:linear-gradient(to bottom,transparent 45%,var(--arch-accent) 45%,var(--arch-accent) 60%,transparent 60%);border:0}
.arch-lab .arch-bis-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-bis-cell,.arch-lab .arch-bis-stage{transition:none}}

/* 2023–2024 regional, day 1, problem 1 — cheese pieces of 2, 11, 23 (labs/24r-1-cheese.mjs). The strip is an SVG
   (one block per weight, widths = weights); the group cards below carry the same tints and the split buttons.
   Own colours: four block tints t0…t3 (the shared piece tints, so the dark theme keeps its own values through
   the --arch-piece-* tokens); everything else goes through --arch-* tokens. */
.arch-lab .arch-cheese{--arch-cheese-t0:var(--arch-piece-b);--arch-cheese-t1:var(--arch-piece-a);--arch-cheese-t2:var(--arch-piece-d);--arch-cheese-t3:var(--arch-piece-c)}
.arch-lab .arch-cheese-predict{border-top:0;padding-top:0}
.arch-lab .arch-cheese-target label{flex:1 1 100%}
.arch-lab .arch-cheese-target input[type=number]{width:104px}
.arch-lab .arch-cheese-stage{padding:8px 10px 4px;transition:border-color .3s}
.arch-lab .arch-cheese-stage.arch-cheese-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-stage .arch-cheese-strip{display:block;width:100%;height:84px;max-height:none;overflow:visible}
.arch-lab .arch-cheese-strip-label{fill:var(--arch-ink);paint-order:stroke;stroke:var(--arch-surface);stroke-width:7px;stroke-linejoin:round}
.arch-lab .arch-cheese-strip-tick{fill:var(--arch-muted)}
/* group cards: swatch | name | three split buttons */
.arch-lab .arch-cheese-groups{display:grid;gap:8px}
.arch-lab .arch-cheese-group{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 12px;border:1px solid var(--arch-soft-line);border-radius:14px;background:var(--arch-surface)}
.arch-lab .arch-cheese-swatch{flex:none;width:22px;height:22px;border-radius:6px;border:1.5px solid var(--arch-fig-line)}
.arch-lab .arch-cheese-swatch[data-tint="0"]{background:var(--arch-cheese-t0)}
.arch-lab .arch-cheese-swatch[data-tint="1"]{background:var(--arch-cheese-t1)}
.arch-lab .arch-cheese-swatch[data-tint="2"]{background:var(--arch-cheese-t2)}
.arch-lab .arch-cheese-swatch[data-tint="3"]{background:var(--arch-cheese-t3)}
.arch-lab .arch-cheese-name{flex:1 1 10em;min-width:0;font-weight:600;color:var(--arch-ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.arch-lab .arch-cheese-ops{display:flex;gap:6px;flex-wrap:wrap}
.arch-lab .arch-cheese-op{padding-inline:12px;font-variant-numeric:tabular-nums}
.arch-lab .arch-cheese-factors[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-cheese-factors[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab .arch-cheese-factortext{color:var(--arch-ink)}
.arch-lab .arch-cheese-result .arch-readouts dd{white-space:normal}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-cheese-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:480px){.arch-lab .arch-cheese-group{padding:8px 10px}.arch-lab .arch-cheese-ops{flex:1 1 100%}.arch-lab .arch-cheese-op{flex:1 1 auto}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-cheese-stage{transition:none}}

/* 2023–2024 regional, problem 10 — lines over the marked points of a triangle (labs/24r-10-layers.mjs). Own colours:
   one per direction of lines (∥ BC blue, ∥ CA amber, ∥ AB green), set for the light theme and both dark branches;
   everything else goes through --arch-* tokens. The points are transparent round buttons over the SVG. */
.arch-lab .arch-layers{--arch-layers-d0:#2563eb;--arch-layers-d1:#d97706;--arch-layers-d2:#059669}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab .arch-layers{--arch-layers-d0:#93c5fd;--arch-layers-d1:#fbbf24;--arch-layers-d2:#6ee7b7}}
:root[data-design="v2"][data-theme="dark"] .arch-lab .arch-layers{--arch-layers-d0:#93c5fd;--arch-layers-d1:#fbbf24;--arch-layers-d2:#6ee7b7}
.arch-lab .arch-layers-predict{border-top:0;padding-top:0}
.arch-lab .arch-layers-stage{padding:10px;transition:border-color .3s}
.arch-lab .arch-layers-stage.arch-layers-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-layers-board{--ar:1;--d:44px;--wu:7.4;position:relative;width:min(100%,600px,calc(var(--wu) * 72px));margin:auto;aspect-ratio:var(--ar)}
.arch-lab .arch-zoomed .arch-layers-board{width:calc(var(--wu) * 50px);max-width:none}
.arch-lab .arch-stage .arch-layers-svg{position:absolute;inset:0;width:100%;height:100%;max-height:none;overflow:visible}
.arch-lab .arch-layers-field{position:absolute;inset:0}
.arch-lab .arch-layers-pt{position:absolute;width:var(--d);height:var(--d);min-width:0;min-height:0;padding:0;margin:0;border:0;border-radius:50%;background:transparent;transform:translate(-50%,-50%);cursor:pointer;-webkit-tap-highlight-color:transparent}
@media (hover:hover){.arch-lab .arch-layers-pt:hover{background:rgba(127,127,127,.14)}}
.arch-lab .arch-layers-pt:focus-visible{outline:3px solid var(--arch-focus);outline-offset:0}
/* the direction buttons carry a small line in their colour */
.arch-lab .arch-layers-modes button::before{content:'';display:inline-block;width:16px;height:4px;margin-right:6px;border-radius:2px;vertical-align:middle}
.arch-lab .arch-layers-modes button[data-value="0"]::before{background:var(--arch-layers-d0)}
.arch-lab .arch-layers-modes button[data-value="1"]::before{background:var(--arch-layers-d1);transform:rotate(60deg)}
.arch-lab .arch-layers-modes button[data-value="2"]::before{background:var(--arch-layers-d2);transform:rotate(-60deg)}
.arch-lab .arch-layers-modes button[data-value="pt"]::before{width:10px;height:10px;border-radius:50%;background:var(--arch-layers-d0);box-shadow:0 0 0 2px var(--arch-surface),0 0 0 4px var(--arch-layers-d1)}
.arch-lab .arch-layers-key{flex:none}
.arch-lab .arch-layers-advice,.arch-lab .arch-layers-count{color:var(--arch-ink)}
.arch-lab .arch-layers-result .arch-readouts dd{white-space:normal}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-layers-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-layers-stage{transition:none}}

/* 2023–2024 regional, problem 2 — strips 1 × k on an n × n square (labs/24r-2-strips.mjs). The cells are buttons; the
   SVG on top of them (pointer-events: none) draws the strips with the shared piece tints and their lengths. Own colour:
   the fill of the small strip icons in the tray, set for the light theme and both dark branches; everything else goes
   through --arch-* tokens. */
.arch-lab .arch-strips{--arch-strips-mini:#bfdbfe}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab .arch-strips{--arch-strips-mini:#1e40af}}
:root[data-design="v2"][data-theme="dark"] .arch-lab .arch-strips{--arch-strips-mini:#1e40af}
.arch-lab .arch-strips-predict{border-top:0;padding-top:0}
.arch-lab .arch-strips-size input[type=range]{flex:1 1 120px}
/* the tray: one button per strip; the chosen one is pressed, a used one is crossed out, a too-long one is faded */
.arch-lab .arch-strips-tray{display:flex;flex-wrap:wrap;gap:6px}
.arch-lab .arch-strips-strip{display:inline-flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:44px;padding:6px 10px;border-radius:12px;background:var(--arch-surface);color:var(--arch-link);border:1px solid var(--arch-field-line);font-variant-numeric:tabular-nums;line-height:1.2}
.arch-lab .arch-strips-strip .arch-strips-mini{display:block;width:70px;height:7px}
.arch-lab .arch-strips-strip[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-strips-strip.arch-strips-used{text-decoration:line-through;color:var(--arch-muted)}
.arch-lab .arch-strips-strip.arch-strips-used .arch-strips-mini{opacity:.35}
.arch-lab .arch-strips-strip.arch-strips-long{opacity:.6;border-style:dashed}
.arch-lab .arch-strips-stage{padding:10px;transition:border-color .3s}
.arch-lab .arch-strips-stage.arch-strips-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board: row numbers | cells; column numbers on top; a cell is at most 64 px wide */
.arch-lab .arch-strips-board{--n:4;display:grid;grid-template-columns:18px minmax(0,1fr);grid-template-rows:18px auto;width:min(100%,calc(var(--n) * 64px + 18px));margin:auto}
.arch-lab .arch-zoomed .arch-strips-board{width:calc(var(--n) * 48px + 18px);max-width:none}
.arch-lab .arch-strips-collabels{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));align-items:end;padding-bottom:2px}
.arch-lab .arch-strips-rowlabels{display:grid;grid-template-rows:repeat(var(--n),minmax(0,1fr))}
.arch-lab .arch-strips-collabels span,.arch-lab .arch-strips-rowlabels span{display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--arch-muted);font-variant-numeric:tabular-nums}
.arch-lab .arch-strips-field{position:relative;aspect-ratio:1}
.arch-lab .arch-strips-cells{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));grid-template-rows:repeat(var(--n),minmax(0,1fr));aspect-ratio:1;box-shadow:0 0 0 2px var(--arch-fig-line);background:var(--arch-surface)}
.arch-lab .arch-strips-cell{position:relative;min-width:0;min-height:0;width:100%;height:100%;padding:0;margin:0;border:0;box-shadow:inset -1px -1px 0 var(--arch-grid);border-radius:0;background:var(--arch-surface);color:var(--arch-ink);line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}
@media (hover:hover){.arch-lab .arch-strips-cell:hover:not(.arch-strips-on){filter:brightness(.94)}}
.arch-lab .arch-strips-cell:focus-visible{outline:4px solid var(--arch-focus);outline-offset:-4px;z-index:2}
/* the preview of the next tap: green — the strip fits, red — these cells are busy or the strip does not fit */
.arch-lab .arch-strips-cell.arch-strips-next{box-shadow:inset 0 0 0 4px var(--arch-good),inset -1px -1px 0 var(--arch-grid);z-index:1}
.arch-lab .arch-strips-cell.arch-strips-nope{box-shadow:inset 0 0 0 4px var(--arch-bad),inset -1px -1px 0 var(--arch-grid);z-index:1}
/* a cut-off cell: no remaining strip can cover it */
.arch-lab .arch-strips-cell.arch-strips-dead{background-image:repeating-linear-gradient(45deg,var(--arch-bad-bg) 0 5px,transparent 5px 10px);box-shadow:inset 0 0 0 2px var(--arch-bad)}
.arch-lab .arch-stage .arch-strips-overlay{position:absolute;inset:0;width:100%;height:100%;max-height:none;pointer-events:none;overflow:visible}
.arch-lab .arch-strips-count[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-strips-count[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab .arch-strips-key{flex:none}
.arch-lab .arch-strips-counttext{color:var(--arch-ink)}
.arch-lab .arch-strips-result .arch-readouts dd{white-space:normal}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-strips-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-strips-stage,.arch-lab .arch-strips-cell{transition:none}}

/* 2023–2024 regional stage, day 1, problem 3 «Три отрезка и угол» — lab labs/24r-3-side.mjs. The given segments
   AK, BL, CM keep their object colour (green) in both themes, the pair of compared angles LKB and AMK is orange,
   the angle AKM blue; the shaded triangles of the solution are translucent so the lines stay visible. Everything
   else goes through the --arch-* variables of lab.css. */
.arch-lab{--arch-side-given:#047857;--arch-side-pair:#c2410c;--arch-side-akm:#2563eb;--arch-side-handle:#244974;--arch-side-tri-a:rgba(59,130,246,.2);--arch-side-tri-b:rgba(245,158,11,.26)}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-side-given:#6ee7b7;--arch-side-pair:#fdba74;--arch-side-akm:#93c5fd;--arch-side-handle:#fbbf24;--arch-side-tri-a:rgba(96,165,250,.28);--arch-side-tri-b:rgba(251,191,36,.3)}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-side-given:#6ee7b7;--arch-side-pair:#fdba74;--arch-side-akm:#93c5fd;--arch-side-handle:#fbbf24;--arch-side-tri-a:rgba(96,165,250,.28);--arch-side-tri-b:rgba(251,191,36,.3)}
.arch-lab .arch-side-predict{border-top:0;padding-top:0}
.arch-lab .arch-side-predict .arch-label{margin:0}
.arch-lab .arch-side-size input[type=range]{flex:1 1 120px}
.arch-lab .arch-side-stage{transition:border-color .3s}
.arch-lab .arch-side-stage.arch-side-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-side-stage.arch-side-example{border-style:dashed}
.arch-lab .arch-side-stage .arch-side-svg{max-height:none;user-select:none;-webkit-user-select:none}
/* «Крупные клетки» on a phone: the figure keeps its full size (1 svg unit = 1 px) and scrolls sideways in the frame */
.arch-lab .arch-zoomed .arch-side-svg{width:520px;max-width:none}
.arch-lab .arch-side-svg text{font-weight:600;paint-order:stroke;stroke:var(--arch-surface);stroke-width:3px;stroke-linejoin:round}
.arch-lab .arch-side-handle{cursor:grab;touch-action:none}
.arch-lab .arch-side-dragging .arch-side-handle{cursor:grabbing}
.arch-lab .arch-side-aux-btn[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-side-aux-btn[aria-pressed=true]::before{content:'✓\00a0' / ''}
.arch-lab .arch-side-key{flex:none}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-side-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-side-stage{transition:none}}

/* Euler 2023–2024, regional stage, problem 4 «Круг Ани и Бори» — lab labs/24r-4-ring.mjs. The red and blue points
   keep their object colours in both themes (white numbers on them, contrast ≥ 4.5:1); the arcs of one-colour pairs
   are lighter tints of those colours with light and dark values; white points and the frame of a finished game have
   own variables (same theme selectors as lab.css). Everything else goes through --arch-* variables. */
.arch-lab{--arch-ring-red:#dc2626;--arch-ring-red-edge:#991b1b;--arch-ring-blue:#2563eb;--arch-ring-blue-edge:#1e3a8a;--arch-ring-red-arc:#fca5a5;--arch-ring-blue-arc:#93c5fd;--arch-ring-white:#ffffff;--arch-ring-white-edge:#64748b;--arch-ring-white-ink:#1f2937;--arch-ring-engine-bg:#f1f5f9}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-ring-red-edge:#fca5a5;--arch-ring-blue-edge:#93c5fd;--arch-ring-red-arc:#b91c1c;--arch-ring-blue-arc:#1d4ed8;--arch-ring-white:#2b3240;--arch-ring-white-edge:#94a3b8;--arch-ring-white-ink:#e5edf7;--arch-ring-engine-bg:#262c38}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-ring-red-edge:#fca5a5;--arch-ring-blue-edge:#93c5fd;--arch-ring-red-arc:#b91c1c;--arch-ring-blue-arc:#1d4ed8;--arch-ring-white:#2b3240;--arch-ring-white-edge:#94a3b8;--arch-ring-white-ink:#e5edf7;--arch-ring-engine-bg:#262c38}
.arch-lab .arch-ring-predict{border-top:0;padding-top:0}
.arch-lab .arch-ring-predict .arch-label{margin:0}
.arch-lab .arch-ring-predict input[type=number]{width:96px}
.arch-lab .arch-ring-turn{margin:0}
.arch-lab .arch-ring-stage{transition:border-color .3s}
.arch-lab .arch-ring-stage.arch-ring-done{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board is square; on wide screens it is 400 px (points up to 56 px), on narrow ones it follows the number of
   points («big» keeps every point 44 px, the zoom helper scrolls it) */
.arch-lab .arch-ring-board{--big:260px;position:relative;width:min(100%,max(var(--big),400px));aspect-ratio:1;margin:0 auto}
.arch-lab .arch-zoomed .arch-ring-board{width:var(--big)}
.arch-lab .arch-stage .arch-ring-svg{position:absolute;left:0;top:0;width:100%;height:100%;max-height:none;overflow:visible;pointer-events:none}
.arch-lab .arch-ring-point{position:absolute;z-index:1;display:grid;place-items:center;min-width:0;min-height:0;padding:0;border-radius:50%;border:2px solid var(--arch-ring-white-edge);background:var(--arch-ring-white);color:var(--arch-ring-white-ink);line-height:1;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:0 2px 4px rgba(15,23,42,.18)}
.arch-lab .arch-ring-point[data-colour="R"]{border-color:var(--arch-ring-red-edge);background-color:var(--arch-ring-red);background-image:radial-gradient(circle at 31% 27%,rgba(255,255,255,.55) 0 11%,rgba(255,255,255,0) 32%);color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.4)}
.arch-lab .arch-ring-point[data-colour="B"]{border-color:var(--arch-ring-blue-edge);background-color:var(--arch-ring-blue);background-image:radial-gradient(circle at 31% 27%,rgba(255,255,255,.55) 0 11%,rgba(255,255,255,0) 32%);color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.4)}
.arch-lab .arch-ring-last{animation:arch-ring-pulse .5s ease-out both}
@keyframes arch-ring-pulse{from{stroke-width:6}to{stroke-width:3}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-ring-last{animation:none}.arch-lab .arch-ring-stage{transition:none}}
/* colour chooser: a swatch before the word */
.arch-lab .arch-ring-colours .arch-toggle button{display:inline-flex;align-items:center;gap:8px}
.arch-lab .arch-ring-swatch{display:inline-block;width:18px;height:18px;border-radius:50%;flex:none;border:2px solid var(--arch-ring-red-edge);background:var(--arch-ring-red)}
.arch-lab .arch-ring-swatch[data-colour="B"]{border-color:var(--arch-ring-blue-edge);background:var(--arch-ring-blue)}
.arch-lab .arch-ring-key{flex:none}
.arch-lab .arch-ring-bi{color:var(--arch-accent)}
.arch-lab .arch-ring-engine{background:var(--arch-ring-engine-bg);border-radius:10px;padding:6px 10px}
/* the live region: only the sentences that changed for screen readers; the visible result box stays quiet */
.arch-lab .arch-ring-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* the move log */
.arch-lab .arch-ring-log{border:1px solid var(--arch-soft-line);border-radius:14px;padding:4px 14px;background:var(--arch-surface);color:var(--arch-ink)}
.arch-lab .arch-ring-log[hidden]{display:none}
.arch-lab .arch-ring-log summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600;color:var(--arch-label)}
.arch-lab .arch-ring-log summary:focus-visible{outline:3px solid var(--arch-focus);outline-offset:2px;border-radius:8px}
.arch-lab .arch-ring-log .arch-log{padding:0 0 10px 1.4em;font-size:15px;line-height:1.5}

/* 2023–2024 regional stage, problem 5 «Три числа и остаток 4» — lab labs/24r-5-triple.mjs. The four remainder tints
   r0…r3 are the column tints of the solution figure (remainders 0, 1, 2, 3 modulo 4; the dark theme keeps their hues);
   everything else goes through --arch-* variables. */
.arch-lab{--arch-triple-r0:#dbeafe;--arch-triple-r1:#bbf7d0;--arch-triple-r2:#fecaca;--arch-triple-r3:#fde68a;--arch-triple-own:#d1fae5;--arch-triple-own-ink:#047857;--arch-triple-ex:#ede9fe;--arch-triple-ex-ink:#6d28d9}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-triple-r0:#27325a;--arch-triple-r1:#1a4130;--arch-triple-r2:#5a2323;--arch-triple-r3:#4a3b16;--arch-triple-own:#134e3a;--arch-triple-own-ink:#6ee7b7;--arch-triple-ex:#3d2c5c;--arch-triple-ex-ink:#c4b5fd}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-triple-r0:#27325a;--arch-triple-r1:#1a4130;--arch-triple-r2:#5a2323;--arch-triple-r3:#4a3b16;--arch-triple-own:#134e3a;--arch-triple-own-ink:#6ee7b7;--arch-triple-ex:#3d2c5c;--arch-triple-ex-ink:#c4b5fd}
.arch-lab .arch-triple-predict{border-top:0;padding-top:0}
.arch-lab .arch-triple-predict .arch-label{margin:0}
.arch-lab .arch-triple-preset[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
/* one row per number: the letter, −1, the field, +1 */
.arch-lab .arch-triple-row{flex-wrap:nowrap}
.arch-lab .arch-triple-var{flex:none;width:1.4em;font-size:20px;font-style:italic;font-weight:600;text-align:center;color:var(--arch-label)}
.arch-lab .arch-triple-step{flex:none;min-width:52px;padding-inline:10px;font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab #arch-triple-a,.arch-lab #arch-triple-b,.arch-lab #arch-triple-c{flex:1 1 6em;width:6em;max-width:100%;font-variant-numeric:tabular-nums}
.arch-lab #arch-triple-t{flex:1 1 10em;width:10em;max-width:100%}
.arch-lab .arch-triple-msg[hidden]{display:none}
.arch-lab .arch-triple-stage{display:grid;gap:12px;transition:border-color .3s}
.arch-lab .arch-triple-stage.arch-triple-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
.arch-lab .arch-triple-formula{margin:0;display:grid;gap:2px;font-size:17px;color:var(--arch-ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.arch-lab .arch-triple-f1{font-weight:600}
.arch-lab .arch-triple-f2{color:var(--arch-muted)}
.arch-lab .arch-triple-f3{font-size:20px;font-weight:700}
/* remainders modulo 4: the sentence and the 2×2 table of a² − b² */
.arch-lab .arch-triple-rem{display:grid;gap:8px;padding:8px 10px;border:1px dashed var(--arch-field-line);border-radius:8px}
.arch-lab .arch-triple-rem[hidden]{display:none}
.arch-lab .arch-triple-remtext{margin:0;font-size:15px;color:var(--arch-ink);overflow-wrap:anywhere}
.arch-lab .arch-triple-table{margin:0;font-size:15px}
.arch-lab .arch-triple-table caption{caption-side:top;padding-bottom:4px;font-size:14px;color:var(--arch-muted);text-align:left}
.arch-lab .arch-triple-table td{min-width:2.6em;font-weight:600}
.arch-lab .arch-triple-table td.arch-triple-cur{background:var(--arch-pressed-bg);box-shadow:inset 0 0 0 2px var(--arch-accent)}
/* the strip 1…40: five rows of eight, the columns are the remainders modulo 4 */
.arch-lab .arch-triple-strip{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;max-width:480px;margin:0 auto;width:100%}
.arch-lab .arch-triple-cell{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;padding:2px 0;border:1px solid var(--arch-grid);border-radius:8px;background:var(--arch-surface);color:var(--arch-ink);font-variant-numeric:tabular-nums;line-height:1.1}
.arch-lab .arch-triple-num{font-size:15px;font-weight:600}
.arch-lab .arch-triple-mark{position:absolute;right:3px;top:1px;font-size:12px;font-weight:700;line-height:1}
.arch-lab .arch-triple-r{font-size:10px;color:var(--arch-muted);min-height:0}
.arch-lab .arch-triple-r:empty{display:none}
.arch-lab .arch-triple-cell[data-made="own"]{background:var(--arch-triple-own);border-color:var(--arch-triple-own-ink)}
.arch-lab .arch-triple-cell[data-made="own"] .arch-triple-mark{color:var(--arch-triple-own-ink)}
.arch-lab .arch-triple-cell[data-made="example"]{background:var(--arch-triple-ex);border-color:var(--arch-triple-ex-ink)}
.arch-lab .arch-triple-cell[data-made="example"] .arch-triple-mark{color:var(--arch-triple-ex-ink)}
.arch-lab .arch-triple-cell[data-r="0"]{background:var(--arch-triple-r0)}
.arch-lab .arch-triple-cell[data-r="1"]{background:var(--arch-triple-r1)}
.arch-lab .arch-triple-cell[data-r="2"]{background:var(--arch-triple-r2)}
.arch-lab .arch-triple-cell[data-r="3"]{background:var(--arch-triple-r3)}
.arch-lab .arch-triple-cell.arch-triple-target{box-shadow:0 0 0 3px var(--arch-accent) inset}
.arch-lab .arch-triple-cell.arch-triple-now{outline:3px solid var(--arch-primary-bg);outline-offset:-1px}
.arch-lab .arch-triple-cell.arch-triple-now .arch-triple-num{text-decoration:underline;text-decoration-thickness:2px}
/* legend keys */
.arch-lab .arch-triple-key{display:inline-flex;align-items:center;justify-content:center;flex:none;width:22px;height:18px;border-radius:5px;border:1px solid var(--arch-grid);font-size:12px;font-weight:700;background:var(--arch-surface)}
.arch-lab .arch-triple-key[data-k="own"]{background:var(--arch-triple-own);color:var(--arch-triple-own-ink);border-color:var(--arch-triple-own-ink)}
.arch-lab .arch-triple-key[data-k="example"]{background:var(--arch-triple-ex);color:var(--arch-triple-ex-ink);border-color:var(--arch-triple-ex-ink)}
.arch-lab .arch-triple-key[data-k="target"]{box-shadow:0 0 0 3px var(--arch-accent) inset}
.arch-lab .arch-triple-key[data-k="now"]{outline:3px solid var(--arch-primary-bg);outline-offset:-1px}
.arch-lab .arch-triple-rem-btn[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-triple-rem-btn[aria-pressed=true]::before{content:'✓\00a0' / ''}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-triple-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-triple-stage{transition:none}}
@media (max-width:360px){.arch-lab .arch-triple-strip{gap:3px}.arch-lab .arch-triple-num{font-size:14px}.arch-lab .arch-triple-step{min-width:44px;padding-inline:6px}}

/* Popov Academy — 2023/24 regional stage, problem 6 «Пятнадцать чисел подряд» (labs/24r-6-fifteen.mjs).
   Own colours: the two group tints of the strip (the k smallest numbers and the others) and the chart line; the dark
   theme keeps their hues; everything else goes through --arch-* variables. Own colours are set for the light theme
   and both dark branches. */
.arch-lab{--arch-fifteen-small:#dbeafe;--arch-fifteen-small-edge:#60a5fa;--arch-fifteen-big:#fde68a;--arch-fifteen-big-edge:#f59e0b;--arch-fifteen-line:#94a3b8}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-fifteen-small:#1e3a5f;--arch-fifteen-small-edge:#60a5fa;--arch-fifteen-big:#4a3b16;--arch-fifteen-big-edge:#f59e0b;--arch-fifteen-line:#64748b}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-fifteen-small:#1e3a5f;--arch-fifteen-small-edge:#60a5fa;--arch-fifteen-big:#4a3b16;--arch-fifteen-big-edge:#f59e0b;--arch-fifteen-line:#64748b}
.arch-lab .arch-fifteen-predict{border-top:0;padding-top:0}
.arch-lab .arch-fifteen-predict .arch-label{margin:0}
.arch-lab .arch-fifteen-block{display:grid;gap:8px;min-width:0}
.arch-lab .arch-fifteen-err:empty{display:none}
.arch-lab .arch-fifteen-srow{flex-wrap:nowrap}
.arch-lab .arch-fifteen-srow input[type=range]{flex:1 1 120px}
.arch-lab .arch-fifteen-srow input[type=text]{flex:0 0 84px;width:84px;min-width:72px;text-align:center;font-variant-numeric:tabular-nums}
/* the strip of 15 numbers: chips wrap into rows on phones; the first k are the smallest */
.arch-lab .arch-fifteen-strip{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;list-style:none;font-variant-numeric:tabular-nums}
.arch-lab .arch-fifteen-chip{flex:0 0 auto;min-width:44px;height:38px;padding:0 6px;display:flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--edge);background:var(--fill);color:var(--arch-ink);font-weight:600;font-size:15px}
.arch-lab .arch-fifteen-chip[data-group="small"],.arch-lab .arch-fifteen-key[data-group="small"]{--fill:var(--arch-fifteen-small);--edge:var(--arch-fifteen-small-edge)}
.arch-lab .arch-fifteen-chip[data-group="big"],.arch-lab .arch-fifteen-key[data-group="big"]{--fill:var(--arch-fifteen-big);--edge:var(--arch-fifteen-big-edge)}
.arch-lab .arch-fifteen-key{display:inline-block;width:18px;height:18px;border-radius:5px;border:1px solid var(--edge);background:var(--fill);flex-shrink:0}
/* the chart */
.arch-lab .arch-fifteen-stage svg{max-width:560px;margin:0 auto;overflow:visible}
.arch-lab .arch-fifteen-grid line{stroke:var(--arch-grid);stroke-width:1;stroke-dasharray:3 4}
.arch-lab .arch-fifteen-axis{stroke:var(--arch-fig-line);stroke-width:1.5}
.arch-lab svg text.arch-fifteen-label{fill:var(--arch-muted)}
.arch-lab .arch-fifteen-zero{stroke:var(--arch-ink);stroke-width:1.5}
.arch-lab svg text.arch-fifteen-zero-label{fill:var(--arch-ink);font-weight:600}
.arch-lab .arch-fifteen-line{fill:none;stroke:var(--arch-fifteen-line);stroke-width:1.5}
.arch-lab .arch-fifteen-pt{fill:var(--arch-fifteen-line);stroke:none}
.arch-lab .arch-fifteen-dot{fill:var(--arch-accent);stroke:var(--arch-surface);stroke-width:1.5}
.arch-lab .arch-fifteen-dot[data-source="model"]{fill:var(--arch-surface);stroke:var(--arch-accent);stroke-width:2}
.arch-lab .arch-fifteen-guide{stroke:var(--arch-accent);stroke-width:1;stroke-dasharray:3 3}
.arch-lab .arch-fifteen-ring{fill:none;stroke:var(--arch-accent);stroke-width:2.5}
.arch-lab svg text.arch-fifteen-ring-label{fill:var(--arch-accent);paint-order:stroke;stroke:var(--arch-surface);stroke-width:3px;stroke-linejoin:round}
.arch-lab svg text.arch-fifteen-ring-zero{fill:var(--arch-good)}
.arch-lab .arch-fifteen-all-btn[aria-pressed=true]{background:var(--arch-pressed-bg);border-color:var(--arch-pressed-line);box-shadow:inset 0 0 0 1px var(--arch-pressed-line);font-weight:600}
.arch-lab .arch-fifteen-all-btn[aria-pressed=true]::before{content:'✓\00a0' / ''}
/* readouts of the verdict: long values wrap */
.arch-lab .arch-fifteen-readouts div{flex-wrap:wrap}
.arch-lab .arch-fifteen-readouts dt{flex:none}
.arch-lab .arch-fifteen-readouts dd{white-space:normal;overflow-wrap:anywhere}
.arch-lab .arch-checks li.arch-fifteen-small::before,.arch-lab .arch-checks li.arch-fifteen-big::before{content:'';flex-shrink:0;width:14px;height:14px;margin-top:5px;border-radius:4px;border:1px solid var(--edge);background:var(--fill)}
.arch-lab .arch-checks li.arch-fifteen-small{--fill:var(--arch-fifteen-small);--edge:var(--arch-fifteen-small-edge)}
.arch-lab .arch-checks li.arch-fifteen-big{--fill:var(--arch-fifteen-big);--edge:var(--arch-fifteen-big-edge)}
/* another split */
.arch-lab .arch-fifteen-krow{flex-wrap:wrap}
.arch-lab .arch-fifteen-k{font-weight:600;color:var(--arch-ink);min-width:9em;text-align:center;font-variant-numeric:tabular-nums}
.arch-lab.arch-fifteen-other-split .arch-fifteen-split,[data-arch-lab-body].arch-fifteen-other-split .arch-fifteen-split{border-top-color:var(--arch-accent)}
/* the live region: one sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-fifteen-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:480px){.arch-lab .arch-fifteen-srow input[type=text]{flex-basis:76px;width:76px;padding:8px 6px}.arch-lab .arch-fifteen-chip{min-width:42px;font-size:14px}.arch-lab .arch-fifteen-k{min-width:0;flex:1 1 100%;order:-1}}

/* 2023–2024 региональный этап, задача 7 «Десять чисел подряд и все цифры поровну» — lab labs/24r-7-tenrow.mjs.
   The digits of the beginnings keep one blue in both themes (as the solution figures); the last digits use the
   shared accent; everything else goes through --arch-* variables. */
.arch-lab{--arch-tenrow-rest:#2563eb;--arch-tenrow-pre-bg:#dbeafe;--arch-tenrow-unit-bg:#ffedd5;--arch-tenrow-new-bg:#fde68a}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-tenrow-rest:#60a5fa;--arch-tenrow-pre-bg:#1e3a5f;--arch-tenrow-unit-bg:#4a2a0e;--arch-tenrow-new-bg:#5a4612}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-tenrow-rest:#60a5fa;--arch-tenrow-pre-bg:#1e3a5f;--arch-tenrow-unit-bg:#4a2a0e;--arch-tenrow-new-bg:#5a4612}
.arch-lab .arch-tenrow-predict{border-top:0;padding-top:0}
.arch-lab .arch-tenrow-predict .arch-label{margin:0}
.arch-lab #arch-tenrow-start{flex:1 1 11em;width:11em;min-width:0;max-width:100%;box-sizing:border-box;font-variant-numeric:tabular-nums;letter-spacing:.04em}
/* the digit keys: a keypad of 44 px targets; the columns fit the lab's width (five per row in a 280 px column) */
.arch-lab .arch-tenrow-keys{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:6px;max-width:372px;min-width:0}
.arch-lab .arch-tenrow-key{min-width:0;width:100%;padding:8px 0;font-size:18px;font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-tenrow-back{font-size:20px}
.arch-lab .arch-tenrow-step{min-width:64px;font-weight:600;font-variant-numeric:tabular-nums}
.arch-lab .arch-tenrow-stage{display:grid;gap:10px;min-width:0;transition:border-color .3s}
.arch-lab .arch-tenrow-stage.arch-tenrow-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the ten numbers: digit rows, the last digit marked; the second beginning (after a carry) is set off by a line */
.arch-lab .arch-tenrow-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:4px 12px;padding:2px 4px 0;min-width:0}
.arch-lab .arch-tenrow-num{display:flex;align-items:center;min-width:0;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:16px;line-height:1.25;letter-spacing:.06em;white-space:nowrap}
.arch-lab .arch-tenrow-pre{display:inline-block;padding:3px 4px 3px 6px;border-radius:6px 0 0 6px;background:var(--arch-tenrow-pre-bg);color:var(--arch-ink)}
.arch-lab .arch-tenrow-pre:empty{display:none}
.arch-lab .arch-tenrow-unit{display:inline-block;padding:3px 7px 3px 5px;border-radius:0 6px 6px 0;background:var(--arch-tenrow-unit-bg);color:var(--arch-ink);font-weight:700}
.arch-lab .arch-tenrow-pre:empty+.arch-tenrow-unit{border-radius:6px}
.arch-lab .arch-tenrow-num[data-g="1"] .arch-tenrow-pre{box-shadow:inset 0 0 0 1.5px var(--arch-tenrow-rest)}
.arch-lab .arch-tenrow-new .arch-tenrow-unit{animation:arch-tenrow-new .6s ease-out 1}
@keyframes arch-tenrow-new{0%{background:var(--arch-tenrow-new-bg)}100%{}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-tenrow-new .arch-tenrow-unit{animation:none}.arch-lab .arch-tenrow-stage{transition:none}}
/* the histogram is drawn at 1:1 from the measured width */
.arch-lab .arch-tenrow-charthost{position:relative;width:100%;min-width:0}
.arch-lab .arch-stage .arch-tenrow-chart{display:block;width:100%;height:auto;max-height:none;overflow:visible}
.arch-lab .arch-tenrow-key-ico{flex:none}
.arch-lab .arch-tenrow-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.arch-lab .arch-tenrow-chip{display:inline-block;padding:2px 10px;border-radius:999px;border:1px solid var(--arch-good);background:var(--arch-ok-bg);color:var(--arch-ink);font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-tenrow-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:360px){.arch-lab .arch-tenrow-list{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}.arch-lab .arch-tenrow-num{font-size:15px;letter-spacing:.03em}.arch-lab #arch-tenrow-start{flex:1 1 100%;width:100%}}

/* Euler 2023–2024, regional stage, problem 8 «Суммы соседей на доске» — lab labs/24r-8-sums.mjs. The seats (numbers on
   the circle) and the sum tags outside it go through --arch-* variables; the largest number gets its own warm tint and
   the glow of visited seats its own colour, with light and dark values (same theme selectors as lab.css). */
.arch-lab{--arch-sums-max-bg:#fde68a;--arch-sums-max-edge:#b45309;--arch-sums-zero-ink:#5b6b82;--arch-sums-visited:rgba(194,65,12,.18)}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-sums-max-bg:#4a3b16;--arch-sums-max-edge:#fbbf24;--arch-sums-zero-ink:#aab6c8;--arch-sums-visited:rgba(251,146,60,.26)}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-sums-max-bg:#4a3b16;--arch-sums-max-edge:#fbbf24;--arch-sums-zero-ink:#aab6c8;--arch-sums-visited:rgba(251,146,60,.26)}
.arch-lab .arch-sums-predict{border-top:0;padding-top:0}
.arch-lab .arch-sums-predict .arch-label{margin:0}
.arch-lab .arch-sums-predict input[type=number]{width:96px}
.arch-lab .arch-sums-stage{transition:border-color .3s}
.arch-lab .arch-sums-stage.arch-sums-ok{border-color:var(--arch-good);box-shadow:0 0 0 1px var(--arch-good) inset}
/* the board is square; on wide screens it is 400 px (seats up to 56 px), on narrow ones it follows the number of
   places («big» keeps every seat 44 px, the zoom helper scrolls it) */
.arch-lab .arch-sums-board{--big:240px;position:relative;width:min(100%,max(var(--big),400px));aspect-ratio:1;margin:0 auto}
.arch-lab .arch-zoomed .arch-sums-board{width:var(--big)}
.arch-lab .arch-stage .arch-sums-svg{position:absolute;left:0;top:0;width:100%;height:100%;max-height:none;overflow:visible;pointer-events:none}
.arch-lab .arch-sums-seat{position:absolute;z-index:1;display:grid;place-items:center;min-width:0;min-height:0;padding:0;border-radius:50%;border:2px solid var(--arch-field-line);background:var(--arch-surface);color:var(--arch-ink);line-height:1;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:0 2px 4px rgba(15,23,42,.18)}
.arch-lab .arch-sums-seat[data-role="max"]{background:var(--arch-sums-max-bg);border-color:var(--arch-sums-max-edge)}
.arch-lab .arch-sums-seat[data-role="zero"]{color:var(--arch-sums-zero-ink)}
.arch-lab .arch-sums-seat.arch-sums-over{border-style:dashed}
.arch-lab .arch-sums-seat.arch-sums-visited{box-shadow:0 0 0 5px var(--arch-sums-visited)}
/* the sums on the board: tags outside the circle */
.arch-lab .arch-sums-tag rect{fill:var(--arch-surface);stroke:var(--arch-field-line);stroke-width:1.5}
.arch-lab .arch-sums-tag text{fill:var(--arch-ink)}
.arch-lab .arch-sums-tag-ok rect{stroke:var(--arch-good)}
.arch-lab .arch-sums-tag-bad rect{fill:var(--arch-bad-bg);stroke:var(--arch-bad);stroke-width:2}
.arch-lab .arch-sums-tag-bad text{fill:var(--arch-bad)}
.arch-lab .arch-sums-tag-sel rect{stroke:var(--arch-accent);stroke-width:2.5}
.arch-lab .arch-sums-new{stroke-dasharray:1;animation:arch-sums-draw .4s ease-out both}
@keyframes arch-sums-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-sums-new{animation:none}.arch-lab .arch-sums-stage{transition:none}}
/* the chosen place and its −1 / +1 */
.arch-lab .arch-sums-edit{justify-content:center}
.arch-lab .arch-sums-pick{flex:1 1 9em;min-width:0}
.arch-lab .arch-sums-bump{min-width:72px;font-size:20px;font-weight:700;padding-inline:14px}
.arch-lab .arch-sums-edit .arch-primary.arch-sums-bump{flex:0 0 auto}
.arch-lab .arch-sums-chain{min-width:11em}
.arch-lab .arch-sums-key{flex:none}
.arch-lab .arch-sums-around{color:var(--arch-muted);font-size:15px}
/* the live region: only the sentences that changed for screen readers; the visible result box stays quiet */
.arch-lab .arch-sums-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (max-width:480px){.arch-lab .arch-sums-chain{min-width:0;flex:1 1 auto}}

/* 2023–2024 regional stage, day 2, problem 9 «Точка K и два отрезка» — lab labs/24r-9-reflect.mjs. The two measured
   segments keep their object colours in both themes (BQ blue, CP orange — the accent); the pair of triangles BCQ
   and CBP and the equilateral triangles PBM, QCM are translucent tints so the lines stay visible; the turned copy of
   PMC is orange. Everything else goes through the --arch-* variables of lab.css. */
.arch-lab{--arch-reflect-bq:#2563eb;--arch-reflect-cp:#c2410c;--arch-reflect-handle:#244974;--arch-reflect-tri-q:rgba(59,130,246,.18);--arch-reflect-tri-p:rgba(249,115,22,.2);--arch-reflect-eq-a:rgba(34,197,94,.22);--arch-reflect-eq-b:rgba(139,92,246,.18);--arch-reflect-copy:rgba(249,115,22,.28)}
@media (prefers-color-scheme: dark){:root[data-design="v2"]:not([data-theme="light"]) .arch-lab{--arch-reflect-bq:#93c5fd;--arch-reflect-cp:#fdba74;--arch-reflect-handle:#fbbf24;--arch-reflect-tri-q:rgba(96,165,250,.26);--arch-reflect-tri-p:rgba(251,146,60,.26);--arch-reflect-eq-a:rgba(74,222,128,.24);--arch-reflect-eq-b:rgba(167,139,250,.26);--arch-reflect-copy:rgba(251,146,60,.32)}}
:root[data-design="v2"][data-theme="dark"] .arch-lab{--arch-reflect-bq:#93c5fd;--arch-reflect-cp:#fdba74;--arch-reflect-handle:#fbbf24;--arch-reflect-tri-q:rgba(96,165,250,.26);--arch-reflect-tri-p:rgba(251,146,60,.26);--arch-reflect-eq-a:rgba(74,222,128,.24);--arch-reflect-eq-b:rgba(167,139,250,.26);--arch-reflect-copy:rgba(251,146,60,.32)}
.arch-lab .arch-reflect-predict{border-top:0;padding-top:0}
.arch-lab .arch-reflect-predict .arch-label,.arch-lab .arch-reflect-modes .arch-label{margin:0}
.arch-lab .arch-reflect-turn input[type=range]{flex:1 1 140px}
.arch-lab .arch-reflect-turn output{font-weight:600;color:var(--arch-ink);min-width:3em;font-variant-numeric:tabular-nums}
.arch-lab .arch-reflect-stage{transition:border-color .3s}
.arch-lab .arch-reflect-stage.arch-reflect-example{border-style:dashed}
.arch-lab .arch-reflect-stage .arch-reflect-svg{max-height:none;max-width:560px;margin:0 auto;user-select:none;-webkit-user-select:none}
/* «Крупные клетки» on a phone: the figure keeps its full size (1 svg unit = 1 px) and scrolls sideways in the frame */
.arch-lab .arch-zoomed .arch-reflect-svg{width:480px;max-width:none}
.arch-lab .arch-reflect-svg text{font-weight:600;paint-order:stroke;stroke:var(--arch-surface);stroke-width:3px;stroke-linejoin:round}
.arch-lab .arch-reflect-handle{cursor:grab;touch-action:none;outline-offset:2px}
.arch-lab .arch-reflect-dragging .arch-reflect-handle{cursor:grabbing}
.arch-lab .arch-reflect-block{min-height:1.2em;font-weight:600;color:var(--arch-bad)}
.arch-lab .arch-reflect-block:empty{display:none}
.arch-lab .arch-reflect-key{flex:none}
/* the live region: one changed sentence for screen readers; the visible result box stays quiet */
.arch-lab .arch-reflect-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@media (prefers-reduced-motion: reduce){.arch-lab .arch-reflect-stage{transition:none}}