.clock-lesson{--clock-hour-color:var(--rust);--clock-minute-color:#176d99;--clock-face-color:var(--panel);gap:1.4rem;min-width:0;display:grid}[data-mode=dark] .clock-lesson{--clock-minute-color:#83c9ed}.clock-lesson [hidden]{display:none!important}.clock-hero,.clock-example,.clock-game{padding:clamp(.8rem,2vw,1.4rem)}.clock-hero h1{margin:.25rem 0 .65rem}.clock-hero p:last-child{color:var(--muted);margin-bottom:0}.clock-lesson p{max-width:none}.clock-stage{gap:1rem;min-width:0;scroll-margin-top:1rem;display:grid}.clock-example h3{margin:0 0 .5rem;font-size:1.3rem}.clock-example header>p{margin:0 0 1rem}.clock-navigation{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.clock-board{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:1.2rem;min-width:0;display:grid}.clock-visual{align-items:center;gap:1rem;min-width:0;display:flex}.clock-face{width:100%;min-width:0;max-width:20rem;margin-inline:auto}.clock-dial{width:100%;height:auto;max-height:20rem;color:var(--text);-webkit-user-select:none;user-select:none;display:block;overflow:visible}.clock-dial[data-clock-dial]{touch-action:none;cursor:pointer;border-radius:50%}.clock-dial[data-clock-dial]:focus-visible{outline:3px solid var(--rust);outline-offset:3px}.clock-digital{text-align:center;flex:none;gap:.25rem;display:grid}.clock-digital>span{color:var(--muted);font-size:.75rem}.clock-digital output,.clock-target-digital{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:clamp(1.8rem,3vw,3rem);font-weight:650;line-height:1.2}.clock-digital output{border:1px solid var(--edge);background:var(--panel);border-radius:.5rem;padding:.5rem}.clock-digital-labels{justify-content:space-around;font-size:.65rem;display:flex}.clock-digital-labels span:first-child,.clock-hour-label{color:var(--clock-hour-color)}.clock-digital-labels span:last-child,.clock-minute-label{color:var(--clock-minute-color)}.clock-edit-controls{gap:.6rem;min-width:0;display:grid}.clock-hand-picker,.clock-game-picker,.clock-step-picker{border:0;flex-wrap:wrap;gap:.4rem;min-width:0;margin:0;padding:0;display:flex}.clock-hand-picker label,.clock-game-picker label,.clock-step-picker label{cursor:pointer;display:flex;position:relative}.clock-hand-picker label{flex:8rem}.clock-hand-picker input,.clock-game-picker input,.clock-step-picker input{opacity:0;width:1px;height:1px;position:absolute}.clock-hand-picker label>span,.clock-game-picker label>span,.clock-step-picker label>span{border:1px solid var(--control-edge);background:var(--panel);-webkit-user-select:none;user-select:none;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;width:100%;min-height:44px;padding:.45rem .65rem;font-size:.85rem;line-height:1.3;display:flex}.clock-lesson input:checked+span{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--accent-soft)}.clock-lesson input:focus-visible+span{outline:3px solid var(--rust);outline-offset:3px}.clock-lesson input:disabled+span{opacity:.55;cursor:default}.clock-hand-picker svg{stroke:currentColor;stroke-width:2px;fill:none;flex-shrink:0;width:1.3rem;height:1.6rem}.clock-step-controls,.clock-game-actions{flex-wrap:wrap;gap:.5rem;display:flex}.clock-step-controls button{flex:1}.clock-input-help{color:var(--muted);margin:0;font-size:.75rem;line-height:1.45}.clock-fields{align-items:end;gap:.5rem;display:flex}.clock-fields>span{padding-bottom:.6rem}.clock-fields label{flex:1;gap:.2rem;min-width:0;font-size:.75rem;display:grid}.clock-fields input{border:1px solid var(--control-edge);width:100%;min-width:0;min-height:44px;color:var(--text);background:var(--panel);text-align:center;font-variant-numeric:tabular-nums;border-radius:.4rem;padding:.45rem}.clock-presets{flex-wrap:wrap;gap:.4rem;margin-top:1rem;display:flex}.clock-presets button{font-variant-numeric:tabular-nums;font-size:.85rem}.clock-conclusion{border-top:1px solid var(--edge);margin:.9rem 0 0;padding-top:.8rem}.clock-game-settings{border-bottom:1px solid var(--edge);margin-bottom:.8rem;padding-bottom:.5rem}.clock-game-settings summary{font-size:.9rem}.clock-current-settings{color:var(--muted);margin-left:1rem;font-size:.75rem;display:block}.clock-game-picker{grid-template-columns:repeat(4,minmax(0,1fr));margin:.6rem 0;display:grid}.clock-game-picker legend,.clock-step-picker legend{color:var(--muted);padding:.25rem 0;font-size:.8rem}.clock-game-picker label>span{text-align:center;flex-direction:column;padding:.5rem;font-size:.75rem}.clock-step-picker label{flex:auto}.clock-step-picker label>span{font-size:.75rem}.clock-game h3{margin:.65rem 0;font-size:1.25rem;line-height:1.35}.clock-task{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:1rem;display:grid}.clock-clue{text-align:center;justify-items:center;gap:.4rem;min-width:0;display:grid}.clock-clue .clock-face{max-width:16rem}.clock-day-part{border:1px solid var(--control-edge);border-radius:2rem;align-items:center;gap:.45rem;padding:.3rem .8rem;font-size:1rem;display:flex}.clock-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;min-width:0;display:grid}.clock-options>button{font-variant-numeric:tabular-nums;min-height:66px;font-size:clamp(1.25rem,2.5vw,2rem);font-weight:600}.clock-options>button:not(.clock-option-dial){white-space:nowrap;padding-inline:.35rem}.clock-options>button[data-result=retry]{border-style:dashed;border-color:var(--rust)}.clock-options>button[data-result=correct]{border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent)}.clock-options>.clock-option-dial{padding:.25rem}.clock-option-dial svg{max-height:10rem}.clock-game[data-game=set-clock] .clock-task{grid-template-columns:auto minmax(0,1fr)}.clock-game[data-game=set-clock] .clock-clue{align-self:center}.clock-game[data-game=set-clock] .clock-target-digital{font-size:2rem}.clock-game[data-game=set-clock] .clock-board{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.8rem}.clock-game[data-game=set-clock] .clock-face{max-width:15rem}.clock-game[data-game=set-clock] .clock-input-help{font-size:.7rem}.clock-game[data-game=set-clock] .clock-hand-picker label{flex-basis:100%}.clock-feedback{align-items:center;gap:.6rem;min-height:3.25rem;margin-top:.65rem;font-size:.9rem;display:flex}.clock-feedback>[data-clock-feedback-icon]{flex-shrink:0;font-size:1.65rem;font-weight:700}.clock-game[data-state=solved] .clock-feedback{color:var(--accent)}.clock-game[data-state=retry] .clock-feedback{color:var(--rust)}.clock-game-actions{border-top:1px solid var(--edge);padding-top:.5rem}[data-presentation=workshop] .clock-primary{background:var(--accent);color:var(--panel);border-color:var(--accent);font-weight:600}.clock-aside{gap:1rem;display:grid}.clock-sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (min-width:1041px){.clock-aside{position:sticky;top:1rem}}@media (max-width:1250px){.clock-visual{flex-direction:column;gap:.4rem}.clock-digital output{font-size:1.8rem}.clock-digital>span{display:none}}@media (max-width:600px){.clock-options>button:not(.clock-option-dial){font-size:1rem}.clock-board{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.7rem}.clock-visual{gap:.35rem}.clock-face{max-width:14rem}.clock-digital output{padding:.25rem .4rem;font-size:1.7rem}.clock-input-help{font-size:.7rem}.clock-step-controls{gap:.3rem}.clock-step-controls button{padding-inline:.3rem;font-size:.75rem}.clock-hand-picker label>span{gap:.25rem;padding:.35rem;font-size:.75rem}.clock-hand-picker label{flex-basis:100%}.clock-presets{gap:.35rem;margin-top:.6rem}.clock-presets button{flex:6rem;padding-inline:.4rem;font-size:.75rem}.clock-example h3{font-size:1.15rem}.clock-task{gap:.65rem}.clock-game-picker{grid-template-columns:repeat(2,minmax(0,1fr))}.clock-option-dial svg{max-height:8rem}.clock-game[data-game=read-digital] .clock-task{grid-template-columns:minmax(0,1fr);gap:.5rem}.clock-game[data-game=read-digital] .clock-target-digital{font-size:2rem}.clock-game[data-game=set-clock] .clock-task{grid-template-columns:minmax(0,1fr);gap:.5rem}.clock-game[data-game=set-clock] .clock-board{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.clock-game[data-game=set-clock] .clock-target-digital{font-size:1.8rem}.clock-game h3{font-size:1.1rem}}