:root{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#272331;background:#f7f1e7;
  --ink:#272331;--muted:#756d78;--paper:#fffdf9;--cream:#f7f1e7;
  --accent:#d97736;--accent-deep:#b74f2b;--accent-soft:#fff0e5;
  --plum:#392f49;--plum-2:#51425f;--line:#e8dfd5;--danger:#b7463f;
  --shadow:0 18px 50px rgba(55,43,61,.10);
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,#fffaf2 0,#f7f1e7 42%,#efe7dd 100%);color:var(--ink)}
button,input,select,textarea{font:inherit}
a{color:inherit}
.app-shell{width:min(1120px,100%);margin:0 auto;padding:24px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.brand-lockup{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand-lockup small,.brand-lockup strong{display:block}.brand-lockup small{font-size:.72rem;color:var(--muted);font-weight:700;letter-spacing:.05em}.brand-lockup strong{font-size:1.15rem}
.brand-mark{width:42px;height:42px;border-radius:14px;background:var(--plum);color:#fff;display:grid;place-items:center;font-weight:900;box-shadow:0 8px 20px rgba(57,47,73,.2)}
.mini-nav{display:flex;gap:6px;flex-wrap:wrap}.mini-nav a{padding:9px 12px;border-radius:999px;text-decoration:none;color:var(--muted);font-weight:800;font-size:.9rem}.mini-nav a.active,.mini-nav a:hover{background:#fff;color:var(--ink);box-shadow:0 5px 16px rgba(55,43,61,.08)}
h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2rem,4vw,3.7rem);line-height:1.02;margin-bottom:14px}h2{font-size:1.55rem}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;font-weight:900;color:var(--accent-deep);margin-bottom:7px}
.panel{background:rgba(255,253,249,.94);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:var(--shadow)}
.primary,.secondary,.danger{border:0;border-radius:999px;padding:12px 18px;font-weight:850;cursor:pointer;transition:.18s ease}
.primary{background:var(--plum);color:#fff;box-shadow:0 8px 20px rgba(57,47,73,.18)}.primary:hover{transform:translateY(-1px);background:var(--plum-2)}
.secondary{border:1px solid #cabdca;background:#fff;color:var(--plum)}.secondary:hover{border-color:var(--plum)}
.danger{background:var(--danger);color:#fff}.danger:disabled,.primary:disabled{opacity:.42;cursor:not-allowed;transform:none}
.compact{padding:10px 16px}
.hero-layout{display:grid;grid-template-columns:1.03fr .97fr;gap:18px;align-items:stretch}
.hero-copy{padding:clamp(30px,5vw,58px);display:flex;flex-direction:column;justify-content:center;min-height:520px}
.lead{font-size:1.2rem;line-height:1.6;color:#5e5663;max-width:52ch}
.hero-points{display:flex;gap:9px;flex-wrap:wrap;margin:10px 0 30px}.hero-points span{background:var(--accent-soft);color:#87431f;border:1px solid #f3c7aa;padding:8px 12px;border-radius:999px;font-size:.84rem;font-weight:800}
.hero-action{align-self:flex-start;min-width:190px;display:flex;justify-content:space-between;gap:22px}
.speaking-scene{min-height:520px;overflow:hidden;position:relative;background:linear-gradient(145deg,#fff8ef,#fffdf9)}
.speaking-scene:before,.speaking-scene:after{content:"";position:absolute;border-radius:50%;filter:blur(1px)}.speaking-scene:before{width:230px;height:230px;background:#f6d7bf;right:-70px;top:-70px}.speaking-scene:after{width:170px;height:170px;background:#e7dbea;left:-60px;bottom:-40px}
.people{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:28px;margin-top:84px}
.person{width:128px;height:210px;position:relative;display:grid;justify-items:center}.face{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:1.4rem;color:#fff;z-index:2;border:6px solid #fff;box-shadow:0 10px 22px rgba(55,43,61,.13)}.body{width:118px;height:142px;border-radius:54px 54px 22px 22px;margin-top:-10px;display:block}.person-a .face{background:#c66c3d}.person-a .body{background:#58445f}.person-b .face{background:#7c5363}.person-b .body{background:#d89b47}
.sound-wave{display:flex;align-items:center;gap:4px;height:68px}.sound-wave i,.wave-preview i{display:block;width:4px;border-radius:99px;background:var(--accent)}.sound-wave i:nth-child(1),.sound-wave i:nth-child(7){height:18px}.sound-wave i:nth-child(2),.sound-wave i:nth-child(6){height:36px}.sound-wave i:nth-child(3),.sound-wave i:nth-child(5){height:54px}.sound-wave i:nth-child(4){height:66px}
.speech-bubble{position:absolute;z-index:3;background:#fff;border:1px solid var(--line);box-shadow:0 9px 26px rgba(55,43,61,.10);padding:12px 16px;border-radius:18px;font-weight:850}.speech-bubble.left{left:26px;top:26px}.speech-bubble.right{right:26px;top:84px}
.scene-caption{position:absolute;z-index:3;left:24px;right:24px;bottom:24px;background:rgba(255,253,249,.92);border:1px solid var(--line);border-radius:18px;padding:16px}.scene-caption strong,.scene-caption span{display:block}.scene-caption span{color:var(--muted);margin-top:5px;line-height:1.45;font-size:.92rem}
.lesson-card{margin-top:18px;min-height:250px}.lesson-prompt{font-size:1.12rem;line-height:1.6;max-width:58ch;color:#5d5562}
.speech-dock{margin:18px auto;display:grid;justify-items:center;gap:12px;text-align:center}.recording-topline{display:flex;align-items:center;gap:8px}.recording-topline p{margin:0;font-weight:800}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--accent)}
.wave-preview{display:flex;align-items:center;gap:4px;height:42px}.wave-preview i:nth-child(1),.wave-preview i:nth-child(9){height:8px}.wave-preview i:nth-child(2),.wave-preview i:nth-child(8){height:18px}.wave-preview i:nth-child(3),.wave-preview i:nth-child(7){height:28px}.wave-preview i:nth-child(4),.wave-preview i:nth-child(6){height:36px}.wave-preview i:nth-child(5){height:42px}
.mic-button{width:96px;height:96px;border:0;border-radius:50%;background:var(--plum);color:#fff;font-size:2rem;box-shadow:0 15px 34px rgba(57,47,73,.24);cursor:pointer}.mic-button[data-active="true"]{transform:scale(1.04);outline:6px solid rgba(217,119,54,.22);background:var(--accent-deep)}
.microcopy{font-size:.88rem;color:var(--muted);max-width:42ch}.results-card{margin-top:18px}
.section-heading{display:flex;align-items:center;justify-content:space-between}.replay-turn{border-top:1px solid var(--line);padding:15px 0}.replay-turn:first-child{border-top:0}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Teacher */
.teacher-layout{min-height:100vh;display:grid;grid-template-columns:240px 1fr}.teacher-sidebar{background:linear-gradient(180deg,#2f273b,#44364e);color:#fff;padding:24px 18px;display:flex;flex-direction:column;gap:28px}.brand-lockup.inverse small{color:#d8cfdc}.teacher-sidebar nav{display:grid;gap:8px}.teacher-sidebar nav a{padding:11px 13px;border-radius:13px;text-decoration:none;color:#e9e2ec;font-weight:750}.teacher-sidebar nav a:hover,.teacher-sidebar nav a.active{background:#fff;color:var(--plum)}.sidebar-note{margin-top:auto;color:#d8cfdc;font-size:.84rem;line-height:1.5}
.teacher-main{padding:28px;min-width:0}.teacher-topbar h1{font-size:2.2rem;margin:0}.header-actions{display:flex;gap:10px;flex-wrap:wrap}
.teacher-toolbar{display:flex;gap:14px;align-items:end;flex-wrap:wrap;margin-bottom:16px}.teacher-toolbar label{display:grid;gap:6px;font-weight:800;font-size:.88rem}.teacher-toolbar select{min-width:180px;padding:11px 12px;border:1px solid #cfc2ce;border-radius:12px;background:#fff;color:var(--ink)}
.session-strip{margin-bottom:16px;box-shadow:none;background:#fff9f3}.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.teacher-team-card{text-align:left;display:grid;gap:8px;width:100%;cursor:pointer;position:relative;overflow:hidden}.teacher-team-card:after{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:#b8adb9}.teacher-team-card[data-state="speaking"]:after{background:var(--accent)}.teacher-team-card[data-state="finished"]:after{background:#786a84}.teacher-team-card[data-state="technical-problem"]:after{background:var(--danger)}.teacher-team-card .team-state{font-weight:900;color:var(--accent-deep)}.teacher-team-card[data-state="technical-problem"] .team-state{color:var(--danger)}.teacher-team-card small{color:var(--muted);line-height:1.4}
.team-detail{margin-top:16px}.teacher-member-detail{display:grid;grid-template-columns:1.1fr .8fr 2fr;gap:10px;align-items:center;padding:13px 0;border-top:1px solid var(--line)}.teacher-member-detail p{margin:0;color:var(--muted);font-size:.88rem}

/* Creator */
.creator-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:18px}.creator-grid label{display:grid;gap:6px;font-weight:800}.creator-grid .wide{grid-column:1/-1}.creator-grid input,.creator-grid select,.creator-grid textarea{width:100%;padding:11px 12px;border:1px solid #d0c3cf;border-radius:12px;background:#fff;font:inherit;color:var(--ink)}.creator-grid textarea{min-height:100px;resize:vertical}

@media(max-width:900px){.hero-layout{grid-template-columns:1fr}.speaking-scene{min-height:430px}.teacher-layout{grid-template-columns:1fr}.teacher-sidebar{position:relative}.teacher-sidebar nav{grid-template-columns:repeat(2,minmax(0,1fr))}.sidebar-note{display:none}}
@media(max-width:680px){.app-shell,.teacher-main{padding:16px}.topbar{align-items:flex-start;flex-wrap:wrap}.mini-nav{order:3;width:100%}.hero-copy{min-height:auto;padding:30px 24px}.speaking-scene{min-height:390px}.people{transform:scale(.82);margin-top:72px}.creator-grid{grid-template-columns:1fr}.creator-grid .wide{grid-column:auto}.teacher-member-detail{grid-template-columns:1fr}.teacher-sidebar nav{grid-template-columns:1fr 1fr}}