:root{--bg-1: #7fa8ff;--bg-2: #ff9ecb;--bg-3: #a78bfa;--bg-4: #5eead4;--bg-base: linear-gradient(160deg, #cfe0ff 0%, #ffd9ec 38%, #dcd2ff 68%, #d2f4e6 100%);--glass: rgba(255, 255, 255, .72);--glass-strong: rgba(255, 255, 255, .9);--glass-border: rgba(255, 255, 255, .9);--text: #0d0d14;--text-2: #33333f;--text-3: #3d3d4a;--text-4: #6c6c7c;--accent: #0a84ff;--danger: #f87171;--beginner: #10b981;--intermediate: #f59e0b;--advanced: #f87171;--radius-lg: 24px;--radius-md: 16px;--radius-sm: 10px;--blur: blur(30px) saturate(190%);--shadow: 0 12px 34px rgba(60, 70, 140, .16)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100%}body{font-family:system-ui,-apple-system,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg-base);background-attachment:fixed;color:var(--text);line-height:1.5}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}.glass{background:var(--glass);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);border:1px solid var(--glass-border);box-shadow:var(--shadow),inset 0 1px #fff,inset 0 -1px #fff6}.glass-strong{background:var(--glass-strong)}.page{max-width:1200px;margin:0 auto;padding:24px 20px 60px}.btn{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#fff;border-radius:999px;padding:8px 18px;font-weight:600;font-size:14px;transition:transform .15s ease,opacity .15s ease}.btn:active{transform:scale(.97)}.btn.ghost{background:#ffffffd9;color:var(--text)}.btn.danger{background:var(--danger)}.btn.small{padding:5px 12px;font-size:12px}.pill{border-radius:999px;padding:5px 14px;font-size:13px;font-weight:600;background:#ffffff80;color:var(--text-3)}.pill.active{background:var(--glass-strong);border:1px solid rgba(255,255,255,.95);color:var(--text)}.card{border-radius:var(--radius-lg);overflow:hidden;background:var(--glass)}.muted{color:var(--text-4)}.row{display:flex;gap:10px;align-items:center}.field{width:100%;padding:10px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.9);background:#fffc;font:inherit;color:var(--text)}.field:focus{outline:2px solid var(--accent);outline-offset:1px}@media(max-width:768px){.page{padding:16px 12px 40px}.stack-on-mobile{flex-direction:column!important}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@media(prefers-reduced-transparency:reduce){.glass,.glass-strong{background:#fffffff5;backdrop-filter:none;-webkit-backdrop-filter:none}}