:root{--bg:#010711;--panel:#020c19;--panel2:#041224;--line:#0c4678;--blue:#079fff;--cyan:#22d7ff;--text:#f4f8ff;--muted:#9bb5d1;--green:#00f2a6}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 50% 20%,#061529 0,#020a15 42%,#01050b 100%);color:var(--text);font-family:Manrope,Arial,sans-serif;min-width:320px;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background:linear-gradient(rgba(18,110,181,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(18,110,181,.035) 1px,transparent 1px);background-size:44px 44px;pointer-events:none;opacity:.35}.bg-grid{position:fixed;inset:0;background:radial-gradient(circle at 12% 50%,rgba(0,143,255,.12),transparent 30%),radial-gradient(circle at 88% 78%,rgba(0,119,255,.1),transparent 28%);pointer-events:none}.ambient{position:fixed;border-radius:50%;filter:blur(100px);pointer-events:none}.ambient-one{width:400px;height:400px;left:-240px;top:400px;background:#007fff33}.ambient-two{width:450px;height:450px;right:-250px;bottom:-100px;background:#00cfff22}
button,input{font:inherit}.topbar{height:84px;border-bottom:1px solid rgba(23,116,187,.25);display:flex;align-items:center;padding:0 34px;gap:48px;position:relative;z-index:5;background:rgba(1,7,17,.78);backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:#f7fbff;font-size:29px;font-weight:500;letter-spacing:-.04em;white-space:nowrap}.brand img{width:58px;height:48px;object-fit:contain;filter:drop-shadow(0 0 9px #00aaffaa)}.brand b{color:#10aaff;font-weight:600}
nav{display:flex;align-items:center;gap:48px;height:100%;flex:1}nav a{height:100%;display:flex;align-items:center;position:relative;text-decoration:none;color:#c4d8ed;font-size:16px;font-weight:600;white-space:nowrap}nav a.active{color:#fff}nav a.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:#079fff;box-shadow:0 0 12px #079fff}
.header-actions{display:flex;align-items:center;gap:18px}.network-btn,.wallet-btn{height:46px;border-radius:24px;border:1px solid #0b4778;background:rgba(2,13,28,.8);color:#d5e7fa;padding:0 19px;display:flex;align-items:center;gap:12px;cursor:pointer}.network-btn{min-width:205px;justify-content:center;font-size:14px}.network-icon{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:#2e70e7;color:#fff;font-weight:800}.chevron{font-size:17px;color:#89a5c0;margin-left:auto}.wallet-btn{border:0;background:linear-gradient(135deg,#069dff,#078eff);box-shadow:0 0 24px #008fff55;color:#fff;font-weight:800;font-size:15px}.wallet-btn span{font-size:17px}
.workspace{max-width:1472px;margin:20px auto 14px;padding:0 0;display:grid;grid-template-columns:428px minmax(500px,590px) 416px;gap:18px;align-items:start}
.left-col,.right-col{display:grid;gap:18px}.intro-panel,.assets-panel,.swap-panel,.market-panel,.chart-panel{border:1px solid #0a4776;background:linear-gradient(145deg,rgba(2,13,28,.96),rgba(1,8,18,.96));box-shadow:inset 0 1px 0 #1a4f7b2b,0 16px 50px #00000066;border-radius:15px}
.intro-panel{height:402px;padding:42px 14px 0 46px;position:relative;overflow:hidden}.intro-panel:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 15%,#006dff14,transparent 38%);pointer-events:none}
.intro-brand{display:flex;align-items:center;gap:12px;position:relative;z-index:2}.intro-brand img{width:87px;height:72px;object-fit:contain;filter:drop-shadow(0 0 14px #00aaffaa)}.intro-brand span{font-size:47px;font-weight:500;letter-spacing:-.055em}.intro-brand b{color:#0aaeff;font-weight:600}
.intro-panel h1{font-size:24px;letter-spacing:-.025em;margin:15px 0 13px;position:relative;z-index:2}.intro-panel p{font-size:14px;line-height:1.65;color:#a3c3e2;max-width:360px;margin:0;position:relative;z-index:2}
.chain-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:19px;position:relative;z-index:2}.chain-cards>div{height:64px;border:1px solid #0c3c69;border-radius:13px;background:linear-gradient(145deg,#05245a,#03152f);display:flex;align-items:center;gap:9px;padding:8px}.chain-cards i,.pair-coins i,.market-row i{font-style:normal}.chain-cards span{font-size:12px}.chain-cards small{display:block;color:#86a9ca;font-size:10px;margin-top:3px}.eth-icon,.eth-coin{background:linear-gradient(145deg,#f1f5ff,#79a6ff);color:#3358a9}.sol-icon,.sol-coin{background:linear-gradient(145deg,#16f4d1,#7c30ff);color:#111}.sui-icon,.sui-coin{background:linear-gradient(145deg,#c6f6ff,#4cc8ff);color:#0563a0}.eth-icon,.sol-icon,.sui-icon{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;font-size:20px;box-shadow:0 0 12px #007dff55}.wave-lines{position:absolute;left:-30px;right:-20px;bottom:-15px;height:105px;background:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 9px,#007fff2e 10px 11px,transparent 12px 24px);transform:rotate(-4deg);filter:blur(.2px);opacity:.85}
.assets-panel{height:332px;padding:20px 23px}.panel-head{display:flex;align-items:center;justify-content:space-between}.panel-head h2{margin:0;font-size:17px}.panel-head a,.subhead a{color:#00adff;text-decoration:none;font-size:13px}.small-connect{height:46px;padding:0 17px;font-size:14px}.divider{height:1px;background:#0c2945;margin:10px 0 17px}.subhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;font-size:16px}.pair-list{display:grid}.pair{height:52px;border-bottom:1px solid #0b2741;display:grid;grid-template-columns:68px 1fr auto auto;align-items:center;gap:9px;font-size:12px}.pair:last-child{border-bottom:0}.pair strong{font-weight:600;color:#dfeeff}.pair em{font-style:normal;color:#00e7a4}.pair-coins{display:flex;align-items:center}.pair-coins i{margin-right:-7px;border:2px solid #03101e}
.nxt-coin,.usdc-coin,.sol-coin,.eth-coin,.sui-coin{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex:none;font-weight:800;font-size:16px;box-shadow:0 0 12px #008dff55}.nxt-coin{background:radial-gradient(circle at 35% 30%,#2fd8ff,#075cff);color:#fff;border:1px solid #2cd7ff}.usdc-coin{background:radial-gradient(circle at 35% 30%,#2aabff,#174fff);color:#fff}.sol-coin{background:linear-gradient(145deg,#5a22ff,#17efc5);color:#fff}.eth-coin{background:linear-gradient(145deg,#f1f6ff,#5286ff);color:#3157a5}.sui-coin{background:linear-gradient(145deg,#d7fbff,#35b9ff);color:#0969a0}
.swap-panel{min-height:662px;overflow:hidden}.swap-tabs{height:74px;border-bottom:1px solid #0b3357;padding:16px;display:grid;grid-template-columns:176px 166px 1fr;align-items:center;gap:8px}.tab{height:44px;border:0;border-radius:13px;background:linear-gradient(180deg,#05152c,#031021);color:#c6d9ed;font-size:16px;cursor:pointer}.tab.active{background:linear-gradient(180deg,#0877de,#0766d1);box-shadow:inset 0 0 0 1px #159fff,0 0 22px #007dff44;color:#fff;font-weight:800}.settings{justify-self:end;border:0;background:none;color:#b7d5ef;font-size:25px;cursor:pointer}.swap-body{padding:16px}.token-box{height:149px;border:1px solid #0b4b7d;border-radius:16px;background:linear-gradient(145deg,#021428,#020d1d);padding:20px 16px}.token-label{display:flex;justify-content:space-between;color:#c4ddf4;font-size:15px;margin-bottom:11px}.token-label a{color:#00adff;cursor:pointer}.token-input{height:68px;border:1px solid #0b3559;border-radius:13px;background:#020b17;display:flex;align-items:center;padding:0 12px;gap:10px}.token-select{height:48px;min-width:178px;border:1px solid #07508a;background:linear-gradient(145deg,#062b58,#031a35);border-radius:12px;color:#f0f7ff;display:flex;align-items:center;gap:11px;padding:0 11px;font-size:18px;font-weight:700;cursor:pointer}.token-select i{width:38px;height:38px}.token-select b{margin-left:auto;color:#d2e6fa;font-size:19px}.token-input input{width:100%;background:none;border:0;outline:0;text-align:right;color:#f8fbff;font-size:27px;font-weight:600;min-width:0}.token-input small{position:absolute;display:none}.swap-switch{display:block;width:48px;height:48px;margin:-25px auto -25px;border-radius:50%;border:1px solid #078fff;background:#03172d;color:#2bb8ff;box-shadow:0 0 20px #008fff55;position:relative;z-index:3;font-size:25px;cursor:pointer}.quote-lines{margin:20px 8px 21px;padding:0 8px}.quote-lines div{display:flex;justify-content:space-between;align-items:center;padding:8px 0;color:#c3dcf2;font-size:14px}.quote-lines b{font-weight:500;color:#d9eafa}.review-btn{width:100%;height:57px;border:0;border-radius:12px;background:linear-gradient(90deg,#0b9fff,#078df3);color:#fff;font-size:16px;font-weight:800;box-shadow:0 0 26px #008dff55;cursor:pointer}.right-col{grid-template-rows:352px 294px}.market-panel{padding:22px 23px}.market-row{height:52px;border-bottom:1px solid #0b2741;display:grid;grid-template-columns:39px 1fr auto auto;gap:10px;align-items:center;font-size:15px}.market-row:last-child{border-bottom:0}.market-row i{width:34px;height:34px}.market-row b{font-weight:500;color:#f1f7ff}.market-row em{font-style:normal;color:#00e7a4;min-width:56px;text-align:right}.chart-panel{padding:21px 23px;overflow:hidden}.chart-panel .panel-head span{font-size:13px;color:#d4e6f9}.chart-price{display:flex;gap:20px;align-items:center;margin:17px 0 4px}.chart-price b{font-size:28px}.chart-price em{font-style:normal;color:#00e7a4;font-size:15px}.chart{width:100%;height:142px;display:block;margin-top:0}.ranges{display:flex;justify-content:space-between;align-items:center}.ranges button{border:0;background:none;color:#b9d0e8;font-size:13px;padding:8px 13px;border-radius:18px;cursor:pointer}.ranges .selected{border:1px solid #069fff;color:#fff;box-shadow:0 0 12px #008fff33}
.feature-strip{height:168px;border-top:1px solid #082d4b;border-bottom:1px solid #082d4b;max-width:1536px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr 1fr 1fr 300px;background:linear-gradient(180deg,#020b18,#010813);position:relative;overflow:hidden}.feature-strip:after{content:"";position:absolute;right:-40px;bottom:-40px;width:650px;height:170px;background:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 9px,#007fff24 10px 11px,transparent 12px 23px);transform:rotate(-6deg);opacity:.8}.feature-strip>div{border-right:1px solid #0a2d4a;text-align:center;padding-top:23px;position:relative;z-index:2}.feature-strip>div:last-child{border-right:0}.feature-strip i{display:grid;place-items:center;width:50px;height:50px;margin:0 auto 7px;border:1px solid #007eff;border-radius:50%;color:#00aaff;font-size:25px;font-style:normal;box-shadow:0 0 17px #008fff55}.feature-strip h3{margin:0 0 6px;font-size:15px}.feature-strip p{margin:0;color:#b1cae3;font-size:11px;line-height:1.5}.feature-strip .footer-logo{display:flex;flex-direction:column;align-items:center;padding-top:17px;border-right:0}.footer-logo img{width:95px;height:78px;object-fit:contain;filter:drop-shadow(0 0 15px #00aaff99)}.footer-logo b{font-size:25px;letter-spacing:-.04em}
.hidden-dashboard{display:none}.modal-backdrop{position:fixed;inset:0;background:#000b;backdrop-filter:blur(13px);z-index:30;display:grid;place-items:center;padding:20px}.modal-backdrop[hidden],.modal[hidden]{display:none}.modal{width:min(470px,100%);background:#061426;border:1px solid #0d4c7d;border-radius:18px;padding:22px;box-shadow:0 30px 100px #000}.modal-head{display:flex;justify-content:space-between}.modal-head span,.modal label{color:#6dbfff;font-size:10px;font-weight:800;letter-spacing:.12em}.modal h3{font:500 20px Unbounded;margin:8px 0 18px}.close-btn{background:none;border:0;color:#9db8d2;font-size:28px;cursor:pointer}.search-input,.slippage-row input,.deadline-row input{width:100%;border:1px solid #0b4777;background:#020b17;color:#fff;border-radius:11px;padding:13px;outline:0}.token-list,.wallet-list{display:grid;gap:7px;margin-top:10px;max-height:330px;overflow:auto}.token-row,.wallet-row{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid #0b3455;background:#031224;border-radius:11px;color:#fff;cursor:pointer}.token-main,.wallet-main{display:flex;align-items:center;gap:10px}.token-main small,.wallet-main small{display:block;color:#7e9bb8;font-size:10px}.slippage-row{display:grid;grid-template-columns:repeat(3,1fr) 1.4fr;gap:7px;margin:9px 0 18px}.slippage-row button{border:1px solid #0b4777;background:#031224;color:#bdd3e9;border-radius:9px;padding:11px;cursor:pointer}.slippage-row button.selected{background:#075b9c;color:#fff}.deadline-row{display:flex;gap:8px;align-items:center;margin-top:8px}.deadline-row input{max-width:100px}.modal p{color:#7892ad;font-size:11px}.review-pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:16px;background:#031224;border:1px solid #0b3c62;border-radius:12px}.review-pair div:last-child{text-align:right}.review-pair small{display:block;color:#7590ab}.review-pair strong{display:block;margin-top:5px}.review-list div{display:flex;justify-content:space-between;padding:9px 0;color:#7892ad;font-size:12px}.review-list b{color:#dbe9f8}.toast{position:fixed;right:20px;bottom:20px;z-index:40;background:#06182b;border:1px solid #0c5b91;color:#fff;padding:12px 16px;border-radius:10px;opacity:0;transform:translateY(10px);transition:.2s}.toast.show{opacity:1;transform:none}
@media(max-width:1240px){.topbar{padding:0 20px;gap:28px}nav{gap:24px}.workspace{grid-template-columns:330px minmax(430px,1fr) 330px;padding:0 18px}.intro-brand span{font-size:36px}.intro-panel{padding-left:25px}.chain-cards{grid-template-columns:1fr}.chain-cards>div{height:51px}.intro-panel{height:402px}.assets-panel{height:auto}.feature-strip{grid-template-columns:repeat(4,1fr);height:auto}.footer-logo{display:none!important}}
@media(max-width:980px){nav{display:none}.topbar{justify-content:space-between}.workspace{grid-template-columns:1fr 1fr}.left-col{grid-column:1}.swap-column{grid-column:2;grid-row:1 / span 2}.right-col{grid-column:1;grid-row:2}.feature-strip{grid-template-columns:1fr 1fr}.feature-strip>div:nth-child(2){border-right:0}.feature-strip>div:nth-child(3),.feature-strip>div:nth-child(4){border-top:1px solid #0a2d4a}.right-col{grid-template-rows:auto auto}}
@media(max-width:700px){.topbar{height:72px;padding:0 14px}.brand{font-size:22px}.brand img{width:45px;height:38px}.network-btn{display:none}.workspace{display:block;margin:12px 12px}.left-col,.right-col{display:grid;gap:12px;margin-bottom:12px}.intro-panel{height:390px;padding:28px 20px}.intro-brand img{width:64px;height:56px}.intro-brand span{font-size:34px}.intro-panel h1{font-size:21px}.chain-cards{grid-template-columns:repeat(3,1fr)}.chain-cards>div{height:62px;display:block;text-align:center;padding:7px}.chain-cards i{margin:auto}.chain-cards span{font-size:9px}.chain-cards small{font-size:8px}.assets-panel{height:auto}.swap-panel{min-height:0;margin-bottom:12px}.swap-tabs{grid-template-columns:1fr 1fr 40px}.token-select{min-width:150px}.right-col{grid-template-rows:auto auto}.feature-strip{grid-template-columns:1fr 1fr}.feature-strip>div{min-height:150px}.header-actions .wallet-btn{height:40px;padding:0 12px;font-size:12px}}
@media(max-width:470px){.brand span{display:none}.swap-tabs{grid-template-columns:1fr 1fr 34px}.tab{font-size:13px}.token-input{padding:0 8px}.token-select{min-width:128px;font-size:15px}.token-input input{font-size:22px}.pair{grid-template-columns:62px 1fr auto}.pair em{display:none}.market-row{grid-template-columns:36px 1fr auto auto;font-size:13px}.market-row em{min-width:48px}.feature-strip{grid-template-columns:1fr}.feature-strip>div{border-right:0!important;border-top:1px solid #0a2d4a}.feature-strip>div:first-child{border-top:0}}

/* Logo visibility correction */
.brand{overflow:visible}.brand img{width:52px;height:52px;object-fit:contain;object-position:center;overflow:visible;flex:0 0 52px}
.intro-brand{min-width:0;overflow:visible}.intro-brand img{width:78px;height:78px;object-fit:contain;object-position:center;overflow:visible;flex:0 0 78px}
.footer-logo img{width:88px;height:82px;object-fit:contain;object-position:center;overflow:visible}
@media(max-width:700px){.intro-brand img{width:68px;height:68px;flex-basis:68px}}


/* Local coin artwork: use real asset images instead of text glyphs. */
.coin-icon{width:28px;height:28px;display:inline-block;flex:0 0 28px;object-fit:contain;border-radius:50%;vertical-align:middle}.token-select .coin-icon{width:30px;height:30px;flex-basis:30px}.token-row .coin-icon{width:34px;height:34px;flex-basis:34px}.pair-coins .coin-icon{width:28px;height:28px;flex-basis:28px}.market-row>.coin-icon{width:30px;height:30px;flex-basis:30px}.wallet-main .coin-icon{width:30px;height:30px;flex-basis:30px}.token-main .coin-icon{width:34px;height:34px;flex-basis:34px}
