:root{color:#243044;background:#fff7d8;font-family:Nunito,Quicksand,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 12% 10%,rgba(255,214,102,.7),transparent 26%),radial-gradient(circle at 84% 12%,rgba(125,211,252,.6),transparent 28%),radial-gradient(circle at 50% 100%,rgba(134,239,172,.45),transparent 34%),linear-gradient(180deg,#fff8dcf5,#e2faf2f5),url(https://images.unsplash.com/photo-1509062522246-3755977927d7?auto=format&fit=crop&w=1600&q=72);background-attachment:fixed;background-size:cover}button,input,textarea,select{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;background:#fff9e2e6}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 32px;border-bottom:3px solid rgba(255,210,77,.55);background:#ffffffe0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 8px 24px #3b558414}.brand{display:flex;align-items:center;gap:12px;min-width:220px}.brand-mark{display:grid;width:42px;height:42px;place-items:center;border-radius:14px;background:linear-gradient(135deg,#ff8a3d,#ffcf3f);color:#fff;font-weight:900;box-shadow:0 6px #c66a1f}.brand-title{margin:0;color:#20304d;font-size:20px;font-weight:850}.brand-subtitle{margin:2px 0 0;color:#6d7890;font-size:12px;font-weight:650}.nav{display:flex;gap:8px;overflow-x:auto}.nav-button,.secondary-button,.primary-button,.quiet-button{min-height:42px;border:0;border-radius:999px;padding:0 14px;font-weight:800;transition:transform .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease}.nav-button{background:transparent;color:#57647b}.nav-button.active{background:linear-gradient(135deg,#2f80ed,#7c3aed);color:#fff;box-shadow:0 5px #1f469447}.primary-button{background:linear-gradient(135deg,#ff7a3d,#ffbd2e);color:#fff;box-shadow:0 6px #c96a1f}.secondary-button{background:linear-gradient(135deg,#2f80ed,#61d8ff);color:#fff;box-shadow:0 6px #1d62b8}.quiet-button{background:#fff;color:#263041;border:2px solid #ffe08a;box-shadow:0 5px #f1d06b}.nav-button:hover,.secondary-button:hover,.primary-button:hover,.quiet-button:hover{transform:translateY(-1px)}.layout{width:min(1220px,calc(100% - 32px));margin:0 auto;padding:28px 0 56px}.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:20px;align-items:stretch;margin-bottom:20px}.hero-main,.panel,.metric-card,.skill-card,.activity-card{border:3px solid rgba(255,255,255,.9);border-radius:24px;background:#fffffff0;box-shadow:0 14px #6081ad14,0 18px 50px #27304514}.hero-main{position:relative;padding:28px;overflow:hidden;background:radial-gradient(circle at 10% 20%,rgba(255,207,63,.45),transparent 24%),radial-gradient(circle at 92% 6%,rgba(97,216,255,.32),transparent 28%),#fffef8}.hero-main:after{position:absolute;right:22px;bottom:-26px;color:#ff8a3d29;content:"ABC";font-size:116px;font-weight:1000;transform:rotate(-8deg)}.eyebrow{margin:0 0 12px;color:#e95f2d;font-size:12px;font-weight:900;letter-spacing:0;text-transform:uppercase}.hero-title{position:relative;z-index:1;max-width:720px;margin:0;font-size:clamp(32px,4.6vw,56px);line-height:1.02;letter-spacing:0;color:#26365a}.hero-copy{position:relative;z-index:1;max-width:720px;margin:14px 0 0;color:#516079;font-size:17px;line-height:1.65;font-weight:700}.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.classroom-visual{min-height:260px;padding:22px;color:#27364f;background:radial-gradient(circle at 22% 22%,#fff7ad,transparent 24%),radial-gradient(circle at 82% 24%,#c9f2ff,transparent 30%),linear-gradient(135deg,#fef3c7,#bbf7d0 48%,#bfdbfe);background-position:center;background-size:cover;border:3px solid #fff;border-radius:24px;box-shadow:0 14px #4a7b5624,0 22px 54px #2730451c;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.visual-stat{width:fit-content;border-radius:16px;padding:10px 12px;background:#ffffffb8;border:2px solid rgba(255,255,255,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.visual-stat-row{display:flex;gap:10px;flex-wrap:wrap}.mascot-card{display:flex;align-items:center;gap:12px;width:fit-content;border-radius:22px;padding:10px 14px 10px 10px;background:#ffffffc7;border:2px solid #fff;box-shadow:0 8px 18px #4156731f}.mascot-card span{display:block;color:#69758c;font-size:13px;font-weight:800}.mascot-face{display:grid;width:64px;height:64px;place-items:center;border-radius:20px;background:linear-gradient(135deg,#7dd3fc,#a7f3d0);font-size:38px;box-shadow:0 7px #2a6f932e}.island-path{display:flex;justify-content:space-between;align-items:center;min-height:88px;margin:12px 4px;padding:0 8px;background:linear-gradient(90deg,transparent 0 8%,rgba(255,255,255,.58) 8% 92%,transparent 92%),repeating-linear-gradient(90deg,transparent 0 38px,rgba(255,255,255,.52) 38px 54px);border-radius:999px}.island-path span{display:grid;width:58px;height:58px;place-items:center;border-radius:20px;background:#fff;font-size:30px;box-shadow:0 7px #41567324}.grid{display:grid;gap:16px}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.panel{padding:20px}.learning-selector{background:linear-gradient(135deg,#fffffff5,#fff7d4f5),radial-gradient(circle at 100% 0%,rgba(255,138,61,.22),transparent 28%)}.panel-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.panel-title{margin:0;font-size:22px;letter-spacing:0;color:#26365a}.panel-copy{margin:4px 0 0;color:#68738a;line-height:1.5;font-weight:700}.select-row{display:flex;flex-wrap:wrap;gap:8px}.chip{min-height:36px;border:2px solid #ffe08a;border-radius:999px;padding:0 12px;background:#fffdf4;color:#3a465a;font-weight:800;box-shadow:0 4px #f2c74d59}.chip.active{border-color:#ff8a3d;background:linear-gradient(135deg,#ff8a3d,#ffcf3f);color:#fff}.metric-card,.skill-card,.activity-card{padding:16px}.metric-value{margin:0;font-size:32px;font-weight:900;color:#2f80ed}.muted{color:#66748a;font-weight:700}.subject-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.subject-button{min-height:112px;border:3px solid #fff;border-radius:22px;padding:14px;background:linear-gradient(180deg,#fffffff5,#fffbecf5);text-align:left;box-shadow:0 9px #48618114}.subject-button.active{outline:4px solid rgba(255,189,46,.45);transform:translateY(-2px)}.subject-icon{display:inline-grid;min-width:56px;height:56px;place-items:center;border-radius:18px;color:#fff;font-size:30px;font-weight:900;box-shadow:0 7px #26304429}.skill-list,.activity-list,.message-list{display:grid;gap:12px}.lesson-card{position:relative;min-height:260px;border:3px solid #fff;border-radius:24px;padding:18px;background:radial-gradient(circle at 94% 0%,rgba(255,207,63,.36),transparent 28%),linear-gradient(180deg,#fff,#fff9e8);box-shadow:0 10px #48618114}.lesson-card h3{margin:22px 0 8px;color:#26365a;font-size:21px}.lesson-card ul{margin:12px 0 0;padding-left:20px;color:#3d4c65;font-weight:750;line-height:1.5}.lesson-status{position:absolute;top:14px;right:14px;border-radius:999px;padding:5px 10px;background:#dcfce7;color:#15803d;font-size:12px;font-weight:950}.lesson-hook{border-radius:16px;padding:10px 12px;background:#e0f2fe;color:#075985;font-weight:900}.lesson-link{border-radius:999px;padding:8px 10px;background:#eef2ff;color:#4338ca;font-weight:900}.vocab-card{display:flex;align-items:center;gap:10px;border-radius:16px;padding:10px;background:#f7fbff;border:2px solid #e0f2fe;font-weight:800}.skill-card{display:grid;grid-template-columns:1fr auto;gap:12px;background:linear-gradient(180deg,#fff,#f8fbff)}.progress-track{height:14px;overflow:hidden;border-radius:999px;background:#e8edf7;border:2px solid #fff}.progress-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#38d07f,#2f80ed,#a855f7)}.score-bubble{display:grid;min-width:64px;height:64px;place-items:center;border-radius:22px;background:#fff7c2;color:#b45309;box-shadow:inset 0 0 0 3px #ffdf74,0 7px #b96f1424}.mistake-note{display:inline-block;margin-top:8px;border-radius:999px;padding:6px 10px;background:#fff1f2;color:#b91c1c;font-weight:850}.activity-card{position:relative;padding-left:76px;background:linear-gradient(180deg,#fff,#fffdf2)}.activity-badge{position:absolute;top:16px;left:16px;display:grid;width:46px;height:46px;place-items:center;border-radius:17px;background:linear-gradient(135deg,#ffcf3f,#ff8a3d);font-size:24px;box-shadow:0 6px #c96a1f2e}.reading-text{border:3px dashed #9bdcff;border-radius:22px;padding:18px;background:linear-gradient(180deg,#f7fdff,#fffef7);color:#172033;font-size:20px;line-height:1.9;font-weight:850}.word-missed{border-radius:10px;background:#ffe1e6;color:#991b1b;padding:3px 6px}.live-panel{background:radial-gradient(circle at 16% 12%,rgba(255,207,63,.5),transparent 26%),radial-gradient(circle at 88% 20%,rgba(97,216,255,.42),transparent 28%),linear-gradient(180deg,#fff,#f5fff9)}.voice-orb{display:grid;width:min(280px,82vw);aspect-ratio:1;place-items:center;margin:20px auto;border:8px solid #fff;border-radius:50%;background:radial-gradient(circle at 35% 28%,#ffffff 0 8%,transparent 9%),linear-gradient(135deg,#34d399,#2f80ed 56%,#a855f7);color:#fff;box-shadow:0 18px #2e7d6024,0 24px 60px #2f80ed40;font-size:28px;font-weight:1000;text-align:center}.voice-orb.listening{animation:voicePulse 1.1s ease-in-out infinite;background:radial-gradient(circle at 35% 28%,#ffffff 0 8%,transparent 9%),linear-gradient(135deg,#ff8a3d,#ffcf3f)}.voice-orb.thinking{background:radial-gradient(circle at 35% 28%,#ffffff 0 8%,transparent 9%),linear-gradient(135deg,#2f80ed,#61d8ff)}.voice-transcript,.voice-followup{border-radius:16px;padding:10px 12px;background:#fff7d6;color:#7c4a03;font-weight:900}.voice-followup{margin:10px 0 0;background:#e0f2fe;color:#075985}@keyframes voicePulse{0%,to{transform:scale(1);box-shadow:0 18px #c96a1f29,0 24px 60px #ff8a3d3d}50%{transform:scale(1.035);box-shadow:0 22px #c96a1f1a,0 32px 76px #ff8a3d57}}.textarea,.input{width:100%;border:3px solid #dbeafe;border-radius:18px;background:#fff;color:#172033;outline:none}.textarea{min-height:110px;padding:14px;resize:vertical;line-height:1.5}.input{min-height:46px;padding:0 14px}.message{max-width:82%;border-radius:18px;padding:12px 14px;line-height:1.5;font-weight:750}.message.learner{justify-self:end;background:#dbeafe;border-bottom-right-radius:6px}.message.coach{justify-self:start;background:#f0fdf4;border-bottom-left-radius:6px}.source-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.source-list span{border-radius:999px;padding:5px 8px;background:#dcfce7;color:#166534;font-size:12px;font-weight:950}.studio-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}.studio-list li{border-left:6px solid #2f80ed;border-radius:16px;padding:12px;background:#f7fbff;font-weight:750}@media(max-width:880px){.topbar{align-items:flex-start;flex-direction:column;padding:12px 16px}.brand{min-width:0}.hero,.grid-2,.grid-3,.subject-rail{grid-template-columns:1fr}.layout{width:min(100% - 20px,1220px);padding-top:16px}.hero-main{padding:20px}.message{max-width:100%}}