#clockFoundation{max-width:100%;overflow-wrap:break-word}#clockFoundation>h1{font:700 clamp(1.7rem,5vw,2.6rem)/1.25 system-ui;max-width:28ch}#foundationLesson{padding:20px;background:white;border:1px solid #d9d5c9;border-radius:20px;margin-top:20px}#foundationLesson h2{font:700 1.4rem/1.3 system-ui;margin:0 0 12px}.foundation-phase{font-weight:700;color:#285b47}.foundation-panel{display:grid;grid-template-columns:minmax(180px,300px) minmax(0,1fr);gap:20px;align-items:center}.foundation-copy{min-width:0}.foundation-explanation{font-size:1.05rem;line-height:1.65;margin:0;padding:16px;background:#fff5d8;border-radius:12px;hyphens:none;overflow-wrap:normal;word-break:normal}.foundation-question{font-weight:750;font-size:1.1rem;line-height:1.5}.foundation-instruction{line-height:1.5}#foundationClock{width:100%;max-width:300px;margin:auto;touch-action:none}#foundationClock svg{display:block;width:100%;height:auto;max-height:none}#foundationClock .hour-hand{stroke:#205b91;opacity:1;filter:none}#foundationClock .minute-hand{stroke:#ad4806;opacity:1;filter:none}.foundation-actions,.foundation-answers{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.foundation-actions>button,.foundation-answers>button{flex:1 1 160px;min-width:0;min-height:52px;white-space:normal;hyphens:none}.foundation-answers button[aria-pressed=true]{background:#205b49;color:white;border-color:#205b49}.foundation-audio-status{font-size:.85rem;line-height:1.5;background:#f3f5ec;border-radius:10px;padding:12px}.foundation-feedback{font-weight:700;line-height:1.5}.foundation-back{margin-top:20px}.foundation-check{width:80px;height:80px;background:#18834a;color:white;font-size:56px;line-height:80px;text-align:center;border-radius:50%}.foundation-copy h3{font-size:1.6rem}.foundation-actions .small{flex-basis:100%;margin:0}#foundationChoices{display:grid;gap:8px;margin-top:12px}#foundationChoices button{text-align:left}#clockPreviousVersion[hidden]{display:none!important}
@media(max-width:650px){#foundationLesson{padding:14px}.foundation-panel{grid-template-columns:1fr;gap:12px}#foundationClock{max-width:230px}.foundation-explanation{padding:12px}.foundation-copy{width:100%}}

.foundation-guidance{padding:12px;border-left:4px solid #68867a;background:#f3f5ec;line-height:1.5}
/* Keep the complete hand names on narrow answer buttons, even with very large body text. */
#clockFoundation .foundation-answers button{font-size:min(1rem,28px);overflow-wrap:normal;word-break:normal;hyphens:none}

.foundation-hand-key{font-size:.85rem;line-height:1.5;margin:8px 0}.foundation-hour-key{color:#205b91;font-weight:700}.foundation-minute-key{color:#ad4806;font-weight:700}.foundation-time{font-weight:700;padding:12px;background:#e8f0e5;border-radius:10px}
@media(max-width:360px){.foundation-explanation{padding:8px;font-size:min(1.05rem,32px)}}

.foundation-counting{padding:12px;margin:16px 0 0;background:#f3f5ec;border:1px solid #c9d8c7;border-radius:12px}.foundation-counting h3{font:700 1rem/1.4 system-ui;margin:0 0 8px}.foundation-counting p{font-size:.95rem;line-height:1.5}.foundation-counting .foundation-actions{margin:8px 0 0}.foundation-counting button{font-size:min(1rem,26px);padding:10px 8px;overflow-wrap:normal}

.foundation-count-trail{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.foundation-count-trail span{display:grid;place-items:center;min-width:40px;min-height:40px;background:white;border:1px solid #c9d8c7;border-radius:10px;padding:4px;font-size:1rem}.foundation-count-trail span[aria-current=step]{background:#205b49;color:white;font-weight:750}
.foundation-counting p{font-size:min(.95rem,26px);overflow-wrap:normal;hyphens:none}

.foundation-task-panel{grid-template-columns:1fr;gap:8px}.foundation-task-order .foundation-question{margin:8px 0}.foundation-task-order .foundation-instruction{margin:8px 0 16px}.foundation-task-panel .foundation-guidance{margin:4px 0}

.foundation-answers label{display:flex;flex:1 1 110px;flex-direction:column;gap:8px;font-weight:700;min-width:0}.foundation-answers input{box-sizing:border-box;width:100%;min-width:0;min-height:54px;padding:10px;border:2px solid #68867a;border-radius:12px;font:inherit;font-size:1.2rem;background:white;color:#183e34}.foundation-answers input:focus{outline:3px solid #d8b34b;outline-offset:2px}

#clockFoundation .foundation-actions>button{font-size:min(1rem,28px);overflow-wrap:normal;word-break:normal;hyphens:none}

.foundation-feedback.foundation-success{display:grid;grid-template-columns:52px minmax(0,1fr);gap:4px 12px;align-items:center;padding:16px;background:#edf7e9;border:2px solid #76a56b;border-radius:16px;color:#205b39}.foundation-success-mark{grid-row:span 2;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#18834a;color:#fff;font-size:36px}.foundation-success strong{font-size:min(1.1rem,28px);line-height:1.4}.foundation-success>span:last-child{font-weight:500;font-size:min(1rem,26px);line-height:1.5}

@media(max-width:650px){.foundation-feedback.foundation-success{grid-template-columns:minmax(0,1fr);gap:8px}.foundation-success-mark{grid-row:auto}.foundation-success strong{font-size:min(1rem,24px);overflow-wrap:normal;word-break:normal}}

.foundation-hand-target{pointer-events:stroke;cursor:pointer;touch-action:manipulation}.foundation-hand-target:focus-visible{stroke:#c8ac49;stroke-opacity:.3;outline:none}.foundation-hand-target[aria-disabled=true]{pointer-events:none;cursor:default}

.foundation-scale-note{display:grid;gap:10px;margin:12px 0}.foundation-scale-note p{margin:0;line-height:1.5}

.foundation-reading-note{padding:10px 12px;border-left:4px solid #68867a;border-radius:8px;background:#f3f5ec;font-size:min(1rem,26px);line-height:1.5;margin:12px 0 16px}
/* Keep headings and lesson choices legible on narrow screens with enlarged text. */
#clockFoundation>h1{font-size:min(clamp(1.7rem,5vw,2.6rem),36px);overflow-wrap:normal;word-break:normal;hyphens:none}
#foundationLesson h2{font-size:min(1.4rem,26px);overflow-wrap:normal;word-break:normal;hyphens:none}
#foundationChoices{grid-template-columns:minmax(0,1fr)}
#foundationChoices button{width:100%;min-width:0;box-sizing:border-box;padding:12px;font-size:min(1rem,24px);line-height:1.5;overflow-wrap:normal;word-break:normal;hyphens:none}

/* Same wooden practice clock as Puschel's story; ornaments never take input. */
#foundationClock{isolation:isolate}#foundationClock>svg{position:relative;z-index:1;filter:drop-shadow(0 5px 5px rgba(91,51,22,.15))}.foundation-clock-table{position:relative;height:48px;margin:-12px -2px 0;border-radius:50% 50% 14px 14px/10px 10px 8px 8px;background:repeating-linear-gradient(3deg,#d6a575 0,#d6a575 7px,#dbaf82 8px,#deb58c 13px);border-bottom:7px solid #a46e41;pointer-events:none}.foundation-clock-stand{position:absolute;left:27%;right:27%;height:22px;top:-10px;background:linear-gradient(90deg,#aa713e,#e0b581 45%,#bc8651);border:2px solid #956031;border-radius:6px 6px 3px 3px}.foundation-loose-hand{position:absolute;height:14px;border-radius:10px;box-shadow:0 2px 2px #794c2c55;transform:rotate(8deg)}.foundation-loose-hand:before{content:'';position:absolute;left:6px;top:4px;width:6px;height:6px;border-radius:50%;background:#674226}.foundation-loose-hand:after{content:'';position:absolute;right:-8px;top:-5px;border-top:12px solid transparent;border-bottom:12px solid transparent;border-left:16px solid var(--loose-color)}.foundation-loose-hour{--loose-color:#205b91;background:var(--loose-color);width:24%;left:13%;top:16px}.foundation-loose-minute{--loose-color:#ad4806;background:var(--loose-color);width:36%;left:46%;top:21px}
/* Keep the site skip link hidden until keyboard focus, also during SVG focus updates. */
body>.skip:not(:focus){opacity:0;pointer-events:none}body>.skip:focus{opacity:1;pointer-events:auto}

/* A fresh page at a consistent start: heading, clock, explanation, controls. */
#foundationLesson{scroll-margin-top:12px;overflow-anchor:none}.foundation-page-heading{min-height:180px;display:flex;flex-direction:column;justify-content:flex-start}.foundation-page-heading>.eyebrow{font-size:14px;line-height:1.5;margin:0 0 8px}.foundation-page-heading h2{font-size:clamp(20px,3vw,26px)!important;line-height:1.3;min-height:2.6em;margin:0 0 8px!important}.foundation-page-heading .foundation-phase{font-size:18px;line-height:1.4;margin:0;min-height:2.8em}.foundation-panel{grid-template-columns:minmax(0,1fr)!important;align-items:start!important;gap:20px}#foundationClock{max-width:300px!important;align-self:start;min-width:0}.foundation-copy:empty,.foundation-task-panel .foundation-copy{display:none}.foundation-task-order{margin-top:20px}.foundation-reading-note{margin-top:0}

.foundation-progress{padding:16px;border:1px solid #d3dfd4;border-radius:16px;background:#f1f6ef;margin:20px 0}.foundation-progress p{margin:0 0 12px;line-height:1.5}.foundation-progress button{margin:4px 8px 4px 0;max-width:100%;white-space:normal}.foundation-progress button[hidden]{display:none!important}#foundationChoices .foundation-complete{border-color:#23804b;background:#eaf6ec;color:#126338;font-weight:750}
.foundation-progress{font-size:min(1rem,24px)}.foundation-progress button{font-size:inherit;hyphens:none;overflow-wrap:normal}

.foundation-clock-caption{font-size:min(.9rem,20px);line-height:1.45;text-align:center;margin:12px 0 0;padding:8px;background:#f4efe3;border-radius:10px;min-height:3.5em}.foundation-clock-caption:empty{display:none}

/* Reserve the outer minutes ring even when hidden: toggling never moves the dial. */
.foundation-minute-ring{pointer-events:none}.foundation-minute-ring text{font-family:system-ui,sans-serif;font-variant-numeric:tabular-nums}.foundation-clock-stand{height:34px;top:-26px}#foundationClock{max-width:360px!important}

/* Clock lessons use their own surfaces; pair every dark surface with its ink. */
@media screen{
html[data-reading-theme="dark"] #clockFoundation{color:#f0eadf}
html[data-reading-theme="dark"] #clockFoundation :is(.foundation-explanation,.foundation-audio-status,.foundation-guidance,.foundation-time,.foundation-counting,.foundation-reading-note,.foundation-progress,.foundation-clock-caption){background:#303e35!important;color:#f0eadf!important;border-color:#91a794!important}
html[data-reading-theme="dark"] #clockFoundation .foundation-count-trail span{background:#253029;color:#f0eadf;border-color:#91a794}
html[data-reading-theme="dark"] #clockFoundation .foundation-count-trail span[aria-current="step"]{background:#c9e7be!important;color:#173d32!important}
html[data-reading-theme="dark"] #clockFoundation .foundation-feedback.foundation-success{background:#203e2b!important;color:#d5f3cc!important;border-color:#91c58b!important}
html[data-reading-theme="dark"] #clockFoundation .foundation-feedback.foundation-success :is(strong,span){color:inherit!important}
html[data-reading-theme="dark"] #clockFoundation .foundation-feedback.foundation-success .foundation-success-mark{background:#18834a;color:#fff!important}
html[data-reading-theme="dark"] #clockFoundation #foundationChoices .foundation-complete{background:#203e2b!important;color:#d5f3cc!important;border-color:#91c58b!important}
html[data-reading-theme="dark"] #clockFoundation .foundation-hour-key{color:#9dceff!important}
html[data-reading-theme="dark"] #clockFoundation .foundation-minute-key{color:#ffbd82!important}
html[data-reading-theme="dark"] #clockFoundation .foundation-answers input{color-scheme:dark}
}
/* Task counters stay secondary even with very large reading text. */
#clockFoundation .foundation-task-order>.eyebrow{font-size:min(.8rem,18px)!important;line-height:1.5;letter-spacing:.04em}

/* Number-tour controls sit beside the clock in reading order and stay compact. */
#foundationNumberTour{margin:0;padding:12px}
#foundationNumberTour h3{font-size:18px;line-height:1.4;margin:0 0 6px}
#foundationNumberStatus{font-size:18px;line-height:1.4;margin:0;min-height:2.8em}
#clockFoundation #foundationNumberTour .foundation-actions{margin:8px 0 0;gap:8px}
#clockFoundation #foundationNumberTour .foundation-actions>button{font-size:16px!important;min-height:44px;padding:8px;flex:1 1 130px}

/* Forest palette is scoped to the clock course; site-wide themes remain independent. */
#clockFoundation{--clock-primary:#1c493a;--clock-on-primary:#fff;--clock-secondary:#fff8e8;--clock-ink:#1c493a;--clock-border:#1c493a;--clock-overview:#eef3e8;--clock-current:#2e6842;--clock-done:#205b39;--clock-disabled:#dee5dd;--clock-disabled-ink:#45584b;--clock-focus:#0b6650}
html[data-reading-theme="dark"] #clockFoundation{--clock-primary:#b9dfae;--clock-on-primary:#17382b;--clock-secondary:#293d32;--clock-ink:#f4eedf;--clock-border:#b9dfae;--clock-overview:#202f27;--clock-current:#b9dfae;--clock-done:#d5f3cc;--clock-disabled:#3b4d40;--clock-disabled-ink:#e0e8dc;--clock-focus:#d4edc8}
html #clockFoundation button,html #clockFoundation #foundationIndex>summary,html #clockFoundation .foundation-task-tools>summary{background:var(--clock-secondary)!important;color:var(--clock-ink)!important;border:2px solid var(--clock-border)!important;box-shadow:none;opacity:1;min-height:44px;box-sizing:border-box}
html #clockFoundation button.primary{background:var(--clock-primary)!important;color:var(--clock-on-primary)!important;border-color:var(--clock-primary)!important}
html #clockFoundation :is(button,summary):focus-visible{outline:3px solid var(--clock-focus)!important;outline-offset:3px}
html #clockFoundation button:not(:disabled):hover,html #clockFoundation #foundationIndex>summary:hover,html #clockFoundation .foundation-task-tools>summary:hover{box-shadow:inset 0 0 0 1px var(--clock-border)}
html #clockFoundation button:disabled{background:var(--clock-disabled)!important;color:var(--clock-disabled-ink)!important;border-color:var(--clock-disabled-ink)!important;opacity:1!important;cursor:default}
html #clockFoundation .foundation-answers button[aria-pressed="true"]:not(:disabled){background:var(--clock-secondary)!important;color:var(--clock-ink)!important;border-color:var(--clock-current)!important;box-shadow:inset 0 0 0 2px var(--clock-current)}
html #clockFoundation #foundationIndex{background:var(--clock-overview)!important;color:var(--clock-ink)!important;border:2px solid var(--clock-border)!important;padding:12px;border-radius:18px;margin:20px 0;min-width:0}
html #clockFoundation #foundationIndex>summary{background:var(--clock-overview)!important;color:var(--clock-ink)!important;border:0!important;padding:10px 4px;font-weight:750;cursor:pointer;line-height:1.5}
html #clockFoundation #foundationChoices button{background:var(--clock-secondary)!important;color:var(--clock-ink)!important;border:3px solid var(--clock-border)!important;border-radius:12px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
html #clockFoundation #foundationChoices button.foundation-current{border-color:var(--clock-current)!important;box-shadow:inset 0 0 0 1px var(--clock-current)}
html #clockFoundation #foundationChoices button.foundation-complete,html[data-reading-theme="dark"] #clockFoundation #foundationChoices button.foundation-complete{background:var(--clock-secondary)!important;color:var(--clock-ink)!important;border-color:var(--clock-border)!important}
html #clockFoundation #foundationChoices button.foundation-current.foundation-complete{border-color:var(--clock-current)!important}
html #clockFoundation #foundationChoices button span{color:inherit!important}
#clockFoundation .foundation-chapter-label{display:block;line-height:1.5}
#clockFoundation :is(.foundation-current-label,.foundation-complete-label){display:block;font-size:min(.85rem,20px);font-weight:750;line-height:1.4}
html #clockFoundation #foundationChoices button .foundation-complete-label{color:var(--clock-done)!important}
#clockFoundation .foundation-task-tools{margin:18px 0;border-radius:12px}
#clockFoundation .foundation-task-tools>summary{padding:12px;border-radius:12px;line-height:1.5;cursor:pointer}
