:root{--bg: #fdfdfd;--bg-secondary: #fafafa;--text: #0d0d0d;--text-secondary: #555;--text-muted: #888;--border: rgba(0, 0, 0, .05);--border-hover: rgba(0, 0, 0, .15);--nav-bg: rgba(255, 255, 255, .8);--card-bg: #fafafa;--code-bg: #f5f5f5}[data-theme=dark]{--bg: #0d0d0d;--bg-secondary: #1a1a1a;--text: #f0f0f0;--text-secondary: #aaa;--text-muted: #666;--border: rgba(255, 255, 255, .05);--border-hover: rgba(255, 255, 255, .15);--nav-bg: rgba(26, 26, 26, .8);--card-bg: #1a1a1a;--code-bg: #222}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg);color:var(--text);line-height:1.5;transition:background-color .3s,color .3s}.container{max-width:1300px;margin:0 auto;padding:0 2.5rem}header{padding:2rem 0}nav{display:flex;justify-content:center;align-items:center}.nav-container{display:inline-flex;align-items:center;gap:2rem;background:var(--nav-bg);backdrop-filter:blur(10px);padding:.6rem 1.5rem;border-radius:50px;border:1px solid var(--border)}.logo{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.95rem}.logo-icon{width:26px;height:26px;background:var(--text);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--bg);font-weight:700;font-size:.9rem}.nav-links{display:flex;gap:1.8rem;align-items:center}.nav-links a{text-decoration:none;color:var(--text);font-size:.85rem;font-weight:500;opacity:.85;padding:.4rem .8rem;border-radius:8px;transition:all .2s ease}.nav-links a:hover{background:#0000000d}[data-theme=dark] .nav-links a:hover{background:#ffffff1a}.nav-links a.active{background:var(--text);color:var(--bg);opacity:1;box-shadow:0 4px 12px #0003}.theme-toggle{background:transparent;border:none;cursor:pointer;padding:.4rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s;color:var(--text)}.theme-toggle:hover{background:#0000000d}[data-theme=dark] .theme-toggle:hover{background:#ffffff1a}.theme-icon{font-size:1rem;line-height:1;color:var(--text)}.theme-icon.light{display:block}.theme-icon.dark,[data-theme=dark] .theme-icon.light{display:none}[data-theme=dark] .theme-icon.dark{display:block}.nav-actions{display:flex;align-items:center;gap:.3rem}.menu-toggle{display:none;background:transparent;border:none;cursor:pointer;padding:.4rem;border-radius:8px;transition:background .2s}.menu-toggle:hover{background:#0000000d}[data-theme=dark] .menu-toggle:hover{background:#ffffff1a}.menu-icon{display:flex;flex-direction:column;gap:4px;width:18px}.menu-line{display:block;height:2px;background:var(--text);border-radius:1px;transition:transform .2s,opacity .2s}.mobile-overlay{display:none;position:fixed;inset:0;background:#0006;z-index:998;opacity:0;transition:opacity .3s ease}.mobile-overlay.open{display:block;opacity:1}.mobile-menu{position:fixed;top:0;right:0;width:280px;max-width:85vw;height:100vh;background:var(--bg);z-index:999;transform:translate(100%);transition:transform .3s ease;display:flex;flex-direction:column;padding:1.5rem;box-shadow:-4px 0 20px #0000001a}.mobile-menu.open{transform:translate(0)}.mobile-nav-links{display:flex;flex-direction:column;gap:.3rem}.mobile-nav-links a{text-decoration:none;color:var(--text);font-size:1rem;font-weight:500;padding:.75rem 1rem;border-radius:10px;transition:all .2s ease}.mobile-nav-links a:hover{background:var(--card-bg)}.mobile-nav-links a.active{background:var(--text);color:var(--bg)}main{padding:2rem 0 4rem}footer{padding:2rem 0;border-top:1px solid var(--border);margin-top:4rem}.social-links{display:flex;gap:1.5rem;margin-bottom:1rem}.social-links a{text-decoration:none;color:var(--text);font-size:.85rem;opacity:.7}.social-links a:hover{opacity:1}footer p{font-size:.8rem;color:var(--text-muted);text-align:center}@media(max-width:1024px){.container{padding:0 1.5rem}}@media(max-width:768px){.container{padding:0 1.2rem}header{padding:1.2rem 0}.nav-container{gap:.6rem;padding:.5rem 1rem}nav{justify-content:center}.nav-links{display:none}.menu-toggle{display:flex}.nav-actions{gap:.2rem}.logo{font-size:.85rem}.logo-icon{width:22px;height:22px;font-size:.75rem}.theme-toggle{flex-shrink:0}}@media(max-width:480px){.container{padding:0 1rem}.nav-container{padding:.4rem .8rem}header{padding:1rem 0}}