.block-stage{--block-right-bg:var(--mint);--block-wrong-bg:var(--apricot)}body:has(.block-practice) .practice-heading h1{overflow-wrap:anywhere;text-wrap:wrap}.block-practice .board-top>*{min-width:0}.block-practice #block-end{white-space:normal;overflow-wrap:anywhere;max-width:100%}.block-figure{min-width:0;margin:16px 0}#block-drawing{place-items:center;min-height:260px;padding:8px;display:grid}#block-drawing svg{width:100%;max-width:380px;height:auto;display:block}#block-prompt{color:var(--ink);text-align:center;margin:12px 0 0;font-size:1rem;font-weight:600}.block-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.block-option{border:1px solid var(--control-border);background:var(--card);min-width:0;min-height:56px;color:var(--ink);font-variant-numeric:tabular-nums;cursor:pointer;touch-action:manipulation;border-radius:12px;padding:12px 6px;font:650 1.15rem/1 inherit}.block-option:disabled{opacity:1;cursor:default}.block-option:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.block-option[data-state=right]{border-color:var(--good);background:var(--block-right-bg);color:var(--ink)}.block-option[data-state=wrong]{border-color:var(--bad);background:var(--block-wrong-bg);color:var(--ink)}.block-feedback{min-height:1.5rem;color:var(--ink);text-align:center;margin:12px 0 0;font-weight:600}.block-feedback[data-state=right]{color:var(--good)}.block-feedback[data-state=wrong]{color:var(--bad)}.block-terminal-error{text-align:center}.block-terminal-error p{color:var(--muted)}#block-result-note{color:var(--ink);font-weight:600}@media (hover:hover){.block-option:not(:disabled):hover{background:var(--accent-soft)}}@media (width<=480px){#block-drawing{min-height:210px}.block-options{gap:8px}.block-option{font-size:1.05rem}}@media (width<=381px){body:has(.block-practice[data-phase=setup]) .practice-heading{margin-bottom:10px}body:has(.block-practice[data-phase=setup]) .practice-heading h1{margin-bottom:7px;font-size:1.65rem;line-height:1.1}body:has(.block-practice[data-phase=setup]) .practice-heading p{font-size:.875rem;line-height:1.35}.block-practice[data-phase=setup] .board-setup{margin-bottom:12px}.block-practice[data-phase=setup] .block-stage{padding-block:10px}.block-practice[data-phase=setup] #block-instruction{margin-block:6px 0;font-size:.875rem;line-height:1.4}.block-practice[data-phase=setup] .board-primary{margin-top:10px}}@media (height<=520px) and (orientation:landscape){.block-stage{padding:10px 12px}.block-practice[data-phase=playing] #block-heading,.block-practice[data-phase=review] #block-heading{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.block-stage .board-top{min-height:44px}.block-stage :is(#block-running,#block-stats){margin-block:0}#block-workspace{grid-template-columns:minmax(0,1.25fr) minmax(190px,.75fr);align-items:center;gap:10px;display:grid}.block-figure{margin:0}#block-drawing{min-height:145px;max-height:170px;padding:0}#block-drawing svg{max-width:250px;max-height:170px}#block-prompt{margin-top:2px;font-size:.875rem;line-height:1.25}.block-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.block-option{min-height:46px;padding:6px;font-size:1rem}.block-feedback{min-height:1.25rem;margin-top:4px;font-size:.875rem;line-height:1.25}#block-next{min-height:44px;margin-top:4px;padding-block:6px}}@media (forced-colors:active){.block-option[data-state=right]{forced-color-adjust:auto;border:4px double canvastext}.block-option[data-state=wrong]{forced-color-adjust:auto;border:3px dashed canvastext}.block-feedback[data-state=right]{text-decoration:underline double}.block-feedback[data-state=wrong]{text-decoration:underline wavy}}.block-practice .board-setup select{height:max(52px,1.5em + 26px);line-height:1.5}.block-practice[data-mode=painted-faces] #painted-size{text-align:center;font-variant-numeric:tabular-nums;margin:0;font-weight:650}.block-practice[data-mode=painted-faces] #block-instruction{max-width:60ch}#painted-review{border-top:1px solid var(--control-border);margin-top:20px;padding-top:20px}#painted-review h3{margin:0 0 8px;font-size:1rem}#painted-method-heading:focus{outline:none}#painted-review p{font-size:1rem;line-height:1.6}#painted-review label{margin-top:16px;font-weight:600;display:block}#painted-layer{width:100%;min-height:44px;accent-color:var(--accent);cursor:pointer;display:block}#painted-layer:focus-visible{outline:3px solid var(--accent);outline-offset:3px}#painted-layer-drawing{max-width:260px;margin-inline:auto}#painted-layer-drawing svg{width:100%;height:auto;display:block}#painted-layer-matches{text-align:center;font-weight:600}.practice-main:has(.block-practice:is([data-phase=playing],[data-phase=review])) .related-lesson-panel{display:none}@media (width>=860px){.block-practice[data-mode=painted-faces][data-phase=review] #block-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:24px;display:grid}}@media (forced-colors:active){#painted-layer-drawing svg{forced-color-adjust:none;background:#fafaf6}}
