:root{--bg: var(--tg-theme-bg-color, #0f0f14);--surface: var(--tg-theme-secondary-bg-color, #1a1a22);--text: var(--tg-theme-text-color, #ffffff);--hint: var(--tg-theme-hint-color, #8a8a9a);--link: var(--tg-theme-link-color, #6c63ff);--primary: #4f46e5;--success: #10b981;--error: #ef4444;--accent: #f59e0b;--radius: 12px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,Inter,Segoe UI,Roboto,sans-serif;font-size:16px;overscroll-behavior-y:none}#app{max-width:560px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}.screen{flex:1;padding:16px}.center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:70vh;text-align:center}.spinner{width:28px;height:28px;border:3px solid var(--surface);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}.card{background:var(--surface);border-radius:var(--radius);padding:16px;margin-bottom:12px}.q-stem{font-size:18px;font-weight:600;line-height:1.4;margin:4px 0 16px}.q-image{width:100%;border-radius:var(--radius);margin-bottom:12px;background:#fff}.opt{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--surface);color:var(--text);border:1.5px solid transparent;border-radius:var(--radius);padding:14px 16px;margin-bottom:10px;font-size:16px;cursor:pointer;transition:border-color .15s,background .15s}.opt:disabled{cursor:default}.opt .letter{flex:0 0 28px;height:28px;border-radius:8px;background:#ffffff14;display:grid;place-items:center;font-weight:700;font-size:14px}.opt.correct{border-color:var(--success);background:color-mix(in srgb,var(--success) 16%,var(--surface))}.opt.wrong{border-color:var(--error);background:color-mix(in srgb,var(--error) 16%,var(--surface))}.btn{display:block;width:100%;border:none;border-radius:var(--radius);padding:15px;font-size:16px;font-weight:600;background:var(--primary);color:#fff;cursor:pointer}.btn:disabled{opacity:.5}.btn.secondary{background:var(--surface);color:var(--text)}.progress{font-size:13px;color:var(--hint);margin-bottom:8px}.verdict{font-weight:700;margin:12px 0 4px}.verdict.ok{color:var(--success)}.verdict.no{color:var(--error)}.explanation{color:var(--hint);font-size:14px;line-height:1.4}.tabs{display:flex;border-top:1px solid var(--surface);position:sticky;bottom:0;background:var(--bg)}.tab{flex:1;background:none;border:none;color:var(--hint);padding:12px;font-size:13px;cursor:pointer}.tab.active{color:var(--primary);font-weight:600}.lb-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--radius);background:var(--surface);margin-bottom:8px}.lb-row .badge{flex:0 0 32px;font-weight:700;text-align:center}.lb-row .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-row .score{color:var(--accent);font-weight:700}.lb-row.me{border:1.5px solid var(--primary)}.profile-header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--surface);position:sticky;top:0;z-index:10}.profile-header .avatar{flex:0 0 40px;height:40px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-weight:700;font-size:18px}.profile-header .profile-meta{min-width:0}.profile-header .profile-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile-header .profile-sub{font-size:12px;margin-top:2px}.len-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.daily-head{display:flex;justify-content:space-between;font-weight:600;margin-bottom:10px}.daily-track{display:flex;gap:6px;margin-bottom:12px}.daily-dot{flex:1;text-align:center;font-size:11px;padding:6px 0;border-radius:8px;background:#ffffff0f;color:var(--hint)}.daily-dot.done{background:color-mix(in srgb,var(--success) 22%,var(--surface));color:var(--text)}.daily-dot.current{background:var(--primary);color:#fff;font-weight:700}.daily-msg{margin:0}.opt.sel{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 16%,var(--surface))}.exam-bar{display:flex;align-items:center;gap:10px;padding:8px 0 12px;position:sticky;top:0;background:var(--bg);z-index:5}.exam-timer{font-weight:700;font-variant-numeric:tabular-nums}.exam-timer.low{color:var(--error)}.exam-bar .muted{flex:1;font-size:13px}.exam-finish{border:none;border-radius:8px;background:var(--error);color:#fff;font-weight:600;padding:8px 14px;cursor:pointer}.exam-select{width:100%;padding:12px;border-radius:var(--radius);background:var(--bg);color:var(--text);border:1px solid var(--hint);font-size:16px}.exam-nav-btns{display:flex;gap:10px;margin:4px 0 16px}.exam-nav-btns .btn{margin:0}.nav-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.nav-cell{aspect-ratio:1;border:none;border-radius:8px;background:var(--surface);color:var(--hint);font-size:13px;cursor:pointer}.nav-cell.answered{background:color-mix(in srgb,var(--success) 28%,var(--surface));color:var(--text)}.nav-cell.current{outline:2px solid var(--primary);color:var(--text)}.exam-score{text-align:center}.exam-ball{font-size:28px;font-weight:800;margin-bottom:4px}.video-frame{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:var(--radius);overflow:hidden;background:#000;margin-bottom:12px}.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.lesson-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--surface);color:var(--text);border:none;border-radius:var(--radius);padding:10px;margin-bottom:10px;cursor:pointer}.lesson-thumb{flex:0 0 96px;width:96px;aspect-ratio:16 / 9;border-radius:8px;object-fit:cover;background:#000}.lesson-meta{min-width:0}.lesson-title{font-weight:600;font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}.stat-card{background:var(--surface);border-radius:var(--radius);padding:14px 8px;text-align:center}.stat-value{font-size:20px;font-weight:700}.stat-label{font-size:12px;margin-top:4px}.ach-row{display:flex;align-items:center;gap:12px}.ach-icon{flex:0 0 28px;font-size:22px;text-align:center}.title{font-size:22px;font-weight:700;margin:8px 0 16px}.muted{color:var(--hint)}.chip{display:inline-block;background:#f59e0b29;color:var(--accent);padding:2px 10px;border-radius:999px;font-size:13px;font-weight:600}
