@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap";:root{--color-canvas:#0a0a0a;--color-canvas-soft:#111;--color-canvas-soft-2:#1a1a1a;--color-ink:#ededed;--color-body:#a1a1a1;--color-mute:#666;--color-primary:#fff;--color-on-primary:#0a0a0a;--color-hairline:#ffffff1a;--color-hairline-strong:#fff3;--color-link:#3b82f6;--color-link-deep:#2563eb;--color-cyan:#06b6d4;--color-violet:#8b5cf6;--color-highlight-pink:#ec4899;--color-develop-start:#3b82f6;--color-preview-start:#8b5cf6;--color-ship-start:#06b6d4;--color-error:#ef4444;--color-error-deep:#b91c1c;--color-error-soft:#ef444414;--shadow-level1:0 1px 2px #0006;--shadow-level2:0 2px 8px #00000080;--shadow-level3:0 4px 16px #0009;--shadow-level4:0 8px 32px #000000b3;--shadow-dark-level2:0 2px 8px #000c;--shadow-dark-level3:0 4px 24px #000000e6;--mesh-gradient:radial-gradient(ellipse at 20% 50%, #3b82f60f 0%, transparent 60%), radial-gradient(ellipse at 80% 20%, #8b5cf60d 0%, transparent 60%), radial-gradient(ellipse at 60% 80%, #06b6d40a 0%, transparent 60%)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{background-color:var(--color-canvas-soft);color:var(--color-ink);-webkit-font-smoothing:antialiased;flex-direction:column;min-height:100vh;font-family:Inter,system-ui,-apple-system,sans-serif;display:flex}::selection{background-color:var(--color-primary);color:var(--color-on-primary)}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}.font-mono{font-family:JetBrains Mono,monospace}.text-ink{color:var(--color-ink)}.text-body{color:var(--color-body)}.text-mute{color:var(--color-mute)}.text-link{color:var(--color-link)}.text-link-deep{color:var(--color-link-deep)}.text-cyan{color:var(--color-cyan)}.text-violet{color:var(--color-violet)}.text-pink{color:var(--color-highlight-pink)}.text-on-primary{color:var(--color-on-primary)}.text-error{color:var(--color-error)}.text-error-deep{color:var(--color-error-deep)}.bg-canvas{background-color:var(--color-canvas)}.bg-canvas-soft{background-color:var(--color-canvas-soft)}.bg-canvas-soft-2{background-color:var(--color-canvas-soft-2)}.bg-primary{background-color:var(--color-primary)}.bg-error-soft{background-color:var(--color-error-soft)}.border-hairline{border-color:var(--color-hairline)}.border-hairline-strong{border-color:var(--color-hairline-strong)}.shadow-level1{box-shadow:var(--shadow-level1)}.shadow-level2{box-shadow:var(--shadow-level2)}.shadow-level3{box-shadow:var(--shadow-level3)}.shadow-level4{box-shadow:var(--shadow-level4)}.shadow-dark-level2{box-shadow:var(--shadow-dark-level2)}.shadow-dark-level3{box-shadow:var(--shadow-dark-level3)}.skip-link{z-index:9999;background:var(--color-primary);color:var(--color-on-primary);border-radius:0 0 4px 4px;padding:.5rem 1rem;font-size:.875rem;font-weight:600;transition:top .2s;position:absolute;top:-100%;left:1rem}.skip-link:focus{top:0}.focus-ring:focus-visible{outline:2px solid var(--color-link);outline-offset:2px}.scroll-mt{scroll-margin-top:4rem}.gradient-text{background:linear-gradient(90deg, var(--color-develop-start), var(--color-preview-start), var(--color-ship-start));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.mesh-bg{background:var(--mesh-gradient)}.rounded-pill{border-radius:9999px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(0)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(-25%)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-spin{animation:1s linear infinite spin}.animate-pulse{animation:2s ease-in-out infinite pulse}.animate-bounce{animation:1s infinite bounce}.animate-fade-in{animation:.4s forwards fadeIn}.skeleton{background:linear-gradient(90deg, var(--color-canvas-soft-2) 25%, var(--color-canvas-soft) 50%, var(--color-canvas-soft-2) 75%);background-size:200% 100%;border-radius:4px;animation:1.6s infinite shimmer}.form-input{background-color:var(--color-canvas);border:1px solid var(--color-hairline);width:100%;height:40px;color:var(--color-ink);border-radius:2px;padding:0 14px;font-family:inherit;font-size:.875rem;transition:border-color .2s}.form-input::placeholder{color:var(--color-mute)}.form-input:hover{border-color:var(--color-hairline-strong)}.form-input:focus{border-color:var(--color-link);outline:none}.form-input.error{border-color:var(--color-error)}.form-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23666' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;padding-right:36px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
