/* We Learn French · Français avec Romain identity.
   The original game layouts and interactions remain in arcade.css. */
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('assets/fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2190-2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('assets/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
:root {
  --arc-ink: #1f2937;
  --arc-muted: #4b5563;
  --arc-paper: #f9fafb;
  --arc-line: #e5e7eb;
  --arc-blue: #13598b;
  --arc-yellow: #daa520;
  --arc-shadow: #0e466e;
  --identity-gold: #daa520;
  --identity-blue: #13598b;
  --identity-burgundy: #800020;
  --identity-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
  --arc-mint: #e7eef3;
  --arc-nav-clearance: 128px;
}
html { scroll-padding-bottom: var(--arc-nav-clearance); }
body.arcade {
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}
.arcade .page { padding-bottom: calc(var(--arc-nav-clearance) + 24px); }
.arcade :is(input, button, [tabindex], .feedback) { scroll-margin-bottom: 16px; }
.arcade .arc-topbar {
  background: var(--identity-gold) !important;
  border: 0;
  border-radius: 16px;
  padding: 12px 16px !important;
  margin-top: 18px;
  min-height: 82px;
  box-shadow: var(--identity-shadow);
}
.arc-brand { min-width: 0; flex-shrink: 1; }
.arc-brand-logo { display: block; width: clamp(140px, 35vw, 290px); max-width: 100%; height: auto; }
.arc-top-stats { flex-shrink: 0; }
.arc-top-stats .stat-icon { color: #674400; }
.arc-top-stats .arc-stat > span:last-child { color: #4c3706; }
.arc-language-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: auto;
  min-width: 76px;
  height: 44px;
  padding: 0 11px;
  border: 1px solid rgb(19 89 139 / .16);
  border-radius: 12px;
  background: #fff;
  color: var(--identity-blue);
  box-shadow: 0 1px 2px rgb(0 0 0 / .05);
}
.arc-language-code { font-size: .75rem; font-weight: 750; line-height: 1; }
.arc-language-trigger svg, .preference-button svg { flex: none; }
.arc-language-trigger:hover, .arc-language-trigger[aria-expanded='true'] { background: var(--identity-blue); color: #fff; }
.arcade .arc-language-trigger:focus-visible { outline-color: var(--identity-burgundy); }
.arcade .arc-dialog .language-button {
  justify-content: flex-start;
  gap: 12px;
  min-height: 52px;
  border-color: var(--arc-line);
  background: #f9fafb;
  color: var(--arc-ink);
}
.arcade .arc-dialog .language-button[aria-pressed='true'] { background: var(--identity-blue); color: #fff; border-color: var(--identity-blue); }
.arcade .arc-dialog .language-button[aria-pressed='true']::after { content: '✓'; margin-left: auto; }
.arcade .arc-dialog .language-button:hover { border-color: var(--identity-blue); }
.preference-button { display: flex; align-items: center; gap: 12px; }
.quest-hero { background: #fcf6e9; border-color: #ead6a1; border-bottom-width: 1px; box-shadow: var(--identity-shadow); }
.quest-label, .quest-copy > p:not(.quest-label) { color: #725712; }
.fr-bubble { background: var(--identity-blue); box-shadow: 0 7px 0 #0e466e; }
.art-sticker { color: var(--identity-burgundy); }
.arcade .arc-primary { background: var(--identity-gold); color: #322600; box-shadow: 0 3px 8px rgb(154 109 7 / .2); }
.arcade .arc-primary:hover { background: var(--identity-blue); color: #fff; }
.arcade .arc-primary:active { box-shadow: 0 1px 2px rgb(0 0 0 / .1); }
.arcade .arc-secondary { box-shadow: 0 2px 4px rgb(0 0 0 / .05); border-width: 1px; }
.quest-hero, .daily-goal, .path-step, .arc-game-card, .arcade .quiz,
.arcade .card-surface, .install-card, .profile-identity, .review-card, .arc-dialog { border-radius: 16px !important; }
.daily-goal, .path-step, .arc-game-card { box-shadow: var(--identity-shadow); }
.path-step:hover, .arc-game-card:hover { box-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1); }
/* The supplied identity rotates gold, blue and burgundy across repeated items. */
.game-articles, .game-singulier, .game-conjugaison { --tile: #fbf3df; --tile-edge: #e8ce8d; --tile-ink: #725712; }
.game-genre, .game-prepositions, .game-participe-passe { --tile: #e7eef3; --tile-edge: #b8cddd; --tile-ink: #13598b; }
.game-transformation, .game-accords { --tile: #f3e5e9; --tile-edge: #d9b3bd; --tile-ink: #800020; }
.path-icon, .launch-icon { border-radius: 12px; box-shadow: 0 2px 4px rgb(0 0 0 / .08); }
.nav-item { min-width: 0; flex: 1; padding: 6px 4px; color: #4b5563; text-align: center; }
.nav-item small { font-size: .75rem; line-height: 1.35; overflow-wrap: anywhere; }
.nav-item.active { color: var(--identity-blue); background: #e7eef3; }
.nav-item.active > span { background: #e7eef3; color: var(--identity-blue); }
.arc-bottom-nav { border-color: var(--arc-line); box-shadow: var(--identity-shadow); }
.profile-avatar { background: #fbf3df; color: var(--identity-blue); }
/* Apply the identity to the remaining progress, lesson and settings surfaces. */
.level-card { background: #e7eef3; border-color: #b8cddd; border-radius: 16px; }
.level-card p, .week-day strong { color: var(--identity-blue); }
.level-track { background: #d9e3eb; }
.level-track span { background: var(--identity-blue); }
.rank-medal { background: #fbf3df; border-color: #fff; color: #725712; box-shadow: var(--identity-shadow); }
.goal-ring { background: conic-gradient(var(--identity-blue) var(--goal), #e5e7eb 0); }
.week-chart, .profile-settings, .empty-state { border-radius: 16px; border-color: var(--arc-line); }
.week-bar { background: #e7eef3; }
.week-bar::after { background: var(--identity-blue); }
.week-day { color: #4b5563; font-size: .75rem; }
.week-day strong { font-size: .75rem; }
.earned-badge { color: #4b5563; background: #f3f4f6; border-radius: 16px; }
.earned-badge > span { background: #e5e7eb; }
.earned-badge small, .earned-badge em, .progress-stats .arc-stat > span:last-child { font-size: .75rem; }
.earned-badge.earned { background: #fbf3df; color: #725712; border-color: #e8ce8d; }
.earned-badge.earned > span { background: #f5e5bd; box-shadow: none; }
.progress-stats .arc-stat, .review-card, .profile-avatar { border-color: var(--arc-line); box-shadow: var(--identity-shadow); }
.review-card { border-bottom-width: 1px; }
.review-card.flipped { background: #fcf6e9; }
.review-done { color: var(--identity-blue); }
.preference-row input { accent-color: var(--identity-blue); }
.install-card { background: #e7eef3; border-color: #b8cddd; }
.install-symbol { color: var(--identity-blue); }
.install-card p { color: #4b5563; }
.offline-status { font-size: .75rem !important; }
.arcade .quiz, .arcade .card-surface {
  border-bottom: 1px solid var(--arc-line) !important;
  box-shadow: var(--identity-shadow) !important;
}
.arcade .memo, .arcade .tips, .arcade aside.card {
  background: #fff !important;
  border-radius: 16px !important;
  box-shadow: var(--identity-shadow) !important;
}
.back-link { background: #e7eef3; color: var(--identity-blue); }
.lesson-heading .rule-pill, .session-options > summary, .arcade .instruction,
.arcade .eyebrow, .arcade .answer-label, .arcade .keyboard-tip { color: #4b5563; }
.arc-round { background: #e5e7eb; }
.arc-round > span { background: var(--identity-blue); border-top: 0; }
.arc-lesson-hud > strong, .arc-combo { color: #4b5563; }
.arc-combo.hot, .arc-session-xp { color: #725712; }
.arcade .level-picker { background: #fbf3df !important; }
.arcade .transform-card { background: #f9fafb; border-color: var(--arc-line); border-radius: 16px; }
.arcade .word-card { border-radius: 16px; box-shadow: var(--identity-shadow); }
.arcade .answer-input:not(.correct):not(.wrong) { background: #f9fafb; border-color: #9ca3af; }
.arcade .answer-input:not(.correct):not(.wrong):focus { border-color: var(--identity-blue); box-shadow: 0 0 0 3px rgb(19 89 139 / .15); }
.arcade .check, .arcade .next, .arcade .restart, .arcade .apply-filter {
  background: var(--identity-gold) !important;
  color: #322600 !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 8px rgb(154 109 7 / .2) !important;
}
.arcade .check:hover, .arcade .next:hover, .arcade .restart:hover, .arcade .apply-filter:hover {
  background: var(--identity-blue) !important;
  color: #fff !important;
}
.arcade .check:disabled {
  background: #e5e7eb !important;
  color: #4b5563 !important;
  box-shadow: none !important;
}
.arcade .letter-buttons button { color: var(--identity-blue); border: 1px solid var(--arc-line); }
.arcade .answer-choice:not(.correct):not(.wrong) { background: #e7eef3; color: var(--identity-blue); border: 1px solid #b8cddd; }
.arcade .choice.m { background: var(--identity-blue); }
.arcade .choice.f { background: var(--identity-burgundy); }
.arcade .feedback.bad { background: #f8e9ed; color: var(--identity-burgundy); }
.arcade .answer-input.wrong, .arcade .answer-choice.wrong { background: #f8e9ed; border-color: #d9b3bd; color: var(--identity-burgundy); }
.arc-dialog { background: #fff; border-color: var(--arc-line); }
.arc-close { background: #f3f4f6; color: #4b5563; }
.launch-modes button[aria-pressed='true'], .launch-durations button[aria-pressed='true'] { background: #e7eef3; border-color: #b8cddd; color: var(--identity-blue); }
@media (max-width: 559px) {
  .arcade .arc-topbar { gap: 8px; padding: 12px !important; }
  .arc-brand-logo { width: clamp(118px, 38vw, 200px); }
  .arc-top-stats { gap: 8px; }
  .arc-top-stats .arc-stat { gap: 2px; }
  .arc-top-stats .arc-stat strong { font-size: .8rem; }
  .arc-language-trigger { min-width: 65px; padding: 0 8px; gap: 5px; }
}
@media (max-width: 359px) {
  .arcade .arc-topbar { gap: 5px; padding: 10px 8px !important; }
  .arc-top-stats { gap: 5px; }
  .arc-language-trigger { min-width: 61px; padding-inline: 6px; }
}