*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--blue-400: #60a5fa;--blue-500: #3b82f6;--blue-600: #2563eb;--color-bg: #020617;--color-surface: #0f172a;--color-text-primary: #f1f5f9;--color-text-body: #e2e8f0;--color-text-secondary: #94a3b8;--color-text-muted: #64748b;--color-border: rgba(255, 255, 255, .06);--color-border-subtle: rgba(255, 255, 255, .03);--color-overlay: rgba(2, 6, 23, .8);--color-header-bg: rgba(15, 23, 42, .8);--color-shadow: rgba(0, 0, 0, .5);--color-shadow-light: rgba(0, 0, 0, .3);--color-glass: rgba(255, 255, 255, .05);--color-glass-hover: rgba(255, 255, 255, .1);--color-grid-line: rgba(255, 255, 255, .02);--color-footer-bg: #020617;--color-sep: #334155;--blob-opacity: .4;--noise-opacity: .04}[data-theme=light]{--color-bg: #f8fafc;--color-surface: #ffffff;--color-text-primary: #0f172a;--color-text-body: #1e293b;--color-text-secondary: #475569;--color-text-muted: #64748b;--color-border: rgba(0, 0, 0, .08);--color-border-subtle: rgba(0, 0, 0, .04);--color-overlay: rgba(0, 0, 0, .4);--color-header-bg: rgba(255, 255, 255, .85);--color-shadow: rgba(0, 0, 0, .1);--color-shadow-light: rgba(0, 0, 0, .08);--color-glass: rgba(0, 0, 0, .04);--color-glass-hover: rgba(0, 0, 0, .08);--color-grid-line: rgba(0, 0, 0, .03);--color-footer-bg: #f8fafc;--color-sep: #cbd5e1;--blob-opacity: .2;--noise-opacity: .02}html,body{height:100%}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--color-bg);color:var(--color-text-body);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;overflow:hidden;position:relative;transition:background-color .3s ease,color .3s ease}.bg{position:fixed;inset:0;z-index:0;overflow:hidden}.bg-gradient{position:absolute;border-radius:50%;filter:blur(120px);opacity:var(--blob-opacity);animation:float 20s ease-in-out infinite;transition:opacity .3s ease}.bg-gradient:nth-child(1){width:600px;height:600px;background:radial-gradient(circle,rgba(59,130,246,.3),transparent 70%);top:-10%;right:-10%;animation-delay:0s}.bg-gradient:nth-child(2){width:500px;height:500px;background:radial-gradient(circle,rgba(99,102,241,.25),transparent 70%);bottom:-15%;left:-10%;animation-delay:-7s}.bg-gradient:nth-child(3){width:400px;height:400px;background:radial-gradient(circle,rgba(14,165,233,.2),transparent 70%);top:40%;left:50%;animation-delay:-14s}@keyframes float{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-30px) scale(1.05)}66%{transform:translate(-20px,20px) scale(.95)}}.bg:after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");background-size:256px 256px;pointer-events:none;opacity:var(--noise-opacity);transition:opacity .3s ease}.bg-grid{position:fixed;inset:0;background-image:linear-gradient(var(--color-grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--color-grid-line) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse at center,black 20%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at center,black 20%,transparent 70%);z-index:0}.theme-toggle{display:grid;place-items:center;width:28px;height:28px;background:none;border:none;color:var(--color-text-muted);cursor:pointer;border-radius:6px;transition:color .2s ease;padding:0}.theme-toggle:hover{color:var(--color-text-body)}.theme-toggle svg{grid-area:1 / 1}.icon-sun{opacity:1}.icon-moon,[data-theme=light] .icon-sun{opacity:0}[data-theme=light] .icon-moon{opacity:1}.footer{position:fixed;bottom:0;left:0;right:0;z-index:1;display:flex;align-items:center;justify-content:center;gap:1.5rem;padding:1.5rem 2rem;color:var(--color-text-muted);font-size:.8125rem;background:linear-gradient(to top,var(--color-footer-bg),transparent);transition:background .3s ease,color .3s ease}.footer a{color:var(--color-text-muted);text-decoration:none;transition:color .2s ease}.footer a:hover{color:var(--color-text-body)}.footer .sep{width:3px;height:3px;background:var(--color-sep);border-radius:50%;flex-shrink:0}.modal-overlay{display:none;position:fixed;inset:0;background:var(--color-overlay);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:100;align-items:center;justify-content:center;padding:1rem;animation:fadeIn .2s ease-out}.modal-overlay.active{display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:var(--color-surface);color:var(--color-text-body);border-radius:20px;padding:2.5rem;max-width:560px;width:100%;max-height:85vh;overflow-y:auto;position:relative;border:1px solid var(--color-border);box-shadow:0 25px 60px var(--color-shadow),0 0 0 1px var(--color-border-subtle);animation:modalIn .3s cubic-bezier(.4,0,.2,1)}@keyframes modalIn{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal h2{font-size:1.375rem;font-weight:600;margin-bottom:1.5rem;color:var(--color-text-primary);letter-spacing:-.02em}.modal h3{font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-top:1.75rem;margin-bottom:.625rem;color:var(--color-text-secondary)}.modal p{line-height:1.6;margin-bottom:.25rem;color:var(--color-text-secondary);font-size:.9375rem}.modal a{color:var(--blue-400);text-decoration:none;transition:color .2s ease}.modal a:hover{color:var(--blue-500)}.modal-close{position:absolute;top:1rem;right:1rem;background:var(--color-glass);border:1px solid var(--color-border);color:var(--color-text-secondary);cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:1.125rem;line-height:1;transition:all .2s ease}.modal-close:hover{background:var(--color-glass-hover);color:var(--color-text-primary)}.modal-divider{height:1px;background:var(--color-border);margin:1.75rem 0}.logo-light,[data-theme=light] .logo-dark{display:none}[data-theme=light] .logo-light{display:block}@media(max-width:480px){body{padding:1.5rem}.footer{gap:1rem;font-size:.75rem;flex-wrap:wrap}.modal{padding:2rem 1.5rem;border-radius:16px}}