:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#000;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100svh;width:100%}a{font-weight:500;color:#000;text-decoration:inherit}a:hover{color:#333}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100svh;overflow-y:auto}.app-shell{width:100%;min-height:100svh;display:flex;justify-content:center;align-items:center;background:radial-gradient(1200px 600px at 10% -10%,#e0f2fe 0%,transparent 60%),radial-gradient(1200px 600px at 110% 10%,#ffe4e6 0%,transparent 60%),radial-gradient(1200px 600px at 50% 120%,#f3e8ff 0%,transparent 60%),linear-gradient(180deg,#fbfbfb,#fff);position:relative}.app-shell:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px);background-size:32px 32px,32px 32px;-webkit-mask-image:radial-gradient(60% 60% at 50% 50%,#000 40%,transparent 100%);mask-image:radial-gradient(60% 60% at 50% 50%,#000 40%,transparent 100%);pointer-events:none}@media (max-width: 768px){body{align-items:flex-start;padding:16px 0}}.app-card{transform:translateY(-2vh)}@media (max-width: 768px){.app-card{transform:none;margin:12px;overflow:visible}}.cards-grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:16px;width:100%}.grid-left{justify-self:start}.grid-right{justify-self:end}.cards-grid.swapping .token-card{animation:swapPulse .45s ease-in-out}@keyframes swapPulse{0%{transform:scale(1);box-shadow:0 8px 24px #0000000f}50%{transform:scale(.98);box-shadow:0 6px 18px #00000014}to{transform:scale(1);box-shadow:0 8px 24px #0000000f}}@media (max-width: 768px){.cards-grid{grid-template-columns:1fr;row-gap:12px}.grid-left,.grid-right,.swap-btn{justify-self:center}.swap-btn svg{transform:rotate(90deg);transition:transform .2s ease}}h1{font-size:3.2em;line-height:1.1}.gradient-text{background:linear-gradient(90deg,#7dd3fc,#f0abfc,#fda4af);-webkit-background-clip:text;background-clip:text;color:transparent}button{border-radius:6px;border:1px solid #e5e5e5;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#fff;color:#000;cursor:pointer;transition:all .2s ease}button:hover{border-color:#000;background-color:#f8fafc;box-shadow:0 6px 16px #00000014;transform:translateY(-1px)}button:disabled,button[disabled]{pointer-events:none;box-shadow:none;transform:none;filter:none}button:focus,button:focus-visible{outline:none;box-shadow:0 0 0 4px #0f172a0f,0 0 0 1px #0f172a1a inset}button,a{-webkit-tap-highlight-color:transparent}@media (prefers-color-scheme: light){:root{color:#000;background-color:#fff}a:hover{color:#333}button{background-color:#fff}}.token-buttons button{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#90caf999,#f48fb199) border-box}.token-buttons button:hover img{filter:drop-shadow(0 1px 2px rgba(0,0,0,.12))}@keyframes floatIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.app-card{animation:floatIn .4s ease-out}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.swap-btn{position:relative;overflow:hidden}.swap-btn.is-swapping svg{animation:spinSwap .45s ease-in-out}@keyframes spinSwap{0%{transform:rotate(0)}to{transform:rotate(180deg)}}.swap-btn.is-swapping:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at center,rgba(25,118,210,.2),transparent 60%);animation:ripple .45s ease-out;pointer-events:none}@keyframes ripple{0%{transform:scale(.8);opacity:.6}to{transform:scale(1.2);opacity:0}}input[type=number]{-moz-appearance:textfield;appearance:textfield;-webkit-appearance:none}