:root{color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:#0f0f14;color:#e6e6ee;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button{font-family:inherit}.app-shell{display:flex;height:100vh;width:100vw}.sidebar{width:200px;flex-shrink:0;border-right:1px solid #23232c;padding:20px 12px;background:#111116;display:flex;flex-direction:column;gap:20px}.brand{font-size:18px;font-weight:700;padding-left:8px}.mode-badge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.04em;padding:3px 8px;border-radius:999px;margin-left:8px;vertical-align:middle}.mode-badge.live{background:#16331f;color:#63e08c}.mode-badge.demo{background:#332616;color:#e0ab63}.nav-item{display:block;width:100%;text-align:left;background:transparent;border:none;color:#9a9ab0;padding:10px 8px;border-radius:8px;font-size:14px;cursor:pointer;margin-bottom:4px}.nav-item.active{background:#1f1f2c;color:#e6e6ee}.main-view{flex:1;min-width:0;overflow-y:auto;padding:28px 32px}.card{background:#16161d;border:1px solid #23232c;border-radius:12px;padding:20px}.btn{padding:10px 18px;border-radius:8px;border:1px solid transparent;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#6c5cff;color:#f5f6ff}.btn-secondary{background:#1f1f2c;color:#e6e6ee;border-color:#2a2a36}.btn-ghost{background:transparent;color:#9a9ab0;border-color:#2a2a36}.field-input,.field-textarea{width:100%;padding:10px 12px;border-radius:8px;border:1px solid #2a2a36;background:#0f0f14;color:#e6e6ee;font-size:14px;font-family:inherit;outline:none}.field-textarea{resize:vertical;min-height:64px}.chip{display:inline-block;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:#23233a;color:#b3b3ff}.question-prompt{font-size:18px;line-height:1.5;margin:4px 0 16px}.option-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.option-row{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:8px;border:1px solid #2a2a36;background:#0f0f14;cursor:pointer;font-size:14px}.option-row.selected{border-color:#6c5cff;background:#1a1830}.option-row.correct{border-color:#4caf6f;background:#142a1c}.option-row.incorrect{border-color:#d9534f;background:#2a1616}.transcript{display:flex;flex-direction:column;gap:10px;margin:16px 0}.bubble-row{display:flex;width:100%}.bubble-row.learner{justify-content:flex-end}.bubble{max-width:78%;padding:10px 14px;border-radius:12px;font-size:14px;line-height:1.5;white-space:pre-wrap}.bubble.tutor{background:#1c1c26;border:1px solid #2a2a36}.bubble.learner{background:#3a4bff;color:#f5f6ff}.action-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.muted{color:#6c6c80;font-size:13px}.error-banner{color:#ff9d9d;background:#2a1616;border:1px solid #4a2323;border-radius:8px;padding:10px 14px;font-size:13px;margin-bottom:12px}.grade-row{display:flex;gap:8px;margin-top:16px}.grade-btn{flex:1}.stat-row{display:flex;gap:16px;margin-bottom:24px;flex-wrap:wrap}.stat-box{min-width:140px}.stat-value{font-size:26px;font-weight:700}.stat-label{font-size:12px;color:#9a9ab0;text-transform:uppercase;letter-spacing:.03em}.strand-group{margin-bottom:18px}.strand-name{font-size:13px;color:#9a9ab0;margin-bottom:8px;text-transform:uppercase;letter-spacing:.03em}.heatmap-grid{display:flex;flex-wrap:wrap;gap:8px}.heatmap-cell{min-width:140px;padding:10px 12px;border-radius:8px;font-size:12px;color:#8a8a9c;font-weight:600;background:#1c1c26;border:1px solid #23232c}.heatmap-cell.m0{background:#3a1f1f;color:#ff9d9d}.heatmap-cell.m1{background:#4a2f1f;color:#ffc79d}.heatmap-cell.m2{background:#4a441f;color:#f0e08a}.heatmap-cell.m3{background:#2f4a2a;color:#a8e0a0}.heatmap-cell.m4{background:#1f4a33;color:#7ff0b6}.section-title{font-size:16px;font-weight:700;margin:28px 0 12px}.list-item{padding:10px 0;border-bottom:1px solid #23232c;font-size:13px}.list-item:last-child{border-bottom:none}.onboarding-shell{height:100vh;width:100vw;display:flex;align-items:center;justify-content:center}.onboarding-card{width:380px}.directness-options{display:flex;flex-direction:column;gap:8px;margin:12px 0 20px}.directness-option{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:8px;border:1px solid #2a2a36;cursor:pointer}.directness-option.selected{border-color:#6c5cff;background:#1a1830}