:root{--paper:#eef1f6;--card:#fff;--ink:#0b1533;--muted:#56627f;--line:#d5dbe8;--volt:#2447ff;--signal:#ffd60a;--warn:#b4540a;--ok:#0a7a4b;--radius:14px;--display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;--body:"Instrument Sans", "Segoe UI", system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{margin:0}body{background:var(--paper);color:var(--ink);font-family:var(--body);flex-direction:column;min-height:100dvh;font-size:16px;line-height:1.5;display:flex}.topbar{justify-content:space-between;align-items:center;padding:18px clamp(16px,4vw,48px);display:flex}.brand{font-family:var(--display);color:var(--ink);align-items:center;gap:8px;font-size:22px;font-weight:700;text-decoration:none;display:inline-flex}.brand svg{color:var(--volt)}.stage{flex:1;grid-template-columns:minmax(0,1fr) minmax(0,440px);align-items:start;gap:clamp(24px,6vw,96px);width:100%;max-width:1180px;margin:0 auto;padding:clamp(16px,5vw,72px) clamp(16px,4vw,48px);display:grid}.intro h1{font-family:var(--display);letter-spacing:-.02em;max-width:14ch;margin:0 0 20px;font-size:clamp(34px,5vw,60px);font-weight:700;line-height:1.04}.intro p{color:var(--muted);max-width:46ch;margin:0 0 12px}.intro .fine{font-size:14px}.card{background:var(--card);border:1px solid var(--line);box-shadow:0 1px 0 var(--line), 0 24px 48px -32px #0b153359;border-radius:20px;padding:16px;position:relative}.field{background:var(--paper);border-radius:var(--radius);border:1px solid #0000;padding:12px 14px 14px}.field:focus-within{border-color:var(--volt)}.field-head{color:var(--muted);justify-content:space-between;align-items:center;min-height:22px;font-size:14px;display:flex}.field-body{align-items:center;gap:10px;margin-top:4px;display:flex}.field input,.out{min-width:0;font:600 30px/1.2 var(--display);color:var(--ink);background:0 0;border:0;outline:0;flex:1;padding:0}.out.muted,.field input::placeholder{color:#9aa4bd}select{font:600 16px var(--body);color:var(--ink);background:var(--card);border:1px solid var(--line);cursor:pointer;border-radius:999px;padding:8px 12px}select:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid var(--volt);outline-offset:2px}.linklike{font:inherit;color:var(--volt);cursor:pointer;background:0 0;border:0;padding:0}.flip{z-index:1;border:4px solid var(--card);background:var(--paper);width:38px;height:38px;color:var(--ink);cursor:pointer;border-radius:12px;place-items:center;margin:-10px auto;display:grid;position:relative}.flip:hover{background:#e2e7f1}.details{gap:6px;margin:14px 2px 0;font-size:14px;display:grid}.details div{justify-content:space-between;gap:16px;display:flex}.details dt{color:var(--muted)}.details dd{text-align:right;margin:0;font-weight:500}.details .warn dd{color:var(--warn)}.slippage{color:var(--muted);align-items:center;gap:8px;margin:14px 2px;font-size:14px;display:flex}.slippage span{margin-right:auto}.chip{font:500 14px var(--body);border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;border-radius:999px;padding:4px 12px}.chip.on{border-color:var(--volt);color:var(--volt);background:#eef1ff}.cta{width:100%;font:700 17px var(--display);border-radius:var(--radius);background:var(--signal);color:var(--ink);cursor:pointer;border:0;padding:15px}.cta:hover:not(:disabled){filter:brightness(.96)}.cta:disabled{color:#7d88a3;cursor:not-allowed;background:#e3e7f0}.notice{color:var(--warn);margin:12px 2px 0;font-size:14px}.notice.ok{color:var(--ok)}.notice a{color:inherit}.foot{color:var(--muted);width:100%;max-width:1180px;margin:0 auto;padding:24px clamp(16px,4vw,48px);font-size:13px}@media (max-width:860px){.stage{grid-template-columns:minmax(0,1fr)}.intro h1{max-width:18ch}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.connect-ph{width:140px;height:40px;display:inline-block}.card-ph{background:linear-gradient(180deg, var(--card), #f6f8fc);min-height:420px}
