/* Canonical Maths-founded shell. Subject identity is expressed through tokens. */
[data-course-foundation="maths-cm2-five-space"] {
  --foundation-ink: #29272d;
  --subject-dominant: #b7ef18;
  --subject-support: #fff0bd;
  --foundation-accent: var(--subject-dominant);
  --foundation-support: var(--subject-support);
  color: var(--foundation-ink);
}

[data-course-theme="maths"] { --foundation-accent: #9267ea; --foundation-support: #f2ebff; --subject-dominant: #9267ea; --subject-support: #f2ebff; }
[data-course-theme="francais"] { --foundation-accent: #fd7666; --foundation-support: #ffe7e2; --subject-dominant: #fd7666; --subject-support: #ffe7e2; }
[data-course-theme="geographie"] { --foundation-accent: #2f73d9; --foundation-support: #e2efff; --subject-dominant: #2f73d9; --subject-support: #e2efff; }
[data-course-theme="english"] { --foundation-accent: #f35aa5; --foundation-support: #ffe5f2; --subject-dominant: #f35aa5; --subject-support: #ffe5f2; }
[data-course-theme="sciences"] { --foundation-accent: #0fbc53; --foundation-support: #e5f8eb; --subject-dominant: #0fbc53; --subject-support: #e5f8eb; }
[data-course-theme="ai"] { --foundation-accent: #fdc8e9; --foundation-support: #fff0f8; --subject-dominant: #fdc8e9; --subject-support: #fff0f8; }
[data-course-theme="education-civique"] { --foundation-accent: #00a98f; --foundation-support: #dff8f2; --subject-dominant: #00a98f; --subject-support: #dff8f2; }
[data-course-theme="histoire"] { --foundation-accent: #d79b3b; --foundation-support: #fff0d2; --subject-dominant: #d79b3b; --subject-support: #fff0d2; }
[data-course-theme="arts"] { --foundation-accent: #f29c45; --foundation-support: #fff0dc; --subject-dominant: #f29c45; --subject-support: #fff0dc; }
[data-course-theme="musique"] { --foundation-accent: #5b5bd6; --foundation-support: #ebeaff; --subject-dominant: #5b5bd6; --subject-support: #ebeaff; }

/* The canonical Maths hierarchy stays fixed; subject identity enters through
   these two tokens only. Lesson-specific styles remain proof-visual CSS. */
[data-course-foundation="maths-cm2-five-space"] > .division-module-nav button.is-current {
  background: color-mix(in srgb, var(--subject-dominant) 24%, white);
}

[data-course-foundation="maths-cm2-five-space"] > .division-module-nav button.is-current i,
[data-course-foundation="maths-cm2-five-space"] > .division-module-nav i {
  background: var(--subject-dominant);
}

[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__hero {
  background-color: color-mix(in srgb, var(--subject-dominant) 25%, white);
}

[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__teacher > span {
  background: color-mix(in srgb, var(--subject-dominant) 46%, white);
}

[data-course-foundation="maths-cm2-five-space"] :where(
  .kid-lesson-welcome__copy button,
  .kid-step-actions,
  .kid-step-lab-copy button.is-next,
  .kid-lab-launch-copy > button,
  .kid-lab-finish-card button.is-next,
  .kid-lab-feedback button,
  .kid-cards-progress li.is-current i,
  .kid-cards-finish-actions button.is-next,
  .family-guide-actions button:nth-child(2)
) {
  background: var(--subject-dominant);
}

[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__copy > span,
[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__copy h1 em,
[data-course-foundation="maths-cm2-five-space"] :where(
  .kid-lesson-welcome__goals > span,
  .kid-lesson-welcome__progress header span,
  .kid-lesson-welcome__progress header > strong,
  .kid-step-kicker,
  .kid-step-question span,
  .kid-step-takeaway span,
  .kid-lab-launch-copy > span,
  .kid-lab-heading > span,
  .kid-lab-answer > span,
  .kid-cards-heading > span,
  .kid-cards-progress > p strong,
  .kid-summary-heading > div > span,
  .kid-summary-example > div > span,
  .kid-summary-journey > header > span,
  .kid-summary-say span,
  .family-guide-hero > div > span,
  .family-guide-ready > header > span,
  .family-guide-cheat > header > span,
  .family-guide-session > header > span,
  .family-guide-check > header > span,
  .family-guide-finish > span
) {
  color: var(--foundation-ink);
}

[data-course-foundation="maths-cm2-five-space"].division-module-page.division-flashcards-page {
  background: var(--subject-support) !important;
}

.division-flashcards-page > .division-module-bar,
.division-flashcards-page > .division-module-nav,
.division-flashcards-page .kid-cards-page {
  background: var(--subject-support);
}

.division-flashcards-page > .division-module-nav button.is-current {
  background: var(--subject-dominant);
}

@media (max-width: 680px) {
  [data-course-foundation="maths-cm2-five-space"] .family-guide-hero h1 {
    font-size: clamp(34px, 9vw, 54px);
  }
}
[data-course-foundation="maths-cm2-five-space"][data-course-theme="maths"] > .division-module-nav i {
  background: var(--foundation-accent) !important;
  color: #fff !important;
}

[data-course-foundation="maths-cm2-five-space"][data-course-theme="maths"] > .division-module-nav button.is-current {
  background: var(--foundation-support) !important;
  color: var(--foundation-ink) !important;
}

[data-course-foundation="maths-cm2-five-space"][data-course-theme="maths"] > .division-module-nav button.is-current i {
  background: var(--foundation-accent) !important;
  color: #fff !important;
}

/* Dedicated canonical wiring for Mme Anne's literal five-stage Geography
   renderer. The renderer owns only these two subject identity tokens. */
.geography-course[data-course-foundation="maths-cm2-five-space"] {
  --subject-dominant: #2f73d9;
  --subject-support: #e2efff;
  --course-banner: var(--subject-dominant);
  --course-banner-accent: var(--subject-support);
  --canonical-dominant: var(--subject-dominant);
  --canonical-dominant-text: var(--subject-dominant);
}

.geography-course[data-course-foundation="maths-cm2-five-space"]:not(.division-flashcards-page) {
  background: #fffaf0 !important;
}

.geography-course[data-course-foundation="maths-cm2-five-space"] > .division-module-nav button {
  background: transparent;
}

.geography-course[data-course-foundation="maths-cm2-five-space"] > .division-module-nav i,
.geography-course[data-course-foundation="maths-cm2-five-space"] > .division-module-nav button.is-current i {
  background: var(--subject-dominant) !important;
  color: #fff !important;
}

.geography-course[data-course-foundation="maths-cm2-five-space"] > .division-module-nav button.is-current {
  background: var(--subject-support) !important;
  color: var(--foundation-ink) !important;
}

body:has(.maths-pilot-sidebar.is-geographie) .maths-pilot-topbar > div > span {
  width: max-content;
  padding: 8px 12px 8px 16px;
  border-left: 6px solid var(--geo-blue, #2f73d9);
  border-radius: 9px 16px 16px 9px;
  background: var(--geo-blue-soft, #e2efff);
  color: var(--foundation-ink, #29272d);
}

body:has(.maths-pilot-sidebar.is-geographie) .maths-pilot-topbar > div > span i {
  color: var(--geo-blue, #2f73d9);
}

.geography-course[data-course-foundation="maths-cm2-five-space"].division-flashcards-page {
  background: var(--subject-support) !important;
}

.geography-course[data-course-foundation="maths-cm2-five-space"].division-flashcards-page > .division-module-nav button.is-current {
  background: var(--subject-dominant) !important;
  color: #fff !important;
}

.geography-course[data-course-foundation="maths-cm2-five-space"].division-flashcards-page > .division-module-nav button.is-current small {
  color: #fff;
}

body:has(.maths-pilot-sidebar.is-geographie):has(.geography-course.division-flashcards-page),
#app:has(.maths-pilot-sidebar.is-geographie):has(.geography-course.division-flashcards-page),
.maths-pilot-header:has(+ .geography-course.division-flashcards-page) {
  background: var(--geo-blue-soft, #e2efff) !important;
}

.geography-course[data-course-foundation="maths-cm2-five-space"] :where(
  .kid-lesson-welcome__copy > span,
  .kid-lesson-welcome__copy h1 em,
  .kid-lesson-welcome__goals > span,
  .kid-lesson-welcome__progress header span,
  .kid-lesson-welcome__progress header > strong,
  .kid-step-kicker,
  .kid-step-question span,
  .kid-step-takeaway span,
  .kid-lab-launch-copy > span,
  .kid-lab-heading > span,
  .kid-lab-answer > span,
  .kid-cards-heading > span,
  .kid-cards-progress > p strong,
  .kid-summary-heading > div > span,
  .kid-summary-example > div > span,
  .kid-summary-journey > header > span,
  .kid-summary-say span,
  .family-guide-hero > div > span,
  .family-guide-ready > header > span,
  .family-guide-cheat > header > span,
  .family-guide-session > header > span,
  .family-guide-check > header > span,
  .family-guide-finish > span
) {
  color: var(--canonical-dominant-text);
}

.geography-course[data-course-foundation="maths-cm2-five-space"] :where(
  .kid-lesson-welcome__copy button,
  .kid-step-actions,
  .kid-step-lab-copy button.is-next,
  .kid-lab-launch-copy > button,
  .kid-lab-finish-card button.is-next,
  .kid-lab-feedback button,
  .kid-cards-progress li.is-current i,
  .kid-cards-finish-actions button.is-next,
  .family-guide-actions button:nth-child(2)
) {
  background: var(--subject-dominant);
}

.geography-course[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__hero,
.geography-course[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__teacher > span {
  background-color: var(--subject-support);
}

.geography-course[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__hero {
  background-image: radial-gradient(circle, rgba(255, 255, 255, .58) 0 4px, transparent 5px);
}

.geography-course[data-course-foundation="maths-cm2-five-space"] .kid-lesson-welcome__progress-bar i {
  background: linear-gradient(90deg, var(--subject-dominant), #fd7666, #f6cc24);
}

[data-course-theme="espagnol"] { --foundation-accent: #f6cc24; --foundation-support: #fff5c8; --subject-dominant: #f6cc24; --subject-support: #fff5c8; }
.division-course-header[data-course-theme="espagnol"] { --subject-dominant: #f6cc24; --subject-support: #fff5c8; --subject-dominant-text: #29272d; }

/* Subject lessons keep the literal Maths shell and swap only its interface skin. */
[data-course-structure="literal-maths-duplicate"] {
  --approved-accent: var(--subject-dominant);
  --approved-soft: var(--subject-support);
}

[data-course-structure="literal-maths-duplicate"] .division-module-nav button.is-current,
[data-course-structure="literal-maths-duplicate"] .division-module-nav button.is-current i,
[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__copy button,
[data-course-structure="literal-maths-duplicate"] .kid-step-actions,
[data-course-structure="literal-maths-duplicate"] .kid-step-lab-copy button.is-next,
[data-course-structure="literal-maths-duplicate"] .kid-lab-launch-copy > button,
[data-course-structure="literal-maths-duplicate"] .kid-lab-progress li.is-current i,
[data-course-structure="literal-maths-duplicate"] .kid-lab-answer .maths-batch-lab__validate,
[data-course-structure="literal-maths-duplicate"] .kid-cards-progress li.is-current i,
[data-course-structure="literal-maths-duplicate"] .kid-summary-journey li > i,
[data-course-structure="literal-maths-duplicate"] .family-guide-ready li > i,
[data-course-structure="literal-maths-duplicate"] .family-guide-step > header > i,
[data-course-structure="literal-maths-duplicate"] .family-guide-check li > i {
  background: var(--subject-dominant);
  color: var(--subject-dominant-text);
}

[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__teacher > span,
[data-course-structure="literal-maths-duplicate"] .kid-lab-launch-teacher,
[data-course-structure="literal-maths-duplicate"] .kid-lab-visual,
[data-course-structure="literal-maths-duplicate"] .kid-cards-actions > p i {
  background: var(--subject-support);
}

[data-course-structure="literal-maths-duplicate"].division-flashcards-page,
[data-course-structure="literal-maths-duplicate"] .kid-cards-page {
  background: var(--subject-support) !important;
}

[data-course-theme="espagnol"][data-course-structure="literal-maths-duplicate"].division-flashcards-page > .division-module-nav button.is-current {
  background: var(--subject-dominant) !important;
  color: var(--subject-dominant-text) !important;
}

[data-course-theme="espagnol"][data-course-structure="literal-maths-duplicate"].division-flashcards-page > .division-module-nav button.is-current i {
  background: #fff !important;
  color: var(--subject-dominant-text) !important;
}

body:has(.division-course-header.is-flashcards[data-course-theme="espagnol"]),
#app:has(.division-course-header.is-flashcards[data-course-theme="espagnol"]),
.division-course-header.is-flashcards[data-course-theme="espagnol"] {
  background: #fff5c8 !important;
  background-image: none !important;
}

[data-course-foundation="maths-cm2-five-space"] :focus-visible {
  outline: 4px solid var(--foundation-ink);
  outline-offset: 4px;
}

[data-course-foundation="maths-cm2-five-space"] [aria-current="page"] {
  text-decoration-thickness: 3px;
  text-underline-offset: 5px;
}

[data-course-foundation="maths-cm2-five-space"].learning-experience > .division-module-nav button.is-current {
  background: var(--subject-dominant) !important;
  color: var(--foundation-ink) !important;
}

[data-course-foundation="maths-cm2-five-space"].kid-lesson-welcome-page .kid-lesson-welcome__hero {
  background-color: var(--subject-dominant);
}

[data-course-foundation="maths-cm2-five-space"].division-flashcards-page {
  background: var(--subject-support) !important;
}

[data-course-foundation="maths-cm2-five-space"].division-flashcards-page > .division-module-nav button.is-current {
  background: var(--subject-dominant) !important;
  color: var(--foundation-ink) !important;
}

body:has(.maths-pilot-sidebar) [data-course-foundation="maths-cm2-five-space"].maths-pilot-course.division-flashcards-page {
  background: var(--subject-support) !important;
}

body:has(.maths-pilot-sidebar) [data-course-foundation="maths-cm2-five-space"].maths-pilot-course.division-flashcards-page > .division-module-nav button.is-current {
  background: var(--subject-dominant) !important;
  color: var(--foundation-ink) !important;
}

/* Literal subject renderers inherit the approved Maths shell. These rules
   connect only the two locked subject tokens to canonical identity details. */
[data-course-structure="literal-maths-duplicate"] .division-module-nav i,
[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__progress-bar i,
[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__copy button,
[data-course-structure="literal-maths-duplicate"] .kid-step-actions,
[data-course-structure="literal-maths-duplicate"] .kid-step-lab-copy button.is-next,
[data-course-structure="literal-maths-duplicate"] .kid-lab-launch-copy > button,
[data-course-structure="literal-maths-duplicate"] .kid-lab-finish-card button.is-next,
[data-course-structure="literal-maths-duplicate"] .kid-lab-feedback button,
[data-course-structure="literal-maths-duplicate"] .kid-cards-progress li.is-current i,
[data-course-structure="literal-maths-duplicate"] .kid-cards-finish-actions button.is-next,
[data-course-structure="literal-maths-duplicate"] .family-guide-actions button:nth-child(2) {
  background: var(--subject-dominant);
}

[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__hero {
  background: var(--subject-support);
}

[data-course-structure="literal-maths-duplicate"] .division-module-nav button.is-current {
  background: var(--subject-support);
}

[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__copy h1 em,
[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__progress header > strong {
  color: color-mix(in srgb, var(--subject-dominant) 55%, var(--foundation-ink));
}

[data-course-structure="literal-maths-duplicate"] :is(
  .kid-lesson-welcome__copy > span,
  .kid-lesson-welcome__goals > span,
  .kid-lesson-welcome__progress header span,
  .kid-step-kicker,
  .kid-step-question span,
  .kid-step-takeaway span,
  .kid-lab-launch-copy > span,
  .kid-lab-heading > span,
  .kid-lab-answer > span,
  .kid-cards-heading > span,
  .kid-cards-progress > p strong,
  .kid-summary-heading > div > span,
  .kid-summary-example > div > span,
  .kid-summary-journey > header > span,
  .kid-summary-say span,
  .family-guide-hero > div > span,
  .family-guide-ready > header > span,
  .family-guide-cheat > header > span,
  .family-guide-session > header > span,
  .family-guide-check > header > span,
  .family-guide-finish > span
) {
  color: color-mix(in srgb, var(--subject-dominant) 62%, var(--foundation-ink));
}

[data-course-structure="literal-maths-duplicate"] :is(
  .kid-step-copy h1 em,
  .kid-step-lab-copy h1 em,
  .kid-lab-launch-copy h1 em,
  .kid-lab-finish-card h1 em,
  .kid-summary-heading h1 em,
  .family-guide-hero h1 em,
  .family-guide-finish h2 em
) {
  color: var(--subject-dominant);
}

[data-course-structure="literal-maths-duplicate"] .kid-cards-finish h1 strong {
  color: var(--subject-dominant);
}

[data-course-structure="literal-maths-duplicate"] .kid-cards-finish h1 em {
  color: color-mix(in srgb, var(--subject-dominant) 62%, var(--foundation-ink));
}

[data-course-structure="literal-maths-duplicate"] .kid-lesson-welcome__teacher > span {
  background: color-mix(in srgb, var(--subject-dominant) 46%, white);
}
[data-course-structure="literal-maths-duplicate"].division-flashcards-page,
[data-course-structure="literal-maths-duplicate"] .kid-cards-page {
  background: var(--subject-support) !important;
}

[data-course-structure="literal-maths-duplicate"].division-flashcards-page > .division-module-nav button.is-current {
  background: var(--subject-dominant);
}