@font-face{font-family:Poppins;src:url('./fonts/Poppins-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Poppins;src:url('./fonts/Poppins-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
/* Fresh NyneStitch design tokens — no old screen CSS. */
@font-face{font-family:Inika;src:url('./fonts/Inika-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Inika;src:url('./fonts/Inika-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
/* App palette. Complete colours preserve existing var(--page) consumers;
   -rgb companions support alpha without changing the legacy contract. */
:root,
[data-theme='daylight'] {
  --font-body: Poppins, Arial, sans-serif;
  --font-heading: Poppins, Arial, sans-serif;
  /* Canvas */
  --page:rgb(245 246 246); --page-rgb:245 246 246;
  --surface:rgb(255 255 255); --surface-rgb:255 255 255;
  --photo:rgb(232 235 237); --photo-rgb:232 235 237;
  --ink:rgb(17 18 20); --ink-rgb:17 18 20;
  --muted:rgb(85 89 92); --muted-rgb:85 89 92;
  --absent:rgb(98 103 107); --absent-rgb:98 103 107;
  --shadow:rgb(0 0 0); --shadow-rgb:0 0 0;           /* neutral shadows */
  /* Neutral accent; legacy brand names remain compatible. */
  --brand:rgb(17 18 20); --brand-rgb:17 18 20;
  --brand-dark:rgb(17 18 20); --brand-dark-rgb:17 18 20;
  --brand-tint:rgb(232 235 237); --brand-tint-rgb:232 235 237;
  --brand-soft:rgb(174 180 184); --brand-soft-rgb:174 180 184;
  /* Forward / right — emerald */
  --forward:rgb(15 128 96); --forward-rgb:15 128 96;
  --forward-dark:rgb(10 94 70); --forward-dark-rgb:10 94 70;
  --danger:rgb(194 57 47); --danger-rgb:194 57 47;
  /* Marks bands — emerald, saffron, coral */
  --marks-strong:rgb(15 128 96); --marks-strong-rgb:15 128 96;
  --marks-middle:rgb(201 138 11); --marks-middle-rgb:201 138 11;
  --marks-help:rgb(214 69 59); --marks-help-rgb:214 69 59;
  --tint-green:rgb(227 244 236); --tint-green-rgb:227 244 236;
  --tint-green-edge:rgb(159 211 186); --tint-green-edge-rgb:159 211 186;
  --tint-green-ink:rgb(11 82 61); --tint-green-ink-rgb:11 82 61;
  --tint-green-press:rgb(127 194 164); --tint-green-press-rgb:127 194 164;
  --tint-yellow:rgb(253 243 215); --tint-yellow-rgb:253 243 215;
  --tint-yellow-edge:rgb(237 200 96); --tint-yellow-edge-rgb:237 200 96;
  --tint-red:rgb(252 235 232); --tint-red-rgb:252 235 232;
  --tint-red-edge:rgb(240 168 159); --tint-red-edge-rgb:240 168 159;
  --score-high:rgb(12 107 79); --score-high-rgb:12 107 79;
  --score-middle:rgb(131 90 0); --score-middle-rgb:131 90 0;
  --score-low:rgb(176 51 42); --score-low-rgb:176 51 42;
  --control-radius: 16px;
  --tile-radius: 12px;
  --space-small: 8px;
  --space-medium: 16px;
  color-scheme: light;
}
[data-theme='night'] {
  --page:rgb(17 18 20); --page-rgb:17 18 20;
  --surface:rgb(32 34 36); --surface-rgb:32 34 36;
  --photo:rgb(43 46 49); --photo-rgb:43 46 49;
  --ink:rgb(255 255 255); --ink-rgb:255 255 255;
  --muted:rgb(204 204 204); --muted-rgb:204 204 204;
  --absent:rgb(160 160 160); --absent-rgb:160 160 160;
  --shadow:rgb(0 0 0); --shadow-rgb:0 0 0;
  --brand:rgb(255 255 255); --brand-rgb:255 255 255;
  --brand-dark:rgb(255 255 255); --brand-dark-rgb:255 255 255;
  --brand-tint:rgb(43 46 49); --brand-tint-rgb:43 46 49;
  --brand-soft:rgb(138 146 152); --brand-soft-rgb:138 146 152;
  --forward:rgb(22 140 104); --forward-rgb:22 140 104;
  --forward-dark:rgb(12 100 74); --forward-dark-rgb:12 100 74;
  --danger:rgb(236 104 92); --danger-rgb:236 104 92;
  --marks-strong:rgb(56 186 142); --marks-strong-rgb:56 186 142;
  --marks-middle:rgb(232 172 52); --marks-middle-rgb:232 172 52;
  --marks-help:rgb(242 108 96); --marks-help-rgb:242 108 96;
  --tint-green:rgb(20 54 44); --tint-green-rgb:20 54 44;
  --tint-green-edge:rgb(44 112 88); --tint-green-edge-rgb:44 112 88;
  --tint-green-ink:rgb(150 228 196); --tint-green-ink-rgb:150 228 196;
  --tint-green-press:rgb(44 112 88); --tint-green-press-rgb:44 112 88;
  --tint-yellow:rgb(58 45 14); --tint-yellow-rgb:58 45 14;
  --tint-yellow-edge:rgb(132 102 30); --tint-yellow-edge-rgb:132 102 30;
  --tint-red:rgb(66 27 28); --tint-red-rgb:66 27 28;
  --tint-red-edge:rgb(142 62 56); --tint-red-edge-rgb:142 62 56;
  --score-high:rgb(128 222 184); --score-high-rgb:128 222 184;
  --score-middle:rgb(242 204 112); --score-middle-rgb:242 204 112;
  --score-low:rgb(255 156 146); --score-low-rgb:255 156 146;
  color-scheme: dark;
}

:root,[data-theme='daylight'],[data-theme='night']{
 --text:var(--ink);--brand-purple:var(--brand);--border:var(--brand-soft);--saved-text:var(--tint-green-ink);
 --font:var(--font-body);--chip-radius:5px;--card-radius:20px;--ease-spring:cubic-bezier(.22,1,.36,1);
 --shadow-focus:inset 0 0 0 100vmax rgb(var(--brand-rgb) / .1);
 --shadow-tile:0 1px 2px rgb(var(--shadow-rgb) / .06),0 2px 8px -2px rgb(var(--shadow-rgb) / .08);
 --shadow-lift:0 2px 4px rgb(var(--shadow-rgb) / .06),0 14px 28px -10px rgb(var(--shadow-rgb) / .24);
 --shadow-pop:0 4px 8px rgb(var(--shadow-rgb) / .08),0 24px 48px -16px rgb(var(--shadow-rgb) / .32);
 --shadow-dock:0 -1px 0 rgb(var(--brand-rgb) / .08),0 -16px 32px -20px rgb(var(--shadow-rgb) / .24);
 --shadow-btn-forward:inset 0 1px 0 rgb(255 255 255 / .2),0 1px 0 var(--forward-dark),0 8px 18px -8px rgb(var(--forward-rgb) / .6);
 --shadow-btn-brand:inset 0 1px 0 rgb(255 255 255 / .16),0 1px 0 var(--brand-dark),0 8px 18px -8px rgb(var(--brand-rgb) / .55);
 --shadow-btn-pressed:inset 0 2px 4px rgb(0 0 0 / .16);
}

/* Foreground colours are independent of the brand's backgrounds and borders. */
:root,[data-theme='daylight']{--action-ink:var(--brand);--action-ink-rgb:var(--brand-rgb);--action-ink-dark:var(--brand-dark);--action-ink-dark-rgb:var(--brand-dark-rgb);--action-ink-soft:var(--brand-soft);--action-ink-soft-rgb:var(--brand-soft-rgb)}
[data-theme='night']{--action-ink:rgb(255 255 255);--action-ink-rgb:255 255 255;--action-ink-dark:rgb(255 255 255);--action-ink-dark-rgb:255 255 255;--action-ink-soft:rgb(204 204 204);--action-ink-soft-rgb:204 204 204}

[data-theme=night]{--legacy-ink-000:var(--ink);--legacy-ink-111:var(--ink);--legacy-ink-50395c:var(--ink);--legacy-ink-555:var(--muted);--legacy-ink-655c6d:var(--muted);--legacy-ink-666:var(--muted);--legacy-ink-6b4c7a:var(--ink);--legacy-ink-786c7e:var(--muted);--legacy-ink-8f8297:var(--muted);}

/* Shared decorative and report roles; foreground and fill stay independent. */
:root,[data-theme=daylight]{--hint:rgb(98 103 107);--divider-rgb:216 220 222;--skeleton-rgb:221 225 227;--on-brand:rgb(255 255 255);--on-brand-rgb:255 255 255;--camera:rgb(17 18 20);--camera-well:rgb(0 0 0);--selection:rgb(221 225 227);--selection-ink:rgb(17 18 20)}
[data-theme=night]{--hint:rgb(204 204 204);--divider-rgb:72 78 82;--skeleton-rgb:56 61 65;--on-brand:rgb(17 18 20);--on-brand-rgb:17 18 20;--selection:rgb(68 75 80);--selection-ink:rgb(255 255 255)}
::selection{background:var(--selection);color:var(--selection-ink)}

:root{--report-page-rgb:245 246 246;--report-brand-rgb:17 18 20;--report-ink-rgb:17 18 20;--report-muted-rgb:85 89 92;--report-divider-rgb:216 220 222}

:root,[data-theme=daylight]{--on-forward:rgb(255 255 255);--on-forward-rgb:255 255 255}
[data-theme=night]{--on-forward:rgb(0 0 0);--on-forward-rgb:0 0 0}
:focus-visible{outline:3px solid var(--brand)!important;outline-offset:2px}
/* Titles and other places the app moves focus to for screen readers are not controls: no outline. */
:is(h1,h2,h3,[tabindex="-1"]):focus-visible{outline:none!important}
/* No focus ring until a keyboard is used (teacher-theme.js adds .keyboard-focus on Tab). */
html:not(.keyboard-focus) :focus-visible{outline:none!important}

img[src*="wordmark-black.svg"]{background:rgb(255 255 255)}