.student-progress{margin-top:16px;min-width:260px;color:#fff}.student-progress strong{font:700 28px var(--display);display:block}.student-progress span{font-size:12px;color:#a5a3aa}.student-progress-track{height:7px;margin-top:9px;background:#34343d;border-radius:10px;overflow:hidden}.student-progress-track i{display:block;height:100%;background:var(--orange);transition:width .3s ease}.stage-item.completed{border-color:rgba(240,138,93,.55)}.stage-item span{display:inline-block}.stage-item small{display:block;margin:7px 0 0 30px;color:#777680;font-size:10px}.stage-item.completed small{color:var(--orange)}.format-editor[readonly]{cursor:default}
:root{
  --bg:#f5f2ee;
  --bg-strong:#efeae3;
  --panel:#fffdfb;
  --panel-2:#f4f0ed;
  --ink:#171722;
  --ink-soft:#4a4d5d;
  --muted:#6d7183;
  --line:rgba(23,23,34,.1);
  --violet:#6657ff;
  --violet-2:#8a80ff;
  --orange:#f39b67;
  --amber:#ffd18d;
  --red:#ef6a5c;
  --green:#4bb77e;
  --shadow:0 20px 50px rgba(23,23,34,.12);
  --font:"DM Sans",sans-serif;
  --display:"Space Grotesk",sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(circle at top left, rgba(102,87,255,.12), transparent 28%),
    radial-gradient(circle at bottom right, rgba(243,155,103,.18), transparent 24%),
    var(--bg);
  color:var(--ink);
  font-family:var(--font);
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.08), rgba(255,255,255,.08));
  mix-blend-mode:screen;
  opacity:.7;
}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");z-index:30}
.locked> :not(.auth-screen){display:none}.auth-screen{min-height:100vh;display:grid;place-items:center;padding:30px;background:radial-gradient(circle at 85% 15%, rgba(102,87,255,.15), transparent 32%), linear-gradient(135deg, #f8f5f0 0%, #f1ece6 100%)}.auth-card{width:min(100%,540px);background:rgba(255,255,255,.82);backdrop-filter:blur(12px);border:1px solid rgba(23,23,34,.08);border-radius:24px;padding:42px;box-shadow:var(--shadow);position:relative;overflow:hidden}.auth-card::before{content:"";position:absolute;inset:0 auto auto -20%;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle, rgba(102,87,255,.25), transparent 65%)}.auth-card h1{font-size:clamp(48px,7vw,86px);line-height:.86;letter-spacing:-.07em;margin:0 0 18px}.auth-card .eyebrow{margin-bottom:16px}.auth-lead{color:var(--muted);line-height:1.65;margin-bottom:28px;font-size:1.02rem}.auth-card form{display:grid;gap:10px}.auth-card label{font-weight:700;font-size:13px;margin-top:8px}.auth-card input,.auth-card select{width:100%;padding:15px 14px;border:1px solid var(--line);border-radius:12px;background:#fff;font:inherit;color:var(--ink);transition:border-color .2s ease, box-shadow .2s ease}.auth-card input::placeholder{color:#9aa0b3}.auth-card input:focus,.auth-card select:focus{outline:none;border-color:rgba(102,87,255,.6);box-shadow:0 0 0 4px rgba(102,87,255,.12)}.auth-submit{justify-content:space-between;margin-top:12px}.login-hint,.login-error{font-size:12px;color:var(--muted);line-height:1.5}.login-error{color:#c53939;min-height:18px}.auth-screen.hidden{display:none}

.session-actions{display:flex;align-items:center;gap:10px}.session-actions>span{font-size:12px;color:var(--muted);font-weight:700}.teacher-mode #workspace,.teacher-mode #journey,.teacher-mode #challenge{display:none}.student-mode #teacher{display:none}.submission-section{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}.submission-section h4{margin:0;font-size:15px;color:var(--ink-soft)}.submission-list{display:grid;gap:10px;margin:12px 0}.submission{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:14px;background:var(--panel-2);border-radius:12px;border:1px solid var(--line)}.submission strong{display:block;font-size:1rem}.submission small,.submission span{font-size:11px;color:var(--muted)}.submission>b{font-family:var(--display);color:var(--violet);grid-row:span 2}.empty-state{font-size:13px;color:var(--muted)}

.topbar{position:sticky;top:0;z-index:20;height:74px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.72);backdrop-filter:blur(14px);border-bottom:1px solid rgba(23,23,34,.08)}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--ink);font-family:var(--display);font-weight:700;letter-spacing:.04em}.brand-mark{width:34px;height:34px;display:grid;place-items:center;background:linear-gradient(135deg, var(--ink), #2f2c49);color:white;border-radius:10px;font-size:12px;box-shadow:0 12px 24px rgba(23,23,34,.18)}.topbar nav{display:flex;gap:28px;align-items:center}.topbar nav a{color:var(--ink-soft);text-decoration:none;font-size:14px;font-weight:700;position:relative}.topbar nav a::after{content:"";position:absolute;left:0;bottom:-8px;width:100%;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--violet),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .2s ease}.topbar nav a:hover::after,.topbar nav a:focus-visible::after{transform:scaleX(1)}

.ghost-btn,.secondary-btn,.primary-btn,.challenge-btn,.danger-btn{font:inherit;cursor:pointer;border-radius:12px;padding:12px 18px;transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease}.ghost-btn{border:1px solid var(--line);background:rgba(255,255,255,.5);color:var(--ink)}.ghost-btn:hover,.secondary-btn:hover,.challenge-btn:hover,.danger-btn:hover{transform:translateY(-1px)}
.section{padding:105px 7vw}.hero{min-height:calc(100vh - 74px);display:grid;grid-template-columns:1.08fr .92fr;gap:8vw;align-items:center;background:radial-gradient(circle at 85% 20%,rgba(102,87,255,.18),transparent 28%),radial-gradient(circle at 12% 88%,rgba(243,155,103,.16),transparent 22%)}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.18em;margin:0 0 20px;color:var(--violet)}h1,h2,h3{font-family:var(--display);margin:0}h1{font-size:clamp(58px,8vw,118px);line-height:.84;letter-spacing:-.07em}h1 em{font-style:normal;color:var(--violet)}.lead{max-width:650px;font-size:18px;line-height:1.7;color:var(--ink-soft);margin:32px 0}.actions{display:flex;gap:12px;flex-wrap:wrap}.primary-btn{background:linear-gradient(135deg,var(--ink),#2d2a36);color:#fff;border:1px solid transparent;text-decoration:none;display:inline-flex;align-items:center;gap:18px;font-weight:800;box-shadow:0 18px 30px rgba(23,23,34,.12)}.primary-btn:hover{background:linear-gradient(135deg,var(--violet),#7d67ff);border-color:transparent}.secondary-btn{background:rgba(255,255,255,.45);border:1px solid var(--line);font-weight:700}.secondary-btn:hover{background:#fff}.hero-card{background:linear-gradient(180deg,#1d1d29 0%, #14151d 100%);min-height:460px;border-radius:26px;padding:16px;color:#fff;box-shadow:0 30px 70px rgba(17,17,22,.18);position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.06)}.hero-card::before{content:"";position:absolute;inset:auto -18% -14% auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle, rgba(243,155,103,.4), transparent 60%)}.screen-top{display:flex;align-items:center;gap:8px;padding:0 8px 12px;color:rgba(255,255,255,.75);font-size:10px;letter-spacing:.12em;text-transform:uppercase}.screen-top span{display:inline-block;width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.4)}.screen-top span:nth-child(1){background:#ff6b6b}.screen-top span:nth-child(2){background:#f7ca79}.screen-top span:nth-child(3){background:#69d39d}.mini-scene{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:18px 18px 12px;min-height:260px;position:relative;z-index:1}.scene-tag{display:inline-block;padding:7px 10px;border-radius:999px;background:rgba(102,87,255,.2);border:1px solid rgba(138,128,255,.35);color:#d9d2ff;font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase}.mini-scene p{font-size:16px;line-height:1.8;color:rgba(255,255,255,.82);margin:18px 0 0}.mini-scene .muted{color:rgba(255,255,255,.5)}.progress-ring{position:absolute;right:26px;bottom:26px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle at center, #1d1d29 0 56%, transparent 57%), conic-gradient(var(--violet) 0 68%, rgba(255,255,255,.1) 68% 100%);display:grid;place-items:center;text-align:center;z-index:1}.progress-ring strong{font-size:30px;font-family:var(--display);display:block;font-weight:700}.progress-ring small{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}

.section-heading{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:55px}.section-heading h2{font-size:clamp(42px,5vw,76px);line-height:.9;letter-spacing:-.06em}.section-note{max-width:390px;color:var(--muted);line-height:1.7}.archive-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:start}.journey-grid{display:flex;flex-direction:column;gap:12px}.journey-card{min-height:90px;background:linear-gradient(180deg,#f9f5f2,#f3f1ed);border:1px solid rgba(23,23,34,.08);border-radius:18px;padding:18px 18px 14px;display:flex;flex-direction:column;justify-content:center;transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;cursor:pointer;position:relative;overflow:hidden}.journey-card:hover{transform:translateX(2px);border-color:rgba(102,87,255,.4);box-shadow:0 18px 28px rgba(102,87,255,.08)}.journey-card.done{background:linear-gradient(180deg,#f1eeff,#ebf1ff);border-color:rgba(102,87,255,.2)}.card-num{font-family:var(--display);font-size:12px;color:var(--muted)}.journey-card h3{font-size:24px;line-height:1.15;letter-spacing:-.04em;margin-top:4px}.journey-card p{color:var(--muted);font-size:12px;line-height:1.5;margin:4px 0 0}.journey-card.selected{border-color:rgba(102,87,255,.7);box-shadow:0 18px 34px rgba(102,87,255,.12);background:linear-gradient(180deg,#f4f2ff,#efeefe)}.journey-card.selected::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:linear-gradient(180deg,var(--violet),var(--orange));}.script-preview{margin-top:12px;padding:10px 12px;border-radius:12px;background:rgba(102,87,255,.08);border:1px solid rgba(102,87,255,.12);color:var(--ink-soft);font-size:11px;line-height:1.7}.script-preview strong{display:block;margin-bottom:6px;color:var(--violet)}.card-status{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:10px}.done .card-status{color:var(--violet)}

.format-detail{margin-top:0}.detail-shell{position:relative;padding:24px;border-radius:28px;background:linear-gradient(135deg,#f4efe9,#ffffff 32%,#f6f2ff 100%);border:1px solid rgba(102,87,255,.12);box-shadow:0 24px 44px rgba(23,23,34,.06)}.detail-shell::before{content:"";position:absolute;inset:18px auto 18px 18px;width:14px;border-radius:999px;background:linear-gradient(180deg,#d9d1ff,#b59efb,#ffce9a)}.detail-header{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:0 0 18px 18px}.detail-header h3{font-size:30px;letter-spacing:-.05em}.detail-badge{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:linear-gradient(135deg,#201f2d,#312d48);color:#f6f1ff;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}.sample-panel{margin-left:18px;background:#f8f5f2;border:1px solid rgba(23,23,34,.08);border-radius:20px;overflow:hidden;box-shadow:0 18px 32px rgba(17,17,22,.08)}.sample-topbar{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid rgba(23,23,34,.08);background:linear-gradient(180deg,#f0efe9,#eaebef)}.sample-topbar span{width:10px;height:10px;border-radius:50%;display:inline-block}.sample-topbar span:nth-child(1){background:#ff6d6d}.sample-topbar span:nth-child(2){background:#f7c76b}.sample-topbar span:nth-child(3){background:#4bd78d}.sample-topbar em{margin-left:auto;color:rgba(23,23,34,.7);font-style:normal;font-size:10px;letter-spacing:.16em;text-transform:uppercase}.format-editor{width:100%;min-height:520px;border:0;background:#fffdf8;color:#1a1b20;padding:24px 22px 30px;resize:vertical;font:500 15px/1.9 "Courier New",Courier,monospace;outline:none;letter-spacing:.01em;border-left:2px solid rgba(102,87,255,.18)}.format-editor::placeholder{color:rgba(26,27,32,.42)}.format-editor:focus{box-shadow:inset 0 0 0 1px rgba(102,87,255,.3)}
@media (max-width:900px){.archive-layout{grid-template-columns:1fr}.journey-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}.journey-card{min-height:150px}}
@media (max-width:600px){.archive-layout{grid-template-columns:1fr}.journey-grid{grid-template-columns:1fr}.detail-header{margin-left:8px}.sample-panel{margin-left:8px}.detail-shell::before{left:10px}}

.workspace-section{background:linear-gradient(180deg,#181821,#111118 50%, #191a21);color:#fff}.workspace-section .eyebrow{color:var(--orange)}.workspace-section .section-note{color:#a5a3aa}.workspace{display:grid;grid-template-columns:260px 1fr;gap:18px}.stage-list{display:flex;flex-direction:column;gap:7px}.stage-item{border:1px solid rgba(255,255,255,.08);background:#201f2a;color:#b5b4c0;text-align:left;border-radius:12px;padding:14px;cursor:pointer;font:inherit;transition:border-color .2s ease, background .2s ease, transform .2s ease}.stage-item:hover,.stage-item.active{color:white;border-color:rgba(102,87,255,.7);background:linear-gradient(180deg,#2a2836,#23222c);transform:translateX(2px)}.stage-item b{display:inline-block;width:30px;color:#817f8f}.stage-item.active b{color:var(--orange)}.stage-item span{display:inline-block}.stage-item small{display:block;margin:7px 0 0 30px;color:#75758a;font-size:10px}.stage-item.completed{border-color:rgba(243,155,103,.5)}.stage-item.completed small{color:var(--amber)}
.editor{background:var(--panel);color:var(--ink);border-radius:22px;padding:32px;min-height:560px;border:1px solid rgba(23,23,34,.07);box-shadow:0 20px 40px rgba(17,17,22,.08)}.editor-head{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:28px}.editor-head>div{display:flex;gap:15px;align-items:flex-start}.stage-number{font-family:var(--display);font-size:12px;color:var(--violet);font-weight:800}.editor-head h3{font-size:30px}.editor-head p{color:var(--muted);margin:5px 0}.save-status{font-size:11px;color:#4c9b69;font-weight:700}.question{margin-bottom:25px}.question label{display:block;font-weight:800;margin-bottom:9px}.question small{display:block;color:var(--muted);margin-top:5px}.question input,.question textarea,.question select{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:13px;font:inherit;outline:none;transition:border-color .2s ease, box-shadow .2s ease}.question textarea{min-height:110px;resize:vertical}.question input:focus,.question textarea:focus,.question select:focus{border-color:rgba(102,87,255,.6);box-shadow:0 0 0 4px rgba(102,87,255,.12)}.feedback{background:linear-gradient(180deg,#f2efff,#f7f4ff);border-left:4px solid var(--violet);padding:17px;margin-top:12px;line-height:1.7;font-size:14px;border-radius:0 12px 12px 0}.feedback strong{font-family:var(--display)}.editor-actions{display:flex;justify-content:space-between;margin-top:30px;gap:12px}.workspace .primary-btn{background:linear-gradient(135deg,var(--violet),#7d67ff);border-color:transparent;color:#fff}.workspace .primary-btn:hover{filter:brightness(1.03)}

.practice-section{background:linear-gradient(180deg,#f7f0ff,#efeaf8)}.practice-panel{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}.practice-summary,.practice-list{background:rgba(255,255,255,.7);border:1px solid rgba(23,23,34,.07);border-radius:20px;padding:22px;box-shadow:0 18px 28px rgba(18,17,24,.04)}.practice-summary-header{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.practice-summary-header h3{font-size:34px;letter-spacing:-.05em}.summary-badge{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:#201f2d;color:#f5f1ff;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.practice-bar{height:12px;background:#ede9f4;border-radius:999px;overflow:hidden;margin-top:18px}.practice-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--violet),#8d7dff);border-radius:inherit}.practice-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.practice-meta div{background:#f4f1fb;border:1px solid rgba(102,87,255,.08);border-radius:12px;padding:14px}.practice-meta strong{display:block;font-size:26px;font-family:var(--display)}.practice-meta span{font-size:12px;color:var(--muted)}.practice-list{display:grid;gap:12px}.practice-card{background:linear-gradient(180deg,#fff,#faf7ff);border:1px solid rgba(23,23,34,.07);border-radius:16px;padding:18px;display:grid;gap:12px}.practice-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.practice-card h4{font-size:20px;margin:0;letter-spacing:-.04em}.practice-card p{margin:0;color:var(--muted);line-height:1.6;font-size:13px}.practice-chip{padding:6px 10px;border-radius:999px;background:#f0edff;color:var(--violet);font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.practice-card ul{margin:0;padding-left:18px;color:var(--ink-soft);font-size:12px;line-height:1.8}.practice-card button{border:0;border-radius:10px;padding:10px 12px;font:inherit;font-weight:700;cursor:pointer;color:#fff;background:linear-gradient(135deg,var(--violet),#7d67ff)}.practice-card.done{border-color:rgba(75,183,126,.35);background:linear-gradient(180deg,#effdf4,#f6fff9)}.practice-card.done button{background:linear-gradient(135deg,#2b9d62,#4bb77e)}.task-empty{padding:12px 0;color:var(--muted)}

.challenge-section{background:linear-gradient(180deg,#f0e8de,#eadfce)}.challenge-box{background:linear-gradient(135deg,#f6ae73,#f0a06d 48%,#eb8f5f);border-radius:26px;padding:50px;display:grid;grid-template-columns:1fr 1fr;gap:50px;box-shadow:0 24px 40px rgba(177,113,48,.15)}.challenge-box .eyebrow{color:var(--ink)}.challenge-box h2{font-size:64px}.challenge-box p{max-width:500px;line-height:1.7}.challenge-controls{display:flex;flex-direction:column;justify-content:center;gap:15px}.challenge-btn{background:var(--ink);color:white;border:0;font-weight:800;padding:17px;box-shadow:0 16px 30px rgba(20,20,30,.18)}.challenge-result{background:rgba(255,255,255,.42);border:1px solid rgba(23,23,34,.08);border-radius:14px;padding:20px;line-height:1.7;min-height:100px;backdrop-filter:blur(6px)}.challenge-advice{border-top:1px solid rgba(23,23,34,.12);margin-top:15px;padding-top:15px}.challenge-advice p{margin:7px 0;max-width:none}.challenge-advice ul{margin:7px 0 0;padding-left:20px;font-size:13px}

.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.stat{background:linear-gradient(180deg,#fff,#faf8f5);border:1px solid var(--line);padding:25px;border-radius:16px;box-shadow:0 16px 26px rgba(17,17,22,.04)}.stat strong{font:700 38px var(--display);display:block}.stat span{font-size:12px;color:var(--muted)}.teacher-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.panel{background:linear-gradient(180deg,#fff,#faf7f4);border:1px solid var(--line);border-radius:16px;padding:28px;box-shadow:0 18px 30px rgba(17,17,22,.04)}.panel h3{font-size:24px;margin-bottom:15px}.panel p{color:var(--muted);line-height:1.6}.rubric label{display:flex;justify-content:space-between;margin-top:15px;font-size:13px}.bar{height:6px;background:#e9e5df;border-radius:20px;margin-top:7px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--violet),#8f8aff)}.full{width:100%;margin-top:10px}#copyMessage{font-size:12px;color:#4c9b69;margin-top:10px}
.portfolio-select{width:100%;margin:4px 0 10px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit;color:var(--ink)}.teacher-actions{display:grid;gap:10px;margin-top:12px}.danger-btn{background:linear-gradient(135deg,#b42318,#cf4a3f);border:1px solid transparent;color:white;font-weight:700}.danger-btn:hover{background:linear-gradient(135deg,#8f1d14,#b63b30)}
footer{padding:30px 7vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:11px;letter-spacing:.05em}
@media(max-width:900px){.topbar nav{display:none}.hero,.challenge-box{grid-template-columns:1fr}.hero-card{min-height:390px}.journey-grid{grid-template-columns:1fr 1fr}.workspace{grid-template-columns:1fr}.stage-list{display:grid;grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:1fr 1fr}.teacher-grid{grid-template-columns:1fr}}
@media(max-width:600px){.section{padding:75px 5vw}.journey-grid{grid-template-columns:1fr}.section-heading{display:block}.section-note{margin-top:20px}.challenge-box{padding:30px}.challenge-box h2{font-size:46px}.editor{padding:22px}.editor-head{display:block}.save-status{display:block;margin-top:15px}footer{display:block}footer span{display:block;margin:5px 0}.auth-card{padding:28px}.topbar{padding:0 5vw}.session-actions{gap:8px}.session-actions>span{display:none}}

.feedback{background:#f7f5ee;border-left-color:#cf623b;color:#292b2c}.feedback-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}.feedback-heading div{display:grid;gap:3px}.feedback-heading div>strong{font-size:15px}.feedback-heading span,.feedback-note,.feedback-source{font-size:11px;color:#6b6c68}.feedback-heading>b{font-size:24px;color:#b84e2b;white-space:nowrap}.feedback-checklist{list-style:none;margin:0;padding:0;display:grid;gap:8px}.feedback-checklist li{display:flex;align-items:flex-start;gap:10px;padding:10px 11px;background:#fff;border:1px solid #e2e0d8;border-radius:7px}.feedback-checklist li>span{flex:0 0 20px;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;font-size:12px;font-weight:800}.feedback-checklist .is-passed>span{background:#e1f0e8;color:#28764d}.feedback-checklist .is-missing>span{background:#f8e8de;color:#a44322}.feedback-checklist li div{display:grid;gap:3px}.feedback-checklist li strong{font-size:12px}.feedback-checklist li small{font-size:12px;line-height:1.5;color:#676761}.feedback-next{margin:13px 0 5px;font-size:13px}.feedback-note,.feedback-source{margin:5px 0 0;line-height:1.5}.feedback-source{padding-top:8px;border-top:1px solid #dedbd2}.feedback-source em{font-style:italic}

/* Arcade theme is defined after the base component styles.
:root{
  --bg:#080b15;--bg-strong:#0d1322;--panel:#101829;--panel-2:#131f31;
  --ink:#ecfbff;--ink-soft:#bfd2dc;--muted:#8da4b2;--line:rgba(89,245,224,.16);
  --violet:#58f2df;--violet-2:#96fff1;--orange:#ff5bd6;--amber:#ffd166;
  --red:#ff7188;--green:#65f2a5;--shadow:0 22px 60px rgba(0,0,0,.42);
  --arcade-font:"Orbitron",var(--display);
}
body{background:radial-gradient(ellipse at 12% 0%,rgba(67,226,221,.12),transparent 34%),radial-gradient(ellipse at 92% 26%,rgba(255,75,205,.08),transparent 30%),#080b15;color:var(--ink)}
body::before{background-image:linear-gradient(rgba(89,245,224,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(89,245,224,.035) 1px,transparent 1px);background-size:44px 44px;mix-blend-mode:normal;opacity:.65}
.noise{opacity:.025}
.auth-screen{background:radial-gradient(circle at 50% 15%,rgba(67,226,221,.12),transparent 32%),linear-gradient(145deg,#080b15,#0c1424 65%,#110d20)}
.auth-card,.panel,.stat,.editor,.practice-summary,.practice-list,.practice-card,.hero-card,.challenge-box{border-color:rgba(89,245,224,.17);box-shadow:0 18px 45px rgba(0,0,0,.28),0 0 24px rgba(89,245,224,.035)}
.auth-card{border-radius:18px;background:linear-gradient(145deg,rgba(16,24,41,.97),rgba(11,17,31,.97))}
.auth-card::before{background:radial-gradient(circle,rgba(89,245,224,.19),transparent 68%)}
.auth-card .eyebrow,.eyebrow,.brand,.brand-mark,.screen-top,.scene-tag,.stage-number,.summary-badge,.practice-chip{font-family:var(--arcade-font)}
.auth-card .eyebrow,.eyebrow{color:var(--violet-2)}
.auth-card h1 em,.hero h1 em{color:var(--violet)}
.auth-lead,.login-hint,.hero .lead,.section-note,.panel p{color:var(--ink-soft)}
.auth-card input,.auth-card select,.auth-card textarea,.question input,.question textarea,.question select,.portfolio-select{background:#090f1d;border-color:rgba(89,245,224,.18)}
.auth-card input:focus,.auth-card select:focus,.auth-card textarea:focus,.question input:focus,.question textarea:focus,.question select:focus{border-color:var(--violet);box-shadow:0 0 0 3px rgba(89,245,224,.14)}
.auth-submit,.primary-btn,.challenge-btn,.practice-card button,.hero .primary-btn,.workspace .primary-btn,.editor-actions .primary-btn{background:linear-gradient(110deg,#087f83,#18b6a9 55%,#6652cf);box-shadow:0 8px 24px rgba(24,182,169,.2)}
.auth-submit:hover,.primary-btn:hover,.challenge-btn:hover,.practice-card button:hover{background:linear-gradient(110deg,#10a9a2,#7863e8)}
.secondary-btn,.ghost-btn,.editor-actions .secondary-btn{background:rgba(15,25,42,.86);border-color:rgba(89,245,224,.2);color:var(--ink)}
.secondary-btn:hover,.ghost-btn:hover{background:#17263b;border-color:rgba(89,245,224,.48)}
.topbar{background:rgba(7,11,21,.92);border-color:rgba(89,245,224,.18);box-shadow:0 8px 28px rgba(0,0,0,.22)}
.brand{color:var(--ink);letter-spacing:.09em}
.brand-mark{border-radius:8px;color:#071117;background:linear-gradient(135deg,#69f7e5,#52c8f2);box-shadow:0 0 20px rgba(89,245,224,.3)}
.topbar nav a{color:var(--ink-soft)}
.topbar nav a::after{background:linear-gradient(90deg,var(--violet),var(--orange))}
.hero{background:radial-gradient(ellipse at 78% 22%,rgba(89,245,224,.09),transparent 28%),radial-gradient(ellipse at 8% 90%,rgba(255,91,214,.06),transparent 25%)}
.hero-card{background:linear-gradient(145deg,#101a2b,#090e1a);border-radius:18px}
.hero-card::before{background:radial-gradient(circle,rgba(255,91,214,.24),transparent 68%)}
.screen-top{color:#b2c8d4}
.screen-top span:nth-child(1){background:#ff5bd6}.screen-top span:nth-child(2){background:#ffd166}.screen-top span:nth-child(3){background:#65f2a5}
.mini-scene,.challenge-result{background:rgba(5,11,22,.62);border-color:rgba(89,245,224,.18)}
.scene-tag{background:rgba(89,245,224,.11);border-color:rgba(89,245,224,.28);color:#9bfff3}
.progress-ring{background:radial-gradient(circle at center,#111a2c 0 56%,transparent 57%),conic-gradient(var(--violet) 0 68%,rgba(255,255,255,.1) 68% 100%)}
#journey,.practice-section,#teacher{background:linear-gradient(180deg,rgba(13,19,34,.72),rgba(8,11,21,.68))}
.journey-card,.journey-card.done,.practice-summary,.practice-list,.practice-card,.practice-card.done,.stat,.panel,.editor{background:linear-gradient(145deg,#111b2d,#0d1525);border-color:rgba(89,245,224,.14)}
.journey-card:hover,.journey-card:focus-visible,.stage-item:hover,.stage-item.active{border-color:rgba(89,245,224,.52);box-shadow:0 0 22px rgba(89,245,224,.1)}
.journey-card h3,.editor-head h3,.question label,.panel h3,.rubric label,.practice-summary-header h3,.practice-card h4{color:var(--ink)}
.journey-card p,.card-num,.card-status,.stage-item small,.stage-item b,.editor-head p,.question small,.practice-card p,.practice-card ul,.practice-meta span,.task-empty{color:var(--muted)}
.journey-card .card-status,.stat strong,.submission>b{color:var(--violet-2)}
.stage-item,.stage-item:hover,.stage-item.active{background:#111b2d;border-color:rgba(89,245,224,.14);color:var(--ink-soft);border-radius:10px}
.stage-item.completed{border-color:rgba(101,242,165,.42)}
.stage-item.completed small,.save-status,.ai-ready{color:var(--green)}
.stage-item.active b,.stage-number{color:var(--violet-2)}
.stage-number,.practice-chip,.summary-badge{background:rgba(89,245,224,.1)}
.student-progress-track,.practice-bar,.bar{background:rgba(255,255,255,.09)}
.student-progress-track i,.practice-bar i,.bar i{background:linear-gradient(90deg,#58f2df,#5678ed 60%,#ff5bd6);box-shadow:0 0 10px rgba(89,245,224,.25)}
.editor-head,.feedback-source{border-color:rgba(89,245,224,.14)}
.feedback,.ai-review-panel,.ai-review-status,.ai-strengths,.ai-issues,.ai-suggestions,.practice-meta div{background:#0a1120;border-color:rgba(89,245,224,.14)}
.feedback{border-left-color:var(--violet)}
.feedback strong,.feedback-heading b,.feedback-heading span{color:var(--ink)}
.feedback p,.feedback li,.feedback small,.feedback span,.feedback-note,.feedback-source,.ai-review-summary,.ai-issue span,.ai-issue em,.ai-review-disclaimer{color:var(--ink-soft)}
.field-feedback,.ai-needs-revision{color:#ff91a5}
.practice-card.done{border-color:rgba(101,242,165,.35)}
.challenge-box{background:radial-gradient(circle at 88% 16%,rgba(255,91,214,.1),transparent 30%),linear-gradient(145deg,#111b2d,#0a1020);border-radius:18px}
.challenge-box .eyebrow{color:var(--violet-2)}
.challenge-box h2{color:var(--ink)}
.challenge-box p,.stat span{color:var(--ink-soft)}
.submission{background:#0a1120;border-color:rgba(89,245,224,.14)}
.submission-group{border-left-color:var(--orange)}
.submission small,.submission span{color:var(--muted)}
.submission-section{border-color:rgba(89,245,224,.14)}
.submission-section h4{color:var(--violet-2);font-family:var(--arcade-font);font-size:12px;letter-spacing:.06em}
.portfolio-select{border-color:rgba(89,245,224,.2);color:var(--ink)}
.module-dialog{border-color:rgba(89,245,224,.24);box-shadow:0 0 50px rgba(89,245,224,.1)}
.module-navigation{border-color:rgba(89,245,224,.15)}
footer{background:#060912;color:var(--muted);border-color:rgba(89,245,224,.14)}
:focus-visible{outline-color:var(--violet-2)}
@media(max-width:600px){body::before{background-size:34px 34px}.auth-card{padding:30px 24px}.auth-card h1{font-size:clamp(44px,13vw,70px)}}
*/
@media(max-width:600px){.feedback-heading div>strong{font-size:13px}.feedback-checklist li{padding:9px}.feedback-checklist li small{font-size:11px}}

.question.has-error input,.question.has-error textarea,.question.has-error select{border-color:#c0392b;background:#fffafa}.question.has-error input:focus,.question.has-error textarea:focus,.question.has-error select:focus{border-color:#b42318;box-shadow:0 0 0 4px rgba(180,35,24,.12)}.question .field-feedback{color:#b42318;font-size:12px;line-height:1.5}.feedback-checklist li.is-missing{border-color:#efb6b0;background:#fff7f6}.feedback-checklist .is-missing>span{background:#fce3e0;color:#b42318}
.ai-review-panel{margin:18px 0;padding:16px;background:#fff;border:1px solid #d9d4c8;border-radius:12px}.ai-review-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.ai-review-header>div{display:grid;gap:3px}.ai-review-header>div strong,.ai-strengths>strong,.ai-issues>strong,.ai-suggestions>strong{font-size:14px}.ai-review-header span,.ai-review-disclaimer{font-size:11px;color:#6b6c68}.ai-review-header>b{font-size:11px;white-space:nowrap;padding:7px 9px;border-radius:999px}.ai-ready{background:#e1f0e8;color:#28764d}.ai-needs-revision{background:#fce3e0;color:#b42318}.ai-review-summary{margin:12px 0;color:#292b2c}.ai-strengths,.ai-issues,.ai-suggestions{margin-top:12px}.ai-strengths ul,.ai-issues ul,.ai-suggestions ul{margin:7px 0 0;padding:0;list-style:none;display:grid;gap:8px}.ai-strengths li{padding-left:16px;position:relative;font-size:13px}.ai-strengths li::before{content:"✓";position:absolute;left:0;color:#28764d;font-weight:800}.ai-issue{display:grid;gap:5px;padding:11px;background:#fff7f6;border:1px solid #efb6b0;border-radius:8px;font-size:13px}.ai-issue strong{color:#9e2b22}.ai-issue em{font-size:12px;color:#7b332e;font-style:normal}.ai-suggestions .ai-issue{background:#f7f8fa;border-color:#e1e3e7}.ai-suggestions .ai-issue strong{color:#4b5563}.ai-suggestions .ai-issue em{color:#4b5563}.ai-review-disclaimer{margin:12px 0 0}.ai-review-status{display:grid;gap:5px}.ai-review-status span{font-size:13px;color:#595a56}.ai-review-error strong,.ai-review-error span{color:#b42318}.ai-review-error .secondary-btn{justify-self:start;margin-top:8px}

:root{
  --bg:#f3f0e8;
  --bg-strong:#e9e3d7;
  --panel:#fffdf7;
  --panel-2:#f4f0e7;
  --ink:#171a20;
  --ink-soft:#4e5661;
  --muted:#707781;
  --line:rgba(23,26,32,.13);
  --violet:#e64b3f;
  --violet-2:#ff7961;
  --orange:#ffc857;
  --amber:#75d7c0;
  --red:#dc3b36;
  --green:#25866c;
  --shadow:0 24px 60px rgba(18,24,33,.13);
}

body{
  background:
    radial-gradient(ellipse at 14% 2%,rgba(255,200,87,.15),transparent 28%),
    radial-gradient(ellipse at 88% 31%,rgba(117,215,192,.11),transparent 24%),
    var(--bg);
}
body::before{
  background-image:linear-gradient(rgba(255,255,255,.12),rgba(255,255,255,.12));
  mix-blend-mode:multiply;
  opacity:.22;
}
.auth-screen{background:radial-gradient(circle at 82% 15%,rgba(230,75,63,.19),transparent 31%),linear-gradient(135deg,#f5f1e8,#e9e3d7)}
.auth-card{border-radius:18px;border-color:rgba(23,26,32,.13);box-shadow:0 30px 90px rgba(19,23,31,.17)}
.auth-card::before{background:radial-gradient(circle,rgba(230,75,63,.2),transparent 65%)}
.auth-card h1 em,h1 em{color:var(--violet)}
.auth-card input:focus,.auth-card select:focus{border-color:rgba(230,75,63,.65);box-shadow:0 0 0 4px rgba(230,75,63,.12)}
.topbar{height:76px;background:rgba(20,24,31,.94);border-bottom:1px solid rgba(255,255,255,.1);box-shadow:0 8px 30px rgba(15,19,25,.12)}
.brand{color:#fff}
.brand-mark{background:var(--violet);border-radius:9px;box-shadow:0 8px 18px rgba(230,75,63,.28)}
.topbar nav a{color:#d6d9dc}
.topbar nav a::after{background:linear-gradient(90deg,var(--violet),var(--orange))}
.session-actions>span{color:#d1d5d8}
.ghost-btn{color:#f4f3ee;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2)}
.ghost-btn:hover{background:rgba(255,255,255,.13)}
.hero{
  position:relative;
  overflow:hidden;
  min-height:min(790px,calc(100vh - 76px));
  background:
    linear-gradient(115deg,rgba(19,23,30,.98) 0%,rgba(23,29,37,.97) 52%,rgba(34,43,48,.94) 100%);
  color:#f8f4e9;
}
.hero::before{
  content:"";
  position:absolute;
  width:min(68vw,850px);
  aspect-ratio:1;
  right:-14%;
  top:50%;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  box-shadow:0 0 0 44px rgba(255,255,255,.018),0 0 0 88px rgba(255,255,255,.014),0 0 0 132px rgba(255,255,255,.01);
  pointer-events:none;
}
.hero-copy,.hero-card{z-index:1}
.hero .eyebrow,.workspace-section .eyebrow{color:var(--orange)}
.hero h1{font-size:clamp(58px,8.6vw,120px);letter-spacing:-.075em}
.hero h1 em{color:var(--orange)}
.hero .lead{max-width:590px;color:#c3c8c9}
.hero .primary-btn{background:var(--violet);box-shadow:0 13px 30px rgba(230,75,63,.28)}
.hero .primary-btn:hover,.workspace .primary-btn:hover{background:#c93835}
.hero .secondary-btn{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);color:#fff}
.hero .secondary-btn:hover{background:rgba(255,255,255,.14)}
.hero-card{min-height:430px;border-radius:16px;border:1px solid rgba(255,255,255,.14);box-shadow:0 32px 80px rgba(0,0,0,.28)}
.mini-scene{border-radius:10px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025))}
.scene-tag{background:rgba(255,200,87,.14);border-color:rgba(255,200,87,.34);color:#ffda83}
.progress-ring{background:radial-gradient(circle at center,#1d222a 0 56%,transparent 57%),conic-gradient(var(--violet) 0 68%,rgba(255,255,255,.12) 68% 100%)}
.section-heading h2{letter-spacing:-.055em}
#journey{background:linear-gradient(180deg,#f3f0e8 0%,#eae5d9 100%)}
#journey .eyebrow,#practice .eyebrow,#teacher .eyebrow{color:#c84037}
.journey-card{border-radius:12px;background:linear-gradient(145deg,#fffdf7,#eee9dd);border-color:rgba(23,26,32,.12);box-shadow:0 8px 22px rgba(24,28,35,.035)}
.journey-card:hover{border-color:rgba(230,75,63,.45);box-shadow:0 14px 28px rgba(24,28,35,.09)}
.journey-card.active{border-color:var(--violet);box-shadow:0 0 0 2px rgba(230,75,63,.12),0 14px 30px rgba(24,28,35,.1)}
.journey-card b,.journey-card strong{color:var(--ink)}
.detail-shell,.format-detail{border-radius:16px}
.workspace-section{background:radial-gradient(ellipse at 5% 0%,rgba(230,75,63,.12),transparent 32%),linear-gradient(150deg,#1a2028,#11161d 76%);color:#f8f4e9}
.workspace-section .section-note{color:#b6bdc1}
.student-progress-track{background:rgba(255,255,255,.14)}
.stage-list{gap:9px}
.stage-item{border-radius:10px;background:#202832;border-color:rgba(255,255,255,.09);color:#c4cbd0}
.stage-item:hover,.stage-item.active{background:linear-gradient(120deg,#30333b,#292b31);border-color:rgba(255,200,87,.55);box-shadow:0 8px 22px rgba(0,0,0,.16);transform:translateX(3px)}
.stage-item b{color:#8e9aa3}
.stage-item.active b{color:var(--orange)}
.stage-item.completed{border-color:rgba(117,215,192,.48)}
.stage-item.completed small{color:var(--amber)}
.stage-item small{color:#9ba5ab}
.editor{border-radius:16px;padding:clamp(22px,3vw,38px);box-shadow:0 24px 60px rgba(0,0,0,.18)}
.stage-number{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#fff0dd;color:#c84037;font-size:14px}
.editor-head h3{font-size:clamp(25px,3vw,34px)}
.question{margin-bottom:28px}
.question label{font-size:15px}
.question input,.question textarea,.question select{border-radius:9px;border-color:#d9d5cb;background:#fffefa}
.question input:focus,.question textarea:focus,.question select:focus{border-color:rgba(230,75,63,.65);box-shadow:0 0 0 4px rgba(230,75,63,.1)}
.feedback{border-radius:0 10px 10px 0;background:#f7f3e9;border-left-color:var(--orange)}
.editor-actions .primary-btn,.workspace .primary-btn{background:var(--violet);box-shadow:0 12px 24px rgba(230,75,63,.18)}
.editor-actions .secondary-btn{background:#f7f4ec}
.practice-section{background:linear-gradient(180deg,#e9e3d7,#f3f0e8)}
.practice-summary,.practice-list,.panel{border-radius:14px;border-color:rgba(23,26,32,.11);box-shadow:0 12px 30px rgba(24,28,35,.06)}
.practice-meta div{background:#f5efe1;border-color:rgba(230,75,63,.1)}
.practice-chip{background:#ffefdc;color:#b33b32}
.practice-card{border-radius:11px}
.challenge-section{background:#20262e}
.challenge-section .eyebrow{color:#37332a}
.challenge-box{border-radius:16px;background:linear-gradient(125deg,#ffc857,#f3a943 62%,#e88142);box-shadow:0 24px 50px rgba(0,0,0,.22)}
.challenge-btn{border-radius:9px;background:#20262e}
.challenge-result{border-radius:10px;background:rgba(255,255,255,.55)}
#teacher{background:linear-gradient(180deg,#f3f0e8,#e8e2d6)}
.stat,.panel{background:linear-gradient(150deg,#fffdf7,#f5f0e6)}
.stat strong{color:#bf4036}
.bar i{background:linear-gradient(90deg,#e64b3f,#ffc857)}
footer{background:#141a21;color:#b9c0c2;border-color:rgba(255,255,255,.1)}
.primary-btn:focus-visible,.secondary-btn:focus-visible,.ghost-btn:focus-visible,.stage-item:focus-visible,.topbar a:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
@media(max-width:900px){.hero{min-height:auto}.hero::before{right:-34%;opacity:.7}.workspace-section .section-heading{align-items:start}.practice-panel{grid-template-columns:minmax(0,1fr)}.practice-summary,.practice-list,.practice-card{min-width:0}}
@media(max-width:600px){.topbar{height:64px}.brand{font-size:13px}.hero{min-height:auto}.hero-card{min-height:370px}.hero h1{font-size:clamp(55px,16vw,84px)}.hero::before{right:-75%;width:130vw}.stage-list{gap:7px}.stage-item{padding:11px 9px}.stage-item small{margin-left:0}.editor{padding:20px}.editor-actions .primary-btn,.editor-actions .secondary-btn{padding:12px 13px}.ai-review-header{align-items:flex-start;flex-direction:column}.challenge-box h2{font-size:clamp(38px,12vw,54px)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.journey-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.journey-card{min-height:180px;align-items:flex-start;justify-content:space-between;padding:22px}
.journey-card .card-status{display:flex;align-items:center;gap:8px}
.journey-card .card-status span{font-size:16px;transition:transform .2s ease}
.journey-card:hover .card-status span{transform:translateX(4px)}
.journey-card:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.module-open{overflow:hidden}
.module-modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:24px}
.module-modal.hidden{display:none}
.module-backdrop{position:absolute;inset:0;background:rgba(12,16,21,.78);backdrop-filter:blur(7px)}
.module-dialog{position:relative;z-index:1;display:flex;flex-direction:column;width:min(920px,100%);max-height:min(92vh,940px);overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:18px;background:#0b0e16;color:#f4f5fa;box-shadow:0 34px 100px rgba(0,0,0,.4);animation:module-enter .22s ease-out}
@keyframes module-enter{from{opacity:0;transform:translateY(12px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
.module-close{position:absolute;top:19px;right:22px;z-index:2;display:grid;place-items:center;width:40px;height:40px;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:27px;line-height:1;cursor:pointer}
.module-close:hover{background:rgba(255,255,255,.2)}
.module-modal-content{overflow-y:auto;overscroll-behavior:contain}
.module-lesson-header{position:relative;overflow:hidden;padding:30px 38px 32px;background:radial-gradient(circle at 92% 12%,rgba(139,92,246,.2),transparent 25%),linear-gradient(135deg,#131827,#0b0e16 78%);color:#f4f5fa}
.module-lesson-header::after{position:absolute;right:8%;bottom:-72px;width:190px;height:190px;border:1px solid rgba(139,92,246,.2);border-radius:50%;box-shadow:0 0 0 18px rgba(139,92,246,.035),0 0 0 38px rgba(139,92,246,.025);content:""}
.module-lesson-topline{display:flex;justify-content:space-between;padding-right:54px;color:#a5adc1;font-size:10px;font-weight:800;letter-spacing:.16em}
.module-lesson-topline span:first-child{color:#ff9078}
.module-lesson-eyebrow{margin:34px 0 12px;color:#a78bfa;font-size:10px;font-weight:800;letter-spacing:.2em}
.module-lesson-header h2{position:relative;z-index:1;font-size:clamp(38px,6vw,64px);letter-spacing:-.06em;line-height:.98}
.module-lesson-purpose{position:relative;z-index:1;max-width:700px;margin:17px 0 20px;color:#a5adc1;font-size:15px;line-height:1.75}
.module-lesson-meta{display:flex;flex-wrap:wrap;gap:9px}
.module-lesson-meta span{padding:7px 10px;border:1px solid rgba(255,255,255,.11);border-radius:999px;color:#d9dced;font-size:10px}
.module-lesson-body{padding:30px 38px 34px;background:#0b0e16}
.module-block{margin:0 0 27px}
.module-section-heading{display:flex;align-items:center;gap:11px;margin:0 0 15px}
.module-section-heading>span{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(139,92,246,.13);color:#a78bfa;font:700 11px var(--display)}
.module-section-heading h3{color:#f4f5fa;font-size:19px;letter-spacing:-.03em}
.module-elements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.module-element{display:flex;gap:13px;padding:17px;border:1px solid rgba(255,255,255,.11);border-radius:11px;background:#131827}
.module-element>span{flex:none;color:#ff9078;font:700 12px var(--display)}
.module-element h4{margin:0 0 6px;color:#f4f5fa;font:700 14px var(--display)}
.module-element p,.module-notes li,.module-flow li{margin:0;color:#a5adc1;font-size:13px;line-height:1.7}
.module-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.module-columns .module-block{margin:0}
.module-flow,.module-notes ul{display:grid;gap:12px;margin:0;padding-left:22px}
.module-notes{padding:18px;border:1px solid rgba(139,92,246,.22);border-radius:12px;background:#131827}
.module-navigation{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-top:1px solid rgba(255,255,255,.11);background:#0b0e16}
.module-navigation button{min-height:44px;padding:10px 15px;font-size:12px}
.module-navigation button:disabled{cursor:not-allowed;opacity:.42;transform:none}
.module-navigation .secondary-btn{border-color:rgba(255,255,255,.11);background:#131827;color:#f4f5fa}
.module-navigation .secondary-btn:hover{background:#1b2233}
.module-navigation .module-return{margin-left:auto;background:transparent}
.module-navigation .primary-btn{background:#7957d5}
.module-navigation .primary-btn:hover{background:#6845c5}
.module-close:focus-visible,.module-navigation button:focus-visible{outline:3px solid #a78bfa;outline-offset:3px}
@media(max-width:900px){.journey-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.journey-grid{grid-template-columns:1fr}.journey-card{min-height:145px}.module-modal{padding:0}.module-dialog{width:100%;height:100%;max-height:100%;border:0;border-radius:0}.module-lesson-header{padding:24px 22px 25px}.module-close{top:14px;right:15px;width:36px;height:36px}.module-lesson-topline{padding-right:43px;font-size:9px}.module-lesson-eyebrow{margin-top:27px}.module-lesson-header h2{font-size:clamp(39px,12vw,55px)}.module-lesson-purpose{font-size:14px}.module-lesson-body{padding:24px 20px 26px}.module-elements,.module-columns{grid-template-columns:1fr}.module-columns{gap:22px}.module-navigation{gap:6px;padding:10px 8px calc(10px + env(safe-area-inset-bottom))}.module-navigation button{flex:1;min-width:0;padding:10px 5px;font-size:11px}.module-navigation .module-return{margin-left:0}}

:root{
  --bg:#080b15;
  --bg-strong:#0d1322;
  --panel:#101829;
  --panel-2:#131f31;
  --ink:#ecfbff;
  --ink-soft:#bfd2dc;
  --muted:#8da4b2;
  --line:rgba(89,245,224,.16);
  --violet:#58f2df;
  --violet-2:#96fff1;
  --orange:#ff5bd6;
  --amber:#ffd166;
  --red:#ff7188;
  --green:#65f2a5;
  --shadow:0 22px 60px rgba(0,0,0,.42);
  --arcade-font:"Orbitron",var(--display);
}
body{
  background:
    radial-gradient(ellipse at 12% 0%,rgba(67,226,221,.12),transparent 34%),
    radial-gradient(ellipse at 92% 26%,rgba(255,75,205,.08),transparent 30%),
    #080b15;
}
body::before{
  background-image:
    linear-gradient(rgba(89,245,224,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(89,245,224,.035) 1px,transparent 1px);
  background-size:44px 44px;
  mix-blend-mode:normal;
  opacity:.65;
}
.noise{opacity:.025}
.auth-screen{
  background:
    radial-gradient(circle at 50% 15%,rgba(67,226,221,.12),transparent 32%),
    linear-gradient(145deg,#080b15,#0c1424 65%,#110d20);
}
.auth-card,.panel,.stat,.editor,.practice-summary,.practice-list,.practice-card,.hero-card,.challenge-box{
  border-color:rgba(89,245,224,.17);
  box-shadow:0 18px 45px rgba(0,0,0,.28),0 0 24px rgba(89,245,224,.035);
}
.auth-card{
  border-radius:18px;
  background:linear-gradient(145deg,rgba(16,24,41,.97),rgba(11,17,31,.97));
}
.auth-card::before{background:radial-gradient(circle,rgba(89,245,224,.19),transparent 68%)}
.auth-card .eyebrow,.eyebrow,.brand,.brand-mark,.screen-top,.scene-tag,.stage-number,.summary-badge,.practice-chip{
  font-family:var(--arcade-font);
}
.auth-card .eyebrow,.eyebrow{color:var(--violet-2);letter-spacing:.14em}
.auth-card h1{letter-spacing:-.06em}
.auth-card h1 em,.hero h1 em{color:var(--violet)}
.auth-card input,.auth-card select,.auth-card textarea,.question input,.question textarea,.question select,.portfolio-select{
  background:#090f1d;
  border-color:rgba(89,245,224,.18);
}
.auth-card input:focus,.auth-card select:focus,.auth-card textarea:focus,
.question input:focus,.question textarea:focus,.question select:focus{
  border-color:var(--violet);
  box-shadow:0 0 0 3px rgba(89,245,224,.14),0 0 20px rgba(89,245,224,.08);
}
.auth-submit,.primary-btn,.challenge-btn,.practice-card button{
  background:linear-gradient(110deg,#087f83,#18b6a9 55%,#6652cf);
  box-shadow:0 8px 24px rgba(24,182,169,.2);
}
.auth-submit:hover,.primary-btn:hover,.challenge-btn:hover,.practice-card button:hover{
  background:linear-gradient(110deg,#10a9a2,#7863e8);
  box-shadow:0 10px 30px rgba(89,245,224,.24);
}
.secondary-btn,.ghost-btn{
  background:rgba(15,25,42,.86);
  border-color:rgba(89,245,224,.2);
  color:var(--ink);
}
.secondary-btn:hover,.ghost-btn:hover{background:#17263b;border-color:rgba(89,245,224,.48)}
.topbar{
  background:rgba(7,11,21,.92);
  border-color:rgba(89,245,224,.18);
  box-shadow:0 8px 28px rgba(0,0,0,.22);
}
.brand{letter-spacing:.09em}
.brand-mark{
  border-radius:8px;
  color:#071117;
  background:linear-gradient(135deg,#69f7e5,#52c8f2);
  box-shadow:0 0 20px rgba(89,245,224,.3);
}
.topbar nav a:hover,.topbar nav a:focus-visible{color:var(--violet-2)}
.topbar nav a::after{background:linear-gradient(90deg,var(--violet),var(--orange))}
.hero,.workspace-section,#journey,#practice,.challenge-section,#teacher{
  background-color:transparent;
}
.hero{
  background:
    radial-gradient(ellipse at 78% 22%,rgba(89,245,224,.09),transparent 28%),
    radial-gradient(ellipse at 8% 90%,rgba(255,91,214,.06),transparent 25%);
}
.hero .eyebrow,.workspace-section .eyebrow,#journey .eyebrow,#practice .eyebrow,#teacher .eyebrow{
  color:var(--violet-2);
}
.hero .lead,.section-note,.panel p{color:var(--ink-soft)}
.hero-card{
  background:linear-gradient(145deg,#101a2b,#090e1a);
  border-radius:18px;
}
.hero-card::before{background:radial-gradient(circle,rgba(255,91,214,.24),transparent 68%)}
.screen-top{color:#b2c8d4}
.screen-top span:nth-child(1){background:#ff5bd6;box-shadow:0 0 10px rgba(255,91,214,.65)}
.screen-top span:nth-child(2){background:#ffd166;box-shadow:0 0 10px rgba(255,209,102,.5)}
.screen-top span:nth-child(3){background:#65f2a5;box-shadow:0 0 10px rgba(101,242,165,.5)}
.mini-scene,.challenge-result{
  background:rgba(5,11,22,.62);
  border-color:rgba(89,245,224,.18);
}
.scene-tag{
  background:rgba(89,245,224,.11);
  border-color:rgba(89,245,224,.28);
  color:#9bfff3;
}
.progress-ring{
  background:radial-gradient(circle at center,#111a2c 0 56%,transparent 57%),conic-gradient(var(--violet) 0 68%,rgba(255,255,255,.1) 68% 100%);
  filter:drop-shadow(0 0 12px rgba(89,245,224,.18));
}
#journey,.practice-section,#teacher{
  background:linear-gradient(180deg,rgba(13,19,34,.72),rgba(8,11,21,.68));
}
.journey-card,.journey-card.done,.practice-summary,.practice-list,.practice-card,.practice-card.done,.stat,.panel,.editor{
  background:linear-gradient(145deg,#111b2d,#0d1525);
  border-color:rgba(89,245,224,.14);
}
.journey-card:hover,.journey-card:focus-visible,.stage-item:hover,.stage-item.active{
  border-color:rgba(89,245,224,.52);
  box-shadow:0 0 22px rgba(89,245,224,.1);
}
.journey-card .card-status,.stat strong,.submission>b{color:var(--violet-2)}
.journey-card p,.card-num,.card-status,.stage-item small,.stage-item b{color:var(--muted)}
.stage-item,.stage-item:hover,.stage-item.active{
  border-color:rgba(89,245,224,.14);
  border-radius:10px;
}
.stage-item.completed{border-color:rgba(101,242,165,.42)}
.stage-item.completed small,.save-status,.ai-ready{color:var(--green)}
.stage-item.active b,.stage-number{color:var(--violet-2)}
.stage-number,.practice-chip,.summary-badge{
  background:rgba(89,245,224,.1);
}
.student-progress-track,.practice-bar,.bar{background:rgba(255,255,255,.09)}
.student-progress-track i,.practice-bar i,.bar i{
  background:linear-gradient(90deg,#58f2df,#5678ed 60%,#ff5bd6);
  box-shadow:0 0 10px rgba(89,245,224,.25);
}
.editor{border-radius:16px}
.editor-head,.feedback-source{border-color:rgba(89,245,224,.14)}
.editor-head h3,.question label,.panel h3,.rubric label,.practice-summary-header h3,.practice-card h4{color:var(--ink)}
.editor-head p,.question small,.practice-card p,.practice-card ul,.practice-meta span,.task-empty{color:var(--muted)}
.feedback,.ai-review-panel,.ai-review-status,.ai-strengths,.ai-issues,.ai-suggestions,
.practice-meta div,.editor-actions .secondary-btn{
  background:#0a1120;
  border-color:rgba(89,245,224,.14);
}
.feedback{border-left-color:var(--violet)}
.feedback strong,.feedback-heading b,.feedback-heading span{color:var(--ink)}
.feedback p,.feedback li,.feedback small,.feedback span,.feedback-note,.feedback-source,
.ai-review-summary,.ai-issue span,.ai-issue em,.ai-review-disclaimer{color:var(--ink-soft)}
.field-feedback,.ai-needs-revision{color:#ff91a5}
.practice-card.done{border-color:rgba(101,242,165,.35)}
.challenge-section{background:radial-gradient(ellipse at 75% 50%,rgba(255,91,214,.045),transparent 35%)}
.challenge-box{
  background:
    radial-gradient(circle at 88% 16%,rgba(255,91,214,.1),transparent 30%),
    linear-gradient(145deg,#111b2d,#0a1020);
  border-radius:18px;
}
.challenge-box .eyebrow{color:var(--violet-2)}
.challenge-box h2{color:var(--ink)}
.challenge-box p,.stat span{color:var(--ink-soft)}
.submission{background:#0a1120;border-color:rgba(89,245,224,.14)}
.submission-group{border-left-color:var(--orange)}
.submission small,.submission span{color:var(--muted)}
.submission-section{border-color:rgba(89,245,224,.14)}
.submission-section h4{color:var(--violet-2);font-family:var(--arcade-font);font-size:12px;letter-spacing:.06em}
.portfolio-select{border-color:rgba(89,245,224,.2);color:var(--ink)}
.module-dialog{border-color:rgba(89,245,224,.24);box-shadow:0 0 50px rgba(89,245,224,.1)}
.module-navigation{border-color:rgba(89,245,224,.15)}
footer{background:#060912;border-color:rgba(89,245,224,.14)}
:focus-visible{outline-color:var(--violet-2)}
#groupMembersField label{display:block}
.auth-card textarea{
  display:block;
  width:100%;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#090f1d;
  color:var(--ink);
  font:inherit;
  resize:vertical;
}
.auth-card textarea::placeholder{color:#778198}
.auth-card small{display:block;color:var(--muted);font-size:11px;line-height:1.5}
@media(max-width:600px){
  body::before{background-size:34px 34px}
  .auth-card{padding:30px 24px}
  .auth-card h1{font-size:clamp(44px,13vw,70px)}
}

/* Previous dark palette, superseded by the arcade theme.
:root{--bg:#0b0e16;--bg-strong:#131827;--panel:#131827;--panel-2:#171d2c;--ink:#f4f5fa;--ink-soft:#c2c8d8;--muted:#a5adc1;--line:rgba(255,255,255,.11);--violet:#8b5cf6;--violet-2:#a78bfa;--orange:#ff9078;--amber:#ffbf69;--red:#ff7869;--green:#55c48b;--shadow:0 24px 60px rgba(0,0,0,.3)}
body{background:radial-gradient(circle at 8% 5%,rgba(139,92,246,.09),transparent 25%),radial-gradient(circle at 95% 45%,rgba(255,144,120,.045),transparent 24%),#0b0e16;color:#f4f5fa}
body::before{background-image:linear-gradient(rgba(255,255,255,.018),rgba(255,255,255,.018));mix-blend-mode:normal;opacity:.5}
.auth-screen{background:radial-gradient(circle at 85% 15%,rgba(139,92,246,.17),transparent 32%),linear-gradient(135deg,#0b0e16,#131827)}
.auth-card{background:rgba(19,24,39,.94);border-color:rgba(255,255,255,.11);color:#f4f5fa;box-shadow:0 30px 90px rgba(0,0,0,.4)}
.auth-card::before{background:radial-gradient(circle,rgba(139,92,246,.28),transparent 65%)}
.auth-lead,.login-hint{color:#a5adc1}
.auth-card label{color:#e5e8f0}
.auth-card input,.auth-card select,.portfolio-select{border-color:rgba(255,255,255,.14);background:#0b0e16;color:#f4f5fa}
.auth-card input::placeholder{color:#778198}
.auth-card input:focus,.auth-card select:focus{border-color:#a78bfa;box-shadow:0 0 0 4px rgba(139,92,246,.18)}
.topbar{background:rgba(11,14,22,.94);border-color:rgba(255,255,255,.1)}
.brand{color:#f4f5fa}
.brand-mark{background:linear-gradient(135deg,#8b5cf6,#6845c5);box-shadow:0 10px 24px rgba(139,92,246,.25)}
.topbar nav a{color:#c2c8d8}
.ghost-btn{color:#f4f5fa;background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.14)}
.ghost-btn:hover{background:rgba(255,255,255,.1)}
.hero{background:radial-gradient(circle at 82% 22%,rgba(139,92,246,.13),transparent 29%),linear-gradient(120deg,#0b0e16,#131827 72%,#111523);color:#f4f5fa}
.hero .eyebrow,.workspace-section .eyebrow{color:#a78bfa}
.hero h1 em{color:#a78bfa}
.hero .lead{color:#a5adc1}
.hero .primary-btn,.workspace .primary-btn,.editor-actions .primary-btn{background:linear-gradient(135deg,#7957d5,#6845c5);box-shadow:0 12px 30px rgba(139,92,246,.22)}
.hero .primary-btn:hover,.workspace .primary-btn:hover{background:#6845c5}
.hero-card{background:linear-gradient(155deg,#171d2c,#0b0e16);border-color:rgba(255,255,255,.11)}
.hero-card::before{background:radial-gradient(circle,rgba(139,92,246,.32),transparent 65%)}
.scene-tag{background:rgba(139,92,246,.16);border-color:rgba(167,139,250,.3);color:#d6caff}
.progress-ring{background:radial-gradient(circle at center,#151b2a 0 56%,transparent 57%),conic-gradient(#8b5cf6 0 68%,rgba(255,255,255,.12) 68% 100%)}
.section-note{color:#a5adc1}
#journey{background:linear-gradient(180deg,#101522,#0b0e16)}
#journey .eyebrow,#practice .eyebrow,#teacher .eyebrow{color:#ff9078}
#journey .section-heading h2,#practice .section-heading h2,#teacher .section-heading h2{color:#f4f5fa}
.journey-card,.journey-card.done{background:#131827;border-color:rgba(255,255,255,.1);box-shadow:0 12px 26px rgba(0,0,0,.16)}
.journey-card:hover{border-color:rgba(167,139,250,.5);box-shadow:0 16px 30px rgba(0,0,0,.24)}
.journey-card h3{color:#f4f5fa}
.journey-card p,.card-num,.card-status{color:#a5adc1}
.journey-card .card-status{color:#a78bfa}
.journey-card:focus-visible{outline-color:#a78bfa}
.workspace-section{background:radial-gradient(ellipse at 5% 0%,rgba(139,92,246,.11),transparent 32%),linear-gradient(150deg,#101522,#0b0e16 76%);color:#f4f5fa}
.workspace-section .section-note{color:#a5adc1}
.stage-item,.stage-item:hover,.stage-item.active{background:#131827;border-color:rgba(255,255,255,.1);color:#c2c8d8}
.stage-item:hover,.stage-item.active{background:#1b2233;border-color:rgba(167,139,250,.5);box-shadow:0 8px 22px rgba(0,0,0,.2)}
.stage-item.active b{color:#a78bfa}
.stage-item.completed{border-color:rgba(85,196,139,.4)}
.stage-item.completed small{color:#6dd7a2}
.stage-item small,.stage-item b{color:#8b95aa}
.student-progress,.student-progress strong{color:#f4f5fa}
.student-progress span{color:#a5adc1}
.student-progress-track{background:rgba(255,255,255,.1)}
.student-progress-track i{background:linear-gradient(90deg,#8b5cf6,#ff9078)}
.editor{background:#131827;border-color:rgba(255,255,255,.1);color:#f4f5fa;box-shadow:0 24px 60px rgba(0,0,0,.28)}
.editor-head{border-color:rgba(255,255,255,.1)}
.editor-head h3,.question label{color:#f4f5fa}
.editor-head p,.question small{color:#a5adc1}
.stage-number{background:rgba(139,92,246,.14);color:#c4b5fd}
.save-status{color:#6dd7a2}
.question input,.question textarea,.question select{border-color:rgba(255,255,255,.14);background:#0b0e16;color:#f4f5fa;caret-color:#a78bfa}
.question input::placeholder,.question textarea::placeholder{color:#778198}
.question input:focus,.question textarea:focus,.question select:focus{border-color:#a78bfa;box-shadow:0 0 0 4px rgba(139,92,246,.17)}
.field-feedback{color:#ffad9d}
.feedback{background:#171d2c;border-color:#8b5cf6;color:#e5e8f0}
.feedback p,.feedback li,.feedback small,.feedback span,.feedback-note,.feedback-source{color:#aeb7ca}
.feedback strong,.feedback-heading b,.feedback-heading span{color:#f4f5fa}
.feedback-checklist li{border-color:rgba(255,255,255,.1)}
.feedback-checklist .is-passed>span{background:rgba(85,196,139,.14);color:#6dd7a2}
.feedback-checklist .is-missing>span{background:rgba(255,120,105,.14);color:#ff9078}
.feedback-source{border-color:rgba(255,255,255,.12)}
.ai-review-panel{background:#0f1421;border-color:rgba(255,255,255,.1);color:#e5e8f0}
.ai-review-status,.ai-strengths,.ai-issues,.ai-suggestions{background:#171d2c;border-color:rgba(255,255,255,.1);color:#d5d9e5}
.ai-review-summary,.ai-issue span,.ai-issue em,.ai-review-disclaimer{color:#a5adc1}
.ai-ready{color:#6dd7a2}
.ai-needs-revision{color:#ff9078}
.editor-actions .secondary-btn{background:#171d2c;border-color:rgba(255,255,255,.12);color:#e5e8f0}
.editor-actions .secondary-btn:hover{background:#20283a}
.practice-section{background:linear-gradient(180deg,#101522,#0b0e16)}
.practice-summary,.practice-list,.practice-card,.practice-card.done{background:#131827;border-color:rgba(255,255,255,.1);color:#f4f5fa;box-shadow:0 16px 34px rgba(0,0,0,.2)}
.practice-summary-header h3,.practice-card h4{color:#f4f5fa}
.practice-card p,.practice-card ul,.practice-meta span,.task-empty{color:#a5adc1}
.practice-meta div{background:#0f1421;border-color:rgba(255,255,255,.09)}
.practice-meta strong{color:#f4f5fa}
.practice-bar{background:#242b3c}
.practice-chip{background:rgba(139,92,246,.15);color:#c4b5fd}
.practice-card button{background:linear-gradient(135deg,#7957d5,#6845c5)}
.practice-card.done{border-color:rgba(85,196,139,.35)}
.practice-card.done button{background:linear-gradient(135deg,#25895d,#3cab78)}
.challenge-section{background:#0b0e16}
.challenge-section .eyebrow{color:#ff9078}
.challenge-box{background:radial-gradient(circle at 88% 16%,rgba(255,144,120,.12),transparent 30%),linear-gradient(135deg,#171d2c,#111523);border:1px solid rgba(255,255,255,.1);box-shadow:0 24px 55px rgba(0,0,0,.26)}
.challenge-box .eyebrow{color:#a78bfa}
.challenge-box h2{color:#f4f5fa}
.challenge-box p{color:#a5adc1}
.challenge-btn{background:linear-gradient(135deg,#7957d5,#6845c5);color:#fff}
.challenge-result{background:#0f1421;border-color:rgba(255,255,255,.1);color:#d5d9e5}
.challenge-advice{border-color:rgba(255,255,255,.12)}
#teacher{background:linear-gradient(180deg,#101522,#0b0e16);color:#f4f5fa}
.stat,.panel{background:#131827;border-color:rgba(255,255,255,.1);color:#f4f5fa;box-shadow:0 16px 34px rgba(0,0,0,.2)}
.stat strong{color:#a78bfa}
.stat span,.panel p{color:#a5adc1}
.panel h3,.rubric label{color:#f4f5fa}
.bar{background:#242b3c}
.bar i{background:linear-gradient(90deg,#8b5cf6,#ff9078)}
.submission{background:#0f1421;border-color:rgba(255,255,255,.1)}
.submission small,.submission span{color:#a5adc1}
.submission>b{color:#a78bfa}
.submission-group{border-left:3px solid #8b5cf6}
.dashboard-status{font-size:12px}
.auth-card textarea{width:100%;padding:13px 14px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#0b0e16;color:#f4f5fa;font:inherit;resize:vertical}
.auth-card textarea::placeholder{color:#778198}
.auth-card textarea:focus{outline:none;border-color:#a78bfa;box-shadow:0 0 0 4px rgba(139,92,246,.18)}
.auth-card small{color:#a5adc1;font-size:11px;line-height:1.5}
.portfolio-select{color-scheme:dark}
#copyMessage{color:#6dd7a2}
footer{background:#080b12;color:#8f99ae;border-color:rgba(255,255,255,.1)}
.primary-btn:focus-visible,.secondary-btn:focus-visible,.ghost-btn:focus-visible,.stage-item:focus-visible,.topbar a:focus-visible{outline-color:#a78bfa}
*/

:root{
  --bg:#fff7e8;
  --bg-strong:#ffe9bd;
  --panel:#fffdf7;
  --panel-2:#fff1d4;
  --ink:#17152b;
  --ink-soft:#35334b;
  --muted:#5d5a6e;
  --line:rgba(23,21,43,.24);
  --violet:#3155d9;
  --violet-2:#5878ff;
  --orange:#f0544f;
  --amber:#ffd447;
  --red:#cf314b;
  --green:#188a69;
  --shadow:5px 6px 0 rgba(23,21,43,.2);
  --comic-font:"Bangers",Impact,sans-serif;
  --font:"Nunito Sans","DM Sans",sans-serif;
  --display:"Nunito Sans","Space Grotesk",sans-serif;
}
body{
  color:var(--ink);
  background-color:#fff7e8;
  background-image:radial-gradient(rgba(49,85,217,.13) 1.1px,transparent 1.1px);
  background-size:13px 13px;
  font-family:var(--font);
}
body::before{
  background:linear-gradient(135deg,rgba(255,255,255,.34),transparent 45%);
  mix-blend-mode:normal;
  opacity:.55;
}
.noise{opacity:.025}
h1,h2,h3,.eyebrow,.brand,.brand-mark,.screen-top,.scene-tag,.stage-number,
.summary-badge,.practice-chip,.submission-section h4{
  font-family:var(--comic-font);
  font-weight:400;
  letter-spacing:.045em;
}
h1,h2,h3{letter-spacing:.015em}
.eyebrow{font-size:15px;color:#3155d9;letter-spacing:.12em}
.section{position:relative}
.section-heading h2{font-size:clamp(38px,5.4vw,68px);line-height:.98}
.section-note,.hero .lead{color:var(--ink-soft);font-weight:700}

.auth-screen{
  background-color:#f0544f;
  background-image:radial-gradient(rgba(23,21,43,.2) 1.4px,transparent 1.4px);
  background-size:12px 12px;
}
.auth-card{
  border:3px solid var(--ink);
  border-radius:16px;
  background:#fffdf7;
  color:var(--ink);
  box-shadow:9px 10px 0 var(--ink);
  overflow:visible;
}
.auth-card::before{
  inset:-18px -18px auto auto;
  width:92px;height:92px;border-radius:50%;
  background:var(--amber);
  border:3px solid var(--ink);
  z-index:-1;
}
.auth-card .eyebrow{color:#3155d9}
.auth-card h1{font-family:var(--comic-font);font-size:clamp(58px,8vw,90px);line-height:.84;letter-spacing:.01em}
.auth-card h1 em{color:#f0544f}
.auth-lead,.login-hint{color:#4d4a60}
.auth-card label{color:var(--ink);font-weight:900}
.auth-card input,.auth-card select,.auth-card textarea{
  color:var(--ink);background:#fff;
  border:2px solid var(--ink);border-radius:8px;
}
.auth-card input::placeholder,.auth-card textarea::placeholder{color:#858295}
.auth-card input:focus,.auth-card select:focus,.auth-card textarea:focus{
  border-color:#3155d9;box-shadow:3px 3px 0 #3155d9;
}
.auth-card small{color:#4d4a60}
.login-error{color:#b42335}
.primary-btn,.auth-submit,.challenge-btn,.practice-card button,
.hero .primary-btn,.workspace .primary-btn,.editor-actions .primary-btn{
  color:#fff;
  background:#3155d9;
  border:2px solid var(--ink);
  border-radius:8px;
  box-shadow:4px 4px 0 var(--ink);
  font-weight:900;
}
.primary-btn:hover,.auth-submit:hover,.challenge-btn:hover,.practice-card button:hover{
  background:#f0544f;
  transform:translate(2px,2px);
  box-shadow:2px 2px 0 var(--ink);
}
.secondary-btn,.ghost-btn,.editor-actions .secondary-btn{
  color:var(--ink);
  background:#fffdf7;
  border:2px solid var(--ink);
  border-radius:8px;
  box-shadow:3px 3px 0 var(--ink);
  font-weight:900;
}
.secondary-btn:hover,.ghost-btn:hover{
  color:var(--ink);background:#ffd447;border-color:var(--ink);
}
.danger-btn{border:2px solid var(--ink);border-radius:8px;box-shadow:3px 3px 0 var(--ink)}

.topbar{
  min-height:74px;height:auto;
  background:#fffdf7;
  border-bottom:3px solid var(--ink);
  box-shadow:0 4px 0 rgba(23,21,43,.12);
}
.brand{font-size:22px;color:var(--ink)}
.brand-mark{
  width:40px;height:40px;color:var(--ink);
  border:2px solid var(--ink);border-radius:50%;
  background:#ffd447;box-shadow:2px 2px 0 var(--ink);
  font-size:15px;transform:rotate(-8deg);
}
.topbar nav a{color:var(--ink);font-weight:900}
.topbar nav a::after{height:4px;background:#f0544f}
.ghost-btn{padding:9px 13px}
.session-actions>span{color:#35334b}

.hero{
  min-height:calc(100vh - 74px);
  background-color:#3155d9;
  background-image:radial-gradient(rgba(255,255,255,.19) 1.3px,transparent 1.3px);
  background-size:14px 14px;
  color:#fff;
}
.hero::after{
  content:"";
  position:absolute;inset:22px 3vw 22px auto;width:42%;
  border:3px solid rgba(255,255,255,.24);
  transform:skew(-7deg);pointer-events:none;
}
.hero .hero-copy,.hero .hero-card{z-index:1}
.hero .eyebrow{color:#ffe270}
.hero h1{
  font-family:var(--comic-font);
  font-size:clamp(72px,10vw,142px);
  line-height:.78;letter-spacing:.01em;
  text-shadow:4px 5px 0 var(--ink);
}
.hero h1 em{color:#ffe270}
.hero .lead{color:#fff;font-size:19px;text-shadow:1px 1px 0 rgba(23,21,43,.35)}
.hero .secondary-btn{background:#ffe270}
.hero-card{
  min-height:430px;padding:22px;
  color:var(--ink);background:#ffe270;
  border:4px solid var(--ink);border-radius:12px;
  box-shadow:9px 10px 0 var(--ink);
  transform:rotate(1.5deg);
}
.hero-card::before{
  width:110px;height:110px;inset:auto -22px -24px auto;
  border-radius:50%;background:#f0544f;border:3px solid var(--ink);
}
.screen-top{
  color:var(--ink);font-size:13px;font-weight:400;letter-spacing:.08em;
}
.screen-top span{border:1px solid var(--ink)}
.mini-scene{
  min-height:245px;padding:22px;
  color:var(--ink);background:#fffdf7;
  border:3px solid var(--ink);border-radius:6px;
  box-shadow:4px 4px 0 var(--ink);
}
.scene-tag{
  color:#fff;background:#f0544f;border:2px solid var(--ink);
  font-size:13px;font-weight:400;letter-spacing:.05em;
  box-shadow:2px 2px 0 var(--ink);
}
.mini-scene p{font-size:18px;font-weight:800;line-height:1.55}
.mini-scene p{color:var(--ink)}
.mini-scene .muted{color:#5d5a6e}
.progress-ring{
  color:var(--ink);
  background:radial-gradient(circle at center,#fffdf7 0 56%,transparent 57%),conic-gradient(#f0544f 0 68%,rgba(23,21,43,.17) 68% 100%);
  filter:drop-shadow(3px 4px 0 rgba(23,21,43,.5));
}
.progress-ring small{font-family:var(--comic-font);font-size:12px;letter-spacing:.06em}

#journey,.practice-section,#teacher{
  background-color:#fff7e8;
  background-image:radial-gradient(rgba(23,21,43,.12) 1px,transparent 1px);
  background-size:12px 12px;
}
#journey .section-heading h2,#practice .section-heading h2,#teacher .section-heading h2{color:var(--ink)}
#journey .eyebrow,#practice .eyebrow,#teacher .eyebrow{color:#f0544f}
.journey-grid{gap:22px}
.journey-card,.journey-card.done{
  min-height:220px;padding:25px;
  background:#fffdf7;border:3px solid var(--ink);border-radius:10px;
  box-shadow:5px 6px 0 var(--ink);
}
.journey-card:nth-child(4n+1){background:#fff0a8}
.journey-card:nth-child(4n+2){background:#b9f0e3}
.journey-card:nth-child(4n+3){background:#ffc7bf}
.journey-card:nth-child(4n){background:#cbd7ff}
.journey-card:hover,.journey-card:focus-visible{
  border-color:var(--ink);box-shadow:2px 3px 0 var(--ink);
  transform:translate(3px,3px) rotate(-.5deg);
}
.journey-card h3{color:var(--ink);font-size:30px}
.journey-card p,.card-num,.card-status{color:#4d4a60}
.journey-card .card-status{color:#3155d9;font-weight:900}
.card-num{font-weight:900}
.workspace-section{
  color:var(--ink);
  background-color:#cbd7ff;
  background-image:radial-gradient(rgba(49,85,217,.16) 1px,transparent 1px);
  background-size:13px 13px;
}
.workspace-section .eyebrow{color:#d63d45}
.workspace-section .section-note{color:#36344a}
.workspace{grid-template-columns:minmax(220px,.32fr) minmax(0,1fr);gap:22px}
.stage-list{gap:12px}
.stage-item,.stage-item:hover,.stage-item.active{
  color:var(--ink);background:#fffdf7;border:2px solid var(--ink);
  border-radius:8px;box-shadow:3px 3px 0 var(--ink);
}
.stage-item:nth-child(3n+1){background:#fff0a8}
.stage-item:nth-child(3n+2){background:#b9f0e3}
.stage-item:nth-child(3n){background:#ffc7bf}
.stage-item:hover,.stage-item.active{
  border-color:var(--ink);transform:translate(2px,2px);
  box-shadow:1px 1px 0 var(--ink);
}
.stage-item b,.stage-item small{color:#4d4a60}
.stage-item.active b,.stage-item.completed small{color:#3155d9}
.stage-item.completed{border-color:#188a69}
.stage-number{
  color:#fff;background:#f0544f;border:2px solid var(--ink);
  border-radius:50%;font-size:15px;box-shadow:2px 2px 0 var(--ink);
}
.student-progress,.student-progress strong{color:var(--ink)}
.student-progress span{color:#4d4a60}
.student-progress-track{height:12px;background:#fff;border:2px solid var(--ink);border-radius:99px}
.student-progress-track i{background:linear-gradient(90deg,#3155d9,#f0544f,#ffd447)}
.editor{
  color:var(--ink);background:#fffdf7;
  border:3px solid var(--ink);border-radius:10px;
  box-shadow:7px 8px 0 var(--ink);
}
.editor-head{border-color:rgba(23,21,43,.22)}
.editor-head h3,.question label{color:var(--ink)}
.editor-head h3{font-size:32px}
.editor-head p,.question small{color:#5d5a6e}
.save-status{color:#188a69;font-weight:900}
.question input,.question textarea,.question select{
  color:var(--ink);background:#fff;
  border:2px solid var(--ink);border-radius:7px;
}
.question input::placeholder,.question textarea::placeholder{color:#858295}
.question input:focus,.question textarea:focus,.question select:focus{
  border-color:#3155d9;box-shadow:3px 3px 0 #3155d9;
}
.field-feedback{color:#b42335}
.feedback{
  color:var(--ink);background:#fff0a8;
  border:2px solid var(--ink);border-left:8px solid #f0544f;
  border-radius:8px;box-shadow:3px 3px 0 var(--ink);
}
.feedback p,.feedback li,.feedback small,.feedback span,.feedback-note,.feedback-source{color:#4d4a60}
.feedback strong,.feedback-heading b,.feedback-heading span{color:var(--ink)}
.feedback-checklist li{background:#fffdf7;border-color:rgba(23,21,43,.2)}
.feedback-checklist .is-passed>span{background:#b9f0e3;color:#11664f}
.feedback-checklist .is-missing>span{background:#ffc7bf;color:#b42335}
.ai-review-panel,.ai-review-status,.ai-strengths,.ai-issues,.ai-suggestions{
  color:var(--ink);background:#fffdf7;border:2px solid var(--ink);border-radius:8px;
}
.ai-review-summary,.ai-issue span,.ai-issue em,.ai-review-disclaimer{color:#4d4a60}
.ai-ready{color:#11664f;background:#b9f0e3}
.ai-needs-revision{color:#9e2638;background:#ffc7bf}
.ai-issue{background:#fff0ed;border-color:#e89b96}
.ai-suggestions .ai-issue{background:#eef1ff;border-color:#aebcf6}
.editor-actions{gap:12px}
.practice-panel{gap:20px}
.practice-summary,.practice-list,.practice-card,.practice-card.done{
  color:var(--ink);background:#fffdf7;border:3px solid var(--ink);
  border-radius:10px;box-shadow:5px 6px 0 var(--ink);
}
.practice-summary-header h3,.practice-card h4{color:var(--ink)}
.practice-card:nth-child(3n+1){background:#fff0a8}
.practice-card:nth-child(3n+2){background:#b9f0e3}
.practice-card:nth-child(3n){background:#ffc7bf}
.practice-card p,.practice-card ul,.practice-meta span,.task-empty{color:#4d4a60}
.practice-meta div{background:rgba(255,255,255,.75);border:2px solid rgba(23,21,43,.2);border-radius:8px}
.practice-meta strong{color:#3155d9}
.practice-bar{height:12px;background:#fff;border:2px solid var(--ink)}
.practice-bar i{background:linear-gradient(90deg,#3155d9,#f0544f,#ffd447)}
.practice-chip{color:var(--ink);background:#ffd447;border:2px solid var(--ink);border-radius:5px}
.practice-card.done{border-color:#188a69}
.practice-card.done button{background:#188a69}
.challenge-section{
  background:#f0544f;
  background-image:radial-gradient(rgba(23,21,43,.13) 1.3px,transparent 1.3px);
  background-size:13px 13px;
}
.challenge-box{
  color:var(--ink);background:#ffd447;
  border:4px solid var(--ink);border-radius:12px;
  box-shadow:9px 10px 0 var(--ink);
}
.challenge-box .eyebrow{color:#3155d9}
.challenge-box h2{color:var(--ink);font-size:clamp(48px,7vw,80px);line-height:.9}
.challenge-box p{color:#35334b;font-weight:700}
.challenge-result{color:var(--ink);background:#fffdf7;border:3px solid var(--ink);border-radius:8px;box-shadow:4px 4px 0 var(--ink)}
.challenge-advice{border-color:rgba(23,21,43,.2)}

#teacher{
  background-color:#b9f0e3;
  background-image:radial-gradient(rgba(23,21,43,.12) 1.1px,transparent 1.1px);
}
.stats{gap:16px}
.stat,.panel{
  color:var(--ink);background:#fffdf7;
  border:3px solid var(--ink);border-radius:10px;
  box-shadow:5px 6px 0 var(--ink);
}
.stat:nth-child(4n+1){background:#fff0a8}
.stat:nth-child(4n+2){background:#ffc7bf}
.stat:nth-child(4n+3){background:#cbd7ff}
.stat:nth-child(4n){background:#fffdf7}
.stat strong{color:#3155d9}
.stat span,.panel p{color:#4d4a60}
.panel h3,.rubric label{color:var(--ink)}
.panel h3{font-size:30px}
.bar{height:10px;background:#fff;border:2px solid var(--ink);border-radius:99px}
.bar i{background:linear-gradient(90deg,#3155d9,#f0544f,#ffd447)}
.submission-section{border-color:rgba(23,21,43,.22)}
.submission-section h4{color:#3155d9;font-size:20px}
.submission{color:var(--ink);background:#fffdf7;border:2px solid var(--ink);border-radius:8px;box-shadow:3px 3px 0 rgba(23,21,43,.24)}
.submission:nth-child(odd){background:#fff0a8}
.submission-group{border-left:8px solid #f0544f}
.submission small,.submission span{color:#4d4a60}
.submission>b{color:#3155d9}
.empty-state{color:#4d4a60}
.portfolio-select{
  color:var(--ink);background:#fff;border:2px solid var(--ink);
  border-radius:7px;color-scheme:light;
}
.dashboard-status{color:#4d4a60}
#copyMessage{color:#11664f}
.module-dialog{border:3px solid var(--ink);border-radius:12px;box-shadow:8px 9px 0 var(--ink)}
.module-navigation{background:#fff0a8;border-color:var(--ink)}
.module-navigation .secondary-btn{color:var(--ink);background:#fffdf7;border-color:var(--ink)}
.module-navigation .secondary-btn:hover{background:#b9f0e3}
.module-navigation .primary-btn{background:#3155d9}
.module-close{border:2px solid var(--ink);background:#f0544f;color:#fff;box-shadow:2px 2px 0 var(--ink)}
footer{color:var(--ink);background:#ffd447;border-top:3px solid var(--ink);font-weight:900}
:focus-visible{outline:3px solid #f0544f;outline-offset:3px}
.module-learning-path{margin-top:28px;padding-top:22px;border-top:3px solid var(--ink)}
.module-learning-intro{max-width:760px;margin:0 0 20px;color:var(--ink-soft);font-weight:700;line-height:1.65}
.module-learning-list{display:grid;gap:16px}
.module-learning-step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;padding:18px;background:#fffdf7;border:2px solid var(--ink);border-radius:9px;box-shadow:3px 4px 0 rgba(23,21,43,.18)}
.module-learning-number{width:38px;height:38px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:50%;background:#ffd447;color:var(--ink);font-family:var(--comic-font);font-size:20px}
.module-learning-step:nth-child(3n+2) .module-learning-number{background:#b9f0e3}
.module-learning-step:nth-child(3n) .module-learning-number{background:#ffc7bf}
.module-learning-content h4{margin:2px 0 8px;color:var(--ink);font-family:var(--comic-font);font-size:25px;font-weight:400;letter-spacing:.025em}
.module-learning-content>p{margin:0 0 12px;color:var(--ink-soft);line-height:1.65}
.module-learning-example,.module-learning-task{padding:13px 15px;border:1px solid rgba(23,21,43,.2);border-radius:7px;background:#eef1ff}
.module-learning-example strong,.module-learning-task strong{font-family:var(--comic-font);font-size:16px;font-weight:400;letter-spacing:.06em;color:#3155d9}
.module-learning-example p,.module-learning-task p{margin:5px 0 0;color:var(--ink);line-height:1.65;white-space:normal}
.module-learning-task{margin-top:10px;background:#fff0a8}
.module-learning-task strong{color:#b13c35}
@media(max-width:900px){
  .hero::after{inset:18px 3vw auto auto;height:38%;width:36%}
  .workspace{grid-template-columns:1fr}
  .stage-list{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:600px){
  body{background-size:10px 10px}
  .hero{padding-top:76px;padding-bottom:76px}
  .hero::after{inset:10px 4vw auto auto;width:30%;height:24%}
  .hero h1{font-size:clamp(66px,18vw,100px)}
  .hero-card{min-height:370px;padding:15px;transform:rotate(.5deg)}
  .section-heading h2{font-size:42px}
  .journey-grid{gap:16px}
  .journey-card,.journey-card.done{min-height:175px;padding:20px}
  .stage-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stage-item{padding:11px 9px}
  .editor{padding:20px}
  .challenge-box{padding:26px}
  .stats{gap:10px}
  .stat{padding:16px}
  .stat strong{font-size:30px}
  .panel{padding:22px}
  .module-learning-step{grid-template-columns:34px minmax(0,1fr);gap:10px;padding:13px}
  .module-learning-number{width:32px;height:32px}
  .module-learning-content h4{font-size:22px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}
}
.practice-list{display:grid;gap:22px}
.practice-panel{grid-template-columns:minmax(0,1fr)}
.practice-list{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.practice-card{display:grid;gap:16px}
.practice-card-head{align-items:center}
.practice-card-head h4{font-family:var(--comic-font);font-size:30px;font-weight:400;letter-spacing:.03em}
.quiz-topic{margin:0;font-size:14px;font-weight:800}
.practice-quiz{display:grid;gap:16px}
.quiz-question{min-width:0;margin:0;padding:14px;border:2px solid rgba(23,21,43,.24);border-radius:8px;background:rgba(255,255,255,.72)}
.quiz-question legend{max-width:100%;padding:0 5px;font-weight:900;line-height:1.5}
.quiz-choices{display:grid;gap:8px;margin-top:8px}
.quiz-choice{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid rgba(23,21,43,.2);border-radius:6px;background:#fff;cursor:pointer;line-height:1.45;transition:background .15s ease,border-color .15s ease}
.quiz-choice:hover{border-color:#3155d9;background:#f0f3ff}
.quiz-choice input{flex:0 0 auto;width:18px;height:18px;margin:2px 0 0;accent-color:#3155d9}
.quiz-choice span{color:var(--ink);font-size:14px;font-weight:700}
.quiz-choice:has(input:checked){border:2px solid #3155d9;background:#e9edff}
.quiz-submit-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.quiz-submit-row>span{font-size:13px;font-weight:900}
.quiz-submit-row button:disabled{cursor:not-allowed;opacity:.5;transform:none;box-shadow:none}
.quiz-review{padding:16px;border:2px solid var(--ink);border-radius:8px;background:#fffdf7;box-shadow:3px 3px 0 var(--ink)}
.quiz-review>strong{display:block;margin-bottom:10px;font-family:var(--comic-font);font-size:24px;font-weight:400;letter-spacing:.04em}
.quiz-review p{margin:8px 0;padding:9px 11px;border-radius:6px;font-size:13px}
.quiz-review .quiz-correct{color:#105b46;background:#d9f3e8}
.quiz-review .quiz-incorrect{color:#8f2735;background:#ffe1df}
.auth-screen.role-student{--role-primary:#3155d9;--role-accent:#f0544f;--role-decoration:#ffd447;background-color:#3155d9}
.auth-screen.role-group{--role-primary:#147b69;--role-accent:#f2a900;--role-decoration:#9ce7bf;background-color:#168a76}
.auth-screen.role-teacher{--role-primary:#6545b8;--role-accent:#e05069;--role-decoration:#ffd447;background-color:#6545b8}
.auth-screen.role-student,.auth-screen.role-group,.auth-screen.role-teacher{
  background-image:radial-gradient(rgba(255,255,255,.2) 1.4px,transparent 1.4px);
}
.auth-screen.role-student .auth-card,
.auth-screen.role-group .auth-card,
.auth-screen.role-teacher .auth-card{
  border-color:var(--ink);
  box-shadow:9px 10px 0 var(--ink);
}
.auth-screen.role-student .auth-card::before,
.auth-screen.role-group .auth-card::before,
.auth-screen.role-teacher .auth-card::before{
  background:var(--role-decoration);
}
.auth-screen.role-student .auth-card .eyebrow,
.auth-screen.role-group .auth-card .eyebrow,
.auth-screen.role-teacher .auth-card .eyebrow{color:var(--role-primary)}
.auth-screen.role-student .auth-card h1 em,
.auth-screen.role-group .auth-card h1 em,
.auth-screen.role-teacher .auth-card h1 em{color:var(--role-accent)}
.auth-screen.role-student .auth-submit,
.auth-screen.role-group .auth-submit,
.auth-screen.role-teacher .auth-submit{
  background:var(--role-primary);
}
.auth-screen.role-student .auth-submit:hover,
.auth-screen.role-group .auth-submit:hover,
.auth-screen.role-teacher .auth-submit:hover{background:var(--role-accent)}
.auth-studio-strip{
  display:flex;align-items:center;gap:13px;
  margin:-8px 0 22px;padding:12px 14px;
  color:var(--ink);background:#fff0a8;
  border:2px solid var(--ink);border-radius:8px;
  box-shadow:3px 3px 0 var(--ink);
}
.auth-mini-clapper{flex:0 0 78px;position:relative;padding-top:8px}
.clapper-top{
  position:absolute;top:0;left:2px;width:74px;height:13px;
  border:2px solid var(--ink);border-radius:3px 3px 0 0;
  background:repeating-linear-gradient(135deg,#fffdf7 0 8px,#17152b 8px 15px);
  transform-origin:8px 100%;
  animation:clapper-action 2.8s ease-in-out infinite;
}
.clapper-body{
  display:flex;justify-content:space-between;align-items:center;gap:4px;
  height:30px;padding:0 5px;
  border:2px solid var(--ink);border-radius:2px 2px 5px 5px;background:#fffdf7;
  font:900 8px var(--font);
}
.clapper-body strong{color:#cf314b}
.auth-live-signal{min-width:0;flex:1;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:5px 11px}
.auth-on-air{display:flex;align-items:center;gap:5px;color:#cf314b;font:900 10px var(--font);letter-spacing:.08em}
.auth-on-air i{width:8px;height:8px;border-radius:50%;background:#cf314b;animation:rec-blink 1.15s steps(2,end) infinite}
.auth-waveform{height:22px;display:flex;align-items:center;justify-content:space-between;gap:3px;padding:0 5px;border:1px solid rgba(23,21,43,.2);border-radius:5px;background:#fffdf7}
.auth-waveform i{display:block;width:3px;height:7px;border-radius:4px;background:#188a69;transform:scaleY(.35);transform-origin:center;animation:audio-meter .8s ease-in-out infinite}
.auth-waveform i:nth-child(3n){animation-delay:.18s}
.auth-waveform i:nth-child(3n+1){animation-delay:.34s}
.auth-signal-label{grid-column:1/-1;color:#5d5a6e;font:900 8px var(--font);letter-spacing:.13em}
@keyframes clapper-action{
  0%,72%,100%{transform:rotate(0)}
  78%{transform:rotate(-18deg)}
  84%{transform:rotate(3deg)}
  90%{transform:rotate(-5deg)}
}
.auth-screen.role-group .auth-studio-strip{background:#b9f0e3}
.auth-screen.role-teacher .auth-studio-strip{background:#cbd7ff}
.auth-screen.role-group .auth-waveform i{background:#147b69}
.auth-screen.role-teacher .auth-waveform i{background:#6545b8}
@media(max-width:600px){
  .practice-list{grid-template-columns:minmax(0,1fr)}
  .practice-card-head{align-items:flex-start;flex-direction:column}
  .quiz-question{padding:11px}
  .quiz-submit-row{align-items:stretch;flex-direction:column}
  .auth-studio-strip{margin:-10px 0 17px;padding:10px}
  .auth-mini-clapper{flex-basis:70px}
  .clapper-top{width:66px}
}
@media(min-width:601px) and (max-width:900px){
  .practice-list{grid-template-columns:minmax(0,1fr)}
}
@keyframes comic-pop{
  0%{opacity:0;transform:translateY(20px) scale(.94) rotate(-1deg)}
  70%{opacity:1;transform:translateY(-3px) scale(1.015) rotate(.4deg)}
  100%{opacity:1;transform:translateY(0) scale(1) rotate(0)}
}
@keyframes comic-reveal{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes broadcast-sweep{
  0%,15%{left:-45%;opacity:0}
  28%{opacity:.8}
  65%,100%{left:120%;opacity:0}
}
@keyframes rec-blink{
  0%,45%,100%{opacity:1}
  55%,90%{opacity:.35}
}
@keyframes audio-meter{
  0%,100%{transform:scaleY(.28)}
  25%{transform:scaleY(.92)}
  50%{transform:scaleY(.48)}
  75%{transform:scaleY(1)}
}
@keyframes progress-pulse{
  0%,100%{filter:drop-shadow(2px 3px 0 rgba(23,21,43,.42))}
  50%{filter:drop-shadow(2px 3px 0 rgba(23,21,43,.42)) drop-shadow(0 0 9px rgba(240,84,79,.35))}
}
.auth-card{animation:comic-pop .58s cubic-bezier(.2,.8,.25,1) both}
.hero-copy>*{animation:comic-reveal .55s ease-out both}
.hero-copy>.eyebrow{animation-delay:.05s}
.hero-copy>h1{animation-delay:.12s}
.hero-copy>.lead{animation-delay:.2s}
.hero-copy>.actions{animation-delay:.28s}
.hero-card{animation:comic-pop .65s .14s cubic-bezier(.2,.8,.25,1) both}
.screen-top b{display:flex;align-items:center;gap:9px}
.screen-top b::after{
  content:"● REC";
  color:#cf314b;
  font:900 10px var(--font);
  letter-spacing:.08em;
  animation:rec-blink 1.2s steps(2,end) infinite;
}
.audio-meter{height:18px;display:flex;align-items:center;gap:3px;margin-left:auto}
.audio-meter i{display:block;width:3px;height:14px;border-radius:2px;background:#188a69;transform-origin:center;animation:audio-meter .8s ease-in-out infinite}
.audio-meter i:nth-child(2){animation-delay:.12s}
.audio-meter i:nth-child(3){animation-delay:.24s}
.audio-meter i:nth-child(4){animation-delay:.08s}
.audio-meter i:nth-child(5){animation-delay:.32s}
.mini-scene{overflow:hidden}
.mini-scene::after{
  content:"";
  position:absolute;z-index:1;top:-20%;left:-45%;width:28%;height:145%;
  pointer-events:none;transform:skew(-14deg);
  background:linear-gradient(90deg,transparent,rgba(49,85,217,.13),transparent);
  animation:broadcast-sweep 6s ease-in-out infinite;
}
.progress-ring{animation:progress-pulse 3s ease-in-out infinite}
body:not(.locked) .journey-card,
body:not(.locked) .practice-card,
body:not(.locked) .stage-item{
  animation:comic-reveal .45s ease-out both;
}
body:not(.locked) .journey-card:nth-child(2),
body:not(.locked) .practice-card:nth-child(2),
body:not(.locked) .stage-item:nth-child(2){animation-delay:.05s}
body:not(.locked) .journey-card:nth-child(3),
body:not(.locked) .practice-card:nth-child(3),
body:not(.locked) .stage-item:nth-child(3){animation-delay:.1s}
body:not(.locked) .journey-card:nth-child(4),
body:not(.locked) .practice-card:nth-child(4),
body:not(.locked) .stage-item:nth-child(4){animation-delay:.15s}
.module-modal:not(.hidden) .module-dialog{animation:comic-pop .35s ease-out both}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}
.assessment-panel{grid-column:1/-1}
.assessment-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.assessment-heading p{margin:0}
.assessment-heading .secondary-btn{flex:none}
.assessment-note,.assessment-completion{font-size:12px}
.assessment-list{display:grid;gap:15px;margin-top:16px}
.assessment-student{padding:17px;border:2px solid var(--ink);border-radius:9px;background:#fff0a8;box-shadow:3px 4px 0 rgba(23,21,43,.18)}
.assessment-student:nth-child(3n+2){background:#b9f0e3}
.assessment-student:nth-child(3n){background:#cbd7ff}
.assessment-group{border-left:8px solid #f0544f}
.assessment-student-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}
.assessment-student-heading>div:first-child{min-width:0}
.assessment-student-heading strong,.assessment-student-heading small{display:block;overflow-wrap:anywhere}
.assessment-student-heading small{margin-top:3px;color:#4d4a60;font-size:11px}
.assessment-total{text-align:right;flex:none}
.assessment-total b{display:block;color:#3155d9;font:700 28px var(--display)}
.assessment-total span{color:#4d4a60;font-size:11px}
.assessment-completion{margin:12px 0 8px;color:#4d4a60}
.assessment-scores{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.assessment-quiz-score{display:grid;align-content:space-between;gap:9px;min-width:0;padding:11px;border:2px solid rgba(23,21,43,.2);border-radius:7px;background:#fffdf7}
.assessment-quiz-score span{font-size:11px;font-weight:800}
.assessment-quiz-score strong{color:#3155d9;font-size:12px}
.assessment-details{margin-top:12px;border-top:1px solid rgba(23,21,43,.2);padding-top:10px}
.assessment-details summary{color:#3155d9;font-size:12px;font-weight:900;cursor:pointer}
.assessment-detail-list{display:grid;gap:13px;margin-top:12px}
.assessment-quiz-detail{padding:13px;border:1px solid rgba(23,21,43,.2);border-radius:7px;background:#fffdf7}
.assessment-quiz-detail h5{display:flex;justify-content:space-between;gap:12px;margin:0 0 10px;color:#17152b;font-size:13px}
.assessment-quiz-detail h5 span{flex:none;color:#3155d9}
.assessment-quiz-detail ol{display:grid;gap:8px;margin:0;padding-left:25px}
.assessment-quiz-detail li{padding-left:3px;color:#4d4a60;font-size:12px;line-height:1.55}
.assessment-quiz-detail li strong,.assessment-quiz-detail li span{display:block}
.assessment-quiz-detail li strong{color:#17152b}
.assessment-answer-correct::marker{color:#188a69}
.assessment-answer-incorrect::marker{color:#cf314b}
.assessment-answer-correct span:last-child,.assessment-answer-incorrect span:last-child{font-weight:800}
@media(max-width:900px){.assessment-scores{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.assessment-heading,.assessment-student-heading{align-items:stretch;flex-direction:column}.assessment-heading .secondary-btn{align-self:flex-start}.assessment-total{text-align:left}.assessment-total b{display:inline;margin-right:8px}.assessment-scores{grid-template-columns:1fr 1fr}.assessment-quiz-detail h5{flex-direction:column;gap:3px}}