:root{--bg:#080e17;--card:#101c2b;--line:#26384e;--ink:#edf4ff;--ink-2:#9db1cd;--tan:#a8caff;--tan-soft:#223953;--cocoa:#0c1726;--cream:#e7effb;color-scheme:dark}nav{background:#080e17ed;border-bottom:1px solid var(--line)}.logo{gap:10px;font-size:24px;letter-spacing:-1px}.logo b{font-weight:800}.hero{background:radial-gradient(ellipse at 50% 20%,#1a355340,transparent 65%)}.btn.ghost{color:var(--ink);border-color:#405878}.btn.dark{background:#223953;border-color:#405878}.frame{border:1px solid #36516f;box-shadow:0 20px 80px #0005}.step span,.frame .foot,.card.cocoa p{color:#a9bbd3}.step:nth-of-type(1){border-top:2px solid #a8caff}.step:nth-of-type(3){border-top:2px solid #c3b4ef}.step:nth-of-type(5){border-top:2px solid #9dd6bf}.card.tan{background:#a8caff}.card.tan p,.close .card p{color:#203c5b}.card.cocoa{border-color:var(--line)}.card{transition:border-color .2s,transform .2s}.card:hover{border-color:#527194}.code{text-decoration:none;border:1px solid #314963;justify-content:space-between;gap:24px}.code .hint{color:#12263f;background:#a8caff;border-radius:20px;padding:5px 12px;font:600 12px var(--font)}.hero .code{margin-top:28px;width:auto}.builder-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.builder-fields label{font-size:13px;color:var(--ink-2);display:grid;gap:10px}.builder-fields input{width:100%;font:500 16px var(--font);padding:15px;border:1px solid #38516f;border-radius:10px;background:#0b1421;color:var(--ink)}.builder-fields input:focus{outline:2px solid var(--tan);outline-offset:2px}.builder-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin-top:18px}button{cursor:pointer;font-family:inherit}#feedback{font-size:13px;color:var(--ink-2)}section{scroll-margin-top:90px}footer .logo{font-size:21px}@media(max-width:700px){.builder-fields{grid-template-columns:1fr 1fr}.logo{font-size:21px}nav .wrap{gap:12px}nav .btn{margin-left:auto}}@media(max-width:440px){.builder-fields{grid-template-columns:1fr}.builder-actions .btn{width:100%}.hero .code{font-size:11px}.hero .code .hint{font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card{transition:none}}
