/* Page frame, 12-column grid, and the shared controls. Tile files style what is inside a slot. */
*,
*::before,
*::after {
  box-sizing: border-box;
  border-radius: var(--r) !important;
}
/* Kit scrollbar: square 12px, thumb --acc, track --bg + 1px --line (ui-kit § Scroll). */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--acc) var(--bg);
}
*::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}
*::-webkit-scrollbar-track {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--r);
}
*::-webkit-scrollbar-thumb {
  background: var(--acc);
  border-radius: var(--r);
}
html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
}
body {
  background: var(--v2-line);
  color: var(--v2-text);
  font: 400 var(--v2-fs) / var(--v2-lh) var(--v2-mono);
  letter-spacing: var(--v2-track);
  -webkit-font-smoothing: none;
  min-width: 1280px;
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 90;
  background: var(--v2-scanlines);
  opacity: var(--v2-scan-opacity);
}
button {
  font: inherit;
  color: inherit;
}
.v2-grid {
  display: grid;
  width: 100vw;
  height: 100vh;
  /* 12 tracks, gapless. Book (cols 8–9) stays 2/12. Ticket (10–12) is ~15%
     narrower than equal thirds; chart (1–7) takes the freed width. */
  grid-template-columns: repeat(7, minmax(0, 149fr)) repeat(2, minmax(0, 140fr)) repeat(3, minmax(0, 119fr));
  grid-template-rows: var(--v2-nav-h) var(--v2-stat-h) repeat(5, minmax(0, 1fr)) var(--v2-bottom-h);
  gap: var(--v2-rule);
  background: var(--v2-line);
  position: relative;
}
/* Feed status square (top-left of the grid). ok=live, mute=retry, crit=down. */
.v2-grid::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 6px;
  width: 6px;
  height: 6px;
  z-index: 20;
  pointer-events: none;
  background: var(--v2-muted);
}
.v2-grid[data-v2-feed="live"]::before {
  background: var(--ok);
}
.v2-grid[data-v2-feed="down"]::before {
  background: var(--crit);
}
.v2-feed-live {
  position: absolute;
  top: 4px;
  left: 16px;
  z-index: 20;
  font-size: var(--fs-12);
  letter-spacing: var(--v2-track-label);
  text-transform: uppercase;
  color: var(--v2-muted);
  pointer-events: none;
}
.v2-perf {
  position: fixed;
  left: 8px;
  bottom: 8px;
  z-index: 120;
  margin: 0;
  padding: 8px;
  background: var(--v2-header);
  color: var(--v2-muted);
  border: 1px solid var(--v2-line);
  font: 400 var(--v2-fs-axis) / var(--v2-lh) var(--v2-mono);
  letter-spacing: var(--v2-track);
  white-space: pre;
  pointer-events: none;
}
.v2-tile {
  background: var(--v2-tile);
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
}
.v2-tile:hover {
  outline: 1px solid var(--v2-rose);
  outline-offset: -1px;
  z-index: 5;
}
/* pu-1 — shared tile title strip (preview .tt>h2). Classes: .v2-hd / .v2-title.
   Style §3 wins: tile header = --pix 11 (not section-title 22). Height 33px.
   No blink / glow / flash / animation on titles. */
.v2-hd,
.v2-title {
  height: var(--v2-hd-h, 33px);
  flex: 0 0 var(--v2-hd-h, 33px);
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0 12px;
  background: var(--tile);
  border-bottom: var(--v2-rule) solid var(--line);
  color: var(--mute);
  font-family: var(--pix, var(--mono));
  font-size: var(--fs-pix-label, 11px);
  font-weight: 400;
  font-synthesis: none;
  /* Pixel face needs >1 line-height or ink clips against the content box. */
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0;
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: grayscale;
  white-space: nowrap;
  overflow: hidden;
  min-width: 0;
  animation: none !important;
  transition: none !important;
  text-shadow: none;
  box-shadow: none;
  filter: none;
}
.v2-hd .x-pix,
.v2-title .x-pix {
  font-family: var(--pix, var(--mono));
  font-size: inherit;
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  -webkit-font-smoothing: none;
  color: inherit;
}
/* Leftover header band → hatch (kit .x-fill). Yields first when trailing chrome needs room. */
.v2-hd .x-fill,
.v2-title .x-fill {
  flex: 1 1 0%;
  align-self: stretch;
  min-width: 0;
  margin: 0;
  background: var(--hatch);
  pointer-events: none;
}
/* Preview .r — trailing meta (OHLC, tick, shortcuts) sits right of the title. */
.v2-hd > .r,
.v2-title > .r,
.v2-hd-meta {
  margin-left: auto;
  display: flex;
  gap: 8px;
  align-items: center;
  min-width: 0;
  color: var(--mute);
}
/* Emphasis inside the strip (preview h2 b) — still Departure 400, not bold. */
.v2-hd b,
.v2-title b {
  font-weight: 400;
  font-synthesis: none;
  color: var(--tx);
}
/* Trailing header chrome: drop auto margins so .x-fill keeps the band. */
.v2-hd:has(.x-fill) > .v2-tick,
.v2-hd:has(.x-fill) > .v2-chart-meta,
.v2-hd:has(.x-fill) > .v2-acct-sp,
.v2-hd:has(.x-fill) > .v2-acct-sw,
.v2-hd:has(.x-fill) > .v2-btn,
.v2-hd:has(.x-fill) > .r,
.v2-hd:has(.x-fill) > .v2-hd-meta {
  margin-left: 0;
}
.v2-hd .v2-tick,
.v2-hd .v2-chart-meta {
  font-family: var(--pix);
  font-size: var(--fs-pix-label, 11px);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  -webkit-font-smoothing: none;
}
/* Titles stay mute on hover — no inverted flash / glow (trade + profile tiles). */
.v2-tile:hover > .v2-hd,
.v2-tile:hover > .v2-title,
.v2-tile:hover > .v2-hd .v2-idx,
.v2-tile:hover > .v2-title .v2-idx,
.v2-prof-tile:hover > .v2-hd,
.v2-prof-tile:hover > .v2-title,
.v2-prof-tile:hover > .v2-hd .v2-idx,
.v2-prof-tile:hover > .v2-title .v2-idx {
  background: var(--tile);
  color: var(--mute);
  text-shadow: none;
  box-shadow: none;
  filter: none;
  animation: none !important;
}
.v2-tile:hover > .v2-hd .x-fill,
.v2-tile:hover > .v2-title .x-fill,
.v2-prof-tile:hover > .v2-hd .x-fill,
.v2-prof-tile:hover > .v2-title .x-fill {
  background: var(--hatch);
}
.v2-idx {
  flex: 0 0 auto;
  color: var(--mute);
  animation: none !important;
  text-shadow: none;
  filter: none;
}
/* Tile titles never flex-shrink — .x-fill / trailing chrome yield first (see account.css). */
.v2-hd > .v2-idx,
.v2-title > .v2-idx,
.v2-hd > .x-pix,
.v2-hd > span.x-pix,
.v2-hd > .v2-modal-h,
.v2-title > .x-pix,
.v2-title > span.x-pix,
.v2-title > .v2-modal-h {
  flex: 0 0 auto;
  min-width: max-content;
  overflow: visible;
  text-overflow: clip;
  color: var(--mute);
  font-size: inherit;
  font-weight: 400;
  animation: none !important;
  text-shadow: none;
  filter: none;
}
/* Large empty area → plain tile + scanlines (no diagonal hatch: eye strain). Small gaps keep --hatch. */
.v2-body {
  flex: 1 1 auto;
  min-height: 0;
  background: var(--v2-tile);
}
/* AUTO weather texture on empty tile areas (tokens.css --v2-wx). Image only, so each body keeps its own
   background colour. Motion is a slow stepped drift; reduced motion keeps the texture still. */
html[data-theme="auto"][data-wx] .v2-body,
html[data-theme="auto"][data-wx] .v2-scr-fill {
  background-image: var(--v2-wx);
  background-size: var(--v2-wx-size);
  background-repeat: repeat;
}
html[data-theme="auto"][data-wx="rain"] .v2-body,
html[data-theme="auto"][data-wx="rain"] .v2-scr-fill {
  animation: v2-wx-fall 2s steps(8, end) infinite;
}
html[data-theme="auto"][data-wx="storm"] .v2-body,
html[data-theme="auto"][data-wx="storm"] .v2-scr-fill {
  animation: v2-wx-fall 1.2s steps(8, end) infinite;
}
html[data-theme="auto"][data-wx="snowy"] .v2-body,
html[data-theme="auto"][data-wx="snowy"] .v2-scr-fill {
  animation: v2-wx-snow 8s steps(16, end) infinite;
}
html[data-theme="auto"][data-wx="cloud"] .v2-body,
html[data-theme="auto"][data-wx="cloud"] .v2-scr-fill,
html[data-theme="auto"][data-wx="fog"] .v2-body,
html[data-theme="auto"][data-wx="fog"] .v2-scr-fill {
  animation: v2-wx-drift 32s steps(32, end) infinite;
}
html[data-theme="auto"][data-wx="sun"] .v2-body,
html[data-theme="auto"][data-wx="sun"] .v2-scr-fill,
html[data-theme="auto"][data-wx="star"] .v2-body,
html[data-theme="auto"][data-wx="star"] .v2-scr-fill {
  animation: v2-wx-blink 8s steps(1, end) infinite;
}
@keyframes v2-wx-fall {
  to {
    background-position: 0 32px;
  }
}
@keyframes v2-wx-snow {
  to {
    background-position: 8px 32px;
  }
}
@keyframes v2-wx-drift {
  to {
    background-position: 64px 0;
  }
}
@keyframes v2-wx-blink {
  50% {
    background-position: 24px 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme="auto"][data-wx] .v2-body,
  html[data-theme="auto"][data-wx] .v2-scr-fill {
    animation: none;
  }
}
.v2-lbl {
  font-family: var(--pix);
  font-size: var(--fs-pix-label, 12px);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  -webkit-font-smoothing: none;
  text-transform: uppercase;
  color: var(--v2-muted);
}
.v2-up {
  color: var(--v2-buy-hi);
}
.v2-dn {
  color: var(--v2-sell-text);
}
.v2-pix {
  position: relative;
  font-family: var(--pix, var(--mono));
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: none;
  /* pu-4 text-bg: no separate text/inline background — sits on the tile. */
  background: transparent;
}
.v2-pix::after {
  content: none;
  display: none;
}
/* Brand mark left of KYOKA: the headset tiger (favicon art, 20×20 pixel grid) at 1 CSS px per art pixel.
   Mascot exception in docs/v2-style-notes.md (owner ask 2026-10-18; was an 8px --v2-rose square). */
.v2-sq {
  width: 20px;
  height: 20px;
  display: inline-block;
  background: url("/img/tiger-fab.svg") center / 20px 20px no-repeat;
  image-rendering: pixelated;
  flex: 0 0 20px;
}
/* Kit buttons (ui-kit .x-btn). .v2-btn shares the recipe so existing markup picks it up.
   Dense chrome (seg / nav / chart strips) overrides height and drops the hard shadow below. */
.x-btn,
.v2-btn {
  appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--line);
  background: var(--tile);
  color: var(--tx);
  font: 600 var(--fs-12) / 1 var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  box-shadow: var(--v2-shadow-2) var(--line);
  cursor: var(--cur-pointer);
  white-space: nowrap;
  /* Kit only steps transform + shadow; background/color must flip instantly (.on / side). */
  transition:
    transform 120ms var(--st-2),
    box-shadow 120ms var(--st-2);
}
.x-btn:hover,
.v2-btn:hover {
  background: var(--alt);
  color: var(--acc-hi);
}
.x-btn:active,
.x-btn.pr,
.v2-btn:active,
.v2-btn.pr {
  transform: translate(2px, 2px);
  box-shadow: var(--v2-shadow-0) var(--line);
}
/* Primary / outline / ghost / danger / icon — kit variants. */
.x-btn--p {
  background: var(--acc-hi);
  border-color: var(--acc);
  color: var(--ink);
  box-shadow: var(--v2-shadow-2) var(--bone);
}
.x-btn--p:hover {
  background: var(--acc-hi);
  color: var(--ink);
}
.x-btn--o {
  background: transparent;
  border-color: var(--acc);
  color: var(--acc-hi);
  box-shadow: var(--v2-shadow-2) var(--line);
}
.x-btn--g {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
.x-btn--g:hover {
  background: var(--alt);
}
.x-btn--d {
  background: var(--crit);
  border-color: var(--crit);
  color: var(--tx);
  box-shadow: var(--v2-shadow-2) var(--line);
}
.x-btn--i {
  width: 44px;
  padding: 0;
  justify-content: center;
}
.x-btn kbd,
.v2-btn kbd {
  font: 500 var(--fs-12) / 1 var(--mono);
  padding: 0 4px;
  border: 1px solid currentColor;
  opacity: 0.7;
}
/* ⌘K chip — 12px JetBrains on every page (profile does not load nav.css). */
.x-cmd-btn kbd {
  font: 400 var(--fs-12) / 1 var(--mono);
  font-synthesis: none;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  padding: 0 4px;
  border: 1px solid currentColor;
  line-height: 1;
}
.x-btn:disabled,
.v2-btn:disabled {
  opacity: 0.4;
  cursor: var(--cur-not-allowed);
  transform: none;
  box-shadow: none;
}
/* Inverted-block selected (kit active): solid accent + black text. */
.x-btn.on,
.x-btn.on:hover,
.x-btn[aria-pressed="true"],
.x-btn[aria-pressed="true"]:hover,
.v2-btn.on,
.v2-btn.on:hover {
  background: var(--acc-hi);
  border-color: var(--acc);
  color: var(--ink);
  font-weight: 700;
  box-shadow: var(--v2-shadow-2) var(--bone);
}
.v2-nav {
  grid-column: 1 / -1;
  grid-row: 1;
  flex-direction: row;
  align-items: stretch;
  background: var(--v2-header);
}
/* Kit x-top: brand · nav · ⌘K · network · WALLET (U7).
   Active route = bright label + accent underline bar (user ask 2026-10-15: easier to read than the inverted block). */
.v2-nav .v2-navb.on,
.v2-nav .v2-navb.on:hover,
.v2-tab-nav .v2-navb.on,
.v2-tab-nav .v2-navb.on:hover,
.v2-prof-nav .v2-navb.on,
.v2-prof-nav .v2-navb.on:hover {
  position: relative;
  background: transparent;
  color: var(--tx);
  font-weight: 400;
}
.v2-nav .v2-navb.on::after,
.v2-tab-nav .v2-navb.on::after,
.v2-prof-nav .v2-navb.on::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 0;
  height: 3px;
  background: var(--acc);
  pointer-events: none;
}
.v2-nav > .v2-cap.x-cmd-btn,
.v2-tab-nav > .v2-cap.x-cmd-btn,
.v2-prof-nav > .v2-cap.x-cmd-btn {
  appearance: none;
  background: transparent;
  border-top: 0;
  border-bottom: 0;
  border-left: 0;
  cursor: var(--cur-pointer);
  font: inherit;
  color: var(--mute);
  letter-spacing: 0;
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  text-transform: none;
}
.v2-nav > .v2-cap.x-cmd-btn:hover,
.v2-tab-nav > .v2-cap.x-cmd-btn:hover,
.v2-prof-nav > .v2-cap.x-cmd-btn:hover {
  color: var(--acc-hi);
  background: var(--alt);
}
.v2-nav > .v2-cap.v2-net,
.v2-tab-nav > .v2-cap.v2-net,
.v2-prof-nav > .v2-cap.v2-net {
  color: var(--mute);
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  letter-spacing: 0;
  text-transform: uppercase;
}
.v2-nav > .v2-cap.v2-net[data-net="testnet"],
.v2-tab-nav > .v2-cap.v2-net[data-net="testnet"],
.v2-prof-nav > .v2-cap.v2-net[data-net="testnet"] {
  color: var(--warn);
}
/* Desktop: real flex row. Chromium bugs with <details>:
   (1) display:contents drops children out of the nav flex;
   (2) a closed <details> sizes to 0 even when children are display:flex.
   Pin width to six 112px tabs (Investigate + Tournament need the fixed cell);
   keep Menu hidden; force links visible. */
.v2-nav-fold {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  align-self: stretch;
  height: 100%;
  flex: 0 0 calc(6 * 112px);
  width: calc(6 * 112px);
  min-width: calc(6 * 112px);
}
.v2-nav-more {
  display: none;
  list-style: none;
}
.v2-nav-more::-webkit-details-marker {
  display: none;
}
.v2-nav-fold > .v2-nav-links {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  height: 100%;
  min-width: 0;
}
.v2-nav-fold > .v2-nav-links .v2-navb {
  height: 100%;
}
.v2-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  font-weight: 700;
  letter-spacing: var(--v2-track-logo);
  border-right: var(--v2-rule) solid var(--v2-line);
  color: inherit;
  text-decoration: none;
  /* Fixed from first paint so layout cannot steal nav width (CLS). */
  flex: 0 0 auto;
}
a.v2-navb {
  text-decoration: none;
  color: inherit;
  box-sizing: border-box;
}
/* Nav tabs fill the 44px bar — kit min-height, no hard shadow (flush strip). */
.v2-nav .v2-btn,
.v2-navb {
  height: 100%;
  min-height: 0;
  padding: 0 10px;
  border: 0;
  box-shadow: none;
  border-radius: var(--r);
}
.v2-nav .v2-btn:active,
.v2-nav .v2-btn.pr,
.v2-navb:active,
.v2-navb.pr {
  transform: none;
  box-shadow: none;
}
.v2-navb {
  border-right: var(--v2-rule) solid var(--v2-line);
  width: 112px;
  flex: 0 0 112px;
  overflow: hidden;
  /* Style §3: route labels are Departure 11, not the generic .v2-btn mono 12. */
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  line-height: 1.25;
  -webkit-font-smoothing: none;
}
.v2-nav > .v2-spacer {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  border-right: var(--v2-rule) solid var(--v2-line);
}
.v2-cap {
  display: flex;
  align-items: center;
  padding: 0 14px;
  border-right: var(--v2-rule) solid var(--v2-line);
  font-size: var(--v2-fs);
  letter-spacing: var(--v2-track-label);
  color: var(--v2-muted);
  flex: 0 0 auto;
}
.v2-statrow {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: var(--v2-rule);
  background: var(--v2-line);
  min-width: 0;
}
.v2-stat {
  padding: 8px;
  justify-content: space-between;
  gap: 4px;
  min-width: 0;
}
/* ===== Preview grid (agent 0) — do not change tracks in v2/pu-* =====
   Chart 1–8 · Book(+Trades) 8–10 · Ticket 10–13
   Portfolio 1–10 bottom · Account 10–13 bottom-right
   #v2-trades is an off-grid mount host (pu-2 merges tape into #v2-book). */
.v2-chart {
  grid-column: 1 / 8;
  grid-row: 3 / 8;
}
.v2-book {
  grid-column: 8 / 10;
  grid-row: 3 / 8;
}
.v2-ticket {
  grid-column: 10 / 13;
  grid-row: 3 / 8;
}
.v2-positions {
  grid-column: 1 / 10;
  grid-row: 8;
}
.v2-account {
  grid-column: 10 / 13;
  grid-row: 8;
}
/* Portfolio fold arrow (layout.js), left of the header UPNL. Desktop only: mobile.css shows it at
   ≥1280 and turns the chevron up while folded. Ghost icon cell, header height. */
.v2-posfold {
  appearance: none;
  display: none;
  align-self: stretch;
  align-items: center;
  justify-content: center;
  width: 33px;
  flex: 0 0 33px;
  margin: 0 -4px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--mute);
  cursor: var(--cur-pointer);
}
.v2-posfold:hover {
  background: var(--alt);
  color: var(--acc-hi);
}
.v2-posfold:focus-visible {
  outline: 1px solid var(--acc);
  outline-offset: -1px;
}
.v2-trades {
  display: none;
  grid-column: auto;
  grid-row: auto;
}
/* Panel resize handles (layout.js). Off by default; mobile.css turns them on at ≥1280.
   A 9px hit strip on the 1px gap; hover / drag fills a 3px --acc bar (no fade). */
.v2-rsz {
  display: none;
  position: absolute;
  z-index: 6;
  touch-action: none;
}
.v2-rsz::after {
  content: "";
  position: absolute;
  background: var(--acc);
  opacity: 0;
}
.v2-rsz-x {
  cursor: var(--cur-ew-resize);
}
.v2-rsz-x::after {
  top: 0;
  bottom: 0;
  left: 3px;
  width: 3px;
}
.v2-rsz-y {
  cursor: var(--cur-ns-resize);
}
.v2-rsz-y::after {
  left: 0;
  right: 0;
  top: 3px;
  height: 3px;
}
.v2-rsz:hover::after,
.v2-rsz:focus-visible::after,
.v2-rsz.on::after {
  opacity: 1;
}
.v2-rsz:focus-visible {
  outline: none;
}
/* While dragging: one cursor everywhere, no text selection, canvases ignore the pointer. */
html[data-v2-rsz="vertical"],
html[data-v2-rsz="vertical"] * {
  cursor: var(--cur-ew-resize) !important;
}
html[data-v2-rsz="horizontal"],
html[data-v2-rsz="horizontal"] * {
  cursor: var(--cur-ns-resize) !important;
}
html[data-v2-rsz] body {
  user-select: none;
}
html[data-v2-rsz] .v2-tile {
  pointer-events: none;
}
.v2-seg {
  display: grid;
  gap: var(--v2-rule);
  background: var(--v2-line);
  border-bottom: var(--v2-rule) solid var(--v2-line);
}
.v2-seg-2 {
  grid-template-columns: 1fr 1fr;
}
.v2-seg-3 {
  grid-template-columns: 1fr 1fr 1fr;
}
.v2-seg-4 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
/* Seg / side heights: kit min-height 44 by default. Dense 30/42 is desktop-only
   via mobile.css (min-width 1280). Phone/touch keeps ≥44 (anh). */
.v2-seg .v2-btn {
  padding: 0 10px;
  border: 0;
  box-shadow: none;
}
.v2-seg .v2-btn:active,
.v2-seg .v2-btn.pr {
  transform: none;
  box-shadow: none;
}
.v2-side .v2-btn {
  font-size: var(--v2-fs-side);
  font-weight: 700;
  border: 0;
  box-shadow: none;
}
.v2-side .v2-btn:active,
.v2-side .v2-btn.pr {
  transform: none;
  box-shadow: none;
}
/* Kit inputs (ui-kit .x-field / .x-vf / .x-car). .v2-field shares the recipe. */
.x-field,
.v2-field {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 12px;
  position: relative;
  border: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--bg);
  box-sizing: border-box;
}
.x-field:focus-within,
.v2-field:focus-within {
  border-color: var(--acc);
  outline: 1px solid var(--acc);
  outline-offset: -1px;
}
.x-field input,
.v2-field input {
  flex: 1;
  min-width: 0;
  height: 42px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--tx);
  /* pu-8: Style §3 / kit — input values 16px (ticket fields share .v2-field). */
  font: 400 var(--fs-16) / 1.2 var(--mono);
  font-feature-settings: "zero" 1, "tnum" 1;
  font-variant-numeric: tabular-nums;
  text-align: right;
  outline: 0;
  caret-color: transparent;
  appearance: none;
  -webkit-appearance: none;
  /* Never clip typed values; horizontal scroll inside the field if needed. */
  overflow-x: auto;
  overflow-y: hidden;
  text-overflow: clip;
  white-space: nowrap;
}
.x-field input::placeholder,
.v2-field input::placeholder {
  color: var(--mute);
  opacity: 1;
}
.x-field input::-webkit-outer-spin-button,
.x-field input::-webkit-inner-spin-button,
.v2-field input::-webkit-outer-spin-button,
.v2-field input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.x-field input[type="number"],
.v2-field input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.x-field input:focus,
.v2-field input:focus,
.x-field input:focus-visible,
.v2-field input:focus-visible {
  outline: none;
}
.x-car {
  position: absolute;
  top: 13px;
  width: 8px;
  height: 16px;
  background: var(--acc);
  display: none;
  pointer-events: none;
  animation: x-bl 960ms var(--st-1) infinite;
}
/* Block caret sits in flow right after the right-aligned value (before the unit), never on the label
   at the field's left edge. Tiles that pin it elsewhere set position: absolute again. */
.x-field:focus-within .x-car,
.v2-field:focus-within .x-car {
  display: block;
  position: static;
  flex: 0 0 8px;
  margin-left: -6px;
}
/* Kit [12] d · badges / tags (ui-kit .x-tag). --c = edge/text; .s = inverted block; i = 6px dot. */
.x-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 24px;
  padding: 0 8px;
  border: 1px solid var(--c, var(--line));
  color: var(--c, var(--tx));
  background: var(--bg);
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-font-smoothing: none;
  -moz-osx-font-smoothing: grayscale;
}
.x-tag.s {
  background: var(--c);
  color: var(--ink);
}
.x-tag.cr {
  border-color: var(--crit);
  color: var(--crit-tx);
}
.x-tag i {
  flex: none;
  width: 6px;
  height: 6px;
  background: var(--d, currentColor);
}
/* pu-8 */
@media (prefers-reduced-motion: reduce) {
  .x-car {
    animation: none;
  }
}
/* x-bl keyframes live in states.css (kit blink). */
.v2-field label,
.v2-field .v2-lbl,
.v2-field .x-lab:not(.v2-unit) {
  flex: 0 0 74px;
  min-width: 0;
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  -webkit-font-smoothing: none;
  text-transform: uppercase;
  color: var(--mute);
}
.v2-field .v2-unit,
.v2-field .v2-unit.x-lab {
  flex: 0 0 auto;
  width: auto;
  min-width: 32px;
  margin: 0;
  color: var(--mute);
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  -webkit-font-smoothing: none;
  text-transform: uppercase;
  text-align: right;
}
/* Kit validation states (ui-kit .x-vf). */
.x-vf.f,
.v2-field.f {
  border-color: var(--acc);
}
.x-vf.w,
.v2-field.w {
  border-color: var(--warn);
}
.x-vf.e,
.v2-field.e,
.v2-field[aria-invalid="true"],
.v2-field:has(input[aria-invalid="true"]) {
  border-color: var(--crit);
}
.x-vf.d,
.v2-field.d,
.v2-field:has(input:disabled) {
  opacity: 0.4;
  background: var(--hatch);
  pointer-events: none;
}
.v2-field:has(input[readonly]) {
  color: var(--mute);
}
.v2-field input[readonly] {
  color: var(--mute);
}
.v2-field input:disabled {
  color: var(--mute);
}
.v2-search {
  border: var(--v2-rule) solid var(--v2-line);
}
.v2-search:focus-within {
  border-color: var(--v2-rose);
}
.v2-search input:focus,
.v2-search input:focus-visible {
  outline: none;
}
.v2-power,
.v2-segbar {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: var(--v2-rule);
  background: var(--v2-line);
}
.v2-power {
  border-bottom: var(--v2-rule) solid var(--v2-line);
  touch-action: pan-y;
  user-select: none;
}
.v2-power i,
.v2-segbar i {
  display: block;
  background: var(--v2-tile);
}
.v2-power i {
  height: 20px;
}
.v2-segbar i {
  height: 12px;
}
.v2-power i.on {
  background: var(--v2-rose);
}
.v2-power i:hover {
  outline: 1px solid var(--v2-rose);
  outline-offset: -1px;
}
/* Kit .x-sl: lit 90/100% cells turn --warn (large size). */
.v2-power i.on.hi {
  background: var(--warn);
}
.v2-power i.hi:hover {
  outline-color: var(--warn);
}
/* Receipt: kit dotted-leader rows (ui-kit .x-kv / .x-ld). */
.v2-receipt {
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 0;
  font-size: var(--fs-12);
  font-family: var(--mono);
  font-feature-settings: "zero" 1, "tnum" 1;
  border-bottom: var(--v2-rule) solid var(--v2-line);
  background: var(--tile);
}
.v2-receipt .x-kv,
.v2-receipt > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  color: var(--mute);
}
.v2-receipt .x-kv:last-child,
.v2-receipt > div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.v2-receipt .x-kv:first-child,
.v2-receipt > div:first-child {
  padding-top: 0;
}
.v2-receipt .x-lab,
.v2-receipt span:first-child {
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  -webkit-font-smoothing: none;
  text-transform: uppercase;
  color: var(--mute);
  flex: 0 1 auto;
  min-width: 0;
}
.v2-receipt .v2-lead,
.v2-receipt .x-ld i {
  flex: 1;
  min-width: 16px;
  height: 0;
  border-bottom: 1px dotted var(--v2-leader);
  transform: translateY(-3px);
}
.v2-receipt b,
.v2-receipt .x-kv > span:last-child {
  color: var(--tx);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "zero" 1, "tnum" 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 55%;
  text-align: right;
}
.v2-submit .v2-btn {
  height: 46px;
  min-height: 44px;
  font-size: var(--v2-fs-input);
  font-weight: 700;
  letter-spacing: var(--v2-track-submit);
  background: var(--v2-buy-hi);
  border-color: var(--v2-buy);
  color: var(--ink);
  box-shadow: var(--v2-shadow-2) var(--bone);
}
.v2-submit .v2-btn:hover {
  background: var(--v2-buy-hi);
  border-color: var(--v2-buy);
  color: var(--ink);
}
.v2-submit .v2-btn:active,
.v2-submit .v2-btn.pr {
  transform: translate(2px, 2px);
  box-shadow: var(--v2-shadow-0) var(--bone);
}
.v2-submit .v2-btn.short {
  background: var(--v2-sell);
  border-color: var(--v2-sell);
  box-shadow: var(--v2-shadow-2) var(--line);
}
.v2-submit .v2-btn.short:active,
.v2-submit .v2-btn.short.pr {
  box-shadow: var(--v2-shadow-0) var(--line);
}
.v2-side .v2-btn.long.on,
.v2-side .v2-btn.long.on:hover {
  background: var(--v2-buy-hi);
  border-color: var(--v2-buy);
  color: var(--ink);
}
.v2-side .v2-btn.short.on,
.v2-side .v2-btn.short.on:hover {
  background: var(--v2-sell);
  border-color: var(--v2-sell);
  color: var(--ink);
}
.v2-depth {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  opacity: var(--v2-depth-opacity);
}
/* U11 overlays: no scrim — the confirm sits on the live terminal. The veil stays as a
   transparent click catcher (outside click = Cancel), kit x-mod, bone tooltip. */
.v2-veil,
.v2-veil.x-ov {
  position: fixed;
  inset: 0;
  background: transparent;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 100;
}
.v2-veil.on {
  display: flex;
}
.v2-modal,
.v2-modal.x-mod {
  position: relative;
  width: min(360px, calc(100% - 32px));
  background: var(--tile);
  border: 1px solid var(--acc);
  box-shadow: var(--v2-shadow-4) var(--acc);
  animation: x-mod-in 200ms var(--st);
}
.v2-modal .v2-seg {
  border-bottom: 0;
  border-top: 1px solid var(--line);
}
.v2-modal-b {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: var(--v2-fs);
  letter-spacing: 0.06em;
  color: var(--mute);
}
.v2-modal-b b {
  color: var(--tx);
}
/* Pixel dissolve grid over modal (filled/cleared by shell/chrome ask). */
.v2-modal .x-dz {
  position: absolute;
  inset: -1px -5px -5px -1px;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(8, 1fr);
  pointer-events: none;
  z-index: 2;
}
.v2-modal .x-dz i {
  background: var(--bg);
}
.v2-modal .x-dz i.off {
  visibility: hidden;
}
@keyframes x-mod-in {
  from {
    clip-path: inset(0 0 100% 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
/* Bone tooltip (kit x-tip). */
.x-tip {
  position: relative;
  display: inline-flex;
}
.x-tip [role="tooltip"] {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 0;
  white-space: nowrap;
  padding: 4px 8px;
  background: var(--bone);
  color: var(--ink);
  font: 500 12px var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  pointer-events: none;
  clip-path: inset(100% 0 0 0);
  transition: clip-path 120ms var(--st-3);
  z-index: 5;
}
.x-tip:hover [role="tooltip"],
.x-tip:focus-within [role="tooltip"] {
  clip-path: inset(0);
}
.v2-notes {
  flex: 1 1 auto;
  min-height: 0;
  background: var(--v2-header);
  border-bottom: var(--v2-rule) solid var(--v2-line);
  border-left: 2px solid var(--v2-rose);
  padding: 8px 10px;
  font-size: var(--v2-fs);
  line-height: 1.5;
  color: var(--v2-text);
  overflow: auto;
  letter-spacing: 0.02em;
}
.v2-notes b {
  color: var(--acc-hi);
  display: block;
  margin-bottom: 6px;
  letter-spacing: 0.1em;
}
.v2-toast {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--acc-hi);
  color: var(--v2-bg);
  padding: 12px 20px;
  font-size: var(--v2-fs);
  font-weight: 700;
  letter-spacing: var(--v2-track-toast);
  text-transform: uppercase;
  z-index: 110;
  display: none;
}
.v2-toast.on {
  display: block;
}
form.nofill {
  display: contents;
}
/* Theme cell: 44px square next to Wallet. Menu is position:fixed so the nav tile's
   overflow:hidden does not clip it. Rows are Departure 11. */
.v2-nav > .v2-theme,
.v2-prof-nav > .v2-theme,
.v2-tab-nav > .v2-theme,
.v2-nf-bar > .v2-theme {
  flex: 0 0 44px;
  width: 44px;
  align-self: stretch;
  display: flex;
}
.v2-theme-go {
  appearance: none;
  width: 44px;
  height: 100%;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--mute);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: var(--cur-pointer);
}
.v2-theme-go:hover {
  color: var(--acc-hi);
  background: var(--alt);
}
.v2-theme-go[aria-expanded="true"] {
  background: var(--acc-hi);
  color: var(--ink);
}
.v2-theme-go svg,
.v2-theme-tick {
  width: 16px;
  height: 16px;
  fill: currentColor;
  shape-rendering: crispEdges;
  image-rendering: pixelated;
}
.v2-theme-go:focus-visible,
.v2-theme-row:focus-visible,
.v2-theme-fold:focus-visible {
  outline: 1px solid var(--acc);
  outline-offset: -1px;
}
.v2-theme-menu {
  position: fixed;
  z-index: 96;
  min-width: 176px;
  background: var(--tile);
  border: 1px solid var(--line);
  box-shadow: var(--v2-shadow-4) var(--line);
  display: flex;
  flex-direction: column;
}
.v2-theme-menu[hidden],
.v2-theme-fold,
.v2-theme-fold-list {
  display: none;
}
.v2-theme-fold {
  font-family: var(--pix);
  font-size: var(--fs-11);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  text-transform: uppercase;
  -webkit-font-smoothing: none;
}
.v2-theme-menu:not([hidden]) {
  animation: x-mod-in 160ms var(--st);
}
.v2-theme-row {
  appearance: none;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  height: 44px;
  margin: 0;
  padding: 0 12px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--tile);
  color: var(--tx);
  font-family: var(--pix);
  font-size: var(--fs-11);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  text-transform: uppercase;
  text-align: left;
  cursor: var(--cur-pointer);
  -webkit-font-smoothing: none;
}
.v2-theme-row:last-child {
  border-bottom: 0;
}
.v2-theme-row:hover {
  background: var(--alt);
  color: var(--acc-hi);
}
.v2-theme-row[aria-checked="true"] {
  color: var(--acc-hi);
}
.v2-theme-sw {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  background: var(--acc);
  border: 1px solid var(--line);
}
.v2-theme-sw[data-swatch="rose"] {
  background: var(--v2-sw-rose);
}
.v2-theme-sw[data-swatch="ice"] {
  background: var(--v2-sw-ice);
}
.v2-theme-sw[data-swatch="vapor"] {
  background: var(--v2-sw-vapor);
}
.v2-theme-sw[data-swatch="lcd"] {
  background: var(--v2-sw-lcd);
}
.v2-theme-sw[data-swatch="ember"] {
  background: var(--v2-sw-ember);
}
.v2-theme-sw[data-swatch="custom"] {
  background: var(--v2-sw-custom);
}
.v2-theme-sw[data-swatch="auto"] {
  background: var(--v2-sw-auto);
}
/* AUTO row: what drives the hue now (weather or time), mono, muted, before the tick. */
.v2-theme-note {
  margin-left: auto;
  color: var(--mute);
  font-family: var(--mono);
  font-size: var(--fs-12);
  text-transform: uppercase;
}
.v2-theme-note + .v2-theme-tick {
  margin-left: 0;
}
/* CUSTOM hue slider: 24 hard color cells (no gradient), stepped like the kit .x-sl bar.
   Cell colors are inline from V2HUE (computed --acc per step); the picked cell is an ink frame. */
.v2-hue {
  display: flex;
  gap: 1px;
  height: 44px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--tile);
  cursor: var(--cur-pointer);
  touch-action: none;
}
.v2-hue i {
  flex: 1 1 0;
  min-width: 0;
  border: 1px solid transparent;
}
.v2-hue i.on {
  border: 2px solid var(--ink);
  box-shadow: 0 0 0 1px var(--tx);
}
.v2-hue:focus-visible {
  outline: 1px solid var(--acc-hi);
  outline-offset: -1px;
}
/* Contrast rows: fixed text-lightness chips (Standard mute, Soft dim, High bright). */
.v2-theme-sw[data-ct-swatch="standard"] {
  background: var(--v2-sw-ct-standard);
}
.v2-theme-sw[data-ct-swatch="soft"] {
  background: var(--v2-sw-ct-soft);
}
.v2-theme-sw[data-ct-swatch="high"] {
  background: var(--v2-sw-ct-high);
}
.v2-theme-hd {
  display: flex;
  align-items: center;
  min-height: 33px;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  background: var(--alt);
  color: var(--mute);
  font-size: var(--fs-11);
  text-transform: uppercase;
}
.v2-theme-sw[data-v2-theme-live] {
  background: var(--acc);
}
/* Discord cell: takes the old MAINNET slot (net cap now shows only on testnet).
   Departure 11 label + 8x8 mark; card is position:fixed like the theme menu. */
.v2-cap.v2-net[hidden] {
  display: none;
}
.v2-nav > .v2-discord,
.v2-prof-nav > .v2-discord,
.v2-tab-nav > .v2-discord,
.v2-nf-bar > .v2-discord {
  flex: 0 0 auto;
  align-self: stretch;
  display: flex;
}
.v2-discord-go {
  appearance: none;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 100%;
  min-width: 44px;
  min-height: 44px;
  padding: 0 16px;
  border: 0;
  background: transparent;
  color: var(--mute);
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  text-transform: uppercase;
  -webkit-font-smoothing: none;
  cursor: var(--cur-pointer);
}
.v2-discord-go:hover {
  color: var(--acc-hi);
  background: var(--alt);
}
.v2-discord-go[aria-expanded="true"] {
  color: var(--acc-hi);
  box-shadow: inset 0 -2px 0 var(--acc);
}
.v2-discord-go:focus-visible,
.v2-discord-menu a:focus-visible {
  outline: 1px solid var(--acc);
  outline-offset: -1px;
}
.v2-discord-go svg,
.v2-discord-head svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  fill: currentColor;
  shape-rendering: crispEdges;
  image-rendering: pixelated;
}
.v2-discord-menu {
  position: fixed;
  z-index: 96;
  width: 288px;
  max-width: calc(100% - 16px);
  background: var(--tile);
  border: 1px solid var(--line);
  box-shadow: var(--v2-shadow-4) var(--line);
  display: flex;
  flex-direction: column;
}
.v2-discord-menu[hidden] {
  display: none;
}
.v2-discord-menu:not([hidden]) {
  animation: x-mod-in 160ms var(--st);
}
.v2-discord-head {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  color: var(--acc-hi);
  font-family: var(--pix);
  font-size: var(--fs-11);
  font-weight: 400;
  font-synthesis: none;
  text-transform: uppercase;
  -webkit-font-smoothing: none;
}
.v2-discord-tx {
  margin: 0;
  padding: 12px;
  color: var(--tx);
  font-family: var(--mono);
  font-size: var(--fs-13);
  line-height: 1.5;
}
.v2-discord-acts {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0 12px 12px;
}
.v2-discord-acts .x-btn {
  width: 100%;
  text-decoration: none;
}
/* Discord profile (discord-me.js): once an auto join paired this terminal the Discord button folds to its logo
   (accent, no label) and the card shows the profile (round avatar, name) and both servers in place of the pitch.
   The round avatar frame is the owner's one exception to square corners (2026-10-21). */
.v2-discord[data-v2-dme-on] .v2-discord-go {
  padding: 0 14px;
  color: var(--acc-hi);
}
.v2-discord[data-v2-dme-on] .v2-discord-go > .x-pix,
.v2-discord-menu[data-v2-dme-on] > .v2-discord-head,
.v2-discord-menu[data-v2-dme-on] > .v2-discord-tx,
.v2-discord-menu[data-v2-dme-on] > .v2-discord-acts {
  display: none;
}
.v2-dme-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 12px;
  border-bottom: 1px solid var(--line);
}
.v2-dme-ring {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border: 1px solid var(--line-2);
  border-radius: 50% !important;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--alt);
  color: var(--acc-hi);
}
.v2-dme-ring svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
  shape-rendering: crispEdges;
}
.v2-dme-av {
  display: block;
  width: 100%;
  height: 100%;
  image-rendering: pixelated;
}
.v2-dme-id {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.v2-dme-who {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--tx);
  font-family: var(--mono);
  font-size: var(--fs-13);
}
.v2-dme-sub {
  color: var(--mute);
  font-family: var(--pix);
  font-size: var(--fs-pix-label);
  font-weight: 400;
  font-synthesis: none;
  text-transform: uppercase;
  -webkit-font-smoothing: none;
}
.v2-dme-card {
  padding-bottom: 8px;
}
.v2-dme-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 44px;
  padding: 0 12px;
  font-family: var(--mono);
  font-size: var(--fs-12);
}
.v2-dme-k {
  color: var(--tx);
}
.v2-dme-v {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--acc-hi);
}
.v2-dme-v svg {
  width: 12px;
  height: 12px;
  fill: currentColor;
  shape-rendering: crispEdges;
}
.v2-dme-join {
  text-decoration: none;
}
/* Floating Discord button (discord.js): only while the top-bar cell is folded away.
   Kit 44px icon button; sits under the phone ticket sheet (80), dock (85) and menus (96). */
.v2-discord-fab {
  position: fixed;
  z-index: 79;
  left: 0;
  top: 0;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}
.v2-discord-fab[hidden] {
  display: none;
}
.v2-discord-fab img {
  display: block;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  image-rendering: pixelated;
  pointer-events: none;
}
.v2-discord-fab[aria-expanded="true"] {
  background: var(--acc-hi);
  color: var(--ink);
}
.v2-discord-fab--drag {
  cursor: var(--cur-grabbing);
}
/* Tiger chat bubble (discord.js): pops now and then beside the floating button; tap opens the card.
   Square box, hard shadow, 8px stepped tail toward the tiger, steps() pop-in. */
.v2-discord-bubble {
  position: fixed;
  z-index: 79;
  left: 0;
  top: 0;
  max-width: 216px;
  min-height: 44px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  background: var(--tile);
  color: var(--tx);
  border: 1px solid var(--line-2);
  box-shadow: var(--v2-shadow-2) var(--line);
  font: 400 var(--fs-13) / 1.4 var(--mono);
  text-align: left;
  animation: v2-bub-in 180ms var(--st-3);
}
.v2-discord-bubble[hidden] {
  display: none;
}
.v2-discord-bubble::after {
  content: "";
  position: absolute;
  left: var(--v2-bub-tail, 16px);
  top: calc(100% - 1px);
  width: 8px;
  height: 6px;
  background: var(--tile);
  border: 1px solid var(--line-2);
  border-top: 0;
}
.v2-discord-bubble--below::after {
  top: auto;
  bottom: calc(100% - 1px);
  border-top: 1px solid var(--line-2);
  border-bottom: 0;
}
.v2-discord-bubble:focus-visible {
  outline: 1px solid var(--acc-hi);
  outline-offset: 2px;
}
@keyframes v2-bub-in {
  0% {
    opacity: 0;
    transform: translateY(4px);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .v2-discord-bubble {
    animation: none;
  }
}
.v2-theme-tick {
  display: none;
  margin-left: auto;
}
.v2-theme-row[aria-checked="true"] .v2-theme-tick {
  display: block;
}

/* Privacy mode (V2PRIV, html[data-v2-priv]): every money figure wrapped in .v2-pv reads *** in --mute.
   A fixed 3ch box clips the real text, so its length gives nothing away. Data and trading are untouched. */
html[data-v2-priv] .v2-pv {
  display: inline-block;
  width: 3ch;
  overflow: hidden;
  white-space: nowrap;
  vertical-align: bottom;
  color: transparent;
  user-select: none;
}
html[data-v2-priv] .v2-pv::before {
  content: "***";
  color: var(--mute);
}
/* Price inputs that show a saved order price (position TP/SL): *** until focused, real value while editing. */
html[data-v2-priv] .v2-pv-f:not(:focus-within) .v2-field:has(input:not(:placeholder-shown)) input {
  color: transparent;
}
html[data-v2-priv] .v2-pv-f:not(:focus-within) .v2-field:has(input:not(:placeholder-shown))::after {
  content: "***";
  position: absolute;
  right: 12px;
  top: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  color: var(--mute);
  pointer-events: none;
}

/* Kit global: disable every animation and transition when the user prefers reduced motion. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}
