:root{--color-brand:oklch(62% .14 45);--color-brand-hover:oklch(55% .15 45);--color-brand-light:oklch(92% .04 45);--color-accent:oklch(70% .12 155);--color-bg:oklch(97.5% .003 60);--color-surface:oklch(99% .002 60);--color-ink:oklch(25% .02 50);--color-ink-muted:oklch(50% .02 50);--color-border:oklch(88% .01 50);--color-success:oklch(65% .15 155);--color-error:oklch(60% .18 25);--color-warning:oklch(75% .12 80);--shadow-sm:0 1px 3px oklch(30% .02 50/.06);--shadow-md:0 4px 12px oklch(30% .02 50/.08);--shadow-lg:0 8px 30px oklch(30% .02 50/.12);--shadow-hover:0 8px 24px oklch(30% .02 50/.14);--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--font-sans:"Noto Sans SC", -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:2rem;--text-4xl:clamp(2rem, 4vw, 3rem);--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--ease-out:cubic-bezier(.16, 1, .3, 1);--duration-fast:.15s;--duration-normal:.25s;--duration-slow:.4s}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-sans);color:var(--color-ink);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.7}a{color:var(--color-brand);transition:color var(--duration-fast) var(--ease-out);text-decoration:none}a:hover{color:var(--color-brand-hover)}img{max-width:100%;height:auto;display:block}button{cursor:pointer;background:0 0;border:none;font-family:inherit}input,textarea,select{font-family:inherit;font-size:inherit}.container{max-width:1100px;padding:0 var(--space-lg);margin:0 auto}.container-narrow{max-width:720px;padding:0 var(--space-lg);margin:0 auto}.btn{align-items:center;gap:var(--space-sm);border-radius:var(--radius-sm);font-size:var(--text-sm);transition:all var(--duration-fast) var(--ease-out);padding:.6rem 1.2rem;font-weight:500;line-height:1.4;display:inline-flex}.btn-primary{background:var(--color-brand);color:#fff}.btn-primary:hover{background:var(--color-brand-hover);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-ghost{color:var(--color-ink-muted);border:1px solid var(--color-border)}.btn-ghost:hover{border-color:var(--color-brand);color:var(--color-brand)}.card{background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);transition:all var(--duration-normal) var(--ease-out)}.card:hover{box-shadow:var(--shadow-hover);border-color:oklch(82% .03 45);transform:translateY(-3px)}.form-input{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);width:100%;color:var(--color-ink);font-size:var(--text-base);transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out);padding:.7rem 1rem}.form-input:focus{border-color:var(--color-brand);outline:none;box-shadow:0 0 0 3px oklch(62% .14 45/.1)}.form-input::placeholder{color:var(--color-ink-muted)}.tag{border-radius:var(--radius-full);font-size:var(--text-xs);background:var(--color-brand-light);color:var(--color-brand);align-items:center;padding:.2rem .7rem;font-weight:500;display:inline-flex}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}html{scroll-behavior:auto}}
