
[hidden] { display: none !important; }

/* ── order ticket v2: readable, grouped, above the account card ──────────── */
.order-ticket-v2 {
  order: -1;
  padding: 16px;
  border-color: rgba(230, 193, 123, 0.12);
  background:
    linear-gradient(180deg, rgba(230, 193, 123, 0.028), transparent 160px),
    var(--panel-bg, rgba(10, 16, 26, 0.92));
}
.order-ticket-v2 .side-toggle {
  gap: 5px;
  padding: 4px;
  border-radius: 9px;
}
.order-ticket-v2 .side-toggle button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-height: 46px;
  padding: 5px 8px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0.02em;
}
.order-ticket-v2 .side-toggle button small {
  color: currentColor;
  opacity: 0.55;
  font-family: var(--mono);
  font-size: 7px;
  font-weight: 500;
  letter-spacing: 0.14em;
}
.order-ticket-v2 .ticket-account-strip {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 6px;
  padding: 0 2px;
  white-space: nowrap;
  color: var(--muted-2);
  font-size: 9.5px;
}
.order-ticket-v2 .ticket-account-strip b {
  margin-left: 2px;
  color: var(--text-soft);
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 550;
}
.order-ticket-v2 .ticket-account-strip .ticket-risk { margin-left: auto; }
.order-ticket-v2 .ticket-account-strip .ticket-risk b.safe { color: var(--down); }
.order-ticket-v2 .ticket-account-strip .ticket-risk b.caution { color: var(--gold); }
.order-ticket-v2 .ticket-account-strip .ticket-risk b.danger { color: var(--up); }
.order-ticket-v2 .ticket-account-strip .ticket-risk b.idle { color: var(--muted); }
.order-ticket-v2 .ticket-symbol-row {
  margin-top: 4px;
  padding: 9px 2px 10px;
  border-bottom: 1px solid rgba(148, 169, 200, 0.08);
}
.order-ticket-v2 .ticket-position-hint {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 26px;
  margin: 0 0 8px;
  padding: 5px 8px;
  border: 1px solid rgba(148, 169, 200, 0.1);
  border-radius: 5px;
  background: rgba(4, 8, 14, 0.42);
  color: var(--muted);
  font-size: 9.5px;
  line-height: 1.35;
}
.order-ticket-v2 .ticket-position-hint.long { border-color: rgba(255, 93, 117, 0.18); color: #ff9aaa; }
.order-ticket-v2 .ticket-position-hint.short { border-color: rgba(47, 211, 162, 0.18); color: #7fe2bc; }
.order-ticket-v2 .ticket-position-hint.flat { color: var(--muted-2); }
.order-ticket-v2 .ticket-position-hint button {
  flex: none;
  padding: 3px 7px;
  border: 1px solid rgba(230, 193, 123, 0.28);
  border-radius: 4px;
  color: var(--gold);
  background: var(--gold-soft);
  font-size: 9px;
  cursor: pointer;
}
.order-ticket-v2 .ticket-position-hint button:hover { background: rgba(230, 193, 123, 0.18); }
.order-ticket-v2 .ticket-symbol { font-size: 16px; font-weight: 620; }
.order-ticket-v2 .ticket-name { margin-left: 7px; font-size: 11.5px; color: var(--text-soft); }
.order-ticket-v2 .ticket-market {
  padding: 3px 6px;
  border: 1px solid rgba(148, 169, 200, 0.12);
  border-radius: 4px;
  font-size: 9px;
}
.order-ticket-v2 .order-type-tabs {
  margin-top: 2px;
  gap: 2px;
  padding: 3px;
  border: 1px solid rgba(148, 169, 200, 0.08);
  border-radius: 7px;
  background: rgba(3, 6, 11, 0.36);
}
.order-ticket-v2 .order-type-tabs button {
  padding: 7px 4px;
  border-radius: 5px;
  font-size: 11.5px;
}
.order-ticket-v2 .order-type-tabs button.active {
  color: var(--gold-bright);
  background: var(--gold-soft);
}
.order-ticket-v2 .order-type-tabs button.active::after { display: none; }
.order-ticket-v2 .ticket-fields { gap: 12px; }
.order-ticket-v2 .field { gap: 7px; }
.order-ticket-v2 .field-label {
  font-size: 11px;
  font-weight: 560;
  letter-spacing: 0.02em;
}
.order-ticket-v2 .field-label em { font-size: 8.5px; }
.order-ticket-v2 .stepper {
  grid-template-columns: 42px minmax(0, 1fr) 42px;
  height: 46px;
  border-radius: 7px;
}
.order-ticket-v2 .stepper button { font-size: 19px; }
.order-ticket-v2 .stepper input {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.order-ticket-v2 .quick-price-row { gap: 5px; }
.order-ticket-v2 .quick-price-row button {
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 6px 8px;
  border-radius: 6px;
  text-align: left;
}
.order-ticket-v2 .quick-price-row button span {
  color: var(--muted-2);
  font-size: 9.5px;
  line-height: 1;
}
.order-ticket-v2 .quick-price-row b {
  color: var(--text-soft);
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.15;
}
.order-ticket-v2 .quick-qty-block {
  padding: 1px 0 0;
}
.order-ticket-v2 .quick-block-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 5px;
  color: var(--muted-2);
  font-size: 9.5px;
}
.order-ticket-v2 .quick-block-head span:last-child { color: rgba(86, 100, 123, 0.8); }
.order-ticket-v2 .qty-presets { gap: 4px; }
.order-ticket-v2 .qty-presets button,
.order-ticket-v2 .percent-row button {
  min-height: 30px;
  border-radius: 5px;
  font-size: 10.5px;
}
.order-ticket-v2 .percent-row { gap: 4px; margin-top: 4px; }
.order-ticket-v2 .ticket-options-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 7px;
  margin-top: 1px;
  padding-top: 11px;
  border-top: 1px solid rgba(148, 169, 200, 0.08);
}
.order-ticket-v2 .option-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.order-ticket-v2 .option-field > span {
  color: var(--muted-2);
  font-size: 9.5px;
}
.order-ticket-v2 .option-field select {
  width: 100%;
  height: 38px;
  padding: 0 7px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: rgba(4, 8, 14, 0.72);
  color: var(--text-soft);
  font-size: 10.5px;
  outline: none;
}
.order-ticket-v2 .option-field select:focus { border-color: rgba(230, 193, 123, 0.4); }
.order-ticket-v2 .maker-card {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  margin-top: 17px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: rgba(4, 8, 14, 0.38);
  cursor: pointer;
}
.order-ticket-v2 .maker-card input { accent-color: var(--gold); width: 13px; height: 13px; margin: 0; flex: none; }
.order-ticket-v2 .maker-card > span { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.order-ticket-v2 .maker-card b { color: var(--text-soft); font-size: 10.5px; font-weight: 550; }
.order-ticket-v2 .maker-card small { color: var(--muted-2); font-size: 8.5px; white-space: nowrap; }
.order-ticket-v2 .ticket-summary {
  gap: 4px;
  margin-top: 2px;
  padding: 10px 11px;
  border: 1px solid rgba(148, 169, 200, 0.08);
  border-radius: 7px;
  background: rgba(3, 6, 11, 0.34);
}
.order-ticket-v2 .ticket-summary span { font-size: 9.5px; }
.order-ticket-v2 .ticket-summary b { font-size: 12px; font-weight: 550; }
.order-ticket-v2 .ticket-summary div:last-child b { color: var(--gold); }
.order-ticket-v2 .submit-order {
  height: 54px;
  margin-top: 2px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0.02em;
}
.order-ticket-v2 .submit-order kbd { font-size: 8px; padding: 3px 6px; }
.order-ticket-v2 .ticket-foot { font-size: 9px; padding: 1px 2px 0; }

@media (max-width: 760px) {
  .order-ticket-v2 { padding: 13px; }
  .order-ticket-v2 .side-toggle button { min-height: 43px; font-size: 13px; }
  .order-ticket-v2 .stepper { height: 44px; }
  .order-ticket-v2 .ticket-options-grid { grid-template-columns: 1fr 1fr; }
  .order-ticket-v2 .maker-card { margin-top: 17px; }
}

/* ── guest / save-account banner ─────────────────────────────────────────── */
.guest-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 auto;
  padding: 9px 20px;
  border-bottom: 1px solid rgba(230, 193, 123, 0.14);
  background:
    linear-gradient(90deg, rgba(230, 193, 123, 0.1), rgba(255, 93, 117, 0.035) 55%, transparent),
    rgba(8, 13, 21, 0.94);
}
.guest-banner-copy { display: flex; align-items: center; gap: 10px; min-width: 0; }
.guest-badge {
  flex: none;
  padding: 3px 6px;
  border: 1px solid rgba(230, 193, 123, 0.34);
  border-radius: 3px;
  color: var(--gold);
  background: var(--gold-soft);
  font-family: var(--mono);
  font-size: 7.5px;
  letter-spacing: 0.12em;
}
.guest-banner-copy > div { display: flex; align-items: baseline; gap: 9px; min-width: 0; }
.guest-banner-copy b { color: var(--text-soft); font-size: 11px; font-weight: 560; white-space: nowrap; }
.guest-banner-copy span:not(.guest-badge) { color: var(--muted-2); font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.guest-banner-actions { display: flex; gap: 6px; flex: none; }
.guest-primary, .guest-secondary {
  padding: 6px 11px;
  border-radius: 5px;
  font-size: 9.5px;
  font-weight: 560;
  white-space: nowrap;
}
.guest-primary { color: #171006; background: linear-gradient(135deg, #f1d59b, #c99e56); border: 1px solid rgba(255, 255, 255, 0.12); }
.guest-primary:hover { filter: brightness(1.06); }
.guest-secondary { color: var(--muted); border: 1px solid var(--border); background: rgba(255, 255, 255, 0.02); }
.guest-secondary:hover { color: var(--text); border-color: var(--border-strong); }
body.live-active .guest-banner { display: none !important; }
.live-guest-badge {
  flex: none;
  padding: 4px 7px;
  border: 1px solid rgba(230, 193, 123, 0.28);
  border-radius: 4px;
  color: var(--gold);
  background: var(--gold-soft);
  font-family: var(--mono);
  font-size: 7.5px;
  letter-spacing: 0.06em;
  white-space: nowrap;
}
.live-action-btn.save { color: var(--gold); border-color: rgba(230, 193, 123, 0.28); background: var(--gold-soft); }

/* account modal */
.account-form { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.account-field { display: flex; flex-direction: column; gap: 4px; }
.account-field label { color: var(--muted); font-size: 9px; letter-spacing: 0.04em; }
.account-field input {
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: rgba(4, 8, 14, 0.7);
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
  outline: none;
}
.account-field input:focus { border-color: rgba(230, 193, 123, 0.45); box-shadow: 0 0 0 3px rgba(230, 193, 123, 0.06); }
.account-field small { color: var(--muted-2); font-size: 8px; }
.account-form-error { min-height: 14px; color: var(--up); font-size: 9px; }
.account-form-hint { color: var(--muted-2); font-size: 8.5px; line-height: 1.55; }
.account-form .modal-actions { margin-top: 2px; }
.account-form button[type="submit"] { border: 0; cursor: pointer; }
.account-kind-options { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.account-kind-option {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.018);
  cursor: pointer;
}
.account-kind-option:has(input:checked) {
  border-color: rgba(230, 193, 123, 0.4);
  background: var(--gold-soft);
}
.account-kind-option input[type="radio"] {
  width: auto;
  height: auto;
  margin: 2px 0 0;
  padding: 0;
  accent-color: var(--gold);
  box-shadow: none;
}
.account-kind-option span { display: flex; flex-direction: column; gap: 1px; }
.account-kind-option b { color: var(--text-soft); font-size: 9px; font-weight: 560; }
.account-kind-option small { color: var(--muted-2); font-size: 7.5px; }

@media (max-width: 760px) {
  .guest-banner { align-items: flex-start; padding: 8px 10px; gap: 8px; }
  .guest-banner-copy > div { flex-direction: column; gap: 1px; align-items: flex-start; }
  .guest-banner-copy b { font-size: 10px; white-space: normal; }
  .guest-banner-copy span:not(.guest-badge) { display: none; }
  .guest-banner-actions { flex-direction: column; }
  .guest-primary, .guest-secondary { padding: 5px 8px; font-size: 8.5px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   BROADCAST / STREAMING LAYER
   Larger numbers, clear risk HUD, and an OBS-friendly live stage.
   ═══════════════════════════════════════════════════════════════════════════ */

.kind-tag.guest { color: var(--gold); border-color: rgba(230, 193, 123, 0.22); background: var(--gold-soft); }
.live-entry {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 93, 117, 0.24);
  border-radius: 7px;
  background: rgba(255, 93, 117, 0.06);
  color: var(--up);
  font-size: 10px;
  font-weight: 620;
  letter-spacing: 0.08em;
  transition: all 160ms ease;
}
.live-entry:hover { border-color: rgba(255, 93, 117, 0.45); background: rgba(255, 93, 117, 0.12); }
.live-entry-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--up);
  box-shadow: 0 0 0 4px rgba(255, 93, 117, 0.08), 0 0 12px rgba(255, 93, 117, 0.7);
  animation: breathe 1.7s ease-in-out infinite;
}

/* ── risk + position preview in the account card ─────────────────────────── */
.risk-hud {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid rgba(148, 169, 200, 0.08);
}
.risk-hud-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  color: var(--muted);
  font-size: 9px;
}
.risk-hud-head b {
  color: var(--text);
  font-family: var(--mono);
  font-size: 21px;
  font-weight: 620;
  letter-spacing: -0.02em;
}
.risk-meter {
  height: 5px;
  margin: 7px 0 5px;
  border-radius: 99px;
  overflow: hidden;
  background: rgba(148, 169, 200, 0.08);
}
.risk-meter i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2fd3a2 0%, #e6c17b 55%, #ff5d75 100%);
  transition: width 450ms cubic-bezier(0.22, 1, 0.36, 1);
}
.risk-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  color: var(--muted-2);
  font-size: 8px;
}
.risk-pill {
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.risk-pill.safe { color: var(--down); background: var(--down-soft); }
.risk-pill.caution { color: var(--gold); background: var(--gold-soft); }
.risk-pill.danger { color: var(--up); background: var(--up-soft); }
.risk-pill.idle { color: var(--muted); background: rgba(148, 169, 200, 0.08); }
.exposure-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
  margin-top: 9px;
}
.exposure-grid div { min-width: 0; }
.exposure-grid span { display: block; color: var(--muted-2); font-size: 7.5px; }
.exposure-grid b {
  display: block;
  margin-top: 2px;
  color: var(--text-soft);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.position-peek {
  margin-top: 11px;
  padding-top: 9px;
  border-top: 1px solid rgba(148, 169, 200, 0.07);
}
.position-peek-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font-size: 8.5px;
}
.position-peek-head b { color: var(--gold); font-family: var(--mono); font-size: 9px; margin-left: 3px; }
.position-peek-head button {
  padding: 2px 6px;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--muted-2);
  font-size: 7.5px;
}
.position-peek-head button:hover { color: var(--gold); border-color: rgba(230, 193, 123, 0.22); }
.position-peek-body { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.peek-row {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr) 58px 62px;
  gap: 5px;
  align-items: center;
  padding: 5px 6px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.025);
  font-size: 8.5px;
}
.peek-row .peek-side { font-size: 7px; font-weight: 700; text-align: center; padding: 1px 0; border-radius: 2px; }
.peek-row .peek-side.long { color: var(--up); background: var(--up-soft); }
.peek-row .peek-side.short { color: var(--down); background: var(--down-soft); }
.peek-row .peek-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-soft); }
.peek-row .peek-qty { color: var(--muted); font-family: var(--mono); font-size: 8px; text-align: right; }
.peek-row .peek-pnl { font-family: var(--mono); font-size: 8.5px; text-align: right; }
.peek-empty {
  padding: 13px 8px;
  border: 1px dashed rgba(148, 169, 200, 0.11);
  border-radius: 6px;
  color: var(--muted-2);
  text-align: center;
  font-size: 8.5px;
}
.position-peek-empty { padding: 12px; text-align: center; color: var(--muted-2); font-size: 8.5px; }
.risk-caption { font-size: 8.5px; }
.risk-pill { font-size: 8.5px; }
.exposure-grid b { font-size: 10.5px; }
.exposure-grid span { font-size: 8px; }
.position-peek-head { font-size: 9px; }
.position-peek-head b { font-size: 10px; }
.position-peek-head button { font-size: 8.5px; }
.peek-row { font-size: 9.5px; padding: 6px 6px; grid-template-columns: 27px minmax(0, 1fr) 65px 70px; }
.peek-row .peek-name { font-size: 9.5px; }
.peek-row .peek-qty { font-size: 9px; }
.peek-row .peek-pnl { font-size: 9.5px; }
.peek-row .peek-side { font-size: 8px; }
.risk-hud-head span { font-size: 9.5px; }

/* ── hide the regular shell while on air ─────────────────────────────────── */
body.live-active { overflow: hidden; background: #03060b; }
body.live-active .topbar,
body.live-active .site-footer,
body.live-active .rail-scrim,
body.live-active .toast-stack { display: none !important; }
body.live-active .app-main { max-width: none; padding: 0; }
body.live-active .ambient-a { opacity: 0.35; }
body.live-active .ambient-b { opacity: 0.5; }
body.live-active #view-live { display: block; }

/* ── broadcast stage ─────────────────────────────────────────────────────── */
.live-stage {
  display: flex;
  flex-direction: column;
  gap: 9px;
  height: 100vh;
  padding: 12px 16px 9px;
  background:
    radial-gradient(900px 380px at 20% -12%, rgba(230, 193, 123, 0.08), transparent 70%),
    radial-gradient(900px 480px at 88% 112%, rgba(65, 156, 211, 0.09), transparent 72%),
    #03070d;
  overflow: hidden;
}
.live-header {
  display: flex;
  align-items: center;
  gap: 13px;
  flex: none;
  min-height: 54px;
  padding: 7px 12px;
  border: 1px solid rgba(148, 169, 200, 0.12);
  border-radius: 11px;
  background: linear-gradient(180deg, rgba(14, 23, 38, 0.92), rgba(7, 12, 20, 0.9));
  box-shadow: 0 10px 34px rgba(0, 0, 0, 0.28);
}
.live-logo { display: flex; align-items: center; gap: 9px; padding-right: 13px; border-right: 1px solid var(--border); }
.live-logo-mark {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid rgba(230, 193, 123, 0.3);
  background: linear-gradient(145deg, #f3dba9, #b88944);
  color: #1b1306;
  font-family: var(--mono);
  font-size: 17px;
  font-weight: 800;
  box-shadow: 0 0 25px rgba(230, 193, 123, 0.12);
}
.live-logo div { display: flex; flex-direction: column; line-height: 1.15; }
.live-logo b { font-family: var(--mono); font-size: 16px; letter-spacing: 0.2em; color: var(--gold-bright); }
.live-logo span { font-size: 7.5px; letter-spacing: 0.13em; color: var(--muted-2); }
.live-onair {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  border: 1px solid rgba(255, 93, 117, 0.28);
  border-radius: 5px;
  background: rgba(255, 93, 117, 0.08);
  color: var(--up);
  font-family: var(--mono);
  font-size: 8.5px;
  font-weight: 600;
  letter-spacing: 0.12em;
  white-space: nowrap;
}
.live-onair i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--up);
  box-shadow: 0 0 10px rgba(255, 93, 117, 0.85);
  animation: breathe 1.25s ease-in-out infinite;
}
.live-header-clock { display: flex; flex-direction: column; gap: 0; padding: 0 4px; }
.live-header-clock b { font-family: var(--mono); font-size: 18px; font-weight: 600; letter-spacing: 0.04em; color: var(--text); line-height: 1.1; }
.live-header-clock span { font-size: 8px; color: var(--muted-2); }
.live-header-clock em { font-style: normal; color: var(--gold); }
.live-heat {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
}
.live-heat span { font-family: var(--mono); font-size: 7px; letter-spacing: 0.1em; color: var(--up); }
.live-heat b { font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--gold); }
.live-identity { display: flex; align-items: center; gap: 8px; min-width: 0; margin-left: auto; }
.live-avatar {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid rgba(99, 212, 255, 0.2);
  background: rgba(99, 212, 255, 0.09);
  color: var(--cyan);
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 700;
}
.live-identity-copy { display: flex; flex-direction: column; min-width: 0; gap: 1px; }
.live-identity-copy b { font-size: 11.5px; color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 150px; }
.live-identity-copy span { font-size: 7.5px; color: var(--down); letter-spacing: 0.04em; white-space: nowrap; }
.live-rank-badge {
  padding: 4px 7px;
  border: 1px solid rgba(230, 193, 123, 0.25);
  border-radius: 4px;
  color: var(--gold);
  background: var(--gold-soft);
  font-family: var(--mono);
  font-size: 10px;
  white-space: nowrap;
}
.live-actions { display: flex; gap: 5px; margin-left: 5px; }
.live-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 5px;
  color: var(--muted);
  font-size: 8.5px;
  white-space: nowrap;
}
.live-action-btn svg { width: 12px; height: 12px; }
.live-action-btn:hover { color: var(--text); border-color: var(--border-strong); background: rgba(255, 255, 255, 0.035); }
.live-action-btn.exit:hover { color: var(--up); border-color: rgba(255, 93, 117, 0.25); background: var(--up-soft); }

.live-ticker {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
  height: 33px;
  padding: 0 10px;
  border: 1px solid rgba(148, 169, 200, 0.1);
  border-radius: 7px;
  background: rgba(6, 11, 18, 0.86);
  overflow: hidden;
}
.live-ticker-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: none;
  color: var(--up);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.12em;
}
.live-ticker-label i { width: 4px; height: 4px; border-radius: 50%; background: var(--up); box-shadow: 0 0 7px rgba(255, 93, 117, 0.8); }
.live-ticker-window { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; }
.live-ticker-track {
  display: inline-flex;
  gap: 42px;
  min-width: max-content;
  animation: liveMarquee 32s linear infinite;
  color: var(--text-soft);
  font-family: var(--mono);
  font-size: 9px;
}
.live-ticker-track span { white-space: nowrap; }
.live-ticker-track b { color: var(--gold); font-weight: 500; }
.live-ticker-season { flex: none; color: var(--muted-2); font-family: var(--mono); font-size: 7.5px; letter-spacing: 0.08em; }

.live-grid {
  display: grid;
  grid-template-columns: 326px minmax(0, 1fr);
  gap: 9px;
  flex: 1;
  min-height: 0;
}
.live-left, .live-right { display: flex; flex-direction: column; gap: 9px; min-height: 0; min-width: 0; }
.live-panel {
  position: relative;
  border: 1px solid rgba(148, 169, 200, 0.12);
  border-radius: 11px;
  background: linear-gradient(155deg, rgba(13, 22, 36, 0.93), rgba(5, 9, 16, 0.94));
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.24);
  overflow: hidden;
}
.live-account-panel { flex: none; padding: 13px 14px 10px; }
.live-panel-kicker {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted-2);
  font-family: var(--mono);
  font-size: 7.5px;
  letter-spacing: 0.12em;
}
.live-panel-kicker span { color: var(--gold); }
.live-equity-label { margin-top: 12px; color: var(--muted); font-size: 8.5px; letter-spacing: 0.05em; }
.live-equity {
  margin-top: 2px;
  font-family: var(--mono);
  font-size: clamp(30px, 2.3vw, 42px);
  line-height: 0.98;
  font-weight: 620;
  letter-spacing: -0.06em;
  color: #f7f3ea;
  text-shadow: 0 0 35px rgba(230, 193, 123, 0.08);
}
.live-return-row { display: flex; align-items: baseline; gap: 8px; margin-top: 5px; }
.live-return { font-family: var(--mono); font-size: 17px; font-weight: 600; }
.live-return-sub { color: var(--muted-2); font-size: 8px; }
.live-kpi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px 12px;
  margin-top: 12px;
  padding: 8px 0;
  border-top: 1px solid rgba(148, 169, 200, 0.07);
  border-bottom: 1px solid rgba(148, 169, 200, 0.07);
}
.live-kpi-grid span { display: block; color: var(--muted-2); font-size: 7.5px; }
.live-kpi-grid b { display: block; margin-top: 1px; font-family: var(--mono); font-size: 10.5px; font-weight: 500; color: var(--text-soft); }
.live-leverage-block { margin-top: 9px; }
.live-leverage-head { display: flex; align-items: baseline; justify-content: space-between; }
.live-leverage-head span { color: var(--muted); font-family: var(--mono); font-size: 8px; letter-spacing: 0.09em; }
.live-leverage-head b { font-family: var(--mono); font-size: 25px; line-height: 1; font-weight: 620; color: var(--gold); }
.live-leverage-meter { height: 6px; margin: 7px 0 5px; border-radius: 99px; background: rgba(148, 169, 200, 0.08); overflow: hidden; }
.live-leverage-meter i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--down), var(--gold) 55%, var(--up)); transition: width 500ms ease; }
.live-risk-meta { display: flex; align-items: center; justify-content: space-between; gap: 5px; color: var(--muted-2); font-size: 8px; }
.live-risk-pill { padding: 2px 6px; border-radius: 3px; font-size: 8px; font-weight: 600; }
.live-risk-pill.safe { color: var(--down); background: var(--down-soft); }
.live-risk-pill.caution { color: var(--gold); background: var(--gold-soft); }
.live-risk-pill.danger { color: var(--up); background: var(--up-soft); }
.live-risk-pill.idle { color: var(--muted); background: rgba(148, 169, 200, 0.08); }
.live-exposure-line { display: flex; align-items: center; justify-content: space-between; gap: 5px; margin-top: 7px; padding-top: 7px; border-top: 1px solid rgba(148, 169, 200, 0.07); color: var(--muted-2); font-size: 7.5px; }
.live-exposure-line b { color: var(--text-soft); font-family: var(--mono); font-weight: 500; font-size: 8.5px; }
.live-rank-panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.live-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: none;
  padding: 9px 12px;
  border-bottom: 1px solid rgba(148, 169, 200, 0.07);
  color: var(--muted);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.1em;
}
.live-panel-head span:last-child { color: var(--muted-2); font-size: 7.5px; letter-spacing: 0.04em; }
.live-leaderboard { flex: 1; overflow-y: auto; padding: 5px 6px; }
.live-rank-row {
  display: grid;
  grid-template-columns: 20px 25px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  padding: 7px 5px;
  border-radius: 5px;
  cursor: pointer;
}
.live-rank-row:hover { background: rgba(255, 255, 255, 0.035); }
.live-rank-row.mine { background: linear-gradient(90deg, rgba(230, 193, 123, 0.1), transparent); border-left: 2px solid var(--gold); padding-left: 3px; }
.live-rank-pos { font-family: var(--mono); font-size: 9px; color: var(--muted-2); }
.live-rank-row:nth-child(1) .live-rank-pos { color: var(--gold); }
.live-rank-avatar { width: 23px; height: 23px; border-radius: 5px; display: grid; place-items: center; background: rgba(99, 212, 255, 0.08); color: var(--cyan); font-family: var(--mono); font-size: 8px; }
.live-rank-row:nth-child(1) .live-rank-avatar { color: var(--gold); background: var(--gold-soft); }
.live-rank-copy { min-width: 0; }
.live-rank-copy b { display: block; font-size: 9px; color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live-rank-copy span { display: block; color: var(--muted-2); font-size: 7px; white-space: nowrap; }
.live-rank-return { font-family: var(--mono); font-size: 10px; font-weight: 500; text-align: right; }
.live-rank-mine { flex: none; padding: 7px 12px; border-top: 1px solid rgba(148, 169, 200, 0.07); color: var(--muted); font-family: var(--mono); font-size: 8px; }
.live-loading { padding: 25px 10px; text-align: center; color: var(--muted-2); font-size: 8px; }

.live-right { flex: 1; }
.live-chart-panel { flex: 1; display: flex; flex-direction: column; min-height: 260px; }
.live-stock-head {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: none;
  min-height: 55px;
  padding: 8px 13px;
  border-bottom: 1px solid rgba(148, 169, 200, 0.07);
}
.live-stock-meta { display: flex; align-items: baseline; gap: 7px; min-width: 0; flex-wrap: wrap; }
.live-stock-sector { padding: 2px 6px; border-radius: 3px; color: var(--cyan); border: 1px solid rgba(99, 212, 255, 0.18); background: rgba(99, 212, 255, 0.07); font-size: 7.5px; }
.live-stock-meta b { font-size: 18px; font-weight: 620; color: var(--text); letter-spacing: -0.01em; }
.live-stock-meta > span:last-child { color: var(--muted-2); font-family: var(--mono); font-size: 8.5px; }
.live-stock-quote { margin-left: auto; display: flex; align-items: baseline; gap: 9px; }
.live-stock-quote b { font-family: var(--mono); font-size: 25px; line-height: 1; font-weight: 620; letter-spacing: -0.03em; }
.live-stock-quote span { font-family: var(--mono); font-size: 10px; }
.live-timeframes { display: flex; gap: 2px; padding: 2px; border: 1px solid var(--border); border-radius: 5px; }
.live-timeframes button { padding: 2px 6px; border-radius: 3px; color: var(--muted-2); font-family: var(--mono); font-size: 8px; }
.live-timeframes button.active { color: var(--gold); background: var(--gold-soft); }
.live-focus-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: none;
  padding: 4px 7px;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--muted-2);
  font-size: 8px;
  white-space: nowrap;
}
.live-focus-btn i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--muted-2);
}
.live-focus-btn.active {
  color: var(--down);
  border-color: rgba(47, 211, 162, 0.22);
  background: var(--down-soft);
}
.live-focus-btn.active i {
  background: var(--down);
  box-shadow: 0 0 7px rgba(47, 211, 162, 0.75);
  animation: breathe 1.5s ease-in-out infinite;
}
.live-action-spotlight {
  position: absolute;
  z-index: 6;
  top: 11px;
  left: 12px;
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: min(55%, 440px);
  padding: 8px 10px;
  border: 1px solid rgba(230, 193, 123, 0.28);
  border-radius: 7px;
  background: linear-gradient(110deg, rgba(12, 19, 31, 0.96), rgba(8, 13, 21, 0.82));
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(10px);
  animation: liveActionIn 280ms cubic-bezier(0.22, 1, 0.36, 1);
}
.live-action-side {
  flex: none;
  padding: 5px 7px;
  border-radius: 4px;
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.live-action-side.buy { color: var(--up); background: var(--up-soft); border: 1px solid rgba(255, 93, 117, 0.22); }
.live-action-side.sell { color: var(--down); background: var(--down-soft); border: 1px solid rgba(47, 211, 162, 0.22); }
.live-action-side.order { color: var(--gold); background: var(--gold-soft); border: 1px solid rgba(230, 193, 123, 0.22); }
.live-action-copy { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.live-action-kicker { color: var(--muted-2); font-family: var(--mono); font-size: 7px; letter-spacing: 0.1em; }
.live-action-copy b { color: var(--text); font-size: 12px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live-action-copy > span:last-child { color: var(--muted); font-family: var(--mono); font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live-action-ts { align-self: flex-start; color: var(--muted-2); font-family: var(--mono); font-size: 7.5px; white-space: nowrap; }

@keyframes liveActionIn {
  0% { opacity: 0; transform: translateY(-6px) scale(0.98); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
.live-chart-wrap { flex: 1; min-height: 0; position: relative; }
.live-price-chart { position: absolute; inset: 0; }
.live-grid-btn svg { width: 10px; height: 10px; }
.live-grid-btn.active {
  color: var(--gold);
  border-color: rgba(230, 193, 123, 0.25);
  background: var(--gold-soft);
}
.live-grid-btn.active i { background: var(--gold); box-shadow: 0 0 7px rgba(230, 193, 123, 0.65); }
.live-chart-panel.is-multi .live-timeframes,
.live-chart-panel.is-multi #liveFocusBtn { display: none; }
.live-chart-panel.grid-view .live-price-chart,
.live-chart-panel.grid-view .live-chart-watermark,
.live-chart-panel.grid-view .live-chart-badge,
.live-chart-panel.grid-view .live-lower-third,
.live-chart-panel.grid-view .live-action-spotlight { display: none; }
.live-chart-grid {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(var(--live-grid-cols, 2), minmax(0, 1fr));
  grid-auto-rows: minmax(0, 1fr);
  gap: 6px;
  padding: 7px;
  overflow-y: auto;
  background:
    radial-gradient(600px 200px at 50% -20%, rgba(230, 193, 123, 0.045), transparent 70%),
    rgba(4, 8, 14, 0.42);
}
.live-chart-cell {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  padding: 8px 10px 7px;
  border: 1px solid rgba(148, 169, 200, 0.1);
  border-radius: 7px;
  background: linear-gradient(155deg, rgba(16, 26, 43, 0.72), rgba(5, 9, 16, 0.55));
  color: var(--text);
  text-align: left;
  cursor: pointer;
  overflow: hidden;
  transition: border-color 140ms ease, background 140ms ease;
}
.live-chart-cell:hover { border-color: rgba(230, 193, 123, 0.28); background: rgba(230, 193, 123, 0.035); }
.live-chart-cell.selected { border-color: rgba(230, 193, 123, 0.4); box-shadow: inset 0 0 0 1px rgba(230, 193, 123, 0.1); }
.live-chart-cell.flash { animation: liveCellFlash 700ms ease; }
@keyframes liveCellFlash {
  0% { background: rgba(230, 193, 123, 0.18); }
  100% { background: linear-gradient(155deg, rgba(16, 26, 43, 0.72), rgba(5, 9, 16, 0.55)); }
}
.live-chart-cell-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 7px; }
.live-chart-cell-name { min-width: 0; display: flex; align-items: baseline; gap: 5px; }
.live-chart-cell-name b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 600; }
.live-chart-cell-name span { flex: none; color: var(--muted-2); font-family: var(--mono); font-size: 7.5px; }
.live-chart-cell .live-pos-side { flex: none; padding: 2px 4px; font-size: 6.5px; }
.live-chart-cell-quote { display: flex; align-items: baseline; gap: 7px; margin-top: 5px; }
.live-chart-cell-quote b { font-family: var(--mono); font-size: 17px; line-height: 1; font-weight: 600; letter-spacing: -0.03em; }
.live-chart-cell-quote span { font-family: var(--mono); font-size: 8.5px; }
.live-chart-cell-spark { display: flex; align-items: center; justify-content: center; flex: 1; min-height: 28px; margin: 3px -2px 2px; opacity: 0.9; }
.live-chart-cell-spark svg { display: block; width: 100%; height: 100%; }
.live-grid-no-spark { color: var(--muted-2); font-size: 8px; }
.live-chart-cell-foot { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding-top: 5px; border-top: 1px solid rgba(148, 169, 200, 0.07); color: var(--muted-2); font-family: var(--mono); font-size: 7.5px; white-space: nowrap; }
.live-chart-cell-foot b { font-size: 9px; font-weight: 550; }
.live-chart-watermark {
  position: absolute;
  z-index: 1;
  top: 43%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: rgba(230, 193, 123, 0.04);
  font-family: var(--mono);
  font-size: clamp(34px, 4vw, 62px);
  font-weight: 700;
  letter-spacing: 0.16em;
  pointer-events: none;
  white-space: nowrap;
}
.live-chart-watermark span { color: rgba(255, 93, 117, 0.09); }
.live-chart-badge {
  position: absolute;
  z-index: 3;
  top: 9px;
  right: 11px;
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--muted-2);
  font-family: var(--mono);
  font-size: 7px;
  letter-spacing: 0.08em;
  pointer-events: none;
}
.live-chart-badge i { width: 4px; height: 4px; border-radius: 50%; background: var(--down); box-shadow: 0 0 7px rgba(47, 211, 162, 0.7); }
.live-lower-third {
  position: absolute;
  z-index: 4;
  left: 12px;
  bottom: 11px;
  max-width: min(76%, 720px);
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 10px;
  border: 1px solid rgba(230, 193, 123, 0.18);
  border-radius: 5px;
  background: linear-gradient(90deg, rgba(8, 13, 21, 0.92), rgba(8, 13, 21, 0.55));
  backdrop-filter: blur(8px);
}
.live-lower-label { flex: none; color: var(--gold); font-family: var(--mono); font-size: 7px; letter-spacing: 0.11em; }
.live-lower-third b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-soft); font-size: 9.5px; font-weight: 500; }
.live-lower-third.flash { animation: liveLowerFlash 650ms ease; }

.live-bottom {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
  gap: 9px;
  flex: 0 0 238px;
  min-height: 0;
}
.live-positions-panel, .live-commentary-panel { display: flex; flex-direction: column; min-height: 0; }
.live-positions { flex: 1; overflow-y: auto; padding: 4px 7px; }
.live-position-row {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) 80px minmax(0, 1fr) 76px;
  gap: 8px;
  align-items: center;
  padding: 7px 5px;
  border-bottom: 1px solid rgba(148, 169, 200, 0.045);
}
.live-position-row:last-child { border-bottom: 0; }
.live-pos-name { min-width: 0; }
.live-pos-name b { display: block; font-size: 10.5px; color: var(--text); font-weight: 560; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-pos-name span { display: block; margin-top: 1px; color: var(--muted-2); font-family: var(--mono); font-size: 7.5px; }
.live-pos-side { display: inline-flex; padding: 2px 5px; border-radius: 3px; font-size: 7px; font-weight: 700; text-align: center; }
.live-pos-side.long { color: var(--up); background: var(--up-soft); }
.live-pos-side.short { color: var(--down); background: var(--down-soft); }
.live-pos-bar { height: 4px; border-radius: 99px; background: rgba(148, 169, 200, 0.08); overflow: hidden; }
.live-pos-bar i { display: block; height: 100%; border-radius: inherit; background: var(--gold); }
.live-pos-pnl { text-align: right; font-family: var(--mono); font-size: 9.5px; }
.live-pos-pnl span { display: block; font-size: 7.5px; }
.live-pos-value { text-align: right; color: var(--muted); font-family: var(--mono); font-size: 8.5px; }
.live-positions-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex: none;
  padding: 7px 12px;
  border-top: 1px solid rgba(148, 169, 200, 0.07);
  color: var(--muted-2);
  font-size: 7.5px;
}
.live-positions-summary b { margin-left: 3px; color: var(--text-soft); font-family: var(--mono); font-weight: 500; }
.live-empty { padding: 32px 10px; text-align: center; color: var(--muted-2); font-size: 9px; }
.live-feed { flex: 1; overflow-y: auto; padding: 4px 9px; }
.live-feed-item {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 7px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(148, 169, 200, 0.04);
}
.live-feed-item:last-child { border-bottom: 0; }
.live-feed-time { color: var(--muted-2); font-family: var(--mono); font-size: 7px; padding-top: 2px; }
.live-feed-item b { display: block; color: var(--text-soft); font-size: 8.5px; font-weight: 560; }
.live-feed-item p { margin: 1px 0 0; color: var(--muted-2); font-size: 8px; line-height: 1.45; }
.live-feed-item.fill b { color: var(--gold); }
.live-feed-item.news b { color: var(--up); }
.live-feed-item.rank b { color: var(--cyan); }
.live-feed-item.system b { color: var(--down); }
.live-commentary-live { display: flex; align-items: center; gap: 4px; color: var(--down) !important; }
.live-commentary-live i { width: 4px; height: 4px; border-radius: 50%; background: var(--down); box-shadow: 0 0 6px rgba(47, 211, 162, 0.7); animation: breathe 1.8s infinite; }

.live-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
  min-height: 30px;
  padding: 0 2px;
  color: var(--muted-2);
  font-size: 8px;
}
.live-footer-label { color: var(--muted-2); font-family: var(--mono); font-size: 7px; letter-spacing: 0.08em; white-space: nowrap; }
.live-hot-chips { display: flex; align-items: center; gap: 5px; overflow-x: auto; scrollbar-width: none; }
.live-hot-chips::-webkit-scrollbar { display: none; }
.live-hot-chip {
  flex: none;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 7px;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--muted);
  font-size: 8px;
  transition: all 130ms ease;
}
.live-hot-chip:hover { color: var(--text); border-color: var(--border-strong); background: rgba(255, 255, 255, 0.035); }
.live-hot-chip b { font-family: var(--mono); font-size: 8px; font-weight: 500; }
.live-footer-note { margin-left: auto; white-space: nowrap; font-size: 7px; color: rgba(86, 100, 123, 0.7); }

/* ── readability upgrade (desktop) ──────────────────────────────────────── */
@media (min-width: 1280px) {
  body { font-size: 14px; }
  .nav-btn { font-size: 13px; }
  .big-equity { font-size: 33px; }
  .account-mini-grid span { font-size: 8.5px; }
  .account-mini-grid b { font-size: 11px; }
  .hero-name { font-size: 28px; }
  .hero-price { font-size: 44px; }
  .hero-stat span { font-size: 8.5px; }
  .hero-stat b { font-size: 11.5px; }
  .card-title { font-size: 12.5px; }
  .card-sub { font-size: 9px; }
  .stock-row { min-height: 50px; }
  .stock-ident b { font-size: 12.5px; }
  .stock-ident span { font-size: 9px; }
  .stock-price { font-size: 12.5px; }
  .stock-change { font-size: 10px; }
  .book-row { height: 20px; font-size: 10.5px; }
  .book-row .bqty, .book-row .btotal { font-size: 9.5px; }
  .tape-row { height: 22px; font-size: 10px; }
  .tape-row .t-time { font-size: 8.5px; }
  .data-table th { font-size: 9px; padding-top: 9px; padding-bottom: 9px; }
  .data-table td { font-size: 11px; padding-top: 10px; padding-bottom: 10px; }
  .blotter-tab { font-size: 11px; }
  .lead .card-title { font-size: 13px; }
  .ticket-fields { gap: 10px; }
  .field-label { font-size: 9px; }
  .stepper input { font-size: 15px; }
  .ticket-summary span { font-size: 8.5px; }
  .ticket-summary b { font-size: 10.5px; }
  .submit-order { height: 48px; font-size: 12.5px; }
  .leaderboard-table th { font-size: 9px; }
  .leaderboard-table td { font-size: 11px; }
  .arena-metric b { font-size: 21px; }
}

@media (min-width: 1400px) {
  .trade-layout { grid-template-columns: 304px minmax(0, 1fr) 372px; }
  .risk-hud-head b { font-size: 23px; }
  .position-peek-body { gap: 5px; }
}

@keyframes liveMarquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes liveLowerFlash {
  0% { border-color: rgba(230, 193, 123, 0.8); box-shadow: 0 0 24px rgba(230, 193, 123, 0.16); }
  100% { border-color: rgba(230, 193, 123, 0.18); box-shadow: none; }
}

@media (max-width: 1100px) {
  .live-grid { grid-template-columns: 285px minmax(0, 1fr); }
  .live-account-panel { padding-left: 11px; padding-right: 11px; }
  .live-equity { font-size: 36px; }
  .live-identity-copy b { max-width: 100px; }
  .live-heat { display: none; }
  .live-bottom { grid-template-columns: 1fr; }
  .live-commentary-panel { display: none; }
}
.live-hot-chip.active {
  color: var(--gold);
  border-color: rgba(230, 193, 123, 0.3);
  background: var(--gold-soft);
}

/* live rank summary + position concentration */
.live-rank-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  flex: none;
  padding: 8px 11px;
  border-top: 1px solid rgba(148, 169, 200, 0.07);
  background: rgba(255, 255, 255, 0.015);
}
.live-rank-summary div { min-width: 0; }
.live-rank-summary span { display: block; color: var(--muted-2); font-family: var(--mono); font-size: 6.5px; letter-spacing: 0.05em; }
.live-rank-summary b { display: block; margin-top: 2px; color: var(--text-soft); font-family: var(--mono); font-size: 10px; font-weight: 500; }
.live-rank-summary b.up-text { color: var(--up); }
.live-rank-summary b.down-text { color: var(--down); }
.live-pos-concentration {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: none;
  padding: 5px 12px;
  color: var(--muted-2);
  font-size: 7.5px;
}
.live-pos-concentration-track { flex: 1; height: 3px; border-radius: 99px; overflow: hidden; background: rgba(148, 169, 200, 0.08); }
.live-pos-concentration-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--gold), var(--up)); transition: width 500ms ease; }
.live-pos-concentration b { min-width: 26px; color: var(--text-soft); font-family: var(--mono); font-size: 8px; font-weight: 500; text-align: right; }
.live-pos-concentration b.gold { color: var(--gold); }
.live-rank-mine b.gold { color: var(--gold); }
.live-stage.flash-fill { animation: liveFlashFill 850ms ease; }
.live-stage.flash-rank { animation: liveFlashRank 850ms ease; }
@keyframes liveFlashFill {
  0% { box-shadow: inset 0 0 0 rgba(255, 93, 117, 0); }
  18% { box-shadow: inset 0 0 110px rgba(255, 93, 117, 0.09); }
  100% { box-shadow: inset 0 0 0 rgba(255, 93, 117, 0); }
}
@keyframes liveFlashRank {
  0% { box-shadow: inset 0 0 0 rgba(230, 193, 123, 0); }
  18% { box-shadow: inset 0 0 110px rgba(230, 193, 123, 0.09); }
  100% { box-shadow: inset 0 0 0 rgba(230, 193, 123, 0); }
}

/* larger broadcast type */
.live-rank-row { padding: 10px 6px; }
.live-rank-copy b { font-size: 11.5px; }
.live-rank-copy span { font-size: 8px; }
.live-rank-return { font-size: 12.5px; }
.live-rank-pos { font-size: 10px; }
.live-rank-avatar { width: 27px; height: 27px; font-size: 9.5px; }
.live-position-row { padding: 11px 6px; grid-template-columns: minmax(0, 1.35fr) 92px minmax(0, 1fr) 82px; }
.live-pos-name b { font-size: 13px; }
.live-pos-name span { font-size: 8.5px; }
.live-pos-pnl { font-size: 12px; }
.live-pos-pnl span { font-size: 8.5px; }
.live-pos-value { font-size: 10px; }
.live-pos-bar { height: 5px; }
.live-positions-summary { font-size: 9px; padding: 8px 12px; }
.live-positions-summary b { font-size: 10px; }
.live-feed-item b { font-size: 10.5px; }
.live-feed-item p { font-size: 9.5px; }
.live-feed-time { font-size: 8px; }
.live-kpi-grid span { font-size: 8.5px; }
.live-kpi-grid b { font-size: 12.5px; }
.live-exposure-line { font-size: 8.5px; }
.live-exposure-line b { font-size: 9.5px; }
.live-stock-meta b { font-size: 20px; }
.live-stock-quote b { font-size: 28px; }
.live-rank-summary { padding: 9px 11px; }
.live-rank-summary b { font-size: 11.5px; }
.live-rank-mine { font-size: 9px; padding: 8px 12px; }
.live-ticker-track { font-size: 10px; }
.live-footer { font-size: 9px; }
.live-hot-chip { font-size: 9px; }
.live-lower-third b { font-size: 10.5px; }
.live-lower-label { font-size: 8px; }

@media (min-width: 1600px) {
  .live-grid { grid-template-columns: 360px minmax(0, 1fr); }
  .live-bottom { flex-basis: 260px; }
  .live-header { min-height: 60px; }
  .live-equity { font-size: 42px; }
  .live-rank-row { padding: 11px 7px; }
  .live-rank-copy b { font-size: 12px; }
  .live-rank-return { font-size: 13px; }
  .live-feed-item b { font-size: 11px; }
  .live-feed-item p { font-size: 10px; }
  .live-feed-time { font-size: 8.5px; }
  .live-stock-meta b { font-size: 22px; }
  .live-stock-quote b { font-size: 32px; }
}

/* ── positions risk strip in the main blotter ───────────────────────────── */
.position-risk-strip {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 9px 12px;
  border-bottom: 1px solid rgba(148, 169, 200, 0.08);
  background: rgba(8, 13, 21, 0.94);
  backdrop-filter: blur(8px);
}
.position-risk-strip > div { display: flex; align-items: baseline; gap: 5px; white-space: nowrap; }
.position-risk-strip span { color: var(--muted-2); font-size: 8px; }
.position-risk-strip b { color: var(--text-soft); font-family: var(--mono); font-size: 10px; font-weight: 500; }
.position-risk-strip .position-risk-status b.safe { color: var(--down); }
.position-risk-strip .position-risk-status b.caution { color: var(--gold); }
.position-risk-strip .position-risk-status b.danger { color: var(--up); }
.position-risk-strip .position-risk-status b.idle { color: var(--muted); }
.position-risk-strip .position-risk-meter {
  flex: 1;
  min-width: 50px;
  height: 3px;
  border-radius: 99px;
  overflow: hidden;
  background: rgba(148, 169, 200, 0.08);
}
.position-risk-strip .position-risk-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--down), var(--gold), var(--up));
}
.position-weight {
  display: inline-block;
  width: 34px;
  height: 3px;
  margin-right: 5px;
  border-radius: 99px;
  overflow: hidden;
  vertical-align: middle;
  background: rgba(148, 169, 200, 0.09);
}
.position-weight i { display: block; height: 100%; border-radius: inherit; background: var(--gold); }
.data-table td small { color: var(--muted-2); font-family: var(--mono); font-size: 8px; }

@media (max-width: 1280px) {
  .position-risk-strip { gap: 9px; }
  .position-risk-strip > div:nth-child(2) { display: none; }
}

.toast-stack {
  top: auto;
  right: auto;
  left: 16px;
  bottom: 16px;
  align-items: flex-start;
  max-width: min(360px, calc(100vw - 32px));
}

@media (max-width: 720px) {
  .live-entry { gap: 0; padding: 7px; font-size: 0; }
  .live-entry-dot { width: 6px; height: 6px; }
  .toast-stack { top: auto; bottom: 12px; left: 10px; right: 10px; max-width: none; }
}

@media (max-width: 760px) {
  body.live-active { overflow: auto; }
  .live-stage { height: auto; min-height: 100vh; overflow: visible; padding: 8px; }
  .live-header { flex-wrap: wrap; }
  .live-logo { border-right: 0; }
  .live-header-clock { display: none; }
  .live-identity { margin-left: 0; }
  .live-actions { margin-left: auto; }
  .live-grid { grid-template-columns: 1fr; }
  .live-rank-panel { min-height: 260px; }
  .live-chart-panel { min-height: 430px; }
  .live-chart-wrap { min-height: 340px; }
  .live-stock-head { flex-wrap: wrap; gap: 5px 10px; padding: 8px 11px; }
  .live-stock-meta { flex: 1 1 100%; }
  .live-stock-meta b { font-size: 18px; white-space: nowrap; }
  .live-stock-quote { margin-left: 0; }
  .live-stock-quote b { font-size: 24px; }
  .live-timeframes { margin-left: auto; }
  .live-bottom { flex: none; }
  .live-footer { flex-wrap: wrap; }
  .live-ticker-season { display: none; }
}
