:root{--color-bg: #282828;--color-surface: #222222;--color-border: #1e293b;--color-text-primary: #e2e8f0;--color-text-secondary: #776a40;--color-accent: #ffce2a;--color-accent-foreground: #000000;--radius-sm: 6px;--radius-md: 8px;--space-xs: .5rem;--space-sm: 1rem;--space-md: 2rem;--space-lg: 4rem;--space-xl: 8rem;--max-width: 1000px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--color-bg);color:var(--color-text-primary)}header{padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border)}nav{margin-top:var(--space-xs);display:flex;gap:var(--space-sm)}.nav-link{text-decoration:none;color:var(--color-text-secondary);transition:color .2s ease}nav a:hover{color:var(--color-text-primary)}.container{max-width:var(--max-width);margin:0 auto;padding:0 var(--space-md)}.section{margin-bottom:var(--space-lg)}.section-title{margin-bottom:var(--space-sm);font-size:1.5rem}.section-content{color:var(--color-text-secondary);line-height:1.6}.card{background:var(--color-surface);border:1px solid var(--color-border);padding:var(--space-md);border-radius:var(--radius-md)}.stack{display:flex;flex-direction:column}.stack-sm{gap:var(--space-sm)}.stack-md{gap:var(--space-md)}.stack-lg{gap:var(--space-lg)}.grid{display:grid;gap:var(--space-md)}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media(max-width:768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}.button{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);border:none;font-size:.9rem;cursor:pointer;transition:background .2s ease}.button-primary{background:var(--color-accent);color:var(--color-accent-foreground)}.button-primary:hover{opacity:.9}.button-secondary{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border)}.button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.button-ghost{background:transparent;color:var(--color-accent)}.main{padding-top:var(--space-sm)}footer{padding:var(--space-md);border-top:1px solid var(--color-border);color:var(--color-text-secondary)}.nav-link{color:var(--color-text-secondary)}.nav-link.active{color:var(--color-accent);font-weight:500}