/* ============================================================================
   MOON.lite — 1of1 Design System · EXTENSIONS
   Additive components that the launchpad pages need but the base comp did not
   ship: custom glassy dropdowns, tables, stat tiles, tabs, progress, toast,
   pager, form inputs, secondary/connect buttons, section variants, in-flow nav.
   Requires ds_1of1_tokens.css + ds_1of1_components.css. 1of1 tokens only.
   ============================================================================ */

/* ---- in-flow page shell (nav sits at top of container, no fixed pill) ---- */
.page{max-width:var(--container);margin:0 auto;padding:0 32px;position:relative;z-index:3;}
.stage{padding-top:8px;padding-bottom:96px;}

/* ---- nav: badge + connect button in the 1of1 idiom ---- */
.nav .nb-badge{display:inline-flex;align-items:center;height:18px;padding:0 7px;margin-left:6px;
  border-radius:var(--r-pill);background:linear-gradient(180deg,var(--ice-300),var(--ice-500));
  color:#0a1830;font:700 11px var(--font-ui);letter-spacing:.02em;
  box-shadow:0 2px 10px -2px var(--glow-ice);vertical-align:middle;}
.btn-connect{display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 20px;border-radius:var(--r-pill);
  background:linear-gradient(180deg,rgba(16,26,44,.7),rgba(8,14,26,.7));border:1px solid var(--border-chip);
  color:var(--text-primary);font:600 15px var(--font-ui);cursor:pointer;backdrop-filter:blur(var(--blur-glass));
  transition:border var(--dur),background var(--dur),transform var(--dur-fast);}
.btn-connect:hover{border-color:rgba(150,180,235,.30);transform:translateY(-1px);}

/* ---- secondary / ghost buttons ---- */
.btn-ghost{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:var(--r-pill);
  background:var(--surface-inactive);border:1px solid var(--border-pill);color:var(--text-nav);
  font:500 15px var(--font-ui);cursor:pointer;transition:background var(--dur),border var(--dur),color var(--dur);}
.btn-ghost:hover{background:rgba(255,255,255,.04);color:#cdd9ee;border-color:var(--border-chip);}
.btn-ghost svg{width:16px;height:16px;color:var(--ice-300);}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:52px;padding:0 26px;
  border:0;border-radius:var(--r-btn);cursor:pointer;font:600 16px var(--font-ui);color:var(--create-ink);
  background:linear-gradient(135deg,var(--create-hi) 0%,var(--create-mid) 52%,var(--create-lo) 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 10px 30px -10px var(--glow-cyan),0 0 34px -8px rgba(150,190,255,.5);
  transition:transform var(--dur-fast),box-shadow var(--dur),filter var(--dur);}
.btn-primary:hover{transform:translateY(-1px);filter:brightness(1.03);}
.btn-primary:disabled{opacity:.5;cursor:default;transform:none;filter:none;}

/* ---- section panel variants ---- */
.section{position:relative;border-radius:var(--r-panel);padding:28px 30px 30px;margin-bottom:24px;
  background:linear-gradient(180deg,rgba(10,19,34,.62),rgba(6,12,24,.62));border:1px solid var(--border-panel);
  backdrop-filter:blur(calc(var(--blur-glass) + 4px));box-shadow:var(--shadow-panel),inset 0 1px 0 rgba(180,205,255,.05);}
.section--grad{border-color:rgba(126,166,255,.30);
  box-shadow:0 0 0 1px rgba(94,139,239,.06),var(--shadow-panel),0 0 60px -20px var(--glow-ice) inset;}
.sec-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.sec-head h2{margin:0;font:700 28px/1 var(--font-ui);letter-spacing:-.02em;color:var(--text-primary);}
.sec-sub{margin:10px 0 0;color:var(--text-secondary);font:400 15px/1.4 var(--font-ui);}
.sec-head .spacer{flex:1;}

/* ---- glassy custom dropdown (replaces native <select> / old menus) ---- */
.dd{position:relative;display:inline-block;}
.dd__btn{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 14px 0 16px;border-radius:var(--r-pill);
  background:var(--surface-inactive);border:1px solid var(--border-pill);color:var(--text-nav);
  font:500 15px var(--font-ui);cursor:pointer;white-space:nowrap;
  transition:background var(--dur),border var(--dur),color var(--dur);}
.dd__btn:hover,.dd.is-open .dd__btn{color:var(--text-primary);border-color:var(--border-chip);background:rgba(255,255,255,.04);}
.dd__btn .caret{width:14px;height:14px;opacity:.7;transition:transform var(--dur);}
.dd.is-open .dd__btn .caret{transform:rotate(180deg);}
.dd__menu{position:absolute;top:calc(100% + 8px);left:0;min-width:100%;z-index:40;padding:6px;
  border-radius:14px;background:linear-gradient(180deg,rgba(13,23,40,.98),rgba(8,14,27,.98));
  border:1px solid var(--border-chip);backdrop-filter:blur(calc(var(--blur-glass) + 6px));
  box-shadow:0 24px 60px -20px rgba(0,6,20,.9),0 0 0 1px rgba(94,139,239,.08),inset 0 1px 0 rgba(180,205,255,.06);
  opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity var(--dur),transform var(--dur);}
.dd.is-open .dd__menu{opacity:1;transform:translateY(0);pointer-events:auto;}
.dd__opt{display:flex;align-items:center;gap:9px;height:38px;padding:0 12px;border-radius:10px;cursor:pointer;
  color:var(--text-nav);font:500 14.5px var(--font-ui);white-space:nowrap;transition:background var(--dur),color var(--dur);}
.dd__opt:hover{background:rgba(255,255,255,.05);color:var(--text-primary);}
.dd__opt.is-sel{color:var(--text-primary);background:linear-gradient(180deg,var(--pill-active-top),var(--pill-active-bot));
  border:1px solid var(--pill-active-border);}

/* ---- segmented tabs ---- */
.seg{display:inline-flex;gap:3px;padding:4px;border-radius:14px;border:1px solid var(--border-pill);
  background:var(--surface-inactive);}
.seg__tab{cursor:pointer;border:0;background:none;color:var(--text-nav);font:500 14px var(--font-ui);
  padding:7px 14px;border-radius:10px;white-space:nowrap;transition:background var(--dur),color var(--dur);}
.seg__tab:hover{color:var(--text-primary);}
.seg__tab.is-active{color:var(--text-primary);
  background:linear-gradient(180deg,var(--pill-active-top),var(--pill-active-bot));
  border:1px solid var(--pill-active-border);
  box-shadow:inset 0 1px 0 rgba(180,205,255,.18);}

/* ---- inputs / textareas / labels (forms) ---- */
.field{display:block;margin-bottom:18px;}
.field__label{display:block;margin:0 0 8px;color:var(--text-secondary);font:600 14px var(--font-ui);letter-spacing:.01em;}
.input,.textarea,select.input{width:100%;background:linear-gradient(180deg,rgba(11,20,36,.72),rgba(7,13,25,.72));
  border:1px solid var(--border-chip);border-radius:14px;color:var(--text-primary);
  font:500 15.5px var(--font-ui);padding:14px 16px;outline:0;backdrop-filter:blur(var(--blur-glass));
  transition:border var(--dur),box-shadow var(--dur);}
.input::placeholder,.textarea::placeholder{color:var(--text-placeholder);}
.input:focus,.textarea:focus,select.input:focus{border-color:var(--ice-500);
  box-shadow:0 0 0 3px rgba(94,139,239,.18),0 0 26px -6px var(--glow-ice);}
.textarea{min-height:110px;resize:vertical;line-height:1.5;}

/* ---- stat tiles ---- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;}
.stat{border-radius:var(--r-card);padding:16px 18px;
  background:linear-gradient(180deg,var(--surface-card-top),var(--surface-card-bot));
  border:1px solid var(--border-card);box-shadow:var(--shadow-card);}
.stat__k{color:var(--text-muted);font:600 12px var(--font-ui);letter-spacing:.06em;text-transform:uppercase;}
.stat__v{margin-top:7px;color:var(--text-primary);font:700 24px/1 var(--font-ui);letter-spacing:-.01em;}
.stat__v.up{color:#7fe9b6;} .stat__v.down{color:#ff8f8f;}
.stat__sub{margin-top:5px;color:var(--text-muted);font:500 13px var(--font-ui);}

/* ---- tables ---- */
.tbl{width:100%;border-collapse:collapse;font:500 14px var(--font-ui);}
.tbl th{text-align:left;color:var(--text-muted);font:600 12px var(--font-ui);letter-spacing:.06em;
  text-transform:uppercase;padding:0 14px 12px;border-bottom:1px solid var(--border-hair);}
.tbl td{padding:12px 14px;border-bottom:1px solid var(--border-hair);color:var(--text-primary);}
.tbl tr:last-child td{border-bottom:0;}
.tbl tr:hover td{background:rgba(255,255,255,.02);}
.tbl .muted{color:var(--text-muted);}
.tbl .up{color:#7fe9b6;} .tbl .down{color:#ff8f8f;}

/* ---- progress bar (bonding curve) ---- */
.prog{margin-top:12px;display:flex;align-items:center;gap:10px;}
.prog .bar{flex:1;height:6px;border-radius:var(--r-pill);background:rgba(255,255,255,.06);overflow:hidden;}
.prog .bar i{display:block;height:100%;border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--ice-600),var(--ice-300));transition:width .6s var(--ease-out);
  box-shadow:0 0 12px -2px var(--glow-ice);}
.prog .pct{min-width:44px;text-align:right;color:var(--text-muted);font:600 12px var(--font-ui);}

/* ---- secondary badges on cards (market / og) ---- */
.tag--right{left:auto;right:12px;}
.tag--v4{background:rgba(48,26,58,.8);border-color:rgba(233,150,222,.34);color:#f3c9ee;}
.tag--og{background:rgba(46,38,20,.8);border-color:rgba(245,207,107,.34);color:#f5cf6b;}

/* ---- toast ---- */
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(20px);z-index:80;
  background:linear-gradient(180deg,rgba(13,23,40,.98),rgba(8,14,27,.98));border:1px solid var(--border-chip);
  border-radius:14px;padding:13px 20px;color:var(--text-primary);font:500 14.5px var(--font-ui);
  box-shadow:0 24px 60px -20px rgba(0,6,20,.9);opacity:0;pointer-events:none;transition:opacity var(--dur),transform var(--dur);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ---- pager ---- */
.pager{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:24px;}
.pager button{cursor:pointer;font:600 14px var(--font-ui);color:var(--text-nav);border:1px solid var(--border-pill);
  background:var(--surface-inactive);min-width:40px;height:40px;padding:0 12px;border-radius:12px;
  transition:background var(--dur),border var(--dur),color var(--dur);}
.pager button:hover:not(:disabled){color:var(--text-primary);border-color:var(--border-chip);}
.pager button.on{color:var(--text-primary);
  background:linear-gradient(180deg,var(--pill-active-top),var(--pill-active-bot));border-color:var(--pill-active-border);}
.pager button:disabled{opacity:.35;cursor:default;}
.pager .ell{color:var(--text-muted);padding:0 4px;}

/* ---- empty state ---- */
.empty{grid-column:1/-1;text-align:center;color:var(--text-muted);padding:44px 0;font:500 15px var(--font-ui);}

/* live market-cap flash on card value */
.card__mc b.up{color:#7fe9b6;} .card__mc b.down{color:#ff8f8f;}
.card.upd{animation:cardflash .8s var(--ease-out);}
@keyframes cardflash{0%{box-shadow:0 0 0 1px rgba(158,190,255,.6),0 0 28px -4px var(--glow-ice);}100%{box-shadow:var(--shadow-card);}}

/* MOONLAUNCH-STICKYNAV (2026-09-14): the header stays reachable while scrolling -
   sticky at the top of the page container, translucent glass with enough opacity
   to stay readable over cards/images (Connect Wallet is always one click away). */
.page > .nav{position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg,rgba(4,8,18,.86),rgba(4,8,18,.74));
  -webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15);
  border-bottom:1px solid rgba(160,192,242,.10);border-radius:0 0 22px 22px;
  box-shadow:0 12px 34px -22px rgba(0,6,20,.9);}



/* MOONLAUNCH-NOARC (2026-09-14): Built on Arc chip hidden (markup kept) */
.chip--arc{display:none !important}

/* MOONLAUNCH-BRAVE: a nav link is one unbreakable unit (label + badge), never shrinks, never wraps */
.nav__links{flex-wrap:nowrap;}
.nav__link{display:inline-flex;align-items:center;white-space:nowrap;flex:0 0 auto;}
.nav .nb-badge{flex:0 0 auto;}

/* MOONLAUNCH-NODRAG: decorative images and card links are not drag sources */
img,a,.card,.brand,.nav__link{-webkit-user-drag:none;user-drag:none;}
.card,.nav,.tools,.sec-head{-webkit-user-select:none;user-select:none;}

/* MOONLAUNCH-NOCHAINPILL (user, 2026-09-14): no network chip next to the account (neither testnet nor mainnet) */
#chainPill{display:none !important}