@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{--primary-50: #eef2ff;--primary-100: #e0e7ff;--primary-200: #c7d2fe;--primary-300: #a5b4fc;--primary-400: #818cf8;--primary-500: #6366f1;--primary-600: #4f46e5;--primary-700: #4338ca;--primary-800: #3730a3;--primary-900: #312e81;--primary: var(--primary-600);--primary-dark: var(--primary-700);--primary-light: var(--primary-400);--secondary-50: #f5f3ff;--secondary-100: #ede9fe;--secondary-200: #ddd6fe;--secondary-300: #c4b5fd;--secondary-400: #a78bfa;--secondary-500: #8b5cf6;--secondary-600: #7c3aed;--secondary-700: #6d28d9;--secondary-800: #5b21b6;--secondary-900: #4c1d95;--secondary: var(--secondary-500);--accent-emerald-500: #10b981;--accent-emerald-600: #059669;--accent-emerald: var(--accent-emerald-500);--accent-amber-500: #f59e0b;--accent-amber-600: #d97706;--accent-amber: var(--accent-amber-500);--accent-rose-500: #f43f5e;--accent-rose-600: #e11d48;--accent-rose: var(--accent-rose-500);--accent-cyan-500: #06b6d4;--accent-cyan-600: #0891b2;--accent-cyan: var(--accent-cyan-500);--success-bg: #dcfce7;--success-text: #166534;--success-border: #86efac;--warning-bg: #fef3c7;--warning-text: #92400e;--warning-border: #fcd34d;--error-bg: #fee2e2;--error-text: #991b1b;--error-border: #fca5a5;--info-bg: #cffafe;--info-text: #0e7490;--info-border: #67e8f9;--slate-50: #f8fafc;--slate-100: #f1f5f9;--slate-200: #e2e8f0;--slate-300: #cbd5e1;--slate-400: #94a3b8;--slate-500: #64748b;--slate-600: #475569;--slate-700: #334155;--slate-800: #1e293b;--slate-900: #0f172a;--slate-950: #020617;--text-primary: var(--slate-900);--text-secondary: var(--slate-600);--text-muted: var(--slate-500);--text-inverse: #ffffff;--bg-primary: #ffffff;--bg-secondary: var(--slate-50);--bg-tertiary: var(--slate-100);--bg-overlay: rgba(0, 0, 0, .5);--border: var(--slate-200);--border-light: var(--slate-100);--border-medium: var(--slate-300);--gradient-primary: linear-gradient(135deg, var(--primary-500) 0%, var(--primary-700) 100%);--gradient-secondary: linear-gradient(135deg, var(--secondary-500) 0%, var(--secondary-700) 100%);--gradient-hero: linear-gradient(135deg, var(--primary-600) 0%, var(--secondary-600) 50%, #d946ef 100%);--gradient-success: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);--gradient-warm: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);--gradient-cool: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);--gradient-subtle: linear-gradient(135deg, rgba(99, 102, 241, .05) 0%, rgba(139, 92, 246, .05) 100%);--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25);--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / .05);--shadow-primary: 0 4px 16px rgba(99, 102, 241, .2);--shadow-primary-lg: 0 8px 32px rgba(99, 102, 241, .3);--shadow-success: 0 4px 16px rgba(34, 197, 94, .2);--shadow-warning: 0 4px 16px rgba(245, 158, 11, .2);--shadow-error: 0 4px 16px rgba(239, 68, 68, .2);--spacing-0: 0;--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 12px;--spacing-4: 16px;--spacing-5: 20px;--spacing-6: 24px;--spacing-7: 28px;--spacing-8: 32px;--spacing-10: 40px;--spacing-12: 48px;--spacing-16: 64px;--spacing-20: 80px;--spacing-24: 96px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 24px;--radius-3xl: 32px;--radius-full: 9999px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--line-height-loose: 2;--letter-spacing-tight: -.025em;--letter-spacing-normal: 0;--letter-spacing-wide: .025em;--transition-instant: .1s;--transition-fast: .15s;--transition-normal: .2s;--transition-slow: .3s;--transition-slower: .5s;--ease-default: cubic-bezier(.4, 0, .2, 1);--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-out: cubic-bezier(0, 0, .2, 1);--ease-in-out: cubic-bezier(.4, 0, .6, 1);--ease-bounce: cubic-bezier(.68, -.55, .265, 1.55);--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--breakpoint-2xl: 1536px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-sans);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--text-primary);background-color:var(--bg-secondary);min-height:100vh}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--text-primary);margin:0}h1{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold)}h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}h5{font-size:var(--font-size-base)}h6{font-size:var(--font-size-sm)}p{margin:0;line-height:var(--line-height-relaxed)}a{color:var(--primary);text-decoration:none;transition:color var(--transition-fast) var(--ease-default)}a:hover{color:var(--primary-dark)}button{font-family:inherit;cursor:pointer;border:none;background:none}input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}.gap-1{gap:var(--spacing-1)}.gap-2{gap:var(--spacing-2)}.gap-3{gap:var(--spacing-3)}.gap-4{gap:var(--spacing-4)}.gap-5{gap:var(--spacing-5)}.gap-6{gap:var(--spacing-6)}.gap-8{gap:var(--spacing-8)}.p-1{padding:var(--spacing-1)}.p-2{padding:var(--spacing-2)}.p-3{padding:var(--spacing-3)}.p-4{padding:var(--spacing-4)}.p-5{padding:var(--spacing-5)}.p-6{padding:var(--spacing-6)}.p-8{padding:var(--spacing-8)}.px-2{padding-left:var(--spacing-2);padding-right:var(--spacing-2)}.px-3{padding-left:var(--spacing-3);padding-right:var(--spacing-3)}.px-4{padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.px-5{padding-left:var(--spacing-5);padding-right:var(--spacing-5)}.px-6{padding-left:var(--spacing-6);padding-right:var(--spacing-6)}.py-2{padding-top:var(--spacing-2);padding-bottom:var(--spacing-2)}.py-3{padding-top:var(--spacing-3);padding-bottom:var(--spacing-3)}.py-4{padding-top:var(--spacing-4);padding-bottom:var(--spacing-4)}.py-5{padding-top:var(--spacing-5);padding-bottom:var(--spacing-5)}.py-6{padding-top:var(--spacing-6);padding-bottom:var(--spacing-6)}.m-0{margin:0}.m-1{margin:var(--spacing-1)}.m-2{margin:var(--spacing-2)}.m-3{margin:var(--spacing-3)}.m-4{margin:var(--spacing-4)}.m-auto{margin:auto}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-top:var(--spacing-2);margin-bottom:var(--spacing-2)}.my-4{margin-top:var(--spacing-4);margin-bottom:var(--spacing-4)}.my-6{margin-top:var(--spacing-6);margin-bottom:var(--spacing-6)}.my-8{margin-top:var(--spacing-8);margin-bottom:var(--spacing-8)}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.block{display:block}.inline-block{display:inline-block}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.flex-grow-0{flex-grow:0}.w-full{width:100%}.h-full{height:100%}.min-h-screen{min-height:100vh}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-3xl{font-size:var(--font-size-3xl)}.font-normal{font-weight:var(--font-weight-normal)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.font-extrabold{font-weight:var(--font-weight-extrabold)}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-white{color:var(--text-inverse)}.text-primary-color{color:var(--primary)}.text-success{color:var(--success-text)}.text-warning{color:var(--warning-text)}.text-error{color:var(--error-text)}.leading-tight{line-height:var(--line-height-tight)}.leading-normal{line-height:var(--line-height-normal)}.leading-relaxed{line-height:var(--line-height-relaxed)}.bg-white{background-color:var(--bg-primary)}.bg-secondary{background-color:var(--bg-secondary)}.bg-tertiary{background-color:var(--bg-tertiary)}.bg-primary{background-color:var(--primary)}.bg-success{background-color:var(--success-bg)}.bg-warning{background-color:var(--warning-bg)}.bg-error{background-color:var(--error-bg)}.border{border:1px solid var(--border)}.border-0{border:none}.border-t{border-top:1px solid var(--border)}.border-b{border-bottom:1px solid var(--border)}.border-l{border-left:1px solid var(--border)}.border-r{border-right:1px solid var(--border)}.rounded-sm{border-radius:var(--radius-sm)}.rounded{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:var(--radius-full)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}.shadow-2xl{box-shadow:var(--shadow-2xl)}.shadow-primary{box-shadow:var(--shadow-primary)}.shadow-primary-lg{box-shadow:var(--shadow-primary-lg)}.shadow-none{box-shadow:none}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.inset-0{inset:0}.top-0{top:0}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}.transition{transition:all var(--transition-normal) var(--ease-default)}.transition-fast{transition:all var(--transition-fast) var(--ease-default)}.transition-slow{transition:all var(--transition-slow) var(--ease-default)}.transition-colors{transition:color var(--transition-fast) var(--ease-default),background-color var(--transition-fast) var(--ease-default),border-color var(--transition-fast) var(--ease-default)}.cursor-pointer{cursor:pointer}.cursor-not-allowed{cursor:not-allowed}.pointer-events-none{pointer-events:none}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-100{opacity:1}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.card{background:var(--bg-primary);border-radius:var(--radius-xl);border:1px solid var(--border);padding:var(--spacing-6);box-shadow:var(--shadow-sm);transition:all var(--transition-normal) var(--ease-default)}.card:hover{box-shadow:var(--shadow-md)}.card-flat{background:var(--bg-primary);border-radius:var(--radius-lg);border:1px solid var(--border);padding:var(--spacing-5)}.card-elevated{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--spacing-6);box-shadow:var(--shadow-lg);border:1px solid var(--border-light)}.card-compact{background:var(--bg-primary);border-radius:var(--radius-lg);border:1px solid var(--border);padding:var(--spacing-4)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-5);border-radius:var(--radius-lg);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);line-height:1;white-space:nowrap;transition:all var(--transition-fast) var(--ease-default);cursor:pointer;border:1px solid transparent;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn:active:not(:disabled){transform:scale(.98)}.btn-primary{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:var(--shadow-primary)}.btn-primary:hover:not(:disabled){background:var(--primary-dark);border-color:var(--primary-dark);box-shadow:var(--shadow-primary-lg);transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0) scale(.98)}.btn-primary-gradient{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow-primary)}.btn-primary-gradient:hover:not(:disabled){box-shadow:var(--shadow-primary-lg);transform:translateY(-2px)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border-color:var(--border)}.btn-secondary:hover:not(:disabled){background:var(--slate-200);border-color:var(--slate-300)}.btn-outline{background:transparent;color:var(--text-primary);border-color:var(--border)}.btn-outline:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--slate-300)}.btn-ghost{background:transparent;color:var(--text-secondary);border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--bg-tertiary);color:var(--text-primary)}.btn-danger{background:var(--error-bg);color:var(--error-text);border-color:var(--error-border)}.btn-danger:hover:not(:disabled){background:#fecaca;border-color:#f87171}.btn-success{background:var(--success-bg);color:var(--success-text);border-color:var(--success-border)}.btn-success:hover:not(:disabled){background:#bbf7d0;border-color:#86efac}.btn-sm{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-xs);border-radius:var(--radius-md)}.btn-lg{padding:var(--spacing-4) var(--spacing-6);font-size:var(--font-size-base);border-radius:var(--radius-xl)}.btn-xl{padding:var(--spacing-5) var(--spacing-8);font-size:var(--font-size-lg);border-radius:var(--radius-2xl)}.btn-block{width:100%}.btn-icon{padding:var(--spacing-3);aspect-ratio:1}.input{width:100%;padding:var(--spacing-3) var(--spacing-4);border:1px solid var(--border);border-radius:var(--radius-lg);font-size:var(--font-size-base);background:var(--bg-primary);color:var(--text-primary);transition:all var(--transition-fast) var(--ease-default)}.input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100)}.input::placeholder{color:var(--text-muted)}.input:disabled{background:var(--bg-tertiary);color:var(--text-muted);cursor:not-allowed}.input-error{border-color:var(--accent-rose-500)!important}.input-error:focus{box-shadow:0 0 0 3px #f43f5e1a!important}.input-sm{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm);border-radius:var(--radius-md)}.input-lg{padding:var(--spacing-4) var(--spacing-5);font-size:var(--font-size-lg);border-radius:var(--radius-xl)}.input-group{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-primary);transition:all var(--transition-fast) var(--ease-default)}.input-group:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-100)}.input-group .input{border:none;box-shadow:none}.input-group .input:focus{box-shadow:none}.input-group-text,.input-group-icon{padding:0 var(--spacing-3);color:var(--text-muted);display:flex;align-items:center}.textarea{min-height:100px;resize:vertical}.badge{display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-1) var(--spacing-3);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:1}.badge-primary{background:var(--primary-100);color:var(--primary-700)}.badge-secondary{background:var(--secondary-100);color:var(--secondary-700)}.badge-success{background:var(--success-bg);color:var(--success-text)}.badge-warning{background:var(--warning-bg);color:var(--warning-text)}.badge-error{background:var(--error-bg);color:var(--error-text)}.badge-neutral{background:var(--bg-tertiary);color:var(--text-secondary)}.badge-dot{width:8px;height:8px;border-radius:50%;background:currentColor}.progress{height:8px;background:var(--bg-tertiary);border-radius:var(--radius-full);overflow:hidden;position:relative}.progress-sm{height:4px}.progress-lg{height:12px}.progress-bar{height:100%;border-radius:var(--radius-full);background:var(--primary);transition:width var(--transition-slow) var(--ease-default)}.progress-bar-animated{position:relative;overflow:hidden}.progress-bar-animated:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-bar-success{background:var(--accent-emerald)}.progress-bar-warning{background:var(--accent-amber)}.progress-bar-error{background:var(--accent-rose)}.spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}.spinner-sm{width:16px;height:16px;border-width:1.5px}.spinner-lg{width:40px;height:40px;border-width:3px}.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-full);background:var(--primary-100);color:var(--primary-700);font-weight:var(--font-weight-semibold);overflow:hidden}.avatar-sm{width:32px;height:32px;font-size:var(--font-size-xs)}.avatar-md{width:40px;height:40px;font-size:var(--font-size-sm)}.avatar-lg{width:48px;height:48px;font-size:var(--font-size-base)}.avatar-xl{width:64px;height:64px;font-size:var(--font-size-lg)}.avatar-2xl{width:96px;height:96px;font-size:var(--font-size-2xl)}.avatar img{width:100%;height:100%;object-fit:cover}.avatar-ring{box-shadow:0 0 0 3px var(--bg-primary),0 0 0 5px var(--primary)}.divider{height:1px;background:var(--border);margin:var(--spacing-6) 0}.divider-vertical{width:1px;height:auto;background:var(--border);margin:0 var(--spacing-4)}.divider-with-text{display:flex;align-items:center;gap:var(--spacing-4);margin:var(--spacing-6) 0}.divider-with-text:before,.divider-with-text:after{content:"";flex:1;height:1px;background:var(--border)}.divider-with-text span{font-size:var(--font-size-sm);color:var(--text-muted);font-weight:var(--font-weight-medium)}.tabs{display:flex;gap:var(--spacing-1);padding:var(--spacing-1);background:var(--bg-tertiary);border-radius:var(--radius-lg)}.tab{flex:1;padding:var(--spacing-3) var(--spacing-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-secondary);text-align:center;cursor:pointer;transition:all var(--transition-fast) var(--ease-default);border:none;background:transparent}.tab:hover{color:var(--text-primary)}.tab.active{background:var(--bg-primary);color:var(--primary);box-shadow:var(--shadow-sm)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-25%)}}.animate-fadeIn{animation:fadeIn var(--transition-normal) var(--ease-default)}.animate-slideUp{animation:slideUp var(--transition-normal) var(--ease-default)}.animate-slideDown{animation:slideDown var(--transition-normal) var(--ease-default)}.animate-scaleIn{animation:scaleIn var(--transition-normal) var(--ease-default)}.animate-pulse{animation:pulse 2s ease-in-out infinite}.is-loading{position:relative;pointer-events:none;opacity:.6}.is-disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.is-hidden{display:none!important}.is-visible{display:block!important}.loading-state{display:flex;align-items:center;justify-content:center;min-height:200px;gap:var(--spacing-4)}.loading-state p{color:var(--text-muted);font-size:var(--font-size-sm)}.empty-state{text-align:center;padding:var(--spacing-12) var(--spacing-6);color:var(--text-secondary)}.empty-state-icon{width:80px;height:80px;margin:0 auto var(--spacing-6);background:var(--bg-tertiary);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.empty-state p{font-size:var(--font-size-sm);color:var(--text-muted)}.error-state{text-align:center;padding:var(--spacing-12) var(--spacing-6)}.error-state-icon{width:64px;height:64px;margin:0 auto var(--spacing-4);background:var(--error-bg);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;color:var(--error-text)}.error-state h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-2)}.error-state p{font-size:var(--font-size-sm);color:var(--text-muted);margin-bottom:var(--spacing-6)}.page-header{margin-bottom:var(--spacing-6)}.page-header h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--text-primary);margin-bottom:var(--spacing-2)}.page-header p{color:var(--text-secondary);font-size:var(--font-size-sm)}.page-header-actions{display:flex;gap:var(--spacing-3);margin-top:var(--spacing-4)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--spacing-4)}.container-sm{max-width:640px}.container-md{max-width:768px}.container-lg{max-width:1024px}.container-xl{max-width:1400px}@media(max-width:640px){.hide-mobile{display:none!important}}@media(min-width:641px)and (max-width:768px){.hide-tablet{display:none!important}}@media(min-width:769px){.hide-desktop,.show-mobile{display:none!important}}@media(max-width:768px){.show-desktop{display:none!important}}@media print{.no-print{display:none!important}.print-only{display:block!important}body{background:#fff}.card{box-shadow:none;border:1px solid #ddd}}.page{display:flex;flex-direction:column;gap:var(--spacing-6);width:100%;max-width:100%}.page-header-row{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-4);flex-wrap:wrap}.page-header-row h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--text-primary);margin-bottom:var(--spacing-1)}.page-header-row p{color:var(--text-secondary);font-size:var(--font-size-base)}.section{display:flex;flex-direction:column;gap:var(--spacing-4)}.section-header{display:flex;justify-content:space-between;align-items:center}.section-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary)}.section-link{display:inline-flex;align-items:center;gap:var(--spacing-1);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--primary);transition:color var(--transition-fast)}.section-link:hover{color:var(--primary-dark)}.stat-card{display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4);background:var(--bg-primary);border-radius:12px;box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.stat-card-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background:var(--primary-50);color:var(--primary);flex-shrink:0}.stat-card-icon.green{background:#dcfce7;color:#16a34a}.stat-card-icon.amber{background:#fef3c7;color:#d97706}.stat-card-icon.rose{background:#fee2e2;color:#dc2626}.stat-card-icon.violet{background:#f3e8ff;color:#7c3aed}.stat-card-content{flex:1;min-width:0}.stat-card-value{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--text-primary);line-height:1.2}.stat-card-label{font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:var(--spacing-1)}.highlight-card{display:flex;align-items:center;gap:var(--spacing-5);padding:var(--spacing-6);border-radius:var(--radius-xl);color:#fff}.highlight-card.primary{background:var(--gradient-primary);box-shadow:var(--shadow-primary-lg)}.highlight-card.success{background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 8px 32px #22c55e4d}.highlight-card.warning{background:linear-gradient(135deg,#f59e0b,#d97706);box-shadow:0 8px 32px #f59e0b4d}.highlight-card-icon{width:56px;height:56px;background:#fff3;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0}.highlight-card-content h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-1)}.highlight-card-content p{opacity:.9;font-size:var(--font-size-sm)}.action-card{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);text-decoration:none;color:var(--text-primary);transition:all var(--transition-fast)}.action-card:hover{border-color:var(--primary-200);background:var(--primary-50);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.action-card-icon{width:40px;height:40px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0}.action-card-icon.blue{background:var(--primary-100);color:var(--primary)}.action-card-icon.violet{background:#f3e8ff;color:#7c3aed}.action-card-icon.green{background:#dcfce7;color:#16a34a}.action-card-icon.amber{background:#fef3c7;color:#d97706}.action-card-icon.rose{background:#fee2e2;color:#dc2626}.action-card-icon.cyan{background:#cffafe;color:#0891b2}.action-card-content{flex:1;min-width:0}.action-card-title{font-weight:var(--font-weight-medium);font-size:var(--font-size-sm)}.action-card-meta{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:2px}.action-card-arrow{color:var(--text-muted);flex-shrink:0}.content-card{display:flex;flex-direction:column;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;text-decoration:none;color:var(--text-primary);transition:all var(--transition-normal)}.content-card:hover{border-color:var(--primary-200);transform:translateY(-2px);box-shadow:var(--shadow-md)}.content-card-cover{width:100%;height:120px;background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;color:#fff}.content-card-cover.completed{background:linear-gradient(135deg,#22c55e,#16a34a)}.content-card-body{padding:var(--spacing-5);display:flex;flex-direction:column;gap:var(--spacing-3)}.content-card-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.content-card-desc{font-size:var(--font-size-sm);color:var(--text-secondary);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.content-card-meta{display:flex;align-items:center;gap:var(--spacing-2);flex-wrap:wrap;margin-top:auto}.meta-tag{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:var(--bg-tertiary);border-radius:var(--radius-full);font-size:var(--font-size-xs);color:var(--text-muted)}.pagination{display:flex;justify-content:center;align-items:center;gap:var(--spacing-2);padding:var(--spacing-4) 0}.pagination-btn{display:inline-flex;align-items:center;gap:var(--spacing-1);padding:var(--spacing-2) var(--spacing-4);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-primary);color:var(--text-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.pagination-btn:hover:not(:disabled){border-color:var(--primary-200);background:var(--primary-50);color:var(--primary)}.pagination-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--bg-tertiary)}.pagination-numbers{display:flex;gap:var(--spacing-1);align-items:center}.pagination-number{min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;padding:0 var(--spacing-2);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-primary);color:var(--text-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.pagination-number:hover{border-color:var(--primary-200);background:var(--primary-50)}.pagination-number.active{background:var(--primary);border-color:var(--primary);color:#fff}.pagination-ellipsis{padding:0 var(--spacing-2);color:var(--text-muted)}.pagination-info{text-align:center;font-size:var(--font-size-sm);color:var(--text-muted);padding:var(--spacing-2) 0}.filter-group{display:flex;gap:var(--spacing-2);flex-wrap:wrap}.filter-pill{padding:var(--spacing-2) var(--spacing-4);border:1px solid var(--border);background:var(--bg-primary);border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast)}.filter-pill:hover{border-color:var(--primary-200);background:var(--primary-50);color:var(--primary)}.filter-pill.active{background:var(--primary);border-color:var(--primary);color:#fff}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-4)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-4)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-4)}.grid-auto{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-5)}.grid-auto-sm{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--spacing-4)}@media(max-width:768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.grid-2-mobile{grid-template-columns:repeat(2,1fr)}}.layout-2col{display:grid;grid-template-columns:1fr 320px;gap:var(--spacing-6);align-items:start}.layout-2col-main{display:flex;flex-direction:column;gap:var(--spacing-6);min-width:0}.layout-2col-aside{display:flex;flex-direction:column;gap:var(--spacing-5);min-width:0}@media(max-width:1024px){.layout-2col{grid-template-columns:1fr}}.scroll-x{display:flex;gap:var(--spacing-4);overflow-x:auto;padding-bottom:var(--spacing-2);scrollbar-width:none;-webkit-overflow-scrolling:touch}.scroll-x::-webkit-scrollbar{display:none}.scroll-x>*{flex:0 0 auto}.page-header,.home-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:24px}.page-header h1,.home-header h1{font-size:24px;font-weight:600;color:var(--text-primary);margin-bottom:4px;margin-top:0}.page-header p,.home-header .subtitle{font-size:14px;color:var(--text-secondary);margin:0}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;background:var(--primary);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;text-decoration:none;transition:background .15s}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;background:#fff;color:var(--text-primary);border:1px solid var(--border);border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;text-decoration:none;transition:all .15s}.btn-secondary:hover{background:var(--bg-secondary);border-color:var(--border-hover)}.stat-card,.stat-item{display:flex;align-items:center;gap:14px;padding:18px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 1px 2px #0000000d}.stat-icon-wrapper,.stat-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-value{display:block;font-size:24px;font-weight:600;color:var(--text-primary);line-height:1.2}.stat-label{display:block;font-size:13px;color:var(--text-secondary);margin-top:2px}.stat-icon-wrapper.blue,.stat-icon.blue{background:var(--primary-50);color:var(--primary)}.stat-icon-wrapper.purple,.stat-icon.purple{background:var(--secondary-50);color:var(--secondary)}.stat-icon-wrapper.green,.stat-icon.green{background:var(--success-bg);color:var(--success-text)}.stat-icon-wrapper.orange,.stat-icon.orange{background:var(--warning-bg);color:var(--warning-text)}.stat-icon-wrapper.red,.stat-icon.red{background:var(--error-bg);color:var(--error-text)}.stat-icon-wrapper.teal,.stat-icon.teal{background:var(--info-bg);color:var(--info-text)}.stat-icon-wrapper.indigo,.stat-icon.indigo{background:#e0e7ff;color:#6366f1}.stat-icon-wrapper.gold,.stat-icon.gold{background:#fef3c7;color:#d97706}.stat-icon-wrapper.silver,.stat-icon.silver{background:#f1f5f9;color:#64748b}.error-boundary{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;background:var(--bg-primary, #f8fafc)}.error-boundary-content{max-width:600px;width:100%;text-align:center;padding:40px;background:var(--bg-card, #ffffff);border-radius:16px;box-shadow:0 4px 24px #00000014}.error-icon{display:inline-flex;align-items:center;justify-content:center;width:80px;height:80px;margin-bottom:24px;background:#ef44441a;color:#ef4444;border-radius:50%}.error-title{font-size:28px;font-weight:700;color:var(--text-primary, #0f172a);margin:0 0 16px}.error-description{font-size:16px;line-height:1.6;color:var(--text-secondary, #64748b);margin:0 0 32px}.error-details{margin:24px 0;padding:16px;background:#00000005;border:1px solid rgba(0,0,0,.08);border-radius:8px;text-align:left}.error-details summary{cursor:pointer;font-weight:600;color:var(--text-primary, #0f172a);-webkit-user-select:none;user-select:none}.error-details-content{margin-top:16px}.error-message,.error-stack{margin-bottom:12px;padding:12px;background:#0000000a;border-radius:4px;font-size:14px}.error-message pre,.error-stack pre{margin:8px 0 0;padding:12px;background:#0000000f;border-radius:4px;overflow-x:auto;white-space:pre-wrap;word-break:break-all;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;line-height:1.5;color:#dc2626}.error-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.error-actions .btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;font-size:16px;font-weight:600;border-radius:8px;border:none;cursor:pointer;transition:all .2s ease;text-decoration:none}.btn-primary{background:#2563eb;color:#fff}.btn-primary:hover{background:#1d4ed8}.btn-secondary{background:#f1f5f9;color:#0f172a}@media(max-width:640px){.error-boundary-content{padding:24px}.error-title{font-size:24px}.error-actions{flex-direction:column}.error-actions .btn{width:100%;justify-content:center}}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:#f8fafc}.auth-container{width:100%;max-width:400px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:32px}.auth-header{text-align:center;margin-bottom:28px}.auth-logo{display:inline-flex;margin-bottom:20px}.auth-logo svg{width:48px;height:48px}.auth-logo svg rect{fill:#6366f1}.auth-logo.success{width:56px;height:56px;background:#ecfdf5;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#10b981}.auth-header h1{font-size:22px;font-weight:600;color:#0f172a;margin-bottom:6px}.auth-header p{font-size:14px;color:#64748b}.auth-error{background:#fef2f2;border:1px solid #fecaca;color:#dc2626;padding:12px 16px;border-radius:8px;margin-bottom:20px;font-size:14px;text-align:center}.auth-form{display:flex;flex-direction:column;gap:18px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:13px;font-weight:500;color:#0f172a}.input-wrapper{position:relative}.input-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#94a3b8;pointer-events:none}.input{width:100%;padding:11px 14px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;color:#0f172a;transition:border-color .15s,box-shadow .15s}.input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.input::placeholder{color:#94a3b8}.input.input-with-icon{padding-left:44px!important}.input-error{border-color:#ef4444}.input-error:focus{box-shadow:0 0 0 3px #ef44441a}.field-error{font-size:12px;color:#dc2626;margin-top:4px}select.input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2394a3b8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;cursor:pointer}select.input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.phone-input-wrapper{position:relative}.phone-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#94a3b8;pointer-events:none;z-index:2}.phone-input-wrapper .PhoneInput{position:relative}.phone-input-wrapper .PhoneInputInput{width:100%;padding:11px 14px 11px 90px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;color:#0f172a;transition:border-color .15s,box-shadow .15s}.phone-input-wrapper .PhoneInputInput:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.phone-input-wrapper .PhoneInputInput::placeholder{color:#94a3b8}.phone-input-wrapper .PhoneInputCountry{position:absolute;left:40px;top:50%;transform:translateY(-50%);z-index:1;margin-right:8px}.phone-input-wrapper .PhoneInputCountrySelect{font-size:14px;border:none;background:transparent;cursor:pointer;padding:4px}.phone-input-wrapper .PhoneInputCountrySelect:focus{outline:none}.phone-input-wrapper .PhoneInputCountryIcon{width:24px;height:18px;margin-right:2px}.form-footer{display:flex;justify-content:flex-end;margin-top:-6px}.forgot-link{font-size:13px;color:#6366f1;text-decoration:none}.forgot-link:hover{text-decoration:underline}.btn-block{width:100%;padding:12px 20px;background:#6366f1;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:background .15s;margin-top:4px}.btn-block:hover:not(:disabled){background:#4f46e5}.btn-block:disabled{opacity:.6;cursor:not-allowed}.spinner-icon{animation:spin .8s linear infinite}.auth-footer{text-align:center;margin-top:24px;padding-top:20px;border-top:1px solid #e2e8f0}.auth-footer p{font-size:14px;color:#64748b}.auth-footer a{color:#6366f1;font-weight:500;text-decoration:none}.auth-footer a:hover{text-decoration:underline}@media(max-width:480px){.auth-container{padding:24px}.auth-header h1{font-size:20px}}:root{--PhoneInput-color--focus: #03b2cb;--PhoneInputInternationalIconPhone-opacity: .8;--PhoneInputInternationalIconGlobe-opacity: .65;--PhoneInputCountrySelect-marginRight: .35em;--PhoneInputCountrySelectArrow-width: .3em;--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);--PhoneInputCountrySelectArrow-borderWidth: 1px;--PhoneInputCountrySelectArrow-opacity: .45;--PhoneInputCountrySelectArrow-color: currentColor;--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);--PhoneInputCountrySelectArrow-transform: rotate(45deg);--PhoneInputCountryFlag-aspectRatio: 1.5;--PhoneInputCountryFlag-height: 1em;--PhoneInputCountryFlag-borderWidth: 1px;--PhoneInputCountryFlag-borderColor: rgba(0,0,0,.5);--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);--PhoneInputCountryFlag-backgroundColor--loading: rgba(0,0,0,.1)}.PhoneInput{display:flex;align-items:center}.PhoneInputInput{flex:1;min-width:0}.PhoneInputCountryIcon{width:calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));height:var(--PhoneInputCountryFlag-height)}.PhoneInputCountryIcon--square{width:var(--PhoneInputCountryFlag-height)}.PhoneInputCountryIcon--border{background-color:var(--PhoneInputCountryFlag-backgroundColor--loading);box-shadow:0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor)}.PhoneInputCountryIconImg{display:block;width:100%;height:100%}.PhoneInputInternationalIconPhone{opacity:var(--PhoneInputInternationalIconPhone-opacity)}.PhoneInputInternationalIconGlobe{opacity:var(--PhoneInputInternationalIconGlobe-opacity)}.PhoneInputCountry{position:relative;align-self:stretch;display:flex;align-items:center;margin-right:var(--PhoneInputCountrySelect-marginRight)}.PhoneInputCountrySelect{position:absolute;top:0;left:0;height:100%;width:100%;z-index:1;border:0;opacity:0;cursor:pointer}.PhoneInputCountrySelect[disabled],.PhoneInputCountrySelect[readonly]{cursor:default}.PhoneInputCountrySelectArrow{display:block;content:"";width:var(--PhoneInputCountrySelectArrow-width);height:var(--PhoneInputCountrySelectArrow-width);margin-left:var(--PhoneInputCountrySelectArrow-marginLeft);border-style:solid;border-color:var(--PhoneInputCountrySelectArrow-color);border-top-width:0;border-bottom-width:var(--PhoneInputCountrySelectArrow-borderWidth);border-left-width:0;border-right-width:var(--PhoneInputCountrySelectArrow-borderWidth);transform:var(--PhoneInputCountrySelectArrow-transform);opacity:var(--PhoneInputCountrySelectArrow-opacity)}.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon+.PhoneInputCountrySelectArrow{opacity:1;color:var(--PhoneInputCountrySelectArrow-color--focus)}.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon--border{box-shadow:0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus)}.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon .PhoneInputInternationalIconGlobe{opacity:1;color:var(--PhoneInputCountrySelectArrow-color--focus)}.home{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:24px}.home-loading{display:flex;justify-content:center;align-items:center;min-height:300px}.home-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.home-header h1{font-size:24px;font-weight:600;color:#0f172a;margin-bottom:4px}.home-header .subtitle{font-size:14px;color:#64748b}.streak-badge{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:#fef3c7;color:#92400e;border-radius:20px;font-size:13px;font-weight:600}.streak-badge svg{color:#f59e0b}.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.weekly-comparison{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:10px;font-size:14px;font-weight:500}.weekly-comparison.positive{background:#ecfdf5;color:#10b981}.weekly-comparison.negative{background:#fee2e2;color:#dc2626}.weekly-comparison strong{font-weight:700}.review-alert{display:flex;align-items:center;gap:12px;padding:14px 18px;background:#fffbeb;border:1px solid #fcd34d;border-radius:10px;text-decoration:none;color:#92400e;font-size:14px;transition:background .15s}.review-alert:hover{background:#fef3c7}.review-alert svg:first-child{flex-shrink:0}.review-alert span{flex:1}.review-alert svg:last-child{color:#b45309}.home-grid{display:grid;grid-template-columns:1fr 300px;gap:24px;align-items:start}.section-header h2{font-size:15px;font-weight:600;color:#0f172a}.section-header .link{font-size:13px;font-weight:500;color:#6366f1;text-decoration:none}.section-header .link:hover{text-decoration:underline}.stories-list{display:flex;flex-direction:column}.story-item{display:flex;align-items:center;gap:12px;padding:14px 18px;text-decoration:none;color:#0f172a;border-bottom:1px solid #f1f5f9;transition:background .15s}.story-item:last-child{border-bottom:none}.story-item:hover{background:#f8fafc}.story-info{flex:1;min-width:0}.story-info h3{font-size:14px;font-weight:500;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.story-meta{display:flex;align-items:center;gap:10px}.meta-text{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:#94a3b8}.arrow{color:#cbd5e1;flex-shrink:0}.actions-list{display:flex;flex-direction:column}.action-item{display:flex;align-items:center;gap:12px;padding:12px 16px;text-decoration:none;color:#0f172a;font-size:14px;font-weight:500;border-bottom:1px solid #f1f5f9;transition:background .15s}.action-item:last-child{border-bottom:none}.action-item:hover{background:#f8fafc}.action-item span{flex:1}.action-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center}.action-icon.blue{background:#eff6ff;color:#3b82f6}.action-icon.purple{background:#f3e8ff;color:#8b5cf6}.action-icon.green{background:#ecfdf5;color:#10b981}.action-icon.amber{background:#fffbeb;color:#f59e0b}.action-icon.teal{background:#f0fdfa;color:#14b8a6}@media(max-width:768px){.home-grid{grid-template-columns:1fr}.stats-row{display:flex;overflow-x:auto;gap:12px;padding-bottom:4px;scrollbar-width:none;-ms-overflow-style:none}.stats-row::-webkit-scrollbar{display:none}.stat-item{min-width:200px;flex:0 0 auto;padding:14px}}.stories-page{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:20px}.stories-loading{display:flex;justify-content:center;align-items:center;min-height:300px}.btn-primary{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;background:#6366f1;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background .15s}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;padding:16px;background:#fff;border:1px solid #e2e8f0;border-radius:10px}.filter-btn{padding:7px 14px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;font-weight:500;color:#64748b;cursor:pointer;transition:all .15s}.filter-btn:hover{background:#f1f5f9;color:#0f172a}.filter-btn.active{background:#6366f1;border-color:#6366f1;color:#fff}.stories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.story-card{display:flex;gap:16px;padding:18px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;text-decoration:none;color:#0f172a;transition:border-color .15s,box-shadow .15s}.story-card:hover{border-color:#6366f1;box-shadow:0 4px 12px #6366f11a}.story-icon{width:52px;height:52px;background:#eff6ff;color:#3b82f6;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.story-icon.completed{background:#ecfdf5;color:#10b981}.story-content{flex:1;min-width:0}.story-badges{display:flex;gap:6px;margin-bottom:8px}.badge{display:inline-block;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize}.badge.beginner{background:#ecfdf5;color:#059669}.badge.intermediate{background:#fffbeb;color:#b45309}.badge.advanced{background:#fef2f2;color:#dc2626}.badge.completed{background:#f0fdf4;color:#16a34a}.story-content h3{font-size:15px;font-weight:600;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.excerpt{font-size:13px;color:#64748b;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.story-meta{display:flex;gap:12px;font-size:12px;color:#94a3b8}.story-meta span{display:inline-flex;align-items:center;gap:4px}.pagination{display:flex;justify-content:center;align-items:center;gap:8px;padding:16px 0}.page-btn{display:inline-flex;align-items:center;gap:4px;padding:8px 14px;background:#fff;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;font-weight:500;color:#0f172a;cursor:pointer;transition:all .15s}.page-btn:hover:not(:disabled){background:#f8fafc;border-color:#6366f1;color:#6366f1}.page-btn:disabled{opacity:.5;cursor:not-allowed}.page-numbers{display:flex;gap:4px}.page-num{min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;font-weight:500;color:#0f172a;cursor:pointer;transition:all .15s}.page-num:hover{background:#f8fafc;border-color:#6366f1;color:#6366f1}.page-num.active{background:#6366f1;border-color:#6366f1;color:#fff}.ellipsis{padding:0 8px;color:#94a3b8}.page-info{text-align:center;font-size:13px;color:#64748b}@media(max-width:768px){.page-header{flex-direction:column;align-items:stretch}.btn-primary{justify-content:center}.stories-grid{grid-template-columns:minmax(0,1fr);width:100%;gap:16px}.stories-page{width:100%;overflow-x:hidden}.pagination{flex-wrap:wrap}.page-numbers{order:-1;width:100%;justify-content:center;margin-bottom:8px}}.story-reader{max-width:1100px;margin:0 auto}.reader-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.back-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-weight:500;color:#0f172a;text-decoration:none;transition:all .15s}.reader-actions{display:flex;gap:8px}.icon-btn{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e2e8f0;border-radius:8px;color:#64748b;cursor:pointer;transition:all .15s}.icon-btn:hover:not(:disabled){border-color:#6366f1;color:#6366f1}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.icon-btn.active{background:#6366f1;border-color:#6366f1;color:#fff}.reader-layout{display:grid;grid-template-columns:1fr 280px;gap:24px;align-items:start}.reader-content{display:flex;flex-direction:column;gap:20px}.story-header-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:28px;text-align:center}.story-category-badge{display:inline-block;padding:4px 12px;background:#f1f5f9;color:#64748b;border-radius:20px;font-size:12px;font-weight:500;margin-bottom:14px}.story-header-card h1{font-size:22px;font-weight:600;color:#0f172a;margin-bottom:16px;line-height:1.4}.story-meta-row{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}.meta-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:#f8fafc;border-radius:6px;font-size:12px;font-weight:500;color:#64748b}.meta-chip.difficulty{font-weight:600;text-transform:capitalize}.meta-chip.completed{background:#ecfdf5;color:#059669}.story-text-content{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:32px;font-size:17px;line-height:1.9;color:#1e293b;text-align:justify;font-family:Merriweather,Georgia,Cambria,Times New Roman,serif}@media(max-width:768px){.story-text-content{font-size:14px;line-height:1.6;padding:20px}}.story-text-content p{margin-bottom:20px}.story-text-content p:last-child{margin-bottom:0}.vocab-highlight{background:#eff6ff;color:#3b82f6;padding:2px 6px;border-radius:4px;cursor:pointer;font-weight:500;transition:background .15s}.vocab-highlight:hover{background:#dbeafe}.vocab-highlight.vocab-state-new{background:#eff6ff;color:#3b82f6}.vocab-highlight.vocab-state-learning{background:#fef3c7;color:#b45309}.vocab-highlight.vocab-state-reviewing{background:#fef9c3;color:#a16207}.vocab-highlight.vocab-state-mastered{background:#dcfce7;color:#16a34a}.vocabulary-sidebar{background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;position:sticky;top:20px;display:flex;flex-direction:column;max-height:calc(100vh - 120px)}.sidebar-header{padding:16px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center}.sidebar-header h3{font-size:15px;font-weight:600;color:#0f172a}.sidebar-count{font-size:12px;color:#64748b;background:#f1f5f9;padding:2px 8px;border-radius:10px}.sidebar-words{flex:1;overflow-y:auto}.sidebar-word-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:background .15s}.sidebar-word-item:last-child{border-bottom:none}.sidebar-word-item:hover{background:#f8fafc}.sidebar-word-item.selected{background:#eff6ff}.word-indicator{width:8px;height:8px;border-radius:50%;flex-shrink:0}.word-indicator.new{background:#3b82f6}.word-indicator.learning{background:#f59e0b}.word-indicator.reviewing{background:#eab308}.word-indicator.mastered{background:#22c55e}.word-info{flex:1;min-width:0}.word-info .word-text{font-size:14px;font-weight:500;color:#0f172a;margin-bottom:2px}.word-info .word-meaning{font-size:12px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.word-modal-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;padding:20px;z-index:100}.word-modal{background:#fff;border-radius:14px;width:100%;max-width:420px;max-height:85vh;overflow-y:auto;animation:modalIn .2s ease}@keyframes modalIn{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.word-modal-header{padding:24px;border-bottom:1px solid #e2e8f0}.word-modal-header h2{font-size:22px;font-weight:600;color:#0f172a;margin-bottom:4px}.word-modal-header .pronunciation{font-size:14px;color:#64748b;font-style:italic}.word-modal-body{padding:24px}.word-detail-section{margin-bottom:20px}.word-detail-section:last-child{margin-bottom:0}.word-detail-section label{display:block;font-size:11px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}.word-detail-section p{font-size:15px;color:#0f172a;line-height:1.6}.word-modal-footer{padding:16px 24px;border-top:1px solid #e2e8f0;display:flex;gap:12px}.word-modal-footer .btn{flex:1;padding:12px 16px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s;border:none}.word-modal-footer .btn-primary{background:#6366f1;color:#fff}.word-modal-footer .btn-primary:hover{background:#4f46e5}.word-modal-footer .btn-secondary{background:#f1f5f9;color:#0f172a}.word-modal-footer .btn-secondary:hover{background:#e2e8f0}.premium-blocked-container{display:flex;justify-content:center;align-items:center;min-height:400px;padding:24px}.premium-blocked-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:40px;max-width:440px;text-align:center}.premium-blocked-icon{width:72px;height:72px;background:#fef3c7;color:#f59e0b;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;margin-bottom:20px}.premium-blocked-card h2{font-size:22px;font-weight:600;color:#0f172a;margin-bottom:8px}.premium-features-list{text-align:left;margin:24px 0;display:flex;flex-direction:column;gap:16px}.premium-feature-item{display:flex;gap:12px;padding:14px;background:#f8fafc;border-radius:10px}.premium-feature-item svg{flex-shrink:0;margin-top:2px}.premium-blocked-actions{display:flex;flex-direction:column;gap:10px}.premium-blocked-actions .btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:10px;font-size:15px;font-weight:500;cursor:pointer;transition:all .15s;text-decoration:none}.premium-blocked-actions .btn-primary{background:#6366f1;color:#fff;border:none}.premium-blocked-actions .btn-primary:hover{background:#4f46e5}.premium-blocked-actions .btn-secondary{background:#fff;color:#0f172a;border:1px solid #e2e8f0}.premium-blocked-actions .btn-secondary:hover{background:#f8fafc;border-color:#6366f1;color:#6366f1}.error-state{text-align:center;padding:60px 20px;color:#64748b;font-size:15px}.vocab-list{flex:1;overflow-y:auto}.vocab-item{padding:12px 16px;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:background .15s}.vocab-item:last-child{border-bottom:none}.vocab-item:hover{background:#f8fafc}.vocab-item.active{background:#eff6ff}.vocab-item.learned{background:#f0fdf4}.vocab-item-header{display:flex;align-items:center;gap:6px;margin-bottom:4px}.vocab-item .vocab-word{font-size:14px;font-weight:600;color:#0f172a}.vocab-item .check-icon{color:#22c55e}.vocab-item .vocab-meaning{display:block;font-size:13px;color:#64748b;margin-bottom:2px}.vocab-item .vocab-pos{display:block;font-size:11px;color:#94a3b8;text-transform:capitalize}.word-count{font-size:12px;color:#64748b;background:#f1f5f9;padding:2px 8px;border-radius:10px}.mobile-vocab-toggle{display:none;position:fixed;bottom:80px;left:50%;transform:translate(-50%);padding:10px 20px;background:#fff;border:1px solid #e2e8f0;border-radius:24px;font-size:13px;font-weight:500;color:#0f172a;cursor:pointer;z-index:40;box-shadow:0 4px 12px #0000001a;gap:8px;align-items:center}.mobile-vocab-toggle svg{color:#6366f1}.toggle-icon{transition:transform .2s}.toggle-icon.open{transform:rotate(180deg)}.mobile-close-indicator{display:none}.sidebar-backdrop{display:none;position:fixed;inset:0;background:#0000004d;z-index:45}.word-modal.rich{max-width:480px;position:relative}.word-modal.rich .close-btn{position:absolute;top:16px;right:16px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#f1f5f9;border:none;border-radius:8px;color:#64748b;cursor:pointer;transition:all .15s}.word-modal.rich .close-btn:hover{background:#e2e8f0;color:#0f172a}.word-header-row{display:flex;align-items:center;gap:12px}.word-phonetics{margin-top:8px;display:flex;gap:12px}.word-phonetics .ipa{font-size:14px;color:#64748b;font-style:italic}.word-phonetics .bn-pron{font-size:14px;color:#3b82f6}.word-pos-badge{display:inline-block;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600;margin-top:12px;text-transform:capitalize}.play-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#f1f5f9;border:none;border-radius:10px;color:#6366f1;cursor:pointer;transition:all .15s}.play-btn:hover{background:#e2e8f0}.play-btn.playing{background:#6366f1;color:#fff}.word-modal-section{padding:16px 24px;border-bottom:1px solid #f1f5f9}.word-modal-section:last-of-type{border-bottom:none}.word-modal-section h4{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;display:flex;align-items:center;gap:6px}.word-modal-section p{font-size:15px;color:#0f172a;line-height:1.6}.word-modal-section.memory-hook{background:#fffbeb;border-radius:10px;margin:12px}.word-modal-section.memory-hook h4{color:#b45309}.word-modal-section.context{background:#f8fafc;border-radius:10px;margin:12px}.meaning-primary{font-size:17px;font-weight:500}.meaning-extended{font-size:14px;color:#64748b;margin-top:4px}.word-modal-row{display:flex;gap:16px;padding:0 24px}.word-modal-section.half{flex:1;padding:16px 0;border-bottom:none}.word-chips{display:flex;flex-wrap:wrap;gap:6px}.chip{display:inline-block;padding:4px 10px;background:#f1f5f9;border-radius:6px;font-size:13px;color:#0f172a}.chip.green{background:#dcfce7;color:#166534}.chip.red{background:#fee2e2;color:#991b1b}.example-list{margin:0;padding-left:18px}.example-list li{font-size:14px;color:#1e293b;line-height:1.6;margin-bottom:8px}.example-list li:last-child{margin-bottom:0}.word-modal-actions{display:flex;gap:10px;padding:16px 24px;border-top:1px solid #e2e8f0}.word-modal-actions .btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:12px 16px;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s;border:none}.word-modal-actions .btn-secondary{background:#f1f5f9;color:#0f172a}.word-modal-actions .btn-secondary:hover{background:#e2e8f0}.word-modal-actions .btn-primary{background:#6366f1;color:#fff}.word-modal-actions .btn-primary:hover{background:#4f46e5}.word-modal-actions .btn-success{background:#22c55e;color:#fff}.word-modal-actions .btn-success:disabled{opacity:.7;cursor:not-allowed}@media(max-width:900px){.reader-layout{grid-template-columns:1fr}.vocabulary-sidebar{position:fixed;inset:auto 0 0;border-radius:16px 16px 0 0;max-height:50vh;z-index:50;transform:translateY(100%);transition:transform .3s ease}.vocabulary-sidebar.open{transform:translateY(0)}.mobile-vocab-toggle{display:flex}.mobile-close-indicator{display:block;color:#94a3b8}.sidebar-backdrop{display:block}.reader-content{padding-bottom:80px}}@media(max-width:600px){.story-header-card{padding:20px}.story-header-card h1{font-size:18px}.story-text-content{padding:20px;font-size:16px;line-height:1.8}.word-modal{max-width:100%;margin:20px}.word-modal-row{flex-direction:column;gap:0}}.layout{display:flex;min-height:100vh;background:var(--bg-secondary)}.sidebar{width:280px;background:var(--bg-primary);border-right:1px solid var(--border);display:flex;flex-direction:column;position:fixed;height:100vh;z-index:var(--z-fixed)}.sidebar-header{padding:var(--spacing-6);border-bottom:1px solid var(--border)}.logo{display:flex;align-items:center;gap:var(--spacing-3);text-decoration:none;transition:opacity var(--transition-fast) var(--ease-default)}.logo:hover{opacity:.8}.logo-icon{width:44px;height:44px;background:var(--gradient-primary);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:var(--shadow-primary);flex-shrink:0}.logo-text{font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);background:var(--gradient-hero);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px}.sidebar-nav{flex:1;padding:var(--spacing-4);display:flex;flex-direction:column;gap:var(--spacing-1);overflow-y:auto}.nav-item{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);border-radius:var(--radius-lg);color:var(--text-secondary);text-decoration:none;transition:all var(--transition-fast) var(--ease-default);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);position:relative}.nav-item svg{flex-shrink:0;transition:color var(--transition-fast) var(--ease-default)}.nav-item:hover{background:var(--bg-tertiary);color:var(--text-primary)}.nav-item.active{background:var(--primary-50);color:var(--primary);font-weight:var(--font-weight-semibold)}.nav-item.active svg{color:var(--primary)}.nav-item.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:20px;background:var(--primary);border-radius:0 var(--radius-sm) var(--radius-sm) 0}.nav-label{flex:1}.sidebar-footer{padding:var(--spacing-4);border-top:1px solid var(--border);background:var(--bg-secondary)}.user-info{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3);margin-bottom:var(--spacing-3);background:var(--bg-primary);border-radius:var(--radius-lg);border:1px solid var(--border)}.user-avatar{width:40px;height:40px;border-radius:var(--radius-full);background:var(--gradient-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);flex-shrink:0;box-shadow:var(--shadow-sm)}.user-details{flex:1;min-width:0}.user-name{font-weight:var(--font-weight-semibold);color:var(--text-primary);font-size:var(--font-size-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-xp-info{display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-xs);color:var(--text-muted);margin-top:2px}.user-xp-info .dot{width:4px;height:4px;background:var(--border);border-radius:50%}.logout-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);padding:var(--spacing-3);border-radius:var(--radius-lg);background:var(--bg-primary);border:1px solid var(--border);color:var(--text-secondary);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast) var(--ease-default)}.logout-btn:hover{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}.logout-btn:hover svg{color:var(--error-text)}.main-content{flex:1;margin-left:280px;min-height:100vh;background:var(--bg-secondary)}.content-wrapper{max-width:1200px;margin:0 auto;padding:var(--spacing-8)}.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;background:var(--bg-primary);border-top:1px solid var(--border);padding:var(--spacing-2) var(--spacing-4) env(safe-area-inset-bottom);z-index:var(--z-fixed);box-shadow:0 -4px 20px #0000000d}.bottom-nav-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:var(--spacing-2);border-radius:var(--radius-lg);color:var(--text-muted);text-decoration:none;transition:all var(--transition-fast) var(--ease-default)}.bottom-nav-item svg{transition:transform var(--transition-fast) var(--ease-default)}.bottom-nav-item:active svg{transform:scale(.9)}.bottom-nav-item.active{color:var(--primary)}.bottom-nav-item.active svg{transform:translateY(-2px)}.bottom-nav-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.mobile-header{display:none;position:sticky;top:0;z-index:var(--z-sticky);background:var(--bg-primary);border-bottom:1px solid var(--border);padding:var(--spacing-3) var(--spacing-4)}.mobile-header-content{display:flex;align-items:center;justify-content:space-between}.mobile-logo{display:flex;align-items:center;gap:var(--spacing-2);text-decoration:none;font-weight:700;font-size:18px;color:var(--text-primary)}.mobile-logo-icon{width:32px;height:32px;background:var(--gradient-primary);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff}.mobile-menu-btn{background:none;border:none;color:var(--text-secondary);padding:4px;cursor:pointer}@media(max-width:1024px){.sidebar{width:240px}.main-content{margin-left:240px}.content-wrapper{padding:var(--spacing-6)}}@media(max-width:768px){.layout{flex-direction:column}.sidebar{display:none;width:280px;height:100vh;position:fixed;top:0;left:0;z-index:2000;box-shadow:0 0 20px #0000001a}.sidebar.mobile-open{display:flex;animation:slideInSidebar .3s ease-out}@keyframes slideInSidebar{0%{transform:translate(-100%)}to{transform:translate(0)}}.close-drawer-btn{background:none;border:none;color:var(--text-secondary);padding:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.close-drawer-btn:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.main-content{margin-left:0!important;padding-bottom:80px;width:100%}.content-wrapper{padding:var(--spacing-4)}.bottom-nav{display:flex;justify-content:space-around;padding-bottom:max(var(--spacing-2),env(safe-area-inset-bottom))}.bottom-nav-item{background:none;border:none;cursor:pointer;min-width:60px}.bottom-nav-item.active{color:var(--primary)}.bottom-nav-item.active svg{color:var(--primary);transform:translateY(-2px)}.mobile-header{display:block}}@media(max-width:380px){.content-wrapper{padding:var(--spacing-3)}.bottom-nav-label{font-size:10px}}.sidebar-overlay{display:none;position:fixed;inset:0;background:#00000080;z-index:999;opacity:0;transition:opacity .3s}.sidebar-overlay.active{display:block;opacity:1}.mobile-nav-avatar{width:24px;height:24px;border-radius:50%;background:var(--slate-300);color:#fff;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;transition:background-color .2s}.bottom-nav-item.active .mobile-nav-avatar{background:var(--primary)}@media print{.sidebar,.bottom-nav,.logout-btn,.mobile-header{display:none!important}.main-content{margin-left:0!important}.content-wrapper{padding:0!important}}@keyframes skeleton-loading{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,#0000000f 25%,#0000001f,#0000000f 75%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}.skeleton-text{width:100%;height:1em;border-radius:4px}.skeleton-circular{border-radius:50%}.skeleton-rectangular{border-radius:8px}.skeleton-card{background:#fff;border-radius:12px;overflow:hidden;border:1px solid rgba(0,0,0,.08);padding:16px}.skeleton-card-image{margin-bottom:16px}.skeleton-card-content{display:flex;flex-direction:column;gap:8px}.word-card-skeleton{background:#fff;border-radius:12px;padding:16px;border:1px solid rgba(0,0,0,.08)}.skeleton-word-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.skeleton-word-info{display:flex;flex-direction:column;gap:6px}.skeleton-word-body{display:flex;flex-direction:column;gap:8px}.skeleton-table{width:100%}.skeleton-table-header{display:flex;gap:16px;padding:12px;border-bottom:1px solid rgba(0,0,0,.08)}.skeleton-table-row{display:flex;gap:16px;padding:12px;border-bottom:1px solid rgba(0,0,0,.04)}@media(prefers-reduced-motion:reduce){.skeleton{animation:none;background:#00000014}}.vocabulary-page{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:20px}.search-box{position:relative;max-width:400px}.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#94a3b8;pointer-events:none}.search-input{width:100%;padding:11px 14px 11px 44px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;color:#0f172a;transition:all .15s}.search-input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;background:#fff}.search-input::placeholder{color:#94a3b8}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.stat-icon.yellow{background:#fffbeb;color:#f59e0b}.words-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.word-card{display:flex;gap:16px;padding:18px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;text-decoration:none;color:#0f172a;transition:border-color .15s,box-shadow .15s}.word-card:hover{border-color:#6366f1;box-shadow:0 4px 12px #6366f11a}.word-icon{width:52px;height:52px;background:#eff6ff;color:#3b82f6;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:20px;font-weight:700}.word-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.word-header h3{font-size:15px;font-weight:600;color:#0f172a;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mastery-indicator{width:8px;height:8px;border-radius:50%;flex-shrink:0}.word-meaning-bn{color:#64748b;font-size:13px;margin:0 0 10px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.word-footer{display:flex;gap:12px;font-size:12px;color:#94a3b8}.word-footer span{display:inline-flex;align-items:center;gap:4px}.word-pos{text-transform:capitalize;font-style:italic}.empty-state{text-align:center;padding:60px 20px;color:#64748b}.empty-state svg{margin-bottom:12px;color:#94a3b8}.empty-state h3{font-size:16px;font-weight:600;color:#0f172a;margin-bottom:4px}.empty-state p{font-size:14px}@media(max-width:768px){.page-header{flex-direction:column;align-items:stretch}.stats-row{grid-template-columns:1fr;gap:12px}.stat-item{padding:14px}.words-grid{grid-template-columns:1fr}}.word-detail-page{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:20px;padding:24px 20px}.detail-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.back-btn{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;font-weight:500;color:#0f172a;text-decoration:none;transition:all .15s}.back-btn:hover{border-color:#6366f1;color:#6366f1}.icon-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e2e8f0;border-radius:8px;color:#64748b;cursor:pointer;transition:all .15s}.icon-btn:hover{border-color:#6366f1;color:#6366f1}.icon-btn.active{background:#fffbeb;border-color:#fcd34d;color:#f59e0b}.word-header-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:32px}.word-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}.word-header-card h1{font-size:36px;font-weight:700;color:#0f172a;margin:0 0 8px}.pronunciation{font-size:16px;color:#64748b;margin:0}.pronunciation-bn{font-size:14px;color:#94a3b8;margin:4px 0 0}.difficulty-badge{padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.difficulty-badge.a1,.difficulty-badge.a2{background:#ecfdf5;color:#059669;border:1px solid #86efac}.difficulty-badge.b1,.difficulty-badge.b2{background:#eff6ff;color:#3b82f6;border:1px solid #93c5fd}.difficulty-badge.c1,.difficulty-badge.c2{background:#fef3c7;color:#b45309;border:1px solid #fcd34d}.word-actions{display:flex;gap:12px}.word-detail-grid{display:grid;grid-template-columns:1fr 380px;gap:20px;align-items:start}.word-main-content{min-width:0}.word-sidebar{display:flex;flex-direction:column;gap:16px}.sidebar-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:20px}.sidebar-card h3{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#0f172a;margin:0 0 12px}.progress-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.progress-card h3{font-size:16px;font-weight:600;color:#0f172a;margin:0 0 16px}.progress-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.progress-stat{display:flex;flex-direction:column;gap:6px}.progress-label{font-size:12px;color:#94a3b8;font-weight:500}.progress-value{font-size:20px;font-weight:700;color:#0f172a}.status-badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:11px;font-weight:600;text-transform:capitalize}.status-badge.new{background:#eff6ff;color:#3b82f6}.status-badge.learning{background:#fffbeb;color:#b45309}.status-badge.reviewing{background:#fef3c7;color:#a16207}.status-badge.mastered{background:#ecfdf5;color:#059669}.word-content-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:32px}.detail-section{padding:20px 0;border-bottom:1px solid #f1f5f9}.detail-section:last-child{border-bottom:none}.detail-section h3{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:#0f172a;margin:0 0 12px}.meaning-bn{font-size:18px;font-weight:600;color:#0f172a;margin:0 0 8px}.meaning-extended{font-size:15px;color:#64748b;line-height:1.6;margin:0 0 12px}.definition-en{font-size:15px;color:#475569;line-height:1.6;margin:0;font-style:italic}.example{font-size:15px;color:#475569;line-height:1.7;margin:0 0 10px;padding-left:16px;border-left:3px solid #e2e8f0}.example:last-child{margin-bottom:0}.memory-hook{background:#fffbeb;border:1px solid #fcd34d;border-radius:10px;padding:16px!important}.memory-hook h3{color:#92400e}.memory-hook p{font-size:14px;color:#b45309;line-height:1.6;margin:0}.common-mistakes{background:#fee2e2;border:1px solid #fca5a5;border-radius:10px;padding:16px!important}.common-mistakes h3{color:#991b1b}.mistake{font-size:14px;color:#dc2626;line-height:1.6;margin:0 0 8px}.mistake:last-child{margin-bottom:0}.word-chips{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-block;padding:6px 12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;font-size:13px;font-weight:500;color:#475569}.chip.collocation{background:#eff6ff;border-color:#93c5fd;color:#3b82f6}.chip.family{background:#f0fdf4;border-color:#86efac;color:#059669}.loading-state,.error-state{display:flex;justify-content:center;align-items:center;min-height:300px;color:#64748b}.spinner{width:32px;height:32px;border:3px solid #e2e8f0;border-top-color:#6366f1;border-radius:50%;animation:spin .8s linear infinite}@media(max-width:768px){.word-detail-page{padding:16px}.word-detail-grid{grid-template-columns:1fr}.word-header-card{padding:24px 20px}.word-header-card h1{font-size:28px}.word-title-row{flex-direction:column}.progress-stats{grid-template-columns:repeat(2,1fr)}.word-content-card{padding:24px 20px}.sidebar-card{padding:16px}}.flashcards-page{max-width:480px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-6);padding:var(--spacing-5)}.loading-state .spinner{width:32px;height:32px;border-width:3px}.session-start,.empty-flashcards{display:flex;flex-direction:column;align-items:center;gap:16px;padding:48px 32px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;text-align:center;width:100%;max-width:420px;margin:40px auto}.session-icon,.empty-icon{width:72px;height:72px;background:#eff6ff;color:#3b82f6;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:8px}.empty-icon{background:#ecfdf5;color:#10b981}.session-start h1,.empty-flashcards h2{font-size:22px;font-weight:600;color:#0f172a;margin:0}.session-start p,.empty-flashcards p{font-size:14px;color:#64748b;margin:0;line-height:1.5}.session-start .btn-primary{margin-top:8px;padding:10px 24px;font-size:14px;font-weight:500}.flashcard-progress{width:100%;text-align:center}.flashcard-progress span{display:inline-block;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--primary);margin-bottom:var(--spacing-3)}.flashcard-progress .progress-bar{width:100%;height:6px;background:var(--border);border-radius:var(--radius-full);overflow:hidden}.flashcard-progress .progress-bar-fill{height:100%;background:var(--primary);border-radius:var(--radius-full);transition:width var(--transition-slow) var(--ease-default)}.flashcard{width:100%;height:420px;perspective:1000px;cursor:pointer}.flashcard-inner{width:100%;height:100%;position:relative;transition:transform .6s var(--ease-bounce);transform-style:preserve-3d}.flashcard.flipped .flashcard-inner{transform:rotateY(180deg)}.flashcard-front,.flashcard-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:var(--radius-2xl);display:flex;flex-direction:column;padding:var(--spacing-6);box-shadow:var(--shadow-lg);overflow:hidden;background:#fff}.flashcard-front{background:#fff;border:1px solid var(--border);align-items:center;justify-content:center}.card-header{position:absolute;top:var(--spacing-5);right:var(--spacing-5);left:var(--spacing-5);display:flex;justify-content:space-between;align-items:center}.difficulty-badge{padding:4px 10px;border-radius:var(--radius-full);background:var(--bg-tertiary);color:var(--text-secondary);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);text-transform:uppercase}.difficulty-badge.c1,.difficulty-badge.c2{background:var(--error-bg);color:var(--error-text)}.difficulty-badge.b1,.difficulty-badge.b2{background:var(--warning-bg);color:var(--warning-text)}.difficulty-badge.a1,.difficulty-badge.a2{background:var(--success-bg);color:var(--success-text)}.audio-btn{padding:var(--spacing-2);border-radius:var(--radius-full);color:var(--text-secondary);transition:background var(--transition-fast)}.audio-btn:hover{background:var(--bg-tertiary);color:var(--primary)}.card-main{text-align:center}.word-title{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);color:var(--text-primary);margin-bottom:var(--spacing-2);line-height:1.2}.word-meta{display:flex;gap:var(--spacing-3);justify-content:center;align-items:center;color:var(--text-secondary);font-size:var(--font-size-sm)}.pos-tag{font-style:italic;font-family:serif}.pronunciation{opacity:.8}.flashcard-back{background:var(--primary);background:linear-gradient(135deg,var(--primary-600) 0%,var(--primary-800) 100%);color:#fff;transform:rotateY(180deg);border:1px solid var(--primary-dark);align-items:center;justify-content:flex-start;text-align:center;padding:var(--spacing-8) var(--spacing-6)}.back-content{display:flex;flex-direction:column;gap:var(--spacing-3);height:100%;width:100%;align-items:center}.meaning-section{text-align:center;margin-bottom:var(--spacing-4);flex-shrink:0}.bn-meaning{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-1);line-height:1.3}.bn-pronunciation{font-size:var(--font-size-sm);opacity:.8;font-style:italic}.en-definition{font-size:var(--font-size-base);line-height:var(--line-height-relaxed);opacity:.95;margin-bottom:var(--spacing-2)}.section-label{font-size:10px;font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:1px;opacity:.6;margin-right:var(--spacing-2)}.synonyms-section{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--spacing-2);margin-top:auto;margin-bottom:var(--spacing-2);opacity:.9}.synonym-chips{display:inline-flex;flex-wrap:wrap;gap:var(--spacing-2);justify-content:center}.chip{border:1px solid rgba(255,255,255,.3);padding:2px 10px;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.example-section{font-style:italic;opacity:.85;font-size:var(--font-size-sm);margin-bottom:var(--spacing-2);max-width:90%;line-height:1.5}.example-text:before{content:"Example: ";font-style:normal;font-weight:var(--font-weight-bold);font-size:10px;text-transform:uppercase;opacity:.7;display:block;margin-bottom:4px}.memory-hook-section{margin-top:auto;width:100%;cursor:pointer;padding-top:var(--spacing-3);border-top:1px solid rgba(255,255,255,.2)}.section-header{display:flex;justify-content:center;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);text-transform:uppercase;opacity:.8;margin-bottom:var(--spacing-1)}.hook-text{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);min-height:20px}.tap-hint{position:absolute;bottom:var(--spacing-5);left:0;right:0;text-align:center;font-size:var(--font-size-xs);color:var(--text-muted)}.answer-buttons{display:flex;gap:var(--spacing-3);width:100%}.answer-btn{flex:1;padding:var(--spacing-3) var(--spacing-2);border:1px solid transparent;border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);background:#fff;box-shadow:var(--shadow-sm)}.answer-btn.hard{color:var(--error-text);border-color:var(--error-border);background:var(--error-bg)}.answer-btn.hard:hover{background:#fee2e2;transform:translateY(-2px);box-shadow:var(--shadow-md)}.answer-btn.good{color:var(--warning-text);border-color:var(--warning-border);background:var(--warning-bg)}.answer-btn.good:hover{background:#fef3c7;transform:translateY(-2px);box-shadow:var(--shadow-md)}.answer-btn.easy{color:var(--success-text);border-color:var(--success-border);background:var(--success-bg)}.answer-btn.easy:hover{background:#d1fae5;transform:translateY(-2px);box-shadow:var(--shadow-md)}.session-complete{text-align:center;padding:var(--spacing-10) var(--spacing-5)}@media(max-width:480px){.flashcards-page{padding:var(--spacing-4);gap:var(--spacing-5)}.flashcard{height:480px;max-height:70vh}}.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background .15s}.btn-secondary{background:#f1f5f9;color:#0f172a;border:1px solid #e2e8f0}.btn-secondary:hover{background:#e2e8f0}.practice-page{max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:20px;padding:24px 20px}.mode-switcher-card{width:100%;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:20px}.mode-buttons{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:16px}.mode-description{font-size:13px;color:#64748b;text-align:center;padding:12px 16px;background:#f8fafc;border-radius:8px;line-height:1.5}.premium-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:#f59e0b;background:#fffbeb;padding:3px 8px;border-radius:12px;border:1px solid #fcd34d;margin-left:8px}.practice-progress{width:100%;text-align:center}.practice-progress>span{display:inline-block;font-size:13px;font-weight:600;color:#6366f1;margin-bottom:12px}.practice-progress .progress-bar{width:100%;height:6px;background:#e2e8f0;border-radius:999px;overflow:hidden}.practice-progress .progress-bar-fill{height:100%;background:#6366f1;border-radius:999px;transition:width .3s ease}.question-card{width:100%;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:32px;text-align:center}.question-type{display:inline-block;font-size:11px;font-weight:600;color:#6366f1;text-transform:uppercase;letter-spacing:.5px;padding:4px 12px;background:#eff6ff;border-radius:12px;margin-bottom:20px}.question-text{font-size:20px;font-weight:600;color:#0f172a;line-height:1.4;margin-bottom:24px}.question-hint{font-size:13px;color:#64748b;font-style:italic;margin-bottom:24px;padding:12px 16px;background:#fffbeb;border-radius:8px;border-left:3px solid #f59e0b}.options{display:grid;gap:12px}.option-btn{width:100%;padding:16px 20px;border:1px solid #e2e8f0;background:#fff;border-radius:10px;font-size:14px;color:#0f172a;cursor:pointer;transition:all .15s;text-align:left;font-weight:500}.option-btn:hover:not(:disabled){border-color:#6366f1;background:#f8fafc}.option-btn:disabled{cursor:not-allowed;opacity:.7}.option-btn.correct{border-color:#22c55e;background:#ecfdf5;color:#166534}.option-btn.wrong{border-color:#ef4444;background:#fee2e2;color:#991b1b}.fill-blank-area{display:flex;gap:12px;flex-wrap:wrap}.fill-blank-area .input{flex:1;min-width:200px;padding:12px 16px;border:1px solid #e2e8f0;border-radius:8px;font-size:15px;background:#f8fafc;transition:all .15s}.fill-blank-area .input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;background:#fff}.fill-blank-area .input::placeholder{color:#94a3b8}.feedback{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:20px;padding:14px 20px;border-radius:8px;font-weight:600;font-size:14px}.feedback.correct{background:#ecfdf5;color:#166534;border:1px solid #86efac}.feedback.wrong{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}.session-complete,.empty-practice{text-align:center;padding:48px 32px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;max-width:480px;margin:0 auto}.result-icon{width:72px;height:72px;background:#fffbeb;color:#f59e0b;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-bottom:20px}.session-complete h1,.empty-practice h2{font-size:22px;font-weight:600;color:#0f172a;margin-bottom:16px}.score-display{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:32px}.score-value{font-size:48px;font-weight:700;color:#6366f1;line-height:1}.score-percent{font-size:18px;font-weight:600;color:#64748b}.empty-practice p{font-size:14px;color:#64748b;margin-bottom:24px}.session-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.loading-state{display:flex;justify-content:center;align-items:center;min-height:300px}.loading-state .spinner{width:32px;height:32px;border:3px solid #e2e8f0;border-top-color:#6366f1;border-radius:50%;animation:spin .8s linear infinite}@media(max-width:600px){.practice-page{padding:16px;gap:16px}.mode-switcher-card{padding:16px}.mode-buttons{gap:6px}.mode-buttons .btn{padding:8px 12px;font-size:12px}.question-card{padding:24px 20px}.question-text{font-size:18px}.option-btn{padding:14px 16px;font-size:13px}.score-value{font-size:36px}.fill-blank-area{flex-direction:column}.fill-blank-area .input{min-width:100%}.fill-blank-area .btn{width:100%}.result-icon{width:60px;height:60px}}.stat-item{display:flex;align-items:center;gap:14px;padding:18px;background:#fff;border:1px solid #e2e8f0;border-radius:12px}.stat-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-icon.blue{background:#eff6ff;color:#3b82f6}.stat-icon.purple{background:#f3e8ff;color:#8b5cf6}.stat-icon.green{background:#ecfdf5;color:#10b981}.stat-icon.indigo{background:#e0e7ff;color:#6366f1}.stat-icon.orange{background:#ffedd5;color:#ea580c}.stat-icon.red{background:#fee2e2;color:#dc2626}.stat-icon.teal{background:#f0fdfa;color:#14b8a6}.stat-icon.amber{background:#fffbeb;color:#f59e0b}.stat-icon.gold{background:#fef3c7;color:#d97706}.stat-icon.silver{background:#f1f5f9;color:#64748b}.stat-content{display:flex;flex-direction:column}.stat-value{font-size:22px;font-weight:700;color:#0f172a}.stat-label{font-size:13px;color:#64748b;margin-top:2px}.stat-sub{font-size:12px;color:#94a3b8;margin-top:2px}.progress-page{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:24px}.progress-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.progress-grid .full-width{grid-column:1 / -1}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-4)}@media(min-width:1024px){.stats-grid{grid-template-columns:repeat(3,1fr)}}.stat-icon-wrapper.blue{background:var(--primary-50);color:var(--primary)}.stat-icon-wrapper.purple{background:var(--secondary-50);color:var(--secondary)}.stat-icon-wrapper.green{background:var(--success-bg);color:var(--success-text)}.stat-icon-wrapper.orange{background:var(--warning-bg);color:var(--warning-text)}.stat-icon-wrapper.red{background:var(--error-bg);color:var(--error-text)}.stat-icon-wrapper.teal{background:var(--info-bg);color:var(--info-text)}.stat-icon-wrapper.indigo{background:#e0e7ff;color:#6366f1}.stat-card-content{flex:1;min-width:0;display:flex;flex-direction:column}.stat-card-value{display:block;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--text-primary);line-height:1.2}.stat-card-label{display:block;font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:2px}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4)}.card-header h3{margin:0;font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--text-primary)}.change-badge{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);padding:4px 10px;border-radius:var(--radius-full)}.change-badge.positive{background:var(--success-bg);color:var(--success-text)}.change-badge.negative{background:var(--error-bg);color:var(--error-text)}.change-badge.neutral{background:var(--bg-tertiary);color:var(--text-secondary)}.weekly-chart{display:flex;justify-content:space-between;align-items:flex-end;height:120px;margin-top:var(--spacing-5);padding-top:var(--spacing-4);border-top:1px solid var(--border)}.chart-bar{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-2);flex:1}.bar-fill{width:24px;background:var(--primary);border-radius:var(--radius-sm);min-height:4px;transition:height var(--transition-slow)}.bar-value{font-size:11px;font-weight:var(--font-weight-semibold);color:var(--text-primary)}.bar-label{font-size:var(--font-size-xs);color:var(--text-muted)}.mastery-bars{display:flex;flex-direction:column;gap:var(--spacing-4);margin-top:var(--spacing-5)}.mastery-item{display:flex;flex-direction:column;gap:var(--spacing-2)}.mastery-label{display:flex;justify-content:space-between;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.mastery-label span:first-child{color:var(--text-primary)}.mastery-label span:last-child{color:var(--text-muted)}.progress-bar{height:8px;background:var(--bg-tertiary);border-radius:var(--radius-full);overflow:hidden}.progress-bar-fill{height:100%;border-radius:var(--radius-full);transition:width var(--transition-slow) var(--ease-default)}.progress-insights{padding:var(--spacing-5)}.progress-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--spacing-3);margin-top:var(--spacing-3)}.progress-link{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);border-radius:var(--radius-lg);border:1px solid var(--border);text-decoration:none;color:inherit;transition:all var(--transition-fast)}.progress-link:hover{border-color:var(--primary-200);background:var(--primary-50)}.progress-link-title{font-weight:var(--font-weight-bold);color:var(--text-primary)}.progress-link-sub{margin-top:var(--spacing-1);color:var(--text-secondary);font-size:var(--font-size-sm)}.progress-link-cta{color:var(--primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm)}.card h3{font-weight:var(--font-weight-semibold)}@media(max-width:1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}.progress-grid{grid-template-columns:1fr}}@media(max-width:768px){.stats-grid{grid-template-columns:repeat(2,1fr)}.card-header{flex-direction:column;align-items:flex-start;gap:var(--spacing-2)}.progress-links{grid-template-columns:1fr}}@media(max-width:480px){.stats-grid{grid-template-columns:1fr}}.profile-page{max-width:600px;margin:0 auto;display:flex;flex-direction:column;gap:20px;padding:24px 20px}.profile-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.profile-header{display:flex;align-items:center;gap:20px}.profile-avatar{width:72px;height:72px;border-radius:50%;background:#6366f1;color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:600;flex-shrink:0}.profile-info{flex:1;min-width:0}.profile-info h2{font-size:20px;font-weight:600;color:#0f172a;margin:0 0 4px}.profile-info p{color:#64748b;font-size:14px;margin:0}.profile-info input{max-width:250px;padding:8px 12px;border:1px solid #e2e8f0;border-radius:6px;font-size:16px;background:#f8fafc}.profile-info input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;background:#fff}.profile-actions{display:flex;gap:8px}.profile-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.profile-stat{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px;text-align:center}.profile-stat .stat-value{display:block;font-size:28px;font-weight:700;color:#6366f1;line-height:1;margin-bottom:8px}.profile-stat .stat-label{font-size:13px;color:#64748b}.settings-section{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.settings-section h3{font-size:16px;font-weight:600;color:#0f172a;margin:0 0 16px}.settings-list{display:flex;flex-direction:column}.setting-item{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid #f1f5f9}.setting-item:last-child{border-bottom:none}.setting-icon{width:36px;height:36px;background:#f8fafc;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#64748b;flex-shrink:0}.setting-item>span:nth-child(2){flex:1;font-weight:500;font-size:14px;color:#0f172a}.setting-value{color:#64748b;font-size:14px}.badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.badge-success{background:#ecfdf5;color:#059669;border:1px solid #86efac}.badge-primary{background:#eff6ff;color:#3b82f6;border:1px solid #93c5fd}.logout-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 20px;border:1px solid #ef4444;background:#fff;color:#ef4444;border-radius:8px;font-weight:500;font-size:14px;cursor:pointer;transition:all .15s}.logout-btn:hover{background:#ef4444;color:#fff}.btn-ghost{background:#f1f5f9;color:#0f172a;border:1px solid #e2e8f0}.btn-ghost:hover{background:#e2e8f0}.input{padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;background:#f8fafc;color:#0f172a;transition:all .15s}.input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;background:#fff}.card{background:#fff;border:1px solid #e2e8f0;border-radius:12px}@media(max-width:768px){.profile-page{padding:16px}.profile-stats{grid-template-columns:repeat(2,1fr);gap:12px}.profile-stat{padding:16px}.profile-header{flex-direction:column;align-items:flex-start}.profile-avatar{width:64px;height:64px;font-size:24px}}.leaderboard-page{padding:var(--spacing-6);max-width:700px;margin:0 auto;min-height:80vh}.leaderboard-header{text-align:center;margin-bottom:var(--spacing-8)}.leaderboard-loading,.leaderboard-error{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:50vh;text-align:center}.leaderboard-error h3{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--spacing-2)}.leaderboard-error p{color:var(--text-secondary)}.empty-leaderboard{padding:var(--spacing-8);text-align:center;color:var(--text-secondary)}.personal-progress .leaderboard-container{display:flex;flex-direction:column;gap:var(--spacing-6)}.personal-best-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--spacing-4)}.stat-card{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--spacing-4);display:flex;align-items:center;gap:var(--spacing-3);box-shadow:var(--shadow-md);border:1px solid var(--border);transition:transform .2s,box-shadow .2s}.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.stat-icon{width:48px;height:48px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center}.stat-content{flex:1}.stat-value{font-size:1.75rem;font-weight:700;color:var(--text-primary);line-height:1}.stat-label{font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:2px}.stat-sub{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:2px}.weekly-comparison-card{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--spacing-5);box-shadow:var(--shadow-md);border:1px solid var(--border)}.comparison-header{display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-4)}.comparison-header h3{font-size:var(--font-size-lg);font-weight:600;color:var(--text-primary)}.comparison-content{display:flex;flex-direction:column;gap:var(--spacing-3)}.comparison-stat{display:flex;justify-content:space-between;align-items:center}.comparison-label{font-size:var(--font-size-sm);color:var(--text-secondary)}.comparison-value{font-size:var(--font-size-base);font-weight:600;color:var(--text-primary)}.comparison-change{padding:var(--spacing-3);border-radius:var(--radius-lg);display:flex;justify-content:space-between;align-items:center;font-weight:600}.comparison-change.positive{background:#dcfce7;color:#16a34a}.comparison-change.negative{background:#fee2e2;color:#dc2626}.change-value{font-size:1.25rem}.change-label{font-size:var(--font-size-sm);opacity:.9}.challenges-section{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--spacing-5);box-shadow:var(--shadow-md);border:1px solid var(--border)}.section-title{display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-lg);font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-4)}.challenges-list{display:flex;flex-direction:column;gap:var(--spacing-4)}.challenge-card{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-4);border:1px solid var(--border);transition:all .2s}.challenge-card:hover{border-color:var(--primary-300);box-shadow:var(--shadow-md)}.challenge-card.completed{background:#f0fdf4;border-color:#86efac}.challenge-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2)}.challenge-header h4{font-size:var(--font-size-base);font-weight:600;color:var(--text-primary)}.completed-badge{display:inline-flex;align-items:center;gap:4px;background:#22c55e;color:#fff;padding:4px 10px;border-radius:20px;font-size:var(--font-size-xs);font-weight:600}.challenge-description{font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:var(--spacing-3)}.challenge-progress{display:flex;flex-direction:column;gap:var(--spacing-2)}.progress-bar{height:8px;background:var(--bg-tertiary);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-400));border-radius:4px;transition:width .5s ease}.challenge-card.completed .progress-fill{background:linear-gradient(90deg,#22c55e,#86efac)}.progress-labels{display:flex;justify-content:space-between;font-size:var(--font-size-xs);color:var(--text-secondary)}.empty-challenges{padding:var(--spacing-6);text-align:center;color:var(--text-secondary)}.motivation-card{background:linear-gradient(135deg,var(--primary),var(--primary-600));border-radius:var(--radius-xl);padding:var(--spacing-6);text-align:center;color:#fff}.motivation-text{font-size:var(--font-size-lg);font-style:italic;margin-bottom:var(--spacing-2);opacity:.95}.motivation-sub{font-size:var(--font-size-sm);opacity:.8}.podium{display:flex;justify-content:center;align-items:flex-end;gap:var(--spacing-2);margin-bottom:var(--spacing-10);height:auto;min-height:260px}.podium-place{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;width:100px}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.crowning-moment{position:absolute;top:-45px;left:50%;transform:translate(-50%);animation:float 3s ease-in-out infinite;z-index:10}.crown-icon{color:#fbbf24;filter:drop-shadow(0 4px 6px rgba(251,191,36,.4))}.place-1{order:2;z-index:2;margin-bottom:20px}.place-2{order:1}.place-3{order:3}.podium-avatar-wrapper{position:relative;margin-bottom:var(--spacing-3);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.podium-place:hover .podium-avatar-wrapper{transform:scale(1.05)}.podium-avatar{width:80px;height:80px;border-radius:50%;border:4px solid #fff;box-shadow:var(--shadow-lg);background:var(--bg-secondary);display:flex;align-items:center;justify-content:center;overflow:hidden}.podium-avatar img{width:100%;height:100%;object-fit:cover}.place-1 .podium-avatar{width:100px;height:100px;border-color:#fbbf24;box-shadow:0 0 0 4px #fbbf2433,var(--shadow-xl)}.place-2 .podium-avatar{border-color:#94a3b8}.place-3 .podium-avatar{border-color:#d97706}.rank-badge{position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:28px;height:28px;border-radius:50%;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs);box-shadow:var(--shadow-md);color:#fff;border:2px solid #fff}.place-1 .rank-badge{background:#fbbf24;color:#78350f;width:32px;height:32px;font-size:1rem}.place-2 .rank-badge{background:#94a3b8;color:#fff}.place-3 .rank-badge{background:#d97706;color:#fff}.avatar-placeholder{font-size:1.5rem;font-weight:700;color:var(--text-secondary);text-transform:uppercase}.podium-info{display:flex;flex-direction:column;gap:2px}.podium-name{font-weight:600;font-size:var(--font-size-sm);color:var(--text-primary);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.podium-xp{font-size:var(--font-size-xs);color:var(--text-secondary);font-weight:500}.place-1 .podium-name{font-weight:700;font-size:var(--font-size-base)}.place-1 .podium-xp{color:var(--primary);font-weight:600}.leaderboard-list{background:var(--bg-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);border:1px solid var(--border);overflow:hidden}.leaderboard-item{display:flex;align-items:center;padding:var(--spacing-4);border-bottom:1px solid var(--border-light);transition:background .2s}.leaderboard-item:last-child{border-bottom:none}.leaderboard-item:hover{background:var(--bg-secondary)}.leaderboard-item.is-me{background:#eff6ff;position:relative}.leaderboard-item.is-me:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--primary)}.leaderboard-item .rank{width:32px;font-weight:600;color:var(--text-secondary);text-align:center;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.leaderboard-item .user-info{flex:1;display:flex;align-items:center;gap:var(--spacing-3);margin-left:var(--spacing-2)}.leaderboard-item .avatar{width:42px;height:42px;border-radius:50%;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--text-secondary);flex-shrink:0}.leaderboard-item .avatar img{width:100%;height:100%;object-fit:cover}.name-col{display:flex;flex-direction:column}.leaderboard-item .name{font-weight:500;color:var(--text-primary);font-size:var(--font-size-sm);display:flex;align-items:center;gap:6px}.level-sub{font-size:.7rem;color:var(--text-muted)}.me-badge{font-size:.65rem;color:var(--primary);background:var(--primary-50);padding:1px 6px;border-radius:4px;font-weight:600;text-transform:uppercase;letter-spacing:.02em}.xp-stat{text-align:right;display:flex;flex-direction:column;align-items:flex-end}.xp-val{display:block;font-weight:700;color:var(--text-primary);font-feature-settings:"tnum"}.xp-label{display:block;font-size:.65rem;color:var(--text-muted);text-transform:uppercase;font-weight:500}.my-rank-footer{position:sticky;bottom:var(--spacing-4);margin-top:var(--spacing-4);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg);z-index:20;border:1px solid var(--primary-200)}.is-me-footer{background:#fff}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-slide-up{opacity:0;animation:slideUp .6s cubic-bezier(.16,1,.3,1) forwards}@media(max-width:640px){.leaderboard-page{padding:var(--spacing-4)}.podium{gap:var(--spacing-1)}.podium-place{width:30%}.place-1 .podium-avatar{width:80px;height:80px}.podium-avatar{width:60px;height:60px}}.search-page{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:var(--spacing-6)}.page-header{margin-bottom:0}.search-paywall{display:flex;gap:var(--spacing-4);align-items:flex-start;padding:var(--spacing-5);background:var(--warning-bg);border:1px solid var(--warning-border);border-radius:var(--radius-lg)}.search-paywall-icon{flex-shrink:0;width:40px;height:40px;background:var(--bg-primary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:var(--warning-text);border:1px solid var(--warning-border)}.search-paywall-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--warning-text);margin-bottom:var(--spacing-1)}.search-paywall-text{font-size:var(--font-size-sm);color:var(--warning-text);line-height:var(--line-height-normal)}.search-filters{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--spacing-6)}.search-filters-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-5);padding-bottom:var(--spacing-4);border-bottom:1px solid var(--border-light)}.search-filters-title{display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary)}.search-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-5);margin-bottom:var(--spacing-6)}.search-field{display:flex;flex-direction:column;gap:var(--spacing-2)}.search-field label{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.search-input-row{position:relative}.search-icon{position:absolute;left:var(--spacing-3);top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}.search-input-row .input{padding-left:38px}.search-help{font-size:var(--font-size-xs);color:var(--text-muted)}.search-toggles{display:flex;flex-wrap:wrap;gap:var(--spacing-4) var(--spacing-6);padding:var(--spacing-4);background:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border)}.toggle{display:flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-sm);color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}.toggle input[type=checkbox]{width:16px;height:16px;border-radius:var(--radius-sm);border:1px solid var(--border-medium);cursor:pointer}.search-actions{display:flex;align-items:center;gap:var(--spacing-4);margin-top:var(--spacing-6);padding-top:var(--spacing-5);border-top:1px solid var(--border-light)}.search-muted{display:inline-flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-xs);color:var(--text-secondary)}.search-meta{font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:var(--spacing-2)}.search-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--spacing-4)}.search-result{display:block;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--spacing-4);text-decoration:none;transition:all var(--transition-fast) var(--ease-default)}.search-result:hover{border-color:var(--primary);box-shadow:var(--shadow-primary);transform:translateY(-1px)}.search-result-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-2)}.search-result-sub{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacing-2);font-size:var(--font-size-xs);color:var(--text-secondary)}.dot{color:var(--text-muted);font-size:8px}.search-error{padding:var(--spacing-4);background:var(--error-bg);border:1px solid var(--error-border);border-radius:var(--radius-md);color:var(--error-text);font-size:var(--font-size-sm)}.empty-state{grid-column:1 / -1;text-align:center;padding:60px 20px;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text-muted)}@media(max-width:640px){.search-grid{grid-template-columns:1fr}.search-toggles{flex-direction:column;gap:var(--spacing-3)}.search-actions{flex-direction:column;align-items:stretch}.btn-primary{width:100%;justify-content:center}}.reports-page{max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:20px;padding:24px 20px}.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.page-header h1{font-size:24px;font-weight:600;color:#0f172a;margin-bottom:4px}.page-header p{font-size:14px;color:#64748b}.reports-paywall{display:flex;gap:12px;align-items:flex-start;padding:14px 18px;background:#fffbeb;border:1px solid #fcd34d;border-radius:10px}.reports-paywall-icon{width:32px;height:32px;border-radius:8px;background:#fef3c7;display:flex;align-items:center;justify-content:center;color:#b45309;flex-shrink:0}.reports-paywall-title{font-weight:600;font-size:14px;color:#92400e;margin-bottom:4px}.reports-paywall-text{color:#b45309;font-size:13px;line-height:1.5}.reports-controls{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:18px}.reports-controls-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}.reports-field{display:flex;flex-direction:column;gap:6px}.reports-field label{font-size:13px;font-weight:500;color:#64748b}.reports-field .input{padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;font-size:14px;background:#f8fafc;color:#0f172a;transition:all .15s}.reports-field .input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a;background:#fff}.reports-muted{display:inline-flex;gap:6px;align-items:center;color:#64748b;font-size:13px}.reports-error{padding:14px 18px;background:#fee2e2;border:1px solid #fca5a5;border-radius:10px;color:#991b1b;font-size:14px}.reports-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.report-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px}.report-card-title{display:flex;gap:8px;align-items:center;font-weight:600;font-size:13px;color:#64748b;margin-bottom:12px}.report-card-value{font-size:32px;font-weight:700;color:#0f172a;line-height:1}.report-card-sub{color:#94a3b8;font-size:12px;margin-top:6px}.reports-weak{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:20px}.reports-weak h3{font-size:16px;font-weight:600;color:#0f172a;margin:0 0 16px}.reports-weak-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.weak-word{display:block;padding:14px 16px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;text-decoration:none;color:#0f172a;transition:all .15s}.weak-word:hover{border-color:#6366f1;box-shadow:0 2px 8px #6366f11a}.weak-word-title{font-weight:600;font-size:15px;color:#0f172a;margin-bottom:4px}.weak-word-sub{color:#64748b;font-size:13px;line-height:1.4}.empty-state{text-align:center;padding:32px 20px;color:#94a3b8}.empty-state p{margin:0;font-size:14px}.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s}.btn-primary{background:#6366f1;color:#fff}.btn-primary:hover{background:#4f46e5}.btn-primary:disabled{opacity:.5;cursor:not-allowed}@media(max-width:768px){.reports-page{padding:16px}.reports-cards,.reports-weak-grid{grid-template-columns:1fr}.reports-controls-row{flex-direction:column;align-items:stretch}.reports-field{width:100%}.btn{width:100%;justify-content:center}}.upgrade-page{max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:20px}.upgrade-header{display:flex;align-items:center;gap:16px}.upgrade-header .back-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;color:#64748b;text-decoration:none;font-size:14px;font-weight:500;border-radius:8px;transition:background .15s}.upgrade-header .back-btn:hover{background:#f1f5f9}.header-title h1{font-size:22px;font-weight:600;color:#0f172a;margin:0}.header-title p{margin:2px 0 0;font-size:14px}.text-secondary{color:#64748b}.text-success{color:#10b981}.text-error{color:#ef4444}.text-sm{font-size:13px}.alert{padding:14px 16px;border-radius:10px;font-weight:500}.alert-error{background:#ef444414;border:1px solid rgba(239,68,68,.2);color:#b91c1c}.alert-success{background:#22c55e14;border:1px solid rgba(34,197,94,.2);color:#166534}.section{background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}.section-header{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid #e2e8f0}.section-header h2{font-size:15px;font-weight:600;color:#0f172a;display:flex;align-items:center;gap:8px;margin:0}.section-header.clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.section-header .chevron{font-size:12px;color:#94a3b8}.premium-active-card{padding:48px 24px;text-align:center}.premium-active-card .premium-icon{width:72px;height:72px;margin:0 auto 20px;background:#fef3c7;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#f59e0b}.premium-active-card h2{font-size:22px;margin:0 0 12px}.premium-active-card p{margin:0 0 24px}.request-list{display:flex;flex-direction:column}.request-item{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid #f1f5f9}.request-item:last-child{border-bottom:none}.request-title{font-weight:600;font-size:14px}.feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#e2e8f0}.feature-item{display:flex;gap:12px;padding:16px 18px;background:#fff}.feature-icon{width:40px;height:40px;background:#eff6ff;color:#3b82f6;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.feature-name{font-weight:600;font-size:14px;margin-bottom:2px}.feature-desc{font-size:13px;color:#64748b}.trial-section{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;flex-wrap:wrap}.trial-content{display:flex;align-items:center;gap:12px}.trial-icon{color:#f59e0b}.trial-title{font-weight:600;font-size:15px}.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;padding:18px}.plan-card{position:relative;padding:24px 18px;border:1px solid #e2e8f0;border-radius:12px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;transition:border-color .15s,box-shadow .15s}.plan-card:hover{border-color:#6366f1;box-shadow:0 4px 12px #6366f126}.discount-badge{position:absolute;top:-10px;right:14px;background:#ef4444;color:#fff;padding:4px 10px;border-radius:10px;font-size:11px;font-weight:600}.plan-price{font-size:28px;font-weight:700;color:#6366f1}.plan-name{font-weight:600;font-size:15px;color:#0f172a}.plan-duration{font-size:13px;color:#64748b;margin-bottom:8px}.plan-card .btn{margin-top:auto}.back-link{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:#64748b;font-size:14px;font-weight:500;cursor:pointer;padding:8px 0}.back-link:hover{color:#0f172a}.order-summary{display:flex;justify-content:space-between;padding:20px;background:#f8fafc}.order-plan{font-size:20px;font-weight:700;margin:4px 0}.order-price{text-align:right}.price-value{font-size:28px;font-weight:700;color:#6366f1}.reference-section{padding:18px;background:#fef3c7;border-color:#fcd34d}.reference-label{font-size:12px;font-weight:600;text-transform:uppercase;color:#92400e;margin-bottom:8px}.reference-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.reference-code{background:#fff;padding:10px 16px;border-radius:8px;font-size:18px;font-weight:700;letter-spacing:1px;color:#92400e}.provider-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;padding:18px}.provider-card{border:2px solid #e2e8f0;border-radius:10px;padding:16px;text-align:center;cursor:pointer;transition:all .15s}.provider-card:hover{border-color:#6366f1;background:#f8fafc}.provider-card.selected{border-color:#6366f1;background:#eff6ff}.provider-logo{height:36px;display:flex;align-items:center;justify-content:center;margin-bottom:8px}.provider-logo img{height:28px;width:auto;object-fit:contain}.provider-emoji{font-size:28px}.provider-name{font-weight:600;font-size:13px}.payment-instructions{padding:18px;display:flex;flex-direction:column;gap:14px}.merchant-number{background:#f8fafc;padding:14px;border-radius:10px}.number-row{display:flex;align-items:center;gap:10px;margin-top:6px}.number-value{font-size:20px;font-weight:700;color:#6366f1;letter-spacing:1px}.provider-details{background:#f8fafc;padding:12px;border-radius:8px;font-size:13px;white-space:pre-wrap;margin:0}.instructions-text{font-size:14px;line-height:1.6;color:#475569}.media-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.guide-screenshot{max-width:160px;border-radius:8px;border:1px solid #e2e8f0;cursor:pointer;transition:transform .15s}.guide-screenshot:hover{transform:scale(1.02)}.video-link{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:#eff6ff;color:#2563eb;border-radius:8px;text-decoration:none;font-weight:500;font-size:14px}.video-link:hover{background:#dbeafe}.payment-form{padding:18px;display:flex;flex-direction:column;gap:16px}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}.form-group{display:flex;flex-direction:column}.form-label{font-size:13px;font-weight:600;margin-bottom:6px;color:#374151}.form-label .required{color:#ef4444}.form-helper{font-size:12px;color:#64748b;margin-top:4px}.empty-state{padding:24px;text-align:center;background:#f8fafc;border-radius:8px;color:#64748b}.upload-area{border:2px dashed #e2e8f0;border-radius:12px;padding:24px;text-align:center;cursor:pointer;transition:all .15s}.upload-area:hover{border-color:#6366f1;background:#f8fafc}.upload-area.has-file{border-style:solid;border-color:#10b981;background:#10b9810d;padding:16px}.upload-placeholder{display:flex;flex-direction:column;align-items:center;gap:8px;color:#64748b}.upload-preview img{max-width:100%;max-height:200px;border-radius:8px;margin-bottom:12px}.upload-info{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:500}.security-note{display:flex;align-items:center;justify-content:center;gap:6px;font-size:13px;color:#64748b;margin-top:8px}.loading-section{padding:48px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.confirm-dialog{background:#fff;border-radius:12px;padding:24px;max-width:420px;width:100%}.confirm-dialog h3{margin:0 0 8px;font-size:18px}.confirm-dialog p{margin:0 0 16px}.confirm-details{background:#f8fafc;padding:16px;border-radius:10px;margin-bottom:20px}.confirm-row{display:flex;justify-content:space-between;padding:6px 0}.confirm-screenshot{display:flex;align-items:center;gap:8px;padding-top:12px;margin-top:12px;border-top:1px solid #e2e8f0;font-size:13px}.confirm-actions{display:flex;gap:10px;justify-content:flex-end}.btn-full{width:100%}.btn-lg{padding:14px 20px;font-size:16px}.btn-sm{padding:6px 12px;font-size:13px}.spinner-sm{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;display:inline-block;margin-right:8px}@keyframes spin{to{transform:rotate(360deg)}}.screenshot-modal{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:9999;padding:20px}.screenshot-modal img{max-width:100%;max-height:90vh;border-radius:8px}.screenshot-modal-close{position:absolute;top:20px;right:20px;background:#ffffff26;border:none;color:#fff;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center}.screenshot-modal-close:hover{background:#ffffff40}.badge{display:inline-block;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600}.badge-error{background:#ef44441f;color:#dc2626}.badge-warning{background:#f59e0b1f;color:#d97706}.badge-success{background:#22c55e1f;color:#16a34a}@media(max-width:640px){.upgrade-header{flex-direction:column;align-items:flex-start}.feature-grid{grid-template-columns:1fr}.trial-section{flex-direction:column;align-items:stretch}.trial-content{flex-direction:column;text-align:center}.order-summary{flex-direction:column;gap:16px}.order-price{text-align:left}.plans-grid{grid-template-columns:1fr}.provider-grid{grid-template-columns:repeat(2,1fr)}}.weak-words-page{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:24px}.weak-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.weak-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-4)}.practice-suggestion{display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-5);background:linear-gradient(135deg,var(--primary-50) 0%,var(--primary-100) 100%);border:1px solid var(--primary-200);border-radius:var(--radius-xl);transition:all var(--transition-fast)}.practice-suggestion:hover{box-shadow:var(--shadow-primary)}.practice-suggestion svg{color:var(--primary);flex-shrink:0}.practice-suggestion div{flex:1}.practice-suggestion h3{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin:0 0 var(--spacing-1) 0}.practice-suggestion p{font-size:var(--font-size-sm);color:var(--text-secondary);margin:0}.card h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-4)}.weak-words-list{display:flex;flex-direction:column;gap:var(--spacing-3)}.weak-word-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-4);background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);text-decoration:none;color:inherit;transition:all var(--transition-fast)}.weak-word-item:hover{box-shadow:var(--shadow-sm);border-color:var(--primary-200);transform:translateY(-1px)}.word-content{flex:1;min-width:0}.word-content h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin:0 0 var(--spacing-1) 0}.word-content p{font-size:var(--font-size-sm);color:var(--text-secondary);margin:0 0 var(--spacing-2) 0;line-height:var(--line-height-relaxed)}.word-stats{display:flex;gap:var(--spacing-2);flex-wrap:wrap}.stat-chip{font-size:var(--font-size-xs);padding:4px 10px;background:var(--bg-tertiary);color:var(--text-secondary);border-radius:var(--radius-full);font-weight:var(--font-weight-medium)}.word-accuracy{display:flex;align-items:center;gap:var(--spacing-3);flex-shrink:0}.accuracy-badge{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);padding:var(--spacing-1) var(--spacing-3);border-radius:var(--radius-full);min-width:60px;text-align:center}.accuracy-badge.critical{background:var(--error-bg);color:var(--error-text)}.accuracy-badge.warning,.accuracy-badge.improving{background:var(--warning-bg);color:var(--warning-text)}.word-accuracy .arrow{color:var(--text-muted)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-12) var(--spacing-6);background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-xl);text-align:center}.empty-state svg{color:var(--success-text);margin-bottom:var(--spacing-4)}.empty-state h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-2)}.empty-state p{font-size:var(--font-size-sm);color:var(--text-secondary);margin:0 0 var(--spacing-6) 0}.empty-state .btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-5);background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;text-decoration:none;transition:all var(--transition-fast)}.empty-state .btn-secondary:hover{background:var(--bg-tertiary);border-color:var(--slate-300)}@media(max-width:1024px){.weak-grid{grid-template-columns:1fr}}@media(max-width:768px){.weak-stats{grid-template-columns:1fr}.practice-suggestion{flex-direction:column;text-align:center}.practice-suggestion .btn-primary{width:100%}.weak-word-item{flex-direction:column;align-items:flex-start;gap:var(--spacing-3)}.word-accuracy{width:100%;justify-content:space-between}}.badges-page{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:24px}.badges-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.badges-grid-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.locked-badges-list{display:flex;flex-direction:column;gap:12px}.locked-badge-item{display:flex;align-items:center;gap:16px;padding:16px;background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;transition:all var(--transition-fast)}.locked-badge-item:hover{box-shadow:var(--shadow-sm);border-color:var(--slate-300)}.locked-badge-icon{position:relative;width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary);border-radius:12px;flex-shrink:0}.locked-badge-icon .badge-emoji{font-size:28px;opacity:.4;filter:grayscale(100%)}.lock-small{position:absolute;bottom:-4px;right:-4px;width:20px;height:20px;background:var(--bg-primary);border:2px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--text-muted)}.locked-badge-info{flex:1;min-width:0}.locked-badge-info h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin:0 0 var(--spacing-1) 0}.locked-badge-info p{font-size:var(--font-size-sm);color:var(--text-secondary);margin:0;line-height:var(--line-height-relaxed)}.almost-there-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.almost-there-card{display:flex;flex-direction:column;align-items:center;padding:20px;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center}.almost-there-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);border-radius:var(--radius-lg);margin-bottom:var(--spacing-3)}.almost-there-icon .badge-emoji{font-size:28px}.almost-there-card h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin:0 0 var(--spacing-2) 0}.almost-there-card p{font-size:var(--font-size-sm);color:var(--text-secondary);margin:0 0 var(--spacing-3) 0;line-height:var(--line-height-relaxed)}.progress-bar-small{width:100%;height:6px;background:var(--bg-primary);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--spacing-2)}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary) 0%,var(--primary-400) 100%);border-radius:var(--radius-full);transition:width .3s ease}.progress-text{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--primary)}.unlocked-badges-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.unlocked-badge-card{display:flex;flex-direction:column;align-items:center;padding:24px 16px;background:linear-gradient(135deg,var(--success-bg) 0%,rgba(34,197,94,.05) 100%);border:1px solid var(--success-border);border-radius:var(--radius-xl);text-align:center;transition:all var(--transition-fast)}.unlocked-badge-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.unlocked-badge-icon{width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:var(--bg-primary);border-radius:var(--radius-xl);margin-bottom:var(--spacing-4);box-shadow:var(--shadow-sm)}.unlocked-badge-icon .badge-emoji{font-size:32px;filter:none;opacity:1}.unlocked-badge-card h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin:0 0 var(--spacing-2) 0}.unlocked-badge-card p{font-size:var(--font-size-sm);color:var(--text-secondary);margin:0;line-height:var(--line-height-relaxed)}.empty-text{text-align:center;padding:var(--spacing-8) var(--spacing-4);color:var(--text-secondary);font-size:var(--font-size-base)}@media(max-width:1024px){.badges-grid-layout{grid-template-columns:1fr}.almost-there-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:768px){.badges-stats,.almost-there-grid,.unlocked-badges-grid{grid-template-columns:repeat(2,1fr)}}