/* The Learning Studio — v0.9 visual system.
   Component behavior lives in styles.css; this layer owns the studio identity. */
:root {
  --canvas:#f6f5f0; --surface:#fffefa; --surface-alt:#f0f0e9;
  --text:#20352f; --body:#53615a; --muted:#6a746c; --border:#dddfd5;
  --accent:#28624c; --accent-hover:#194d39; --accent-soft:#e5eee5;
  --mint:#e3eddf; --mint-text:#315b41; --peach:#f5e7d7; --peach-text:#805333;
  --sidebar:#193b30; --focus:#42735c; --shadow:0 4px 20px #27372c04;
  --display:Georgia,"Times New Roman",serif;
  --art-ink:#315843; --art-paper:#fff9e9; --art-light:#b9cdb0;
}
:root[data-theme=dark] {
  --canvas:#141e1a; --surface:#1c2a23; --surface-alt:#223229;
  --text:#eeeede; --body:#c3ccbe; --muted:#a4b39f; --border:#3b4a3e;
  --accent:#b5d5aa; --accent-hover:#cbe5c1; --accent-soft:#304732;
  --mint:#2e4232; --mint-text:#c2d9b6; --peach:#42372b; --peach-text:#e8c59f;
  --sidebar:#10291f; --focus:#c1dcb8; --shadow:0 5px 22px #00000012;
}
body {font-family:"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
h1 {font-family:var(--display);font-weight:400;font-size:clamp(34px,3.1vw,46px);line-height:1.16;letter-spacing:-1.6px}
h2,h3 {font-weight:600}
p {line-height:1.8}
.lead {font-size:15px;line-height:1.85}
.eyebrow {font-size:10px;letter-spacing:1.65px;font-weight:650}
.page-heading h1 {font-size:clamp(34px,3.1vw,46px);max-width:660px}
.section-heading h2 {font-family:var(--display);font-size:29px;font-weight:400;letter-spacing:-.7px}
.section-heading {margin-top:36px;margin-bottom:20px}
.page-heading {margin-bottom:30px}
.page-heading>.button {font-size:12px;white-space:nowrap}
.button,button.primary,a.button {border-radius:7px;min-height:43px;font-size:12px;padding:11px 17px;font-weight:600;transition:background .18s,border-color .18s,box-shadow .18s}
.primary {box-shadow:none}
.button:hover {border-color:var(--accent)}
article,.form {border-radius:12px;box-shadow:var(--shadow)}
.badge {border-radius:4px;font-size:9px;letter-spacing:.65px;padding:5px 8px}
label {font-size:13px}
input,select,textarea {font-size:14px;background:var(--surface);border-radius:7px}
input:hover,textarea:hover,select:hover {border-color:var(--accent)}
.muted {font-size:12px}
.text-button {color:var(--accent)}
/* A quiet, permanent workspace frame. */
.shell {grid-template-columns:232px minmax(0,1fr)}
.sidebar {padding:31px 16px 18px}
.brand {font-size:17px;gap:10px;margin-left:7px;margin-bottom:40px;color:#f0f3e4}
.brand-light {color:#c2d2bc}
.mark {background:#d7e6b6;color:#254532;border-radius:50% 50% 9px 9px;width:34px;height:37px;font-family:var(--display);font-weight:600;font-size:31px}
.mark>span {color:#51734d;right:6px}
.smallheading {color:#a6b9a6;font-size:9px;letter-spacing:1.8px}
#nav button,#mobileNavList button {color:#c6d5c6;gap:12px;font-size:12px;min-height:45px;border-radius:7px}
#nav button .icon {color:#9eb79e;stroke-width:1.6}
#nav button:hover,#mobileNavList button:hover {background:#284c3d;color:#f4f6e9}
#nav button.active,#mobileNavList [aria-current=page] {background:#d9e7bc;color:#243d2d;box-shadow:none}
#nav button.active .icon {color:#355a38}
.sidebar-tip {background:#234638;border-color:#3c5b48;border-radius:10px;padding:18px 15px;position:relative}
.sidebar-tip>span {color:#d9e4b7}
.sidebar-tip strong {color:#edf0dc;font-family:var(--display);font-size:20px;font-weight:400;line-height:1.3}
.sidebar-tip p {color:#bacbb6;font-size:11px}
.sidebar-tip button {color:#dfe9bb;font-size:12px}
.sidebar-profile {border-color:#3e5b48;color:#f0f0df}
.sidebar-profile small,.build-label {color:#acbfa6}
.avatar {background:#395741;color:#ebefda}
.topbar {height:76px;background:var(--canvas);border-bottom-color:var(--border);padding:0 40px}
.search-trigger {background:var(--surface);border-radius:7px;font-size:11px}
.topbar-actions {gap:12px}
.account-button {background:#e2e8cf;color:#3f5737;border-color:#d2ddbd}
.topbar-location {font-size:12px}
main {padding-top:36px;padding-bottom:0}
.workspace-footer {font-size:11px;margin-top:46px}
.workspace-footer summary {font-size:11px}
/* Original artwork uses a small, predictable palette. */
.course-art {width:100%;height:100%;display:block}
[data-lesson-index="0"],.book-front,.resource-cards article:nth-child(1),[data-scenario-index="0"] {--cover:#dce6cf;--art-ink:#36573c;--art-light:#a8bf90;--art-paper:#f4f4e2}
[data-lesson-index="1"],.resource-cards article:nth-child(2),[data-scenario-index="1"] {--cover:#e7dff1;--art-ink:#66517c;--art-light:#c7b5d7;--art-paper:#f7f0fc}
[data-lesson-index="2"],.resource-cards article:nth-child(3) {--cover:#f2dfc9;--art-ink:#83583a;--art-light:#d4b18a;--art-paper:#fff5e7}
[data-lesson-index="3"],.resource-cards article:nth-child(4),[data-scenario-index="2"] {--cover:#dbe7e6;--art-ink:#3d6767;--art-light:#a4c5c0;--art-paper:#f0f7f2}
[data-lesson-index="4"] {--cover:#eadbd9;--art-ink:#854e50;--art-light:#c8a6a4;--art-paper:#fcf1ec}
[data-lesson-index="5"] {--cover:#e9e6cc;--art-ink:#6f6839;--art-light:#c9c38f;--art-paper:#fffae4}
/* Home: a small editorial collection, rendered entirely on the device. */
.home-hero {grid-template-columns:1.06fr 1fr;gap:28px;min-height:480px;padding:25px 0 38px}
.home-copy {position:relative;z-index:2}
.home-hero h1 {font-size:clamp(39px,4.2vw,62px);line-height:1.09;font-weight:400;letter-spacing:-2.4px;margin:25px 0}
.home-hero h1 em {color:var(--accent);font-weight:400}
.home-hero .eyebrow {font-size:9px;letter-spacing:1.3px;display:flex;align-items:center;gap:9px}
.edition-dot {width:6px;height:6px;flex:none;background:var(--accent);border-radius:50%}
.home-hero .lead {max-width:425px;font-size:15px}
.hero-actions {gap:18px;margin-top:30px}
.hero-actions>span {font-size:11px}
.hero-actions button {padding:13px 19px;font-size:12px}
.home-visual {height:430px;overflow:visible;background:none;isolation:isolate}
.home-visual::before {content:"";position:absolute;width:90%;height:90%;border-radius:50%;background:radial-gradient(ellipse,#e2e6d5 0,transparent 68%);z-index:-1}
.hero-book {position:absolute;border-radius:3px 9px 9px 3px;display:flex;flex-direction:column;box-shadow:3px 9px 0 -5px #aaa88b,0 20px 32px #30402c1a;overflow:hidden}
.hero-book::before {content:"";position:absolute;left:8px;top:0;height:100%;width:3px;background:#00000009}
.book-back {width:235px;height:317px;right:6%;top:24px;transform:rotate(13deg);padding:25px 27px;color:#584168;background:#e0d6eb;border:1px solid #c9b9d6}
.book-back>span {font-size:8px;letter-spacing:1.4px}
.book-back strong {font-family:var(--display);font-size:29px;line-height:1.16;font-weight:400;margin-top:29px;letter-spacing:-.7px}
.book-back i {font-size:9px;font-style:normal;margin-top:auto}
.book-front {width:270px;height:337px;top:74px;left:4%;transform:rotate(-9deg);background:#dce6cf;border:1px solid #c1cdb2;padding:24px 23px;color:#304c35}
.book-topline,.book-bottomline {display:flex;justify-content:space-between;gap:10px;font-size:8px;letter-spacing:1px}
.book-front strong {font-family:var(--display);font-size:33px;line-height:1.1;letter-spacing:-1px;font-weight:400;margin-top:25px;z-index:1}
.book-front strong em {font-weight:400;font-size:.83em}
.book-front [data-artwork] {height:164px;width:100%;margin-top:-3px}
.book-bottomline {margin-top:auto;align-items:center;font-size:8px;letter-spacing:.3px;border-top:1px solid #9bae8e;padding-top:10px}
.book-bottomline span:last-child {font-size:20px}
.studio-stamp {position:absolute;left:4%;top:3px;font-size:9px;line-height:1.6;letter-spacing:1.7px;transform:rotate(-9deg);color:var(--muted)}
.floating-note {position:absolute;right:-1%;bottom:2px;background:var(--surface);border:1px solid var(--border);padding:14px 16px;border-radius:8px;box-shadow:0 9px 28px #203b2314;display:flex;align-items:center;gap:9px;font-size:11px;color:var(--body);transform:rotate(3deg)}
.floating-note .icon {color:var(--accent);width:18px;height:18px}
.home-facts {padding:25px 0;margin-top:9px}
.home-facts strong {font-family:var(--display);font-weight:400;font-size:32px}
.home-facts span {font-size:12px}
.home-tools article {background:transparent;border:0;box-shadow:none;border-radius:0;padding:18px 25px 8px 0}
.home-tools article+article {border-left:1px solid var(--border);padding-left:26px}
.home-tools h3 {font-family:var(--display);font-size:24px;font-weight:400}
.home-tools p {font-size:13px;line-height:1.9}
.home-tools .text-button {font-size:12px}
.tile-icon {border-radius:50%;width:43px;height:43px}
.violet {background:#e7dff1;color:#66517c}
/* Dashboard: an actionable next step beside the real six-lesson path. */
.dashboard-overview {display:grid;grid-template-columns:minmax(0,1.45fr) minmax(290px,1fr);gap:22px;align-items:stretch}
.next-lesson {display:block;background:#244c3b;border-color:#244c3b;padding:34px;min-height:420px;border-radius:12px;position:relative}
.next-lesson::after {content:"";width:280px;height:280px;border:1px solid #cbd7ac20;position:absolute;right:-100px;bottom:-125px;border-radius:50%;box-shadow:0 0 0 24px #cbd7ac08,0 0 0 49px #cbd7ac08;pointer-events:none}
.next-copy {position:relative;z-index:1;max-width:none}
.next-lesson .eyebrow {color:#dce8bb;font-size:9px;letter-spacing:1.7px;padding-right:95px;min-height:28px}
.next-lesson h2 {font-family:var(--display);font-size:37px;font-weight:400;line-height:1.14;letter-spacing:-1px;color:#f6f4de;max-width:370px;margin-top:36px;padding-right:25px}
.next-lesson p:not(.eyebrow) {font-size:13px;line-height:1.9;color:#c7d5bf;max-width:365px}
.next-lesson .primary {background:#dce9bb;border-color:#dce9bb;color:#2b462d;font-size:12px;margin-top:1px}
.next-lesson .primary:hover {background:#ebf3d2}
.next-meta {color:#c5d4b9;font-size:11px}
.next-lesson .path-meter {color:#c5d4b9;font-size:11px;margin:22px 0;max-width:365px}
.next-lesson progress {height:4px;background:#536f50}
.next-lesson progress::-webkit-progress-bar {background:#536f50}
.next-lesson progress::-webkit-progress-value {background:#d6e4af}
.next-lesson progress::-moz-progress-bar {background:#d6e4af}
.lesson-visual {position:absolute;top:29px;right:26px;margin:0;display:grid}
.lesson-visual::before,.lesson-visual::after {display:none}
.progress-ring {width:76px;height:76px;padding:4px;background:conic-gradient(#dce9bb calc(var(--value)*1%),#54714f 0);transform:none}
.ring-center {background:#244c3b;gap:3px}
.ring-center strong {font-family:var(--display);font-size:22px;letter-spacing:-.6px;font-weight:400;color:#f6f4de}
.ring-center span {font-size:8px;color:#c5d4b9}
.learning-journey {background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px 23px 16px}
.journey-heading {display:flex;justify-content:space-between;gap:9px;align-items:center;margin-bottom:11px}
.journey-heading h2 {font-family:var(--display);font-size:24px;font-weight:400;margin:0;letter-spacing:-.5px}
.journey-heading .muted {font-size:10px;white-space:nowrap}
.journey-list {padding:0;margin:0;list-style:none}
.journey-list li+li {border-top:1px solid var(--border)}
.journey-step {background:none;border:0;padding:13px 0;display:flex;align-items:center;gap:12px;width:100%;text-align:left;border-radius:5px;color:var(--body)}
.journey-number {display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--border);border-radius:50%;flex:none;font-size:10px;transition:background .18s}
.journey-number .icon {width:16px;height:16px}
.journey-copy {flex:1;min-width:0}
.journey-copy strong {display:block;font-size:12px;font-weight:600;color:var(--text)}
.journey-copy small {display:block;font-size:10px;color:var(--muted);margin-top:5px}
.journey-step>.icon {width:15px;height:15px;opacity:.5}
.journey-step:hover .journey-copy strong {color:var(--accent)}
.journey-step:hover .journey-number,.journey-step.in_progress .journey-number {background:var(--accent-soft);border-color:var(--accent)}
.journey-step.completed .journey-number {background:var(--accent);border-color:var(--accent);color:var(--surface)}
.learning-stats {margin-top:20px;gap:18px}
.stat {padding:23px 25px;border-radius:10px;gap:9px}
.stat strong {font-family:var(--display);font-size:33px;font-weight:400;letter-spacing:-1px}
.stat span {font-size:12px}
.stat .stat-symbol {background:var(--surface-alt);border-radius:50%;padding:10px;top:24px}
.stat .stat-symbol .icon {width:18px;height:18px}
.sim-dashboard,.coach-dashboard {padding:28px 30px;position:relative;overflow:hidden;background:var(--surface)}
.sim-dashboard {background:var(--peach)}
.coach-dashboard {background:var(--mint)}
.sim-dashboard h2,.coach-dashboard h2 {font-family:var(--display);font-size:28px;font-weight:400;line-height:1.2;letter-spacing:-.7px;max-width:350px}
.sim-dashboard>p,.coach-dashboard>p {font-size:13px;max-width:380px}
.sim-dashboard .eyebrow,.coach-dashboard .eyebrow {font-size:9px;letter-spacing:1.4px}
.sim-dashboard .tile-icon,.coach-dashboard .tile-icon {position:absolute;right:24px;top:24px;background:var(--surface);width:35px;height:35px}
.sim-dashboard .tile-icon .icon,.coach-dashboard .tile-icon .icon {width:18px;height:18px}
.sim-dashboard .eyebrow,.coach-dashboard .eyebrow {padding-right:35px}
.sim-dashboard .primary,.coach-dashboard .primary {font-size:12px;min-height:34px}
.organization-panel {margin-top:25px;padding:24px;border:1px solid var(--border);background:transparent}
.organization-panel form {max-width:750px}
/* The course collection. */
.catalog-toolbar {border-width:1px 0;border-radius:0;box-shadow:none;background:transparent;padding:19px 0;margin-top:28px;gap:20px}
.catalog-toolbar label {font-size:11px}
.catalog-toolbar label:first-child {max-width:460px}
.catalog-toolbar input,.catalog-toolbar select {background:var(--surface);min-height:45px}
.catalog-count {font-size:11px;margin-bottom:25px}
.module-title {font-family:var(--display);font-size:27px;font-weight:400;color:var(--text);letter-spacing:-.6px;margin:31px 0 19px}
.lesson-grid {gap:23px}
.lesson-card {border-radius:11px;box-shadow:0 4px 15px #26322203;transition:transform .22s,box-shadow .22s,border-color .22s}
.lesson-card:hover {transform:translateY(-3px);box-shadow:0 13px 24px #293b2510;border-color:var(--accent)}
.lesson-card .lesson-cover,.lesson-card:nth-child(even) .lesson-cover {background:var(--cover);height:198px;padding:21px 24px;color:var(--art-ink)}
.lesson-cover::after {display:none}
.lesson-number {font-size:9px;letter-spacing:1.5px;position:absolute;top:20px;left:24px;z-index:1}
.lesson-cover>.course-art {position:absolute;width:75%;height:185px;right:4%;bottom:-8px}
.cover-caption {font-family:var(--display);font-size:21px;font-style:italic;position:absolute;bottom:22px;left:24px;max-width:100px;line-height:1.05;letter-spacing:-.6px}
.lesson-card-body {padding:26px}
.lesson-card-body h3 {font-family:var(--display);font-size:27px;font-weight:400;line-height:1.2;letter-spacing:-.6px;margin-top:16px;max-width:380px}
.lesson-card-body>p {font-size:13px;line-height:1.85;margin:13px 0}
.lesson-card-body>.muted {font-size:11px}
.lesson-card-body .button {border:0;border-top:1px solid var(--border);border-radius:0;background:none;color:var(--accent);padding:16px 0 0;margin-top:5px;min-height:37px;font-size:12px}
/* An editorial reader with a real focus state and section tracking. */
.lesson-open>h1,.lesson-open>.eyebrow,.lesson-open>.lead {display:none}
.reader-toolbar {display:flex;align-items:center;justify-content:space-between;gap:14px;position:sticky;top:76px;z-index:5;background:var(--canvas);padding:14px 0;border-bottom:1px solid var(--border);margin-top:-14px}
.reader-toolbar>.button {background:transparent;border-color:transparent;font-size:12px;padding-left:0;padding-right:0}
.reader-toolbar>.reader-focus {border-color:var(--border);background:var(--surface);padding:10px 13px;font-size:11px;gap:8px}
.reader-focus .icon {width:17px;height:17px}
.reader-kicker {font-size:9px;font-weight:600;letter-spacing:1.8px;color:var(--muted)}
.reader-focus[aria-pressed=true] {background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.lesson-intro {padding:28px 0 29px;margin:0 0 28px;border:0;max-width:880px}
.lesson-intro h1 {font-family:var(--display);font-size:47px;font-weight:400;line-height:1.12;letter-spacing:-1.6px;max-width:730px;margin:15px 0 19px}
.lesson-intro .lead {max-width:700px;font-size:15px;margin-bottom:0}
.lesson-layout {grid-template-columns:200px minmax(0,1fr);gap:32px}
.lesson-outline {top:163px;background:transparent;border:0;border-radius:0;padding:3px 0}
.lesson-outline h3 {font-size:11px;font-weight:600;padding-left:12px}
.lesson-outline button {font-size:12px;padding:11px 12px;border-left:2px solid var(--border);border-radius:0;line-height:1.7}
.lesson-outline button:hover {color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.lesson-outline button[aria-current=location] {background:var(--accent-soft);color:var(--accent);border-left-color:var(--accent)}
.lesson-outline .outline-label {padding-left:12px;font-size:9px;letter-spacing:1.4px}
.lesson-reading {padding:36px 40px;border-radius:10px;margin-bottom:25px}
.lesson-reading section {position:relative;margin-bottom:32px;padding-bottom:25px;border-bottom:1px solid var(--border)}
.reading-number {display:block;font-size:11px;letter-spacing:1px;color:var(--accent);margin-bottom:13px}
.lesson-reading h3 {font-family:var(--display);font-size:28px;font-weight:400;line-height:1.25;letter-spacing:-.5px;scroll-margin-top:170px}
.lesson-reading p {font-size:16px;line-height:1.95;margin-bottom:0}
.worked-example {border-radius:5px;padding:28px;background:var(--mint)}
.worked-example>p {font-size:13px;line-height:1.85}
.worked-example>.eyebrow {font-size:9px;margin-bottom:15px}
.worked-example blockquote {font-family:var(--display);font-size:23px;line-height:1.6;font-style:italic;font-weight:400;border-left:0;padding-left:0;margin-top:20px}
.lesson-exercise {padding:35px 40px;border-radius:10px}
.lesson-exercise h2 {font-family:var(--display);font-size:29px;font-weight:400;letter-spacing:-.6px;scroll-margin-top:170px}
.lesson-exercise p,.practice-checklist {font-size:14px}
.lesson-exercise .muted {font-size:12px}
.quiz-option {padding:16px;font-size:14px;line-height:1.8;transition:background .15s,border-color .15s;border-radius:7px}
.quiz-option:hover {border-color:var(--accent)}
.quiz-option:has(input:checked) {box-shadow:inset 3px 0 var(--accent)}
.save-status {font-size:12px}
.lesson-feedback {padding:30px;border-radius:10px;scroll-margin-top:170px}
.lesson-feedback h2 {font-family:var(--display);font-size:31px;font-weight:400}
.answer-feedback strong {font-size:14px}
.answer-feedback p {font-size:13px}
.lesson-focus .sidebar,.lesson-focus .topbar,.lesson-focus .workspace-footer {display:none}
.lesson-focus .shell {display:block}
.lesson-focus main {max-width:1120px;padding-top:16px}
.lesson-focus .reader-toolbar {top:0}
.lesson-focus .lesson-outline {top:100px}
.lesson-focus .lesson-reading h3,.lesson-focus .lesson-exercise h2,.lesson-focus .lesson-feedback {scroll-margin-top:100px}
/* Practice: choose a scene, then work through the conversation. */
.sim-mode {background:transparent;border-width:1px 0;border-radius:0;padding:14px 0;font-size:12px}
.sim-mode .badge {font-size:9px}
.sim-setup {margin-top:27px}
.sim-setup legend {font-family:var(--display);font-weight:400;font-size:27px}
.sim-scenarios {gap:20px}
.sim-scenario-option {display:flex;flex-direction:column;gap:0;overflow:hidden;padding:0;min-height:0;border-radius:10px;background:var(--surface);transition:transform .2s,border-color .2s}
.sim-scenario-option:hover {border-color:var(--accent);transform:translateY(-2px)}
.sim-scenario-option:has(input:checked) {background:var(--surface);border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.scenario-art {display:block;width:100%;height:153px;background:var(--cover)}
.sim-scenario-option>input {position:absolute;top:15px;right:15px;width:18px;height:18px;margin:0;z-index:1}
.sim-scenario-option>.scenario-copy {display:block;padding:23px;width:100%}
.sim-scenario-option .scenario-edition {display:block;color:var(--accent);font-size:9px;letter-spacing:1.3px;margin-bottom:13px}
.sim-scenario-option strong {font-family:var(--display);font-size:25px;font-weight:400;line-height:1.2;letter-spacing:-.6px}
.sim-scenario-option .scenario-copy>span {font-size:13px;line-height:1.8;margin:14px 0}
.sim-scenario-option small {font-size:11px}
.sim-setup>label {font-size:13px;margin-top:28px}
.sim-briefing {background:var(--surface);border-radius:12px;padding:29px}
.sim-briefing h2 {font-family:var(--display);font-size:36px;font-weight:400;letter-spacing:-.9px;line-height:1.2}
.sim-briefing .badge {background:var(--accent-soft);color:var(--accent)}
.sim-buyer {font-size:13px}
.sim-bubble {border-radius:3px 12px 12px 12px;padding:19px}
.sim-bubble.seller {border-radius:12px 3px 12px 12px;background:var(--accent-soft)}
.sim-bubble strong {font-size:11px;color:var(--accent)}
.sim-bubble p {font-size:14px;line-height:1.85}
.sim-transcript {padding:24px;background:var(--surface-alt);border-radius:10px}
.sim-decision {padding:28px;border-radius:10px}
.sim-decision h2,.sim-debrief h2 {font-family:var(--display);font-size:29px;font-weight:400;letter-spacing:-.6px}
.sim-coaching {border-radius:6px}
.sim-coaching p {font-size:13px}
.sim-skill {background:var(--surface-alt);border-radius:8px}
.sim-skill strong,.sim-skill>span,.sim-skill p {font-size:13px}
/* Coach: a welcoming prompt surface and comfortable source reading. */
.coach-layout {grid-template-columns:220px minmax(0,1fr);gap:25px}
.coach-sidebar {padding:18px;background:transparent;border-color:var(--border);border-radius:10px;top:100px}
.coach-sidebar>.primary {font-size:12px}
.coach-sidebar h2 {font-size:14px}
.coach-history-item:hover,.coach-history-item.selected {border-color:var(--border);background:var(--accent-soft);color:var(--accent)}
.coach-history-item span {font-size:11px}
.coach-welcome {padding:35px 32px;background:var(--surface);border-radius:12px;position:relative;overflow:hidden}
.coach-welcome-art {position:absolute;right:13px;top:18px;width:155px;height:130px;--art-ink:#788854;--art-light:#d5dfb5;--art-paper:#f2f1de;opacity:.9}
.coach-welcome .badge {font-size:9px;background:none;color:var(--accent);padding:0;position:relative;max-width:calc(100% - 130px);line-height:1.8}
.coach-welcome h2 {font-family:var(--display);font-weight:400;font-size:40px;line-height:1.15;letter-spacing:-1.2px;max-width:350px;padding-right:40px;margin:23px 0 18px;position:relative}
.coach-welcome p {font-size:14px;max-width:490px;line-height:1.9;position:relative}
.coach-prompts {margin-top:25px;gap:9px}
.coach-prompts button {font-size:13px;padding:15px;background:var(--surface-alt);border-radius:7px;display:flex;align-items:center;gap:12px;line-height:1.7}
.coach-prompts button>span {flex:1}
.coach-prompts button>.icon {width:18px;height:18px;color:var(--accent)}
.coach-prompts button>.icon:last-child {width:15px;height:15px}
.coach-composer {padding:29px;border-radius:10px}
.coach-composer label {font-size:13px}
.coach-composer textarea {font-size:15px;min-height:150px}
.coach-composer .muted {font-size:12px}
.coach-composer .primary {font-size:12px}
.coach-composer .coach-ai-choice {font-size:12px}
.coach-turn {border-radius:10px;padding:30px}
.coach-turn h2 {font-family:var(--display);font-size:31px;font-weight:400;line-height:1.3;letter-spacing:-.7px}
.coach-answer {font-size:15px;line-height:1.95}
.coach-turn .badge {font-size:9px}
.coach-turn h3 {font-size:15px}
.coach-source {padding:18px 20px;border-radius:7px}
.coach-source summary {font-size:14px}
.coach-source p {font-size:14px;line-height:1.9}
.coach-source p.muted {font-size:11px}
.coach-source .button {font-size:11px}
.coach-toolbar .button {font-size:11px}
.coach-toolbar .muted {font-size:11px}
/* Useful objects: field kit, progress, and account controls. */
.resource-cards {gap:23px}
.resource-cards article {padding:26px;border-radius:10px;overflow:hidden}
.resource-illustration,.resource-cards article:nth-child(n) .resource-illustration {height:160px;padding:0;background:var(--cover);border-radius:7px}
.resource-illustration .course-art {max-width:280px;margin:auto}
.resource-cards h2 {font-family:var(--display);font-size:30px;font-weight:400;letter-spacing:-.6px}
.resource-cards p {font-size:14px}
.progress-row {border-radius:9px;padding:23px 25px}
.progress-row h3 {font-size:16px;font-weight:600}
.attempt-row {font-size:13px;padding:19px 0}
.social-panel {padding:29px;border-radius:10px}
.social-panel h2 {font-family:var(--display);font-size:29px;font-weight:400}
.social-panel p {font-size:13px;line-height:1.85}
.social button {font-size:13px;padding:12px 17px}
.form {padding:29px;border-radius:10px}
.form h3 {font-family:var(--display);font-size:28px;font-weight:400}
.form label {font-size:13px}
.connection-list li {font-size:14px}
.search-dialog {border-radius:12px}
.search-result strong {font-size:13px}
.search-result small {font-size:11px}
.search-hint {font-size:11px}
.navigation-dialog {border-color:#3e5b48}
.drawer>.muted {color:#bdccb7}
/* Dark mode keeps the same paper-and-ink relationships, with muted covers. */
[data-theme=dark] .home-visual::before {background:radial-gradient(ellipse,#53704435,transparent 70%)}
[data-theme=dark] .book-front,[data-theme=dark] .book-back {filter:brightness(.85) saturate(.8)}
[data-theme=dark] .lesson-cover,[data-theme=dark] .scenario-art,[data-theme=dark] .resource-illustration {filter:brightness(.82) saturate(.75)}
[data-theme=dark] .coach-welcome-art {--art-ink:#a4b77e;--art-light:#3a4f35;opacity:.65}
[data-theme=dark] .violet {background:#41374b;color:#d4c1e4}
[data-theme=dark] .account-button {background:#3f5133;color:#dbe9bf;border-color:#4f6342}
[data-theme=dark] .lesson-card:hover {box-shadow:0 13px 24px #00000020}
[data-theme=dark] .journey-step.completed .journey-number {color:#19331f}
@media(min-width:1700px) {main,.topbar {padding-left:55px;padding-right:55px}}
@media(max-width:1250px) {
  .shell {grid-template-columns:210px minmax(0,1fr)}
  .sidebar {padding-left:12px;padding-right:12px}
  .brand {font-size:15px;gap:8px}
  main {padding-left:28px;padding-right:28px}
  .topbar {padding-left:28px;padding-right:28px}
  .home-hero h1 {font-size:47px}
  .home-visual {transform:scale(.92);transform-origin:center right}
  .dashboard-overview {grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr);gap:18px}
  .next-lesson {padding:29px 26px}
  .next-lesson h2 {font-size:33px;max-width:320px;padding-right:5px}
  .lesson-visual {right:20px;top:23px}
  .learning-journey {padding:23px 18px 15px}
  .journey-heading h2 {font-size:22px}
  .sim-scenario-option>.scenario-copy {padding:19px}
  .sim-scenario-option strong {font-size:23px}
  .lesson-layout {grid-template-columns:180px minmax(0,1fr);gap:23px}
  .lesson-reading,.lesson-exercise {padding:30px}
  .coach-layout {grid-template-columns:200px minmax(0,1fr);gap:20px}
  .coach-welcome-art {width:125px;height:105px}
  .coach-welcome h2 {font-size:36px;max-width:290px}
  .coach-welcome .badge {max-width:calc(100% - 100px)}
}
@media(max-width:1000px) {
  .shell {display:block}
  .topbar {height:68px;padding:0 24px}
  main {padding:30px 24px 0}
  .home-hero {gap:12px}
  .home-hero h1 {font-size:49px}
  .home-visual {transform:scale(.93)}
  .home-facts strong {font-size:29px}
  .home-facts span {font-size:11px}
  .reader-toolbar {top:68px}
  .lesson-outline {top:150px}
  .next-lesson h2 {font-size:35px}
  .stat {padding:22px}
  .stat .stat-symbol {right:16px}
  .coach-sidebar {top:90px}
}
@media(max-width:800px) and (min-width:701px) {
  .home-hero h1 {font-size:43px}
  .home-visual {transform:scale(.83);transform-origin:center left;width:360px;margin-left:10px}
  .home-hero {overflow:hidden}
  .home-facts strong {font-size:26px}
  .home-facts>div {padding:0 12px;gap:10px}
  .home-tools h3 {font-size:21px}
  .dashboard-overview {grid-template-columns:1.2fr 1fr;gap:15px}
  .next-lesson {padding:27px 24px}
  .next-lesson h2 {font-size:31px;margin-top:35px}
  .next-lesson .eyebrow {max-width:170px;padding-right:30px}
  .learning-journey {padding:23px 15px 16px}
  .journey-heading {display:block}
  .journey-heading .muted {display:block;margin-top:5px}
  .journey-step {padding:12px 0;gap:9px}
  .journey-copy strong {font-size:11px}
  .journey-number {width:28px;height:28px}
  .stat .stat-symbol {position:static;order:-1;width:34px;padding:8px}
  .stat strong {font-size:29px}
  .stat span {font-size:11px}
  .coach-welcome {padding:28px}
  .coach-welcome-art {width:95px;right:8px;top:33px}
  .coach-welcome h2 {font-size:32px;padding-right:30px}
  .coach-welcome .badge {font-size:8px}
  .sim-scenarios {gap:12px}
  .scenario-art {height:130px}
  .sim-scenario-option>.scenario-copy {padding:17px}
  .sim-scenario-option strong {font-size:21px}
}
@media(max-width:700px) {
  .topbar {height:64px;padding:0 16px;gap:8px}
  .topbar-actions {gap:5px}
  .topbar-location {font-size:12px}
  .search-trigger {padding:8px;background:none;font-size:12px}
  .icon-button {width:39px;height:39px}
  .account-button {min-width:35px;height:35px;font-size:11px}
  main {padding:27px 20px 0}
  h1,.page-heading h1 {font-size:36px;letter-spacing:-1.2px;line-height:1.15;max-width:none}
  .lead {font-size:14px;line-height:1.85}
  .eyebrow {font-size:9px;letter-spacing:1.4px}
  .page-heading {margin-bottom:25px}
  .page-heading>.button {font-size:12px;margin-top:14px}
  .section-heading {margin-top:31px;margin-bottom:18px}
  .section-heading h2 {font-size:28px}
  .home-hero {grid-template-columns:1fr;gap:0;padding-top:11px;padding-bottom:20px;min-height:0}
  .home-hero h1 {font-size:clamp(39px,10.8vw,64px);letter-spacing:-1.8px;line-height:1.08;margin:23px 0}
  .home-hero .eyebrow {font-size:8px;letter-spacing:1.2px;gap:8px;line-height:1.8}
  .home-hero .lead {font-size:15px}
  .hero-actions {gap:14px;margin-top:24px}
  .hero-actions button {font-size:12px;padding:13px 17px}
  .home-visual {height:405px;max-width:400px;width:100%;margin:24px auto 0;transform:none;overflow:hidden}
  .book-back {width:205px;height:280px;right:8%;top:20px}
  .book-front {width:233px;height:296px;top:62px;left:8%;padding:22px}
  .book-front strong {font-size:29px;margin-top:22px}
  .book-front [data-artwork] {height:133px}
  .book-back strong {font-size:26px}
  .book-topline,.book-bottomline {font-size:7px}
  .studio-stamp {top:4px;left:4%;font-size:8px}
  .floating-note {bottom:3px;right:0;font-size:10px;padding:12px}
  .home-facts {padding:21px 0;gap:9px}
  .home-facts>div {padding-right:7px;display:block}
  .home-facts strong {font-size:29px}
  .home-facts span {font-size:10px;line-height:1.7;margin-top:8px}
  .home-facts>div:last-child strong {font-size:22px;line-height:1.6}
  .home-tools {grid-template-columns:1fr;gap:0}
  .home-tools article,.home-tools article+article {padding:24px 0;border:0;border-bottom:1px solid var(--border)}
  .home-tools article:last-child {border-bottom:0}
  .home-tools h3 {font-size:27px}
  .home-tools p {font-size:14px}
  .dashboard-overview {grid-template-columns:1fr;gap:17px}
  .next-lesson {padding:28px;min-height:0}
  .next-lesson .eyebrow {padding-right:80px;min-height:28px;max-width:none}
  .next-lesson h2 {font-size:36px;margin-top:32px;padding-right:0;max-width:400px}
  .next-lesson p:not(.eyebrow) {font-size:14px}
  .next-lesson .path-meter {flex-wrap:nowrap;gap:13px;font-size:11px;margin:23px 0}
  .next-lesson .primary {font-size:12px;padding:12px 17px}
  .next-meta {font-size:11px;margin-top:15px}
  .lesson-visual {display:grid;right:24px;top:21px}
  .progress-ring {width:70px;height:70px;padding:4px}
  .ring-center strong {font-size:22px}
  .ring-center span {font-size:8px}
  .learning-journey {padding:25px 24px 17px}
  .journey-heading h2 {font-size:26px}
  .journey-heading .muted {font-size:10px}
  .journey-step {padding:14px 0;gap:14px;min-height:65px}
  .journey-copy strong {font-size:13px}
  .journey-copy small {font-size:11px}
  .journey-number {width:34px;height:34px;font-size:11px}
  .learning-stats {gap:9px;margin-top:17px}
  .stat {padding:17px 12px;gap:8px}
  .stat strong {font-size:27px;letter-spacing:-1px}
  .stat span {font-size:10px;line-height:1.6}
  .stat .stat-symbol {position:static;width:31px;padding:7px;order:-1}
  .stat .stat-symbol .icon {width:17px;height:17px}
  .sim-dashboard,.coach-dashboard {padding:26px}
  .sim-dashboard h2,.coach-dashboard h2 {font-size:29px}
  .sim-dashboard>p,.coach-dashboard>p {font-size:14px}
  .organization-panel {padding:21px}
  .organization-panel form {gap:15px}
  .organization-panel button {justify-self:start}
  .catalog-toolbar {gap:17px;padding:19px 0;margin-top:26px}
  .catalog-toolbar label {font-size:12px}
  .catalog-toolbar label:first-child {max-width:none}
  .catalog-count {font-size:11px}
  .module-title {font-size:27px;margin-top:28px}
  .lesson-grid {grid-template-columns:1fr;gap:21px}
  .lesson-card .lesson-cover,.lesson-card:nth-child(even) .lesson-cover {height:187px;padding:21px}
  .lesson-cover>.course-art {width:76%;height:175px;right:0}
  .lesson-number {left:22px}
  .cover-caption {font-size:21px;left:22px;bottom:23px}
  .lesson-card-body {padding:25px}
  .lesson-card-body h3 {font-size:28px}
  .lesson-card-body>p {font-size:14px}
  .lesson-card-body>.muted {font-size:12px}
  .lesson-card-body .button {font-size:13px}
  .reader-toolbar {top:64px;gap:12px;margin-top:-13px;padding:11px 0}
  .reader-toolbar>.button {font-size:12px}
  .reader-toolbar>.reader-focus {font-size:11px;padding:9px 11px}
  .reader-kicker {display:none}
  .lesson-intro {padding:25px 0 5px;margin-bottom:25px}
  .lesson-intro h1 {font-size:38px;line-height:1.14;letter-spacing:-1.1px;margin:15px 0 20px}
  .lesson-intro .lead {font-size:15px}
  .lesson-layout {grid-template-columns:1fr;gap:22px}
  .lesson-outline {position:static;border:1px solid var(--border);border-radius:7px;padding:17px}
  .lesson-outline h3 {padding:0;font-size:12px;margin-bottom:10px}
  .lesson-outline button {display:block;width:100%;margin:0;border:0;border-left:2px solid var(--border);padding:10px 12px;font-size:12px;line-height:1.6}
  .lesson-outline .outline-label {display:block;margin:15px 0 5px}
  .lesson-reading,.lesson-exercise {padding:25px 22px;border-radius:9px}
  .lesson-reading h3 {font-size:28px;scroll-margin-top:145px}
  .lesson-reading p {font-size:16px;line-height:1.9}
  .lesson-reading section {margin-bottom:25px;padding-bottom:26px}
  .worked-example {padding:23px 20px;margin-top:10px}
  .worked-example>p {font-size:13px}
  .worked-example>.eyebrow {font-size:9px}
  .worked-example blockquote {font-size:22px;line-height:1.65}
  .lesson-exercise h2 {font-size:28px;scroll-margin-top:145px}
  .lesson-exercise p,.practice-checklist {font-size:14px}
  .lesson-exercise .muted {font-size:12px}
  .lesson-feedback {padding:25px 22px;scroll-margin-top:145px}
  .lesson-feedback h2 {font-size:29px}
  .quiz-option {padding:14px;font-size:14px}
  .lesson-focus main {padding:15px 20px 0}
  .lesson-focus .reader-toolbar {top:0}
  .scenario-art {height:175px}
  .sim-scenarios {gap:19px}
  .sim-scenario-option>.scenario-copy {padding:24px}
  .sim-scenario-option strong {font-size:29px}
  .sim-scenario-option .scenario-copy>span {font-size:14px}
  .sim-scenario-option small {font-size:12px}
  .sim-scenario-option .scenario-edition {font-size:9px}
  .sim-setup legend {font-size:27px}
  .sim-setup>label {font-size:13px}
  .sim-mode {font-size:12px;line-height:1.9}
  .sim-briefing {padding:25px}
  .sim-briefing h2 {font-size:33px}
  .sim-decision,.sim-transcript {padding:22px}
  .sim-decision h2,.sim-debrief h2 {font-size:29px}
  .sim-toolbar .button {font-size:11px;padding:10px 12px}
  .sim-bubble {padding:16px}
  .sim-bubble p {font-size:14px}
  .coach-layout {grid-template-columns:1fr;gap:18px}
  .coach-sidebar {padding:16px;position:static}
  .coach-history-toggle {font-size:13px;padding-top:15px}
  .coach-welcome {padding:27px 23px}
  .coach-welcome-art {width:105px;height:90px;right:5px;top:27px}
  .coach-welcome .badge {font-size:8px;max-width:calc(100% - 90px);line-height:1.9}
  .coach-welcome h2 {font-size:36px;max-width:260px;padding-right:35px;line-height:1.13;margin:23px 0 20px}
  .coach-welcome p {font-size:14px}
  .coach-prompts button {font-size:13px;padding:14px 12px;gap:10px}
  .coach-prompts button>.icon {width:17px;height:17px}
  .coach-composer {padding:24px 22px}
  .coach-composer label {font-size:13px}
  .coach-composer .muted {font-size:12px}
  .coach-composer textarea {font-size:16px}
  .coach-turn {padding:25px 22px}
  .coach-turn h2 {font-size:29px}
  .coach-answer {font-size:15px}
  .coach-source {padding:16px}
  .coach-source summary {font-size:14px}
  .coach-source p {font-size:14px}
  .resource-cards {gap:20px}
  .resource-cards article {padding:24px}
  .resource-illustration,.resource-cards article:nth-child(n) .resource-illustration {height:165px}
  .resource-cards h2 {font-size:30px}
  .resource-cards p {font-size:14px}
  .progress-row {padding:22px}
  .progress-row h3 {font-size:16px;line-height:1.6}
  .social-panel,.form {padding:25px 23px}
  .social-panel h2 {font-size:28px}
  .social-panel p {font-size:13px}
  .form input,.form select {font-size:16px}
  .workspace-footer {font-size:11px;line-height:1.8}
  .search-result strong {font-size:13px}
  .search-result small {font-size:11px}
  .search-hint {font-size:10px;gap:14px}
}
@media(max-width:380px) {
  main,.lesson-focus main {padding-left:16px;padding-right:16px}
  .topbar {padding:0 10px}
  .topbar-actions {gap:2px}
  .topbar-location {font-size:11px}
  .home-hero h1 {font-size:39px;letter-spacing:-1.8px}
  .home-visual {height:365px}
  .book-front {width:208px;height:273px;left:4%;top:58px;padding:20px}
  .book-front strong {font-size:26px}
  .book-back {width:184px;height:254px;right:9%;padding:23px}
  .book-back strong {font-size:23px}
  .book-front [data-artwork] {height:120px}
  .studio-stamp {font-size:7px}
  .home-facts strong {font-size:25px}
  .home-facts>div:last-child strong {font-size:19px}
  .next-lesson {padding:25px 23px}
  .next-lesson h2 {font-size:33px}
  .lesson-visual {right:18px;top:20px}
  .progress-ring {width:64px;height:64px}
  .ring-center strong {font-size:20px}
  .learning-journey {padding:23px 20px 15px}
  .journey-heading h2 {font-size:23px}
  .journey-heading .muted {font-size:9px}
  .stat {padding:16px 10px}
  .stat strong {font-size:24px}
  .stat span {font-size:10px}
  .lesson-intro h1 {font-size:35px}
  .lesson-reading,.lesson-exercise {padding:24px 19px}
  .coach-welcome-art {width:85px;right:0;top:35px}
  .coach-welcome h2 {font-size:33px;padding-right:35px}
  .coach-welcome .badge {max-width:calc(100% - 70px)}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .lesson-card:hover,.sim-scenario-option:hover {transform:none}
}
