/* "Launch your city coin" (dashboard Founder tab) and "Move to the open market" (coin page): public/lp-launch.js, and the
   transaction summary public/lp-sign.js draws before the wallet opens (the same look as the admin tab's, public/admin.css).
   Design v2 (10 Oct 2026): the site's tokens, each read with a fallback (var(--name, value)); one glass card, wells inside it
   (--surface-inset), a pill for the state, the shared .ico SVG set in the head, .fold for the accounts of each instruction,
   44 px touch targets, nothing wider than a 320 px screen. Loaded before the page's own sheet (pages-coin.css, polish-dash.css).
   Design v5 (1 Nov 2026): the fallbacks are the dark theme's values (#C6D3E6 the second text level); the mainnet red stays literal. */
.lp-launch { display: grid; gap: var(--sp-3, 12px); min-width: 0; }
.lp-launch__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--sp-2, 8px) var(--sp-3, 12px); min-width: 0; }
.lp-launch__head > div { min-width: 0; }
.lp-launch__head .kicker { display: flex; align-items: center; gap: var(--sp-2, 8px); margin-bottom: var(--sp-1, 4px); }
.lp-launch__head .kicker .ico { margin: 0; }
.lp-launch__head h2 { margin: 2px 0 0; }
.lp-launch__head .tag { flex: none; }
.lp-launch__body, .lp-flow { display: grid; gap: var(--sp-3, 12px); min-width: 0; }
.lp-launch__body p, .lp-flow p, .coin-grad p { margin: 0; }
.lp-launch__body > .small, .lp-flow > .small { color: var(--text-2, #C6D3E6); line-height: var(--lh-body, 1.55); }
.lp-flow:empty { display: none; }
/* the network: a calm chip on devnet; on mainnet the one red line of the card (white on #B3261E: 6.5:1, both themes). The chip's
   radius, not a pill's: the devnet words wrap to two lines at 320 px, and a 999px radius made that a lozenge */
.lp-net { margin: 0; padding: var(--sp-1, 4px) var(--sp-3, 12px); border-radius: var(--r-chip, 12px); font: 600 var(--fs-xs, .75rem)/1.6 var(--body); border: 1px solid var(--line-2); background: var(--surface-inset, rgba(255,255,255,.04)); color: var(--text-2, #C6D3E6); justify-self: start; max-width: 100%; overflow-wrap: anywhere; }
.lp-net--main { background: #B3261E; border-color: #B3261E; color: #fff; font-weight: 700; letter-spacing: .01em; }
/* the coin and its facts: one well */
.lp-coin { font-size: var(--fs-md, 1.125rem); line-height: var(--lh-snug, 1.3); overflow-wrap: anywhere; }
.lp-coin__name { font-family: var(--display); font-weight: 650; }
.lp-coin__tk { font-family: var(--display); font-weight: 700; color: var(--gold-text); }
.lp-live { font: 650 var(--fs-md, 1.125rem)/1.3 var(--display); color: var(--ok-text); }
.lp-facts { margin: 0; display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--sp-2, 8px) var(--sp-4, 16px); font-size: var(--fs-sm, .875rem); line-height: var(--lh-snug, 1.3);
  padding: var(--sp-3, 12px); border-radius: var(--r-chip, 12px); background: var(--surface-inset, rgba(255,255,255,.04)); border: 1px solid var(--line); }
.lp-facts dt { color: var(--muted); }
.lp-facts dd { margin: 0; min-width: 0; overflow-wrap: anywhere; color: var(--text); }
/* the optional first buy */
.lp-buy { display: grid; gap: var(--sp-2, 8px); font-weight: 600; font-size: var(--fs-sm, .875rem); min-width: 0; }
.lp-buy__input { width: 100%; max-width: 220px; min-height: 44px; font: var(--fs-base, 1rem) var(--mono); }
.lp-quote { font-size: var(--fs-sm, .875rem); color: var(--text-2, #C6D3E6); }
.lp-quote:empty { display: none; }
.lp-row { display: flex; flex-wrap: wrap; gap: var(--sp-2, 8px); align-items: center; }
.lp-row .btn, .lp-go { min-height: 44px; }
.lp-go { justify-self: start; }
.lp-wallets { display: flex; flex-wrap: wrap; gap: var(--sp-2, 8px); align-items: center; }
.lp-wallets p { flex: 1 1 100%; }
.lp-links { overflow-wrap: anywhere; font-size: var(--fs-sm, .875rem); }
.lp-link { color: var(--pin-2); }
/* the founder's fees read from the chain: each figure, then where and when it was read */
.lp-fees { display: grid; gap: var(--sp-2, 8px); min-width: 0; }
.lp-fees__title { font: 650 var(--fs-sm, .875rem)/1.3 var(--display); }
.lp-fees__val { display: block; font-variant-numeric: tabular-nums; }
.lp-fees__src { display: block; margin-top: 2px; font-size: var(--fs-xs, .75rem); color: var(--muted); overflow-wrap: anywhere; }
.lp-addr { overflow-wrap: anywhere; word-break: break-all; color: var(--text-2, #C6D3E6); }
.lp-error { color: var(--bad-text); overflow-wrap: anywhere; }
.lp-status { font-weight: 600; overflow-wrap: anywhere; }
.lp-status:empty { display: none; }
/* what the wallet will sign (public/lp-sign.js renderSummary): a well; each instruction's accounts in a .fold */
.lp-sum { border: 1px solid var(--line-2); border-radius: var(--r-chip, 12px); padding: var(--sp-3, 12px) var(--sp-4, 16px); display: grid; gap: var(--sp-2, 8px); background: var(--surface-inset, rgba(255,255,255,.04)); min-width: 0; font-size: var(--fs-sm, .875rem); line-height: var(--lh-snug, 1.3); }
.lp-sum p { margin: 0; }
.lp-sum__net { font-weight: 700; }
.lp-sum__net--main { color: #fff; background: #B3261E; border-radius: var(--r-xs, 8px); padding: var(--sp-1, 4px) 10px; justify-self: start; }
.lp-sum .lp-sum__h { font: 600 var(--fs-xs, .75rem)/1.3 var(--body); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-top: var(--sp-1, 4px); }
.lp-sum__sol, .lp-sum__ixs { margin: 0; padding-left: 20px; display: grid; gap: var(--sp-2, 8px); overflow-wrap: anywhere; }
.lp-sum__sol { font-family: var(--display); font-variant-numeric: tabular-nums; }
.lp-sum__raw, .lp-sum__detail { color: var(--muted); }
.lp-sum .fold { margin-top: var(--sp-1, 4px); }
.lp-sum .fold > summary { font-weight: 500; color: var(--muted); font-size: var(--fs-xs, .75rem); }
.lp-sum__accts { margin: 0 0 var(--sp-2, 8px); padding-left: 18px; display: grid; gap: 2px; font: var(--fs-xs, .75rem)/1.45 var(--mono); overflow-wrap: anywhere; word-break: break-all; color: var(--text-2, #C6D3E6); }
.lp-sum__foot { color: var(--muted); font-size: var(--fs-xs, .75rem); }
.lp-sum__error { color: var(--bad-text); }
/* the coin page: the graduation box inside the curve card */
.coin-grad { display: grid; gap: var(--sp-2, 8px); margin-top: var(--sp-3, 12px); padding-top: var(--sp-3, 12px); border-top: 1px solid var(--line); min-width: 0; }
.coin-grad__title { font: 650 var(--fs-base, 1rem)/1.3 var(--display); }
.coin-grad .btn { min-height: 44px; }
@media (max-width: 520px) {
  .lp-facts { grid-template-columns: 1fr; gap: 0; }
  .lp-facts dt { margin-top: var(--sp-2, 8px); }
  .lp-facts dt:first-child { margin-top: 0; }
  .lp-buy__input { max-width: none; }
  .lp-go, .lp-row .btn--primary, .coin-grad .btn { width: 100%; justify-content: center; }
}