*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #ffffff;--color-bg-subtle: #f9fafb;--color-bg-card: #ffffff;--color-border: #e5e7eb;--color-text: #111827;--color-text-muted: #6b7280;--color-accent: #f97316;--color-accent-dark: #ea580c;--color-accent-end: #ec4899;--color-accent-bg: #fff7ed;--color-accent-text: #c2410c;--gradient-primary: linear-gradient(135deg, #f97316 0%, #ec4899 100%);--gradient-hero-overlay: linear-gradient(135deg, rgba(249,115,22,.06) 0%, rgba(236,72,153,.04) 50%, rgba(168,85,247,.06) 100%);--font-sans: "Inter", system-ui, sans-serif;--font-display: "DM Sans", system-ui, sans-serif;--font-mono: "JetBrains Mono", monospace;--max-width: 1200px;--radius: .625rem;--radius-sm: .375rem;--radius-lg: 1rem;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -1px rgba(0,0,0,.04);--shadow-lg: 0 10px 15px -3px rgba(0,0,0,.08), 0 4px 6px -2px rgba(0,0,0,.04)}html{font-family:var(--font-sans);color:var(--color-text);background:var(--color-bg)}body{min-height:100vh;line-height:1.6}a{color:var(--color-accent);text-decoration:none}a:hover{text-decoration:underline}code,pre{font-family:var(--font-mono)}pre{background:#1e1e2e;color:#cdd6f4;padding:1rem 1.25rem;border-radius:var(--radius);overflow-x:auto;font-size:.875rem;line-height:1.7}.container{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;border-radius:var(--radius);font-weight:600;font-size:.9375rem;cursor:pointer;transition:opacity .15s,box-shadow .15s,transform .1s;border:none;text-decoration:none;white-space:nowrap}.btn:hover{text-decoration:none}.btn:active{transform:scale(.98)}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:0 2px 8px #f973164d}.btn-primary:hover{opacity:.9;box-shadow:0 4px 12px #f9731666}.btn-outline{background:transparent;color:var(--color-text);border:1.5px solid var(--color-border)}.btn-outline:hover{border-color:var(--color-accent);color:var(--color-accent);background:var(--color-accent-bg)}.card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.card-interactive{cursor:pointer;transition:box-shadow .2s,transform .15s,border-color .2s}.card-interactive:hover{box-shadow:var(--shadow-md);border-color:#d1d5db}.card-active{border-color:var(--color-accent)!important;box-shadow:0 0 0 2px #f9731626,var(--shadow-md)!important;transform:scale(1.02)}.badge{display:inline-flex;align-items:center;gap:.375rem;background:var(--color-accent-bg);color:var(--color-accent-text);font-size:.75rem;font-weight:600;padding:.25rem .75rem;border-radius:var(--radius-full);letter-spacing:.04em;text-transform:uppercase}.text-gradient{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.section{padding:5rem 0}.section-subtle{padding:5rem 0;background:var(--color-bg-subtle)}.island-section{padding:5rem 0}.island-section-subtle{padding:5rem 0;background:var(--color-bg-subtle)}.code-block{background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:.875rem 1rem;font-family:var(--font-mono);font-size:.8125rem;color:var(--color-text-muted);line-height:1.6;overflow-x:auto}@media(prefers-color-scheme:dark){:root:not(.light){--color-bg: #0f172a;--color-bg-subtle: #1e293b;--color-bg-card: #1e293b;--color-border: #334155;--color-text: #f1f5f9;--color-text-muted: #94a3b8;--color-accent: #fb923c;--color-accent-dark:#f97316;--color-accent-bg: rgba(249,115,22,.12);--color-accent-text:#fb923c}:root:not(.light) .card-interactive:hover{border-color:#475569}:root:not(.light) .btn-outline:hover{background:#f973161a}:root:not(.light) .code-block{background:#0f172a;border-color:#334155}}html.dark{--color-bg: #0f172a;--color-bg-subtle: #1e293b;--color-bg-card: #1e293b;--color-border: #334155;--color-text: #f1f5f9;--color-text-muted: #94a3b8;--color-accent: #fb923c;--color-accent-dark:#f97316;--color-accent-bg: rgba(249,115,22,.12);--color-accent-text:#fb923c}html.dark .card-interactive:hover{border-color:#475569}html.dark .btn-outline:hover{background:#f973161a}html.dark .code-block{background:#0f172a;border-color:#334155}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}[data-animate]{opacity:0;transform:translateY(24px)}[data-animate].is-visible{animation:fadeInUp .55s cubic-bezier(.16,1,.3,1) forwards}[data-animate=delay-1].is-visible{animation-delay:.08s}[data-animate=delay-2].is-visible{animation-delay:.16s}[data-animate=delay-3].is-visible{animation-delay:.24s}[data-animate=delay-4].is-visible{animation-delay:.32s}[data-animate=delay-5].is-visible{animation-delay:.4s}[data-animate=delay-6].is-visible{animation-delay:.48s}.hover-lift{transition:transform .2s ease,box-shadow .2s ease}.hover-lift:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}@keyframes floatParticle{0%{transform:translateY(0) scale(1);opacity:0}18%{opacity:.5}to{transform:translateY(-32px) scale(.2);opacity:0}}.particle{position:absolute;width:3px;height:3px;border-radius:50%;background:#6366f1;animation:floatParticle 2.8s ease-out infinite;pointer-events:none}@media(prefers-reduced-motion:reduce){[data-animate]{opacity:1;transform:none}[data-animate].is-visible{animation:none}.hover-lift:hover{transform:none}.particle{display:none}}@media(max-width:640px){.section,.section-subtle,.island-section,.island-section-subtle{padding:2.5rem 0}.btn{white-space:normal;padding:.5rem 1rem;font-size:.875rem}#kofi-float{bottom:1rem;right:1rem;font-size:.8125rem;padding:.5rem .875rem;white-space:normal}}@media(max-width:480px){.container{padding:0 1rem}#kofi-float{display:none}}