/* ========================================================================== 
   SWAPJACK V5.1 — ORIGINAL BRAND / ROBINHOOD CHAIN
   Keeps the established red-gold-blue identity. Robinhood alignment is used
   for chain state, execution controls and verified onchain accents only.
   ========================================================================== */
:root {
  --rh:#00c805;
  --rh-lime:#c8ff37;
  --cream:#f4f6ee;
  --ink:#050608;
  --panel:#0b0c10;
  --panel-2:#101218;
  --panel-3:#151821;
  --line:rgba(255,255,255,.11);
  --line-strong:rgba(255,255,255,.2);
  --green:var(--rh);
  --shadow:0 38px 120px rgba(0,0,0,.58);
  --radius:24px;
}

html,body{background:#050507}
body::before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    radial-gradient(circle at 78% -10%,rgba(0,200,5,.10),transparent 31%),
    radial-gradient(circle at 8% 36%,rgba(255,53,95,.08),transparent 31%),
    linear-gradient(180deg,#07080b 0,#050507 58%,#030304 100%);
}
::selection{background:rgba(200,255,55,.86);color:#050807}

.ambient{background:transparent}
.ambient-grid{opacity:.11;background-size:68px 68px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 67%)}
.ambient-glow-red{opacity:.11}
.ambient-glow-blue{opacity:.075}
.cursor-aura{background:radial-gradient(circle,rgba(0,200,5,.075),rgba(255,53,95,.045) 40%,transparent 70%)}

.boot-screen{background:#050507}
.boot-mark{border-color:rgba(255,255,255,.14);box-shadow:0 0 70px rgba(255,53,95,.18),0 0 90px rgba(81,101,178,.10)}
.boot-copy span{color:#70737d}
.boot-line{background:#171820}
.boot-line span{background:linear-gradient(90deg,transparent,var(--red),var(--rh-lime),transparent)}

.header{height:78px;background:rgba(5,5,7,.82);border-bottom-color:rgba(255,255,255,.075);backdrop-filter:blur(28px) saturate(145%)}
.header::after{background:linear-gradient(90deg,transparent 6%,rgba(255,53,95,.34),rgba(0,200,5,.24),rgba(118,149,217,.25),transparent 94%)}
.header-inner{width:min(1480px,calc(100% - 56px))}
.brand-mark{width:43px;height:43px;border-radius:14px;border-color:rgba(255,255,255,.14);box-shadow:0 0 28px rgba(255,53,95,.12)}
.brand-copy strong{font-size:14px;font-weight:850;letter-spacing:.095em}
.brand-copy small{color:#6d717b;letter-spacing:.17em}
.nav-shell{padding:5px;border-color:rgba(255,255,255,.09);background:rgba(15,16,21,.88);box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 16px 42px rgba(0,0,0,.2)}
.nav button,.nav a{height:36px;color:#7e828c;font-family:var(--sans);font-size:11px;font-weight:720}
.nav button.active,.nav a.active{color:#071008;background:var(--rh-lime);box-shadow:0 8px 22px rgba(114,161,0,.13)}
.nav button.active::after,.nav a.active::after{display:none}
.chain-pill{border-color:rgba(0,200,5,.22);background:rgba(0,200,5,.07);color:#b3bdb5}
.chain-dot,.chain-dot.demo,.chain-dot.ready{background:var(--rh-lime);box-shadow:0 0 14px rgba(200,255,55,.7)}
.icon-btn,.wallet-btn,.small-btn,.ghost-btn{background:rgba(14,15,20,.88);border-color:rgba(255,255,255,.11)}
.icon-btn:hover,.wallet-btn:hover,.small-btn:hover,.ghost-btn:hover{background:#17191f;border-color:rgba(200,255,55,.25)}
.wallet-btn{font-family:var(--sans);font-weight:760}
.wallet-btn.connected{border-color:rgba(0,200,5,.35)}

.main{width:min(1360px,calc(100% - 48px))}
.trade-main{width:min(1480px,calc(100% - 48px))}

/* Home: premium dark hero, not a full green reskin. */
body[data-route="home"] .main{width:min(1480px,calc(100% - 48px))}
.hero{position:relative;min-height:auto;margin-top:30px;padding:76px 72px;border:1px solid rgba(255,255,255,.10);border-radius:38px;grid-template-columns:1.06fr .94fr;gap:60px;background:
  radial-gradient(circle at 82% 8%,rgba(0,200,5,.16),transparent 30%),
  radial-gradient(circle at 18% 75%,rgba(255,53,95,.11),transparent 34%),
  linear-gradient(135deg,#111319 0,#090a0e 58%,#080b09 100%);
  box-shadow:0 46px 140px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.045);overflow:hidden}
.hero::before{content:"ONE SWAP · ONE ROLL · ROBINHOOD CHAIN";position:absolute;right:-88px;bottom:92px;transform:rotate(-90deg);color:rgba(200,255,55,.24);font-family:var(--mono);font-size:8px;letter-spacing:.27em}
.hero .live-badge{border-color:rgba(0,200,5,.24);background:rgba(0,200,5,.07);color:var(--rh-lime)}
.hero h1{max-width:820px;font-size:clamp(68px,7vw,118px);line-height:.85;font-weight:760;letter-spacing:-.075em}
.hero h1 .outline{color:transparent;-webkit-text-stroke:1.4px rgba(247,246,241,.66)}
.hero h1 .accent{background:linear-gradient(100deg,#ff355f 8%,#ffb052 44%,#9eb9ff 88%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.hero p{max-width:700px;color:#a1a4ad;font-size:17px;line-height:1.62}
.hero-actions .primary-btn{background:var(--rh-lime);color:#071008;border-color:var(--rh-lime);box-shadow:0 18px 42px rgba(88,133,0,.18)}
.hero-actions .ghost-btn{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.13)}
.hero-proof{color:#727680}
.hero-proof span::before{color:var(--rh-lime)}
.hero-visual{min-height:560px}
.logo-orbit{width:min(540px,88vw);border-color:rgba(255,255,255,.12);background:radial-gradient(circle at 50% 44%,rgba(20,21,28,.98),rgba(4,5,7,.99) 70%);box-shadow:0 38px 90px rgba(0,0,0,.52),inset 0 0 0 12px rgba(255,255,255,.018)}
.logo-orbit::before{border-color:rgba(255,53,95,.18)}
.logo-orbit::after{border-color:rgba(118,149,217,.2)}
.orbit-ring{border-color:rgba(200,255,55,.12)}
.hero-rail-label{color:#747883}

.metrics{margin:28px 0 100px;border-radius:26px;border-color:rgba(255,255,255,.09);background:linear-gradient(145deg,#111319,#0a0b0f);box-shadow:0 28px 80px rgba(0,0,0,.32)}
.metric{padding:30px 28px}
.metric strong{font-size:38px;font-family:var(--sans);font-weight:800}
.metric:nth-child(1) strong{color:#d2d5da}.metric:nth-child(2) strong{color:var(--rh-lime)}.metric:nth-child(3) strong{color:#f2ca6e}.metric:nth-child(4) strong{color:#92abe5}
.metric span{color:#727680;font-family:var(--sans);font-weight:760}
.section-kicker{color:var(--rh-lime);font-family:var(--sans);font-weight:820}
.section-title{font-size:34px;font-weight:760}
.info-card{min-height:270px;border-radius:25px;background:linear-gradient(145deg,#12141a,#090a0e);border-color:rgba(255,255,255,.095);box-shadow:0 20px 58px rgba(0,0,0,.2)}
.info-card:nth-child(2){background:linear-gradient(145deg,#102012,#090d0a);border-color:rgba(0,200,5,.16)}
.info-card:nth-child(3){background:linear-gradient(145deg,#15131a,#0a0a0e);border-color:rgba(255,53,95,.13)}
.info-card .num{color:var(--rh-lime);font-family:var(--sans);font-weight:820}
.info-card h3{font-size:24px;font-weight:750}
.info-card p{color:#8f939d;font-size:14px}

/* Trade terminal */
.announcement{min-height:50px;border-radius:18px;border-color:rgba(255,255,255,.10);background:rgba(12,13,17,.88);box-shadow:0 18px 44px rgba(0,0,0,.2)}
.announcement .live{color:var(--rh-lime)}
.announcement-sep{background:rgba(200,255,55,.62)}
.protocol-alert.demo{border-color:rgba(200,255,55,.19);background:rgba(200,255,55,.045)}
.protocol-alert.demo strong{color:var(--rh-lime)}
.trade-shell{border-radius:30px;border-color:rgba(255,255,255,.12);background:#090a0e;box-shadow:var(--shadow),0 0 0 1px rgba(200,255,55,.02) inset}
.trade-shell::before{left:0;right:0;height:2px;background:linear-gradient(90deg,#e0b85a,var(--red),var(--rh-lime),#7695d9);opacity:.9}
.trade-shell::after{background:rgba(0,200,5,.07)}
.trade-grid{grid-template-columns:minmax(500px,.9fr) minmax(660px,1.1fr);min-height:700px}
.trade-panel{padding:32px;border-right-color:rgba(255,255,255,.08);background:linear-gradient(180deg,#111319,#0b0c10)}
.tabs{background:#090a0d}
.tab{font-family:var(--sans);font-weight:760}
.tab.active{background:var(--rh-lime);color:#061007}
.balance b{color:var(--rh-lime)}
.asset-box{min-height:122px;border-color:rgba(255,255,255,.11);border-radius:18px;background:linear-gradient(145deg,#171920,#0f1015);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.asset-box:focus-within{border-color:rgba(200,255,55,.42);box-shadow:0 0 0 4px rgba(200,255,55,.055)}
.asset-value input{font-size:34px;font-weight:730}
.token-pill{height:40px;border-radius:12px;background:#090a0d}
.swap-arrow{background:var(--rh-lime);color:#071008;border-color:#0e0f14;box-shadow:0 12px 34px rgba(0,0,0,.28)}
.trade-meta{border-color:rgba(255,255,255,.09);background:rgba(255,255,255,.025)}
.odds-segment.mid{background:var(--red)}
.odds-segment.rare{background:#7695d9}
.odds-segment.jackpot{background:#e0b85a}
.primary-btn{background:var(--rh-lime);color:#061007;border-color:rgba(200,255,55,.9);box-shadow:0 16px 38px rgba(100,145,0,.18);font-family:var(--sans);font-weight:850}
.primary-btn:hover{box-shadow:0 20px 48px rgba(100,145,0,.25),0 0 34px rgba(200,255,55,.1)}

.rail-panel{background:radial-gradient(circle at 50% 27%,rgba(255,53,95,.08),transparent 36%),linear-gradient(180deg,#0d0e13,#07080b)}
.rail-head{min-height:116px;background:linear-gradient(180deg,rgba(255,255,255,.018),transparent)}
.rail-status::before{background:var(--rh-lime);box-shadow:0 0 13px rgba(200,255,55,.8)}
.demo-btn{position:relative;z-index:20;color:#071008;border-color:var(--rh-lime);background:var(--rh-lime);box-shadow:0 0 28px rgba(200,255,55,.12);pointer-events:auto}
.demo-btn:hover{background:#d5ff68;border-color:#d5ff68}
.reel-stage{height:350px;background:linear-gradient(180deg,#08090d,#11131a 52%,#07080b)}
.reel-track-lines{background:linear-gradient(90deg,transparent,rgba(200,255,55,.04),transparent),repeating-linear-gradient(0deg,transparent 0 31px,rgba(255,255,255,.018) 32px)}
.ticket{border-color:rgba(255,255,255,.14)}
.ticket.floor{--tc1:#3b3e48;--tc2:#1e2028}.ticket.neutral{--tc1:#747985;--tc2:#353842}.ticket.low{--tc1:#671d32;--tc2:#39111d}.ticket.mid{--tc1:#a02a49;--tc2:#571528}.ticket.rare{--tc1:#53688f;--tc2:#293551}.ticket.jackpot{--tc1:#9c8136;--tc2:#4d3d17}
.pointer{background:linear-gradient(transparent 0,var(--rh-lime) 18%,#fff 50%,var(--rh-lime) 82%,transparent);box-shadow:0 0 16px rgba(200,255,55,.9),0 0 42px rgba(0,200,5,.34)}
.pointer::before,.pointer::after{background:#f8ffe8;border-color:var(--rh-lime);box-shadow:0 0 18px rgba(200,255,55,.9)}
.pointer-halo{background:radial-gradient(circle,rgba(200,255,55,.095),transparent 70%)}
.history-chip.win{color:var(--rh-lime);border-color:rgba(200,255,55,.22);background:rgba(200,255,55,.045)}

.empty-box,.ticket-card,.jackpot-card,.data-card,.reserve-table,.docs-nav{border-color:rgba(255,255,255,.095);background:linear-gradient(145deg,#12141a,#090a0e)}
.empty-icon{color:var(--rh-lime);border-color:rgba(200,255,55,.15);background:rgba(200,255,55,.045)}
.jackpot-card:first-of-type{background:linear-gradient(145deg,#17150f,#0b0a08)}
.big-number{color:#f1c962}
.progress span{background:linear-gradient(90deg,var(--red),#e0b85a,var(--rh-lime))}
.live-badge{border-color:rgba(0,200,5,.22);background:rgba(0,200,5,.06);color:var(--rh-lime)}
.live-badge::before{background:var(--rh-lime);box-shadow:0 0 10px rgba(200,255,55,.74)}
.page-head{border-bottom-color:rgba(255,255,255,.09)}
.page-head h1{font-size:clamp(54px,6vw,92px);font-weight:790}
.page-head p{max-width:860px;font-size:17px;color:#969aa4}
.data-card:first-child{border-color:rgba(0,200,5,.18);background:linear-gradient(145deg,#102014,#090d0a)}
.docs-nav button{font-family:var(--sans);font-weight:680}
.docs-nav button.active{color:#071008;background:var(--rh-lime)}
.code{border-color:rgba(200,255,55,.12);background:#080c09;color:#b8d5bb}
.footer{border-top-color:rgba(255,255,255,.075)}

.terminal-chrome{border-bottom-color:rgba(255,255,255,.075);background:linear-gradient(90deg,rgba(255,53,95,.06),rgba(0,200,5,.055),rgba(118,149,217,.05))}
.terminal-chrome span:first-child i{background:var(--rh-lime);box-shadow:0 0 10px rgba(200,255,55,.7)}

@media(max-width:1040px){
  .hero{padding:52px;grid-template-columns:1fr}.hero-visual{min-height:480px}
  .trade-grid{grid-template-columns:1fr}.trade-panel{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
}
@media(max-width:900px){
  .mobile-nav{border-color:rgba(255,255,255,.12);background:rgba(7,8,11,.98)}
  .mobile-nav a.active{color:#071008;background:var(--rh-lime)}
}
@media(max-width:620px){
  .main,.trade-main,body[data-route="home"] .main{width:calc(100% - 20px)}
  .header-inner{width:calc(100% - 22px)}
  .hero{margin-top:10px;padding:34px 22px;border-radius:26px}.hero h1{font-size:52px}.hero p{font-size:15px}.hero-visual{min-height:360px}.logo-orbit{width:310px}
  .metrics{border-radius:20px}.trade-shell{border-radius:22px}.trade-panel{padding:16px}.reel-stage{height:235px}.section-title{font-size:28px}
}

/* V5.2 interaction + reserve hardening */
.primary-btn,.ghost-btn{display:inline-flex;align-items:center;justify-content:center;line-height:1}
.hero-actions{align-items:center;flex-wrap:wrap}
.hero-actions .primary-btn,.hero-actions .ghost-btn{height:54px;min-height:54px;margin:0;padding:0 26px;border-radius:14px;white-space:nowrap}
.hero-actions .primary-btn{width:auto;min-width:190px}
.hero-actions .ghost-btn{width:auto;min-width:172px}
.hero-actions .primary-btn::before{border-radius:13px}
.demo-btn:disabled{opacity:.72;cursor:wait;filter:saturate(.75)}

.live-badge.muted{color:#9499a2;border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.035)}
.reserve-main{padding-bottom:90px}
.reserve-page-head{max-width:980px}
.reserve-prelaunch{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;margin-top:28px;padding:34px;border:1px solid rgba(255,255,255,.1);border-radius:26px;background:
  radial-gradient(circle at 100% 0,rgba(0,200,5,.09),transparent 34%),
  linear-gradient(145deg,#111319,#090a0e);box-shadow:0 26px 80px rgba(0,0,0,.34)}
.reserve-prelaunch-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:12px}
.reserve-prelaunch-copy h2{margin:20px 0 12px;font-size:clamp(30px,3.5vw,54px);line-height:.98;letter-spacing:-.045em}
.reserve-prelaunch-copy p{max-width:660px;margin:0;color:#9ca0a9;font-size:15px;line-height:1.7}
.reserve-empty-ledger{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.reserve-empty-ledger>div{min-height:132px;padding:20px;border:1px solid rgba(255,255,255,.085);border-radius:18px;background:rgba(5,6,9,.58);display:flex;flex-direction:column;justify-content:space-between}
.reserve-empty-ledger span{font-family:var(--mono);font-size:8px;font-weight:800;letter-spacing:.14em;color:#737882}
.reserve-empty-ledger strong{font-size:42px;font-weight:760;color:#dadddf}
.reserve-data-grid{grid-template-columns:repeat(4,1fr);margin-top:28px}
.reserve-mechanism{margin-top:88px}
.reserve-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.reserve-flow article{position:relative;min-height:230px;padding:28px;border:1px solid rgba(255,255,255,.09);border-radius:20px;background:linear-gradient(145deg,#111319,#090a0e);overflow:hidden}
.reserve-flow article::after{content:"";position:absolute;inset:auto -30% -60% 20%;height:170px;background:radial-gradient(circle,rgba(0,200,5,.12),transparent 68%);pointer-events:none}
.reserve-flow article>span{font-family:var(--mono);font-size:10px;font-weight:900;letter-spacing:.14em;color:var(--rh-lime)}
.reserve-flow h3{margin:42px 0 12px;font-size:22px;letter-spacing:-.025em}
.reserve-flow p{margin:0;color:#8f949d;line-height:1.65}
.reserve-equation{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:12px;padding:22px 26px;border:1px solid rgba(200,255,55,.18);border-radius:18px;background:rgba(200,255,55,.035)}
.reserve-equation span{font-family:var(--mono);font-size:8px;font-weight:900;letter-spacing:.17em;color:#838994}
.reserve-equation strong{font-family:var(--mono);font-size:13px;letter-spacing:.08em;color:var(--rh-lime);text-align:right}
.reserve-live-table .reserve-row span:last-child{color:#8f949d;font-family:var(--mono);font-size:8px;letter-spacing:.08em}
.route-recovery{width:auto;min-width:200px;padding:0 24px}

@media (max-width:1000px){
  .reserve-prelaunch{grid-template-columns:1fr}
  .reserve-data-grid{grid-template-columns:1fr 1fr}
  .reserve-flow{grid-template-columns:1fr}
  .reserve-flow article{min-height:190px}
}
@media (max-width:620px){
  .hero-actions{align-items:stretch}
  .hero-actions .primary-btn,.hero-actions .ghost-btn{width:100%;min-width:0}
  .reserve-prelaunch{padding:18px;border-radius:20px}
  .reserve-empty-ledger{grid-template-columns:1fr}
  .reserve-empty-ledger>div{min-height:100px}
  .reserve-data-grid{grid-template-columns:1fr}
  .reserve-equation{align-items:flex-start;flex-direction:column}
  .reserve-equation strong{text-align:left;line-height:1.45}
}
.docs-metric-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:22px 0 30px}
.docs-metric-row span{padding:16px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.025);font-family:var(--mono);font-size:8px;line-height:1.5;color:#818690;text-transform:uppercase;letter-spacing:.08em}
.docs-metric-row b{display:block;margin-bottom:6px;font-size:20px;color:#f1f2ee;letter-spacing:-.03em}
@media (max-width:760px){.docs-metric-row{grid-template-columns:1fr 1fr}}