@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-base: #08090D;--bg-surface: #10121C;--bg-surface-2: #161926;--bg-surface-3: #1E2235;--primary: #0AE98A;--primary-hover: #1FFFB0;--primary-dim: rgba(10, 233, 138, .12);--accent: #00D9FF;--accent-hover: #33E4FF;--accent-dim: rgba(0, 217, 255, .12);--brand-indigo: #6366F1;--success: #0AE98A;--success-dim: rgba(10, 233, 138, .12);--warning: #F59E0B;--warning-dim: rgba(245, 158, 11, .12);--danger: #EF4444;--danger-dim: rgba(239, 68, 68, .12);--text-primary: #F8FAFC;--text-secondary: #94A3B8;--text-muted: #64748B;--border: #202436;--border-hover: #2E344E;--border-subtle: rgba(255, 255, 255, .07);--badge-bg: rgba(255, 255, 255, .05);--badge-border: rgba(255, 255, 255, .1);--badge-text: #94A3B8;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--sp-12: 48px;--sp-16: 64px;--sp-20: 80px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--shadow-sm: 0 1px 3px rgba(0,0,0,.4);--shadow-md: 0 4px 12px rgba(0,0,0,.5);--shadow-lg: 0 8px 32px rgba(0,0,0,.6);--shadow-primary: 0 0 24px rgba(108, 99, 255, .2);--shadow-accent: 0 0 24px rgba(0, 217, 255, .15);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--container-max: 1600px;--header-height: 64px;--bottom-nav-height: 58px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}@media(max-width:768px){:root{--header-height: 0px}}html{font-size:16px;scroll-behavior:smooth;overflow-x:hidden;-webkit-text-size-adjust:100%}body{background-color:var(--bg-base);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);line-height:1.6;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overflow-x:hidden;width:100%;min-height:100vh;min-height:100dvh}a{color:var(--primary);text-decoration:none;transition:color var(--transition-fast)}a:visited{color:inherit}a:hover{color:var(--primary-hover)}.container{max-width:var(--container-max);margin:0 auto;padding:0 clamp(var(--sp-4),3vw,56px)}.section{padding:var(--sp-16) 0}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-accent{color:var(--accent)}.text-violet{color:var(--primary)}.btn{display:inline-flex;align-items:center;gap:var(--sp-2);padding:10px 20px;font-size:var(--text-sm);font-weight:var(--font-medium);font-family:var(--font-sans);border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);white-space:nowrap;text-decoration:none!important;line-height:1}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary,.btn.btn-primary{background:var(--primary);border-color:var(--primary);color:#08090d!important;font-weight:var(--font-semibold)}.btn-primary:visited,.btn.btn-primary:visited{color:#08090d!important}.btn-primary:hover:not(:disabled),.btn.btn-primary:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover);color:#08090d!important;box-shadow:0 4px 16px var(--primary-dim)}.btn-secondary,.btn.btn-secondary{background:transparent;border:1px solid var(--primary);color:var(--primary)!important;font-weight:var(--font-medium)}.btn-secondary:visited,.btn.btn-secondary:visited{color:var(--primary)!important}.btn-secondary:hover:not(:disabled),.btn.btn-secondary:hover:not(:disabled){background:var(--primary-dim);border-color:var(--primary-hover);color:var(--primary-hover)!important}.btn-outline,.btn.btn-outline{background:transparent;border:1px solid var(--border);color:var(--text-primary);font-weight:var(--font-medium)}.btn-outline:visited,.btn.btn-outline:visited{color:var(--text-primary)}.btn-outline:hover:not(:disabled),.btn.btn-outline:hover:not(:disabled){border-color:var(--primary);color:var(--primary);background:var(--primary-dim)}.btn-outline-primary,.btn.btn-outline-primary{background:transparent;border:1px solid var(--primary);color:var(--primary)!important;font-weight:var(--font-medium)}.btn-outline-primary:visited,.btn.btn-outline-primary:visited{color:var(--primary)!important}.btn-outline-primary:hover:not(:disabled),.btn.btn-outline-primary:hover:not(:disabled){background:var(--primary-dim);border-color:var(--primary-hover);color:var(--primary-hover)!important}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover:not(:disabled){background:var(--bg-surface-2);color:var(--text-primary)}.btn-accent{background:var(--accent);color:#000;font-weight:var(--font-semibold)}.btn-accent:hover:not(:disabled){background:var(--accent-hover);box-shadow:var(--shadow-accent)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){opacity:.9}.btn-sm{padding:6px 14px;font-size:var(--text-xs)}.btn-lg{padding:13px 28px;font-size:var(--text-base)}.btn-icon{padding:8px;width:36px;height:36px;justify-content:center}.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-6);transition:border-color var(--transition-base),box-shadow var(--transition-base)}.card:hover{border-color:var(--border-hover)}.card-interactive{cursor:pointer}.card-interactive:hover{border-color:var(--primary);box-shadow:0 0 20px var(--primary-dim)}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-sm);background:var(--badge-bg);border:1px solid var(--badge-border);color:var(--badge-text)}.badge-primary{background:var(--primary-dim);color:var(--primary);border-color:#0ae98a40}.badge-accent{background:var(--accent-dim);color:var(--accent);border-color:#00d9ff40}.badge-success{background:var(--success-dim);color:var(--success);border-color:#0ae98a40}.badge-warning{background:var(--warning-dim);color:var(--warning);border-color:#f59e0b40}.badge-danger{background:var(--danger-dim);color:var(--danger);border-color:#ef444440}.badge-beginner{background:#0ae98a1a;color:var(--primary);border-color:#0ae98a40}.badge-intermediate{background:#f59e0b1a;color:var(--warning);border-color:#f59e0b40}.badge-advanced{background:#ef44441a;color:var(--danger);border-color:#ef444440}.badge-expert{background:#6366f11a;color:#818cf8;border-color:#6366f140}.badge-free{background:#0ae98a26;color:var(--primary);border-color:#0ae98a4d;font-weight:var(--font-semibold)}.badge-docs{background:#ffffff0d;color:var(--text-primary);border-color:var(--border)}.input{width:100%;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px 14px;color:var(--text-primary);font-size:var(--text-sm);font-family:var(--font-sans);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none}.input::placeholder{color:var(--text-muted)}.input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-dim)}.form-group{display:flex;flex-direction:column;gap:var(--sp-2)}.form-group label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-secondary)}.progress{height:4px;background:var(--bg-surface-3);border-radius:2px;overflow:hidden}.progress__fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:2px;transition:width .5s ease}.section-header{margin-bottom:var(--sp-10)}.section-header .section-eyebrow{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--accent);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--sp-3)}.section-header .section-title{font-size:var(--text-3xl);font-weight:var(--font-bold);color:var(--text-primary);line-height:1.2}.section-header .section-title span{color:var(--primary)}.section-header .section-subtitle{font-size:var(--text-lg);color:var(--text-secondary);margin-top:var(--sp-3);max-width:600px}.divider{height:1px;background:var(--border);border:none;margin:var(--sp-6) 0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-surface)}::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}pre,code{font-family:var(--font-mono);font-size:var(--text-sm)}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-6)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-6)}@media(max-width:1024px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr);gap:var(--sp-5)}}@media(max-width:640px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr;gap:var(--sp-4)}.container{padding:0 16px}.section{padding:var(--sp-8) 0}.section-header{margin-bottom:var(--sp-5)}.section-title{font-size:var(--text-2xl)}.input{font-size:16px}.card{padding:var(--sp-4);border-radius:var(--radius-md)}.btn{min-height:42px;touch-action:manipulation}}@media(hover:none){.card:hover,.card-interactive:hover,.btn:hover{transform:none!important}.btn:active,.card-interactive:active,button:active{transform:scale(.97)!important;transition:transform .08s ease!important}}.btn-block{width:100%;justify-content:center}@media(max-width:768px){.hide-on-mobile{display:none!important}.show-on-mobile{display:block!important}}@media(min-width:769px){.show-on-mobile{display:none!important}}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.4}}.skeleton{background:var(--bg-surface-2);border-radius:var(--radius-md);animation:skeleton-pulse 1.5s ease-in-out infinite}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--sp-16) var(--sp-6);text-align:center;color:var(--text-secondary)}.empty-state .empty-icon{font-size:3rem;margin-bottom:var(--sp-4);opacity:.4}.empty-state h3{font-size:var(--text-xl);color:var(--text-primary);margin-bottom:var(--sp-2)}.empty-state p{color:var(--text-secondary);max-width:400px}@media all and (display-mode:standalone){body{user-select:none;-webkit-user-select:none;overscroll-behavior-y:contain}input,textarea,[contenteditable=true]{user-select:text;-webkit-user-select:text}.navbar-wrapper{padding-top:env(safe-area-inset-top,0px)}}