:root{--red: rgb(16, 119, 229);--red-dark: rgb(2, 48, 173);--bg: #ffffff;--panel: #f6f8fb;--text: #2c2c2c;--muted: #8c8c8c;--line: #eaeaea;--done: #1d7d3c;--radius: 20px;--shadow: 0 10px 24px rgba(0, 0, 0, .15);--shadow-soft: 0 6px 16px rgba(0, 0, 0, .06)}*{box-sizing:border-box}html,body,#app{height:100%}body{margin:0;background:var(--panel);color:var(--text);font-family:system-ui,Segoe UI,Roboto,Ubuntu,sans-serif;line-height:1.5;-webkit-text-size-adjust:100%}.shell{min-height:100%;display:grid;grid-template-rows:auto 1fr}.header{display:flex;align-items:center;justify-content:center;height:72px;background:var(--bg);box-shadow:0 3px 6px #00000014;position:sticky;top:0;z-index:5}.header .logo{height:44px}.content{min-height:0}.wrap{max-width:34rem;margin:0 auto;padding:16px 14px 40px}.screen-title{margin:4px 0 16px;text-align:center}.screen-title h1{margin:0;font-size:24px;line-height:1.15;font-weight:900}.screen-title .subtitle{margin:6px 0 0;color:var(--muted);font-weight:600;font-size:14px}.screen-title .accent{width:64px;height:4px;border-radius:999px;background:var(--red);margin:12px auto 0}.card{background:var(--bg);border-radius:22px;box-shadow:var(--shadow-soft);padding:16px;margin-bottom:12px}button,.btn{appearance:none;border:none;background:var(--red);color:#fff;font:inherit;font-weight:700;font-size:16px;padding:14px 20px;border-radius:18px;box-shadow:var(--shadow-soft);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}button:disabled,.btn:disabled{background:#cfcfcf;color:#fff;box-shadow:none;cursor:not-allowed}.btn--ghost,button.secondary{background:var(--bg);color:var(--red);border:2px solid var(--red);box-shadow:none}.btn--block{display:flex;width:100%}.course{display:flex;gap:14px;align-items:center;padding:14px 16px;color:inherit}.course__body{min-width:0;flex:1}.course__title{font-weight:800;display:block}.course__meta{color:var(--muted);font-size:14px}.course__go{color:var(--red);font-size:22px;line-height:1;font-weight:900}.tick{width:2rem;height:2rem;flex:none;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;font-size:.95rem;font-weight:900;color:#fff}.tick--done{background:var(--done);border-color:var(--done)}.state{text-align:center;padding:3rem 1rem;color:var(--muted)}.state__title{color:var(--text);font-weight:800;margin-bottom:.35rem}.muted{color:var(--muted)}
