/* GÉNÉSIS — DARK INTELLIGENCE
   Le bleu signale uniquement l'action, la progression et la découverte. */
:root {
  --genesis-bg: #060a12;
  --genesis-sidebar: #090e18;
  --genesis-surface: #0d1420;
  --genesis-surface-raised: #121c2b;
  --genesis-surface-hover: #162235;
  --genesis-border: #1b2738;
  --genesis-border-subtle: rgba(255,255,255,.06);
  --genesis-text-primary: #f5f7fa;
  --genesis-text-secondary: #aab5c2;
  --genesis-text-tertiary: #6f7c8c;
  --genesis-text-disabled: #4d5866;
  --genesis-blue: #086cff;
  --genesis-blue-bright: #168bff;
  --genesis-blue-light: #5cb8ff;
  --genesis-blue-dark: #062d73;
  --genesis-blue-deep: #031a42;
  --genesis-success: #86a68c;
  --genesis-warning: #d5a85f;
  --genesis-danger: #ca7379;
  --genesis-focus: 0 0 0 3px rgba(8,108,255,.22);
  --genesis-glow: 0 0 24px rgba(8,108,255,.18);
  --bg: var(--genesis-bg);
  --panel: var(--genesis-surface);
  --soft: var(--genesis-surface-raised);
  --line: var(--genesis-border);
  --muted: var(--genesis-text-secondary);
  --text: var(--genesis-text-primary);
  --accent: var(--genesis-blue);
  --accent2: var(--genesis-blue-light);
  --surface: var(--genesis-surface);
}

html { background: var(--genesis-bg); }
body {
  background: var(--genesis-bg);
  color: var(--genesis-text-primary);
}
::selection { background: rgba(8,108,255,.32); color: var(--genesis-text-primary); }
:focus-visible { outline: 2px solid var(--genesis-blue-bright); outline-offset: 3px; }

/* Shell et identité */
.sidebar { border-right-color: var(--genesis-border-subtle); background: var(--genesis-sidebar); }
.brand-mark,
.tutor-mark,
.ai-avatar {
  position: relative;
  isolation: isolate;
  background: var(--genesis-blue);
  color: white;
  box-shadow: 0 0 18px rgba(8,108,255,.18);
}
.brand-mark::before,
.tutor-mark::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: -7px;
  border: 1px solid rgba(92,184,255,.18);
  border-radius: 50%;
}
.logo small { color: var(--genesis-text-tertiary); }
.nav button { position: relative; color: var(--genesis-text-secondary); transition: color .18s ease, background .18s ease; }
.nav button:hover { background: var(--genesis-surface); color: var(--genesis-text-primary); }
.nav button.active { background: var(--genesis-surface-raised); color: var(--genesis-text-primary); }
.nav button.active::before { content: ''; position: absolute; inset: 8px auto 8px 0; width: 2px; border-radius: 99px; background: var(--genesis-blue); }
.student:hover { background: var(--genesis-surface); }
.avatar { background: var(--genesis-surface-raised); color: var(--genesis-blue-light); box-shadow: inset 0 0 0 1px var(--genesis-border); }
.topbar { border-color: var(--genesis-border-subtle); background: rgba(6,10,18,.9); }
.crumb { color: var(--genesis-text-tertiary); }
.crumb b { color: var(--genesis-text-primary); }
.status-pill { color: var(--genesis-text-tertiary); }
.dot { background: var(--genesis-success); }

/* Actions */
.btn { background: var(--genesis-blue); color: white; transition: background .18s ease, box-shadow .18s ease, border-color .18s ease; }
.btn:hover { background: var(--genesis-blue-bright); box-shadow: var(--genesis-glow); }
.btn.secondary { border: 1px solid var(--genesis-border); background: var(--genesis-surface); color: var(--genesis-text-secondary); box-shadow: none; }
.btn.secondary:hover { border-color: rgba(92,184,255,.35); background: var(--genesis-surface-hover); color: var(--genesis-text-primary); box-shadow: none; }
.ask-tutor { color: var(--genesis-blue-light); }
.ask-tutor:hover { color: white; }

/* Dashboard */
.dashboard-welcome .eyebrow,
.resume-copy > span,
.section-heading span,
.exercise-kicker,
.scenario-label,
.exercise-start > span { color: var(--genesis-blue-light); }
.dashboard-welcome p,
.section-heading > p { color: var(--genesis-text-secondary); }
.resume-panel {
  position: relative;
  overflow: hidden;
  background: var(--genesis-surface);
  box-shadow: inset 0 0 0 1px var(--genesis-border-subtle);
}
.resume-panel::after {
  content: '';
  position: absolute;
  pointer-events: none;
  width: 330px;
  height: 330px;
  right: -190px;
  top: -210px;
  border: 1px solid rgba(92,184,255,.045);
  border-radius: 50%;
  box-shadow: 0 0 0 54px rgba(92,184,255,.025), 0 0 0 108px rgba(92,184,255,.014);
}
.resume-copy h2 { color: var(--genesis-text-secondary); }
.resume-meta { color: var(--genesis-text-tertiary); }
.resume-meta b { color: var(--genesis-text-primary); }
.resume-progress,
.signal-bar { background: var(--genesis-border); }
.resume-progress i,
.signal-bar i { background: var(--genesis-blue); }
.resume-copy p small { color: var(--genesis-text-tertiary); }
.chapter-track::before { background: var(--genesis-border); }
.track-node { color: var(--genesis-text-tertiary); }
.track-node i { border-color: var(--genesis-border); background: var(--genesis-bg); }
.track-node span { color: var(--genesis-text-tertiary); }
.track-node:hover i { border-color: var(--genesis-blue-dark); }
.track-node.active i { border-color: var(--genesis-blue-bright); background: var(--genesis-blue); color: white; box-shadow: 0 0 0 5px rgba(8,108,255,.1), 0 0 22px rgba(8,108,255,.16); }
.track-node.active span { color: var(--genesis-blue-light); }
.track-node.done i { border-color: var(--genesis-text-secondary); background: var(--genesis-text-secondary); color: var(--genesis-bg); }
.track-node.locked i,
.track-node.locked span { color: var(--genesis-text-disabled); }
.learning-signals { border-color: var(--genesis-border-subtle); }
.learning-signals > div + div { border-color: var(--genesis-border-subtle); }
.learning-signals span,
.learning-signals small { color: var(--genesis-text-tertiary); }

/* Parcours et surfaces */
.chapter-row,
.journey-chapter,
.path-step,
.practice-event,
.evaluation-gate { border-color: var(--genesis-border-subtle); }
.journey-chapter:not(.locked):hover,
.path-step:not(.locked):hover,
.practice-event:hover { background: rgba(13,20,32,.72); }
.chapter-index,
.path-node { background: var(--genesis-surface-raised); color: var(--genesis-text-secondary); }
.path-step:not(.locked) .path-node,
.journey-chapter:not(.locked) .chapter-index { box-shadow: inset 0 0 0 1px rgba(8,108,255,.22); }
.path-step:not(.locked) .path-node { color: var(--genesis-blue-light); }
.state-label { color: var(--genesis-blue-light); }
.locked-label { color: var(--genesis-text-disabled); }
.slim-progress { background: var(--genesis-border); }
.slim-progress i { background: var(--genesis-blue); }
.course-grid { border-color: var(--genesis-border); background: var(--genesis-border); }
.course-card { background: var(--genesis-surface); }
.course-card:hover { background: var(--genesis-surface-hover); }
.course-card small { color: var(--genesis-blue-light); }

/* Lecture et grammaire pédagogique */
.lesson p,
.lesson li { color: var(--genesis-text-secondary); }
.course-intro,
.course-section { border-color: var(--genesis-border-subtle); }
.course-progress-head b { color: var(--genesis-text-secondary); }
.section-kicker { color: var(--genesis-blue-light); }
.opening-case { border-left-color: var(--genesis-blue); background: rgba(13,20,32,.72); }
.callout { position: relative; border: 0; border-left: 2px solid var(--genesis-blue); background: var(--genesis-surface) !important; }
.callout::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 1px; background: currentColor; opacity: .3; }
.callout b { color: var(--genesis-blue-light); }
.callout.warning { border-left-color: var(--genesis-warning); }
.callout.warning b { color: var(--genesis-warning); }
.callout.architect { border-left-color: var(--genesis-blue-light); }
.callout.architect b { color: var(--genesis-blue-light); }
.callout.deep { border-left-color: var(--genesis-blue-dark); }
.callout.principle { border-left-color: var(--genesis-blue); }
.takeaways { background: var(--genesis-surface); box-shadow: inset 2px 0 0 var(--genesis-success); }
.takeaways .eyebrow { color: var(--genesis-success); }
.side-note { border-color: var(--genesis-border-subtle); background: rgba(13,20,32,.78); }
.course-completed-actions { border-color: var(--genesis-border-subtle); }
.course-completed-actions span { color: var(--genesis-success); }

/* Exercices */
.scenario-card { border-left-color: var(--genesis-blue); background: var(--genesis-surface); }
.scenario-objective { border-color: var(--genesis-border); }
.exercise-explainer { border-color: var(--genesis-border-subtle); }
.exercise-explainer > div + div { border-color: var(--genesis-border-subtle); }
.exercise-step { border-color: var(--genesis-border-subtle); }
.exercise-step > span { color: var(--genesis-blue-light); }
.exercise-step textarea,
.classification-item select { border-color: var(--genesis-border); background: var(--genesis-surface); color: var(--genesis-text-primary); }
.exercise-step textarea::placeholder { color: var(--genesis-text-tertiary); }
.exercise-step textarea:focus,
.classification-item select:focus { border-color: var(--genesis-blue); outline: 0; box-shadow: var(--genesis-focus); }
.classification-grid { border-color: var(--genesis-border); background: var(--genesis-border); }
.classification-item { background: var(--genesis-surface); }
.hint-box { border-color: var(--genesis-border); background: rgba(13,20,32,.55); }
.attempt-review { border-color: var(--genesis-border); background: var(--genesis-surface); }

/* Évaluations */
.eval-banner,
.evaluation-gate { background: transparent; }
.evaluation-gate:not(.locked) { box-shadow: inset 2px 0 0 var(--genesis-blue); }
.gate-icon { color: var(--genesis-blue-light); }

/* Tuteur */
.tutor-workspace { position: relative; }
.tutor-workspace::before {
  content: '';
  position: absolute;
  pointer-events: none;
  width: 310px;
  height: 310px;
  top: 120px;
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid rgba(92,184,255,.035);
  border-radius: 50%;
  box-shadow: 0 0 0 46px rgba(92,184,255,.02), 0 0 90px rgba(8,108,255,.045);
}
.tutor-context { border-color: var(--genesis-border-subtle); color: var(--genesis-text-tertiary); }
.tutor-context span { color: var(--genesis-blue-light); }
.tutor-context strong { color: var(--genesis-text-primary); }
.tutor-welcome { position: relative; }
.tutor-welcome > p { color: var(--genesis-text-secondary); }
.tutor-suggestions button { border-color: var(--genesis-border); color: var(--genesis-text-secondary); }
.tutor-suggestions button:hover { border-color: var(--genesis-blue-dark); background: var(--genesis-surface); color: var(--genesis-text-primary); }
.tutor-offline { color: var(--genesis-text-tertiary); }
.tutor-composer-wrap { background: linear-gradient(transparent, var(--genesis-bg) 35%); }
.composer { border-color: var(--genesis-border); background: var(--genesis-surface); }
.composer:focus-within { border-color: var(--genesis-blue); box-shadow: var(--genesis-focus); }
.composer textarea { color: var(--genesis-text-primary); }
.send { background: var(--genesis-blue); color: white; }
.send:hover { background: var(--genesis-blue-bright); box-shadow: var(--genesis-glow); }

/* Déblocage et états */
.unlock-toast { overflow: hidden; border-color: rgba(92,184,255,.26); background: var(--genesis-surface-raised); color: var(--genesis-text-primary); box-shadow: var(--genesis-glow); }
.unlock-toast::after { content: ''; position: absolute; width: 70px; height: 70px; right: -42px; top: -42px; border: 1px solid rgba(92,184,255,.15); border-radius: 50%; box-shadow: 0 0 0 16px rgba(92,184,255,.04); }
.notice { border-color: rgba(213,168,95,.25); background: rgba(213,168,95,.07); color: #e3c98f; }

@media (max-width: 720px) {
  .resume-panel::after,
  .tutor-workspace::before { opacity: .45; }
}

@media (max-width: 900px) {
  .menu { width: 34px; height: 34px; display: grid; place-items: center; margin-right: 10px; border: 1px solid var(--genesis-border); border-radius: 9px; background: var(--genesis-surface); color: var(--genesis-text-primary); cursor: pointer; }
  .sidebar { box-shadow: 18px 0 50px rgba(0,0,0,.42); }
  .topbar { justify-content: flex-start; }
  .status-pill { margin-left: auto; }
}

@media (prefers-reduced-motion: no-preference) {
  .track-node.active i { animation: genesis-reveal .42s ease both; }
  .unlock-toast { animation: genesis-toast .32s ease both; }
}
@keyframes genesis-reveal { from { transform: scale(.86); box-shadow: 0 0 0 0 rgba(8,108,255,0); } to { transform: scale(1); box-shadow: 0 0 0 5px rgba(8,108,255,.1), 0 0 22px rgba(8,108,255,.16); } }
@keyframes genesis-toast { from { opacity: 0; transform: translate(-35%,-8px); } to { opacity: 1; transform: translate(-35%,0); } }