/* Academy V3.2: one visual language, projected curriculum and server progress. */
:root {
  --v32-bg: #060d20;
  --v32-surface: #0c1730;
  --v32-surface-2: #101d3b;
  --v32-line: #263b6a;
  --v32-text: #f6f7ff;
  --v32-muted: #b6c6e6;
  --v32-violet: #8e69ff;
  --v32-cyan: #20cfff;
}
.shell:has(.academy-v2-navigation) { background: var(--v32-bg); color: var(--v32-text); }
.shell:has(.academy-v2-navigation) .main { min-width: 0; background: var(--v32-bg); }
.shell:has(.academy-v2-navigation) .content { width: 100%; max-width: 1760px; padding: 20px clamp(18px, 2.1vw, 36px) 48px; }
.shell:has(.academy-v2-navigation) .sidebar { background: radial-gradient(circle at 5% 95%, rgba(88,48,202,.21), transparent 27%), #06122c; border-right-color: #253963; }
.shell:has(.academy-v2-navigation) .topbar { height: 62px; background: rgba(7,16,37,.95); border-bottom: 1px solid #21345f; }
.shell:has(.academy-v2-navigation) .academy-v2-navigation .nav button { min-height: 46px; border: 1px solid transparent; border-radius: 10px; }
.shell:has(.academy-v2-navigation) .academy-v2-navigation .nav button.active { border-color: #7855ff; background: linear-gradient(90deg, #21185f, #101e49 78%); box-shadow: 0 0 18px rgba(95,72,255,.26), inset 0 0 15px rgba(86,69,235,.18); }
.shell:has(.academy-v2-navigation) .academy-v2-navigation .nav button:hover:not(:disabled) { border-color: #4865b0; background: #172b55; }
.shell:has(.academy-v2-navigation) .status-pill { color: #b7c8e9; }
.shell:has(.academy-v2-navigation) button:focus-visible, .shell:has(.academy-v2-navigation) a:focus-visible,
.shell:has(.academy-v2-navigation) input:focus-visible, .shell:has(.academy-v2-navigation) textarea:focus-visible {
  outline: 3px solid #aeb9ff; outline-offset: 3px;
}
.v32-page { width: 100%; max-width: 1560px; margin: 0 auto; color: var(--v32-text); }
.v32-page * { box-sizing: border-box; min-width: 0; }
.v32-page button { font: inherit; cursor: pointer; }
.v32-page button:disabled { cursor: default; }
.v32-page h1, .v32-page h2, .v32-page h3 { color: var(--v32-text); letter-spacing: -.035em; }
.v32-page p { color: var(--v32-muted); line-height: 1.52; }
.v32-eyebrow { color: #9eb8f7; font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.v32-masthead { position: relative; isolation: isolate; display: flex; align-items: center; min-height: 180px; overflow: hidden; margin: -20px -36px 18px; padding: 24px 44px; background: #060e25; }
.v32-masthead-art, .v32-masthead-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.v32-masthead-art { z-index: -2; object-fit: cover; object-position: center 57%; }
.v32-masthead-shade { z-index: -1; background: linear-gradient(90deg, #060d20 0%, rgba(6,13,32,.96) 24%, rgba(6,13,32,.67) 48%, rgba(6,13,32,.04) 87%), linear-gradient(0deg, #071027 0%, transparent 27%); }
.v32-masthead-content { position: relative; z-index: 1; max-width: min(1070px, 76%); }
.v32-masthead h1 { margin: 7px 0 8px; font-size: clamp(2rem, 3.4vw, 3.55rem); line-height: 1.04; font-weight: 800; }
.v32-masthead h1 em { font-style: normal; color: #bd85ff; background: linear-gradient(105deg, #e4a3ff, #9d7fff 62%, #72baff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.v32-masthead p { max-width: 68ch; margin: 0; color: #e1e9ff; font-size: clamp(.85rem, 1vw, 1rem); }
.v32-masthead--dashboard { min-height: 176px; }
.v32-panel { border: 1px solid var(--v32-line); border-radius: 13px; background: linear-gradient(145deg, rgba(17,32,65,.92), rgba(8,18,42,.97)); box-shadow: inset 0 1px rgba(190,201,255,.04), 0 14px 32px rgba(0,0,0,.12); }
.v32-section { margin-top: 17px; }
.v32-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; margin: 0 0 11px; }
.v32-section-heading h2 { margin: 3px 0 0; font-size: clamp(1.06rem, 1.5vw, 1.28rem); }
.v32-section-heading > span { color: #aebde0; font-size: .76rem; }
.v32-primary { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 43px; padding: 10px 16px; border: 1px solid #8d79ff; border-radius: 9px; background: linear-gradient(115deg, #6150f7, #4232d8); box-shadow: 0 5px 17px rgba(85,54,247,.27); color: #fff; font-size: .83rem; font-weight: 750; transition: transform .16s ease, filter .16s ease; }
.v32-primary:hover { filter: brightness(1.12); transform: translateY(-2px); }
.v32-text-link { padding: 4px 0; border: 0; background: none; color: #beb5ff; font-size: .77rem; font-weight: 700; }
.v32-text-link:hover { color: #fff; }
.v32-fineprint { margin: 13px 0 0; color: #92a6c8 !important; font-size: .72rem; }
.v32-empty { padding: 24px; color: var(--v32-muted); }
.v32-empty h2, .v32-empty h3 { margin: 0 0 6px; }
.v32-icon { display: grid; place-items: center; width: 47px; height: 47px; border: 1px solid currentColor; border-radius: 12px; color: var(--v32-accent); background: color-mix(in srgb, var(--v32-accent) 17%, transparent); box-shadow: 0 0 22px color-mix(in srgb, var(--v32-accent) 18%, transparent); font-size: 1.65rem; line-height: 1; }
.tone-violet { --v32-accent: #ad78ff; }.tone-cyan { --v32-accent: #27d7ff; }.tone-teal { --v32-accent: #24dcc6; }.tone-blue { --v32-accent: #69a5ff; }.tone-amber { --v32-accent: #ffaf65; }.tone-pink { --v32-accent: #ec7bdb; }
.v32-progress-line { display: flex; align-items: center; gap: 11px; }
.v32-progress-line > span { display: block; flex: 1; height: 6px; overflow: hidden; border-radius: 99px; background: #263966; }
.v32-progress-line i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7758f6, #27cafa); transform-origin: left; }
.v32-progress-line strong, .v32-progress-line b { color: #dce8ff; font-size: .74rem; font-style: normal; font-variant-numeric: tabular-nums; }

/* Accueil: a broad illustrated resume, six routes, compact real data. */
.v32-resume { display: grid; grid-template-columns: minmax(175px, 23%) minmax(0, 1fr) auto; align-items: center; gap: 24px; min-height: 166px; padding: 16px; border-color: #6658d1; background: radial-gradient(circle at 100% 100%, rgba(113,50,242,.21), transparent 35%), linear-gradient(115deg, #102448, #101735); }
.v32-resume-art { height: 138px; overflow: hidden; border: 1px solid #4867a9; border-radius: 10px; background: #10183a; }
.v32-resume-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.v32-resume-copy { align-self: center; }
.v32-resume-copy > small { display: block; margin-top: 7px; color: #bbaaff; font-size: .71rem; }
.v32-resume-copy h2 { margin: 4px 0 4px; font-size: clamp(1.15rem, 1.6vw, 1.55rem); }
.v32-resume-copy p { margin: 0 0 13px; font-size: .79rem; }
.v32-resume-action { display: grid; gap: 11px; justify-items: end; padding: 0 8px 0 22px; border-left: 1px solid #314579; }
.v32-destination-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.v32-destination { position: relative; min-height: 142px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 15px; border: 1px solid color-mix(in srgb, var(--v32-accent) 66%, #1e3265); border-radius: 12px; text-align: left; color: var(--v32-text); background: radial-gradient(circle at 110% -10%, color-mix(in srgb, var(--v32-accent) 19%, transparent), transparent 60%), #0e1936; transition: transform .17s ease, box-shadow .17s ease; }
.v32-destination:hover:not(.is-disabled) { transform: translateY(-3px); box-shadow: 0 12px 28px color-mix(in srgb, var(--v32-accent) 18%, transparent); }
.v32-destination .v32-icon { width: 39px; height: 39px; font-size: 1.3rem; }
.v32-destination strong { margin-top: 6px; font-size: .9rem; }
.v32-destination small { color: #bccbe8; font-size: .7rem; line-height: 1.3; }
.v32-destination .v32-arrow { position: absolute; right: 12px; bottom: 12px; color: var(--v32-accent); }
.v32-destination.is-disabled { opacity: .56; }
.v32-dashboard-bottom { display: grid; grid-template-columns: minmax(270px, .85fr) minmax(0, 1.45fr); gap: 12px; margin-top: 17px; }
.v32-dashboard-bottom > section { padding: 17px; }
.v32-progress-summary { position: relative; min-height: 240px; }
.v32-progress-summary .v32-donut { margin: 6px auto 10px; }
.v32-donut { position: relative; display: grid; place-items: center; width: 112px; height: 112px; flex: none; border-radius: 50%; background: conic-gradient(#20d3ff calc(var(--value) * 1%), #2c427a 0); }
.v32-donut::before { content: ''; position: absolute; inset: 12px; border-radius: 50%; background: #101c3c; }
.v32-donut strong { z-index: 1; color: #fff; font-size: 1.2rem; font-variant-numeric: tabular-nums; }
.v32-mini-stats { display: flex; justify-content: center; gap: 20px; text-align: center; }
.v32-mini-stats strong, .v32-mini-stats span { display: block; }
.v32-mini-stats strong { font-size: .9rem; color: #fff; }.v32-mini-stats span { font-size: .68rem; color: #afbfdf; }
.v32-progress-summary .v32-fineprint { text-align: center; }
.v32-next-courses { display: grid; align-content: start; }
.v32-course-row { display: grid; grid-template-columns: 91px minmax(0,1fr) auto; gap: 12px; align-items: center; width: 100%; margin-top: 7px; padding: 7px; border: 1px solid #284071; border-radius: 9px; background: #0c1938; color: #fff; text-align: left; transition: border-color .16s ease, transform .16s ease; }
.v32-course-row:hover { border-color: #7b65ed; transform: translateX(2px); }
.v32-course-row img { width: 91px; height: 64px; object-fit: cover; border-radius: 7px; }
.v32-course-row small, .v32-course-row strong, .v32-course-row em { display: block; }.v32-course-row small { color: #a39aff; font-size: .66rem; }.v32-course-row strong { margin: 2px 0; font-size: .82rem; }.v32-course-row em { color: #aebcde; font-size: .68rem; font-style: normal; }.v32-course-row > b { color: #a68aff; }

/* Apprendre: six curricular groupings, only projected titles and routes. */
.v32-category-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.v32-category { display: grid; grid-template-columns: 34px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; gap: 2px 8px; min-height: 83px; padding: 11px; border: 1px solid #2a4776; border-radius: 10px; text-align: left; color: #fff; background: #0b1a37; transition: border-color .16s ease, transform .16s ease; }
.v32-category:not(:disabled):hover, .v32-category.is-selected { border-color: var(--v32-accent); transform: translateY(-2px); background: color-mix(in srgb, var(--v32-accent) 12%, #0b1a37); }
.v32-category:disabled { opacity: .5; }.v32-category .v32-icon { grid-row: 1/3; width: 32px; height: 32px; border: none; background: none; box-shadow: none; font-size: 1.55rem; }.v32-category strong { font-size: .73rem; line-height: 1.17; }.v32-category small { color: #a8bbdf; font-size: .6rem; line-height: 1.15; }
.v32-featured { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, .72fr); align-items: center; min-height: 185px; overflow: hidden; margin-top: 16px; padding: 20px 26px; border-color: color-mix(in srgb, var(--v32-accent) 55%, #263b6a); background: radial-gradient(circle at 78% 50%, color-mix(in srgb, var(--v32-accent) 18%, transparent), transparent 50%), #0e1b3d; }
.v32-featured h2 { margin: 7px 0 7px; font-size: clamp(1.5rem, 2.1vw, 2.1rem); }.v32-featured p { max-width: 47ch; margin: 0 0 14px; font-size: .82rem; }.v32-featured img { width: 100%; height: 158px; object-fit: cover; border-radius: 9px; mask-image: linear-gradient(90deg, transparent, black 18%); }
.v32-continue { display: grid; grid-template-columns: 160px minmax(0,1fr) auto; align-items: center; gap: 16px; width: 100%; padding: 8px 16px 8px 8px; color: #fff; text-align: left; }.v32-continue:hover { border-color: #7d70ee; }.v32-continue img { width: 160px; height: 81px; object-fit: cover; border-radius: 8px; }.v32-continue small, .v32-continue strong, .v32-continue em { display: block; }.v32-continue small { color: #ada4ff; font-size: .7rem; }.v32-continue strong { margin: 3px 0; font-size: .93rem; }.v32-continue em { color: #afc1e1; font-size: .72rem; font-style: normal; }.v32-continue > b { color: #b1a3ff; font-size: .76rem; }
.v32-chapter-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.v32-chapter-card { display: block; overflow: hidden; padding: 7px; text-align: left; color: #fff; }.v32-chapter-card:hover { border-color: #7369db; transform: translateY(-2px); }.v32-chapter-card > img { width: 100%; height: 114px; object-fit: cover; border-radius: 8px; }.v32-chapter-card > span { display: block; padding: 9px 7px 7px; }.v32-chapter-card small, .v32-chapter-card strong, .v32-chapter-card em { display: block; }.v32-chapter-card small { color: #ada2ff; font-size: .67rem; }.v32-chapter-card strong { margin: 5px 0; font-size: .91rem; }.v32-chapter-card em { min-height: 34px; color: #b6c5e1; font-size: .72rem; font-style: normal; }.v32-chapter-card .v32-progress-line { margin-top: 10px; }

/* Pratiquer and Evaluations: catalog cards rather than plain rows. */
.v32-filters { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 16px; }.v32-filters button { min-height: 38px; padding: 7px 12px; border: 1px solid #2b477b; border-radius: 9px; background: #0d1c3b; color: #c5d4ee; font-size: .76rem; }.v32-filters button:hover, .v32-filters button.is-selected { border-color: #8f6aff; background: #231b66; color: #fff; }
.v32-more { display: block; width: 100%; min-height: 44px; margin-top: 12px; border: 1px solid #5f58b8; border-radius: 9px; background: #171d4a; color: #e4dfff; font-size: .82rem; }
.v32-practice-grid, .v32-evaluation-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 13px; }.v32-practice-card, .v32-evaluation-card { overflow: hidden; }.v32-practice-card > img, .v32-evaluation-card > img, .v32-evaluation-locked-art { display: block; width: 100%; height: 156px; object-fit: cover; }.v32-practice-card > div, .v32-evaluation-card > div:last-child { padding: 17px; }.v32-practice-card h3, .v32-evaluation-card h3 { margin: 6px 0; font-size: 1rem; }.v32-practice-card p, .v32-evaluation-card p { min-height: 51px; margin: 0 0 13px; font-size: .77rem; }.v32-practice-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.v32-practice-foot > span { color: #8bcfdd; font-size: .72rem; }.v32-practice-foot .v32-primary { min-height: 37px; padding: 7px 12px; }
.v32-metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 11px; margin: 16px 0; }.v32-metric { display: flex; align-items: center; gap: 14px; min-height: 108px; padding: 16px; border-color: color-mix(in srgb, var(--v32-accent) 46%, #263b6a); }.v32-metric > span:last-child { display: grid; gap: 2px; }.v32-metric b { color: var(--v32-accent); font-size: 1.7rem; font-variant-numeric: tabular-nums; }.v32-metric strong { color: #f0f4ff; font-size: .85rem; }.v32-metric small { color: #b6c5df; font-size: .7rem; }.v32-metric .v32-donut { width: 72px; height: 72px; }.v32-metric .v32-donut::before { inset: 9px; }.v32-metric .v32-donut strong { font-size: .88rem; }
.v32-evaluation-advice { display: flex; align-items: center; gap: 17px; padding: 16px; border-color: #2c75bb; }.v32-evaluation-advice > div { flex: 1; }.v32-evaluation-advice h2 { margin: 0 0 4px; font-size: .94rem; }.v32-evaluation-advice p { margin: 0; font-size: .76rem; }.v32-evaluation-card small { display: block; margin-bottom: 10px; color: #8de4cf; }.v32-evaluation-card .v32-primary { width: 100%; }.v32-evaluation-card.is-locked { opacity: .7; }.v32-evaluation-locked-art { display: grid; place-items: center; background: radial-gradient(circle, #24345d, #09162c); color: #7990c7; font-size: 3rem; }.v32-locked-label { color: #b8c4dc; font-size: .75rem; }

/* Progression: distinct completion, exercises, and server-validated mastery. */
.v32-progress-columns { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(270px,.85fr); gap: 12px; }.v32-progress-columns > section, .v32-progress-columns > div > section { padding: 18px; }.v32-progress-columns > div { display: grid; gap: 12px; align-content: start; }.v32-progress-columns p { font-size: .75rem; }.v32-chapter-progress { display: grid; grid-template-columns: 30px minmax(0,1fr) 28px; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid #22365f; }.v32-chapter-progress.is-locked { opacity: .52; }.v32-step-dot { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: #5b58d5; font-size: .75rem; }.v32-chapter-progress strong, .v32-chapter-progress small { display: block; }.v32-chapter-progress strong { font-size: .78rem; }.v32-chapter-progress small { margin: 3px 0 7px; color: #a9b7d3; font-size: .66rem; }.v32-chapter-progress button { border: 1px solid #38528b; border-radius: 50%; background: #1a2a55; color: #bcb3ff; width: 27px; height: 27px; }.v32-donut--mastery { margin: 15px auto; background: conic-gradient(#9f73ff calc(var(--value) * 1%), #2c427a 0); }.v32-review-row { display: grid; grid-template-columns: 1fr auto; width: 100%; gap: 2px; padding: 9px; border: 1px solid #2b4271; border-radius: 8px; margin-top: 7px; text-align: left; color: #fff; background: #0f1c39; }.v32-review-row strong { font-size: .76rem; }.v32-review-row small { grid-column: 1; color: #afbcdb; }.v32-review-row span { grid-row: 1/3; grid-column: 2; align-self: center; color: #b29afa; }

/* Projet: actual private drafts, 12 real steps, manual save. */
.v32-project .academy-v2-project { max-width: none; --project-line: #2b4171; --project-muted: #b6c6e5; }.v32-project .v2-project-head { display: none; }.v32-project .v2-project-summary { display: grid; grid-template-columns: minmax(170px, 23%) minmax(0,1fr) auto; min-height: 164px; gap: 20px; margin: 0 0 14px; padding: 14px; border-radius: 13px; background: linear-gradient(115deg, #0e2345, #121940); }.v32-project-art { width: 100%; height: 130px; border-radius: 9px; object-fit: cover; }.v32-project .v2-project-summary h2 { font-size: clamp(1.2rem, 1.9vw, 1.8rem); }.v32-project .v2-project-progress { color: #82dcff; font-size: 1.2rem; }.v32-project .v2-project-workspace { display: block; }.v32-project .v2-project-steps { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 7px; margin-bottom: 13px; padding: 14px; border-radius: 12px; background: #0b1936; }.v32-project .v2-project-step { display: grid; grid-template-columns: 27px minmax(0,1fr); padding: 9px; border: 1px solid #2b4478; border-radius: 9px; background: #111e3c; }.v32-project .v2-project-step.selected { border-color: #926cff; background: #261d62; box-shadow: 0 0 17px rgba(92,66,246,.19); }.v32-project .v2-project-step span { color: #a98aff; }.v32-project .v2-project-step b { font-size: .72rem; }.v32-project .v2-project-step small { font-size: .63rem; }.v32-project .v2-project-editor, .v32-project .v2-project-empty, .v32-project .v2-project-state { border-radius: 12px; background: #0d1b38; }.v32-project .v2-project-editor-head > p { margin-bottom: 12px; }.v32-project .v2-project-editor textarea, .v32-project .v2-project-empty input { border-color: #3b568e; border-radius: 9px; background: #08152e; }.v32-project .v2-project-tutor { border-color: #5550ac; border-radius: 10px; background: #151d44; }.v32-project-step-actions { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0 20px; }.v32-project-step-actions button { min-height: 37px; padding: 7px 11px; border: 1px solid #566aab; border-radius: 8px; color: #dde4ff; background: #17274b; }

/* Tutor: written conversation, real context and prompt actions. */
.shell.tutor-focus:has(.v32-masthead--tutor) { grid-template-columns: 238px minmax(0,1fr); }.shell.tutor-focus:has(.v32-masthead--tutor) .content { padding: 20px clamp(18px,2.1vw,36px) 32px; }.shell:has(.v32-masthead--tutor) .v32-masthead { margin: -20px -36px 16px; }.v32-tutor-layout { height: min(850px, calc(100dvh - 265px)); min-height: 520px; border: 1px solid #30477e; border-radius: 13px; overflow: hidden; background: #07142c; }.v32-tutor-layout .tutor-header { padding: 12px 18px; background: #0b1b3a; border-bottom-color: #2b437a; }.v32-tutor-layout .tutor-header h1 { font-size: 1rem; }.v32-tutor-layout .tutor-thread { padding: 20px max(18px,calc((100% - 1000px)/2)) 188px; }.v32-tutor-layout .tutor-hub { max-width: 1000px; margin-bottom: 20px; }.v32-tutor-layout .tutor-hub-intro { text-align: left; padding: 0 0 16px; }.v32-tutor-layout .tutor-hub-intro h2 { font-size: clamp(1.28rem,2vw,1.8rem); }.v32-tutor-layout .tutor-path-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.v32-tutor-layout .tutor-path { border-color: #455a9f; border-radius: 11px; background: #111f46; }.v32-tutor-layout .tutor-compose-zone { padding: 16px max(18px,calc((100% - 1000px)/2)) 14px; background: linear-gradient(transparent, #07142c 18%); }.v32-tutor-quick { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin-bottom: 9px; }.v32-tutor-quick button { min-height: 42px; padding: 7px; border: 1px solid #634ed1; border-radius: 9px; background: #211c53; color: #e6deff; font-size: .74rem; }.v32-tutor-quick button:nth-child(2) { border-color: #187cad; background: #0b334e; color: #cbf4ff; }.v32-tutor-quick button:nth-child(3) { border-color: #a048a9; background: #3b1b52; }.v32-tutor-quick button:nth-child(4) { border-color: #986448; background: #352539; }.v32-tutor-quick button:hover { filter: brightness(1.18); }.v32-tutor-layout .tutor-compose { border-color: #4260a8; border-radius: 11px; background: #101d3e; }.v32-tutor-layout .tutor-send { background: #694ef6; color: #fff; }
.shell.v2-course-focus .v3-tutor-quick { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }.shell.v2-course-focus .v3-tutor-quick button { min-height: 35px; }
.v32-tutor-shell { display: grid; grid-template-columns: minmax(0,1fr) minmax(245px,290px); gap: 13px; align-items: start; }
.v32-tutor-context { overflow: hidden; min-height: 300px; padding: 14px; border-color: #36538e; }
.v32-tutor-context img { display: block; width: 100%; height: 135px; margin: 10px 0 15px; border-radius: 9px; object-fit: cover; }
.v32-tutor-context h2 { margin: 0 0 8px; color: #f6f7ff; font-size: 1.13rem; line-height: 1.2; }
.v32-tutor-context p { color: #b9cae9; font-size: .78rem; line-height: 1.5; }
.v32-tutor-context button { width: 100%; min-height: 39px; margin-top: 12px; border: 1px solid #615ac8; border-radius: 8px; background: #211d5c; color: #e6ddff; font-weight: 700; }
.v32-tutor-context button:hover { border-color: #a38cff; background: #302676; }

/* Detail pages receive the same surfaces while their official actions stay intact. */
.shell:has(.academy-v2-chapter) .content, .shell:has(.evaluation-form,.evaluation-result) .content { max-width: 1420px; }.academy-v2-chapter .v2-journey-head, .shell:has(.evaluation-form,.evaluation-result) .page-head { border: 1px solid #2c477e; border-radius: 13px; padding: 23px; background: radial-gradient(circle at 100% 0, rgba(87,61,193,.18), transparent 40%), #0c1b38; }.academy-v2-chapter .v2-journey-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }.academy-v2-chapter .v2-journey-list > li { border: 0; }.academy-v2-chapter .v2-journey-row { min-height: 112px; height: 100%; border: 1px solid #2d477e; border-radius: 11px; background: #102045; }.academy-v2-chapter .v2-journey-row:hover { border-color: #8868f4; }

@keyframes v32-enter { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@keyframes v32-fill { from { transform: scaleX(.04); } to { transform: scaleX(1); } }
@media (max-width: 1250px) { .v32-destination-grid, .v32-category-strip { grid-template-columns: repeat(3,minmax(0,1fr)); }.v32-practice-grid, .v32-evaluation-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.v32-project .v2-project-steps { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media (max-width: 900px) { .shell.tutor-focus:has(.v32-masthead--tutor) { grid-template-columns: minmax(0,1fr); }.shell:has(.academy-v2-navigation) .content { padding: 14px 16px 35px; }.v32-masthead, .shell:has(.v32-masthead--tutor) .v32-masthead { margin: -14px -16px 16px; padding: 23px 24px; }.v32-masthead-content { max-width: 86%; }.v32-progress-columns { grid-template-columns: 1fr; }.v32-dashboard-bottom { grid-template-columns: 1fr 1.25fr; }.v32-metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.v32-tutor-shell { grid-template-columns: 1fr; }.v32-tutor-context { min-height: 0; }.v32-tutor-context img { width: 150px; height: 85px; float: left; margin: 0 15px 3px 0; } }
@media (max-width: 700px) { .v32-masthead { min-height: 183px; }.v32-masthead-content { max-width: 90%; }.v32-masthead-shade { background: linear-gradient(90deg, #060d20, rgba(6,13,32,.88) 45%, rgba(6,13,32,.35)), linear-gradient(0deg,#071027,transparent 40%); }.v32-masthead h1 { font-size: clamp(1.9rem,7vw,2.6rem); }.v32-masthead p { font-size: .78rem; }.v32-resume { grid-template-columns: 105px minmax(0,1fr); gap: 10px; }.v32-resume-art { height: 105px; }.v32-resume-action { grid-column: 1/-1; display: flex; align-items: center; justify-content: space-between; border-left: 0; border-top: 1px solid #314579; padding: 10px 0 0; }.v32-destination-grid, .v32-category-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }.v32-destination { min-height: 122px; }.v32-dashboard-bottom { grid-template-columns: 1fr; }.v32-chapter-grid { grid-template-columns: 1fr 1fr; }.v32-featured { grid-template-columns: 1fr; }.v32-featured img { display: none; }.v32-continue { grid-template-columns: 90px minmax(0,1fr); }.v32-continue img { width: 90px; height: 72px; }.v32-continue > b { display: none; }.v32-practice-grid, .v32-evaluation-grid { grid-template-columns: 1fr; }.v32-evaluation-advice { flex-wrap: wrap; }.v32-evaluation-advice .v32-primary { width: 100%; }.v32-project .v2-project-summary { grid-template-columns: 90px minmax(0,1fr); }.v32-project-art { height: 90px; }.v32-project .v2-project-progress { grid-column: 1/-1; border-left: 0; border-top: 1px solid #2b4171; padding: 8px 0 0; }.v32-project .v2-project-steps { grid-template-columns: repeat(2,minmax(0,1fr)); }.v32-tutor-layout { height: calc(100dvh - 250px); min-height: 500px; }.v32-tutor-layout .tutor-path-grid { grid-template-columns: 1fr; }.v32-tutor-layout .tutor-header-actions { flex-wrap: wrap; justify-content: flex-end; }.v32-tutor-layout .tutor-header-actions button { font-size: .65rem; padding: 6px; }.v32-tutor-quick { grid-template-columns: repeat(2,minmax(0,1fr)); }.v32-tutor-layout .tutor-thread { padding-bottom: 245px; }.academy-v2-chapter .v2-journey-list { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .v32-featured img { display: block; height: 130px; margin-top: 12px; mask-image: none; }.v32-tutor-context img { width: 105px; height: 72px; }.v32-tutor-context p { margin-bottom: 4px; } }
@media (max-width: 430px) { .v32-masthead-content { max-width: 100%; }.v32-masthead h1 { font-size: 1.9rem; }.v32-resume { display: block; }.v32-resume-art { float: left; width: 90px; height: 92px; margin-right: 10px; }.v32-resume-action { clear: both; margin-top: 11px; }.v32-resume-copy p { display: none; }.v32-destination-grid { gap: 7px; }.v32-destination { padding: 10px; }.v32-category { padding: 8px; }.v32-chapter-grid { grid-template-columns: 1fr; }.v32-metric { min-height: 92px; padding: 10px; gap: 7px; }.v32-metric .v32-icon { width: 34px; height: 34px; }.v32-metric b { font-size: 1.3rem; }.v32-metric strong { font-size: .72rem; }.v32-metric .v32-donut { width: 54px; height: 54px; }.v32-metric .v32-donut strong { font-size: .7rem; } }
@media (prefers-reduced-motion: reduce) { .v32-page *, .v32-page *::before, .v32-page *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }
.v32-project-art { background: #101a3b url('/assets/academy-v3/v32-mission.webp') center/cover no-repeat; }

/* Keep the existing panoramic banner flush with the responsive content edge. */
@media (min-width: 901px) {
  .shell:has(.academy-v2-navigation) .v32-masthead { margin-inline: calc(-1 * clamp(18px, 2.1vw, 36px)); }
}

/* Cinematic motion: transparent layers above the existing panorama, never a replacement image. */
.v32-masthead--dashboard::before,
.v32-masthead--dashboard::after { content: ''; position: absolute; pointer-events: none; z-index: 0; }
.v32-masthead--dashboard::before {
  inset: -50% -4% -50% 48%;
  opacity: .58;
  background: radial-gradient(ellipse at 65% 54%, rgba(119, 90, 255, .21), rgba(60, 120, 255, .07) 29%, transparent 55%);
  animation: v32-portal-breathe 12s ease-in-out infinite;
}
.v32-masthead--dashboard::after {
  inset: 20% -3% -14% 40%;
  opacity: .5;
  background:
    radial-gradient(ellipse at 65% 88%, rgba(95, 68, 202, .16), transparent 55%),
    radial-gradient(circle at 54% 32%, rgba(122, 194, 255, .52) 0 1px, transparent 2px),
    radial-gradient(circle at 79% 18%, rgba(180, 118, 255, .42) 0 1px, transparent 2px),
    radial-gradient(circle at 91% 66%, rgba(101, 202, 255, .46) 0 1px, transparent 2px);
  animation: v32-atmosphere 18s ease-in-out infinite alternate;
}
@keyframes v32-portal-breathe { 50% { opacity: .83; transform: scale(1.045); } }
@keyframes v32-atmosphere { to { opacity: .7; transform: translate3d(-12px, -4px, 0); } }
.v32-motion-paused .v32-masthead--dashboard::before,
.v32-motion-paused .v32-masthead--dashboard::after,
.v32-masthead--dashboard.v32-motion-offscreen::before,
.v32-masthead--dashboard.v32-motion-offscreen::after { animation-play-state: paused; }

/* Route entry is set by the router only when the route changes. Data refreshes stay still. */
#app.v32-route-enter .v32-masthead-content,
#app.v32-route-enter .v32-page > .v32-panel,
#app.v32-route-enter .v32-page > .v32-section,
#app.v32-route-enter .v32-dashboard-bottom,
#app.v32-route-enter .v32-tutor-shell,
#app.v32-route-enter .v3-course-heading { animation: v32-enter .26s ease-out both; }
#app.v32-route-enter .v32-destination,
#app.v32-route-enter .v32-category,
#app.v32-route-enter .v32-chapter-card { animation: v32-enter .24s ease-out both; }
#app.v32-route-enter .v32-destination:nth-child(2),
#app.v32-route-enter .v32-category:nth-child(2),
#app.v32-route-enter .v32-chapter-card:nth-child(2) { animation-delay: 35ms; }
#app.v32-route-enter .v32-destination:nth-child(3),
#app.v32-route-enter .v32-category:nth-child(3),
#app.v32-route-enter .v32-chapter-card:nth-child(3) { animation-delay: 70ms; }
#app.v32-route-enter .v32-destination:nth-child(n+4),
#app.v32-route-enter .v32-category:nth-child(n+4),
#app.v32-route-enter .v32-chapter-card:nth-child(n+4) { animation-delay: 95ms; }
#app.v32-route-enter .v32-progress-line i { animation: v32-fill .56s cubic-bezier(.2, .8, .2, 1) both; }
#app.v32-route-enter .v32-donut { animation: v32-ring-enter .48s ease-out both; }
@keyframes v32-ring-enter { from { opacity: .6; transform: scale(.96); } to { opacity: 1; transform: none; } }

/* Course illustrations retain their aspect ratio; the card clips the slight hover zoom. */
.v32-course-row, .v32-continue { overflow: hidden; }
.v32-resume-art { position: relative; }
.v32-resume-art::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; background: linear-gradient(115deg, transparent 45%, rgba(133, 108, 255, .18)); transition: opacity .22s ease; }
.v32-practice-card, .v32-evaluation-card { position: relative; }
.v32-practice-card::after, .v32-evaluation-card:not(.is-locked)::after { content: ''; position: absolute; inset: 0 0 auto; height: 156px; pointer-events: none; opacity: 0; background: linear-gradient(115deg, transparent 45%, rgba(112, 168, 255, .16)); transition: opacity .22s ease; }
.v32-resume-art img, .v32-course-row img, .v32-continue img,
.v32-chapter-card > img, .v32-practice-card > img, .v32-evaluation-card > img,
.v32-featured img { transition: transform .22s ease, filter .22s ease; }
@media (hover: hover) and (pointer: fine) {
  .v32-resume:hover .v32-resume-art img,
  .v32-course-row:hover img, .v32-continue:hover img,
  .v32-chapter-card:hover > img, .v32-practice-card:hover > img,
  .v32-evaluation-card:hover > img, .v32-featured:hover img { transform: scale(1.035); filter: brightness(1.07) saturate(1.08); }
  .v32-resume:hover .v32-resume-art::after,
  .v32-practice-card:hover::after, .v32-evaluation-card:hover::after { opacity: 1; }
}
.v32-course-row:focus-visible img, .v32-continue:focus-visible img,
.v32-chapter-card:focus-visible > img, .v32-practice-card:focus-within > img,
.v32-evaluation-card:focus-within > img { filter: brightness(1.09) saturate(1.08); }

/* Stable card layout with equal keyboard and pointer feedback. */
.v32-destination { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.v32-destination .v32-icon, .v32-category .v32-icon { transition: transform .2s ease, box-shadow .2s ease; }
.v32-destination .v32-arrow, .v32-course-row > b { transition: transform .2s ease; }
.v32-destination:focus-visible:not(.is-disabled) { transform: translateY(-3px); border-color: color-mix(in srgb, var(--v32-accent) 85%, white); box-shadow: 0 12px 28px color-mix(in srgb, var(--v32-accent) 18%, transparent); }
.v32-destination:hover:not(.is-disabled), .v32-destination:focus-visible:not(.is-disabled) { border-color: color-mix(in srgb, var(--v32-accent) 85%, white); }
.v32-destination:hover:not(.is-disabled) .v32-icon,
.v32-destination:focus-visible:not(.is-disabled) .v32-icon,
.v32-category:hover:not(:disabled) .v32-icon,
.v32-category:focus-visible:not(:disabled) .v32-icon { transform: translateY(-2px) rotate(-4deg); box-shadow: 0 0 24px color-mix(in srgb, var(--v32-accent) 22%, transparent); }
.v32-destination:hover:not(.is-disabled) .v32-arrow,
.v32-destination:focus-visible:not(.is-disabled) .v32-arrow,
.v32-course-row:hover > b, .v32-course-row:focus-visible > b { transform: translateX(3px); }
.v32-category:focus-visible:not(:disabled) { border-color: var(--v32-accent); transform: translateY(-2px); }
.shell:has(.academy-v2-navigation) .academy-v2-navigation .nav button { transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease; }

/* Short button response, including genuine busy/disabled states already supplied by the app. */
.v32-primary, .v32-more, .v32-project-step-actions button,
.v32-tutor-quick button, .v3-tutor-quick button, .v32-tutor-context button,
.v32-tutor-layout .tutor-send, .v3-tutor-panel .tutor-send {
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.v32-primary > span { transition: transform .18s ease; }
@media (hover: hover) and (pointer: fine) {
  .v32-primary:hover:not(:disabled), .v32-more:hover:not(:disabled),
  .v32-project-step-actions button:hover:not(:disabled),
  .v32-tutor-quick button:hover:not(:disabled), .v3-tutor-quick button:hover:not(:disabled),
  .v32-tutor-context button:hover:not(:disabled),
  .v32-tutor-layout .tutor-send:hover:not(:disabled), .v3-tutor-panel .tutor-send:hover:not(:disabled) { filter: brightness(1.12); box-shadow: 0 7px 19px rgba(81, 62, 210, .18); }
  .v32-primary:hover:not(:disabled) > span { transform: translateX(3px); }
}
.v32-primary:focus-visible > span { transform: translateX(3px); }
.v32-primary:active:not(:disabled), .v32-destination:active:not(.is-disabled),
.v32-more:active:not(:disabled), .v32-tutor-quick button:active:not(:disabled),
.v3-tutor-quick button:active:not(:disabled) { transform: scale(.985); }
.v32-primary:disabled, .v32-tutor-quick button:disabled,
.v3-tutor-quick button:disabled { cursor: default; opacity: .7; }
.v32-primary[aria-busy='true'] { cursor: wait; opacity: .8; }

/* The Tutor appears on demand; only newly appended messages enter. */
#app.v32-tutor-opening .v3-tutor-panel { animation: v32-panel-open .24s ease-out both; }
@keyframes v32-panel-open { from { opacity: .7; transform: translateX(8px); } to { opacity: 1; transform: none; } }
.v32-tutor-layout .v32-message-enter, .v3-tutor-panel .v32-message-enter { animation: v32-enter .2s ease-out both; }
.v32-tutor-layout .tutor-request-state:not(:empty)::before,
.v3-tutor-panel .tutor-request-state:not(:empty)::before {
  content: ''; display: inline-block; width: 6px; height: 6px; margin: 0 7px 1px 0;
  border-radius: 50%; background: #5fd8ff; box-shadow: 0 0 8px rgba(95, 216, 255, .5);
  animation: v32-response-pulse 1.3s ease-in-out infinite;
}
@keyframes v32-response-pulse { 50% { opacity: .45; transform: scale(.75); } }
.v32-motion-paused .tutor-request-state::before { animation-play-state: paused !important; }
.v32-tutor-quick button:focus-visible, .v3-tutor-quick button:focus-visible,
.v32-tutor-layout .tutor-send:focus-visible, .v3-tutor-panel .tutor-send:focus-visible { outline: 3px solid #aeb9ff; outline-offset: 3px; }

@media (max-width: 700px) {
  .v32-masthead--dashboard::before, .v32-masthead--dashboard::after { animation: none; }
}
@media (prefers-reduced-motion: reduce) {
  .shell:has(.academy-v2-navigation) *,
  .shell:has(.academy-v2-navigation) *::before,
  .shell:has(.academy-v2-navigation) *::after { animation: none !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .v32-destination:hover, .v32-destination:focus-visible, .v32-category:hover,
  .v32-category:focus-visible, .v32-primary:hover, .v32-primary:active,
  .v32-course-row:hover, .v32-chapter-card:hover,
  .v32-resume:hover .v32-resume-art img, .v32-course-row:hover img,
  .v32-continue:hover img, .v32-chapter-card:hover > img,
  .v32-practice-card:hover > img, .v32-evaluation-card:hover > img,
  .v32-featured:hover img { transform: none !important; }
}

/* A course-specific visual anchor above the unchanged official lesson text. */
.v3-course-frame .v34-course-hero {
  position: relative; isolation: isolate; min-height: 174px; margin: -2px 0 14px;
  padding: clamp(20px, 2vw, 30px); overflow: hidden; align-items: flex-end;
  border: 1px solid #334987; border-radius: 15px; background: #0b1735;
}
.v34-course-hero::before {
  content: ''; position: absolute; inset: 0; z-index: -2;
  background-image: linear-gradient(90deg,#08132d 1%,rgba(8,19,45,.92) 36%,rgba(8,19,45,.55) 71%,rgba(8,19,45,.31)),var(--v34-backdrop);
  background-size: cover; background-position: center;
}
.v34-course-hero::after {
  content: ''; position: absolute; inset: auto 0 0; height: 40%; z-index: -1;
  background: linear-gradient(transparent,rgba(8,14,35,.56)); pointer-events: none;
}
.v34-course-hero-copy { position: relative; z-index: 1; width: min(63%, 760px); min-width: 0; }
.v3-course-frame .v34-course-hero h1 { font-size: clamp(1.8rem, 2.3vw, 2.5rem); line-height: 1.1; text-wrap: balance; }
.v3-course-frame .v34-course-hero .v3-course-subtitle { color: #e3eaff; }
.v34-course-hero-art {
  position: absolute; z-index: -1; top: 0; right: 0; width: 35%; height: 100%;
  object-fit: cover; opacity: .87; mask-image: linear-gradient(90deg,transparent 0%,#000 27%,#000 78%,transparent 100%);
}
.v34-course-hero .v3-tutor-toggle { position: relative; z-index: 2; flex: none; }
@media(max-width:900px) {
  .v3-course-frame .v34-course-hero { min-height: 166px; }
  .v34-course-hero-copy { width: min(72%, 650px); }
  .v34-course-hero-art { right: 2%; width: 55%; opacity: .58; }
}
@media(max-width:700px) {
  .v3-course-frame .v34-course-hero { min-height: 154px; padding: 18px; flex-wrap: wrap; align-content: end; gap: 9px; }
  .v34-course-hero-copy { width: 100%; }
  .v3-course-frame .v34-course-hero h1 { font-size: clamp(1.2rem, 5.4vw, 1.75rem); }
  .v3-course-frame .v34-course-hero .v3-course-subtitle { display: block; font-size: .75rem; line-height: 1.4; }
  .v34-course-hero-art { right: -16%; width: 95%; opacity: .24; }
  .v34-course-hero .v3-tutor-toggle { margin: 0; min-height: 34px; padding: 6px 10px; font-size: .72rem; }
}

/* On phones, let the lesson use the document scroll instead of shrinking below the plan. */
@media(max-width:700px) {
  body:has(.v3-course-frame:not(.tutor-open)),
  body:has(.v3-course-frame:not(.tutor-open)) #app { height: auto; min-height: 100dvh; overflow: visible; }
  .shell.v2-course-focus:has(.v3-course-frame:not(.tutor-open)),
  .shell.v2-course-focus:has(.v3-course-frame:not(.tutor-open)) .main { height: auto; min-height: 100dvh; overflow: visible; }
  .shell.v2-course-focus:has(.v3-course-frame:not(.tutor-open)) .content,
  .v3-course-frame:not(.tutor-open) { flex: 0 0 auto; min-height: 0; overflow: visible; }
  .v3-course-frame:not(.tutor-open) .v3-course-layout { display: flex; flex: none; flex-direction: column; min-height: 0; }
  .v3-course-frame:not(.tutor-open) .v3-reading,
  .shell.v2-course-focus .v3-course-frame:not(.tutor-open) .v3-reading .course-immersive,
  .shell.v2-course-focus .v3-course-frame:not(.tutor-open) .v3-reading .lesson.v2-course-scroll {
    height: auto; min-height: 0; max-height: none; overflow: visible;
  }
  .shell.v2-course-focus .v3-course-frame:not(.tutor-open) .v2-course-dock {
    position: sticky; bottom: 0; z-index: 5; margin-top: 12px;
    padding-bottom: max(5px, env(safe-area-inset-bottom));
  }
}