:root{--ds-color-brand-50: #f0f4ff;--ds-color-brand-100: #dbe4ff;--ds-color-brand-200: #bac8ff;--ds-color-brand-300: #91a7ff;--ds-color-brand-400: #748ffc;--ds-color-brand-500: #5c7cfa;--ds-color-brand-600: #4c6ef5;--ds-color-brand-700: #4263eb;--ds-color-brand-800: #3b5bdb;--ds-color-brand-900: #364fc7;--ds-color-brand-950: #2b3fa0;--ds-color-gray-50: #f8f9fa;--ds-color-gray-100: #f1f3f5;--ds-color-gray-200: #e9ecef;--ds-color-gray-300: #dee2e6;--ds-color-gray-400: #ced4da;--ds-color-gray-500: #adb5bd;--ds-color-gray-600: #868e96;--ds-color-gray-700: #495057;--ds-color-gray-800: #343a40;--ds-color-gray-900: #212529;--ds-color-success: #40c057;--ds-color-warning: #fab005;--ds-color-error: #fa5252;--ds-color-info: #339af0;--ds-font-heading: "Hanken Grotesk", "Inter", system-ui, sans-serif;--ds-font-body: "Inter", system-ui, -apple-system, sans-serif;--ds-font-mono: "JetBrains Mono", "Fira Code", monospace;--ds-radius-sm: .375rem;--ds-radius-md: .5rem;--ds-radius-lg: .75rem;--ds-radius-xl: 1rem;--ds-shadow-sm: 0 1px 3px rgba(0,0,0,.08);--ds-shadow-md: 0 4px 12px rgba(0,0,0,.1);--ds-shadow-lg: 0 8px 30px rgba(0,0,0,.12)}:where(.astro-5w3lc6bc),:where(.astro-5w3lc6bc):before,:where(.astro-5w3lc6bc):after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--ds-font-body);scroll-behavior:smooth}body{background:#fff;color:var(--ds-color-gray-900);line-height:1.6}h1:where(.astro-5w3lc6bc),h2:where(.astro-5w3lc6bc),h3:where(.astro-5w3lc6bc),h4:where(.astro-5w3lc6bc){font-family:var(--ds-font-heading);letter-spacing:-.02em}code:where(.astro-5w3lc6bc),pre:where(.astro-5w3lc6bc),.mono:where(.astro-5w3lc6bc){font-family:var(--ds-font-mono)}.global-nav:where(.astro-5w3lc6bc){border-bottom:1px solid var(--ds-color-gray-200);position:sticky;top:0;z-index:100;background:#fffffff2;backdrop-filter:blur(8px)}.global-nav-inner:where(.astro-5w3lc6bc){max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between;height:3.5rem}.global-nav-logo:where(.astro-5w3lc6bc){font-family:var(--ds-font-heading);font-weight:700;font-size:1rem;color:var(--ds-color-gray-900);text-decoration:none;display:flex;align-items:center;gap:.5rem}.global-nav-logo:where(.astro-5w3lc6bc) svg:where(.astro-5w3lc6bc){color:var(--ds-color-brand-600)}.global-nav-links:where(.astro-5w3lc6bc){display:flex;gap:.25rem}.global-nav-links:where(.astro-5w3lc6bc) a:where(.astro-5w3lc6bc){padding:.375rem .75rem;font-size:.875rem;font-weight:500;color:var(--ds-color-gray-600);text-decoration:none;border-radius:var(--ds-radius-sm)}.global-nav-links:where(.astro-5w3lc6bc) a:where(.astro-5w3lc6bc):hover,.global-nav-links:where(.astro-5w3lc6bc) a:where(.astro-5w3lc6bc).active{color:var(--ds-color-brand-600);background:var(--ds-color-brand-50)}.section:where(.astro-5w3lc6bc){max-width:1200px;margin:0 auto;padding:3rem 1.5rem}.section-header:where(.astro-5w3lc6bc){margin-bottom:2rem}.section-header:where(.astro-5w3lc6bc) h2:where(.astro-5w3lc6bc){font-size:1.75rem;font-weight:700;color:var(--ds-color-gray-900)}.section-header:where(.astro-5w3lc6bc) p:where(.astro-5w3lc6bc){font-size:1rem;color:var(--ds-color-gray-600);margin-top:.5rem}.hero:where(.astro-5w3lc6bc){background:linear-gradient(135deg,var(--ds-color-brand-50) 0%,#fff 50%,#f8f9fa 100%);padding:5rem 1.5rem 4rem;text-align:center}.hero:where(.astro-5w3lc6bc) h1:where(.astro-5w3lc6bc){font-size:3.5rem;font-weight:800;line-height:1.1;color:var(--ds-color-gray-900);max-width:700px;margin:0 auto}.hero:where(.astro-5w3lc6bc) h1:where(.astro-5w3lc6bc) span:where(.astro-5w3lc6bc){color:var(--ds-color-brand-600)}.hero:where(.astro-5w3lc6bc) p:where(.astro-5w3lc6bc){font-size:1.15rem;color:var(--ds-color-gray-600);max-width:550px;margin:1rem auto 2rem;line-height:1.7}.hero-actions:where(.astro-5w3lc6bc){display:flex;justify-content:center;gap:.75rem;flex-wrap:wrap}.btn:where(.astro-5w3lc6bc){display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1.25rem;border-radius:var(--ds-radius-lg);font-size:.875rem;font-weight:600;font-family:var(--ds-font-body);cursor:pointer;text-decoration:none;border:none;transition:all .15s}.btn-primary:where(.astro-5w3lc6bc){background:var(--ds-color-brand-600);color:#fff}.btn-primary:where(.astro-5w3lc6bc):hover{background:var(--ds-color-brand-700);box-shadow:var(--ds-shadow-md)}.btn-secondary:where(.astro-5w3lc6bc){background:#fff;color:var(--ds-color-gray-700);border:1px solid var(--ds-color-gray-300)}.btn-secondary:where(.astro-5w3lc6bc):hover{border-color:var(--ds-color-gray-400);background:var(--ds-color-gray-50)}.btn-ghost:where(.astro-5w3lc6bc){background:transparent;color:var(--ds-color-gray-600)}.btn-ghost:where(.astro-5w3lc6bc):hover{background:var(--ds-color-gray-100)}.btn-danger:where(.astro-5w3lc6bc){background:var(--ds-color-error);color:#fff}.btn-danger:where(.astro-5w3lc6bc):hover{background:#e03131}.btn-sm:where(.astro-5w3lc6bc){padding:.4rem .75rem;font-size:.8rem;border-radius:var(--ds-radius-md)}.btn-lg:where(.astro-5w3lc6bc){padding:.85rem 1.75rem;font-size:1rem}.swatch-grid:where(.astro-5w3lc6bc){display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}.swatch:where(.astro-5w3lc6bc){border-radius:var(--ds-radius-lg);overflow:hidden;border:1px solid var(--ds-color-gray-200)}.swatch-preview:where(.astro-5w3lc6bc){height:4rem}.swatch-info:where(.astro-5w3lc6bc){padding:.625rem .75rem;font-size:.8rem}.swatch-info:where(.astro-5w3lc6bc) .name:where(.astro-5w3lc6bc){font-weight:600;color:var(--ds-color-gray-900)}.swatch-info:where(.astro-5w3lc6bc) .hex:where(.astro-5w3lc6bc){font-family:var(--ds-font-mono);font-size:.7rem;color:var(--ds-color-gray-500)}.card-grid:where(.astro-5w3lc6bc){display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.card:where(.astro-5w3lc6bc){background:#fff;border:1px solid var(--ds-color-gray-200);border-radius:var(--ds-radius-xl);padding:1.5rem;transition:box-shadow .2s}.card:where(.astro-5w3lc6bc):hover{box-shadow:var(--ds-shadow-md)}.card:where(.astro-5w3lc6bc) h3:where(.astro-5w3lc6bc){font-size:1.05rem;font-weight:600;margin-bottom:.5rem;color:var(--ds-color-gray-900)}.card:where(.astro-5w3lc6bc) p:where(.astro-5w3lc6bc){font-size:.875rem;color:var(--ds-color-gray-600);line-height:1.6}.form-group:where(.astro-5w3lc6bc){margin-bottom:1.25rem}.form-label:where(.astro-5w3lc6bc){display:block;font-size:.875rem;font-weight:500;margin-bottom:.375rem;color:var(--ds-color-gray-700)}.form-input:where(.astro-5w3lc6bc){width:100%;padding:.6rem .75rem;border:1px solid var(--ds-color-gray-300);border-radius:var(--ds-radius-md);font-size:.875rem;font-family:var(--ds-font-body);transition:border-color .15s}.form-input:where(.astro-5w3lc6bc):focus{outline:none;border-color:var(--ds-color-brand-500);box-shadow:0 0 0 3px var(--ds-color-brand-100)}.form-input:where(.astro-5w3lc6bc).error{border-color:var(--ds-color-error)}.token-table:where(.astro-5w3lc6bc){border:1px solid var(--ds-color-gray-200);border-radius:var(--ds-radius-lg);overflow:hidden;margin:1.5rem 0;overflow-x:auto}.token-table:where(.astro-5w3lc6bc) table:where(.astro-5w3lc6bc){width:100%;border-collapse:collapse;min-width:500px}.token-table:where(.astro-5w3lc6bc) th:where(.astro-5w3lc6bc){background:var(--ds-color-gray-50);padding:.5rem 1rem;text-align:left;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ds-color-gray-500);border-bottom:1px solid var(--ds-color-gray-200)}.token-table:where(.astro-5w3lc6bc) td:where(.astro-5w3lc6bc){padding:.5rem 1rem;font-size:.85rem;border-top:1px solid var(--ds-color-gray-100)}.token-table:where(.astro-5w3lc6bc) tr:where(.astro-5w3lc6bc):first-child td:where(.astro-5w3lc6bc){border-top:0}.tag:where(.astro-5w3lc6bc){display:inline-block;padding:.15rem .5rem;border-radius:999px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.tag-info:where(.astro-5w3lc6bc){background:#e7f5ff;color:#1864ab}.tag-success:where(.astro-5w3lc6bc){background:#d3f9d8;color:#2b8a3e}.tag-warning:where(.astro-5w3lc6bc){background:#fff3bf;color:#e67700}.tag-error:where(.astro-5w3lc6bc){background:#ffe3e3;color:#c92a2a}.footer:where(.astro-5w3lc6bc){border-top:1px solid var(--ds-color-gray-200);background:var(--ds-color-gray-50);padding:2rem 1.5rem;text-align:center;font-size:.8rem;color:var(--ds-color-gray-500)}.footer:where(.astro-5w3lc6bc) a:where(.astro-5w3lc6bc){color:var(--ds-color-brand-600);text-decoration:none}.divider:where(.astro-5w3lc6bc){border:0;border-top:1px solid var(--ds-color-gray-200);margin:3rem 0}@media(max-width:640px){.hero:where(.astro-5w3lc6bc) h1:where(.astro-5w3lc6bc){font-size:2.25rem}.swatch-grid:where(.astro-5w3lc6bc){grid-template-columns:repeat(2,1fr)}}