@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap');
:root{--ink:#19233e;--muted:#747f97;--navy:#18264d;--violet:#6555ed;--violet2:#ebe9ff;--bg:#f6f7fb;--white:#fff;--border:#e8eaf2;--green:#15856a;--orange:#f6ad55}*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:'DM Sans',sans-serif;color:var(--ink)}h1,h2,h3,h4,p{margin:0}h1,h2,h3{font-family:Outfit,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.app-shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}.sidebar{background:#111c37;color:#cbd4f2;padding:26px 17px;display:flex;flex-direction:column;gap:25px;position:sticky;top:0;height:100vh}.logo{font:800 26px Outfit;color:white;letter-spacing:-1.4px;padding:2px 13px}.logo span{color:#a699ff}.logo small{font:500 10px 'DM Sans';display:block;letter-spacing:2.4px;text-transform:uppercase;color:#a3afd4;margin-top:2px}.nav{display:flex;flex-direction:column;gap:7px}.nav button{background:none;color:#bdc7e4;border:0;border-radius:12px;padding:13px;text-align:left;font-weight:600}.nav button.active,.nav button:hover{background:#283660;color:#fff}.side-bottom{margin-top:auto;background:#253257;padding:15px;border-radius:14px;font-size:13px;line-height:1.65}.side-bottom strong{color:white;display:block}.main{min-width:0;padding:32px 42px 65px;max-width:1370px;width:100%;margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:29px;gap:15px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:800;color:var(--violet);text-transform:uppercase}.topbar .eyebrow{margin-bottom:6px}.topbar h1{font-size:30px}.top-actions{display:flex;align-items:center;gap:10px}.identity{border:1px solid var(--border);background:white;padding:10px 14px;border-radius:12px;font-weight:700;font-size:13px}.grid{display:grid;grid-template-columns:1.5fr 1fr;gap:22px}.panel{background:white;border:1px solid var(--border);border-radius:20px;padding:25px;box-shadow:0 5px 22px #19234508}.hero{background:linear-gradient(125deg,#202d58,#453b95);color:white;display:flex;gap:20px;align-items:center;overflow:hidden;min-height:320px}.hero h2{font-size:30px;line-height:1.14;margin:12px 0}.hero p{color:#d5d5f8;line-height:1.7;max-width:420px}.hero .button{background:#fff;color:#392f9a;margin-top:22px}.coach-area{flex:0 0 170px;align-self:end}.coach{max-width:100%;width:240px;display:block;filter:drop-shadow(0 15px 17px #0003)}.coach .mouth{transform-origin:120px 108px}.coach.speaking .mouth{animation:talk .19s ease-in-out infinite alternate}.coach.speaking .head{animation:nod 1.7s ease-in-out infinite alternate;transform-origin:120px 110px}.coach .eyebrows{animation:brow 4s ease-in-out infinite;transform-origin:120px 86px}@keyframes talk{from{transform:scaleY(.35)}to{transform:scaleY(1.45)}}@keyframes nod{to{transform:rotate(2deg)}}@keyframes brow{50%{transform:translateY(-1px)}}.button{border:0;background:var(--violet);border-radius:11px;color:white;padding:12px 17px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}.button.secondary{background:#eff0fa;color:#40476b}.button.outline{background:white;color:var(--violet);border:1px solid #c9c4fa}.button.small{padding:8px 12px;font-size:12px}.button.red{background:#fbe9e9;color:#a72a40}.muted{color:var(--muted);line-height:1.6}.smalltext{font-size:13px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:15px}.section-head h2{font-size:21px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.stat{background:white;border:1px solid var(--border);border-radius:16px;padding:19px}.stat strong{display:block;font:700 29px Outfit;margin:5px 0}.stat span{font-size:12px;color:var(--muted)}.progress-track{height:9px;border-radius:30px;background:#e8e9f4;overflow:hidden}.progress-fill{background:var(--violet);height:100%;border-radius:30px;transition:width .3s}.module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.module{background:white;border:1px solid var(--border);border-radius:17px;padding:20px;text-align:left;display:flex;gap:13px;align-items:flex-start;transition:.2s}.module:hover{border-color:#b5aeff;transform:translateY(-2px)}.module .number{width:40px;height:40px;border-radius:12px;background:var(--violet2);color:var(--violet);display:grid;place-items:center;font-weight:800;flex-shrink:0}.module h3{font-size:17px;margin:0 0 7px}.module p{font-size:12px;color:var(--muted);line-height:1.65}.pill{font-size:11px;font-weight:700;padding:5px 9px;border-radius:30px;background:#f0effe;color:#5b4fd5;display:inline-block}.pill.green{background:#e3f7ee;color:#087e54}.stack{display:flex;flex-direction:column;gap:16px}.lesson{padding:18px;border:1px solid var(--border);border-radius:14px;margin-bottom:13px;background:white}.lesson h3{font-size:17px;margin-bottom:9px}.lesson p{line-height:1.75;color:#48536e}.quote{background:#f1efff;border-left:4px solid #796cf5;padding:15px;border-radius:9px;margin-top:12px;line-height:1.6}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.comparison>div{padding:13px;border-radius:10px;background:#fff0ef;font-size:13px;line-height:1.5}.comparison>div:last-child{background:#e9f9f2}.card-title{font-size:23px;margin-bottom:9px}.stepper{display:flex;gap:7px;margin:20px 0}.step{height:6px;flex:1;background:#e6e7f0;border-radius:20px}.step.done{background:var(--violet)}.answer{width:100%;display:block;text-align:left;padding:15px 17px;background:#fafafe;color:var(--ink);border:1px solid #e3e4ef;border-radius:12px;margin:10px 0}.answer:hover{border-color:#9e94ec}.answer.selected{background:#eeecff;border:2px solid var(--violet);padding:14px 16px}.feedback{padding:15px;border-radius:11px;background:#eef7f5;margin:12px 0;line-height:1.7}.error{background:#fff2ec}.coach-card{display:flex;align-items:center;gap:22px;background:#f0efff;border-radius:16px;padding:18px}.coach-card .coach{width:120px}.coach-card p{line-height:1.6}.player{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.form-field{margin:12px 0}.form-field label{display:block;font-size:12px;font-weight:800;margin-bottom:7px}.form-field input,.form-field textarea,.form-field select{width:100%;background:white;padding:11px 12px;border:1px solid #d9dce8;border-radius:9px;outline:none}.form-field textarea{min-height:94px;resize:vertical}.recording{background:#fae4e5;color:#a42138;padding:9px;border-radius:9px}.tag{display:inline-block;border-radius:10px;background:#f0f2fa;padding:7px 12px;margin:4px;font-size:12px;font-weight:600}.btn-row{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}.empty{border:1px dashed #cbd0dd;border-radius:14px;padding:26px;text-align:center;color:var(--muted)}.chartrow{margin:12px 0}.chartrow>div:first-child{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}.notice{background:#fff9e9;border-radius:12px;padding:14px;color:#725a27;font-size:12px;line-height:1.7}.bottom-nav{display:none}.quick-tip{border-radius:12px;background:#f3f4fd;padding:16px;font-size:13px;line-height:1.7}.test-score{font:800 48px Outfit;color:var(--violet)}.footer-note{font-size:11px;color:#98a0b1;margin-top:22px;line-height:1.6}@media(max-width:1000px){.app-shell{grid-template-columns:190px 1fr}.main{padding:25px}.coach-area{flex-basis:120px}.hero h2{font-size:25px}}@media(max-width:720px){.app-shell{display:block}.sidebar{display:none}.main{padding:23px 16px 100px}.grid,.module-grid{grid-template-columns:1fr}.hero{min-height:265px;padding:18px}.coach-area{flex-basis:105px}.hero h2{font-size:24px}.hero p{font-size:12px}.topbar h1{font-size:25px}.panel{padding:19px}.stats{gap:7px}.stat{padding:11px}.stat strong{font-size:23px}.stat span{font-size:10px}.comparison{grid-template-columns:1fr}.bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;background:white;border-top:1px solid var(--border);justify-content:space-around;padding:9px 4px calc(9px + env(safe-area-inset-bottom));z-index:10}.bottom-nav button{background:none;border:0;color:#8b93a5;font-size:10px;font-weight:700;padding:6px}.bottom-nav button.active{color:var(--violet)}.bottom-nav button b{display:block;font-size:19px;margin-bottom:3px}.coach-card{gap:10px}.coach-card .coach{width:85px}.identity{font-size:11px;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
