/* POASwap: quote rows on the swap card, Simple | Pro toggle, Pro view (depth, order book with spread line, fills tape). */
@media (min-width:521px){.ps .xstats{grid-template-columns:repeat(4,minmax(0,1fr)) auto;align-items:center}}
.xview{display:inline-flex;gap:2px;margin:0 8px 0 4px;padding:3px;border:1px solid var(--line2);border-radius:10px;background:var(--inset)}
.xview button{border:0;background:none;color:var(--dim);font:600 var(--t13,13px)/1 var(--ui);letter-spacing:.02em;padding:8px 12px;border-radius:7px;cursor:pointer;transition:background var(--fast,.15s),color var(--fast,.15s)}
.xview button[aria-pressed="true"]{background:var(--card2);color:var(--hi);box-shadow:inset 0 0 0 1px var(--line2)}
.xview button:hover{color:var(--hi)}
.xview button:focus-visible{outline:2px solid rgba(53,201,208,.55);outline-offset:1px}
@media (max-width:520px){.xview{grid-column:1/-1;justify-self:stretch;margin:4px 6px 0;display:grid;grid-template-columns:1fr 1fr}}
.ps:not(.pro) .v-p,.ps.pro .v-s{display:none!important}
/* USD inline: same row, smaller, grey; ~ marks an estimate (few trades), explained in its tooltip */
.usd.est,.est{cursor:help}
.xbt td .usd{margin-left:5px;font-size:11px;vertical-align:0}
.xin .xiu{flex:none;margin:0 2px 0 0;font-size:12px;vertical-align:0}
.xin .xiu:empty{display:none}
/* swap card quote rows */
.xfp{color:var(--txt)}
.xfa .xfn{margin-left:8px;color:var(--dim)}
.xfa .usd,.xd dd .usd{font-size:11px;margin-left:5px;vertical-align:0}
.xest{color:var(--mute);font:400 11px/1 var(--ui)}
.ximp{display:inline-block;padding:2px 7px;border-radius:999px;font:600 12px/1.4 var(--mono);border:1px solid var(--line2);color:var(--txt)}
.ximp.lv-ok{color:var(--green);border-color:rgba(61,220,151,.35)}
.ximp.lv-caution{color:#F2B84B;border-color:rgba(242,184,75,.4);background:rgba(242,184,75,.06)}
.ximp.lv-high,.ximp.lv-extreme{color:#EB5F55;border-color:rgba(255,90,78,.45);background:rgba(255,90,78,.07)}
.xguard{display:flex;align-items:flex-start;gap:8px;margin:12px 0 0;padding:9px 12px;border-radius:10px;font-size:var(--t13,13px);line-height:1.4}
.xguard i{width:7px;height:7px;border-radius:50%;margin-top:6px;flex:none;background:currentColor}
.xguard.lv-caution{color:#F2B84B;background:rgba(242,184,75,.06);border:1px solid rgba(242,184,75,.28)}
.xguard.lv-high{color:#FF8A80;background:rgba(255,90,78,.07);border:1px solid rgba(255,90,78,.32)}
.xguard[hidden]{display:none}
.xqid dt,.xqid dd{color:var(--mute);font-size:12px}
.xqt{display:inline-block;min-width:3ch;text-align:right}
/* Pro: depth chart (watermark from .chartbox) */
.xdepth{overflow:visible}
.xdepth svg{display:block;width:100%;height:auto;touch-action:pan-y}
.xdt{fill:var(--mute);font:500 11px var(--mono)}
.xdlast{fill:#35C9D0}
.xdl{stroke-linejoin:round}
.xdr{position:absolute;right:6px;top:2px;font:500 12px/1 var(--mono);color:var(--txt);background:rgba(14,13,11,.8);padding:5px 8px;border-radius:7px;border:1px solid var(--line);opacity:0;transition:opacity .15s;pointer-events:none}
.xdr.on{opacity:1}
/* Pro: order book */
/* Every offer row looks the same: no depth bar, no highlight, whatever its price (people pay what they want) */
.xbt tr.ask td:first-child{color:#E4A49D}
.xbt tr.ask:hover td{background:rgba(255,255,255,.025)}
/* price vs the last sale: a plain note in the light grey USD style (68x last sale), never a warning */
.xvl{font:400 11px/1 var(--mono);color:var(--mute);margin-left:6px;white-space:nowrap;letter-spacing:0;vertical-align:0}
.xld-w.xld-i{color:var(--mute)}
/* book freshness in the card header: a quiet Live dot, or one light grey line when the data may be behind */
.xbook-s .ch,.xbook-p .ch{flex-wrap:wrap;row-gap:4px}
.xfr[hidden]{display:none}
.xfr-d{order:3;flex-basis:100%;margin:0;font:400 11.5px/1.35 var(--ui);color:var(--mute);letter-spacing:0;text-transform:none}
.ps .xlv.xlv-off::before{display:none}
.xlt tr.ask:focus-visible{outline:1px solid rgba(53,201,208,.6);outline-offset:-1px}
.xlt tr.spread td{text-align:left;padding:9px 10px;border-top:1px solid rgba(53,201,208,.35);border-bottom:1px solid rgba(53,201,208,.35);background:rgba(53,201,208,.04);font-size:var(--t14)}
.xlt tr.spread .xsl{font:600 11px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-right:6px}
.xlt .xsep{display:inline-block;width:1px;height:12px;background:var(--line2);margin:0 12px;vertical-align:-1px}
.xlt tr.bid td,.xlt tr.ghost td{text-align:left;padding:10px}
.xlt td.xc4 a,.xtt td.xc4 a{font-size:var(--t13,13px)}
/* Pro: fills tape */
.xtt td.green{color:var(--green)}
.xtt tr.flash td{animation:xflash 1.6s ease-out}
@keyframes xflash{0%{background:rgba(61,220,151,.22)}100%{background:transparent}}
.xtape .xempty{padding:14px 2px}
@media (prefers-reduced-motion:reduce){.xtt tr.flash td{animation:none}}
@media (max-width:640px){.xlt .xc3,.xlt .xc4,.xtt .xc3,.xtt .xc4{display:none}.xbt th,.xbt td{padding:6px 6px}}
@media (max-width:640px){.xhu{display:none}}
@media (max-width:640px){.xtt th:nth-child(3),.xtt td:nth-child(3){display:table-cell}}
/* Coming soon + Review row */
.xgo{display:flex;gap:8px}
.xgo .xbtn{flex:1;min-width:0}
.xrev{flex:none;height:52px;padding:0 18px;border-radius:12px;border:1px solid rgba(53,201,208,.55);background:rgba(53,201,208,.08);color:var(--amber);font:700 var(--t15,15px)/1 var(--ui);letter-spacing:.02em;cursor:pointer;transition:background var(--fast,.15s),border-color var(--fast,.15s)}
.xrev:hover{background:rgba(53,201,208,.16);border-color:#35C9D0}
.xrev:focus-visible{outline:2px solid rgba(53,201,208,.6);outline-offset:2px}
.xrev.busy{opacity:.7;cursor:progress}
.xrev.xpulse{animation:xpulse .9s ease-out}
@keyframes xpulse{0%{box-shadow:0 0 0 0 rgba(53,201,208,.55)}100%{box-shadow:0 0 0 12px rgba(53,201,208,0)}}
.xp.xnudge .xin input{animation:xnudge .35s ease-in-out}
@keyframes xnudge{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
/* review sheet */
.xrs{width:min(600px,calc(100vw - 32px))}
.xrs .xrs-d{margin:0 0 12px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--inset)}
.xrs .xrs-d dd{display:flex;align-items:baseline;justify-content:flex-end;flex-wrap:wrap;gap:0 6px}
.xrs .xrs-by{font-family:var(--ui);font-size:var(--t13,13px)}
.xrs .xfn{color:var(--dim)}
.xrs .xguard{margin:0 0 12px}
.xrs .jm-p.pc-text{max-height:200px}
.xrs .moreb{margin:-6px 0 8px}
.xrs .xrs-ub{position:relative}
.xrs .xrs-ub .cp{position:absolute;top:8px;right:8px;z-index:1}
.xrs .xrs-ub pre{max-height:180px;margin:0 0 12px;padding-right:40px}
.xrs .xrs-s{margin:4px 0 0;white-space:normal}
@media (prefers-reduced-motion:reduce){.xrev.xpulse,.xp.xnudge .xin input{animation:none}}
@media (max-width:640px){.xrs{width:100vw}.xrev{padding:0 14px}.xrs .jm-p.pc-text{max-height:150px}}
/* optional public-address balance on You pay */
.xfb{position:relative}
.xbal{position:absolute;top:7px;right:12px;display:flex;align-items:center;gap:8px;max-width:calc(100% - 96px);font:500 12px/1 var(--ui);white-space:nowrap}
.xbal[hidden]{display:none}
.xbalb{border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--mute);font:600 11.5px/1 var(--ui);padding:4px 9px;cursor:pointer;min-height:22px;overflow:hidden;text-overflow:ellipsis}
.xbalb:hover{color:var(--amber);border-color:rgba(53,201,208,.5)}
.xbalb.on{border-color:transparent;padding:5px 2px;color:var(--dim);font-family:var(--mono);font-weight:500}
.xbalb.on:hover{color:var(--txt)}
.xbalb.low{color:#EB5F55}
.xbalb.busy{opacity:.7;cursor:progress}
.xshort{color:#EB5F55;font-weight:600}
.xadd{color:var(--amber);font-weight:700;text-decoration:none;border-bottom:1px solid rgba(53,201,208,.45)}
.xadd:hover{text-decoration:none;border-color:var(--amber)}
.xbf{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.xbf[hidden]{display:none}
.xbf input{flex:1;min-width:0;height:36px;padding:0 10px;border:1px solid var(--line2);border-radius:9px;background:var(--inset,rgba(0,0,0,.25));color:var(--txt);font:500 13px/1 var(--mono)}
.xbf input:focus{outline:none;border-color:rgba(53,201,208,.6)}
.xbf button{height:36px;padding:0 14px;border:1px solid rgba(53,201,208,.55);border-radius:9px;background:rgba(53,201,208,.08);color:var(--amber);font:700 13px/1 var(--ui);cursor:pointer}
.xbn{flex-basis:100%;margin:0;color:var(--dim);font:500 12px/1.4 var(--ui)}
.xbn.bad{color:#EB5F55}
@media (max-width:420px){.xbal{right:10px;gap:6px;max-width:calc(100% - 84px)}}
/* My swaps */
.xms{margin-top:12px;padding:0}
.xms-h{display:flex;align-items:center;gap:8px;padding:10px 12px 10px 16px}
.xms-t{flex:1;display:flex;align-items:center;gap:8px;min-height:32px;background:none;border:0;padding:0;color:var(--txt);cursor:pointer;text-align:left}
.xms-t b{font:700 var(--t13,13px)/1 var(--ui);letter-spacing:var(--track-label,.08em);text-transform:uppercase;color:var(--mute)}
.xms-n{min-width:18px;padding:2px 6px;border-radius:999px;background:rgba(53,201,208,.12);color:var(--amber);font:700 11px/1.2 var(--ui);text-align:center}
.xms-n:empty{display:none}
.xms-t i{width:8px;height:8px;margin-left:auto;border-right:1.5px solid var(--mute);border-bottom:1.5px solid var(--mute);transform:rotate(45deg) translateY(-2px);transition:transform var(--fast,.15s)}
.xms.open .xms-t i{transform:rotate(-135deg) translateY(-2px)}
.xms-al{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line2);border-radius:999px;background:transparent;color:var(--mute);font:600 12px/1 var(--ui);cursor:pointer}
.xms-al:hover{color:var(--amber);border-color:rgba(53,201,208,.5)}
.xms-al.on{color:var(--amber);border-color:rgba(53,201,208,.6);background:rgba(53,201,208,.1)}
.xms-b{padding:0 16px 14px}
.xms-b[hidden]{display:none}
.xms-l{list-style:none;margin:0 0 10px;padding:0;border-top:1px solid var(--line)}
.xms-r{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.xms-r.sub{padding:6px 0 6px 14px;border-bottom-style:dashed}
.xms-r.sub b{font-weight:500;color:var(--dim)}
.xms-a{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px}
.xms-a b{font:600 var(--t14,14px)/1.3 var(--mono);color:var(--txt)}
.xms-a small{flex-basis:100%;color:var(--dim);font:500 12px/1.4 var(--ui);overflow:hidden;text-overflow:ellipsis}
.xms-p{color:var(--dim);text-decoration:underline;text-decoration-color:rgba(255,255,255,.2)}
.xms-p.bad{color:#EB5F55}
.xms-a small a{color:inherit;text-decoration:underline;text-decoration-color:rgba(255,255,255,.2)}
.xms-a small.xms-d{color:var(--mute)}
.xms-ln{color:#35C9D0}
.xms-fx{padding:8px 0 0;color:var(--mute);font:500 11.5px/1.4 var(--ui)}
.xpill{flex:none;display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;border:1px solid;font:700 11.5px/1 var(--ui);letter-spacing:.04em;white-space:nowrap}
.xpill.t-gain{color:#3CCB8E;border-color:rgba(61,220,151,.45);background:rgba(61,220,151,.08)}
.xpill.t-loss{color:#EB5F55;border-color:rgba(255,90,78,.45);background:rgba(255,90,78,.08)}
.xpill.t-live{color:#35C9D0;border-color:rgba(53,201,208,.5);background:rgba(53,201,208,.08)}
.xpill.t-mute{color:var(--mute);border-color:var(--line2)}
.xms-st{flex:none;font:600 12px/1 var(--ui)}
.xms-st.t-gain{color:#3CCB8E}.xms-st.t-loss{color:#EB5F55}.xms-st.t-live{color:#35C9D0}.xms-st.t-mute{color:var(--mute)}
.xms-retry{flex:none;height:28px;padding:0 10px;border:1px solid rgba(53,201,208,.55);border-radius:8px;background:rgba(53,201,208,.08);color:var(--amber);font:700 12px/1 var(--ui);cursor:pointer}
.xms-x{flex:none;width:26px;height:26px;border:0;border-radius:7px;background:transparent;color:var(--dim);font:400 18px/1 var(--ui);cursor:pointer}
.xms-x:hover{color:var(--txt);background:rgba(255,255,255,.05)}
.xms-e{padding:12px 0;color:var(--dim);font:500 13px/1.4 var(--ui);border-bottom:1px solid var(--line)}
.xms-f{display:flex;flex-wrap:wrap;gap:8px}
.xms-f input{flex:1;min-width:0;height:36px;padding:0 10px;border:1px solid var(--line2);border-radius:9px;background:var(--inset,rgba(0,0,0,.25));color:var(--txt);font:500 13px/1 var(--mono)}
.xms-f input:focus{outline:none;border-color:rgba(53,201,208,.6)}
.xms-f button{height:36px;padding:0 14px;border:1px solid rgba(53,201,208,.55);border-radius:9px;background:rgba(53,201,208,.08);color:var(--amber);font:700 13px/1 var(--ui);cursor:pointer}
/* My wallet sheet */
.xws{width:min(560px,calc(100vw - 32px))}
.xws .jm-p.pc-text{max-height:130px}
.xws-form{display:grid;gap:8px;margin-top:14px}
.xws-f{display:grid;grid-template-columns:72px 1fr;align-items:center;gap:10px}
.xws-f span{color:var(--mute);font:600 12px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase}
.xws-f input{height:38px;min-width:0;padding:0 10px;border:1px solid var(--line2);border-radius:9px;background:var(--inset,rgba(0,0,0,.25));color:var(--txt);font:500 13px/1 var(--mono)}
.xws-f input:focus{outline:none;border-color:rgba(53,201,208,.6)}
.xws-a{display:flex;align-items:center;gap:10px;margin-top:4px}
.xws-save{height:38px;padding:0 18px;border:0;border-radius:10px;background:linear-gradient(180deg,#35C9D0,#1F9AA3);color:#06171A;font:700 14px/1 var(--ui);cursor:pointer}
.xws-forget{height:38px;padding:0 14px;border:1px solid rgba(255,90,78,.45);border-radius:10px;background:transparent;color:#EB5F55;font:700 13px/1 var(--ui);cursor:pointer}
.xws-forget[hidden]{display:none}
.xemb.saved summary span{font-family:var(--mono);font-weight:500}
.xhelp{margin:8px 0 0;padding-left:20px;display:grid;gap:6px;font:400 13px/1.45 var(--ui);color:var(--txt)}
.xhelp li::marker{color:var(--amber);font-weight:700}
.xhelp-n{margin:8px 0 0;font:400 12px/1.5 var(--ui);color:var(--dim)}.xhelp-n code{overflow-wrap:anywhere;color:var(--txt)}
.xws-lead{margin:0 0 10px}
.xws-sv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:12px 0 0;font:500 13px/1.4 var(--ui)}
.xws-sv[hidden]{display:none}.xws-sv dt{color:var(--mute);font-size:12px;text-transform:uppercase;letter-spacing:.06em}.xws-sv dd{margin:0;color:var(--txt)}
.xad{margin:0 0 14px;padding:12px 14px;border:1px solid var(--line2);border-radius:12px;background:var(--inset,rgba(0,0,0,.2));transition:border-color .6s,box-shadow .6s}
.xad[hidden]{display:none}
.xad.fresh{border-color:rgba(53,201,208,.7);box-shadow:0 0 0 3px rgba(53,201,208,.15)}
.xad-h{display:flex;align-items:center;gap:8px;margin-bottom:4px}.xad-h b{font:700 14px/1.2 var(--ui);color:var(--txt)}
.xad-ok{display:inline-flex;align-items:center;gap:5px;color:#3CCB8E;font:600 12px/1 var(--ui)}.xad-ok::before{content:"";width:6px;height:6px;border-radius:50%;background:#3CCB8E}
.xad-l{list-style:none;margin:0;padding:0}
.xad-r{display:grid;grid-template-columns:auto 1fr auto;gap:4px 10px;align-items:start;padding:10px 0;border-top:1px solid var(--line)}
.xad-r:first-child{border-top:0}
.xad-i{display:flex;padding-top:1px}.xad-i img{width:22px;height:22px;border-radius:50%}.xad-i img+img{margin-left:-7px}
.xad-m{min-width:0;display:grid;gap:3px}.xad-m b{font:600 12px/1 var(--ui);color:var(--mute);letter-spacing:.06em;text-transform:uppercase}
.xad-a{display:flex;flex-wrap:wrap;gap:0 .32em;font:500 13.5px/1.5 var(--mono);color:var(--txt);user-select:all;-webkit-user-select:all}
.xad-m small{font:400 12px/1.4 var(--ui);color:var(--dim)}
.xad-b{display:flex;gap:6px}
.xad-cp,.xad-qb{height:30px;min-width:52px;padding:0 10px;border:1px solid rgba(53,201,208,.5);border-radius:8px;background:rgba(53,201,208,.08);color:#35C9D0;font:700 12px/1 var(--ui);cursor:pointer}
.xad-cp.ok{background:#35C9D0;color:#061314;border-color:#35C9D0}
.xad-a:not(.open){user-select:none;-webkit-user-select:none;letter-spacing:.02em}
.xad-eye{display:inline-grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--mute);cursor:pointer}
.xad-eye:hover,.xad-eye.on{color:#35C9D0;border-color:rgba(53,201,208,.5)}
.xad-eye:focus-visible,.xad-cp:focus-visible,.xad-qb:focus-visible{outline:2px solid #35C9D0;outline-offset:2px}.xad-qb.on{background:rgba(53,201,208,.2)}
.xad-q{grid-column:1/-1;justify-self:center;display:grid;justify-items:center;gap:6px;padding:8px 0 2px}.xad-q[hidden]{display:none}
.xad-q svg{display:block;border-radius:8px}.xad-q small{font:500 12px/1 var(--ui);color:var(--dim)}
.xad-f{margin:6px 0 0;padding-top:10px;border-top:1px solid var(--line);font:500 12px/1.45 var(--ui);color:var(--dim)}.xad-f a{color:#35C9D0}
@media (max-width:640px){.xad{padding:10px 12px}.xad-r{grid-template-columns:auto 1fr}.xad-b{grid-column:2}.xad-a{font-size:13px}}
@media (prefers-reduced-motion:reduce){.xad{transition:none}}
.xws-setup>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;margin:0 0 10px;font:700 13px/1 var(--ui);color:var(--txt)}
.xws-setup>summary::-webkit-details-marker{display:none}
.xws-setup>summary::before{content:"";width:6px;height:6px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:rotate(-45deg);transition:transform .2s}
.xws-setup[open]>summary::before{transform:rotate(45deg)}
.xws-note{margin:10px 0 0;font:400 12px/1.45 var(--ui);color:var(--dim)}
.xws-help{margin-top:12px}.xws-help .xws-form{margin-top:10px}
.xws-ft{margin-top:12px}.xws-ft:has(#xws-forget[hidden]){display:none}
@media (max-width:640px){.xws{width:100vw}.xws-f{grid-template-columns:60px 1fr}.xms-h{padding:8px 10px 8px 14px}.xms-b{padding:0 14px 12px}}
.xd>div[hidden],.xp .xguard[hidden]{display:none}
/* Agent launcher (agent.js): a round chat button bottom right, the panel anchored above it, full screen on phones */
/* The launcher is always on screen: it tucks to a sliver only on a phone, only while a scroll carries content under it, and
   slides back out once the scroll stops (agent.js). On desktop it never tucks. */
.xag-b.tuck{transform:translateX(calc(100% + 24px - 12px));box-shadow:none;opacity:.9}
.xag-b.tuck:hover,.xag-b.tuck:focus-visible{transform:none;opacity:1}
@media (min-width:768px),(hover:hover) and (pointer:fine){.xag-b.tuck{transform:none;opacity:1;box-shadow:0 8px 24px -6px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.3)}}
.xag-b{position:fixed;right:24px;bottom:24px;z-index:1000;display:grid;place-items:center;width:56px;height:56px;padding:0;border:0;border-radius:50%;background:#35C9D0;color:#061314;cursor:pointer;
 box-shadow:0 8px 24px -6px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.3);transition:transform .15s ease,box-shadow .15s ease}
.xag-b:hover{transform:translateY(-2px);box-shadow:0 12px 28px -6px rgba(0,0,0,.65),0 0 0 4px rgba(53,201,208,.18)}
.xag-b:focus-visible{outline:2px solid #fff;outline-offset:3px}
.xag-b svg{grid-area:1/1;transition:transform .18s ease,opacity .18s ease}
.xag-b .xag-xi{opacity:0;transform:rotate(-45deg) scale(.6)}
.xag-b[aria-expanded="true"] svg:first-child{opacity:0;transform:rotate(45deg) scale(.6)}
.xag-b[aria-expanded="true"] .xag-xi{opacity:1;transform:none}
.xag-dot{position:absolute;right:3px;bottom:3px;width:12px;height:12px;border-radius:50%;background:#3CCB8E;border:2px solid var(--bg,#0b0d0e);display:none}
.xag-b.on .xag-dot{display:block}
.xag-b.has::after{content:attr(data-n);position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#EB5F55;color:#fff;font:700 11px/20px var(--ui);text-align:center;box-shadow:0 0 0 2px var(--bg,#0b0d0e)}
.xag-b.pulse{animation:xagin .6s cubic-bezier(.3,1.5,.6,1) both}
.xag-b.pulse::before{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(53,201,208,.55);animation:xagring 2s ease-out .6s 4}
@keyframes xagin{0%{transform:translateY(16px) scale(.6);opacity:0}100%{transform:none;opacity:1}}
@keyframes xagring{0%{box-shadow:0 0 0 0 rgba(53,201,208,.55)}100%{box-shadow:0 0 0 16px rgba(53,201,208,0)}}
@media (prefers-reduced-motion:reduce){.xag-b,.xag-b svg{transition:none}.xag-b.pulse,.xag-b.pulse::before{animation:none}}
.xag{position:fixed;right:24px;bottom:92px;z-index:1001;display:flex;flex-direction:column;width:min(400px,calc(100vw - 48px));max-height:min(660px,calc(100dvh - 116px));border:1px solid var(--line2);border-radius:16px;background:var(--card);box-shadow:0 30px 80px -20px rgba(0,0,0,.8);overflow:hidden;transform-origin:bottom right;animation:xagp .16s ease-out}
@keyframes xagp{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.xag{animation:none}}
.xag[hidden]{display:none}
.xag-hd{display:flex;align-items:center;gap:10px;padding:12px 12px 10px 18px;border-bottom:1px solid var(--line)}
.xag-hd h2{margin:0;font:700 15px/1.2 var(--ui)}
.xag-st{flex:1;font:600 12px/1.2 var(--ui);color:var(--dim)}
.xag-st.ok{color:#3CCB8E}
.xag-pair{padding:12px 16px 14px;overflow-y:auto}
.xag .pbar{align-items:center;gap:8px}
.xag-exp{margin-right:auto;font:600 12px/1 var(--ui);color:var(--mute)}
.xag .jm-p.pc-text{max-height:230px;overflow-y:auto;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.5}
.xag-c{background:rgba(53,201,208,.18);color:#35C9D0;font-weight:700;padding:0 3px;border-radius:4px;letter-spacing:.06em}
.xag-adds{margin-top:12px}.xag-adds .lbl{display:block;margin-bottom:6px}
.xag-ar{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.xag-ar.morep{display:none;margin-top:6px}.xag-ar.morep.open{display:flex}
.xag-add{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:1px solid var(--line2);border-radius:9px;background:rgba(255,255,255,.03);color:var(--txt);font:600 13px/1 var(--ui);text-decoration:none}
.xag-add:hover{border-color:rgba(53,201,208,.55)}.xag-add.ok{border-color:#3CCB8E;color:#3CCB8E}
.xag .moreb{height:34px;margin:0}
.xag-help{margin-top:10px;font:400 12px/1.5 var(--ui);color:var(--dim)}
.xag-help summary{cursor:pointer;color:var(--mute);font-weight:600;width:max-content}
.xag-help ul{margin:6px 0 0;padding-left:16px}.xag-help code{font-size:11.5px;color:var(--txt);overflow-wrap:anywhere}
.xag-chat{display:flex;flex-direction:column;min-height:0;flex:1}
.xag-chat[hidden],.xag-pair[hidden]{display:none}
.xag-th{flex:1;min-height:220px;margin:0;padding:12px 14px;list-style:none;overflow-y:auto;display:flex;flex-direction:column;gap:8px}
.xag-m{width:fit-content;max-width:80%;box-sizing:border-box;padding:8px 12px;border-radius:12px;font:400 13.5px/1.45 var(--ui);white-space:pre-wrap;word-break:normal;overflow-wrap:break-word}
.xag-m.me{align-self:flex-end;background:rgba(53,201,208,.14);border:1px solid rgba(53,201,208,.3)}
.xag-m.ag{align-self:flex-start;background:var(--bg2,rgba(255,255,255,.04));border:1px solid var(--line)}
.xag-stat{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:6px 2px;font:500 12px/1.4 var(--ui);color:var(--dim);border-top:1px dashed var(--line);border-bottom:1px dashed var(--line)}
.xag-ids{color:var(--txt)}.xag-note{flex-basis:100%;color:var(--dim)}
.xag-w{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:8px 10px;border:1px solid rgba(53,201,208,.3);border-radius:10px;font:500 12px/1.4 var(--ui);color:var(--dim)}
.xag-w b{color:#35C9D0;font-weight:600}.xag-w>span{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}.xag-w .num{color:var(--text,#e8eef0)}
.xag-wv{margin-left:auto;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:none;color:inherit;font:600 12px/1 var(--ui);cursor:pointer}.xag-wv:hover{border-color:#35C9D0;color:#35C9D0}
.xag-sys{align-self:center;font:500 12px/1.4 var(--ui);color:var(--mute)}.xag-sys.bad{color:#EB5F55}
.xag-f{display:flex;gap:8px;padding:10px 14px 6px;border-top:1px solid var(--line)}
.xag-f textarea{flex:1;resize:none;min-height:40px;max-height:120px;padding:10px 12px;border:1px solid var(--line2);border-radius:10px;background:var(--bg,#0b0d0e);color:var(--txt);font:400 14px/1.4 var(--ui)}
.xag-f textarea:focus{outline:none;border-color:rgba(53,201,208,.6)}
.xag-f button{flex:none;height:40px;padding:0 14px;border:0;border-radius:10px;background:var(--amber);color:#061314;font:700 13px/1 var(--ui);cursor:pointer;align-self:flex-end}
.xag-ft{display:flex;align-items:center;gap:10px;padding:0 14px 12px}.xag-ft .xbn{flex:1;margin:0}
.xag-dc{flex:none;background:none;border:0;padding:6px 0;color:var(--dim);font:600 12px/1 var(--ui);text-decoration:underline;cursor:pointer}
@media (max-width:640px){.xag .jm-p.pc-text{max-height:58vh}.xag-pair:has(.xag-help[open]) .jm-p.pc-text{max-height:30vh}.xag-b{right:20px;bottom:20px}
 .xag{inset:0;width:100vw;max-height:none;height:100dvh;border-radius:0;border:0;animation:none}
 html.xaglock .xag-b{display:none}html.xaglock,html.xaglock body{overflow:hidden}html.xaglock #toast{bottom:120px}}

/* payment check (track.py): confirmed only after the chain read */
.xpok{color:#35C9D0;font-weight:600}.xpok::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#35C9D0;vertical-align:middle}.xpbad{color:#EB5F55;font-weight:600}
/* maker track record */
.xmr{display:block;margin-top:3px;padding:0;border:0;background:none;color:var(--mute);font:500 11px/1.3 var(--ui);cursor:pointer;text-align:inherit}.xmr:hover{color:#35C9D0}
.xmk-few{font:500 11px/1 var(--ui);color:var(--mute);margin-left:6px}
.xage{display:block;margin-top:3px;color:var(--mute);font:500 11px/1.3 var(--ui)}
.xmr-m{display:none}
@media (max-width:640px){.xmr-m{display:block}}
.xmk{width:min(440px,calc(100vw - 32px))}
.xmk .jm-in{padding-bottom:48px;background-image:url(/static/wm.svg);background-repeat:no-repeat;background-position:right 18px bottom 14px;background-size:110px auto}
@media (max-width:640px){.xmk{width:100%;max-width:100%}}
.xmk-h{font:600 16px/1.3 var(--ui);margin:2px 0 12px}
.xmk-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}
.xmk-g div{padding:10px;border:1px solid var(--line);border-radius:10px}.xmk-g dt{color:var(--mute);font:600 11px/1 var(--ui);letter-spacing:.05em;text-transform:uppercase}
.xmk-g dd{margin:6px 0 0;font-size:16px}
.xmk-n{margin:12px 0 0;color:var(--mute);font:400 12px/1.45 var(--ui)}
/* webhooks under My swaps */
.xwh{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}.xwh summary{cursor:pointer;color:var(--dim);font:600 12px/1.4 var(--ui);letter-spacing:.06em;text-transform:uppercase}
.xwh-f{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:10px}.xwh-f input{grid-column:1/-1;min-width:0}
.xwh-f input,.xwh-f select{box-sizing:border-box;width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg2,rgba(255,255,255,.03));color:inherit;font:500 13px/1.3 var(--ui)}
.xwh-f button,.xwh-x,.xwh-cp{padding:8px 12px;border:1px solid rgba(53,201,208,.45);border-radius:8px;background:none;color:#35C9D0;font:600 12px/1 var(--ui);cursor:pointer}
.xwh-s{margin-top:10px;padding:10px;border:1px solid rgba(53,201,208,.35);border-radius:10px;font:500 12px/1.4 var(--ui);color:var(--dim)}.xwh-s b{color:#35C9D0}
.xwh-c{display:flex;gap:8px;align-items:center;margin:6px 0}.xwh-c code{flex:1;min-width:0;overflow-wrap:anywhere;font-size:12px}
.xwh-l{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}.xwh-l li{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:500 12px/1.4 var(--ui)}
.xwh-l small{flex:1 1 100%;color:var(--mute)}.xwh-l .xwh-x{margin-left:auto;padding:5px 10px}.xwh-l li{position:relative}
.xwh-n{margin:10px 0 8px}
/* intent board */
.xint .xit td:first-child{color:#35C9D0}.xsig{color:#35C9D0;font-size:11px;margin-left:2px}.xint-e{margin:6px 0 2px}.xint-n{margin:10px 0 0}
@media (max-width:640px){.xit .xc4{display:none}.xit th:nth-child(4),.xit td:nth-child(4){display:table-cell}}
/* price chart */
.xpc svg{display:block;width:100%;height:auto}.xpc-n{margin:8px 0 0}.xpc-n:empty{display:none}
/* keep the last content clear of the Agent launcher (56px at 24px from the corner) */
/* Route row: best of all pairs */
.xbr{color:var(--dim);font-size:12px}.xbr-b{padding:0;border:0;background:none;color:#35C9D0;font:600 12px/1.3 var(--ui);cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
/* ladder */
.xldb{margin-right:6px;padding:5px 10px;border:1px solid var(--line2);border-radius:999px;background:none;color:var(--dim);font:600 12px/1 var(--ui);cursor:pointer}.xldb:hover{color:#35C9D0;border-color:rgba(53,201,208,.45)}
.xld .jm-in{max-width:520px}.xld-l{margin:0 0 12px;color:var(--dim);font:500 13px/1.4 var(--ui)}
.xld-f{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.xld-f label{display:grid;gap:4px;font:600 11px/1 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.xld-f input,.xld-f select{box-sizing:border-box;width:100%;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.03);color:inherit;font:500 14px/1.2 var(--mono,monospace)}
.xld-o{margin-top:12px}.xldt tfoot td{border-top:1px solid var(--line2);color:var(--fg)}.xld-w{margin:8px 0 0;color:#FFB000;font-size:12px}.xld-ask{margin-top:12px}
@media (max-width:640px){.xld-f{grid-template-columns:1fr 1fr}.xld .jm-in{max-width:none}}
@media (max-width:640px){.xldt th:nth-child(3),.xldt td:nth-child(3){display:table-cell}.xld-ask span{display:inline!important}}
/* Pay with (swap card) and the in-progress tag (soft holds) */
.xpw-v{font:500 12px/1.3 var(--mono);color:var(--txt)}.xpw-v.bad{color:#EB5F55}
.xheld{display:inline-block;margin-left:6px;padding:0 6px;border-radius:999px;font:600 10px/16px var(--ui);letter-spacing:.04em;color:var(--steel);background:rgba(53,201,208,.08)}
.xallt{width:100%}.xall .na{margin:10px 0}
#xallb[aria-pressed="true"]{color:#35C9D0;border-color:rgba(53,201,208,.45)}
.xpw-na{display:block;flex-basis:100%;text-align:right;font:400 11px/1.35 var(--ui);color:var(--mute)}

/* Order book header on one line at phone widths */
.xcard .ch h2{white-space:nowrap}
@media (max-width:420px){.xwd{display:none}}
/* Activity: size and price lead, a small badge and network mark, then quiet names, time and one POAScan link */
.xact .xa-w{overflow-x:auto}
.xact table.xa{width:100%;border-collapse:collapse;table-layout:auto}
.xact .xa th{padding:8px 10px;text-align:left;font:600 10.5px/1 var(--ui);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--mute);border-bottom:1px solid var(--line);white-space:nowrap}
.xact .xa td{padding:11px 10px;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
.xact .xa tr:last-child td{border-bottom:0}
.xact .xa tbody tr{transition:background-color .15s ease}.xact .xa tbody tr:hover{background:rgba(255,255,255,.02)}
.xact .xa-ev{width:1%}.xact .xa-ev .netl{width:14px;height:14px;margin-left:8px;vertical-align:-3px;opacity:.85}
.xa-b{display:inline-block;min-width:52px;box-sizing:border-box;padding:3px 7px;border-radius:6px;font:600 10.5px/1.2 var(--ui);letter-spacing:.04em;text-transform:uppercase;text-align:center}
.xa-b.fi{background:rgba(60,203,142,.14);color:#3CCB8E}
.xa-b.of{border:1px solid rgba(53,201,208,.38);color:#35C9D0;padding:2px 6px}
.xa-b.na{background:rgba(255,255,255,.04);color:var(--mute)}
.xact .xa-sz b,.xact .xa-px b{font:600 14px/1.2 var(--mono);color:var(--hi,#F6F0E2)}
.xact .xa-sz .unit,.xact .xa-px .unit{font-size:11px;color:var(--dim)}
.xact .xa-px .usd{font-size:11px;color:var(--mute);margin-left:4px}
.xact .xa-na .xa-sz b,.xact .xa-na .xa-px b{color:var(--dim);font-weight:500}
.xact .xa-who{font:500 12px/1.3 var(--ui);color:var(--dim);max-width:280px;overflow:hidden;text-overflow:ellipsis}
.xa-n{color:var(--dim);text-decoration:none}.xa-n.mono{font:500 11.5px/1 var(--mono)}.xa-n:hover{color:#35C9D0;text-decoration:underline;text-underline-offset:3px}
.xa-to{color:var(--mute)}
.xact .xa-t{font:500 12px/1.2 var(--ui);color:var(--mute);text-align:right;width:1%}.xact .xa th:nth-last-child(2){text-align:right}
.xa-f{display:inline-block;margin-right:8px;padding:1px 6px;border-radius:5px;background:rgba(255,176,0,.1);color:#E3B15A;font:600 10.5px/1.4 var(--ui)}
.xa-f.bad{background:rgba(235,95,85,.12);color:#EB5F55}
.xact .xa-l{width:1%;padding-left:2px;text-align:right}
.xa-x{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:7px;color:var(--mute);transition:color .15s ease,background-color .15s ease}
.xa-x:hover,.xa-x:focus-visible{color:#35C9D0;background:rgba(53,201,208,.08)}
.xa-e{margin:0;padding:14px 0;color:var(--dim);font:500 13px/1.4 var(--ui)}
@media (prefers-reduced-motion:reduce){.xact .xa tbody tr,.xa-x{transition:none}}
/* phones: two lines per event. 1: badge, size, price. 2: names, time, link */
@media (max-width:640px){
 .xact .xa thead{display:none}.xact table.xa,.xact .xa tbody{display:block;width:100%}
 .xact .xa tr{display:grid;grid-template-columns:76px auto minmax(0,1fr) auto;grid-template-areas:"ev sz px px" "who who t l";column-gap:10px;row-gap:4px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
 .xact .xa tr:last-child{border-bottom:0}
 .xact .xa td{display:block;padding:0;border:0;min-width:0;width:auto}
 .xact .xa-ev{grid-area:ev}.xact .xa-sz{grid-area:sz}.xact .xa-px{grid-area:px;justify-self:end;text-align:right;overflow:hidden;text-overflow:ellipsis}
 .xact .xa-who{grid-area:who;max-width:none;font-size:11.5px}.xact .xa-t{grid-area:t;font-size:11.5px}.xact .xa-l{grid-area:l}
 .xact .xa-sz b,.xact .xa-px b{font-size:13.5px}.xa-x{width:24px;height:24px;margin:-4px -4px -4px 0}
 .xa-b{min-width:0}
}
/* Swap page layout: two balanced columns, nothing sticky, nothing overlaps. The left column is the card then My swaps; the right is
   the stats strip, the order book and the price chart. Whichever column is shorter lets its last card (My swaps or the chart) grow,
   so the grid never leaves a void at any width. Below it: Activity (Simple) or Depth, Fills and Intents (Pro). */
.ps .xp{position:relative;top:auto}
.ps .xp::after{display:none}
.ps .xgrid{align-items:stretch}
.ps .xl,.ps .xr{display:flex;flex-direction:column;gap:16px;min-width:0}
.ps .xr>*,.ps .xl>*{margin:0}
.ps .xms{flex:1 1 auto;margin:0;display:flex;flex-direction:column}
.ps .xchart{flex:1 1 auto;display:flex;flex-direction:column}
.ps .xchart>.cb{flex:1 1 auto;display:flex;flex-direction:column;justify-content:flex-start;height:auto}
.ps .xpc{flex:1 1 auto;min-height:170px;overflow:hidden}
.ps .xpc svg{position:absolute;inset:0;width:100%;height:100%}
.ps .xchart .xpc-n{flex:none;height:auto;margin:8px 0 0;padding:0 4px;color:var(--mute)}
.ps .xbelow{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.ps .xbelow>.card{margin:0}
.ps .xact{margin-bottom:0}
/* page end, no dead space: the footer is the last thing on the page and sits at the bottom of the window on short pages
   (body is a column, main grows). The launcher (56px at 24px from the corner) is kept off the footer links by room on the
   footer's right, and the footer is at least as tall as the launcher's corner so it never covers the last row of the page. */
body.ps{display:flex;flex-direction:column}
.ps>main.wrap{flex:1 0 auto;width:100%;box-sizing:border-box}
.ps>footer.wrap{flex:none;width:100%;box-sizing:border-box}
.ps .foot{padding-right:104px;min-height:88px}
.ps main{animation-fill-mode:backwards}   /* main's fade-in leaves no transform behind, so nothing fixed is ever pinned to main */
@media (max-width:640px){.ps .foot{padding-right:88px;min-height:80px}}
.ps main.wrap{padding-bottom:16px}

/* My swaps: just the user's swaps */
.xms-h{min-height:52px;box-sizing:border-box;padding:10px 12px 10px 18px;border-bottom:1px solid var(--line)}
.xms-h h2{margin:0;font-size:var(--t14);font-weight:600;letter-spacing:var(--track-label);text-transform:uppercase;color:var(--hi);line-height:var(--lh-tight)}
.xms-h .xms-al{margin-left:auto}
.xms-b{padding:0 18px 6px;flex:1 1 auto}
.xms-l{border-top:0;margin:0;max-height:420px;overflow-y:auto}
.xms-r:last-child{border-bottom:0}
.xms-e{border-bottom:0;padding:14px 0}

/* You pay / You get: token chips that open the asset list; balance under the chip, on both sides */
.xus{display:inline-flex;align-items:center;gap:6px;flex:none;cursor:default}
.xus .netl{margin-right:4px}
.xpw-v[hidden]{display:none}
.xff{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:22px;margin-top:4px}



.xfb .xbal,.xbal{position:static;max-width:none}
.xbalb{border:0;padding:2px 0;min-height:20px;background:none;color:var(--mute);font:500 12px/1 var(--ui)}
.xbalb:hover{color:#35C9D0}
.xf:not(.xfb) .xff{display:none}

/* one primary button: Coming soon until swaps open (it still opens Review), Swap after */
.xgo .xbtn.xrev{flex:1;width:100%;height:52px;padding:0 18px;border:0;border-radius:12px;background:linear-gradient(180deg,#35C9D0,#1F9AA3);color:#06171A;
 font:700 var(--t16,16px)/1 var(--ui);letter-spacing:.02em;cursor:pointer;box-shadow:0 8px 24px -12px rgba(53,201,208,.7);filter:none;transition:filter var(--fast,.15s),box-shadow var(--fast,.15s),transform var(--fast,.15s)}
.xgo .xbtn.xrev:hover{filter:brightness(1.06);box-shadow:0 10px 28px -10px rgba(53,201,208,.8)}
.xgo .xbtn.xrev:active{transform:translateY(1px)}
.xgo .xbtn.xrev:focus-visible{outline:2px solid rgba(53,201,208,.7);outline-offset:3px}
.xgo .xbtn.xrev.soon::after{background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%)}
.xgo #xgo{display:none}
@media (prefers-reduced-motion:reduce){.xgo .xbtn.xrev{transition:none}}

/* Developers (/about#dev): Track and Webhooks */
.xdvc .cb{display:block}
.xdv h2{font-size:var(--t16);margin:22px 0 8px}
.xdv-f{display:flex;flex-wrap:wrap;gap:8px;max-width:640px}
.xdv-f input{flex:1 1 220px;min-width:0;height:38px;box-sizing:border-box;padding:0 10px;border:1px solid var(--line2);border-radius:9px;background:var(--inset,rgba(0,0,0,.25));color:var(--txt);font:500 13px/1 var(--mono)}
.xdv-f input:focus{outline:none;border-color:rgba(53,201,208,.6)}
.xdv-f button{height:38px;padding:0 16px;border:1px solid rgba(53,201,208,.55);border-radius:9px;background:rgba(53,201,208,.08);color:var(--amber);font:700 13px/1 var(--ui);cursor:pointer}
.xdv-f button:hover{background:rgba(53,201,208,.16)}
.xdv .xbn{margin:8px 0 0}.xdv .xbn.bad{color:#EB5F55}
.xdv .xtr-l{max-width:640px;margin-top:8px}
.xdv .xwh-s,.xdv .xwh-l{max-width:640px}

/* Pay with: the one all-in is the Route value (it stands in for "Best offer"); a cheaper route reads inline and applies on click */
.xd .xpw-v{font:500 12px/1.3 var(--mono);color:var(--txt)}.xd .xpw-v .usd{font-size:11px;color:var(--mute);margin-left:4px}
.xd .xpw-v:not(:empty)+#xroute{display:none}.xd .xpw-na{display:none}
.xd .xpw-v .xbr,.xd .xpw-v .xbr-b{font-size:12px}.xd .xpw-v .xbr-b{margin-left:2px}
#xbal-s .xbalb:not(.on){cursor:default}#xbal-s .xbalb:not(.on):hover{color:var(--mute)}
/* Ask agent: one icon button at the right of every card header, before any pill; same size and behavior everywhere */
.ps .ch .askb,.ps .xms-h .askb{width:28px;height:28px;padding:0;justify-content:center;gap:0;flex:none}
.ps .ch .askb span,.ps .xms-h .askb span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ps .xms-h .askb{margin-left:auto}.ps .xms-h .askb+.xms-al{margin-left:0}
@media (max-width:640px){.ps .ch .askb,.ps .xms-h .askb{width:36px;height:36px}}
/* Coin marks (coins.js): text height in numbers, 18px in chips and lists, a chain badge where the chain matters */
.cn{display:inline-flex;align-items:center;gap:5px;vertical-align:-.17em;line-height:1;white-space:nowrap}
.cn-i{position:relative;display:inline-block;width:1.1em;height:1.1em;flex:none}
.cn-i img{display:block;width:100%;height:100%}
.cn-i .cn-b{position:absolute;right:-.24em;bottom:-.2em;width:.62em;height:.62em;border-radius:50%;box-shadow:0 0 0 1.5px var(--card)}
.unit .cn,.num+.cn{margin-left:1px}
.cn-l .cn-i,.xopts li .cn-i,.xsel .cn-i,#xsell .cn-i{width:18px;height:18px}
.cn-l .cn-i .cn-b,.xopts li .cn-i .cn-b,#xsell .cn-i .cn-b{width:9px;height:9px;right:-3px;bottom:-2px}
.cn-c{display:inline-flex;align-items:center;margin-right:6px}
#xopts li .netl,#xsell .netl{display:none}
.xa-ev .cn{margin-left:8px;vertical-align:-4px}.xa-ev .cn-i{width:15px;height:15px}
.xopts li .cn{margin-right:8px}#xsell .cn{margin-right:6px}

/* Best price in the pair menu (swap.js setBest): pay with any settle-able asset across every pair; Buy only */
.xopts .xog{display:flex;align-items:baseline;justify-content:space-between;margin:4px 4px 0;padding:10px 6px 4px;border-top:1px solid var(--line);border-radius:0;cursor:default;
 color:var(--mute);font-size:var(--t12);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.xopts .xog span{font-weight:400;letter-spacing:0;text-transform:none;opacity:.8}
.xopts .xog:hover{background:none}
.xopts li[data-best]{padding-top:8px;padding-bottom:8px}
.xp[data-side="sell"] .xopts .xog,.xp[data-side="sell"] .xopts li[data-best]{display:none}
.xselx{margin-left:8px;padding:3px 6px;border-radius:6px;background:rgba(53,201,208,.12);color:#35C9D0;font:600 10px/1 var(--ui);letter-spacing:.02em;white-space:nowrap}
.xselx[hidden]{display:none}
.xselb{white-space:nowrap}
@media (max-width:420px){.xselb.best{padding-left:8px;padding-right:26px;background-position:right 8px center}.xselx{margin-left:6px;padding:3px 5px}}
.xp.xrly[data-best] .xvia{display:none}
.xrs-lg{margin-left:4px;display:inline-flex;gap:4px;align-items:center;vertical-align:-2px}

/* PS-023: the fixed launcher never sits on the last buttons or links: see "page end" above (no spacer below the footer) */
/* PS-024: the chain under a pair that trades on more than one chain */
.xopts li .xch{margin-left:6px;color:var(--mute);font-size:var(--t12);font-weight:500}
/* Agent panel: waiting for the Agent (pre-pair) and the live setup step list (post_status stage setup) */
.xag-wait{display:flex;align-items:center;gap:8px;margin:10px 0 0;font:600 12.5px/1.3 var(--ui);color:var(--dim)}
.xag-wait[hidden]{display:none}
.xag-wait i{flex:none;width:8px;height:8px;border-radius:50%;background:#35C9D0;box-shadow:0 0 0 0 rgba(53,201,208,.55);animation:xagw 1.8s ease-out infinite}
.xag-chk{margin-left:auto;padding:0;border:0;background:none;color:var(--mute);font:500 12px/1 var(--ui);cursor:pointer;text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
.xag-chk:hover{color:#35C9D0}.xag-chk:disabled{cursor:default;opacity:.7}
@keyframes xagw{0%{box-shadow:0 0 0 0 rgba(53,201,208,.55)}70%{box-shadow:0 0 0 7px rgba(53,201,208,0)}100%{box-shadow:0 0 0 0 rgba(53,201,208,0)}}
.xag-steps{margin:0;padding:10px 16px 8px;list-style:none;display:flex;flex-direction:column;gap:2px;border-bottom:1px solid var(--line)}
.xag-steps[hidden]{display:none}
.xag-steps li{position:relative;display:grid;grid-template-columns:18px 1fr;column-gap:8px;align-items:center;padding:5px 0;font:500 13px/1.35 var(--ui);color:var(--dim);animation:xagsi .28s ease both}
.xag-steps li>i{grid-row:1/span 2;align-self:start;margin-top:2px;width:14px;height:14px;border-radius:50%;box-sizing:border-box;border:1.5px solid var(--line2);position:relative}
.xag-steps .xs-n{grid-column:2;font:400 12px/1.4 var(--ui);color:var(--mute);overflow-wrap:anywhere}
.xag-steps li.s-done{color:var(--txt,#e8eef0)}
.xag-steps li.s-done>i{border-color:#3CCB8E;background:#3CCB8E}
.xag-steps li.s-done>i::after{content:"";position:absolute;left:4px;top:1.5px;width:3px;height:6px;border:solid #061314;border-width:0 1.8px 1.8px 0;transform:rotate(45deg)}
.xag-steps li.s-active{color:#35C9D0;font-weight:600}
.xag-steps li.s-active>i{border-color:#35C9D0;background:rgba(53,201,208,.2);animation:xagw 1.6s ease-out infinite}
.xag-steps li.s-active>i::after{content:"";position:absolute;inset:3px;border-radius:50%;background:#35C9D0}
.xag-steps li.s-active::after{content:"";position:absolute;left:26px;right:0;bottom:0;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,rgba(53,201,208,.7),transparent);background-size:40% 100%;background-repeat:no-repeat;animation:xagbar 1.4s linear infinite}
.xag-steps li.s-error{color:#FF8A80;font-weight:600}
.xag-steps li.s-error>i{border-color:#FF5A4E;background:#FF5A4E}
.xag-steps li.s-error>i::after{content:"";position:absolute;left:3px;right:3px;top:5.25px;height:1.5px;background:#fff;border-radius:1px}
.xag-steps li.s-error .xs-n{color:#FFB4AC}
@keyframes xagbar{0%{background-position:-40% 0}100%{background-position:140% 0}}
@keyframes xagsi{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.xag-wait i,.xag-steps li,.xag-steps li.s-active>i,.xag-steps li.s-active::after{animation:none}}