:root{--text-xs:clamp(.75rem, 1.5vw, .875rem);--text-sm:clamp(.875rem, 2vw, 1rem);--text-md:clamp(1rem, 2.5vw, 1.25rem);--text-lg:clamp(1.25rem, 3vw, 1.75rem);--text-xl:clamp(1.75rem, 5vw, 3rem);--font-sans:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", monospace;--weight-soft:200;--weight-normal:400;--weight-medium:530;--weight-bold:700;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:2rem;--space-xl:4rem;--radius-sm:4px;--radius-md:8px;--radius-lg:16px;--radius-full:9999px;--transition:.2s ease;--z-base:1;--z-dropdown:10;--z-modal:100;--z-navbar:999;--z-toast:1000;--navbar-height:clamp(3rem, 8vw, 4.5rem);--bg:#eee;--bg-surface:#e3e3e3;--bg-subtle:#c1c1c1;--bg-hover:#d1d1d6;--text:#111;--text-muted:#555;--text-faint:#999;--accent:#2563eb;--accent-hover:#1d4ea8;--accent-subtle:#aed1ff;--success:#16a34a;--danger:#dc2626;--warning:#d97706;--border:#e4e4e7;--border-strong:#d1d1d6}[data-theme=dark]{--bg:#0f0f0f;--bg-surface:#1a1a1a;--bg-subtle:#242424;--bg-hover:#2a2a2a;--text:#f0f0f0;--text-muted:#a0a0a0;--text-faint:#666;--accent:#3b82f6;--accent-hover:#60a5fa;--accent-subtle:#1e3a5f;--success:#22c55e;--danger:#f87171;--warning:#fbbf24;--border:#2a2a2a;--border-strong:#3a3a3a}h1,.text-xl{font-size:var(--text-xl)}h2,.text-lg{font-size:var(--text-lg)}h3,p,.text-md{font-size:var(--text-md)}h4,.text-sm{font-size:var(--text-sm)}small,.text-xs{font-size:var(--text-xs)}a{font-size:var(--text-md);color:var(--accent);transition:color var(--transition);text-decoration:none}a:hover{color:var(--accent-hover)}*,:after,:before{font-family:var(--font-sans);box-sizing:border-box;transition:background-color var(--transition), color var(--transition), border-color var(--transition);margin:0;padding:0}::selection{background:var(--accent-subtle);color:var(--accent)}code,pre,kbd{font-size:var(--text-md);font-family:var(--font-mono)}button{cursor:pointer;transition:opacity var(--transition);background:0 0;border:none;font-family:inherit}button:hover{opacity:.8}button:active{opacity:.6}button:disabled{opacity:.4;cursor:not-allowed}input,textarea,select{font-size:var(--text-md);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);transition:border-color var(--transition);outline:none}input:focus,textarea:focus,select:focus{border-color:var(--accent)}input::placeholder,textarea::placeholder,select::placeholder{color:var(--text-faint)}img,video{max-width:100%;display:block}ul,ol{list-style:none}html{scroll-behavior:smooth}body{background-color:var(--bg);transition:background-color var(--transition), color var(--transition);color:var(--text);padding-top:var(--navbar-height);line-height:1.6}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--bg-subtle);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-faint)}*{scrollbar-width:thin;scrollbar-color:var(--bg-subtle) transparent}.navbar{width:fit-content;min-width:100vw;padding:0 var(--space-md);padding-right:var(--space-lg);background:var(--bg-surface);border-bottom:2px solid var(--border-strong);z-index:var(--z-navbar);flex-wrap:wrap;justify-content:space-between;align-items:center;display:flex;position:fixed;top:0;left:0}.navbar .nav-brand{height:var(--navbar-height);align-items:center;gap:var(--space-xs);color:var(--text);transition:color var(--transition);display:flex}.navbar .nav-brand img{aspect-ratio:1;height:calc(var(--navbar-height) * .52);width:auto}.navbar .nav-brand .brand-text{align-items:baseline;display:flex}.navbar .nav-brand h2{font-weight:var(--weight-bold)}.navbar .nav-brand h3{font-weight:var(--weight-soft)}.navbar .nav-brand:hover{color:var(--accent-hover)}.navbar .hamburger{cursor:pointer;background:0 0;border:none;flex-direction:column;flex-shrink:0;justify-content:center;align-self:center;gap:5px;width:32px;height:32px;padding:0;display:none}.navbar .hamburger span{background:var(--text);border-radius:var(--radius-full);transform-origin:50%;max-width:32px;height:4px;transition:transform var(--transition), opacity var(--transition), width var(--transition);display:block;overflow:hidden;width:32px!important}.navbar .hamburger.open span:first-child{transform:translateY(9px)rotate(45deg)}.navbar .hamburger.open span:nth-child(2){opacity:0;width:0}.navbar .hamburger.open span:nth-child(3){transform:translateY(-9px)rotate(-45deg)}.navbar .nav-links{height:var(--navbar-height);align-items:center;display:flex}.navbar .nav-links a,.navbar .nav-links button{height:100%;padding:0 var(--space-sm);color:var(--text);cursor:pointer;font-family:inherit;font-weight:var(--weight-medium);font-size:var(--text-md);transition:color var(--transition), background var(--transition);background:0 0;border:none;align-items:center;display:inline-flex;position:relative}.navbar .nav-links a:hover,.navbar .nav-links button:hover{color:var(--accent-hover)}.navbar .nav-links a.active,.navbar .nav-links button.active{color:var(--accent)}.navbar .nav-links a:after,.navbar .nav-links button:after{content:"";bottom:25%;left:var(--space-sm);right:var(--space-sm);border-radius:var(--radius-full);transform-origin:50%;height:1.5px;transition:transform var(--transition);background:currentColor;position:absolute;transform:scaleX(0)}.navbar .nav-links a:hover:after,.navbar .nav-links button:hover:after,.navbar .nav-links a.active:after,.navbar .nav-links button.active:after{transform:scaleX(1)}.navbar .nav-links a .caret,.navbar .nav-links button .caret{margin-left:var(--space-xs);width:0;height:0;transition:transform var(--transition);border-top:5px solid;border-left:4px solid #0000;border-right:4px solid #0000;display:inline-block}.navbar .nav-links a .caret.open,.navbar .nav-links button .caret.open{transform:rotate(180deg)}.navbar .nav-links button:has(.subroute){flex-direction:column;justify-content:center;align-items:flex-start;gap:2px}.navbar .nav-links button:has(.subroute):after{display:none}.navbar .nav-links button:has(.subroute):hover>span:first-child:after{transform:scaleX(1)}.navbar .nav-links button:has(.subroute).active>span:first-child:after{transform:scaleX(1)}.navbar .nav-links button:has(.subroute)>span:first-child{align-items:center;gap:var(--space-xs);display:inline-flex;position:relative}.navbar .nav-links button:has(.subroute)>span:first-child:after{content:"";border-radius:var(--radius-full);transform-origin:50%;height:1.5px;transition:transform var(--transition);background:currentColor;position:absolute;bottom:-2px;left:0;right:0;transform:scaleX(0)}.navbar .nav-links button:has(.subroute) .subroute{font-size:var(--text-xs);font-weight:var(--weight-normal);color:var(--text-muted);line-height:1}.navbar .nav-links .nav-dropdown{align-items:center;height:100%;display:flex;position:relative}.navbar .nav-links .nav-dropdown>button{width:auto}.navbar .nav-links .nav-dropdown .dropdown-menu{background:var(--bg-surface);border:2px solid var(--border-strong);border-radius:0 0 var(--radius-md) var(--radius-md);transform-origin:top;opacity:0;pointer-events:none;max-height:60vh;transition:transform var(--transition), opacity var(--transition);border-top:none;flex-direction:column;display:flex;position:absolute;top:100%;left:0;overflow:hidden auto;transform:scaleY(0)}.navbar .nav-links .nav-dropdown .dropdown-menu.open{opacity:1;pointer-events:all;transform:scaleY(1)}.navbar .nav-links .nav-dropdown .dropdown-menu a{height:var(--navbar-height);white-space:nowrap;color:var(--text)}.navbar .nav-links .nav-dropdown .dropdown-menu a:after{display:none}.navbar .nav-links .nav-dropdown .dropdown-menu a:hover{color:var(--text);background:var(--bg-hover)}.navbar .nav-links .nav-dropdown .dropdown-menu a.active{color:var(--text);background:var(--bg-subtle)}@media (width<=600px){.navbar .hamburger{display:flex}.navbar .nav-links{top:var(--navbar-height);width:auto;min-width:180px;max-height:calc(100vh - var(--navbar-height));background:var(--bg-surface);border-left:2px solid var(--border-strong);border-radius:0 0 0 var(--radius-md);height:auto;transition:transform var(--transition);pointer-events:none;flex-direction:column;align-items:stretch;position:fixed;right:0;overflow-y:auto;transform:translate(100%)}.navbar .nav-links.open{pointer-events:all;transform:translate(0)}.navbar .nav-links a,.navbar .nav-links button{height:var(--navbar-height);padding:0 var(--space-md)}.navbar .nav-links a:after,.navbar .nav-links button:after{display:none}.navbar .nav-links a:hover,.navbar .nav-links button:hover{color:var(--text);background:var(--bg-hover)}.navbar .nav-links a.active,.navbar .nav-links button.active{color:var(--text);background:var(--bg-subtle)}.navbar .nav-links button:has(.subroute)>span:first-child:after{display:none}.navbar .nav-links .nav-dropdown{flex-direction:column;align-items:stretch;height:auto}.navbar .nav-links .nav-dropdown>button{width:100%}.navbar .nav-links .nav-dropdown .dropdown-menu{pointer-events:all;border:none;border-radius:0;transition:none;display:none;position:static;opacity:1!important;transform:none!important}.navbar .nav-links .nav-dropdown .dropdown-menu.open{display:flex}.navbar .nav-links .nav-dropdown .dropdown-menu a{padding-left:var(--space-lg)}.navbar .nav-links .nav-dropdown .dropdown-menu a:hover{background:var(--bg-hover)}.navbar .nav-links .nav-dropdown .dropdown-menu a.active{background:var(--bg-subtle)}}
