:root{--bg-primary:#0b0f19;--bg-secondary:#111827;--bg-surface:#151d30;--bg-surface-hover:#1c263d;--bg-elevated:#1e293b;--bg-glass:rgba(17,24,39,0.75);--border-subtle:#1e293b;--border-medium:#334155;--border-focus:#6366f1;--border-highlight:rgba(99,102,241,0.3);--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--text-inverse:#0b0f19;--brand-primary:#6366f1;--brand-primary-hover:#4f46e5;--brand-secondary:#06b6d4;--brand-accent:#8b5cf6;--brand-glow:rgba(99,102,241,0.15);--badge-beginner-bg:rgba(16,185,129,0.12);--badge-beginner-border:rgba(16,185,129,0.3);--badge-beginner-text:#34d399;--badge-intermediate-bg:rgba(245,158,11,0.12);--badge-intermediate-border:rgba(245,158,11,0.3);--badge-intermediate-text:#fbbf24;--badge-advanced-bg:rgba(236,72,153,0.12);--badge-advanced-border:rgba(236,72,153,0.3);--badge-advanced-text:#f472b6;--badge-tech-bg:rgba(99,102,241,0.1);--badge-tech-border:rgba(99,102,241,0.25);--badge-tech-text:#a5b4fc;--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;--text-xs:0.75rem;--text-sm:0.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;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--radius-full:9999px;--shadow-sm:0 1px 2px 0 rgba(0,0,0,0.4);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.5),0 2px 4px -2px rgba(0,0,0,0.5);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.6),0 4px 6px -4px rgba(0,0,0,0.6);--shadow-glow:0 0 25px -5px rgba(99,102,241,0.3);--container-max:1240px;--reading-max:760px}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}body{min-height:100vh;display:flex;flex-direction:column;background-color:var(--bg-primary);color:var(--text-primary);overflow-x:hidden}:focus-visible{outline:2px solid var(--brand-primary);outline-offset:3px;border-radius:var(--radius-sm)}.skip-to-content{position:absolute;top:-100px;left:1rem;background:var(--brand-primary);color:#ffffff;padding:.75rem 1.25rem;z-index:9999;border-radius:var(--radius-md);font-weight:600;text-decoration:none;transition:top .2s ease}.skip-to-content:focus{top:1rem}h1,h2,h3,h4,h5,h6{color:var(--text-primary);font-weight:700;line-height:1.25;letter-spacing:-.02em}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}h4{font-size:var(--text-lg)}p{color:var(--text-secondary);font-size:var(--text-base);line-height:1.65}a{color:var(--brand-primary);text-decoration:none;transition:color .15s ease}a:hover{color:var(--brand-primary-hover)}button{font-family:inherit;cursor:pointer;border:none;background:none}img,svg{display:block;max-width:100%}code,pre{font-family:var(--font-mono)}.container{width:100%;max-width:var(--container-max);margin-left:auto;margin-right:auto;padding-left:var(--space-4);padding-right:var(--space-4)}@media (min-width:768px){.container{padding-left:var(--space-8);padding-right:var(--space-8)}}.reading-container{width:100%;max-width:var(--reading-max);margin-left:auto;margin-right:auto}.grid-2,.grid-3{display:grid;grid-template-columns:1fr;grid-gap:var(--space-6);gap:var(--space-6)}.grid-4{display:grid;grid-template-columns:1fr;grid-gap:var(--space-4);gap:var(--space-4)}@media (min-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}.card-base{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-6);transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}.card-base:hover{border-color:var(--border-medium);transform:translateY(-2px);box-shadow:var(--shadow-md)}.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .6rem;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.04em;border-width:1px;border-style:solid}.badge-beginner{background:var(--badge-beginner-bg);border-color:var(--badge-beginner-border);color:var(--badge-beginner-text)}.badge-intermediate{background:var(--badge-intermediate-bg);border-color:var(--badge-intermediate-border);color:var(--badge-intermediate-text)}.badge-advanced{background:var(--badge-advanced-bg);border-color:var(--badge-advanced-border);color:var(--badge-advanced-text)}.badge-tech{background:var(--badge-tech-bg);border-color:var(--badge-tech-border);color:var(--badge-tech-text)}.badge-type{background:rgba(255,255,255,.05);border-color:var(--border-subtle);color:var(--text-secondary)}.desktop-nav,.explore-btn{display:none}.mobile-toggle{display:flex}@media (min-width:768px){.desktop-nav{display:flex!important}.explore-btn{display:inline-flex!important}.mobile-toggle{display:none!important}}@media (min-width:1024px){.project-layout-grid{grid-template-columns:1fr 340px!important}}@media (max-width:480px){.search-btn-text{display:none!important}}