*{box-sizing:border-box}
:root{--ink:#172033;--muted:#6d7890;--bg:#f5f7fb;--card:#fff;--primary:#5b6cf8;--green:#20b486;--orange:#ff7b5b;--purple:#8b5cf6;--yellow:#f6b83f;--red:#e85c64;--line:#e6eaf1;--shadow:0 14px 34px rgba(31,47,82,.10)}
body{margin:0;background:var(--bg);font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink)}button,input{font:inherit}.app{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.sidebar{background:linear-gradient(180deg,#11182a,#161e34);color:#fff;padding:20px 14px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.brand{display:flex;gap:10px;align-items:center;padding:5px 8px 24px}.brand-logo{width:42px;height:42px;border-radius:14px;background:#232d49;display:grid;place-items:center;font-size:25px}.brand strong{display:block}.brand small{display:block;color:#a6b0c3;font-size:10px}
.nav-list{display:grid;gap:6px}.nav-btn{border:0;background:transparent;color:#aeb7ca;padding:11px 12px;border-radius:13px;text-align:left;display:flex;gap:10px;align-items:center;cursor:pointer}.nav-btn span{font-size:19px}.nav-btn b{font-size:13px}.nav-btn.active,.nav-btn:hover{background:#232c47;color:#fff}.sidebar-bottom{margin-top:auto;display:grid;gap:7px}.side-action{border:1px solid #39435f;background:#1d263f;color:#d9deea;padding:9px;border-radius:10px;cursor:pointer;font-size:12px}.side-action.danger{color:#ffb6b6}
.content{max-width:1500px;width:100%;padding:24px 30px 48px;margin:auto}.topbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:22px}.topbar h1{margin:0 0 4px;font-size:24px}.topbar p{margin:0;color:var(--muted);font-size:13px}.profile-card{display:flex;align-items:center;gap:10px;background:#fff;border-radius:18px;padding:9px 12px;box-shadow:var(--shadow)}.avatar{font-size:28px}.profile-name small,.xp-box small{display:block;color:var(--muted);font-size:9px}.profile-name input{border:0;outline:0;width:115px;font-weight:800}.xp-box{border-left:1px solid var(--line);padding-left:11px;text-align:center}.xp-box b{display:block;color:var(--primary)}
.view{display:none}.view.active{display:block}.hidden{display:none!important}.eyebrow{display:inline-flex;padding:7px 11px;border-radius:999px;background:#e8ebff;color:#4656d6;font-size:11px;font-weight:850}.muted{color:var(--muted);font-size:12px;line-height:1.55}
.assessment-gate{min-height:390px;border-radius:28px;background:linear-gradient(135deg,#edf2ff,#f2ebff);padding:42px;display:grid;grid-template-columns:1.05fr .95fr;box-shadow:var(--shadow)}.gate-copy h2{font-size:40px;line-height:1.08;margin:15px 0}.gate-copy h2 em{font-style:normal;color:var(--primary)}.gate-copy p{color:#536078;font-size:16px;line-height:1.65}.gate-visual{display:grid;place-items:center;position:relative}.radar-icon{width:180px;height:180px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:85px;box-shadow:var(--shadow);animation:pulse 2.2s ease-in-out infinite}.mini-bubbles span{position:absolute;width:52px;height:52px;border-radius:16px;background:#fff;display:grid;place-items:center;font-size:25px;box-shadow:var(--shadow)}.mini-bubbles span:nth-child(1){top:20px;left:22%}.mini-bubbles span:nth-child(2){top:35px;right:15%}.mini-bubbles span:nth-child(3){bottom:35px;left:17%}.mini-bubbles span:nth-child(4){bottom:20px;right:15%}.mini-bubbles span:nth-child(5){right:2%;top:47%}@keyframes pulse{50%{transform:scale(1.05)}}
.btn{border:0;border-radius:13px;padding:12px 17px;font-weight:850;cursor:pointer}.btn.primary{background:var(--primary);color:#fff}.btn.ghost{background:#fff;border:1px solid #d9dfeb;color:#34405a}.hero{min-height:315px;border-radius:28px;padding:38px;background:linear-gradient(135deg,#edf2ff,#f3edff);display:grid;grid-template-columns:1.05fr .95fr;box-shadow:var(--shadow)}.hero h2{font-size:38px;line-height:1.1;margin:15px 0}.hero h2 em{font-style:normal;color:var(--primary)}.hero p{color:#536078;line-height:1.6}.hero-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}.mastery-wheel{width:225px;height:225px;border-radius:50%;border:18px solid rgba(91,108,248,.17);position:relative;margin:auto}.wheel-center{position:absolute;inset:40px;border-radius:50%;background:#fff;display:grid;place-items:center;align-content:center;box-shadow:var(--shadow)}.wheel-center b{font-size:35px;color:var(--primary)}.wheel-center small{font-size:9px;color:var(--muted)}.wheel-label{position:absolute;width:43px;height:43px;background:#fff;border-radius:14px;display:grid;place-items:center;box-shadow:var(--shadow);font-size:22px}.w1{left:-25px;top:80px}.w2{right:-25px;top:80px}.w3{top:-24px;left:73px}.w4{bottom:-24px;left:35px}.w5{bottom:-24px;right:35px}
.quick-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0}.stat-card{background:#fff;border-radius:17px;padding:15px;display:flex;gap:11px;align-items:center;box-shadow:var(--shadow)}.stat-card>span{font-size:27px}.stat-card b{display:block;font-size:18px}.stat-card small{display:block;color:var(--muted);font-size:10px}.home-grid,.analysis-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px}.panel,.practice-card,.coach-card{background:#fff;border-radius:21px;padding:21px;box-shadow:var(--shadow)}
.baseline-compare{display:grid;gap:9px;margin-top:12px}.compare-row{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:10px;align-items:center;background:#f7f8fb;border-radius:12px;padding:10px}.compare-row small{color:var(--muted)}.delta-up{color:var(--green);font-weight:900}.delta-flat{color:#8992a4;font-weight:900}.recommend-card{background:#f8f9fc;border:1px solid var(--line);border-radius:15px;padding:14px}.recommend-card b{display:block}.recommend-card p{color:var(--muted);font-size:11px;line-height:1.5}
.assessment-domains{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:18px 0}.assessment-domains>div{background:#f7f8fb;border-radius:14px;padding:14px;text-align:center;font-size:28px}.assessment-domains b{display:block;font-size:11px;margin-top:7px}.assessment-domains small{display:block;color:var(--muted);font-size:8px;margin-top:2px}
.practice-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.practice-top h2{margin:9px 0 2px}.practice-top p{margin:0;color:var(--muted);font-size:11px}.mini-metrics{display:flex;gap:7px}.mini-metrics>div{background:#f6f8fc;border-radius:12px;padding:9px 10px;text-align:center;min-width:65px}.mini-metrics b{display:block}.mini-metrics small{font-size:8px;color:var(--muted)}.question-box{text-align:center;margin:24px 0 15px}.question-visual{font-size:32px;min-height:40px}.question-text{font-size:46px;font-weight:950;margin:10px 0}.story-context{max-width:720px;margin:auto;color:#45536c;font-size:16px;line-height:1.55}.answer-area{display:flex;gap:9px;justify-content:center;flex-wrap:wrap}.answer-btn{min-width:85px;border:2px solid #e0e5ed;background:#fff;border-radius:14px;padding:12px 15px;font-size:20px;font-weight:950;cursor:pointer}.feedback{text-align:center;min-height:25px;margin-top:14px;color:var(--muted);font-weight:800;font-size:12px}
#assessmentResult{margin-top:14px}.assessment-summary{background:#fff;border-radius:22px;padding:22px;box-shadow:var(--shadow)}.domain-result-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin:14px 0}.domain-result{background:#f7f8fb;border-radius:14px;padding:12px;text-align:center}.domain-result b{display:block;font-size:16px}.domain-result small{color:var(--muted);font-size:8px}.level-pill{display:inline-flex;padding:5px 8px;border-radius:999px;background:#edf0ff;color:#4857d3;font-size:9px;font-weight:900}
.program-head{display:flex;justify-content:space-between;align-items:flex-start}.program-head h2{margin:9px 0 3px}.program-head p{margin:0;color:var(--muted);font-size:11px}.program-progress{width:80px;height:80px;border-radius:50%;background:#edf0ff;display:grid;place-items:center;align-content:center;color:#4452cd}.program-progress b{font-size:22px}.program-progress small{font-size:8px}.plan-banner{margin-top:13px;background:#f3f5ff;border-left:4px solid var(--primary);border-radius:12px;padding:12px;font-size:11px}.day-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:14px}.day-card{border:1px solid var(--line);background:#fff;border-radius:14px;padding:11px;display:flex;align-items:center;gap:9px;text-align:left;cursor:pointer}.day-card.done{background:#eafaf4;border-color:#c0eadb}.day-card.current{border-color:#9aa6ff;box-shadow:0 0 0 2px rgba(91,108,248,.12)}.day-number{min-width:33px;height:33px;border-radius:10px;background:#edf0f6;display:grid;place-items:center;font-weight:950}.day-content{flex:1}.day-content b{display:block;font-size:11px}.day-content small{display:block;color:var(--muted);font-size:8px;margin-top:2px}.day-status{font-size:8px;font-weight:900;color:var(--primary)}
.practice-layout{display:grid;grid-template-columns:1fr 290px;gap:14px}.coach-card{text-align:center}.coach{font-size:66px}.coach-card h3{margin:4px 0}.coach-card>p{color:var(--muted);font-size:11px;line-height:1.5}.session-box{margin-top:15px;background:#f7f8fb;border-radius:14px;padding:12px;text-align:left}.session-box>small{font-size:8px;color:var(--muted)}.session-box>div{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--line);font-size:10px}.session-result{margin-top:14px;background:#fff;border-radius:21px;padding:20px;box-shadow:var(--shadow)}.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.result-grid>div{background:#f7f8fb;border-radius:13px;padding:12px;text-align:center}.result-grid b{display:block;font-size:18px}.result-grid small{font-size:8px;color:var(--muted)}.result-reco{margin-top:12px;background:#fff6df;border-left:4px solid var(--yellow);border-radius:12px;padding:12px;font-size:11px}
.weekly-header h2{margin:9px 0 3px}.weekly-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:13px}.week-card{background:#fff;border-radius:18px;padding:16px;box-shadow:var(--shadow)}.week-card h3{margin:5px 0}.week-card small{color:var(--muted)}.week-metric{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--line);font-size:10px}.week-action{margin-top:10px;background:#f7f8fb;border-radius:10px;padding:9px;font-size:9px;color:#556078;line-height:1.4}.weekly-trend{display:grid;gap:9px;margin-top:12px}.trend-row{display:grid;grid-template-columns:1fr repeat(5,.65fr);gap:7px;align-items:center;background:#f7f8fb;border-radius:11px;padding:9px;font-size:10px}.trend-row.header{font-weight:900;background:#edf0f6}
.analysis-header{display:flex;justify-content:space-between;align-items:flex-start}.analysis-header h2{margin:9px 0 3px}.analysis-header p{margin:0;color:var(--muted);font-size:11px}.analysis-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:13px 0}.analysis-kpis>div{background:#fff;border-radius:16px;padding:14px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow)}.analysis-kpis>div>span{font-size:25px}.analysis-kpis b{display:block;font-size:17px}.analysis-kpis small{display:block;color:var(--muted);font-size:8px}.skill-table{display:grid;gap:7px;margin-top:11px}.skill-row{display:grid;grid-template-columns:1.2fr .6fr .6fr .7fr;gap:7px;align-items:center;background:#f7f8fb;border-radius:11px;padding:9px;font-size:10px}.skill-row.header{background:#edf0f6;font-weight:900}.status-badge{display:inline-flex;padding:5px 7px;border-radius:999px;font-size:8px;font-weight:900}.status-strong{background:#dcf7eb;color:#16825f}.status-develop{background:#fff2d9;color:#a56d00}.status-weak{background:#ffe5e7;color:#b53a46}.recommendations{display:grid;gap:8px;margin-top:11px}.reco-item{border:1px solid var(--line);border-radius:12px;padding:11px}.reco-item b{display:block;font-size:11px}.reco-item p{margin:3px 0 0;color:var(--muted);font-size:9px;line-height:1.45}.session-history{display:grid;gap:7px;margin-top:9px}.history-row{display:grid;grid-template-columns:65px 1.2fr .55fr .55fr;gap:7px;background:#f7f8fb;border-radius:11px;padding:9px;font-size:9px}.mt16{margin-top:14px}
@media(max-width:1050px){.day-grid{grid-template-columns:repeat(2,1fr)}.weekly-cards{grid-template-columns:repeat(2,1fr)}.home-grid,.analysis-grid,.practice-layout{grid-template-columns:1fr}}
@media(max-width:820px){.app{grid-template-columns:1fr}.sidebar{position:relative;height:auto;padding:10px}.brand{padding-bottom:10px}.nav-list{grid-template-columns:repeat(6,1fr)}.nav-btn{justify-content:center;padding:9px 4px}.nav-btn b{display:none}.sidebar-bottom{display:none}.content{padding:14px}.topbar p{display:none}.assessment-gate,.hero{grid-template-columns:1fr;padding:24px}.gate-visual,.mastery-wheel{display:none}.quick-stats,.analysis-kpis{grid-template-columns:repeat(2,1fr)}.assessment-domains{grid-template-columns:repeat(2,1fr)}.domain-result-grid{grid-template-columns:repeat(2,1fr)}.day-grid{grid-template-columns:1fr}.weekly-cards{grid-template-columns:1fr}.trend-row{grid-template-columns:1fr repeat(2,.6fr)}.trend-row>*:nth-child(n+4){display:none}.question-text{font-size:38px}}