/* ============================================================
   MOBILE PENTHOUSE — v2-mobile.css (2026-08-09)
   Loaded by index.html, active ONLY under html.v2m (the mobile
   adapter adds the class after MobileDetect.isMobile()).
   The desktop Penthouse (html.v2 without v2m) is untouched.

   Tokens come from v2.css (--v2-*) — defined on the static
   html.v2 class, light overrides on body.light-theme, so both
   themes flow through automatically.
   ============================================================ */

/* ---- app frame ---- */
html.v2m, html.v2m body {
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}
html.v2m body { background: var(--v2-bg0) !important; }
html.v2m .v2m-app {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: var(--v2-bg0);
  color: var(--v2-text);
  font-family: 'IBM Plex Sans', ui-sans-serif, system-ui, -apple-system, sans-serif;
  z-index: 100;
  padding-top: env(safe-area-inset-top);
}

/* ---- V1 chrome hidden under the mobile shell (nodes stay ALIVE:
   the SSE/polls keep updating them; we only remove them from view) ---- */
html.v2m .sidebar,
html.v2m .sidebar-collapse-btn,
html.v2m .wrap > header,
html.v2m .mobile-drawer,
html.v2m .mobile-drawer-overlay,
html.v2m .mobile-panel-toggle,
html.v2m #xt-active-trading-bar,
html.v2m .xt-fab,
html.v2m #xt-quick-replies { display: none !important; }
/* (#xt-tutorial-overlay was in the sweep above until 2026-08-11 — mobile
   now HAS the tutorial: the ask card's Yes opens it, styled below.) */

/* ---- TUTORIAL on mobile (Michael 2026-08-11, v2) ----
   The MENU stays PORTRAIT, fitted to the phone: video list on top,
   16:9 player below. Pressing PLAY hands the video to the NATIVE
   fullscreen player (app-ui.js _tutEnterMobileFullscreen) — large,
   landscape-capable on every phone. While a tutorial video is playing,
   the html.v2m-video-active class suppresses the no-landscape overlay
   so rotating the phone to watch is allowed for THIS case only. */
html.v2m .xt-tutorial-overlay { padding: 0 !important; }
html.v2m .xt-tutorial-modal {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 0 !important;
  flex-direction: column !important;
}
html.v2m .xt-tutorial-side {
  width: 100% !important;
  flex: none !important;
  min-width: 0 !important;
  border-right: none !important;
  padding: 14px 16px 10px !important;
}
html.v2m .xt-tutorial-main {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
html.v2m .xt-tutorial-player {
  aspect-ratio: 16 / 9;
  width: 100% !important;
  flex: none !important;
}
html.v2m .xt-tutorial-player video { width: 100%; height: 100%; object-fit: contain; }
/* video playing => the landscape blocker stands down (this case only) */
html.v2m.v2m-video-active body.is-mobile .mobile-landscape-overlay { display: none !important; }

/* ---- top bar ---- */
html.v2m .v2m-top {
  flex: none;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px 14px 8px;
  border-bottom: 1px solid var(--v2-line);
  background: var(--v2-bg0);
}
html.v2m .v2m-brand { font-family: var(--v2-serif, Georgia, serif); font-weight: 700; font-size: 16px; }
html.v2m .v2m-chip { font-size: 8px; letter-spacing: 0.12em; color: var(--v2-gold); border: 1px solid var(--v2-gold); border-radius: 4px; padding: 1.5px 5px; font-weight: 700; }
html.v2m .v2m-mkt { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; letter-spacing: 0.08em; color: var(--v2-muted); margin-left: 2px; font-weight: 600; }
html.v2m .v2m-mkt .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--v2-faint); }
html.v2m .v2m-mkt .dot.open { background: var(--v2-gain); }
html.v2m .v2m-equity {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--v2-gold-dim);
  border: 1px solid var(--v2-gold);
  border-radius: 9px;
  padding: 4px 10px;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 12.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
html.v2m .v2m-equity .lbl { font-family: 'IBM Plex Sans', sans-serif; font-size: 8.5px; letter-spacing: 0.1em; color: var(--v2-gold); font-weight: 700; }

/* ---- body + screens ---- */
html.v2m .v2m-body { flex: 1; min-height: 0; position: relative; }
html.v2m .v2m-screen {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 14px;
  display: none;
  scrollbar-width: none;
}
html.v2m .v2m-screen::-webkit-scrollbar { display: none; }
/* which screen shows = data-tab on the app root */
html.v2m .v2m-app[data-tab="markets"] #v2m-s-markets,
html.v2m .v2m-app[data-tab="trade"] #v2m-s-panel,
html.v2m .v2m-app[data-tab="portfolio"] #v2m-s-panel,
html.v2m .v2m-app[data-tab="account"] #v2m-s-panel,
html.v2m .v2m-app[data-tab="bill"] #v2m-s-bill { display: block; }
html.v2m .v2m-app[data-tab="bill"] #v2m-s-bill { display: flex; flex-direction: column; }

html.v2m .v2m-seclabel {
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--v2-faint);
  font-weight: 700;
  padding: 14px 14px 8px;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
html.v2m .v2m-seclabel .sub { margin-left: auto; font-weight: 500; letter-spacing: 0.02em; text-transform: none; font-size: 10.5px; }

/* ============================================================
   MARKETS — Breakout Radar rail + watchlist
   ============================================================ */
/* the two V1 trending lists become one horizontal chip rail */
html.v2m .v2m-radar {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 14px 6px;
  scrollbar-width: none;
}
html.v2m .v2m-radar::-webkit-scrollbar { display: none; }
html.v2m .v2m-radar .trending-list { display: contents; }
html.v2m .v2m-radar .trending-empty { color: var(--v2-faint); font-size: 11px; padding: 8px 0; }
html.v2m .v2m-radar .trending-ticker {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-radius: 12px;
  padding: 8px 12px;
  border: 1.5px solid var(--v2-line-strong);
  background: var(--v2-bg1);
  min-width: 92px;
  position: relative;
}
html.v2m .v2m-radar .trending-rank,
html.v2m .v2m-radar .trending-atr,
html.v2m .v2m-radar .trending-launch-arrow { display: none !important; }
html.v2m .v2m-radar .trending-symbol { font-weight: 700; font-size: 14px; color: var(--v2-text); }
html.v2m .v2m-radar .trending-symbol-row { display: flex; align-items: center; gap: 6px; }
html.v2m .v2m-radar .trending-score {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12.5px;
  font-weight: 600;
}
html.v2m .v2m-radar .trending-score.long { color: var(--v2-gain); }
html.v2m .v2m-radar .trending-score.short { color: var(--v2-loss); }
html.v2m .v2m-radar .trending-row-bullish { border-color: var(--v2-gain); background: var(--v2-gain-dim); animation: v2mBreathe 2.6s ease-in-out infinite; }
html.v2m .v2m-radar .trending-row-bearish { border-color: var(--v2-loss); background: var(--v2-loss-dim); }
@keyframes v2mBreathe {
  0%, 100% { box-shadow: 0 0 0 0 rgba(47, 191, 113, 0); }
  50% { box-shadow: 0 0 0 4px var(--v2-gain-dim); }
}
@media (prefers-reduced-motion: reduce) { html.v2m .v2m-radar .trending-row-bullish { animation: none; } }

/* watchlist rows (V1 markup, decorated by the adapter) — FLAT list rows,
   every V1 card affordance (bg, border, radius, padding) neutralized */
html.v2m .v2m-wl-slot .watchlist-list { display: block; }
html.v2m .v2m-wl-slot .watchlist-row {
  display: grid !important;
  grid-template-columns: 8px minmax(0, 1fr) 64px 84px;
  gap: 11px;
  align-items: center;
  padding: 11px 14px !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--v2-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: 0 !important;
  cursor: pointer;
}
html.v2m .v2m-wl-slot .watchlist-row:active { background: var(--v2-bg1) !important; }
html.v2m .v2m-wl-slot .trending-launch-arrow { display: none !important; }
html.v2m .v2m-wl-slot .v2m-wdot { width: 7px; height: 7px; border-radius: 50%; background: var(--v2-faint); opacity: 0.4; }
html.v2m .v2m-wl-slot .v2m-wdot.g { background: var(--v2-gain); opacity: 1; animation: v2mBreathe 2.6s ease-in-out infinite; }
html.v2m .v2m-wl-slot .v2m-wdot.r { background: var(--v2-loss); opacity: 1; }
html.v2m .v2m-wl-slot .watchlist-name-wrap { display: block !important; min-width: 0; }
html.v2m .v2m-wl-slot .watchlist-symbol {
  display: inline !important;
  font-weight: 700 !important;
  font-size: 14.5px !important;
  color: var(--v2-text) !important;
  letter-spacing: 0.01em;
}
html.v2m .v2m-wl-slot .v2m-ai { display: inline-block; margin-left: 6px; vertical-align: 2px; }
html.v2m .v2m-wl-slot .watchlist-name {
  display: block !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  color: var(--v2-faint) !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0 !important;
}
html.v2m .v2m-wl-slot .v2m-spark { width: 64px; height: 24px; }
html.v2m .v2m-wl-slot .v2m-px { text-align: right; }
html.v2m .v2m-wl-slot .watchlist-price { font-family: 'IBM Plex Mono', monospace; font-size: 14px; font-weight: 600; display: block; font-variant-numeric: tabular-nums; }
html.v2m .v2m-wl-slot .v2m-chg { font-family: 'IBM Plex Mono', monospace; font-size: 11px; font-weight: 600; }
html.v2m .v2m-up { color: var(--v2-gain); }
html.v2m .v2m-down { color: var(--v2-loss); }

/* ============================================================
   TICKER SHEET
   ============================================================ */
html.v2m .v2m-scrim {
  position: absolute;
  inset: 0;
  background: var(--v2-scrim, rgba(10, 10, 12, 0.55));
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 140;
}
html.v2m .v2m-scrim.on { opacity: 1; pointer-events: auto; }
html.v2m .v2m-sheet {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  background: var(--v2-bg1);
  border-radius: 22px 22px 0 0;
  border-top: 1px solid var(--v2-line-strong);
  padding: 10px 18px calc(18px + env(safe-area-inset-bottom));
  transform: translateY(108%);
  /* closed: fully inert — the translated-away sheet must never eat taps
     meant for the tab bar below the body (found by the first live probe) */
  pointer-events: none;
  visibility: hidden;
  transition: transform 0.25s cubic-bezier(0.2, 0.9, 0.3, 1), visibility 0s 0.25s;
  z-index: 141;
}
html.v2m .v2m-sheet.on {
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
  transition: transform 0.25s cubic-bezier(0.2, 0.9, 0.3, 1);
}
html.v2m .v2m-grab { width: 36px; height: 4px; border-radius: 2px; background: var(--v2-line-strong); margin: 0 auto 12px; }
html.v2m .v2m-sh-head { display: flex; align-items: baseline; gap: 8px; }
html.v2m .v2m-sh-head b { font-size: 19px; }
html.v2m .v2m-sh-head .nm { color: var(--v2-faint); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.v2m .v2m-sh-price { display: flex; align-items: baseline; gap: 10px; margin: 6px 0 2px; }
html.v2m .v2m-sh-price .p { font-family: 'IBM Plex Mono', monospace; font-size: 30px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
html.v2m .v2m-sh-price .c { font-family: 'IBM Plex Mono', monospace; font-size: 14px; font-weight: 600; }
html.v2m .v2m-sh-chart { margin: 8px -4px 4px; }
html.v2m .v2m-sh-chart svg { width: 100%; height: 92px; display: block; }
html.v2m .v2m-sh-stats {
  display: flex;
  border-top: 1px dashed var(--v2-line-strong);
  border-bottom: 1px dashed var(--v2-line-strong);
  margin: 8px 0 14px;
}
html.v2m .v2m-sh-stats > div { flex: 1; padding: 8px 0; text-align: center; }
html.v2m .v2m-sh-stats .k { font-size: 9px; letter-spacing: 0.1em; color: var(--v2-faint); text-transform: uppercase; font-weight: 700; }
html.v2m .v2m-sh-stats .v { font-family: 'IBM Plex Mono', monospace; font-size: 13px; font-weight: 600; margin-top: 1px; }
html.v2m .v2m-sh-ask {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 44px;
  border-radius: 12px;
  border: 1.5px solid var(--v2-gold);
  color: var(--v2-gold);
  font-weight: 700;
  font-size: 14px;
  background: var(--v2-gold-dim);
  margin-bottom: 10px;
  font-family: inherit;
  cursor: pointer;
}
html.v2m .v2m-sh-btns { display: flex; gap: 10px; }
html.v2m .v2m-bigbtn {
  flex: 1;
  height: 52px;
  border-radius: 14px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.04em;
  border: none;
  font-family: inherit;
  cursor: pointer;
}
html.v2m .v2m-bigbtn.long { background: var(--v2-gain); color: #fff; }
html.v2m .v2m-bigbtn.short { background: transparent; color: var(--v2-loss); border: 2px solid var(--v2-loss); }

/* ============================================================
   PANEL SCREEN (Trade / Portfolio / Account share #xt-right-panel)
   ============================================================ */
/* neutralize the V1 overlay panel: it becomes an in-flow block */
html.v2m #xt-right-panel {
  position: static !important;
  transform: none !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 0 !important;
  z-index: auto !important;
}
html.v2m #xt-right-panel .right-panel-collapse-btn,
html.v2m #xt-right-panel .xt-panel-header-close,
html.v2m .xt-right-panel-header .panel-close-btn { display: none !important; }
html.v2m #xt-panel-content { padding: 0 14px 20px !important; }
/* ANDROID SCROLL FIX (2026-09-02, S26 Ultra report — deposit page would
   not scroll): inside the shell the SCREEN (#v2m-s-panel) is the one
   scroller. V1 gives .xt-right-panel-content overflow-y:auto +
   overscroll-behavior:contain; re-parented here its height is auto so it
   can never scroll itself, and on Android Chrome/Samsung Internet a touch
   that starts inside a NON-scrollable 'contain' container is swallowed
   instead of chaining to the screen. Flatten it — it must not be a scroll
   container in the shell at all. */
html.v2m #xt-panel-content,
html.v2m .xt-right-panel-content {
  overflow: visible !important;
  overscroll-behavior: auto !important;
  flex: none !important;
  height: auto !important;
  max-height: none !important;
}
html.v2m #xt-right-panel { overflow: visible !important; }
/* V1 inner lists keep their own scroll, but at their boundary (or when
   they don't overflow) the gesture must chain to the screen on mobile */
html.v2m #xt-panel-content .rp-positions-scroll,
html.v2m #xt-panel-content .xt-stock-list,
html.v2m #xt-panel-content .xt-preset-list {
  overscroll-behavior: auto !important;
}
html.v2m #xt-panel-content .rp-section {
  background: transparent !important;
  border: none !important;
  padding: 12px 0 !important;
}

/* --- TRADE mode: big ticket --- */
html.v2m .v2m-app[data-tab="trade"] .sidebar-trade-field input,
html.v2m .v2m-app[data-tab="trade"] .sidebar-trade-row input {
  font-size: 17px !important;
  height: 44px !important;
}
html.v2m .sidebar-trade-grid { gap: 10px !important; }
html.v2m .sidebar-trade-field { background: var(--v2-bg1) !important; border: 1px solid var(--v2-line-strong) !important; border-radius: 13px !important; }
/* V1's twin LONG/SHORT buttons hide only once the injected ticket is live */
html.v2m .v2m-ticket-ready .sidebar-trade-buttons { display: none !important; }
html.v2m .v2m-seg {
  display: flex;
  margin: 12px 0 0;
  background: var(--v2-bg2);
  border-radius: 12px;
  padding: 4px;
}
html.v2m .v2m-seg button {
  flex: 1;
  height: 40px;
  border-radius: 9px;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: 0.05em;
  color: var(--v2-faint);
  border: none;
  background: none;
  font-family: inherit;
}
html.v2m .v2m-seg button.on-long { background: var(--v2-gain); color: #fff; }
html.v2m .v2m-seg button.on-short { background: var(--v2-loss); color: #fff; }
html.v2m .v2m-chips { display: flex; gap: 8px; margin: 8px 0 0; }
html.v2m .v2m-chips button {
  flex: 1;
  height: 34px;
  border-radius: 10px;
  border: 1px solid var(--v2-line-strong);
  background: transparent;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--v2-muted);
}
html.v2m .v2m-chips button.on { border-color: var(--v2-gold); background: var(--v2-gold-dim); color: var(--v2-text); }
html.v2m .v2m-confirm {
  display: block;
  width: 100%;
  height: 56px;
  margin: 16px 0 0;
  border-radius: 16px;
  font-size: 15.5px;
  font-weight: 800;
  letter-spacing: 0.03em;
  color: #fff;
  background: var(--v2-gain);
  border: none;
  font-family: inherit;
  box-shadow: 0 8px 24px var(--v2-gain-dim);
}
html.v2m .v2m-confirm.short { background: var(--v2-loss); box-shadow: 0 8px 24px var(--v2-loss-dim); }
html.v2m .v2m-fineprint { text-align: center; color: var(--v2-faint); font-size: 10.5px; margin: 10px 0 0; }

/* positions list under the ticket / in portfolio — reuse V1 cards, flat rows */
html.v2m .rp-pos-card {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--v2-line) !important;
  border-radius: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* --- PORTFOLIO mode: hide the ticket, show equity card + positions --- */
html.v2m .v2m-app[data-tab="portfolio"] .rp-section:has(.sidebar-trade-grid),
html.v2m .v2m-app[data-tab="portfolio"] .rp-actions,
html.v2m .v2m-app[data-tab="portfolio"] .v2m-ticket,
html.v2m .v2m-app[data-tab="trade"] #v2m-equity-card { display: none !important; }
html.v2m #v2m-equity-card {
  margin: 12px 14px 0;
  background: var(--v2-bg1);
  border: 1px solid var(--v2-line);
  border-radius: 16px;
  padding: 16px;
}
html.v2m #v2m-equity-card .lbl { font-size: 9.5px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--v2-faint); font-weight: 700; display: flex; align-items: center; gap: 7px; }
html.v2m #v2m-equity-card .lbl .live { width: 6px; height: 6px; border-radius: 50%; background: var(--v2-gain); animation: v2mBreathe 2.6s ease-in-out infinite; }
html.v2m #v2m-equity-card .big { font-family: 'IBM Plex Mono', monospace; font-size: 32px; font-weight: 600; letter-spacing: -0.02em; margin: 4px 0 2px; font-variant-numeric: tabular-nums; }
html.v2m #v2m-equity-card .day { font-family: 'IBM Plex Mono', monospace; font-size: 13px; font-weight: 600; }
html.v2m #v2m-equity-card .rows { display: flex; margin-top: 12px; border-top: 1px dashed var(--v2-line-strong); padding-top: 10px; }
html.v2m #v2m-equity-card .rows > div { flex: 1; }
html.v2m #v2m-equity-card .k { font-size: 9px; letter-spacing: 0.1em; color: var(--v2-faint); text-transform: uppercase; font-weight: 700; }
html.v2m #v2m-equity-card .v { font-family: 'IBM Plex Mono', monospace; font-size: 13.5px; font-weight: 600; margin-top: 1px; font-variant-numeric: tabular-nums; }

/* --- ACCOUNT mode: deposit panel restyle + account rows --- */
html.v2m .v2m-app[data-tab="account"] .xt-deposit-types { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
html.v2m .v2m-app[data-tab="account"] .xt-deposit-type-tile {
  background: var(--v2-bg1) !important;
  border: 1px solid var(--v2-line-strong) !important;
  border-radius: 14px !important;
  padding: 13px 14px !important;
}
html.v2m #v2m-acct-rows {
  margin: 16px 14px 0;
  background: var(--v2-bg1);
  border: 1px solid var(--v2-line);
  border-radius: 14px;
  overflow: hidden;
}
html.v2m #v2m-acct-rows button {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 15px;
  border: none;
  border-bottom: 1px solid var(--v2-line);
  font-size: 13.5px;
  width: 100%;
  text-align: left;
  background: none;
  color: var(--v2-text);
  font-family: inherit;
}
html.v2m #v2m-acct-rows button:last-child { border-bottom: none; }
html.v2m #v2m-acct-rows .chev { margin-left: auto; color: var(--v2-faint); }
html.v2m #v2m-signed { text-align: center; color: var(--v2-faint); font-size: 11px; margin: 14px 0 4px; }
html.v2m #v2m-signed button { background: none; border: none; color: var(--v2-blue); font-size: 11px; font-family: inherit; }

/* ============================================================
   BILL (chat) — section.chat re-parented; composer above tab bar
   ============================================================ */
html.v2m #v2m-s-bill .chat {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
html.v2m #v2m-s-bill .messages {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 10px 14px !important;
  position: static !important;
  height: auto !important;
  max-height: none !important;
}
html.v2m #v2m-s-bill .inputbar {
  position: static !important;
  margin: 0 !important;
  padding: 8px 12px calc(8px + env(safe-area-inset-bottom) * 0) !important;
  width: auto !important;
  max-width: none !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  border-radius: 14px;
  flex: none;
}
html.v2m #v2m-s-bill .scroll-to-bottom-btn { bottom: 80px !important; }

/* ============================================================
   TAB BAR
   ============================================================ */
html.v2m .v2m-tabbar {
  flex: none;
  display: flex;
  align-items: flex-end;
  background: var(--v2-bg1);
  border-top: 1px solid var(--v2-line-strong);
  padding: 8px 6px calc(10px + env(safe-area-inset-bottom));
  z-index: 120;
}
html.v2m .v2m-tab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  color: var(--v2-faint);
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding-top: 4px;
  background: none;
  border: none;
  font-family: inherit;
}
html.v2m .v2m-tab svg { width: 21px; height: 21px; }
html.v2m .v2m-tab.on { color: var(--v2-gold); }
html.v2m .v2m-tab-trade {
  flex: 1.15;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: -26px;
  background: none;
  border: none;
  font-family: inherit;
}
html.v2m .v2m-tab-trade .fab {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: var(--v2-gold);
  color: #1a1508;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 26px var(--v2-gold-dim), 0 3px 10px rgba(0, 0, 0, 0.25);
  border: 4px solid var(--v2-bg1);
}
html.v2m .v2m-tab-trade .fab svg { width: 24px; height: 24px; }
html.v2m .v2m-tab-trade .tl { font-size: 9.5px; font-weight: 700; letter-spacing: 0.06em; color: var(--v2-gold); margin-top: 3px; }
/* WHITE MODE ONLY (Michael 2026-08-12): light's --v2-gold (#9c7c14) reads
   olive on the FAB — give it the real shine. Dark stays as-is. */
html.v2m body.light-theme .v2m-tab-trade .fab {
  background: linear-gradient(180deg, #f0cf5e, #d4af37);
  color: #15130c;
  box-shadow: 0 6px 20px rgba(212, 175, 55, .55), inset 0 1px 0 rgba(255, 255, 255, .6);
}
html.v2m body.light-theme .v2m-tab-trade .tl { color: #b8912a; }

/* graph overlay (V1 fullscreen chart) stays usable above the shell */
html.v2m .xt-graph-panel { z-index: 200 !important; }

/* ACCOUNT mode: whatever view the guest-gate left behind, the trading
   surfaces never belong on this screen */
html.v2m .v2m-app[data-tab="account"] .rp-section,
html.v2m .v2m-app[data-tab="account"] .v2m-ticket,
html.v2m .v2m-app[data-tab="account"] .rp-actions { display: none !important; }

/* ============================================================
   FIX ROUND 1 (live probe 2026-08-09)
   ============================================================ */
/* the V1 twin-button TRADE field is replaced by the segmented ticket */
html.v2m .v2m-ticket-ready .v2m-tradefield { display: none !important; }
/* builder-flow actions have no home on the phone */
html.v2m .rp-actions { display: none !important; }
html.v2m [data-action="open_sectors_panel"],
html.v2m [data-action="open_strategy_panel"],
html.v2m [data-action="open_simulate_panel"],
html.v2m [data-action="open_portfolio_panel"] { display: none !important; }

/* trade fields: label on top, big centered value, steppers that don't clip */
html.v2m .sidebar-trade-field {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  padding: 8px 12px !important;
  min-height: 62px;
  height: auto !important;
}
html.v2m .sidebar-trade-field label {
  font-size: 9.5px !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--v2-faint) !important;
  font-weight: 700;
  margin: 0 0 3px !important;
}
html.v2m .sidebar-trade-field input {
  height: 30px !important;
  font-size: 17px !important;
  font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
  font-weight: 600;
  background: transparent !important;
  border: none !important;
  color: var(--v2-text) !important;
  text-align: center;
  min-width: 0;
  width: 100%;
  padding: 0 !important;
}
html.v2m .sidebar-trade-row { background: transparent !important; border: none !important; padding: 0 !important; }
html.v2m .sidebar-trade-stepper { display: flex; align-items: center; background: transparent !important; border: none !important; }
html.v2m .sidebar-stepper-btn {
  width: 34px; height: 34px;
  font-size: 19px;
  color: var(--v2-muted);
  background: transparent;
  border: none;
  flex: none;
}
/* ticker search row */
html.v2m #sidebar-trade-ticker { text-align: left !important; font-size: 17px !important; }
html.v2m #sidebar-trade-search-btn {
  background: var(--v2-blue) !important;
  border: none !important;
  border-radius: 11px !important;
  font-weight: 700;
  height: 44px !important;
}
html.v2m #sidebar-trade-price { font-family: 'IBM Plex Mono', monospace; font-weight: 600; color: var(--v2-muted) !important; font-size: 13px; padding: 2px 2px 0; }

/* section titles echo the shell's label style */
html.v2m #xt-panel-content .rp-section-title {
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase;
  color: var(--v2-faint) !important;
  font-weight: 700 !important;
}

/* composer hint: quiet, static, never over the tab bar */
html.v2m #hint {
  position: static !important;
  display: block;
  background: transparent !important;
  font-size: 9.5px !important;
  color: var(--v2-faint) !important;
  text-align: center;
  padding: 2px 0 4px !important;
  margin: 0 !important;
  width: auto !important;
}

/* any V1 panel chrome that isn't the content itself */
html.v2m #xt-right-panel .xt-right-panel-header,
html.v2m #xt-right-panel .right-panel-collapse-btn { display: none !important; }
html.v2m #xt-right-panel, html.v2m #xt-panel-content { background: transparent !important; }

/* FIX ROUND 2: V1 desktop grid templates don't fit 390pt */
html.v2m .v2m-wl-slot .watchlist-list {
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
}
html.v2m .sidebar-trade-grid:not(.sidebar-trade-grid-row2) {
  display: grid !important;
  grid-template-columns: 1.5fr 1fr !important;
  gap: 10px !important;
  width: 100% !important;
}
html.v2m .sidebar-trade-grid.sidebar-trade-grid-row2 {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;  /* TRADE column is hidden */
  gap: 10px !important;
  width: 100% !important;
}

/* FIX ROUND 3: intrinsic input width was blowing the grid columns out of
   the viewport — minmax(0,fr) caps the tracks and min-width:0 lets every
   level actually shrink */
html.v2m .sidebar-trade-grid:not(.sidebar-trade-grid-row2) {
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) !important;
}
html.v2m .sidebar-trade-grid.sidebar-trade-grid-row2 {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}
html.v2m .sidebar-trade-field { min-width: 0 !important; max-width: none !important; }
html.v2m .sidebar-trade-stepper { width: 100% !important; min-width: 0 !important; }
html.v2m .sidebar-trade-stepper input {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  width: auto !important;
}

/* ============================================================
   FIX ROUND 4 (Michael's first device pass)
   ============================================================ */
/* #1 — recommendation / deep-analysis bubbles: V1 paints them #e5e5e5
   with !important (status.css:1019), which is white-on-white in light
   mode. Penthouse reskin, both themes, ink pinned on the bare tags —
   semantic colored spans/classes keep their own colors. */
html.v2m .bubble.bot.financial-bubble {
  color: var(--v2-text) !important;
  background: var(--v2-bg1) !important;
  border: 1px solid var(--v2-line-strong) !important;
  border-left: 2px solid var(--v2-gold) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}
html.v2m .bubble.bot.financial-bubble strong,
html.v2m .bubble.bot.financial-bubble em,
html.v2m .bubble.bot.financial-bubble b,
html.v2m .bubble.bot.financial-bubble h1,
html.v2m .bubble.bot.financial-bubble h2,
html.v2m .bubble.bot.financial-bubble h3,
html.v2m .bubble.bot.financial-bubble h4,
html.v2m .bubble.bot.financial-bubble p,
html.v2m .bubble.bot.financial-bubble li,
html.v2m .bubble.bot.financial-bubble td,
html.v2m .bubble.bot.financial-bubble th { color: var(--v2-text) !important; }

/* #2 — hat avatar */
html.v2m #v2m-s-bill .avatar.bot { background: transparent !important; }
html.v2m .v2m-hat { width: 20px; height: 20px; color: var(--v2-text); display: block; }

/* #6 — toast: quiet Penthouse rectangle above the tab bar */
html.v2m .v2m-toast {
  position: absolute;
  left: 22px; right: 22px;
  bottom: calc(86px + env(safe-area-inset-bottom));
  background: var(--v2-bg1);
  color: var(--v2-text);
  border: 1px solid var(--v2-line-strong);
  border-left: 2px solid var(--v2-gold);
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 12.5px;
  line-height: 1.45;
  box-shadow: var(--v2-shadow, 0 12px 30px rgba(0,0,0,0.25));
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease;
  z-index: 150;
  text-align: center;
}
html.v2m .v2m-toast.on { opacity: 1; transform: translateY(0); }

/* V1's mobile panel drag-handle pseudo — the panel is embedded now */
html.v2m .xt-right-panel::before { display: none !important; content: none !important; }

/* ============================================================
   AUDIT FIX ROUND (2026-08-09) — 19 confirmed findings
   ============================================================ */
/* #7/#14 — V1 pins .composer to the viewport (z 10000) over the tab bar;
   under v2m it is a normal flex child of the Bill screen */
html.v2m #v2m-s-bill .composer,
html.v2m .composer {
  position: static !important;
  left: auto !important; right: auto !important; bottom: auto !important;
  width: auto !important; max-width: none !important;
  z-index: auto !important;
  background: transparent !important;
  padding: 0 12px !important;
  margin: 0 !important;
  transform: none !important;
}

/* #8 — V1 paints hot/cold trending rows with solid #22c55e/#ef4444
   !important; the Penthouse chips use the dim tints. Match importance. */
html.v2m .v2m-radar .trending-ticker.trending-row-bullish {
  background: var(--v2-gain-dim) !important;
  border-color: var(--v2-gain) !important;
  box-shadow: none !important;
  animation: v2mBreathe 2.6s ease-in-out infinite !important;
}
html.v2m .v2m-radar .trending-ticker.trending-row-bearish {
  background: var(--v2-loss-dim) !important;
  border-color: var(--v2-loss) !important;
  box-shadow: none !important;
}
/* #9 — light-theme.css repaints trending text with !important; pin the
   Penthouse palette in BOTH themes */
html.v2m .v2m-radar .trending-symbol { color: var(--v2-text) !important; }
html.v2m .v2m-radar .trending-score.long { color: var(--v2-gain) !important; }
html.v2m .v2m-radar .trending-score.short { color: var(--v2-loss) !important; }
html.v2m .v2m-radar .trending-ticker { background: var(--v2-bg1) !important; border-color: var(--v2-line-strong) !important; }
html.v2m .v2m-radar .trending-ticker.trending-row-bullish { background: var(--v2-gain-dim) !important; border-color: var(--v2-gain) !important; }
html.v2m .v2m-radar .trending-ticker.trending-row-bearish { background: var(--v2-loss-dim) !important; border-color: var(--v2-loss) !important; }

/* #10 — the sheet + scrim must cover the WHOLE app incl. the tab bar */
html.v2m .v2m-scrim { position: fixed; inset: 0; }
html.v2m .v2m-sheet { position: fixed; left: 0; right: 0; bottom: 0; }

/* #11 — desktop v2.css leaks right:175px onto the scroll-to-bottom button */
html.v2m .scroll-to-bottom-btn {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  bottom: 132px !important;
}

/* #12 — V1 clamps the stepper wrapper to 26px with overflow:hidden */
html.v2m .sidebar-trade-stepper {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

/* #13 — portfolio-mode hide without :has() (class set by the adapter) */
html.v2m .v2m-app[data-tab="portfolio"] .v2m-tradesec { display: none !important; }

/* #2 — confirm button busy state */
html.v2m .v2m-confirm[disabled] { opacity: 0.55; }

/* RADAR — final word: ID specificity (1,x,x) outranks every V1/light-theme
   class rule regardless of load order (audit #8/#9 synthetic re-check) */
html.v2m #v2m-radar-slot .trending-ticker {
  background: var(--v2-bg1) !important;
  border-color: var(--v2-line-strong) !important;
  box-shadow: none !important;
}
html.v2m #v2m-radar-slot .trending-symbol { color: var(--v2-text) !important; }
html.v2m #v2m-radar-slot .trending-score.long { color: var(--v2-gain) !important; }
html.v2m #v2m-radar-slot .trending-score.short { color: var(--v2-loss) !important; }
html.v2m #v2m-radar-slot .trending-ticker.trending-row-bullish {
  background: var(--v2-gain-dim) !important;
  border-color: var(--v2-gain) !important;
  animation: v2mBreathe 2.6s ease-in-out infinite !important;
}
html.v2m #v2m-radar-slot .trending-ticker.trending-row-bearish {
  background: var(--v2-loss-dim) !important;
  border-color: var(--v2-loss) !important;
}
html.v2m #v2m-radar-slot .trending-row-bullish .trending-symbol,
html.v2m #v2m-radar-slot .trending-row-bearish .trending-symbol { color: var(--v2-text) !important; }

/* ============================================================
   STRATEGY AUTOPILOT + THEME TOGGLE (Michael 2026-08-12)
   ============================================================ */

/* ---- top-bar theme toggle (the retired equity pill slot) ---- */
html.v2m .v2m-theme {
  margin-left: auto;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  border: 1px solid var(--v2-line-strong);
  background: transparent;
  color: var(--v2-muted);
  display: grid;
  place-items: center;
  padding: 0;
}
html.v2m .v2m-theme svg { width: 15px; height: 15px; }
html.v2m .v2m-mkt { margin-left: 0 !important; }

/* ---- radar: ONE-LINE chips (Michael 2026-08-12 pass 2) — symbol and
   score side by side, single text row, minimal height ---- */
html.v2m .v2m-radar { gap: 6px; padding: 2px 14px 4px; }
html.v2m .v2m-radar .trending-ticker {
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  min-width: 0 !important;
}
html.v2m .v2m-radar .trending-symbol { font-size: 11.5px !important; }
html.v2m .v2m-radar .trending-symbol-row { display: inline-flex !important; }
html.v2m .v2m-radar .trending-score { font-size: 10.5px !important; }

/* ---- autopilot strip: exactly 2 cards, both FULLY on screen ---- */
html.v2m .v2m-ap-label { color: var(--v2-gold) !important; }
html.v2m .v2m-ap-strip {
  display: flex;
  gap: 8px;
  padding: 2px 14px 10px;
}
html.v2m .v2m-ap-card {
  flex: 1 1 0;
  min-width: 0;
  text-align: left;
  font-family: inherit;
  background: linear-gradient(160deg, rgba(212, 175, 55, .10), rgba(212, 175, 55, .03)), var(--v2-bg1);
  border: 1px solid rgba(212, 175, 55, .38);
  border-radius: 12px;
  padding: 10px 12px;
  color: var(--v2-text);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
html.v2m body.light-theme .v2m-ap-card {
  background: linear-gradient(160deg, rgba(156, 124, 20, .10), rgba(156, 124, 20, .02)), var(--v2-bg1);
  border-color: rgba(156, 124, 20, .40);
}
html.v2m .v2m-ap-card .row1 { display: flex; align-items: baseline; gap: 6px; }
html.v2m .v2m-ap-card .sym { font-weight: 700; font-size: 15px; }
html.v2m .v2m-ap-card .tf { font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 9.5px; color: var(--v2-muted); }
html.v2m .v2m-ap-card .strat { font-size: 9.5px; color: var(--v2-gold); }
html.v2m .v2m-ap-card .stats { display: flex; gap: 10px; font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 10.5px; margin-top: 3px; }
html.v2m .v2m-ap-card .stats .r { color: var(--v2-gain); font-weight: 600; }
html.v2m .v2m-ap-card .stats .d { color: var(--v2-muted); }
html.v2m .v2m-ap-card .go2 { margin-top: 7px; font-size: 10.5px; font-weight: 700; color: var(--v2-gold); }

/* ---- LAUNCH PAGE: full-screen takeover, slide-up, both themes ---- */
html.v2m .v2m-launch {
  position: fixed;
  inset: 0;
  /* above the tutorial ask card (10049) — a fresh session can have both
     up at once and the launch page must be unobstructed */
  z-index: 10055;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(120% 55% at 50% -8%, rgba(212, 175, 55, .22), transparent 60%),
    radial-gradient(90% 40% at 50% 108%, rgba(212, 175, 55, .10), transparent 65%),
    #0c0c0e;
  transform: translateY(100%);
  transition: transform .28s cubic-bezier(.32, .72, .28, 1);
  visibility: hidden;
}
html.v2m .v2m-launch.on { transform: translateY(0); visibility: visible; }
html.v2m body.light-theme .v2m-launch {
  background:
    radial-gradient(120% 55% at 50% -8%, rgba(156, 124, 20, .16), transparent 60%),
    radial-gradient(90% 40% at 50% 108%, rgba(156, 124, 20, .07), transparent 65%),
    #f8f6f1;
}
html.v2m .v2m-launch .ln-top { display: flex; align-items: center; padding: max(14px, env(safe-area-inset-top)) 16px 4px; }
html.v2m .v2m-launch .chip {
  font-size: 9px; font-weight: 800; letter-spacing: .14em;
  color: var(--v2-gold); border: 1px solid rgba(212, 175, 55, .5);
  background: rgba(212, 175, 55, .08); border-radius: 5px; padding: 2px 8px;
}
html.v2m .v2m-launch .x {
  margin-left: auto; background: none; border: none;
  color: var(--v2-faint); font-size: 17px; padding: 4px 8px;
}
html.v2m .v2m-launch .ln-hero { text-align: center; padding: 2px 16px 0; }
html.v2m .v2m-launch .sym {
  font-family: 'IBM Plex Serif', Georgia, serif;
  font-size: 36px; font-weight: 700; line-height: 1.05;
  color: #f4f2ec;
}
html.v2m body.light-theme .v2m-launch .sym { color: #211f1b; }
html.v2m .v2m-launch .ln-hero .sub { font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 10.5px; color: var(--v2-muted); margin-top: 2px; }
html.v2m .v2m-launch .ln-hero .sub b { color: var(--v2-gold); font-weight: 600; }
html.v2m .v2m-launch .ln-chart { position: relative; height: 152px; margin-top: 8px; flex: none; }
html.v2m .v2m-launch .ln-chart svg { width: 100%; height: 100%; display: block; }
html.v2m .v2m-launch #v2m-ln-line {
  stroke: var(--v2-gold);
  stroke-width: 2;
  stroke-dasharray: 900;
  stroke-dashoffset: 0;
  animation: v2m-ap-draw 1.1s ease-out;
  filter: drop-shadow(0 0 5px rgba(212, 175, 55, .55));
}
@keyframes v2m-ap-draw { from { stroke-dashoffset: 900; } to { stroke-dashoffset: 0; } }
/* the big number: REDUCED + pinned to the top-left corner of the graph
   (Michael feedback #4 - was centered over the curve) */
html.v2m .v2m-launch .roi { position: absolute; top: 4px; left: 16px; text-align: left; }
html.v2m .v2m-launch .roi .big {
  font-family: 'IBM Plex Serif', Georgia, serif;
  font-size: 24px; font-weight: 700; line-height: 1;
  color: var(--v2-gold);
  text-shadow: 0 0 22px rgba(212, 175, 55, .40);
}
html.v2m .v2m-launch .roi .cap { font-size: 7.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--v2-faint); margin-top: 3px; }
html.v2m .v2m-launch .ln-stats { display: flex; justify-content: center; gap: 26px; padding: 8px 16px 10px; flex: none; }
html.v2m .v2m-launch .ln-stats .v { font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 13.5px; font-weight: 600; color: var(--v2-text); text-align: center; }
html.v2m .v2m-launch .ln-stats .v.dn { color: var(--v2-loss); }
html.v2m .v2m-launch .ln-stats .l { font-size: 7.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--v2-faint); margin-top: 2px; text-align: center; }
html.v2m .v2m-launch .ln-form { margin-top: auto; padding: 0 16px calc(16px + env(safe-area-inset-bottom)); }
html.v2m .v2m-launch .fld {
  display: flex; align-items: center;
  background: rgba(233, 231, 226, .05);
  border: 1px solid rgba(233, 231, 226, .12);
  border-radius: 12px; padding: 11px 14px; margin-bottom: 8px;
}
html.v2m body.light-theme .v2m-launch .fld { background: rgba(33, 31, 27, .04); border-color: rgba(33, 31, 27, .12); }
html.v2m .v2m-launch .fld .k { font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--v2-muted); }
html.v2m .v2m-launch .fld .v { margin-left: auto; font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 17px; font-weight: 700; color: var(--v2-text); }
html.v2m .v2m-launch .fld .step { display: flex; gap: 6px; margin-left: 12px; }
html.v2m .v2m-launch .fld .step button {
  width: 28px; height: 28px; border-radius: 8px;
  border: 1px solid rgba(233, 231, 226, .18); background: none;
  color: var(--v2-muted); font-size: 14px; padding: 0;
}
html.v2m body.light-theme .v2m-launch .fld .step button { border-color: rgba(33, 31, 27, .18); }
html.v2m .v2m-launch .lev { display: flex; gap: 6px; margin-bottom: 10px; }
html.v2m .v2m-launch .lev button {
  flex: 1; text-align: center;
  font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 11.5px;
  padding: 8px 0; border-radius: 9px;
  border: 1px solid rgba(233, 231, 226, .12); background: none; color: var(--v2-muted);
}
html.v2m body.light-theme .v2m-launch .lev button { border-color: rgba(33, 31, 27, .14); }
html.v2m .v2m-launch .lev button.on {
  background: rgba(212, 175, 55, .16);
  border-color: var(--v2-gold);
  color: var(--v2-gold);
  font-weight: 700;
  box-shadow: 0 0 14px rgba(212, 175, 55, .22);
}
/* live simulation readout — web calculator twin, compact (Michael: smaller) */
html.v2m .v2m-launch .simout {
  display: flex; align-items: center;
  border: 1px solid rgba(212, 175, 55, .32);
  background: rgba(212, 175, 55, .06);
  border-radius: 10px; padding: 7px 6px; margin-bottom: 10px;
}
html.v2m body.light-theme .v2m-launch .simout {
  border-color: rgba(156, 124, 20, .34);
  background: rgba(156, 124, 20, .05);
}
html.v2m .v2m-launch .simout > div { flex: 1 1 0; min-width: 0; text-align: center; }
html.v2m .v2m-launch .simout .v {
  font-family: 'IBM Plex Serif', Georgia, serif;
  font-size: 15px; font-weight: 700; line-height: 1.1;
  color: var(--v2-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html.v2m .v2m-launch .simout .v.up { color: var(--v2-gain); }
html.v2m .v2m-launch .simout .v.dn { color: var(--v2-loss); }
html.v2m .v2m-launch .simout .l {
  font-size: 7px; letter-spacing: .13em; text-transform: uppercase;
  color: var(--v2-faint); margin-top: 2px;
}
html.v2m .v2m-launch .simout .sep { flex: none; width: 1px; align-self: stretch; margin: 3px 4px; background: rgba(233, 231, 226, .1); }
html.v2m body.light-theme .v2m-launch .simout .sep { background: rgba(33, 31, 27, .1); }
html.v2m .v2m-launch .go {
  width: 100%; padding: 14px 0; border-radius: 12px; border: none;
  background: linear-gradient(180deg, #e6c352, #d4af37);
  color: #15130c; font-weight: 800; font-size: 13.5px; letter-spacing: .08em;
  box-shadow: 0 8px 26px rgba(212, 175, 55, .38), inset 0 1px 0 rgba(255, 255, 255, .35);
}
html.v2m .v2m-launch .go:disabled { opacity: .6; }
html.v2m .v2m-launch .fine { font-size: 8.5px; color: var(--v2-faint); text-align: center; margin-top: 8px; }

/* ============================================================
   MARKETS PASS (Michael 2026-08-12 evening)
   1. Breakout Radar = Wall Street tape (right-to-left marquee)
   2. Radar + Autopilot pinned, only the watchlist scrolls
   3. Tab-bar top line lowered to the TRADE button's middle
   ============================================================ */

/* ---- 1. the tape ---- */
/* The slot clips; the track (adapter-built, holds the live V1 trending
   nodes) slides continuously right -> left. Edge-to-edge: no side padding,
   chips enter at the true right screen edge and exit at the left. */
html.v2m .v2m-radar { overflow: hidden; padding: 2px 0 6px; }
html.v2m .v2m-radar-track { display: flex; gap: 6px; width: max-content; }
/* animate only once real chips exist — the "loading" empty state stays put */
html.v2m .v2m-radar-track:has(.trending-ticker) { animation: v2mTape 22s linear infinite; }
html.v2m .v2m-radar-track:active { animation-play-state: paused; }
@keyframes v2mTape {
  from { transform: translateX(100vw); }
  to   { transform: translateX(-100%); }
}
@media (prefers-reduced-motion: reduce) {
  html.v2m .v2m-radar { overflow-x: auto; padding: 2px 14px 4px; }
  html.v2m .v2m-radar-track:has(.trending-ticker) { animation: none; }
}

/* ---- 2. ONE scroller for the whole Markets screen (2026-08-26) ----
   The pinned flex layout (radar + autopilot fixed, inner watchlist
   scroller) clipped the Autopilot picks on short viewports / large
   Android font scales, and the nested scroller trapped touch input so
   users literally could not scroll back up ("strategy ready object not
   visible at all"). Replaced with a single natural-height scroller:
   everything is always reachable by scrolling, on every phone. */
html.v2m .v2m-app[data-tab="markets"] #v2m-s-markets {
  display: block;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
html.v2m #v2m-s-markets .v2m-wl-slot {
  min-height: 0;
  overflow: visible;
  padding-bottom: 14px;
}

/* ---- 3. tab bar: top line down to the FAB's middle ---- */
/* FAB visual height 66px (58 + 2x4 border): poke ~32px above the bar's
   top border = the line crosses the TRADE button at its middle. */
html.v2m .v2m-tabbar { padding-top: 3px; }
html.v2m .v2m-tab-trade { margin-top: -32px; }

/* ---- 4. slimmer chips (Michael: too wide) ----
   The V1 desktop-row affordances inflate the chip: .trending-info is a
   flex:1 stretcher with side padding, .trending-score-wrap carries a
   54px min-width. Shrink-wrap everything to content. */
html.v2m .v2m-radar .trending-info { flex: none !important; padding: 0 !important; gap: 5px !important; }
html.v2m .v2m-radar .trending-score-wrap { min-width: 0 !important; margin-right: 0 !important; }
html.v2m .v2m-radar .trending-ticker { width: auto !important; padding: 4px 8px !important; }

/* ---- 5. launch chart REAL entry/exit signals (Michael 2026-08-13) ----
   Actual backtest trades in the web-chart convention: entry arrow colored
   by side (green long / red short) below the curve vertex, exit dot
   colored by result above it with the trade's real % label. HTML overlay
   (not SVG) so text doesn't stretch. Fade in after the 1.1s curve draw. */
html.v2m .v2m-launch .ln-marks { position: absolute; inset: 0; pointer-events: none; }
html.v2m .v2m-launch .ln-marks span {
  position: absolute;
  opacity: 0;
  animation: v2mMarkIn .45s ease-out forwards;
  animation-delay: 1.05s;
}
html.v2m .v2m-launch .mk-in {
  width: 0; height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  transform: translate(-50%, 5px);
}
html.v2m .v2m-launch .mk-in.l { border-bottom: 6px solid var(--v2-gain); }
html.v2m .v2m-launch .mk-in.s { border-top: 6px solid var(--v2-loss); }
html.v2m .v2m-launch .mk-out {
  width: 5px; height: 5px; border-radius: 50%;
  transform: translate(-50%, -9px);
}
html.v2m .v2m-launch .mk-out.w { background: var(--v2-gain); box-shadow: 0 0 6px var(--v2-gain-dim); }
html.v2m .v2m-launch .mk-out.l2 { background: var(--v2-loss); box-shadow: 0 0 6px var(--v2-loss-dim); }
html.v2m .v2m-launch .mk-pct {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 8px; font-weight: 700; line-height: 1;
  transform: translate(-50%, -20px);
  white-space: nowrap;
}
html.v2m .v2m-launch .mk-pct.w { color: var(--v2-gain); }
html.v2m .v2m-launch .mk-pct.l2 { color: var(--v2-loss); }
@keyframes v2mMarkIn { to { opacity: .95; } }
@media (prefers-reduced-motion: reduce) {
  html.v2m .v2m-launch .ln-marks span { animation: none; opacity: .95; }
}

/* ============================================================
   TRADE PAGE - LAUNCH MODEL (Michael 2026-08-13, approved artifact)
   The ticket becomes the Autopilot launch page's twin: glow ground,
   field rows, segmented buttons, thin TP/SL + readout strips,
   side-colored confirm. Live V1 inputs are moved into the ladder
   by the adapter; the emptied V1 rows are hidden here.
   ============================================================ */

/* glow ground on the whole Trade screen (both themes) */
html.v2m .v2m-app[data-tab="trade"] #v2m-s-panel {
  background:
    radial-gradient(120% 55% at 50% -8%, rgba(212, 175, 55, .20), transparent 60%),
    radial-gradient(90% 40% at 50% 108%, rgba(212, 175, 55, .09), transparent 65%),
    #0c0c0e;
}
html.v2m body.light-theme .v2m-app[data-tab="trade"] #v2m-s-panel {
  background:
    radial-gradient(120% 55% at 50% -8%, rgba(156, 124, 20, .15), transparent 60%),
    radial-gradient(90% 40% at 50% 108%, rgba(156, 124, 20, .06), transparent 65%),
    #f8f6f1;
}

/* V1 leftovers once the ladder is live (controls moved out of them) */
html.v2m .v2m-ticket-ready .v2m-tradesec .rp-section-title-flex,
html.v2m .v2m-ticket-ready .v2m-tradesec .sidebar-trade-row,
html.v2m .v2m-ticket-ready .v2m-tradesec .sidebar-trade-price,
html.v2m .v2m-ticket-ready .v2m-tradesec .sidebar-trade-grid { display: none !important; }

/* no native number-input spinners inside the ladder */
html.v2m .v2m-ticket input::-webkit-outer-spin-button,
html.v2m .v2m-ticket input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ---- top row: search field + sound tile ---- */
html.v2m .v2m-tk-top { display: flex; gap: 8px; }
html.v2m .v2m-tk-search {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px;
  background: rgba(233, 231, 226, .05);
  border: 1px solid rgba(233, 231, 226, .12);
  border-radius: 11px; padding: 4px 6px 4px 12px; min-height: 40px;
}
html.v2m .v2m-tk-search input#sidebar-trade-ticker {
  flex: 1; min-width: 0;
  background: none !important; border: none !important; outline: none;
  height: 32px !important; padding: 0 !important;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 13px !important; color: var(--v2-text);
}
html.v2m .v2m-tk-search #sidebar-trade-search-btn {
  flex: none; font-family: inherit;
  border: 1px solid rgba(212, 175, 55, .45) !important;
  background: rgba(212, 175, 55, .08) !important;
  background-image: none !important;
  color: var(--v2-gold) !important;
  font-size: 9px !important; font-weight: 800; letter-spacing: .1em;
  border-radius: 7px !important; padding: 7px 10px !important;
  height: auto !important; width: auto !important;
  box-shadow: none !important;
}
html.v2m .v2m-tk-snd {
  flex: none; width: 40px; min-height: 40px;
  border: 1px solid rgba(233, 231, 226, .12);
  background: rgba(233, 231, 226, .05);
  border-radius: 11px; display: grid; place-items: center;
}
html.v2m .v2m-tk-snd .trade-sound-toggle {
  background: none; border: none; padding: 0;
  display: grid; place-items: center; color: var(--v2-muted);
}

/* ---- hero: serif symbol + price line ---- */
html.v2m .v2m-tk-hero { text-align: center; padding: 10px 0 6px; }
html.v2m .v2m-tk-hero .s {
  font-family: 'IBM Plex Serif', Georgia, serif;
  font-size: 30px; font-weight: 700; line-height: 1.05; color: #f4f2ec;
}
html.v2m body.light-theme .v2m-tk-hero .s { color: #211f1b; }
html.v2m .v2m-tk-hero .p {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 10.5px; color: var(--v2-muted); margin-top: 2px; min-height: 14px;
}
html.v2m .v2m-tk-hero .p b.up { color: var(--v2-gain); font-weight: 600; }
html.v2m .v2m-tk-hero .p b.dn { color: var(--v2-loss); font-weight: 600; }

/* ---- LONG/SHORT: launch-style segmented pair ---- */
html.v2m .v2m-ticket .v2m-seg { background: none; padding: 0; gap: 6px; margin: 10px 0 8px; }
html.v2m .v2m-ticket .v2m-seg button {
  height: 36px; border-radius: 9px;
  border: 1px solid rgba(233, 231, 226, .12);
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 11.5px; font-weight: 700; letter-spacing: .06em;
  color: var(--v2-muted); background: none;
}
html.v2m .v2m-ticket .v2m-seg button.on-long {
  background: rgba(47, 191, 113, .14); border-color: var(--v2-gain);
  color: var(--v2-gain); box-shadow: 0 0 14px rgba(47, 191, 113, .18);
}
html.v2m .v2m-ticket .v2m-seg button.on-short {
  background: rgba(224, 82, 82, .13); border-color: var(--v2-loss);
  color: var(--v2-loss); box-shadow: 0 0 14px rgba(224, 82, 82, .18);
}

/* ---- amount: field row, tappable value + steppers + MAX ---- */
html.v2m .v2m-tk-amt {
  display: flex; align-items: center;
  background: rgba(233, 231, 226, .05);
  border: 1px solid rgba(233, 231, 226, .12);
  border-radius: 11px; padding: 8px 12px; margin-bottom: 8px;
}
html.v2m .v2m-tk-amt .k { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: var(--v2-muted); }
html.v2m .v2m-tk-amt .slot { flex: 1; min-width: 0; display: flex; justify-content: flex-end; }
html.v2m .v2m-tk-amt input#sidebar-trade-amount {
  width: 104px; min-width: 0; flex: none; text-align: right;
  background: none !important; border: none !important; outline: none;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 16px !important; font-weight: 700; color: var(--v2-text);
  height: 28px !important; padding: 0 !important;
  border-bottom: 1px dashed rgba(212, 175, 55, .55) !important;
  border-radius: 0 !important;
}
html.v2m .v2m-tk-amt .step { display: flex; gap: 5px; margin-left: 10px; }
html.v2m .v2m-tk-amt .step button {
  width: 26px; height: 26px; border-radius: 7px;
  border: 1px solid rgba(233, 231, 226, .18); background: none;
  color: var(--v2-muted); font-size: 13px; padding: 0; font-family: inherit;
}
html.v2m .v2m-tk-amt .max {
  margin-left: 8px; font-family: inherit;
  font-size: 8.5px; font-weight: 800; letter-spacing: .08em;
  color: var(--v2-gold); background: none;
  border: 1px solid rgba(212, 175, 55, .45);
  border-radius: 6px; padding: 5px 8px;
}

/* ---- leverage: gold launch segments ---- */
html.v2m .v2m-ticket .v2m-chips { gap: 6px; margin: 0 0 8px; }
html.v2m .v2m-ticket .v2m-chips button {
  height: 34px; border-radius: 9px;
  border: 1px solid rgba(233, 231, 226, .12);
  font-size: 11.5px; color: var(--v2-muted); background: none;
}
html.v2m .v2m-ticket .v2m-chips button.on {
  background: rgba(212, 175, 55, .16); border-color: var(--v2-gold);
  color: var(--v2-gold); font-weight: 700;
  box-shadow: 0 0 14px rgba(212, 175, 55, .22);
}

/* ---- TP/SL: thin strip, tappable green/red figures ---- */
html.v2m .v2m-tk-tpsl {
  display: flex; align-items: center;
  background: rgba(233, 231, 226, .05);
  border: 1px solid rgba(233, 231, 226, .12);
  border-radius: 9px; padding: 4px 6px; margin-bottom: 8px;
}
html.v2m .v2m-tk-tpsl > div { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 5px; }
html.v2m .v2m-tk-tpsl .l { font-size: 6.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--v2-muted); }
html.v2m .v2m-tk-tpsl .u {
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 10px; color: var(--v2-muted);
}
html.v2m .v2m-tk-tpsl .slot { display: flex; }
html.v2m .v2m-tk-tpsl input {
  width: 44px; text-align: center;
  background: none !important; border: none !important; outline: none;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 11.5px !important; font-weight: 700;
  height: 22px !important; padding: 0 !important;
  border-bottom: 1px dashed rgba(212, 175, 55, .55) !important;
  border-radius: 0 !important;
}
html.v2m .v2m-tk-tpsl .tp input { color: var(--v2-gain); }
html.v2m .v2m-tk-tpsl .sl input { color: var(--v2-loss); }
html.v2m .v2m-tk-tpsl .sep { flex: none; width: 1px; align-self: stretch; margin: 2px 4px; background: rgba(233, 231, 226, .1); }

/* ---- readout: buying power | available ---- */
html.v2m .v2m-tk-out {
  display: flex; align-items: center;
  border: 1px solid rgba(212, 175, 55, .28);
  background: rgba(212, 175, 55, .05);
  border-radius: 9px; padding: 5px 6px; margin-bottom: 8px;
}
html.v2m .v2m-tk-out > div { flex: 1; min-width: 0; display: flex; align-items: baseline; justify-content: center; gap: 6px; }
html.v2m .v2m-tk-out .v {
  font-family: 'IBM Plex Serif', Georgia, serif;
  font-size: 12px; font-weight: 700; color: var(--v2-text); white-space: nowrap;
}
html.v2m .v2m-tk-out .v.gold { color: var(--v2-gold); }
html.v2m .v2m-tk-out .l { font-size: 6.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--v2-muted); }
html.v2m .v2m-tk-out .sep { flex: none; width: 1px; align-self: stretch; margin: 2px 4px; background: rgba(233, 231, 226, .1); }

/* ---- confirm: launch geometry, side-colored gradients ---- */
html.v2m .v2m-ticket .v2m-confirm {
  height: 46px; margin: 2px 0 0; border-radius: 11px;
  font-size: 12.5px; letter-spacing: .07em;
  background: linear-gradient(180deg, #3ecf84, #22a862); color: #08130c;
  box-shadow: 0 6px 20px rgba(47, 191, 113, .30), inset 0 1px 0 rgba(255, 255, 255, .3);
}
html.v2m .v2m-ticket .v2m-confirm.short {
  background: linear-gradient(180deg, #e86a6a, #cc4444); color: #180a0a;
  box-shadow: 0 6px 20px rgba(224, 82, 82, .30), inset 0 1px 0 rgba(255, 255, 255, .25);
}
html.v2m .v2m-ticket .v2m-fineprint { font-size: 9px; margin-top: 8px; }

/* ---- light theme recolors for the ladder surfaces ---- */
html.v2m body.light-theme .v2m-tk-search,
html.v2m body.light-theme .v2m-tk-snd,
html.v2m body.light-theme .v2m-tk-amt,
html.v2m body.light-theme .v2m-tk-tpsl { background: rgba(33, 31, 27, .04); border-color: rgba(33, 31, 27, .12); }
html.v2m body.light-theme .v2m-tk-amt .step button { border-color: rgba(33, 31, 27, .18); }
html.v2m body.light-theme .v2m-ticket .v2m-seg button,
html.v2m body.light-theme .v2m-ticket .v2m-chips button { border-color: rgba(33, 31, 27, .14); }
html.v2m body.light-theme .v2m-ticket .v2m-seg button.on-long { border-color: var(--v2-gain); }
html.v2m body.light-theme .v2m-ticket .v2m-seg button.on-short { border-color: var(--v2-loss); }
html.v2m body.light-theme .v2m-ticket .v2m-chips button.on { border-color: var(--v2-gold); }
html.v2m body.light-theme .v2m-tk-tpsl .sep,
html.v2m body.light-theme .v2m-tk-out .sep { background: rgba(33, 31, 27, .1); }
html.v2m body.light-theme .v2m-tk-out { border-color: rgba(156, 124, 20, .34); background: rgba(156, 124, 20, .05); }

/* ---- positions on the glow ground (trade tab only) ---- */
html.v2m .v2m-app[data-tab="trade"] .rp-pos-card {
  background: rgba(233, 231, 226, .04) !important;
  border: 1px solid rgba(233, 231, 226, .10) !important;
  border-radius: 11px !important;
  margin: 0 0 6px !important;
}
html.v2m body.light-theme .v2m-app[data-tab="trade"] .rp-pos-card {
  background: rgba(33, 31, 27, .04) !important;
  border-color: rgba(33, 31, 27, .10) !important;
}

/* Top-bar equity pill RETIRED on every tab (Michael 2026-08-13) — it
   crowded the dark/light toggle; balance lives in Portfolio and in the
   Trade ladder's AVAILABLE figure. Beats the observer's inline style. */
html.v2m .v2m-equity { display: none !important; }

/* Account tab: User ID row (phone-support reference) — sits under the
   action rows, styled like them but non-interactive */
html.v2m .v2m-a-uid {
  display: flex; align-items: center;
  padding: 13px 2px;
  border-top: 1px solid var(--v2-line);
  font-size: 13px; color: var(--v2-muted);
}
html.v2m .v2m-a-uid b {
  margin-left: auto;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 12.5px; font-weight: 600; color: var(--v2-text);
  letter-spacing: 0.04em;
}

/* ============================================================
   SAMSUNG / ANDROID RESILIENCE — superseded 2026-08-26.
   The Markets screen is now a single natural-height scroller (see the
   "ONE scroller" block above); the pinned-stack fallback rules that
   lived here are gone. The ticker search sheet gets a height cap so it
   can never overflow past the top of the viewport at large font scale.
   ============================================================ */
html.v2m .v2m-sheet {
  max-height: calc(100% - 16px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* ============================================================
   WATCHLIST MARKETS TABS — MOBILE (stage 1, 2026-09-01)
   The tab bar is moved into the Markets screen by the adapter and
   pinned sticky so the four tabs stay reachable while the single
   Markets scroller is anywhere down the list.
   ============================================================ */
html.v2m .v2m-wltabs-slot {
  position: sticky;
  top: 0;
  z-index: 6;
  background: var(--v2-bg0, #131315);
}
html.v2m .v2m-wltabs-slot .watchlist-tabs {
  display: flex;
  gap: 2px;
  padding: 0 14px;
  border-bottom: 1px solid var(--v2-line, rgba(233, 231, 226, 0.07));
}
html.v2m .v2m-wltabs-slot .watchlist-tab {
  flex: 1 1 0;
  text-align: center;
  font-size: 10.5px;
  padding: 10px 4px 11px;
  color: var(--v2-muted, #8e8c86);
  border-bottom: 2px solid transparent;
}
html.v2m .v2m-wltabs-slot .watchlist-tab.active {
  color: var(--v2-text, #e9e7e2);
  border-bottom-color: var(--v2-gold, #d4af37);
}