:root {
  --color-bg: #f3f8ff; --color-surface: #fff; --color-glass: rgba(255,255,255,.66);
  --color-primary: #0878ff; --color-secondary: #7657ff; --color-cyan: #19bee8;
  --color-success: #18b876; --color-danger: #ef5261; --color-warning: #f5a524;
  --color-text: #15213b; --color-muted: #71809d; --color-line: rgba(86,112,156,.15);
  --radius-sm: 14px; --radius-md: 20px; --radius-lg: 28px; --radius-xl: 36px;
  --shadow-soft: 0 8px 28px rgba(49,84,145,.10); --shadow-card: 0 16px 42px rgba(45,76,130,.14);
  --blur-glass: 22px; --content-width: 1120px; --nav-height: 76px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--color-text);font:15px/1.55 -apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;background:radial-gradient(circle at 80% 0%,rgba(77,194,255,.22),transparent 30%),linear-gradient(145deg,#f8fbff,#edf5ff 58%,#f6f1ff);transition:background .3s,color .3s}button,input,select,textarea{font:inherit}button,a{tap-highlight-color:transparent}a{text-decoration:none;color:inherit}.ambient{position:fixed;border-radius:50%;filter:blur(3px);opacity:.72;z-index:-1}.ambient-one{width:240px;height:240px;right:-90px;top:16%;background:rgba(100,84,255,.18)}.ambient-two{width:200px;height:200px;left:-90px;bottom:12%;background:rgba(17,191,232,.16)}.app-shell{min-height:100vh;padding:14px 14px calc(var(--nav-height) + 32px)}.glass{background:var(--color-glass);backdrop-filter:blur(var(--blur-glass)) saturate(1.25);-webkit-backdrop-filter:blur(var(--blur-glass)) saturate(1.25);border:1px solid rgba(255,255,255,.75);box-shadow:var(--shadow-soft)}.topbar{position:sticky;top:10px;z-index:10;max-width:var(--content-width);height:66px;margin:0 auto 22px;padding:10px 12px;border-radius:22px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:10px;align-items:center}.brand-mark{display:grid;place-items:center;width:44px;height:44px;color:white;border-radius:15px;background:linear-gradient(145deg,var(--color-primary),var(--color-secondary));box-shadow:0 8px 20px rgba(38,111,255,.28)}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.brand-mark svg{width:29px}.brand strong,.brand small{display:block}.brand strong{font-size:16px;letter-spacing:-.3px}.brand small{font-size:11px;color:var(--color-muted)}.topbar-actions{display:flex;align-items:center;gap:6px}.connection-pill,.badge,.eyebrow{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:99px;font-size:11px;font-weight:700;letter-spacing:.02em}.connection-pill{color:var(--color-success);background:rgba(24,184,118,.1)}.connection-pill span{width:7px;height:7px;border-radius:50%;background:currentColor}.connection-pill.offline{color:var(--color-warning)}.icon-button{border:0;width:42px;height:42px;display:grid;place-items:center;color:var(--color-text);background:transparent;border-radius:14px;cursor:pointer;transition:.2s}.icon-button:hover{background:rgba(89,118,171,.10)}.icon-button svg{width:21px}.app-content{max-width:var(--content-width);margin:auto}.page{animation:page-in .34s ease}.page-head{margin:2px 2px 20px}.page-head h1,.hero h1{margin:5px 0 4px;font-size:clamp(28px,7vw,46px);line-height:1.08;letter-spacing:-1.5px}.page-head p,.hero p,.muted{margin:0;color:var(--color-muted)}.eyebrow{padding:0;text-transform:uppercase;color:var(--color-primary);letter-spacing:.12em}.card{border:1px solid rgba(255,255,255,.86);border-radius:var(--radius-md);background:rgba(255,255,255,.82);box-shadow:var(--shadow-soft)}.hero{position:relative;overflow:hidden;padding:25px;border-radius:var(--radius-lg);color:#fff;background:linear-gradient(135deg,#0878ff 0%,#596dff 58%,#8359ff 100%);box-shadow:0 22px 44px rgba(55,91,215,.27)}.hero:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-52px;top:-70px;border:25px solid rgba(255,255,255,.12)}.hero p{max-width:500px;color:rgba(255,255,255,.78)}.hero .eyebrow{color:#dff4ff}.hero-actions,.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.button{min-height:48px;padding:0 17px;border:0;border-radius:15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;color:white;background:linear-gradient(135deg,var(--color-primary),#536bff);font-weight:750;cursor:pointer;box-shadow:0 8px 18px rgba(27,109,241,.2);transition:transform .2s,box-shadow .2s,opacity .2s}.button:hover{transform:translateY(-2px);box-shadow:0 12px 22px rgba(27,109,241,.27)}.button:disabled{opacity:.5;transform:none}.button-secondary{color:var(--color-primary);background:rgba(8,120,255,.1);box-shadow:none}.button-white{color:#1765c5;background:white}.button-ghost{color:var(--color-text);background:rgba(255,255,255,.58);box-shadow:none}.grid{display:grid;gap:14px}.dashboard-grid{margin-top:15px}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:15px}.stat-card{padding:16px}.stat-card strong{display:block;font-size:23px;letter-spacing:-.8px}.stat-card small{color:var(--color-muted)}.section-title{display:flex;align-items:end;justify-content:space-between;margin:27px 2px 11px}.section-title h2{margin:0;font-size:19px;letter-spacing:-.5px}.section-title a{font-size:13px;color:var(--color-primary);font-weight:700}.progress-row{display:grid;gap:7px;padding:13px 0}.progress-row-head{display:flex;justify-content:space-between;font-size:13px;font-weight:700}.progress-track{overflow:hidden;height:8px;border-radius:10px;background:rgba(100,125,165,.12)}.progress-bar{height:100%;border-radius:10px;background:linear-gradient(90deg,var(--color-primary),var(--color-cyan))}.progress-card{padding:15px 17px}.feature-card,.lesson-card,.formula-card,.exam-card{padding:18px}.feature-card{position:relative;overflow:hidden;min-height:145px}.feature-card h3,.lesson-card h3,.formula-card h3,.exam-card h3{margin:8px 0 4px;font-size:17px;letter-spacing:-.3px}.feature-card p,.lesson-card p,.formula-card p,.exam-card p{margin:0;color:var(--color-muted);font-size:13px}.feature-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;color:var(--color-primary);background:rgba(8,120,255,.1)}.feature-icon svg{width:23px}.badge{color:var(--color-primary);background:rgba(8,120,255,.10)}.badge.success{color:var(--color-success);background:rgba(24,184,118,.10)}.badge.warning{color:#b87500;background:rgba(245,165,36,.15)}.badge.danger{color:var(--color-danger);background:rgba(239,82,97,.10)}.list{display:grid;gap:11px}.lesson-card,.formula-card,.exam-card{cursor:pointer;transition:transform .2s,box-shadow .2s}.lesson-card:hover,.formula-card:hover,.exam-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card)}.card-top{display:flex;align-items:start;justify-content:space-between;gap:10px}.quiz-shell{max-width:780px;margin:auto}.quiz-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.quiz-card{padding:18px}.quiz-card h2{font-size:clamp(20px,5vw,27px);line-height:1.25;letter-spacing:-.6px}.answers{display:grid;gap:10px;margin-top:20px}.answer{display:flex;gap:12px;width:100%;padding:14px;text-align:left;color:var(--color-text);border:1px solid var(--color-line);border-radius:16px;background:rgba(255,255,255,.72);cursor:pointer;transition:.2s}.answer:hover{border-color:rgba(8,120,255,.5);transform:translateY(-1px)}.answer-letter{flex:0 0 auto;display:grid;place-items:center;width:29px;height:29px;border-radius:10px;background:rgba(8,120,255,.09);color:var(--color-primary);font-weight:800}.answer.correct{border-color:rgba(24,184,118,.5);background:rgba(24,184,118,.09)}.answer.wrong{border-color:rgba(239,82,97,.5);background:rgba(239,82,97,.08)}.feedback{margin-top:14px;padding:15px;border-radius:15px;background:rgba(8,120,255,.07)}.filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 15px}.pill{min-height:40px;padding:0 14px;border:1px solid var(--color-line);border-radius:99px;color:var(--color-text);background:rgba(255,255,255,.62);cursor:pointer;font-weight:700}.pill.active{color:#fff;border-color:transparent;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary))}.ring{--value:60;display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:conic-gradient(var(--color-cyan) calc(var(--value)*1%),rgba(255,255,255,.17) 0);position:relative}.ring:after{content:"";position:absolute;inset:9px;border-radius:50%;background:#4c70f6}.ring span{position:relative;z-index:1;font-size:21px;font-weight:800}.hero-progress{display:flex;align-items:center;gap:19px;margin-top:21px}.formula-display{padding:18px;margin:14px 0;border-radius:16px;text-align:center;font-size:24px;font-weight:800;color:var(--color-primary);background:linear-gradient(135deg,rgba(8,120,255,.08),rgba(118,87,255,.09))}.lesson-block{margin:12px 0;padding:14px;border-left:3px solid var(--color-primary);border-radius:0 14px 14px 0;background:rgba(8,120,255,.06)}.lesson-block.tip{border-color:var(--color-success);background:rgba(24,184,118,.07)}.lesson-block.warning{border-color:var(--color-warning);background:rgba(245,165,36,.08)}.input{width:100%;min-height:48px;padding:0 14px;border:1px solid var(--color-line);border-radius:14px;color:var(--color-text);background:rgba(255,255,255,.65);outline:0}.input:focus{border-color:var(--color-primary);box-shadow:0 0 0 4px rgba(8,120,255,.12)}.empty-state{text-align:center;padding:31px}.empty-state .feature-icon{margin:0 auto 13px}.bottom-nav{position:fixed;z-index:20;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));height:var(--nav-height);max-width:620px;margin:auto;border-radius:24px;display:flex;align-items:center;justify-content:space-around;padding:5px}.bottom-nav a{display:grid;place-items:center;gap:3px;min-width:55px;color:var(--color-muted);font-size:10px;font-weight:750;transition:.2s}.bottom-nav svg{width:23px}.bottom-nav a.active{color:var(--color-primary)}.toast-region{position:fixed;z-index:60;top:94px;left:14px;right:14px;display:grid;justify-items:center;gap:8px;pointer-events:none}.toast{padding:11px 15px;border-radius:14px;color:white;background:#24304a;box-shadow:var(--shadow-card);animation:toast-in .25s ease}.modal-backdrop{position:fixed;z-index:50;inset:0;display:grid;place-items:end center;padding:12px;background:rgba(18,30,55,.3);backdrop-filter:blur(5px)}.modal-backdrop[hidden]{display:none}.modal{position:relative;width:min(100%,680px);max-height:86vh;overflow:auto;padding:22px;border-radius:28px}.modal-close{position:absolute;right:12px;top:11px;font-size:28px}.loading-state{max-width:600px;margin:60px auto;padding:22px}.skeleton{height:16px;margin:10px 0;border-radius:10px;background:linear-gradient(90deg,#edf2fb,#fff,#edf2fb);background-size:200%;animation:shimmer 1.2s infinite}.skeleton-title{width:55%;height:28px}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--color-line)}.switch{width:50px;height:30px;padding:3px;border:0;border-radius:99px;background:#b8c3d7;cursor:pointer}.switch span{display:block;width:24px;height:24px;border-radius:50%;background:white;transition:.2s}.switch.active{background:var(--color-primary)}.switch.active span{transform:translateX(20px)}.desktop-grid{display:grid;gap:14px}.only-desktop{display:none}@keyframes page-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes shimmer{to{background-position:-200%}}@keyframes toast-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}:focus-visible{outline:3px solid rgba(8,120,255,.42);outline-offset:3px}
@media(min-width:720px){.app-shell{padding:20px 22px calc(var(--nav-height) + 38px)}.topbar{height:72px}.dashboard-grid{grid-template-columns:1.35fr .65fr}.desktop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.only-desktop{display:block}.modal-backdrop{place-items:center}}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--color-bg:#0e1629;--color-surface:#172239;--color-glass:rgba(21,32,54,.68);--color-text:#ecf4ff;--color-muted:#9eacc6;--color-line:rgba(182,202,238,.14)}:root:not([data-theme=light]) body{background:radial-gradient(circle at 80% 0%,rgba(33,118,198,.25),transparent 30%),linear-gradient(145deg,#10182b,#111c31 58%,#181630)}:root:not([data-theme=light]) .card,:root:not([data-theme=light]) .answer,:root:not([data-theme=light]) .input,:root:not([data-theme=light]) .pill{background:rgba(24,37,62,.8)}}
:root[data-theme=dark]{--color-bg:#0e1629;--color-surface:#172239;--color-glass:rgba(21,32,54,.68);--color-text:#ecf4ff;--color-muted:#9eacc6;--color-line:rgba(182,202,238,.14)}:root[data-theme=dark] body{background:radial-gradient(circle at 80% 0%,rgba(33,118,198,.25),transparent 30%),linear-gradient(145deg,#10182b,#111c31 58%,#181630)}:root[data-theme=dark] .card,:root[data-theme=dark] .answer,:root[data-theme=dark] .input,:root[data-theme=dark] .pill{background:rgba(24,37,62,.8)}
.class-badge{margin-left:4px;color:#6346db;background:rgba(118,87,255,.12)}.question-visual{margin:14px 0;padding:10px;border:1px solid var(--color-line);border-radius:16px;background:rgba(255,255,255,.7)}.question-visual img{display:block;width:100%;height:auto;border-radius:10px}.question-visual figcaption{margin-top:7px;color:var(--color-muted);font-size:11px}
.button-danger{background:linear-gradient(135deg,var(--color-danger),#d83656)}.login-page{display:grid;min-height:100vh;padding:18px}.login-shell{display:grid;place-items:center;width:100%}.login-card{width:min(100%,430px);padding:28px;border-radius:var(--radius-lg)}.login-card h1{margin:12px 0 6px;font-size:clamp(29px,8vw,42px);line-height:1.08;letter-spacing:-1.3px}.login-card p{margin:0;color:var(--color-muted)}.login-mark{display:grid;margin-bottom:18px}.login-form{display:grid;gap:15px;margin-top:22px}.login-form label{display:grid;gap:6px;color:var(--color-muted);font-size:13px;font-weight:700}.login-error{margin-top:15px;padding:11px 13px;border-radius:12px;color:var(--color-danger);background:rgba(239,82,97,.1);font-weight:700}
