.calc-construction{--role-first:var(--diagram-third);--role-second:var(--diagram-first);--role-third:var(--diagram-second);color:var(--ink);margin-block:1rem}.calc-construction-svg{width:100%;height:auto;margin-inline:auto;display:block;overflow:visible}.calc-construction>.calc-construction-svg{max-width:480px}.calc-construction-svg text{fill:var(--ink);font:16px var(--font-body)}.calc-construction-draggable{touch-action:none}.calc-construction-svg line{stroke:var(--line-strong);stroke-width:1px}.calc-construction-reading,.calc-construction-actions{flex-wrap:wrap;align-items:center;gap:.6rem 1rem;display:flex}.calc-construction-reading{font-variant-numeric:tabular-nums;justify-content:space-between}.calc-construction-actions button,.calc-construction-select select,.calc-race-n button{border:1px solid var(--line-strong);border-radius:var(--radius-small);background:var(--surface);min-height:48px;color:var(--ink);font:inherit;cursor:pointer;padding:.55rem .75rem}.calc-construction-actions button:focus-visible,.calc-race-n button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.calc-construction-select{flex-wrap:wrap;align-items:center;gap:.7rem;display:flex}.calc-construction-note{color:var(--muted);font-size:.875rem;line-height:1.7}.calc-construction-feedback{border-left:3px solid var(--accent);background:var(--accent-soft);padding:.8rem 1rem}.calc-square-base{fill:var(--surface-soft);stroke:var(--line-strong);stroke-width:1.5px}.calc-square-tray{fill:var(--paper);stroke:var(--line-strong);stroke-dasharray:5 4}.calc-square-piece{--piece:var(--role-first)}.calc-square-piece-1{--piece:var(--role-second)}.calc-square-piece-2{--piece:var(--role-third)}.calc-square-piece rect{fill:color-mix(in srgb, var(--piece) 26%, var(--surface));stroke:var(--piece);stroke-width:1px}.calc-square-piece rect.calc-step-future{fill:var(--surface);stroke-dasharray:4 3}.calc-square-piece line{stroke:var(--piece)}.calc-square-piece circle{fill:var(--surface);stroke:var(--piece);stroke-width:2px}.calc-square-piece[role=button]{cursor:grab;touch-action:none}.calc-square-piece[role=button]:active{cursor:grabbing}.calc-square-piece[role=button]:focus-visible{outline:none}.calc-square-piece[role=button]:focus-visible circle,.calc-square-piece[role=button]:focus-visible rect{stroke-width:4px}.calc-square-equations{background:var(--surface-soft);border-radius:var(--radius-small);overflow-wrap:anywhere;font-variant-numeric:tabular-nums;padding:.75rem 1rem}.calc-square-equations p{margin:.45rem 0}.calc-square-equations p:first-child{flex-wrap:wrap;gap:.5rem 1rem;display:flex}.calc-piece-key{border-bottom:3px solid var(--role-first);padding-bottom:.15rem}.calc-piece-key-1{border-color:var(--role-second)}.calc-piece-key-2{border-color:var(--role-third)}.calc-race-n{flex-wrap:wrap;gap:.5rem;margin-block:.7rem;display:flex}.calc-race-n button[aria-pressed=true]{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}.calc-race-road{margin-block:.8rem}.calc-race-lane{--car:var(--role-first);margin-block:.6rem}.calc-race-lane-actual{--car:var(--role-second)}.calc-race-lane-fast{--car:var(--role-third)}.calc-race-lane p{font-variant-numeric:tabular-nums;justify-content:space-between;gap:.5rem;margin:0;display:flex}.calc-race-track{border-bottom:2px solid var(--line-strong);height:38px;margin-inline:18px;position:relative}.calc-race-car{background:var(--car);border-radius:8px 9px 3px 3px;width:30px;height:16px;position:absolute;bottom:4px;transform:translate(-50%)}.calc-race-car:before,.calc-race-car:after{content:"";background:var(--ink);border-radius:50%;width:7px;height:7px;position:absolute;bottom:-4px}.calc-race-car:before{left:4px}.calc-race-car:after{right:4px}.calc-race-scale{justify-content:space-between;margin:0 10px;font-size:.85rem;display:flex}.calc-race-lower{fill:color-mix(in srgb, var(--role-first) 20%, var(--surface));stroke:var(--role-first);stroke-width:1px}.calc-race-gap{fill:color-mix(in srgb, var(--role-third) 40%, var(--surface));stroke:var(--role-third);stroke-width:1px}.calc-race-line{fill:none;stroke:var(--role-second);stroke-width:3px}.calc-race-time{stroke-dasharray:4 3;stroke:var(--ink)!important}.calc-race-summary{border:1px solid var(--line);border-radius:var(--radius-small);font-variant-numeric:tabular-nums;padding:.75rem 1rem}.calc-race-summary p{margin:.5rem 0}.calc-step-parts{gap:.6rem;display:grid}.calc-step-parts button{min-height:48px;color:var(--ink);border:1px solid var(--line-strong);border-radius:var(--radius-small);background:var(--surface);font:inherit;text-align:left;touch-action:none;cursor:grab;padding:.65rem}.calc-step-parts button[aria-pressed=true]{border-color:var(--diagram-first);background:var(--surface-soft)}.calc-step-target{border:2px dashed var(--line-strong);border-radius:var(--radius-small);min-height:64px;margin-top:.75rem;padding:.8rem}
