/* Shared presentation only: application selectors and API contracts stay intact. */
html { scroll-behavior:smooth; scroll-padding-top:90px }
body { -webkit-font-smoothing:antialiased }
body * { letter-spacing:0 }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent }
:focus-visible { outline:3px solid #3387df; outline-offset:4px }
button,a { transition:background .18s,color .18s,border-color .18s,box-shadow .18s }
button:disabled { opacity:.55; cursor:wait }
.site-body { background:#101315 }
.site-nav { z-index:10; background:#111619d9; border-bottom:1px solid #ffffff20; backdrop-filter:blur(18px); height:84px }
.brand-mark { background:#baff65; color:#132018; border:0; border-radius:8px; font-size:24px; box-shadow:inset 0 -4px #00000015 }
.brand { font-size:17px }
.site-nav .nav-cta { background:#baff65; color:#172014; border-radius:6px; padding:12px 18px }
.site-nav nav { gap:22px }
.hero-stage { min-height:710px; height:calc(100svh - 75px); max-height:900px; background:#080e10 }
.hero-media { object-position:center; opacity:.9 }
.hero-shade { background:linear-gradient(90deg,#080d10f5 0%,#080d10b8 35%,#080d1000 72%); box-shadow:none }
.hero-copy { width:min(600px,50%); padding-top:70px }
.hero-copy h1 { font-size:80px; line-height:1.04; font-weight:750; max-width:590px; margin:24px 0 }
.hero-lead { font-size:19px; line-height:1.7; color:#c4d0cd; max-width:510px }
.eyebrow { font-size:12px; font-weight:750; letter-spacing:0!important }
.hero-copy .eyebrow { color:#baff65; display:flex; align-items:center; gap:10px }
.hero-copy .eyebrow:before { content:''; width:6px; height:6px; background:#baff65; border-radius:50%; flex-shrink:0 }
.button { min-height:50px; border-radius:6px; font-size:14px; padding:14px 22px; text-align:center }
.button.primary { background:#baff65; color:#142116; border-color:#baff65 }
.button.primary:hover,.nav-cta:hover { background:#d0ff9a }
.button.secondary { background:#ffffff0a; border-color:#ffffff50 }
.hero-proof { gap:22px; padding-top:26px; font-size:11px; color:#a7b7b3 }
.network-strip { display:flex; flex-wrap:wrap; justify-content:center; gap:24px 38px; padding:26px 24px; border-block:1px solid #ffffff15; background:#171c1e; color:#b6c4c6; font-size:14px; font-weight:650 }
.network-strip span:nth-child(3n+1) { color:#d0ddf8 }
.network-strip > span { display:inline-flex; align-items:center; gap:8px; white-space:nowrap; min-height:36px }
.network-strip img { width:36px; height:36px; flex:none; object-fit:contain }
.network-strip [data-chain="sonic"] img,.network-strip [data-chain="arc"] img { background:#f4f7f8; border-radius:50%; padding:4px; box-sizing:border-box }
.signal-band { background:#f5f7f9; padding:96px 0; color:#172026 }
.signal-layout { gap:60px; align-items:end }
.signal-layout h2,.workflow-copy h2 { font-size:44px; line-height:1.16; font-weight:650 }
.signal-layout>p { font-size:16px; line-height:1.8; color:#606c75 }
.eyebrow.dark { color:#376152 }
.feature-grid article { padding-top:28px }
.feature-index { color:#2f6451; border:0; background:transparent; font-size:13px }
.feature-grid h3 { margin-top:26px; font-size:19px }
.feature-grid article:nth-child(2) .feature-index { color:#3a73b9 }
.feature-grid article:nth-child(3) .feature-index { color:#b04d40 }
.feature-grid p { font-size:14px; line-height:1.8; color:#627079 }
.workflow-band { background:#14191c; padding:96px 0 }
.workflow-layout { align-items:center; gap:70px; grid-template-columns:minmax(0,1fr) minmax(0,450px) }
.steps li { grid-template-columns:1fr; gap:8px; padding:22px 0; border-color:#ffffff18 }
.steps span { line-height:1.7; color:#aab7bd; font-size:14px }
.live-panel { padding:22px; background:#20282c; border-color:#3a464b; box-shadow:0 24px 70px #0005; min-width:0 }
.live-panel-head { font-size:10px; color:#b8c6cd; gap:8px }
.live-panel-head span:last-child { margin-left:auto }
.preview-modes { display:flex; margin:20px 0 16px; padding:4px; background:#11181b; border-radius:6px; gap:4px }
.preview-modes button { flex:1; min-width:0; padding:10px 5px; background:transparent; color:#afbdc3; border:0; border-radius:4px; font:inherit; font-size:12px; cursor:pointer; overflow-wrap:anywhere }
.preview-modes button[aria-pressed=true] { background:#baff65; color:#162118; font-weight:700 }
.preview-banner { position:relative; height:110px; overflow:hidden; border-radius:4px; margin-bottom:20px }
.preview-banner img { width:100%; height:100%; object-fit:contain; background:#101719 }
.preview-banner span { position:absolute; bottom:12px; left:12px; font-size:10px; font-weight:700; background:#10181be8; padding:6px 9px; color:#fff }
.live-panel dl { font-size:13px }
.live-panel .token-orb { background:#baff65; color:#172014; border:0 }
.preview-trade { display:grid; grid-template-columns:32px 1fr auto; gap:10px; padding:14px 0; border-bottom:1px solid #ffffff18; align-items:center; font-size:13px }
.preview-trade img { width:30px; height:30px; object-fit:contain }
.preview-trade small { display:block; color:#9aaeb6; margin-top:5px; font-size:11px }
.preview-trade b { color:#baff65; font-variant-numeric:tabular-nums }
.preview-heading { font-size:13px; margin:12px 0 0; color:#e4eaed }
.post-links { margin-top:18px; font-size:12px }
.post-links span { background:#2c3a40; border-color:#40515a; color:#d6e2e6 }
.cta-band { background:#bdff79; color:#172014 }
.cta-layout h2 { font-size:36px; max-width:740px; line-height:1.2 }
.site-footer { background:#101517; color:#a9b9be; font-size:12px; min-height:100px; gap:24px; height:auto; padding-top:28px; padding-bottom:28px }
.auth-body,.dashboard-body { background:#f3f5f8; color:#24323b }
.auth-panel { padding-top:38px }
.auth-form h1 { font-size:42px; font-weight:650; line-height:1.12 }
.auth-form>p { color:#677882; line-height:1.7 }
.auth-form { padding:60px 0 }
.auth-form input,.field input,.field select,.field textarea { border-color:#cfd8dd; border-radius:6px; background:#fbfcfd; min-width:0; max-width:100%; color:#24323b }
.auth-form .button.primary { background:#214d3e; color:#fff; border-color:#214d3e }
.auth-visual { background:#101719 }
.auth-visual img { object-position:65% center }
.auth-caption { background:#11191ddd; padding:26px; border-left:3px solid #baff65; backdrop-filter:blur(14px) }
.dashboard-sidebar { background:#171e22; border-right:1px solid #303c43 }
.dashboard-sidebar .brand { padding-inline:0; font-size:15px }
.dashboard-nav button.active { background:#2b3b36; color:#c4ff9a; box-shadow:inset 3px 0 #baff65 }
.dashboard-top h1 { font-size:30px; font-weight:650 }
.dashboard-main { padding-top:36px }
.metric-grid { border:0; border-radius:0; background:transparent; gap:18px }
.metric { background:#fff; border:1px solid #dce3e8!important; border-radius:6px; padding:22px; min-height:138px }
.metric strong { font-size:30px; color:#24323b; font-variant-numeric:tabular-nums }
.metric:nth-child(2) strong { color:#257752 }
.metric:nth-child(3) strong { color:#3b73b7 }
.metric:nth-child(4) strong { color:#b55c4b }
.section-head { gap:18px }
.token-row,.destination-row { border-color:#dce3e8; box-shadow:0 2px 3px #17273503 }
.editor { border:0; border-top:1px solid #d7e0e5; border-radius:0; padding:24px 0; background:transparent }
.ui-button { border-color:#cad5dc; display:inline-flex; align-items:center; justify-content:center; text-align:center }
.ui-button.primary { background:#234e40; border-color:#234e40 }
.top-actions { flex-wrap:wrap }
.admin-body { background:#f3f5f8; color:#26343e; font-family:Inter,system-ui,sans-serif }
.admin-body .page { max-width:1480px; padding:28px 36px }
.admin-body .hero { border:0; border-bottom:1px solid #d4dee5; border-radius:0; background:transparent; padding:12px 0 28px; align-items:center }
.admin-body h1 { font-size:28px; font-weight:650 }
.admin-body .hero p { color:#6b7b86; font-size:13px; max-width:570px; line-height:1.7 }
.admin-body .tabs { border-bottom:1px solid #cdd9e1; gap:0; flex-wrap:nowrap; overflow-x:auto; padding-bottom:0; margin-bottom:28px }
.admin-body .tab-button { min-width:auto; flex-shrink:0; border:0; border-bottom:3px solid transparent; border-radius:0; padding:15px 18px; background:transparent; color:#627580 }
.admin-body .tab-button.active { color:#245d46; border-bottom-color:#245d46; background:#e6eee9 }
.admin-body .band { background:transparent; border:0; border-radius:0; padding:0; margin-bottom:30px }
.admin-body .band h2 { font-size:20px; margin-bottom:24px }
.admin-body input,.admin-body textarea,.admin-body select,.admin-body button,.admin-body .button-link { background:#fff; color:#263d4b; border:1px solid #cbd7df; border-radius:5px; padding:10px 12px; font:inherit; font-size:13px; max-width:100% }
.admin-body button.primary { background:#24523f; color:#fff; border-color:#24523f }
.admin-body .stack { gap:9px; margin-bottom:18px; font-size:13px; min-width:0 }
.admin-body .row { background:white; border-color:#d7e0e6 }
.admin-body .muted { color:#647985 }
.admin-body .rpc-status { background:#fff; border-color:#d7e0e6; font-size:12px }
.admin-body .rpc-status small { color:#647985; overflow-wrap:anywhere }
.admin-body .rpc-status-title { color:#617782 }
.admin-body .rpc-actions button { min-width:28px; padding:0; color:#3a5764 }
.admin-body .asset-box { background:#edf1f5; border-color:#cbd7df }
.admin-body .grid-two { gap:28px }
.web-language { display:inline-flex; align-items:center }
.web-language select { background:#fff; color:#26343e; padding:10px 12px; border:1px solid #cad5dc; border-radius:5px; font:inherit; font-size:13px; max-width:180px }
.auth-panel>.web-language { order:-1; align-self:flex-end; margin-bottom:20px }
[dir=rtl] .dashboard-nav button { text-align:right }
[dir=rtl] .dashboard-sidebar { border-left:1px solid #303c43; border-right:0 }
[dir=rtl] .hero-copy { margin-left:0; margin-right:6vw }
.auth-body,.dashboard-body,.admin-body { color-scheme:light }
.section-head span { overflow-wrap:anywhere; min-width:0 }
.user-toolbar { align-items:center; justify-content:space-between; margin-bottom:16px }
.user-toolbar .stack { flex:0 1 320px; margin:0 }
.user-row { display:grid; grid-template-columns:minmax(150px,1fr) 3fr auto; gap:24px; align-items:center; padding:20px 0; border-bottom:1px solid #d2dde4 }
.user-identity { min-width:0; overflow-wrap:anywhere }
.user-identity small { display:block; color:#627480; margin-top:6px }
.user-row dl { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; margin:0 }
.user-row dt { font-size:12px; color:#627480 }
.user-row dd { margin:8px 0 0; font-weight:700; overflow-wrap:anywhere }
.user-actions { display:grid; gap:8px; font-size:12px }
.payment-notice { margin-top:28px; border-left:3px solid #ba743d; padding:12px 16px; background:#fff4e9; color:#784922; font-size:13px; line-height:1.6 }
@media(max-width:980px) { .user-row { grid-template-columns:1fr } .user-row dl { grid-template-columns:repeat(2,minmax(0,1fr)) } .user-actions { display:flex; align-items:center; justify-content:space-between } }
.admin-body .page,.admin-body .band,.admin-body .list,.admin-body .row { min-width:0; max-width:100%; overflow-wrap:anywhere }
.admin-body .inline > * { min-width:0 }
.admin-body pre { white-space:pre-wrap; overflow-wrap:anywhere }
@media(min-width:1600px) { .hero-copy { margin-left:max(6vw,calc((100vw - 1400px)/2)) } }
@media(max-width:1100px) { .hero-copy h1 { font-size:64px } .workflow-layout { gap:36px } .site-nav nav { gap:14px } .hero-copy { width:55% } }
@media(max-width:980px) { .workflow-layout { grid-template-columns:1fr } .live-panel { width:min(100%,520px); justify-self:center } .auth-form { margin:auto; width:min(470px,100%) } .auth-panel { min-height:100svh } }
@media(max-width:760px) {
 .site-nav { height:72px } .hero-stage { min-height:700px; height:auto; max-height:none; align-items:flex-end } .hero-copy { width:100%; padding:300px 24px 44px } .hero-copy h1 { font-size:48px; max-width:390px } .hero-lead { font-size:16px; max-width:500px } .hero-media { object-position:70% top } .hero-shade { background:linear-gradient(0deg,#0b1316 5%,#0b1316e8 48%,#0b131620 100%); box-shadow:none } .hero-actions { gap:10px } .hero-actions .button { padding:13px 16px; font-size:13px } .hero-proof { gap:15px; font-size:10px } .network-strip { gap:18px 24px; font-size:12px; padding:22px } .signal-band,.workflow-band { padding:60px 0 } .signal-layout h2,.workflow-copy h2 { font-size:32px } .cta-layout h2 { font-size:28px } .feature-grid h3 { margin-top:10px } .live-panel { padding:18px } .dashboard-top { flex-wrap:wrap; gap:16px } .dashboard-top h1 { font-size:28px } .section-head { flex-wrap:wrap } .metric-grid { gap:10px } .metric { padding:16px; min-height:120px } .metric strong { font-size:24px; overflow-wrap:anywhere } .sidebar-foot { display:flex; justify-content:space-between; align-items:center; padding-top:12px; margin-top:12px } .sidebar-foot button { padding:7px 12px } .destination-row { grid-template-columns:1fr; overflow-wrap:anywhere } .admin-body .page { padding:18px 16px } .admin-body .hero { display:block } .admin-body .hero-actions { margin-top:18px; gap:8px } .admin-body .grid-two { grid-template-columns:1fr } .admin-body .rpc-status { grid-template-columns:70px minmax(0,1fr) } .admin-body .rpc-actions { grid-column:2 } .auth-form h1 { font-size:36px }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto } *,*:before,*:after { animation:none!important; transition:none!important } }
@media(max-width:760px) { .admin-body .grid-two.tab-panel.active { grid-template-columns:minmax(0,1fr) } .admin-body .row .inline { flex-wrap:wrap } }
.billing-order { border-bottom: 1px solid #d4dddf; padding: 16px 0; overflow-wrap: anywhere; }
#billingRoot { min-width: 0; }
#billingRoot code, #billingRoot pre { white-space: pre-wrap; overflow-wrap: anywhere; }
#billingRoot [data-billing-message] { color: #14734d; min-height: 24px; }
#billingRoot button { border: 1px solid #bacbcc; background: #fff; color: #203e38; border-radius: 6px; padding: 10px 14px; font: inherit; cursor: pointer; margin-top: 8px; }
#billingRoot button:hover { background: #e4f4ed; }
#billingRoot button:disabled { opacity: .55; cursor: not-allowed; }
#billingRoot form { margin-bottom: 24px; }
.trending-target-row { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto auto; gap:12px; align-items:end; }
.trending-target-row label { min-width:0; }
.admin-body .trending-target-row .stack { margin-bottom:0; }
.token-route-row { display:grid; grid-template-columns:minmax(0,2fr) minmax(120px,1fr); gap:16px; align-items:center; padding:10px 0; border-bottom:1px solid #d8e0e4; }
.token-route-row > label { min-width:0; overflow-wrap:anywhere; }
.token-route-row input[type=number] { width:100%; min-width:0; box-sizing:border-box; }
.token-routing [hidden] { display:none; }
@media(max-width:600px) { .token-route-row { grid-template-columns:minmax(0,1fr); } }
.trending-target-row input { width:100%; min-width:0; box-sizing:border-box; }
[data-trending-editor] > button { margin-top:12px; }
@media (max-width:600px) {
  .trending-target-row { grid-template-columns:minmax(0,1fr); padding-bottom:16px; border-bottom:1px solid #d8e0e4; }
  .trending-target-row > button { justify-self:start; }
}
