:root {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-2: #eef2f5;
  --text: #111827;
  --muted: #65717e;
  --line: #d9e0e6;
  --accent: #2459ff;
  --accent-soft: #e8eeff;
  --ok: #0d7c55;
  --ok-soft: #e6f6ef;
  --bad: #b63434;
  --bad-soft: #fff0ef;
  --radius: 22px;
  --shadow: 0 18px 50px rgba(20, 31, 44, .08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.55; }
body.accent-graphics { --accent: #7c3aed; --accent-soft: #f1eafd; }
body.accent-advanced { --accent: #0f766e; --accent-soft: #e4f5f2; }
body.accent-network { --accent: #2459ff; --accent-soft: #e8eeff; }
a { color: inherit; }
button, input, textarea { font: inherit; }
.shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.topbar { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; font-weight: 800; letter-spacing: -.02em; }
.brand-mark { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--text); color: white; }
.class-chip { display: flex; align-items: baseline; gap: 10px; color: var(--muted); }
.class-chip strong { color: var(--text); }
main { padding: 54px 0 80px; }
.hero { padding: 14px 0 38px; }
.hero-center { text-align: center; max-width: 800px; margin: 0 auto; }
.hero.compact { max-width: 900px; }
.eyebrow { display: inline-block; font-size: .78rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }
h1, h2, h3 { letter-spacing: -.035em; line-height: 1.08; margin-top: 0; }
h1 { font-size: clamp(2rem, 5vw, 4.65rem); margin-bottom: 20px; max-width: 1000px; }
.hero-center h1 { max-width: none; }
h2 { font-size: clamp(1.45rem, 3vw, 2.35rem); }
h3 { font-size: 1.1rem; }
p { color: var(--muted); }
.hero > p, .hero-center > p { max-width: 820px; font-size: 1.08rem; }
.hero-center > p { margin-left: auto; margin-right: auto; }
.panel, .action-card, .question-card, .kb-article { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.panel { padding: clamp(22px, 4vw, 38px); margin: 28px 0; }
.narrow { width: min(560px, 100%); margin: 28px auto; }
.notice, .success-banner, .soft-warning, .test-lock { border-radius: 15px; padding: 14px 18px; margin: 18px 0; }
.notice { background: #fff6d8; border: 1px solid #ead88e; color: #715d13; }
.success-banner { background: var(--ok-soft); border: 1px solid #b7e4d1; color: var(--ok); }
.soft-warning { background: var(--accent-soft); border-left: 4px solid var(--accent); color: var(--text); max-width: 850px; }
.stats-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.stat { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; min-width: 160px; }
.stat.wide { flex: 1 1 380px; }
.stat span { display: block; color: var(--muted); font-size: .8rem; margin-bottom: 4px; }
.stat strong { font-size: 1.08rem; }
.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.action-card { padding: 28px; display: flex; flex-direction: column; min-height: 320px; }
.action-card.featured { background: var(--text); color: white; border-color: var(--text); }
.action-card.featured p { color: #cbd5df; }
.card-index { color: var(--accent); font-weight: 900; font-size: .85rem; letter-spacing: .1em; margin-bottom: auto; }
.action-card h2 { margin: 42px 0 10px; }
.action-card p { margin-top: 0; min-height: 72px; }
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px; border-radius: 13px; border: 1px solid transparent; text-decoration: none; font-weight: 800; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn.primary { background: var(--accent); color: white; box-shadow: 0 10px 25px color-mix(in srgb, var(--accent) 25%, transparent); }
.action-card.featured .btn.primary { background: white; color: var(--text); }
.btn.secondary { border-color: var(--line); background: var(--surface); }
.btn.full { width: 100%; }
.button-row { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
.inline-form { display: flex; gap: 14px; align-items: center; justify-content: flex-end; margin-top: 26px; color: var(--muted); }
.link-button { border: 0; background: none; color: var(--accent); padding: 4px; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.link-button.danger { color: var(--bad); }
.form-panel { display: grid; gap: 18px; }
.form-panel label { display: grid; gap: 8px; font-weight: 700; }
input[type="text"], input:not([type]), input[name="student_label"], input[name="class_code"], textarea, input[type="file"] { width: 100%; border: 1px solid var(--line); background: var(--surface); color: var(--text); border-radius: 12px; padding: 13px 14px; outline: none; }
input:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
fieldset { border: 1px solid var(--line); border-radius: 15px; padding: 18px; }
legend { font-weight: 800; padding: 0 8px; }
.test-lock { background: #111827; color: white; display: flex; gap: 10px; align-items: center; }
.test-lock span { background: #273244; border-radius: 99px; padding: 4px 9px; font-size: .78rem; font-weight: 800; }
.test-shell { width: min(860px, 100%); margin: 0 auto; }
.progress-meta { display: flex; justify-content: space-between; color: var(--muted); font-size: .9rem; }
.progress { height: 8px; background: var(--surface-2); border-radius: 99px; overflow: hidden; margin: 8px 0 20px; }
.progress span { display: block; height: 100%; background: var(--accent); transition: width .3s ease; }
.question-card { padding: clamp(24px, 5vw, 48px); }
.question-number { color: var(--accent); font-weight: 900; letter-spacing: .1em; margin-bottom: 16px; }
.question-card h1 { font-size: clamp(1.65rem, 4vw, 3rem); }
.answers { display: grid; gap: 12px; margin-top: 28px; }
.answer-option { display: grid; grid-template-columns: 38px 1fr; gap: 12px; align-items: center; border: 1px solid var(--line); border-radius: 14px; padding: 14px; cursor: pointer; background: var(--surface); transition: border .15s ease, background .15s ease; }
.answer-option:hover { border-color: var(--accent); background: var(--accent-soft); }
.answer-option input { position: absolute; opacity: 0; pointer-events: none; }
.answer-option:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent); }
.option-key { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--surface-2); font-weight: 900; }
.feedback { border-radius: 16px; padding: 20px; margin: 28px 0 16px; border: 1px solid; }
.feedback.ok { background: var(--ok-soft); border-color: #b5dfce; color: #0e684b; }
.feedback.bad { background: var(--bad-soft); border-color: #efc0bd; color: #8c2e2e; }
.feedback p, .feedback small { color: inherit; }
.abort-form { text-align: center; margin-top: 16px; }
.result-hero { display: grid; grid-template-columns: 170px 1fr; gap: 32px; align-items: center; padding: 24px 0 38px; }
.result-hero h1 { font-size: clamp(2rem, 4vw, 3.6rem); margin-bottom: 12px; }
.score-ring { width: 160px; aspect-ratio: 1; border-radius: 50%; background: var(--accent); color: white; display: grid; place-items: center; align-content: center; box-shadow: var(--shadow); }
.score-ring strong { font-size: 3.4rem; line-height: 1; }
.score-ring span { opacity: .8; }
.topic-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.topic-links a { display: flex; justify-content: space-between; gap: 12px; text-decoration: none; padding: 14px 16px; background: var(--surface-2); border-radius: 12px; font-weight: 750; }
.review-list { margin: 34px 0; }
.review-item { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); margin: 10px 0; overflow: hidden; }
.review-item summary { cursor: pointer; padding: 16px 18px; font-weight: 750; display: flex; gap: 11px; align-items: center; }
.review-item summary span { width: 27px; height: 27px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-2); }
.review-item.correct summary span { color: var(--ok); background: var(--ok-soft); }
.review-item.incorrect summary span { color: var(--bad); background: var(--bad-soft); }
.review-body { padding: 0 20px 18px 56px; }
.review-body a { color: var(--accent); font-weight: 750; }
.kb-nav { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 26px; }
.kb-nav a { text-decoration: none; border: 1px solid var(--line); background: var(--surface); padding: 8px 12px; border-radius: 99px; font-size: .85rem; }
.kb-nav a.active { background: var(--accent); border-color: var(--accent); color: white; }
.kb-list { display: grid; gap: 20px; }
.kb-article { display: grid; grid-template-columns: 70px 1fr; gap: 24px; padding: clamp(24px, 5vw, 42px); scroll-margin-top: 20px; }
.kb-article.highlight { outline: 3px solid var(--accent-soft); border-color: var(--accent); }
.kb-number { font-weight: 900; color: var(--accent); font-size: 1.4rem; }
.kb-article .lead { font-size: 1.08rem; color: var(--text); }
.example { background: var(--surface-2); border-radius: 12px; padding: 14px 16px; margin-top: 18px; display: grid; gap: 7px; }
.example code { white-space: normal; color: var(--text); }
.tool-note { display: inline-block; background: var(--accent-soft); padding: 12px 15px; border-radius: 12px; }
.check-list { list-style: none; padding: 0; display: grid; gap: 10px; }
.check-list li { position: relative; padding-left: 30px; }
.check-list li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--accent); font-weight: 900; }
.timeline-section { margin: 48px 0; }
.section-head span { color: var(--accent); font-weight: 900; letter-spacing: .1em; text-transform: uppercase; font-size: .8rem; }
.section-head h2 { margin-top: 5px; }
.timeline { display: grid; gap: 0; border-top: 1px solid var(--line); }
.timeline article { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.timeline time { color: var(--accent); font-weight: 850; }
.timeline h3 { margin-bottom: 5px; }
.timeline p { margin: 0; }
.extension { border-left: 5px solid var(--accent); }
.submit-checks { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 18px; }
.submit-checks label { grid-template-columns: 20px 1fr; align-items: start; font-weight: 500; }
.footer { border-top: 1px solid var(--line); padding: 24px 0 40px; color: var(--muted); font-size: .9rem; }
@media (max-width: 800px) {
  .shell { width: min(100% - 20px, 1180px); }
  .topbar { min-height: 68px; }
  .class-chip span { display: none; }
  main { padding-top: 34px; }
  .card-grid { grid-template-columns: 1fr; }
  .action-card { min-height: 240px; }
  .result-hero { grid-template-columns: 1fr; }
  .score-ring { width: 132px; }
  .topic-links, .submit-checks { grid-template-columns: 1fr; }
  .kb-article { grid-template-columns: 1fr; gap: 8px; }
  .timeline article { grid-template-columns: 1fr; gap: 5px; }
  .inline-form { justify-content: space-between; }
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f141a;
    --surface: #151c24;
    --surface-2: #1d2732;
    --text: #eef3f8;
    --muted: #9eabba;
    --line: #2a3642;
    --shadow: 0 18px 50px rgba(0,0,0,.18);
    --accent-soft: color-mix(in srgb, var(--accent) 20%, #151c24);
  }
  .notice { background: #302915; border-color: #5c4f22; color: #efd877; }
  .test-lock { background: #03070c; }
  input[type="file"] { color: var(--muted); }
}

/* 90-minute practical labs */
.lesson-plan { margin: 0 0 22px; }
.section-heading { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; }
.section-heading h2 { margin: 4px 0 8px; }
.section-heading p { margin: 0; max-width: 820px; }
.compact-heading { align-items: center; }
.duration-pill { flex: 0 0 auto; border: 1px solid var(--line); background: var(--accent-soft); color: var(--accent); border-radius: 999px; padding: 9px 13px; font-weight: 900; white-space: nowrap; }
.timeline-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-top: 22px; }
.timeline-item { border-top: 3px solid var(--accent); background: var(--surface-2); border-radius: 10px; padding: 13px; display: grid; gap: 5px; }
.timeline-item strong { color: var(--accent); font-size: .82rem; }
.timeline-item span { font-weight: 850; }
.timeline-item small { color: var(--muted); line-height: 1.45; }
.practice-top { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: end; margin-bottom: 12px; }
.practice-top h1 { margin: 5px 0 8px; font-size: clamp(2rem,4vw,3.7rem); }
.practice-top p { max-width: 850px; }
.practice-progress-box { min-width: 170px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); padding: 16px 18px; display: grid; gap: 3px; }
.practice-progress-box strong { font-size: 1.4rem; }
.practice-progress-box span { color: var(--muted); font-size: .82rem; }
.practice-layout { display: grid; grid-template-columns: 280px minmax(0,1fr); gap: 20px; align-items: start; }
.practice-sidebar { position: sticky; top: 16px; }
.practice-sidebar h2 { margin-top: 0; font-size: 1.2rem; }
.practice-sidebar h3 { margin-top: 26px; }
.mini-timeline { display: grid; gap: 9px; }
.mini-timeline div { display: grid; grid-template-columns: 72px 1fr; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.mini-timeline strong { color: var(--accent); font-size: .78rem; }
.mini-timeline span { font-size: .86rem; font-weight: 700; }
.task-nav { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.task-nav li { display: grid; grid-template-columns: 30px 1fr; gap: 8px; align-items: start; color: var(--muted); font-size: .86rem; padding: 8px; border-radius: 10px; }
.task-nav li span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; background: var(--surface-2); color: var(--muted); font-weight: 900; font-size: .72rem; }
.task-nav li.active { background: var(--accent-soft); color: var(--text); font-weight: 750; }
.task-nav li.active span { background: var(--accent); color: white; }
.task-nav li.done { color: var(--text); }
.task-nav li.done span { background: var(--ok-soft); color: var(--ok); }
.practice-main { display: grid; gap: 18px; min-width: 0; }
.evidence-box { margin-top: 20px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #0d141b; }
.evidence-title { padding: 10px 14px; color: #b7c4d2; border-bottom: 1px solid #26313d; font-size: .78rem; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.evidence-box pre { margin: 0; padding: 16px; overflow-x: auto; color: #e7f2fc; font: 500 .9rem/1.65 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; white-space: pre-wrap; word-break: break-word; }
.practice-checkpoint h2 { font-size: clamp(1.35rem,3vw,2.2rem); }
.hint-panel { margin-top: 20px; border: 1px dashed var(--line); background: var(--surface-2); border-radius: 14px; padding: 16px; }
.hint-panel p { margin-bottom: 12px; }
.hint-head { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.hint-head span { color: var(--muted); font-size: .8rem; }
.hint-panel ol { padding-left: 22px; }
.hint-panel li + li { margin-top: 7px; }
.btn.tertiary { min-height: 42px; border-color: var(--line); background: transparent; color: var(--text); }
.kb-bridge { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin: 0 0 16px; padding: 13px 15px; border-radius: 12px; background: var(--accent-soft); }
.kb-bridge span { font-size: .8rem; color: var(--muted); }
.kb-bridge a, .doc-link a { color: var(--accent); font-weight: 800; }
.doc-link { margin-top: 16px; color: var(--muted); font-size: .86rem; }
.completion-stats { margin-bottom: 24px; }

@media (max-width: 980px) {
  .timeline-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .practice-layout { grid-template-columns: 1fr; }
  .practice-sidebar { position: static; }
}
@media (max-width: 620px) {
  .section-heading, .practice-top { grid-template-columns: 1fr; display: grid; }
  .timeline-grid { grid-template-columns: 1fr; }
  .practice-progress-box { min-width: 0; }
  .kb-bridge { align-items: flex-start; flex-direction: column; }
}

/* Case studies, network diagrams and simulated terminal */
.case-card { border-top: 4px solid var(--accent); }
.case-hero { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 28px; align-items: start; margin-bottom: 24px; }
.case-hero h1 { font-size: clamp(2.3rem,5vw,4.6rem); margin: 7px 0 14px; max-width: 900px; }
.case-hero > div > p { max-width: 880px; font-size: 1.06rem; }
.case-meta-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 22px; }
.case-meta-grid > div { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 14px; display: grid; gap: 6px; }
.case-meta-grid span { color: var(--muted); font-size: .74rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.case-meta-grid strong { font-size: .92rem; line-height: 1.45; }
.case-reality-badge { position: sticky; top: 16px; border: 1px solid var(--line); background: var(--accent-soft); border-radius: 16px; padding: 18px; display: grid; gap: 9px; }
.case-reality-badge strong { color: var(--accent); font-size: .78rem; letter-spacing: .1em; }
.case-reality-badge span { color: var(--muted); line-height: 1.45; }
.case-rules { margin-bottom: 22px; }
.case-rules .check-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
.case-diagram-card { margin: 22px 0; border: 1px solid var(--line); background: var(--surface); border-radius: 18px; overflow: hidden; box-shadow: var(--shadow); }
.case-diagram-title { padding: 15px 18px; border-bottom: 1px solid var(--line); font-weight: 900; }
.case-diagram-scroll { overflow-x: auto; padding: 10px; background: linear-gradient(180deg,var(--surface),var(--surface-2)); }
.case-diagram { display: block; width: 100%; min-width: 760px; height: auto; }
.case-diagram-card figcaption { padding: 12px 18px 16px; color: var(--muted); font-size: .86rem; }
.case-link { stroke: color-mix(in srgb, var(--muted) 45%, transparent); stroke-width: 2; fill: none; }
.case-link.focused { stroke: var(--accent); stroke-width: 3; }
.case-diagram marker polygon { fill: color-mix(in srgb, var(--muted) 70%, transparent); }
.case-link-label { fill: var(--muted); font-size: 12px; font-weight: 750; paint-order: stroke; stroke: var(--surface); stroke-width: 4px; stroke-linejoin: round; }
.case-node rect { fill: var(--surface); stroke: var(--line); stroke-width: 2; }
.case-node.focused rect { fill: var(--accent-soft); stroke: var(--accent); stroke-width: 3; }
.case-node.muted { opacity: .43; }
.case-node-label { fill: var(--text); font-size: 14px; font-weight: 900; }
.case-node-sub { fill: var(--muted); font-size: 11px; font-weight: 650; }
.case-ticket-timeline { border-top: 1px solid var(--line); }
.case-ticket-timeline article { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 22px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.case-ticket-time { display: flex; flex-direction: column; gap: 7px; align-items: flex-start; }
.case-ticket-time time { color: var(--accent); font-weight: 900; font-size: 1.08rem; }
.case-ticket-time span { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; padding: 4px 8px; font-size: .68rem; font-weight: 900; }
.case-ticket-id { color: var(--muted); font-size: .74rem; font-weight: 900; letter-spacing: .08em; }
.case-ticket-timeline h3 { margin: 3px 0 6px; }
.case-ticket-timeline p { margin: 0; }
.case-transfer { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 24px; align-items: center; margin-top: 28px; }
.button-row { display: flex; gap: 9px; flex-wrap: wrap; align-items: center; }
.incident-strip { display: inline-flex; align-items: center; gap: 7px; margin-top: 10px; flex-wrap: wrap; }
.incident-strip span,.incident-strip strong,.incident-strip em { border-radius: 999px; padding: 5px 9px; font-size: .73rem; font-style: normal; }
.incident-strip span { background: var(--surface-2); color: var(--muted); }
.incident-strip strong { background: var(--accent-soft); color: var(--accent); }
.incident-strip em { border: 1px solid var(--line); color: var(--text); font-weight: 850; }
.practice-diagram-toggle { margin-top: 18px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.practice-diagram-toggle > summary { cursor: pointer; padding: 13px 15px; font-weight: 850; background: var(--surface-2); }
.practice-diagram-toggle .case-diagram-card { margin: 0; border: 0; border-radius: 0; box-shadow: none; }
.terminal-lab { margin: 22px 0; }
.terminal-lab-head { display: flex; justify-content: space-between; gap: 18px; align-items: end; margin-bottom: 7px; }
.terminal-lab-head h2 { margin: 3px 0 0; }
.terminal-lab-head > span { color: var(--muted); font-size: .82rem; }
.terminal-note { color: var(--muted); max-width: 850px; font-size: .9rem; }
.terminal-stack { display: grid; gap: 12px; margin-top: 14px; }
.terminal-card { border: 1px solid #25313d; background: #0b1118; border-radius: 14px; overflow: hidden; color: #e7f2fc; }
.terminal-card-top { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 13px 14px; border-bottom: 1px solid #25313d; }
.terminal-card-top > div { display: grid; gap: 4px; }
.terminal-card-top strong { color: #f3f8fd; }
.terminal-card-top small { color: #8ea0b2; line-height: 1.4; }
.terminal-card .btn.tertiary { color: #e7f2fc; border-color: #3b4b5d; }
.terminal-card .btn.tertiary:hover { background: #17222e; }
.terminal-command { display: flex; gap: 9px; padding: 14px 16px; align-items: flex-start; font: 700 .9rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.terminal-command span { color: #6ee7a8; user-select: none; }
.terminal-command code { color: #f4f8fb; white-space: pre-wrap; word-break: break-word; }
.terminal-output { border-top: 1px solid #25313d; background: #070b10; }
.terminal-output pre { margin: 0; padding: 15px 16px; overflow-x: auto; color: #cbd7e3; font: 500 .88rem/1.62 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; white-space: pre-wrap; word-break: break-word; }
.terminal-meaning { border-top: 1px solid #25313d; padding: 0 16px 12px; background: #101923; }
.terminal-meaning summary { cursor: pointer; color: #8ed3ff; padding: 12px 0 4px; font-weight: 850; }
.terminal-meaning p { color: #c4cfdb; margin: 7px 0 0; }
.terminal-card.ran .terminal-run { border-color: #305d48; color: #92e6b9; }
.practice-main .terminal-lab { margin-bottom: 0; }
.practice-main .terminal-lab-head h2 { font-size: 1.12rem; }

@media (max-width: 820px) {
  .case-hero, .case-transfer { grid-template-columns: 1fr; }
  .case-reality-badge { position: static; }
  .case-meta-grid, .case-rules .check-list { grid-template-columns: 1fr; }
  .case-ticket-timeline article { grid-template-columns: 82px minmax(0,1fr); gap: 13px; }
  .terminal-card-top { align-items: flex-start; flex-direction: column; }
}

/* Visual Knowledge Tour */
.kb-hero { position: relative; }
.kb-overall-progress { margin-top: 28px; width: min(640px,100%); background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 16px 18px; box-shadow: var(--shadow); }
.kb-overall-progress > div:first-child { display:flex; justify-content:space-between; gap:18px; align-items:center; }
.kb-overall-progress span { color:var(--muted); font-size:.86rem; }
.kb-overall-progress strong { font-size:.9rem; }
.kb-overall-progress .progress { margin:12px 0 0; height:7px; }
.kb-topic-browser { margin: 4px 0 34px; }
.kb-browser-head { display:flex; justify-content:space-between; gap:28px; align-items:end; margin-bottom:16px; }
.kb-browser-head > div > span { color:var(--accent); text-transform:uppercase; font-weight:900; letter-spacing:.1em; font-size:.76rem; }
.kb-browser-head h2 { margin:5px 0 0; }
.kb-browser-head p { max-width:520px; margin:0; }
.kb-topic-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.kb-topic-card { text-decoration:none; background:var(--surface); border:1px solid var(--line); border-radius:17px; padding:18px; min-height:190px; display:flex; flex-direction:column; transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease; }
.kb-topic-card:hover { transform:translateY(-2px); border-color:var(--accent); box-shadow:var(--shadow); }
.kb-topic-card.active { outline:3px solid var(--accent-soft); border-color:var(--accent); }
.kb-topic-top { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:22px; }
.kb-topic-top > span { color:var(--accent); font-weight:950; letter-spacing:.08em; font-size:.8rem; }
.kb-topic-top i { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:var(--surface-2); color:var(--muted); font-style:normal; font-weight:900; }
.kb-topic-card.completed .kb-topic-top i { background:var(--ok-soft); color:var(--ok); }
.kb-topic-card > strong { font-size:1.04rem; line-height:1.2; }
.kb-topic-card > p { font-size:.87rem; margin:7px 0 15px; flex:1; }
.kb-topic-meta { display:flex; gap:7px; flex-wrap:wrap; }
.kb-topic-meta span { background:var(--surface-2); border-radius:999px; padding:5px 8px; color:var(--muted); font-size:.74rem; font-weight:800; }
.kb-focus-article { scroll-margin-top:20px; }
.kb-focus-breadcrumb { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:.86rem; margin:6px 0 11px; }
.kb-tour { background:var(--surface); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow); overflow:hidden; }
.kb-tour-header { display:flex; justify-content:space-between; gap:32px; align-items:flex-start; padding:clamp(24px,4vw,42px); border-bottom:1px solid var(--line); }
.kb-tour-header h2 { font-size:clamp(1.9rem,4vw,3.4rem); margin-bottom:10px; }
.kb-tour-header .lead { max-width:720px; margin:0; color:var(--text); font-size:1.08rem; }
.kb-tour-meta { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; max-width:310px; }
.kb-tour-meta > span { border:1px solid var(--line); background:var(--surface-2); border-radius:999px; padding:7px 10px; color:var(--muted); font-size:.78rem; font-weight:850; }
.kb-tour-start { border:0; border-radius:999px; padding:8px 12px; background:var(--accent); color:white; font-weight:900; cursor:pointer; }
.kb-tour-tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-bottom:1px solid var(--line); background:var(--surface-2); position:sticky; top:0; z-index:4; }
.kb-tour-tabs button { border:0; border-right:1px solid var(--line); background:transparent; color:var(--muted); padding:15px 12px; cursor:pointer; font-weight:850; }
.kb-tour-tabs button:last-child { border-right:0; }
.kb-tour-tabs button.active { color:var(--accent); background:var(--surface); box-shadow:inset 0 -3px 0 var(--accent); }
.kb-tab-panel { padding:clamp(22px,4vw,42px); }
.kb-mental-model { display:grid; grid-template-columns:150px 1fr; gap:26px; align-items:start; background:linear-gradient(135deg,var(--accent-soft),var(--surface)); border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line)); border-radius:18px; padding:19px 20px; margin-bottom:20px; }
.kb-mental-model span { color:var(--accent); font-size:.76rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.kb-mental-model p { margin:0; color:var(--text); font-weight:700; font-size:1.02rem; }
.kb-demo-stage { border:1px solid var(--line); border-radius:20px; overflow:hidden; background:linear-gradient(180deg,var(--surface),var(--surface-2)); min-height:330px; display:flex; flex-direction:column; }
.kb-demo-toolbar { min-height:48px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; gap:12px; padding:0 15px; background:var(--surface); }
.kb-demo-live { display:flex; gap:8px; align-items:center; color:var(--muted); font-weight:850; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; }
.kb-demo-live i { width:8px; height:8px; background:var(--ok); border-radius:50%; box-shadow:0 0 0 5px var(--ok-soft); }
.kb-demo-reset { border:0; background:none; color:var(--accent); font-weight:850; cursor:pointer; }
.kb-demo-caption { color:var(--muted); font-size:.88rem; max-width:760px; margin:14px auto 0; text-align:center; }
.kb-demo-stage [data-demo-step] { opacity:.35; transform:translateY(6px); transition:opacity .35s ease,transform .35s ease,box-shadow .35s ease; }
.kb-demo-stage.demo-ready [data-demo-step], .kb-demo-stage [data-demo-step].revealed { opacity:1; transform:none; }
.kb-tour-callout { margin-top:18px; display:grid; grid-template-columns:180px 1fr; gap:22px; border-left:4px solid var(--accent); background:var(--surface-2); border-radius:0 14px 14px 0; padding:16px 18px; }
.kb-tour-callout p { margin:0; }
.kb-flow { flex:1; padding:42px 28px; display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; }
.kb-flow-node { min-width:145px; max-width:190px; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px; text-align:center; box-shadow:0 10px 30px rgba(20,31,44,.06); }
.kb-flow-node span { display:block; color:var(--accent); font-size:.76rem; font-weight:900; text-transform:uppercase; letter-spacing:.07em; margin-bottom:5px; }
.kb-flow-node strong { font-size:.96rem; }
.kb-flow-arrow,.poster-swap,.color-arrow,.pixel-vs,.export-arrow,.asset-arrow { color:var(--accent); font-size:1.6rem; font-weight:950; }
.kb-layer-stack { width:min(760px,calc(100% - 32px)); margin:auto; display:grid; gap:8px; padding:30px 0; }
.kb-layer { display:grid; grid-template-columns:46px 1fr; gap:13px; align-items:center; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:12px 14px; }
.kb-layer > span { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:var(--accent-soft); color:var(--accent); font-weight:950; }
.kb-layer div { display:flex; justify-content:space-between; gap:15px; align-items:center; }
.kb-layer small { color:var(--muted); }
.kb-subnet-visual { flex:1; padding:34px; display:grid; place-items:center; align-content:center; }
.kb-subnet-ip { text-align:center; margin-bottom:22px; }
.kb-subnet-ip span { display:block; color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; font-weight:850; }
.kb-subnet-ip strong { font:900 clamp(1.5rem,4vw,2.8rem)/1.1 ui-monospace,SFMono-Regular,Menlo,monospace; }
.kb-address-track { width:min(900px,100%); display:grid; grid-template-columns:1.1fr 5fr 1.2fr; border-radius:16px; overflow:hidden; border:1px solid var(--line); }
.kb-address-track > div { padding:20px 14px; display:grid; gap:4px; min-height:100px; align-content:center; }
.kb-address-track .network { background:var(--accent-soft); }
.kb-address-track .hosts { background:var(--surface); }
.kb-address-track .broadcast { background:var(--bad-soft); }
.kb-address-track span { font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:850; }
.kb-address-track b { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.kb-server-visual { flex:1; display:grid; grid-template-columns:230px minmax(0,560px); gap:26px; justify-content:center; align-items:center; padding:34px; }
.kb-server-box { min-height:220px; border-radius:22px; background:#0b1118; color:#eaf3fc; display:grid; place-items:center; align-content:center; gap:8px; position:relative; box-shadow:0 22px 55px rgba(0,0,0,.18); }
.server-light { width:12px; height:12px; background:#60d394; border-radius:50%; box-shadow:0 0 0 7px rgba(96,211,148,.12); }
.kb-server-box small { color:#8fa0b2; }
.kb-port-list { display:grid; gap:9px; }
.kb-port-row { display:grid; grid-template-columns:70px 1fr 100px; gap:14px; align-items:center; border:1px solid var(--line); background:var(--surface); border-radius:13px; padding:12px 14px; }
.kb-port-row code { color:var(--accent); font-weight:900; }
.kb-port-row span { text-align:right; color:var(--muted); font-size:.82rem; }
.kb-port-row.state-open { border-left:4px solid var(--ok); }
.kb-port-row.state-closed { border-left:4px solid var(--bad); }
.kb-port-row.state-local { border-left:4px solid #d49a24; }
.kb-permission-visual { margin:auto; width:min(690px,calc(100% - 32px)); padding:34px 0; }
.kb-permission-mode { font:800 1.2rem ui-monospace,SFMono-Regular,Menlo,monospace; margin-bottom:14px; }
.kb-permission-mode strong { background:var(--accent); color:white; padding:7px 10px; border-radius:9px; }
.kb-permission-grid { display:grid; gap:8px; }
.kb-permission-row { display:grid; grid-template-columns:1fr 120px 50px; gap:10px; border:1px solid var(--line); background:var(--surface); border-radius:13px; padding:14px 16px; align-items:center; }
.kb-permission-row code { font-size:1.2rem; letter-spacing:.15em; color:var(--accent); }
.kb-permission-row span { width:36px; height:36px; display:grid; place-items:center; border-radius:9px; background:var(--accent-soft); color:var(--accent); font-weight:950; }
.kb-compare-visual,.kb-contrast-demo,.kb-color-space,.kb-pixel-demo,.kb-assets-demo { flex:1; display:flex; justify-content:center; align-items:center; gap:20px; padding:34px; }
.kb-compare-card { width:min(340px,45%); min-height:190px; border-radius:18px; padding:20px; display:grid; align-content:center; text-align:center; border:1px solid var(--line); background:var(--surface); }
.kb-compare-card > span { font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; font-weight:900; color:var(--muted); }
.kb-compare-card strong { font:900 1.35rem ui-monospace,SFMono-Regular,Menlo,monospace; margin:10px 0 4px; }
.kb-compare-card p { margin:0 0 9px; }
.kb-compare-card small { color:var(--muted); }
.kb-compare-card.badish { border-top:4px solid #d49a24; }
.kb-compare-card.goodish { border-top:4px solid var(--ok); }
.kb-poster-demo { flex:1; display:flex; justify-content:center; align-items:center; gap:25px; padding:28px; background:radial-gradient(circle at 20% 10%,var(--accent-soft),transparent 35%); }
.poster-preview { width:260px; aspect-ratio:3/4; border-radius:18px; padding:20px; box-shadow:0 25px 55px rgba(0,0,0,.14); display:flex; flex-direction:column; overflow:hidden; }
.poster-preview > small { font-weight:900; font-size:.62rem; letter-spacing:.1em; }
.poster-bad { background:#e7e7e7; color:#555; justify-content:center; gap:16px; }
.poster-line.same { font-size:1.05rem; font-weight:750; border:1px solid #aaa; padding:7px; }
.poster-good { background:#111827; color:white; }
.poster-good > small { color:#99a8ba; }
.poster-kicker { margin-top:30px; font-size:.65rem; letter-spacing:.15em; color:#b8c4d0; }
.poster-title { font-size:2.8rem; line-height:.88; font-weight:950; letter-spacing:-.08em; margin:22px 0 auto; }
.poster-meta { font-weight:800; color:#c3cedb; border-top:1px solid #334154; padding-top:13px; }
.poster-cta { background:var(--accent); border-radius:9px; padding:10px; font-size:.8rem; font-weight:900; margin-top:12px; }
.kb-grid-demo { flex:1; display:grid; place-items:center; align-content:center; padding:28px; }
.grid-canvas { width:min(700px,100%); aspect-ratio:16/9; border:1px solid var(--line); background:var(--surface); position:relative; display:grid; grid-template-columns:repeat(6,1fr); gap:12px; padding:24px; overflow:hidden; }
.grid-canvas > i { border-left:1px dashed color-mix(in srgb,var(--accent) 40%,transparent); border-right:1px dashed color-mix(in srgb,var(--accent) 40%,transparent); background:color-mix(in srgb,var(--accent) 5%,transparent); }
.grid-block { position:absolute; background:var(--text); color:var(--surface); border-radius:7px; padding:9px 11px; font-weight:900; font-size:.75rem; }
.grid-block.b1 { left:24px; top:24px; width:calc(50% - 30px); height:24%; }
.grid-block.b2 { right:24px; top:24px; width:calc(33% - 22px); height:60%; background:var(--accent); }
.grid-block.b3 { left:24px; top:44%; width:calc(50% - 30px); height:18%; }
.grid-block.b4 { left:24px; bottom:24px; width:28%; }
.contrast-card { width:min(330px,45%); min-height:180px; padding:22px; border-radius:18px; display:grid; align-content:center; text-align:center; }
.contrast-card.low { background:#d7d9dc; color:#bcc0c4; }
.contrast-card.high { background:#111827; color:white; }
.contrast-card span { font-size:.72rem; text-transform:uppercase; font-weight:900; letter-spacing:.08em; }
.contrast-card strong { font-size:2rem; margin:12px 0; }
.contrast-card small { opacity:.8; }
.rgb-orb,.cmyk-stack { width:260px; aspect-ratio:1; border-radius:50%; display:grid; place-items:center; align-content:center; color:white; box-shadow:0 24px 55px rgba(0,0,0,.13); }
.rgb-orb { background:radial-gradient(circle at 35% 35%,#ff3d71,transparent 42%),radial-gradient(circle at 65% 35%,#22c55e,transparent 42%),radial-gradient(circle at 50% 70%,#2459ff,transparent 45%),#111; }
.cmyk-stack { border-radius:22px; background:linear-gradient(135deg,#00b7d8 0 25%,#e6007e 25% 50%,#f4d000 50% 75%,#121212 75%); }
.rgb-orb span,.cmyk-stack span { font-size:2.2rem; font-weight:950; }
.rgb-orb b,.cmyk-stack b { font-size:.9rem; }
.rgb-orb small,.cmyk-stack small { font-size:.75rem; opacity:.85; }
.raster-side,.vector-side { width:min(330px,43%); min-height:250px; border:1px solid var(--line); border-radius:18px; padding:20px; background:var(--surface); text-align:center; display:grid; place-items:center; align-content:center; gap:8px; }
.pixel-grid { width:150px; aspect-ratio:1; display:grid; grid-template-columns:repeat(8,1fr); border:1px solid var(--line); }
.pixel-grid i { background:var(--accent-soft); border:.5px solid color-mix(in srgb,var(--accent) 24%,var(--line)); }
.pixel-grid i:nth-child(3n),.pixel-grid i:nth-child(5n) { background:var(--accent); }
.vector-side svg { width:160px; height:120px; fill:none; stroke:var(--accent); stroke-width:7; stroke-linejoin:round; }
.raster-side small,.vector-side small { color:var(--muted); }
.kb-export-demo { flex:1; display:flex; align-items:center; justify-content:center; gap:24px; padding:34px; }
.export-source { width:250px; min-height:180px; background:var(--text); color:var(--surface); border-radius:18px; display:grid; align-content:center; text-align:center; gap:6px; padding:20px; }
.export-source span { font-size:.7rem; letter-spacing:.12em; opacity:.7; }
.export-source strong { font-size:1.4rem; }
.export-source small { opacity:.7; }
.export-choices { display:grid; gap:10px; width:280px; }
.export-choices > div { border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:13px 15px; display:flex; justify-content:space-between; gap:10px; }
.export-choices small { color:var(--muted); }
.asset-card { width:min(310px,42%); min-height:190px; border:1px solid var(--line); border-radius:18px; padding:20px; text-align:center; display:grid; place-items:center; align-content:center; gap:7px; background:var(--surface); }
.asset-thumb { width:76px; height:76px; display:grid; place-items:center; border-radius:18px; background:var(--surface-2); font-size:2rem; font-weight:950; }
.asset-card.unknown { border-top:4px solid #d49a24; }
.asset-card.verified { border-top:4px solid var(--ok); }
.asset-card.verified .asset-thumb { background:var(--ok-soft); color:var(--ok); }
.asset-card small { color:var(--muted); }
.kb-stepper { border:1px solid var(--line); border-radius:18px; padding:20px; background:var(--surface-2); }
.kb-step-progress { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:.85rem; }
.kb-step-track { display:flex; align-items:center; gap:7px; margin:14px 0 24px; }
.kb-step-dot { flex:1; height:6px; padding:0; border:0; border-radius:99px; background:var(--line); cursor:pointer; }
.kb-step-dot.active,.kb-step-dot.done { background:var(--accent); }
.kb-step-slide { min-height:190px; border-radius:16px; background:var(--surface); padding:28px; border:1px solid var(--line); }
.kb-step-slide > span { color:var(--accent); font-size:.76rem; font-weight:900; letter-spacing:.1em; }
.kb-step-slide h3 { font-size:clamp(1.35rem,3vw,2.3rem); margin:10px 0 12px; max-width:820px; }
.kb-step-slide p { max-width:780px; }
.kb-step-actions { display:flex; justify-content:space-between; gap:12px; margin-top:16px; }
.kb-mistakes { margin-top:28px; }
.kb-mistakes h3 { margin:4px 0 14px; }
.kb-mistake-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.kb-mistake-grid > div { background:var(--bad-soft); border:1px solid color-mix(in srgb,var(--bad) 25%,var(--line)); border-radius:14px; padding:15px; display:grid; grid-template-columns:28px 1fr; gap:10px; }
.kb-mistake-grid span { width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:var(--bad); color:white; font-weight:950; }
.kb-mistake-grid p { margin:1px 0 0; color:var(--text); font-size:.88rem; }
.kb-deep-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:24px; }
.kb-deep-copy { max-width:780px; }
.kb-deep-copy p { font-size:1rem; }
.kb-example-card { align-self:start; position:sticky; top:70px; background:#0b1118; color:#e7f2fc; border:1px solid #25313d; border-radius:17px; padding:20px; }
.kb-example-card span { display:block; color:#8ed3ff; font-size:.74rem; text-transform:uppercase; font-weight:900; letter-spacing:.1em; margin-bottom:12px; }
.kb-example-card code { display:block; white-space:pre-wrap; word-break:break-word; color:#f4f8fb; font:700 .9rem/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; }
.kb-example-card p { color:#aab8c6; font-size:.86rem; margin:17px 0 0; border-top:1px solid #263342; padding-top:14px; }
.kb-more-explanation { margin-top:24px; border:1px solid var(--line); border-radius:15px; background:var(--surface-2); overflow:hidden; }
.kb-more-explanation summary { cursor:pointer; padding:16px 18px; font-weight:900; }
.kb-more-explanation > div { padding:0 18px 18px; }
.kb-self-check { max-width:820px; margin:0 auto; }
.kb-self-check h3 { font-size:clamp(1.35rem,3vw,2.2rem); }
.kb-check-options { display:grid; gap:9px; margin-top:22px; }
.kb-check-options button { display:grid; grid-template-columns:38px 1fr; gap:12px; align-items:center; text-align:left; border:1px solid var(--line); border-radius:13px; background:var(--surface); color:var(--text); padding:11px 14px; cursor:pointer; }
.kb-check-options button:hover { border-color:var(--accent); }
.kb-check-options button span { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--surface-2); font-weight:900; }
.kb-check-options button.correct { border-color:var(--ok); background:var(--ok-soft); }
.kb-check-options button.wrong { border-color:var(--bad); background:var(--bad-soft); }
.kb-check-feedback { margin-top:14px; border-radius:13px; padding:15px 17px; background:var(--surface-2); border:1px solid var(--line); }
.kb-check-feedback.ok { background:var(--ok-soft); border-color:color-mix(in srgb,var(--ok) 30%,var(--line)); }
.kb-check-feedback.bad { background:var(--bad-soft); border-color:color-mix(in srgb,var(--bad) 30%,var(--line)); }
.kb-check-feedback p { margin:4px 0 0; color:inherit; }
.kb-complete-card { margin-top:28px; border-top:1px solid var(--line); padding-top:20px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.kb-complete-card > div { display:flex; gap:13px; align-items:center; }
.kb-complete-card > div > span { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background:var(--ok-soft); color:var(--ok); font-weight:950; font-size:1.1rem; }
.kb-complete-card p { margin:3px 0 0; font-size:.85rem; }
.kb-complete-card.completed .kb-mark-complete { background:var(--ok-soft); border-color:var(--ok); color:var(--ok); }
.kb-topic-pager { display:flex; justify-content:space-between; gap:12px; margin-top:18px; }
.kb-topic-pager .btn { max-width:48%; }
@media (max-width:900px) {
  .kb-topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kb-tour-header { flex-direction:column; }
  .kb-tour-meta { justify-content:flex-start; max-width:none; }
  .kb-mistake-grid { grid-template-columns:1fr; }
  .kb-deep-grid { grid-template-columns:1fr; }
  .kb-example-card { position:static; }
  .kb-server-visual { grid-template-columns:1fr; }
  .kb-server-box { min-height:150px; }
}
@media (max-width:650px) {
  .kb-browser-head { flex-direction:column; align-items:flex-start; }
  .kb-topic-grid { grid-template-columns:1fr; }
  .kb-tour-tabs { grid-template-columns:1fr 1fr; position:static; }
  .kb-tour-tabs button { border-bottom:1px solid var(--line); }
  .kb-mental-model,.kb-tour-callout { grid-template-columns:1fr; gap:7px; }
  .kb-flow { flex-direction:column; }
  .kb-flow-arrow { transform:rotate(90deg); }
  .kb-flow-node { width:100%; max-width:360px; }
  .kb-layer div { display:grid; gap:2px; }
  .kb-address-track { grid-template-columns:1fr; }
  .kb-compare-visual,.kb-contrast-demo,.kb-color-space,.kb-pixel-demo,.kb-assets-demo,.kb-poster-demo,.kb-export-demo { flex-direction:column; }
  .kb-compare-card,.contrast-card,.raster-side,.vector-side,.asset-card { width:100%; }
  .poster-preview { width:min(290px,100%); }
  .poster-swap,.color-arrow,.pixel-vs,.export-arrow,.asset-arrow { transform:rotate(90deg); }
  .kb-port-row { grid-template-columns:65px 1fr; }
  .kb-port-row span { grid-column:2; text-align:left; }
  .kb-permission-row { grid-template-columns:1fr 90px 45px; }
  .kb-step-actions,.kb-complete-card,.kb-topic-pager { flex-direction:column; align-items:stretch; }
  .kb-topic-pager .btn { max-width:none; }
}

/* Interactive Knowledge Tour simulations */
.kb-tour-tabs.has-simulation { grid-template-columns:repeat(5,1fr); }
.sim-badge { color:var(--accent)!important; background:var(--accent-soft)!important; border-color:color-mix(in srgb,var(--accent) 28%,var(--line))!important; }
.kb-sim { border:1px solid var(--line); border-radius:22px; overflow:hidden; background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface-2) 55%,var(--surface))); box-shadow:0 18px 48px rgba(20,31,44,.06); }
.sim-head { padding:24px 26px; display:flex; justify-content:space-between; gap:24px; align-items:flex-start; border-bottom:1px solid var(--line); }
.sim-head h3 { font-size:clamp(1.5rem,3vw,2.45rem); margin:3px 0 8px; }
.sim-head p { max-width:780px; margin:0; }
.sim-score { min-width:112px; text-align:center; border:1px solid var(--line); border-radius:16px; background:var(--surface); padding:11px 14px; display:grid; gap:1px; }
.sim-score span,.sim-score small { color:var(--muted); font-size:.72rem; font-weight:800; }
.sim-score strong { font-size:1.3rem; }
.sim-learning-loop { display:grid; grid-template-columns:repeat(4,1fr); background:var(--surface-2); border-bottom:1px solid var(--line); }
.sim-learning-loop span { position:relative; padding:11px 12px; text-align:center; color:var(--muted); font-size:.78rem; font-weight:850; border-right:1px solid var(--line); }
.sim-learning-loop span:last-child { border-right:0; }
.sim-learning-loop span.active { color:var(--accent); background:var(--surface); }
.sim-learning-loop span.done { color:var(--ok); background:var(--ok-soft); }
.sim-prediction { margin:22px 24px 0; padding:18px; border-radius:16px; background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line)); }
.sim-prediction > div:first-child { display:grid; gap:2px; }
.sim-prediction > div:first-child span { color:var(--accent); font-size:.72rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.sim-prediction > div:first-child strong { font-size:1.04rem; }
.sim-answer-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:13px; }
.sim-answer-row button,.sim-conclusion-options button { border:1px solid var(--line); background:var(--surface); color:var(--text); border-radius:12px; padding:10px 12px; text-align:left; cursor:pointer; display:flex; align-items:center; gap:9px; transition:.15s ease; }
.sim-answer-row button:hover,.sim-conclusion-options button:hover { border-color:var(--accent); transform:translateY(-1px); }
.sim-answer-row button b,.sim-conclusion-options button b { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; background:var(--surface-2); font-size:.78rem; flex:0 0 auto; }
.sim-answer-row button.correct,.sim-conclusion-options button.correct { border-color:var(--ok); background:var(--ok-soft); }
.sim-answer-row button.wrong,.sim-conclusion-options button.wrong { border-color:var(--bad); background:var(--bad-soft); }
.sim-inline-feedback { margin:11px 0 0; font-weight:760; font-size:.87rem; }
.sim-inline-feedback.ok { color:var(--ok); }
.sim-inline-feedback.bad { color:var(--bad); }
.sim-workbench { display:grid; grid-template-columns:minmax(215px,.72fr) minmax(390px,1.55fr) minmax(220px,.78fr); gap:0; margin:22px 24px; border:1px solid var(--line); border-radius:18px; overflow:hidden; background:var(--surface); min-height:430px; }
.sim-controls-panel,.sim-evidence-panel { padding:20px; background:var(--surface-2); }
.sim-controls-panel { border-right:1px solid var(--line); }
.sim-evidence-panel { border-left:1px solid var(--line); }
.sim-panel-kicker { color:var(--accent); font-size:.7rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; margin-bottom:5px; }
.sim-controls-panel h4,.sim-evidence-panel h4,.sim-conclusion h4 { margin:0 0 8px; font-size:1.02rem; }
.sim-controls-panel > p { margin:0 0 17px; font-size:.86rem; }
.sim-control { display:grid; gap:7px; margin:13px 0; }
.sim-control > span { display:flex; justify-content:space-between; gap:10px; color:var(--muted); font-size:.78rem; font-weight:760; }
.sim-control > span b { color:var(--text); }
.sim-control select { width:100%; border:1px solid var(--line); border-radius:10px; padding:10px 11px; background:var(--surface); color:var(--text); outline:none; }
.sim-control input[type="range"] { width:100%; accent-color:var(--accent); }
.sim-toggle { display:grid; grid-template-columns:38px 1fr; gap:9px; align-items:center; margin:13px 0; cursor:pointer; }
.sim-toggle input { position:absolute; opacity:0; }
.sim-toggle > span { width:38px; height:22px; border-radius:99px; background:#c9d1d8; position:relative; transition:.15s; }
.sim-toggle > span::after { content:""; position:absolute; width:16px; height:16px; top:3px; left:3px; border-radius:50%; background:white; box-shadow:0 2px 5px rgba(0,0,0,.2); transition:.15s; }
.sim-toggle input:checked + span { background:var(--accent); }
.sim-toggle input:checked + span::after { transform:translateX(16px); }
.sim-toggle b { font-size:.82rem; }
.sim-fixed-context { border:1px dashed var(--line); border-radius:11px; padding:10px 11px; margin-top:14px; display:grid; gap:2px; }
.sim-fixed-context span { color:var(--muted); font-size:.7rem; }
.sim-fixed-context strong { font-size:.83rem; }
.sim-control-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:18px; }
.sim-control-actions .btn { min-height:40px; padding:0 9px; font-size:.78rem; }
.sim-stage-panel { min-width:0; display:flex; flex-direction:column; }
.sim-stage-toolbar { height:45px; padding:0 16px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); color:var(--muted); font-size:.75rem; font-weight:850; }
.sim-stage-toolbar strong { color:var(--accent); }
.sim-stage { flex:1; min-height:330px; padding:22px; display:flex; gap:20px; align-items:center; justify-content:center; overflow:hidden; background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--accent-soft) 55%,transparent),transparent 55%); }
.sim-terminal { border-top:1px solid #273444; background:#0b1118; color:#dce7f1; }
.sim-terminal-head { display:flex; justify-content:space-between; padding:7px 12px; color:#86a4bf; font-size:.7rem; border-bottom:1px solid #26313e; }
.sim-terminal pre { margin:0; padding:13px 15px; max-height:210px; overflow:auto; white-space:pre-wrap; font:700 .76rem/1.55 ui-monospace,SFMono-Regular,Menlo,monospace; }
.sim-evidence-panel h4 { margin-top:0; }
.sim-evidence-panel h4:nth-of-type(2) { margin-top:20px; }
.sim-evidence-list { display:grid; gap:7px; }
.sim-evidence-list p { margin:0; display:grid; grid-template-columns:21px 1fr; gap:7px; font-size:.79rem; color:var(--text); padding:8px; border-radius:9px; background:var(--surface); border:1px solid var(--line); }
.sim-evidence-list p span { width:20px; height:20px; display:grid; place-items:center; border-radius:6px; font-weight:950; }
.sim-evidence-list.known p span { color:var(--ok); background:var(--ok-soft); }
.sim-evidence-list.unknown p span { color:var(--accent); background:var(--accent-soft); }
.sim-evidence-list p.empty { display:block; color:var(--muted); }
.sim-evidence-list p.all-known { background:var(--ok-soft); border-color:color-mix(in srgb,var(--ok) 28%,var(--line)); }
.sim-help-row { margin:0 24px; display:flex; justify-content:space-between; gap:20px; align-items:center; padding:15px 17px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.sim-help-row > div { display:grid; gap:1px; }
.sim-help-row span { color:var(--muted); font-size:.78rem; }
.sim-help-row .btn { min-height:40px; }
.sim-hint-box { margin:10px 24px 0; display:grid; gap:8px; }
.sim-hint-box p { margin:0; border-left:3px solid var(--accent); padding:11px 13px; background:var(--accent-soft); border-radius:0 10px 10px 0; color:var(--text); font-size:.86rem; }
.sim-hint-box p span { display:inline-grid; place-items:center; width:23px; height:23px; border-radius:7px; background:var(--accent); color:white; font-size:.7rem; font-weight:950; margin-right:8px; }
.sim-conclusion { margin:20px 24px 24px; padding:20px; border-radius:16px; border:1px solid var(--line); background:var(--surface); }
.sim-conclusion-options { display:grid; gap:8px; margin-top:13px; }
.sim-conclusion-options button { width:100%; }
.sim-final-feedback { margin-top:13px; padding:14px; border-radius:12px; border:1px solid var(--line); }
.sim-final-feedback p { margin:3px 0 0; color:inherit; }
.sim-final-feedback.ok { color:var(--ok); background:var(--ok-soft); border-color:color-mix(in srgb,var(--ok) 28%,var(--line)); }
.sim-final-feedback.bad { color:var(--bad); background:var(--bad-soft); border-color:color-mix(in srgb,var(--bad) 28%,var(--line)); }
.sim-final-feedback.warn { color:#72591a; background:#fff7d9; border-color:#ead99b; }
.kb-sim.task-ok .sim-stage-toolbar strong { color:var(--ok); }
.kb-sim.completed { outline:2px solid color-mix(in srgb,var(--ok) 32%,transparent); }

/* simulation visuals */
.sim-poster { width:min(330px,66%); aspect-ratio:4/5; border-radius:18px; padding:28px; color:white; background:linear-gradient(145deg,#111827,#202a3a 70%,color-mix(in srgb,var(--accent) 65%,#111)); box-shadow:0 24px 50px rgba(0,0,0,.18); display:flex; flex-direction:column; gap:var(--sim-space); justify-content:center; }
.sim-poster-kicker { font-size:.58rem; letter-spacing:.16em; opacity:.64; }
.sim-poster > strong { line-height:.88; letter-spacing:-.06em; }
.sim-poster-info { font-weight:800; opacity:.86; }
.sim-poster button { align-self:flex-start; border:0; border-radius:9px; padding:.45em .7em; background:white; color:#111827; font-weight:950; }
.sim-poster small { opacity:.58; }
.sim-thumbnail { width:120px; text-align:center; color:var(--muted); font-size:.68rem; }
.mini-poster { margin-top:7px; width:100%; aspect-ratio:4/5; border-radius:9px; background:#151c28; color:white; padding:12px 7px; display:flex; flex-direction:column; justify-content:center; gap:7px; overflow:hidden; }
.mini-poster b,.mini-poster i,.mini-poster em { display:block; font-style:normal; line-height:1; }
.mini-poster em { background:white; color:#111827; padding:3px; border-radius:3px; }
.sim-grid-canvas { width:min(530px,100%); aspect-ratio:16/10; border:1px solid var(--line); border-radius:15px; background:var(--surface); padding:var(--margin); position:relative; overflow:hidden; }
.sim-grid-lines { position:absolute; inset:0; padding:var(--margin); display:grid; grid-template-columns:repeat(var(--cols),1fr); gap:var(--gutter); pointer-events:none; }
.sim-grid-lines i { background:color-mix(in srgb,var(--accent) 9%,transparent); border-left:1px solid color-mix(in srgb,var(--accent) 22%,transparent); border-right:1px solid color-mix(in srgb,var(--accent) 22%,transparent); }
.sim-layout { position:absolute; inset:var(--margin); display:grid; grid-template-columns:repeat(var(--cols),1fr); grid-template-rows:1fr 1fr 1fr; gap:var(--gutter); }
.sim-layout > * { position:relative; z-index:1; }
.sim-layout .l-title { grid-column:1 / span 2; font-size:clamp(1rem,2vw,2rem); line-height:.9; align-self:end; }
.sim-layout .l-image { grid-column:2 / -1; grid-row:1 / span 2; background:linear-gradient(135deg,var(--accent),#111827); color:white; display:grid; place-items:center; border-radius:8px; font-size:.66rem; font-weight:900; }
.sim-layout .l-copy { grid-column:1 / span 2; margin:0; color:var(--text); align-self:start; font-size:.8rem; }
.sim-layout .l-cta { grid-column:1 / span 2; align-self:end; justify-self:start; background:var(--text); color:var(--surface); padding:7px 9px; border-radius:6px; font-size:.7rem; font-weight:900; }
.sim-layout.loose .l-title { transform:translateX(11px); }
.sim-layout.loose .l-copy { transform:translateX(-7px); }
.sim-layout.loose .l-cta { transform:translateX(18px); }
.sim-export-preview { width:min(620px,100%); display:grid; grid-template-columns:1.25fr .75fr; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--surface); }
.sim-photo { min-height:290px; display:flex; flex-direction:column; justify-content:flex-end; padding:26px; color:white; background:linear-gradient(135deg,rgba(17,24,39,.2),rgba(17,24,39,.85)),radial-gradient(circle at 75% 30%,var(--accent),#101827 55%); transition:filter .2s; }
.sim-photo.degraded { filter:contrast(.92) saturate(.84); }
.sim-photo span { font-size:.66rem; letter-spacing:.16em; }
.sim-photo strong { font-size:2.7rem; line-height:.85; letter-spacing:-.06em; }
.sim-export-metrics { padding:18px; display:grid; align-content:center; gap:8px; }
.sim-export-metrics div { display:flex; justify-content:space-between; gap:10px; border-bottom:1px solid var(--line); padding:8px 0; }
.sim-export-metrics span { color:var(--muted); font-size:.72rem; }
.sim-export-metrics b { font-size:.78rem; }
.sim-export-preview > small { grid-column:1/-1; padding:7px 12px; background:var(--surface-2); color:var(--muted); font-size:.66rem; }
.sim-dora { display:flex; align-items:stretch; gap:6px; width:min(650px,100%); }
.sim-dora > div { flex:1; min-width:0; border:1px solid var(--line); border-radius:12px; padding:13px 9px; font-weight:900; text-align:center; font-size:.75rem; }
.sim-dora > div span { display:block; margin-top:5px; color:var(--muted); font-weight:600; font-size:.65rem; }
.sim-dora .ok { border-color:color-mix(in srgb,var(--ok) 30%,var(--line)); background:var(--ok-soft); }
.sim-dora .fail { border-color:color-mix(in srgb,var(--bad) 30%,var(--line)); background:var(--bad-soft); }
.sim-dora .muted { opacity:.42; }
.sim-ipconfig { min-width:170px; background:#0b1118; color:#dfeaf3; border-radius:12px; padding:14px; font-size:.72rem; }
.sim-reach { display:flex; align-items:center; width:min(610px,100%); }
.sim-host { width:125px; min-height:105px; border:1px solid var(--line); border-radius:14px; display:grid; place-items:center; align-content:center; background:var(--surface); font-weight:950; }
.sim-host small { display:block; font-size:.58rem; color:var(--muted); margin-top:5px; }
.sim-wire { flex:1; height:7px; background:var(--ok); position:relative; }
.sim-wire::after { content:""; position:absolute; right:-2px; top:-5px; border-left:12px solid var(--ok); border-top:8px solid transparent; border-bottom:8px solid transparent; }
.sim-wire.blocked { background:repeating-linear-gradient(90deg,var(--bad),var(--bad) 9px,transparent 9px,transparent 15px); }
.sim-wire.blocked::after { border-left-color:var(--bad); }
.sim-wire span { position:absolute; top:-24px; width:100%; text-align:center; font-size:.65rem; font-weight:900; color:var(--muted); }
.sim-test-grid { width:min(610px,100%); display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.sim-stage > .sim-reach + .sim-test-grid { position:absolute; align-self:flex-end; margin-bottom:18px; }
.sim-test-grid > div { border:1px solid var(--line); border-radius:10px; padding:9px; display:grid; gap:4px; background:var(--surface); }
.sim-test-grid code { font-size:.62rem; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sim-test-grid b { font-size:.72rem; }
.sim-test-grid .ok { border-color:color-mix(in srgb,var(--ok) 28%,var(--line)); }
.sim-test-grid .ok b { color:var(--ok); }
.sim-test-grid .fail { border-color:color-mix(in srgb,var(--bad) 28%,var(--line)); }
.sim-test-grid .fail b { color:var(--bad); }
.sim-command-picker { display:grid; gap:7px; }
.sim-command-picker button { width:100%; border:1px solid var(--line); background:var(--surface); border-radius:10px; padding:9px 10px; display:flex; justify-content:space-between; align-items:center; gap:7px; cursor:pointer; text-align:left; }
.sim-command-picker button code { font-size:.66rem; word-break:break-all; }
.sim-command-picker button span { color:var(--accent); font-size:.66rem; font-weight:900; white-space:nowrap; }
.sim-command-picker button.ran { border-color:var(--ok); background:var(--ok-soft); }
.sim-validation { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); display:grid; gap:6px; }
.sim-validation strong { font-size:.75rem; }
.sim-validation label { font-size:.72rem; color:var(--muted); }
.sim-incident-card { max-width:570px; border:1px solid var(--line); border-radius:16px; background:var(--surface); padding:22px; box-shadow:var(--shadow); }
.sim-incident-card > span { color:var(--accent); font-size:.7rem; font-weight:900; letter-spacing:.1em; }
.sim-incident-card > strong { display:block; font-size:1.35rem; line-height:1.15; margin:8px 0; }
.sim-incident-card p { margin:0; }
.sim-command-count { display:inline-flex; margin-top:14px; padding:6px 9px; border-radius:8px; background:var(--surface-2); font-size:.7rem; color:var(--muted); }
.sim-binding-map { width:min(590px,100%); display:flex; align-items:center; justify-content:center; gap:8px; }
.sim-remote { min-width:115px; border:1px solid var(--line); border-radius:12px; padding:13px; text-align:center; font-weight:900; }
.sim-remote small { display:block; font-size:.58rem; margin-top:4px; }
.sim-remote.ok { background:var(--ok-soft); color:var(--ok); }
.sim-remote.fail { background:var(--bad-soft); color:var(--bad); }
.sim-bind-arrow { font-size:.72rem; font-weight:900; color:var(--muted); }
.sim-server-interfaces { min-width:215px; border:1px solid var(--line); border-radius:16px; background:var(--surface); padding:15px; }
.sim-server-interfaces > strong { display:block; margin-bottom:8px; }
.sim-server-interfaces div { display:flex; justify-content:space-between; padding:7px; border-radius:8px; color:var(--muted); }
.sim-server-interfaces div.active { background:var(--accent-soft); color:var(--accent); font-weight:900; }
.sim-server-interfaces > small { display:block; border-top:1px solid var(--line); margin-top:8px; padding-top:8px; color:var(--muted); }
.sim-handshake { display:grid; grid-template-columns:100px 1fr 100px; width:min(590px,100%); align-items:stretch; }
.sim-handshake > div:first-child,.sim-handshake > div:last-child { min-height:190px; border:1px solid var(--line); background:var(--surface); border-radius:14px; display:grid; place-items:center; align-content:center; }
.sim-handshake small { display:block; color:var(--muted); font-size:.56rem; margin-top:5px; }
.sim-packets { display:flex; flex-direction:column; justify-content:center; gap:17px; padding:0 8px; }
.sim-packets span { position:relative; font:800 .75rem ui-monospace,monospace; color:var(--accent); animation:packetPulse 1.5s ease both; animation-delay:calc(var(--delay) * .18s); }
.sim-result-pill { position:absolute; align-self:flex-end; margin-bottom:18px; border-radius:99px; padding:7px 12px; background:#fff4d7; color:#72591a; font-size:.7rem; font-weight:950; }
.sim-result-pill.ok { background:var(--ok-soft); color:var(--ok); }
@keyframes packetPulse { from{opacity:.15;transform:translateX(-8px)} to{opacity:1;transform:none} }
.sim-prod-map { display:flex; align-items:center; gap:8px; width:min(640px,100%); }
.sim-prod-map > div { flex:1; min-height:88px; display:grid; place-items:center; align-content:center; border:1px solid var(--line); background:var(--surface); border-radius:13px; font-weight:950; }
.sim-prod-map > div small { color:var(--bad); font-size:.62rem; }
.sim-prod-map > span { color:var(--muted); font-size:.6rem; font-weight:900; }
.sim-stage:has(.sim-prod-map) { flex-direction:column; }

@media (max-width:1050px) {
  .sim-workbench { grid-template-columns:240px 1fr; }
  .sim-evidence-panel { grid-column:1/-1; border-left:0; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:10px 18px; }
  .sim-evidence-panel .sim-panel-kicker { grid-column:1/-1; }
  .sim-evidence-panel h4 { margin:0; }
  .sim-evidence-panel h4:nth-of-type(2) { margin:0; }
  .kb-tour-tabs.has-simulation { grid-template-columns:repeat(5,1fr); }
}
@media (max-width:760px) {
  .kb-tour-tabs.has-simulation { grid-template-columns:1fr 1fr; }
  .sim-head,.sim-help-row { flex-direction:column; align-items:stretch; }
  .sim-score { width:120px; }
  .sim-learning-loop { grid-template-columns:1fr 1fr; }
  .sim-workbench { grid-template-columns:1fr; }
  .sim-controls-panel { border-right:0; border-bottom:1px solid var(--line); }
  .sim-evidence-panel { grid-template-columns:1fr; }
  .sim-evidence-panel .sim-panel-kicker { grid-column:auto; }
  .sim-stage { min-height:380px; flex-direction:column; }
  .sim-poster { width:min(300px,100%); }
  .sim-thumbnail { display:none; }
  .sim-export-preview { grid-template-columns:1fr; }
  .sim-export-preview > small { grid-column:auto; }
  .sim-dora { display:grid; grid-template-columns:1fr 1fr; }
  .sim-ipconfig { width:100%; }
  .sim-stage > .sim-reach + .sim-test-grid { position:static; margin:0; }
  .sim-test-grid { grid-template-columns:1fr; }
  .sim-binding-map { flex-direction:column; }
  .sim-bind-arrow { transform:rotate(90deg); }
  .sim-handshake { grid-template-columns:80px 1fr 80px; }
  .sim-prod-map { flex-direction:column; }
  .sim-prod-map > div { width:100%; }
  .sim-prod-map > span { transform:rotate(90deg); }
}

/* --------------------------------------------------------------------------
   Minimal learning UI v6 · more explanation, less visual noise
   -------------------------------------------------------------------------- */
:root { --radius: 18px; --shadow: 0 12px 36px rgba(20,31,44,.055); }
.panel,.action-card,.question-card,.kb-article,.kb-tour,.kb-topic-card { box-shadow:0 10px 30px rgba(17,24,39,.045); }
.kb-tour-header,.studio-section,.studio-preview-head { align-items:flex-start; }
.muted-note { color:var(--muted); font-size:.9rem; }
.finisher-challenge { border-style:dashed; border-color:color-mix(in srgb,var(--accent) 35%,var(--line)); }
.finisher-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:20px; }
.finisher-grid > div { background:var(--surface-2); border-radius:14px; padding:18px; }
.finisher-grid strong { display:block; margin-bottom:8px; }
.finisher-grid ul { margin:0; padding-left:20px; color:var(--muted); }

/* Extra graphics simulation types */
.sim-control.color input[type="color"] { width:100%; height:44px; border:1px solid var(--line); border-radius:10px; background:transparent; padding:3px; }
.sim-contrast-stage { width:min(430px,100%); min-height:330px; border-radius:20px; padding:34px; display:flex; flex-direction:column; justify-content:flex-end; gap:12px; transition:.2s ease; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
.sim-contrast-stage > span { font-size:.66rem; font-weight:900; letter-spacing:.14em; opacity:.72; }
.sim-contrast-stage > strong { line-height:.86; letter-spacing:-.06em; }
.sim-contrast-stage p { color:inherit; margin:0; }
.sim-contrast-stage button { align-self:flex-start; border:1px solid currentColor; background:transparent; padding:8px 12px; border-radius:999px; font-weight:900; }
.sim-contrast-meter,.sim-type-score { min-width:160px; border:1px solid var(--line); background:var(--surface); border-radius:14px; padding:16px; display:grid; gap:4px; }
.sim-contrast-meter span,.sim-type-score span { color:var(--muted); font-size:.72rem; }
.sim-contrast-meter strong,.sim-type-score strong { font-size:1.35rem; }
.sim-contrast-meter.ok strong { color:var(--ok); }
.sim-contrast-meter.warn strong { color:#a16207; }
.sim-type-stage { width:min(460px,100%); min-height:320px; border:1px solid var(--line); border-radius:20px; background:var(--surface); padding:36px; display:flex; flex-direction:column; justify-content:flex-end; gap:12px; }
.sim-type-stage .type-kicker { color:var(--accent); font-size:.68rem; font-weight:900; letter-spacing:.15em; }
.sim-type-stage > strong { line-height:.9; letter-spacing:-.055em; }
.sim-type-stage p { color:var(--text); margin:0; }
.sim-type-stage em { color:var(--muted); font-size:.72rem; font-style:normal; }
.sim-type-stage.noisy > strong { font-family:Georgia,serif; }
.sim-type-stage.noisy p { font-family:"Courier New",monospace; }
.sim-scale-stage { width:min(540px,100%); min-height:330px; display:grid; grid-template-columns:1fr 170px; gap:20px; align-items:center; }
.scale-logo { aspect-ratio:1; border-radius:24px; background:var(--text); color:white; display:grid; place-items:center; align-content:center; transform:scale(var(--zoom,1)); transform-origin:center; transition:transform .2s ease; overflow:hidden; }
.scale-logo span { font-size:4rem; line-height:.75; }
.scale-logo b { margin-top:10px; letter-spacing:.18em; }
.scale-logo.pixelated { image-rendering:pixelated; box-shadow:inset 0 0 0 10px rgba(255,255,255,.08); }
.scale-logo.pixelated span,.scale-logo.pixelated b { filter:contrast(1.8); text-shadow:6px 0 rgba(255,255,255,.12),0 6px rgba(255,255,255,.12); }
.scale-meta { display:grid; gap:7px; }
.scale-meta span { color:var(--accent); font-weight:900; }
.scale-meta strong { font-size:2rem; }
.scale-meta small { color:var(--muted); }
.sim-color-mode { width:min(560px,100%); display:grid; grid-template-columns:1fr 190px; gap:20px; align-items:center; }
.color-swatch { min-height:330px; border-radius:22px; padding:30px; display:flex; flex-direction:column; justify-content:flex-end; background:hsl(292 var(--sat) 53%); color:white; box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); }
.color-swatch span { font-size:.68rem; font-weight:900; letter-spacing:.12em; opacity:.8; }
.color-swatch strong { font-size:3.4rem; line-height:.86; letter-spacing:-.06em; }
.color-mode-meta { display:grid; grid-template-columns:1fr auto; gap:8px 12px; align-items:baseline; }
.color-mode-meta span { color:var(--muted); font-size:.72rem; }
.color-mode-meta b { font-size:1.1rem; }
.color-mode-meta small { grid-column:1/-1; color:var(--muted); }

/* Design Studio */
.studio-hero { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:28px; align-items:end; padding:10px 0 34px; }
.studio-hero h1 { font-size:clamp(2.2rem,5vw,4.8rem); margin-bottom:16px; }
.studio-hero p { max-width:780px; }
.studio-path { display:grid; gap:7px; min-width:190px; }
.studio-path span { border:1px solid var(--line); border-radius:999px; padding:7px 12px; background:var(--surface); color:var(--muted); font-size:.75rem; font-weight:800; }
.design-studio { display:grid; grid-template-columns:280px minmax(0,1fr) 280px; background:var(--surface); border:1px solid var(--line); border-radius:22px; overflow:hidden; box-shadow:var(--shadow); }
.studio-controls,.studio-export { padding:22px; display:grid; align-content:start; gap:14px; background:color-mix(in srgb,var(--surface) 96%,var(--bg)); }
.studio-controls { border-right:1px solid var(--line); }
.studio-export { border-left:1px solid var(--line); }
.studio-section { display:flex; gap:12px; }
.studio-section h2 { font-size:1rem; margin:0 0 4px; letter-spacing:-.02em; }
.studio-section p { margin:0; font-size:.78rem; }
.studio-step { width:30px;height:30px;border-radius:9px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-size:.68rem;font-weight:950;flex:0 0 auto; }
.studio-controls label,.studio-export label { display:grid; gap:6px; color:var(--muted); font-size:.75rem; font-weight:800; }
.studio-controls input[type="text"],.studio-controls input:not([type]),.studio-controls select,.studio-export select { border:1px solid var(--line); border-radius:10px; padding:9px 10px; background:var(--surface); color:var(--text); width:100%; }
.studio-controls input[type="range"],.studio-export input[type="range"] { width:100%; accent-color:var(--accent); }
.studio-color-row { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.studio-color-row label { text-align:center; font-size:.66rem; }
.studio-color-row input[type="color"] { width:100%; height:42px; border:1px solid var(--line); border-radius:10px; padding:3px; background:transparent; }
.studio-divider { height:1px; background:var(--line); margin:4px 0; }
.studio-toggle { display:flex!important; grid-template-columns:auto 1fr!important; align-items:center; gap:9px!important; color:var(--text)!important; }
.studio-toggle input { accent-color:var(--accent); }
.studio-preview-column { min-width:0; padding:24px; background:var(--bg); }
.studio-preview-head { display:flex; justify-content:space-between; gap:16px; margin-bottom:16px; }
.studio-preview-head span { color:var(--muted); display:block; font-size:.72rem; }
.studio-preview-head strong { font-size:.95rem; }
.studio-score { border:1px solid var(--line); background:var(--surface); border-radius:999px; padding:6px 11px; align-self:start; font-size:.7rem; font-weight:900; color:var(--accent); }
.studio-canvas-wrap { display:grid; place-items:center; min-height:570px; }
.studio-canvas { --ds-bg:#111218;--ds-text:#f7f7f4;--ds-accent:#a8ff3e;--ds-title:64px;--ds-info:24px;--ds-space:24px; width:min(520px,86%); aspect-ratio:1080/1350; border-radius:18px; background:var(--ds-bg); color:var(--ds-text); padding:9%; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; gap:var(--ds-space); box-shadow:0 30px 70px rgba(0,0,0,.2); transition:filter .2s ease,aspect-ratio .2s ease; }
.studio-canvas:before { content:""; position:absolute; width:60%; aspect-ratio:1; border-radius:50%; background:var(--ds-accent); top:-18%; right:-26%; opacity:.2; filter:blur(2px); }
.studio-canvas > *:not(.studio-grid-overlay) { position:relative; z-index:2; }
.studio-kicker { font-size:.62rem; letter-spacing:.16em; font-weight:900; opacity:.7; }
.studio-canvas h2 { color:inherit; font-size:var(--ds-title); line-height:.86; max-width:92%; margin:0; letter-spacing:-.06em; text-transform:uppercase; }
.studio-canvas p { color:inherit; font-size:var(--ds-info); margin:0; opacity:.88; }
.studio-canvas button { align-self:flex-start; background:var(--ds-accent); color:#111; border:0; border-radius:999px; padding:11px 15px; font-weight:950; }
.studio-canvas small { opacity:.48; font-size:.62rem; }
.studio-grid-overlay { --ds-cols:4; position:absolute!important; inset:0; z-index:1!important; pointer-events:none; display:grid; grid-template-columns:repeat(var(--ds-cols),1fr); gap:12px; padding:0 8%; }
.studio-grid-overlay:before { content:""; grid-column:1/-1; background:repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0,rgba(255,255,255,.08) calc((100% - (var(--ds-cols) - 1)*12px)/var(--ds-cols)),transparent calc((100% - (var(--ds-cols) - 1)*12px)/var(--ds-cols)),transparent calc((100% - (var(--ds-cols) - 1)*12px)/var(--ds-cols) + 12px)); }
.studio-thumbnail-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:18px; }
.studio-thumbnail-row > div { border:1px solid var(--line); border-radius:14px; background:var(--surface); padding:13px; }
.studio-thumbnail-row span { color:var(--muted); display:block; font-size:.68rem; margin-bottom:8px; }
.studio-thumb { min-height:105px; border-radius:9px; padding:12px; display:flex; flex-direction:column; justify-content:flex-end; gap:5px; }
.studio-thumb b { font-size:.9rem; line-height:.9; }
.studio-thumb i,.studio-thumb em { font-size:.52rem; font-style:normal; }
.studio-readability strong { font-size:1.5rem; display:block; }
.studio-readability small.pass { color:var(--ok); }.studio-readability small.fail { color:var(--bad); }
.studio-coach { margin-top:12px; border:1px solid var(--line); border-radius:14px; background:var(--surface); padding:15px; }
.studio-coach > strong { font-size:.8rem; }
.studio-coach ul { list-style:none; margin:10px 0 0; padding:0; display:grid; gap:6px; }
.studio-coach li { font-size:.75rem; color:var(--muted); }
.studio-coach li.ok { color:var(--ok); }
.studio-coach li.warn { color:#8a6112; }
.export-advice { border:1px solid var(--line); border-radius:12px; padding:13px; background:var(--surface); }
.export-advice span { color:var(--accent); font-size:.65rem; font-weight:950; letter-spacing:.1em; }
.export-advice p { font-size:.78rem; margin:6px 0; }
.export-advice small { color:var(--muted); }
.studio-actions { display:grid; gap:8px; }
.studio-actions .btn { min-height:42px; font-size:.78rem; }
.studio-explain { border-top:1px solid var(--line); padding-top:12px; }
.studio-explain summary { cursor:pointer; font-weight:850; font-size:.8rem; }
.studio-explain ol,.studio-explain p { font-size:.76rem; color:var(--muted); }
.studio-transfer { display:flex; justify-content:space-between; gap:24px; align-items:center; }
.studio-transfer h2 { margin-bottom:8px; }
.studio-transfer p { max-width:720px; margin:0; }

/* Knowledge Tour clarity layer */
.kb-hero h1 { max-width:900px; }
.kb-topic-grid { gap:12px!important; }
.kb-topic-card { padding:18px!important; }
.kb-tour { border:1px solid var(--line); border-radius:22px; background:var(--surface); overflow:hidden; }
.kb-tour-header { padding:26px 28px 20px; }
.kb-tour-tabs { position:sticky; top:0; z-index:10; background:color-mix(in srgb,var(--surface) 94%,transparent); backdrop-filter:blur(12px); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.kb-tab-panel { padding:28px!important; }
.kb-more-explanation summary { font-size:.95rem; }

@media (max-width:1050px) {
  .design-studio { grid-template-columns:240px 1fr; }
  .studio-export { grid-column:1/-1; border-left:0; border-top:1px solid var(--line); grid-template-columns:repeat(3,1fr); align-items:start; }
  .studio-export .studio-section,.studio-export .studio-actions,.studio-export .studio-explain { grid-column:1/-1; }
  .studio-hero { grid-template-columns:1fr; }
  .studio-path { display:flex; flex-wrap:wrap; min-width:0; }
}
@media (max-width:760px) {
  .finisher-grid,.studio-thumbnail-row { grid-template-columns:1fr; }
  .design-studio { grid-template-columns:1fr; }
  .studio-controls { border-right:0; border-bottom:1px solid var(--line); }
  .studio-export { grid-template-columns:1fr; }
  .studio-export > * { grid-column:auto!important; }
  .studio-preview-column { padding:16px; }
  .studio-canvas-wrap { min-height:440px; }
  .studio-canvas { width:min(390px,94%); }
  .studio-canvas h2 { font-size:clamp(38px,var(--ds-title),64px); }
  .studio-transfer { flex-direction:column; align-items:stretch; }
  .sim-scale-stage,.sim-color-mode { grid-template-columns:1fr; }
  .scale-logo { max-width:250px; justify-self:center; }
}

.guide-route { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin:0 0 28px; }
.guide-route article { border:1px solid var(--line); border-radius:15px; background:var(--surface); padding:16px; min-height:150px; }
.guide-route article span { color:var(--accent); font-size:.7rem; font-weight:950; letter-spacing:.1em; }
.guide-route article strong { display:block; margin:18px 0 5px; }
.guide-route article p { margin:0; font-size:.78rem; }
.graphics-map { grid-template-columns:repeat(3,minmax(0,1fr)); }
.kb-quick-strip { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); background:var(--surface-2); }
.kb-quick-strip > div { padding:15px 18px; border-right:1px solid var(--line); }
.kb-quick-strip > div:last-child { border-right:0; }
.kb-quick-strip span { display:block; color:var(--muted); font-size:.65rem; font-weight:900; text-transform:uppercase; letter-spacing:.08em; margin-bottom:5px; }
.kb-quick-strip strong { display:block; font-size:.78rem; line-height:1.35; }
@media (max-width:900px){ .guide-route{grid-template-columns:1fr 1fr}.graphics-map{grid-template-columns:1fr 1fr}.kb-quick-strip{grid-template-columns:1fr}.kb-quick-strip>div{border-right:0;border-bottom:1px solid var(--line)} }
@media (max-width:560px){ .guide-route,.graphics-map{grid-template-columns:1fr} }

/* Additional network knowledge simulations */
.sim-subnet-lab,.sim-route-map,.sim-ssh-auth,.sim-migrate { width:min(650px,100%); display:flex; align-items:center; justify-content:center; gap:12px; }
.subnet-host,.sim-route-map>div,.sim-ssh-auth>div,.sim-migrate>div { border:1px solid var(--line); background:var(--surface); border-radius:14px; padding:16px; text-align:center; min-width:145px; }
.subnet-host b,.sim-route-map b,.sim-ssh-auth strong,.sim-migrate strong { display:block; margin-bottom:5px; }
.subnet-host code,.sim-route-map code { color:var(--muted); font-size:.72rem; }
.subnet-path { display:grid; gap:4px; min-width:180px; text-align:center; color:var(--muted); }
.subnet-path strong { color:var(--accent); font-size:1.05rem; letter-spacing:.08em; }
.subnet-path.gateway strong { color:#a16207; }
.sim-dns-cache { display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:center; width:min(620px,100%); }
.sim-dns-cache>div:not(.cache-arrow) { border:1px solid var(--line); background:var(--surface); border-radius:15px; padding:20px; display:grid; gap:6px; }
.sim-dns-cache span { color:var(--muted); font-size:.68rem; font-weight:900; letter-spacing:.08em; }
.sim-dns-cache code { color:var(--accent); }
.sim-dns-cache .expired { border-color:color-mix(in srgb,var(--ok) 35%,var(--line)); background:var(--ok-soft); }
.cache-arrow,.migrate-arrow { color:var(--muted); font-weight:900; }
.sim-https-layers { display:grid; grid-template-columns:repeat(4,1fr); width:min(680px,100%); gap:8px; }
.sim-https-layers>div { border:1px solid var(--line); border-radius:14px; background:var(--surface); min-height:105px; display:grid; place-items:center; align-content:center; gap:6px; }
.sim-https-layers .ok { background:var(--ok-soft); color:var(--ok); border-color:color-mix(in srgb,var(--ok) 30%,var(--line)); }
.sim-https-layers .fail { background:var(--bad-soft); color:var(--bad); border-color:color-mix(in srgb,var(--bad) 30%,var(--line)); }
.sim-browser-result { border:1px solid var(--line); border-radius:999px; padding:8px 14px; background:var(--surface); display:flex; gap:8px; align-items:center; }
.sim-browser-result span { color:var(--muted); font-size:.68rem; }
.sim-route-map>span,.sim-ssh-auth>span { color:var(--muted); font-weight:900; }
.sim-route-map .ok { background:var(--ok-soft); border-color:color-mix(in srgb,var(--ok) 30%,var(--line)); }
.sim-route-map .fail { background:var(--bad-soft); border-color:color-mix(in srgb,var(--bad) 30%,var(--line)); }
.sim-cidr-plan { width:min(610px,100%); display:grid; gap:18px; }
.cidr-bar { height:54px; border:1px solid var(--line); border-radius:12px; background:var(--surface); overflow:hidden; position:relative; }
.cidr-bar span { display:block; width:var(--fill); height:100%; background:var(--accent-soft); border-right:2px solid var(--accent); }
.cidr-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.cidr-stats div { border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:12px; }
.cidr-stats span { display:block; color:var(--muted); font-size:.62rem; }
.cidr-stats b { font-size:.9rem; }
.sim-lpm { width:min(610px,100%); display:grid; gap:8px; }
.lpm-dest { border:1px solid var(--line); background:var(--text); color:white; border-radius:13px; padding:14px; display:flex; justify-content:space-between; }
.lpm-dest span { opacity:.68; font-size:.68rem; }
.lpm-route { border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:11px 13px; display:flex; justify-content:space-between; }
.lpm-route span { color:var(--muted); font-size:.68rem; }
.lpm-route.best { border-style:dashed; }
.lpm-route.selected { border-color:var(--accent); background:var(--accent-soft); }
.sim-migrate>div { min-width:135px; }
.sim-migrate span { display:block; color:var(--muted); font-size:.66rem; font-weight:900; }
.sim-migrate small { display:block; color:var(--muted); margin-top:5px; }
.sim-ssh-auth>div span { display:block; color:var(--muted); font-size:.62rem; }
.sim-terminal-inline { border:1px solid var(--line); border-radius:12px; padding:12px 15px; background:#0e1621; color:#d7e4ee; }
.sim-terminal-inline.ok { color:#9af1c9; }
.sim-terminal-inline.fail { color:#ffb4af; }
.sim-perm-table { width:min(520px,100%); display:grid; gap:8px; }
.sim-perm-table>div { border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:12px 14px; display:flex; justify-content:space-between; }
.sim-perm-table span { color:var(--muted); }
.sim-perm-table>strong { margin-top:8px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; color:var(--accent); }
@media(max-width:760px){.sim-subnet-lab,.sim-route-map,.sim-ssh-auth,.sim-migrate{flex-direction:column}.subnet-path{min-width:0}.sim-dns-cache{grid-template-columns:1fr}.cache-arrow,.migrate-arrow{transform:rotate(90deg)}.sim-https-layers{grid-template-columns:1fr 1fr}.cidr-stats{grid-template-columns:1fr 1fr}.sim-route-map>span,.sim-ssh-auth>span{transform:rotate(90deg)}}

/* Canva transfer guide --------------------------------------------------- */
.canva-handoff{margin:30px 0;border:1px solid var(--line);border-radius:24px;background:var(--surface);overflow:hidden}
.handoff-head{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:24px;align-items:end;padding:28px 30px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 88%,var(--accent) 12%),var(--surface))}
.handoff-head h2{margin:5px 0 8px;font-size:clamp(1.45rem,2vw,2rem)}
.handoff-head p{max-width:820px;margin:0;color:var(--muted)}
.handoff-progress{border:1px solid var(--line);border-radius:16px;padding:14px;background:var(--surface)}
.handoff-progress strong{font-size:1.35rem;display:block}.handoff-progress span{font-size:.68rem;color:var(--muted)}
.handoff-progress>div{height:6px;border-radius:99px;background:var(--surface-2);overflow:hidden;margin-top:10px}.handoff-progress i{display:block;width:0;height:100%;background:var(--accent);transition:width .25s ease}
.handoff-layout{display:grid;grid-template-columns:190px minmax(0,1fr)}
.handoff-nav{padding:12px;border-right:1px solid var(--line);background:var(--surface-2);display:flex;flex-direction:column;gap:6px}
.handoff-nav button{text-align:left;border:0;background:transparent;color:var(--text);border-radius:12px;padding:11px 12px;display:grid;grid-template-columns:28px 1fr;column-gap:8px;cursor:pointer;transition:background .15s ease,transform .15s ease}
.handoff-nav button:hover{background:var(--surface)}.handoff-nav button.active{background:var(--surface);box-shadow:0 0 0 1px var(--line) inset}
.handoff-nav button.done span{background:var(--ok);color:#fff}.handoff-nav button span{grid-row:1/3;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent);font-size:.62rem;font-weight:950}
.handoff-nav button b{font-size:.78rem;line-height:1.05}.handoff-nav button small{font-size:.62rem;color:var(--muted);margin-top:3px}
.handoff-content{min-width:0}.handoff-panel{display:none;padding:28px 30px}.handoff-panel.active{display:block;animation:handoffIn .18s ease}@keyframes handoffIn{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}
.handoff-panel-title{display:grid;grid-template-columns:46px 1fr;gap:13px;align-items:start;margin-bottom:22px}.handoff-panel-title>span{width:42px;height:42px;border-radius:14px;background:var(--text);color:var(--surface);display:grid;place-items:center;font-size:.72rem;font-weight:950}.handoff-panel-title h3{margin:1px 0 4px}.handoff-panel-title p{margin:0;color:var(--muted);max-width:760px}
.handoff-spec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}.handoff-spec-grid>div,.compare-metrics>div{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--surface-2)}.handoff-spec-grid span,.compare-metrics span{display:block;color:var(--muted);font-size:.64rem;text-transform:uppercase;font-weight:900;letter-spacing:.08em}.handoff-spec-grid strong,.compare-metrics strong{display:block;font-size:1.05rem;margin:5px 0}.handoff-spec-grid small,.compare-metrics small{color:var(--muted);font-size:.7rem;line-height:1.35}
.handoff-demo,.handoff-grid-demo,.type-transfer,.palette-transfer,.export-transfer{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(300px,1.2fr);gap:22px;align-items:center;border:1px solid var(--line);border-radius:18px;padding:20px;background:var(--bg)}
.size-sheet{margin:auto;position:relative;width:min(230px,80%);aspect-ratio:4/5;border-radius:9px;background:#fff;color:#111;box-shadow:0 18px 45px rgba(0,0,0,.12);display:grid;place-items:center;overflow:hidden}.size-sheet i{position:absolute;inset:8%;border:1px dashed #7b7f8b}.size-sheet b{font-size:.65rem;letter-spacing:.12em;opacity:.5}.size-sheet span{position:absolute;bottom:10px;font-size:.62rem;font-weight:850;opacity:.55}
.handoff-instructions ol{padding-left:20px;margin:0 0 15px;display:grid;gap:8px}.handoff-instructions li,.handoff-instructions p,.handoff-instructions details{font-size:.78rem;color:var(--muted);line-height:1.45}.handoff-instructions li strong{color:var(--text)}
.mini-action{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:10px;padding:9px 12px;font-size:.72rem;font-weight:850;cursor:pointer}.mini-action:hover{border-color:var(--accent);color:var(--accent)}
.handoff-done{margin-top:18px;border-top:1px solid var(--line);padding-top:15px;display:flex;align-items:flex-start;gap:10px;font-size:.77rem;font-weight:800}.handoff-done input{accent-color:var(--accent);margin-top:2px}
.handoff-grid-sheet{--cols:4;min-height:320px;border-radius:14px;background:#f5f4ef;padding:8%;display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:10px;position:relative;overflow:hidden}.handoff-grid-sheet:before{content:"";grid-column:1/-1;background:repeating-linear-gradient(90deg,rgba(88,94,111,.15) 0,rgba(88,94,111,.15) calc((100% - (var(--cols) - 1)*10px)/var(--cols)),transparent calc((100% - (var(--cols) - 1)*10px)/var(--cols)),transparent calc((100% - (var(--cols) - 1)*10px)/var(--cols) + 10px))}.handoff-grid-sheet:after{content:"HEADLINE\A\A INFO\A\A CTA";white-space:pre;position:absolute;left:12%;bottom:12%;font-weight:950;font-size:1.1rem;line-height:1.1;color:#17181e}
.spec-line{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.76rem}.spec-line span{color:var(--muted)}
.type-preview{min-height:330px;border-radius:14px;padding:32px;background:#111218;color:#f7f7f4;display:flex;flex-direction:column;justify-content:flex-end;gap:16px}.type-preview>span{font-size:.58rem;letter-spacing:.14em;opacity:.55}.type-preview>strong{font-size:clamp(2rem,4vw,4.3rem);line-height:.88;letter-spacing:-.05em}.type-preview p{margin:0;opacity:.82}.type-preview em{font-style:normal;align-self:flex-start;padding:9px 12px;border-radius:999px;background:#a8ff3e;color:#111;font-weight:900;font-size:.72rem}
.hierarchy-bars{display:grid;gap:12px;margin-bottom:18px}.hierarchy-bars>div{display:grid;grid-template-columns:75px 1fr 45px;gap:8px;align-items:center}.hierarchy-bars span,.hierarchy-bars b{font-size:.68rem}.hierarchy-bars b{text-align:right}.hierarchy-bars i{height:8px;border-radius:99px;background:var(--accent);display:block}
.explain-list{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:7px}.explain-list li{font-size:.76rem;color:var(--muted)}.explain-list strong{color:var(--text)}
.handoff-callout{border-left:3px solid var(--accent);padding:10px 12px;background:color-mix(in srgb,var(--accent) 8%,transparent);font-size:.76rem;border-radius:0 10px 10px 0}
.palette-swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.palette-swatches button{border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:14px;padding:8px;text-align:left;cursor:pointer}.palette-swatches i{display:block;height:120px;border-radius:10px;margin-bottom:9px}.palette-swatches span{display:block;color:var(--muted);font-size:.62rem}.palette-swatches b{font-size:.7rem}.contrast-lab{display:grid;gap:13px}.contrast-lab>div:first-child{display:flex;align-items:baseline;gap:10px}.contrast-lab>div:first-child span{color:var(--muted);font-size:.72rem}.contrast-lab>div:first-child strong{font-size:1.7rem}.contrast-lab>div:first-child small{font-size:.68rem}.contrast-sample{min-height:120px;border-radius:14px;padding:20px;display:flex;flex-direction:column;justify-content:flex-end}.contrast-sample b{font-size:2.3rem;line-height:1}.contrast-sample span{font-size:.72rem}
.export-ticket{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:20px;display:grid;gap:4px}.export-ticket>span{font-size:.6rem;color:var(--muted);letter-spacing:.1em;font-weight:900}.export-ticket>strong{font-size:1.2rem}.export-ticket hr{border:0;border-top:1px dashed var(--line);width:100%;margin:10px 0}.export-ticket small{margin-top:10px;color:var(--muted)}
.qa-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.qa-grid label{border:1px solid var(--line);border-radius:12px;padding:11px;background:var(--surface-2);display:flex;gap:9px;align-items:flex-start;cursor:pointer}.qa-grid label:has(input:checked){border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:var(--ok-soft)}.qa-grid input{accent-color:var(--ok);margin-top:2px}.qa-grid span{font-size:.72rem;color:var(--muted)}.qa-grid b{display:block;color:var(--text);font-size:.74rem;margin-bottom:2px}.qa-summary{display:flex;gap:14px;align-items:baseline;margin-top:14px;border-radius:12px;padding:12px 14px;background:var(--surface-2)}.qa-summary strong{font-size:1.1rem}.qa-summary span{font-size:.72rem;color:var(--muted)}
.compare-upload{display:grid;grid-template-columns:minmax(260px,.7fr) 1fr;gap:12px;margin-bottom:18px}.compare-drop{border:1px dashed var(--line);border-radius:15px;padding:18px;display:grid;place-items:center;text-align:center;cursor:pointer;background:var(--surface-2)}.compare-drop:hover{border-color:var(--accent)}.compare-drop input{display:none}.compare-drop>span{font-size:1.6rem;color:var(--accent)}.compare-drop strong{font-size:.8rem}.compare-drop small{color:var(--muted);font-size:.66rem}.compare-file-meta{border:1px solid var(--line);border-radius:15px;padding:16px;display:flex;align-items:center;color:var(--muted);font-size:.76rem}
.compare-stage{display:grid;grid-template-columns:1fr 1fr;gap:14px}.compare-card{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface-2)}.compare-card header{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--line);font-size:.68rem}.compare-card header small{color:var(--muted)}.compare-planned,.compare-image-wrap{aspect-ratio:4/5;min-height:280px}.compare-planned{padding:10%;display:flex;flex-direction:column;justify-content:flex-end;gap:16px;background:#111218;color:#f7f7f4}.compare-planned b{font-size:clamp(1.7rem,4vw,3.5rem);line-height:.9;letter-spacing:-.05em}.compare-planned p{margin:0}.compare-planned em{font-style:normal;align-self:flex-start;background:#a8ff3e;color:#111;border-radius:999px;padding:9px 11px;font-weight:900;font-size:.7rem}.compare-image-wrap{background:var(--surface);display:grid;place-items:center}.compare-image-wrap img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}
.compare-results{margin-top:16px}.compare-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.compare-reflection{margin-top:15px;border:1px solid var(--line);border-radius:14px;padding:15px}.compare-reflection h4{margin:0 0 12px}.compare-reflection label{display:grid;gap:5px;margin-top:9px;font-size:.72rem}.compare-reflection textarea{width:100%;resize:vertical;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--text);padding:10px;font:inherit}
@media(max-width:900px){.handoff-head{grid-template-columns:1fr}.handoff-progress{max-width:260px}.handoff-layout{grid-template-columns:1fr}.handoff-nav{border-right:0;border-bottom:1px solid var(--line);flex-direction:row;overflow:auto}.handoff-nav button{min-width:145px}.handoff-spec-grid,.compare-metrics{grid-template-columns:1fr 1fr}.handoff-demo,.handoff-grid-demo,.type-transfer,.palette-transfer,.export-transfer{grid-template-columns:1fr}.compare-stage{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.handoff-head,.handoff-panel{padding:20px 16px}.handoff-spec-grid,.qa-grid,.compare-stage,.compare-metrics,.compare-upload{grid-template-columns:1fr}.palette-swatches i{height:80px}.handoff-nav{padding:8px}.handoff-nav button{min-width:130px;padding:9px}.compare-planned,.compare-image-wrap{min-height:220px}}

/* Sequential learning journey / gamification ------------------------------ */
.topbar-right{display:flex;align-items:center;gap:14px}.learning-hud{display:flex;align-items:center;gap:9px}.hud-level{width:46px;height:46px;border:1px solid var(--line);border-radius:14px;background:var(--surface);display:grid;place-items:center;line-height:1}.hud-level span{font-size:.5rem;color:var(--muted);font-weight:900;letter-spacing:.08em}.hud-level strong{font-size:1rem}.hud-xp{width:150px}.hud-xp>div{display:flex;align-items:center;justify-content:space-between;gap:8px}.hud-xp strong{font-size:.72rem}.hud-xp strong b{font-size:.92rem}.hud-xp span{font-size:.58rem;color:var(--muted)}.hud-xp>i{display:block;height:5px;border-radius:99px;background:var(--surface-2);overflow:hidden;margin-top:5px}.hud-xp>i>em{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .28s ease}.hud-badges{position:relative}.hud-badges>summary{list-style:none;cursor:pointer;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:8px 10px;display:flex;align-items:center;gap:7px;font-size:.65rem;font-weight:850}.hud-badges>summary::-webkit-details-marker{display:none}.hud-badges>summary strong{min-width:20px;height:20px;border-radius:99px;background:var(--text);color:var(--surface);display:grid;place-items:center;font-size:.6rem}.badge-popover{position:absolute;right:0;top:calc(100% + 9px);z-index:80;width:310px;max-height:390px;overflow:auto;border:1px solid var(--line);background:var(--surface);border-radius:16px;box-shadow:var(--shadow);padding:10px}.mini-badge{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;padding:9px;border-radius:11px}.mini-badge:hover{background:var(--surface-2)}.mini-badge i{width:36px;height:36px;border-radius:11px;background:var(--text);color:var(--surface);font-style:normal;display:grid;place-items:center;font-size:.68rem;font-weight:950}.mini-badge strong{display:block;font-size:.72rem}.mini-badge span{display:block;color:var(--muted);font-size:.62rem;margin-top:2px}.badge-empty{font-size:.7rem;margin:6px;color:var(--muted)}
.learning-toasts{position:fixed;right:18px;top:92px;z-index:999;display:grid;gap:8px;pointer-events:none}.learning-toast{width:min(330px,calc(100vw - 36px));display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;border:1px solid var(--line);background:var(--surface);box-shadow:0 18px 50px rgba(17,24,39,.16);border-radius:15px;padding:11px 13px;opacity:0;transform:translateY(-8px) scale(.98);transition:.22s ease}.learning-toast.show{opacity:1;transform:none}.learning-toast i{width:36px;height:36px;border-radius:11px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-style:normal;font-weight:950}.learning-toast strong{display:block;font-size:.78rem}.learning-toast span{display:block;font-size:.66rem;color:var(--muted);margin-top:2px}.learning-toast.badge i{background:var(--text);color:var(--surface)}.learning-toast.error i{background:var(--bad-soft);color:var(--bad)}

.kb-tour-tabs button{display:flex;align-items:center;gap:8px}.kb-tour-tabs button>span{width:22px;height:22px;border-radius:7px;background:var(--surface-2);display:grid;place-items:center;font-size:.58rem;font-weight:950}.kb-tour-tabs button.done>span{background:var(--ok);color:#fff}.kb-tour-tabs button:disabled,.kb-tour-tabs button.locked{opacity:.42;cursor:not-allowed;filter:saturate(.5)}.kb-tour-tabs button:disabled:hover{transform:none}.lesson-gate-note{display:flex;align-items:flex-start;gap:9px;margin:10px 0 18px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}.lesson-gate-note>span{color:var(--accent);font-weight:950}.lesson-gate-note p{margin:0;font-size:.7rem;color:var(--muted)}.step-commit{margin-top:18px;border-top:1px solid var(--line);padding-top:16px;display:flex;align-items:center;justify-content:space-between;gap:16px}.step-commit strong{display:block;font-size:.82rem}.step-commit span{display:block;color:var(--muted);font-size:.68rem;margin-top:3px}.kb-complete-card .lesson-xp-pill{border-radius:999px;background:var(--accent-soft);color:var(--accent);padding:7px 10px;font-size:.62rem;font-weight:900;white-space:nowrap}.kb-topic-card.locked{opacity:.52;filter:saturate(.45);cursor:not-allowed}.kb-topic-card.locked:hover{transform:none;box-shadow:none}.lock-badge{background:var(--surface-2)!important;color:var(--muted)!important}.kb-step-dot:disabled{opacity:.28;cursor:not-allowed}.kb-step-dot:disabled:hover{transform:none}.btn.disabled,.btn[aria-disabled="true"]{opacity:.42;pointer-events:none;filter:saturate(.4)}

.design-studio [data-studio-stage],.canva-handoff{position:relative;transition:opacity .2s ease,filter .2s ease}.design-studio [data-studio-stage].is-locked,.canva-handoff.is-locked{opacity:.46;filter:saturate(.5)}.design-studio [data-studio-stage].is-locked:after,.canva-handoff.is-locked:after{content:"Dokonči předchozí krok";position:absolute;inset:12px;z-index:12;border:1px dashed var(--line);border-radius:16px;background:color-mix(in srgb,var(--surface) 92%,transparent);display:grid;place-items:center;text-align:center;font-weight:900;color:var(--muted);backdrop-filter:blur(3px)}.studio-stage-commit{margin-top:18px;border:1px solid var(--line);border-radius:14px;padding:13px;background:var(--surface-2)}.studio-stage-commit strong{display:block;font-size:.78rem}.studio-stage-commit span{display:block;color:var(--muted);font-size:.66rem;margin:3px 0 10px}.studio-stage-commit .btn{width:100%;min-height:42px;font-size:.72rem}.handoff-nav button:disabled,.handoff-nav button.locked{opacity:.4;cursor:not-allowed}.handoff-nav button:disabled:hover{background:transparent}.handoff-done input:disabled+span{opacity:.75}.handoff-done:has(input:checked) span{color:var(--ok)}

@media(max-width:960px){.topbar{align-items:flex-start;padding:14px 0}.topbar-right{flex-direction:column;align-items:flex-end}.learning-hud{flex-wrap:wrap;justify-content:flex-end}.class-chip{font-size:.78rem}.badge-popover{right:0}}
@media(max-width:680px){.topbar{gap:10px}.brand>span:last-child{display:none}.topbar-right{gap:7px}.class-chip{display:none}.hud-xp{width:115px}.hud-badges>summary span{display:none}.badge-popover{position:fixed;left:16px;right:16px;top:82px;width:auto}.step-commit{align-items:stretch;flex-direction:column}.learning-toasts{top:74px;right:10px}.kb-tour-tabs{overflow:auto;flex-wrap:nowrap}.kb-tour-tabs button{white-space:nowrap;min-width:max-content}}

.journey-overview{margin:8px 0 28px;border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:20px;box-shadow:var(--shadow)}.journey-overview-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:14px}.journey-overview-head h2{margin:0;font-size:1.35rem}.journey-overview-head p{margin:0;max-width:480px;font-size:.75rem}.journey-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.journey-step{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--surface-2)}.journey-step i{width:34px;height:34px;border-radius:10px;background:var(--surface);border:1px solid var(--line);display:grid;place-items:center;font-style:normal;font-size:.66rem;font-weight:950}.journey-step strong{display:block;font-size:.76rem}.journey-step span{display:block;color:var(--muted);font-size:.62rem;margin-top:2px;line-height:1.25}.journey-step.done{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 40%,var(--line))}.journey-step.done i{background:var(--ok);color:#fff;border-color:var(--ok)}.journey-step.current{border-color:var(--accent);background:var(--accent-soft)}.journey-step.current i{background:var(--accent);color:#fff;border-color:var(--accent)}.journey-step.locked{opacity:.48;filter:saturate(.3)}
@media(max-width:820px){.journey-steps{grid-template-columns:1fr 1fr}.journey-overview-head{align-items:flex-start;flex-direction:column}}
@media(max-width:520px){.journey-steps{grid-template-columns:1fr}}

/* Navazující dvouhodinový blok ----------------------------------------- */
.journey-steps{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.next-block-card{margin:26px 0;border:1px solid var(--line);border-radius:22px;background:var(--surface);padding:22px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:26px;align-items:center;box-shadow:var(--shadow)}
.next-block-card.locked{opacity:.68}.next-block-card.unlocked{border-color:color-mix(in srgb,var(--accent) 36%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--surface) 94%,var(--accent) 6%),var(--surface))}
.next-block-main h2{margin:4px 0 7px;font-size:1.35rem}.next-block-main p{margin:0;color:var(--muted);max-width:850px}.next-block-meta{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 10px}.next-block-meta span{font-size:.67rem;font-weight:850;padding:7px 9px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2)}
.next-block-progress,.next-lesson-progress{height:7px;border-radius:99px;background:var(--surface-2);overflow:hidden}.next-block-progress i,.next-lesson-progress i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .25s ease}.next-block-action{min-width:220px;display:grid;gap:8px}.next-block-action small{max-width:230px;color:var(--muted);font-size:.68rem}
.next-lesson-hero .next-lesson-hud{display:grid;grid-template-columns:repeat(3,minmax(115px,1fr)) auto;gap:8px;margin:18px 0 14px}.next-lesson-hud>div{border:1px solid var(--line);background:var(--surface);border-radius:13px;padding:11px 13px}.next-lesson-hud span{display:block;color:var(--muted);font-size:.62rem;text-transform:uppercase;letter-spacing:.07em;font-weight:900}.next-lesson-hud strong{font-size:.92rem}.next-lesson-hud .btn{align-self:stretch;display:flex;align-items:center;justify-content:center}
.next-topology pre{margin:0;background:#0e1621;color:#d9e7f1;border-radius:16px;padding:18px;overflow:auto;font:700 .78rem/1.7 ui-monospace,SFMono-Regular,Menlo,monospace}.next-lesson-schedule{margin:28px 0}
.next-learning-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}.next-step-list{display:grid;gap:13px}.next-step{border:1px solid var(--line);border-radius:20px;background:var(--surface);overflow:hidden}.next-step.current{border-color:var(--accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 30%,transparent),var(--shadow)}.next-step.done{border-color:color-mix(in srgb,var(--ok) 35%,var(--line))}.next-step.locked{opacity:.58;background:var(--surface-2)}
.next-step-head{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:start;padding:18px 20px}.next-step-number{width:40px;height:40px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;font-size:.72rem;font-weight:950}.next-step.current .next-step-number{background:var(--accent);color:#fff;border-color:var(--accent)}.next-step.done .next-step-number{background:var(--ok);color:#fff;border-color:var(--ok)}.next-step-head span{color:var(--muted);font-size:.66rem;font-weight:850}.next-step-head h2{margin:2px 0 4px;font-size:1.12rem}.next-step-head p{margin:0;color:var(--muted);font-size:.77rem;line-height:1.45}.next-step-state{font-size:.62rem;font-weight:950;text-transform:uppercase;letter-spacing:.08em;padding:6px 8px;border-radius:999px;background:var(--surface-2);color:var(--muted)}.next-step.current .next-step-state{background:var(--accent-soft);color:var(--accent)}.next-step.done .next-step-state{background:var(--ok-soft);color:var(--ok)}
.next-step-body{border-top:1px solid var(--line);padding:18px 20px;display:grid;gap:16px}.next-step-lock{border-top:1px solid var(--line);padding:14px 20px;color:var(--muted);display:flex;gap:8px;flex-direction:column;font-size:.74rem}.next-demo{border:1px solid var(--line);border-radius:15px;background:var(--bg);overflow:hidden}.next-demo>span{display:block;padding:9px 13px;border-bottom:1px solid var(--line);font-size:.65rem;font-weight:900;color:var(--muted)}.next-demo pre{margin:0;padding:15px;background:#0e1621;color:#d9e7f1;overflow:auto;font:700 .76rem/1.65 ui-monospace,SFMono-Regular,Menlo,monospace}
.next-kb-inline{border:1px solid var(--line);border-radius:15px;padding:14px;background:color-mix(in srgb,var(--accent) 5%,var(--surface))}.next-kb-inline>div:first-child span{display:block;color:var(--muted);font-size:.62rem;text-transform:uppercase;font-weight:900}.next-kb-inline>div:first-child strong{font-size:.82rem}.next-kb-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.next-kb-chips a{display:flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:7px 9px;text-decoration:none;color:var(--text);font-size:.69rem;font-weight:800}.next-kb-chips a.done{border-color:color-mix(in srgb,var(--ok) 35%,var(--line));background:var(--ok-soft)}.next-kb-chips i{font-style:normal;color:var(--accent)}.next-kb-chips a.done i{color:var(--ok)}
.next-task-checks{display:grid;gap:7px}.next-task-checks .eyebrow{margin-bottom:2px}.next-task-checks label{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--surface-2);font-size:.76rem;line-height:1.35;cursor:pointer}.next-task-checks input{margin-top:2px;accent-color:var(--accent)}.next-task-checks label:has(input:checked){background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 30%,var(--line))}
.next-quiz h3{margin:0 0 9px;font-size:1rem}.next-quiz-options{display:grid;gap:7px}.next-quiz-options button{display:grid;grid-template-columns:30px 1fr;gap:9px;align-items:center;text-align:left;border:1px solid var(--line);background:var(--surface-2);color:var(--text);border-radius:12px;padding:10px 12px;cursor:pointer}.next-quiz-options button:hover,.next-quiz-options button.selected{border-color:var(--accent);background:var(--accent-soft)}.next-quiz-options button i{font-style:normal;width:26px;height:26px;border-radius:8px;background:var(--surface);display:grid;place-items:center;font-size:.65rem;font-weight:950}.next-quiz-feedback{margin-top:9px;border-radius:11px;padding:10px 12px;background:var(--bad-soft);font-size:.74rem}.next-quiz-feedback.ok{background:var(--ok-soft)}
.next-step-complete{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px dashed var(--line);padding-top:14px}.next-step-complete strong{display:block;font-size:.77rem}.next-step-complete span{display:block;color:var(--muted);font-size:.65rem;margin-top:3px}
.next-kb-dock{position:sticky;top:86px;border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:18px;box-shadow:var(--shadow)}.next-kb-dock h3{margin:4px 0}.next-kb-dock>p{font-size:.72rem;color:var(--muted);line-height:1.45}.next-kb-dock-list{display:grid;gap:7px;margin:14px 0}.next-kb-dock-list a{display:grid;grid-template-columns:26px 1fr 16px;gap:8px;align-items:start;border:1px solid var(--line);border-radius:12px;padding:10px;text-decoration:none;color:var(--text);background:var(--surface-2)}.next-kb-dock-list a.done{background:var(--ok-soft)}.next-kb-dock-list i{font-style:normal;color:var(--accent);font-weight:950}.next-kb-dock-list a.done i{color:var(--ok)}.next-kb-dock-list strong{display:block;font-size:.72rem}.next-kb-dock-list span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--muted);font-size:.61rem;line-height:1.3;margin-top:2px}.btn.full{width:100%;justify-content:center}.next-complete-panel{margin-top:24px}.kb-mode-switch{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 0}.kb-mode-switch a{padding:8px 11px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--muted);font-size:.7rem;font-weight:850;background:var(--surface)}.kb-mode-switch a.active{background:var(--text);color:var(--surface);border-color:var(--text)}.kb-mode-switch .back-to-task{margin-left:auto;color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
@media(max-width:920px){.next-learning-layout{grid-template-columns:1fr}.next-kb-dock{position:static}.next-lesson-hud{grid-template-columns:1fr 1fr!important}.next-lesson-hud .btn{grid-column:1/-1}.next-block-card{grid-template-columns:1fr}.next-block-action{min-width:0}}
@media(max-width:560px){.next-step-head{grid-template-columns:38px 1fr}.next-step-state{grid-column:2}.next-step-complete{align-items:stretch;flex-direction:column}.next-lesson-hud{grid-template-columns:1fr!important}.kb-mode-switch .back-to-task{margin-left:0}}
.top-quick{display:flex;gap:5px;align-items:center}.top-quick a,.top-quick span{font-size:.64rem;font-weight:900;text-decoration:none;padding:7px 9px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:var(--surface)}.top-quick a:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}.top-quick span{opacity:.5}
@media(max-width:860px){.top-quick{display:none}}

/* Knowledgebase catalog: search, filters and material states */
.kb-catalog-tools{display:grid;grid-template-columns:minmax(260px,1.5fr) repeat(4,minmax(150px,.72fr));gap:10px;padding:14px;border:1px solid var(--line);background:var(--surface);border-radius:18px;margin-bottom:10px;box-shadow:0 8px 24px rgba(17,24,39,.035)}
.kb-catalog-tools label{display:flex;flex-direction:column;gap:6px;min-width:0}.kb-catalog-tools label>span{font-size:.7rem;font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.kb-catalog-tools input,.kb-catalog-tools select{width:100%;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--text);padding:0 12px;font:inherit;font-size:.84rem;outline:none}.kb-catalog-tools input:focus,.kb-catalog-tools select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.kb-search-field{position:relative}.kb-search-field input{padding-right:54px}.kb-search-field kbd{position:absolute;right:10px;bottom:10px;border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:3px 6px;font-size:.62rem;color:var(--muted);box-shadow:0 1px 2px rgba(17,24,39,.06)}
.kb-filter-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:42px;margin:0 2px 14px}.kb-filter-summary>div:first-child{display:flex;align-items:baseline;gap:4px}.kb-filter-summary strong{font-size:1rem}.kb-filter-summary span{color:var(--muted);font-size:.76rem}.kb-status-legend{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap}.text-button{border:0;background:transparent;color:var(--accent);font-weight:850;cursor:pointer;padding:7px 4px;font-size:.75rem}.text-button:hover{text-decoration:underline}
.kb-card-badges{display:flex;gap:6px;flex-wrap:wrap;margin:-10px 0 12px}.kb-priority{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:5px 8px;font-size:.65rem!important;font-weight:900!important;line-height:1;background:var(--surface-2);color:var(--muted)!important;border:1px solid transparent}.kb-priority.required{background:var(--accent-soft);color:var(--accent)!important;border-color:color-mix(in srgb,var(--accent) 18%,transparent)}.kb-priority.recommended{background:var(--surface-2);color:var(--muted)!important}.kb-priority.completed{background:var(--ok-soft);color:var(--ok)!important}.kb-priority.started{background:#fff7df;color:#8a6500!important}.kb-focus-breadcrumb .kb-priority{margin-left:2px}
.kb-topic-card[hidden]{display:none!important}.kb-topic-card .kb-topic-top{margin-bottom:16px}.kb-topic-card .kb-topic-top>span{font-size:.72rem}.kb-empty-state{text-align:center;border:1px dashed var(--line);border-radius:18px;padding:38px 20px;background:var(--surface-2);margin-top:10px}.kb-empty-state strong{display:block;font-size:1.05rem}.kb-empty-state p{margin:5px 0 16px}.kb-topic-meta .sim-badge{color:var(--accent)!important}.kb-topic-card.completed{border-color:color-mix(in srgb,var(--ok) 25%,var(--line))}
@media(max-width:1120px){.kb-catalog-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.kb-search-field{grid-column:1/-1}}
@media(max-width:700px){.kb-catalog-tools{grid-template-columns:1fr;padding:10px}.kb-search-field{grid-column:auto}.kb-filter-summary{align-items:flex-start;flex-direction:column}.kb-status-legend{justify-content:flex-start}.kb-search-field kbd{display:none}}

/* Knowledgebase material detail cards ---------------------------------- */
.kb-topic-browser .kb-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.kb-material-card{min-height:0!important;padding:18px!important;display:flex!important;flex-direction:column;gap:0}
.kb-material-card:hover{transform:none;box-shadow:0 12px 34px rgba(17,24,39,.07)}
.kb-material-card .kb-topic-top{margin-bottom:12px}.kb-material-card .kb-card-badges{margin:0 0 12px}
.kb-priority.simulation{background:color-mix(in srgb,var(--accent) 8%,var(--surface));color:var(--accent)!important;border-color:color-mix(in srgb,var(--accent) 18%,var(--line))}
.kb-material-title>strong{display:block;font-size:1.1rem;line-height:1.22}.kb-material-title>p{margin:6px 0 0;color:var(--muted);font-size:.82rem;line-height:1.5}
.kb-material-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:14px 0}.kb-material-facts>div{border:1px solid var(--line);border-radius:11px;padding:9px 10px;background:var(--surface-2)}.kb-material-facts>div.wide{grid-column:1/-1}.kb-material-facts span{display:block;color:var(--muted);font-size:.58rem;text-transform:uppercase;letter-spacing:.07em;font-weight:900}.kb-material-facts strong{display:block;margin-top:3px;font-size:.76rem;line-height:1.25}
.kb-material-goals{border-top:1px solid var(--line);padding-top:12px}.kb-material-goals>span{display:block;color:var(--muted);font-size:.61rem;text-transform:uppercase;letter-spacing:.07em;font-weight:900}.kb-material-goals ul{margin:7px 0 0;padding-left:18px;display:grid;gap:5px}.kb-material-goals li{font-size:.75rem;line-height:1.38}
.kb-material-footer{margin-top:auto;padding-top:14px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.kb-material-footer>small{color:var(--muted);font-size:.62rem;line-height:1.3;max-width:55%}.kb-continue{min-width:132px;justify-content:center}.kb-continue span{font-size:1rem}.kb-lock-reason{margin-left:auto;display:grid;justify-items:end;gap:2px;text-align:right}.kb-lock-reason b{font-size:.69rem;color:var(--muted)}.kb-lock-reason span{font-size:.61rem;color:var(--muted);max-width:230px}
.kb-material-card.locked{opacity:.62}.kb-material-card.locked .kb-material-goals,.kb-material-card.locked .kb-material-facts{filter:saturate(.5)}
.kb-material-brief{margin:10px 0 18px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:20px;background:linear-gradient(135deg,color-mix(in srgb,var(--surface) 96%,var(--accent) 4%),var(--surface));padding:20px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr) auto;gap:20px;align-items:center;box-shadow:0 10px 30px rgba(17,24,39,.04)}
.kb-material-brief-main h2{margin:4px 0 6px;font-size:1.25rem}.kb-material-brief-main p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.5}.kb-brief-badges{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.kb-brief-badges span{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 8px;font-size:.63rem;font-weight:850;color:var(--muted)}
.kb-material-brief-goals{border-left:1px solid var(--line);padding-left:18px}.kb-material-brief-goals>span{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:900}.kb-material-brief-goals ul{margin:7px 0 8px;padding-left:17px;display:grid;gap:5px}.kb-material-brief-goals li{font-size:.72rem;line-height:1.35}.kb-material-brief-goals small{color:var(--muted);font-size:.61rem}.kb-brief-continue{white-space:nowrap;justify-content:center}
@media(max-width:980px){.kb-material-brief{grid-template-columns:1fr 1fr}.kb-brief-continue{grid-column:1/-1}.kb-topic-browser .kb-topic-grid{grid-template-columns:1fr}}
@media(max-width:620px){.kb-material-brief{grid-template-columns:1fr;padding:16px}.kb-material-brief-goals{border-left:0;border-top:1px solid var(--line);padding:14px 0 0}.kb-material-footer{align-items:stretch;flex-direction:column}.kb-material-footer>small{max-width:none}.kb-continue{width:100%}.kb-material-facts{grid-template-columns:1fr}.kb-material-facts>div.wide{grid-column:auto}}

/* Main menu + focused assessments ---------------------------------------- */
.topbar{position:relative}
.main-menu{display:flex;align-items:center;gap:6px;margin-left:auto;margin-right:12px}
.main-menu a,.main-menu>span{min-height:40px;padding:0 10px;border-radius:11px;display:inline-flex;align-items:center;gap:7px;text-decoration:none;font-size:.76rem;font-weight:850;color:var(--muted);white-space:nowrap}
.main-menu a i,.main-menu>span i{width:22px;height:22px;border-radius:7px;background:var(--surface-2);display:grid;place-items:center;font-style:normal;font-size:.68rem}
.main-menu a:hover,.main-menu a.active{background:var(--surface);color:var(--text);box-shadow:0 0 0 1px var(--line) inset}
.main-menu a.active i{background:var(--accent-soft);color:var(--accent)}
.main-menu>span.disabled{opacity:.38;cursor:not-allowed}.main-menu>span small{font-size:.55rem;text-transform:uppercase;letter-spacing:.08em}
.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);background:var(--surface);border-radius:11px;padding:10px;cursor:pointer}.menu-toggle span{display:block;height:2px;background:var(--text);margin:4px 0;border-radius:99px}
.topbar-right{display:flex;align-items:center;gap:12px}.assessment-mode-label{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1}.assessment-mode-label span{font-size:.58rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:900}.assessment-mode-label strong{font-size:.74rem}
.assessment-mode .shell{width:min(1440px,calc(100% - 24px))}.assessment-mode main{padding:20px 0 24px}.assessment-mode .footer{display:none}.assessment-topbar{min-height:64px}

.assessment-page{min-height:calc(100vh - 90px);display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px}
.assessment-rail{display:grid;grid-template-columns:auto minmax(180px,1fr) auto;align-items:center;gap:16px;padding:10px 12px;border:1px solid var(--line);background:var(--surface);border-radius:14px}
.assessment-context{display:flex;flex-direction:column}.assessment-context span,.assessment-xp{font-size:.6rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.assessment-context strong{font-size:.8rem}.assessment-back{text-decoration:none;font-size:.72rem;font-weight:850;color:var(--accent)}
.assessment-progress{display:flex;align-items:center;gap:10px}.assessment-progress i{height:7px;background:var(--surface-2);border-radius:99px;overflow:hidden;flex:1}.assessment-progress em{display:block;height:100%;background:var(--accent);border-radius:inherit}.assessment-progress span{font-size:.65rem;font-weight:900;color:var(--muted)}.assessment-lock-chip,.assessment-xp{justify-self:end;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:7px 10px}
.assessment-layout{display:grid;grid-template-columns:minmax(300px,.78fr) minmax(480px,1.35fr);gap:14px;min-height:0}
.assessment-demo-panel,.assessment-question-panel{border:1px solid var(--line);background:var(--surface);border-radius:20px;box-shadow:0 10px 34px rgba(17,24,39,.04);min-height:0}
.assessment-demo-panel{padding:18px;display:flex;flex-direction:column;gap:12px;overflow:auto}
.assessment-question-panel{padding:clamp(20px,3vw,36px);display:flex;flex-direction:column;justify-content:center;overflow:auto}
.question-kicker{font-size:.65rem;font-weight:950;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin-bottom:10px}.assessment-question-panel h1{font-size:clamp(1.55rem,3.2vw,2.9rem);margin:0 0 10px;max-width:900px}.assessment-instruction{margin:0 0 18px;font-size:.82rem}
.assessment-answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.assessment-answer{position:relative;min-height:94px;border:1px solid var(--line);background:var(--surface-2);border-radius:15px;padding:14px;display:grid;grid-template-columns:34px 1fr;gap:11px;align-items:center;text-align:left;cursor:pointer;color:var(--text);transition:.15s ease}
.assessment-answer:hover{border-color:var(--accent);transform:translateY(-1px)}.assessment-answer>span{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--surface);font-weight:950;color:var(--accent)}.assessment-answer>strong{font-size:.8rem;line-height:1.35;font-weight:780}.assessment-answer input{position:absolute;opacity:0;pointer-events:none}.assessment-answer:has(input:checked),.assessment-answer.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent) inset}.assessment-answer.correct{border-color:var(--ok);background:var(--ok-soft)}.assessment-answer.wrong{border-color:var(--bad);background:var(--bad-soft)}.assessment-answer:disabled{cursor:default;opacity:.6;transform:none}
.assessment-form{display:flex;flex-direction:column;gap:14px}.assessment-submit{align-self:flex-end;min-width:220px}.assessment-abort{margin-top:14px;text-align:right}.assessment-feedback{border-radius:18px;padding:20px;display:grid;grid-template-columns:52px 1fr;gap:15px;border:1px solid;margin-top:12px}.assessment-feedback.ok{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 32%,var(--line))}.assessment-feedback.bad{background:var(--bad-soft);border-color:color-mix(in srgb,var(--bad) 28%,var(--line))}.feedback-mark{width:48px;height:48px;border-radius:14px;background:var(--surface);display:grid;place-items:center;font-size:1.3rem;font-weight:950}.assessment-feedback span{display:block;font-size:.63rem;text-transform:uppercase;letter-spacing:.1em;font-weight:950}.assessment-feedback strong{display:block;margin:5px 0;font-size:.92rem}.assessment-feedback p{margin:5px 0;color:inherit}.assessment-feedback small{color:inherit;opacity:.75}.assessment-next-form{margin-top:16px;display:flex;justify-content:flex-end}
.compact-notice{margin:0}

.assessment-visual{border:1px solid var(--line);background:var(--surface-2);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:12px;min-height:260px}.visual-demo-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.visual-demo-head span{font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:var(--accent)}.visual-demo-head strong{font-size:.78rem;text-align:right}.demo-toggle{align-self:flex-start;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:7px 10px;font-size:.66rem;font-weight:850;color:var(--text);cursor:pointer}.demo-toggle.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.demo-evidence{white-space:pre-wrap;background:#101820;color:#e8f0f7;border-radius:10px;padding:10px;font-size:.67rem;line-height:1.5}.demo-grayscale [data-demo-preview]{filter:grayscale(1)}.demo-blur [data-demo-preview]{filter:blur(3.5px)}
.contrast-demo{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex:1}.contrast-sample{border-radius:13px;display:flex;min-height:140px;flex-direction:column;justify-content:center;align-items:center}.contrast-sample b{font-size:1.6rem}.contrast-sample span{font-size:.6rem}.contrast-sample.weak{background:#d9d5e8;color:#9b92ba}.contrast-sample.strong{background:#111827;color:#fff}.poster-demo{min-height:210px;border-radius:14px;padding:20px;background:#111218;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:6px}.poster-demo small{font-size:.55rem;letter-spacing:.12em}.poster-demo b{font-size:2.7rem;line-height:.82;letter-spacing:-.06em}.poster-demo p{color:#d8dce3;margin:0;font-size:.7rem}.poster-demo em{font-style:normal;background:#b8ff50;color:#111;padding:6px 8px;border-radius:999px;font-size:.58rem;font-weight:950}.grid-demo-mini{min-height:210px;position:relative;border-radius:14px;background:linear-gradient(90deg,transparent 24%,rgba(124,58,237,.17) 25% 26%,transparent 27% 49%,rgba(124,58,237,.17) 50% 51%,transparent 52% 74%,rgba(124,58,237,.17) 75% 76%,transparent 77%),#fff;padding:24px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start}.demo-grid-off .grid-demo-mini{background:#fff}.grid-demo-mini b{font-size:1.5rem}.grid-demo-mini p{margin:3px 0}.grid-demo-mini em{font-style:normal;background:#111;color:#fff;padding:6px 9px}.vector-demo-mini{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-height:160px}.vector-demo-mini>div{border-radius:14px;background:#fff;display:grid;place-items:center;font-size:4rem;font-weight:950}.vector-demo-mini .pixels{image-rendering:pixelated;text-shadow:4px 0 0 #111,-4px 0 0 #111;filter:blur(.5px)}.demo-caption{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:.58rem;color:var(--muted);text-align:center}.design-decision-demo{display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:center;margin:auto 0}.design-decision-demo b{width:28px;height:28px;border-radius:8px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}.packet-flow,.network-path-mini,.stack-demo-mini{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;min-height:150px}.packet-flow span,.stack-demo-mini span,.network-path-mini b{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:9px 10px;font-size:.66rem;font-weight:900}.packet-flow i,.network-path-mini i{font-style:normal;color:var(--accent);font-weight:950}.route-demo-mini{display:flex;align-items:center;justify-content:center;gap:8px;min-height:170px}.route-demo-mini>div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px;display:grid;gap:4px}.route-demo-mini span{font-size:.58rem;font-weight:950}.route-demo-mini code{font-size:.63rem}.route-demo-mini i{font-style:normal;color:var(--accent);font-weight:950}.quiz-method-card{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--surface-2)}.quiz-method-card>span{font-size:.58rem;font-weight:950;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.quiz-method-card ol{padding-left:18px;margin:7px 0 0;font-size:.68rem;color:var(--muted)}

.kb-quiz-launch{margin-top:14px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);padding:18px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}.kb-quiz-launch.locked{opacity:.55}.kb-quiz-launch .kb-complete-card{grid-column:1/-1;margin:0}.kb-quiz-launch h3{margin:2px 0 5px}.kb-quiz-launch p{margin:0;max-width:800px;font-size:.78rem}
.kb-quiz-page .assessment-layout{grid-template-columns:minmax(280px,.8fr) minmax(500px,1.35fr)}.kb-answer-grid button{font-family:inherit}.kb-quiz-feedback,.kb-quiz-hint{margin-top:14px;border-radius:14px;padding:13px 15px;border:1px solid var(--line)}.kb-quiz-feedback.ok{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 30%,var(--line))}.kb-quiz-feedback.bad{background:var(--bad-soft);border-color:color-mix(in srgb,var(--bad) 25%,var(--line))}.kb-quiz-feedback p,.kb-quiz-hint p{margin:4px 0;color:inherit;font-size:.78rem}.kb-quiz-hint{background:var(--surface-2)}.assessment-continue{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}

/* Subject-scoped KB hint */
.kb-subject-scope{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.kb-subject-scope span{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 9px;font-size:.64rem;font-weight:850}

@media(max-width:1100px){
  .main-menu{position:absolute;top:72px;left:0;right:0;z-index:80;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:8px;display:none;grid-template-columns:repeat(2,minmax(0,1fr));box-shadow:var(--shadow)}.main-menu.open{display:grid}.main-menu a,.main-menu>span{justify-content:flex-start}.menu-toggle{display:block;margin-left:auto}.topbar-right{margin-left:0}.assessment-layout,.kb-quiz-page .assessment-layout{grid-template-columns:1fr}.assessment-demo-panel{max-height:none}.assessment-page{min-height:auto}.assessment-mode .footer{display:block}
}
@media(max-width:720px){
  .learning-hud .hud-xp{display:none}.assessment-mode .class-chip{display:none}.assessment-mode-label{display:none}.assessment-rail{grid-template-columns:1fr auto}.assessment-progress{grid-column:1/-1;grid-row:2}.assessment-lock-chip{display:none}.assessment-answer-grid{grid-template-columns:1fr}.assessment-answer{min-height:78px}.assessment-question-panel{padding:18px}.assessment-demo-panel{padding:12px}.assessment-submit{width:100%;align-self:stretch}.assessment-abort{text-align:center}.kb-quiz-launch{grid-template-columns:1fr}.kb-quiz-launch .btn{width:100%}.main-menu{grid-template-columns:1fr}.class-chip{display:none}
}
.kb-subject-overview{margin:18px 0 22px}.kb-subject-class-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.kb-subject-class-card{border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:15px}.kb-subject-class-card.current{border-color:color-mix(in srgb,var(--accent) 32%,var(--line));background:linear-gradient(135deg,var(--surface),color-mix(in srgb,var(--accent-soft) 55%,var(--surface)))}.kb-subject-class-card>div{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.kb-subject-class-card span{font-size:.66rem;color:var(--accent);font-weight:950}.kb-subject-class-card strong{font-size:.83rem}.kb-subject-class-card p{margin:6px 0 10px;font-size:.7rem}.kb-subject-class-card a{font-size:.7rem;font-weight:900;color:var(--accent);text-decoration:none}@media(max-width:700px){.kb-subject-class-grid{grid-template-columns:1fr}}

/* Google auth + course map ------------------------------------------------ */
.modern-login{display:grid;gap:22px;text-align:left;max-width:680px;margin:24px auto;padding:30px}
.google-login-copy h2{margin:.2rem 0 .5rem;font-size:clamp(1.45rem,3vw,2rem)}
.google-button-wrap{display:flex;justify-content:center;padding:12px 0}
.auth-note{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.auth-note span{padding:10px 12px;border:1px solid var(--line);border-radius:12px;font-size:.82rem;background:var(--panel-soft)}
.account-link-form select{width:100%;min-height:46px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--text);padding:0 12px}
.account-link-form .optional-student{opacity:.65}
.compact-hero{padding-bottom:8px}
.course-map-hero{max-width:920px}
.course-map{display:grid;gap:14px;margin:20px 0 34px}
.course-card{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:18px;align-items:center;padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--panel);box-shadow:var(--shadow-sm)}
.course-card.current{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 16%,transparent),var(--shadow-sm)}
.course-card.done{background:color-mix(in srgb,var(--panel) 88%,#65d88a 12%)}
.course-card.locked{opacity:.52}
.course-card-number{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--panel-soft);border:1px solid var(--line);font-weight:800;letter-spacing:.08em}
.course-card h2{margin:.2rem 0 .35rem;font-size:1.15rem}.course-card p{margin:0 0 .4rem;color:var(--muted)}.course-card small,.course-card span{color:var(--muted);font-size:.82rem}
.lesson-course-hero{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:24px;align-items:center}
.lesson-progress-card{padding:18px;border-radius:18px;background:var(--panel);border:1px solid var(--line)}
.lesson-progress-card span,.lesson-progress-card small{display:block;color:var(--muted);font-size:.78rem}.lesson-progress-card strong{font-size:1.6rem}.lesson-progress-card i{height:7px;background:var(--panel-soft);border-radius:99px;display:block;overflow:hidden;margin:10px 0}.lesson-progress-card em{height:100%;display:block;background:var(--accent);border-radius:99px}
.knowledge-dock{display:grid;grid-template-columns:minmax(220px,.7fr) 1.3fr;gap:20px;padding:20px;margin:18px 0;border-radius:18px;background:var(--panel);border:1px solid var(--line)}
.knowledge-dock p{margin:.35rem 0 0;color:var(--muted)}.knowledge-dock-links{display:flex;gap:8px;flex-wrap:wrap;align-content:start}.knowledge-dock-links a{padding:9px 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--text);font-size:.84rem;background:var(--panel-soft)}.knowledge-dock-links a.done{border-color:color-mix(in srgb,#65d88a 55%,var(--line))}
.lesson-stepper{display:grid;gap:14px}.next-step-card{display:grid;grid-template-columns:56px 1fr;gap:15px;padding:20px;border-radius:20px;background:var(--panel);border:1px solid var(--line)}.next-step-card.current{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}.next-step-card.done{opacity:.78}.next-step-card.locked{opacity:.48}.next-step-index{width:46px;height:46px;border-radius:14px;background:var(--panel-soft);display:grid;place-items:center;font-weight:800}.next-step-content header{display:flex;justify-content:space-between;gap:14px;align-items:start}.next-step-content header h2{margin:.15rem 0 .5rem;font-size:1.2rem}.next-step-content header span,.next-step-content header small{font-size:.78rem;color:var(--muted)}
.step-task-list{display:grid;gap:8px;margin:14px 0}.step-task-list label{display:flex;gap:10px;padding:10px 12px;background:var(--panel-soft);border-radius:12px}.step-kb-links{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.step-kb-links a{font-size:.82rem}.locked-copy{color:var(--muted)}.compact-answer-grid{grid-template-columns:1fr 1fr}.compact-panel{margin-bottom:16px}.compact-timeline{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
@media(max-width:760px){.auth-note{grid-template-columns:1fr}.course-card{grid-template-columns:48px 1fr}.course-card .btn{grid-column:1/-1}.lesson-course-hero,.knowledge-dock{grid-template-columns:1fr}.next-step-card{grid-template-columns:1fr}.compact-answer-grid{grid-template-columns:1fr}.next-step-index{width:40px;height:40px}}
.account-chip{display:flex;align-items:center;gap:8px;min-width:0}.account-chip img,.account-chip>i{width:32px;height:32px;border-radius:50%;object-fit:cover;background:var(--panel-soft);border:1px solid var(--line)}.account-chip>i{display:grid;place-items:center;font-style:normal;font-weight:800}.account-chip span{display:grid;line-height:1.05;max-width:170px}.account-chip strong{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-chip small{font-size:.66rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:980px){.account-chip{display:none}}

/* Local @educanet.cz authentication -------------------------------------- */
.auth-shell{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);gap:18px;max-width:980px;margin:22px auto 0;align-items:start}
.auth-card{padding:28px;border-radius:22px}
.auth-card h2{margin:.2rem 0 .45rem;font-size:clamp(1.45rem,3vw,2rem)}
.auth-card>p{color:var(--muted);margin-top:0}
.auth-primary{box-shadow:0 14px 40px rgba(20,30,50,.08)}
.auth-register{background:var(--panel-soft)}
.auth-form{display:grid;gap:12px;margin-top:18px}
.auth-form label,.auth-help label{display:grid;gap:6px;font-weight:700;font-size:.86rem}
.auth-form input,.auth-help input{width:100%;min-height:46px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);padding:10px 12px;font:inherit;outline:none}
.auth-form input:focus,.auth-help input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
.auth-form small{color:var(--muted);font-weight:500}
.btn.wide{width:100%;justify-content:center}
.auth-divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;margin:8px 0 4px}
.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--line);flex:1}
.auth-help{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.auth-help summary{cursor:pointer;color:var(--muted);font-size:.84rem;font-weight:700}
.auth-help-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.auth-help-grid form{display:grid;gap:8px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.auth-security-note{margin:14px 0 0;padding:11px 12px;border:1px solid var(--line);border-radius:12px;color:var(--muted);font-size:.8rem;line-height:1.5}
.auth-security-note.warning{border-color:#c99029}
.dev-entry{margin-top:18px}.dev-entry>summary{cursor:pointer;font-weight:800}
@media(max-width:820px){.auth-shell{grid-template-columns:1fr;max-width:640px}.auth-help-grid{grid-template-columns:1fr}}

/* Extended interactive learning ------------------------------------------------ */
.learning-resource-panel{margin:22px 0;padding:20px;border:1px solid var(--line,#dfe3e8);border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,249,252,.98))}
.learning-resource-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:12px;margin-top:14px}
.learning-resource-card{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:14px 15px;border:1px solid var(--line,#dfe3e8);border-radius:16px;background:#fff;text-decoration:none;color:inherit;transition:.18s ease}
.learning-resource-card:hover{transform:translateY(-2px);border-color:#b7c1cf;box-shadow:0 10px 24px rgba(18,29,46,.08)}
.learning-resource-card>i{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#111827;color:#fff;font-style:normal;font-weight:800}
.learning-resource-card div{display:grid;gap:3px}.learning-resource-card div>span{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:#697386}.learning-resource-card div>strong{font-size:14px;line-height:1.25}.learning-resource-card div>small{color:#697386}.learning-resource-card>b{font-size:12px;color:#4f46e5;white-space:nowrap}

.sim-palette-stage{min-height:270px;border-radius:22px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:14px;position:relative;overflow:hidden}.sim-palette-stage>span{font-size:11px;letter-spacing:.14em;opacity:.75}.sim-palette-stage>strong{font-size:clamp(38px,8vw,76px);line-height:.84}.sim-palette-stage>button{border:0;border-radius:999px;padding:10px 16px;font-weight:800}.sim-swatches{position:absolute;right:18px;top:18px;display:flex;gap:5px}.sim-swatches i{width:28px;height:28px;border-radius:9px;border:2px solid rgba(255,255,255,.5)}
.sim-icon-row{min-height:240px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:center}.sim-icon-row>div{display:grid;place-items:center;gap:8px;padding:22px;border:1px solid #dde3ea;border-radius:18px;background:#fff}.sim-icon-row i{font-size:var(--sz);font-style:normal;-webkit-text-stroke:calc(var(--stroke)/3) currentColor}.sim-icon-row.mixed>div:nth-child(2){background:#fff7ed}.sim-icon-row span{font-size:12px;color:#6b7280}
.sim-crop-stage{min-height:270px;border-radius:22px;position:relative;overflow:hidden;background:radial-gradient(circle at 70% 45%,#485467 0 20%,#1f2937 21% 100%);color:#fff}.sim-crop-stage.low{filter:contrast(.65)}.crop-subject,.crop-copy{position:absolute;top:50%;transform:translate(-50%,-50%)}.crop-subject{display:grid;place-items:center;gap:6px}.crop-subject>span{font-size:72px;color:#f59e0b}.crop-subject>b{font-size:11px;letter-spacing:.1em}.crop-copy{width:170px}.crop-copy strong{font-size:32px;line-height:.9}.crop-copy small{display:block;margin-top:10px}.crop-copy.collision{outline:3px solid #ef4444;background:rgba(127,29,29,.55);padding:10px;border-radius:12px}
.sim-critique-poster{min-height:260px;border-radius:22px;background:#171717;color:#a3a3a3;padding:30px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.sim-critique-poster button{border:0;padding:9px 14px;border-radius:12px}.sim-fix-list{display:flex;gap:8px;margin-top:12px}.sim-fix-list span{padding:6px 10px;border-radius:999px;background:#fee2e2;color:#991b1b;font-size:12px}.sim-fix-list span.ok{background:#dcfce7;color:#166534}
.sim-token-list{display:grid;gap:8px}.sim-token-list>div{display:grid;grid-template-columns:46px 55px 1fr;gap:8px;align-items:center;padding:8px 10px;border-radius:12px;background:#f8fafc}.sim-token-list span{font-size:11px;text-transform:uppercase;color:#64748b}.sim-token-list i{height:8px;border-radius:999px;background:#4f46e5}.sim-ui-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}.sim-ui-cards div{padding:22px;border:1px solid #d9e0e8;border-radius:16px;background:#fff}
.sim-component-stage{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:26px;border-radius:20px;background:#f8fafc}.sim-component-stage button{border-radius:var(--r);padding:11px var(--p);border:1px solid #cbd5e1;background:#fff;font-weight:700}.sim-component-stage button.primary{background:#111827;color:#fff}.sim-component-stage button.disabled{opacity:.75}.sim-component-stage button.disabled.state-ok{opacity:.35;filter:grayscale(1)}.component-card{width:100%;padding:var(--p);border-radius:var(--r);border:1px solid #cbd5e1;background:#fff;display:grid;gap:4px}.component-card span{font-size:12px;color:#64748b}
.sim-motion-track{min-height:230px;border-radius:20px;background:#0f172a;color:#fff;position:relative;display:flex;align-items:center;padding:28px;overflow:hidden}.sim-motion-track>span{position:absolute;left:28px;top:28px;font-size:11px;color:#94a3b8}.sim-motion-track>b{position:absolute;right:28px;bottom:28px;color:#86efac}.sim-motion-dot{width:42px;height:42px;border-radius:14px;background:#a3e635;display:block;box-shadow:0 10px 30px rgba(163,230,53,.35)}
.sim-portfolio-flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px}.sim-portfolio-flow>div{min-height:120px;padding:15px;border:1px solid #dbe2ea;border-radius:16px;background:#fff;display:flex;flex-direction:column;justify-content:space-between}.sim-portfolio-flow span{font-size:11px;color:#64748b}.sim-portfolio-flow strong{font-size:14px}
.sim-ipv6,.sim-dns-record-chain,.sim-reservation,.sim-restore{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;min-height:230px;padding:20px;border-radius:20px;background:#0f172a;color:#fff}.sim-ipv6 code,.sim-dns-record-chain>div,.sim-reservation>div,.sim-restore>div{padding:14px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:rgba(255,255,255,.06)}.sim-ipv6 strong{width:100%;text-align:center;color:#a3e635}.sim-dns-record-chain>div,.sim-reservation>div,.sim-restore>div{display:grid;gap:4px}.sim-dns-record-chain span,.sim-reservation span,.sim-restore span{font-size:11px;color:#94a3b8}.sim-reservation>div.ok,.sim-restore>div.ok{border-color:#22c55e}.sim-reservation>div.fail,.sim-restore>div.fail{border-color:#ef4444}
.sim-monitor-stack{min-height:220px;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:9px}.sim-monitor-stack>div{padding:20px 12px;text-align:center;border:1px solid #dbe2ea;border-radius:16px;background:#fff}.sim-monitor-stack small{display:block;color:#64748b}.sim-monitor-stack .fail{background:#fff1f2;border-color:#fecdd3}.sim-monitor-stack .ok{background:#f0fdf4;border-color:#bbf7d0}
.sim-http-probe{display:grid;grid-template-columns:1fr 130px;gap:14px;align-items:stretch}.sim-http-probe pre{margin:0;border-radius:16px;background:#0f172a;color:#e2e8f0;padding:20px;min-height:210px}.sim-http-probe>div{border-radius:16px;background:#f8fafc;border:1px solid #dbe2ea;display:grid;place-items:center;align-content:center}.sim-http-probe>div span{font-size:11px;color:#64748b}.sim-http-probe>div strong{font-size:28px}.sim-http-probe.fail>div{background:#fff1f2}
.sim-lb{display:grid;grid-template-columns:110px 100px 1fr;gap:12px;align-items:center;min-height:240px}.lb-head,.lb-router,.lb-backends>div{padding:18px;border:1px solid #dbe2ea;border-radius:16px;background:#fff;text-align:center}.lb-backends{display:grid;gap:10px}.lb-backends>div{display:flex;justify-content:space-between;gap:8px}.lb-backends .fail{background:#fff1f2;border-color:#fecdd3}.lb-backends .ok{background:#f0fdf4;border-color:#bbf7d0}
.sim-canary>div:not(.sim-result-pill){display:grid;grid-template-columns:35px 1fr 45px;gap:8px;align-items:center;margin:10px 0}.sim-canary i{height:14px;border-radius:999px;background:#22c55e;min-width:4px}.sim-canary i.fail{background:#ef4444}.sim-canary section{margin-top:18px;padding:15px;border-radius:15px;background:#f8fafc;display:flex;justify-content:space-between;gap:10px;align-items:center}.sim-canary section em{font-size:12px;color:#64748b}

@media(max-width:760px){.learning-resource-card{grid-template-columns:38px 1fr}.learning-resource-card>b{grid-column:2}.sim-icon-row,.sim-ui-cards{grid-template-columns:1fr}.sim-monitor-stack{grid-template-columns:1fr}.sim-monitor-stack>span{transform:rotate(90deg)}.sim-http-probe{grid-template-columns:1fr}.sim-lb{grid-template-columns:1fr}.sim-palette-stage{min-height:220px}.sim-palette-stage>strong{font-size:44px}}

/* === 2026-09 compact navigation + dedicated lesson screens === */
body { --page-title: clamp(1.7rem, 3.2vw, 3rem); --section-title: clamp(1.2rem, 2vw, 1.75rem); }
h1 { font-size: var(--page-title); margin-bottom: 14px; }
h2 { font-size: var(--section-title); }
.hero { padding: 8px 0 24px; }
.hero > p, .hero-center > p { font-size: .94rem; line-height: 1.55; }
.case-hero h1,.studio-hero h1,.practice-top h1,.result-hero h1,.course-map-hero h1 { font-size: var(--page-title); }
.kb-tour-header h2 { font-size: clamp(1.45rem,2.6vw,2.15rem); }
.assessment-question-panel h1 { font-size: clamp(1.35rem,2.4vw,2.15rem); line-height:1.12; }
main { padding: 30px 0 56px; }
.topbar { min-height: 70px; gap: 16px; }
.brand { font-size:.86rem; }
.brand-mark { width:31px;height:31px;border-radius:9px; }
.main-menu { gap:3px; padding:4px; border:1px solid var(--line); background:var(--surface-2); border-radius:15px; margin-right:10px; }
.main-menu a,.main-menu>span { min-height:36px; padding:0 9px; border-radius:10px; font-size:.7rem; gap:6px; }
.main-menu a i,.main-menu>span i { width:20px;height:20px;border-radius:6px;font-size:.6rem;background:transparent; }
.main-menu a:hover { background:color-mix(in srgb,var(--surface) 78%,transparent); box-shadow:none; }
.main-menu a.active { background:var(--surface); color:var(--text); box-shadow:0 1px 6px rgba(17,24,39,.08),0 0 0 1px var(--line) inset; }
.main-menu a.active i { background:var(--accent-soft); }

/* Dedicated knowledge lesson: the catalogue never shares the same long page. */
.view-kb_lesson .footer { display:none; }
.view-kb_lesson main { padding:12px 0 14px; }
.kb-lesson-screen { height:calc(100vh - 96px); min-height:600px; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:10px; overflow:hidden; }
.kb-lesson-toolbar { min-height:54px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:14px; align-items:center; border:1px solid var(--line); background:var(--surface); border-radius:16px; padding:8px 12px; }
.kb-lesson-back { text-decoration:none; font-size:.72rem; font-weight:850; color:var(--muted); white-space:nowrap; }
.kb-lesson-back:hover { color:var(--accent); }
.kb-lesson-title { min-width:0; }
.kb-lesson-title span { display:block; font-size:.58rem; text-transform:uppercase; letter-spacing:.08em; font-weight:850; color:var(--muted); }
.kb-lesson-title strong { display:block; font-size:.96rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kb-lesson-meta { display:flex; gap:6px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.kb-lesson-meta span { border:1px solid var(--line); background:var(--surface-2); border-radius:999px; padding:5px 8px; font-size:.59rem; font-weight:850; color:var(--muted); white-space:nowrap; }
.kb-lesson-meta span.done { background:var(--ok-soft); color:var(--ok); border-color:color-mix(in srgb,var(--ok) 25%,var(--line)); }
.kb-lesson-layout { display:grid; grid-template-columns:250px minmax(0,1fr); gap:10px; min-height:0; overflow:hidden; }
.kb-lesson-context { min-height:0; overflow:auto; border:1px solid var(--line); border-radius:18px; background:var(--surface); padding:16px; }
.kb-lesson-context .eyebrow { font-size:.6rem; margin-bottom:5px; }
.kb-lesson-context p { margin:0; font-size:.76rem; line-height:1.5; }
.kb-lesson-goals { margin-top:16px; border-top:1px solid var(--line); padding-top:13px; }
.kb-lesson-goals>span { display:block; font-size:.6rem; font-weight:900; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; }
.kb-lesson-goals ul { margin:8px 0 0; padding-left:18px; display:grid; gap:7px; }
.kb-lesson-goals li { font-size:.7rem; line-height:1.4; }
.kb-lesson-resources { margin-top:16px; border-top:1px solid var(--line); padding-top:12px; }
.kb-lesson-resources summary { cursor:pointer; font-size:.69rem; font-weight:850; }
.kb-lesson-resources .learning-resource-panel { margin:10px 0 0; padding:0; border:0; box-shadow:none; }
.kb-lesson-resources .section-heading { display:none; }
.kb-lesson-resources .learning-resource-grid { grid-template-columns:1fr; gap:7px; }
.kb-lesson-main { min-width:0; min-height:0; overflow:hidden; }
.kb-tour.compact-tour { height:100%; min-height:0; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; border-radius:18px; box-shadow:none; }
.compact-tour .kb-tour-tabs { position:static; min-height:47px; }
.compact-tour .kb-tour-tabs button { padding:10px 8px; font-size:.69rem; }
.compact-tour .lesson-gate-note { margin:8px 12px 0; padding:7px 10px; }
.compact-tour .lesson-gate-note p { font-size:.63rem; }
.compact-tour .kb-tab-panel { min-height:0; overflow:auto; padding:16px 18px 18px; }
.compact-tour .kb-mental-model { margin-top:0; }
.compact-tour .kb-quiz-launch { margin:0; border-radius:0; border-left:0; border-right:0; border-bottom:0; padding:10px 14px; grid-template-columns:minmax(0,1fr) auto; }
.compact-tour .kb-quiz-launch h3 { font-size:.88rem; margin:2px 0 3px; }
.compact-tour .kb-quiz-launch p { font-size:.64rem; margin:0; }
.compact-tour .kb-complete-card { display:none; }
.kb-lesson-pager { min-height:48px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; }
.kb-lesson-pager>div:last-child { justify-self:end; }
.kb-lesson-pager .btn { min-height:38px; padding:0 14px; font-size:.7rem; }
.kb-lesson-progress-note { font-size:.63rem; color:var(--muted); text-align:center; }

/* Catalogue is a catalogue: compact header, no embedded lesson below it. */
.view-knowledgebase .kb-hero { padding-bottom:14px; }
.view-knowledgebase .kb-hero h1 { font-size:clamp(1.7rem,3vw,2.6rem); }
.view-knowledgebase .kb-topic-browser { margin-top:12px; }
.view-knowledgebase .kb-material-card { min-height:0; }

/* Assessment screens use one viewport on desktop; only their inner panes scroll if necessary. */
@media(min-width:901px){
  body.assessment-mode { overflow:hidden; }
  .assessment-mode main { padding:10px 0 12px; }
  .assessment-page { height:calc(100vh - 78px); min-height:0; }
  .assessment-layout { min-height:0; overflow:hidden; }
  .assessment-demo-panel,.assessment-question-panel { overflow:auto; }
  .assessment-answer { min-height:76px; padding:11px 13px; }
  .assessment-question-panel { padding:20px 26px; }
}

@media(max-width:1000px){
  .kb-lesson-screen { height:auto; min-height:0; overflow:visible; }
  .kb-lesson-layout { grid-template-columns:1fr; overflow:visible; }
  .kb-lesson-context { overflow:visible; }
  .kb-lesson-main { overflow:visible; }
  .kb-tour.compact-tour { height:auto; display:block; }
  .compact-tour .kb-tab-panel { overflow:visible; }
  .view-kb_lesson .footer { display:block; }
}
@media(max-width:760px){
  main { padding:20px 0 44px; }
  .topbar { min-height:62px; }
  .kb-lesson-toolbar { grid-template-columns:auto minmax(0,1fr); }
  .kb-lesson-meta { grid-column:1/-1; justify-content:flex-start; }
  .kb-lesson-pager { grid-template-columns:1fr 1fr; }
  .kb-lesson-progress-note { display:none; }
}

/* === 2026-09 catalogue density + richer media cards === */
@media(min-width:1201px){
  .kb-topic-browser .kb-topic-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  .kb-material-card{padding:14px!important;border-radius:16px}
  .kb-material-card .kb-topic-top{margin-bottom:9px}
  .kb-material-card h3{font-size:.96rem;line-height:1.18}
  .kb-material-card p{font-size:.7rem;line-height:1.42}
  .kb-material-card .kb-material-goals li{font-size:.66rem;line-height:1.35}
}
@media(min-width:901px) and (max-width:1200px){.kb-topic-browser .kb-topic-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(min-width:651px) and (max-width:900px){.kb-topic-browser .kb-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:650px){.kb-topic-browser .kb-topic-grid{grid-template-columns:1fr;}}

.learning-resource-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
.learning-resource-card.video{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;min-width:0}
.learning-resource-card.video .video-thumb{position:relative;aspect-ratio:16/9;background:#0f172a;overflow:hidden}
.learning-resource-card.video .video-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
.learning-resource-card.video:hover .video-thumb img{transform:scale(1.035)}
.learning-resource-card.video .video-thumb i{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;background:linear-gradient(180deg,transparent,rgba(0,0,0,.18))}
.learning-resource-card.video .video-thumb i:before{content:'▶';width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(17,24,39,.9);color:#fff;padding-left:3px;box-shadow:0 8px 24px rgba(0,0,0,.24)}
.learning-resource-card.video .video-copy{padding:12px 13px 13px;display:grid;gap:5px}
.learning-resource-card.video .video-copy>span{font-size:.62rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.learning-resource-card.video .video-copy>strong{font-size:.82rem;line-height:1.28}
.learning-resource-card.video .video-copy>small{font-size:.67rem;line-height:1.4;color:var(--muted)}
.learning-resource-card.video .video-copy>b{font-size:.68rem;color:var(--accent)}
@media(max-width:1100px){.learning-resource-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:620px){.learning-resource-grid{grid-template-columns:1fr;}}

/* New interactive labs */
.sim-responsive-wrap{display:grid;grid-template-columns:minmax(180px,320px) 1fr;gap:18px;align-items:center;justify-content:center;min-height:260px}
.sim-device-preview{width:min(100%,260px);max-height:390px;margin:auto;border-radius:22px;background:linear-gradient(145deg,#111827,#312e81);color:#fff;padding:var(--safe);position:relative;box-shadow:0 18px 45px rgba(17,24,39,.22);overflow:hidden}
.sim-device-preview>i{position:absolute;inset:var(--safe);border:1px dashed rgba(255,255,255,.3);border-radius:12px;pointer-events:none}
.sim-responsive-content{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:7px;position:relative;z-index:1}.sim-responsive-content>span{font-size:9px;letter-spacing:.12em;opacity:.75}.sim-responsive-content>strong{font-size:clamp(24px,5vw,48px);line-height:.86}.sim-responsive-content>p{margin:0;color:rgba(255,255,255,.82);font-size:11px}.sim-responsive-content>b{margin-top:5px;padding:8px 11px;border-radius:999px;background:#a3e635;color:#111827;font-size:10px}.sim-responsive-content.flat>strong,.sim-responsive-content.flat>p,.sim-responsive-content.flat>b{font-size:13px;margin:0;background:transparent;color:#fff;padding:0;border-radius:0}.sim-responsive-meta{display:grid;gap:7px}.sim-responsive-meta span{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.sim-responsive-meta strong{font-size:1.2rem}.sim-responsive-meta small{color:var(--muted)}
.sim-a11y-card{min-height:250px;border:1px solid var(--line);border-radius:20px;padding:26px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px}.sim-a11y-card>span{font-size:10px;letter-spacing:.1em}.sim-a11y-card>strong{line-height:1}.sim-a11y-card>p{margin:0;color:inherit;opacity:.86}.sim-a11y-card>button{margin-top:8px;border:0;border-radius:12px;padding:11px 15px;background:#2563eb;color:#fff;font-weight:800}.sim-a11y-card>button.focus-on{outline:3px solid #f59e0b;outline-offset:4px}.sim-a11y-score{margin-top:10px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);display:flex;gap:10px;align-items:baseline}.sim-a11y-score.ok{background:#f0fdf4;border-color:#bbf7d0}.sim-a11y-score.warn{background:#fff7ed;border-color:#fed7aa}.sim-a11y-score span{font-size:10px;color:var(--muted)}.sim-a11y-score strong{font-size:1.1rem}.sim-a11y-score small{margin-left:auto;color:var(--muted)}
.sim-packet-head{display:flex;gap:10px;align-items:center;padding:11px 13px;border-radius:12px 12px 0 0;background:#111827;color:#fff}.sim-packet-head span{font-size:10px;color:#94a3b8;letter-spacing:.1em}.sim-packet-head strong{font-family:ui-monospace,monospace}.sim-packet-head em{margin-left:auto;font-size:11px;color:#fca5a5}.sim-packet-list{background:#0f172a;border-radius:0 0 16px 16px;overflow:hidden}.sim-packet-list>div{display:grid;grid-template-columns:50px minmax(0,1fr) 24px minmax(0,1fr);gap:8px;align-items:center;padding:11px 13px;border-top:1px solid rgba(255,255,255,.08);color:#e2e8f0}.sim-packet-list span{font-size:10px;color:#93c5fd;font-weight:800}.sim-packet-list code{font-size:11px;white-space:normal}.sim-packet-list code.ok{color:#86efac}.sim-packet-list code.fail{color:#fca5a5}
.sim-slo{display:grid;gap:14px;padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.sim-slo-head{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.sim-slo-head span{font-size:11px;color:var(--muted);text-transform:uppercase}.sim-slo-head strong{font-size:1.25rem}.sim-slo-head b{margin-left:auto;color:var(--muted)}.sim-budget-bar{height:18px;border-radius:999px;background:var(--surface-2);overflow:hidden}.sim-budget-bar i{height:100%;display:block;min-width:4px}.sim-budget-bar i.ok{background:#22c55e}.sim-budget-bar i.fail{background:#ef4444}.sim-slo-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.sim-slo-stats>div{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);display:grid;gap:3px}.sim-slo-stats span{font-size:10px;color:var(--muted);text-transform:uppercase}.sim-slo-stats strong{font-size:.9rem}
@media(max-width:720px){.sim-responsive-wrap{grid-template-columns:1fr}.sim-responsive-meta{text-align:center}.sim-slo-stats{grid-template-columns:1fr}.sim-packet-list>div{grid-template-columns:44px 1fr}.sim-packet-list>div>i,.sim-packet-list>div>code:last-child{grid-column:2}}
/* Czech YouTube metadata cards */
.learning-resource-card.video .video-thumb .video-duration{position:absolute;right:8px;bottom:8px;padding:4px 7px;border-radius:7px;background:rgba(15,23,42,.88);color:#fff;font-size:.62rem;font-style:normal;font-weight:800;line-height:1;backdrop-filter:blur(5px)}
.learning-resource-card.video .video-meta-row{display:flex;flex-wrap:wrap;gap:5px;margin-top:1px}
.learning-resource-card.video .video-meta-row small{display:inline-flex;align-items:center;padding:3px 6px;border-radius:999px;background:var(--surface-2,#f1f5f9);color:var(--muted,#64748b);font-size:.61rem;font-weight:750;line-height:1.2}
.learning-resource-card.video .video-description{display:block;min-height:2.8em;font-size:.68rem!important;line-height:1.4!important;color:var(--muted,#64748b)!important}
.kb-lesson-resources .learning-resource-card.video .video-description{min-height:0}

/* Assessment SVG 2.0 ------------------------------------------------------ */
.assessment-svg-visual{padding:13px;min-height:0;gap:10px;overflow:hidden}
.assessment-svg-visual .visual-demo-head{align-items:center}
.assessment-svg-visual .visual-demo-head>div:first-child{display:grid;gap:3px}
.assessment-svg-visual .visual-demo-head strong{font-size:.86rem;text-align:left}
.visual-concept-chip{max-width:48%;font-size:.59rem;font-weight:850;color:var(--muted);border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 9px;text-align:right}
.assessment-what{display:grid;grid-template-columns:max-content 1fr;gap:9px;align-items:start;padding:8px 9px;background:var(--accent-soft);border-radius:10px}
.assessment-what span{font-size:.54rem;font-weight:950;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}
.assessment-what p{margin:0;font-size:.65rem;line-height:1.38;color:var(--text)}
.assessment-svg-stage{min-height:215px;display:grid;place-items:center;border:1px solid var(--line);border-radius:14px;background:radial-gradient(circle at 50% 0%,var(--accent-soft),transparent 45%),var(--surface);overflow:hidden;position:relative}
.av-svg{width:100%;height:auto;max-height:235px;display:block;overflow:visible}
.av-svg text{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;fill:var(--text);font-size:12px;font-weight:850;text-anchor:middle;dominant-baseline:middle}
.av-svg text.sub{font-size:9px;font-weight:700;fill:var(--muted)}
.av-svg .av-node rect,.av-svg .av-node circle,.av-svg .av-layer rect{fill:var(--surface-2);stroke:var(--line);stroke-width:2}
.av-svg .av-link,.av-svg .av-loop,.av-svg .layout-guide{stroke:var(--accent);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.av-svg .av-link.muted{stroke:var(--muted);stroke-dasharray:6 7}
.av-svg .av-marker{fill:var(--accent)}
.av-svg .av-packet,.av-svg .av-dora circle{fill:var(--accent);stroke:var(--surface);stroke-width:3;filter:drop-shadow(0 3px 5px color-mix(in srgb,var(--accent),transparent 55%))}
.av-svg .av-packet.alt,.av-svg .av-dora.alt circle{fill:#16a34a}
.av-svg .av-label{font-size:9px;fill:var(--muted);font-weight:800}
.av-svg .av-zone{fill:color-mix(in srgb,var(--accent-soft),transparent 45%);stroke:var(--line);stroke-width:1.5;stroke-dasharray:7 7}.av-svg .av-zone.alt-zone{fill:color-mix(in srgb,#16a34a 10%,var(--surface))}.av-svg .av-zone-label{text-anchor:start;font-size:9px;fill:var(--muted)}
.av-svg .av-error-label{font-size:9px;fill:#dc2626}
.av-svg .av-meter rect:first-of-type{fill:var(--surface-2);stroke:var(--line)}.av-svg .av-meter .fill{fill:var(--accent);stroke:none}.av-svg .av-meter text{font-size:9px;fill:var(--muted)}
.av-svg .av-time-axis{stroke:var(--line);stroke-width:3}.av-svg .av-capture-row{opacity:0}.av-svg .av-capture-row circle{fill:var(--accent)}.av-svg .av-capture-row rect{fill:var(--surface-2);stroke:var(--line)}.av-svg .av-capture-row text{text-anchor:start;font-size:10px}.av-svg .av-capture-row.row-2 rect,.av-svg .av-capture-row.row-3 rect{fill:color-mix(in srgb,var(--accent-soft),var(--surface) 70%)}
.av-svg .decision-node circle{fill:var(--surface-2);stroke:var(--line);stroke-width:2}.av-svg .decision-node text{font-size:9px}.av-svg .av-loop{stroke-dasharray:7 7}
.av-card-bg.low{fill:#d9d5e8}.av-card-title.low{fill:#9b92ba;font-size:28px}.av-card-copy.low{fill:#a9a1c4;font-size:10px}.av-card-bg.high{fill:#111827}.av-card-title.high{fill:#fff;font-size:28px}.av-card-copy.high{fill:#d1d5db;font-size:10px}.av-eye path{fill:none;stroke:var(--muted);stroke-width:2}.av-eye circle{fill:var(--accent)}
.poster-bg{fill:#111218}.poster-kicker-svg{fill:#d1d5db!important;font-size:9px!important;text-anchor:start!important}.poster-title-svg{fill:#fff!important;font-size:34px!important;text-anchor:start!important;letter-spacing:-1px}.poster-copy-svg{fill:#d1d5db!important;font-size:10px!important;text-anchor:start!important}.poster-cta-svg{fill:#b8ff50}.poster-cta-text-svg{fill:#111!important;font-size:9px!important}.av-focus-ring{fill:none;stroke:#b8ff50;stroke-width:4;filter:drop-shadow(0 0 7px #b8ff50)}
.type-bad rect,.type-good rect{fill:var(--surface-2);stroke:var(--line);stroke-width:2}.type-bad text{text-anchor:start;font-size:13px;fill:var(--muted)}.type-good text{text-anchor:start}.type-good .hero{font-size:27px;fill:var(--text)}.type-good .meta{font-size:10px;fill:var(--muted)}.type-good .cta{font-size:11px;fill:var(--accent)}
.layout-board{fill:var(--surface-2);stroke:var(--line);stroke-width:2}.layout-grid-line{stroke:color-mix(in srgb,var(--accent),transparent 68%);stroke-width:1}.layout-block{fill:var(--accent);opacity:.85}.layout-block.b2{fill:color-mix(in srgb,var(--accent),#16a34a 30%)}.layout-block.b3{fill:var(--text)}
.raster-side-svg>rect,.vector-side-svg>rect{fill:var(--surface-2);stroke:var(--line);stroke-width:2}.raster-side-svg>text,.vector-side-svg>text{font-size:10px;fill:var(--muted)}.raster-side-svg .px{fill:var(--accent)}.raster-side-svg .px.p1{opacity:.72}.raster-side-svg .px.p2{opacity:.42}.vector-side-svg path,.vector-side-svg circle{fill:none;stroke:var(--accent);stroke-width:6;stroke-linejoin:round}
.asset-state rect{fill:var(--surface-2);stroke:var(--line);stroke-width:2}.asset-state.bad .big{fill:#dc2626;font-size:48px}.asset-state.good .big{fill:#16a34a;font-size:48px}.asset-state text{font-size:11px}.asset-state .sub{font-size:9px}
.crop-subject{fill:#f59e0b;opacity:.9}.crop-frame{fill:none;stroke:#fff;stroke-width:3;stroke-dasharray:8 6}.crop-copy{fill:#fff!important;font-size:22px!important;text-anchor:start!important}.crop-copy.small{font-size:10px!important;opacity:.8}
.assessment-visual-controls{display:flex;gap:6px;flex-wrap:wrap}.assessment-visual-controls .demo-toggle{font-size:.61rem;padding:7px 9px}.assessment-visual-controls .primary-demo{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.assessment-evidence{border:1px solid color-mix(in srgb,var(--accent),var(--line) 55%);background:var(--surface);border-radius:11px;padding:9px 10px}.assessment-evidence span{display:block;font-size:.54rem;text-transform:uppercase;letter-spacing:.08em;font-weight:950;color:var(--accent);margin-bottom:3px}.assessment-evidence p{font-size:.64rem;line-height:1.4;margin:0;color:var(--text)}
.assessment-svg-visual.state-alt .layout-grid-line{opacity:.08}.assessment-svg-visual.state-alt .layout-block.b1{transform:translateX(34px)}.assessment-svg-visual.state-alt .av-card-bg.low{fill:#111827}.assessment-svg-visual.state-alt .av-card-title.low{fill:#fff}.assessment-svg-visual.state-alt .av-card-copy.low{fill:#d1d5db}.assessment-svg-visual.state-alt .raster-side-svg{transform:scale(1.08);transform-origin:167px 130px}.assessment-svg-visual.state-alt .poster-copy-svg{opacity:.18}.assessment-svg-visual.state-alt .type-bad{opacity:.35}.assessment-svg-visual.state-alt .asset-state.bad{opacity:.35}.assessment-svg-visual.state-alt .crop-frame{transform:translateX(70px)}
.assessment-svg-visual .layout-block,.assessment-svg-visual .type-bad,.assessment-svg-visual .asset-state,.assessment-svg-visual .crop-frame,.assessment-svg-visual .raster-side-svg,.assessment-svg-visual .poster-copy-svg{transition:.35s ease}
@media(max-width:900px){.assessment-svg-stage{min-height:180px}.av-svg{max-height:200px}.assessment-what{grid-template-columns:1fr}.visual-concept-chip{max-width:55%}}
@media(max-width:600px){.assessment-svg-visual{padding:10px}.assessment-svg-stage{min-height:160px}.assessment-visual-controls{display:grid;grid-template-columns:1fr 1fr}.assessment-visual-controls .demo-toggle:last-child{grid-column:1/-1}.visual-concept-chip{display:none}}
.assessment-svg-visual[data-av-kind="dns"].state-alt .av-link{stroke:#dc2626;stroke-dasharray:6 6}.assessment-svg-visual[data-av-kind="dns"].state-alt .av-node:last-of-type{opacity:.3}
.assessment-svg-visual[data-av-kind="dhcp"].state-alt .av-dora:last-child{opacity:.15}.assessment-svg-visual[data-av-kind="dhcp"].state-alt .av-link{stroke:#dc2626}
.assessment-svg-visual[data-av-kind="route"].state-alt .av-zone:first-of-type{stroke:var(--accent);stroke-width:3}.assessment-svg-visual[data-av-kind="route"].state-alt .route-main{stroke-width:5}
.assessment-svg-visual[data-av-kind="service"].state-alt .layer-2 rect,.assessment-svg-visual[data-av-kind="service"].state-alt .layer-1 rect{stroke:#dc2626;fill:color-mix(in srgb,#dc2626 12%,var(--surface))}.assessment-svg-visual[data-av-kind="service"].state-alt .av-packet{fill:#dc2626}
.assessment-svg-visual[data-av-kind="ssh"].state-alt .layer-2 rect{stroke:#dc2626;fill:color-mix(in srgb,#dc2626 12%,var(--surface))}.assessment-svg-visual[data-av-kind="ssh"].state-alt .av-error-label{font-weight:950;font-size:11px}
.assessment-svg-visual[data-av-kind="probe"].state-alt .av-meter .fill{fill:#dc2626}.assessment-svg-visual[data-av-kind="probe"].state-alt .av-packet.alt{fill:#dc2626}
.assessment-svg-visual[data-av-kind="packet"].state-alt .av-capture-row.row-2 rect{stroke:#dc2626;stroke-width:3}.assessment-svg-visual[data-av-kind="packet"].state-alt .av-capture-row.row-3{opacity:.18!important}
.assessment-svg-visual[data-av-kind="decision"].state-alt .decision-node.n3 circle,.assessment-svg-visual[data-av-kind="decision"].state-alt .decision-node.n5 circle{stroke:var(--accent);stroke-width:4;fill:var(--accent-soft)}

/* === 2026-09 full-width Knowledge lesson workspace === */
@media (min-width:1001px){
  body.view-kb_lesson{overflow:hidden}
  .view-kb_lesson .shell{width:calc(100% - 16px);max-width:none;margin:0 8px}
  .view-kb_lesson .topbar{min-height:64px}
  .view-kb_lesson main{padding:8px 0;height:calc(100vh - 64px);min-height:0}
  .view-kb_lesson .kb-lesson-screen{height:100%;min-height:0;grid-template-rows:auto auto minmax(0,1fr) auto;gap:7px;overflow:hidden}
  .view-kb_lesson .kb-lesson-toolbar{min-height:46px;border-radius:13px;padding:6px 10px;gap:12px}
  .view-kb_lesson .kb-lesson-title strong{font-size:.9rem}
  .view-kb_lesson .kb-lesson-meta span{padding:4px 7px;font-size:.56rem}
  .view-kb_lesson .kb-lesson-layout{display:block;min-height:0;overflow:hidden}
  .view-kb_lesson .kb-lesson-main{width:100%;height:100%;min-height:0;overflow:hidden}

  .kb-lesson-context-strip{min-height:58px;display:grid;grid-template-columns:minmax(260px,.9fr) minmax(420px,1.8fr) auto;gap:8px;align-items:stretch}
  .kb-context-summary,.kb-context-goals,.kb-resources-popover{border:1px solid var(--line);background:var(--surface);border-radius:13px;min-width:0}
  .kb-context-summary,.kb-context-goals{padding:9px 11px;display:grid;align-content:center;gap:3px}
  .kb-context-summary>span,.kb-context-goals>span{font-size:.55rem;line-height:1;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)}
  .kb-context-summary>strong{font-size:.71rem;line-height:1.28;font-weight:780;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .kb-context-goals>div{display:flex;gap:5px;align-items:center;min-width:0;overflow:hidden}
  .kb-context-goals b{display:block;min-width:0;max-width:33%;padding:4px 7px;border-radius:8px;background:var(--surface-2);font-size:.62rem;line-height:1.2;font-weight:760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .kb-resources-popover{position:relative;margin:0;padding:0;border-top:1px solid var(--line);display:flex;align-items:stretch}
  .kb-resources-popover summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:center;min-width:128px;padding:0 12px;font-size:.65rem;font-weight:900;color:var(--accent);white-space:nowrap}
  .kb-resources-popover summary::-webkit-details-marker{display:none}
  .kb-resources-popover summary:after{content:'↗';margin-left:7px;font-size:.75rem}
  .kb-resources-popover[open] summary{background:var(--accent-soft);border-radius:12px}
  .kb-resources-flyout{position:absolute;z-index:40;right:0;top:calc(100% + 7px);width:min(1120px,calc(100vw - 32px));max-height:70vh;overflow:auto;border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:0 22px 70px rgba(15,23,42,.18);padding:12px}
  .kb-resources-flyout .learning-resource-panel{margin:0;padding:0;border:0;box-shadow:none}
  .kb-resources-flyout .section-heading{display:none}

  .view-kb_lesson .kb-tour.compact-tour{height:100%;min-height:0;border-radius:15px;grid-template-rows:auto auto minmax(0,1fr) auto}
  .view-kb_lesson .compact-tour .kb-tour-tabs{min-height:42px}
  .view-kb_lesson .compact-tour .kb-tour-tabs button{padding:8px 7px;font-size:.66rem}
  .view-kb_lesson .compact-tour .lesson-gate-note{margin:5px 9px 0;padding:4px 8px;border-radius:9px;min-height:26px}
  .view-kb_lesson .compact-tour .lesson-gate-note p{font-size:.58rem;line-height:1.25;margin:0}
  .view-kb_lesson .compact-tour .kb-tab-panel{min-height:0;overflow:auto;padding:10px 13px 12px;overscroll-behavior:contain}
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]{display:grid;grid-template-columns:minmax(210px,.52fr) minmax(0,1.8fr) minmax(220px,.58fr);grid-template-rows:minmax(0,1fr) auto;gap:9px;align-items:stretch}
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"][hidden]{display:none}
  .view-kb_lesson .compact-tour .kb-mental-model{grid-template-columns:1fr;gap:5px;margin:0;padding:11px 12px;border-radius:13px;align-content:center;min-height:0}
  .view-kb_lesson .compact-tour .kb-mental-model span{font-size:.58rem}
  .view-kb_lesson .compact-tour .kb-mental-model p{font-size:.78rem;line-height:1.35}
  .view-kb_lesson .compact-tour .kb-demo-stage{grid-column:2;grid-row:1 / span 2;min-height:0;height:100%;max-height:none;border-radius:14px}
  .view-kb_lesson .compact-tour .kb-demo-toolbar{min-height:38px;padding:0 10px}
  .view-kb_lesson .compact-tour .kb-demo-caption{font-size:.68rem;line-height:1.35;margin:7px 10px 0}
  .view-kb_lesson .compact-tour .kb-tour-callout{grid-column:3;grid-row:1;margin:0;grid-template-columns:1fr;gap:5px;padding:11px 12px;border-radius:13px;border-left-width:3px;align-content:center}
  .view-kb_lesson .compact-tour .kb-tour-callout strong{font-size:.68rem}
  .view-kb_lesson .compact-tour .kb-tour-callout p{font-size:.72rem;line-height:1.35}
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{grid-column:1 / -1;grid-row:2;margin:0;min-height:46px;padding:7px 9px}
  .view-kb_lesson .compact-tour .step-commit strong{font-size:.72rem}
  .view-kb_lesson .compact-tour .step-commit span{font-size:.61rem;line-height:1.25}
  .view-kb_lesson .compact-tour .step-commit .btn{min-height:34px;padding:0 11px;font-size:.65rem}

  .view-kb_lesson .compact-tour .kb-stepper{padding:12px;border-radius:13px}
  .view-kb_lesson .compact-tour .kb-step-track{margin:8px 0 10px}
  .view-kb_lesson .compact-tour .kb-step-slide{min-height:128px;padding:16px}
  .view-kb_lesson .compact-tour .kb-step-slide h3{font-size:clamp(1.05rem,1.7vw,1.65rem);margin:6px 0 7px}
  .view-kb_lesson .compact-tour .kb-step-slide p{font-size:.75rem;line-height:1.4;margin:0}
  .view-kb_lesson .compact-tour .kb-step-actions{margin-top:9px}
  .view-kb_lesson .compact-tour .kb-mistakes{margin-top:10px}
  .view-kb_lesson .compact-tour .kb-mistakes h3{font-size:.9rem;margin:2px 0 7px}
  .view-kb_lesson .compact-tour .kb-mistake-grid>div{padding:8px 9px}
  .view-kb_lesson .compact-tour .kb-mistake-grid p{font-size:.68rem;line-height:1.3}

  .view-kb_lesson .compact-tour .kb-deep-grid{grid-template-columns:minmax(0,1.65fr) minmax(260px,.75fr);gap:12px}
  .view-kb_lesson .compact-tour .kb-deep-copy{max-width:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px;align-content:start}
  .view-kb_lesson .compact-tour .kb-deep-copy>.eyebrow,.view-kb_lesson .compact-tour .kb-deep-copy>h3{grid-column:1/-1}
  .view-kb_lesson .compact-tour .kb-deep-copy h3{font-size:1.1rem;margin:0 0 2px}
  .view-kb_lesson .compact-tour .kb-deep-copy p{font-size:.72rem;line-height:1.4;margin:0}
  .view-kb_lesson .compact-tour .kb-example-card{position:static;padding:13px;border-radius:13px}
  .view-kb_lesson .compact-tour .kb-example-card code{font-size:.72rem;line-height:1.4}
  .view-kb_lesson .compact-tour .kb-example-card p{font-size:.67rem;line-height:1.35;margin-top:9px;padding-top:8px}
  .view-kb_lesson .compact-tour .kb-more-explanation{margin-top:9px;border-radius:11px}
  .view-kb_lesson .compact-tour .kb-more-explanation summary{padding:9px 11px;font-size:.68rem}
  .view-kb_lesson .compact-tour .kb-more-explanation>div{padding:0 11px 10px}
  .view-kb_lesson .compact-tour .kb-more-explanation p{font-size:.69rem;line-height:1.4}

  .view-kb_lesson .compact-tour .kb-quiz-launch{padding:7px 10px;min-height:50px}
  .view-kb_lesson .compact-tour .kb-quiz-launch .eyebrow{font-size:.52rem;margin:0}
  .view-kb_lesson .compact-tour .kb-quiz-launch h3{font-size:.76rem;margin:1px 0}
  .view-kb_lesson .compact-tour .kb-quiz-launch p{display:none}
  .view-kb_lesson .compact-tour .kb-quiz-launch .btn{min-height:34px;padding:0 11px;font-size:.64rem}
  .view-kb_lesson .kb-lesson-pager{min-height:39px}
  .view-kb_lesson .kb-lesson-pager .btn{min-height:34px;padding:0 11px;font-size:.65rem}
}

@media (min-width:1001px) and (max-height:780px){
  .view-kb_lesson .topbar{min-height:58px}
  .view-kb_lesson main{height:calc(100vh - 58px);padding:5px 0}
  .view-kb_lesson .kb-lesson-screen{gap:5px}
  .kb-lesson-context-strip{min-height:49px}
  .kb-context-summary,.kb-context-goals{padding:6px 9px}
  .view-kb_lesson .compact-tour .lesson-gate-note{display:none}
  .view-kb_lesson .compact-tour .kb-tour-tabs{min-height:38px}
  .view-kb_lesson .compact-tour .kb-tour-tabs button{padding:6px}
  .view-kb_lesson .compact-tour .kb-tab-panel{padding:8px 10px}
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{min-height:40px}
  .view-kb_lesson .compact-tour .kb-quiz-launch{min-height:42px;padding:5px 8px}
  .view-kb_lesson .kb-lesson-pager{min-height:34px}
}

@media (max-width:1000px){
  .kb-lesson-context-strip{display:grid;gap:8px;margin-bottom:8px}
  .kb-context-summary,.kb-context-goals,.kb-resources-popover{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:12px}
  .kb-context-summary>span,.kb-context-goals>span{display:block;font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent);margin-bottom:5px}
  .kb-context-summary>strong{font-size:.78rem;line-height:1.35}
  .kb-context-goals>div{display:grid;gap:5px}
  .kb-context-goals b{font-size:.7rem;line-height:1.35;padding:6px 8px;background:var(--surface-2);border-radius:9px}
  .kb-resources-popover{padding:0}
  .kb-resources-popover summary{cursor:pointer;padding:11px 12px;font-size:.72rem;font-weight:900;color:var(--accent)}
  .kb-resources-flyout{padding:0 10px 10px}
}

/* Full lesson context stays readable; no clipped learning goals on wide screens. */
@media (min-width:1001px){
  .kb-context-summary>strong{white-space:normal;overflow:visible;text-overflow:clip;font-size:.68rem;line-height:1.25}
  .kb-context-goals>div{align-items:stretch;overflow:visible}
  .kb-context-goals b{flex:1 1 0;max-width:none;white-space:normal;overflow:visible;text-overflow:clip;font-size:.59rem;line-height:1.2;display:flex;align-items:center}
}

/* === 2026-09 Knowledge lesson layout refinement: bounded, readable, intentional === */
@media (min-width:1001px){
  body.view-kb_lesson{
    --kb-space-1:8px;
    --kb-space-2:12px;
    --kb-space-3:16px;
    --kb-space-4:24px;
    --kb-radius-sm:12px;
    --kb-radius-md:16px;
    --kb-workspace-max:1420px;
    overflow:hidden;
    background:linear-gradient(180deg,color-mix(in srgb,var(--surface-2) 62%,var(--bg)) 0,var(--bg) 180px);
  }
  .view-kb_lesson .shell{
    width:min(var(--kb-workspace-max),calc(100% - 48px));
    max-width:var(--kb-workspace-max);
    margin-inline:auto;
  }
  .view-kb_lesson .topbar{
    min-height:68px;
    gap:20px;
  }
  .view-kb_lesson main{
    height:calc(100dvh - 68px);
    min-height:0;
    padding:16px 0 18px;
  }
  .view-kb_lesson .kb-lesson-screen{
    height:100%;
    min-height:0;
    grid-template-rows:auto auto minmax(0,1fr) auto;
    gap:var(--kb-space-2);
    overflow:hidden;
  }

  /* Lesson header = calm hierarchy, not a full-width toolbar strip. */
  .view-kb_lesson .kb-lesson-toolbar{
    min-height:64px;
    grid-template-columns:110px minmax(0,1fr) auto;
    gap:var(--kb-space-3);
    padding:10px 14px;
    border-radius:var(--kb-radius-md);
    background:color-mix(in srgb,var(--surface) 96%,var(--accent-soft));
    box-shadow:0 8px 24px rgba(20,31,44,.045);
  }
  .view-kb_lesson .kb-lesson-back{
    display:inline-flex;
    align-items:center;
    min-height:36px;
    padding:0 10px;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface);
    font-size:.72rem;
  }
  .view-kb_lesson .kb-lesson-title span{
    font-size:.64rem;
    letter-spacing:.085em;
    margin-bottom:2px;
  }
  .view-kb_lesson .kb-lesson-title strong{
    font-size:1.05rem;
    line-height:1.2;
  }
  .view-kb_lesson .kb-lesson-meta{
    gap:7px;
  }
  .view-kb_lesson .kb-lesson-meta span{
    padding:6px 9px;
    font-size:.64rem;
    background:var(--surface);
  }

  /* Context card uses a stable 12-col feel instead of stretching tiny text. */
  .view-kb_lesson .kb-lesson-context-strip{
    min-height:78px;
    display:grid;
    grid-template-columns:minmax(280px,4fr) minmax(520px,7fr) 150px;
    gap:var(--kb-space-2);
    align-items:stretch;
  }
  .view-kb_lesson .kb-context-summary,
  .view-kb_lesson .kb-context-goals,
  .view-kb_lesson .kb-resources-popover{
    border:1px solid var(--line);
    border-radius:var(--kb-radius-md);
    background:var(--surface);
    box-shadow:0 5px 18px rgba(20,31,44,.035);
  }
  .view-kb_lesson .kb-context-summary,
  .view-kb_lesson .kb-context-goals{
    padding:12px 14px;
    display:grid;
    align-content:center;
    gap:6px;
  }
  .view-kb_lesson .kb-context-summary>span,
  .view-kb_lesson .kb-context-goals>span{
    font-size:.61rem;
    line-height:1;
    letter-spacing:.09em;
  }
  .view-kb_lesson .kb-context-summary>strong{
    font-size:.77rem;
    line-height:1.35;
    font-weight:760;
  }
  .view-kb_lesson .kb-context-goals>div{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    align-items:stretch;
  }
  .view-kb_lesson .kb-context-goals b{
    min-width:0;
    max-width:none;
    padding:7px 9px 7px 11px;
    border:1px solid color-mix(in srgb,var(--line) 78%,transparent);
    border-left:3px solid color-mix(in srgb,var(--accent) 55%,var(--line));
    border-radius:10px;
    background:var(--surface-2);
    font-size:.66rem;
    line-height:1.3;
    font-weight:720;
    white-space:normal;
    overflow:visible;
  }
  .view-kb_lesson .kb-resources-popover{
    margin:0;
    padding:0;
    border-top:1px solid var(--line);
    display:flex;
    align-items:stretch;
  }
  .view-kb_lesson .kb-resources-popover summary{
    width:100%;
    min-width:0;
    padding:0 14px;
    font-size:.68rem;
    line-height:1.25;
    text-align:center;
  }
  .view-kb_lesson .kb-resources-flyout{
    width:min(980px,calc(100vw - 64px));
    max-height:68vh;
    padding:16px;
  }

  /* Main lesson canvas: one framed workspace with consistent internal spacing. */
  .view-kb_lesson .kb-lesson-layout,
  .view-kb_lesson .kb-lesson-main{
    min-height:0;
    overflow:hidden;
  }
  .view-kb_lesson .kb-tour.compact-tour{
    height:100%;
    min-height:0;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
    box-shadow:0 12px 34px rgba(20,31,44,.055);
    grid-template-rows:auto auto minmax(0,1fr) auto;
  }
  .view-kb_lesson .compact-tour .kb-tour-tabs{
    min-height:52px;
    padding:7px;
    gap:6px;
    border-bottom:1px solid var(--line);
    background:color-mix(in srgb,var(--surface-2) 62%,var(--surface));
  }
  .view-kb_lesson .compact-tour .kb-tour-tabs button{
    min-height:36px;
    padding:7px 12px;
    border-radius:10px;
    font-size:.7rem;
    line-height:1.1;
  }
  .view-kb_lesson .compact-tour .kb-tour-tabs button span{
    width:21px;
    height:21px;
    font-size:.6rem;
  }
  .view-kb_lesson .compact-tour .lesson-gate-note{
    margin:8px 12px 0;
    padding:6px 9px;
    min-height:30px;
    border-radius:10px;
  }
  .view-kb_lesson .compact-tour .lesson-gate-note p{
    font-size:.64rem;
    line-height:1.35;
  }
  .view-kb_lesson .compact-tour .kb-tab-panel{
    min-height:0;
    overflow:auto;
    padding:16px 18px 18px;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
  }

  /* Visual step: clear information rail + primary interactive stage. */
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]{
    display:grid;
    grid-template-columns:minmax(260px,320px) minmax(0,1fr);
    grid-template-rows:minmax(0,1fr) auto;
    gap:14px 18px;
    align-items:stretch;
  }
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"][hidden]{display:none}
  .view-kb_lesson .compact-tour .kb-mental-model{
    grid-column:1;
    grid-row:1;
    display:grid;
    align-content:start;
    gap:7px;
    margin:0;
    padding:16px;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--surface-2);
  }
  .view-kb_lesson .compact-tour .kb-mental-model span{
    font-size:.62rem;
    letter-spacing:.08em;
  }
  .view-kb_lesson .compact-tour .kb-mental-model p{
    margin:0;
    font-size:.82rem;
    line-height:1.48;
    color:var(--text);
  }
  .view-kb_lesson .compact-tour .kb-tour-callout{
    grid-column:1;
    grid-row:1;
    align-self:end;
    margin:0 10px 10px;
    padding:12px 13px;
    border-radius:12px;
    background:var(--surface);
    box-shadow:0 7px 20px rgba(20,31,44,.06);
  }
  .view-kb_lesson .compact-tour .kb-tour-callout strong{font-size:.7rem}
  .view-kb_lesson .compact-tour .kb-tour-callout p{
    margin:4px 0 0;
    font-size:.72rem;
    line-height:1.4;
  }
  .view-kb_lesson .compact-tour .kb-demo-stage{
    grid-column:2;
    grid-row:1;
    min-height:0;
    height:100%;
    max-height:none;
    border:1px solid var(--line);
    border-radius:15px;
    background:color-mix(in srgb,var(--surface-2) 46%,var(--surface));
    overflow:hidden;
  }
  .view-kb_lesson .compact-tour .kb-demo-toolbar{
    min-height:44px;
    padding:0 13px;
    border-bottom:1px solid var(--line);
  }
  .view-kb_lesson .compact-tour .kb-demo-caption{
    margin:9px 13px 0;
    font-size:.72rem;
    line-height:1.4;
  }
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{
    grid-column:1 / -1;
    grid-row:2;
    margin:0;
    min-height:56px;
    padding:9px 12px;
    border-radius:13px;
  }
  .view-kb_lesson .compact-tour .step-commit strong{font-size:.76rem}
  .view-kb_lesson .compact-tour .step-commit span{font-size:.66rem;line-height:1.35}
  .view-kb_lesson .compact-tour .step-commit .btn{min-height:38px;padding:0 14px;font-size:.68rem}

  /* Procedure and deep-dive cards follow the same 8px rhythm and readable measure. */
  .view-kb_lesson .compact-tour .kb-stepper{
    max-width:1040px;
    margin-inline:auto;
    padding:18px;
    border-radius:15px;
  }
  .view-kb_lesson .compact-tour .kb-step-track{margin:10px 0 14px}
  .view-kb_lesson .compact-tour .kb-step-slide{
    min-height:150px;
    padding:20px 22px;
    border-radius:14px;
  }
  .view-kb_lesson .compact-tour .kb-step-slide h3{
    max-width:820px;
    font-size:clamp(1.05rem,1.45vw,1.4rem);
    line-height:1.18;
    margin:7px 0 9px;
  }
  .view-kb_lesson .compact-tour .kb-step-slide p{
    max-width:820px;
    font-size:.78rem;
    line-height:1.5;
  }
  .view-kb_lesson .compact-tour .kb-mistakes{
    max-width:1040px;
    margin:14px auto 0;
  }
  .view-kb_lesson .compact-tour .kb-mistake-grid{gap:9px}
  .view-kb_lesson .compact-tour .kb-mistake-grid>div{padding:10px 11px}
  .view-kb_lesson .compact-tour .kb-mistake-grid p{font-size:.71rem;line-height:1.4}

  .view-kb_lesson .compact-tour .kb-deep-grid{
    width:min(1120px,100%);
    margin-inline:auto;
    grid-template-columns:minmax(0,1.45fr) minmax(280px,.65fr);
    gap:20px;
    align-items:start;
  }
  .view-kb_lesson .compact-tour .kb-deep-copy{
    max-width:none;
    display:block;
    padding-right:10px;
  }
  .view-kb_lesson .compact-tour .kb-deep-copy>.eyebrow,
  .view-kb_lesson .compact-tour .kb-deep-copy>h3{grid-column:auto}
  .view-kb_lesson .compact-tour .kb-deep-copy h3{
    font-size:1.22rem;
    margin:0 0 10px;
  }
  .view-kb_lesson .compact-tour .kb-deep-copy p{
    max-width:76ch;
    font-size:.78rem;
    line-height:1.56;
    margin:0 0 10px;
  }
  .view-kb_lesson .compact-tour .kb-example-card{
    position:sticky;
    top:0;
    padding:16px;
    border-radius:14px;
  }
  .view-kb_lesson .compact-tour .kb-example-card code{font-size:.76rem;line-height:1.5}
  .view-kb_lesson .compact-tour .kb-example-card p{font-size:.7rem;line-height:1.45}
  .view-kb_lesson .compact-tour .kb-more-explanation{
    width:min(1120px,100%);
    margin:14px auto 0;
    border-radius:12px;
  }
  .view-kb_lesson .compact-tour .kb-more-explanation summary{padding:11px 13px;font-size:.72rem}
  .view-kb_lesson .compact-tour .kb-more-explanation>div{padding:0 13px 12px}
  .view-kb_lesson .compact-tour .kb-more-explanation p{font-size:.73rem;line-height:1.5}

  .view-kb_lesson .compact-tour .kb-quiz-launch{
    min-height:64px;
    padding:9px 14px;
    border-top:1px solid var(--line);
  }
  .view-kb_lesson .compact-tour .kb-quiz-launch .eyebrow{font-size:.57rem}
  .view-kb_lesson .compact-tour .kb-quiz-launch h3{font-size:.82rem;margin:2px 0}
  .view-kb_lesson .compact-tour .kb-quiz-launch .btn{min-height:38px;padding:0 14px;font-size:.68rem}

  .view-kb_lesson .kb-lesson-pager{
    min-height:46px;
    padding:0 2px;
  }
  .view-kb_lesson .kb-lesson-pager .btn{
    min-height:38px;
    padding:0 14px;
    font-size:.69rem;
  }
  .view-kb_lesson .kb-lesson-progress-note{font-size:.66rem}
}

/* Slightly narrower laptops: preserve structure, reduce only non-essential chrome. */
@media (min-width:1001px) and (max-width:1280px){
  .view-kb_lesson .shell{width:calc(100% - 32px)}
  .view-kb_lesson .kb-lesson-context-strip{grid-template-columns:minmax(250px,4fr) minmax(440px,7fr) 132px}
  .view-kb_lesson .kb-context-goals b{font-size:.62rem;padding:6px 7px 6px 9px}
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]{grid-template-columns:280px minmax(0,1fr);gap:12px 14px}
}

@media (min-width:1001px) and (max-height:780px){
  .view-kb_lesson .topbar{min-height:60px}
  .view-kb_lesson main{height:calc(100dvh - 60px);padding:9px 0 10px}
  .view-kb_lesson .kb-lesson-screen{gap:8px}
  .view-kb_lesson .kb-lesson-toolbar{min-height:54px;padding:7px 11px}
  .view-kb_lesson .kb-lesson-context-strip{min-height:66px}
  .view-kb_lesson .kb-context-summary,.view-kb_lesson .kb-context-goals{padding:9px 11px}
  .view-kb_lesson .compact-tour .kb-tour-tabs{min-height:46px;padding:5px}
  .view-kb_lesson .compact-tour .lesson-gate-note{display:none}
  .view-kb_lesson .compact-tour .kb-tab-panel{padding:12px 14px 13px}
  .view-kb_lesson .compact-tour .kb-mental-model{padding:12px}
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{min-height:48px;padding:6px 9px}
  .view-kb_lesson .compact-tour .kb-quiz-launch{min-height:52px;padding:6px 11px}
  .view-kb_lesson .kb-lesson-pager{min-height:38px}
}
@media (min-width:1001px){
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]{
    grid-template-rows:minmax(0,1fr) auto auto;
  }
  .view-kb_lesson .compact-tour .kb-mental-model{
    grid-column:1;
    grid-row:1;
  }
  .view-kb_lesson .compact-tour .kb-tour-callout{
    grid-column:1;
    grid-row:2;
    align-self:stretch;
    margin:0;
    box-shadow:none;
  }
  .view-kb_lesson .compact-tour .kb-demo-stage{
    grid-column:2;
    grid-row:1 / span 2;
  }
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{
    grid-column:1/-1;
    grid-row:3;
  }
}

/* ========================================================================== */
/* KB LESSON UX 3.0 — natural document flow, modern labs, no nested scrolling */
/* ========================================================================== */
.view-kb_lesson{
  --kb-max:1320px;
  --kb-gap:20px;
  --kb-radius:18px;
}
.view-kb_lesson,
.view-kb_lesson body{overflow:auto!important}
.view-kb_lesson .shell{width:min(var(--kb-max),calc(100% - 40px));margin-inline:auto}
.view-kb_lesson main{height:auto!important;min-height:0!important;padding:20px 0 56px!important;overflow:visible!important}
.view-kb_lesson .kb-lesson-screen{height:auto!important;min-height:0!important;display:grid!important;grid-template-rows:auto!important;gap:14px!important;overflow:visible!important}
.view-kb_lesson .kb-lesson-toolbar{
  min-height:0!important;padding:12px 14px!important;border:1px solid var(--line);border-radius:16px;
  background:var(--surface);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;
  box-shadow:0 8px 26px rgba(20,31,44,.04)
}
.view-kb_lesson .kb-lesson-back{min-height:36px!important;padding:0 11px!important;border-radius:10px;background:var(--surface-2);display:inline-flex;align-items:center;text-decoration:none;font-size:.72rem;font-weight:850}
.view-kb_lesson .kb-lesson-title{min-width:0;display:grid;gap:2px}
.view-kb_lesson .kb-lesson-title span{font-size:.62rem!important;line-height:1.2;color:var(--muted);font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.view-kb_lesson .kb-lesson-title strong{font-size:clamp(1rem,1.4vw,1.28rem)!important;line-height:1.2!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.view-kb_lesson .kb-lesson-meta{display:flex!important;gap:7px!important;flex-wrap:wrap;justify-content:flex-end}
.view-kb_lesson .kb-lesson-meta span{padding:6px 9px!important;border-radius:999px;background:var(--surface-2);font-size:.64rem!important;font-weight:800}

.view-kb_lesson .kb-lesson-context-strip{
  min-height:0!important;display:grid!important;grid-template-columns:minmax(260px,1fr) minmax(0,1.55fr) auto!important;gap:12px!important;align-items:stretch!important;
  overflow:visible!important;margin:0!important
}
.view-kb_lesson .kb-context-summary,
.view-kb_lesson .kb-context-goals,
.view-kb_lesson .kb-resources-popover{border:1px solid var(--line)!important;border-radius:16px!important;background:var(--surface)!important;box-shadow:none!important}
.view-kb_lesson .kb-context-summary,
.view-kb_lesson .kb-context-goals{padding:14px 16px!important;display:grid!important;align-content:center!important;gap:7px!important}
.view-kb_lesson .kb-context-summary>span,
.view-kb_lesson .kb-context-goals>span{font-size:.62rem!important;text-transform:uppercase;letter-spacing:.09em;font-weight:900;color:var(--accent);margin:0!important}
.view-kb_lesson .kb-context-summary>strong{font-size:.78rem!important;line-height:1.42!important;font-weight:760!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.view-kb_lesson .kb-context-goals>div{display:flex!important;gap:7px!important;align-items:stretch!important;overflow:visible!important;flex-wrap:wrap}
.view-kb_lesson .kb-context-goals b{flex:1 1 160px!important;max-width:none!important;padding:8px 10px!important;border:1px solid var(--line)!important;border-radius:10px!important;background:var(--surface-2)!important;font-size:.67rem!important;line-height:1.34!important;font-weight:730!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.view-kb_lesson .kb-resources-popover{display:flex!important;align-items:stretch!important;padding:0!important;margin:0!important;min-width:150px}
.view-kb_lesson .kb-resources-popover summary{display:flex;align-items:center;justify-content:center;padding:0 16px!important;min-height:100%;font-size:.7rem!important;font-weight:850;cursor:pointer;list-style:none}
.view-kb_lesson .kb-resources-popover summary::-webkit-details-marker{display:none}

.view-kb_lesson .kb-lesson-layout,
.view-kb_lesson .kb-lesson-main{display:block!important;height:auto!important;min-height:0!important;overflow:visible!important;width:100%!important}
.view-kb_lesson .kb-tour.compact-tour{height:auto!important;min-height:0!important;overflow:visible!important;display:block!important;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 10px 34px rgba(20,31,44,.045)}
.view-kb_lesson .compact-tour .kb-tour-tabs{position:static!important;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px!important;padding:8px!important;border:0!important;border-bottom:1px solid var(--line)!important;background:var(--surface-2)!important;border-radius:20px 20px 0 0;min-height:0!important}
.view-kb_lesson .compact-tour .kb-tour-tabs.has-simulation{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.view-kb_lesson .compact-tour .kb-tour-tabs button{min-height:42px!important;padding:8px 11px!important;border:1px solid transparent!important;border-radius:11px!important;background:transparent!important;font-size:.72rem!important;justify-content:center}
.view-kb_lesson .compact-tour .kb-tour-tabs button.active{background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important;box-shadow:0 4px 14px rgba(20,31,44,.05)!important}
.view-kb_lesson .compact-tour .kb-tour-tabs button.done:not(.active){color:var(--ok)}
.view-kb_lesson .compact-tour .lesson-gate-note{margin:10px 16px 0!important;padding:8px 10px!important;min-height:0!important;background:transparent!important;border:0!important;border-radius:0!important}
.view-kb_lesson .compact-tour .lesson-gate-note p{font-size:.68rem!important;line-height:1.4!important}
.view-kb_lesson .compact-tour .kb-tab-panel{height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;overscroll-behavior:auto!important;scrollbar-gutter:auto!important;padding:18px!important}

/* Visual step: one clear flow, no nested scroll areas. */
.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(260px,340px)!important;grid-template-rows:auto auto auto!important;gap:14px!important;align-items:start!important}
.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"][hidden]{display:none!important}
.view-kb_lesson .compact-tour .kb-mental-model{grid-column:1 / -1!important;grid-row:auto!important;margin:0!important;padding:13px 15px!important;border-radius:13px!important;display:grid!important;grid-template-columns:128px 1fr!important;gap:14px!important;align-items:start!important;background:linear-gradient(135deg,var(--accent-soft),var(--surface))!important}
.view-kb_lesson .compact-tour .kb-mental-model span{font-size:.62rem!important;letter-spacing:.08em!important}
.view-kb_lesson .compact-tour .kb-mental-model p{font-size:.82rem!important;line-height:1.45!important;font-weight:650!important}
.view-kb_lesson .compact-tour .kb-demo-stage{grid-column:1!important;grid-row:2 / span 2!important;height:auto!important;min-height:420px!important;max-height:none!important;overflow:visible!important;border:1px solid var(--line)!important;border-radius:16px!important;background:var(--surface)!important;display:flex!important;flex-direction:column!important}
.view-kb_lesson .compact-tour .kb-tour-callout{grid-column:2!important;grid-row:2!important;align-self:start!important;margin:0!important;padding:14px!important;border:1px solid var(--line)!important;border-radius:13px!important;background:var(--surface-2)!important;box-shadow:none!important}
.view-kb_lesson .compact-tour .kb-tour-callout strong{font-size:.74rem!important}
.view-kb_lesson .compact-tour .kb-tour-callout p{font-size:.72rem!important;line-height:1.48!important;margin:5px 0 0!important}
.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{grid-column:2!important;grid-row:3!important;align-self:end!important;margin:0!important;padding:14px!important;border:1px solid var(--line)!important;border-radius:13px!important;display:grid!important;gap:12px!important;background:var(--surface)!important;min-height:0!important}
.view-kb_lesson .compact-tour .step-commit>div{min-width:0}
.view-kb_lesson .compact-tour .step-commit strong{font-size:.76rem!important}
.view-kb_lesson .compact-tour .step-commit span{font-size:.68rem!important;line-height:1.4!important}
.view-kb_lesson .compact-tour .step-commit .btn{min-height:40px!important;width:100%;padding:0 12px!important;font-size:.7rem!important}

/* New interactive demo surface. */
.kb-demo-toolbar{min-height:50px!important;padding:9px 12px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;border-bottom:1px solid var(--line)!important;background:var(--surface-2)!important;border-radius:16px 16px 0 0}
.kb-demo-live{display:flex!important;align-items:center!important;gap:7px!important;min-width:0;color:var(--text)!important;font-weight:850!important;font-size:.7rem!important;text-transform:none!important;letter-spacing:0!important}
.kb-demo-live i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 13%,transparent)}
.kb-demo-live b{font-size:.61rem;color:var(--muted);font-weight:700;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px 7px}
.kb-demo-toolbar-actions{display:flex;gap:7px;align-items:center}
.kb-demo-toolbar button{border:1px solid var(--line);background:var(--surface);color:var(--text);min-height:34px;padding:0 10px;border-radius:9px;font-size:.64rem;font-weight:850;cursor:pointer}
.kb-demo-toolbar button:hover{border-color:var(--accent);color:var(--accent)}
.kb-demo-generic-canvas{flex:1;min-height:340px;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 0%,var(--accent-soft),transparent 34%)}
.kb-demo-generic-canvas [data-demo-step]{opacity:.28;filter:saturate(.4);transform:scale(.985);transition:opacity .25s ease,filter .25s ease,transform .25s ease,box-shadow .25s ease}
.kb-demo-generic-canvas [data-demo-step].revealed{opacity:.7;filter:none;transform:none}
.kb-demo-generic-canvas [data-demo-step].is-focus{opacity:1;filter:none;transform:translateY(-2px);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}

.kb-interactive-demo{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(250px,.65fr);gap:0;min-height:390px;flex:1}
.kb-demo-canvas{min-width:0;padding:24px;display:grid;place-items:center;align-content:center;gap:14px;background:radial-gradient(circle at 25% 5%,var(--accent-soft),transparent 34%),var(--surface)}
.kb-demo-controls{border-left:1px solid var(--line);background:var(--surface-2);padding:16px;display:grid;align-content:start;gap:14px}
.demo-control-head{display:grid;gap:3px;padding-bottom:2px}.demo-control-head span,.demo-rule span{font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);font-weight:900}.demo-control-head strong{font-size:.78rem;line-height:1.35}
.demo-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.demo-presets button{min-height:34px;border:1px solid var(--line);background:var(--surface);border-radius:8px;font-size:.62rem;font-weight:850;cursor:pointer;color:var(--muted)}.demo-presets button.active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.demo-range{display:grid;gap:7px}.demo-range>span{display:flex;justify-content:space-between;gap:10px;font-size:.66rem;font-weight:750;color:var(--muted)}.demo-range b{color:var(--text)}.demo-range input[type="range"]{width:100%;accent-color:var(--accent)}
.demo-switch{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;font-size:.67rem;cursor:pointer}.demo-switch input{position:absolute;opacity:0}.demo-switch>span{width:34px;height:20px;border-radius:999px;background:var(--line);position:relative;transition:.2s}.demo-switch>span:after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:#fff;top:3px;left:3px;box-shadow:0 2px 6px rgba(0,0,0,.2);transition:.2s}.demo-switch input:checked+span{background:var(--accent)}.demo-switch input:checked+span:after{transform:translateX(14px)}
.demo-color,.demo-select{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;font-size:.66rem;font-weight:750;color:var(--muted)}.demo-color input{width:48px;height:32px;border:1px solid var(--line);padding:2px;border-radius:8px;background:var(--surface)}.demo-select select{min-width:110px;border:1px solid var(--line);border-radius:8px;background:var(--surface);padding:7px 9px;color:var(--text)}
.demo-rule{padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:var(--surface)}.demo-rule p{font-size:.66rem;line-height:1.45;margin:5px 0 0;color:var(--muted)}

/* Hierarchy Lab */
.hierarchy-canvas{grid-template-columns:minmax(280px,430px) minmax(160px,220px);align-items:center;justify-content:center}
.hierarchy-poster{--h-title:36px;--h-meta:22px;--h-cta:15px;--h-space:8px;position:relative;width:min(100%,390px);aspect-ratio:4/5;border-radius:18px;padding:28px;background:linear-gradient(160deg,#15122c 0%,#281952 52%,#4a1d72 100%);color:white;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:var(--h-space);box-shadow:0 24px 55px rgba(24,16,56,.25);overflow:hidden;transition:width .25s ease,transform .25s ease}
.hierarchy-poster:before{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-110px;top:-70px;background:radial-gradient(circle,#a78bfa,transparent 68%);opacity:.32}
.hierarchy-kicker{font-size:10px;letter-spacing:.16em;font-weight:850;color:#c4b5fd;position:relative;z-index:2}
.hierarchy-title{font-size:var(--h-title);line-height:.88;letter-spacing:-.055em;position:relative;z-index:2;transition:font-size .18s ease}
.hierarchy-meta{font-size:var(--h-meta)!important;line-height:1.1;margin:0!important;color:#ede9fe!important;font-weight:720;position:relative;z-index:2;transition:font-size .18s ease}
.hierarchy-cta{font-size:var(--h-cta);padding:9px 13px;border:0;border-radius:8px;background:#f8fafc;color:#1f163f;font-weight:900;position:relative;z-index:2;transition:font-size .18s ease}
.hierarchy-note{font-size:9px;line-height:1.3;color:#c4b5fd;position:relative;z-index:2}
.hierarchy-eye-path{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.92}.hierarchy-eye-path path{fill:none;stroke:#fde047;stroke-width:1.5;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}.hierarchy-eye-path circle{fill:#fde047;filter:drop-shadow(0 0 4px rgba(253,224,71,.7))}.hierarchy-eye-path.is-strong path{animation:kbEyeFlow 1.9s linear infinite}
@keyframes kbEyeFlow{to{stroke-dashoffset:-16}}
.hierarchy-poster.thumbnail{width:175px;transform:translateZ(0)}
.hierarchy-insight{display:grid;gap:5px;align-content:center}.hierarchy-insight span,.contrast-readout span,.grid-insight span,.scale-readout span{font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:900}.hierarchy-insight strong,.contrast-readout strong,.grid-insight strong,.scale-readout strong{font-size:1rem;line-height:1.2}.hierarchy-insight p,.contrast-readout p{font-size:.68rem;line-height:1.48;margin:0;color:var(--muted)}

/* Grid Lab */
.grid-live-canvas{width:min(100%,680px);aspect-ratio:16/9;border-radius:15px;background:#0f172a;position:relative;overflow:hidden;padding:var(--grid-margin);box-shadow:0 20px 45px rgba(15,23,42,.17)}
.grid-live-lines{position:absolute;inset:var(--grid-margin);display:grid;grid-template-columns:repeat(var(--grid-cols),1fr);gap:var(--grid-gap);pointer-events:none}.grid-live-lines i{background:rgba(129,140,248,.12);border-left:1px solid rgba(165,180,252,.24);border-right:1px solid rgba(165,180,252,.24)}
.grid-live-content{position:relative;height:100%;display:grid;grid-template-columns:1.1fr .9fr;grid-template-rows:auto 1fr auto;gap:12px;color:#fff;transition:.25s}.grid-live-content>strong{font-size:clamp(1.4rem,3vw,2.8rem);line-height:.9;align-self:start}.grid-live-image{grid-column:2;grid-row:1/3;background:linear-gradient(135deg,#7c3aed,#db2777);display:grid;place-items:center;border-radius:10px;font-weight:900}.grid-live-content p{margin:0!important;color:#cbd5e1!important;font-size:.72rem!important;align-self:end}.grid-live-content>b{grid-column:2;justify-self:end;align-self:end;background:#fff;color:#111827;border-radius:8px;padding:7px 9px;font-size:.65rem}.grid-live-content.aligned>*{transform:none!important}.grid-live-content:not(.aligned)>strong{transform:translateX(17px)}.grid-live-content:not(.aligned) p{transform:translateX(-9px)}.grid-live-content:not(.aligned)>b{transform:translateX(-21px)}
.grid-insight,.scale-readout{display:flex;gap:8px;align-items:baseline;justify-content:center;flex-wrap:wrap}

/* Contrast Lab */
.contrast-live-card{width:min(100%,620px);min-height:300px;border-radius:16px;padding:32px;background:var(--contrast-bg);color:var(--contrast-text);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px;transition:background .2s,color .2s;box-shadow:0 20px 45px rgba(15,23,42,.12)}
.contrast-live-card span{font-size:.62rem;font-weight:900;letter-spacing:.12em}.contrast-live-card strong{font-size:clamp(2.2rem,5vw,4.6rem);line-height:.9;letter-spacing:-.06em}.contrast-live-card p{margin:0!important;color:inherit!important;font-size:.86rem!important}.contrast-live-card button{border:2px solid currentColor;color:inherit;background:transparent;border-radius:8px;padding:8px 11px;font-weight:850}
.contrast-readout{display:grid;gap:4px;text-align:center}.contrast-readout.ok strong{color:var(--ok)}.contrast-readout.warn strong{color:#b45309}

/* Raster/vector Lab */
.scale-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:min(100%,680px)}.scale-card{min-height:260px;border:1px solid var(--line);border-radius:14px;background:var(--surface);display:grid;place-items:center;align-content:center;gap:8px;overflow:hidden}.scale-card .scale-logo{width:86px;height:86px;border-radius:20px;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:3rem;font-weight:950;transform:scale(var(--scale,1));transform-origin:center;transition:transform .2s;image-rendering:auto}.scale-card.raster.pixelated .scale-logo{image-rendering:pixelated;filter:contrast(1.15)}.scale-card.vector svg{width:90px;height:90px;transform:scale(var(--scale,1));transition:transform .2s;overflow:visible}.scale-card.vector path,.scale-card.vector circle{fill:var(--accent)}.scale-card strong{font-size:.75rem}.scale-card small{font-size:.62rem;color:var(--muted)}

/* Export Lab */
.export-live-preview{position:relative;width:min(100%,680px);aspect-ratio:16/9;border-radius:16px;background:linear-gradient(135deg,#111827,#312e81);color:#fff;padding:34px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;overflow:hidden;box-shadow:0 20px 45px rgba(15,23,42,.18)}.export-live-preview span{font-size:.6rem;letter-spacing:.15em;font-weight:900;color:#c4b5fd}.export-live-preview strong{font-size:clamp(2.2rem,5vw,4.8rem);line-height:.86;letter-spacing:-.06em}.export-live-preview i{position:absolute;inset:0;opacity:0;background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 2px,transparent 2px 5px);pointer-events:none}.export-live-preview.artifacts i{opacity:.85}.export-live-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(100%,680px)}.export-live-metrics>div{padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);display:grid;gap:2px}.export-live-metrics span{font-size:.56rem;color:var(--muted);text-transform:uppercase}.export-live-metrics b{font-size:.72rem}

/* Remaining tabs use natural flow; long text scrolls the page, never a panel. */
.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="simulate"],
.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="steps"],
.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="deep"]{display:block;overflow:visible!important;max-height:none!important}
.view-kb_lesson .compact-tour .kb-tab-panel[hidden]{display:none!important}
.view-kb_lesson .compact-tour .kb-stepper{max-width:980px!important;margin:0 auto!important;padding:18px!important}
.view-kb_lesson .compact-tour .kb-step-slide{min-height:0!important;padding:20px!important}
.view-kb_lesson .compact-tour .kb-deep-grid{width:min(1080px,100%)!important;grid-template-columns:minmax(0,1.5fr) minmax(260px,.65fr)!important;gap:24px!important}
.view-kb_lesson .compact-tour .kb-example-card{position:static!important}
.view-kb_lesson .compact-tour .kb-more-explanation{width:min(1080px,100%)!important}
.view-kb_lesson .compact-tour .kb-quiz-launch{min-height:0!important;padding:14px 18px!important}
.view-kb_lesson .kb-lesson-pager{min-height:0!important;padding:2px!important;margin-top:0;display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center}
.view-kb_lesson .kb-lesson-pager>div:last-child{justify-self:end}
.view-kb_lesson .kb-lesson-pager .btn{min-height:40px!important;padding:0 14px!important;font-size:.7rem!important}
.view-kb_lesson .kb-lesson-progress-note{font-size:.66rem!important;color:var(--muted)}

@media(max-width:1050px){
  .view-kb_lesson .shell{width:min(100% - 28px,var(--kb-max))}
  .view-kb_lesson .kb-lesson-context-strip{grid-template-columns:1fr 1fr!important}.view-kb_lesson .kb-resources-popover{grid-column:1/-1;min-height:44px}
  .view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]{grid-template-columns:1fr!important}.view-kb_lesson .compact-tour .kb-demo-stage{grid-column:1!important;grid-row:auto!important}.view-kb_lesson .compact-tour .kb-tour-callout{grid-column:1!important;grid-row:auto!important}.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{grid-column:1!important;grid-row:auto!important;display:flex!important}
  .kb-interactive-demo{grid-template-columns:1fr}.kb-demo-controls{border-left:0;border-top:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr))}.demo-control-head,.demo-rule{grid-column:1/-1}.hierarchy-canvas{grid-template-columns:minmax(280px,430px) minmax(150px,190px)}
}
@media(max-width:720px){
  .view-kb_lesson .shell{width:calc(100% - 20px)}.view-kb_lesson main{padding-top:10px!important}.view-kb_lesson .kb-lesson-toolbar{grid-template-columns:auto 1fr;gap:10px}.view-kb_lesson .kb-lesson-meta{grid-column:1/-1;justify-content:flex-start}.view-kb_lesson .kb-lesson-context-strip{grid-template-columns:1fr!important}.view-kb_lesson .compact-tour .kb-tour-tabs,.view-kb_lesson .compact-tour .kb-tour-tabs.has-simulation{grid-template-columns:1fr 1fr!important}.view-kb_lesson .compact-tour .kb-tab-panel{padding:12px!important}.view-kb_lesson .compact-tour .kb-mental-model{grid-template-columns:1fr!important}.view-kb_lesson .compact-tour .kb-tab-panel[data-kb-panel="visual"]>.step-commit{display:grid!important}.kb-interactive-demo{min-height:0}.kb-demo-canvas{padding:16px}.kb-demo-controls{grid-template-columns:1fr;padding:14px}.demo-control-head,.demo-rule{grid-column:auto}.hierarchy-canvas{grid-template-columns:1fr}.hierarchy-poster{width:min(100%,340px)}.hierarchy-insight{text-align:center}.scale-compare{grid-template-columns:1fr}.export-live-metrics{grid-template-columns:1fr}.view-kb_lesson .compact-tour .kb-deep-grid{grid-template-columns:1fr!important}.view-kb_lesson .kb-lesson-pager{grid-template-columns:1fr 1fr}.view-kb_lesson .kb-lesson-progress-note{display:none}.kb-demo-generic-canvas{min-height:300px;padding:16px}
}

/* Final lesson focus refinements: remove non-essential vertical chrome. */
@media(min-width:721px){
  .view-kb_lesson .topbar{min-height:68px}
  .view-kb_lesson .footer{display:none}
  .view-kb_lesson .compact-tour .kb-quiz-launch.locked{display:none!important}
}

/* Automatic learning flow · XP feedback v2 -------------------------------- */
.learning-toasts{right:24px!important;top:82px!important;gap:12px!important;z-index:1200!important}
.learning-toast{position:relative!important;width:min(390px,calc(100vw - 28px))!important;grid-template-columns:52px 1fr!important;gap:13px!important;align-items:center!important;padding:14px 16px!important;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line))!important;border-radius:19px!important;background:color-mix(in srgb,var(--surface) 94%,white 6%)!important;box-shadow:0 24px 70px rgba(20,31,44,.2),0 2px 12px rgba(20,31,44,.08)!important;overflow:hidden!important;transform:translateX(26px) translateY(-7px) scale(.97)!important;opacity:0!important;transition:opacity .28s ease,transform .34s cubic-bezier(.2,.85,.25,1)!important;backdrop-filter:blur(18px)}
.learning-toast.show{opacity:1!important;transform:none!important}.learning-toast>i{width:48px!important;height:48px!important;border-radius:15px!important;background:linear-gradient(145deg,var(--accent),color-mix(in srgb,var(--accent) 72%,#fff))!important;color:#fff!important;box-shadow:0 9px 24px color-mix(in srgb,var(--accent) 26%,transparent)!important;font-size:.76rem!important;letter-spacing:-.03em!important;position:relative}.learning-toast>i:after{content:"";position:absolute;inset:-5px;border:1px solid color-mix(in srgb,var(--accent) 26%,transparent);border-radius:18px;animation:xpPulse 1.35s ease-out 1}.learning-toast .toast-copy{min-width:0}.learning-toast .toast-copy>small{display:block;font-size:.54rem;line-height:1;text-transform:uppercase;letter-spacing:.13em;font-weight:950;color:var(--accent);margin-bottom:5px}.learning-toast .toast-copy>strong{font-size:.96rem!important;line-height:1.15!important;letter-spacing:-.015em}.learning-toast .toast-copy>span{font-size:.7rem!important;line-height:1.35!important;margin-top:4px!important;color:var(--text)!important}.learning-toast .toast-copy>em{display:block;margin-top:4px;font-size:.62rem;font-style:normal;color:var(--muted)}.learning-toast .toast-timer{position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 35%,#fff));transform-origin:left;animation:toastTimer 3.4s linear forwards}.learning-toast.badge{border-color:color-mix(in srgb,#f59e0b 35%,var(--line))!important;background:linear-gradient(135deg,color-mix(in srgb,#f59e0b 8%,var(--surface)),var(--surface))!important}.learning-toast.badge>i{background:linear-gradient(145deg,#f59e0b,#facc15)!important;color:#3b2600!important}.learning-toast.badge .toast-copy>small{color:#b45309}.learning-toast.badge .toast-timer{background:linear-gradient(90deg,#f59e0b,#facc15);animation-duration:4.2s}.learning-toast.error{border-color:color-mix(in srgb,var(--bad) 35%,var(--line))!important}.learning-toast.error>i{background:linear-gradient(145deg,var(--bad),#ef4444)!important}.learning-toast.error .toast-copy>small{color:var(--bad)}
@keyframes xpPulse{0%{transform:scale(.88);opacity:.75}100%{transform:scale(1.35);opacity:0}}@keyframes toastTimer{from{transform:scaleX(1)}to{transform:scaleX(0)}}

/* The lesson itself explains progression instead of asking students to claim XP. */
.auto-flow-note{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 8%,var(--surface)),var(--surface))!important;border-color:color-mix(in srgb,var(--accent) 25%,var(--line))!important}.auto-flow-note>span{width:28px;height:28px;border-radius:9px;background:var(--accent-soft);display:grid;place-items:center;flex:0 0 auto}.auto-flow-note p{padding-top:4px}.auto-flow-note strong{color:var(--text)}
.view-kb_lesson .kb-tour-tabs button{display:grid!important;grid-template-columns:24px 1fr auto!important;column-gap:7px!important;align-items:center!important;text-align:left!important}.view-kb_lesson .kb-tour-tabs button>b{font-size:.69rem;font-weight:900;white-space:nowrap}.view-kb_lesson .kb-tour-tabs button>small{font-size:.54rem;font-weight:900;color:var(--muted);white-space:nowrap}.view-kb_lesson .kb-tour-tabs button.done>small{color:var(--ok)}
.auto-step-status{margin-top:16px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));border-radius:14px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 5%,var(--surface)),var(--surface));display:grid;grid-template-columns:34px 1fr auto;gap:11px;align-items:center;position:relative;overflow:hidden}.auto-step-status>i{width:32px;height:32px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-style:normal;font-weight:950}.auto-step-status strong{display:block;font-size:.75rem}.auto-step-status span{display:block;font-size:.64rem;color:var(--muted);margin-top:2px}.auto-step-status>em{font-size:.62rem;font-style:normal;font-weight:950;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:6px 9px}.auto-step-status.done{border-color:color-mix(in srgb,var(--ok) 34%,var(--line));background:var(--ok-soft)}.auto-step-status.done>i{background:var(--ok);color:#fff}.auto-step-status.done>em{color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,#fff)}.auto-step-status.reading>div{position:relative}.auto-step-status.reading>div>b{display:block;height:3px;background:var(--surface-2);border-radius:99px;margin-top:8px;overflow:hidden}.auto-step-status.reading>div>b>u{display:block;width:0;height:100%;background:var(--accent);text-decoration:none;border-radius:99px}.auto-step-status.reading.counting>div>b>u{animation:autoReadProgress 5.2s linear forwards}.auto-step-status.reading.done>div>b{display:none}@keyframes autoReadProgress{from{width:0}to{width:100%}}

/* Structured lessons: checklist/quiz completion now submits itself. */
.auto-step-footer{margin-top:14px;padding:11px 13px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2);display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;transition:.2s ease}.auto-step-footer>span{width:30px;height:30px;border-radius:9px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:950}.auto-step-footer strong{display:block;font-size:.72rem}.auto-step-footer small{display:block;font-size:.62rem;color:var(--muted);margin-top:2px}.auto-step-footer>em{font-size:.62rem;font-style:normal;font-weight:950;color:var(--accent);white-space:nowrap}.auto-step-footer.working{border-color:color-mix(in srgb,var(--accent) 32%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--surface))}.auto-step-footer.working>span{animation:autoSpin 1s linear infinite}.auto-step-footer.done{border-color:color-mix(in srgb,var(--ok) 35%,var(--line));background:var(--ok-soft)}.auto-step-footer.done>span{background:var(--ok);color:#fff;animation:none}.auto-step-footer.done>em{color:var(--ok)}.auto-step-footer.error{border-color:color-mix(in srgb,var(--bad) 32%,var(--line));background:var(--bad-soft)}.auto-step-footer.error>span,.auto-step-footer.error>em{color:var(--bad)}@keyframes autoSpin{to{transform:rotate(360deg)}}
.next-step-card.current .step-task-list label:has(input:checked){border-color:color-mix(in srgb,var(--ok) 42%,var(--line));background:var(--ok-soft)}.next-step-card.current .step-task-list input{accent-color:var(--ok)}

@media(max-width:720px){.learning-toasts{right:10px!important;top:72px!important}.learning-toast{width:min(360px,calc(100vw - 20px))!important}.view-kb_lesson .kb-tour-tabs button{grid-template-columns:22px 1fr!important}.view-kb_lesson .kb-tour-tabs button>small{display:none}.auto-step-status,.auto-step-footer{grid-template-columns:32px 1fr}.auto-step-status>em,.auto-step-footer>em{grid-column:2;justify-self:start}}
@media(prefers-reduced-motion:reduce){.learning-toast,.learning-toast>i:after,.learning-toast .toast-timer,.auto-step-status.reading.counting>div>b>u,.auto-step-footer.working>span{animation:none!important;transition:none!important}.auto-step-status.reading.counting>div>b>u{width:100%}}
.view-kb_lesson .compact-tour .kb-tour-tabs:not(.has-simulation){grid-template-columns:repeat(3,minmax(0,1fr))!important}

/* EDUCANET ecosystem v3 · 1620px app shell + student cockpit ---------------- */
:root{--app-max:1620px;--dash-gap:18px;--dash-radius:22px;--dash-radius-sm:15px}
.shell{width:min(var(--app-max),calc(100% - 40px));margin-inline:auto}
main{padding-top:18px}
.topbar{position:sticky;top:10px;z-index:180;min-height:68px;margin-top:10px;padding:8px 10px 8px 12px;border:1px solid color-mix(in srgb,var(--line) 88%,transparent);border-radius:20px;background:color-mix(in srgb,var(--surface) 88%,transparent);box-shadow:0 14px 40px rgba(17,24,39,.07);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand{gap:10px;min-width:max-content}.brand-mark{width:34px;height:34px;border-radius:11px;box-shadow:0 7px 18px color-mix(in srgb,var(--accent) 22%,transparent)}.brand>span:last-child{font-size:.76rem;letter-spacing:-.01em}
.main-menu{margin:0 auto;padding:4px;gap:3px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface-2) 78%,transparent);box-shadow:none}
.main-menu a,.main-menu>span{position:relative;min-height:38px;padding:0 11px;border-radius:10px;font-size:.69rem;letter-spacing:-.005em;transition:background .18s ease,color .18s ease,transform .18s ease}.main-menu a i,.main-menu>span i{width:24px;height:24px;border-radius:8px;background:transparent;font-size:.67rem}.main-menu a:hover{background:var(--surface);transform:translateY(-1px)}.main-menu a.active{background:var(--surface);color:var(--text);box-shadow:0 5px 16px rgba(17,24,39,.08),0 0 0 1px color-mix(in srgb,var(--line) 86%,transparent) inset}.main-menu a.active:after{content:"";position:absolute;left:13px;right:13px;bottom:-5px;height:2px;border-radius:99px;background:var(--accent)}.main-menu a.active i{background:var(--accent-soft);color:var(--accent)}
.topbar-right{gap:8px}.account-chip{min-width:0;max-width:220px;padding:5px 8px;border-radius:12px;background:var(--surface-2);border:1px solid transparent}.account-chip img,.account-chip>i{width:30px;height:30px;border-radius:9px}.account-chip span strong{font-size:.66rem}.account-chip span small{font-size:.54rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.class-chip{padding:5px 8px;border-radius:11px;background:transparent;border:1px solid var(--line)}.class-chip strong{font-size:.66rem}.class-chip span{font-size:.53rem}.learning-hud{gap:6px}.hud-level{width:38px;height:38px;border-radius:11px}.hud-xp{width:124px}.hud-badges>summary{min-height:36px;border-radius:10px;padding:6px 8px}

/* Student cockpit */
.student-cockpit{display:grid;gap:var(--dash-gap);padding:12px 0 24px}.student-cockpit-main{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,.75fr);gap:var(--dash-gap)}
.student-profile-card,.next-action-card,.dashboard-panel,.dashboard-metrics>article{border:1px solid var(--line);background:var(--surface);box-shadow:0 12px 34px rgba(17,24,39,.045)}
.student-profile-card{min-height:180px;border-radius:28px;padding:24px;display:grid;grid-template-columns:68px minmax(0,1fr) 112px;gap:18px;align-items:center;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 7%,var(--surface)),var(--surface) 42%)}
.student-avatar{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,var(--accent),color-mix(in srgb,var(--accent) 64%,#fff));color:#fff;font-size:1.45rem;font-weight:950;box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 25%,transparent)}
.student-profile-copy h1{font-size:clamp(1.8rem,3vw,2.6rem);margin:4px 0 7px;letter-spacing:-.045em}.student-profile-copy>p{font-size:.76rem;color:var(--muted);margin:0}.student-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}.student-tags span{padding:6px 9px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:.61rem;font-weight:850;color:var(--muted)}
.overall-ring{width:104px;height:104px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--accent) 0 var(--progress),var(--surface-2) var(--progress) 100%);position:relative}.overall-ring:after{content:"";position:absolute;inset:10px;border-radius:50%;background:var(--surface)}.overall-ring>div{position:relative;z-index:2;text-align:center}.overall-ring strong{display:block;font-size:1.28rem;letter-spacing:-.04em}.overall-ring span{display:block;font-size:.56rem;color:var(--muted);font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.next-action-card{border-radius:28px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:18px;background:linear-gradient(150deg,var(--text),color-mix(in srgb,var(--text) 82%,var(--accent)));color:var(--surface)}.next-action-card .eyebrow{color:color-mix(in srgb,var(--surface) 62%,transparent)}.next-action-card h2{font-size:1.32rem;line-height:1.15;margin:6px 0 8px;color:inherit}.next-action-card p{font-size:.76rem;line-height:1.5;color:color-mix(in srgb,var(--surface) 72%,transparent);max-width:52ch}.next-action-card .btn.primary{align-self:flex-start;background:var(--surface);color:var(--text);border-color:transparent;box-shadow:none}.next-action-card form{margin:0}
.dashboard-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.dashboard-metrics>article{min-height:108px;border-radius:18px;padding:14px;display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start}.dashboard-metrics>article>i{width:32px;height:32px;border-radius:10px;background:var(--accent-soft);color:var(--accent);font-style:normal;font-size:.65rem;font-weight:950;display:grid;place-items:center}.dashboard-metrics strong{font-size:1.28rem;letter-spacing:-.04em}.dashboard-metrics span{display:block;font-size:.62rem;color:var(--muted);margin-top:2px}.dashboard-metrics small{grid-column:1/-1;font-size:.57rem;color:var(--muted);padding-top:4px;border-top:1px solid var(--line)}
.dashboard-primary-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(330px,.65fr);gap:var(--dash-gap)}.dashboard-secondary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--dash-gap)}.dashboard-panel{border-radius:var(--dash-radius);padding:20px;min-width:0}.dashboard-panel-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}.dashboard-panel-head h2{font-size:1.05rem;margin:3px 0 4px;letter-spacing:-.025em}.dashboard-panel-head p{font-size:.66rem;color:var(--muted);line-height:1.45;max-width:62ch}.dashboard-panel-head .btn{flex:0 0 auto}.text-link{font-size:.65rem;font-weight:900;color:var(--accent);text-decoration:none;white-space:nowrap}.chart-total{text-align:right}.chart-total strong{display:block;font-size:1.25rem}.chart-total span{font-size:.56rem;color:var(--muted)}
.xp-chart-wrap{border-radius:16px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 3%,var(--surface)),var(--surface-2));padding:8px 10px 6px;overflow:hidden}.xp-chart{display:block;width:100%;height:230px;color:var(--accent);overflow:visible}.chart-gridline{stroke:var(--line);stroke-width:1}.xp-area{fill:url(#xpArea)}.xp-line{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.xp-dot{fill:var(--surface);stroke:var(--accent);stroke-width:2}.xp-day-bar{fill:color-mix(in srgb,var(--accent) 18%,transparent)}.chart-axis{display:flex;justify-content:space-between;padding:0 12px 4px;font-size:.55rem;color:var(--muted);font-weight:800}
.badge-wall{display:grid;grid-template-columns:1fr;gap:7px}.dashboard-badge{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;padding:9px;border-radius:13px;border:1px solid transparent}.dashboard-badge i{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-style:normal;font-size:.64rem;font-weight:950}.dashboard-badge strong{display:block;font-size:.67rem}.dashboard-badge span{display:block;font-size:.56rem;color:var(--muted);margin-top:2px}.dashboard-badge.earned{background:linear-gradient(90deg,color-mix(in srgb,#f59e0b 8%,var(--surface)),transparent);border-color:color-mix(in srgb,#f59e0b 20%,var(--line))}.dashboard-badge.earned i{background:linear-gradient(145deg,#f59e0b,#facc15);color:#422700}.dashboard-badge.locked{opacity:.48}.dashboard-badge.locked i{background:var(--surface-2);color:var(--muted)}
.course-roadmap-panel{padding-bottom:18px}.dashboard-course-strip{display:grid;grid-template-columns:repeat(9,minmax(145px,1fr));gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}.dash-course-node{min-height:142px;min-width:145px;border:1px solid var(--line);border-radius:16px;padding:11px;text-decoration:none;color:var(--text);display:flex;flex-direction:column;gap:8px;position:relative;transition:.18s ease;background:var(--surface)}.dash-course-node:hover:not(.locked){transform:translateY(-2px);box-shadow:0 10px 24px rgba(17,24,39,.07)}.dash-course-node.current{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));background:color-mix(in srgb,var(--accent) 4%,var(--surface))}.dash-course-node.done{border-color:color-mix(in srgb,var(--ok) 35%,var(--line));background:color-mix(in srgb,var(--ok) 4%,var(--surface))}.dash-course-node.locked{opacity:.5;cursor:not-allowed}.dash-course-number{font-size:.58rem;font-weight:950;color:var(--muted);letter-spacing:.08em}.dash-course-node>div:nth-child(2){min-height:72px}.dash-course-node span{display:block;font-size:.52rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900}.dash-course-node strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.66rem;line-height:1.3;margin-top:4px}.dash-course-node small{display:block;font-size:.54rem;color:var(--muted);margin-top:5px}.dash-course-node>i{height:4px;border-radius:99px;background:var(--surface-2);overflow:hidden;margin-top:auto}.dash-course-node>i>em{display:block;height:100%;background:var(--accent);border-radius:99px}.dash-course-node.done>i>em{background:var(--ok)}
.learned-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.learned-list>a{display:grid;grid-template-columns:30px 1fr;gap:9px;align-items:start;padding:10px;border:1px solid var(--line);border-radius:13px;text-decoration:none;color:var(--text);transition:.18s ease}.learned-list>a:hover{border-color:color-mix(in srgb,var(--accent) 30%,var(--line));background:var(--surface-2)}.learned-list>a>i{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:var(--ok-soft);color:var(--ok);font-style:normal;font-size:.62rem;font-weight:950}.learned-list strong{display:block;font-size:.65rem}.learned-list span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.56rem;line-height:1.4;color:var(--muted);margin-top:2px}.dashboard-empty{padding:18px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);grid-column:1/-1}.dashboard-empty strong{display:block;font-size:.7rem;color:var(--text)}.dashboard-empty span{font-size:.59rem}
.test-history{display:grid;gap:8px}.test-history-row{display:grid;grid-template-columns:46px 1fr;gap:10px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:13px}.test-score-ring{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--accent) 0 var(--score),var(--surface-2) var(--score) 100%);position:relative}.test-score-ring:after{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--surface)}.test-score-ring strong{position:relative;z-index:2;font-size:.58rem}.test-history-row>div:last-child>strong{display:block;font-size:.67rem}.test-history-row span{font-size:.57rem;color:var(--muted)}.practice-summary{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}.practice-summary span{padding:10px;border-radius:11px;background:var(--surface-2);font-size:.58rem;color:var(--muted)}.practice-summary b{font-size:.78rem;color:var(--text);margin-right:4px}
.activity-feed{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.activity-feed>div{display:grid;grid-template-columns:38px 1fr;gap:9px;align-items:center;padding:9px;border-radius:12px;background:var(--surface-2)}.activity-feed i{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-style:normal;font-size:.58rem;font-weight:950}.activity-feed strong{display:block;font-size:.61rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-feed small{font-size:.53rem;color:var(--muted)}
.quick-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.quick-action-grid>a{min-height:90px;padding:12px;border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--text);display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:10px;align-content:center;transition:.18s ease}.quick-action-grid>a:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 35%,var(--line));box-shadow:0 10px 24px rgba(17,24,39,.06)}.quick-action-grid i{grid-row:1/3;width:32px;height:32px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-style:normal}.quick-action-grid strong{font-size:.66rem}.quick-action-grid span{font-size:.55rem;color:var(--muted)}.dashboard-logout{margin-top:0!important}

@media(max-width:1320px){.dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-primary-grid{grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)}.account-chip{display:none}}
@media(max-width:1080px){.shell{width:min(100% - 24px,var(--app-max))}.student-cockpit-main,.dashboard-primary-grid,.dashboard-secondary-grid{grid-template-columns:1fr}.badge-wall{grid-template-columns:repeat(2,minmax(0,1fr))}.main-menu{position:absolute;top:72px;left:0;right:0;margin:0;display:none;grid-template-columns:repeat(3,minmax(0,1fr));box-shadow:var(--shadow)}.main-menu.open{display:grid}.menu-toggle{display:block;margin-left:auto}.topbar-right{margin-left:0}.dashboard-course-strip{grid-template-columns:repeat(9,150px)}}
@media(max-width:720px){.shell{width:calc(100% - 16px)}.topbar{top:4px;margin-top:4px;border-radius:15px;padding:7px}.student-profile-card{grid-template-columns:52px 1fr;padding:16px;border-radius:20px}.student-avatar{width:50px;height:50px;border-radius:15px}.overall-ring{grid-column:1/-1;width:100%;height:auto;border-radius:14px;background:var(--surface-2);padding:10px}.overall-ring:after{display:none}.overall-ring>div{display:flex;gap:7px;align-items:baseline}.overall-ring strong{font-size:1rem}.student-cockpit-main{grid-template-columns:1fr}.next-action-card,.dashboard-panel{border-radius:18px;padding:16px}.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-primary-grid,.dashboard-secondary-grid{grid-template-columns:1fr}.learned-list,.activity-feed,.quick-action-grid,.badge-wall{grid-template-columns:1fr}.xp-chart{height:185px}.main-menu{grid-template-columns:1fr}.class-chip{display:none}.learning-hud .hud-xp{display:none}}
@media(min-width:1081px){.view-kb_lesson .shell,.view-knowledgebase .shell,.view-course .shell,.view-dashboard .shell{width:min(var(--app-max),calc(100% - 40px));max-width:var(--app-max)}}

/* Teacher grading cockpit -------------------------------------------------- */
.teacher-app{background:#eef2f6;min-height:100vh}.teacher-shell{width:min(1620px,calc(100% - 36px));margin:0 auto;padding:18px 0 56px}.teacher-topbar{position:sticky;top:10px;z-index:40;min-height:68px;padding:10px 14px;border:1px solid #d7dee6;border-radius:18px;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);box-shadow:0 12px 34px rgba(15,23,42,.08);display:flex;align-items:center;gap:18px}.teacher-logo{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:190px}.teacher-logo i{width:40px;height:40px;border-radius:12px;background:#111827;color:#fff;display:grid;place-items:center;font-style:normal;font-size:.72rem;font-weight:950}.teacher-logo span{display:grid}.teacher-logo strong{font-size:.72rem;letter-spacing:.1em}.teacher-logo small{font-size:.58rem;color:var(--muted)}.teacher-topbar nav{display:flex;align-items:center;gap:5px;padding:4px;border-radius:12px;background:#f3f6f8}.teacher-topbar nav a{text-decoration:none;font-size:.68rem;font-weight:850;padding:9px 13px;border-radius:9px;color:#5c6875}.teacher-topbar nav a.active{background:#fff;color:#111827;box-shadow:0 2px 10px rgba(15,23,42,.07)}.teacher-account{margin-left:auto;display:flex;align-items:center;gap:12px}.teacher-account>span{font-size:.65rem;font-weight:800}.teacher-account form{margin:0}.teacher-account button{border:0;background:none;color:var(--muted);font-size:.6rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.teacher-classbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:14px 0 22px}.teacher-class-tabs{display:flex;gap:7px;flex-wrap:wrap}.teacher-class-tabs a{text-decoration:none;border:1px solid #d7dee6;background:#fff;border-radius:999px;padding:8px 13px;font-size:.63rem;font-weight:850;color:#647180}.teacher-class-tabs a.active{background:#111827;color:#fff;border-color:#111827}.teacher-mini-stat{display:flex;gap:7px}.teacher-mini-stat span{padding:7px 10px;border-radius:999px;background:#e5eaf0;color:#5f6b78;font-size:.58rem;font-weight:800}.teacher-flash{padding:12px 15px;border-radius:13px;margin:0 0 16px;font-size:.68rem;font-weight:750}.teacher-flash.ok{background:#e6f6ef;color:#0d6b4b;border:1px solid #bbe3d3}.teacher-flash.error{background:#fff0ef;color:#922f2f;border:1px solid #efc4c0}.teacher-login-card{width:min(900px,100%);margin:10vh auto 0;display:grid;grid-template-columns:1.05fr .95fr;border:1px solid #d7dee6;border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 30px 80px rgba(15,23,42,.12)}.teacher-login-brand{padding:42px;background:linear-gradient(145deg,#101827,#263447);color:#fff}.teacher-login-brand>span{font-size:.65rem;font-weight:950;letter-spacing:.14em;color:#9fb6ff}.teacher-login-brand strong{display:block;font-size:2rem;line-height:1.02;letter-spacing:-.05em;margin:70px 0 12px;max-width:340px}.teacher-login-brand p{color:#bdc8d6;max-width:360px}.teacher-login-card form{padding:42px;display:grid;gap:16px;align-content:center}.teacher-login-card form label,.teacher-filter-row label,.teacher-group-form>label,.teacher-grade-side label,.teacher-grade-main>label,.teacher-feedback-grid label{display:grid;gap:7px;font-size:.62rem;font-weight:850;color:#53606e}.teacher-login-card input,.teacher-app input,.teacher-app select,.teacher-app textarea{width:100%;border:1px solid #d5dde5;border-radius:11px;background:#fff;color:#111827;padding:10px 11px;font:inherit;outline:none}.teacher-app input:focus,.teacher-app select:focus,.teacher-app textarea:focus{border-color:#2459ff;box-shadow:0 0 0 3px #e8eeff}.teacher-hero,.teacher-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:18px}.teacher-hero{padding:22px 24px;border-radius:22px;background:linear-gradient(125deg,#fff,#f7f9fb);border:1px solid #d7dee6}.teacher-hero h1,.teacher-page-head h1{font-size:clamp(1.65rem,2.5vw,2.65rem);margin:3px 0 8px}.teacher-hero p,.teacher-page-head p{font-size:.75rem;max-width:760px;margin:0}.teacher-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.teacher-kpi-grid article{padding:17px;border:1px solid #d7dee6;border-radius:17px;background:#fff}.teacher-kpi-grid span{display:block;font-size:.58rem;color:#6c7885;font-weight:800;text-transform:uppercase;letter-spacing:.07em}.teacher-kpi-grid strong{display:block;font-size:1.7rem;letter-spacing:-.05em;margin:4px 0}.teacher-kpi-grid small{font-size:.56rem;color:#84909b}.teacher-project-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.teacher-project-card{min-height:270px;padding:18px;border:1px solid #d7dee6;border-radius:18px;background:#fff;display:flex;flex-direction:column}.teacher-project-type{align-self:flex-start;padding:5px 8px;border-radius:999px;font-size:.53rem;font-weight:950;letter-spacing:.06em;text-transform:uppercase;background:#edf2ff;color:#2459ff}.teacher-project-type.group{background:#f5edff;color:#7c3aed}.teacher-project-card h2{font-size:1rem;margin:18px 0 8px}.teacher-project-card p{font-size:.65rem;line-height:1.45}.teacher-project-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:15px}.teacher-project-meta span{font-size:.53rem;padding:5px 7px;background:#f2f5f7;border-radius:8px;color:#66727e;font-weight:800}.teacher-card-actions{display:flex;gap:7px;margin-top:11px}.btn.small{min-height:36px;padding:0 12px;font-size:.6rem}.teacher-filter-row{display:flex;gap:12px;margin:12px 0 16px}.teacher-filter-row label{min-width:min(460px,100%)}.teacher-panel{background:#fff;border:1px solid #d7dee6;border-radius:20px;padding:20px;box-shadow:0 10px 28px rgba(15,23,42,.04)}.teacher-panel-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:15px}.teacher-panel-head>div>span{display:block;font-size:.54rem;font-weight:950;text-transform:uppercase;letter-spacing:.08em;color:#7a8793}.teacher-panel-head h2,.teacher-panel-head h3{margin:3px 0 0;font-size:1rem}.teacher-panel-head.compact h3{font-size:.85rem}.teacher-two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}.teacher-group-list{display:grid;gap:9px}.teacher-group-list article{border:1px solid #dce3e9;border-radius:14px;padding:12px;display:flex;gap:12px;justify-content:space-between;align-items:center}.teacher-group-list strong{font-size:.7rem}.teacher-group-list span{display:block;font-size:.56rem;color:#73808c;margin-top:2px}.teacher-group-list p{font-size:.55rem;margin:5px 0 0;max-width:560px}.teacher-group-list article>div:last-child{display:flex;gap:8px;align-items:center}.teacher-group-form{display:grid;gap:15px}.teacher-group-form fieldset{border:0;padding:0;margin:0}.teacher-group-form legend{font-size:.62rem;font-weight:900;margin-bottom:8px}.teacher-student-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:420px;overflow:auto;padding-right:3px}.teacher-student-checks label{display:flex;align-items:center;gap:8px;border:1px solid #dde4ea;border-radius:11px;padding:8px;cursor:pointer}.teacher-student-checks input{width:16px}.teacher-student-checks strong{display:block;font-size:.59rem}.teacher-student-checks small{display:block;font-size:.49rem;color:#8a95a0}.teacher-target-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.teacher-target-grid>a{min-height:78px;padding:11px;border:1px solid #d9e1e8;border-radius:14px;background:#fff;text-decoration:none;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:9px;transition:.16s ease}.teacher-target-grid>a:hover{border-color:#2459ff;transform:translateY(-1px);box-shadow:0 8px 22px rgba(15,23,42,.06)}.teacher-avatar{width:38px;height:38px;border-radius:11px;background:#e8eeff;color:#2459ff;display:grid;place-items:center;font-size:.7rem;font-weight:950}.teacher-avatar.group{background:#f3e8ff;color:#7c3aed}.teacher-target-grid strong{display:block;font-size:.63rem}.teacher-target-grid small{display:block;font-size:.52rem;color:#7d8995;margin-top:3px}.teacher-target-grid>a>i{font-style:normal;color:#9aa4ad}.grade-pill{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-size:.72rem;font-weight:950;background:#e7f6ef;color:#0a6b48}.grade-pill.grade-3{background:#fff5d9;color:#8b6514}.grade-pill.grade-4,.grade-pill.grade-5{background:#fff0ef;color:#9d3333}.teacher-empty{padding:18px;border:1px dashed #ced7df;border-radius:13px;color:#73808c;font-size:.62rem}.teacher-empty.wide{grid-column:1/-1}.teacher-back{display:inline-block;margin:0 0 11px;text-decoration:none;color:#5d6976;font-size:.62rem;font-weight:850}.teacher-grade-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,.55fr);gap:14px;align-items:start}.grade-main{min-width:0}.live-score{text-align:right}.live-score strong{font-size:1.65rem;letter-spacing:-.05em}.live-score span{font-size:.62rem;color:#6d7884}.live-score b{display:block;font-size:.53rem;color:#2459ff;margin-top:3px}.teacher-rubric{display:grid;gap:8px}.teacher-rubric article{display:grid;grid-template-columns:minmax(0,1fr) 105px;gap:14px;align-items:center;border:1px solid #dde4ea;border-radius:14px;padding:12px}.teacher-rubric article>div>span{font-size:.66rem;font-weight:900}.teacher-rubric article p{font-size:.56rem;margin:3px 0 0;line-height:1.4}.teacher-rubric article label{display:grid;grid-template-columns:1fr auto;align-items:center;gap:7px}.teacher-rubric article input{text-align:center;font-weight:900;font-size:.8rem}.teacher-rubric article small{font-size:.58rem;color:#7b8792}.teacher-feedback-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:13px 0}.teacher-grade-main>label textarea,.teacher-feedback-grid textarea{resize:vertical}.teacher-member-adjust{margin-top:16px;padding-top:16px;border-top:1px solid #e0e6eb}.teacher-member-adjust>article{display:grid;grid-template-columns:minmax(140px,1fr) 90px 130px minmax(180px,1.2fr);gap:9px;align-items:end;padding:9px 0;border-bottom:1px solid #edf0f3}.teacher-member-adjust>article>strong{font-size:.62rem;align-self:center}.teacher-member-adjust label{display:grid;gap:5px;font-size:.52rem;color:#6e7a86;font-weight:800}.teacher-grade-side{display:grid;gap:12px;position:sticky;top:96px}.teacher-grade-side .wide{width:100%}.teacher-grade-side small{font-size:.51rem;color:#7f8994;line-height:1.4}.record-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}.record-meta span{font-size:.49rem;background:#f1f4f6;padding:4px 6px;border-radius:7px;color:#727e89}.mini-history{display:grid;gap:7px}.mini-history article{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:center;padding:7px;border-radius:10px;background:#f6f8fa}.mini-history i{width:27px;height:27px;border-radius:8px;background:#e8eeff;color:#2459ff;display:grid;place-items:center;font-style:normal;font-size:.59rem;font-weight:950}.mini-history strong{display:block;font-size:.56rem}.mini-history span,.mini-history small{display:block;font-size:.48rem;color:#82909c}.teacher-history-list{display:grid;gap:9px}.teacher-history-list>article{display:grid;grid-template-columns:90px 1fr;border:1px solid #d9e1e8;border-radius:15px;background:#fff;overflow:hidden}.history-time{padding:13px;background:#f4f7f9;display:grid;align-content:start}.history-time strong{font-size:.62rem}.history-time span{font-size:.55rem;color:#7b8793}.history-body{padding:12px 14px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr) auto;gap:14px;align-items:center}.history-body>div:first-child>span{font-size:.5rem;color:#81909d;text-transform:uppercase;letter-spacing:.06em}.history-body h2{font-size:.72rem;margin:3px 0}.history-change-chips{display:flex;gap:5px;flex-wrap:wrap}.history-change-chips span{font-size:.48rem;background:#edf2f6;border-radius:999px;padding:4px 7px;color:#63707c}.history-result{display:flex;gap:8px;align-items:center}.history-result>b{font-size:.58rem}.history-result>span{font-size:.5rem;color:#74808b}.teacher-project-score{text-align:right;padding:10px 14px;border-radius:14px;background:#111827;color:#fff}.teacher-project-score strong{display:block;font-size:1rem}.teacher-project-score span{font-size:.52rem;color:#b8c2cf}

/* Student project results -------------------------------------------------- */
.student-results-hero{display:flex;justify-content:space-between;gap:24px;align-items:end;padding:8px 0 24px;border-bottom:1px solid var(--line);margin-bottom:18px}.student-results-hero h1{font-size:clamp(1.8rem,3vw,3rem);margin:3px 0 8px}.student-results-hero p{font-size:.78rem;max-width:780px;margin:0}.student-results-summary{min-width:150px;padding:13px 15px;border:1px solid var(--line);border-radius:15px;background:var(--surface);text-align:right}.student-results-summary strong{display:block;font-size:1.6rem}.student-results-summary span{font-size:.55rem;color:var(--muted)}.student-result-empty{padding:42px;text-align:center;border:1px dashed var(--line);border-radius:20px;background:var(--surface)}.student-result-empty>span{font-size:2rem;color:var(--accent)}.student-result-empty h2{font-size:1.1rem;margin:8px 0}.student-result-empty p{font-size:.68rem}.student-project-results{display:grid;gap:14px}.student-project-result{padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 10px 28px rgba(15,23,42,.04)}.student-project-result.returned{border-color:#f0cf85;background:linear-gradient(180deg,#fffdf6,#fff)}.student-project-result>header{display:flex;justify-content:space-between;gap:20px;align-items:start;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:14px}.result-type{font-size:.52rem;font-weight:950;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.student-project-result h2{font-size:1.1rem;margin:5px 0}.student-project-result header p{font-size:.62rem;margin:0;max-width:740px}.result-grade{min-width:110px;text-align:center;padding:10px;border-radius:14px;background:var(--surface-2)}.result-grade span{display:block;font-size:.5rem;text-transform:uppercase;color:var(--muted);font-weight:900}.result-grade strong{display:block;font-size:1.65rem;margin:1px 0}.result-grade small{font-size:.52rem;color:var(--muted)}.student-rubric-view{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.student-rubric-view>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;border:1px solid var(--line);border-radius:12px;padding:10px}.student-rubric-view strong{display:block;font-size:.6rem}.student-rubric-view small{display:block;font-size:.51rem;color:var(--muted);line-height:1.35;margin-top:2px}.student-rubric-view b{font-size:.62rem}.student-rubric-view i{grid-column:1/-1;height:4px;border-radius:99px;background:var(--surface-2);overflow:hidden}.student-rubric-view em{display:block;height:100%;background:var(--accent);border-radius:99px}.student-feedback-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.student-feedback-grid>div{padding:11px;border-radius:12px;background:var(--surface-2)}.student-feedback-grid span{display:block;font-size:.5rem;text-transform:uppercase;letter-spacing:.08em;font-weight:950;color:var(--muted)}.student-feedback-grid p{font-size:.59rem;margin:4px 0 0}.student-teacher-comment{margin-top:10px;padding:12px;border-left:3px solid var(--accent);background:color-mix(in srgb,var(--accent) 5%,var(--surface));border-radius:0 12px 12px 0}.student-teacher-comment strong{font-size:.62rem}.student-teacher-comment p{font-size:.6rem;margin:4px 0}.personal-note{margin-top:8px;padding-top:8px;border-top:1px solid color-mix(in srgb,var(--accent) 15%,var(--line));font-size:.59rem}.personal-note span{display:block;font-size:.48rem;font-weight:950;text-transform:uppercase;color:var(--accent);margin-bottom:3px}.student-project-result>footer{display:flex;justify-content:space-between;gap:10px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:.51rem;color:var(--muted)}.project-results-preview{margin-top:0}.project-result-preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.project-result-preview-grid>a{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:13px;text-decoration:none;color:var(--text)}.project-result-preview-grid span{display:block;font-size:.49rem;text-transform:uppercase;color:var(--muted);font-weight:900}.project-result-preview-grid strong{display:block;font-size:.62rem;margin-top:2px}.project-result-preview-grid small{display:block;font-size:.51rem;color:var(--muted);margin-top:3px}.project-result-preview-grid>a>b{width:34px;height:34px;border-radius:10px;background:var(--ok-soft);color:var(--ok);display:grid;place-items:center}.project-result-preview-grid>a>b.returned{background:#fff4d6;color:#8b6514}.dashboard-metrics a{color:inherit;text-decoration:none}

@media(max-width:1180px){.teacher-project-grid,.teacher-target-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-two-col,.teacher-grade-layout{grid-template-columns:1fr}.teacher-grade-side{position:static}.teacher-member-adjust>article{grid-template-columns:1fr 90px 120px}.teacher-member-adjust .member-comment{grid-column:1/-1}.history-body{grid-template-columns:1fr}.teacher-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.teacher-shell{width:calc(100% - 16px);padding-top:8px}.teacher-topbar{top:4px;flex-wrap:wrap}.teacher-topbar nav{order:3;width:100%;overflow:auto}.teacher-account{margin-left:auto}.teacher-login-card{grid-template-columns:1fr;margin-top:20px}.teacher-login-brand{padding:26px}.teacher-login-brand strong{margin-top:34px}.teacher-login-card form{padding:26px}.teacher-hero,.teacher-page-head,.student-results-hero{align-items:flex-start;flex-direction:column}.teacher-kpi-grid,.teacher-project-grid,.teacher-target-grid,.teacher-two-col,.student-rubric-view,.student-feedback-grid,.project-result-preview-grid{grid-template-columns:1fr}.teacher-student-checks{grid-template-columns:1fr}.teacher-member-adjust>article{grid-template-columns:1fr 1fr}.teacher-member-adjust>article>strong,.teacher-member-adjust .member-comment{grid-column:1/-1}.teacher-history-list>article{grid-template-columns:1fr}.history-time{grid-template-columns:auto auto;gap:8px}.student-project-result>header{flex-direction:column}.result-grade{width:100%;text-align:left;display:grid;grid-template-columns:1fr auto auto;align-items:center}.result-grade strong{font-size:1.1rem}.result-grade small{margin-left:8px}}

/* Project grading refinement ---------------------------------------------- */
.teacher-history-list>article{align-items:stretch}.history-body>div:first-child{min-width:0}.history-diff{margin-top:8px;border-top:1px solid #e8edf1;padding-top:7px}.history-diff summary{cursor:pointer;font-size:.5rem;font-weight:850;color:#5f6b77;list-style:none}.history-diff summary::-webkit-details-marker{display:none}.history-diff summary::before{content:'▸';display:inline-block;margin-right:5px;transition:.15s ease}.history-diff[open] summary::before{transform:rotate(90deg)}.history-diff-list{display:grid;gap:6px;margin-top:8px}.history-diff-list>div{display:grid;grid-template-columns:minmax(105px,.7fr) minmax(0,1fr) auto minmax(0,1fr);gap:7px;align-items:start;padding:7px 8px;border-radius:9px;background:#f6f8fa}.history-diff-list strong{font-size:.49rem;color:#53606d}.history-diff-list span{font-size:.48rem;line-height:1.35;color:#727f8b;overflow-wrap:anywhere}.history-diff-list i{font-style:normal;font-size:.5rem;color:#9aa4ad}
.student-results-summary small{display:block;font-size:.5rem;color:var(--muted);margin-top:5px}.student-results-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.student-result-card{display:flex;flex-direction:column;min-height:250px;padding:17px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:0 8px 24px rgba(15,23,42,.035);text-decoration:none;color:var(--text);transition:.18s ease}.student-result-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 45%,var(--line));box-shadow:0 14px 34px rgba(15,23,42,.075)}.student-result-card.returned{background:linear-gradient(180deg,#fffdf6,var(--surface));border-color:#edd28f}.student-result-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.student-result-card-top>span{font-size:.49rem;font-weight:950;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.student-result-card-top>b{width:35px;height:35px;border-radius:10px;background:var(--ok-soft);color:var(--ok);display:grid;place-items:center;font-size:.8rem}.student-result-card-top>b.returned{background:#fff1cc;color:#8b6514}.student-result-card h2{font-size:.9rem;margin:15px 0 7px;line-height:1.15}.student-result-card p{font-size:.58rem;line-height:1.45;margin:0;color:var(--muted)}.student-result-card-score{margin-top:auto;padding-top:15px}.student-result-card-score i{display:block;height:6px;border-radius:999px;background:var(--surface-2);overflow:hidden}.student-result-card-score em{display:block;height:100%;background:var(--accent);border-radius:999px}.student-result-card-score span{display:block;margin-top:6px;font-size:.52rem;color:var(--muted)}.student-result-card-foot{display:flex;justify-content:space-between;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:.51rem}.student-result-card-foot>span{font-weight:900;color:var(--accent)}.student-result-card-foot time{color:var(--muted)}
.student-result-detail-head{padding:4px 0 18px;border-bottom:1px solid var(--line);margin-bottom:14px}.student-result-back{display:inline-block;margin-bottom:12px;color:var(--muted);font-size:.58rem;font-weight:850;text-decoration:none}.student-result-detail-title{display:flex;justify-content:space-between;gap:22px;align-items:flex-end}.student-result-detail-title h1{font-size:clamp(1.7rem,3vw,2.7rem);margin:4px 0 7px;letter-spacing:-.04em}.student-result-detail-title p{margin:0;max-width:760px;font-size:.7rem}.result-grade.prominent{min-width:180px}.student-return-banner{display:flex;gap:11px;align-items:center;margin:0 0 14px;padding:11px 13px;border:1px solid #ecd18e;border-radius:14px;background:#fff9e8}.student-return-banner>i{width:34px;height:34px;border-radius:10px;background:#fff0c2;color:#8b6514;display:grid;place-items:center;font-style:normal;font-weight:950}.student-return-banner strong{display:block;font-size:.62rem}.student-return-banner span{display:block;font-size:.53rem;color:#7c6a3d;margin-top:2px}.student-project-result.detail{max-width:none}.detail-rubric{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-feedback{margin-top:14px}.student-result-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px;padding-top:11px;border-top:1px solid var(--line)}.student-result-meta>*{font-size:.5rem;color:var(--muted);background:var(--surface-2);padding:5px 7px;border-radius:8px}
@media(max-width:1050px){.student-results-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.history-diff-list>div{grid-template-columns:1fr}.history-diff-list i{display:none}}
@media(max-width:760px){.student-results-card-grid,.detail-rubric{grid-template-columns:1fr}.student-result-detail-title{align-items:flex-start;flex-direction:column}.result-grade.prominent{width:100%}}

/* Prestige badges + achievements ----------------------------------------- */
.learning-toast.achievement{border-color:color-mix(in srgb,#7c3aed 32%,var(--line))!important;background:linear-gradient(135deg,color-mix(in srgb,#7c3aed 8%,var(--surface)),var(--surface))!important}
.learning-toast.achievement>i{background:linear-gradient(145deg,#7c3aed,#a78bfa)!important;color:#fff!important;box-shadow:0 9px 24px color-mix(in srgb,#7c3aed 24%,transparent)!important}
.learning-toast.achievement .toast-copy>small{color:#7c3aed}.learning-toast.achievement .toast-timer{background:linear-gradient(90deg,#7c3aed,#a78bfa);animation-duration:4s}
.prestige-showcase{position:relative;overflow:hidden}.prestige-showcase:before{content:"";position:absolute;right:-80px;top:-110px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,#f59e0b 11%,transparent),transparent 68%);pointer-events:none}
.prestige-wall{grid-template-columns:1fr!important}.prestige-badge{position:relative;min-height:76px;background:var(--surface);overflow:hidden}.prestige-badge>i{width:48px;height:48px;border-radius:16px}.prestige-badge>div>small{display:block;font-size:.48rem;letter-spacing:.14em;font-weight:950;margin-bottom:3px;color:var(--muted)}.prestige-badge>div>strong{font-size:.74rem}.prestige-badge>div>span{font-size:.59rem;line-height:1.45}.prestige-badge.earned{transform:translateZ(0)}
.prestige-badge.rarity-epic.earned{background:linear-gradient(100deg,color-mix(in srgb,#7c3aed 9%,var(--surface)),var(--surface));border-color:color-mix(in srgb,#7c3aed 24%,var(--line))}.prestige-badge.rarity-epic.earned i{background:linear-gradient(145deg,#6d28d9,#a78bfa);color:#fff}.prestige-badge.rarity-legendary.earned{background:linear-gradient(100deg,color-mix(in srgb,#f59e0b 10%,var(--surface)),var(--surface));border-color:color-mix(in srgb,#f59e0b 30%,var(--line))}.prestige-badge.rarity-legendary.earned i{background:linear-gradient(145deg,#d97706,#facc15);color:#352000}.prestige-badge.rarity-mythic.earned{background:linear-gradient(110deg,color-mix(in srgb,#ec4899 8%,var(--surface)),color-mix(in srgb,#7c3aed 7%,var(--surface)));border-color:color-mix(in srgb,#a855f7 32%,var(--line))}.prestige-badge.rarity-mythic.earned i{background:linear-gradient(145deg,#ec4899,#7c3aed);color:#fff}.prestige-badge.locked{opacity:.64;filter:saturate(.65)}.prestige-note{margin-top:12px;padding:11px 12px;border-radius:14px;background:var(--surface-2);display:grid;grid-template-columns:26px 1fr;gap:9px;align-items:start}.prestige-note>span{font-size:.9rem;color:#d97706}.prestige-note p{margin:0;font-size:.62rem;line-height:1.45;color:var(--muted)}.prestige-note strong{color:var(--text)}
.achievements-panel{overflow:hidden}.achievement-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.achievement-card{display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:start;padding:12px;border:1px solid var(--line);border-radius:15px;background:var(--surface);min-width:0}.achievement-card>i{width:40px;height:40px;border-radius:12px;background:var(--surface-2);display:grid;place-items:center;font-style:normal;font-size:.6rem;font-weight:950;color:var(--muted)}.achievement-card>div{min-width:0}.achievement-title{display:flex;justify-content:space-between;gap:8px;align-items:baseline}.achievement-title strong{font-size:.68rem;line-height:1.25}.achievement-title span{font-size:.47rem;font-weight:950;letter-spacing:.06em;color:var(--muted);white-space:nowrap}.achievement-card p{font-size:.56rem;line-height:1.4;color:var(--muted);margin:4px 0 9px}.achievement-card b{display:block;height:5px;background:var(--surface-2);border-radius:99px;overflow:hidden}.achievement-card b em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7c3aed,#a78bfa)}.achievement-card.earned{border-color:color-mix(in srgb,#7c3aed 22%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,#7c3aed 5%,var(--surface)),var(--surface))}.achievement-card.earned>i{background:linear-gradient(145deg,#7c3aed,#a78bfa);color:#fff}.achievement-card.earned .achievement-title span{color:#6d28d9}
@media(max-width:1220px){.achievement-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.achievement-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.achievement-grid{grid-template-columns:1fr}.prestige-badge{min-height:68px}}

/* Student social layer + Team Finder + Prestige Exams -------------------- */
.account-chip{text-decoration:none;color:inherit}.account-chip:hover{border-color:color-mix(in srgb,var(--accent,#2459ff) 28%,var(--line));transform:translateY(-1px)}
.social-profile-hero{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;padding:24px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent,#2459ff) 6%,var(--surface)),var(--surface));margin-bottom:16px}.social-avatar{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#111827,#334155);color:#fff;font-style:normal;font-weight:950;font-size:.72rem;flex:0 0 auto}.social-avatar.xl{width:76px;height:76px;border-radius:24px;font-size:1.6rem}.social-profile-intro h1{margin:3px 0 5px;font-size:1.65rem;letter-spacing:-.04em}.social-profile-intro>p{margin:0;color:var(--muted);font-size:.68rem}.social-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}.social-chips span,.social-tags span{padding:5px 8px;border-radius:999px;background:var(--surface-2);font-size:.49rem;font-weight:850;color:var(--muted)}.social-status-card{min-width:150px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}.social-status-card span,.social-status-card small{display:block;font-size:.5rem;color:var(--muted)}.social-status-card strong{display:block;font-size:.72rem;margin:4px 0}.social-profile-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.7fr);gap:14px;margin-bottom:14px}.social-bio{font-size:.68rem;line-height:1.65;margin:0 0 18px}.social-tag-section{display:grid;gap:7px;margin-top:13px}.social-tag-section>strong{font-size:.55rem;text-transform:uppercase;letter-spacing:.07em}.social-tags{display:flex;flex-wrap:wrap;gap:6px}.social-tags.compact span{padding:4px 7px}.social-tags .muted-tag{opacity:.7}.social-profile-actions{margin-top:18px;display:flex;gap:8px}.social-pending,.friend-state{font-size:.53rem;font-weight:850;color:var(--muted)}.friend-state.ok{color:#0a7a52}.social-badge-showcase{display:grid;gap:9px}.social-empty-mini{padding:20px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:.6rem}.profile-editor{margin-top:14px}.social-profile-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.social-profile-form>label{display:grid;gap:6px}.social-profile-form>label>span{font-size:.54rem;font-weight:850;color:var(--muted)}.social-profile-form input,.social-profile-form textarea,.social-profile-form select,.team-form input,.team-form select,.invite-input{width:100%;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:11px;padding:10px 11px;font:inherit;font-size:.62rem}.social-profile-form .wide{grid-column:1/-1}.badge-picker{grid-column:1/-1;border:1px solid var(--line);border-radius:14px;padding:12px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.badge-picker legend{font-size:.56rem;font-weight:900;padding:0 6px}.badge-picker>p{grid-column:1/-1;font-size:.56rem;color:var(--muted)}.badge-picker label{display:flex;align-items:center;gap:7px;padding:9px;border:1px solid var(--line);border-radius:11px;cursor:pointer}.badge-picker label span{display:flex;gap:7px;align-items:center;min-width:0}.badge-picker label b{width:28px;height:28px;border-radius:8px;background:var(--surface-2);display:grid;place-items:center;font-size:.46rem}.badge-picker label strong{font-size:.54rem}
.social-hero,.team-hero,.prestige-exam-hero{margin-bottom:16px}.friend-requests{margin-bottom:14px}.friend-request-list{display:grid;gap:8px}.friend-request-list article{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:13px}.friend-request-list article>div:nth-child(2) strong,.friend-request-list article>div:nth-child(2) span{display:block}.friend-request-list article strong{font-size:.62rem}.friend-request-list article span{font-size:.51rem;color:var(--muted);margin-top:2px}.friend-request-list article>div:last-child{display:flex;gap:6px}.classmate-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.classmate-card{padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface);min-width:0}.classmate-top{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center}.classmate-top strong,.classmate-top span{display:block}.classmate-top strong{font-size:.65rem}.classmate-top span{font-size:.48rem;color:var(--muted);margin-top:2px}.classmate-top>b{font-size:.48rem;padding:5px 6px;border-radius:8px;background:var(--surface-2);color:var(--muted)}.classmate-card>p{font-size:.57rem;line-height:1.45;color:var(--muted);min-height:34px}.classmate-meta{display:flex;gap:8px;margin:10px 0;font-size:.47rem;color:var(--muted)}.classmate-actions{display:flex;gap:7px;align-items:center;min-height:34px}.classmate-actions form{margin:0}
.project-switcher{display:flex;gap:8px;overflow:auto;padding-bottom:5px;margin-bottom:12px}.project-switcher a{min-width:230px;padding:11px 13px;border:1px solid var(--line);border-radius:14px;background:var(--surface);text-decoration:none;color:inherit}.project-switcher a span,.project-switcher a strong{display:block}.project-switcher a span{font-size:.46rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.project-switcher a strong{font-size:.61rem;margin-top:4px}.project-switcher a.active{border-color:color-mix(in srgb,var(--accent,#2459ff) 45%,var(--line));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent,#2459ff) 12%,transparent)}.team-planner{margin-bottom:14px}.team-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.team-plan-card{padding:13px;border:1px solid var(--line);border-radius:15px;background:var(--surface);display:grid;gap:11px}.team-plan-card.recommended{background:linear-gradient(145deg,color-mix(in srgb,#16a34a 5%,var(--surface)),var(--surface));border-color:color-mix(in srgb,#16a34a 24%,var(--line))}.team-plan-card.selected{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent,#2459ff) 45%,transparent)}.team-plan-card span,.team-plan-card strong,.team-plan-card small{display:block}.team-plan-card span{font-size:.47rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.team-plan-card strong{font-size:.69rem;margin:5px 0}.team-plan-card small{font-size:.49rem;color:var(--muted)}.team-current{margin-bottom:14px}.team-current.formed{border-color:color-mix(in srgb,#16a34a 30%,var(--line))}.team-state-pill{font-size:.47rem;font-weight:950;padding:6px 8px;border-radius:999px;background:#fff7ed;color:#9a5811}.team-state-pill.ready{background:#eff6ff;color:#2459ff}.team-state-pill.formed{background:#ecfdf5;color:#087452}.invite-code-box{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:15px;border:1px dashed color-mix(in srgb,var(--accent,#2459ff) 35%,var(--line));border-radius:16px;background:color-mix(in srgb,var(--accent,#2459ff) 3%,var(--surface));margin-bottom:12px}.invite-code-box span,.invite-code-box small{display:block}.invite-code-box span{font-size:.48rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.invite-code-box strong{display:block;font-size:1.45rem;letter-spacing:.2em;margin:3px 0}.invite-code-box small{font-size:.49rem;color:var(--muted)}.team-member-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.team-member-grid>a,.team-empty-slot{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:13px;text-decoration:none;color:inherit}.team-member-grid>a .social-avatar{grid-row:1/3}.team-member-grid strong,.team-member-grid span{display:block}.team-member-grid strong{font-size:.56rem}.team-member-grid span{font-size:.47rem;color:var(--muted);margin-top:2px}.team-empty-slot{border-style:dashed;color:var(--muted)}.team-empty-slot i{grid-row:1/3;width:36px;height:36px;border-radius:11px;background:var(--surface-2);display:grid;place-items:center;font-style:normal}.team-lobby-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px}.team-lobby-actions form{margin:0}.btn.danger{color:#a33333}.team-create-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}.team-form{display:grid;gap:10px}.team-form label{display:grid;gap:5px}.team-form label span{font-size:.53rem;font-weight:850;color:var(--muted)}.invite-input{text-transform:uppercase;letter-spacing:.16em;font-weight:900;font-size:.8rem!important}.team-finder-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.team-finder-grid>a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:9px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:13px;text-decoration:none;color:inherit}.team-finder-grid strong,.team-finder-grid span,.team-finder-grid small{display:block}.team-finder-grid strong{font-size:.58rem}.team-finder-grid span,.team-finder-grid small{font-size:.47rem;color:var(--muted);margin-top:2px}.team-finder-grid>b{font-size:.45rem;color:#0a6b48;background:#ecfdf5;padding:5px 6px;border-radius:8px;white-space:nowrap}
.prestige-exam-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:14px}.prestige-exam-card{position:relative;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--surface);overflow:hidden}.prestige-exam-card>.exam-level{position:absolute;right:14px;top:14px;font-size:.5rem;font-weight:950;padding:6px 8px;border-radius:8px;background:var(--surface-2)}.prestige-exam-card>span{font-size:.47rem;letter-spacing:.1em;font-weight:950;color:#7c3aed}.prestige-exam-card h2{font-size:.9rem;margin:7px 0}.prestige-exam-card p{font-size:.58rem;line-height:1.5;color:var(--muted);max-width:82%}.prestige-exam-card.locked{opacity:.62}.prestige-exam-card.passed{border-color:color-mix(in srgb,#16a34a 28%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,#16a34a 5%,var(--surface)),var(--surface))}.exam-meta{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.exam-meta b{font-size:.47rem;padding:5px 7px;border-radius:8px;background:var(--surface-2);color:var(--muted)}.prestige-exam-card>small{font-size:.5rem;color:var(--muted)}.prestige-exam-sheet{margin-top:14px}.exam-pass-badge{text-align:right}.exam-pass-badge span,.exam-pass-badge strong{display:block}.exam-pass-badge span{font-size:.48rem;color:var(--muted)}.exam-pass-badge strong{font-size:1.1rem}.prestige-exam-form{display:grid;gap:10px}.prestige-exam-form fieldset{border:1px solid var(--line);border-radius:15px;padding:13px;margin:0}.prestige-exam-form legend{padding:0 5px;font-size:.64rem;font-weight:900;line-height:1.45}.prestige-exam-form legend span{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:8px;background:var(--surface-2);font-size:.48rem;margin-right:7px;color:var(--muted)}.prestige-exam-form fieldset>div{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:9px}.prestige-exam-form label{display:flex;gap:8px;align-items:flex-start;padding:9px;border:1px solid var(--line);border-radius:11px;cursor:pointer;font-size:.56rem;line-height:1.4}.prestige-exam-form input{margin-top:2px}.exam-submit{display:flex;justify-content:space-between;gap:16px;align-items:center;padding-top:5px}.exam-submit p{font-size:.53rem;color:var(--muted);max-width:70%;margin:0}
@media(max-width:1100px){.classmate-grid,.team-finder-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.team-member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.social-profile-grid{grid-template-columns:1fr}.team-plan-grid{grid-template-columns:1fr}.badge-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.social-profile-hero{grid-template-columns:auto 1fr}.social-status-card{grid-column:1/-1}.social-profile-form,.team-create-grid,.prestige-exam-grid{grid-template-columns:1fr}.classmate-grid,.team-finder-grid,.team-member-grid{grid-template-columns:1fr}.social-profile-form .wide{grid-column:auto}.badge-picker{grid-column:auto;grid-template-columns:1fr}.prestige-exam-form fieldset>div{grid-template-columns:1fr}.invite-code-box{grid-template-columns:1fr}.exam-submit{align-items:flex-start;flex-direction:column}.exam-submit p{max-width:none}}

/* Teacher Team Control Center */
.teacher-team-control{margin-bottom:20px}.teacher-team-control .teacher-muted{margin:0 0 16px;color:var(--muted,#667085);line-height:1.55}.teacher-team-control-stats{display:flex;align-items:baseline;gap:8px}.teacher-team-control-stats b{font-size:24px}.teacher-team-control-stats small{color:var(--muted,#667085)}.teacher-team-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:22px}.teacher-team-plan-grid article{border:1px solid rgba(15,23,42,.1);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:4px;background:rgba(255,255,255,.68)}.teacher-team-plan-grid article.recommended{box-shadow:inset 0 0 0 1px rgba(59,130,246,.32)}.teacher-team-plan-grid article>span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#667085}.teacher-team-plan-grid article>strong{font-size:18px}.teacher-team-plan-grid article>small{color:#667085}.teacher-lobby-watch h3{margin:0 0 10px}.teacher-lobby-watch>article{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:12px 0;border-top:1px solid rgba(15,23,42,.08)}.teacher-lobby-watch>article p{margin:5px 0 0;color:#667085;font-size:13px}.teacher-lobby-state{display:inline-flex;margin-left:8px;padding:3px 8px;border-radius:999px;font-size:11px;font-weight:700;background:rgba(245,158,11,.12);color:#9a6700}.teacher-lobby-state.ready{background:rgba(34,197,94,.12);color:#18713a}.teacher-lobby-meta{display:flex;align-items:center;gap:10px;white-space:nowrap}.teacher-lobby-meta code{font-weight:800;letter-spacing:.08em;padding:6px 9px;border-radius:8px;background:#f4f6f8}@media(max-width:900px){.teacher-team-plan-grid{grid-template-columns:1fr}.teacher-lobby-watch>article{align-items:flex-start;flex-direction:column}.teacher-lobby-meta{width:100%;justify-content:space-between}}

/* ========================================================================== */
/* Skill Trees & Mastery v25                                                  */
/* ========================================================================== */
.skill-bar{display:block;position:relative;height:7px;border-radius:999px;background:color-mix(in srgb,var(--text,#111827) 10%,transparent);overflow:hidden}.skill-bar em{display:block;height:100%;border-radius:inherit;background:currentColor;opacity:.72}.skill-hero{overflow:hidden}.skill-hero-stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.skill-hero-stats>div{min-width:150px;padding:14px 16px;border:1px solid var(--line,#e5e7eb);border-radius:18px;background:color-mix(in srgb,var(--surface,#fff) 92%,transparent)}.skill-hero-stats strong{display:block;font-size:1.35rem}.skill-hero-stats span{font-size:.78rem;opacity:.68}.skill-next-card{display:grid;grid-template-columns:1fr minmax(220px,320px);gap:24px;align-items:center;margin:20px 0;padding:24px;border:1px solid var(--line,#e5e7eb);border-radius:24px;background:linear-gradient(135deg,color-mix(in srgb,var(--surface,#fff) 94%,transparent),color-mix(in srgb,var(--accent,#6d5dfc) 8%,var(--surface,#fff)))}.skill-next-card>div:last-child{display:grid;gap:10px}.skill-next-card>div:last-child>strong{font-size:2rem}.skill-next-card span,.skill-branch-head>span,.skill-inline-next span{font-size:.72rem;font-weight:800;letter-spacing:.12em;opacity:.62}.skill-branch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:20px 0}.skill-branch-card{display:flex;flex-direction:column;gap:14px;padding:22px;border:1px solid var(--line,#e5e7eb);border-radius:24px;background:var(--surface,#fff);box-shadow:0 14px 40px rgba(20,24,40,.05)}.skill-branch-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;background:color-mix(in srgb,var(--accent,#6d5dfc) 10%,var(--surface,#fff));font-weight:900;font-size:1.3rem}.skill-branch-icon.xl{width:68px;height:68px;border-radius:22px;font-size:1.6rem}.skill-branch-head h2{margin:.15rem 0}.skill-branch-head p{margin:0;opacity:.68}.skill-branch-progress{display:flex;align-items:end;justify-content:space-between}.skill-branch-progress strong{font-size:2rem}.skill-branch-progress span{font-size:.78rem;font-weight:700;opacity:.7}.skill-branch-meta{display:flex;justify-content:space-between;gap:12px;font-size:.75rem;opacity:.66}.skill-principles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.skill-principles article{padding:16px;border-radius:16px;background:color-mix(in srgb,var(--surface,#fff) 88%,var(--text,#111827) 3%)}.skill-principles b,.skill-principles span{display:block}.skill-principles span{margin-top:4px;font-size:.78rem;opacity:.68}
.skill-branch-hero{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:28px 0 20px}.skill-branch-hero>a{grid-column:1/-1}.skill-branch-hero h1{margin:.1rem 0}.skill-branch-hero p{margin:0;opacity:.7}.skill-branch-hero aside{text-align:right}.skill-branch-hero aside strong{display:block;font-size:2.3rem}.skill-branch-hero aside span{font-size:.78rem;opacity:.65}.skill-inline-next{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:8px 0 22px;padding:16px 18px;border:1px solid var(--line,#e5e7eb);border-radius:18px;background:color-mix(in srgb,var(--accent,#6d5dfc) 5%,var(--surface,#fff))}.skill-inline-next div{display:grid;gap:2px}.skill-inline-next small{opacity:.65}.skill-roadmap{display:grid;gap:22px}.skill-tier{display:grid;grid-template-columns:140px 1fr;gap:18px}.skill-tier>header{padding-top:14px}.skill-tier>header span{font-size:.68rem;font-weight:900;letter-spacing:.14em;opacity:.55}.skill-tier>header h2{margin:.25rem 0}.skill-node-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.skill-node{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:16px;border:1px solid var(--line,#e5e7eb);border-radius:18px;color:inherit;text-decoration:none;background:var(--surface,#fff);transition:.18s ease}.skill-node:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(20,24,40,.08)}.skill-node .skill-bar{grid-column:2/4;height:5px}.skill-node-state{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:color-mix(in srgb,var(--text,#111827) 7%,transparent)}.skill-node>div:nth-child(2){display:grid;gap:2px}.skill-node>div:nth-child(2)>span{font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.52}.skill-node strong{font-size:.94rem}.skill-node small{font-size:.75rem;opacity:.65}.skill-node>b{font-size:.84rem}.skill-node.state-locked{opacity:.56}.skill-node.state-mastered{border-color:color-mix(in srgb,#31a36c 45%,var(--line,#e5e7eb))}.skill-node.state-mastery_ready{border-color:color-mix(in srgb,#8f6bf2 45%,var(--line,#e5e7eb))}.skill-node.boss{grid-column:span 2;background:linear-gradient(135deg,color-mix(in srgb,#8f6bf2 8%,var(--surface,#fff)),var(--surface,#fff));border-style:dashed}
.skill-detail-hero{padding:28px 0 22px}.skill-detail-hero h1{font-size:clamp(2rem,5vw,4.4rem);margin:.2rem 0}.skill-detail-hero>p{max-width:720px;font-size:1.05rem;opacity:.72}.skill-detail-score{display:grid;grid-template-columns:auto 1fr;gap:2px 16px;align-items:end;max-width:460px;margin-top:18px}.skill-detail-score strong{font-size:2.4rem}.skill-detail-score span{padding-bottom:8px;font-weight:700;opacity:.67}.skill-detail-score .skill-bar{grid-column:1/-1}.skill-detail-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,.8fr);gap:18px}.skill-evidence-rules{display:grid;gap:9px}.skill-evidence-rules article{display:grid;grid-template-columns:1fr auto;gap:6px 14px;padding:12px 14px;border:1px solid var(--line,#e5e7eb);border-radius:14px}.skill-evidence-rules article .skill-bar{grid-column:1/-1;height:5px}.skill-evidence-rules article div{display:grid}.skill-evidence-rules article span{font-size:.72rem;opacity:.6}.skill-evidence-rules article.done{background:color-mix(in srgb,#31a36c 5%,var(--surface,#fff))}.skill-actions{align-self:start;position:sticky;top:92px}.skill-actions>h2{margin:.25rem 0 16px}.skill-actions details>summary{cursor:pointer;font-weight:800;margin-bottom:12px}.skill-check-form{display:grid;gap:12px}.skill-check-form fieldset{border:0;margin:0;padding:12px;border-radius:14px;background:color-mix(in srgb,var(--text,#111827) 3%,transparent)}.skill-check-form legend{font-weight:700;font-size:.83rem;margin-bottom:8px}.skill-check-form fieldset label{display:flex;gap:8px;align-items:flex-start;padding:7px 0;font-size:.8rem}.skill-validation-form{display:grid;gap:12px}.skill-validation-form label{display:grid;gap:7px;font-weight:700}.skill-validation-form textarea{width:100%}.skill-complete-note{display:grid;gap:4px;padding:16px;border-radius:16px;background:color-mix(in srgb,#31a36c 7%,var(--surface,#fff))}.skill-evidence-timeline{margin-top:18px}.skill-evidence-timeline>div:last-child{display:grid;gap:8px}.skill-evidence-timeline article{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px;border-bottom:1px solid var(--line,#e5e7eb)}.skill-evidence-timeline article>i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-style:normal;background:color-mix(in srgb,var(--text,#111827) 6%,transparent)}.skill-evidence-timeline article>i.state-approved,.skill-evidence-timeline article>i.state-automatic{background:color-mix(in srgb,#31a36c 14%,transparent)}.skill-evidence-timeline article div{display:grid}.skill-evidence-timeline article span,.skill-evidence-timeline article small{font-size:.72rem;opacity:.62}.skill-lock-panel{max-width:860px}.skill-requirements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.skill-requirements article{display:grid;gap:3px;padding:14px;border-radius:14px;background:color-mix(in srgb,var(--text,#111827) 4%,transparent)}.skill-requirements span,.skill-requirements a{font-size:.75rem}.skill-requirements a{margin-top:5px;font-weight:700}
.mastery-brief{display:grid;grid-template-columns:1fr auto;gap:28px;padding:34px 0 24px}.mastery-brief h1{font-size:clamp(2.3rem,6vw,5rem);margin:.2rem 0}.mastery-brief p{max-width:760px;font-size:1.05rem;opacity:.72}.mastery-brief aside{align-self:center;text-align:right}.mastery-brief aside strong{display:block;font-size:3rem}.mastery-brief aside span{font-size:.75rem;opacity:.65}.mastery-brief-meta{display:flex;flex-wrap:wrap;gap:8px}.mastery-brief-meta span{padding:7px 10px;border-radius:999px;background:color-mix(in srgb,var(--text,#111827) 5%,transparent);font-size:.72rem}.mastery-workspace{display:grid;grid-template-columns:260px 1fr;gap:18px}.mastery-workspace>aside,.mastery-workspace>section{padding:20px;border:1px solid var(--line,#e5e7eb);border-radius:22px;background:var(--surface,#fff)}.mastery-workspace>aside{align-self:start;position:sticky;top:90px}.mastery-workspace>aside>span{font-size:.7rem;font-weight:900;letter-spacing:.13em}.mastery-workspace>aside li{margin:8px 0}.mastery-workspace>aside label{display:grid;gap:7px;margin-top:18px;font-size:.78rem;font-weight:700}.mastery-workspace>section fieldset{border:0;padding:16px;margin:12px 0;border-radius:16px;background:color-mix(in srgb,var(--text,#111827) 3%,transparent)}.mastery-workspace legend{font-weight:800}.mastery-workspace legend span{display:inline-grid;place-items:center;width:30px;height:30px;margin-right:8px;border-radius:10px;background:var(--surface,#fff)}.mastery-workspace fieldset label{display:flex;gap:10px;padding:8px 2px;font-size:.85rem}.mastery-result{max-width:900px;margin:45px auto;padding:34px;border:1px solid var(--line,#e5e7eb);border-radius:28px;background:var(--surface,#fff);text-align:center}.mastery-result h1{font-size:clamp(2rem,5vw,4rem)}.mastery-result-score strong{display:block;font-size:5rem;line-height:1}.mastery-result-score span{font-weight:800;opacity:.65}.mastery-result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0}.mastery-result-grid article{padding:16px;border-radius:16px;background:color-mix(in srgb,var(--text,#111827) 4%,transparent)}.mastery-result-grid b,.mastery-result-grid span{display:block}.mastery-result-grid b{font-size:1.35rem}.mastery-result-grid span{font-size:.72rem;opacity:.65}.mastery-result .hero-actions{justify-content:center}
.profile-mastery{margin:18px 0}.profile-mastery-branches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.profile-mastery-branches article{padding:14px;border-radius:15px;background:color-mix(in srgb,var(--text,#111827) 4%,transparent)}.profile-mastery-branches span,.profile-mastery-branches strong,.profile-mastery-branches small{display:block}.profile-mastery-branches strong{font-size:1.35rem;margin-top:5px}.profile-mastery-branches small{opacity:.6}.profile-top-skills{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px}.profile-top-skills>strong{margin-right:4px}.profile-top-skills>span{padding:7px 10px;border:1px solid var(--line,#e5e7eb);border-radius:999px;font-size:.76rem}
.teacher-skill-table-wrap{overflow:auto}.teacher-skill-table{width:100%;border-collapse:separate;border-spacing:0}.teacher-skill-table th,.teacher-skill-table td{padding:11px 12px;border-bottom:1px solid var(--line,#e5e7eb);text-align:left;white-space:nowrap}.teacher-skill-table th{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;opacity:.55}.teacher-skill-table td>a{font-weight:800;color:inherit}.mastery-cell{display:inline-grid;min-width:58px;place-items:center;padding:6px 8px;border-radius:10px;font-weight:800;background:color-mix(in srgb,var(--text,#111827) 5%,transparent)}.mastery-cell.level-mastered,.mastery-cell.level-expert{background:color-mix(in srgb,#31a36c 13%,transparent)}.mastery-cell.level-advanced{background:color-mix(in srgb,#5c8df6 12%,transparent)}.mastery-cell.level-developing,.mastery-cell.level-beginner{background:color-mix(in srgb,#d99b35 14%,transparent)}.teacher-validation-list{display:grid;gap:8px}.teacher-validation-list>article{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:14px;border:1px solid var(--line,#e5e7eb);border-radius:14px}.teacher-validation-list>article>div:first-child{display:grid;gap:2px}.teacher-validation-list span,.teacher-validation-list small{font-size:.75rem;opacity:.65}.teacher-validation-actions{display:flex;gap:8px;align-items:center}.teacher-validation-actions form{display:flex;gap:6px}.teacher-validation-actions input{max-width:190px}.teacher-student-branch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.teacher-student-branch-grid article{padding:13px;border-radius:14px;background:color-mix(in srgb,var(--text,#111827) 4%,transparent)}.teacher-student-branch-grid span,.teacher-student-branch-grid strong,.teacher-student-branch-grid small{display:block}.teacher-student-branch-grid strong{font-size:1.45rem}.teacher-skill-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:16px}.teacher-skill-row{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:11px;border:1px solid var(--line,#e5e7eb);border-radius:13px;color:inherit;text-decoration:none}.teacher-skill-row div{display:grid}.teacher-skill-row small{font-size:.7rem;opacity:.6}.teacher-evidence-list{display:grid;gap:7px}.teacher-evidence-list article{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px;border-bottom:1px solid var(--line,#e5e7eb)}.teacher-evidence-list article>i{font-style:normal}.teacher-evidence-list article>div{display:grid}.teacher-evidence-list span{font-size:.72rem;opacity:.6}.teacher-skill-evidence-form{display:grid;grid-template-columns:1fr 160px 2fr auto;gap:10px;align-items:end;margin-top:16px}.teacher-skill-evidence-form label{display:grid;gap:6px;font-size:.72rem;font-weight:700}
@media(max-width:1050px){.skill-branch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.skill-node-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.skill-detail-layout{grid-template-columns:1fr}.skill-actions{position:static}.teacher-skill-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-skill-evidence-form{grid-template-columns:1fr 1fr}.teacher-skill-evidence-form .wide{grid-column:1/-1}}
@media(max-width:760px){.skill-next-card,.skill-branch-hero,.mastery-brief,.mastery-workspace{grid-template-columns:1fr}.skill-branch-grid,.skill-principles,.profile-mastery-branches,.teacher-student-branch-grid,.mastery-result-grid{grid-template-columns:1fr}.skill-tier{grid-template-columns:1fr}.skill-node-grid{grid-template-columns:1fr}.skill-node.boss{grid-column:auto}.skill-branch-hero aside,.mastery-brief aside{text-align:left}.skill-requirements{grid-template-columns:1fr}.mastery-workspace>aside{position:static}.teacher-validation-list>article{grid-template-columns:1fr}.teacher-validation-actions{align-items:stretch;flex-direction:column}.teacher-validation-actions form{width:100%}.teacher-validation-actions input{max-width:none;flex:1}.teacher-skill-detail-grid{grid-template-columns:1fr}.teacher-skill-evidence-form{grid-template-columns:1fr}}
.dashboard-skill-preview{margin:18px 0}.dashboard-skill-branches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.dashboard-skill-branches article{display:grid;grid-template-columns:1fr auto;gap:7px 12px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--text,#111827) 4%,transparent)}.dashboard-skill-branches article .skill-bar{grid-column:1/-1;height:5px}.dashboard-skill-next{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;margin-top:12px;padding:12px 14px;border:1px solid var(--line,#e5e7eb);border-radius:14px;color:inherit;text-decoration:none}.dashboard-skill-next>span{font-size:.7rem;font-weight:800;text-transform:uppercase;opacity:.55}.dashboard-skill-next>small{opacity:.65}@media(max-width:760px){.dashboard-skill-branches{grid-template-columns:1fr}.dashboard-skill-next{grid-template-columns:1fr}}

/* Skill assignments + profile skill showcase ----------------------------- */
.teacher-skill-assignments{margin-top:16px}.teacher-skill-assign-form{display:grid;grid-template-columns:2fr 1fr 1.6fr 1fr 1fr auto;gap:9px;align-items:end}.teacher-skill-assign-form label{display:grid;gap:6px;font-size:.7rem;font-weight:800}.teacher-skill-assign-form select,.teacher-skill-assign-form input{min-width:0}.teacher-assignment-list{display:grid;gap:7px;margin-top:14px}.teacher-assignment-list article{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line,#e5e7eb);border-radius:13px}.teacher-assignment-list article.cancelled{opacity:.52}.teacher-assignment-list article>div{display:grid;gap:2px}.teacher-assignment-list span,.teacher-assignment-list small{font-size:.7rem;opacity:.65}.student-skill-assignments{margin:0 0 18px}.student-assignment-list{display:grid;gap:8px}.student-assignment-list>a{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--line,#e5e7eb);border-radius:14px;text-decoration:none;color:inherit}.student-assignment-list>a.required{border-left:4px solid currentColor}.student-assignment-list>a>div{display:grid;gap:3px}.student-assignment-list span{font-size:.66rem;font-weight:900;letter-spacing:.07em;opacity:.56}.student-assignment-list strong{font-size:.88rem}.badge-picker.skill-picker label span b{min-width:42px;text-align:center;font-size:.65rem}
@media(max-width:1100px){.teacher-skill-assign-form{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-skill-assign-form button{width:100%}}@media(max-width:760px){.teacher-skill-assign-form{grid-template-columns:1fr}.teacher-assignment-list article{grid-template-columns:1fr}.student-assignment-list>a{grid-template-columns:1fr}}
.team-skill-coverage{margin:16px 0}.team-skill-coverage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.team-skill-coverage-grid article{display:grid;grid-template-columns:1fr auto;gap:5px 10px;padding:13px;border:1px solid var(--line,#e5e7eb);border-radius:14px}.team-skill-coverage-grid article>div{display:grid;gap:2px}.team-skill-coverage-grid span,.team-skill-coverage-grid small{font-size:.7rem;opacity:.65}.team-skill-coverage-grid small{grid-column:1/-1}.team-skill-coverage-grid article.covered{background:color-mix(in srgb,#31a36c 6%,var(--surface,#fff))}.team-skill-coverage-grid article.missing{background:color-mix(in srgb,#d99b35 5%,var(--surface,#fff))}@media(max-width:1000px){.team-skill-coverage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.team-skill-coverage-grid{grid-template-columns:1fr}}
.skill-kb-action{display:grid;gap:10px}.skill-kb-action p{margin:0;font-size:.78rem;opacity:.7}

/* Project Workspace v2 ---------------------------------------------------- */
.view-project_workspace main{padding-top:34px}.pw-project-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:end;margin:6px 0 18px}.pw-project-head h1{font-size:clamp(2rem,5vw,4.2rem);margin-bottom:10px}.pw-project-head p{max-width:760px;margin:0}.pw-head-progress{min-width:150px;padding:18px 20px;border:1px solid var(--line);border-radius:20px;background:var(--surface);text-align:right;box-shadow:var(--shadow)}.pw-head-progress strong,.pw-head-progress span{display:block}.pw-head-progress strong{font-size:2.2rem;line-height:1}.pw-head-progress span{margin-top:6px;color:var(--muted);font-size:.72rem;font-weight:750}.pw-project-switcher{display:flex;gap:8px;overflow:auto;margin:0 0 16px;padding-bottom:4px}.pw-project-switcher a{min-width:210px;padding:10px 13px;border:1px solid var(--line);border-radius:14px;background:var(--surface);text-decoration:none;display:grid}.pw-project-switcher a.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.pw-project-switcher small{font-size:.62rem;color:var(--muted)}.pw-project-switcher strong{font-size:.78rem}.pw-lifecycle{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:18px 0}.pw-lifecycle span{display:flex;align-items:center;gap:7px;padding:8px 10px;border-radius:12px;background:var(--surface-2);font-size:.68rem;font-weight:800;color:var(--muted)}.pw-lifecycle i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--surface);font-style:normal;font-size:.62rem}.pw-lifecycle span.done{color:var(--ok)}.pw-lifecycle span.done i{background:var(--ok-soft)}.pw-lifecycle span.active{background:var(--accent-soft);color:var(--accent)}.pw-lifecycle span.active i{background:var(--accent);color:#fff}.pw-tabs{display:flex;gap:6px;align-items:center;margin:0 0 20px;padding:5px;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:auto}.pw-tabs a{display:flex;align-items:center;gap:6px;min-height:42px;padding:0 14px;border-radius:11px;text-decoration:none;font-size:.78rem;font-weight:800;white-space:nowrap;color:var(--muted)}.pw-tabs a.active{background:var(--text);color:var(--surface)}.pw-tabs b{min-width:18px;height:18px;padding:0 5px;display:grid;place-items:center;border-radius:99px;background:var(--bad);color:#fff;font-size:.6rem}.pw-role-onboarding{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 18px;padding:18px 20px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line));border-radius:18px;background:linear-gradient(110deg,var(--accent-soft),var(--surface))}.pw-role-onboarding h2{font-size:1.25rem;margin-bottom:5px}.pw-role-onboarding p{margin:0;max-width:700px;font-size:.8rem}.pw-overview-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:16px}.pw-next-action,.pw-my-role{border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow);padding:26px}.pw-next-action{position:relative;overflow:hidden}.pw-next-action:after{content:"";position:absolute;right:-70px;bottom:-100px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,var(--accent-soft),transparent 68%);pointer-events:none}.pw-next-action h2{font-size:2rem;margin:12px 0 8px;max-width:650px}.pw-next-action p{max-width:650px}.pw-task-state{display:inline-flex;padding:5px 9px;border-radius:99px;background:var(--surface-2);font-size:.62rem;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.pw-task-state.status-blocked{background:var(--bad-soft);color:var(--bad)}.pw-task-state.status-in_progress{background:var(--accent-soft);color:var(--accent)}.pw-next-meta{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0}.pw-next-meta span{padding:6px 9px;border:1px solid var(--line);border-radius:9px;font-size:.68rem;font-weight:750}.pw-all-clear i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--ok-soft);color:var(--ok);font-style:normal;font-weight:950}.pw-all-clear h2{font-size:1.5rem}.pw-role-list{display:flex;flex-wrap:wrap;gap:7px}.pw-role-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid var(--line);border-radius:11px;background:var(--surface-2);font-size:.67rem;font-weight:850}.pw-role-chip i{font-style:normal}.pw-role-chip small{font-size:.52rem;color:var(--muted);font-weight:700}.pw-responsibility-list{padding-left:18px;margin:18px 0 0}.pw-responsibility-list li{margin:7px 0;color:var(--muted);font-size:.76rem}.pw-stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0 16px}.pw-stat-row article{padding:15px 16px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.pw-stat-row span,.pw-stat-row strong,.pw-stat-row small{display:block}.pw-stat-row span{font-size:.62rem;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-weight:850}.pw-stat-row strong{font-size:1.5rem;margin:3px 0}.pw-stat-row small{font-size:.64rem;color:var(--muted)}.pw-overview-lower{display:grid;grid-template-columns:1fr 1fr;gap:16px}.pw-signals{display:grid;gap:8px}.pw-signals article{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:center;padding:10px 11px;border-radius:13px;background:var(--surface-2);font-size:.75rem}.pw-signals i{width:26px;height:26px;border-radius:9px;display:grid;place-items:center;font-style:normal;font-weight:950}.pw-signals .severity-ok i{background:var(--ok-soft);color:var(--ok)}.pw-signals .severity-high i{background:var(--bad-soft);color:var(--bad)}.pw-signals .severity-medium i{background:#fff5dc;color:#9a6500}.pw-team-compact{display:grid;gap:8px}.pw-team-compact article{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;padding:8px;border-bottom:1px solid var(--line)}.pw-team-compact article>div:last-child{display:grid}.pw-team-compact span{font-size:.68rem;color:var(--muted)}.pw-skill-context{margin-top:16px}.pw-skill-context-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.pw-skill-context-grid a{padding:12px;border:1px solid var(--line);border-radius:13px;text-decoration:none;display:grid;gap:2px}.pw-skill-context-grid span,.pw-skill-context-grid small{font-size:.66rem;color:var(--muted)}

.pw-work-layout,.pw-team-layout,.pw-qa-layout,.pw-retro-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}.pw-work-layout>main,.pw-team-layout>main,.pw-qa-layout>main,.pw-retro-layout>main{display:grid;gap:16px}.pw-work-layout>aside,.pw-team-layout>aside,.pw-qa-layout>aside,.pw-retro-layout>aside{display:grid;gap:16px;position:sticky;top:95px}.pw-my-task-list{display:grid;gap:7px}.pw-task-row{display:grid;grid-template-columns:8px 1fr auto;gap:10px;align-items:center;padding:11px 12px;border:1px solid var(--line);border-radius:13px;text-decoration:none}.pw-task-row>i{width:8px;height:8px;border-radius:50%;background:var(--muted)}.pw-task-row.status-in_progress>i{background:var(--accent)}.pw-task-row.status-done>i{background:var(--ok)}.pw-task-row.status-blocked>i{background:var(--bad)}.pw-task-row>div{display:grid}.pw-task-row span,.pw-task-row time{font-size:.66rem;color:var(--muted)}.pw-board{overflow:hidden}.pw-board-grid{display:grid;grid-template-columns:repeat(5,minmax(160px,1fr));gap:8px;overflow:auto;padding-bottom:5px}.pw-board-col{min-width:160px;padding:7px;border-radius:13px;background:var(--surface-2)}.pw-board-col>header{display:flex;justify-content:space-between;padding:5px 5px 8px;font-size:.68rem}.pw-board-col>header span{min-width:20px;height:20px;border-radius:99px;background:var(--surface);display:grid;place-items:center}.pw-board-card{display:grid;gap:3px;margin-bottom:6px;padding:10px;background:var(--surface);border:1px solid var(--line);border-radius:11px;text-decoration:none}.pw-board-card strong{font-size:.72rem}.pw-board-card span,.pw-board-card small{font-size:.61rem;color:var(--muted)}.pw-blocked-lane{margin-top:10px;padding:10px;border-radius:13px;background:var(--bad-soft);display:grid;gap:5px}.pw-blocked-lane>a{display:grid;text-decoration:none;padding:7px;border-radius:9px;background:color-mix(in srgb,var(--surface) 75%,transparent)}.pw-blocked-lane span{font-size:.72rem;font-weight:800}.pw-blocked-lane small{font-size:.62rem;color:var(--bad)}.pw-task-detail h2{margin-bottom:8px}.pw-task-detail-meta{display:flex;gap:6px;flex-wrap:wrap}.pw-task-detail-meta span{padding:5px 7px;border-radius:8px;background:var(--surface-2);font-size:.63rem}.pw-dod,.pw-deps{display:grid;gap:5px;margin-top:16px;padding:12px;border-radius:13px;background:var(--surface-2)}.pw-dod strong,.pw-deps strong{font-size:.7rem}.pw-dod span,.pw-deps span{font-size:.68rem}.pw-deps span.done{color:var(--ok)}.pw-status-form{display:grid;gap:8px;margin-top:16px}.pw-status-form label,.pw-task-create label,.pw-qa-form label,.pw-checkin label,.pw-retro-form label,.pw-peer-form label,.pw-team-retro-form label,.pw-decision-form label{display:grid;gap:5px;font-size:.7rem;font-weight:780}.pw-block-fields{display:grid;gap:8px}.pw-dialog{width:min(650px,calc(100% - 24px));max-height:90vh;border:1px solid var(--line);border-radius:24px;padding:0;background:var(--surface);color:var(--text);box-shadow:0 30px 90px rgba(0,0,0,.25)}.pw-dialog::backdrop{background:rgba(17,24,39,.42);backdrop-filter:blur(5px)}.pw-task-create{display:grid;gap:12px;padding:28px;position:relative}.pw-dialog-close{position:absolute;right:16px;top:14px;width:36px;height:36px;border-radius:11px;border:1px solid var(--line);background:var(--surface-2);font-size:1.2rem;cursor:pointer}.pw-form-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pw-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.pw-check-grid label{display:flex;gap:7px;align-items:flex-start;padding:8px;border:1px solid var(--line);border-radius:10px;font-size:.68rem}.pw-empty-mini{padding:14px;border:1px dashed var(--line);border-radius:13px;color:var(--muted);font-size:.75rem;text-align:center}

.pw-role-picker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.pw-role-card{display:flex;flex-direction:column;padding:16px;border:1px solid var(--line);border-radius:17px;background:var(--surface)}.pw-role-card.mine{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.pw-role-card.growth{background:linear-gradient(155deg,var(--surface),color-mix(in srgb,#7c3aed 5%,var(--surface)))}.pw-role-card-head{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center}.pw-role-card-head>i{width:36px;height:36px;border-radius:11px;background:var(--surface-2);display:grid;place-items:center;font-style:normal;font-weight:950}.pw-role-card-head span{font-size:.56rem;text-transform:uppercase;color:var(--muted);font-weight:850}.pw-role-card-head h3{font-size:1rem;margin:1px 0}.pw-role-card-head b{font-size:.72rem;color:var(--accent)}.pw-role-card>p{font-size:.68rem;min-height:64px}.pw-role-reason{display:grid;gap:2px;padding:9px;border-radius:11px;background:var(--surface-2);margin:auto 0 8px}.pw-role-reason strong{font-size:.62rem}.pw-role-reason span{font-size:.61rem;color:var(--muted)}.pw-role-card>small{font-size:.59rem;color:var(--muted);margin-bottom:8px}.pw-role-card form{display:grid;gap:6px}.pw-role-selected{padding:9px;border-radius:10px;background:var(--ok-soft);color:var(--ok);text-align:center;font-size:.68rem;font-weight:850}.pw-coverage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.pw-coverage-grid article{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:13px}.pw-coverage-grid i{font-style:normal}.pw-coverage-grid div{display:grid}.pw-coverage-grid span{font-size:.59rem;text-transform:uppercase;color:var(--muted)}.pw-coverage-grid article.covered{background:color-mix(in srgb,var(--ok) 5%,var(--surface))}.pw-coverage-grid article.missing{background:color-mix(in srgb,#d99b35 5%,var(--surface))}.pw-member-list{display:grid;gap:5px}.pw-member-list>article{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px;border-bottom:1px solid var(--line)}.pw-member-main{display:grid;gap:5px}.pw-member-work{text-align:right}.pw-member-work strong,.pw-member-work span{display:block}.pw-member-work span{font-size:.58rem;color:var(--muted)}.pw-no-role{font-size:.65rem;color:var(--muted)}.pw-decision-form{display:grid;grid-template-columns:1fr 1.5fr auto;gap:8px;align-items:end}.pw-decision-list{display:grid;gap:7px;margin-top:14px}.pw-decision-list article{padding:10px 12px;border-left:3px solid var(--accent);background:var(--surface-2);border-radius:0 11px 11px 0}.pw-decision-list strong{font-size:.72rem}.pw-decision-list p{font-size:.68rem;margin:3px 0}.pw-decision-list small{font-size:.58rem;color:var(--muted)}.pw-mood-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0 12px}.pw-mood-picker label{display:block}.pw-mood-picker input{position:absolute;opacity:0}.pw-mood-picker span{display:grid;place-items:center;gap:3px;padding:10px 4px;border:1px solid var(--line);border-radius:11px;cursor:pointer;font-size:.8rem}.pw-mood-picker b{font-size:.58rem}.pw-mood-picker input:checked+span{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--accent-soft)}.pw-checkin form{display:grid;gap:8px}.pw-privacy{display:flex!important;grid-template-columns:auto 1fr!important;align-items:flex-start;gap:7px!important;font-size:.64rem!important}.pw-pulse>div{display:flex;gap:6px;flex-wrap:wrap}.pw-pulse>div span{padding:7px 9px;border-radius:9px;background:var(--surface-2);font-size:.7rem}.pw-pulse p{font-size:.65rem}

.pw-qa-list{display:grid;gap:9px}.pw-qa-list article{padding:14px;border:1px solid var(--line);border-radius:15px;background:var(--surface)}.pw-qa-list article.severity-critical{border-left:4px solid var(--bad)}.pw-qa-list article.severity-medium{border-left:4px solid #d99b35}.pw-qa-list article.status-verified{opacity:.7;border-left-color:var(--ok)}.pw-qa-list header{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}.pw-qa-list header span,.pw-qa-list header b{font-size:.6rem}.pw-qa-list header span{padding:4px 6px;border-radius:7px;background:var(--surface-2)}.pw-qa-list p{font-size:.7rem}.pw-qa-compare{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pw-qa-compare span{padding:8px;border-radius:10px;background:var(--surface-2);font-size:.65rem}.pw-qa-compare b{display:block}.pw-qa-list footer{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:10px}.pw-qa-list footer small{font-size:.6rem;color:var(--muted)}.pw-qa-list footer form{display:flex;gap:6px}.pw-qa-form{display:grid;gap:8px}.pw-qa-tip{font-size:.72rem}.pw-qa-tip p{font-size:.68rem}

.pw-retro-locked,.pw-retro-intro{padding:24px;border:1px solid var(--line);border-radius:24px;background:var(--surface);margin-bottom:18px}.pw-retro-locked h1,.pw-retro-intro h1{font-size:clamp(1.8rem,4vw,3.2rem)}.pw-retro-progress strong,.pw-retro-progress span{display:block}.pw-retro-progress strong{font-size:2rem}.pw-retro-intro{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}.pw-retro-status{display:flex;gap:6px;flex-wrap:wrap}.pw-retro-status span{padding:8px 10px;border-radius:10px;background:var(--surface-2);font-size:.67rem;font-weight:800}.pw-retro-form,.pw-team-retro-form{display:grid;gap:10px}.pw-retro-form fieldset{margin:0}.pw-rating-line{display:grid!important;grid-template-columns:1fr 140px!important;align-items:center!important;margin:6px 0}.pw-saved{font-size:.68rem;color:var(--ok);font-weight:850}.pw-peer-list{display:grid;gap:8px}.pw-peer-list details{border:1px solid var(--line);border-radius:14px;overflow:hidden}.pw-peer-list summary{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:10px 12px;cursor:pointer;list-style:none}.pw-peer-list summary b{font-size:.62rem;color:var(--muted)}.pw-peer-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;background:var(--surface-2)}.pw-peer-form label:nth-of-type(n+5),.pw-peer-form .pw-feedback-tip,.pw-peer-form button{grid-column:1/-1}.pw-feedback-tip{padding:8px;border-radius:9px;background:var(--surface);font-size:.65rem;color:var(--muted)}.pw-team-retro-form{grid-template-columns:repeat(3,1fr)}.pw-team-retro-form button{grid-column:1/-1;justify-self:start}.pw-team-retro-form label>span{font-size:.58rem;color:var(--accent);letter-spacing:.08em}.pw-team-retro-summary{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);display:grid;gap:10px}.pw-team-retro-summary>div{display:grid;grid-template-columns:90px 1fr;gap:8px}.pw-team-retro-summary>div>span{font-size:.6rem;font-weight:900;color:var(--accent)}.pw-team-retro-summary p{margin:0 0 4px;font-size:.68rem}.pw-eval-score{display:flex;align-items:baseline;gap:8px;padding:14px;border-radius:13px;background:var(--surface-2);margin:10px 0}.pw-eval-score strong{font-size:2rem}.pw-eval-score span{font-size:.7rem}.pw-evaluation>div b{font-size:.65rem}.pw-evaluation>div p{font-size:.7rem}.pw-eval-note{padding-top:10px;border-top:1px solid var(--line);font-size:.63rem!important}.pw-peer-avg{display:grid;grid-template-columns:1fr 1fr;gap:6px}.pw-peer-avg span{padding:8px;border-radius:9px;background:var(--surface-2);font-size:.58rem}.pw-peer-avg b{display:block;font-size:.8rem}.pw-retro-layout blockquote{margin:8px 0;padding:9px 11px;border-left:3px solid var(--accent);background:var(--surface-2);font-size:.68rem;color:var(--muted)}

.profile-role-experience{margin:18px 0}.profile-role-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.profile-role-grid article{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:14px}.profile-role-grid i{width:34px;height:34px;border-radius:10px;background:var(--surface-2);display:grid;place-items:center;font-style:normal}.profile-role-grid div{display:grid}.profile-role-grid span{font-size:.63rem;color:var(--muted)}.profile-role-grid b{font-size:.64rem}.profile-role-growth{display:grid;grid-template-columns:auto 1fr;gap:9px;margin-top:12px;padding:10px;border-radius:12px;background:var(--accent-soft)}.profile-role-growth span{font-size:.6rem;text-transform:uppercase;font-weight:900;color:var(--accent)}.profile-role-growth p{margin:0;font-size:.68rem}

/* Teacher Project Workspace */
.teacher-workspace-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.teacher-team-health{padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}.teacher-team-health.attention{border-left:4px solid #d99b35}.teacher-team-health.ok{border-left:4px solid var(--ok)}.teacher-team-health header{display:grid;grid-template-columns:1fr auto;gap:12px}.teacher-team-health header span{font-size:.62rem;text-transform:uppercase;color:var(--muted);font-weight:850}.teacher-team-health header h2{font-size:1.3rem;margin:4px 0}.teacher-team-health header p{font-size:.7rem;margin:0}.teacher-team-health header>strong{font-size:2rem}.teacher-team-health-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:12px 0}.teacher-team-health-stats span{padding:8px;border-radius:9px;background:var(--surface-2);font-size:.6rem}.teacher-team-health-stats b{display:block;font-size:1rem}.teacher-health-signals{display:grid;gap:5px}.teacher-health-signals span{padding:7px 9px;border-radius:9px;background:var(--surface-2);font-size:.64rem}.teacher-health-signals .severity-high{background:var(--bad-soft);color:var(--bad)}.teacher-health-signals .severity-medium{background:#fff5dc;color:#8b6206}.teacher-health-signals .severity-ok{background:var(--ok-soft);color:var(--ok)}.teacher-health-signals.large span{font-size:.72rem;padding:10px}.teacher-team-workspace-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:18px;margin:14px 0}.teacher-team-workspace-head h1{font-size:2.6rem;margin-bottom:6px}.teacher-workspace-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:14px}.teacher-workspace-kpis article{padding:12px 14px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.teacher-workspace-kpis span,.teacher-workspace-kpis strong{display:block}.teacher-workspace-kpis span{font-size:.6rem;text-transform:uppercase;color:var(--muted);font-weight:850}.teacher-workspace-kpis strong{font-size:1.3rem}.teacher-workspace-cols{align-items:start}.teacher-workspace-cols>main,.teacher-workspace-cols>aside{display:grid;gap:14px}.teacher-workspace-cols>aside{position:sticky;top:92px}.teacher-role-coverage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.teacher-role-coverage article{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px}.teacher-role-coverage i{font-style:normal}.teacher-role-coverage div{display:grid}.teacher-role-coverage span,.teacher-role-coverage small{font-size:.58rem;color:var(--muted)}.teacher-role-coverage article.covered{background:color-mix(in srgb,var(--ok) 5%,var(--surface))}.teacher-role-coverage article.missing{background:color-mix(in srgb,#d99b35 5%,var(--surface))}.teacher-workspace-members{display:grid;gap:6px}.teacher-workspace-members>article{display:grid;grid-template-columns:auto 1fr auto auto;gap:10px;align-items:center;padding:10px;border-bottom:1px solid var(--line)}.teacher-member-evidence{display:grid}.teacher-member-evidence span,.teacher-member-evidence small{font-size:.63rem;color:var(--muted)}.teacher-member-eval-state{text-align:right}.teacher-member-eval-state b,.teacher-member-eval-state span{display:block}.teacher-member-eval-state span{font-size:.58rem;color:var(--muted)}.teacher-member-actions{display:flex;gap:6px;align-items:center}.teacher-member-actions details{position:relative}.teacher-member-actions summary{font-size:.62rem;cursor:pointer}.teacher-inline-role{position:absolute;right:0;z-index:5;width:250px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:var(--shadow);display:grid;gap:6px}.teacher-workspace-task-table{overflow:auto}.teacher-workspace-task-table .head,.teacher-workspace-task-table .row{display:grid;grid-template-columns:minmax(220px,2fr) 1fr 1fr 1fr 90px;gap:8px;align-items:center;min-width:760px;padding:9px;border-bottom:1px solid var(--line)}.teacher-workspace-task-table .head{font-size:.58rem;text-transform:uppercase;color:var(--muted);font-weight:850}.teacher-workspace-task-table .row{font-size:.68rem}.teacher-workspace-task-table .row small{display:block;color:var(--bad)}.teacher-qa-list,.teacher-peer-list,.teacher-checkin-list,.teacher-mini-list{display:grid;gap:7px}.teacher-qa-list article,.teacher-peer-list article,.teacher-checkin-list article,.teacher-mini-list article{padding:10px;border:1px solid var(--line);border-radius:12px}.teacher-qa-list article>div{display:grid}.teacher-qa-list article span,.teacher-qa-list article small{font-size:.62rem;color:var(--muted)}.teacher-qa-list article p{font-size:.66rem;margin:4px 0}.teacher-peer-list article.status-flagged{border-color:#d99b35;background:#fff9ea}.teacher-peer-list header{display:flex;justify-content:space-between;gap:8px}.teacher-peer-list header span{font-size:.58rem;text-transform:uppercase}.teacher-peer-ratings{display:flex;gap:5px;flex-wrap:wrap;margin:7px 0}.teacher-peer-ratings span{padding:5px 7px;border-radius:8px;background:var(--surface-2);font-size:.58rem}.teacher-peer-list p{font-size:.66rem}.teacher-moderate{display:flex;gap:6px}.teacher-checkin-list article{display:grid;gap:3px}.teacher-checkin-list span,.teacher-checkin-list small,.teacher-mini-list span,.teacher-mini-list small{font-size:.61rem;color:var(--muted)}.teacher-checkin-list p{font-size:.65rem;margin:2px 0}.teacher-role-evaluation{margin-top:16px}.teacher-role-rubric{display:grid;gap:6px}.teacher-role-rubric article{display:grid;grid-template-columns:1fr 230px;gap:12px;align-items:center;padding:10px;border-bottom:1px solid var(--line)}.teacher-role-rubric p{font-size:.65rem;margin:3px 0}.teacher-eval-submit{display:flex;justify-content:flex-end;gap:10px;align-items:end;margin-top:12px}.teacher-eval-submit label{display:grid;gap:5px;font-size:.65rem;font-weight:800}

@media(max-width:1050px){.pw-overview-grid,.pw-work-layout,.pw-team-layout,.pw-qa-layout,.pw-retro-layout{grid-template-columns:1fr}.pw-work-layout>aside,.pw-team-layout>aside,.pw-qa-layout>aside,.pw-retro-layout>aside,.teacher-workspace-cols>aside{position:static}.pw-role-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pw-skill-context-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-workspace-summary{grid-template-columns:1fr}.teacher-role-coverage{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.pw-project-head,.pw-retro-intro,.teacher-team-workspace-head{grid-template-columns:1fr}.pw-head-progress{text-align:left;min-width:0}.pw-lifecycle{display:flex;overflow:auto}.pw-lifecycle span{min-width:110px}.pw-stat-row,.pw-overview-lower,.pw-role-picker-grid,.pw-coverage-grid,.profile-role-grid,.teacher-workspace-kpis,.teacher-role-coverage{grid-template-columns:1fr}.pw-skill-context-grid{grid-template-columns:1fr}.pw-form-two,.pw-check-grid,.pw-qa-compare,.pw-peer-form,.pw-team-retro-form{grid-template-columns:1fr}.pw-peer-form label,.pw-peer-form .pw-feedback-tip,.pw-peer-form button,.pw-team-retro-form button{grid-column:auto}.pw-decision-form{grid-template-columns:1fr}.pw-team-retro-summary>div{grid-template-columns:1fr}.pw-board-grid{grid-template-columns:repeat(5,210px)}.pw-qa-list header{grid-template-columns:1fr}.pw-qa-list footer{align-items:flex-start;flex-direction:column}.teacher-workspace-members>article{grid-template-columns:auto 1fr}.teacher-member-eval-state,.teacher-member-actions{grid-column:2}.teacher-role-rubric article{grid-template-columns:1fr}.teacher-eval-submit{align-items:stretch;flex-direction:column}.teacher-team-health-stats{grid-template-columns:repeat(2,1fr)}.pw-role-onboarding{align-items:flex-start;flex-direction:column}.pw-rating-line{grid-template-columns:1fr!important}.pw-project-head h1{font-size:2.25rem}}
@media(max-width:520px){.pw-tabs{margin-left:-8px;margin-right:-8px}.pw-next-action,.pw-my-role,.dashboard-panel{border-radius:18px}.pw-next-action{padding:20px}.pw-role-card-head{grid-template-columns:auto 1fr}.pw-role-card-head>b{grid-column:2}.pw-member-list>article{grid-template-columns:auto 1fr}.pw-member-work{grid-column:2;text-align:left}.pw-mood-picker{grid-template-columns:1fr}.teacher-team-health-stats{grid-template-columns:1fr 1fr}}

/* EDUCANET Project Workspace v26 refinements */
.pw-role-selected-wrap{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:auto}.pw-role-selected-wrap form{margin:0}.link-button.danger{color:var(--danger,#c83d4f)}
.pw-task-edit{margin-top:1rem;border-top:1px solid var(--line);padding-top:.9rem}.pw-task-edit>summary{cursor:pointer;font-weight:800;list-style:none}.pw-task-edit>summary::-webkit-details-marker{display:none}.pw-task-edit>summary:after{content:'+';float:right}.pw-task-edit[open]>summary:after{content:'−'}.pw-task-edit-form{display:grid;gap:.85rem;margin-top:1rem}.pw-task-edit-form fieldset{border:0;padding:0;margin:0}.pw-task-edit-form legend{font-weight:750;margin-bottom:.55rem}.pw-task-edit-form label{display:grid;gap:.35rem;font-weight:700}.pw-task-edit-form input,.pw-task-edit-form textarea,.pw-task-edit-form select{width:100%}
.dashboard-project-workspace{overflow:hidden}.dashboard-project-workspace-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin-top:.9rem}.dashboard-project-workspace-grid>div{display:grid;gap:.2rem;padding:.85rem 1rem;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--card) 90%,var(--accent) 10%)}.dashboard-project-workspace-grid span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800}.dashboard-project-workspace-grid strong{font-size:.95rem}.dashboard-project-next{display:grid;gap:.2rem;margin-top:.8rem;padding:1rem 1.1rem;border-radius:18px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));background:color-mix(in srgb,var(--accent) 8%,var(--card));text-decoration:none;color:inherit}.dashboard-project-next:hover{transform:translateY(-1px)}.dashboard-project-next span{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.dashboard-project-next strong{font-size:1.08rem}.dashboard-project-next small{color:var(--muted)}.dashboard-project-next.clear{border-color:var(--line);background:var(--card)}
@media(max-width:760px){.dashboard-project-workspace-grid{grid-template-columns:1fr}.pw-role-selected-wrap{align-items:flex-start;flex-direction:column}}
.pw-carry-over blockquote{margin:.8rem 0 .45rem;padding:1rem 1.1rem;border-left:3px solid var(--accent);border-radius:0 14px 14px 0;background:color-mix(in srgb,var(--accent) 7%,var(--card));font-size:1.02rem}.pw-carry-over>p{color:var(--muted);margin:.25rem 0 0}
.pw-team-skill-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.pw-team-skill-grid article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.25rem .8rem;align-items:center;padding:.85rem 1rem;border:1px solid var(--line);border-radius:16px}.pw-team-skill-grid article>div{display:grid;gap:.15rem}.pw-team-skill-grid article span,.pw-team-skill-grid article small{font-size:.78rem;color:var(--muted)}.pw-team-skill-grid article small{grid-column:1/-1}.pw-team-skill-grid article.status-strong,.pw-team-skill-grid article.status-covered{border-color:color-mix(in srgb,#36a269 35%,var(--line))}.pw-team-skill-grid article.status-growth{border-color:color-mix(in srgb,#d29a35 45%,var(--line))}.pw-playbook-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.pw-playbook-grid article{padding:1rem;border:1px solid var(--line);border-radius:16px;background:var(--card)}.pw-playbook-grid span{display:block;margin-bottom:.45rem;font-size:.7rem;letter-spacing:.09em;font-weight:850;color:var(--accent)}.pw-playbook-grid p{margin:0;color:var(--muted);line-height:1.55}
.teacher-role-eval-links{display:flex;flex-wrap:wrap;gap:.35rem}.teacher-current-roles{display:grid;gap:.35rem;margin:.6rem 0}.teacher-current-roles form{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.45rem .55rem;border:1px solid var(--line);border-radius:10px}.teacher-current-roles span{font-size:.8rem;font-weight:750}
@media(max-width:760px){.pw-team-skill-grid,.pw-playbook-grid{grid-template-columns:1fr}}
.pw-role-eval-student-list{display:grid;gap:.65rem;margin-top:.8rem}.pw-role-eval-student-list article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem .8rem;padding:.8rem .9rem;border:1px solid var(--line);border-radius:14px}.pw-role-eval-student-list article>div{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}.pw-role-eval-student-list article>div span{font-size:.75rem;color:var(--muted)}.pw-role-eval-student-list article>p{grid-column:1/-1;margin:.1rem 0;color:var(--muted);font-size:.86rem}

/* Project Workspace v26 · portfolio + collaboration insights */
.pw-portfolio-toggle{display:grid;gap:.55rem;margin-top:1rem}.pw-portfolio-toggle small{color:var(--muted,#7d8798);line-height:1.4}
.profile-project-portfolio{margin-top:1rem}.profile-project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}.profile-project-grid>article{display:grid;gap:.9rem;padding:1.1rem;border:1px solid var(--line,#e5e7eb);border-radius:18px;background:var(--surface,#fff)}.profile-project-grid>article.featured{box-shadow:0 0 0 2px color-mix(in srgb,var(--accent,#2563eb) 18%,transparent)}.profile-project-grid header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.profile-project-grid header span{font-size:.78rem;color:var(--muted,#7d8798);text-transform:uppercase;letter-spacing:.06em}.profile-project-grid header h3{margin:.2rem 0 0;font-size:1.05rem}.profile-project-grid header>b{font-size:.78rem;white-space:nowrap}.profile-project-roles,.profile-project-skills{display:flex;flex-wrap:wrap;gap:.45rem}.profile-project-roles span,.profile-project-skills span{padding:.38rem .58rem;border-radius:999px;background:var(--surface-soft,#f3f4f6);font-size:.78rem}.profile-project-contrib{display:grid;gap:.35rem}.profile-project-contrib>strong,.profile-project-skills>strong{width:100%;font-size:.78rem;color:var(--muted,#7d8798);text-transform:uppercase;letter-spacing:.05em}.profile-project-contrib span{font-size:.86rem}.profile-project-grid footer{display:flex;justify-content:space-between;gap:1rem;padding-top:.75rem;border-top:1px solid var(--line,#e5e7eb);font-size:.8rem;color:var(--muted,#7d8798)}
.teacher-collaboration-insights{margin:1rem 0}.teacher-role-distribution{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.teacher-role-distribution article{display:flex;align-items:center;gap:.75rem;padding:.85rem;border:1px solid var(--line,#e5e7eb);border-radius:14px}.teacher-role-distribution i{font-style:normal;font-size:1.15rem}.teacher-role-distribution div{display:grid;gap:.15rem}.teacher-role-distribution span{font-size:.78rem;color:var(--muted,#7d8798)}.teacher-insight-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1rem}.teacher-insight-columns>div{padding:1rem;border-radius:14px;background:var(--surface-soft,#f6f7f9)}.teacher-insight-columns p{margin:.5rem 0;font-size:.84rem;line-height:1.45}.teacher-insight-columns .muted{color:var(--muted,#7d8798)}.teacher-member-signals{display:grid;gap:.35rem;margin-top:.55rem}.teacher-member-signals span{display:block;padding:.45rem .55rem;border-radius:10px;font-size:.75rem;line-height:1.35}.teacher-member-signals .severity-medium{background:color-mix(in srgb,#f59e0b 12%,transparent)}.teacher-member-signals .severity-low{background:var(--surface-soft,#f6f7f9)}
@media(max-width:860px){.teacher-role-distribution{grid-template-columns:repeat(2,minmax(0,1fr))}.teacher-insight-columns{grid-template-columns:1fr}}
@media(max-width:560px){.teacher-role-distribution,.profile-project-grid{grid-template-columns:1fr}.profile-project-grid header{display:grid}.profile-project-grid footer{display:grid;gap:.25rem}}

/* v28 · Teacher curriculum & readiness ----------------------------------- */
.curriculum-page-head{align-items:flex-end}.curriculum-head-actions{display:flex;gap:10px;flex-wrap:wrap}.curriculum-kpis{margin-bottom:18px}.curriculum-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}.curriculum-main,.curriculum-side{display:grid;gap:18px}.curriculum-sticky{position:sticky;top:88px}.curriculum-block-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.curriculum-block-grid article{padding:16px;border:1px solid var(--border,#e5e7eb);border-radius:16px;background:var(--surface-soft,#f8fafc)}.curriculum-block-grid article i{display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:28px;padding:0 10px;border-radius:999px;background:rgba(37,99,235,.09);font-style:normal;font-weight:800;font-size:12px}.curriculum-block-grid h3{margin:12px 0 6px;font-size:16px}.curriculum-block-grid p{margin:0;color:var(--muted,#64748b);line-height:1.55}.curriculum-mastery-grid{display:grid;gap:12px}.curriculum-mastery-grid article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 14px;align-items:center}.curriculum-mastery-grid article>div{display:flex;align-items:center;gap:9px}.curriculum-mastery-grid article i{font-style:normal;font-size:18px}.curriculum-mastery-grid article span{font-weight:800}.curriculum-mastery-grid progress{grid-column:1/-1;width:100%;height:7px;border:0;border-radius:999px;overflow:hidden}.curriculum-lesson-list{display:grid;gap:10px}.curriculum-lesson{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;padding:14px;border:1px solid var(--border,#e5e7eb);border-radius:16px;background:var(--surface,#fff);transition:.15s ease}.curriculum-lesson.prepared{border-color:rgba(22,163,74,.35);background:rgba(22,163,74,.025)}.lesson-number{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--surface-soft,#f1f5f9);font-weight:900;font-size:13px}.lesson-title-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.lesson-title-row h3{margin:5px 0 0;font-size:16px;line-height:1.35}.lesson-body>p{margin:7px 0 9px;color:var(--muted,#64748b);line-height:1.5}.readiness-pill{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.readiness-pill.ok{background:rgba(22,163,74,.1);color:#15803d}.readiness-pill.warn{background:rgba(245,158,11,.12);color:#b45309}.lesson-ready-btn{border:1px solid var(--border,#dbe2ea);background:transparent;border-radius:10px;padding:8px 10px;font:inherit;font-size:12px;font-weight:800;cursor:pointer;white-space:nowrap}.lesson-ready-btn.done{border-color:rgba(22,163,74,.3);background:rgba(22,163,74,.08);color:#15803d}.lesson-meta{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.lesson-meta>span,.lesson-meta code{font-size:11px;padding:4px 7px;border-radius:8px;background:var(--surface-soft,#f1f5f9);color:var(--muted,#475569)}.lesson-meta code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.curriculum-lesson details{margin-top:10px;border-top:1px solid var(--border,#edf0f4);padding-top:9px}.curriculum-lesson summary{cursor:pointer;font-size:12px;font-weight:800}.readiness-checks{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.readiness-checks span{font-size:11px;padding:5px 8px;border-radius:999px}.readiness-checks .ok{background:rgba(22,163,74,.09);color:#15803d}.readiness-checks .missing{background:rgba(245,158,11,.1);color:#b45309}.curriculum-assessment{display:grid;gap:7px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border,#e5e7eb)}.curriculum-assessment strong{margin-bottom:3px}.curriculum-assessment span{font-size:12px;color:var(--muted,#475569)}.curriculum-material-links{display:grid;gap:7px}.curriculum-material-links a{display:flex;align-items:center;justify-content:space-between;padding:10px 11px;border:1px solid var(--border,#e5e7eb);border-radius:11px;text-decoration:none;color:inherit;font-size:12px}.curriculum-material-links a:hover{background:var(--surface-soft,#f8fafc)}.curriculum-checklist-panel{margin-top:18px}.curriculum-checklist-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.curriculum-checklist-grid section{border:1px solid var(--border,#e5e7eb);border-radius:14px;padding:13px;background:var(--surface,#fff)}.curriculum-checklist-grid h3{margin:0 0 9px;font-size:14px}.curriculum-check-row{display:grid;grid-template-columns:30px minmax(0,1fr);gap:8px;align-items:start;padding:7px 0;border-top:1px solid var(--border,#eef2f6)}.curriculum-check-row:first-of-type{border-top:0}.curriculum-check-row button{width:28px;height:28px;border-radius:9px;border:1px solid var(--border,#dbe2ea);background:var(--surface-soft,#f8fafc);cursor:pointer;font-weight:900}.curriculum-check-row span{font-size:12px;line-height:1.45;padding-top:4px}.curriculum-check-row.done span{text-decoration:line-through;color:var(--muted,#94a3b8)}.curriculum-check-row.done button{background:rgba(22,163,74,.1);border-color:rgba(22,163,74,.3);color:#15803d}.teacher-form-actions{display:flex;align-items:center;gap:12px;margin-top:10px}.teacher-form-actions small{color:var(--muted,#64748b)}
@media(max-width:1050px){.curriculum-layout{grid-template-columns:1fr}.curriculum-sticky{position:static}.curriculum-side{grid-template-columns:repeat(2,minmax(0,1fr))}.curriculum-checklist-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.curriculum-block-grid,.curriculum-side,.curriculum-checklist-grid{grid-template-columns:1fr}.curriculum-lesson{grid-template-columns:38px minmax(0,1fr);padding:11px}.lesson-number{width:36px;height:36px}.lesson-title-row{display:grid}.lesson-ready-btn{width:100%}.curriculum-head-actions{width:100%}.curriculum-head-actions .btn{flex:1}.lesson-meta code{max-width:100%;overflow-wrap:anywhere}}
@media print{.teacher-topbar,.teacher-classbar,.teacher-account,.curriculum-head-actions,.lesson-ready-btn,.curriculum-check-row button,.teacher-form-actions .btn{display:none!important}.teacher-shell{max-width:none!important}.curriculum-layout{grid-template-columns:1fr!important}.curriculum-side{grid-template-columns:1fr 1fr!important}.teacher-panel,.curriculum-lesson{break-inside:avoid}.curriculum-sticky{position:static}.curriculum-checklist-grid{grid-template-columns:1fr 1fr!important}}
.teacher-hero-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.teacher-kpi-grid article small a{color:inherit;font-weight:700}@media(max-width:720px){.teacher-hero-actions{width:100%;justify-content:stretch}.teacher-hero-actions .btn{flex:1;text-align:center}}

/* v29 · Global Teacher Overview */
.overview-global-hero{margin-bottom:16px}.overview-global-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:16px}.overview-global-kpis article{background:#fff;border:1px solid #d7dee6;border-radius:16px;padding:14px}.overview-global-kpis span{display:block;font-size:.55rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:#7a8793}.overview-global-kpis strong{display:block;margin:5px 0 3px;font-size:1.42rem;letter-spacing:-.04em}.overview-global-kpis small{display:block;color:#7b8792;font-size:.53rem;line-height:1.35}.overview-attention-panel{margin-bottom:16px}.overview-attention-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.overview-attention-list a{position:relative;display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:9px;padding:10px 12px;border:1px solid #dfe5eb;border-radius:12px;text-decoration:none;color:inherit;background:#fbfcfd}.overview-attention-list a>span{font-size:.54rem;font-weight:900;padding:4px 7px;border-radius:999px;background:#edf1f5}.overview-attention-list a>strong{font-size:.61rem}.overview-attention-list a>p{font-size:.58rem;margin:0;color:#697684}.overview-attention-list a>i{font-style:normal;font-weight:900}.overview-attention-list a.severity-high{border-left:4px solid #dc2626}.overview-attention-list a.severity-medium{border-left:4px solid #d97706}.overview-class-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.overview-class-card{min-width:0;background:#fff;border:1px solid #d7dee6;border-radius:22px;padding:18px;box-shadow:0 10px 28px rgba(15,23,42,.035)}.overview-class-card>header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:start;padding-bottom:14px;border-bottom:1px solid #edf1f4}.overview-class-card>header span{display:block;font-size:.57rem;text-transform:uppercase;font-weight:950;letter-spacing:.08em;color:#2459ff}.overview-class-card>header h2{margin:4px 0 5px;font-size:1.05rem}.overview-class-card>header p{margin:0;max-width:620px;font-size:.61rem;line-height:1.45;color:#6d7986}.overview-open-class{width:36px;height:36px;border-radius:11px;background:#111827;color:#fff;display:grid;place-items:center;text-decoration:none;font-weight:900}.overview-progress-stack{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px 0}.overview-progress-stack>div>div{display:flex;justify-content:space-between;gap:8px;align-items:center}.overview-progress-stack span{font-size:.57rem;font-weight:800;color:#677481}.overview-progress-stack b{font-size:.61rem}.overview-progress-stack progress,.overview-mastery-row progress{width:100%;height:7px;border:0;border-radius:999px;overflow:hidden;accent-color:#2459ff}.overview-class-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.overview-class-metrics>div{padding:10px;border-radius:12px;background:#f5f7f9}.overview-class-metrics span{display:block;font-size:.5rem;text-transform:uppercase;font-weight:900;letter-spacing:.06em;color:#7c8793}.overview-class-metrics strong{display:block;font-size:1rem;margin-top:3px}.overview-class-metrics small{display:block;font-size:.5rem;color:#85909a;margin-top:1px}.overview-capstone{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:12px;padding:12px;border:1px solid #dfe5eb;border-radius:14px}.overview-capstone>div:first-child span{display:block;font-size:.5rem;text-transform:uppercase;font-weight:900;color:#7a8793}.overview-capstone>div:first-child strong{display:block;font-size:.67rem;margin-top:3px}.overview-capstone-state{text-align:right}.overview-capstone-state b{display:block;font-size:.8rem}.overview-capstone-state small{font-size:.5rem;color:#82909b}.overview-mastery-branches{margin-top:14px;padding-top:12px;border-top:1px solid #edf1f4;display:grid;gap:7px}.overview-section-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:2px}.overview-section-label span{font-size:.54rem;text-transform:uppercase;font-weight:950;letter-spacing:.06em;color:#6f7b87}.overview-section-label a{font-size:.53rem;font-weight:800;text-decoration:none;color:#2459ff}.overview-mastery-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;align-items:center}.overview-mastery-row>span{font-size:.58rem;font-weight:800;display:flex;align-items:center;gap:6px}.overview-mastery-row>span i{font-style:normal}.overview-mastery-row>div{display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:8px;align-items:center}.overview-mastery-row b{font-size:.57rem;text-align:right}.overview-next-action{position:relative;margin-top:14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:12px 14px;border-radius:14px;text-decoration:none;color:inherit;background:#f5f7f9;border:1px solid #e1e6eb}.overview-next-action>span{grid-column:1;display:block;font-size:.49rem;text-transform:uppercase;font-weight:950;letter-spacing:.06em;color:#788591}.overview-next-action>strong{grid-column:1;font-size:.66rem;margin-top:2px}.overview-next-action>small{grid-column:1;font-size:.53rem;color:#74818d}.overview-next-action>i{grid-column:2;grid-row:1/4;align-self:center;font-style:normal;font-weight:950}.overview-next-action.severity-high{background:#fff6f5;border-color:#efcbc7}.overview-next-action.severity-medium{background:#fffaf0;border-color:#efdba9}.overview-next-action.severity-ok{background:#f0faf5;border-color:#c8e8d8}.overview-class-card>footer{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.overview-class-card>footer a{flex:1;min-width:82px;text-align:center;padding:8px 10px;border-radius:10px;background:#f2f5f7;text-decoration:none;color:#566370;font-size:.55rem;font-weight:850}.overview-class-card>footer a:hover{background:#e9eef3;color:#111827}
@media(max-width:1220px){.overview-global-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:900px){.overview-class-grid,.overview-attention-list{grid-template-columns:1fr}.overview-global-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.overview-progress-stack{grid-template-columns:1fr}.overview-class-metrics{grid-template-columns:1fr 1fr 1fr}.overview-mastery-row{grid-template-columns:110px minmax(0,1fr)}.overview-attention-list a{grid-template-columns:auto 1fr auto}.overview-attention-list a>p{grid-column:1/-1}.overview-global-kpis{grid-template-columns:1fr 1fr}.overview-class-card{padding:14px}}
@media print{.overview-global-kpis{grid-template-columns:repeat(3,1fr)!important}.overview-class-grid{grid-template-columns:1fr 1fr!important}.overview-class-card{break-inside:avoid}.overview-next-action,.overview-class-card>footer{display:none!important}}
.overview-project-status{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:7px}.overview-project-status>span{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:7px 8px;border-radius:10px;background:#f5f7f9}.overview-project-status i{font-style:normal;font-size:.48rem;color:#7c8793}.overview-project-status b{font-size:.59rem}.overview-project-status .danger{background:#fff1f0;color:#a93434}.overview-project-status .warn{background:#fff8e8;color:#9a6710}.overview-project-status .ok{background:#edf8f2;color:#19704d}@media(max-width:620px){.overview-project-status{grid-template-columns:1fr 1fr}}

/* v30 · adaptive explanations + school-year calendar */
.kb-help-ladder{margin:20px 0;border:1px solid var(--border,rgba(127,127,127,.25));border-radius:20px;padding:18px;background:color-mix(in srgb,var(--panel,#fff) 94%,var(--accent,#7c3aed) 6%)}
.kb-help-head{display:flex;gap:18px;align-items:center;justify-content:space-between}.kb-help-head h3{margin:.2rem 0}.kb-help-head p{margin:0;max-width:720px}.kb-help-body{margin-top:16px}.kb-help-tabs{display:flex;gap:8px;flex-wrap:wrap}.kb-help-tabs button{border:1px solid var(--border,rgba(127,127,127,.28));background:transparent;border-radius:999px;padding:9px 12px;font:inherit;cursor:pointer}.kb-help-tabs button.active{background:var(--text,#111);color:var(--bg,#fff);border-color:transparent}.kb-help-panels{margin-top:12px}.kb-help-panels article{border-radius:16px;padding:16px;background:var(--panel,#fff);border:1px solid var(--border,rgba(127,127,127,.22))}.kb-help-panels article>span{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;opacity:.7}.kb-help-panels p{font-size:1.03rem;line-height:1.65;margin:.45rem 0 0}.kb-help-panels ol{margin:.55rem 0 0;padding-left:1.3rem}.kb-help-panels li{margin:.35rem 0;line-height:1.5}
.kb-concept-loop{margin:16px 0 22px;padding:16px;border-radius:18px;border:1px solid var(--border,rgba(127,127,127,.22));overflow:hidden}.kb-loop-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.kb-loop-head div{display:flex;flex-direction:column;gap:2px}.kb-loop-head span{font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;opacity:.65}.kb-loop-head button{border:0;background:transparent;text-decoration:underline;cursor:pointer;font:inherit}.kb-loop-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;position:relative}.kb-loop-node{position:relative;padding:14px;border-radius:15px;background:color-mix(in srgb,var(--panel,#fff) 88%,var(--accent,#7c3aed) 12%);border:1px solid transparent;opacity:.5;transform:translateY(4px)}.kb-loop-node i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--text,#111);color:var(--bg,#fff);font-style:normal;font-size:.78rem;margin-bottom:9px}.kb-loop-node strong,.kb-loop-node span{display:block}.kb-loop-node span{font-size:.84rem;line-height:1.4;opacity:.76;margin-top:3px}.kb-concept-loop.is-running .kb-loop-node{animation:kbLoopPulse 5.6s ease-in-out infinite;animation-delay:calc(var(--loop-i) * 1.15s)}
@keyframes kbLoopPulse{0%,18%,100%{opacity:.48;transform:translateY(4px);border-color:transparent}25%,45%{opacity:1;transform:translateY(0);border-color:var(--accent,#7c3aed);box-shadow:0 8px 28px rgba(0,0,0,.08)}}
.school-calendar-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end}.school-calendar-summary{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:10px}.school-calendar-summary>div{padding:14px;border-radius:16px;border:1px solid var(--border,rgba(127,127,127,.22));background:var(--panel,#fff)}.school-calendar-summary span,.school-calendar-summary strong{display:block}.school-calendar-summary span{font-size:.76rem;opacity:.65;text-transform:uppercase}.school-calendar-summary strong{font-size:1.35rem;margin-top:3px}.school-year-grid{display:grid;gap:10px;margin-top:18px}.school-week{display:grid;grid-template-columns:110px 64px minmax(0,1fr) minmax(180px,.75fr);gap:14px;align-items:center;padding:14px 16px;border-radius:16px;border:1px solid var(--border,rgba(127,127,127,.22));background:var(--panel,#fff)}.school-week.no-school{opacity:.68;background:color-mix(in srgb,var(--panel,#fff) 90%,var(--muted,#777) 10%)}.school-week.current{outline:2px solid var(--accent,#7c3aed);outline-offset:2px}.school-week .week-date strong,.school-week .week-date span{display:block}.school-week .week-date span{font-size:.78rem;opacity:.65}.school-week .week-index{font-size:.78rem;text-transform:uppercase;opacity:.7}.school-week .week-plan strong{display:block}.school-week .week-plan span{display:block;font-size:.86rem;opacity:.7;margin-top:3px}.school-week .week-class-focus{font-size:.86rem;line-height:1.4;opacity:.8}.school-calendar-legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.school-calendar-legend span{border:1px solid var(--border,rgba(127,127,127,.22));border-radius:999px;padding:7px 10px;font-size:.8rem}
@media (max-width:900px){.kb-loop-track{grid-template-columns:1fr 1fr}.school-calendar-hero{grid-template-columns:1fr}.school-week{grid-template-columns:90px 1fr}.school-week .week-index{display:none}.school-week .week-class-focus{grid-column:2}}
@media (max-width:600px){.kb-help-head{align-items:flex-start;flex-direction:column}.kb-loop-track{grid-template-columns:1fr}.school-calendar-summary{grid-template-columns:1fr 1fr}.school-week{grid-template-columns:1fr}.school-week .week-class-focus{grid-column:auto}}
@media (prefers-reduced-motion:reduce){.kb-concept-loop.is-running .kb-loop-node{animation:none;opacity:1;transform:none}}
.teacher-year-calendar{display:grid;gap:8px}.teacher-year-head,.teacher-year-row{display:grid;grid-template-columns:110px 90px repeat(4,minmax(0,1fr));gap:10px;align-items:stretch}.teacher-year-head{padding:0 10px 8px;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;opacity:.6}.teacher-year-row{padding:10px;border-radius:15px;border:1px solid var(--border,rgba(127,127,127,.22));background:var(--panel,#fff)}.teacher-year-row>div{padding:8px;border-radius:11px;background:color-mix(in srgb,var(--panel,#fff) 92%,var(--accent,#7c3aed) 8%)}.teacher-year-row>div strong,.teacher-year-row>div small,.teacher-year-row>div span{display:block}.teacher-year-row>div small{margin-top:3px;opacity:.68;line-height:1.35}.teacher-year-row.no-school{opacity:.62}.teacher-year-row.no-school>div{background:transparent}.teacher-year-row.current{outline:2px solid var(--accent,#7c3aed);outline-offset:2px}.teacher-year-row.current::before{content:'aktuální / další';position:absolute}.teacher-year-row{position:relative}.teacher-year-row.current::before{right:12px;top:-9px;background:var(--accent,#7c3aed);color:#fff;padding:3px 8px;border-radius:999px;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em}
@media(max-width:1150px){.teacher-year-head{display:none}.teacher-year-row{grid-template-columns:100px 80px 1fr 1fr}.teacher-year-row>div:nth-child(n+5){grid-column:span 1}}
@media(max-width:720px){.teacher-year-row{grid-template-columns:1fr}.teacher-year-row>div{display:block}.teacher-year-row>div small{display:block}}

/* v31 · adaptive learning — intentionally compact, progressive-disclosure UI */
.adaptive-today-panel{overflow:hidden}.adaptive-today-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.adaptive-today-action,.adaptive-journal-card{border:1px solid var(--border,#dfe4ea);border-radius:18px;background:var(--card,#fff);min-height:118px}.adaptive-today-action{display:flex;gap:14px;align-items:flex-start;padding:18px;text-decoration:none;color:inherit;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.adaptive-today-action:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(15,23,42,.08)}.adaptive-today-action>i,.adaptive-journal-card summary>i{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(99,102,241,.08);font-style:normal;font-weight:800}.adaptive-today-action span,.adaptive-journal-card summary span{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;opacity:.62}.adaptive-today-action strong,.adaptive-journal-card summary strong{display:block;margin-top:5px;font-size:1rem}.adaptive-today-action small,.adaptive-journal-card summary small{display:block;margin-top:7px;line-height:1.45;opacity:.68}.adaptive-today-action.alert{border-color:rgba(245,158,11,.28)}.adaptive-today-action.calm{cursor:default}.adaptive-journal-card{padding:0}.adaptive-journal-card summary{display:flex;gap:14px;list-style:none;cursor:pointer;padding:18px}.adaptive-journal-card summary::-webkit-details-marker{display:none}.adaptive-journal-card form{display:grid;gap:10px;padding:0 18px 18px}.adaptive-journal-card label{display:grid;gap:5px;font-size:.83rem;font-weight:700}.adaptive-journal-card textarea,.adaptive-journal-card input,.kb-tutor-lite input{width:100%;border:1px solid var(--border,#dfe4ea);border-radius:12px;padding:10px 12px;background:var(--input-bg,#fff);color:inherit}.adaptive-review-shell,.recovery-shell{max-width:1040px;margin:0 auto;display:grid;gap:22px}.adaptive-review-hero,.recovery-hero{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding:28px;border:1px solid var(--border,#dfe4ea);border-radius:24px;background:var(--card,#fff)}.adaptive-review-hero h1,.recovery-hero h1{margin:.35rem 0 .55rem}.adaptive-review-hero p,.recovery-hero p{max-width:760px;margin:0;opacity:.74}.adaptive-review-form,.recovery-roadmap{display:grid;gap:14px}.adaptive-review-card,.recovery-step{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:flex-start;padding:20px;border:1px solid var(--border,#dfe4ea);border-radius:20px;background:var(--card,#fff)}.adaptive-review-count,.recovery-step>i{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(99,102,241,.08);font-style:normal;font-weight:800}.adaptive-review-card h2{margin:5px 0 12px;font-size:1.08rem}.adaptive-review-card>div>span{font-size:.78rem;opacity:.6}.adaptive-review-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.adaptive-review-options label{display:flex;align-items:flex-start;gap:9px;padding:11px;border:1px solid var(--border,#dfe4ea);border-radius:13px;cursor:pointer}.adaptive-review-options label:has(input:checked){border-color:rgba(99,102,241,.55);background:rgba(99,102,241,.06)}.adaptive-review-submit{display:flex;align-items:center;justify-content:space-between;gap:16px}.adaptive-review-submit small{opacity:.62}.adaptive-result-banner,.recovery-complete{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:18px;background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.18)}.adaptive-result-banner strong,.recovery-complete>span{font-size:1.5rem}.adaptive-empty{text-align:center;padding:46px 24px;border:1px dashed var(--border,#dfe4ea);border-radius:22px}.adaptive-empty>span{font-size:2rem}.recovery-progress{text-align:center;padding:12px 18px;border-radius:16px;background:rgba(99,102,241,.08)}.recovery-progress strong{display:block;font-size:1.7rem}.recovery-progress span{font-size:.75rem;opacity:.65}.recovery-step.done{border-color:rgba(34,197,94,.22)}.recovery-step form{display:grid;gap:9px;min-width:180px}.recovery-step input{border:1px solid var(--border,#dfe4ea);border-radius:11px;padding:9px 10px}.week-recovery-actions{margin-top:9px}.mini-action{border:0;background:rgba(99,102,241,.08);color:inherit;border-radius:999px;padding:6px 10px;font-size:.75rem;font-weight:750;text-decoration:none;cursor:pointer}.kb-tutor-lite{margin-top:16px;padding:16px;border-radius:16px;background:rgba(15,23,42,.035);border:1px solid var(--border,#dfe4ea);display:grid;gap:12px}.kb-tutor-lite>div:first-child span{display:block;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;opacity:.6}.kb-tutor-lite>div:first-child strong{display:block;margin:.25rem 0}.kb-tutor-lite>div:first-child p{margin:0;font-size:.86rem;opacity:.7}.kb-tutor-lite form{display:flex;gap:9px}.kb-tutor-answer{white-space:pre-wrap;line-height:1.55;padding:12px 14px;border-radius:12px;background:var(--card,#fff);border:1px solid var(--border,#dfe4ea)}.kb-tutor-answer.loading{opacity:.65}.adaptive-teacher-feed{display:grid;gap:10px}.adaptive-teacher-student{display:grid;grid-template-columns:minmax(170px,.75fr) 1.8fr auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--border,#dfe4ea);border-radius:15px}.adaptive-teacher-student.high{border-color:rgba(239,68,68,.25)}.adaptive-teacher-student.medium{border-color:rgba(245,158,11,.25)}.adaptive-teacher-signals{display:flex;flex-wrap:wrap;gap:7px}.adaptive-teacher-signals span{padding:6px 9px;border-radius:999px;background:rgba(100,116,139,.08);font-size:.77rem}.teacher-calendar-editor{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:end}.teacher-calendar-editor label{display:grid;gap:5px;font-size:.78rem;font-weight:700}.teacher-calendar-editor input,.teacher-calendar-editor select{min-width:0;width:100%;border:1px solid var(--border,#dfe4ea);border-radius:10px;padding:9px}.teacher-exception-list{display:grid;gap:8px;margin-top:14px}.teacher-exception-list article{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--border,#dfe4ea);border-radius:12px}.teacher-year-row .calendar-exception-badge{display:inline-flex;margin-top:5px;padding:4px 7px;border-radius:999px;background:rgba(245,158,11,.1);font-size:.7rem;font-weight:700}
@media (max-width:900px){.adaptive-today-grid{grid-template-columns:1fr}.adaptive-review-hero,.recovery-hero{display:grid}.adaptive-review-card,.recovery-step{grid-template-columns:auto 1fr}.adaptive-review-card>*:last-child,.recovery-step form{grid-column:2}.teacher-calendar-editor{grid-template-columns:1fr 1fr}.adaptive-teacher-student{grid-template-columns:1fr}.adaptive-review-options{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.adaptive-today-action{transition:none}.adaptive-today-action:hover{transform:none}}

/* v31 · calendar shifts stay visible without adding another screen */
.calendar-shift-note,.calendar-schedule-warning{display:block;margin-top:.35rem;font-size:.78rem;line-height:1.35}.calendar-shift-note{opacity:.72}.calendar-schedule-warning{font-weight:700}.calendar-warning-badge{display:block;margin-top:.3rem;font-size:.7rem;line-height:1.25;font-weight:700}.calendar-exception-badge.shifted{opacity:.8}

/* v32 · Teacher Lesson Mode */
.lesson-mode{display:grid;gap:20px;max-width:1440px;margin:0 auto 48px}.lesson-mode-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.lesson-mode-toolbar>div:first-child{display:grid;gap:6px}.lesson-mode-actions{display:flex;gap:10px;flex-wrap:wrap}.lesson-mode-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center;padding:28px;border:1px solid var(--line,#252a31);border-radius:24px;background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.01))}.lesson-mode-hero h1{margin:.2em 0;font-size:clamp(2rem,5vw,4.4rem);line-height:.95}.lesson-mode-hero p{max-width:820px;font-size:1.05rem;line-height:1.6}.lesson-mode-clock{min-width:220px;text-align:center;padding:22px;border-radius:22px;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.08)}.lesson-mode-clock strong{display:block;font-variant-numeric:tabular-nums;font-size:clamp(2.5rem,6vw,5rem);line-height:1}.lesson-mode-clock>span{display:block;margin-top:8px;opacity:.7}.lesson-mode-clock>div{display:flex;justify-content:center;gap:8px;margin-top:16px}.lesson-mode-clock button{border:1px solid rgba(255,255,255,.12);background:transparent;color:inherit;border-radius:10px;padding:8px 12px}.lesson-mode-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,.7fr);gap:20px}.lesson-mode-timeline,.lesson-mode-card{border:1px solid var(--line,#252a31);border-radius:22px;background:var(--panel,#11151a)}.lesson-mode-timeline{padding:20px}.lesson-mode-timeline article{display:grid;grid-template-columns:78px minmax(0,1fr) 72px;gap:16px;align-items:start;padding:18px 8px;border-top:1px solid rgba(255,255,255,.06);transition:transform .2s ease,background .2s ease,opacity .2s ease}.lesson-mode-timeline article:first-of-type{border-top:0}.lesson-mode-timeline article.active{background:rgba(255,255,255,.055);transform:translateX(6px);border-radius:14px}.lesson-mode-timeline article.done{opacity:.58}.lesson-phase-time{font-variant-numeric:tabular-nums;font-weight:700}.lesson-phase-state{text-align:right;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;opacity:.65}.lesson-mode-timeline article.active .lesson-phase-state{opacity:1}.lesson-mode-timeline p{margin:.35em 0 0;opacity:.75}.lesson-mode-side{display:grid;gap:16px;align-content:start}.lesson-mode-card{padding:20px}.lesson-mode-card>span{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;opacity:.55}.lesson-mode-card h3{margin:.35em 0 .7em}.lesson-mode-card ul,.lesson-mode-card ol{padding-left:1.2rem;line-height:1.6}.lesson-mode-tags{display:flex;gap:7px;flex-wrap:wrap}.lesson-mode-tags code{padding:5px 8px;border-radius:8px;background:rgba(255,255,255,.05)}.lesson-mode:fullscreen{overflow:auto;background:var(--bg,#0c0f13);padding:26px}.lesson-mode:fullscreen .lesson-mode-toolbar .teacher-back{display:none}@media (prefers-reduced-motion:reduce){.lesson-mode-timeline article{transition:none}}@media(max-width:900px){.lesson-mode-hero,.lesson-mode-grid{grid-template-columns:1fr}.lesson-mode-clock{min-width:0}.lesson-mode-toolbar{align-items:flex-start;flex-direction:column}.lesson-mode-timeline article{grid-template-columns:64px minmax(0,1fr);}.lesson-phase-state{grid-column:2;text-align:left}}

/* v32 · optional student focus mode */
.focus-mode-toggle{border:1px solid rgba(255,255,255,.1);background:transparent;color:inherit;border-radius:999px;padding:5px 10px;font:inherit;font-size:.78rem;cursor:pointer}.focus-mode-toggle[aria-pressed="true"]{background:rgba(255,255,255,.08)}body.student-focus-mode .dashboard-metrics,body.student-focus-mode .dashboard-primary-grid,body.student-focus-mode .achievements-panel,body.student-focus-mode .course-roadmap-panel,body.student-focus-mode .dashboard-secondary-grid,body.student-focus-mode .project-results-preview{display:none}body.student-focus-mode .student-cockpit{max-width:1080px;margin-inline:auto}

/* v33 · real weekly schedule */
.teacher-schedule-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 20px}.teacher-schedule-strip article{padding:16px 18px;border:1px solid var(--border,#dfe6e9);border-radius:16px;background:var(--card,#fff);display:flex;flex-direction:column;gap:3px}.teacher-schedule-strip span{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;opacity:.66}.teacher-schedule-strip strong{font-size:1.34rem;line-height:1.15}.teacher-schedule-strip small{opacity:.72}.week-date .week-time{display:block;margin-top:5px;font-weight:700;font-size:.72rem;white-space:nowrap}.school-calendar-hero .school-calendar-summary strong{font-variant-numeric:tabular-nums}
@media(max-width:900px){.teacher-schedule-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.teacher-schedule-strip{grid-template-columns:1fr}.teacher-schedule-strip article{padding:14px}.school-calendar-hero .school-calendar-summary{grid-template-columns:1fr}}
.teacher-week-timetable{margin:0 0 22px;padding:14px;border:1px solid var(--border,#dfe6e9);border-radius:18px;background:var(--card,#fff);overflow-x:auto}.teacher-week-timetable-head,.teacher-week-timetable-grid{display:grid;grid-template-columns:repeat(9,minmax(92px,1fr));gap:6px;min-width:900px}.teacher-week-timetable-head{margin-bottom:7px}.teacher-week-timetable-head span{padding:7px 5px;text-align:center;border-radius:10px;background:rgba(104,124,132,.08);display:flex;flex-direction:column;gap:1px}.teacher-week-timetable-head b{font-size:.78rem}.teacher-week-timetable-head small{font-size:.66rem;opacity:.67}.teacher-week-timetable-grid{position:relative;grid-auto-rows:68px}.timetable-block{grid-column:var(--from)/span var(--span);display:flex;flex-direction:column;justify-content:center;padding:10px 12px;border-radius:12px;border:1px solid rgba(61,80,86,.16);box-shadow:0 4px 12px rgba(30,45,50,.07);background:linear-gradient(135deg,rgba(255,240,228,.96),rgba(255,249,244,.96))}.timetable-block strong{font-size:.88rem}.timetable-block span{font-size:.72rem;opacity:.72;margin-top:3px}.timetable-block.class-1a{background:linear-gradient(135deg,rgba(239,244,246,.96),rgba(251,253,253,.96))}.timetable-break{grid-column:var(--from);display:flex;align-items:center;justify-content:center;border:1px dashed rgba(80,100,106,.22);border-radius:12px;color:rgba(70,90,96,.58);font-size:.72rem}

/* v34 · clearer navigation + lesson-specific visual walkthrough --------- */
.main-menu-more{position:relative;display:inline-flex;align-items:center}.main-menu-more>summary{list-style:none;min-height:38px;padding:0 11px;border-radius:10px;display:inline-flex;align-items:center;gap:7px;font-size:.69rem;font-weight:850;color:var(--muted);cursor:pointer;user-select:none}.main-menu-more>summary::-webkit-details-marker{display:none}.main-menu-more>summary i{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-style:normal;background:transparent}.main-menu-more[open]>summary,.main-menu-more>summary:hover{background:var(--surface);color:var(--text)}.main-menu-more-popover{position:absolute;right:0;top:calc(100% + 10px);z-index:140;min-width:250px;padding:8px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:var(--shadow);display:grid;gap:3px}.main-menu-more-popover a,.main-menu-more-popover>span{width:100%;justify-content:flex-start;min-height:42px}.main-menu-more-popover a.active:after{display:none}

.lesson-story-demo{margin:18px 0 20px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface-2) 70%,transparent));overflow:hidden}.lesson-story-head{display:flex;justify-content:space-between;gap:22px;align-items:flex-start;padding:22px 22px 16px}.lesson-story-head h2{margin:.25rem 0 .4rem;font-size:clamp(1.35rem,2.8vw,2rem)}.lesson-story-head p{max-width:820px;margin:0;color:var(--muted);line-height:1.55}.lesson-story-controls{display:flex;gap:7px;flex-shrink:0}.lesson-story-nav{display:flex;gap:8px;padding:0 22px 14px;overflow:auto}.lesson-story-nav button{flex:1;min-width:180px;border:1px solid var(--line);background:var(--surface-2);border-radius:13px;padding:10px 12px;text-align:left;display:flex;gap:10px;align-items:center;color:var(--muted);cursor:pointer}.lesson-story-nav button i{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:var(--surface);font-style:normal;font-weight:900}.lesson-story-nav button.active{background:var(--surface);color:var(--text);border-color:color-mix(in srgb,var(--accent) 38%,var(--line));box-shadow:0 7px 22px rgba(17,24,39,.06)}.lesson-story-scenes{border-top:1px solid var(--line)}.lesson-story-scene{display:grid;grid-template-columns:minmax(240px,.42fr) minmax(0,1fr);gap:20px;padding:22px;align-items:start;animation:lessonStoryIn .24s ease}.lesson-story-copy{position:sticky;top:90px;padding:10px 4px}.lesson-story-copy>span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:900}.lesson-story-copy h3{font-size:clamp(1.4rem,3vw,2.2rem);margin:.35rem 0 .55rem}.lesson-story-copy p{color:var(--muted);line-height:1.6}.lesson-story-takeaway{margin-top:18px;padding:14px;border-radius:14px;background:var(--accent-soft);display:grid;gap:5px}.lesson-story-takeaway b{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}.lesson-story-takeaway span{line-height:1.45}.lesson-story-visual .assessment-visual{margin:0;min-height:0}.lesson-story-visual .assessment-svg-stage{min-height:300px}.lesson-story-footer{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:13px 22px;border-top:1px solid var(--line);font-size:.84rem;color:var(--muted)}
@keyframes lessonStoryIn{from{opacity:.2;transform:translateY(5px)}to{opacity:1;transform:none}}

.kb-topic-demo-intro{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;margin:8px 0 12px}.kb-topic-demo-intro h3{margin:.25rem 0}.kb-topic-demo-intro p{margin:0;color:var(--muted);max-width:780px}.kb-topic-demo-intro>small{max-width:220px;color:var(--muted);text-align:right}.kb-interactive-details{margin-top:12px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2);overflow:hidden}.kb-interactive-details>summary{cursor:pointer;padding:13px 16px;font-weight:850;list-style:none}.kb-interactive-details>summary::-webkit-details-marker{display:none}.kb-interactive-details>summary:after{content:'＋';float:right;color:var(--accent)}.kb-interactive-details[open]>summary:after{content:'−'}.kb-interactive-details>.kb-demo-stage,.kb-interactive-details>.kb-interactive-demo{border:0;border-top:1px solid var(--line);border-radius:0;margin:0}

.completed-step-summary{display:flex;align-items:center;gap:10px;color:var(--muted);padding:4px 0 6px}.completed-step-summary>span{width:28px;height:28px;border-radius:9px;background:var(--ok-soft);color:var(--ok);display:grid;place-items:center;font-weight:900}.completed-step-summary p{margin:0;font-size:.88rem}.next-step-card.done{opacity:.82}.next-step-card.done .next-step-content header{margin-bottom:2px}.next-step-card.done .next-step-content header h2{font-size:1rem}

.student-focus-mode .adaptive-today-panel{order:2}.student-focus-mode .dashboard-skill-preview{order:3}.student-focus-mode .dashboard-project-workspace{order:4}.student-focus-mode .student-cockpit-main{order:1}.student-focus-mode .student-cockpit{display:flex;flex-direction:column;gap:16px}.student-focus-mode .student-profile-card{padding:18px}.student-focus-mode .overall-ring{display:none}.student-focus-mode .student-tags span:not(:first-child){display:none}

@media(max-width:1080px){.main-menu-more{display:contents}.main-menu-more>summary{display:none}.main-menu-more-popover{position:static;display:contents}.lesson-story-scene{grid-template-columns:1fr}.lesson-story-copy{position:static}.lesson-story-head{display:grid}.lesson-story-controls{justify-self:start}}
@media(max-width:720px){.lesson-story-demo{border-radius:18px}.lesson-story-head,.lesson-story-scene{padding:16px}.lesson-story-nav{padding:0 16px 12px}.lesson-story-nav button{min-width:155px}.lesson-story-footer{padding:12px 16px;align-items:flex-start;flex-direction:column}.kb-topic-demo-intro{display:grid}.kb-topic-demo-intro>small{text-align:left;max-width:none}}
@media(prefers-reduced-motion:reduce){.lesson-story-scene{animation:none}}

.course-focus-card{display:flex;align-items:center;justify-content:space-between;gap:22px;margin:18px 0;padding:22px;border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line));border-radius:20px;background:linear-gradient(135deg,var(--accent-soft),var(--surface))}.course-focus-card>div{display:grid;gap:5px}.course-focus-card>div>span{font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}.course-focus-card strong{font-size:clamp(1.2rem,2.5vw,1.7rem)}.course-focus-card p{margin:0;color:var(--muted);max-width:840px;line-height:1.5}.course-focus-card.done{border-color:color-mix(in srgb,var(--ok) 36%,var(--line));background:linear-gradient(135deg,var(--ok-soft),var(--surface))}.course-full-map{margin-top:16px}.course-full-map>summary{list-style:none;cursor:pointer;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);display:flex;align-items:center;gap:12px;flex-wrap:wrap}.course-full-map>summary::-webkit-details-marker{display:none}.course-full-map>summary span{font-weight:900}.course-full-map>summary strong{margin-left:auto}.course-full-map>summary small{width:100%;color:var(--muted)}.course-full-map[open]>summary{border-bottom-left-radius:8px;border-bottom-right-radius:8px}.course-full-map>.course-map{margin-top:10px}
@media(max-width:720px){.course-focus-card{align-items:flex-start;flex-direction:column}.course-focus-card .btn{width:100%}.course-full-map>summary strong{margin-left:0}}

/* v35 · Reality Demos -----------------------------------------------------
   Evidence-first animated micro-scenarios. Minimal by default; deeper layers
   reveal only after the student makes a decision. */
.reality-demo{container-type:inline-size;margin:0;border:1px solid var(--line);border-radius:20px;background:var(--surface);overflow:hidden;box-shadow:0 12px 34px rgba(15,23,42,.055);content-visibility:auto;contain-intrinsic-size:760px}
.reality-demo-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:18px 18px 12px}.reality-demo-head>div:first-child{max-width:760px}.reality-demo-head span,.reality-decision>span,.reality-evidence-grid>div>span,.reality-explanation span{display:block;font-size:.68rem;line-height:1.2;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)}.reality-demo-head h3{font-size:clamp(1.1rem,2.6vw,1.55rem);margin:.24rem 0 .4rem}.reality-demo-head p{margin:0;color:var(--muted);line-height:1.5}.reality-badge{flex-shrink:0;padding:7px 9px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);font-size:.7rem;color:var(--muted);font-weight:800}
.reality-phases{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-block:1px solid var(--line)}.reality-phases span{padding:8px 10px;background:var(--surface-2);color:var(--muted);font-size:.7rem;text-align:center;font-weight:800;transition:background .2s ease,color .2s ease}.reality-phases span.active{background:color-mix(in srgb,var(--accent-soft) 76%,var(--surface));color:var(--text)}
.reality-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);min-height:390px}.reality-main{padding:18px;border-right:1px solid var(--line);min-width:0}.reality-decision{padding:18px;background:color-mix(in srgb,var(--surface-2) 78%,transparent)}.reality-decision h4{font-size:1rem;line-height:1.45;margin:.35rem 0 14px}.reality-choice-list{display:grid;gap:8px}.reality-choice-list button{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;padding:11px;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--text);text-align:left;cursor:pointer;line-height:1.35;font-size:.82rem;transition:border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease}.reality-choice-list button:hover{border-color:color-mix(in srgb,var(--accent) 38%,var(--line));transform:translateY(-1px);box-shadow:0 7px 18px rgba(15,23,42,.06)}.reality-choice-list button i{width:27px;height:27px;border-radius:9px;display:grid;place-items:center;background:var(--surface-2);font-style:normal;font-size:.72rem;font-weight:900}.reality-choice-list button.correct{border-color:color-mix(in srgb,var(--ok) 54%,var(--line));background:var(--ok-soft)}.reality-choice-list button.wrong{border-color:color-mix(in srgb,var(--danger) 42%,var(--line));background:color-mix(in srgb,var(--danger) 7%,var(--surface))}.reality-choice-list button:disabled:not(.correct):not(.wrong){opacity:.5;cursor:default;transform:none;box-shadow:none}
.reality-feedback{margin-top:12px;padding:12px;border-radius:13px;border:1px solid var(--line);background:var(--surface);display:grid;gap:4px}.reality-feedback.good{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:var(--ok-soft)}.reality-feedback.bad{border-color:color-mix(in srgb,var(--danger) 34%,var(--line));background:color-mix(in srgb,var(--danger) 6%,var(--surface))}.reality-feedback strong{font-size:.82rem}.reality-feedback p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.45}.reality-reset{margin-top:10px;border:0;background:transparent;color:var(--accent);font-weight:850;font-size:.78rem;cursor:pointer;padding:6px 0}
.reality-evidence-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.reality-evidence-grid>div{border:1px solid var(--line);border-radius:13px;padding:11px;background:var(--surface-2)}.reality-evidence-grid>div:last-child>span{color:var(--muted)}.reality-evidence-grid p{margin:5px 0 0;font-size:.75rem;color:var(--muted);line-height:1.35}.reality-explanation{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);background:var(--surface)}.reality-explanation>div{padding:14px 18px}.reality-explanation>div+div{border-left:1px solid var(--line)}.reality-explanation p{margin:5px 0 0;font-size:.8rem;line-height:1.45;color:var(--muted)}
.reality-stage{position:relative;min-height:225px;border:1px solid var(--line);border-radius:16px;background:radial-gradient(circle at 80% 10%,color-mix(in srgb,var(--accent-soft) 70%,transparent),transparent 32%),linear-gradient(180deg,var(--surface),var(--surface-2));overflow:hidden;isolation:isolate}.stage-status{position:absolute;left:12px;bottom:12px;z-index:8;padding:6px 9px;border-radius:999px;font-size:.66rem;font-weight:900;letter-spacing:.02em;background:var(--surface);border:1px solid var(--line);box-shadow:0 5px 16px rgba(15,23,42,.06)}.stage-status.bad{color:var(--danger)}.stage-status.good{color:var(--ok)}
/* Topology */
.topology-stage{display:grid;grid-template-columns:110px 1fr 110px 1fr 110px;align-items:center;padding:28px 26px 50px}.topo-node{min-height:88px;border:1px solid var(--line);border-radius:16px;background:var(--surface);display:grid;place-items:center;align-content:center;gap:2px;position:relative;z-index:3;box-shadow:0 9px 20px rgba(15,23,42,.05)}.topo-node i{font-style:normal;color:var(--accent);font-size:1.25rem}.topo-node strong{font-size:.78rem}.topo-node small{font-size:.65rem;color:var(--muted)}.topo-link{height:2px;background:var(--line);position:relative;z-index:1}.topo-link:after{content:'›';position:absolute;right:-1px;top:50%;transform:translateY(-54%);color:var(--muted);font-weight:900}.reality-packet{position:absolute;width:11px;height:11px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 7px color-mix(in srgb,var(--accent) 12%,transparent);left:calc(26px + 98px);top:106px;z-index:5;opacity:0}.reality-demo.demo-intro .reality-packet{animation:realityPacket 2.4s cubic-bezier(.2,.7,.3,1) .15s both}.reality-demo.choice-good .topo-link{background:color-mix(in srgb,var(--ok) 48%,var(--line))}.reality-demo.choice-good .topo-node{border-color:color-mix(in srgb,var(--ok) 35%,var(--line))}.reality-demo.choice-bad .topo-node.target{border-color:color-mix(in srgb,var(--danger) 45%,var(--line))}
@keyframes realityPacket{0%{opacity:0;transform:translateX(0)}8%{opacity:1}50%{transform:translateX(calc(50cqw - 105px))}82%{opacity:1}100%{opacity:0;transform:translateX(calc(100cqw - 245px))}}
/* Service stack */
.stack-stage{display:grid;gap:7px;align-content:center;padding:24px 24px 50px}.stack-layer{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);transition:transform .2s ease,border-color .2s ease}.stack-layer span{width:28px;height:28px;border-radius:9px;background:var(--surface-2);display:grid;place-items:center;font-size:.7rem;font-weight:900}.stack-layer strong{font-size:.8rem}.stack-layer small{color:var(--muted);font-size:.66rem}.stack-layer.ok{border-color:color-mix(in srgb,var(--ok) 30%,var(--line))}.stack-layer.current{border-color:color-mix(in srgb,var(--danger) 34%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 7%,transparent)}.reality-demo.demo-intro .stack-layer.current{animation:realityPulse 1.8s ease 2}.reality-demo.choice-good .stack-layer.current{border-color:color-mix(in srgb,var(--ok) 55%,var(--line));box-shadow:none}.reality-demo.choice-good .stack-layer.pending{opacity:.78}
@keyframes realityPulse{50%{transform:translateX(4px)}}
/* Metrics */
.metrics-stage{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;padding:22px 20px 58px;align-content:start}.metric-card{border:1px solid var(--line);border-radius:13px;background:var(--surface);padding:11px;display:grid;gap:3px;position:relative}.metric-card span{font-size:.67rem;color:var(--muted)}.metric-card strong{font-size:1rem}.metric-card i{position:absolute;right:10px;top:10px;width:8px;height:8px;border-radius:50%}.metric-card i.good{background:var(--ok)}.metric-card i.bad{background:var(--danger)}.metric-chart{grid-column:1/-1;height:78px;display:flex;gap:5px;align-items:flex-end;padding:10px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.metric-chart b{flex:1;background:color-mix(in srgb,var(--accent) 44%,var(--surface-2));border-radius:5px 5px 2px 2px;height:var(--h,35%);transform-origin:bottom}.metric-chart b:nth-child(1){--h:22%}.metric-chart b:nth-child(2){--h:29%}.metric-chart b:nth-child(3){--h:34%}.metric-chart b:nth-child(4){--h:48%}.metric-chart b:nth-child(5){--h:62%}.metric-chart b:nth-child(6){--h:78%}.metric-chart b:nth-child(7){--h:91%;background:color-mix(in srgb,var(--danger) 58%,var(--surface-2))}.metric-chart b:nth-child(8){--h:96%;background:color-mix(in srgb,var(--danger) 65%,var(--surface-2))}.reality-demo.demo-intro .metric-chart b{animation:metricRise .8s ease both}.reality-demo.demo-intro .metric-chart b:nth-child(2){animation-delay:.06s}.reality-demo.demo-intro .metric-chart b:nth-child(3){animation-delay:.12s}.reality-demo.demo-intro .metric-chart b:nth-child(4){animation-delay:.18s}.reality-demo.demo-intro .metric-chart b:nth-child(5){animation-delay:.24s}.reality-demo.demo-intro .metric-chart b:nth-child(6){animation-delay:.3s}.reality-demo.demo-intro .metric-chart b:nth-child(7){animation-delay:.36s}.reality-demo.demo-intro .metric-chart b:nth-child(8){animation-delay:.42s}@keyframes metricRise{from{transform:scaleY(.08);opacity:.35}to{transform:scaleY(1);opacity:1}}
/* Incident */
.incident-stage{display:grid;align-content:center;gap:0;padding:20px 24px 48px}.incident-line{display:grid;grid-template-columns:28px 1fr;gap:8px;position:relative;padding:7px 0}.incident-line:not(:last-of-type):after{content:'';position:absolute;left:8px;top:27px;bottom:-7px;width:1px;background:var(--line)}.incident-line .dot{width:17px;height:17px;border-radius:50%;border:4px solid var(--surface);box-shadow:0 0 0 1px var(--line);background:var(--muted);margin-top:1px;z-index:2}.incident-line .dot.ok{background:var(--ok)}.incident-line .dot.change{background:var(--accent)}.incident-line .dot.bad{background:var(--danger)}.incident-line strong{font-size:.78rem}.incident-line small{display:block;margin-top:1px;color:var(--muted);font-size:.68rem}.incident-line.future{opacity:.65}.reality-demo.choice-good .incident-line.future{opacity:1}.reality-demo.choice-good .incident-line.future .dot{background:var(--ok)}
/* Form */
.form-stage{display:grid;place-items:center;padding:24px 24px 52px}.mini-form{width:min(360px,92%);display:grid;gap:8px;border:1px solid var(--line);border-radius:15px;background:var(--surface);padding:17px;box-shadow:0 12px 24px rgba(15,23,42,.05)}.mini-form label{display:grid;gap:5px;font-size:.72rem;font-weight:850}.mini-form input{height:39px;border:1px solid color-mix(in srgb,var(--danger) 34%,var(--line));border-radius:10px;padding:0 10px;background:var(--surface)}.mini-form button{height:39px;border:0;border-radius:10px;background:var(--text);color:var(--surface);font-weight:850}.form-error{font-size:.7rem;color:var(--danger);font-weight:750}.reality-demo.choice-good .form-error{display:block!important}.reality-demo.choice-good .mini-form input{outline:3px solid color-mix(in srgb,var(--danger) 13%,transparent)}
/* Responsive */
.responsive-stage{display:grid;grid-template-columns:1fr 145px;gap:18px;align-items:center;padding:20px 30px 52px}.device{border:1px solid var(--line);background:#101827;color:#fff;border-radius:18px;padding:7px;box-shadow:0 14px 30px rgba(15,23,42,.12)}.device>span{display:block;text-align:center;font-size:.6rem;opacity:.55;padding-bottom:5px}.device>div{min-height:150px;border-radius:12px;background:linear-gradient(135deg,#173052,#0f766e);padding:16px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.device strong{font-size:1.15rem;line-height:.95}.device p{font-size:.66rem;opacity:.78}.device button{align-self:flex-start;border:0;border-radius:7px;padding:6px 9px;font-size:.62rem;font-weight:850}.device.phone>div{padding:10px}.device.phone strong{font-size:1.05rem;white-space:nowrap;transform:translateX(-10px)}.device.phone p{white-space:nowrap}.reality-demo.choice-good .device.phone>div{justify-content:center}.reality-demo.choice-good .device.phone strong{font-size:.78rem;white-space:normal;transform:none}.reality-demo.choice-good .device.phone p{white-space:normal}
/* Typography */
.type-stage{padding:22px 24px 52px;display:grid;place-items:center}.type-stage article{max-width:610px;border:1px solid var(--line);border-radius:15px;background:var(--surface);padding:17px}.type-stage article>span{font-size:.65rem;color:var(--accent);font-weight:900;letter-spacing:.08em}.type-stage h4{font-size:1.3rem;margin:.35rem 0 .6rem}.type-stage p{font-size:.72rem;line-height:1.22;max-width:none;margin:0;color:var(--muted)}.reality-demo.choice-good .type-stage article{max-width:520px}.reality-demo.choice-good .type-stage p{font-size:.84rem;line-height:1.62}
/* IA */
.ia-stage{display:grid;grid-template-columns:1.05fr .95fr;gap:15px;align-items:center;padding:22px 24px 52px}.ia-stage nav{display:grid;grid-template-columns:1fr 1fr;gap:7px}.ia-stage nav button{border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:10px;font-size:.7rem;text-align:left;color:var(--muted)}.search-intent{border:1px solid var(--line);border-radius:15px;background:var(--surface);padding:17px;display:grid;gap:5px}.search-intent span,.search-intent small{font-size:.67rem;color:var(--muted)}.reality-demo.choice-good .ia-stage nav button:nth-child(3){border-color:color-mix(in srgb,var(--ok) 45%,var(--line));color:var(--text);background:var(--ok-soft)}.reality-demo.choice-good .ia-stage nav button:nth-child(3){font-size:0}.reality-demo.choice-good .ia-stage nav button:nth-child(3):after{content:'Vrácení a reklamace';font-size:.7rem}
/* Handoff / component */
.handoff-stage{display:grid;grid-template-columns:1fr .8fr;gap:14px;padding:22px 24px 52px;align-items:center}.component-preview{border:1px solid var(--line);border-radius:15px;background:var(--surface);padding:17px;display:grid;gap:8px}.component-preview>span{font-size:.62rem;color:var(--accent);font-weight:900}.component-preview button{border:0;background:var(--text);color:var(--surface);border-radius:9px;padding:8px 10px;font-weight:800}.state-list{display:grid;gap:7px}.state-list span{padding:8px 10px;border-radius:9px;background:var(--surface);border:1px solid var(--line);font-size:.7rem;color:var(--muted)}.state-list span.ok{color:var(--ok)}.reality-demo.choice-good .state-list span{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 28%,var(--line))}
/* Crop */
.crop-stage{padding:20px 24px 52px;display:grid;place-items:center}.crop-photo{width:min(520px,95%);height:175px;border-radius:16px;background:linear-gradient(125deg,#172554,#0f766e);position:relative;overflow:hidden}.crop-person{position:absolute;width:72px;height:72px;border-radius:50%;background:#fde68a;right:26%;top:43px;box-shadow:0 58px 0 22px #d97706}.crop-photo strong{position:absolute;left:22px;top:31px;color:#fff;font-size:1.4rem;line-height:.95;z-index:2}.crop-window{position:absolute;right:5%;top:12px;width:35%;height:151px;border:2px solid rgba(255,255,255,.8);border-radius:10px;box-shadow:0 0 0 999px rgba(4,10,24,.43)}.reality-demo.choice-good .crop-window{right:17%;width:48%}
/* Export */
.export-stage{display:grid;grid-template-columns:90px 70px 150px;justify-content:center;gap:9px;align-items:center;padding:24px 24px 62px}.export-mark{height:90px;border-radius:14px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;font-size:3rem;font-weight:900}.zoomed-mark{font-family:monospace;text-shadow:2px 0 #889,0 2px #889;filter:contrast(.85)}.export-arrow{text-align:center;color:var(--muted);font-weight:900}.export-meta{grid-column:1/-1;display:flex;justify-content:center;gap:8px;font-size:.7rem;color:var(--muted)}.reality-demo.choice-good .zoomed-mark{text-shadow:none;filter:none}.reality-demo.choice-good .export-meta strong:after{content:' · SVG / správný cílový export';color:var(--ok)}
/* Generic design */
.design-stage{display:grid;place-items:center;padding:20px 24px 52px}.design-poster{width:min(330px,86%);min-height:175px;border-radius:16px;background:#101827;color:#fff;padding:19px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.design-poster>span{font-size:.65rem;opacity:.72}.design-poster strong{font-size:1.55rem;line-height:.94;margin:8px 0}.design-poster p{font-size:.78rem;margin:2px 0}.design-poster button{align-self:flex-start;margin-top:7px;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff;border-radius:8px;padding:6px 8px;font-size:.68rem}.eye-path{position:absolute;width:9px;height:9px;background:#fbbf24;border-radius:50%;right:24px;top:30px;box-shadow:0 0 0 7px rgba(251,191,36,.16)}.reality-demo.demo-intro .eye-path{animation:eyePath 2.4s ease both}.reality-demo.choice-good .design-poster strong{font-size:2.05rem}.reality-demo.choice-good .design-poster p{opacity:.78}.reality-demo.choice-good .design-poster button{background:#fff;color:#101827;border-color:#fff}@keyframes eyePath{0%{transform:translate(0,0)}45%{transform:translate(-110px,54px)}100%{transform:translate(-48px,112px)}}

.lesson-story-visual .reality-demo{margin:0}.lesson-story-scenes{view-transition-name:lesson-story-scene}.principle-details .assessment-visual{margin:0;border:0;border-top:1px solid var(--line);border-radius:0}
@supports (view-transition-name:lesson-story-scene){::view-transition-old(lesson-story-scene){animation:180ms ease both realitySceneOut}::view-transition-new(lesson-story-scene){animation:260ms cubic-bezier(.2,.7,.3,1) both realitySceneIn}}@keyframes realitySceneOut{to{opacity:0;transform:translateY(-3px)}}@keyframes realitySceneIn{from{opacity:.15;transform:translateY(5px)}to{opacity:1;transform:none}}

@container (max-width:720px){.reality-layout{grid-template-columns:1fr}.reality-main{border-right:0;border-bottom:1px solid var(--line)}.reality-demo-head{display:grid}.reality-badge{justify-self:start}.reality-evidence-grid{grid-template-columns:1fr}.topology-stage{grid-template-columns:82px 1fr 82px 1fr 82px;padding-inline:12px}.topo-node{min-height:76px}.metrics-stage{grid-template-columns:1fr 1fr}.metric-card:nth-child(3){grid-column:1/-1}.responsive-stage{grid-template-columns:1fr 125px;padding-inline:14px}.ia-stage,.handoff-stage{grid-template-columns:1fr}.reality-explanation{grid-template-columns:1fr}.reality-explanation>div+div{border-left:0;border-top:1px solid var(--line)}}
@media(max-width:620px){.reality-demo{border-radius:16px}.reality-demo-head,.reality-main,.reality-decision{padding:14px}.reality-phases{grid-template-columns:1fr 1fr}.reality-phases span{font-size:.64rem}.topology-stage{grid-template-columns:1fr;gap:7px;padding:14px 14px 50px}.topo-link{width:2px;height:22px;justify-self:center}.topo-link:after{content:'↓';right:auto;left:50%;top:50%;transform:translate(-50%,-50%)}.reality-packet{display:none}.export-stage{grid-template-columns:70px 44px 100px}.reality-choice-list button{font-size:.78rem}}
@media(prefers-reduced-motion:reduce){.reality-demo *,.reality-demo *:before,.reality-demo *:after{animation:none!important;transition-duration:.001ms!important}.lesson-story-scenes{view-transition-name:none}.reality-packet{display:none}}

.reality-head-actions{display:flex;align-items:center;gap:7px;flex-shrink:0}.reality-motion-toggle{border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);padding:7px 9px;font-size:.68rem;font-weight:800;cursor:pointer}.reality-motion-toggle:hover{color:var(--text);background:var(--surface-2)}.reality-demo.motion-off *,.reality-demo.motion-off *:before,.reality-demo.motion-off *:after{animation:none!important;transition-duration:.001ms!important}.reality-demo.motion-off .reality-packet{display:none}.reality-demo.motion-off .reality-motion-toggle{color:var(--accent);background:var(--accent-soft)}
@container (max-width:720px){.reality-head-actions{justify-self:start}}
.lesson-reality-prompts>p{margin:.2rem 0 .75rem;color:var(--muted);font-size:.76rem;line-height:1.45}.lesson-reality-prompts>details{border-top:1px solid var(--line);padding:8px 0}.lesson-reality-prompts>details>summary{cursor:pointer;font-weight:850;font-size:.78rem}.lesson-reality-prompts details p{font-size:.74rem;line-height:1.45;color:var(--muted)}.lesson-reality-prompts details>b{font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:var(--accent)}.lesson-reality-prompts .teacher-answer{margin-top:7px;padding:7px 9px;border-radius:10px;background:var(--surface-2)}.lesson-reality-prompts .teacher-answer summary{cursor:pointer;font-size:.7rem;font-weight:850;color:var(--accent)}
/* v35 · calmer lesson navigation: fewer card-like surfaces */
.lesson-story-nav{gap:4px;padding-bottom:12px}.lesson-story-nav button{min-width:150px;border-color:transparent;background:transparent;box-shadow:none;padding:8px 10px}.lesson-story-nav button i{background:var(--surface-2);border:1px solid var(--line)}.lesson-story-nav button:hover{background:var(--surface-2);color:var(--text)}.lesson-story-nav button.active{background:var(--accent-soft);border-color:transparent;box-shadow:none}.lesson-story-nav button.active i{background:var(--surface);border-color:color-mix(in srgb,var(--accent) 32%,var(--line));color:var(--accent)}

/* v45.4 · teacher assigned tasks on student dashboard */
.teacher-task-panel{border:1px solid #dce3e9}.teacher-task-list{display:grid;gap:9px}.teacher-task-card{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:12px;align-items:start;padding:12px 13px;border:1px solid #e0e6eb;border-radius:14px;background:#fbfcfd}.teacher-task-card>i{width:9px;height:9px;margin-top:5px;border-radius:999px;background:#7f8b96}.teacher-task-card.priority-high>i{background:#d55353}.teacher-task-card.priority-low>i{background:#58a37f}.teacher-task-card strong{display:block;font-size:.7rem}.teacher-task-card p{margin:4px 0 0;font-size:.56rem;line-height:1.5;color:#687580}.teacher-task-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}.teacher-task-meta span{padding:4px 6px;border-radius:7px;background:#eef2f5;font-size:.46rem;color:#6d7984}.teacher-task-card form{align-self:center}.teacher-task-card .btn{white-space:nowrap}.teacher-task-empty{font-size:.58rem;color:#74808b}
@media(max-width:680px){.teacher-task-card{grid-template-columns:9px minmax(0,1fr)}.teacher-task-card form{grid-column:2}.teacher-task-card .btn{width:100%}}
/* v46 · teacher-assigned resources and support plan */
.teacher-task-resource{margin-top:7px;padding:7px 9px;border-radius:9px;background:#f3f6f8;font-size:.52rem;line-height:1.45}.teacher-task-resource strong{display:inline;font-size:inherit}.teacher-task-resource a{overflow-wrap:anywhere}.teacher-intervention-panel{border:1px solid #dce3e9}.teacher-intervention-panel .teacher-task-card{grid-template-columns:10px minmax(0,1fr)}
