/* SpectrumMint / monochrome workspaces. Presentation only; no application logic. */
.app-page,
.modal-backdrop,
.payment-dialog {
  --sm-app-ink: #080809;
  --sm-app-panel: #0d0d0f;
  --sm-app-raised: #141416;
  --sm-app-line: #2b2b30;
  --sm-app-line-bright: #45454c;
  --sm-app-white: #f0efec;
  --sm-app-muted: #a1a1a9;
  --sm-app-rose: #ff4f9a;
  --sm-app-mono: var(--font-geist-mono, "SFMono-Regular", Consolas, "Liberation Mono", monospace);
  color: var(--sm-app-white);
}

.site-shell .app-page {
  width: min(1240px, calc(100% - 64px));
  padding-top: 154px;
  padding-bottom: 96px;
}
.app-page .page-title { max-width: 980px; margin-bottom: 42px; }
.app-page .page-title .eyebrow,
.app-page .profile-identity .eyebrow,
.app-page .summary-panel > .eyebrow,
.modal .eyebrow {
  font-family: var(--sm-app-mono);
  color: var(--sm-app-muted);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .13em;
}
.app-page .page-title h1 {
  font-size: clamp(42px, 6.6vw, 84px);
  font-weight: 600;
  letter-spacing: -.065em;
  line-height: 1.04;
}
.app-page .page-title > p:last-child {
  color: var(--sm-app-muted);
  margin-top: 20px;
  max-width: 620px;
  font-size: 16px;
  line-height: 1.7;
}
.app-page .terminal-grid { gap: 18px; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .75fr); }
.app-page .terminal-panel,
.app-page .balance-box,
.app-page .empty-state,
.app-page .coming-soon-card {
  background: var(--sm-app-panel);
  border: 1px solid var(--sm-app-line);
  border-radius: 6px;
  box-shadow: none;
}
.app-page .terminal-panel { min-width: 0; }
.app-page .form-panel,
.app-page .logo-panel,
.app-page .extras-panel,
.app-page .authority-panel,
.app-page .summary-panel,
.app-page .pool-builder,
.app-page .swap-panel,
.app-page .token-data-panel,
.app-page .market-simulation { padding: 28px; }
.app-page .panel-head {
  margin-bottom: 28px;
  gap: 14px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--sm-app-line);
}
.app-page .panel-head > span:first-child {
  background: transparent;
  border: 1px solid var(--sm-app-line-bright);
  border-radius: 3px;
  width: 34px;
  height: 34px;
  color: var(--sm-app-white);
  font: 12px var(--sm-app-mono);
}
.app-page .panel-head h2 {
  color: var(--sm-app-white);
  font: 500 13px/1.5 var(--sm-app-mono);
  letter-spacing: .06em;
}
.app-page .panel-head p,
.app-page .panel-head > i {
  color: var(--sm-app-muted);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
}
.app-page .panel-head > i { font-family: var(--sm-app-mono); text-align: right; }

/* Inputs keep their native controls and validation behavior. */
.app-page label {
  color: #b8b8be;
  font: 500 12px/1.5 var(--sm-app-mono);
  letter-spacing: .035em;
  min-width: 0;
}
.app-page input,
.app-page textarea,
.app-page select,
.payment-dialog .payment-step select,
.payment-dialog .payment-step input {
  background: #101012;
  color: var(--sm-app-white);
  border: 1px solid #3b3b42;
  border-radius: 3px;
  min-width: 0;
  min-height: 50px;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0;
  box-shadow: none;
  color-scheme: dark;
}
.app-page input::placeholder,
.app-page textarea::placeholder { color: #888890; }
.app-page input:hover,
.app-page textarea:hover,
.app-page select:hover { border-color: #686870; }
.app-page input:focus,
.app-page textarea:focus,
.app-page select:focus,
.payment-dialog .payment-step input:focus,
.payment-dialog .payment-step select:focus {
  background: #141416;
  border-color: var(--sm-app-rose);
  outline: 1px solid var(--sm-app-rose);
  outline-offset: 2px;
  box-shadow: none;
}
.app-page button:focus-visible,
.app-page .logo-drop:focus-within,
.modal button:focus-visible,
.payment-dialog :focus-visible {
  outline: 2px solid var(--sm-app-rose);
  outline-offset: 4px;
}
.app-page :is(button, input, select, textarea) { scroll-margin-top: 110px; }
.app-page .field-row { gap: 18px; margin-bottom: 22px; }
.app-page .form-panel > label { margin-bottom: 22px; }
.app-page .form-panel > .field-row:last-child { margin-bottom: 0; }
.app-page textarea { min-height: 120px; line-height: 1.6; padding-bottom: 14px; }

/* A token mark is treated as an object inside an instrument frame. */
.app-page .logo-panel { background: var(--sm-app-panel); }
.app-page .logo-drop {
  background-color: #09090b;
  background-image: radial-gradient(#ffffff20 .65px, transparent .65px);
  background-size: 8px 8px;
  border: 1px dashed #4d4d54;
  border-radius: 4px;
  min-height: 254px;
  gap: 25px;
  transition: border-color .25s ease;
}
.app-page .logo-drop:hover { border-color: var(--sm-app-rose); }
.app-page .logo-drop strong {
  color: var(--sm-app-white);
  background: radial-gradient(circle at 36% 24%, #3b3b40, #151518 62%);
  border: 1px solid #86868d;
  border-radius: 50%;
  width: 106px;
  height: 106px;
  font: 500 27px var(--sm-app-mono);
  box-shadow: inset 0 0 0 6px #151518, inset 0 0 0 7px #494950, 8px 8px 0 #09090b, 9px 9px 0 #505057;
}
.app-page .logo-drop img { border: 1px solid #65656c; border-radius: 50%; width: 106px; height: 106px; }
.app-page .logo-drop span { color: #c0c0c6; font: 12px/1.5 var(--sm-app-mono); text-align: center; padding: 0 12px; }
.app-page .generate-button {
  background: #141416;
  border-color: var(--sm-app-line-bright);
  border-radius: 3px;
  color: var(--sm-app-white);
  padding: 13px 15px;
  min-height: 48px;
  font: 12px/1.5 var(--sm-app-mono);
  text-align: left;
  cursor: pointer;
}
.app-page .generate-button:hover,
.app-page .generate-button[aria-pressed="true"] { background: #1a1a1d; border-color: #ab4672; }
.app-page .generate-button span { color: var(--sm-app-muted); }

/* Optional modules: white switches, a fine rose edge on selected cards. */
.app-page .paid-option { padding: 24px 0; border-color: var(--sm-app-line); }
.app-page .paid-option.enabled {
  background: #111113;
  border: 1px solid #85405d;
  border-radius: 4px;
  padding: 22px 18px;
}
.app-page .paid-option-head { gap: 12px; }
.app-page .option-switch {
  border: 1px solid #55555d;
  background: #29292d;
  width: 42px;
  height: 24px;
  padding: 3px;
  border-radius: 2px;
}
.app-page .option-switch i { background: #a0a0a7; width: 16px; height: 16px; border-radius: 1px; }
.app-page .enabled .option-switch { background: #29292d; border-color: var(--sm-app-rose); }
.app-page .enabled .option-switch i { background: #f0efec; transform: translateX(17px); }
.app-page .option-title { color: var(--sm-app-white); font-size: 14px; line-height: 1.5; }
.app-page .option-title em {
  background: transparent;
  color: var(--sm-app-muted);
  border: 1px solid #77445a;
  border-radius: 2px;
  font: 10px var(--sm-app-mono);
  padding: 3px 5px;
  vertical-align: 1px;
}
.app-page .paid-option-head > b { color: #c1c1c7; font: 12px/1.4 var(--sm-app-mono); white-space: nowrap; }
.app-page .paid-option > p { color: var(--sm-app-muted); font-size: 13px; line-height: 1.7; }
.app-page .option-fields { margin-top: 22px; }
.app-page .social-fields { grid-template-columns: 1fr; }
.app-page .liquidity-option label > div input { border-radius: 3px; }
.app-page .liquidity-option small { font-size: 12px; line-height: 1.6; color: var(--sm-app-muted); }
.app-page .paid-option:has(.integrated-bot-fields),
.app-page .paid-option:has(.reference-bot-fields) {
  background: #111113 !important;
  border: 1px solid #85405d !important;
  border-radius: 4px !important;
  padding: 22px 18px !important;
}
.app-page .paid-option:has(.integrated-bot-fields) .option-switch,
.app-page .paid-option:has(.reference-bot-fields) .option-switch { background: #29292d !important; border-color: var(--sm-app-rose); border-radius: 2px; }
.app-page .paid-option:has(.integrated-bot-fields) .option-switch i,
.app-page .paid-option:has(.reference-bot-fields) .option-switch i { background: #f0efec !important; border-radius: 1px; }
.app-page .simulation-fields.integrated-bot-fields input,
.app-page .reference-bot-fields input {
  background: #09090b !important;
  color: #f0efec !important;
  border: 1px solid #45454c !important;
  border-radius: 3px !important;
  min-height: 48px !important;
  padding: 12px 13px !important;
  font: 14px var(--sm-app-mono) !important;
}
.app-page .simulation-fields.integrated-bot-fields input:focus,
.app-page .reference-bot-fields input:focus { border-color: var(--sm-app-rose) !important; outline: 1px solid var(--sm-app-rose); outline-offset: 2px; }
.app-page .simulation-fields.integrated-bot-fields :is(p, small),
.app-page .reference-bot-fields :is(p, small) { color: var(--sm-app-muted); font-size: 12px; line-height: 1.7; }
.app-page .simulation-fields.integrated-bot-fields h4 { color: #dedee3; border-color: var(--sm-app-line); font-family: var(--sm-app-mono); line-height: 1.6; }
.app-page .integrated-bot-fields label > span { color: #b8b8be; font-size: 12px; }

.app-page .authority-cards { gap: 10px; }
.app-page .authority-cards button {
  color: var(--sm-app-muted);
  background: #101012;
  border-color: #3a3a41;
  border-radius: 4px;
  padding: 16px;
  transform: none;
}
.app-page .authority-cards button:hover { background: #18181b; border-color: #74747c; transform: translateY(-2px); }
.app-page .authority-cards button.selected { background: #151517; border-color: #a14970; color: #bbbbc3; }
.app-page .authority-cards button > span { align-items: start; gap: 6px; }
.app-page .authority-cards button > span i { background: transparent; color: #f0efec; border: 1px solid #53535b; border-radius: 2px; min-width: 20px; height: 20px; }
.app-page .authority-cards button.selected > span i { border-color: var(--sm-app-rose); }
.app-page .authority-cards b { font: 500 12px/1.5 var(--sm-app-mono); }
.app-page .authority-cards p { min-height: 70px; font-size: 12px; line-height: 1.6; margin: 16px 0; }
.app-page .authority-cards em { color: #b8b8c0; font: 12px var(--sm-app-mono); }

/* Sticky launch receipt. */
.app-page .summary-panel { background: #101012; border-top-color: #9b4a6b; top: 110px; }
.app-page .token-preview { background: #080809; border-radius: 3px; border-color: #333339; padding: 18px 14px; }
.app-page .token-preview > div { background: #222226; border: 1px solid #66666e; border-radius: 50%; color: var(--sm-app-white); font-family: var(--sm-app-mono); flex: 0 0 52px; }
.app-page .token-preview > span { min-width: 0; }
.app-page .token-preview b { display: block; overflow-wrap: anywhere; font-family: var(--sm-app-mono); font-size: 17px; }
.app-page .token-preview small { color: var(--sm-app-muted); font-size: 12px; overflow-wrap: anywhere; }
.app-page :is(.summary-panel, .swap-panel, .token-data-panel) dl > div { border-color: var(--sm-app-line); align-items: start; gap: 16px; padding: 15px 0; }
.app-page dt { color: var(--sm-app-muted); font: 12px/1.6 var(--sm-app-mono); }
.app-page dd { color: var(--sm-app-white); font: 12px/1.6 var(--sm-app-mono); overflow-wrap: anywhere; }
.app-page .total { background: transparent; color: var(--sm-app-white); border-bottom: 1px solid #7c435b; border-radius: 0; padding: 15px 0 23px; margin: 15px 0 24px; gap: 10px; }
.app-page .total span { font: 12px var(--sm-app-mono); color: #c0c0c6; }
.app-page .total b { font-size: 27px; font-weight: 500; letter-spacing: -.035em; white-space: nowrap; }
.app-page .primary,
.modal .primary,
.payment-dialog .payment-primary {
  color: #111113;
  background: #f0efec;
  border: 1px solid #f0efec;
  border-radius: 3px;
  box-shadow: none;
  min-height: 48px;
  font: 600 12px/1.5 var(--sm-app-mono);
  letter-spacing: .045em;
  transition: background .2s, border-color .2s, transform .2s;
}
.app-page .primary:hover,
.modal .primary:hover,
.payment-dialog .payment-primary:hover { background: #fff; border-color: var(--sm-app-rose); box-shadow: none; transform: translateY(-1px); }
.app-page .primary:disabled,
.app-page button:disabled,
.payment-dialog .payment-primary:disabled { cursor: not-allowed; transform: none; }
.app-page .ghost,
.modal .ghost { border: 1px solid #45454c; background: #111113; color: #dedee3; border-radius: 3px; min-height: 46px; font: 500 12px/1.5 var(--sm-app-mono); padding: 12px 16px; }
.app-page .ghost:hover,
.modal .ghost:hover { background: #19191c; border-color: #a65677; }
.app-page .secure-note { color: var(--sm-app-muted); font-size: 12px; }

/* Finished token passport, with a dedicated non-interactive artwork slot. */
.app-page .profile-hero {
  background: #0d0d0f;
  border: 1px solid #414147;
  border-top-color: #986077;
  border-radius: 6px;
  padding: 30px;
  gap: 26px;
  position: relative;
  isolation: isolate;
}
.app-page .profile-hero::before {
  content: "";
  position: absolute;
  pointer-events: none;
  inset: 9px;
  border-top: 1px solid #ffffff08;
  border-bottom: 1px solid #ffffff08;
  z-index: -1;
}
.app-page .profile-hero:has(.sm-profile-art) {
  grid-template-columns: 82px minmax(0, 1fr) 218px;
  grid-template-areas: "mark identity art" "actions actions actions";
  align-items: center;
  row-gap: 22px;
}
.app-page .profile-hero:has(.sm-profile-art) .profile-token-mark { grid-area: mark; }
.app-page .profile-hero:has(.sm-profile-art) .profile-identity { grid-area: identity; }
.app-page .profile-hero:has(.sm-profile-art) .profile-actions { grid-area: actions; }
.app-page .profile-token-mark {
  width: 82px;
  height: 82px;
  background: #18181c;
  border: 1px solid #777780;
  border-radius: 50%;
  box-shadow: 0 0 0 5px #101012, 0 0 0 6px #2b2b31;
  color: #f0efec;
  font: 500 24px var(--sm-app-mono);
  flex-shrink: 0;
}
.app-page .profile-identity { min-width: 0; }
.app-page .profile-identity h1 { color: var(--sm-app-white); font-size: clamp(30px, 3.7vw, 50px); font-weight: 500; line-height: 1.12; letter-spacing: -.05em; overflow-wrap: anywhere; }
.app-page .profile-identity h1 span { color: #a7a7b0; font-family: var(--sm-app-mono); font-size: .49em; letter-spacing: -.04em; white-space: nowrap; }
.app-page .profile-identity > p:not(.eyebrow) { color: var(--sm-app-muted); font-size: 14px; line-height: 1.6; max-width: 600px; }
.app-page .profile-identity > div { max-width: 100%; }
.app-page .profile-identity code { color: #c0c0c7; font-size: 12px; }
.app-page .profile-identity i { color: #a1a1a9; border: 1px solid #44444c; border-radius: 2px; padding: 3px 5px; font: 10px var(--sm-app-mono); }
.app-page .profile-actions { min-width: 198px; }
.app-page .profile-hero:has(.sm-profile-art) .profile-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  border-top: 1px solid #2b2b30;
  padding-top: 20px;
  gap: 10px;
}
.app-page .profile-actions > small { color: #a1a1a9; font: 12px var(--sm-app-mono); }
.app-page .profile-actions > button { min-width: 170px; }
.sm-profile-art {
  grid-area: art;
  width: 218px;
  height: 192px;
  max-width: 100%;
  position: relative;
  overflow: hidden;
  pointer-events: none;
  border-left: 1px solid #ffffff13;
}
.sm-profile-art :is(canvas, svg),
.sm-result-art :is(canvas, svg) { width: 100%; height: 100%; display: block; }
.app-page .profile-lower-grid { gap: 18px; }
.app-page .token-data-panel dd.positive { color: #85caa6; }
.app-page .token-data-panel .profile-note { color: var(--sm-app-muted); font-size: 12px; line-height: 1.6; }

/* Chart information stays semantic: rising/ falling market colors are preserved. */
.app-page .trading-terminal-layout { gap: 18px; }
.app-page .trade-ledger-panel { background: var(--sm-app-panel); padding: 22px !important; }
.app-page .sim-stats { border-color: var(--sm-app-line); background: var(--sm-app-line); border-radius: 3px; gap: 1px; }
.app-page .sim-stats > div { background: #101012; padding: 18px 12px; }
.app-page .sim-stats span { color: var(--sm-app-muted); font: 11px/1.5 var(--sm-app-mono); }
.app-page .sim-stats b { color: var(--sm-app-white); font: 500 16px/1.45 var(--sm-app-mono); }
.app-page .sim-stats small { color: var(--sm-app-muted); font: 12px/1.5 var(--sm-app-mono); }
.app-page .closed-stat b { color: #ff7182; }
.app-page .trading-terminal-layout .profile-market > .panel-head button {
  color: #eeeeef;
  background: #19191c;
  border: 1px solid #484850;
  border-radius: 3px;
  min-height: 36px;
  font: 11px var(--sm-app-mono);
  padding: 8px;
}
.app-page .trading-terminal-layout .profile-market > .panel-head button:hover { border-color: #ad5b7e; }
.app-page .trading-terminal-layout .profile-market > .panel-head h2 { font-size: 12px; }
.app-page .dex-chart { background: #101012; border-color: #36363d; border-radius: 3px; }
.app-page .dex-chart-toolbar { color: #dddddf; border-color: #333339; }
.app-page .dex-chart-toolbar > strong { font-family: var(--sm-app-mono); font-weight: 500; font-size: 12px; }
.app-page .dex-chart-tabs button { color: #b0b0b9; border-radius: 2px; font-family: var(--sm-app-mono); }
.app-page .dex-chart-tabs button[aria-pressed="true"] { color: #fff; background: #303036; box-shadow: inset 0 -1px #df699b; }
.app-page .dex-chart-tabs button:hover { color: #fff; background: #26262c; }
.app-page .dex-chart-tabs button:focus-visible { outline-color: var(--sm-app-rose); }
.app-page .dex-chart-unit { color: var(--sm-app-muted); font: 12px var(--sm-app-mono); }
.app-page .dex-ohlc-readout { color: #bebec7; font-size: 12px; }
.app-page .dex-chart-surface > rect:first-child { fill: #101012; }
.app-page .dex-grid-line { stroke: #29292f; }
.app-page .dex-axis-line { stroke: #44444d; }
.app-page .dex-axis-text { fill: #b0b0ba; }
.app-page .dex-crosshair line { stroke: #bdbdc6; }
.app-page .dex-crosshair rect { fill: #44444c; }
.app-page .dex-chart-caption { color: var(--sm-app-muted); border-color: #33333b; }
.app-page .sim-tape { color: #b2b2ba; font: 12px/1.6 var(--sm-app-mono); gap: 14px; }
.app-page .market-rate-note { color: var(--sm-app-muted); font-size: 12px; }
.app-page .trade-ledger-card { background: #111113; border-color: #323238; border-radius: 3px; margin-bottom: 10px; }
.app-page .ledger-card-head > b { border: 1px solid #2d5843; background: #101a15; font: 12px var(--sm-app-mono); border-radius: 2px; }
.app-page .trade-ledger-card.sell .ledger-card-head > b { border-color: #693440; background: #1b1215; }
.app-page .ledger-card-head time,
.app-page .ledger-card-footer { color: #acacb5; font-size: 12px; }
.app-page .ledger-card-amounts { border-color: #2b2b31; }
.app-page .ledger-card-amounts small { color: #a6a6af; font-size: 11px; font-family: var(--sm-app-mono); }
.app-page .ledger-card-amounts strong { font-size: 12px; line-height: 1.5; }
.app-page .ledger-card-footer button { color: #dedee4; text-decoration: underline; text-decoration-color: #a64c74; text-underline-offset: 4px; }
.app-page .ledger-card-footer button:hover { color: #ffa0c7; }
.app-page .market-empty { color: var(--sm-app-muted); font-size: 13px; line-height: 1.7; }
.app-page .chart-wrap { border-radius: 3px; }
.app-page .reference-market-chart { border-radius: 3px !important; background: #101012 !important; }

/* Pool workspaces and support follow the same instrument language. */
.app-page .balance-box { border-radius: 3px; }
.app-page .balance-box :is(span, small) { color: var(--sm-app-muted); font: 12px/1.5 var(--sm-app-mono); }
.app-page .balance-box b { font-family: var(--sm-app-mono); }
.app-page .pair-inputs label input { border-radius: 3px 0 0 3px; }
.app-page .pair-inputs label b { background: #1c1c20; border-color: #44444c; border-radius: 0 3px 3px 0; font: 12px var(--sm-app-mono); }
.app-page .pair-inputs > button { background: #1c1c20; border-radius: 3px; border-color: #44444c; }
.app-page .market-metrics > div { background: #111113; border: 1px solid #2d2d33; border-radius: 3px; }
.app-page .market-metrics span { color: var(--sm-app-muted); font: 11px/1.5 var(--sm-app-mono); }
.app-page .market-metrics b { font-family: var(--sm-app-mono); line-height: 1.5; }
.app-page .swap-box { background: #111113; border-radius: 3px; border-color: #44444c; }
.app-page .swap-box > span { color: var(--sm-app-muted); font: 12px var(--sm-app-mono); }
.app-page .swap-box button { color: var(--sm-app-white); background: #29292e; border: 1px solid #777780; border-radius: 3px; font: 12px var(--sm-app-mono); }
.app-page .swap-box input { background: transparent; border: none; }
.app-page .swap-box.received em { background: #26262b; color: #dedee3; border-radius: 3px; font: 12px var(--sm-app-mono); }
.app-page .route-line { color: #a1a1a9; font: 12px/1.6 var(--sm-app-mono); }
.app-page .notice { line-height: 1.6; }
.app-page .empty-state { min-height: 420px; background-image: radial-gradient(#ffffff11 .6px, transparent .6px); background-size: 8px 8px; }
.app-page .empty-state p { color: var(--sm-app-muted); }
.app-page .coming-soon-card { border-radius: 5px; }
.app-page .faq-list article,
.app-page .support-chat { background: #0d0d0f; border-color: #35353d; border-radius: 4px; }
.app-page .faq-list article.open { border-color: #a34b71; background: #101012; }
.app-page .faq-list article p { color: var(--sm-app-muted); }

/* Dialogs retain the original buttons, order and payment details. */
.modal-backdrop { background: #000b; backdrop-filter: blur(10px); }
.modal-backdrop .modal {
  background: #0d0d0f;
  border: 1px solid #626269;
  border-top-color: #af587e;
  border-radius: 6px;
  box-shadow: 0 30px 100px #0009;
  padding: 34px;
}
.modal h2 { color: var(--sm-app-white); font-size: clamp(30px, 4vw, 48px); font-weight: 500; line-height: 1.08; letter-spacing: -.055em; overflow-wrap: anywhere; }
.modal .muted-copy { color: var(--sm-app-muted); font-size: 14px; line-height: 1.7; }
.modal .modal-close { background: #19191d; border-color: #57575e; border-radius: 3px; }
.modal :is(.deploy-orbit, .success-signal, .withdraw-icon) {
  color: #f0efec;
  background: #1a1a1e;
  border: 1px solid #8e8e96;
  border-radius: 50%;
  box-shadow: 0 0 0 5px #111113, 0 0 0 6px #44444b;
}
.modal .deploy-steps > div { border-color: #37373f; border-radius: 3px; }
.modal .deploy-steps > div.running { background: #19171a; border-color: #a14a70; }
.modal .deploy-steps :is(p, i) { color: #b0b0b9; font-family: var(--sm-app-mono); }
.modal .deploy-steps .running i { color: #f09ebf; }
.modal.launch-success-modal { width: min(600px, 100%); text-align: left; }
.sm-result-art {
  width: 100%;
  height: 190px;
  position: relative;
  overflow: hidden;
  margin-bottom: 25px;
  border: 1px solid #303037;
  border-radius: 3px;
  background: #09090b;
  pointer-events: none;
}
.launch-success-modal:has(.sm-result-art) .success-signal {
  width: 28px;
  height: 28px;
  margin: 0 0 16px;
  border-radius: 3px;
  border-color: #bd6790;
  box-shadow: none;
  background: #171418;
  font-size: 14px;
}
.modal .success-token { background: #111113; border: 1px solid #4b4b52; border-radius: 3px; align-items: center; padding: 19px 16px; }
.modal .success-token b { font: 500 24px/1.2 var(--sm-app-mono); letter-spacing: -.045em; overflow-wrap: anywhere; }
.modal .success-token code { color: #b4b4bd; font-size: 12px; }
.modal .demo-disclaimer { color: #a1a1a9; font-size: 12px; line-height: 1.6; }
dialog.payment-dialog {
  background: #0d0d0f;
  border: 1px solid #53535b;
  border-top-color: #b85780;
  border-radius: 6px;
  box-shadow: 0 30px 100px #000a;
  padding: 26px;
}
.payment-dialog::backdrop { background: #000c; backdrop-filter: blur(10px); }
.payment-dialog h2 { color: #f0efec; font: 500 16px/1.5 var(--sm-app-mono); letter-spacing: -.025em; padding-right: 15px; }
.payment-dialog .payment-close { color: #bbbbc3; min-width: 32px; min-height: 32px; top: 14px; right: 16px; }
.payment-dialog .payment-lock { background: #eeeeed; color: #121214; border-radius: 3px; box-shadow: none; }
.payment-dialog .payment-caption { color: #b2b2bb; font: 12px var(--sm-app-mono); }
.payment-dialog .payment-amount { font-family: var(--sm-app-mono); font-weight: 500; letter-spacing: -.065em; font-size: 30px; }
.payment-dialog.payment-address-step .payment-amount { font-size: 24px; }
.payment-dialog .payment-expiry { color: #bcbcc4; font-weight: 400; }
.payment-dialog .payment-expiry span { color: #df79a4; }
.payment-dialog .payment-expiry time { color: #f0efec; }
.payment-dialog .payment-step label { color: #bbbbc4; font: 12px/1.5 var(--sm-app-mono); }
.payment-dialog .payment-address { color: #e0e0e5; border: 1px solid #55555d; background: #151517; border-radius: 3px; font-size: 12px; }
.payment-dialog .payment-qr { border-radius: 3px; }
.payment-dialog .payment-qr-note,
.payment-dialog .payment-footnote,
.payment-dialog .payment-message { color: #a8a8b1; }
.payment-dialog .payment-copy { color: #b7b7c0; }
.payment-dialog .payment-back { color: #d7d7dd; font-size: 12px; font-family: var(--sm-app-mono); text-decoration: underline; text-underline-offset: 4px; }
.payment-dialog .payment-status { border-radius: 3px; background: #191714; border-color: #6c5d3e; color: #e1bb74; }
.payment-dialog .payment-status small { color: #b6b4b0; }
.payment-dialog .payment-feedback { color: #c9c9d1; }

/* Help and workspace finishing: reuse the same geometry as the launch form. */
.app-page .panel-head > div,
.app-page .support-grid > *,
.app-page .messages > div,
.app-page .sim-stats > div { min-width: 0; }
.app-page .sim-stats b { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.app-page .support-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.app-page .chat-panel { padding: 26px; top: 110px; }
.app-page .chat-panel .messages {
  background: #09090b;
  border: 1px solid var(--sm-app-line);
  border-radius: 3px;
  padding: 14px;
  scrollbar-gutter: stable;
}
.app-page .messages > div { grid-template-columns: 30px minmax(0, 1fr); }
.app-page .messages span {
  width: 30px;
  height: 30px;
  color: #111113;
  background: #e7e6e3;
  border: 1px solid #e7e6e3;
  border-radius: 3px;
  font: 500 10px var(--sm-app-mono);
}
.app-page .messages .user span { background: #1c1c20; color: #c4c4cb; border-color: #414148; }
.app-page .messages p {
  background: #151518;
  border: 1px solid #2c2c32;
  border-radius: 3px;
  color: #b8b8c1;
  padding: 11px 12px;
  font-size: 13px;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.app-page .messages .user p { background: #191619; border-color: #624050; color: #e2dfe3; }
.app-page .chat-panel form input { flex: 1 1 auto; min-width: 0; }
.app-page .chat-panel form button {
  flex: 0 0 48px;
  min-width: 48px;
  border: 1px solid #e7e6e3;
  border-radius: 3px;
  background: #e7e6e3;
  color: #111113;
  transition: background .2s, border-color .2s;
}
.app-page .chat-panel form button:hover { background: #fff; border-color: var(--sm-app-rose); }
.app-page .faq-list article { transition: border-color .2s, background .2s; }
.app-page .faq-list button { grid-template-columns: 28px minmax(0, 1fr) 20px; gap: 12px; padding: 21px 16px; }
.app-page .faq-list button b { font-size: 14px; line-height: 1.6; font-weight: 500; }
.app-page .faq-list button :is(span, i) { font: 12px/1.5 var(--sm-app-mono); color: #a0a0ab; }
.app-page .faq-list button i { text-align: center; }
.app-page .faq-list article > p { margin: 0 48px 22px 56px; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.app-page .faq-list article:focus-within { border-color: #a34b71; }
.app-page .faq-list button:focus-visible { outline-offset: -4px; }
.app-page .primary:disabled:hover { background: #f0efec; border-color: #f0efec; transform: none; }
.app-page .ghost:disabled:hover { background: #111113; border-color: #45454c; }
.app-page .primary:disabled:hover span { transform: none; }

@media (max-width: 1080px) {
  .app-page .terminal-grid { grid-template-columns: minmax(0, 1.35fr) minmax(280px, .7fr); }
  .app-page :is(.form-panel, .logo-panel, .extras-panel, .authority-panel, .summary-panel, .pool-builder, .swap-panel, .token-data-panel, .market-simulation) { padding: 22px; }
  .app-page .authority-cards { grid-template-columns: 1fr; }
  .app-page .authority-cards button { min-height: 0; }
  .app-page .authority-cards p { min-height: 0; margin: 10px 0; }
  .app-page .profile-hero:has(.sm-profile-art) { grid-template-columns: 68px minmax(0, 1fr) 174px; gap: 22px; }
  .app-page .profile-token-mark { width: 68px; height: 68px; font-size: 21px; }
  .sm-profile-art { width: 174px; height: 166px; }
}

@media (max-width: 1000px) {
  .app-page .terminal-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 900px) {
  .site-shell .app-page { width: calc(100% - 40px); }
  .app-page .terminal-grid { grid-template-columns: minmax(0, 1fr); }
  .app-page :is(.form-panel, .logo-panel, .extras-panel, .authority-panel, .summary-panel) { grid-area: auto / 1; position: static; }
  .app-page .summary-panel { width: 100%; }
  .app-page .authority-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .app-page .profile-hero { padding: 24px; }
  .app-page .trading-terminal-layout { grid-template-columns: minmax(0, 1fr); }
  .app-page.token-profile-page > .profile-lower-grid { max-width: none; }
  .app-page .trade-ledger-list { height: 420px; }
}

@media (max-width: 820px) {
  .app-page .support-grid { grid-template-columns: minmax(0, 1fr); }
  .app-page .chat-panel { position: static; }
}

@media (max-width: 640px) {
  .site-shell .app-page { width: calc(100% - 28px); padding-top: 140px; padding-bottom: 62px; }
  .app-page .page-title { margin-bottom: 30px; }
  .app-page :is(input, textarea, select) { font-size: 16px; }
  .app-page .simulation-fields.integrated-bot-fields input,
  .app-page .reference-bot-fields input { font-size: 16px !important; }
  .app-page .chat-panel { padding: 20px 17px; }
  .app-page .chat-panel .messages { padding: 10px; }
  .app-page .messages > div { grid-template-columns: 27px minmax(0, 1fr); gap: 7px; }
  .app-page .messages span { width: 27px; height: 27px; font-size: 9px; }
  .app-page .faq-list button { padding-inline: 13px; gap: 10px; grid-template-columns: 24px minmax(0, 1fr) 18px; }
  .app-page .faq-list article > p { margin-left: 47px; margin-right: 22px; }
  .app-page .page-title h1 { font-size: clamp(36px, 9.8vw, 52px); }
  .app-page .page-title > p:last-child { font-size: 14px; margin-top: 17px; }
  .app-page .split-title { display: grid; gap: 22px; }
  .app-page .balance-box { min-width: 0; }
  .app-page :is(.form-panel, .logo-panel, .extras-panel, .authority-panel, .summary-panel, .pool-builder, .swap-panel, .token-data-panel, .market-simulation) { padding: 20px 17px; }
  .app-page .panel-head { gap: 10px; margin-bottom: 22px; padding-bottom: 18px; }
  .app-page .panel-head > i { max-width: 84px; font-size: 10px; }
  .app-page .panel-head p { font-size: 12px; }
  .app-page .field-row,
  .app-page .integrated-bot-fields .field-row,
  .app-page .reference-bot-fields .field-row,
  .app-page .liquidity-option,
  .app-page .authority-cards,
  .app-page .liquidity-layout { grid-template-columns: minmax(0, 1fr); }
  .app-page .paid-option-head { grid-template-columns: 42px minmax(0, 1fr); gap: 10px; }
  .app-page .paid-option-head > b { grid-column: 2; margin-top: -4px; }
  .app-page .paid-option.enabled { padding: 18px 14px; }
  .app-page .paid-option:has(.integrated-bot-fields),
  .app-page .paid-option:has(.reference-bot-fields) { padding: 18px 14px !important; }
  .app-page .option-fields,
  .app-page .paid-option > p { margin-left: 0; }
  .app-page .option-title { font-size: 13px; }
  .app-page .authority-cards button { padding: 17px; }
  .app-page .authority-cards button > span { align-items: center; }
  .app-page .authority-cards p { margin: 10px 0; }
  .app-page .logo-drop { min-height: 236px; }
  .app-page .generate-button { display: flex; gap: 10px; justify-content: space-between; align-items: center; font-size: 11px; }
  .app-page .generate-button span { float: none; white-space: nowrap; }
  .app-page .profile-hero,
  .app-page .profile-hero:has(.sm-profile-art) {
    grid-template-columns: 60px minmax(0, 1fr);
    grid-template-areas: "mark identity" "art art" "actions actions";
    gap: 22px 17px;
    padding: 24px 18px;
    text-align: left;
  }
  .app-page .profile-token-mark { width: 60px; height: 60px; margin: 0; }
  .app-page .profile-identity h1 { font-size: 29px; }
  .app-page .profile-identity h1 span { display: block; margin-top: 8px; font-size: 16px; }
  .app-page .profile-identity > p:not(.eyebrow) { font-size: 13px; }
  .app-page .profile-identity > div { justify-content: flex-start; }
  .app-page .profile-identity code { max-width: min(180px, 100%); }
  .sm-profile-art { width: 100%; height: 160px; border-left: 0; border-top: 1px solid #ffffff13; border-bottom: 1px solid #ffffff13; }
  .app-page .profile-hero:has(.sm-profile-art) .profile-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding-top: 0; border-top: 0; gap: 10px; }
  .app-page .profile-actions > button { min-width: 0; font-size: 10px; padding: 12px 7px; }
  .app-page .profile-actions > small { grid-column: 1 / -1; }
  .app-page .trading-terminal-layout .sim-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-page .trading-terminal-layout .sim-stats > div { padding: 14px 10px; }
  .app-page .trading-terminal-layout .sim-stats b { font-size: 14px; }
  .app-page .trading-terminal-layout .profile-market > .panel-head { gap: 8px; }
  .app-page .trading-terminal-layout .profile-market > .panel-head h2 { font-size: 11px; }
  .app-page .trading-terminal-layout .profile-market > .panel-head button { font-size: 10px; min-height: 36px; padding: 7px; }
  .app-page .dex-chart-surface { height: 305px; }
  .app-page .dex-chart-toolbar { gap: 9px; padding: 10px 9px; }
  .app-page .dex-chart-toolbar > strong { font-size: 11px; }
  .app-page .dex-chart-unit { font-size: 11px; }
  .app-page .dex-ohlc-readout { padding-inline: 9px; font-size: 11px; }
  .app-page .trade-ledger-panel { padding: 20px 17px !important; }
  .app-page .sim-tape { font-size: 11px; }
  .app-page .market-metrics { grid-template-columns: minmax(0, 1fr); }
  .app-page .pair-inputs { grid-template-columns: minmax(0, 1fr); }
  .app-page .pair-inputs > button { justify-self: center; }
  .app-page .swap-panel { position: static; }
  .modal-backdrop { padding: 14px; }
  .modal-backdrop .modal { padding: 23px 19px; max-height: calc(100dvh - 28px); }
  .modal h2 { font-size: 34px; }
  .sm-result-art { height: 170px; }
  .modal .success-token { gap: 12px; flex-wrap: wrap; }
  .modal .success-token b { font-size: 22px; }
  dialog.payment-dialog { padding: 24px 20px; }
}

@media (max-width: 380px) {
  .app-page .profile-identity .eyebrow { letter-spacing: .07em; font-size: 10px; }
  .app-page .profile-identity h1 { font-size: 26px; }
  .app-page .profile-hero:has(.sm-profile-art) { gap: 18px 14px; grid-template-columns: 50px minmax(0, 1fr); padding-inline: 15px; }
  .app-page .profile-token-mark { width: 50px; height: 50px; font-size: 17px; }
  .payment-dialog.payment-address-step .payment-amount { font-size: 21px; }
  .app-page .total b { font-size: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  .app-page,
  .app-page *,
  .modal *,
  .payment-dialog * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Temporary free testing is explicit and separate from real payment receipts. */
.mb-preview-banner{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 auto;padding:11px 24px;border-bottom:1px solid #ef79ad22;background:#ef79ad07;color:#aaa1af;font:11px/1.5 monospace}
.mb-preview-banner>span,.mb-preview-tag{color:#f1b0cd;font:10px/1.3 monospace;letter-spacing:.09em;white-space:nowrap}
.mb-preview-banner p{margin:0}
.mb-preview-options{padding:17px 0 19px;border-top:1px solid #ffffff12}
.mb-preview-options label{display:block;margin:12px 0 9px;color:#e7dce7;font:11px/1.5 monospace}
.mb-preview-options input{width:100%;box-sizing:border-box;border:1px solid #ef79ad44;border-radius:8px;background:#09090b;color:#f7eff5;padding:12px 13px;font:20px/1.2 monospace;font-variant-numeric:tabular-nums}
.mb-preview-options input:focus-visible,.mb-preview-presets button:focus-visible{outline:2px solid #ef79ad;outline-offset:3px}
.mb-preview-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-top:9px}
.mb-preview-presets button{border:1px solid #ffffff13;border-radius:5px;background:transparent;color:#b5a4b4;padding:8px 3px;font:9px monospace;white-space:nowrap}
.mb-preview-presets button[aria-pressed=true]{color:#f4d6e5;border-color:#ef79ad66;background:#ef79ad0a}
.mb-preview-options p{margin:10px 0 0;color:#8e8495;font:10px/1.65 monospace}
.mb-preview-options .mb-preview-error{color:#ef9dab}
@media(max-width:600px){.mb-preview-banner{align-items:flex-start;gap:10px;padding:10px 18px;font-size:9px}.mb-preview-banner>span{margin-top:2px;font-size:9px}}

/* Profile begins just below the fixed navigation; duplicate test notices are omitted. */
.site-shell .app-page.token-profile-page { padding-top: 124px; }
@media (max-width: 820px) {
  .site-shell .app-page.token-profile-page { padding-top: 110px; }
}
@media (max-width: 620px) {
  .site-shell .app-page.token-profile-page { padding-top: 141px; }
}

/* mintbyte-custom-links-v1 */
.app-page .mb-link-fields { display: grid; gap: 14px; min-width: 0; }
.app-page .mb-link-list { display: grid; gap: 14px; min-width: 0; }
.app-page .mb-link-row { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.3fr) 40px; gap: 8px; align-items: end; }
.app-page .mb-link-row label { display: grid; gap: 7px; min-width: 0; }
.app-page .mb-link-row label > span { color: var(--sm-app-muted,#a0a0a7); font: 10px/1.4 var(--sm-app-mono,monospace); letter-spacing: .03em; }
.app-page .mb-link-row input { box-sizing: border-box; width: 100%; min-width: 0; height: 42px; padding: 10px; border-radius: 3px; font-size: 12px; }
.app-page .mb-link-remove { box-sizing: border-box; height: 42px; width: 40px; padding: 0; border: 1px solid var(--sm-app-line-bright,#444); border-radius: 3px; background: #18181b; color: #b9b9c0; font: 24px/1 sans-serif; cursor: pointer; }
.app-page .mb-link-remove:hover { color: #f6c6d9; border-color: #a95378; background: #241a20; }
.app-page .mb-link-add { display: inline-flex; justify-self: start; align-items: center; gap: 9px; min-height: 40px; padding: 8px 14px; border: 1px dashed #89556d; border-radius: 3px; background: #191419; color: #f1d5e2; font: 12px/1.5 var(--sm-app-mono,monospace); cursor: pointer; }
.app-page .mb-link-add > span { font: 21px/1 sans-serif; }
.app-page .mb-link-add:hover { background: #291b24; border-color: #cf82a5; }
.app-page .mb-link-add:focus-visible,.app-page .mb-link-remove:focus-visible { outline: 2px solid #db95b5; outline-offset: 3px; }
.app-page .mb-link-error { margin: 0; color: #f0a7bf; font-size: 12px; line-height: 1.6; }
.app-page .mb-link-empty { margin: 0; color: #a0a0a7; font-size: 12px; }
@media(max-width:560px){
 .app-page .mb-link-row { grid-template-columns: minmax(0,1fr) 40px; gap: 8px; padding-bottom: 14px; border-bottom: 1px solid #303036; }
 .app-page .mb-link-name { grid-column: 1 / -1; }
 .app-page .mb-link-url { grid-column: 1; }
 .app-page .mb-link-remove { grid-column: 2; }
}