/* ============================================================
   create.css — NEYN-12118 "Creation flow" (create → success → deployments)
   Rebuilt on the NEYN-12112 design system:
   LIGHT theme = the Figma-derived flat grey ladder (Inter UI + IBM Plex Mono
     numerics, #000/#333/#666/#888/#999/#DDD/#EEE, green #22C55E, red #EF4444,
     1080px column, chips h21 r5).
   DARK theme = the LIVE clanker.world dark system (#030303 canvas, white-alpha
     ladder, border-only surfaces, green #05df72 / red #ff6568 / amber #fcbb00,
     teal #00d3bd reserved for the trade CTA signature — NOT used here).
   Theme tokens + chrome/topnav/footer/field blocks are ported from
   12112/final.css so the create surface reads as the same site as the
   token-detail spread. The lab chrome bar stays fixed-dark in both themes.
   ============================================================ */

body[data-theme="light"]{
  --bg:#ffffff; --pop:#ffffff;
  --ink:#000000; --t333:#333333; --t666:#666666; --t888:#888888; --t999:#999999; --t9ca:#9CA3AF;
  --chipbg:#DDDDDD; --line:#EEEEEE; --navfill:#F5F5F5; --barfill:#999999;
  --pos:#22C55E; --pos-bg:#E8F5E9;
  --neg:#EF4444; --neg-bg:#FFEBEE;
  --warnc:#DD7400; --warn-bg:#FFF3E0;
  --acc:#0d9488; --acc-bg:rgba(0,211,189,.12); --acc-br:rgba(0,211,189,.28);
  --cta:#000000; --cta-ink:#ffffff;
  --chartline:#DDDDDD; --chartline-hot:#999999;
  --wm:#DDDDDD;
  --scrim:rgba(0,0,0,.30);
  --shadow:rgba(0,0,0,.12);
}
body[data-theme="dark"]{
  --bg:#030303; --pop:#111111;
  --ink:#ffffff; --t333:rgba(255,255,255,.85); --t666:rgba(255,255,255,.62); --t888:rgba(255,255,255,.48);
  --t999:rgba(255,255,255,.38); --t9ca:rgba(255,255,255,.45);
  --chipbg:rgba(255,255,255,.12); --line:rgba(255,255,255,.10); --navfill:rgba(255,255,255,.08);
  --barfill:rgba(255,255,255,.35);
  --pos:#05df72; --pos-bg:rgba(5,223,114,.13);
  --neg:#ff6568; --neg-bg:rgba(255,101,104,.13);
  --warnc:#fcbb00; --warn-bg:rgba(252,187,0,.12);
  --acc:#00d3bd; --acc-bg:rgba(0,211,189,.10); --acc-br:rgba(0,211,189,.22);
  --cta:#ffffff; --cta-ink:#030303;
  --chartline:rgba(255,255,255,.14); --chartline-hot:rgba(255,255,255,.42);
  --wm:rgba(255,255,255,.06);
  --scrim:rgba(0,0,0,.60);
  --shadow:rgba(0,0,0,.5);
}
:root{
  --font:'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --maxw:920px;   /* narrowed ~15% (was 1080) so the hanging ToC sits expanded at more widths */
  --rail:348px; --colgap:48px;
  --navh:67px; --chromeh:0px;   /* --navh = full sticky stack (chrome+topnav); JS keeps both live */
  --pgpad:max(24px, calc((100% - var(--maxw))/2));
  /* when the ToC is expanded it hangs ~200px left of the column; shifting the
     whole content stack right by half that footprint re-centres the composition
     (ToC + body + rail) in the viewport. 0 unless create.html at ≥1320px. */
  --tocshift:0px;
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
[hidden]{ display:none !important; }
html{ scroll-behavior:smooth; }
body{ font-family:var(--font); background:var(--bg); color:var(--ink);
  font-size:13px; line-height:1.21; font-weight:400;
  -webkit-font-smoothing:antialiased; transition:background .15s ease, color .15s ease; }
a{ color:inherit; text-decoration:none; cursor:pointer; }
button{ font-family:inherit; cursor:pointer; }
input,textarea,select{ font-family:inherit; }
.mono{ font-family:var(--mono); }
.pos{ color:var(--pos); } .neg{ color:var(--neg); } .warn{ color:var(--warnc); }
.t888{ color:var(--t888); }

/* the universal Figma chip: h21 · pad 3/6 · r5 · 12/500 */
.chip,.seclabel,.mhbadge,.fclank,.sharebtn{ display:inline-flex; align-items:center; gap:5px;
  font-size:12px; font-weight:500; line-height:15px; border-radius:5px; padding:3px 6px; }

/* ---------- tooltips ---------- */
[data-tip]{ position:relative; }
[data-tip]:hover::after{ content:attr(data-tip); position:absolute; bottom:calc(100% + 7px); left:50%;
  transform:translateX(-50%); z-index:90; width:max-content; max-width:250px; text-align:left;
  font-size:11px; font-weight:500; line-height:1.45; color:var(--cta-ink); background:var(--cta);
  border-radius:6px; padding:7px 10px; pointer-events:none; white-space:normal; }

/* ---------- RED LAB CHROME (fixed dark, both themes — scaffolding) ---------- */
.chrome{ --border:#333; --text-secondary:#9a9a9a;   /* read by chrome-nav.js */
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  padding:8px 16px; background:#141414; color:#eee; }
.chrome-left{ display:flex; align-items:center; gap:9px; }
.chrome .stage-badge{ font-size:11px; font-weight:700; letter-spacing:.06em;
  color:#141414; background:#eee; border-radius:5px; padding:3px 8px; }
.chrome .artifact-name{ font-size:12px; font-weight:600; color:#eee; white-space:nowrap; }
.chrome-center{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.axis{ display:flex; align-items:center; gap:7px; }
.axis-lbl{ font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:#8a8a8a; }
.seg{ display:inline-flex; border:1px solid #3a3a3a; border-radius:7px; overflow:hidden; }
.seg button{ font-size:12px; font-weight:600; color:#9a9a9a; background:transparent;
  border:none; border-left:1px solid #3a3a3a; padding:5px 11px; white-space:nowrap; }
.seg button:first-child{ border-left:none; }
.seg button.on{ background:#eee; color:#141414; }
@media (min-width:901px){
  .chrome{ position:sticky; top:0; z-index:62; }
}
/* mobile: the chrome wraps + the artifact name may break lines — nothing in the
   lab scaffolding is allowed to force horizontal page scroll (verify finding) */
@media (max-width:900px){
  .chrome-left{ flex-wrap:wrap; min-width:0; max-width:100%; }
  .chrome .artifact-name{ white-space:normal; }
}

/* ---------- TOPNAV (h67; search filled; wallet pill / connect right) ---------- */
.topnav{ display:flex; align-items:center; gap:16px;
  position:sticky; top:var(--chromeh); z-index:60; background:var(--bg);
  padding:15px calc(var(--pgpad) - var(--tocshift)) 15px calc(var(--pgpad) + var(--tocshift)); }
.brand{ display:inline-flex; align-items:center; gap:9px; font-family:var(--mono);
  font-size:21px; font-weight:500; letter-spacing:.01em; color:var(--ink); }
.bars{ display:inline-flex; align-items:flex-end; gap:2.5px; height:14px; }
.bars i{ width:3px; background:var(--t888); display:block; }
.bars i:nth-child(1){ height:40%; } .bars i:nth-child(2){ height:70%; } .bars i:nth-child(3){ height:100%; }
.search{ flex:0 1 384px; min-width:0; height:37px; border-radius:5px; background:var(--navfill);
  display:flex; align-items:center; gap:8px; padding:0 10px; color:var(--t888); font-size:12px;
  position:relative; }
.search:focus-within{ box-shadow:0 0 0 4px var(--acc-bg); }
.search .mag{ width:12px; height:12px; border:1.5px solid var(--t888); border-radius:50%; position:relative; flex-shrink:0; }
.search .mag::after{ content:""; position:absolute; right:-3px; bottom:-2px; width:5px; height:1.5px; background:var(--t888); transform:rotate(45deg); }
.search input.ph{ flex:1; min-width:0; border:none; outline:none; background:none; color:var(--ink); font-size:12px; text-overflow:ellipsis; }
.search input.ph::placeholder{ color:var(--t888); }
.search .slash{ font-family:var(--mono); font-size:12px; color:var(--t888); }
.navspace{ flex:1; }
.navlink{ font-size:13px; font-weight:500; color:var(--t666); padding:8px 10px; border-radius:5px; white-space:nowrap; }
.navlink:hover{ color:var(--ink); background:var(--navfill); }
.navlink.on{ color:var(--ink); font-weight:600; }
/* wallet pill (connected) + connect button (disconnected) */
.walletpill{ position:relative; display:inline-flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:12px; color:var(--ink);
  border:1px solid var(--line); border-radius:5px; padding:9px 12px; cursor:pointer; white-space:nowrap; }
.walletpill:hover{ border-color:var(--t888); }
.walletpill .car{ font-size:10px; color:var(--t666); font-family:var(--font); }
.navconnect{ font-size:13px; font-weight:600; color:var(--cta-ink); background:var(--cta);
  border:none; border-radius:5px; padding:10px 16px; white-space:nowrap; }
body[data-wallet="connected"]    [data-when-wallet="disconnected"]{ display:none !important; }
body[data-wallet="disconnected"] [data-when-wallet="connected"]{ display:none !important; }

/* wallet dropdown — the ratified nav structure (Wallets · Deployments · Social ·
   Navigate · Tools · Settings · Disconnect) */
.walletdd{ position:absolute; right:0; top:calc(100% + 8px); min-width:264px; z-index:80;
  background:var(--pop); border:1px solid var(--line); border-radius:8px; overflow:hidden;
  box-shadow:0 10px 30px var(--shadow); text-align:left; cursor:default; font-family:var(--font); }
.wd-label{ font-size:10px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--t999); padding:10px 14px 4px; }
.wd-item{ display:flex; align-items:center; gap:8px; padding:8px 14px; font-size:12.5px;
  color:var(--ink); cursor:pointer; }
.wd-item:hover{ background:var(--navfill); }
.wd-item .wd-k{ margin-left:auto; font-size:11px; color:var(--t999); }
.wd-item.strong{ font-weight:600; }
.wd-item.danger{ color:var(--neg); }
.wd-wallet{ display:flex; align-items:center; gap:8px; padding:7px 14px;
  font-family:var(--mono); font-size:12px; color:var(--t666); }
.wd-wallet .wd-chain{ font-size:10px; font-weight:600; color:var(--t888); background:var(--chipbg);
  border-radius:3px; padding:1px 5px; font-family:var(--font); }
.wd-wallet .wd-copy{ margin-left:auto; }
.wd-div{ height:1px; background:var(--line); margin:5px 0; }
.copy{ width:11px; height:11px; border:1px solid var(--t888); border-radius:2px; position:relative; flex-shrink:0; cursor:pointer; display:inline-block; }
.copy::after{ content:""; position:absolute; left:-3px; top:-3px; width:8px; height:8px; border:1px solid var(--t888); border-radius:2px; background:var(--bg); }

/* ---------- PAGE GRID (1080 = form 684 + 48 + rail 348) ---------- */
.page{ display:grid; grid-template-columns:minmax(0,1fr) var(--rail); align-items:start;
  column-gap:var(--colgap); padding:18px calc(var(--pgpad) - var(--tocshift)) 8px calc(var(--pgpad) + var(--tocshift)); }
.col-form{ min-width:0; }
.col-rail{ min-width:0; align-self:stretch; }   /* full-height column so the sticky preview travels */
.pagehead{ padding:8px 0 20px; }
.ptitle{ font-size:24px; font-weight:600; line-height:1.21; color:var(--ink); letter-spacing:-.01em; }
.psub{ font-size:13px; color:var(--t666); margin-top:7px; line-height:1.5; }

/* ---------- SECTION LANGUAGE (ported: seclabel chip + kv rows) ---------- */
.seclabel{ color:var(--cta-ink); background:var(--cta); }
.tag{ font-size:10px; font-weight:400; font-family:var(--mono); letter-spacing:.02em;
  color:var(--t888); border:1px solid var(--t888); border-radius:3px; padding:1px 5px; }
.tag.prop{ color:var(--warnc); border-color:var(--warnc); }
.kv{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:6px 0; min-height:28px; }
.kv .k{ font-size:13px; color:var(--t666); font-weight:400; }
.kv .v{ font-size:13px; font-weight:500; color:var(--ink); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.kv .v.mono{ font-family:var(--mono); font-weight:400; font-size:12.5px; }
.vtag{ font-size:11px; font-weight:500; font-family:var(--mono); color:var(--pos); background:var(--pos-bg);
  border-radius:4px; padding:2px 6px; margin-right:6px; line-height:14px; }
.note{ font-size:13px; color:var(--t666); font-weight:400; line-height:1.5; }
.dashedbox{ border:1px dashed var(--t888); border-radius:8px; padding:14px; }
.estitle{ font-size:13px; font-weight:600; color:var(--ink); margin:2px 0 6px; }
.btn-primary{ width:100%; text-align:center; font-size:13px; font-weight:600;
  color:var(--cta-ink); background:var(--cta); border:none; border-radius:5px; padding:11px; cursor:pointer; }
.btn-ghost{ font-size:13px; font-weight:500; color:var(--t666); background:var(--bg);
  border:1px solid var(--line); border-radius:5px; padding:10px 16px; cursor:pointer; }
.btn-ghost:hover{ color:var(--ink); border-color:var(--t888); }
.mhbadge{ font-weight:400; color:var(--t888); border:1px solid var(--t888); cursor:default; }
.mhbadge .chk{ font-size:12px; }
.mhbadge.ok{ color:var(--pos); border-color:var(--pos); }

/* ---------- FORM SECTIONS ---------- */
.fsec{ padding:24px 0; border-bottom:1px solid var(--line); scroll-margin-top:calc(var(--navh) + 12px); }
.fsec:last-of-type{ border-bottom:none; }
.fshead{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.fshead .fsaux{ margin-left:auto; font-size:12px; font-weight:500; color:var(--t888); }
.fsnote{ font-size:12.5px; color:var(--t666); line-height:1.5; margin:-6px 0 14px; }
.frow{ display:grid; grid-template-columns:1fr 1fr; gap:0 20px; align-items:start; }
.fchoice{ margin-bottom:14px; }
.fsec > .fchoice:last-child{ margin-bottom:2px; }   /* only the section's last block drops its gap */
.fchoice .mf-flabel{ margin-bottom:6px; }
.finline{ display:flex; align-items:center; gap:10px; }
.finline .mf2-field{ margin-bottom:0; flex:0 0 96px; }
.finline .fsuffix{ font-size:12.5px; color:var(--t666); }

/* “add a tokenized agent” toggle bar */
.agentbar{ display:flex; align-items:center; gap:14px; padding:16px;
  border:1px dashed var(--t888); border-radius:8px; margin:2px 0 22px; }
.agentbar .ab-main{ min-width:0; flex:1; }
.agentbar .ab-title{ font-size:13px; font-weight:600; color:var(--ink); display:flex; align-items:center; gap:8px; }
.agentbar .ab-sub{ font-size:12.5px; color:var(--t666); margin-top:4px; line-height:1.5; }
.mtoggle{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; color:var(--t333); font-weight:600; cursor:pointer; user-select:none; }
.mtoggle .sw{ width:32px; height:18px; border-radius:999px; border:1px solid var(--t888); position:relative; flex-shrink:0; transition:background .15s ease; }
.mtoggle .sw::after{ content:""; position:absolute; top:2px; left:2px; width:12px; height:12px; border-radius:50%; background:var(--t888); transition:left .15s ease, right .15s ease; }
.mtoggle.on{ color:var(--ink); }
.mtoggle.on .sw{ background:var(--pos); border-color:var(--pos); }
.mtoggle.on .sw::after{ left:auto; right:2px; background:#fff; }

/* agent config section (hidden until the toggle is on) */
body:not([data-agent="on"]) .fsec.for-agent{ display:none; }

/* agent opt-in disabled on chains without the agent layer (e.g. Robinhood) */
.agentbar.disabled .mtoggle{ opacity:.4; pointer-events:none; }
.agentbar.disabled .ab-title{ color:var(--t666); }

/* ---------- HANGING SECTION INDEX (create page) ----------
   Floats in the left margin outside the 1080 column; the form layout is
   untouched. Full labels ≥1320px; compact dot-rail 1040–1319px (hover expands via
   Tip/Grow/Fly); on ≤1039px + phones a floating progress button opens the full
   list as a bottom sheet (the tap-equivalent of the hover-expand). States:
   ✓ done · amber = mandatory, incomplete · red = invalid · hollow = optional. */
.toc{ display:none; position:fixed; z-index:50;
  top:calc(var(--navh) + 30px);
  left:calc((100vw - var(--maxw))/2 + var(--tocshift) - 200px);
  width:176px; }
.titem{ display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:6px;
  font-size:12px; color:var(--t666); cursor:pointer; user-select:none; }
.titem:hover{ color:var(--ink); background:var(--navfill); }
.titem.active .tlabel{ color:var(--ink); font-weight:600; }
.titem .tlabel{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.titem .tmeta{ margin-left:auto; font-size:10px; font-family:var(--mono); color:var(--t999); white-space:nowrap; }
.titem[data-state="invalid"] .tmeta{ color:var(--neg); }
.titem[data-state="todo"] .tmeta{ color:var(--warnc); }
.tdot{ width:14px; height:14px; flex-shrink:0; display:grid; place-items:center; }
.tdot::before{ content:""; width:8px; height:8px; border-radius:50%; border:1.5px solid var(--t888); }
.titem[data-state="done"] .tdot::before{ content:"\2713"; width:auto; height:auto; border:none;
  border-radius:0; color:var(--pos); font-weight:700; font-size:11px; line-height:1; }
.titem[data-state="todo"] .tdot::before{ border:none; background:var(--warnc); }
.titem[data-state="invalid"] .tdot::before{ border:none; background:var(--neg); }
/* optional/off = hollow (default) · na = greyed out, not applicable on this chain */
.titem[data-state="na"]{ opacity:.4; }
.titem[data-state="na"] .tmeta, .titem[data-state="off"] .tmeta, .titem[data-state="opt"] .tmeta{ color:var(--t999); }
/* hover-mode toggle (lab scaffolding for the compact rail) + fly panel */
.tochead{ display:none; align-items:center; gap:6px; padding:0 0 8px 2px; }
.thlbl{ font-size:9px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--t999); }
.tocmodes{ display:inline-flex; border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.tocmodes button{ font-size:9px; font-weight:600; color:var(--t666); background:var(--bg);
  border:none; border-left:1px solid var(--line); padding:3px 6px; }
.tocmodes button:first-child{ border-left:none; }
.tocmodes button.on{ background:var(--cta); color:var(--cta-ink); }
.tocfly{ display:none; position:absolute; left:calc(100% + 10px); top:-6px; width:196px;
  background:var(--pop); border:1px solid var(--line); border-radius:10px; padding:8px;
  box-shadow:0 10px 30px var(--shadow); }
.tocfly::before{ content:""; position:absolute; left:-12px; top:0; width:12px; height:100%; }  /* hover bridge */

/* mobile floating progress button + backdrop (shown only on the mobile breakpoint) */
.tocfab{ display:none; }
.tocbackdrop{ display:none; }

@media (min-width:1320px){
  .toc{ display:block; }
  .titem[data-tip]:hover::after{ display:none; }   /* labels are visible — no tooltip */
  .tochead{ display:none; }                        /* modes only matter on the rail */
  /* re-centre the whole composition (ToC + body + rail); create page only, where
     the ToC actually occupies the left margin — half its 200px footprint. */
  body.has-toc{ --tocshift:100px; }
}
@media (min-width:1040px) and (max-width:1319.9px){
  .toc{ display:block; width:auto; left:calc((100vw - var(--maxw))/2 - 56px); }
  .tochead{ display:flex; }
  .toc > .tocitems .titem{ padding:7px; }
  .toc > .tocitems .tlabel, .toc > .tocitems .tmeta{ display:none; }

  /* TIP — tooltips open to the RIGHT so they aren't clipped at the edge */
  .toc.mode-tip > .tocitems .titem[data-tip]:hover::after{ bottom:auto; left:calc(100% + 8px); top:50%; transform:translateY(-50%); }
  .toc.mode-grow .titem[data-tip]:hover::after,
  .toc.mode-fly .titem[data-tip]:hover::after{ display:none; }

  /* GROW — the rail expands in place on hover (overlay card; layout untouched).
     Left edge stays put; it grows rightward so it never clips the viewport edge. */
  .toc.mode-grow:hover{ width:212px; background:var(--pop); border:1px solid var(--line);
    border-radius:10px; padding:8px; box-shadow:0 10px 30px var(--shadow);
    left:calc((100vw - var(--maxw))/2 - 60px); }
  .toc.mode-grow:hover > .tocitems .tlabel,
  .toc.mode-grow:hover > .tocitems .tmeta{ display:inline; }
  .toc.mode-grow:hover > .tocitems .titem{ padding:6px 8px; }

  /* FLY — dots stay; a detached panel with the full list appears beside the rail */
  .toc.mode-fly:hover .tocfly, .toc.mode-fly:focus-within .tocfly{ display:block; }
  .tocfly .tlabel, .tocfly .tmeta{ display:inline; }
  .tocfly .titem{ padding:6px 8px; }
  .tocfly .titem[data-tip]:hover::after{ display:none; }
}

/* ---------- MOBILE ToC (≤1039px + phones): a floating progress button opens the
   full list as a bottom sheet — the tap-equivalent of the desktop hover-expand,
   so the same "see every section + state at a glance" is there on mobile too. */
@media (max-width:1039px){
  .toc{ display:block; position:static; left:auto; top:auto; width:auto; }
  .tochead, .tocfly{ display:none; }
  .tocitems{ display:none; }
  .titem[data-tip]:hover::after{ display:none; }

  /* the FAB — sits above the launchbar, bottom-left */
  .tocfab{ display:inline-flex; align-items:center; gap:8px; position:fixed; z-index:61;
    left:16px; bottom:calc(90px + env(safe-area-inset-bottom));
    height:40px; padding:0 14px 0 12px; border-radius:20px; cursor:pointer;
    font-size:12.5px; font-weight:600; color:var(--ink);
    background:var(--pop); border:1px solid var(--line); box-shadow:0 4px 16px var(--shadow); }
  .tocfab .fabdot{ width:9px; height:9px; border-radius:50%; background:var(--t888); flex-shrink:0; }
  .tocfab[data-fabstate="todo"] .fabdot{ background:var(--warnc); }
  .tocfab[data-fabstate="invalid"] .fabdot{ background:var(--neg); }
  .tocfab[data-fabstate="done"] .fabdot{ background:var(--pos); }
  .tocfab .fabcar{ font-size:10px; color:var(--t888); margin-left:2px; transition:transform .16s ease; }
  .toc.open .tocfab .fabcar{ transform:rotate(180deg); }

  /* open state — backdrop + bottom sheet holding the full item list */
  .toc.open .tocbackdrop{ display:block; position:fixed; inset:0; z-index:68; background:var(--scrim); }
  .toc.open .tocitems{ display:block; position:fixed; left:0; right:0; bottom:0; z-index:69;
    background:var(--pop); border-top-left-radius:16px; border-top-right-radius:16px;
    border-top:1px solid var(--line); box-shadow:0 -8px 30px var(--shadow);
    max-height:72vh; overflow-y:auto;
    padding:8px 12px calc(16px + env(safe-area-inset-bottom)); }
  .toc.open .tocitems::before{ content:"Sections"; display:block; font-size:11px; font-weight:600;
    letter-spacing:.05em; text-transform:uppercase; color:var(--t999); padding:8px 8px 6px; }
  .toc.open .tocitems .titem{ padding:11px 8px; }   /* ≥40px tap targets */
  .toc.open .tocitems .tlabel, .toc.open .tocitems .tmeta{ display:inline; }
  .toc.open .tocitems .titem .tlabel{ font-size:13px; }
}

/* ---------- FIELDS (12112 validation-pass chrome, ported) ---------- */
.mf-flabel{ font-size:11px; font-weight:600; color:var(--t888); }
.mf2-field{ display:flex; flex-direction:column; gap:4px; margin-bottom:12px; min-width:0; }
.mf2-inputrow{ display:flex; align-items:stretch; }
.mf2-inputrow.has-prefix{ border:1px solid var(--t888); border-radius:6px; overflow:hidden; background:var(--bg); }
.mf2-inputrow.has-prefix:focus-within{ border-color:var(--ink); box-shadow:0 0 0 3px var(--acc-bg); }
.mf2-prefix{ display:flex; align-items:center; padding:0 2px 0 9px; color:var(--t888); font-family:var(--mono); font-size:13px; }
.mf2-inputrow .mf-input{ flex:1; }
.mf2-inputrow.has-prefix .mf-input{ border:none; border-radius:0; }
.mf2-inputrow.has-prefix .mf-input:focus{ box-shadow:none; }
/* error chrome lives on the ROW for prefixed fields (mf-core mirrors .err up) */
.mf2-inputrow.has-prefix.err{ border-color:var(--neg); box-shadow:0 0 0 3px var(--neg-bg); }
.mf2-inputrow.has-prefix .mf-input.err{ box-shadow:none; border:none; }
.mf2-meta{ display:flex; align-items:baseline; gap:8px; min-height:14px; }
.mf2-meta .mf-err{ flex:1; }
.mf2-count{ font-size:11px; font-family:var(--mono); color:var(--t999); margin-left:auto; white-space:nowrap; }
.mf2-count.over{ color:var(--neg); font-weight:600; }
.mf-input{ width:100%; font:inherit; font-size:12.5px; color:var(--ink); background:var(--bg);
  border:1px solid var(--t888); border-radius:6px; padding:9px 10px; outline:none; }
textarea.mf-input{ min-height:72px; resize:none; line-height:1.45; }
.mf-input:focus{ border-color:var(--ink); box-shadow:0 0 0 3px var(--acc-bg); }
.mf-input.err{ border-color:var(--neg); box-shadow:0 0 0 3px var(--neg-bg); }
.mf-input.mono{ font-family:var(--mono); font-size:12px; }
.mf-input::placeholder{ color:var(--t999); }
.mf-err{ font-size:11px; color:var(--neg); line-height:1.35; max-height:0; overflow:hidden; opacity:0;
  transition:max-height .15s ease, opacity .15s ease; }
.mf-err.show{ max-height:40px; opacity:1; }
.mf-hint{ font-size:11px; color:var(--t999); line-height:1.45; }
.mf-actions{ display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }

/* option chips (fee type/tier, reward token, pair — the swap quick-chip pattern) */
.qchips{ display:flex; gap:8px; flex-wrap:wrap; }
.qchip{ text-align:center; font-size:12px; font-weight:500; color:var(--t666);
  border:1px solid var(--line); border-radius:5px; padding:8px 14px; height:32px; cursor:pointer; background:var(--bg);
  display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.qchip:hover{ color:var(--ink); border-color:var(--t888); }
.qchip.on{ color:var(--ink); border-color:var(--t888); background:var(--navfill); }
.qchip .qsub{ font-size:11px; color:var(--t999); font-family:var(--mono); }
.qchips.dim{ opacity:.4; pointer-events:none; }

/* platform chips (Farcaster / X) — filled black when on, like activity filters */
.pchip{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:500;
  color:var(--t888); background:var(--chipbg); border:none; border-radius:5px; padding:6px 12px; height:28px; cursor:pointer; }
.pchip:hover{ color:var(--ink); }
.pchip.on{ background:var(--cta); color:var(--cta-ink); }

/* image dropzone (ported .mf-drop) + live preview thumb */
.mf-drop{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  border:1.5px dashed var(--t888); border-radius:10px; padding:22px; text-align:center; cursor:pointer;
  color:var(--t666); font-size:12px; background:var(--navfill); }
.mf-drop.over{ border-color:var(--ink); color:var(--ink); background:var(--acc-bg); }
.mf-drop .mf-upic{ font-size:20px; opacity:.7; }
.mf-drop .sub{ font-size:11px; color:var(--t999); }
.mf-drop.hasimg{ flex-direction:row; gap:12px; text-align:left; padding:12px; }
.mf-preview{ width:56px; height:56px; border-radius:10px; overflow:hidden; background:linear-gradient(135deg,#8a63ff,#6b3ffb); flex-shrink:0; }
.mf-preview img{ width:100%; height:100%; object-fit:cover; display:block; }
.mf-drop .dropmeta{ min-width:0; flex:1; }
.mf-drop .dropmeta b{ font-size:12.5px; color:var(--ink); font-weight:600; display:block; margin-bottom:2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mf-drop .dropx{ font-size:12px; color:var(--t666); border:1px solid var(--line); border-radius:5px;
  background:var(--bg); padding:6px 10px; flex-shrink:0; }
.mf-drop .dropx:hover{ color:var(--ink); border-color:var(--t888); }

/* warn strip (e.g. sniper-tax explainer) */
.fwarn{ font-size:12px; font-weight:500; color:var(--warnc); background:var(--warn-bg);
  border-radius:5px; padding:8px 10px; }
.fwarn b{ font-weight:600; }
.cdot{ display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:1px; }

/* multi-recipient rewards */
.recipients{ display:flex; flex-direction:column; gap:8px; margin-top:6px; }
.recrow{ display:flex; align-items:flex-start; gap:8px; }
.recrow .recaddr{ flex:1; margin-bottom:0; }
.recpctwrap{ position:relative; flex:0 0 84px; }
.recrow .recpct{ margin-bottom:0; }
.recrow .recpct .mf-input{ padding-right:22px; text-align:right; }
.recsuf{ position:absolute; right:10px; top:9px; font-size:12.5px; color:var(--t888); pointer-events:none; }
.recrm{ flex:0 0 auto; width:36px; height:36px; border:1px solid var(--line); border-radius:6px;
  background:var(--bg); color:var(--t666); font-size:18px; line-height:1; cursor:pointer; }
.recrm:hover{ color:var(--neg); border-color:var(--neg); }
[data-alloc].good{ color:var(--pos); }
[data-alloc].bad{ color:var(--warnc); }

/* locked (read-only) field, e.g. mcap under a Recommended pool */
.mf2-field.locked .mf-input{ opacity:.55; background:var(--navfill); cursor:not-allowed; }

/* ---------- ADD-ON MODULES (cx-*.js: vault, buy, airdrop, preclank) ---------- */
.cxtoggle{ display:flex; align-items:center; gap:14px; }
.cxtoggle .cx-main{ flex:1; min-width:0; }
.cxtoggle .cx-sub{ font-size:12.5px; color:var(--t666); line-height:1.5; margin-top:3px; }
.cxbody{ margin-top:16px; display:none; }
.cxbody.on{ display:block; }
.cx.disabled .cxtoggle .mtoggle{ opacity:.4; pointer-events:none; }
.cx.disabled .cx-title{ color:var(--t666); }
.cxnote{ font-size:12px; color:var(--t999); line-height:1.5; margin-top:6px; }
.cxnote.warn{ color:var(--warnc); }

/* quick-set chips (vault %, lockup/vesting presets) */
.qset{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.qset button{ font-size:12px; font-weight:500; color:var(--t666); border:1px solid var(--line);
  border-radius:5px; padding:6px 12px; height:32px; cursor:pointer; background:var(--bg); }
.qset button:hover{ color:var(--ink); border-color:var(--t888); }
.qset button.on{ color:var(--ink); border-color:var(--t888); background:var(--navfill); }

/* airdrop CSV parse preview */
.csvbox{ margin-top:8px; }
.csvbox textarea.mf-input{ min-height:96px; font-family:var(--mono); font-size:12px; }
.csvsum{ display:flex; align-items:center; gap:10px; margin-top:8px; font-size:12px; }
.csvsum .ok{ color:var(--pos); font-weight:600; }
.csvsum .err{ color:var(--neg); font-weight:600; }
.csverrs{ margin-top:6px; font-size:11.5px; color:var(--neg); line-height:1.5; max-height:80px; overflow:auto; }
.csverrs div{ font-family:var(--mono); }
.csvsample{ font-size:11px; color:var(--t666); text-decoration:underline; cursor:pointer; margin-left:auto; }
.airsrc{ display:flex; gap:8px; margin-bottom:12px; }

/* ---------- SUBMIT AREA (form column, mirrors the rail CTA) ---------- */
.submitrow{ display:flex; align-items:center; gap:14px; padding:22px 0 10px; }
.submitrow .subnote{ font-size:12px; color:var(--t999); line-height:1.5; }
.submitrow .mbtn{ margin-left:auto; }

/* buttons + submit states (ported) */
.mbtn{ font-size:12.5px; font-weight:600; color:var(--cta-ink); background:var(--cta); border:none;
  border-radius:5px; padding:11px 20px; cursor:pointer; white-space:nowrap; }
.mbtn.ghost{ color:var(--t666); background:var(--bg); border:1px solid var(--line); }
.mbtn.ghost:hover{ color:var(--ink); border-color:var(--t888); }
.mbtn.busy{ opacity:.7; cursor:default; }
.mbtn.ok{ background:var(--pos); color:#fff; }
.mbtn:disabled{ opacity:.45; cursor:not-allowed; }
.mbtn.danger{ color:#fff; background:var(--neg); }

/* ---------- RAIL: LIVE PREVIEW CARD ---------- */
.prev{ position:sticky; top:calc(var(--navh) + 14px); }
.prevbox{ border:1px solid var(--line); border-radius:8px; padding:18px; }
.prevhead{ display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.pav{ width:47px; height:47px; border-radius:10px; background:var(--chipbg); overflow:hidden; flex-shrink:0;
  display:grid; place-items:center; font-size:18px; font-weight:600; color:var(--t888); }
.pav.hasimg{ background:linear-gradient(135deg,#8a63ff,#6b3ffb); color:#fff; }
.pav img{ width:100%; height:100%; object-fit:cover; display:block; }
.pid{ min-width:0; }
.pname{ font-size:16px; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pname.empty{ color:var(--t999); font-weight:400; }
.psym{ font-size:12px; color:var(--t666); font-family:var(--mono); margin-top:3px; }
.prevkv{ border-top:1px solid var(--line); margin-top:10px; padding-top:8px; }
.prevkv .kv{ min-height:24px; padding:4px 0; }
.prevkv .kv .k{ font-size:12px; }
.prevkv .kv .v{ font-size:12px; }
.prevchips{ display:flex; gap:6px; flex-wrap:wrap; margin:10px 0 2px; }
/* agent sub-card — dashed “proposed layer” treatment, consistent w/ token-detail */
.pagent{ border:1px dashed var(--t888); border-radius:8px; padding:12px; margin-top:12px; }
.pagent .pahead{ display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.pagent .pahead .seclabel{ font-size:11px; }
.pagent .kv{ min-height:22px; padding:3px 0; }
.pagent .kv .k, .pagent .kv .v{ font-size:12px; }
body:not([data-agent="on"]) .pagent{ display:none; }
.prevcta{ margin-top:16px; }
.connect{ width:100%; height:48px; text-align:center; font-size:16px; font-weight:700;
  color:var(--t888); background:var(--chipbg); border:none; border-radius:5px; cursor:pointer; }
.connect.primary{ color:var(--cta-ink); background:var(--cta); }
.connect.busy{ opacity:.7; cursor:default; }
.connect.ok{ background:var(--pos); color:#fff; }
.connect:disabled{ cursor:not-allowed; }
.walletline{ margin-top:9px; font-size:11px; color:var(--t999); text-align:center; }
.walletline .mono{ color:var(--t666); }
.walletline a{ color:var(--t666); font-weight:600; margin-left:6px; text-decoration:underline; }
.prevfoot{ margin-top:10px; font-size:11px; color:var(--t999); text-align:center; line-height:1.5; }

/* ---------- MOBILE LAUNCH BAR (fixed bottom, tradebar pattern in CTA ink) ---------- */
.launchbar{ display:none; position:fixed; bottom:0; left:0; right:0; z-index:60;
  background:transparent; align-items:center; gap:12px; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); }
.launchbar::before{ content:""; position:absolute; left:0; right:0; bottom:100%; height:36px;
  background:linear-gradient(to top, var(--bg) 0%, transparent 100%); pointer-events:none; }
.launchbar .lb-btn{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
  font-size:14px; font-weight:600; color:var(--cta-ink); background:var(--cta);
  border:none; border-radius:12px; padding:15px; box-shadow:0 2px 12px var(--shadow); }
.launchbar .lb-btn.busy{ opacity:.7; }
.launchbar .lb-btn.ok{ background:var(--pos); color:#fff; }
.launchbar .lb-info{ font-size:13px; opacity:.75; font-family:var(--mono); }

/* ============================================================
   SUCCESS PAGES (create-success / create-success-ta)
   ============================================================ */
/* centered wrappers use a FIXED gutter — --pgpad resolves against the viewport
   and collapses a max-width box at wide screens (review finding, High) */
.successwrap{ max-width:560px; margin:0 auto; padding:26px 24px 8px; }
.successwrap.wide{ max-width:var(--maxw); }
.shero{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px; padding:34px 0 26px; }
.sherochk{ width:64px; height:64px; border-radius:50%; background:var(--pos-bg); color:var(--pos);
  display:grid; place-items:center; font-size:30px; font-weight:700; }
.sherotitle{ font-size:24px; font-weight:600; letter-spacing:-.01em; color:var(--ink); }
.sherosub{ font-size:13px; color:var(--t666); line-height:1.5; }
.sherosub .sep{ color:var(--chipbg); margin:0 4px; }
/* identity chips (token + agent) under the TA hero */
.idchips{ display:flex; align-items:center; gap:10px; margin-top:4px; }
.idchip{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:600; color:var(--ink);
  border:1px solid var(--line); border-radius:999px; padding:6px 14px 6px 7px; }
.idchip .ica{ width:22px; height:22px; border-radius:50%; background:linear-gradient(135deg,#8a63ff,#6b3ffb);
  display:grid; place-items:center; color:#fff; font-size:10px; font-weight:700; overflow:hidden; }
.idchip .ica img{ width:100%; height:100%; object-fit:cover; display:block; }
.idchip .ica.tok{ border-radius:6px; }
.idplus{ font-size:14px; color:var(--t888); }
/* receipt = the evidence-section language */
.receipt{ border-top:1px solid var(--line); padding:20px 0 8px; }
.receipt .eshead{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.receipt .esaux{ font-size:12px; font-weight:500; color:var(--t888); font-variant-numeric:tabular-nums; }
.receipt2{ display:grid; grid-template-columns:1fr 1fr; gap:0 48px; }
.sactions{ display:flex; gap:8px; padding:20px 0 6px; flex-wrap:wrap; }
.sactions .mbtn{ flex:1; text-align:center; }
.sactions .mbtn.ghost{ flex:1; }
.sharestrip{ display:flex; align-items:center; gap:10px; border-top:1px solid var(--line);
  margin-top:14px; padding:16px 0; }
.sharestrip .sl{ font-size:12px; color:var(--t888); margin-right:auto; }
.sharebtn{ color:var(--t666); border:1px solid var(--line); background:var(--bg); cursor:pointer; padding:7px 12px; }
.sharebtn:hover{ color:var(--ink); border-color:var(--t888); }

/* ============================================================
   DEPLOYMENTS PAGE
   ============================================================ */
.depwrap{ max-width:820px; margin:0 auto; padding:18px 24px 8px; }
.depfilters{ display:flex; align-items:center; gap:12px; padding:4px 0 14px; }
.depfilters .chip{ color:var(--t888); background:var(--chipbg); border:none; cursor:pointer; }
.depfilters .chip:hover{ color:var(--ink); }
.depfilters .chip.on{ background:var(--cta); color:var(--cta-ink); }
.depfilters .depcount{ margin-left:auto; font-size:12px; color:var(--t888); }
.depgroup{ padding:14px 0 6px; }
.depgroup .eshead{ display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.depgroup .esaux{ font-size:12px; font-weight:500; color:var(--t888); }
.dep{ display:flex; align-items:flex-start; gap:14px; padding:16px 4px; border-bottom:1px solid var(--line); }
.dep:last-child{ border-bottom:none; }
.dep .dav{ width:40px; height:40px; border-radius:9px; background:var(--chipbg); overflow:hidden; flex-shrink:0;
  display:grid; place-items:center; font-size:15px; font-weight:600; color:var(--t888); }
.dep .dav.grad{ background:linear-gradient(135deg,#8a63ff,#6b3ffb); color:#fff; }
.dep .dmain{ min-width:0; flex:1; }
.dep .dname{ font-size:13px; font-weight:600; color:var(--ink); display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.dep .dname .tk{ font-weight:400; color:var(--t666); font-family:var(--mono); font-size:12.5px; }
.dep .dmeta{ font-size:12px; color:var(--t888); margin-top:4px; }
.dep .dchips{ display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.dep .dchips .mhbadge{ font-size:11px; padding:2px 6px; }
.dep .dright{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; flex-shrink:0; }
.dep .dview{ font-size:12px; font-weight:500; color:var(--t666); border:1px solid var(--line);
  border-radius:5px; padding:6px 10px; white-space:nowrap; }
.dep .dright .vtag{ margin-right:0; }   /* right-align with the View button below */
.dep .dview:hover{ color:var(--ink); border-color:var(--t888); }
/* the agent half of a tokenized-agent row */
.dep .dagent{ border-top:1px dashed var(--line); margin-top:10px; padding-top:10px; }
.dep .dagent .dname{ font-size:12.5px; }
.depempty{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px;
  border:1px dashed var(--t888); border-radius:8px; padding:44px 24px; margin-top:10px; }
.depempty .estitle{ font-size:15px; }
.depempty .note{ max-width:340px; }
.depempty .mbtn{ margin-top:6px; }

/* ---------- TOAST + FOOTER (ported) ---------- */
.ftoast{ position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(20px); z-index:99;
  font-size:12.5px; font-weight:600; color:var(--cta-ink); background:var(--cta); border-radius:6px;
  padding:11px 18px; opacity:0; pointer-events:none; transition:opacity .18s ease, transform .18s ease; }
.ftoast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

.footer{ position:relative; overflow:hidden; margin-top:48px; padding:96px calc(var(--pgpad) - var(--tocshift)) 0 calc(var(--pgpad) + var(--tocshift)); }
.fcols{ position:relative; z-index:1; display:grid; grid-template-columns:1.1fr 1fr 1fr 1fr 1.3fr; gap:48px; }
.fcol .fh{ font-size:12px; font-weight:500; letter-spacing:.05em; text-transform:uppercase; color:var(--ink); margin-bottom:12px; }
.fcol .ftick{ font-family:var(--mono); font-size:12px; color:var(--ink); margin-bottom:12px; }
.fcol .fprice{ font-size:12px; color:var(--pos); font-weight:400; display:flex; align-items:center; gap:7px; }
.fchip{ font-size:10px; font-weight:500; font-family:var(--mono); border-radius:3px; padding:2px 6px; }
.fchip.pos{ color:var(--pos); background:var(--pos-bg); }
.fclank{ margin-top:12px; color:var(--cta-ink); background:var(--cta); border:none; cursor:pointer; }
.fcol a{ display:block; font-size:14px; color:var(--t9ca); font-weight:400; margin-bottom:8px; }
/* the footer CTA is an <a> on non-create pages — must beat the generic link rule */
.fcol a.fclank{ display:inline-flex; color:var(--cta-ink); margin-bottom:0; font-size:12px; }
.fcol a:hover{ color:var(--ink); }
.fdisc{ position:relative; z-index:1; margin-top:96px; font-size:12px; font-weight:400; color:var(--t9ca); max-width:var(--maxw); line-height:18px; padding-bottom:24px; }
.watermark{ position:relative; z-index:0; margin-top:48px; text-align:center; font-family:var(--mono);
  font-size:min(232px, 16vw); font-weight:700; letter-spacing:.01em; color:var(--wm); line-height:.8;
  user-select:none; pointer-events:none; overflow:hidden; }

/* ---------- MODAL (ported, for confirm flows) ---------- */
.mf-back{ position:fixed; inset:0; background:var(--scrim); z-index:90; opacity:0; transition:opacity .15s ease; }
.mf-back.open{ opacity:1; }
.mf-modal{ position:fixed; z-index:91; left:50%; top:50%; transform:translate(-50%,-46%);
  width:min(440px, calc(100% - 32px)); max-height:88vh; overflow:auto; opacity:0;
  background:var(--pop); border:1px solid var(--line); border-radius:14px; box-shadow:0 18px 60px var(--shadow);
  transition:opacity .15s ease, transform .15s ease; }
.mf-modal.open{ opacity:1; transform:translate(-50%,-50%); }
.mf-mhead{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 16px 8px; }
.mf-mtitle{ font-size:15px; font-weight:700; color:var(--ink); }
.mf-x{ font-size:20px; line-height:1; color:var(--t666); background:none; border:none; cursor:pointer; padding:2px 4px; }
.mf-mbody{ padding:4px 16px 8px; display:flex; flex-direction:column; gap:12px; }
.mf-mfoot{ display:flex; justify-content:flex-end; gap:8px; padding:12px 16px 16px; }
.mf-modal.danger .mf-mtitle{ color:var(--neg); }

/* ---------- MOBILE ---------- */
@media (max-width:900px){
  .page{ grid-template-columns:1fr; }
  .col-rail{ display:none; }
  /* touch ergonomics: 16px inputs (kills iOS focus zoom), ≥40px targets */
  .mf-input{ font-size:16px; min-height:44px; }
  textarea.mf-input{ min-height:88px; }
  .mf2-prefix{ font-size:15px; }
  .qchip{ height:40px; padding:8px 16px; }
  .pchip{ height:36px; padding:8px 14px; }
  .mtoggle .sw{ width:44px; height:26px; }
  .mtoggle .sw::after{ width:20px; height:20px; }
  .agentbar .mtoggle{ padding:8px 0 8px 8px; }
  /* toast must clear the fixed launchbar */
  body.has-launchbar .ftoast{ bottom:calc(96px + env(safe-area-inset-bottom)); }
  .frow{ grid-template-columns:1fr; gap:0; }
  .receipt2{ grid-template-columns:1fr; }
  .submitrow{ display:none; }   /* the launchbar owns the CTA on mobile */
  .launchbar{ display:flex; }
  body.has-launchbar{ padding-bottom:84px; }
  .fcols{ grid-template-columns:1fr 1fr; gap:28px; }
  .footer{ padding-top:48px; }
  .fdisc{ margin-top:40px; }
  .watermark{ font-size:22vw; margin-top:24px; }
  .topnav .search{ flex:1 1 auto; }
  .topnav .navlink{ display:none; }
  .sactions{ flex-direction:column; }
  .dep .dright{ flex-direction:row; align-items:center; }
  .dep{ flex-wrap:wrap; }
  .dep .dright{ width:100%; justify-content:flex-end; }
}
@media (max-width:480px){
  .brand{ font-size:17px; }
  .walletpill{ padding:8px 9px; }
  .agentbar{ flex-wrap:wrap; }
  .idchips{ flex-wrap:wrap; justify-content:center; }
}