:root { --paper:#f5f8fa; --ink:#18302b; --ink-soft:#526368; --line:#d8e1e2; --lemon:#f5d967; --oxblood:#923d4c; --sans:"Figtree",sans-serif; --serif:"Fraunces",serif; }
* { box-sizing:border-box; }
body.daily-maths-page { margin:0; background:var(--paper); color:var(--ink); font:16px/1.4 var(--sans); }
[hidden] { display:none !important; }
button,input,a,summary { -webkit-tap-highlight-color:transparent; }
button,input { font:inherit; }
button,a { color:inherit; }
button { min-height:48px; border:1px solid var(--line); border-radius:6px; padding:10px 16px; background:#fff; cursor:pointer; }
button:hover:not(:disabled) { background:#e3efeb; border-color:#8cab9f; }
button:disabled { opacity:.45; cursor:default; }
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible { outline:3px solid var(--oxblood); outline-offset:3px; }
[data-icon] { display:inline-grid; place-items:center; width:48px; height:48px; padding:10px; flex-shrink:0; }
[data-icon] svg { width:26px; height:26px; }
[data-icon="back"] svg { transform:rotate(180deg); }
[data-icon="reload"] { font-size:28px; }
.sr-only,.skip-link:not(:focus) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip-link:focus { position:absolute; z-index:10; background:#fff; padding:12px; }
.daily-maths-header { min-height:76px; max-width:1440px; margin:auto; padding:12px 20px; display:grid; grid-template-columns:48px minmax(0,1fr) 48px; align-items:center; gap:14px; }
.daily-maths-header h1 { margin:0; font:500 20px/1.25 var(--sans); text-align:center; overflow-wrap:anywhere; }
#dailyMathsPage { min-height:calc(100svh - 76px); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:0 0 16px; }
#dailyMathsNotice { order:3; width:min(100%,820px); min-height:72px; padding:0 20px; text-align:center; }
#dailyMathsStatus { margin:8px 0; font-size:14px; }
#dailyMathsProblem { margin:4px 0; color:var(--oxblood); font-size:14px; overflow-wrap:anywhere; }
#dailyMathsProblem:empty { display:none; }
#dailyMathsRetry { margin:8px 0; }
.daily-maths-page .quest-world { order:0; position:relative; top:auto; margin:0 auto; width:min(100%,calc(max(180px,100svh - 430px) * 16 / 9)); max-width:1440px; align-self:center; }
.daily-maths-page .world-stage { width:100%; height:auto; min-height:0; aspect-ratio:16 / 9; overflow:hidden; }
.daily-maths-page .world-stage canvas { display:block; width:100%; height:100%; }
.daily-maths-page .world-caption,.daily-maths-page .world-status,.daily-maths-page .world-hotspots,.daily-maths-page #worldZoom { display:none; }
.daily-maths-page .world-flat .world-stage { margin:0; }
.daily-maths-page .stage-equation { font-size:38px; border-radius:6px; padding:4px 12px; max-width:calc(100% - 16px); }
#questConversation { order:1; width:min(100%,820px); min-width:0; margin:0 auto; padding:16px 20px 0; }
#questBeat { margin:0; }
.daily-maths-caption-row { display:grid; grid-template-columns:minmax(0,1fr) 48px; align-items:center; gap:12px; min-height:64px; }
#beatText { font:500 26px/1.2 var(--serif); letter-spacing:0; margin:0; overflow-wrap:anywhere; }
.daily-maths-response { min-height:92px; padding:8px 0; }
#dailyMathsAnswerForm { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
#dailyMathsAnswer { width:88px; min-width:88px; max-width:100%; field-sizing:content; height:48px; border:1px solid #96aaa4; border-radius:6px; background:#fff; color:var(--ink); padding:4px 10px; text-align:center; font-size:24px; }
#dailyMathsKeys { display:flex; gap:8px; }
#dailyMathsKeys[hidden],#dailyMathsKeys button[hidden] { display:none; }
#dailyMathsKeys button { min-width:48px; height:48px; font-size:24px; }
#dailyMathsSubmit,#dailyMathsStart,#dailyMathsFinish { background:var(--ink); color:#fff; border-color:var(--ink); }
#dailyMathsHint { background:var(--lemon); border-color:var(--lemon); }
#dailyMathsHintText { font-size:15px; margin:8px 0 0; min-height:21px; overflow-wrap:anywhere; }
#dailyMathsSolution { font:500 25px/1.2 var(--serif); margin:0; }
.daily-maths-navigation { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; min-height:48px; }
#dailyMathsSlides { display:flex; gap:8px; margin:0 auto; padding:0; list-style:none; }
#dailyMathsSlides li { width:9px; height:9px; border-radius:50%; background:#cbd6d7; }
#dailyMathsSlides li[aria-current] { background:var(--ink); outline:3px solid #d6e9e1; }
#dailyMathsDone { padding:12px 4px; }
#dailyMathsCaptions { margin:10px 0 0; font-size:14px; }
#dailyMathsCaptions summary { cursor:pointer; width:fit-content; min-height:28px; color:var(--ink-soft); }
#dailyMathsNarration { margin:8px 0; overflow-wrap:anywhere; }
#dailyMathsVoiceStatus { font-size:13px; margin:4px 0; }
.voice-speed { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:8px 0; }
.voice-speed-label { display:flex; align-items:center; gap:6px; margin-right:4px; }
.voice-speed-label svg { width:20px; height:20px; }
.voice-speed-step { min-height:44px; padding:8px 12px; font-size:13px; }
.voice-speed-step[aria-pressed="true"] { background:var(--ink); color:#fff; }
.w.lit { background:var(--lemon); border-radius:2px; }
.daily-maths-page .world-sheet[hidden] { display:none; }
#dailyMathsPage[data-phase="completed"] { justify-content:flex-start; }
#dailyMathsSummary { order:1; width:min(100%,820px); min-width:0; padding:20px; }
.daily-maths-summary-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.daily-maths-summary-heading > div { min-width:0; flex:1 1 260px; }
.daily-maths-summary-heading h2 { margin:4px 0 16px; font:500 26px/1.2 var(--serif); overflow-wrap:anywhere; }
.daily-maths-summary-heading p { margin:0; font-size:14px; color:var(--ink-soft); }
#dailyMathsDownload { display:inline-flex; align-items:center; gap:8px; flex-shrink:0; }
.daily-maths-summary-picture { margin:16px 0; }
.daily-maths-summary-picture canvas { display:block; width:100%; height:auto; max-height:340px; object-fit:contain; background:#edf3f2; }
.daily-maths-summary-picture figcaption { margin:8px 0; color:var(--ink-soft); font-size:14px; }
#dailyMathsSummary p,#dailyMathsSummary li { overflow-wrap:anywhere; }
#dailyMathsSummary h3 { margin:0 0 8px; font-size:16px; font-weight:600; }
.daily-maths-learning-note,.daily-maths-parent-question { padding:18px 0; border-top:1px solid var(--line); }
.daily-maths-learning-note p,.daily-maths-parent-question p { margin:8px 0; }
.daily-maths-learning-note ol,.daily-maths-learning-note ul { margin:8px 0; padding-left:22px; }
.daily-maths-learning-note li { margin:8px 0; }
.daily-maths-summary-limit { font-size:14px; color:var(--ink-soft); }
#dailyMathsDownloadStatus { font-size:14px; min-height:20px; }
@media(max-width:600px) {
  .daily-maths-header { padding:10px 14px; gap:8px; }
  #questConversation { padding:12px 16px 0; }
  #beatText { font-size:23px; }
  .daily-maths-page .stage-equation { font-size:28px; }
  .daily-maths-caption-row { min-height:60px; }
  .daily-maths-navigation { gap:8px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation:none !important; transition:none !important; } }
