/* ============================================================== themes ====
   Three schemes. The whole app reads these variables, nothing else.
   1. light  - white sidebar, indigo accent
   2. dark   - full dark UI, sky accent
   3. warm   - cream surfaces, brown sidebar, rust accent
   ========================================================================= */

:root,
[data-theme="light"] {
  --bg: #f6f7f9;
  --fg: #111827;
  --card: #ffffff;
  --muted: #6b7280;
  --line: #e5e7eb;
  --surface-2: #f9fafb;
  --field-bg: #ffffff;
  --primary: #4f46e5;
  --primary-fg: #ffffff;
  --primary-soft: #eef2ff;
  --primary-line: #c7d2fe;
  --sidebar: #ffffff;
  --sidebar-fg: #4b5563;
  --sidebar-hover: #f3f4f6;
  --sidebar-active: #eef2ff;
  --sidebar-active-fg: #4f46e5;
  --brand-fg: #111827;
  --chip-bg: #f3f4f6;
  --chip-fg: #374151;
  --danger: #dc2626;
  --danger-bg: #fef2f2;
  --danger-line: #fecaca;
  --warn-bg: #fffbeb;
  --warn-line: #fde68a;
  --auth-bg: linear-gradient(160deg, #4f46e5, #312e81);
  --shadow: 0 1px 2px rgb(17 24 39 / 0.04), 0 4px 14px rgb(17 24 39 / 0.06);
}

/* Added: three extra schemes (midnight, emerald, royal) so the header switcher can offer 6 total. */
[data-theme="midnight"] {
    --bg: #0B1220;
    --fg: #E2E8F0;
    --card: #131C2E;
    --muted: #94A3B8;
    --line: #1B2740;
    --surface-2: #0F1728;
    --field-bg: #0F1728;
    --primary: #14B8A6;
    --primary-fg: #04211D;
    --primary-soft: #0F2A28;
    --primary-line: #155E56;
    --sidebar: #070C16;
    --sidebar-fg: #94A3B8;
    --sidebar-hover: #101A2C;
    --sidebar-active: #10233A;
    --sidebar-active-fg: #2DD4BF;
    --brand-fg: #F8FAFC;
    --chip-bg: #1B2740;
    --chip-fg: #CBD5E1;
    --danger: #F43F5E;
    --danger-bg: #2A1520;
    --danger-line: #5C1F2C;
    --warn-bg: #2A1508;
    --warn-line: #7C4A10;
    --auth-bg: linear-gradient(160deg, #14B8A6, #0B1220);
    --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 10px 28px rgb(0 0 0 / 0.35);
}

[data-theme="emerald"] {
    --bg: #FAF7F0;
    --fg: #1F2937;
    --card: #FFFFFF;
    --muted: #6B7280;
    --line: #E7E0D2;
    --surface-2: #F3EFE4;
    --field-bg: #FFFFFF;
    --primary: #0E9F6E;
    --primary-fg: #FFFFFF;
    --primary-soft: #E3F5EC;
    --primary-line: #A7E0C7;
    --sidebar: #0F3D3E;
    --sidebar-fg: #A9CFC9;
    --sidebar-hover: #145C55;
    --sidebar-active: #145C55;
    --sidebar-active-fg: #F2C94C;
    --brand-fg: #FFFFFF;
    --chip-bg: #EFEAD9;
    --chip-fg: #4B4636;
    --danger: #E76F51;
    --danger-bg: #FBEDE7;
    --danger-line: #F2C2AE;
    --warn-bg: #FEF3E2;
    --warn-line: #F2D28A;
    --auth-bg: linear-gradient(160deg, #0F3D3E, #0A2B2C);
    --shadow: 0 1px 2px rgb(15 61 62 / 0.06), 0 10px 28px rgb(15 61 62 / 0.08);
}

[data-theme="royal"] {
    --bg: #F5F3FF;
    --fg: #1E1B4B;
    --card: #FFFFFF;
    --muted: #6D6A8C;
    --line: #E4E0FA;
    --surface-2: #EDEAFB;
    --field-bg: #FFFFFF;
    --primary: #6366F1;
    --primary-fg: #FFFFFF;
    --primary-soft: #EEF0FF;
    --primary-line: #C7CBFA;
    --sidebar: #1E1B4B;
    --sidebar-fg: #A5A0D9;
    --sidebar-hover: #322C7D;
    --sidebar-active: #322C7D;
    --sidebar-active-fg: #EAB308;
    --brand-fg: #FFFFFF;
    --chip-bg: #E4E0FA;
    --chip-fg: #3D3875;
    --danger: #F43F5E;
    --danger-bg: #FEE2E6;
    --danger-line: #F9B7C1;
    --warn-bg: #FEF3E2;
    --warn-line: #F5DE9C;
    --auth-bg: linear-gradient(160deg, #6366F1, #1E1B4B);
    --shadow: 0 1px 2px rgb(30 27 75 / 0.06), 0 10px 28px rgb(30 27 75 / 0.08);
}

}
}
}

[data-theme="dark"] {
  --bg: #0b1220;
  --fg: #e8ecf4;
  --card: #141c2e;
  --muted: #94a3b8;
  --line: #24304a;
  --surface-2: #0f1728;
  --field-bg: #0f1728;
  --primary: #38bdf8;
  --primary-fg: #04121f;
  --primary-soft: #10243a;
  --primary-line: #1e496b;
  --sidebar: #070d18;
  --sidebar-fg: #97a5bb;
  --sidebar-hover: #141c2e;
  --sidebar-active: #10243a;
  --sidebar-active-fg: #7dd3fc;
  --brand-fg: #ffffff;
  --chip-bg: #1b2539;
  --chip-fg: #cbd5e1;
  --danger: #f87171;
  --danger-bg: #2a1417;
  --danger-line: #5b2026;
  --warn-bg: #2a2313;
  --warn-line: #5c4a16;
  --auth-bg: linear-gradient(160deg, #0f1728, #070d18);
  --shadow: 0 1px 2px rgb(0 0 0 / 0.4), 0 6px 18px rgb(0 0 0 / 0.35);
}

[data-theme="warm"] {
  --bg: #faf6f0;
  --fg: #1c1917;
  --card: #ffffff;
  --muted: #78716c;
  --line: #e7ded2;
  --surface-2: #faf7f2;
  --field-bg: #ffffff;
  --primary: #c2410c;
  --primary-fg: #ffffff;
  --primary-soft: #fff3ec;
  --primary-line: #fbd0b5;
  --sidebar: #3b2f2a;
  --sidebar-fg: #d9cec4;
  --sidebar-hover: #4c3d36;
  --sidebar-active: #c2410c;
  --sidebar-active-fg: #ffffff;
  --brand-fg: #ffffff;
  --chip-bg: #f4ece2;
  --chip-fg: #57534e;
  --danger: #b91c1c;
  --danger-bg: #fef2f2;
  --danger-line: #fecaca;
  --warn-bg: #fdf6e3;
  --warn-line: #eddcb5;
  --auth-bg: linear-gradient(160deg, #4c3d36, #2b211d);
  --shadow: 0 1px 2px rgb(28 25 23 / 0.05), 0 4px 14px rgb(28 25 23 / 0.07);
}

/* ============================================================== base ===== */
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font: 15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; background: var(--bg); color: var(--fg); -webkit-text-size-adjust: 100%; }
a { color: var(--primary); text-decoration: none; }

.auth { min-height: 100dvh; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--auth-bg); }
.login-card { width: min(420px, 100%); }
.eyebrow { letter-spacing: .18em; text-transform: uppercase; font-size: 11px; color: var(--primary); font-weight: 700; }

.app { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 100dvh; }
.sidebar { background: var(--sidebar); color: var(--sidebar-fg); border-right: 1px solid var(--line); padding: 18px 12px 28px; display: none; flex-direction: column; gap: 10px; }
.sidebar .brand { font-weight: 700; color: var(--brand-fg); padding: 0 10px 12px; }
.sidebar nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.sidebar a { color: var(--sidebar-fg); padding: 9px 12px; border-radius: 8px; font-size: 14px; }
.sidebar a:hover { background: var(--sidebar-hover); }
.sidebar a.active { background: var(--sidebar-active); color: var(--sidebar-active-fg); font-weight: 600; }

.main { width: 100%; max-width: none; padding: 16px 14px 92px; }
.top { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.top h1 { margin: 0; font-size: 1.3rem; letter-spacing: -.01em; }
.who { color: var(--muted); font-size: 13px; }
h2 { font-size: 1.02rem; margin: 18px 0 8px; }

.card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 14px; box-shadow: var(--shadow); margin: 10px 0; }
.banner, .flash { background: var(--primary-soft); border: 1px solid var(--primary-line); border-radius: 10px; padding: 10px 12px; margin: 10px 0; font-size: 14px; }
.flash { background: var(--warn-bg); border-color: var(--warn-line); }

.stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.stat { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 4px; color: inherit; }
.stat span { font-size: 12px; color: var(--muted); }
.stat strong { font-size: 1.15rem; letter-spacing: -.01em; }
.stat strong.neg { color: var(--danger); }

.rowline { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid var(--line); }
.rowline:last-child { border-bottom: 0; }
.rowline > div:last-child { text-align: right; margin-left: auto; }
.muted { color: var(--muted); }
.small { font-size: 13px; }
.money { font-weight: 650; font-variant-numeric: tabular-nums; }
.ok { color: var(--primary); font-weight: 600; }

.badge { display: inline-block; background: var(--chip-bg); color: var(--chip-fg); border: 1px solid var(--line); border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 600; }
.badge.danger { background: var(--danger-bg); color: var(--danger); border-color: var(--danger-line); }

/* ============================================================== forms ==== */
label { display: flex; flex-direction: column; gap: 5px; margin: 10px 0; font-size: 13px; color: var(--muted); }
input, select, textarea, button { font: inherit; padding: 9px 11px; border-radius: 9px; border: 1px solid var(--line); background: var(--field-bg); color: var(--fg); }
input, select, textarea { width: 100%; min-width: 0; max-width: 100%; }
.stats > *, .filterbar > *, .acct-grid > *, .grid2 > *, .cards > * { min-width: 0; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--primary); outline-offset: -1px; }
button { background: var(--primary); color: var(--primary-fg); border: 1px solid var(--primary); font-weight: 600; cursor: pointer; min-height: 40px; }
button:hover { filter: brightness(1.08); }
button.secondary { background: var(--card); color: var(--fg); border-color: var(--line); }
button.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
button.linkish { background: transparent; color: var(--sidebar-fg); border: 0; padding: 9px 12px; text-align: left; }
button.linkish:hover { color: var(--primary); }

.filters { display: flex; gap: 8px; }
.filters input { flex: 1; }
.cards { display: grid; gap: 10px; }
.tap { color: inherit; }
.desktop { display: none; }
.grid2 { display: grid; gap: 10px; }
.inline { display: flex; gap: 8px; align-items: end; flex-wrap: wrap; }
.check { flex-direction: row; align-items: center; }
pre { background: var(--surface-2); border: 1px solid var(--line); padding: 10px; border-radius: 9px; overflow: auto; font-size: 12px; }
code { background: var(--chip-bg); padding: 1px 5px; border-radius: 5px; font-size: 12px; }

.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.chips a { background: var(--card); border: 1px solid var(--line); padding: 7px 12px; border-radius: 999px; color: inherit; font-size: 14px; font-weight: 500; }
.chips a.on { background: var(--primary); border-color: var(--primary); color: var(--primary-fg); }
.chips a b { font-weight: 700; opacity: .6; margin-left: 3px; }
.chips a.on b { opacity: .85; }

/* ====================================================== account rows ==== */
.filterbar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; align-items: end; }
.filterbar label { margin: 0; }
.filterbar button { grid-column: span 2; }
.filterbar .clearlink { grid-column: span 2; text-align: center; font-size: 13px; }

.acct { padding: 10px 12px; }
.acct.is-breached { border-left: 3px solid var(--danger); }
.acct-meta { margin: 2px 0 6px; }
.acct-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; }
.acct-grid label { margin: 3px 0; font-size: 11px; gap: 2px; }
.acct-grid label.wide { grid-column: 1 / -1; }
.acct-grid input, .acct-grid select { padding: 7px 9px; font-size: 14px; }
.acct-actions { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; vertical-align: top; }
.acct-actions + .acct-actions { margin-left: 6px; }
.acct-actions form.mini { margin: 0; }
.acct-actions button { min-height: 34px; padding: 4px 12px; font-size: 13px; }
.acct-actions .inline-label { flex-direction: row; align-items: center; gap: 6px; margin: 0; font-size: 13px; }

details.edit { width: 100%; margin-top: 6px; text-align: left; }
details.edit summary { cursor: pointer; color: var(--primary); font-weight: 600; font-size: 13px; list-style: none; }
details.edit summary::-webkit-details-marker { display: none; }
details.edit form { display: flex; flex-direction: column; gap: 2px; background: var(--surface-2); border: 1px solid var(--line); padding: 10px; border-radius: 10px; margin-top: 8px; }

.keyrow { padding: 9px 12px; }
.keyrow.done { opacity: .6; }
.keypad { display: flex; gap: 8px; align-items: center; margin-top: 6px; }
.keypad input { flex: 1; font-size: 17px; text-align: right; font-variant-numeric: tabular-nums; }
.keypad button { min-height: 42px; padding: 6px 14px; }

.wa { display: inline-flex; align-items: center; min-height: 34px; padding: 5px 12px; border-radius: 9px; background: var(--card); border: 1px solid var(--line); color: var(--fg); font-size: 13px; font-weight: 600; }
.wa:hover { border-color: var(--primary); color: var(--primary); }
.daytext { width: 100%; font-family: ui-monospace, SFMono-Regular, monospace; font-size: 12px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 12px; }

.tabs { position: fixed; bottom: 0; left: 0; right: 0; display: flex; background: var(--card); border-top: 1px solid var(--line); padding: 6px; padding-bottom: max(6px, env(safe-area-inset-bottom)); z-index: 20; }
.tabs a { flex: 1; text-align: center; padding: 8px 4px; font-size: 12px; color: var(--muted); border-radius: 8px; }
.tabs a:hover { background: var(--primary-soft); color: var(--primary); }

/* ====================================================== alerts + bars === */
.alert { border: 1px solid var(--line); border-left-width: 4px; border-radius: 10px; padding: 10px 12px; margin: 10px 0; background: var(--card); }
.alert strong { font-size: 12px; letter-spacing: .04em; }
.alert.critical { border-left-color: var(--danger); background: var(--danger-bg); color: var(--danger); }
.alert.critical .small { color: var(--fg); }
.alert.warning { border-left-color: #d97706; background: var(--warn-bg); }
.alert.info { border-left-color: var(--primary); background: var(--primary-soft); }

.prog { margin: 10px 0; }
.prog-top { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); margin-bottom: 5px; }
.bar { height: 8px; border-radius: 999px; background: var(--chip-bg); overflow: hidden; }
.bar i { display: block; height: 100%; background: var(--primary); border-radius: 999px; }
.bar i.warn { background: var(--danger); }

/* ======================================================= theme picker === */
.themes { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.theme-card { border: 2px solid var(--line); border-radius: 14px; padding: 0; overflow: hidden; background: var(--card); }
.theme-card.on { border-color: var(--primary); }
.theme-prev { display: grid; grid-template-columns: 74px minmax(0, 1fr); height: 132px; }
.theme-prev .p-side { padding: 10px 8px; display: flex; flex-direction: column; gap: 6px; }
.theme-prev .p-brand { height: 8px; width: 70%; border-radius: 3px; }
.theme-prev .p-link { height: 7px; width: 85%; border-radius: 3px; opacity: .5; }
.theme-prev .p-link.on { opacity: 1; width: 95%; height: 14px; border-radius: 5px; }
.theme-prev .p-body { padding: 10px; display: flex; flex-direction: column; gap: 7px; }
.theme-prev .p-row { display: flex; gap: 6px; }
.theme-prev .p-tile { flex: 1; height: 30px; border-radius: 6px; border: 1px solid; }
.theme-prev .p-btn { height: 16px; width: 58px; border-radius: 5px; }
.theme-prev .p-line { height: 7px; border-radius: 3px; opacity: .35; }
.theme-meta { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border-top: 1px solid var(--line); }
.theme-meta strong { font-size: 14px; }
.theme-meta .muted { font-size: 12px; }

@media (max-width: 420px) {
  .stats { gap: 8px; }
  .stat { padding: 10px; }
  .stat strong { font-size: 1.02rem; }
  .main { padding: 12px 10px 92px; }
  .card { padding: 12px; }
}

@media (min-width: 700px) {
  .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .filterbar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .filterbar button { grid-column: auto; }
  .filterbar .clearlink { grid-column: auto; text-align: left; }
  .acct-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .acct-grid label.wide { grid-column: span 2; }
  .grid2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .themes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .app { grid-template-columns: 236px minmax(0, 1fr); }
  .sidebar { display: flex; position: sticky; top: 0; height: 100dvh; overflow-y: auto; }
  .tabs { display: none; }
  .main { padding: 22px 26px 36px; }
  .cards { display: none; }
  .desktop { display: block; overflow: auto; }
  table { width: 100%; border-collapse: collapse; }
  th, td { text-align: left; padding: 8px; border-bottom: 1px solid var(--line); }
  th { font-size: 12px; color: var(--muted); font-weight: 600; }
}

@media (min-width: 1150px) {
  .acct-grid { grid-template-columns: minmax(0,1.1fr) minmax(0,1.3fr) minmax(0,.9fr) minmax(0,1.1fr) minmax(0,.55fr) minmax(0,.55fr) minmax(0,.9fr) minmax(0,1.9fr); gap: 4px 8px; }
  .acct-grid label.wide { grid-column: auto; }
  .acct { padding: 10px 14px; }
}

@media (min-width: 1500px) {
  .main { padding: 24px 40px 40px; }
}

/* --- Trade Idea engine -------------------------------------------------- */
.badge.ok { background: var(--ok-bg, #e7f6ec); color: var(--ok, #167a3c); border-color: var(--ok-line, #bfe3cb); }
[data-theme="dark"] .badge.ok { background: #16321f; color: #6fdc96; border-color: #24552f; }
hr.sep { border: 0; border-top: 1px solid var(--line); margin: 10px 0; }
textarea[readonly] { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; line-height: 1.5; }

/* a button that cannot be pressed must not look pressable */
button[disabled], button:disabled { opacity: .45; cursor: not-allowed; filter: grayscale(40%); }
.sharebar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 8px 0; }

/* --- Trade idea row: left is placed, right is what it trades against ---- */
.tradecard { border-top: 1px solid var(--line); padding: 14px 0 6px; }
.tradecard:first-of-type { border-top: 0; }
.tradeline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
}
.tradeline:hover { border-color: var(--primary); }
.tside { min-width: 0; }
.tside.right { text-align: right; }
.tname { font-size: 1.5em; font-weight: 800; line-height: 1.15; word-break: break-word; }
.tfirm { font-size: 1.15em; font-weight: 600; opacity: .9; }
.tmeta { font-size: 12px; color: var(--muted); margin-top: 2px; }
.tplus { font-size: 12px; color: var(--muted); margin: 6px 0; letter-spacing: .1em; }
.tvs {
  font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; white-space: nowrap;
}
@media (max-width: 640px) {
  .tradeline { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .tside.right { text-align: left; }
  .tvs { justify-self: start; }
  .tname { font-size: 1.35em; }
}

/* the trade's own number - this is what a pairing is called on the desk */
.tno {
  display: inline-block; font-size: 1.5em; font-weight: 800; line-height: 1;
  color: var(--primary); letter-spacing: -.02em;
}

/* holds a message for Copy/Share without taking up room; not display:none,
   because a hidden field cannot be selected by the copy fallback */
.offscreen { position: absolute; left: -10000px; width: 1px; height: 1px; opacity: 0; }


/* Trade Result Final: one box per allocation */
.legbox {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  margin: 10px 0;
}
.legbox details { margin-top: 6px; }
.legbox summary { cursor: pointer; }

/* =====================================================================
   Almeer skin: prop firm crm
   The palette, type and card shape lifted from the desk's first CRM, so
   both tools read as one product. Appended rather than edited in, so the
   original theme is still underneath and nothing behavioural moves.
   ===================================================================== */

[data-theme="light"] {
  --bg: #f4f7f5;
  --fg: #12211b;
  --card: #ffffff;
  --muted: #5d6f66;
  --line: #d8e2dc;
  --surface-2: #eef3f0;
  --field-bg: #ffffff;
  --primary: #16a34a;
  --primary-fg: #ffffff;
  --primary-soft: #e7f6ec;
  --primary-line: #b7e3c6;
  --sidebar: #ffffff;
  --sidebar-fg: #12211b;
  --sidebar-hover: #eef3f0;
  --sidebar-active: #e7f6ec;
  --sidebar-active-fg: #15803d;
  --brand-fg: #12211b;
  --chip-bg: #fef3c7;
  --chip-fg: #92400e;
  --danger: #dc2626;
  --danger-bg: #fef2f2;
  --danger-line: #fecaca;
  --warn-bg: #fffbeb;
  --warn-line: #fde68a;
  --auth-bg: #f4f7f5;
  --shadow: none;
  --money: #16a34a;
  --spend: #d97706;
}

[data-theme="dark"] {
  --money: #4ade80;
  --spend: #fbbf24;
}

[data-theme="warm"] {
  --money: #15803d;
  --spend: #b45309;
}
[data-theme="midnight"] { --money: #22c55e; --spend: #f59e0b; }
[data-theme="emerald"] { --money: #0e9f6e; --spend: #ca8a04; }
[data-theme="royal"] { --money: #10b981; --spend: #eab308; }

body,
input, select, textarea, button {
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}

.card,
.tradecard {
  border-radius: 14px;
  border: 1px solid var(--line);
  box-shadow: none;
}

/* the headline numbers: big, heavy, and green when they are money */
.stat strong {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.money { color: var(--money); font-weight: 700; }
.neg { color: var(--danger); font-weight: 700; }

.brandmark { font-weight: 800; letter-spacing: -0.01em; }
.brandmark em { font-style: normal; color: var(--primary); }

/* ------------------------------------------------- the dashboard chart */

.chartwrap { overflow-x: auto; }

.chart {
  display: block;
  width: 100%;
  min-width: 320px;
  height: auto;
  font-family: "Segoe UI", system-ui, sans-serif;
}

.chart .grid { stroke: var(--line); stroke-width: 1; }
.chart .axis { fill: var(--muted); font-size: 11px; }
.chart .vlabel { fill: var(--fg); font-size: 10px; font-weight: 700; }
.chart .bar-spend { fill: var(--spend); }
.chart .bar-money { fill: var(--money); }

.clegend {
  display: flex;
  gap: 18px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 2px 0 10px;
  font-size: 13px;
  color: var(--muted);
}
.clegend span { display: inline-flex; align-items: center; gap: 7px; }
.clegend i {
  width: 14px;
  height: 14px;
  border-radius: 3px;
  display: inline-block;
}
.clegend .k-spend { background: var(--spend); }
.clegend .k-money { background: var(--money); }

.chartnote { color: var(--muted); font-size: 12px; margin-top: 6px; }


/* =====================================================================
   Almeer skin v2 - operations console
   The palette and shape are taken from the dashboard reference: a warm
   neutral workspace, white cards with a hairline border, one dark panel
   carrying the numbers that matter, and warm accent reserved for "you
   are here" and "act on this".
   Appended, not edited in: every earlier rule is still underneath, so
   markup, routes and behaviour are untouched.
   ===================================================================== */

:root,
[data-theme="light"] {
  --bg: #f7f6f3;
  --fg: #1e1e2c;
  --card: #ffffff;
  --muted: #6b6b7b;
  --line: #e8e6e1;
  --surface-2: #f2f0ec;
  --field-bg: #ffffff;

  --primary: #d9823f;
  --primary-fg: #ffffff;
  --primary-soft: #fdf1e7;
  --primary-line: #f3d4b8;
  --accent: #f29f67;

  --ink: #1e1e2c;
  --ink-2: #2a2a3c;
  --ink-fg: #f4f3f7;
  --ink-muted: #9b9bb0;

  --info: #2e7fd6;
  --good: #0e9189;
  --warn: #a8860c;
  --danger: #c2453a;

  --info-soft: #eaf2fc;
  --good-soft: #e6f4f3;
  --warn-soft: #fbf4dd;
  --danger-soft: #fbeceb;

  --sidebar: #ffffff;
  --sidebar-fg: #4a4a5a;
  --sidebar-hover: #f5f3ef;
  --sidebar-active: #fdf1e7;
  --sidebar-active-fg: #9a5518;
  --brand-fg: #1e1e2c;

  --chip-bg: #fbf4dd;
  --chip-fg: #7a6208;
  --danger-bg: #fbeceb;
  --danger-line: #f0c9c5;
  --warn-bg: #fbf4dd;
  --warn-line: #ecd79a;
  --auth-bg: #f7f6f3;
  --shadow: 0 1px 2px rgba(30, 30, 44, .04);

  --money: #0e9189;
  --spend: #d97b3e;
  --c1: #2e7fd6;
  --c2: #d97b3e;
  --c3: #0e9189;
  --c4: #a8860c;

  --r: 12px;
  --s: 8px;
}

body,
input, select, textarea, button {
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

body { background: var(--bg); color: var(--fg); }

/* ----------------------------------------------------------- the shell */

.sidebar {
  background: var(--sidebar);
  border-right: 1px solid var(--line);
  padding: 18px 12px 24px;
}

.sidebar .brand {
  font-weight: 800;
  font-size: 17px;
  letter-spacing: -0.02em;
  color: var(--brand-fg);
  padding: 4px 10px 16px;
}
.sidebar .brand em { font-style: normal; color: var(--accent); }

.navgroup { margin: 0 0 14px; }
.navgroup-title {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #a3a3b2;
  padding: 0 10px 6px;
}

.sidebar nav a {
  display: block;
  padding: 8px 10px;
  margin: 1px 0;
  border-radius: 8px;
  color: var(--sidebar-fg);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.3;
  border-left: 3px solid transparent;
}
.sidebar nav a:hover { background: var(--sidebar-hover); color: var(--fg); }
.sidebar nav a.active {
  background: var(--sidebar-active);
  color: var(--sidebar-active-fg);
  border-left-color: var(--accent);
  font-weight: 700;
}
.sidebar nav a:focus-visible,
.sidebar .linkish:focus-visible {
  outline: 2px solid var(--info);
  outline-offset: 1px;
}

.sidebar .linkish {
  margin-top: 6px;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border-radius: 8px;
  background: none;
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
}
.sidebar .linkish:hover { background: var(--sidebar-hover); color: var(--fg); }

/* ---------------------------------------------------------- the header */

.top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 18px;
}
.top h1 { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; margin: 0; }
.top .subtitle { color: var(--muted); font-size: 13px; margin-top: 2px; }
.topright { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.topsearch { display: flex; gap: 6px; margin: 0; }
.topsearch input {
  width: 200px;
  padding: 7px 10px;
  font-size: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--card);
}
.topsearch input:focus { outline: 2px solid var(--info); outline-offset: -1px; border-color: transparent; }
.topsearch button {
  padding: 7px 12px;
  font-size: 13px;
  border-radius: 8px;
  background: var(--card);
  color: var(--fg);
  border: 1px solid var(--line);
}
.topsearch button:hover { background: var(--surface-2); }
.who {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
}

/* ----------------------------------------------------------- surfaces */

.card,
.tradecard,
.legbox {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--shadow);
}
.card h2 { font-size: 15px; font-weight: 700; letter-spacing: -0.01em; }

/* ------------------------------------------------------------ the KPIs */

.kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.kpi {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  padding: 14px 16px;
  text-decoration: none;
  color: inherit;
  display: block;
}
.kpi:hover { border-color: var(--primary-line); }
.kpi .k-label {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
}
.kpi .k-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.kpi .k-value {
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-top: 6px;
  line-height: 1.1;
}
.kpi .k-sub { font-size: 12px; color: var(--muted); margin-top: 4px; }
.k-dot.d-info { background: var(--info); }
.k-dot.d-good { background: var(--good); }
.k-dot.d-warn { background: var(--warn); }
.k-dot.d-danger { background: var(--danger); }
.k-dot.d-accent { background: var(--primary); }
.k-value.v-good { color: var(--good); }
.k-value.v-danger { color: var(--danger); }
.k-value.v-warn { color: var(--warn); }

/* -------------------------------------------------- the dark ink panel */

.inkcard {
  background: var(--ink);
  color: var(--ink-fg);
  border-radius: var(--r);
  padding: 20px 22px;
  border: 1px solid var(--ink);
  margin-bottom: 16px;
}
.inkcard h2 { color: var(--ink-fg); font-size: 15px; margin: 0 0 2px; }
.inkcard .ink-sub { color: var(--ink-muted); font-size: 12.5px; margin-bottom: 16px; }
.inkgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 18px 24px;
  align-items: start;
}
.inkstat .i-label { font-size: 11.5px; color: var(--ink-muted); font-weight: 600; letter-spacing: .02em; }
.inkstat .i-value { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; margin-top: 4px; }
.inkstat .i-value.t { color: #34b1aa; }
.inkstat .i-value.w { color: #f29f67; }
.inkstat .i-note { font-size: 11.5px; color: var(--ink-muted); margin-top: 3px; }
.inkcard a { color: #f29f67; }
.spark { display: block; width: 100%; height: 54px; margin-top: 6px; }

/* ---------------------------------------------------------- the table */

.dtable { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.dtable th {
  text-align: left;
  font-size: 11px;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 700;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}
.dtable td {
  padding: 10px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
.dtable tr:last-child td { border-bottom: none; }
.dtable tbody tr:hover { background: var(--surface-2); }
.dtable a { color: var(--fg); font-weight: 600; text-decoration: none; }
.dtable a:hover { text-decoration: underline; }
.tablewrap { overflow-x: auto; }

/* status pills: a dot plus a word, never colour on its own */
.st {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  border-radius: 7px;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
  border: 1px solid transparent;
}
.st::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
.st-good { background: var(--good-soft); color: #0b6f69; border-color: #bfe3e0; }
.st-info { background: var(--info-soft); color: #1f5fa8; border-color: #c6ddf6; }
.st-warn { background: var(--warn-soft); color: #7a6208; border-color: #ecd79a; }
.st-danger { background: var(--danger-soft); color: #9c342b; border-color: #f0c9c5; }
.st-idle { background: var(--surface-2); color: #63636f; border-color: var(--line); }

/* --------------------------------------------------------- the alerts */

.alert { border-radius: var(--r); border: 1px solid var(--line); border-left-width: 3px; }
.alert.critical { background: var(--danger-soft); border-color: var(--danger-line); border-left-color: var(--danger); }
.alert.warning { background: var(--warn-soft); border-color: var(--warn-line); border-left-color: #e0b50f; }
.alert.info { background: var(--info-soft); border-color: #c6ddf6; border-left-color: var(--info); }

/* --------------------------------------------------------- the pieces */

.stat {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r);
  box-shadow: var(--shadow);
}
.stat strong { font-size: 21px; font-weight: 800; letter-spacing: -0.02em; }
.money { color: var(--money); font-weight: 700; }
.neg { color: var(--danger); font-weight: 700; }

.badge {
  border-radius: 7px;
  font-weight: 700;
  font-size: 11.5px;
  background: var(--surface-2);
  color: #55555f;
  border: 1px solid var(--line);
}
.badge.danger { background: var(--danger-soft); color: #9c342b; border-color: var(--danger-line); }

button, .wa {
  border-radius: 8px;
  font-weight: 600;
  letter-spacing: 0;
}
button:not(.secondary):not(.danger):not(.linkish) {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
button:not(.secondary):not(.danger):not(.linkish):hover { background: #c8742f; border-color: #c8742f; }
button.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
button:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

.sectionhead {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 22px 0 10px;
}
.sectionhead h2 { margin: 0; font-size: 15px; font-weight: 700; }
.sectionhead a { font-size: 13px; color: var(--info); text-decoration: none; }
.sectionhead a:hover { text-decoration: underline; }

.twocol {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
@media (min-width: 1100px) {
  .twocol { grid-template-columns: 1.4fr 1fr; }
}

/* ---------------------------------------------------------- the chart */

.chart .grid { stroke: var(--line); }
.chart .axis { fill: var(--muted); font-size: 11px; }
.chart .vlabel { fill: var(--fg); font-size: 10px; font-weight: 700; }
.chart .bar-spend { fill: var(--spend); }
.chart .bar-money { fill: var(--money); }
.clegend .k-spend { background: var(--spend); }
.clegend .k-money { background: var(--money); }


/* =====================================================================
   Sign in - split screen
   Left: the form, on a warm cream wash. Right: a photo panel with two
   small glass cards. Same palette as the desk, nothing new invented.
   The photo is assets/login.jpg; until it exists the panel falls back
   to the warm wash, so the page never looks broken.
   ===================================================================== */

.auth:has(.authsplit) {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0;
  display: block;
  background: var(--bg);
}

.authsplit {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  min-height: 100vh;
  background: var(--bg);
  padding: 16px;
  box-sizing: border-box;
}

@media (min-width: 900px) {
  .authsplit { grid-template-columns: 1fr 1fr; padding: 24px; gap: 24px; }
}

/* ------------------------------------------------------------ the form */

.authform {
  background: linear-gradient(170deg, #ffffff 0%, #fdf6ee 55%, #fbeeda 100%);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 36px 28px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}

@media (min-width: 900px) {
  .authform { padding: 48px 56px; }
}

.authbrand {
  position: absolute;
  top: 28px;
  left: 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px 7px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .8);
  font-weight: 800;
  font-size: 13.5px;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.authbrand em { font-style: normal; color: var(--primary); }
.authmark {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  background: var(--ink);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  flex: none;
}

.authbody { width: 100%; max-width: 360px; margin: 0 auto; }
.authbody h1 {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-align: center;
  margin: 0 0 6px;
  color: var(--ink);
}
.authbody .authsub {
  text-align: center;
  color: var(--muted);
  font-size: 13.5px;
  margin: 0 0 26px;
}

.authbody label {
  display: block;
  margin-bottom: 14px;
  font-size: 12.5px;
  font-weight: 600;
  color: #55555f;
}
.authbody label input {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 13px 15px;
  font-size: 14px;
  color: var(--ink);
  background: rgba(255, 255, 255, .92);
  border: 1px solid #ece4d8;
  border-radius: 12px;
  box-sizing: border-box;
}
.authbody label input::placeholder { color: #a9a9b6; }
.authbody label input:focus {
  outline: 2px solid var(--primary);
  outline-offset: -1px;
  border-color: transparent;
  background: #fff;
}

.authbody button[type="submit"] {
  width: 100%;
  margin-top: 8px;
  padding: 13px 18px;
  font-size: 14.5px;
  font-weight: 700;
  border-radius: 12px;
  background: var(--primary);
  border: 1px solid var(--primary);
  color: #fff;
  cursor: pointer;
}
.authbody button[type="submit"]:hover { background: #c8742f; border-color: #c8742f; }
.authbody button[type="submit"]:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }

.authbody .flash {
  border-radius: 12px;
  background: var(--danger-soft);
  border: 1px solid var(--danger-line);
  color: #9c342b;
  font-size: 13px;
  padding: 10px 14px;
  margin-bottom: 16px;
}

.authfoot {
  margin-top: 26px;
  padding-top: 16px;
  border-top: 1px solid #efe6d9;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 12px;
  color: var(--muted);
}

/* ----------------------------------------------------------- the photo */

.authshow {
  display: none;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  background-color: #efe7dc;
  background-image: url("login.jpg");
  background-size: cover;
  background-position: center;
  border: 1px solid var(--line);
}

@media (min-width: 900px) { .authshow { display: block; } }

.authshow::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(200deg, rgba(30, 30, 44, .34) 0%, rgba(30, 30, 44, .06) 45%, rgba(242, 159, 103, .26) 100%);
}

.authchip {
  position: absolute;
  z-index: 2;
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 14px;
  padding: 12px 15px;
  box-shadow: 0 8px 24px rgba(30, 30, 44, .16);
  min-width: 158px;
}
.authchip .c-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #7c7c8a;
  display: flex;
  align-items: center;
  gap: 6px;
}
.authchip .c-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.authchip .c-value {
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin-top: 4px;
}
.authchip .c-note { font-size: 11.5px; color: #7c7c8a; margin-top: 2px; }

.authchip.one { top: 34px; left: 30px; }
.authchip.two { bottom: 36px; right: 30px; }

.authchip.dark {
  background: rgba(30, 30, 44, .9);
  border-color: rgba(255, 255, 255, .14);
}
.authchip.dark .c-label, .authchip.dark .c-note { color: #a6a6b8; }
.authchip.dark .c-value { color: #f4f3f7; }

.authtag {
  position: absolute;
  z-index: 2;
  left: 30px;
  bottom: 36px;
  max-width: 300px;
  color: #fff;
  text-shadow: 0 1px 12px rgba(30, 30, 44, .5);
}
.authtag strong { display: block; font-size: 19px; font-weight: 800; letter-spacing: -0.02em; }
.authtag span { font-size: 13px; opacity: .92; }


/* ------------------------------------------------- the Majid Ali logo */

.authlogowrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  margin-bottom: 24px;
}
.authlogotile {
  width: 78px;
  height: 78px;
  border-radius: 21px;
  background: #12121a;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 9px;
  box-sizing: border-box;
  box-shadow: 0 10px 26px rgba(30, 30, 44, .2);
}
.authlogo { width: 100%; height: 100%; display: block; }
.authwordmark {
  font-size: 14.5px;
  font-weight: 800;
  letter-spacing: .26em;
  color: var(--ink);
  margin-left: .26em;
  line-height: 1;
}
.authproduct {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--primary);
}
.authform { padding-top: 40px; }


/* =====================================================================
   The Majid Ali mark, animated the way the source video plays it:
   ring draws, four blades sweep in to form the M, the swoosh cuts
   across, the wordmark reveals letter by letter, the rule draws, and a
   shimmer passes over the mark. Plays once on load, then only the
   shimmer repeats - a login screen should settle, not loop forever.
   Pure CSS keyframes on inline SVG: no script, no library.
   ===================================================================== */

.authlogotile {
  width: 118px;
  height: 118px;
  border-radius: 30px;
  padding: 12px;
  position: relative;
  overflow: hidden;
  animation: mlZoom 4.4s cubic-bezier(.4, 0, .2, 1) both;
}
.authlogotile::before {
  content: "";
  position: absolute;
  inset: -30%;
  background: radial-gradient(circle, rgba(139, 92, 246, .38) 0%, rgba(0, 0, 0, 0) 68%);
  animation: mlGlow 3.6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes mlZoom { from { transform: scale(1.16); } to { transform: scale(1); } }
@keyframes mlGlow { 0%, 100% { opacity: .85; } 50% { opacity: 1; } }

.mlogo { position: relative; z-index: 1; }

/* the ring draws itself */
.ml-ringwrap { animation: mlSpin 24s ease-in-out infinite alternate; transform-origin: 310px 320px; }
.ml-ring {
  stroke-dasharray: 1307;
  stroke-dashoffset: 0;
  opacity: .88;
  animation: mlDraw 1.2s cubic-bezier(.45, 0, .55, 1) .1s both;
}
@keyframes mlDraw { from { stroke-dashoffset: 1307; opacity: 0; } 1% { opacity: .88; } to { stroke-dashoffset: 0; opacity: .88; } }
@keyframes mlSpin { from { transform: rotate(-8deg); } to { transform: rotate(4deg); } }

/* four blades sweep in, each from the side it belongs to */
.ml-b { opacity: 1; }
.ml-b0 { animation: mlB0 .85s cubic-bezier(.34, 1.56, .64, 1) 1.40s both; }
.ml-b1 { animation: mlB1 .85s cubic-bezier(.34, 1.56, .64, 1) 1.62s both; }
.ml-b2 { animation: mlB1 .85s cubic-bezier(.34, 1.56, .64, 1) 1.84s both; }
.ml-b3 { animation: mlB3 .85s cubic-bezier(.34, 1.56, .64, 1) 2.06s both; }
@keyframes mlB0 { from { transform: translate(-340px, 340px); opacity: 0; } 45% { opacity: 1; } to { transform: translate(0, 0); opacity: 1; } }
@keyframes mlB1 { from { transform: translate(0, -340px); opacity: 0; } 45% { opacity: 1; } to { transform: translate(0, 0); opacity: 1; } }
@keyframes mlB3 { from { transform: translate(340px, 340px); opacity: 0; } 45% { opacity: 1; } to { transform: translate(0, 0); opacity: 1; } }

/* the swoosh cuts across last */
.ml-sw { opacity: .97; animation: mlSw .8s cubic-bezier(.25, .8, .35, 1) 2.50s both; }
@keyframes mlSw { from { transform: translate(-480px, 86px); opacity: 0; } 40% { opacity: .97; } to { transform: translate(0, 0); opacity: .97; } }

/* a light sweeps the mark, clipped to the mark itself */
.ml-shim { animation: mlShim 8s linear 6.3s infinite; transform: translateX(-620px); }
@keyframes mlShim {
  0% { transform: translateX(-620px); }
  15% { transform: translateX(760px); }
  100% { transform: translateX(760px); }
}

/* the wordmark reveals letter by letter, then the rule draws under it */
.authwordmark span {
  display: inline-block;
  white-space: pre;
  animation: mlLetter .6s cubic-bezier(.33, 1, .68, 1) both;
}
.authwordmark span:nth-child(1) { animation-delay: 3.75s; }
.authwordmark span:nth-child(2) { animation-delay: 3.82s; }
.authwordmark span:nth-child(3) { animation-delay: 3.89s; }
.authwordmark span:nth-child(4) { animation-delay: 3.96s; }
.authwordmark span:nth-child(5) { animation-delay: 4.03s; }
.authwordmark span:nth-child(6) { animation-delay: 4.10s; }
.authwordmark span:nth-child(7) { animation-delay: 4.17s; }
.authwordmark span:nth-child(8) { animation-delay: 4.24s; }
.authwordmark span:nth-child(9) { animation-delay: 4.31s; }
@keyframes mlLetter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

.authrule {
  height: 3px;
  width: 148px;
  border-radius: 2px;
  margin-top: 4px;
  background: linear-gradient(90deg, #F59E0B, #EC4899, #7C3AED);
  transform-origin: center;
  animation: mlRule .7s cubic-bezier(.45, 0, .55, 1) 4.5s both;
}
@keyframes mlRule { from { transform: scaleX(0); opacity: 0; } 5% { opacity: 1; } to { transform: scaleX(1); opacity: 1; } }

.authlogowrap { gap: 12px; }

/* someone who asked for less motion gets the finished frame, at once */
@media (prefers-reduced-motion: reduce) {
  .authlogotile, .authlogotile::before, .ml-ringwrap, .ml-ring,
  .ml-b0, .ml-b1, .ml-b2, .ml-b3, .ml-sw, .ml-shim,
  .authwordmark span, .authrule { animation: none; }
  .ml-shim { opacity: 0; }
  .authrule { transform: scaleX(1); }
}


/* the credit line sits centred under the Sign in button */
.authfoot {
  justify-content: center;
  text-align: center;
}
.authfoot strong {
  font-weight: 800;
  color: var(--ink);
}


/* =====================================================================
   Sign in, v3 - the Crextio-style split from the design canvas.
   Left: warm off-white form column. Right: the photo with the gradient
   scrim and three floating glass cards. Types and colours are the ones
   in the design; the logo mark is Majid Ali's own, animated.
   ===================================================================== */

.authsplit {
  display: flex;
  min-height: 100vh;
  background: #FAFAF8;
  padding: 0;
  gap: 0;
}
.auth:has(.authsplit) { background: #FAFAF8; }

/* ------------------------------------------------------------ the form */

.authform {
  width: 520px;
  flex: none;
  box-sizing: border-box;
  padding: 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #FAFAF8;
  border: none;
  border-radius: 0;
}
.authbody { max-width: 392px; margin: 0; width: 100%; }

.authlogowrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  margin-bottom: 56px;
}
.authlogotile {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  padding: 5px;
  background: #0B1220;
  box-shadow: none;
}
.authlogotype {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: #12161C;
  letter-spacing: -0.01em;
}
.authlogotype span { color: #8A6423; }

.authbody h1 {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-weight: 600;
  font-size: 34px;
  letter-spacing: -0.01em;
  color: #12161C;
  text-align: left;
  margin: 0 0 10px;
}
.authsub {
  margin: 0 0 40px;
  font-size: 15px;
  line-height: 1.6;
  color: #5B6169;
  text-align: left;
}

.authbody form { display: flex; flex-direction: column; gap: 20px; }
.authbody label {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: #33363B;
}
.authfield {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1.5px solid #E4E2DC;
  border-radius: 11px;
  padding: 0 16px;
  height: 50px;
  background: #fff;
  box-sizing: border-box;
}
.authfield:focus-within {
  border-color: #8A6423;
  box-shadow: 0 0 0 3px rgba(138, 100, 35, 0.16);
}
.authfield svg { flex: none; }
.authbody label input {
  border: none;
  outline: none;
  background: transparent;
  font-size: 15px;
  color: #12161C;
  flex-grow: 1;
  margin: 0;
  padding: 0;
  width: 100%;
  font-family: inherit;
}
.authbody label input::placeholder { color: #9AA0A8; }
.authbody label input:focus { outline: none; box-shadow: none; }

.authbody button[type="submit"] {
  margin-top: 12px;
  height: 52px;
  border: none;
  border-radius: 11px;
  background: #12161C;
  color: #FAFAF8;
  font-weight: 600;
  font-size: 15.5px;
  cursor: pointer;
  width: 100%;
  transition: filter .15s ease;
}
.authbody button[type="submit"]:hover { background: #12161C; filter: brightness(1.35); }

.authfoot {
  margin: 32px 0 0;
  padding: 0;
  border: none;
  display: block;
  text-align: left;
  font-size: 13px;
  color: #5F6570;
}
.authbody .flash {
  border-radius: 11px;
  background: #FBECEB;
  border: 1px solid #F0C9C5;
  color: #9C342B;
  font-size: 13.5px;
  padding: 11px 15px;
  margin-bottom: 20px;
}

/* ----------------------------------------------------------- the photo */

.authshow {
  display: block;
  flex-grow: 1;
  position: relative;
  overflow: hidden;
  border: none;
  border-radius: 0;
  background: #0B1220 url("login.jpg") center 22% / cover no-repeat;
  animation: aaPhotoIn 1s ease-out both;
}
@keyframes aaPhotoIn { from { opacity: 0; transform: scale(1.06); } to { opacity: 1; transform: scale(1); } }

.authshow::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(100deg, rgba(11,18,32,.38) 0%, rgba(11,18,32,0) 38%),
    linear-gradient(180deg, rgba(9,14,26,.66) 0%, rgba(9,14,26,.08) 30%, rgba(9,14,26,.22) 58%, rgba(9,14,26,.86) 100%);
}

.aacard {
  position: absolute;
  z-index: 2;
  background: rgba(9, 14, 25, .48);
  backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 14px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .4);
  color: #FAFAF8;
}
.aacard .t { font-size: 13px; font-weight: 600; color: #FAFAF8; }
.aacard .s { font-size: 11px; color: rgba(255, 255, 255, .72); }

.aa1 { top: 96px; left: 56px; width: 212px; padding: 14px 16px; display: flex; align-items: center; gap: 10px; }
.aa1 .ic {
  width: 30px; height: 30px; border-radius: 9px; flex: none;
  background: rgba(47, 190, 139, .18);
  display: flex; align-items: center; justify-content: center;
}
.aadot { width: 6px; height: 6px; border-radius: 50%; background: #3ED697; display: inline-block; }

.aa2 { bottom: 120px; left: 64px; width: 256px; padding: 16px; }
.aa2 .hd { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.72); margin-bottom: 10px; }
.aacal { display: flex; justify-content: space-between; }
.aacal div { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.aacal .d { font-size: 10px; color: rgba(255,255,255,.72); }
.aacal .n { font-size: 13px; color: rgba(255,255,255,.9); }
.aacal .on .d { color: #C89B4A; font-weight: 700; }
.aacal .on .n {
  width: 22px; height: 22px; border-radius: 50%; background: #C89B4A; color: #0B1220;
  font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center;
}

.aa3 { top: 150px; right: 56px; width: 200px; padding: 14px 16px; }
.aafaces { display: flex; margin-bottom: 10px; }
.aafaces i { width: 26px; height: 26px; border-radius: 50%; border: 2px solid #16213A; display: block; }
.aafaces i + i { margin-left: -8px; }
.aaf1 { background: linear-gradient(135deg, #C89B4A, #8F6A2A); }
.aaf2 { background: linear-gradient(135deg, #2FBE8B, #1B8F67); }
.aaf3 { background: #3E4C6D; }

.aatag {
  position: absolute; z-index: 2; bottom: 64px; right: 64px; width: 360px;
  text-align: right; text-shadow: 0 2px 18px rgba(0, 0, 0, .55); color: #FAFAF8;
}
.aatag strong {
  display: block;
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-weight: 600; font-size: 26px; line-height: 1.3;
}
.aatag span { font-size: 13.5px; line-height: 1.6; color: rgba(255,255,255,.85); display: block; margin-top: 10px; }

@keyframes aaFadeUp { from { opacity: 0; transform: translateY(22px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes aaFloat1 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes aaFloat2 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes aaFloat3 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-16px); } }
@keyframes aaPulse { 0% { box-shadow: 0 0 0 0 rgba(61,214,151,.55); } 70% { box-shadow: 0 0 0 9px rgba(61,214,151,0); } 100% { box-shadow: 0 0 0 0 rgba(61,214,151,0); } }
.aa1 { animation: aaFadeUp .7s ease-out .2s both, aaFloat1 6s ease-in-out .9s infinite; }
.aa2 { animation: aaFadeUp .7s ease-out .35s both, aaFloat2 7s ease-in-out 1.05s infinite; }
.aa3 { animation: aaFadeUp .7s ease-out .5s both, aaFloat3 5.5s ease-in-out 1.2s infinite; }
.aadot { animation: aaPulse 2.2s ease-in-out infinite; }

@media (max-width: 1000px) {
  .authsplit { flex-direction: column; }
  .authform { width: 100%; padding: 40px 24px; }
  .authshow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .authshow, .aa1, .aa2, .aa3, .aadot { animation: none; }
}


/* v3 overrides: beat the older, more specific desk rules */
.authform .authbody button[type="submit"],
.authform .authbody button[type="submit"]:hover {
  background: #12161C;
  border: none;
  color: #FAFAF8;
}
.authform .authbody button[type="submit"]:hover { filter: brightness(1.45); }
.authform .authbody h1 { text-align: left; }
.authform .authbody .authsub { text-align: left; }
.authform .authbody .authfoot { text-align: left; }

/* subtitle removed - give the heading its own breathing room */
.authform .authbody h1 { margin: 0 0 32px; }

/* v4: the full Majid Ali lockup - mark, wordmark and rule - above the fields */
.authform .authlogowrap {
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 40px;
}
.authform .authlogotile {
  width: 100px;
  height: 100px;
  border-radius: 26px;
  padding: 10px;
  background: #0B1220;
  box-shadow: 0 14px 34px rgba(11, 18, 32, .22);
}
.authform .authwordmark {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .28em;
  color: #12161C;
  margin-left: .28em;
  line-height: 1;
}
.authform .authrule {
  width: 150px;
  height: 3px;
  margin-top: 0;
  border-radius: 2px;
  background: linear-gradient(90deg, #F59E0B, #EC4899, #7C3AED);
}

/* the user chip opens a small menu holding Sign out */
.usermenu { position: relative; }
.usermenu > summary.who {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  user-select: none;
}
.usermenu > summary.who::-webkit-details-marker { display: none; }
.usermenu > summary.who::after {
  content: "";
  width: 6px;
  height: 6px;
  border-right: 1.5px solid var(--muted);
  border-bottom: 1.5px solid var(--muted);
  transform: rotate(45deg) translateY(-1px);
  transition: transform .15s ease;
}
.usermenu[open] > summary.who::after { transform: rotate(-135deg) translateY(-1px); }
.usermenu > summary.who:hover { border-color: var(--primary-line); color: var(--fg); }
.usermenu > summary.who:focus-visible { outline: 2px solid var(--info); outline-offset: 2px; }

.usermenu-pop {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 60;
  min-width: 172px;
  padding: 6px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(30, 30, 44, .14);
}
.usermenu-pop form { margin: 0; }
.usermenu-pop .logoutbtn {
  display: block;
  width: 100%;
  text-align: left;
  padding: 9px 12px;
  border-radius: 8px;
  background: none;
  border: none;
  color: var(--fg);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
}
.usermenu-pop .logoutbtn:hover { background: var(--danger-soft); color: #9c342b; }
.usermenu-pop .logoutbtn:focus-visible { outline: 2px solid var(--danger); outline-offset: -2px; }

/* the menu item is a menu item, not a primary button */
.topright .usermenu .usermenu-pop .logoutbtn {
  background: none;
  border: none;
  color: var(--fg);
  font-weight: 600;
}
.topright .usermenu .usermenu-pop .logoutbtn:hover {
  background: var(--danger-soft);
  border: none;
  color: #9c342b;
}

/* the user chip: initials, name, role - works for any signed-in user */
.topright .usermenu > summary.who {
  padding: 5px 12px 5px 5px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--card);
  gap: 9px;
  line-height: 1.2;
}
.topright .usermenu > summary.who:hover { background: var(--surface-2); }
.topright .usermenu[open] > summary.who { border-color: var(--primary-line); background: var(--primary-soft); }

.uavatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #f0a56c, #c8742f);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;
}
.uavatar.big { width: 38px; height: 38px; font-size: 14px; }

.uwrap { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; min-width: 0; }
.uname { font-size: 13px; font-weight: 700; color: var(--ink); white-space: nowrap; }
.urole { font-size: 11px; font-weight: 600; color: var(--muted); white-space: nowrap; }

.upop-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px 10px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--line);
}

/* =====================================================================
   Mobile: the whole menu, not four tabs.
   The sidebar already carries every permitted route in its groups, so on
   a phone it slides in over the page instead of being hidden. A checkbox
   plus :has() drives it - no script, and a tapped link closes it because
   the page navigates.
   ===================================================================== */

.navtoggle { position: absolute; width: 0; height: 0; opacity: 0; pointer-events: none; }
.navbtn { display: none; }
.navscrim { display: none; }

@media (max-width: 899.98px) {
  .navbtn {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    width: 40px;
    height: 40px;
    padding: 0 9px;
    box-sizing: border-box;
    margin-right: 10px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: var(--card);
    cursor: pointer;
    flex: none;
  }
  .navbtn span {
    display: block;
    height: 2px;
    border-radius: 2px;
    background: var(--ink);
  }
  .navbtn:active { background: var(--surface-2); }

  .top { align-items: center; }
  .top .topsearch input { width: 100%; min-width: 0; }
  .topright { flex: 1 1 100%; justify-content: space-between; }

  .app:has(.navtoggle:checked) .sidebar {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 286px;
    max-width: 86vw;
    z-index: 120;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 18px 12px 28px;
    box-shadow: 0 0 44px rgba(30, 30, 44, .3);
  }
  .app:has(.navtoggle:checked) .navscrim {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 110;
    background: rgba(30, 30, 44, .45);
    border: none;
    margin: 0;
  }
  .app:has(.navtoggle:checked) .sidebar nav a { padding: 11px 12px; font-size: 15px; }

  .tabmore {
    cursor: pointer;
    user-select: none;
  }
  .tabs .tabmore { color: inherit; }
}

/* the bottom bar's fifth slot opens that same drawer */
.tabs .tabmore {
  flex: 1 1 0%;
  display: block;
  padding: 8px 4px;
  font-size: 12px;
  font-weight: 400;
  color: var(--muted);
  text-align: center;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.tabs .tabmore:active { color: var(--primary); }

/* on a phone the chip sits near the left edge, so its menu opens leftward */
@media (max-width: 899.98px) {
  .usermenu-pop { right: auto; left: 0; }
}

/* the lockup sits centred over the username and password fields */
.authform .authlogowrap {
  align-items: center;
  width: 100%;
}


/* ==================================================================
   Almeer Finance skin  -  styling only, no markup/logic changes
     novaday = Light  (default professional look)
     nova    = Night  (same palette, dark workspace)
   Scoped to :has(.app) so the sign-in page is untouched.
   ================================================================== */

/* ---------------- LIGHT (primary) ---------------- */
html[data-shell="app"][data-theme="novaday"]{
  --nv-page:#f3f6f8; --nv-panel:#ffffff; --nv-panel2:#f8fafc;
  --nv-line:#e2e8f0; --nv-line2:#eef2f6;
  --nv-text:#111827; --nv-text2:#475569; --nv-mute:#64748b; --nv-dim:#64748b;
  --nv-field:#ffffff; --nv-field-line:#cbd5e1; --nv-ph:#94a3b8;
  --nv-link:#0f172a; --nv-link2:#1e3a5f;
  --nv-hover:#f1f5f9; --nv-head:#f8fafc;
  --nv-chip:#f1f5f9; --nv-chip-line:#e2e8f0;
  --nv-shadow:0 1px 2px rgba(15,23,42,.04), 0 1px 3px rgba(15,23,42,.06);
  --nv-shadow2:0 8px 24px rgba(15,23,42,.10);
  --nv-pop:#ffffff; --nv-side:#0f172a; --nv-top:#ffffff;
  --nv-tabsbg:#ffffff; --nv-scrim:rgba(15,23,42,.42);
  --nv-bar:#334155; --nv-scroll:#cbd5e1;
  --nv-navy:#0f172a; --nv-navy2:#1e293b;
  --nv-good:#047857; --nv-good-str:#059669;
  --nv-warn:#b45309; --nv-danger:#b91c1c; --nv-info:#334155;
  --nv-good-bg:#ecfdf5; --nv-good-ln:#a7f3d0;
  --nv-warn-bg:#fffbeb; --nv-warn-ln:#fde68a;
  --nv-danger-bg:#fef2f2; --nv-danger-ln:#fecaca;
  --nv-info-bg:#f1f5f9; --nv-info-ln:#e2e8f0;
  --bg:#f3f6f8; --fg:#111827; --card:#ffffff; --muted:#64748b;
  --line:#e2e8f0; --surface-2:#f8fafc; --field-bg:#ffffff;
  --sidebar:#0f172a; --sidebar-fg:#cbd5e1; --sidebar-hover:rgba(255,255,255,.08);
  --sidebar-active:rgba(5,150,105,.18); --sidebar-active-fg:#ffffff; --brand-fg:#ffffff;
  --money:#047857; --spend:#b45309; --accent:#047857;
  --info:#334155; --good:#047857; --warn:#b45309; --danger:#dc2626;
  --c1:#0f172a; --c2:#047857; --c3:#d97706; --c4:#64748b;
  color-scheme:light;
}

/* ---------------- NIGHT ---------------- */
html[data-shell="app"][data-theme="nova"]{
  --nv-page:#0b1220; --nv-panel:#111a2b; --nv-panel2:#16223a;
  --nv-line:#1e293b; --nv-line2:#172032;
  --nv-text:#e8eef6; --nv-text2:#b6c2d4; --nv-mute:#93a3b8; --nv-dim:#64748b;
  --nv-field:#0e1728; --nv-field-line:#27354c; --nv-ph:#6b7b91;
  --nv-link:#7dd3ae; --nv-link2:#9fe3c4;
  --nv-hover:rgba(255,255,255,.05); --nv-head:rgba(255,255,255,.04);
  --nv-chip:rgba(255,255,255,.07); --nv-chip-line:#27354c;
  --nv-shadow:0 1px 2px rgba(0,0,0,.35); --nv-shadow2:0 12px 30px rgba(0,0,0,.5);
  --nv-pop:#16223a; --nv-side:#070d18; --nv-top:#0e1728;
  --nv-tabsbg:#0e1728; --nv-scrim:rgba(2,6,14,.65);
  --nv-bar:#cbd5e1; --nv-scroll:rgba(255,255,255,.18);
  --nv-navy:#1e3a5f; --nv-navy2:#2b4b76;
  --nv-good:#34d399; --nv-good-str:#34d399;
  --nv-warn:#fbbf24; --nv-danger:#f87171; --nv-info:#cbd5e1;
  --nv-good-bg:rgba(5,150,105,.16); --nv-good-ln:rgba(5,150,105,.38);
  --nv-warn-bg:rgba(217,119,6,.16); --nv-warn-ln:rgba(217,119,6,.38);
  --nv-danger-bg:rgba(220,38,38,.16); --nv-danger-ln:rgba(220,38,38,.38);
  --nv-info-bg:rgba(255,255,255,.07); --nv-info-ln:#27354c;
  --bg:#0b1220; --fg:#e8eef6; --card:#111a2b; --muted:#93a3b8;
  --line:#1e293b; --surface-2:#16223a; --field-bg:#0e1728;
  --sidebar:#070d18; --sidebar-fg:#a8b6c8; --sidebar-hover:rgba(255,255,255,.07);
  --sidebar-active:rgba(5,150,105,.22); --sidebar-active-fg:#ffffff; --brand-fg:#ffffff;
  --money:#34d399; --spend:#fbbf24; --accent:#34d399;
  --info:#cbd5e1; --good:#34d399; --warn:#fbbf24; --danger:#f87171;
  --c1:#94a3b8; --c2:#34d399; --c3:#fbbf24; --c4:#64748b;
  color-scheme:dark;
}

/* ---------------- shared ---------------- */
html[data-shell="app"][data-theme^="nova"],
html[data-shell="app"][data-theme^="nova"] body{background:var(--nv-page);color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"]{
  --primary:var(--nv-navy); --primary-fg:#ffffff;
  --primary-soft:var(--nv-chip); --primary-line:var(--nv-chip-line);
  --chip-bg:var(--nv-chip); --chip-fg:var(--nv-text);
  --danger-bg:var(--nv-danger-bg); --danger-line:var(--nv-danger-ln);
  --warn-bg:var(--nv-warn-bg); --warn-line:var(--nv-warn-ln);
  --info-soft:var(--nv-info-bg); --good-soft:var(--nv-good-bg);
  --warn-soft:var(--nv-warn-bg); --danger-soft:var(--nv-danger-bg);
  --shadow:var(--nv-shadow2);
  --ink:#0f172a; --ink-2:#1e293b; --ink-fg:#ffffff; --ink-muted:#94a3b8;
  --r:10px;
}
html[data-shell="app"][data-theme^="nova"] .app{background:var(--nv-page)}
html[data-shell="app"][data-theme^="nova"] .sidebar{background:var(--nv-side);border-right:1px solid rgba(255,255,255,.06)}
html[data-shell="app"][data-theme^="nova"] .sidebar .brand{color:#ffffff}
html[data-shell="app"][data-theme^="nova"] .sidebar .brand em{color:#34d399;font-style:normal}
html[data-shell="app"][data-theme^="nova"] .sidebar nav a,
html[data-shell="app"][data-theme^="nova"] .sidebar a{color:#cbd5e1;border-left:3px solid transparent}
html[data-shell="app"][data-theme^="nova"] .sidebar nav a:hover,
html[data-shell="app"][data-theme^="nova"] .sidebar a:hover{background:rgba(255,255,255,.07);color:#ffffff}
html[data-shell="app"][data-theme^="nova"] .sidebar nav a.active,
html[data-shell="app"][data-theme^="nova"] .sidebar a.active{background:rgba(5,150,105,.20);color:#ffffff;border-left:3px solid #059669;font-weight:600}
html[data-shell="app"][data-theme^="nova"] .navgroup-title{color:#7b8aa0;letter-spacing:.08em}
html[data-shell="app"][data-theme^="nova"] .sidebar .linkish{color:#cbd5e1}

html[data-shell="app"][data-theme^="nova"] .top{background:var(--nv-top);border-bottom:1px solid var(--nv-line)}
html[data-shell="app"][data-theme^="nova"] .card,
html[data-shell="app"][data-theme^="nova"] .tradecard,
html[data-shell="app"][data-theme^="nova"] .tablewrap{background:var(--nv-panel);border:1px solid var(--nv-line);box-shadow:var(--nv-shadow)}
html[data-shell="app"][data-theme^="nova"] h1,
html[data-shell="app"][data-theme^="nova"] h2,
html[data-shell="app"][data-theme^="nova"] h3,
html[data-shell="app"][data-theme^="nova"] .card h2{color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] .subtitle,
html[data-shell="app"][data-theme^="nova"] .muted,
html[data-shell="app"][data-theme^="nova"] small{color:var(--nv-mute)}
html[data-shell="app"][data-theme^="nova"] p,
html[data-shell="app"][data-theme^="nova"] li,
html[data-shell="app"][data-theme^="nova"] label{color:var(--nv-text2)}
html[data-shell="app"][data-theme^="nova"] a{color:var(--nv-link)}
html[data-shell="app"][data-theme^="nova"] a:hover{color:var(--nv-link2)}
html[data-shell="app"][data-theme^="nova"] hr{border-color:var(--nv-line)}

html[data-shell="app"][data-theme^="nova"] input,
html[data-shell="app"][data-theme^="nova"] select,
html[data-shell="app"][data-theme^="nova"] textarea{background:var(--nv-field);color:var(--nv-text);border:1px solid var(--nv-field-line)}
html[data-shell="app"][data-theme^="nova"] input::placeholder,
html[data-shell="app"][data-theme^="nova"] textarea::placeholder{color:var(--nv-ph)}
html[data-shell="app"][data-theme^="nova"] input:focus,
html[data-shell="app"][data-theme^="nova"] select:focus,
html[data-shell="app"][data-theme^="nova"] textarea:focus{border-color:var(--nv-navy);outline:none;box-shadow:0 0 0 3px rgba(15,23,42,.10)}
html[data-shell="app"][data-theme="nova"] input:focus,
html[data-shell="app"][data-theme="nova"] select:focus,
html[data-shell="app"][data-theme="nova"] textarea:focus{border-color:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.18)}
html[data-shell="app"][data-theme^="nova"] select option{background:var(--nv-panel);color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] input[type="checkbox"],
html[data-shell="app"][data-theme^="nova"] input[type="radio"]{accent-color:#047857;background:transparent;border:none;box-shadow:none}

html[data-shell="app"][data-theme^="nova"] table{color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] th,
html[data-shell="app"][data-theme^="nova"] .dtable th{background:var(--nv-head);color:var(--nv-text2);border-bottom:1px solid var(--nv-line);font-weight:600;letter-spacing:.04em}
html[data-shell="app"][data-theme^="nova"] td,
html[data-shell="app"][data-theme^="nova"] .dtable td{border-bottom:1px solid var(--nv-line2);color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] tbody tr:hover,
html[data-shell="app"][data-theme^="nova"] .dtable tbody tr:hover{background:var(--nv-hover)}
html[data-shell="app"][data-theme^="nova"] .dtable a{color:var(--nv-link)}

html[data-shell="app"][data-theme^="nova"] button:not(.secondary):not(.danger):not(.linkish){
  background:var(--nv-navy);color:#ffffff;border:1px solid var(--nv-navy);box-shadow:none;font-weight:600}
html[data-shell="app"][data-theme^="nova"] button:not(.secondary):not(.danger):not(.linkish):hover{
  background:var(--nv-navy2);border-color:var(--nv-navy2);filter:none}
html[data-shell="app"][data-theme^="nova"] button.secondary{background:var(--nv-panel);color:var(--nv-text2);border:1px solid var(--nv-field-line);box-shadow:none}
html[data-shell="app"][data-theme^="nova"] button.secondary:hover{background:var(--nv-hover);color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] button.danger{background:#dc2626;color:#ffffff;border:1px solid #dc2626;box-shadow:none}
html[data-shell="app"][data-theme^="nova"] button.danger:hover{background:#b91c1c;border-color:#b91c1c}
html[data-shell="app"][data-theme^="nova"] .linkish{color:var(--nv-link)}

/* KPI row - flat cards with a coloured accent rail */
html[data-shell="app"][data-theme^="nova"] .kpis .kpi{
  background:var(--nv-panel);color:var(--nv-text);border:1px solid var(--nv-line);
  border-left:4px solid #0f172a;box-shadow:var(--nv-shadow)}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi .k-label{color:var(--nv-text2);font-weight:600;letter-spacing:.03em}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi .k-sub{color:var(--nv-mute)}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi .k-value{color:var(--nv-text);font-weight:700;text-shadow:none}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:hover{box-shadow:var(--nv-shadow2)}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+1){border-left-color:#0f172a}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+2){border-left-color:#047857}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+3){border-left-color:#475569}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+4){border-left-color:#dc2626}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+5){border-left-color:#d97706}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+6){border-left-color:#059669}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+1) .k-dot{background:#0f172a}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+2) .k-dot{background:#047857}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+3) .k-dot{background:#475569}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+4) .k-dot{background:#dc2626}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+5) .k-dot{background:#d97706}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi:nth-child(6n+6) .k-dot{background:#059669}
html[data-shell="app"][data-theme="nova"] .kpis .kpi:nth-child(6n+1){border-left-color:#94a3b8}
html[data-shell="app"][data-theme="nova"] .kpis .kpi:nth-child(6n+1) .k-dot{background:#94a3b8}

/* headline panel - solid navy, no gradient */
html[data-shell="app"][data-theme^="nova"] .inkcard{background:#0f172a;border:1px solid #0f172a}
html[data-shell="app"][data-theme^="nova"] .inkcard h2{color:#ffffff}
html[data-shell="app"][data-theme^="nova"] .inkcard .ink-sub{color:#94a3b8}
html[data-shell="app"][data-theme^="nova"] .inkcard a{color:#6ee7b7}
html[data-shell="app"][data-theme^="nova"] .inkstat .i-label{color:#94a3b8;font-weight:600}
html[data-shell="app"][data-theme^="nova"] .inkstat .i-note{color:#94a3b8}
html[data-shell="app"][data-theme^="nova"] .inkstat .i-value{color:#ffffff;font-weight:700}
html[data-shell="app"][data-theme^="nova"] .inkstat .i-value.t{color:#6ee7b7}
html[data-shell="app"][data-theme^="nova"] .inkstat .i-value.w{color:#fcd34d}

/* status pills */
html[data-shell="app"][data-theme^="nova"] .st{border:1px solid transparent;font-weight:600}
html[data-shell="app"][data-theme^="nova"] .st-good{background:var(--nv-good-bg);color:var(--nv-good);border-color:var(--nv-good-ln)}
html[data-shell="app"][data-theme^="nova"] .st-info{background:var(--nv-info-bg);color:var(--nv-info);border-color:var(--nv-info-ln)}
html[data-shell="app"][data-theme^="nova"] .st-warn{background:var(--nv-warn-bg);color:var(--nv-warn);border-color:var(--nv-warn-ln)}
html[data-shell="app"][data-theme^="nova"] .st-danger{background:var(--nv-danger-bg);color:var(--nv-danger);border-color:var(--nv-danger-ln)}
html[data-shell="app"][data-theme^="nova"] .st-idle{background:var(--nv-info-bg);color:var(--nv-info);border-color:var(--nv-info-ln)}
html[data-shell="app"][data-theme^="nova"] .badge{background:var(--nv-info-bg);color:var(--nv-text2);border:1px solid var(--nv-info-ln);font-weight:600}
html[data-shell="app"][data-theme^="nova"] .badge.ok{background:var(--nv-good-bg);color:var(--nv-good);border-color:var(--nv-good-ln)}
html[data-shell="app"][data-theme^="nova"] .badge.danger{background:var(--nv-danger-bg);color:var(--nv-danger);border-color:var(--nv-danger-ln)}
html[data-shell="app"][data-theme^="nova"] .alert.info{background:var(--nv-info-bg);color:var(--nv-text2);border:1px solid var(--nv-info-ln)}
html[data-shell="app"][data-theme^="nova"] .flash{background:var(--nv-good-bg);color:var(--nv-good);border:1px solid var(--nv-good-ln)}

/* tabs & chips */
html[data-shell="app"][data-theme^="nova"] .tabs a{color:var(--nv-text2)}
html[data-shell="app"][data-theme^="nova"] .tabs a:hover{color:var(--nv-text);background:var(--nv-hover)}
html[data-shell="app"][data-theme^="nova"] .tabs a.active,
html[data-shell="app"][data-theme^="nova"] .tabs a.active:hover{background:var(--nv-navy);color:#ffffff;border-color:var(--nv-navy)}
html[data-shell="app"][data-theme^="nova"] .tabs .tabmore{background:var(--nv-panel);color:var(--nv-text2);border:1px solid var(--nv-field-line)}
html[data-shell="app"][data-theme^="nova"] .chips a{background:var(--nv-panel);color:var(--nv-text2);border:1px solid var(--nv-field-line)}
html[data-shell="app"][data-theme^="nova"] .chips a b{color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] .chips a:hover{background:var(--nv-hover);color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] .chips a.on,
html[data-shell="app"][data-theme^="nova"] .chips a.on:hover{background:var(--nv-navy);color:#ffffff;border-color:var(--nv-navy)}
html[data-shell="app"][data-theme^="nova"] .chips a.on b{color:#ffffff}

/* header bits */
html[data-shell="app"][data-theme^="nova"] .uavatar{background:#0f172a;color:#ffffff}
html[data-shell="app"][data-theme="nova"] .uavatar{background:#1e3a5f}
html[data-shell="app"][data-theme^="nova"] .uname,
html[data-shell="app"][data-theme^="nova"] .upop-head strong{color:var(--nv-text)}
html[data-shell="app"][data-theme^="nova"] .urole{color:var(--nv-mute)}
html[data-shell="app"][data-theme^="nova"] .usermenu-pop{background:var(--nv-pop);border:1px solid var(--nv-line);box-shadow:var(--nv-shadow2)}
html[data-shell="app"][data-theme^="nova"] .usermenu-pop .logoutbtn{background:var(--nv-panel);color:var(--nv-text2);border:1px solid var(--nv-field-line)}
html[data-shell="app"][data-theme^="nova"] .topright .usermenu .usermenu-pop .logoutbtn:hover{background:var(--nv-danger-bg);color:var(--nv-danger);border-color:var(--nv-danger-ln)}
html[data-shell="app"][data-theme^="nova"] .topsearch input{background:var(--nv-field);border:1px solid var(--nv-field-line)}
html[data-shell="app"][data-theme^="nova"] .navbtn{border:1px solid var(--nv-field-line);background:var(--nv-panel)}
html[data-shell="app"][data-theme^="nova"] .navbtn span{background:var(--nv-bar)}
html[data-shell="app"][data-theme^="nova"] .navscrim{background:var(--nv-scrim)}
html[data-shell="app"][data-theme^="nova"] .tabs{background:var(--nv-tabsbg);border-top:1px solid var(--nv-line)}
html[data-shell="app"][data-theme^="nova"] code,
html[data-shell="app"][data-theme^="nova"] pre{background:var(--nv-panel2);color:var(--nv-text);border:1px solid var(--nv-line)}
html[data-shell="app"][data-theme^="nova"] *{scrollbar-color:var(--nv-scroll) transparent}
html[data-shell="app"][data-theme^="nova"] ::-webkit-scrollbar{width:10px;height:10px}
html[data-shell="app"][data-theme^="nova"] ::-webkit-scrollbar-thumb{background:var(--nv-scroll);border-radius:8px}
html[data-shell="app"][data-theme^="nova"] ::-webkit-scrollbar-track{background:transparent}

/* ---------- day / night switch in the header ---------- */
.topright .daynight{margin:0;display:flex;align-items:center}
.topright .daynight .dnbtn{
  width:38px;height:38px;padding:0;display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;cursor:pointer;line-height:0;
  background:var(--chip-bg,rgba(0,0,0,.05));color:var(--fg,#222);
  border:1px solid var(--line,rgba(0,0,0,.12));box-shadow:none}
html[data-shell="app"][data-theme^="nova"] .topright .daynight .dnbtn{
  background:var(--nv-panel);color:var(--nv-text2);border:1px solid var(--nv-field-line);box-shadow:none}
html[data-shell="app"][data-theme^="nova"] .topright .daynight .dnbtn:hover{
  background:var(--nv-hover);color:var(--nv-text);filter:none}
.topright .daynight .dnbtn svg{display:block}
@media (max-width:899.98px){.topright .daynight .dnbtn{width:34px;height:34px}}
/* financial value emphasis */
html[data-shell="app"][data-theme^="nova"] .k-value.v-good,
html[data-shell="app"][data-theme^="nova"] .money,
html[data-shell="app"][data-theme^="nova"] .pos{color:var(--nv-good);font-weight:700}
html[data-shell="app"][data-theme^="nova"] .k-value.v-bad,
html[data-shell="app"][data-theme^="nova"] .neg{color:var(--nv-danger);font-weight:700}
html[data-shell="app"][data-theme^="nova"] .k-value.v-warn{color:var(--nv-warn);font-weight:700}
/* readable placeholders */
html[data-shell="app"][data-theme="novaday"] input::placeholder,
html[data-shell="app"][data-theme="novaday"] textarea::placeholder{color:#64748b;opacity:1}
html[data-shell="app"][data-theme="nova"] input::placeholder,
html[data-shell="app"][data-theme="nova"] textarea::placeholder{color:#8ea0b8;opacity:1}
/* mobile drawer - works without :has() too */
@media (max-width:899.98px){
  .navtoggle:checked ~ .sidebar{display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;width:286px;max-width:86vw;z-index:120;overflow-y:auto}
  .navtoggle:checked ~ .navscrim{display:block;position:fixed;inset:0;z-index:110;background:rgba(15,23,42,.45);border:none;margin:0}
  .navtoggle:checked ~ .sidebar nav a{padding:11px 12px;font-size:15px}
}
/* ---------- aaj loss: a row that lost money today ---------- */
.lossrow{
  border-left:4px solid var(--nv-danger,#dc2626);
  background:var(--nv-danger-bg,#fef2f2);
  padding-left:10px;border-radius:8px}
.lossrow .lossword{color:var(--nv-danger,#b91c1c);font-weight:700}
.lossbanner{
  display:flex;align-items:center;gap:8px;
  background:var(--nv-danger-bg,#fef2f2);
  border:1px solid var(--nv-danger-ln,#fecaca);
  color:var(--nv-danger,#b91c1c);
  border-left:4px solid #dc2626;
  border-radius:8px;padding:10px 12px;margin:8px 0;font-weight:600}
html[data-shell="app"][data-theme="nova"] .lossrow{background:rgba(220,38,38,.14);border-left-color:#f87171}
html[data-shell="app"][data-theme="nova"] .lossrow .lossword{color:#fca5a5}
html[data-shell="app"][data-theme="nova"] .lossbanner{background:rgba(220,38,38,.14);border-color:rgba(220,38,38,.40);color:#fca5a5;border-left-color:#f87171}
/* the loss treatment has to beat .card's own border */
html[data-shell="app"] .card.lossrow,
html[data-shell="app"] .rowline.lossrow{
  border-left:4px solid #dc2626;
  background:var(--nv-danger-bg,#fef2f2)}
html[data-shell="app"][data-theme="nova"] .card.lossrow,
html[data-shell="app"][data-theme="nova"] .rowline.lossrow{
  border-left-color:#f87171;background:rgba(220,38,38,.12)}
html[data-shell="app"] .rowline.lossrow{padding:8px 10px;border-radius:8px;margin:2px 0}
/* ---------------------------------------- admin manual trade sharing */
.mrow{border:1px solid var(--nv-line,#e2e8f0);border-radius:10px;padding:12px;margin-bottom:10px;
  display:grid;grid-template-columns:1fr auto 1fr;gap:10px 12px;align-items:start}
.mrow .mside{min-width:0}
.mrow .mside label{margin:0;display:block}
.mrow .mside select{width:100%;max-width:100%}
.mrow .meq{margin-top:4px}
.mrow .mvs{align-self:center;font-weight:700;opacity:.5;padding-top:20px}
.mrow .mparams{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.mrow .mparams label{margin:0;display:block}
.mrow .mparams input{width:100%}
.mrow .mdelwrap{grid-column:1/-1;display:flex;justify-content:flex-end}
.mfoot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:10px}
.movr{display:flex;align-items:center;gap:6px;margin:0;cursor:pointer}
.movr input{width:auto;margin:0}
.mgo{margin-top:12px}
.tparams{padding:0 12px 8px}
@media (max-width:760px){
  .mrow{grid-template-columns:1fr}
  .mrow .mvs{padding-top:0;text-align:center}
  .mrow .mparams{grid-template-columns:1fr 1fr}
}
/* ------------------------------------- go to top / go to footer, every page */
.jumpnav{position:fixed;right:14px;bottom:18px;z-index:60;display:flex;flex-direction:column;gap:8px}
.jumpnav[hidden]{display:none}
.jumpbtn{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font:600 17px/1 system-ui,sans-serif;cursor:pointer;padding:0;
  background:var(--nv-panel,#fff);color:var(--nv-text,#111827);
  border:1px solid var(--nv-line,#e2e8f0);box-shadow:0 2px 10px rgba(15,23,42,.16)}
.jumpbtn:hover{background:var(--nv-hover,#f1f5f9)}
.jumpbtn:disabled{opacity:.3;cursor:default;box-shadow:none}
@media (max-width:640px){.jumpnav{right:10px;gap:6px}.jumpbtn{width:36px;height:36px;font-size:15px}}
@media print{.jumpnav{display:none}}
/* search inside the manual pairing rows */
.mrow .msearch{width:100%;margin:4px 0 6px}
.mrow .mpick{width:100%;max-width:100%}
.mrow .mpick.bad{border-color:var(--nv-danger,#dc2626)}
/* edit a pairing right at the vs */
.editwrap{margin:8px 0 2px}
.editform{margin-top:8px;padding:10px;border:1px solid rgba(128,128,128,.28);border-radius:10px}
.editform .epick{width:100%}
.editform .epick.bad{border-color:#e5484d}
.editform .mside label.small input{width:100%}
/* where the decided Trade Ideas begin */
.donesplit{display:flex;align-items:center;gap:10px;margin:18px 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.55}
.donesplit:before,.donesplit:after{content:"";flex:1;height:1px;background:rgba(128,128,128,.3)}
/* who a ledger line belongs to */
.ledgerfirm{opacity:.75;font-weight:600}
/* finished-for-today filter chip */
.chips .donechip{margin-left:auto}
/* ---- three extra colour schemes: emerald, sapphire, violet ---------------
   Same token names the app already reads, so every page and the mobile
   shell recolour with no component change. -------------------------- */
html[data-shell="app"][data-theme="emerald"]{
  --bg:#0A0F14; --nv-page:#0A0F14; --nv-panel:#121A22; --nv-panel2:#16212B;
  --nv-line:#22303C; --nv-line2:#0E151C;
  --nv-text:#EAF2F0; --nv-text2:#C3D2D4; --nv-mute:#8CA0A8; --nv-dim:#6B7F87;
  --nv-field:#0E151C; --nv-field-line:#22303C; --nv-ph:#6B7F87;
  --nv-link:#22C55E; --nv-link2:#4ADE80;
  --nv-hover:rgba(255,255,255,.05); --nv-head:rgba(255,255,255,.04);
  --nv-chip:rgba(255,255,255,.07); --nv-chip-line:#22303C;
  --nv-shadow:0 1px 2px rgba(0,0,0,.35); --nv-shadow2:0 12px 30px rgba(0,0,0,.5);
  --nv-pop:#16212B; --nv-side:#070C10; --nv-top:#0E151C;
  --nv-tabsbg:#0E151C; --nv-scrim:rgba(10,15,20,.72);
  --nv-bar:#C3D2D4; --nv-scroll:rgba(255,255,255,.18);
  --nv-navy:#22C55E; --nv-navy2:#16A34A;
  --nv-good:#22C55E; --nv-good-str:#22C55E;
  --nv-warn:#F5A524; --nv-danger:#F5455C; --nv-info:#38BDF8;
  --nv-good-bg:rgba(34,197,94,.16); --nv-good-ln:rgba(34,197,94,.38);
  --nv-warn-bg:rgba(245,165,36,.16); --nv-warn-ln:rgba(245,165,36,.38);
  --nv-danger-bg:rgba(245,69,92,.16); --nv-danger-ln:rgba(245,69,92,.38);
  --nv-info-bg:rgba(56,189,248,.14); --nv-info-ln:rgba(56,189,248,.34);
  --fg:#EAF2F0; --card:#121A22; --muted:#8CA0A8;
  --line:#22303C; --surface-2:#16212B; --field-bg:#0E151C;
  --primary:#22C55E; --primary-fg:#ffffff;
  --primary-soft:rgba(34,197,94,.16); --primary-line:rgba(34,197,94,.38);
  --sidebar:#070C10; --sidebar-fg:#C3D2D4; --sidebar-hover:rgba(255,255,255,.07);
  --sidebar-active:rgba(34,197,94,.22); --sidebar-active-fg:#ffffff; --brand-fg:#ffffff;
  --money:#22C55E; --spend:#F5A524; --accent:#22C55E;
  --info:#38BDF8; --good:#22C55E; --warn:#F5A524; --danger:#F5455C;
  --good-soft:rgba(34,197,94,.16); --warn-soft:rgba(245,165,36,.16);
  --danger-soft:rgba(245,69,92,.16); --info-soft:rgba(56,189,248,.14);
  --danger-bg:rgba(245,69,92,.16); --danger-line:rgba(245,69,92,.38);
  --warn-bg:rgba(245,165,36,.16); --warn-line:rgba(245,165,36,.38);
  --ink:#121A22; --ink-fg:#EAF2F0; --ink-muted:#8CA0A8;
  --auth-bg:linear-gradient(160deg, #121A22, #0A0F14);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.35);
  --c1:#8CA0A8; --c2:#22C55E; --c3:#F5A524; --c4:#6B7F87;
  color-scheme:dark;
}

html[data-shell="app"][data-theme="sapphire"]{
  --bg:#0B0F1F; --nv-page:#0B0F1F; --nv-panel:#141B33; --nv-panel2:#1A2340;
  --nv-line:#26304F; --nv-line2:#0F1528;
  --nv-text:#EEF1FB; --nv-text2:#C6CBE6; --nv-mute:#8C93B8; --nv-dim:#6E76A0;
  --nv-field:#0F1528; --nv-field-line:#26304F; --nv-ph:#6E76A0;
  --nv-link:#3B82F6; --nv-link2:#93C5FD;
  --nv-hover:rgba(255,255,255,.05); --nv-head:rgba(255,255,255,.04);
  --nv-chip:rgba(255,255,255,.07); --nv-chip-line:#26304F;
  --nv-shadow:0 1px 2px rgba(0,0,0,.35); --nv-shadow2:0 12px 30px rgba(0,0,0,.5);
  --nv-pop:#1A2340; --nv-side:#070A16; --nv-top:#0F1528;
  --nv-tabsbg:#0F1528; --nv-scrim:rgba(11,15,31,.72);
  --nv-bar:#C6CBE6; --nv-scroll:rgba(255,255,255,.18);
  --nv-navy:#3B82F6; --nv-navy2:#2563EB;
  --nv-good:#34D399; --nv-good-str:#34D399;
  --nv-warn:#FBBF24; --nv-danger:#F87171; --nv-info:#22D3EE;
  --nv-good-bg:rgba(52,211,153,.16); --nv-good-ln:rgba(52,211,153,.38);
  --nv-warn-bg:rgba(251,191,36,.16); --nv-warn-ln:rgba(251,191,36,.38);
  --nv-danger-bg:rgba(248,113,113,.16); --nv-danger-ln:rgba(248,113,113,.38);
  --nv-info-bg:rgba(34,211,238,.14); --nv-info-ln:rgba(34,211,238,.34);
  --fg:#EEF1FB; --card:#141B33; --muted:#8C93B8;
  --line:#26304F; --surface-2:#1A2340; --field-bg:#0F1528;
  --primary:#3B82F6; --primary-fg:#ffffff;
  --primary-soft:rgba(59,130,246,.16); --primary-line:rgba(59,130,246,.38);
  --sidebar:#070A16; --sidebar-fg:#C6CBE6; --sidebar-hover:rgba(255,255,255,.07);
  --sidebar-active:rgba(59,130,246,.22); --sidebar-active-fg:#ffffff; --brand-fg:#ffffff;
  --money:#34D399; --spend:#FBBF24; --accent:#3B82F6;
  --info:#22D3EE; --good:#34D399; --warn:#FBBF24; --danger:#F87171;
  --good-soft:rgba(52,211,153,.16); --warn-soft:rgba(251,191,36,.16);
  --danger-soft:rgba(248,113,113,.16); --info-soft:rgba(34,211,238,.14);
  --danger-bg:rgba(248,113,113,.16); --danger-line:rgba(248,113,113,.38);
  --warn-bg:rgba(251,191,36,.16); --warn-line:rgba(251,191,36,.38);
  --ink:#141B33; --ink-fg:#EEF1FB; --ink-muted:#8C93B8;
  --auth-bg:linear-gradient(160deg, #141B33, #0B0F1F);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.35);
  --c1:#8C93B8; --c2:#3B82F6; --c3:#FBBF24; --c4:#6E76A0;
  color-scheme:dark;
}

html[data-shell="app"][data-theme="violet"]{
  --bg:#0F0B1A; --nv-page:#0F0B1A; --nv-panel:#1A1430; --nv-panel2:#211A3C;
  --nv-line:#2E2450; --nv-line2:#130E24;
  --nv-text:#F1ECFB; --nv-text2:#D2C8EC; --nv-mute:#9B8FC4; --nv-dim:#7A6DA6;
  --nv-field:#130E24; --nv-field-line:#2E2450; --nv-ph:#7A6DA6;
  --nv-link:#8B5CF6; --nv-link2:#C4B5FD;
  --nv-hover:rgba(255,255,255,.05); --nv-head:rgba(255,255,255,.04);
  --nv-chip:rgba(255,255,255,.07); --nv-chip-line:#2E2450;
  --nv-shadow:0 1px 2px rgba(0,0,0,.35); --nv-shadow2:0 12px 30px rgba(0,0,0,.5);
  --nv-pop:#211A3C; --nv-side:#0A0714; --nv-top:#130E24;
  --nv-tabsbg:#130E24; --nv-scrim:rgba(15,11,26,.72);
  --nv-bar:#D2C8EC; --nv-scroll:rgba(255,255,255,.18);
  --nv-navy:#8B5CF6; --nv-navy2:#7C3AED;
  --nv-good:#34D399; --nv-good-str:#34D399;
  --nv-warn:#F59E0B; --nv-danger:#FB7185; --nv-info:#38BDF8;
  --nv-good-bg:rgba(52,211,153,.16); --nv-good-ln:rgba(52,211,153,.38);
  --nv-warn-bg:rgba(245,158,11,.16); --nv-warn-ln:rgba(245,158,11,.38);
  --nv-danger-bg:rgba(251,113,133,.16); --nv-danger-ln:rgba(251,113,133,.38);
  --nv-info-bg:rgba(56,189,248,.14); --nv-info-ln:rgba(56,189,248,.34);
  --fg:#F1ECFB; --card:#1A1430; --muted:#9B8FC4;
  --line:#2E2450; --surface-2:#211A3C; --field-bg:#130E24;
  --primary:#8B5CF6; --primary-fg:#ffffff;
  --primary-soft:rgba(139,92,246,.16); --primary-line:rgba(139,92,246,.38);
  --sidebar:#0A0714; --sidebar-fg:#D2C8EC; --sidebar-hover:rgba(255,255,255,.07);
  --sidebar-active:rgba(139,92,246,.22); --sidebar-active-fg:#ffffff; --brand-fg:#ffffff;
  --money:#34D399; --spend:#F59E0B; --accent:#8B5CF6;
  --info:#38BDF8; --good:#34D399; --warn:#F59E0B; --danger:#FB7185;
  --good-soft:rgba(52,211,153,.16); --warn-soft:rgba(245,158,11,.16);
  --danger-soft:rgba(251,113,133,.16); --info-soft:rgba(56,189,248,.14);
  --danger-bg:rgba(251,113,133,.16); --danger-line:rgba(251,113,133,.38);
  --warn-bg:rgba(245,158,11,.16); --warn-line:rgba(245,158,11,.38);
  --ink:#1A1430; --ink-fg:#F1ECFB; --ink-muted:#9B8FC4;
  --auth-bg:linear-gradient(160deg, #1A1430, #0F0B1A);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.35);
  --c1:#9B8FC4; --c2:#8B5CF6; --c3:#F59E0B; --c4:#7A6DA6;
  color-scheme:dark;
}

/* theme picker in the top bar */
.themepick{display:inline-flex;align-items:center;gap:6px;margin-right:6px}
.themepick select{background:var(--nv-field,var(--field-bg));color:var(--nv-text,var(--fg));border:1px solid var(--nv-field-line,var(--line));border-radius:9px;padding:6px 8px;font:inherit;font-size:13px;line-height:1.2;max-width:150px}
.themepick select:focus{outline:2px solid var(--primary);outline-offset:1px}
@media (max-width:760px){.themepick select{max-width:112px;font-size:12px;padding:5px 6px}}
/* what kind of trade this is, right above the vs */
.tvs{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.tphase{font-weight:800;font-size:11px;letter-spacing:.09em;white-space:nowrap;color:var(--nv-text,var(--fg));opacity:.95;text-align:center}
@media (max-width:640px){.tphase{font-size:10px;letter-spacing:.05em}}
/* a payout amount that will not be accepted */
p.payerr,
html[data-shell="app"] p.payerr{margin:8px 0 0;font-weight:700;color:var(--danger,#f5455c);background:var(--danger-soft,rgba(220,38,38,.14));border:1px solid var(--danger-line,rgba(220,38,38,.38));border-radius:9px;padding:8px 10px;font-size:13px}
input[name="per"].bad{border-color:var(--danger,#f5455c);outline:none}
button[disabled]{opacity:.5;cursor:not-allowed}
.flash.bad{color:var(--danger,#f5455c);background:var(--danger-soft,rgba(220,38,38,.14));border:1px solid var(--danger-line,rgba(220,38,38,.38));font-weight:700}
/* hand a trade back to the desk */
.editwrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.editwrap .editform{flex:1 1 100%}
.repairform{display:inline}
.mside .mseats{display:block;margin-top:6px}
.mside .mnum{width:100%}
/* a trade that is placed and only waiting for its result */
.donetag{font-weight:700;letter-spacing:.04em}
/* the Rules page when you may only read it */
fieldset.readonly{border:0;margin:0;padding:0;min-width:0}
fieldset.readonly input,fieldset.readonly select{opacity:.85;cursor:default}
/* manual trade sharing: one master side, many opposite groups */
.mgroup{border:1px solid rgba(128,128,128,.28);border-radius:12px;padding:12px;margin:10px 0}
.mgroup h3,.mgroup h4{margin:0;font-size:14px}
.mgroup .mpick{width:100%}
.mgroup .mpick.bad{border-color:var(--danger,#e5484d)}
.mmaster{border-color:var(--primary,#22c55e)}
.mbigvs{text-align:center;font-weight:800;letter-spacing:.12em;margin:6px 0;opacity:.7}
.msummary{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:rgba(128,128,128,.10);font-size:13px}
.tgroup{font-size:10px;letter-spacing:.08em;text-transform:uppercase;opacity:.55;font-weight:700}
.tsum{margin-top:8px}
/* ---- Lifetime payouts: analytics + drill-down ------------------------- */
.ph{margin:0 0 22px}
.ph-head h2{margin:0 0 2px}
.ph-filters{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 12px}
.ph-f{display:flex;flex-direction:column;gap:4px;font-size:12px;min-width:140px;flex:1 1 150px}
.ph-f span{opacity:.7;font-weight:600;letter-spacing:.02em}
.ph-f select,.ph-f input{width:100%}
.ph-search{flex:2 1 220px}
.ph-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:0 0 14px}
.ph-card{border:1px solid var(--nv-line,var(--line,#e5e7eb));background:var(--nv-panel,var(--card,#fff));
  border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.ph-card span{font-size:12px;opacity:.65;font-weight:600}
.ph-card strong{font-size:22px;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.ph-card em{font-style:normal;font-size:11.5px;opacity:.6}
.ph-scroll{overflow:auto;max-height:70vh;border:1px solid var(--nv-line,var(--line,#e5e7eb));border-radius:12px;
  background:var(--nv-panel,var(--card,#fff))}
.ph-t{width:100%;border-collapse:collapse;font-size:13.5px}
.ph-t th{position:sticky;top:0;z-index:1;text-align:left;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;
  font-weight:700;opacity:.9;padding:10px 12px;background:var(--nv-panel2,var(--surface-2,#f9fafb));
  border-bottom:1px solid var(--nv-line,var(--line,#e5e7eb))}
.ph-t td{padding:10px 12px;border-bottom:1px solid var(--nv-line2,var(--line,#eef0f3));vertical-align:top}
.ph-t tr:last-child td{border-bottom:0}
.ph-t tbody tr:hover td{background:var(--nv-hover,rgba(128,128,128,.06))}
.ph-t .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ph-link{background:none;border:0;padding:3px 8px;margin:-3px -8px;border-radius:8px;cursor:pointer;font:inherit;
  font-weight:700;color:var(--nv-link,var(--primary,#4f46e5));white-space:nowrap}
.ph-link:hover,.ph-link:focus-visible{background:var(--primary-soft,rgba(79,70,229,.1));outline:none;text-decoration:underline}
.ph-hint{font-size:11px;opacity:.6;margin-top:3px;white-space:normal}
.ph-seat td{font-size:12.5px;opacity:.8}
.ph-seat td:first-child{padding-left:28px}
.ph-legacy td:first-child{font-style:italic}
.ph-sec{margin:18px 0 8px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;opacity:.75}
.ph-foot{margin:10px 2px 0}
.ph-empty{padding:18px}
.ph-st{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;letter-spacing:.02em}
.ph-st.ok{background:var(--nv-good-bg,rgba(5,150,105,.14));color:var(--nv-good,#059669)}
.ph-st.wait{background:var(--nv-warn-bg,rgba(217,119,6,.14));color:var(--nv-warn,#b45309)}
.ph-scrim{position:fixed;inset:0;background:var(--nv-scrim,rgba(2,6,14,.55));z-index:80}
.ph-drawer{position:fixed;top:0;right:0;bottom:0;width:min(980px,96vw);z-index:81;overflow:auto;
  background:var(--nv-page,var(--bg,#f6f7f9));box-shadow:var(--nv-shadow2,0 12px 30px rgba(0,0,0,.35));
  padding:18px 20px 28px;animation:phin .18s ease-out}
@keyframes phin{from{transform:translateX(24px);opacity:.4}to{transform:none;opacity:1}}
.ph-dh{display:flex;align-items:flex-start;gap:12px;margin:0 0 14px;position:sticky;top:-18px;z-index:2;
  background:var(--nv-page,var(--bg,#f6f7f9));padding:6px 0 10px}
.ph-dt{flex:1}
.ph-dt h3{margin:0;font-size:19px}
.ph-dt p{margin:2px 0 0}
.ph-close{background:none;border:1px solid var(--nv-line,var(--line,#e5e7eb));border-radius:10px;width:36px;height:36px;
  font-size:20px;line-height:1;cursor:pointer;color:inherit}
.ph-back{background:none;border:1px solid var(--nv-line,var(--line,#e5e7eb));border-radius:10px;padding:7px 12px;
  cursor:pointer;color:inherit;font:inherit;font-size:13px;white-space:nowrap}
.ph-tl{list-style:none;margin:0;padding:0 0 0 6px;border-left:2px solid var(--nv-line,var(--line,#e5e7eb))}
.ph-tl li{position:relative;display:flex;gap:12px;padding:0 0 16px 14px}
.ph-dot{position:absolute;left:-7px;top:5px;width:12px;height:12px;border-radius:50%;
  border:2px solid var(--nv-page,var(--bg,#fff))}
.ph-dot.ok{background:var(--nv-good,#059669)}
.ph-dot.wait{background:var(--nv-warn,#d97706)}
.ph-tld{font-size:12px;opacity:.65;font-weight:600}
.ph-amt{font-weight:800;font-size:15px;color:var(--nv-good,#059669);font-variant-numeric:tabular-nums;margin-top:2px}
body.ph-lock{overflow:hidden}
@media (max-width:640px){
  .ph-drawer{width:100vw;padding:14px 12px 24px}
  .ph-card strong{font-size:18px}
  .ph-t{font-size:12.5px}
  .ph-t th,.ph-t td{padding:8px 9px}
}
.ph-zero td{opacity:.7}
/* ---- payout chart: one fixed colour per prop firm (validated, CVD-safe order) */
.ph-chart{position:relative;margin:0 0 14px;padding:14px 14px 10px;border-radius:12px;
  border:1px solid var(--nv-line,var(--line,#e5e7eb));background:var(--nv-panel,var(--card,#fff));
  --s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;--s6:#008300;--s7:#9085e9;--s8:#e66767;--so:#6b7280}
html[data-theme="novaday"] .ph-chart,html[data-theme="light"] .ph-chart,html[data-theme="warm"] .ph-chart{
  --s1:#2a78d6;--s2:#eb6834;--s3:#1baf7a;--s4:#eda100;--s5:#e87ba4;--s6:#008300;--s7:#4a3aa7;--s8:#e34948;--so:#898781}
.ph-ch-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 6px}
.ph-ch-head h3{margin:0;font-size:14px}
.ph-seg{display:inline-flex;border:1px solid var(--nv-line,var(--line,#e5e7eb));border-radius:9px;overflow:hidden}
.ph-seg button{background:none;border:0;padding:5px 12px;font:inherit;font-size:12.5px;cursor:pointer;color:inherit;opacity:.7}
.ph-seg button.on{opacity:1;font-weight:700;background:var(--nv-chip,rgba(128,128,128,.12))}
.ph-chart svg{display:block;overflow:visible}
.ph-grid{stroke:var(--nv-line2,#e1e0d9);stroke-width:1}
.ph-base{stroke:var(--nv-line,#c3c2b7);stroke-width:1}
.ph-tick{font-size:11px;fill:currentColor;opacity:.55;font-variant-numeric:tabular-nums}
.ph-tot{font-size:11px;font-weight:700;fill:currentColor;opacity:.85;font-variant-numeric:tabular-nums}
.ph-s1{fill:var(--s1)}.ph-s2{fill:var(--s2)}.ph-s3{fill:var(--s3)}.ph-s4{fill:var(--s4)}
.ph-s5{fill:var(--s5)}.ph-s6{fill:var(--s6)}.ph-s7{fill:var(--s7)}.ph-s8{fill:var(--s8)}.ph-so{fill:var(--so)}
.ph-k1{background:var(--s1)}.ph-k2{background:var(--s2)}.ph-k3{background:var(--s3)}.ph-k4{background:var(--s4)}
.ph-k5{background:var(--s5)}.ph-k6{background:var(--s6)}.ph-k7{background:var(--s7)}.ph-k8{background:var(--s8)}.ph-ko{background:var(--so)}
.ph-hit{fill:transparent;cursor:default}
.ph-col{outline:none}
.ph-col.on .ph-hit,.ph-col:focus-visible .ph-hit{fill:var(--nv-hover,rgba(128,128,128,.08))}
.ph-col.on path,.ph-col.on rect.ph-s1,.ph-col.on rect[class*="ph-s"]{filter:brightness(1.08)}
.ph-tip{position:absolute;z-index:5;min-width:170px;padding:9px 11px;border-radius:10px;font-size:12.5px;pointer-events:none;
  background:var(--nv-pop,var(--card,#fff));border:1px solid var(--nv-line,var(--line,#e5e7eb));
  box-shadow:var(--nv-shadow2,0 8px 24px rgba(0,0,0,.18))}
.ph-tip-h{font-weight:700;margin:0 0 6px;opacity:.8}
.ph-tip-r{display:flex;align-items:center;gap:8px;margin:3px 0}
.ph-tip-r strong{font-variant-numeric:tabular-nums;min-width:62px}
.ph-tip-t{border-top:1px solid var(--nv-line,var(--line,#e5e7eb));padding-top:5px;margin-top:6px}
.ph-key{display:inline-block;width:12px;height:3px;border-radius:2px}
.ph-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:8px 2px 0;font-size:12.5px}
.ph-li{display:inline-flex;align-items:center;gap:6px}
.ph-li strong{font-variant-numeric:tabular-nums}
.ph-sw{display:inline-block;width:11px;height:11px;border-radius:3px}
@media (max-width:640px){.ph-ch-head{flex-wrap:wrap}}

/* ---- Admin number privacy ---- */
.numtoggle{display:inline-flex;margin:0 8px 0 0}
.numtoggle .numbtn{font:inherit;font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px;border:1px solid var(--line,rgba(127,127,127,.35));background:var(--card,transparent);color:inherit;cursor:pointer;white-space:nowrap;min-height:34px}
.numtoggle .numbtn:hover{border-color:var(--accent,#10b981)}
html[data-numbers="hidden"] .numtoggle .numbtn{background:var(--accent,#10b981);color:#fff;border-color:transparent}
.numhidden{display:flex;flex-direction:column;gap:4px;align-items:flex-start;justify-content:center;min-height:120px;padding:18px;border:1px dashed var(--line,rgba(127,127,127,.35));border-radius:12px;color:var(--muted,#888)}
.numhidden strong{color:inherit;opacity:.9}
.numhidden-inline{margin:0 0 8px;font-size:12px;color:var(--muted,#888);font-style:italic}
form[data-numlocked] button[disabled],form[data-numlocked] input[disabled]{opacity:.45;cursor:not-allowed}
@media (max-width:640px){.numtoggle .numbtn{padding:6px 10px;font-size:12px}}

/* ---- Breach stage + Daily closing ---- */
.bs-filters,.cl-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:6px 0 12px}
.bs-filters label,.cl-controls label{display:flex;flex-direction:column;gap:4px;font-size:12px;min-width:160px;flex:0 1 220px}
.cl-controls .button,.cl-controls a.button{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:10px;border:1px solid var(--line,rgba(127,127,127,.35));text-decoration:none;color:inherit}
.cl-copy{font-weight:700}
.cl-ok{align-self:center;color:var(--ok,#10b981);font-weight:600;font-size:13px}
.bs-stage{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;border:1px solid rgba(127,127,127,.3)}
.bs-phase_1{background:rgba(59,130,246,.14);color:#3b82f6;border-color:rgba(59,130,246,.35)}
.bs-phase_2{background:rgba(168,85,247,.14);color:#a855f7;border-color:rgba(168,85,247,.35)}
.bs-live_funded{background:rgba(239,68,68,.14);color:#ef4444;border-color:rgba(239,68,68,.35)}
.bs-unknown{opacity:.7}
.cl-stats .stat.pos strong{color:var(--ok,#10b981)} .cl-stats .stat.neg strong{color:var(--bad,#ef4444)}
.cl-t td.pos{color:var(--ok,#10b981);font-weight:600} .cl-t td.neg{color:var(--bad,#ef4444);font-weight:600}
.cl-text{white-space:pre-wrap;word-break:break-word;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;background:rgba(127,127,127,.08);border:1px solid rgba(127,127,127,.2);border-radius:10px;padding:14px;max-height:70vh;overflow:auto;margin:0 0 12px}
@media (max-width:640px){.bs-filters label,.cl-controls label{flex:1 1 100%}.cl-controls .button,.cl-controls button{flex:1 1 auto;justify-content:center}.cl-text{font-size:12px}}

/* ---- Marked breach by ---- */
.bs-detail{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:6px 16px;margin-top:8px;padding-top:8px;border-top:1px solid rgba(127,127,127,.25)}
.bs-detail span{opacity:.75}
.bs-cardline{margin:4px 0 8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bs-by-automatic{font-style:italic;opacity:.85}
.bs-by-unknown{opacity:.6}

/* ---- Available allocations: readable active chip + not-available list ---- */
.al-chips a.al-chip.on,.al-chips a.al-chip.on:visited{color:#fff!important;font-weight:700}
.al-chips a.al-chip.on small{color:rgba(255,255,255,.85)!important;opacity:1}
.al-filters .clearlink{align-self:center}
.al-blocked summary{cursor:pointer;list-style:none}
.al-blocked summary::-webkit-details-marker{display:none}
.al-blocked summary h2{display:inline}
.al-blocked summary::before{content:"▸ ";opacity:.6}
.al-blocked[open] summary::before{content:"▾ "}
.al-blocked .st{display:inline-block;margin:2px 4px 2px 0;padding:2px 8px;border-radius:999px;background:rgba(127,127,127,.12);font-size:12px}

/* ---- Buying country filter + bulk funding ---- */
.ct-filter{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.ct-filter label{display:flex;flex-direction:column;gap:4px;font-size:12px;min-width:200px}
.ct-filter a{align-self:center}
.fb-card summary{cursor:pointer;list-style:none}.fb-card summary::-webkit-details-marker{display:none}
.fb-card summary h2{display:inline}.fb-card summary::before{content:"▸ ";opacity:.6}.fb-card[open] summary::before{content:"▾ "}
.fb-t input[type=number]{width:110px;min-height:34px}
.fb-detail{margin:12px 0}
.fb-foot{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.fb-foot label{display:flex;flex-direction:column;gap:4px;font-size:12px;flex:1 1 200px}
.fb-foot button{min-height:38px}
@media (max-width:640px){.fb-t input[type=number]{width:80px}.ct-filter label{flex:1 1 100%}}

/* ---- Trader countries table ---- */
.ct-all summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px}.ct-all summary::-webkit-details-marker{display:none}
.ct-all summary h2{display:inline;margin:0}.ct-all summary::before{content:"▸";opacity:.6}.ct-all[open] summary::before{content:"▾"}
.ct-t select{min-width:160px;min-height:34px}

/* ---- Verified profitable day history ---- */
.dv-t td.pos{color:var(--ok,#10b981);font-weight:600}.dv-t td.neg{color:var(--bad,#ef4444);font-weight:600}
.dv-t .st{white-space:nowrap}

/* glitch fix 2026-09-29: Team rows - password box and Set on one line, actions on the right */
.memberrow{align-items:center}
.memberrow form.inline{flex-wrap:nowrap;align-items:center;margin-left:auto}
.memberrow form.inline input{width:190px;min-width:0}
.memberrow form.inline button,.memberrow > form button{white-space:nowrap}
/* Backups - Download and Restore side by side */
.bkactions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bkactions form{margin:0}

/* Daily Closing report blocks (ext_closing_report.php) */
.cl-dl{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:10px;font-weight:600;font-size:14px;text-decoration:none;color:#fff;white-space:nowrap}
.cl-dl.pdf{background:#dc2626}.cl-dl.xls{background:#16a34a}
.cl-dl:hover{filter:brightness(1.08);text-decoration:none}
.clr-card .rowline{align-items:center;flex-wrap:wrap;gap:6px 14px}
.clr-mix{display:flex;height:28px;border-radius:8px;overflow:hidden;margin:12px 0 10px;gap:2px}
.clr-mix span{display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:700;min-width:24px}
.clr-legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12.5px;color:var(--muted)}
.clr-legend span{display:inline-flex;align-items:center;gap:6px}
.clr-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.m-red{background:#dc2626}.m-green{background:#16a34a}.m-orange{background:#ea580c}.m-teal{background:#0d9488}.m-amber{background:#ca8a04}.m-violet{background:#7c3aed}
.clr-trendwrap{overflow-x:auto;margin-top:8px}
.clr-trend{width:100%;min-width:520px;height:auto;display:block}
.clr-trend .axis0{stroke:var(--muted);stroke-width:1;opacity:.5}
.clr-trend .today{fill:var(--muted);opacity:.1}
.clr-trend rect.b-pos{fill:#16a34a}.clr-trend rect.b-neg{fill:#dc2626}
.clr-trend text{font-size:12px;fill:var(--muted)}
.clr-trend text.vl{font-weight:700}.clr-trend text.b-post{fill:#16a34a}.clr-trend text.b-negt{fill:#dc2626}
.clr-trend text.cl{font-size:10.5px}

/* Breaches: remove a line from buying (ext_breach_dismiss.php) */
html body button.bd-x,html[data-theme] body button.bd-x{background:transparent!important;border:1px solid #fca5a5!important;color:#dc2626!important;padding:5px 10px;border-radius:8px;font-size:12.5px;font-weight:600;white-space:nowrap;cursor:pointer}
html body button.bd-x:hover,html[data-theme] body button.bd-x:hover{background:#fee2e2!important;border-color:#fca5a5}
.bd-card{display:inline-block;margin-left:8px}
.bd-removed summary{cursor:pointer}
.m-slate{background:#94a3b8}
.clr-live{display:flex;align-items:center;gap:6px;margin:4px 0 10px}
.clr-dot{width:8px;height:8px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.18);display:inline-block}

/* Accounts: no auto-save - Save button beside equity, unsaved rows marked */
.eq-savecell{display:flex;align-items:flex-end}
.eq-savecell .eq-save{width:100%;min-height:38px}
.acct.is-dirty{box-shadow:0 0 0 2px #f59e0b inset,0 0 0 1px #f59e0b}
html body .acct.is-dirty .eq-save{background:#f59e0b!important;border-color:#f59e0b!important;color:#111!important}
.acct.is-dirty .acct-actions::before{content:"Unsaved changes - press Save or Enter";color:#b45309;font-size:12px;font-weight:700;margin-right:8px;align-self:center}

/* period report: headline tiles */
.cl-stats .stat.clp-hero{grid-column:span 2;background:#fffbeb;border-color:#f59e0b}
.cl-stats .stat.clp-hero strong{font-size:1.9rem;color:#111827}
.cl-stats .stat.clp-hero span{color:#92400e;font-weight:700}
.cl-sec h3.clp-sub{margin:18px 0 8px;font-size:1rem}
.cl-t tr.clp-total td{border-top:2px solid #f59e0b;background:#fffbeb}

/* ===================== Almeer 10 - one template, ten colours (1 Oct 2026) =====================
   Every colour has one job across the CRM: em brand/save/profit · ro breach/loss · am account buying ·
   sk Phase 1 · vi Phase 2/Trade Ideas · te Live/Funded · li Fresh Live · in Ledger/revenue · pi Payouts ·
   or waiting/no trade/not saved. Applies to the Almeer 10 Light (novaday) and Dark (nova) schemes. */
html[data-shell="app"][data-theme="novaday"]{
--nv-page:#F4F6F9;--nv-panel:#FFFFFF;--nv-panel2:#F8FAFC;--nv-line:#E3E7EE;--nv-line2:#EEF1F5;
--nv-text:#0F172A;--nv-text2:#334155;--nv-mute:#556070;--nv-side:#0F172A;
--nv-navy:#059669;--nv-navy2:#047857;--nv-link:#047857;--nv-link2:#065F46;
--bg:#F4F6F9;--line:#E3E7EE;--card:#FFFFFF;--accent:#059669;--primary:#059669;
--c-em:#059669;--c-em-bg:#D1FAE5;--c-em-tx:#065F46;--c-ro:#E11D48;--c-ro-bg:#FFE4E6;--c-ro-tx:#9F1239;--c-am:#D97706;--c-am-bg:#FEF3C7;--c-am-tx:#92400E;--c-sk:#0284C7;--c-sk-bg:#E0F2FE;--c-sk-tx:#075985;--c-vi:#7C3AED;--c-vi-bg:#EDE9FE;--c-vi-tx:#5B21B6;--c-te:#0D9488;--c-te-bg:#CCFBF1;--c-te-tx:#115E59;--c-li:#4D7C0F;--c-li-bg:#ECFCCB;--c-li-tx:#3F6212;--c-in:#4F46E5;--c-in-bg:#E0E7FF;--c-in-tx:#3730A3;--c-pi:#DB2777;--c-pi-bg:#FCE7F3;--c-pi-tx:#9D174D;--c-or:#EA580C;--c-or-bg:#FFEDD5;--c-or-tx:#9A3412;--c-sl:#64748B;--c-sl-bg:#F1F5F9;--c-sl-tx:#334155;}
html[data-shell="app"][data-theme="nova"]{
--nv-page:#0A0E15;--nv-panel:#111723;--nv-panel2:#161E2C;--nv-line:#232C3C;--nv-line2:#1A2231;
--nv-text:#E7EBF3;--nv-text2:#C3CCD9;--nv-mute:#9AA5B7;--nv-side:#070A10;--nv-top:#0D121B;
--nv-navy:#059669;--nv-navy2:#047857;--nv-link:#34D399;--nv-link2:#6EE7B7;
--bg:#0A0E15;--line:#232C3C;--card:#111723;--accent:#34D399;--primary:#059669;
--c-em:#34D399;--c-em-bg:#063B2C;--c-em-tx:#A7F3D0;--c-ro:#FB7185;--c-ro-bg:#4C0519;--c-ro-tx:#FECDD3;--c-am:#FBBF24;--c-am-bg:#3F1D04;--c-am-tx:#FDE68A;--c-sk:#38BDF8;--c-sk-bg:#082F49;--c-sk-tx:#BAE6FD;--c-vi:#A78BFA;--c-vi-bg:#2E1065;--c-vi-tx:#DDD6FE;--c-te:#2DD4BF;--c-te-bg:#042F2E;--c-te-tx:#99F6E4;--c-li:#A3E635;--c-li-bg:#1A2E05;--c-li-tx:#D9F99D;--c-in:#818CF8;--c-in-bg:#1E1B4B;--c-in-tx:#C7D2FE;--c-pi:#F472B6;--c-pi-bg:#500724;--c-pi-tx:#FBCFE8;--c-or:#FB923C;--c-or-bg:#431407;--c-or-tx:#FED7AA;--c-sl:#94A3B8;--c-sl-bg:#1E293B;--c-sl-tx:#CBD5E1;}
html[data-shell="app"][data-theme^="nova"] .c-em{--kc:var(--c-em);--kc-bg:var(--c-em-bg);--kc-tx:var(--c-em-tx)}
html[data-shell="app"][data-theme^="nova"] .c-ro{--kc:var(--c-ro);--kc-bg:var(--c-ro-bg);--kc-tx:var(--c-ro-tx)}
html[data-shell="app"][data-theme^="nova"] .c-am{--kc:var(--c-am);--kc-bg:var(--c-am-bg);--kc-tx:var(--c-am-tx)}
html[data-shell="app"][data-theme^="nova"] .c-sk{--kc:var(--c-sk);--kc-bg:var(--c-sk-bg);--kc-tx:var(--c-sk-tx)}
html[data-shell="app"][data-theme^="nova"] .c-vi{--kc:var(--c-vi);--kc-bg:var(--c-vi-bg);--kc-tx:var(--c-vi-tx)}
html[data-shell="app"][data-theme^="nova"] .c-te{--kc:var(--c-te);--kc-bg:var(--c-te-bg);--kc-tx:var(--c-te-tx)}
html[data-shell="app"][data-theme^="nova"] .c-li{--kc:var(--c-li);--kc-bg:var(--c-li-bg);--kc-tx:var(--c-li-tx)}
html[data-shell="app"][data-theme^="nova"] .c-in{--kc:var(--c-in);--kc-bg:var(--c-in-bg);--kc-tx:var(--c-in-tx)}
html[data-shell="app"][data-theme^="nova"] .c-pi{--kc:var(--c-pi);--kc-bg:var(--c-pi-bg);--kc-tx:var(--c-pi-tx)}
html[data-shell="app"][data-theme^="nova"] .c-or{--kc:var(--c-or);--kc-bg:var(--c-or-bg);--kc-tx:var(--c-or-tx)}
html[data-shell="app"][data-theme^="nova"] .c-sl{--kc:var(--c-sl);--kc-bg:var(--c-sl-bg);--kc-tx:var(--c-sl-tx)}

/* type: Plus Jakarta Sans for text, Space Grotesk for numbers and titles */
html[data-shell="app"][data-theme^="nova"] body,html[data-shell="app"][data-theme^="nova"] input,html[data-shell="app"][data-theme^="nova"] select,html[data-shell="app"][data-theme^="nova"] textarea,html[data-shell="app"][data-theme^="nova"] button{font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif}
html[data-shell="app"][data-theme^="nova"] .top h1,html[data-shell="app"][data-theme^="nova"] .card h2,html[data-shell="app"][data-theme^="nova"] .k-value,html[data-shell="app"][data-theme^="nova"] .i-value,html[data-shell="app"][data-theme^="nova"] .stat strong,html[data-shell="app"][data-theme^="nova"] .ph-card strong,html[data-shell="app"][data-theme^="nova"] .sidebar .brand,html[data-shell="app"][data-theme^="nova"] .inkcard h2{font-family:'Space Grotesk','Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:-.01em}
html[data-shell="app"][data-theme^="nova"] .card,html[data-shell="app"][data-theme^="nova"] .tablewrap,html[data-shell="app"][data-theme^="nova"] .kpis .kpi,html[data-shell="app"][data-theme^="nova"] .stat,html[data-shell="app"][data-theme^="nova"] .ph-card,html[data-shell="app"][data-theme^="nova"] .inkcard{border-radius:14px}

/* sidebar: every link carries its module colour */
html[data-shell="app"][data-theme^="nova"] .sidebar nav a{display:flex;align-items:center;gap:10px;border-radius:9px}
.sidebar nav a.mc-em{--mc:#34D399}
.sidebar nav a.mc-ro{--mc:#FB7185}
.sidebar nav a.mc-am{--mc:#FBBF24}
.sidebar nav a.mc-sk{--mc:#38BDF8}
.sidebar nav a.mc-vi{--mc:#A78BFA}
.sidebar nav a.mc-te{--mc:#2DD4BF}
.sidebar nav a.mc-li{--mc:#A3E635}
.sidebar nav a.mc-in{--mc:#818CF8}
.sidebar nav a.mc-pi{--mc:#F472B6}
.sidebar nav a.mc-or{--mc:#FB923C}
.sidebar nav a.mc-sl{--mc:#94A3B8}
.sidebar nav a .nvi{width:24px;height:24px;flex:0 0 24px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--mc,#94A3B8) 22%,transparent)}
.sidebar nav a .nvi::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--mc,#94A3B8)}
html[data-shell="app"][data-theme^="nova"] .sidebar nav a.active,html[data-shell="app"][data-theme^="nova"] .sidebar a.active{background:rgba(255,255,255,.08);border-left-color:var(--mc,#34D399);color:#ffffff}

/* KPI cards and stat tiles take the colour of what they count */
html[data-shell="app"][data-theme^="nova"] .kpis .kpi[class*=" c-"]{border-left-color:var(--kc)}
html[data-shell="app"][data-theme^="nova"] .kpis .kpi[class*=" c-"] .k-dot{background:var(--kc)}
html[data-shell="app"][data-theme^="nova"] .stats .stat[class*=" c-"]{box-shadow:inset 0 3px 0 var(--kc)}
html[data-shell="app"][data-theme^="nova"] .stats .stat[class*=" c-"] span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--kc);margin-right:7px;vertical-align:1px}

/* stages and breach stages */
html[data-shell="app"][data-theme^="nova"] .bs-phase_1{background:var(--c-sk-bg);color:var(--c-sk-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .bs-phase_2{background:var(--c-vi-bg);color:var(--c-vi-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .bs-live_funded{background:var(--c-te-bg);color:var(--c-te-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .st-danger{background:var(--c-ro-bg);color:var(--c-ro-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .st-good{background:var(--c-em-bg);color:var(--c-em-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .st-warn{background:var(--c-or-bg);color:var(--c-or-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .badge.danger{background:var(--c-ro-bg);color:var(--c-ro-tx);border-color:transparent}

/* money colours: in = indigo, out (buying) = amber, payouts = pink */
html[data-shell="app"][data-theme^="nova"] .inkstat .i-value.t{color:var(--c-in)}
html[data-shell="app"][data-theme^="nova"] .inkstat .i-value.w{color:var(--c-am)}
html[data-shell="app"][data-theme="novaday"] .inkstat .i-value.t{color:#A5B4FC}
html[data-shell="app"][data-theme="novaday"] .inkstat .i-value.w{color:#FCD34D}
html[data-shell="app"][data-theme^="nova"] .alert.warning{border-left:4px solid var(--c-or)}
html[data-shell="app"][data-theme^="nova"] .alert.critical{border-left:4px solid var(--c-ro)}
html[data-shell="app"][data-theme^="nova"] .alert.info{border-left:4px solid var(--c-pi)}
html[data-shell="app"][data-theme^="nova"] .acct.is-dirty{box-shadow:0 0 0 2px var(--c-or) inset}
/* Almeer 10: stage badges and stage chips */
html[data-shell="app"][data-theme^="nova"] .badge.stg-p1,html[data-shell="app"][data-theme^="nova"] .badge.stg-phase1{background:var(--c-sk-bg);color:var(--c-sk-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .badge.stg-p2,html[data-shell="app"][data-theme^="nova"] .badge.stg-phase2{background:var(--c-vi-bg);color:var(--c-vi-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .badge.stg-live,html[data-shell="app"][data-theme^="nova"] .badge.stg-livefunded{background:var(--c-te-bg);color:var(--c-te-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .badge.stg-fresh,html[data-shell="app"][data-theme^="nova"] .badge.stg-freshlive{background:var(--c-li-bg);color:var(--c-li-tx);border-color:transparent}
html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=P1"]::before,html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=P2"]::before,html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=LIVE"]::before,html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=breached"]::before,html[data-shell="app"][data-theme^="nova"] .chips a[href*="done=1"]::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:1px}
html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=P1"]::before{background:var(--c-sk)}
html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=P2"]::before{background:var(--c-vi)}
html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=LIVE"]::before{background:var(--c-te)}
html[data-shell="app"][data-theme^="nova"] .chips a[href*="stage=breached"]::before{background:var(--c-ro)}
html[data-shell="app"][data-theme^="nova"] .chips a[href*="done=1"]::before{background:var(--c-em)}
/* Accounts: Done today / Not done today */
.chips .notdonechip{margin-left:0}
html[data-shell="app"][data-theme^="nova"] .chips a.donechip::before,html[data-shell="app"][data-theme^="nova"] .chips a.notdonechip::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:1px}
html[data-shell="app"][data-theme^="nova"] .chips a.donechip::before{background:var(--c-em)}
html[data-shell="app"][data-theme^="nova"] .chips a.notdonechip::before{background:var(--c-or)}
.dt-sum{display:flex;flex-direction:column;gap:8px}
.dt-sum .dt-line{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:baseline;font-size:14px}
.dt-sum .dt-line strong{font-size:20px;font-family:'Space Grotesk',inherit}
.dt-sum .dt-track{height:8px;border-radius:99px;background:var(--c-or-bg,#ffedd5);overflow:hidden}
.dt-sum .dt-track i{display:block;height:100%;border-radius:99px;background:var(--c-em,#059669)}
.dt-sum p{margin:0}
.dt-grp{margin:18px 2px 8px;font-size:15px;display:flex;align-items:baseline;gap:8px}
.dt-grp::before{content:"";width:4px;height:16px;border-radius:2px;background:var(--c-em,#059669);align-self:center}
html[data-shell="app"][data-theme^="nova"] .chips a.losschip::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:1px;background:var(--c-ro)}
.dt-sum .dt-track{display:flex}
.dt-sum .dt-track b{display:block;height:100%;background:var(--c-ro,#e11d48);margin-left:auto}
.dt-phases{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.dt-phases .dt-ph{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;font-size:13px;font-weight:600;text-decoration:none;border:1px solid var(--nv-line,#e3e7ee);color:var(--nv-text,#0f172a);background:var(--nv-panel,#fff)}
.dt-phases .dt-ph::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--kc,#64748b)}
.dt-phases .dt-ph b{opacity:.75}
.dt-phases .dt-ph.on{background:var(--kc-bg,#e2e8f0);color:var(--kc-tx,#0f172a);border-color:var(--kc,#64748b)}
/* Lifetime: expenses next to payouts */
.ph-t td.ph-pos strong{color:var(--c-em,#059669)}
.ph-t td.ph-neg strong{color:var(--c-ro,#e11d48)}
.ph-t tr.ph-total td{border-top:2px solid var(--nv-line,#e3e7ee);background:var(--nv-panel2,#f8fafc)}
/* ================= Sidebar: flowing water (2 Oct 2026) =================
   One element, five painted layers that all drift at their own speed:
   two waves along the bottom, two sets of light ripples, and a deep-sea
   gradient that slowly rolls. Every layer moves by exactly one tile, so the
   loop never jumps. Calm for anyone who asked their device for less motion. */
@keyframes aqFlow{
  0%{background-position:0 100%,0 100%,0 0,0 0,0 0}
  100%{background-position:-900px 100%,1300px 100%,260px 520px,-380px 760px,0 1800px}
}
html[data-shell="app"] .sidebar{
  background-color:#062a4a!important;
  background-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20900%20110%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2055%20C%20150%2095%20300%2015%20450%2055%20C%20600%2095%20750%2015%20900%2055%20L900%20110%20L0%20110%20Z%22%20fill%3D%22rgba(255%2C255%2C255%2C0.10)%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201300%20150%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2070%20C%20216%2020%20433%20120%20650%2070%20C%20866%2020%201083%20120%201300%2070%20L1300%20150%20L0%20150%20Z%22%20fill%3D%22rgba(165%2C243%2C252%2C0.10)%22%2F%3E%3C%2Fsvg%3E"),
    radial-gradient(circle at 30% 40%,rgba(165,243,252,.16) 0 9%,transparent 22%),
    radial-gradient(ellipse at 70% 60%,rgba(94,234,212,.12) 0 10%,transparent 26%),
    linear-gradient(180deg,#062a4a 0%,#0b4f7a 18%,#0e7490 36%,#0f766e 52%,#0e7490 68%,#0b4f7a 84%,#062a4a 100%)!important;
  background-size:900px 110px,1300px 150px,260px 260px,380px 380px,100% 1800px!important;
  background-repeat:repeat-x,repeat-x,repeat,repeat,repeat-y!important;
  background-position:0 100%,0 100%,0 0,0 0,0 0;
  animation:aqFlow 26s linear infinite;
  border-right:1px solid rgba(255,255,255,.08)!important;
  color:#e0f2fe!important;
}
html[data-shell="app"] .sidebar .brand{color:#ffffff!important;text-shadow:0 1px 8px rgba(0,0,0,.25)}
html[data-shell="app"] .sidebar .brand em{color:#5eead4!important}
html[data-shell="app"] .sidebar .navgroup-title{color:rgba(186,230,253,.72)!important}
html[data-shell="app"] .sidebar nav a,html[data-shell="app"] .sidebar a{color:rgba(240,249,255,.9)!important;background:transparent;border-left-color:transparent!important}
html[data-shell="app"] .sidebar nav a:hover,html[data-shell="app"] .sidebar a:hover{background:rgba(255,255,255,.12)!important;color:#ffffff!important}
html[data-shell="app"] .sidebar nav a.active,html[data-shell="app"] .sidebar a.active{background:rgba(255,255,255,.2)!important;color:#ffffff!important;font-weight:700;
  box-shadow:inset 3px 0 0 var(--mc,#5eead4),0 6px 18px rgba(2,32,56,.25)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
html[data-shell="app"] .sidebar nav a .nvi{background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.18)}
html[data-shell="app"] .sidebar .linkish{color:#e0f2fe!important}
html[data-shell="app"] .sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25)}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .sidebar{animation:none}}
/* ================= Home KPI cards: alive, one colour each (2 Oct 2026) =================
   Each card is its own colour (the module's colour), its gradient slowly drifts,
   a light sweep passes over it now and then, its icon floats, and the number
   counts up when the page opens (ext_dashboard.php). Less motion when asked. */
@keyframes kpiIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes kpiGrad{0%{background-position:0% 30%}100%{background-position:100% 70%}}
@keyframes kpiShine{0%,72%{transform:translateX(-140%) skewX(-18deg)}100%{transform:translateX(260%) skewX(-18deg)}}
@keyframes kpiFloat{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-7px) rotate(3deg)}}
@keyframes kpiPulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.7)}70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
html[data-shell="app"] .kpis{gap:14px}
html[data-shell="app"] .kpis a.kpi{position:relative;overflow:hidden;isolation:isolate;border:0!important;border-radius:18px!important;padding:16px 18px 18px!important;min-height:132px;
  color:#ffffff!important;background-size:220% 220%!important;box-shadow:0 10px 24px -12px var(--kg2,rgba(0,0,0,.4))!important;
  animation:kpiIn .6s cubic-bezier(.2,.8,.2,1) both,kpiGrad 9s ease-in-out infinite alternate;
  transition:transform .25s ease,box-shadow .25s ease;text-decoration:none}
html[data-shell="app"] .kpis a.kpi:nth-child(2){animation-delay:.07s,0s}html[data-shell="app"] .kpis a.kpi:nth-child(3){animation-delay:.14s,0s}html[data-shell="app"] .kpis a.kpi:nth-child(4){animation-delay:.21s,0s}html[data-shell="app"] .kpis a.kpi:nth-child(5){animation-delay:.28s,0s}html[data-shell="app"] .kpis a.kpi:nth-child(6){animation-delay:.35s,0s}
html[data-shell="app"] .kpis a.kpi:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 18px 34px -14px var(--kg2,rgba(0,0,0,.5))!important}
html[data-shell="app"] .kpis a.kpi::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:38%;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);animation:kpiShine 6.5s ease-in-out infinite}
html[data-shell="app"] .kpis a.kpi:nth-child(2)::before{animation-delay:1s}html[data-shell="app"] .kpis a.kpi:nth-child(3)::before{animation-delay:2s}html[data-shell="app"] .kpis a.kpi:nth-child(4)::before{animation-delay:3s}html[data-shell="app"] .kpis a.kpi:nth-child(5)::before{animation-delay:4s}html[data-shell="app"] .kpis a.kpi:nth-child(6)::before{animation-delay:5s}
html[data-shell="app"] .kpis a.kpi::after{content:"";position:absolute;right:-6px;bottom:-8px;width:78px;height:78px;z-index:-1;pointer-events:none;opacity:.22;
  background:var(--ki) center/contain no-repeat;animation:kpiFloat 6s ease-in-out infinite}
html[data-shell="app"] .kpis a.kpi .k-label{color:rgba(255,255,255,.92)!important;font-weight:700!important;letter-spacing:.02em;display:flex;align-items:center;gap:8px}
html[data-shell="app"] .kpis a.kpi .k-dot{background:#ffffff!important;width:8px;height:8px;border-radius:50%;animation:kpiPulse 2.4s ease-out infinite}
html[data-shell="app"] .kpis a.kpi .k-value,html[data-shell="app"] .kpis a.kpi .k-value.v-good,html[data-shell="app"] .kpis a.kpi .k-value.v-bad,html[data-shell="app"] .kpis a.kpi .k-value.v-warn,html[data-shell="app"] .kpis a.kpi .k-value.v-danger{color:#ffffff!important;font-size:34px!important;line-height:1.1;margin:10px 0 6px;text-shadow:0 2px 12px rgba(0,0,0,.18);font-variant-numeric:tabular-nums}
html[data-shell="app"] .kpis a.kpi .k-sub{color:rgba(255,255,255,.85)!important;font-size:12.5px}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .kpis a.kpi,html[data-shell="app"] .kpis a.kpi::before,html[data-shell="app"] .kpis a.kpi::after,html[data-shell="app"] .kpis a.kpi .k-dot{animation:none!important}}
html[data-shell="app"] .kpis a.kpi.c-sk{background-image:linear-gradient(135deg,#075985 0%,#0284C7 48%,#38BDF8 100%)!important;--kg2:#0284C7;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223.5%22%2F%3E%3Cpath%20d%3D%22M2.5%2020c.8-3.6%203.4-5.5%206.5-5.5s5.7%201.9%206.5%205.5%22%2F%3E%3Cpath%20d%3D%22M16%204.5a3.5%203.5%200%20010%207%22%2F%3E%3Cpath%20d%3D%22M18%2014.7c2%20.7%203.2%202.4%203.6%205.3%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .kpis a.kpi.c-te{background-image:linear-gradient(135deg,#115E59 0%,#0D9488 48%,#2DD4BF 100%)!important;--kg2:#0D9488;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2017l6-6%204%204%208-8%22%2F%3E%3Cpath%20d%3D%22M15%207h6v6%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .kpis a.kpi.c-or{background-image:linear-gradient(135deg,#9A3412 0%,#EA580C 48%,#FB923C 100%)!important;--kg2:#EA580C;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2011a8%208%200%2000-14.3-4.9L4%208%22%2F%3E%3Cpath%20d%3D%22M4%203v5h5%22%2F%3E%3Cpath%20d%3D%22M4%2013a8%208%200%200014.3%204.9L20%2016%22%2F%3E%3Cpath%20d%3D%22M20%2021v-5h-5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .kpis a.kpi.c-ro{background-image:linear-gradient(135deg,#881337 0%,#E11D48 48%,#FB7185 100%)!important;--kg2:#E11D48;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l9.5%2017h-19z%22%2F%3E%3Cpath%20d%3D%22M12%2010v4%22%2F%3E%3Cpath%20d%3D%22M12%2017.5v.5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .kpis a.kpi.c-pi{background-image:linear-gradient(135deg,#831843 0%,#DB2777 48%,#F472B6 100%)!important;--kg2:#DB2777;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222.5%22%20y%3D%226%22%20width%3D%2219%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.6%22%2F%3E%3Cpath%20d%3D%22M6%209.5v5M18%209.5v5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .kpis a.kpi.c-in{background-image:linear-gradient(135deg,#312E81 0%,#4F46E5 48%,#818CF8 100%)!important;--kg2:#4F46E5;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2010l9-6%209%206%22%2F%3E%3Cpath%20d%3D%22M5%2010v8M9.5%2010v8M14.5%2010v8M19%2010v8%22%2F%3E%3Cpath%20d%3D%22M3%2020h18%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .kpis a.kpi.c-em{background-image:linear-gradient(135deg,#065F46 0%,#059669 48%,#34D399 100%)!important;--kg2:#059669;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2012.5l4.5%204.5L19%207.5%22%2F%3E%3C%2Fsvg%3E")}
/* ===== Home: no red / orange / pink on the cards (2 Oct 2026) - new colours for three top cards ===== */
html[data-shell="app"] .kpis a.kpi.c-or{background-image:linear-gradient(135deg,#713F12 0%,#CA8A04 48%,#FACC15 100%)!important;--kg2:#CA8A04;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2011a8%208%200%2000-14.3-4.9L4%208%22%2F%3E%3Cpath%20d%3D%22M4%203v5h5%22%2F%3E%3Cpath%20d%3D%22M4%2013a8%208%200%200014.3%204.9L20%2016%22%2F%3E%3Cpath%20d%3D%22M20%2021v-5h-5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .kpis a.kpi.c-ro{background-image:linear-gradient(135deg,#0F172A 0%,#334155 48%,#64748B 100%)!important;--kg2:#334155}
html[data-shell="app"] .kpis a.kpi.c-pi{background-image:linear-gradient(135deg,#064E3B 0%,#059669 48%,#34D399 100%)!important;--kg2:#059669;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2012.5l4.5%204.5L19%207.5%22%2F%3E%3C%2Fsvg%3E")}

/* ===== Home: the four money cards under the alerts, alive like the KPI row ===== */
html[data-shell="app"] .stats.money4{gap:14px}
html[data-shell="app"] .stats.money4 > .stat{position:relative;overflow:hidden;isolation:isolate;border:0!important;border-radius:18px!important;padding:16px 18px 18px!important;min-height:112px;
  display:flex;flex-direction:column;justify-content:center;gap:8px;color:#ffffff!important;background-size:220% 220%!important;
  box-shadow:0 10px 24px -12px var(--kg2,rgba(0,0,0,.4))!important;text-decoration:none;
  animation:kpiIn .6s cubic-bezier(.2,.8,.2,1) both,kpiGrad 9s ease-in-out infinite alternate;transition:transform .25s ease,box-shadow .25s ease}
html[data-shell="app"] .stats.money4 > .stat:nth-child(2){animation-delay:.07s,0s}html[data-shell="app"] .stats.money4 > .stat:nth-child(3){animation-delay:.14s,0s}html[data-shell="app"] .stats.money4 > .stat:nth-child(4){animation-delay:.21s,0s}
html[data-shell="app"] .stats.money4 > .stat:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 18px 34px -14px var(--kg2,rgba(0,0,0,.5))!important}
html[data-shell="app"] .stats.money4 > .stat::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:38%;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);animation:kpiShine 6.5s ease-in-out infinite}
html[data-shell="app"] .stats.money4 > .stat:nth-child(2)::before{animation-delay:1.5s}html[data-shell="app"] .stats.money4 > .stat:nth-child(3)::before{animation-delay:3s}html[data-shell="app"] .stats.money4 > .stat:nth-child(4)::before{animation-delay:4.5s}
html[data-shell="app"] .stats.money4 > .stat::after{content:"";position:absolute;right:-4px;bottom:-8px;width:72px;height:72px;z-index:-1;pointer-events:none;opacity:.22;
  background:var(--ki) center/contain no-repeat;animation:kpiFloat 6s ease-in-out infinite}
html[data-shell="app"] .stats.money4 > .stat span{color:rgba(255,255,255,.92)!important;font-weight:700!important;font-size:13px;display:flex;align-items:center;gap:8px}
html[data-shell="app"] .stats.money4 > .stat span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#ffffff!important;margin:0!important;animation:kpiPulse 2.4s ease-out infinite}
html[data-shell="app"] .stats.money4 > .stat strong,html[data-shell="app"] .stats.money4 > .stat strong.neg,html[data-shell="app"] .stats.money4 > .stat strong.money{color:#ffffff!important;font-size:30px!important;line-height:1.1;text-shadow:0 2px 12px rgba(0,0,0,.18);font-variant-numeric:tabular-nums}
html[data-shell="app"] .stats.money4 > .stat.c-am{background-image:linear-gradient(135deg,#3B0764 0%,#7C3AED 48%,#C084FC 100%)!important;--kg2:#7C3AED;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2220%22%20r%3D%221.4%22%2F%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2220%22%20r%3D%221.4%22%2F%3E%3Cpath%20d%3D%22M2%203h3l2.6%2012.2a1%201%200%20001%20.8h9.7a1%201%200%20001-.8L21%207H6%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .stats.money4 > .stat.c-pi{background-image:linear-gradient(135deg,#164E63 0%,#0891B2 48%,#67E8F9 100%)!important;--kg2:#0891B2;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222.5%22%20y%3D%226%22%20width%3D%2219%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.6%22%2F%3E%3Cpath%20d%3D%22M6%209.5v5M18%209.5v5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .stats.money4 > .stat.c-in{background-image:linear-gradient(135deg,#1E3A8A 0%,#2563EB 48%,#93C5FD 100%)!important;--kg2:#2563EB;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2010l9-6%209%206%22%2F%3E%3Cpath%20d%3D%22M5%2010v8M9.5%2010v8M14.5%2010v8M19%2010v8%22%2F%3E%3Cpath%20d%3D%22M3%2020h18%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] .stats.money4 > .stat.c-em{background-image:linear-gradient(135deg,#14532D 0%,#16A34A 48%,#86EFAC 100%)!important;--kg2:#16A34A;--ki:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2017l6-6%204%204%208-8%22%2F%3E%3Cpath%20d%3D%22M15%207h6v6%22%2F%3E%3C%2Fsvg%3E")}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .stats.money4 > .stat,html[data-shell="app"] .stats.money4 > .stat::before,html[data-shell="app"] .stats.money4 > .stat::after,html[data-shell="app"] .stats.money4 > .stat span::before{animation:none!important}}
/* ===== Home: "Needs attention" sits on the same flowing water as the sidebar (2 Oct 2026) ===== */
html[data-shell="app"] .card.attn{position:relative;overflow:hidden;border:0!important;border-radius:18px!important;color:#f0f9ff!important;
  background-color:#062a4a!important;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20900%20110%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2055%20C%20150%2095%20300%2015%20450%2055%20C%20600%2095%20750%2015%20900%2055%20L900%20110%20L0%20110%20Z%22%20fill%3D%22rgba(255%2C255%2C255%2C0.10)%22%2F%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201300%20150%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2070%20C%20216%2020%20433%20120%20650%2070%20C%20866%2020%201083%20120%201300%2070%20L1300%20150%20L0%20150%20Z%22%20fill%3D%22rgba(165%2C243%2C252%2C0.10)%22%2F%3E%3C%2Fsvg%3E"),
    radial-gradient(circle at 30% 40%,rgba(165,243,252,.16) 0 9%,transparent 22%),
    radial-gradient(ellipse at 70% 60%,rgba(94,234,212,.12) 0 10%,transparent 26%),
    linear-gradient(180deg,#062a4a 0%,#0b4f7a 18%,#0e7490 36%,#0f766e 52%,#0e7490 68%,#0b4f7a 84%,#062a4a 100%)!important;
  background-size:900px 110px,1300px 150px,260px 260px,380px 380px,100% 1800px!important;
  background-repeat:repeat-x,repeat-x,repeat,repeat,repeat-y!important;
  background-position:0 100%,0 100%,0 0,0 0,0 0;animation:aqFlow 26s linear infinite;
  box-shadow:0 14px 30px -16px rgba(6,42,74,.6)!important}
html[data-shell="app"] .card.attn h2{color:#ffffff!important}
html[data-shell="app"] .card.attn .badge{background:rgba(255,255,255,.18)!important;color:#ffffff!important;border:1px solid rgba(255,255,255,.25)!important}
html[data-shell="app"] .card.attn .tablewrap{background:transparent!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important;border-radius:12px}
html[data-shell="app"] .card.attn table,html[data-shell="app"] .card.attn .dtable{background:transparent!important;color:#f0f9ff!important}
html[data-shell="app"] .card.attn th,html[data-shell="app"] .card.attn .dtable th{background:rgba(255,255,255,.10)!important;color:#cffafe!important;border-bottom:1px solid rgba(255,255,255,.16)!important}
html[data-shell="app"] .card.attn td,html[data-shell="app"] .card.attn .dtable td{background:transparent!important;color:#f0f9ff!important;border-bottom:1px solid rgba(255,255,255,.10)!important}
html[data-shell="app"] .card.attn tbody tr:hover td{background:rgba(255,255,255,.07)!important}
html[data-shell="app"] .card.attn a{color:#a5f3fc!important;font-weight:700}
html[data-shell="app"] .card.attn .muted,html[data-shell="app"] .card.attn .small{color:rgba(224,242,254,.8)!important}
html[data-shell="app"] .card.attn .st{border:1px solid rgba(255,255,255,.22)!important}
html[data-shell="app"] .card.attn .st-danger{background:rgba(253,164,175,.22)!important;color:#ffe4e6!important}
html[data-shell="app"] .card.attn .st-warn{background:rgba(250,204,21,.22)!important;color:#fef9c3!important}
html[data-shell="app"] .card.attn .st-info{background:rgba(125,211,252,.22)!important;color:#e0f2fe!important}
html[data-shell="app"] .card.attn .st-good{background:rgba(110,231,183,.24)!important;color:#d1fae5!important}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .card.attn{animation:none}}

/* ===== Home: Live / Funded and Accounts tiles, alive like the cards above ===== */
html[data-shell="app"] .stats > .stat[class*=" g-"]{position:relative;overflow:hidden;isolation:isolate;border:0!important;border-radius:16px!important;padding:14px 16px 16px!important;min-height:96px;
  display:flex;flex-direction:column;justify-content:center;gap:6px;color:#ffffff!important;background-size:220% 220%!important;
  box-shadow:0 10px 22px -14px var(--kg2,rgba(0,0,0,.4))!important;text-decoration:none;
  animation:kpiIn .6s cubic-bezier(.2,.8,.2,1) both,kpiGrad 9s ease-in-out infinite alternate;transition:transform .25s ease,box-shadow .25s ease}
html[data-shell="app"] .stats > .stat[class*=" g-"]:nth-child(2){animation-delay:.06s,0s}html[data-shell="app"] .stats > .stat[class*=" g-"]:nth-child(3){animation-delay:.12s,0s}html[data-shell="app"] .stats > .stat[class*=" g-"]:nth-child(4){animation-delay:.18s,0s}
html[data-shell="app"] .stats > .stat[class*=" g-"]:hover{transform:translateY(-3px) scale(1.015);box-shadow:0 16px 30px -14px var(--kg2,rgba(0,0,0,.5))!important}
html[data-shell="app"] .stats > .stat[class*=" g-"]::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:38%;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);animation:kpiShine 7s ease-in-out infinite}
html[data-shell="app"] .stats > .stat[class*=" g-"]:nth-child(2)::before{animation-delay:1.7s}html[data-shell="app"] .stats > .stat[class*=" g-"]:nth-child(3)::before{animation-delay:3.4s}html[data-shell="app"] .stats > .stat[class*=" g-"]:nth-child(4)::before{animation-delay:5.1s}
html[data-shell="app"] .stats > .stat[class*=" g-"] span{color:rgba(255,255,255,.92)!important;font-weight:700!important;font-size:13px;display:flex;align-items:center;gap:8px}
html[data-shell="app"] .stats > .stat[class*=" g-"] span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#ffffff!important;margin:0!important;animation:kpiPulse 2.4s ease-out infinite}
html[data-shell="app"] .stats > .stat[class*=" g-"] strong,html[data-shell="app"] .stats > .stat[class*=" g-"] strong.neg,html[data-shell="app"] .stats > .stat[class*=" g-"] strong.money{color:#ffffff!important;font-size:28px!important;line-height:1.1;text-shadow:0 2px 12px rgba(0,0,0,.18);font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .stats > .stat[class*=" g-"],html[data-shell="app"] .stats > .stat[class*=" g-"]::before,html[data-shell="app"] .stats > .stat[class*=" g-"] span::before{animation:none!important}}
html[data-shell="app"] .stats > .stat.g-teal{background-image:linear-gradient(135deg,#115E59 0%,#0D9488 48%,#2DD4BF 100%)!important;--kg2:#0D9488}
html[data-shell="app"] .stats > .stat.g-gold{background-image:linear-gradient(135deg,#713F12 0%,#CA8A04 48%,#FACC15 100%)!important;--kg2:#CA8A04}
html[data-shell="app"] .stats > .stat.g-emerald{background-image:linear-gradient(135deg,#064E3B 0%,#059669 48%,#34D399 100%)!important;--kg2:#059669}
html[data-shell="app"] .stats > .stat.g-blue{background-image:linear-gradient(135deg,#1E3A8A 0%,#2563EB 48%,#93C5FD 100%)!important;--kg2:#2563EB}
html[data-shell="app"] .stats > .stat.g-violet{background-image:linear-gradient(135deg,#3B0764 0%,#7C3AED 48%,#C084FC 100%)!important;--kg2:#7C3AED}
html[data-shell="app"] .stats > .stat.g-indigo{background-image:linear-gradient(135deg,#312E81 0%,#4F46E5 48%,#818CF8 100%)!important;--kg2:#4F46E5}
html[data-shell="app"] .stats > .stat.g-sky{background-image:linear-gradient(135deg,#075985 0%,#0284C7 48%,#38BDF8 100%)!important;--kg2:#0284C7}
html[data-shell="app"] .stats > .stat.g-cyan{background-image:linear-gradient(135deg,#164E63 0%,#0891B2 48%,#67E8F9 100%)!important;--kg2:#0891B2}
html[data-shell="app"] .stats > .stat.g-slate{background-image:linear-gradient(135deg,#0F172A 0%,#334155 48%,#64748B 100%)!important;--kg2:#334155}
/* Home tiles: breathing room between rows */
html[data-shell="app"] main .stats{gap:14px}
html[data-shell="app"] main .stats + .stats{margin-top:14px}
/* ===== Home alerts (Warning, Waiting to replace, Payout ready, Funding required, Critical): alive cards (2 Oct 2026) ===== */
@keyframes alIcon{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes alRing{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}80%{box-shadow:0 0 0 12px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
html[data-shell="app"] main .alert[class*=" a-"]{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:46px minmax(0,1fr);column-gap:14px;row-gap:2px;align-items:center;
  border:0!important;border-radius:16px!important;padding:14px 18px!important;margin:12px 0!important;color:#ffffff!important;
  background-size:220% 220%!important;box-shadow:0 12px 26px -16px var(--kg2,rgba(0,0,0,.45))!important;
  animation:kpiIn .55s cubic-bezier(.2,.8,.2,1) both,kpiGrad 10s ease-in-out infinite alternate;transition:transform .25s ease,box-shadow .25s ease}
html[data-shell="app"] main .alert[class*=" a-"]:hover{transform:translateY(-2px);box-shadow:0 18px 32px -16px var(--kg2,rgba(0,0,0,.5))!important}
html[data-shell="app"] main .alert[class*=" a-"]::before{content:"";grid-row:1 / span 2;grid-column:1;width:46px;height:46px;border-radius:14px;align-self:center;
  background:rgba(255,255,255,.18) var(--ai) center/24px 24px no-repeat;border:1px solid rgba(255,255,255,.28);
  animation:alIcon 3s ease-in-out infinite,alRing 2.6s ease-out infinite}
html[data-shell="app"] main .alert[class*=" a-"]::after{content:"";position:absolute;top:-30%;bottom:-30%;left:0;width:30%;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);animation:kpiShine 7.5s ease-in-out infinite}
html[data-shell="app"] main .alert[class*=" a-"] > strong{grid-column:2;color:#ffffff!important;font-size:13px;letter-spacing:.12em;font-weight:800}
html[data-shell="app"] main .alert[class*=" a-"] > .small,html[data-shell="app"] main .alert[class*=" a-"] > div{grid-column:2;color:rgba(255,255,255,.95)!important;font-size:14.5px!important;font-weight:500}
html[data-shell="app"] main .alert[class*=" a-"] a{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:3px 12px;border-radius:999px;background:rgba(255,255,255,.95)!important;
  color:var(--kg2,#0f172a)!important;font-weight:800;font-size:12.5px;text-decoration:none!important;box-shadow:0 4px 12px -6px rgba(0,0,0,.35);transition:transform .2s ease}
html[data-shell="app"] main .alert[class*=" a-"] a::after{content:"\2192"}
html[data-shell="app"] main .alert[class*=" a-"] a:hover{transform:translateX(3px)}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .alert[class*=" a-"],html[data-shell="app"] main .alert[class*=" a-"]::before,html[data-shell="app"] main .alert[class*=" a-"]::after{animation:none!important}}
html[data-shell="app"] main .alert.a-breach{background-image:linear-gradient(120deg,#713F12 0%,#CA8A04 50%,#FACC15 100%)!important;--kg2:#CA8A04;--ai:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l9.5%2017h-19z%22%2F%3E%3Cpath%20d%3D%22M12%2010v4%22%2F%3E%3Cpath%20d%3D%22M12%2017.5v.5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] main .alert.a-critical{background-image:linear-gradient(120deg,#0F172A 0%,#1E293B 50%,#475569 100%)!important;--kg2:#1E293B;--ai:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%207v6%22%2F%3E%3Cpath%20d%3D%22M12%2016.5v.5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] main .alert.a-payout{background-image:linear-gradient(120deg,#064E3B 0%,#059669 50%,#34D399 100%)!important;--kg2:#059669;--ai:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222.5%22%20y%3D%226%22%20width%3D%2219%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222.6%22%2F%3E%3Cpath%20d%3D%22M6%209.5v5M18%209.5v5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] main .alert.a-replace{background-image:linear-gradient(120deg,#3B0764 0%,#7C3AED 50%,#C084FC 100%)!important;--kg2:#7C3AED;--ai:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2011a8%208%200%2000-14.3-4.9L4%208%22%2F%3E%3Cpath%20d%3D%22M4%203v5h5%22%2F%3E%3Cpath%20d%3D%22M4%2013a8%208%200%200014.3%204.9L20%2016%22%2F%3E%3Cpath%20d%3D%22M20%2021v-5h-5%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] main .alert.a-funding{background-image:linear-gradient(120deg,#164E63 0%,#0891B2 50%,#67E8F9 100%)!important;--kg2:#0891B2;--ai:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%203L10%2014%22%2F%3E%3Cpath%20d%3D%22M21%203l-6.5%2018-4.5-7-7-4.5z%22%2F%3E%3C%2Fsvg%3E")}
html[data-shell="app"] main .alert.a-critical{box-shadow:0 0 0 2px #FACC15,0 12px 26px -16px rgba(0,0,0,.6)!important}
html[data-shell="app"] main .alert.a-critical a{color:#0f172a!important}
/* ===== Home: Desk position, alive (2 Oct 2026) =====
   Deep night-sky panel with slow aurora lights behind glass tiles. Each tile
   has its own colour (revenue blue, expenses violet, earning green, pending
   cyan, trend teal), numbers count up, the trend line draws itself. */
@keyframes inkAurora{0%{transform:translate(0,0) rotate(0deg) scale(1)}50%{transform:translate(-6%,4%) rotate(8deg) scale(1.08)}100%{transform:translate(4%,-3%) rotate(-6deg) scale(1)}}
@keyframes inkDraw{to{stroke-dashoffset:0}}
@keyframes inkDot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.8);opacity:.6}}
@keyframes inkLive{0%{box-shadow:0 0 0 0 rgba(52,211,153,.7)}70%{box-shadow:0 0 0 7px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
html[data-shell="app"] main .inkcard{position:relative;overflow:hidden;isolation:isolate;border:0!important;border-radius:20px!important;padding:20px 22px 22px!important;
  background:linear-gradient(135deg,#0B1023 0%,#1E1B4B 45%,#0C4A6E 100%)!important;color:#e0e7ff!important;
  box-shadow:0 18px 40px -22px rgba(30,27,75,.8)!important;animation:kpiIn .6s cubic-bezier(.2,.8,.2,1) both}
html[data-shell="app"] main .inkcard::before{content:"";position:absolute;inset:-40%;z-index:-1;pointer-events:none;filter:blur(30px);opacity:.75;
  background:radial-gradient(closest-side at 22% 35%,rgba(124,58,237,.55),transparent 70%),
    radial-gradient(closest-side at 70% 30%,rgba(6,182,212,.45),transparent 70%),
    radial-gradient(closest-side at 55% 80%,rgba(16,185,129,.40),transparent 70%),
    radial-gradient(closest-side at 88% 75%,rgba(59,130,246,.40),transparent 70%);
  animation:inkAurora 18s ease-in-out infinite alternate}
html[data-shell="app"] main .inkcard h2{color:#ffffff!important;display:flex;align-items:center;gap:10px;font-size:19px!important}
html[data-shell="app"] main .inkcard h2::after{content:"LIVE";font:800 10px/1 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:.14em;color:#d1fae5;
  padding:4px 8px 4px 18px;border-radius:999px;background:rgba(16,185,129,.18) radial-gradient(circle at 9px 50%,#34D399 0 3.5px,transparent 4px);
  border:1px solid rgba(52,211,153,.35);animation:inkLive 2.2s ease-out infinite}
html[data-shell="app"] main .inkcard .ink-sub{color:rgba(199,210,254,.85)!important;margin-bottom:6px}
html[data-shell="app"] main .inkcard .inkgrid{gap:14px!important;margin-top:14px}
html[data-shell="app"] main .inkcard .inkstat{position:relative;overflow:hidden;border-radius:14px;padding:14px 16px 14px!important;
  background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.13);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  animation:kpiIn .6s cubic-bezier(.2,.8,.2,1) both;transition:transform .25s ease,background .25s ease}
html[data-shell="app"] main .inkcard .inkstat:hover{transform:translateY(-3px);background:rgba(255,255,255,.11)!important}
html[data-shell="app"] main .inkcard .inkstat::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--ia),var(--ib));opacity:.95}
html[data-shell="app"] main .inkcard .inkstat::after{content:"";position:absolute;top:-30%;bottom:-30%;left:0;width:35%;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent);animation:kpiShine 8s ease-in-out infinite}
html[data-shell="app"] main .inkcard .inkstat .i-label{color:rgba(224,231,255,.82)!important;font-weight:800!important;letter-spacing:.08em;font-size:11.5px;display:flex;align-items:center;gap:7px}
html[data-shell="app"] main .inkcard .inkstat .i-label::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ib);box-shadow:0 0 10px var(--ia)}
html[data-shell="app"] main .inkcard .inkstat .i-value,html[data-shell="app"] main .inkcard .inkstat .i-value.t,html[data-shell="app"] main .inkcard .inkstat .i-value.w{color:var(--ib)!important;font-size:28px!important;margin:8px 0 4px;text-shadow:0 0 18px color-mix(in srgb,var(--ia) 45%,transparent);font-variant-numeric:tabular-nums}
html[data-shell="app"] main .inkcard .inkstat .i-note{color:rgba(199,210,254,.75)!important}
html[data-shell="app"] main .inkcard .inkstat .i-note a{color:#a5f3fc!important;font-weight:700}
html[data-shell="app"] main .inkcard .spark polyline{stroke:#5EEAD4!important;stroke-width:2.6!important;stroke-dasharray:900;stroke-dashoffset:900;filter:drop-shadow(0 0 6px rgba(94,234,212,.75));animation:inkDraw 1.8s .3s ease-out forwards}
html[data-shell="app"] main .inkcard .spark circle{fill:#FACC15!important;transform-box:fill-box;transform-origin:center;animation:inkDot 1.8s ease-in-out infinite}
html[data-shell="app"] main .inkcard .spark line{stroke:rgba(199,210,254,.35)!important}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .inkcard,html[data-shell="app"] main .inkcard::before,html[data-shell="app"] main .inkcard .inkstat,html[data-shell="app"] main .inkcard .inkstat::after,html[data-shell="app"] main .inkcard h2::after,html[data-shell="app"] main .inkcard .spark circle{animation:none!important}html[data-shell="app"] main .inkcard .spark polyline{animation:none!important;stroke-dashoffset:0}}
html[data-shell="app"] main .inkcard .inkstat:nth-child(1){--ia:#60A5FA;--ib:#93C5FD;animation-delay:0.08s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(1)::after{animation-delay:0.0s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(2){--ia:#A855F7;--ib:#D8B4FE;animation-delay:0.16s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(2)::after{animation-delay:1.4s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(3){--ia:#22C55E;--ib:#86EFAC;animation-delay:0.24s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(3)::after{animation-delay:2.8s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(4){--ia:#06B6D4;--ib:#67E8F9;animation-delay:0.32s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(4)::after{animation-delay:4.2s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(5){--ia:#14B8A6;--ib:#5EEAD4;animation-delay:0.40s}
html[data-shell="app"] main .inkcard .inkstat:nth-child(5)::after{animation-delay:5.6s}
/* Desk position: a negative earning shows in gold, not green */
html[data-shell="app"] main .inkcard .inkstat .i-value.n{color:#FDE68A!important;text-shadow:0 0 18px rgba(250,204,21,.35)}
/* ===== Water, made real (2 Oct 2026): sidebar + Needs attention =====
   Eight layers on one element: rising bubbles (2), a lit wave crest and a back
   wave, living caustic light (an SVG turbulence net that keeps reshaping itself,
   like sunlight on a pool floor), sun rays that drift across, a bright surface
   at the top, and the deep-sea gradient that rolls. Each layer moves exactly
   one tile per loop, so it never jumps. Still for reduced-motion users. */
@keyframes aqFlow2{0%{background-position:0 0,0 0,0 100%,0 100%,0 0,0 0,0 0,0 0}100%{background-position:0 -300px,0 -840px,-900px 100%,1300px 100%,420px 840px,600px 0,0 0,0 1800px}}
html[data-shell="app"] .sidebar,html[data-shell="app"] .card.attn{
  background-image:
    radial-gradient(circle at 30% 70%,rgba(255,255,255,.55) 0 1.6px,rgba(255,255,255,.12) 2.4px,transparent 3.2px),
    radial-gradient(circle at 75% 40%,rgba(255,255,255,.45) 0 2.4px,rgba(255,255,255,.10) 3.4px,transparent 4.4px),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20900%20110%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2055%20C%20150%2095%20300%2015%20450%2055%20C%20600%2095%20750%2015%20900%2055%20L900%20110%20L0%20110%20Z%22%20fill%3D%22rgba(255%2C255%2C255%2C0.12)%22%2F%3E%3Cpath%20d%3D%22M0%2062%20C%20150%2098%20300%2026%20450%2062%20C%20600%2098%20750%2026%20900%2062%22%20fill%3D%22none%22%20stroke%3D%22rgba(255%2C255%2C255%2C0.35)%22%20stroke-width%3D%221.5%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201300%20150%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20d%3D%22M0%2070%20C%20216%2020%20433%20120%20650%2070%20C%20866%2020%201083%20120%201300%2070%20L1300%20150%20L0%20150%20Z%22%20fill%3D%22rgba(165%2C243%2C252%2C0.12)%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22420%22%20height%3D%22420%22%20viewBox%3D%220%200%20420%20420%22%3E%3Cfilter%20id%3D%22c%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%25%22%20height%3D%22100%25%22%3E%3CfeTurbulence%20type%3D%22turbulence%22%20baseFrequency%3D%220.018%200.026%22%20numOctaves%3D%222%22%20seed%3D%227%22%20stitchTiles%3D%22stitch%22%3E%3Canimate%20attributeName%3D%22baseFrequency%22%20dur%3D%2216s%22%20values%3D%220.018%200.026%3B0.024%200.020%3B0.018%200.026%22%20repeatCount%3D%22indefinite%22%2F%3E%3C%2FfeTurbulence%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.80%20%200%200%200%200%200.97%20%200%200%200%200%201%20%20-30%200%200%200%203.6%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22420%22%20height%3D%22420%22%20filter%3D%22url(%23c)%22%20opacity%3D%220.24%22%2F%3E%3C%2Fsvg%3E"),
    repeating-linear-gradient(105deg,transparent 0 46px,rgba(224,242,254,.07) 46px 78px,transparent 78px 150px),
    linear-gradient(180deg,rgba(186,230,253,.30) 0%,rgba(186,230,253,.08) 14%,transparent 30%),
    linear-gradient(180deg,#062a4a 0%,#0b4f7a 18%,#0e7490 36%,#0f766e 52%,#0e7490 68%,#0b4f7a 84%,#062a4a 100%)!important;
  background-size:120px 300px,190px 420px,900px 110px,1300px 150px,420px 420px,600px 100%,100% 100%,100% 1800px!important;
  background-repeat:repeat,repeat,repeat-x,repeat-x,repeat,repeat,no-repeat,repeat-y!important;
  background-position:0 0,0 0,0 100%,0 100%,0 0,0 0,0 0,0 0;
  animation:aqFlow2 24s linear infinite!important;
}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .sidebar,html[data-shell="app"] .card.attn{animation:none!important}}
/* Home: every list card from Close to breach down to Recent activity sits on the same water */
html[data-shell="app"] .card.attn{margin-bottom:16px}
html[data-shell="app"] .card.attn .rowline{border-color:rgba(255,255,255,.12)!important;color:#f0f9ff!important}
html[data-shell="app"] .card.attn .rowline strong,html[data-shell="app"] .card.attn .rowline span{color:#f0f9ff}
html[data-shell="app"] .card.attn a.tap,html[data-shell="app"] .card.attn a.tap strong{color:#a5f3fc!important}
html[data-shell="app"] .card.attn .money{color:#86efac!important;font-weight:800}
html[data-shell="app"] .card.attn .neg{color:#fde68a!important}
html[data-shell="app"] .card.attn .badge.danger{background:rgba(250,204,21,.22)!important;color:#fef9c3!important;border-color:rgba(250,204,21,.4)!important}
html[data-shell="app"] .card.attn p,html[data-shell="app"] .card.attn p a{color:#e0f2fe!important}

/* ===== Calm liquid background (2 Oct 2026) - replaces the caustics and bubbles ===== */
@keyframes aqLiquid{
  0%{background-position:0% 0%,100% 10%,10% 100%,90% 90%,0 0}
  50%{background-position:60% 40%,30% 70%,70% 20%,20% 60%,0 0}
  100%{background-position:100% 80%,0% 100%,90% 0%,40% 10%,0 0}
}
html[data-shell="app"] .sidebar,html[data-shell="app"] .card.attn{
  background-color:#04223b!important;
  background-image:
    radial-gradient(closest-side,rgba(34,211,238,.30),rgba(34,211,238,0)),
    radial-gradient(closest-side,rgba(45,212,191,.26),rgba(45,212,191,0)),
    radial-gradient(closest-side,rgba(59,130,246,.28),rgba(59,130,246,0)),
    radial-gradient(closest-side,rgba(14,165,233,.20),rgba(14,165,233,0)),
    linear-gradient(160deg,#03192d 0%,#062f4f 45%,#073f4f 100%)!important;
  background-size:75% 70%,85% 80%,80% 75%,95% 90%,100% 100%!important;
  background-repeat:no-repeat!important;
  background-position:0% 0%,100% 10%,10% 100%,90% 90%,0 0;
  animation:aqLiquid 22s ease-in-out infinite alternate!important;
}
html[data-shell="app"] .sidebar{background-size:160% 45%,170% 50%,160% 45%,180% 55%,100% 100%!important}
html[data-shell="app"] .sidebar::before,html[data-shell="app"] .sidebar::after,html[data-shell="app"] .card.attn::before,html[data-shell="app"] .card.attn::after{display:none!important;content:none!important;animation:none!important}
html[data-shell="app"] .card.attn .tablewrap{background:rgba(2,16,32,.30)!important}
html[data-shell="app"] .card.attn tbody tr td{background:transparent!important}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .sidebar,html[data-shell="app"] .card.attn{animation:none!important}}

/* ===== Aurora top bar + chart (2 Oct 2026) ===== */
@keyframes topAur{0%{background-position:0% 0%,100% 100%,50% 0%,0 0}50%{background-position:40% 100%,60% 0%,100% 60%,0 0}100%{background-position:100% 30%,0% 60%,0% 100%,0 0}}
html[data-shell="app"] header.top{
  position:relative;z-index:30;flex-wrap:wrap;gap:12px;
  padding:14px 18px!important;margin-bottom:18px;border-radius:18px;
  border:1px solid rgba(148,163,184,.18);
  background-color:#0b1023!important;
  background-image:
    radial-gradient(closest-side,rgba(139,92,246,.45),rgba(139,92,246,0)),
    radial-gradient(closest-side,rgba(34,211,238,.35),rgba(34,211,238,0)),
    radial-gradient(closest-side,rgba(59,130,246,.38),rgba(59,130,246,0)),
    linear-gradient(120deg,#0b1023 0%,#1e1b4b 50%,#0c4a6e 100%)!important;
  background-size:45% 220%,50% 240%,40% 200%,100% 100%!important;
  background-repeat:no-repeat!important;
  animation:topAur 18s ease-in-out infinite alternate;
  box-shadow:0 14px 34px -18px rgba(30,27,75,.65);
}
html[data-shell="app"] header.top h1{color:#fff!important;letter-spacing:-.01em;
  background:linear-gradient(90deg,#fff 0%,#c4b5fd 55%,#67e8f9 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
html[data-shell="app"] header.top .subtitle{display:inline-flex;align-items:center;gap:6px;margin-top:4px;padding:3px 10px;border-radius:999px;
  color:#e0f2fe!important;font-weight:600;font-size:12px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16)}
html[data-shell="app"] header.top .subtitle::before{content:"";width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.25)}
html[data-shell="app"] header.top .navbtn span{background:#fff!important}
html[data-shell="app"] header.top .topsearch input{background:rgba(255,255,255,.10)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:12px!important}
html[data-shell="app"] header.top .topsearch input::placeholder{color:rgba(226,232,240,.70)}
html[data-shell="app"] header.top .topsearch input:focus{outline:none;border-color:#67e8f9!important;box-shadow:0 0 0 3px rgba(103,232,249,.25)}
html[data-shell="app"] header.top .topsearch button{background:linear-gradient(135deg,#22d3ee,#3b82f6)!important;border:0!important;color:#fff!important;border-radius:12px!important;font-weight:700;box-shadow:0 6px 16px -6px rgba(34,211,238,.7)}
html[data-shell="app"] header.top .numbtn{background:linear-gradient(135deg,rgba(251,191,36,.22),rgba(245,158,11,.12))!important;color:#fde68a!important;border:1px solid rgba(251,191,36,.45)!important;font-weight:700}
html[data-shell="app"] header.top #themesel{background-color:rgba(255,255,255,.10)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:12px!important}
html[data-shell="app"] header.top #themesel option{color:#0f172a;background:#fff}
html[data-shell="app"] header.top .dnbtn{background:linear-gradient(135deg,#8b5cf6,#6366f1)!important;border:0!important;color:#fff!important;box-shadow:0 6px 16px -6px rgba(139,92,246,.8)}
html[data-shell="app"] header.top .usermenu summary{background:rgba(255,255,255,.10)!important;border:1px solid rgba(255,255,255,.22)!important;color:#cbd5e1!important}
html[data-shell="app"] header.top .usermenu summary .uname{color:#fff!important}
html[data-shell="app"] header.top .usermenu summary .urole{color:#a5f3fc!important}
html[data-shell="app"] header.top .usermenu summary .uavatar{background:linear-gradient(135deg,#8b5cf6,#22d3ee)!important;color:#fff!important}
html[data-shell="app"] header.top button:hover,html[data-shell="app"] header.top summary:hover{filter:brightness(1.12)}

/* chart card - same aurora as Desk position */
@keyframes barUp{from{transform:scaleY(0)}to{transform:scaleY(1)}}
html[data-shell="app"] .card:has(> .chartwrap > svg.chart){
  color:#e2e8f0;border:1px solid rgba(148,163,184,.18)!important;
  background-color:#0b1023!important;
  background-image:
    radial-gradient(closest-side,rgba(139,92,246,.30),rgba(139,92,246,0)),
    radial-gradient(closest-side,rgba(34,211,238,.22),rgba(34,211,238,0)),
    linear-gradient(135deg,#0b1023 0%,#1e1b4b 50%,#0c4a6e 100%)!important;
  background-size:60% 90%,55% 85%,100% 100%!important;background-repeat:no-repeat!important;
  background-position:0% 0%,100% 100%,0 0;
  box-shadow:0 18px 40px -22px rgba(30,27,75,.7)}
html[data-shell="app"] .card:has(> .chartwrap > svg.chart) h2{color:#fff!important}
html[data-shell="app"] .card:has(> .chartwrap > svg.chart) .muted,html[data-shell="app"] .card:has(> .chartwrap > svg.chart) .chartnote{color:#a5b4c8!important}
html[data-shell="app"] .card:has(> .chartwrap > svg.chart) .clegend span{color:#e2e8f0!important;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);padding:4px 10px;border-radius:999px}
html[data-shell="app"] .card:has(> .chartwrap > svg.chart) .clegend i.k-spend{background:linear-gradient(135deg,#c4b5fd,#7c3aed)!important}
html[data-shell="app"] .card:has(> .chartwrap > svg.chart) .clegend i.k-money{background:linear-gradient(135deg,#67e8f9,#2563eb)!important}
html[data-shell="app"] svg.chart line.grid{stroke:rgba(255,255,255,.10)!important}
html[data-shell="app"] svg.chart text.axis{fill:#94a3b8!important}
html[data-shell="app"] svg.chart text.vlabel{fill:#fff!important;font-weight:700}
html[data-shell="app"] svg.chart path.bar-spend{fill:url(#chGSpend) #8b5cf6!important;filter:drop-shadow(0 0 8px rgba(139,92,246,.55))}
html[data-shell="app"] svg.chart path.bar-money{fill:url(#chGMoney) #3b82f6!important;filter:drop-shadow(0 0 8px rgba(34,211,238,.5))}
html[data-shell="app"] svg.chart path.bar-spend,html[data-shell="app"] svg.chart path.bar-money{transform-box:fill-box;transform-origin:50% 100%;animation:barUp .9s cubic-bezier(.2,.8,.2,1) both;transition:filter .2s}
html[data-shell="app"] svg.chart path.bar-money{animation-delay:.12s}
html[data-shell="app"] svg.chart path:hover{filter:brightness(1.2) drop-shadow(0 0 12px rgba(255,255,255,.35))}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] header.top{animation:none}html[data-shell="app"] svg.chart path{animation:none!important}}

/* ===== Page colours follow the Home card you clicked (2 Oct 2026) =====
   <html data-accent="..."> is set in views.php: the colour of the Home card / tile you clicked,
   or the page's own colour when you come from the sidebar. Every page then gets that card's
   gradient tiles, shine, count-up, a matching top bar and accent tables. */
html[data-accent="sky"]{--a0:#075985;--a1:#0284C7;--a2:#38BDF8;--ar:2,132,199;--ar2:56,189,248}
html[data-accent="teal"]{--a0:#115E59;--a1:#0D9488;--a2:#2DD4BF;--ar:13,148,136;--ar2:45,212,191}
html[data-accent="gold"]{--a0:#713F12;--a1:#CA8A04;--a2:#FACC15;--ar:202,138,4;--ar2:250,204,21}
html[data-accent="slate"]{--a0:#0F172A;--a1:#334155;--a2:#64748B;--ar:51,65,85;--ar2:100,116,139}
html[data-accent="emerald"]{--a0:#064E3B;--a1:#059669;--a2:#34D399;--ar:5,150,105;--ar2:52,211,153}
html[data-accent="indigo"]{--a0:#312E81;--a1:#4F46E5;--a2:#818CF8;--ar:79,70,229;--ar2:129,140,248}
html[data-accent="violet"]{--a0:#3B0764;--a1:#7C3AED;--a2:#C084FC;--ar:124,58,237;--ar2:192,132,252}
html[data-accent="cyan"]{--a0:#164E63;--a1:#0891B2;--a2:#67E8F9;--ar:8,145,178;--ar2:103,232,249}
html[data-accent="blue"]{--a0:#1E3A8A;--a1:#2563EB;--a2:#93C5FD;--ar:37,99,235;--ar2:147,197,253}
html[data-accent="green"]{--a0:#14532D;--a1:#16A34A;--a2:#86EFAC;--ar:22,163,74;--ar2:134,239,172}
html[data-accent]{--ah:var(--a0)}
html[data-accent][data-theme="nova"],html[data-accent][data-theme="dark"],html[data-accent][data-theme="midnight"],html[data-accent][data-theme="emerald"],html[data-accent][data-theme="royal"]{--ah:var(--a2)}
html[data-accent="slate"][data-theme="nova"],html[data-accent="slate"][data-theme="dark"],html[data-accent="slate"][data-theme="midnight"]{--ah:#cbd5e1}
@keyframes fxStrip{0%{background-position:0% 0}100%{background-position:100% 0}}
html[data-shell="app"][data-accent] main.main{background-image:radial-gradient(1100px 420px at 12% -6%,rgba(var(--ar),.16),transparent 62%),radial-gradient(820px 380px at 100% 0%,rgba(var(--ar2),.12),transparent 60%)!important;background-repeat:no-repeat!important}
html[data-shell="app"][data-accent] header.top{
  background-image:
    radial-gradient(closest-side,rgba(var(--ar2),.55),rgba(var(--ar2),0)),
    radial-gradient(closest-side,rgba(255,255,255,.16),rgba(255,255,255,0)),
    radial-gradient(closest-side,rgba(var(--ar),.55),rgba(var(--ar),0)),
    linear-gradient(120deg,#0b1023 0%,var(--a0) 58%,var(--a1) 135%)!important;
  box-shadow:0 14px 34px -18px rgba(var(--ar),.75)}
html[data-shell="app"][data-accent] header.top h1{background:linear-gradient(90deg,#fff 0%,#fff 40%,rgba(var(--ar2),1) 100%);-webkit-background-clip:text;background-clip:text}
html[data-shell="app"][data-accent] header.top .topsearch button,html[data-shell="app"][data-accent] header.top .dnbtn{background:linear-gradient(135deg,var(--a1),var(--a2))!important;box-shadow:0 6px 16px -6px rgba(var(--ar),.8)}
html[data-shell="app"][data-accent] main .stats{gap:14px}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]){position:relative;overflow:hidden;isolation:isolate;border:0!important;border-radius:16px!important;padding:14px 16px 16px!important;min-height:92px;
  display:flex;flex-direction:column;justify-content:center;gap:6px;color:#fff!important;
  background-image:linear-gradient(135deg,var(--a0) 0%,var(--a1) 55%,var(--a2) 115%)!important;background-size:220% 220%!important;
  box-shadow:0 10px 22px -14px rgba(var(--ar),.9)!important;
  animation:kpiIn .6s cubic-bezier(.2,.8,.2,1) both,kpiGrad 9s ease-in-out infinite alternate;transition:transform .25s ease,box-shadow .25s ease}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]):nth-child(4n+2){background-image:linear-gradient(160deg,var(--a1) 0%,var(--a0) 70%)!important;animation-delay:.07s,0s}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]):nth-child(4n+3){background-image:linear-gradient(115deg,var(--a0) 0%,var(--a1) 60%,rgba(var(--ar2),.95) 100%)!important;animation-delay:.14s,0s}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]):nth-child(4n+4){background-image:linear-gradient(200deg,var(--a2) 0%,var(--a1) 35%,var(--a0) 100%)!important;animation-delay:.21s,0s}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]):hover{transform:translateY(-3px) scale(1.015);box-shadow:0 16px 30px -14px rgba(var(--ar),.95)!important}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"])::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:38%;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);animation:kpiShine 7s ease-in-out infinite}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]):nth-child(2)::before{animation-delay:1.7s}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]):nth-child(3)::before{animation-delay:3.4s}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]):nth-child(4)::before{animation-delay:5.1s}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) > span{color:rgba(255,255,255,.95)!important;font-weight:700!important;font-size:13px;display:flex;align-items:center;gap:8px;text-shadow:0 1px 6px rgba(0,0,0,.25)}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) > span::before{content:"";display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:#fff!important;margin:0!important;animation:kpiPulse 2.4s ease-out infinite}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) strong{color:#fff!important;font-size:27px!important;line-height:1.1;text-shadow:0 2px 12px rgba(0,0,0,.28);font-variant-numeric:tabular-nums}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) strong.neg,html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) strong.bad{align-self:flex-start;padding:0 8px;border-radius:8px;background:rgba(190,18,60,.42)}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) .muted,html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) .small,html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) div{color:rgba(255,255,255,.9)!important;text-shadow:0 1px 6px rgba(0,0,0,.25)}
html[data-shell="app"][data-accent] main .stats > .stat:not([class*="c-"]):not([class*=" g-"]) a{color:#fff!important;text-decoration:underline;text-underline-offset:3px}
html[data-shell="app"][data-accent] main .card:not(.attn):not(.inkcard):not(.acct):not(:has(> .chartwrap)){
  background-image:linear-gradient(90deg,var(--a0),var(--a1),var(--a2),var(--a1),var(--a0))!important;background-size:300% 4px!important;background-repeat:no-repeat!important;background-position:0 0;
  border-color:rgba(var(--ar),.18)!important;box-shadow:0 12px 30px -20px rgba(var(--ar),.55),0 1px 2px rgba(15,23,42,.04)!important;
  animation:kpiIn .5s cubic-bezier(.2,.8,.2,1) both,fxStrip 7s ease-in-out infinite alternate}
html[data-shell="app"][data-accent] main .card h2,html[data-shell="app"][data-accent] main .card h3{color:var(--ah)!important}
html[data-shell="app"][data-accent] main .card:not(.attn) th{background:rgba(var(--ar),.09)!important;color:var(--ah)!important}
html[data-shell="app"][data-accent] main .card:not(.attn) tbody tr:hover td{background:rgba(var(--ar),.06)!important}
html[data-shell="app"][data-accent] main .card:not(.attn) td a:not(.button){color:var(--ah)!important;font-weight:600}
html[data-shell="app"][data-accent] main > :not(header) button[type="submit"]:not(.danger):not(.secondary):not(.linkish):not(.ghost),
html[data-shell="app"][data-accent] main > :not(header) button:not([type]):not(.danger):not(.secondary):not(.linkish):not(.ghost),
html[data-shell="app"][data-accent] main .eq-save{background:linear-gradient(135deg,var(--a0),var(--a1))!important;border-color:transparent!important;color:#fff!important;box-shadow:0 6px 16px -8px rgba(var(--ar),.9)}
html[data-shell="app"][data-accent] main > :not(header) button[type="submit"]:not(.danger):not(.secondary):not(.linkish):hover{filter:brightness(1.1)}
html[data-shell="app"][data-accent] main .chips a.on,html[data-shell="app"][data-accent] main .chips a.active{background:linear-gradient(135deg,var(--a0),var(--a1))!important;border-color:transparent!important;color:#fff!important;box-shadow:0 6px 14px -8px rgba(var(--ar),.9)}
html[data-shell="app"][data-accent] main .chips a:not(.on):hover{border-color:rgba(var(--ar),.55)!important}
html[data-shell="app"][data-accent] main > :not(header) input:focus,html[data-shell="app"][data-accent] main > :not(header) select:focus,html[data-shell="app"][data-accent] main > :not(header) textarea:focus{outline:none;border-color:var(--a1)!important;box-shadow:0 0 0 3px rgba(var(--ar),.22)!important}
@media (prefers-reduced-motion: reduce){html[data-shell="app"][data-accent] main .stats > .stat,html[data-shell="app"][data-accent] main .stats > .stat::before,html[data-shell="app"][data-accent] main .stats > .stat > span::before,html[data-shell="app"][data-accent] main .card{animation:none!important}}
html[data-shell="app"] header.top h1 .wname{font-weight:800}
html[data-shell="app"] header.top .subtitle .liveclock{font-variant-numeric:tabular-nums;letter-spacing:.01em}
html[data-shell="app"] header.top .subtitle .tdnote{opacity:.8;font-weight:500}

/* page colours: section headings and links follow too */
html[data-shell="app"][data-accent] main > h2,html[data-shell="app"][data-accent] main > h3{color:var(--ah)!important;border-left:4px solid var(--a1);padding-left:10px;border-radius:2px}
html[data-shell="app"][data-accent] main .card:not(.attn) a:not(.button):not(.danger):not([class*="chip"]):not(.on):not(.am-detail){color:var(--ah)!important}

/* page colours: the KPI rows on Reserve / Allocations / Traders and the Lifetime tiles too */
html[data-shell="app"][data-accent] main .kpis > div.kpi,html[data-shell="app"][data-accent] main .ph-cards > .ph-card{position:relative;overflow:hidden;isolation:isolate;border:0!important;border-radius:16px!important;color:#fff!important;
  background-image:linear-gradient(135deg,var(--a0) 0%,var(--a1) 55%,var(--a2) 115%)!important;background-size:220% 220%!important;
  box-shadow:0 10px 22px -14px rgba(var(--ar),.9)!important;animation:kpiIn .6s cubic-bezier(.2,.8,.2,1) both,kpiGrad 9s ease-in-out infinite alternate;transition:transform .25s ease,box-shadow .25s ease}
html[data-shell="app"][data-accent] main .kpis > div.kpi:nth-child(4n+2),html[data-shell="app"][data-accent] main .ph-cards > .ph-card:nth-child(4n+2){background-image:linear-gradient(160deg,var(--a1) 0%,var(--a0) 70%)!important;animation-delay:.07s,0s}
html[data-shell="app"][data-accent] main .kpis > div.kpi:nth-child(4n+3),html[data-shell="app"][data-accent] main .ph-cards > .ph-card:nth-child(4n+3){background-image:linear-gradient(115deg,var(--a0) 0%,var(--a1) 60%,rgba(var(--ar2),.95) 100%)!important;animation-delay:.14s,0s}
html[data-shell="app"][data-accent] main .kpis > div.kpi:nth-child(4n+4),html[data-shell="app"][data-accent] main .ph-cards > .ph-card:nth-child(4n+4){background-image:linear-gradient(200deg,var(--a2) 0%,var(--a1) 35%,var(--a0) 100%)!important;animation-delay:.21s,0s}
html[data-shell="app"][data-accent] main .kpis > div.kpi:hover,html[data-shell="app"][data-accent] main .ph-cards > .ph-card:hover{transform:translateY(-3px) scale(1.015);box-shadow:0 16px 30px -14px rgba(var(--ar),.95)!important}
html[data-shell="app"][data-accent] main .kpis > div.kpi::before,html[data-shell="app"][data-accent] main .ph-cards > .ph-card::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:38%;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.26),transparent);animation:kpiShine 7s ease-in-out infinite}
html[data-shell="app"][data-accent] main .kpis > div.kpi:nth-child(2)::before,html[data-shell="app"][data-accent] main .ph-cards > .ph-card:nth-child(2)::before{animation-delay:1.7s}html[data-shell="app"][data-accent] main .kpis > div.kpi:nth-child(3)::before,html[data-shell="app"][data-accent] main .ph-cards > .ph-card:nth-child(3)::before{animation-delay:3.4s}html[data-shell="app"][data-accent] main .kpis > div.kpi:nth-child(4)::before,html[data-shell="app"][data-accent] main .ph-cards > .ph-card:nth-child(4)::before{animation-delay:5.1s}
html[data-shell="app"][data-accent] main .kpis > div.kpi *,html[data-shell="app"][data-accent] main .ph-cards > .ph-card *{color:#fff!important;text-shadow:0 1px 6px rgba(0,0,0,.25)}
html[data-shell="app"][data-accent] main .kpis > div.kpi .k-label,html[data-shell="app"][data-accent] main .ph-cards > .ph-card .k-label,html[data-shell="app"][data-accent] main .kpis > div.kpi > span,html[data-shell="app"][data-accent] main .ph-cards > .ph-card > span{font-weight:700!important;opacity:.95}
html[data-shell="app"][data-accent] main .kpis > div.kpi .k-value,html[data-shell="app"][data-accent] main .ph-cards > .ph-card .k-value,html[data-shell="app"][data-accent] main .kpis > div.kpi > strong,html[data-shell="app"][data-accent] main .ph-cards > .ph-card > strong{font-size:26px!important;text-shadow:0 2px 12px rgba(0,0,0,.28)!important;font-variant-numeric:tabular-nums}
html[data-shell="app"][data-accent] main .kpis > div.kpi .k-sub,html[data-shell="app"][data-accent] main .ph-cards > .ph-card .k-sub,html[data-shell="app"][data-accent] main .kpis > div.kpi > em,html[data-shell="app"][data-accent] main .ph-cards > .ph-card > em{opacity:.9}
html[data-shell="app"][data-accent] main .kpis > div.kpi .k-dot,html[data-shell="app"][data-accent] main .ph-cards > .ph-card .k-dot{background:#fff!important;animation:kpiPulse 2.4s ease-out infinite}
html[data-shell="app"][data-accent] main .al-chips .al-chip.on{background:linear-gradient(135deg,var(--a0),var(--a1))!important;border-color:transparent!important;color:#fff!important}
html[data-shell="app"][data-accent] main .ph-chart,html[data-shell="app"][data-accent] main .ph-table,html[data-shell="app"][data-accent] main .ph-head{border-color:rgba(var(--ar),.18)!important}
html[data-shell="app"][data-accent] main .ph-table th{background:rgba(var(--ar),.09)!important;color:var(--ah)!important}
@media (prefers-reduced-motion: reduce){html[data-shell="app"][data-accent] main .kpis > div.kpi,html[data-shell="app"][data-accent] main .ph-cards > .ph-card,html[data-shell="app"][data-accent] main .kpis > div.kpi::before,html[data-shell="app"][data-accent] main .ph-cards > .ph-card::before{animation:none!important}}

/* ===== Taller top bar on every page + Accounts rows redesigned (2 Oct 2026) ===== */
html[data-shell="app"] header.top{padding:26px 30px!important;min-height:120px;align-items:center;margin-bottom:22px!important;border-radius:22px!important}
html[data-shell="app"] header.top h1{font-size:30px!important;line-height:1.15!important}
html[data-shell="app"] header.top .subtitle{font-size:13px!important;padding:5px 12px!important;margin-top:9px!important}
@media (max-width:760px){html[data-shell="app"] header.top{padding:16px 18px!important;min-height:0;border-radius:18px!important}html[data-shell="app"] header.top h1{font-size:22px!important}}
html[data-shell="app"] main .card.acct{--sc:100,116,139;position:relative;overflow:hidden;
  border:1px solid rgba(var(--sc),.22)!important;border-radius:18px!important;padding:0 18px 16px 24px!important;margin-bottom:14px!important;
  background-image:none!important;animation:kpiIn .5s cubic-bezier(.2,.8,.2,1) both!important;
  box-shadow:0 16px 32px -24px rgba(var(--sc),.75),0 1px 2px rgba(15,23,42,.05)!important;transition:transform .22s ease,box-shadow .22s ease}
html[data-shell="app"] main .card.acct.st-live{--sc:13,148,136}
html[data-shell="app"] main .card.acct.st-p1{--sc:2,132,199}
html[data-shell="app"] main .card.acct.st-p2{--sc:124,58,237}
html[data-shell="app"] main .card.acct.st-br{--sc:71,85,105}
html[data-shell="app"] main .card.acct:hover{transform:translateY(-2px);box-shadow:0 22px 40px -24px rgba(var(--sc),.9),0 1px 2px rgba(15,23,42,.05)!important}
html[data-shell="app"] main .card.acct::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,rgb(var(--sc)),rgba(var(--sc),.35))}
html[data-shell="app"] main .card.acct > .rowline{margin:0 -18px 12px -24px!important;padding:12px 18px 12px 24px!important;align-items:center;
  background:linear-gradient(90deg,rgba(var(--sc),.16),rgba(var(--sc),.05) 60%,rgba(var(--sc),0));border-bottom:1px solid rgba(var(--sc),.14)}
html[data-shell="app"] main .card.acct .acc-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:15px}
html[data-shell="app"] main .card.acct .acc-head > strong{font-size:18px;font-weight:800;letter-spacing:-.01em}
html[data-shell="app"] main .card.acct .acc-av{width:38px;height:38px;flex:none;border-radius:12px;display:inline-grid;place-items:center;font:700 14px/1 "Space Grotesk",sans-serif;color:#fff;
  background:linear-gradient(135deg,rgb(var(--sc)),rgba(var(--sc),.55));box-shadow:0 8px 16px -8px rgba(var(--sc),.95)}
html[data-shell="app"] main .card.acct .acc-firm{padding:3px 11px;border-radius:999px;font-size:12px;font-weight:700;background:rgba(var(--sc),.12);color:rgb(var(--sc));border:1px solid rgba(var(--sc),.28)}
html[data-shell="app"] main .card.acct .rowline .badge{padding:5px 12px!important;font-weight:700;border-radius:999px!important}
html[data-shell="app"] main .card.acct .acct-meta.acc-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px!important;font-size:12.5px}
html[data-shell="app"] main .card.acct .am{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:10px;background:rgba(100,116,139,.08);border:1px solid rgba(100,116,139,.18);line-height:1.3}
html[data-shell="app"] main .card.acct .am-eq strong{font-weight:800;color:rgb(var(--sc));font-size:13.5px}
html[data-shell="app"] main .card.acct .am-days b{font-weight:800}
html[data-shell="app"] main .card.acct .am-days i{display:inline-block;width:70px;height:6px;border-radius:99px;background:rgba(var(--sc),.16);overflow:hidden}
html[data-shell="app"] main .card.acct .am-days u{display:block;height:100%;border-radius:99px;text-decoration:none;background:linear-gradient(90deg,rgba(var(--sc),.6),rgb(var(--sc)))}
html[data-shell="app"] main .card.acct .am-days.full{background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.32)}
html[data-shell="app"] main .card.acct .am-days.full u{background:linear-gradient(90deg,#34d399,#059669)}
html[data-shell="app"] main .card.acct .am-wait{background:rgba(234,179,8,.10);border-color:rgba(234,179,8,.34);color:#a16207}
html[data-shell="app"] main .card.acct .am-loss{background:rgba(225,29,72,.08);border-color:rgba(225,29,72,.28);color:#be123c;font-weight:700}
html[data-shell="app"] main .card.acct .am-win{background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.32);color:#047857;font-weight:700}
html[data-shell="app"] main .card.acct a.am-detail{margin-left:auto;padding:6px 14px;border-radius:999px;font-weight:700;font-size:12.5px;color:#fff!important;text-decoration:none!important;
  background:linear-gradient(135deg,rgb(var(--sc)),rgba(var(--sc),.7));box-shadow:0 6px 14px -8px rgba(var(--sc),.95);transition:transform .2s ease}
html[data-shell="app"] main .card.acct a.am-detail:hover{transform:translateX(3px)}
html[data-shell="app"] main .card.acct .am-upd{flex-basis:100%;order:9;background:none;border:0;padding:0;font-size:12px;opacity:.85}
html[data-shell="app"] main .card.acct .am-upd::before{content:"\23F1";margin-right:2px}
html[data-shell="app"] main .card.acct .acct-grid{gap:10px 12px!important}
html[data-shell="app"] main .card.acct .acct-grid label{font-size:10.5px!important;font-weight:700!important;letter-spacing:.07em;text-transform:uppercase;opacity:.75}
html[data-shell="app"] main .card.acct .acct-grid input,html[data-shell="app"] main .card.acct .acct-grid select{border-radius:11px!important;min-height:40px;border-color:rgba(var(--sc),.24)!important;font-size:14px!important;letter-spacing:0;text-transform:none;font-weight:500}
html[data-shell="app"] main .card.acct .acct-grid input[name="equity"]{font-weight:800!important}
html[data-shell="app"] main .card.acct .acct-grid input:focus,html[data-shell="app"] main .card.acct .acct-grid select:focus{border-color:rgb(var(--sc))!important;box-shadow:0 0 0 3px rgba(var(--sc),.2)!important;outline:none}
html[data-shell="app"] main .card.acct .eq-save{border-radius:11px!important;min-height:40px}
html[data-shell="app"] main .card.acct .acct-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px!important;padding-top:12px;border-top:1px dashed rgba(var(--sc),.25)}
html[data-shell="app"] main .card.acct .acct-actions form{margin:0!important}
html[data-shell="app"] main .card.acct .acct-actions > form:not(:has(.danger)) + form:has(.danger){margin-left:auto!important}
html[data-shell="app"] main .card.acct .acct-actions button{border-radius:10px!important;min-height:34px;padding:0 15px!important;font-weight:700!important;transition:all .18s ease}
html[data-shell="app"] main .card.acct .acct-actions button.secondary{background:rgba(var(--sc),.08)!important;border:1px solid rgba(var(--sc),.32)!important;color:rgb(var(--sc))!important}
html[data-shell="app"] main .card.acct .acct-actions button.secondary:hover{background:rgb(var(--sc))!important;color:#fff!important}
html[data-shell="app"] main .card.acct .acct-actions button.danger{background:rgba(225,29,72,.07)!important;border:1px solid rgba(225,29,72,.32)!important;color:#be123c!important}
html[data-shell="app"] main .card.acct .acct-actions button.danger:hover{background:#e11d48!important;border-color:#e11d48!important;color:#fff!important}
html[data-shell="app"][data-theme="nova"] main .card.acct .am-wait,html[data-shell="app"][data-theme="dark"] main .card.acct .am-wait{color:#fde68a}
html[data-shell="app"][data-theme="nova"] main .card.acct .am-loss,html[data-shell="app"][data-theme="dark"] main .card.acct .am-loss,html[data-shell="app"][data-theme="nova"] main .card.acct .acct-actions button.danger,html[data-shell="app"][data-theme="dark"] main .card.acct .acct-actions button.danger{color:#fda4af!important}
html[data-shell="app"][data-theme="nova"] main .card.acct .am-win,html[data-shell="app"][data-theme="dark"] main .card.acct .am-win{color:#a7f3d0}
html[data-shell="app"][data-theme="nova"] main .card.acct.st-br,html[data-shell="app"][data-theme="dark"] main .card.acct.st-br{--sc:148,163,184}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .card.acct{animation:none!important}}

/* Accounts rows: tidy two-line field grid on wide screens, Today P/L stands out */
@media (min-width:1100px){html[data-shell="app"] main .card.acct .acct-grid{grid-template-columns:repeat(5,minmax(0,1fr)) auto!important}html[data-shell="app"] main .card.acct .acct-grid .wide{grid-column:span 3!important}}
html[data-shell="app"] main .card.acct .acct-grid input[name="pl"]{background-color:rgba(var(--sc),.06)!important;border-style:dashed!important}
html[data-shell="app"] main .card.acct .eq-savecell{align-self:end}

/* ===== Trade Ideas: firm logos on both sides of each trade (2 Oct 2026) ===== */
html[data-shell="app"] main .tradeline .tside.has-logo{display:flex;align-items:center;gap:16px}
html[data-shell="app"] main .tradeline .tside.right.has-logo{flex-direction:row-reverse;text-align:right}
html[data-shell="app"] main .tradeline .tlogo{height:58px;width:auto;max-width:200px;flex:none;border-radius:14px;box-shadow:0 10px 22px -12px rgba(2,6,23,.75),0 0 0 1px rgba(255,255,255,.06);transition:transform .25s ease}
html[data-shell="app"] main .tradeline:hover .tlogo{transform:translateY(-2px) scale(1.03)}
html[data-shell="app"] main .tradeline .tside.has-logo .tfirm{font-size:12px!important;font-weight:700;opacity:.7;letter-spacing:.04em;text-transform:uppercase}
@media (max-width:760px){html[data-shell="app"] main .tradeline .tlogo{height:38px;border-radius:10px}html[data-shell="app"] main .tradeline .tside.has-logo{gap:8px}}

/* ===== Trade Ideas v2: name first then logo, no firm text, big account count, alive VS badge (2 Oct 2026) ===== */
@keyframes vsSpin{to{transform:rotate(360deg)}}
@keyframes vsPulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.85);opacity:0}}
@keyframes vsGlow{0%,100%{box-shadow:0 0 16px -4px var(--v1),inset 0 0 12px -6px var(--v2)}50%{box-shadow:0 0 30px 2px var(--v2),inset 0 0 16px -4px var(--v1)}}
@keyframes vsFlowIn{from{background-position:0 0}to{background-position:32px 0}}
@keyframes vsFlowOut{from{background-position:0 0}to{background-position:-32px 0}}
@keyframes vsText{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
html[data-shell="app"] main .tradeline{--v1:#34d399;--v2:#22d3ee;position:relative;isolation:isolate;align-items:center}
html[data-shell="app"] main .tradeline.ph-p1{--v1:#38bdf8;--v2:#818cf8}
html[data-shell="app"] main .tradeline.ph-p2{--v1:#a78bfa;--v2:#60a5fa}
html[data-shell="app"] main .tradeline.ph-fresh{--v1:#facc15;--v2:#34d399}
html[data-shell="app"] main .tradeline::before,html[data-shell="app"] main .tradeline::after{content:"";position:absolute;top:50%;height:3px;margin-top:-1.5px;z-index:-1;border-radius:3px;opacity:.7;pointer-events:none}
html[data-shell="app"] main .tradeline::before{left:30%;right:50%;background:repeating-linear-gradient(90deg,var(--v1) 0 12px,transparent 12px 32px);animation:vsFlowIn 1s linear infinite;-webkit-mask:linear-gradient(90deg,transparent,#000 40%);mask:linear-gradient(90deg,transparent,#000 40%)}
html[data-shell="app"] main .tradeline::after{left:50%;right:30%;background:repeating-linear-gradient(90deg,var(--v2) 0 12px,transparent 12px 32px);animation:vsFlowOut 1s linear infinite;-webkit-mask:linear-gradient(270deg,transparent,#000 40%);mask:linear-gradient(270deg,transparent,#000 40%)}
html[data-shell="app"] main .tradeline .tvs{position:relative;isolation:isolate;flex:none;width:100px;height:100px;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;display:block}
html[data-shell="app"] main .tradeline .tvs::before{content:"";position:absolute;inset:0;border-radius:50%;z-index:-1;background:conic-gradient(from 0deg,var(--v1),var(--v2),rgba(255,255,255,0) 45%,rgba(255,255,255,0) 55%,var(--v1));animation:vsSpin 2.2s linear infinite}
html[data-shell="app"] main .tradeline .tvs::after{content:"";position:absolute;inset:0;border-radius:50%;z-index:-2;border:2px solid var(--v1);animation:vsPulse 2s ease-out infinite}
html[data-shell="app"] main .tradeline .tvs-core{position:absolute;inset:4px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(circle at 32% 26%,#24304d 0%,#0b1023 72%);color:#fff;font:800 24px/1 "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.06em;animation:vsGlow 2.6s ease-in-out infinite}
html[data-shell="app"] main .tradeline .tvs-core .tphase{display:block;margin:0 0 4px!important;padding:0!important;background:linear-gradient(90deg,var(--v1),var(--v2),var(--v1))!important;background-size:200% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent;font:800 9px/1.1 "Plus Jakarta Sans",sans-serif!important;letter-spacing:.14em;text-align:center;max-width:80px;border:0!important;animation:vsText 3s ease-in-out infinite}
html[data-shell="app"] main .tradeline .tvs-core{text-shadow:0 0 14px var(--v1)}
html[data-shell="app"] main .tradeline .tside.has-logo .tfirm{display:none!important}
html[data-shell="app"] main .tradeline .tname{font-size:24px!important;font-weight:800!important;line-height:1.1}
html[data-shell="app"] main .tradeline .tcount{display:inline-flex;align-items:baseline;gap:6px;margin:6px 0 4px;padding:3px 12px 3px 10px;border-radius:999px;
  background:color-mix(in srgb,var(--v1) 16%,transparent);border:1px solid color-mix(in srgb,var(--v1) 45%,transparent)}
html[data-shell="app"] main .tradeline .tcount b{font:800 22px/1 "Space Grotesk",sans-serif}
html[data-shell="app"] main .tradeline .tcount span{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
html[data-shell="app"] main .tradeline .tmeta{font-size:12px}
@media (max-width:760px){html[data-shell="app"] main .tradeline .tvs{width:66px;height:66px}html[data-shell="app"] main .tradeline .tvs-core{font-size:16px}html[data-shell="app"] main .tradeline .tvs-core .tphase{font-size:7px!important;max-width:54px}html[data-shell="app"] main .tradeline .tname{font-size:18px!important}html[data-shell="app"] main .tradeline::before,html[data-shell="app"] main .tradeline::after{display:none}}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .tradeline::before,html[data-shell="app"] main .tradeline::after,html[data-shell="app"] main .tradeline .tvs::before,html[data-shell="app"] main .tradeline .tvs::after,html[data-shell="app"] main .tradeline .tvs-core,html[data-shell="app"] main .tradeline .tvs-core .tphase{animation:none!important}}

/* ===== Trade Ideas: one action row per trade (2 Oct 2026) ===== */
html[data-shell="app"] main .tradecard .editwrap.ti-actions{display:flex!important;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0 8px!important}
html[data-shell="app"] main .tradecard .ti-actions > form:not(.editform){margin:0!important;display:inline-flex}
html[data-shell="app"] main .tradecard .ti-actions > button,html[data-shell="app"] main .tradecard .ti-actions > form:not(.editform) button{min-height:38px;margin:0!important;padding:0 16px!important;border-radius:10px!important;font-size:14px!important;font-weight:700!important;line-height:1}
html[data-shell="app"] main .tradecard .ti-actions > .editform{flex-basis:100%}

/* ===== Trade Ideas: the All / Phase 1 / Phase 2 / Live / Fresh Live tabs - big, full width, alive (2 Oct 2026) ===== */
@keyframes chipDrift{0%{background-position:0% 50%}100%{background-position:100% 50%}}
@keyframes chipShine{0%,65%{transform:translateX(-130%) skewX(-18deg)}100%{transform:translateX(330%) skewX(-18deg)}}
@keyframes chipGlow{0%,100%{box-shadow:0 10px 24px -12px rgba(var(--cr),.95),0 0 0 0 rgba(var(--cr),.45)}50%{box-shadow:0 14px 30px -12px rgba(var(--cr),.95),0 0 0 7px rgba(var(--cr),0)}}
@keyframes chipDot{0%{box-shadow:0 0 0 0 rgba(var(--cr),.55)}80%{box-shadow:0 0 0 9px rgba(var(--cr),0)}100%{box-shadow:0 0 0 0 rgba(var(--cr),0)}}
html[data-shell="app"] main .chips:has(> a[href*="phase="]){display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px!important;margin:14px 0 18px!important;flex-wrap:nowrap}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a{--c0:#312E81;--c1:#4F46E5;--c2:#818CF8;--cr:79,70,229;position:relative;overflow:hidden;isolation:isolate;display:flex!important;align-items:center;justify-content:flex-start;gap:10px;
  min-height:64px;padding:12px 14px 12px 16px!important;margin:0!important;border-radius:16px!important;font-size:15.5px!important;font-weight:800!important;letter-spacing:.01em;text-decoration:none!important;color:var(--c0)!important;
  background:linear-gradient(135deg,rgba(var(--cr),.13),rgba(var(--cr),.04))!important;border:1px solid rgba(var(--cr),.30)!important;box-shadow:0 8px 20px -16px rgba(var(--cr),.9)!important;
  animation:kpiIn .5s cubic-bezier(.2,.8,.2,1) both;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a:nth-child(2){--c0:#075985;--c1:#0284C7;--c2:#38BDF8;--cr:2,132,199;animation-delay:.05s}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a:nth-child(3){--c0:#3B0764;--c1:#7C3AED;--c2:#C084FC;--cr:124,58,237;animation-delay:.1s}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a:nth-child(4){--c0:#115E59;--c1:#0D9488;--c2:#2DD4BF;--cr:13,148,136;animation-delay:.15s}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a:nth-child(5){--c0:#713F12;--c1:#CA8A04;--c2:#FACC15;--cr:202,138,4;animation-delay:.2s}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--c1);animation:chipDot 2.2s ease-out infinite}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a b{margin-left:auto;min-width:42px;height:42px;padding:0 10px;border-radius:13px;display:inline-grid;place-items:center;font:800 21px/1 "Space Grotesk",sans-serif!important;color:#fff!important;
  background:linear-gradient(135deg,var(--c1),var(--c2))!important;box-shadow:0 6px 14px -6px rgba(var(--cr),.95);opacity:1!important}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a:hover{transform:translateY(-3px);background:linear-gradient(135deg,rgba(var(--cr),.2),rgba(var(--cr),.07))!important;box-shadow:0 14px 26px -14px rgba(var(--cr),.95)!important}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a.on{color:#fff!important;border-color:transparent!important;background:linear-gradient(135deg,var(--c0),var(--c1) 55%,var(--c2))!important;background-size:220% 220%!important;
  animation:kpiIn .5s cubic-bezier(.2,.8,.2,1) both,chipDrift 6s ease-in-out infinite alternate,chipGlow 2.4s ease-in-out infinite}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a.on::before{background:#fff;animation:kpiPulse 2.4s ease-out infinite}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a.on b{background:rgba(255,255,255,.22)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a.on::after{content:"";position:absolute;top:-25%;bottom:-25%;left:0;width:34%;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);animation:chipShine 4.5s ease-in-out infinite}
html[data-shell="app"][data-theme="nova"] main .chips:has(> a[href*="phase="]) > a:not(.on),html[data-shell="app"][data-theme="dark"] main .chips:has(> a[href*="phase="]) > a:not(.on){color:var(--c2)!important}
@media (max-width:900px){html[data-shell="app"] main .chips:has(> a[href*="phase="]){grid-template-columns:repeat(2,minmax(0,1fr))}html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a:first-child{grid-column:1 / -1}}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a,html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a::before,html[data-shell="app"] main .chips:has(> a[href*="phase="]) > a::after{animation:none!important}}

/* ===== Accounts: the firm's real logo next to the trader's name (2 Oct 2026) ===== */
html[data-shell="app"] main .card.acct .acc-logo{height:34px;width:auto;max-width:130px;flex:none;border-radius:9px;box-shadow:0 6px 14px -8px rgba(2,6,23,.75),0 0 0 1px rgba(var(--sc),.25);transition:transform .2s ease}
html[data-shell="app"] main .card.acct:hover .acc-logo{transform:scale(1.05)}
@media (max-width:760px){html[data-shell="app"] main .card.acct .acc-logo{height:26px}}

/* ===== Trade Ideas: centred trade number + status pill (2 Oct 2026) ===== */
@keyframes tiDot{0%{box-shadow:0 0 0 0 rgba(var(--tc),.55)}80%{box-shadow:0 0 0 8px rgba(var(--tc),0)}100%{box-shadow:0 0 0 0 rgba(var(--tc),0)}}
html[data-shell="app"] main .tradecard > .rowline.ti-head{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px}
html[data-shell="app"] main .tradecard > .rowline.ti-head > .ti-mid{grid-column:2;grid-row:1;display:flex;align-items:center;gap:10px;justify-content:center}
html[data-shell="app"] main .tradecard > .rowline.ti-head > :nth-child(2){grid-column:3;grid-row:1;justify-self:end}
html[data-shell="app"] main .tradecard .ti-mid .tno{font:800 26px/1 "Space Grotesk",sans-serif;letter-spacing:-.01em;background:linear-gradient(90deg,#4f46e5,#06b6d4);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
html[data-shell="app"][data-theme="nova"] main .tradecard .ti-mid .tno,html[data-shell="app"][data-theme="dark"] main .tradecard .ti-mid .tno{background:linear-gradient(90deg,#a5b4fc,#67e8f9);-webkit-background-clip:text;background-clip:text}
html[data-shell="app"] main .tradecard .ti-mid a.tap{text-decoration:none!important}
html[data-shell="app"] main .tradecard .ti-st{--tc:99,102,241;display:inline-flex!important;align-items:center;gap:7px;padding:5px 12px 5px 10px!important;border-radius:999px!important;font-size:12px!important;font-weight:800!important;letter-spacing:.04em;
  color:rgb(var(--tc))!important;background:rgba(var(--tc),.10)!important;border:1px solid rgba(var(--tc),.32)!important}
html[data-shell="app"] main .tradecard .ti-st::before{content:"";width:8px;height:8px;border-radius:50%;background:rgb(var(--tc));animation:tiDot 2s ease-out infinite}
html[data-shell="app"] main .tradecard .ti-st.ti-generated{--tc:202,138,4}
html[data-shell="app"] main .tradecard .ti-st.ti-shared{--tc:8,145,178}
html[data-shell="app"] main .tradecard .ti-st.ti-completed{--tc:5,150,105}
html[data-shell="app"] main .tradecard .ti-st.ti-cancelled{--tc:100,116,139}
html[data-shell="app"][data-theme="nova"] main .tradecard .ti-st.ti-generated{--tc:250,204,21}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .tradecard .ti-st::before{animation:none}}

/* ===== Breaches: the equity that set each breach off (2 Oct 2026) ===== */
html[data-shell="app"] .bs-eq{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:6px;padding:5px 12px;border-radius:10px;font-size:13px;
  background:rgba(225,29,72,.07);border:1px solid rgba(225,29,72,.25);color:#9f1239}
html[data-shell="app"] .bs-eq strong{font:800 15px/1 "Space Grotesk",sans-serif;color:#be123c}
html[data-shell="app"] .bs-eq .bs-eq-sub{padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:700;background:rgba(100,116,139,.10);color:#475569}
html[data-shell="app"] .bs-eq.bs-eq-odd{background:rgba(234,179,8,.12);border-color:rgba(234,179,8,.5);color:#854d0e}
html[data-shell="app"] .bs-eq .bs-eq-warn,html[data-shell="app"] .bs-eq-warn{font-weight:800;color:#b45309}
html[data-shell="app"] .bs-eq.bs-eq-none{background:rgba(100,116,139,.08);border-color:rgba(100,116,139,.2);color:#64748b}
html[data-shell="app"] .bs-eq-oddnum{color:#b45309}
html[data-shell="app"][data-theme="nova"] .bs-eq,html[data-shell="app"][data-theme="dark"] .bs-eq{color:#fecdd3}
html[data-shell="app"][data-theme="nova"] .bs-eq strong,html[data-shell="app"][data-theme="dark"] .bs-eq strong{color:#fda4af}
html[data-shell="app"][data-theme="nova"] .bs-eq .bs-eq-sub,html[data-shell="app"][data-theme="dark"] .bs-eq .bs-eq-sub{color:#cbd5e1;background:rgba(148,163,184,.15)}
html[data-shell="app"][data-theme="nova"] .bs-eq.bs-eq-odd,html[data-shell="app"][data-theme="dark"] .bs-eq.bs-eq-odd,html[data-shell="app"][data-theme="nova"] .bs-eq-warn,html[data-shell="app"][data-theme="dark"] .bs-eq-warn{color:#fde68a}

/* ===== Ledger: big Overview / Trader-Wise tabs and alive month tiles (2 Oct 2026) ===== */
@keyframes lgDrift{0%{background-position:0% 50%}100%{background-position:100% 50%}}
@keyframes lgShine{0%,62%{transform:translateX(-140%) skewX(-18deg)}100%{transform:translateX(340%) skewX(-18deg)}}
@keyframes lgGlow{0%,100%{box-shadow:0 12px 26px -14px rgba(var(--mr),.95),0 0 0 0 rgba(var(--mr),.45)}50%{box-shadow:0 16px 32px -14px rgba(var(--mr),.95),0 0 0 7px rgba(var(--mr),0)}}
@keyframes lgDot{0%{box-shadow:0 0 0 0 rgba(var(--mr),.55)}80%{box-shadow:0 0 0 8px rgba(var(--mr),0)}100%{box-shadow:0 0 0 0 rgba(var(--mr),0)}}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]){display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px!important;margin:6px 0 16px!important;max-width:760px}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a{--mr:124,58,237;position:relative;overflow:hidden;isolation:isolate;display:flex!important;align-items:center;justify-content:center;gap:12px;min-height:62px;margin:0!important;padding:0 22px!important;border-radius:18px!important;font:800 17px/1 "Space Grotesk",sans-serif!important;letter-spacing:.01em;text-decoration:none!important;color:rgb(var(--mr))!important;background:linear-gradient(135deg,rgba(var(--mr),.14),rgba(var(--mr),.04))!important;border:1px solid rgba(var(--mr),.32)!important;box-shadow:0 10px 22px -18px rgba(var(--mr),.9)!important;transition:transform .2s ease,box-shadow .2s ease;animation:kpiIn .5s cubic-bezier(.2,.8,.2,1) both}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a:nth-child(2){--mr:8,145,178;animation-delay:.06s}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a::before{content:"";flex:none;width:26px;height:26px;border-radius:8px;background:currentColor;-webkit-mask:var(--ic) center/18px 18px no-repeat;mask:var(--ic) center/18px 18px no-repeat;--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='3' y='3' width='7' height='9' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='5' rx='1.5'/%3E%3Crect x='14' y='12' width='7' height='9' rx='1.5'/%3E%3Crect x='3' y='16' width='7' height='5' rx='1.5'/%3E%3C/svg%3E")}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a:nth-child(2)::before{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20c.8-3.6 3.4-5.5 6.5-5.5s5.7 1.9 6.5 5.5'/%3E%3Cpath d='M16 4.5a3.5 3.5 0 010 7'/%3E%3Cpath d='M18 14.7c2 .7 3.2 2.4 3.6 5.3'/%3E%3C/svg%3E")}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a:hover{transform:translateY(-3px);box-shadow:0 16px 28px -16px rgba(var(--mr),.95)!important}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a.on{color:#fff!important;border-color:transparent!important;background:linear-gradient(135deg,rgba(var(--mr),1) 0%,#4f46e5 55%,rgba(var(--mr),.85) 100%)!important;background-size:220% 220%!important;animation:kpiIn .5s cubic-bezier(.2,.8,.2,1) both,lgDrift 6s ease-in-out infinite alternate,lgGlow 2.6s ease-in-out infinite}
html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a.on::after{content:"";position:absolute;top:-25%;bottom:-25%;left:0;width:30%;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);animation:lgShine 4.5s ease-in-out infinite}
html[data-shell="app"] main .chips.ledger-months{display:grid!important;grid-template-columns:1.6fr repeat(12,minmax(0,1fr));gap:9px!important;margin:0 0 14px!important}
html[data-shell="app"] main .chips.ledger-months > a{--mr:79,70,229;position:relative;overflow:hidden;isolation:isolate;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:58px;margin:0!important;padding:8px 4px!important;border-radius:15px!important;font:800 15px/1 "Space Grotesk",sans-serif!important;text-decoration:none!important;color:rgb(var(--mr))!important;background:linear-gradient(160deg,rgba(var(--mr),.15),rgba(var(--mr),.04))!important;border:1px solid rgba(var(--mr),.30)!important;box-shadow:0 8px 18px -16px rgba(var(--mr),.9)!important;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease;animation:kpiIn .45s cubic-bezier(.2,.8,.2,1) both}
html[data-shell="app"] main .chips.ledger-months > a::after{content:"";width:6px;height:6px;border-radius:50%;background:rgb(var(--mr));animation:lgDot 2.4s ease-out infinite}
html[data-shell="app"] main .chips.ledger-months > a:nth-child(2){--mr:2,132,199;animation-delay:.03s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(3){--mr:8,145,178;animation-delay:.06s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(4){--mr:13,148,136;animation-delay:.09s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(5){--mr:5,150,105;animation-delay:.12s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(6){--mr:22,163,74;animation-delay:.15s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(7){--mr:202,138,4;animation-delay:.18s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(8){--mr:37,99,235;animation-delay:.21s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(9){--mr:79,70,229;animation-delay:.24s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(10){--mr:124,58,237;animation-delay:.27s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(11){--mr:147,51,234;animation-delay:.3s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(12){--mr:71,85,105;animation-delay:.33s}html[data-shell="app"] main .chips.ledger-months > a:nth-child(13){--mr:14,116,144;animation-delay:.36s}
html[data-shell="app"] main .chips.ledger-months > a:hover{transform:translateY(-3px);box-shadow:0 14px 24px -14px rgba(var(--mr),.95)!important}
html[data-shell="app"] main .chips.ledger-months > a.lg-future{opacity:.45}
html[data-shell="app"] main .chips.ledger-months > a.lg-future::after{animation:none;opacity:.4}
html[data-shell="app"] main .chips.ledger-months > a.lg-now{border-width:2px!important}
html[data-shell="app"] main .chips.ledger-months.ledger-months > a.on{color:#fff!important;border-color:transparent!important;opacity:1;background:linear-gradient(135deg,rgba(var(--mr),1) 0%,rgba(var(--mr),.78) 60%,rgba(var(--mr),1) 100%)!important;background-size:220% 220%!important;animation:kpiIn .45s cubic-bezier(.2,.8,.2,1) both,lgDrift 5s ease-in-out infinite alternate,lgGlow 2.4s ease-in-out infinite}
html[data-shell="app"] main .chips.ledger-months.ledger-months > a.on::after{background:#fff;animation:kpiPulse 2.4s ease-out infinite}
html[data-shell="app"] main .chips.ledger-months.ledger-months > a.on::before{content:"";position:absolute;top:-25%;bottom:-25%;left:0;width:40%;z-index:-1;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);animation:lgShine 4s ease-in-out infinite}
html[data-shell="app"] main .ledger-period{font-size:13.5px!important;margin:0 0 14px!important}
html[data-shell="app"][data-theme="nova"] main .chips.ledger-months > a:not(.on),html[data-shell="app"][data-theme="dark"] main .chips.ledger-months > a:not(.on),html[data-shell="app"][data-theme="nova"] main .chips:has(> a[href$="/ledger/traders"]) > a:not(.on),html[data-shell="app"][data-theme="dark"] main .chips:has(> a[href$="/ledger/traders"]) > a:not(.on){color:color-mix(in srgb,rgb(var(--mr)) 55%,#fff)!important}
@media (max-width:1100px){html[data-shell="app"] main .chips.ledger-months{grid-template-columns:repeat(7,minmax(0,1fr))}}
@media (max-width:640px){html[data-shell="app"] main .chips.ledger-months{grid-template-columns:repeat(4,minmax(0,1fr))}html[data-shell="app"] main .chips.ledger-months > a:first-child{grid-column:1 / -1}html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a{min-height:52px;font-size:15px!important}}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .chips.ledger-months > a,html[data-shell="app"] main .chips.ledger-months > a::before,html[data-shell="app"] main .chips.ledger-months > a::after,html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a,html[data-shell="app"] main .chips:has(> a[href$="/ledger/traders"]) > a::after{animation:none!important}}

/* ===== Ledger: payout and expense entries as small cards (2 Oct 2026) ===== */
html[data-shell="app"] main .lg-list{--lr:5,150,105}
html[data-shell="app"] main .lg-list.lg-exp{--lr:124,58,237}
html[data-shell="app"] main .lg-list > .rowline.lg-row{position:relative;align-items:center!important;gap:12px;margin:0 0 9px!important;padding:11px 14px 11px 16px!important;border-radius:14px;border:1px solid rgba(var(--lr),.18)!important;background:linear-gradient(90deg,rgba(var(--lr),.07),rgba(var(--lr),.015) 70%)!important;transition:transform .18s ease,box-shadow .18s ease}
html[data-shell="app"] main .lg-list > .rowline.lg-row::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:0 4px 4px 0;background:rgb(var(--lr))}
html[data-shell="app"] main .lg-list > .rowline.lg-row:hover{transform:translateY(-2px);box-shadow:0 12px 24px -18px rgba(var(--lr),.9)}
html[data-shell="app"] main .lg-pay > .rowline.lg-st-pending{--lr:202,138,4}
html[data-shell="app"] main .lg-l{display:flex;align-items:center;gap:12px;min-width:0}
html[data-shell="app"] main .lg-av,html[data-shell="app"] main .lg-ic{flex:none;width:40px;height:40px;border-radius:12px;display:inline-grid;place-items:center;font:700 14px/1 "Space Grotesk",sans-serif;color:#fff;background:linear-gradient(135deg,rgb(var(--lr)),rgba(var(--lr),.55));box-shadow:0 8px 16px -9px rgba(var(--lr),.95)}
html[data-shell="app"] main .lg-ic::before{content:"";width:20px;height:20px;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-3-2-3 2-3-2-3 2z'/%3E%3Cpath d='M9 8h6M9 12h6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12v18l-3-2-3 2-3-2-3 2z'/%3E%3Cpath d='M9 8h6M9 12h6'/%3E%3C/svg%3E") center/contain no-repeat}
html[data-shell="app"] main .lg-ic.lg-ic-buy::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2 3h3l2.6 12.2a1 1 0 001 .8h9.7a1 1 0 001-.8L21 7H6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1.4'/%3E%3Ccircle cx='18' cy='20' r='1.4'/%3E%3Cpath d='M2 3h3l2.6 12.2a1 1 0 001 .8h9.7a1 1 0 001-.8L21 7H6'/%3E%3C/svg%3E")}
html[data-shell="app"] main .lg-main{min-width:0;display:flex;flex-direction:column;gap:6px}
html[data-shell="app"] main .lg-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
html[data-shell="app"] main .lg-top > strong{font-size:16px;font-weight:800}
html[data-shell="app"] main .lg-logo{height:24px;width:auto;border-radius:7px;box-shadow:0 4px 10px -6px rgba(2,6,23,.7)}
html[data-shell="app"] main .lg-firm{padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700;background:rgba(var(--lr),.12);color:rgb(var(--lr));border:1px solid rgba(var(--lr),.25)}
html[data-shell="app"] main .lg-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
html[data-shell="app"] main .lg-chips > span{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:8px;font-size:11.5px;font-weight:600;line-height:1.3;background:rgba(100,116,139,.09);border:1px solid rgba(100,116,139,.18)}
html[data-shell="app"] main .lg-chips > .lg-date::before{content:"";width:11px;height:11px;background:currentColor;opacity:.75;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") center/contain no-repeat}
html[data-shell="app"] main .lg-chips > .lg-st{font-weight:800;background:rgba(var(--lr),.14);border-color:rgba(var(--lr),.35);color:rgb(var(--lr))}
html[data-shell="app"] main .lg-chips > .lg-st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
html[data-shell="app"] main .lg-chips > .lg-rev{font-weight:700;background:rgba(37,99,235,.09);border-color:rgba(37,99,235,.25);color:#2563eb}
html[data-shell="app"] main .lg-note{font-size:12px;opacity:.8;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
html[data-shell="app"] main .lg-fr{padding:2px 8px;border-radius:999px;font-size:11px;font-weight:800;background:rgba(var(--lr),.12);color:rgb(var(--lr));border:1px solid rgba(var(--lr),.3)}
html[data-shell="app"] main .lg-r{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
html[data-shell="app"] main .lg-amt{font:800 19px/1 "Space Grotesk",sans-serif;color:rgb(var(--lr));font-variant-numeric:tabular-nums}
html[data-shell="app"] main .lg-r details.edit > summary{list-style:none;cursor:pointer;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:700;color:rgb(var(--lr))!important;background:rgba(var(--lr),.10);border:1px solid rgba(var(--lr),.3)}
html[data-shell="app"] main .lg-r details.edit > summary::-webkit-details-marker{display:none}
html[data-shell="app"] main .lg-r details.edit[open] > summary{background:rgb(var(--lr));color:#fff!important}
html[data-shell="app"][data-theme="nova"] main .lg-amt,html[data-shell="app"][data-theme="dark"] main .lg-amt,html[data-shell="app"][data-theme="nova"] main .lg-chips > .lg-st,html[data-shell="app"][data-theme="dark"] main .lg-chips > .lg-st,html[data-shell="app"][data-theme="nova"] main .lg-fr,html[data-shell="app"][data-theme="dark"] main .lg-fr,html[data-shell="app"][data-theme="nova"] main .lg-firm,html[data-shell="app"][data-theme="dark"] main .lg-firm,html[data-shell="app"][data-theme="nova"] main .lg-r details.edit > summary,html[data-shell="app"][data-theme="dark"] main .lg-r details.edit > summary{color:color-mix(in srgb,rgb(var(--lr)) 50%,#fff)!important}
html[data-shell="app"][data-theme="nova"] main .lg-chips > .lg-rev,html[data-shell="app"][data-theme="dark"] main .lg-chips > .lg-rev{color:#93c5fd}

/* Ledger: an opened Edit gets the whole row, fields in a tidy grid */
html[data-shell="app"] main .lg-list > .rowline.lg-row:has(details.edit[open]){flex-wrap:wrap}
html[data-shell="app"] main .lg-list > .rowline.lg-row:has(details.edit[open]) > .lg-r{flex-basis:100%;align-items:stretch}
html[data-shell="app"] main .lg-r details.edit[open] > summary{align-self:flex-end;width:max-content;margin-left:auto}
html[data-shell="app"] main .lg-r details.edit > form{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px 12px;margin-top:10px;padding:12px;border-radius:12px;background:rgba(var(--lr),.06);border:1px dashed rgba(var(--lr),.3)}
html[data-shell="app"] main .lg-r details.edit > form label{display:flex;flex-direction:column;gap:4px;font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.85}
html[data-shell="app"] main .lg-r details.edit > form input,html[data-shell="app"] main .lg-r details.edit > form select{border-radius:10px!important;min-height:38px;font-size:13.5px;text-transform:none;letter-spacing:0}
html[data-shell="app"] main .lg-r details.edit > form button{align-self:end;min-height:38px;border-radius:10px!important}
/* ===== Daily Closing: funded accounts that went Live (2 Oct 2026) ===== */
html[data-shell="app"] main .clp-live{--lv:13,148,136}
html[data-shell="app"] main .clp-live > h2{display:flex;align-items:center;gap:10px}
html[data-shell="app"] main .clp-live > h2::before{content:"";width:10px;height:10px;border-radius:50%;background:rgb(var(--lv));box-shadow:0 0 0 0 rgba(var(--lv),.5);animation:lgDot 2.4s ease-out infinite;--mr:var(--lv)}
html[data-shell="app"] main .clp-lv-tiles{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px!important;margin:12px 0 6px!important}
html[data-shell="app"] main .clp-lv-tiles .stat.clp-lv{--c:13,148,136;position:relative;overflow:hidden;padding:18px 20px!important;border-radius:18px!important;border:1px solid rgba(var(--c),.30)!important;
  background:linear-gradient(150deg,rgba(var(--c),.16),rgba(var(--c),.04))!important;box-shadow:0 14px 28px -20px rgba(var(--c),.95)!important;animation:kpiIn .5s cubic-bezier(.2,.8,.2,1) both}
html[data-shell="app"] main .clp-lv-tiles .stat.clp-lv::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:rgb(var(--c))}
html[data-shell="app"] main .clp-lv-tiles .stat.lv-all{--c:37,99,235}
html[data-shell="app"] main .clp-lv-tiles .stat.lv-on{--c:5,150,105;animation-delay:.06s}
html[data-shell="app"] main .clp-lv-tiles .stat.lv-br{--c:225,29,72;animation-delay:.12s}
html[data-shell="app"] main .clp-lv-tiles .stat.clp-lv > span{font-size:12px!important;font-weight:800!important;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--c))!important}
html[data-shell="app"] main .clp-lv-tiles .stat.clp-lv > strong{display:block;font:800 40px/1.05 "Space Grotesk",sans-serif!important;margin:6px 0 4px;color:rgb(var(--c))!important;font-variant-numeric:tabular-nums}
html[data-shell="app"] main .clp-live td strong{text-transform:capitalize}
html[data-shell="app"] main .clp-live .lv-ok{font-weight:800;color:#047857}
html[data-shell="app"] main .clp-live .lv-bad{font-weight:800;color:#be123c}
html[data-shell="app"] main .clp-live .lv-tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:800}
html[data-shell="app"] main .clp-live .lv-tag::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
html[data-shell="app"] main .clp-live .lv-tag-on{background:rgba(16,185,129,.12);color:#047857;border:1px solid rgba(16,185,129,.35)}
html[data-shell="app"] main .clp-live .lv-tag-br{background:rgba(225,29,72,.10);color:#be123c;border:1px solid rgba(225,29,72,.32)}
html[data-shell="app"] main .clp-lv-grid{gap:16px!important;align-items:start}
html[data-shell="app"][data-theme="nova"] main .clp-lv-tiles .stat.clp-lv > span,html[data-shell="app"][data-theme="dark"] main .clp-lv-tiles .stat.clp-lv > span,
html[data-shell="app"][data-theme="nova"] main .clp-lv-tiles .stat.clp-lv > strong,html[data-shell="app"][data-theme="dark"] main .clp-lv-tiles .stat.clp-lv > strong{color:color-mix(in srgb,rgb(var(--c)) 50%,#fff)!important}
html[data-shell="app"][data-theme="nova"] main .clp-live .lv-ok,html[data-shell="app"][data-theme="dark"] main .clp-live .lv-ok,html[data-shell="app"][data-theme="nova"] main .clp-live .lv-tag-on,html[data-shell="app"][data-theme="dark"] main .clp-live .lv-tag-on{color:#a7f3d0}
html[data-shell="app"][data-theme="nova"] main .clp-live .lv-bad,html[data-shell="app"][data-theme="dark"] main .clp-live .lv-bad,html[data-shell="app"][data-theme="nova"] main .clp-live .lv-tag-br,html[data-shell="app"][data-theme="dark"] main .clp-live .lv-tag-br{color:#fda4af}
@media (max-width:760px){html[data-shell="app"] main .clp-lv-tiles{grid-template-columns:1fr}html[data-shell="app"] main .clp-lv-tiles .stat.clp-lv > strong{font-size:32px!important}}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] main .clp-lv-tiles .stat.clp-lv,html[data-shell="app"] main .clp-live > h2::before{animation:none!important}}
/* went Live tiles win over the page accent */
html[data-shell="app"] main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]){background:linear-gradient(150deg,rgba(var(--c),.18),rgba(var(--c),.05))!important;border:1px solid rgba(var(--c),.34)!important;box-shadow:0 14px 28px -20px rgba(var(--c),.95)!important;color:inherit!important}
html[data-shell="app"] main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > strong{font:800 40px/1.05 "Space Grotesk",sans-serif!important;color:rgb(var(--c))!important;-webkit-text-fill-color:currentColor!important;background:none!important}
html[data-shell="app"] main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > span{color:rgb(var(--c))!important}
html[data-shell="app"] main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > .muted{color:inherit!important;opacity:.75}
html[data-shell="app"][data-theme="nova"]  main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > strong,html[data-shell="app"][data-theme="dark"]  main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > strong,html[data-shell="app"][data-theme="nova"]  main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > span,html[data-shell="app"][data-theme="dark"]  main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > span{color:color-mix(in srgb,rgb(var(--c)) 45%,#fff)!important}
@media (max-width:760px){html[data-shell="app"] main .stats.clp-lv-tiles.clp-lv-tiles > .stat.clp-lv.clp-lv:not([class*="c-"]):not([class*=" g-"]) > strong{font-size:32px!important}}
/* ===== In-place saves on Trade Ideas: toast, saving state, highlight (5 Oct 2026) ===== */
@keyframes fxToastIn{from{opacity:0;transform:translate(-50%,-14px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes fxPulse{0%{box-shadow:0 0 0 0 rgba(16,185,129,.55)}100%{box-shadow:0 0 0 14px rgba(16,185,129,0)}}
@keyframes fxSpin{to{transform:rotate(360deg)}}
html[data-shell="app"] main .flash.fx-toast{position:fixed!important;top:18px;left:50%;transform:translateX(-50%);z-index:9999;margin:0!important;max-width:min(640px,calc(100vw - 32px));
  padding:13px 20px!important;border-radius:14px!important;font-weight:700;box-shadow:0 18px 40px -14px rgba(2,6,23,.55)!important;cursor:pointer;animation:fxToastIn .3s ease both;transition:opacity .4s ease,transform .4s ease}
html[data-shell="app"] main .flash.fx-toast.fx-gone{opacity:0;transform:translate(-50%,-14px);pointer-events:none}
html[data-shell="app"] main .tradecard.fx-pulse,html[data-shell="app"] main .card.fx-pulse{animation:fxPulse 1.1s ease-out 2}
html[data-shell="app"] main button.fx-wait{position:relative;opacity:.75;cursor:progress!important}
html[data-shell="app"] main button.fx-wait::after{content:"";display:inline-block;width:11px;height:11px;margin-left:8px;vertical-align:-1px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:fxSpin .7s linear infinite}
html.fx-saving,html.fx-saving *{cursor:progress}
/* ===== Trade Ideas header: trade number + status on the right, reference (TI-...) in the middle (5 Oct 2026) ===== */
html[data-shell="app"] main .tradecard > .rowline.ti-head > .ti-mid{grid-column:3!important;grid-row:1;justify-self:end;justify-content:flex-end!important}
html[data-shell="app"] main .tradecard > .rowline.ti-head > :nth-child(2){grid-column:2!important;grid-row:1;justify-self:center!important;
  padding:4px 12px;border-radius:999px;font:700 12px/1.2 "Space Grotesk",sans-serif!important;letter-spacing:.04em;opacity:1!important;
  background:rgba(100,116,139,.10);border:1px solid rgba(100,116,139,.22)}
/* ===== Trade Ideas: profitable days on each Live side (5 Oct 2026) ===== */
html[data-shell="app"] main .tradeline .tdays{display:inline-flex;align-items:center;gap:7px;margin-top:7px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.2;
  color:#0f766e;background:rgba(13,148,136,.10);border:1px solid rgba(13,148,136,.32)}
html[data-shell="app"] main .tradeline .tdays b{font:800 14px/1 "Space Grotesk",sans-serif}
html[data-shell="app"] main .tradeline .tdays i{display:inline-block;width:56px;height:6px;border-radius:99px;background:rgba(13,148,136,.18);overflow:hidden}
html[data-shell="app"] main .tradeline .tdays u{display:block;height:100%;border-radius:99px;text-decoration:none;background:linear-gradient(90deg,#2dd4bf,#0d9488)}
html[data-shell="app"] main .tradeline .tdays.full{color:#047857;background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.4)}
html[data-shell="app"] main .tradeline .tdays.full u{background:linear-gradient(90deg,#34d399,#059669)}
html[data-shell="app"] main .tradeline .tside.right .tdays{flex-direction:row-reverse}
html[data-shell="app"][data-theme="nova"] main .tradeline .tdays,html[data-shell="app"][data-theme="dark"] main .tradeline .tdays{color:#99f6e4}
html[data-shell="app"][data-theme="nova"] main .tradeline .tdays.full,html[data-shell="app"][data-theme="dark"] main .tradeline .tdays.full{color:#a7f3d0}
/* ===== Trade Ideas header: trade number + status moved to the LEFT (5 Oct 2026, replaces the right-side placement) ===== */
html[data-shell="app"] main .tradecard > .rowline.ti-head > .ti-mid{grid-column:1!important;justify-self:start!important;justify-content:flex-start!important}
/* ===== Payouts: Ready payouts - copy & paste cards (5 Oct 2026) ===== */
html[data-shell="app"] main .card.prdy{--pr:5,150,105;border:1px solid rgba(var(--pr),.30)!important;background-image:linear-gradient(160deg,rgba(var(--pr),.10),rgba(var(--pr),.02) 60%)!important}
html[data-shell="app"] main .card.prdy > .rowline h2{display:flex;align-items:center;gap:10px}
html[data-shell="app"] main .card.prdy > .rowline h2::before{content:"";width:10px;height:10px;border-radius:50%;background:rgb(var(--pr));box-shadow:0 0 0 4px rgba(var(--pr),.18)}
html[data-shell="app"] main .prdy-top{display:flex;justify-content:flex-end;margin:4px 0 12px}
html[data-shell="app"] main .prdy-top{gap:10px;flex-wrap:wrap}
html[data-shell="app"] main .prdy-group{background:linear-gradient(135deg,#25d366,#128c7e)!important;color:#fff!important;border:0!important;font-weight:800!important}
html[data-shell="app"] main .prdy-groupall{padding:10px 20px!important;border-radius:12px!important;box-shadow:0 10px 22px -12px rgba(18,140,126,.9)!important}
html[data-shell="app"] main .prdy-copyall{padding:10px 20px!important;border-radius:12px!important;font-weight:800!important;color:#fff!important;border:0!important;
  background:linear-gradient(135deg,#059669,#0d9488)!important;box-shadow:0 10px 22px -12px rgba(5,150,105,.9)!important}
html[data-shell="app"] main .prdy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
html[data-shell="app"] main .prdy-row{position:relative;padding:14px 16px 14px 20px;border-radius:16px;border:1px solid rgba(var(--pr),.24);background:rgba(var(--pr),.05);overflow:hidden}
html[data-shell="app"] main .prdy-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#34d399,#059669)}
html[data-shell="app"] main .prdy-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
html[data-shell="app"] main .prdy-name{font-size:17px;font-weight:800;text-transform:capitalize}
html[data-shell="app"] main .prdy-logo{height:24px;width:auto;border-radius:7px}
html[data-shell="app"] main .prdy-firm,html[data-shell="app"] main .prdy-chip{padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700;background:rgba(100,116,139,.10);border:1px solid rgba(100,116,139,.22)}
html[data-shell="app"] main .prdy-chip.prdy-days{margin-left:auto;color:#047857;background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.38)}
html[data-shell="app"] main .prdy-nums{display:flex;gap:16px;margin:10px 0 8px;font-size:12.5px}
html[data-shell="app"] main .prdy-nums b{font:800 16px/1 "Space Grotesk",sans-serif;margin-left:4px}
html[data-shell="app"] main .prdy-up{color:#047857}
html[data-shell="app"] main .prdy-dn{color:#be123c}
html[data-shell="app"] main textarea.prdy-text{width:100%;min-height:170px;font:500 12px/1.45 ui-monospace,Menlo,Consolas,monospace!important;border-radius:12px!important;resize:vertical;white-space:pre-wrap}
html[data-shell="app"] main .prdy-act{display:flex;gap:8px;margin-top:8px}
html[data-shell="app"] main .prdy-act button{white-space:nowrap;border-radius:10px!important;min-height:34px;padding:0 16px!important;font-weight:700!important}
html[data-shell="app"] main button.prdy-ok{background:#059669!important;border-color:#059669!important;color:#fff!important}
html[data-shell="app"][data-theme="nova"] main .prdy-up,html[data-shell="app"][data-theme="dark"] main .prdy-up,html[data-shell="app"][data-theme="nova"] main .prdy-chip.prdy-days,html[data-shell="app"][data-theme="dark"] main .prdy-chip.prdy-days{color:#a7f3d0}
html[data-shell="app"][data-theme="nova"] main .prdy-dn,html[data-shell="app"][data-theme="dark"] main .prdy-dn{color:#fda4af}
@media (max-width:640px){html[data-shell="app"] main .prdy-grid{grid-template-columns:1fr}}
/* ===== Accounts: Fresh Live copy & paste list (6 Oct 2026) - reuses the Ready payouts card styles ===== */
html[data-shell="app"] main .card.prdy.frl{--pr:124,58,237;margin:0 0 16px!important}
html[data-shell="app"] main .card.prdy.frl .prdy-row::before{background:linear-gradient(180deg,#a78bfa,#7c3aed)}
html[data-shell="app"] main .frl-top{justify-content:space-between!important;align-items:center}
html[data-shell="app"] main .frl-chips{display:flex;flex-wrap:wrap;gap:6px}
html[data-shell="app"] main .frl-chips .prdy-chip b{margin-left:4px}
html[data-shell="app"] main .card.prdy.frl .prdy-copyall{background:linear-gradient(135deg,#7c3aed,#4f46e5)!important;box-shadow:0 10px 22px -12px rgba(124,58,237,.9)!important}
/* ===== Refresh button: side + sidebar (6 Oct 2026) ===== */
@keyframes fxSpinR{to{transform:rotate(360deg)}}
html[data-shell="app"] .jumpnav .jumpbtn.fx-refresh{font-size:20px;font-weight:800;background:linear-gradient(135deg,#6366f1,#06b6d4)!important;color:#fff!important;border-color:transparent!important}
html[data-shell="app"] .jumpnav .jumpbtn.fx-refresh.fx-spin{animation:fxSpinR .8s linear infinite}
html[data-shell="app"] aside.sidebar nav a.fx-refresh-nav{display:flex;align-items:center;gap:10px;margin:14px 10px 6px;padding:10px 14px;border-radius:12px;font-weight:800;text-decoration:none;
  color:#fff!important;background:linear-gradient(135deg,#6366f1,#06b6d4);box-shadow:0 10px 20px -12px rgba(79,70,229,.9)}
html[data-shell="app"] aside.sidebar nav a.fx-refresh-nav:hover{filter:brightness(1.08)}
html[data-shell="app"] aside.sidebar nav a.fx-refresh-nav .fx-rf-ic{font-size:17px;line-height:1;display:inline-block}
html[data-shell="app"] aside.sidebar nav a.fx-refresh-nav.fx-spin .fx-rf-ic{animation:fxSpinR .8s linear infinite}
@media (prefers-reduced-motion: reduce){html[data-shell="app"] .fx-spin,html[data-shell="app"] .fx-spin .fx-rf-ic{animation:none!important}}
/* ===== Accounts: Split row (7 Oct 2026) ===== */
html[data-shell="app"] main .acct-actions details.splitbox{order:30}
html[data-shell="app"] main .acct-actions details.splitbox[open]{flex:0 0 100%}
html[data-shell="app"] main details.splitbox > summary.splitbtn{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 15px;border-radius:10px;font-weight:700;font-size:13.5px;
  color:#7c3aed;background:rgba(124,58,237,.08);border:1px solid rgba(124,58,237,.35);transition:all .18s ease}
html[data-shell="app"] main details.splitbox > summary.splitbtn::-webkit-details-marker{display:none}
html[data-shell="app"] main details.splitbox > summary.splitbtn::before{content:"\2702";font-size:13px}
html[data-shell="app"] main details.splitbox > summary.splitbtn:hover,html[data-shell="app"] main details.splitbox[open] > summary.splitbtn{background:#7c3aed;color:#fff;border-color:#7c3aed}
html[data-shell="app"] main details.splitbox > form.splitform{box-sizing:border-box;margin:10px 0 0!important;padding:14px 16px;border-radius:14px;border:1px dashed rgba(124,58,237,.45);background:rgba(124,58,237,.06)}
html[data-shell="app"] main .split-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px}
html[data-shell="app"] main .split-grid label{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;opacity:.85;display:flex;flex-direction:column;gap:5px}
html[data-shell="app"] main .split-grid label.wide{grid-column:1 / -1}
html[data-shell="app"] main .split-grid input{border-radius:11px!important;min-height:40px;font-size:14px!important;text-transform:none;letter-spacing:0;font-weight:600}
html[data-shell="app"] main .split-grid input.bad{border-color:#e11d48!important;box-shadow:0 0 0 3px rgba(225,29,72,.18)!important}
html[data-shell="app"] main .split-sum{margin:10px 0!important}
html[data-shell="app"] main .split-sum b{font-weight:800}
html[data-shell="app"] main .split-sum .sp-keep,html[data-shell="app"] main .split-sum .sp-move{display:inline-block;min-width:22px;padding:1px 7px;border-radius:7px;text-align:center;background:rgba(124,58,237,.14);color:#6d28d9}
html[data-shell="app"] main button.split-go{border-radius:11px!important;min-height:38px;padding:0 20px!important;font-weight:800!important;color:#fff!important;border:0!important;background:linear-gradient(135deg,#7c3aed,#4f46e5)!important}
html[data-shell="app"][data-theme="nova"] main details.splitbox > summary.splitbtn,html[data-shell="app"][data-theme="dark"] main details.splitbox > summary.splitbtn{color:#c4b5fd}
html[data-shell="app"][data-theme="nova"] main .split-sum .sp-keep,html[data-shell="app"][data-theme="dark"] main .split-sum .sp-keep,html[data-shell="app"][data-theme="nova"] main .split-sum .sp-move,html[data-shell="app"][data-theme="dark"] main .split-sum .sp-move{color:#ddd6fe}
@media (max-width:640px){html[data-shell="app"] main .split-grid{grid-template-columns:1fr}}
/* ===== Trade Ideas: trader's country right next to the name (7 Oct 2026) ===== */
html[data-shell="app"] main .tradeline .tname .tctry{display:inline-block;vertical-align:middle;margin-left:6px;padding:2px 9px;border-radius:999px;font:700 11px/1.3 "Plus Jakarta Sans",sans-serif;letter-spacing:.02em;
  color:#0369a1;background:rgba(14,165,233,.12);border:1px solid rgba(14,165,233,.35);-webkit-text-fill-color:currentColor}
html[data-shell="app"][data-theme="nova"] main .tradeline .tname .tctry,html[data-shell="app"][data-theme="dark"] main .tradeline .tname .tctry{color:#7dd3fc}
/* ===== Speed (7 Oct 2026): no colour-fade storm while a page loads, long lists only draw what is on screen ===== */
html[data-shell="app"]:not(.fx-ready) *,html[data-shell="app"]:not(.fx-ready) *::before,html[data-shell="app"]:not(.fx-ready) *::after{transition:none!important}
html[data-shell="app"] main .card.acct,html[data-shell="app"] main .tradecard,html[data-shell="app"] main .prdy-row,html[data-shell="app"] main .lg-list > .rowline.lg-row{content-visibility:auto}
html[data-shell="app"] main .card.acct{contain-intrinsic-size:auto 430px}
html[data-shell="app"] main .tradecard{contain-intrinsic-size:auto 300px}
html[data-shell="app"] main .prdy-row{contain-intrinsic-size:auto 330px}
html[data-shell="app"] main .lg-list > .rowline.lg-row{contain-intrinsic-size:auto 76px}
/* ===== Payouts: firm logos (7 Oct 2026) ===== */
html[data-shell="app"] main .pay-logo{height:24px;width:auto;vertical-align:middle;margin:0 4px;border-radius:7px;box-shadow:0 4px 10px -6px rgba(2,6,23,.7)}
html[data-shell="app"] main .pay-firm{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700;background:rgba(100,116,139,.12);border:1px solid rgba(100,116,139,.25)}
/* ===== Trade Ideas: every word on a trade card 2px bigger (7 Oct 2026) ===== */
html[data-shell="app"] main .tradecard .ti-head .tno{font-size:28px!important}
html[data-shell="app"] main .tradecard .ti-head .badge{font-size:14px!important}
html[data-shell="app"] main .tradecard .ti-head > :nth-child(2){font-size:14px!important}
html[data-shell="app"] main .tradecard .tname{font-size:26px!important}
html[data-shell="app"] main .tradecard .tname .tctry{font-size:13px!important}
html[data-shell="app"] main .tradecard .tcount b{font-size:24px!important}
html[data-shell="app"] main .tradecard .tcount span{font-size:13px!important}
html[data-shell="app"] main .tradecard .tmeta{font-size:14px!important}
html[data-shell="app"] main .tradecard .tdays{font-size:14px!important}
html[data-shell="app"] main .tradecard .tdays b{font-size:16px!important}
html[data-shell="app"] main .tradecard .tphase{font-size:11px!important}
html[data-shell="app"] main .tradecard .tvs-core{font-size:26px!important}
html[data-shell="app"] main .tradecard .ti-actions button,html[data-shell="app"] main .tradecard .editwrap button{font-size:16px!important}
html[data-shell="app"] main .tradecard .donetag{font-size:13.5px!important}
html[data-shell="app"] main .tradecard details.edit > summary{font-size:15px!important}
html[data-shell="app"] main .tradecard .tparams,html[data-shell="app"] main .tradecard .tsum,html[data-shell="app"] main .tradecard .lossbanner{font-size:15px!important}
html[data-shell="app"] main .tradecard .legbox,html[data-shell="app"] main .tradecard .legbox .muted{font-size:15px!important}

/* ===== Trade Ideas "Arena" look (7 Oct 2026) ===== */
html[data-shell="app"] main .tradecard{--ph:#a78bfa;--phs:167,139,250;--ink:#f8fafc;--sub:#cbd5e1;--plate:rgba(255,255,255,.04);--line:rgba(255,255,255,.09);position:relative;overflow:hidden;border-radius:18px!important;border:1px solid rgba(var(--phs),.35)!important;background:linear-gradient(180deg,rgba(var(--phs),.10),rgba(15,20,32,.96) 38%) ,#0d1220!important;box-shadow:0 10px 30px -12px rgba(var(--phs),.45),inset 0 1px 0 rgba(255,255,255,.06)!important;padding:0 0 12px!important;margin-bottom:18px!important}
html[data-shell="app"] main .tradecard:has(.ph-p1){--ph:#38bdf8;--phs:56,189,248}
html[data-shell="app"] main .tradecard:has(.ph-p2){--ph:#a78bfa;--phs:167,139,250}
html[data-shell="app"] main .tradecard:has(.ph-live){--ph:#2dd4bf;--phs:45,212,191}
html[data-shell="app"] main .tradecard:has(.ph-fresh){--ph:#fbbf24;--phs:251,191,36}
html[data-shell="app"] main .tradecard::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,transparent,var(--ph) 20%,var(--ph) 80%,transparent);box-shadow:0 0 18px 2px rgba(var(--phs),.7);z-index:2}
html[data-shell="app"] main .tradecard .ti-head{padding:16px 18px 6px!important;border:0!important;align-items:center}
html[data-shell="app"] main .tradecard .tno{display:inline-flex;align-items:center;gap:2px;padding:4px 14px 4px 12px;border-radius:10px;font-size:24px!important;font-weight:900;letter-spacing:.5px;background:var(--ph)!important;color:#0b1020!important;-webkit-text-fill-color:#0b1020!important;box-shadow:0 6px 18px -6px rgba(var(--phs),.9);clip-path:polygon(0 0,100% 0,100% 30%,94% 50%,100% 70%,100% 100%,0 100%)}
html[data-shell="app"] main .tradecard .badge{font-size:13px!important;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:5px 12px!important;border-radius:999px!important}
html[data-shell="app"] main .tradecard .badge.ti-generated{color:#fde68a!important;background:rgba(251,191,36,.14)!important;border:1px solid rgba(251,191,36,.55)!important}
html[data-shell="app"] main .tradecard .badge.ti-completed{color:#bbf7d0!important;background:rgba(34,197,94,.16)!important;border:1px solid rgba(74,222,128,.55)!important}
html[data-shell="app"] main .tradecard .ti-head > :nth-child(2){font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;font-size:12.5px!important;letter-spacing:1px;color:var(--sub)!important;background:var(--plate)!important;border:1px dashed var(--line)!important;padding:4px 12px!important;border-radius:8px!important}
html[data-shell="app"] main .tradecard .tradeline{position:relative;margin:8px 14px 4px!important;padding:18px 18px!important;border-radius:16px!important;border:1px solid var(--line)!important;background:radial-gradient(120% 140% at 0% 50%,rgba(var(--phs),.16),transparent 55%),radial-gradient(120% 140% at 100% 50%,rgba(var(--phs),.16),transparent 55%),var(--plate)!important}
html[data-shell="app"] main .tradecard .tname{color:var(--ink)!important;-webkit-text-fill-color:var(--ink)!important;font-size:28px!important;font-weight:900!important;letter-spacing:-.3px;text-shadow:0 2px 14px rgba(var(--phs),.35);filter:none!important}
html[data-shell="app"] main .tradecard .tctry{font-size:11.5px!important;font-weight:800!important;text-transform:uppercase;letter-spacing:.8px;color:var(--ink)!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.22)!important;padding:3px 9px!important;border-radius:6px!important;vertical-align:middle;text-shadow:none;filter:none!important}
html[data-shell="app"] main .tradecard .tcount{background:transparent!important;border:0!important;padding:0!important;display:inline-flex;align-items:baseline;gap:6px;filter:none!important}
html[data-shell="app"] main .tradecard .tcount b{font-size:34px!important;font-weight:900;line-height:1;color:var(--ph)!important;font-variant-numeric:tabular-nums;text-shadow:0 0 18px rgba(var(--phs),.55)}
html[data-shell="app"] main .tradecard .tcount span{font-size:13px!important;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--sub)!important;opacity:1!important}
html[data-shell="app"] main .tradecard .tmeta{font-size:14px!important;font-weight:600!important;color:var(--sub)!important}
html[data-shell="app"] main .tradecard .tdays{color:var(--ink)!important;background:rgba(45,212,191,.12)!important;border:1px solid rgba(45,212,191,.45)!important;font-weight:700}
html[data-shell="app"] main .tradecard .tdays b{color:#5eead4!important}
html[data-shell="app"] main .tradecard .tlogo{border-radius:14px!important;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 10px 24px -10px rgba(0,0,0,.8)!important}
html[data-shell="app"] main .tradecard .tvs-core{background:radial-gradient(circle at 50% 35%,#1e293b,#05070d 70%)!important;color:#fff!important;font-size:30px!important;font-weight:900;letter-spacing:1px;box-shadow:0 0 0 3px var(--ph),0 0 0 8px rgba(var(--phs),.18),0 0 36px 6px rgba(var(--phs),.55)!important;text-shadow:0 0 12px rgba(var(--phs),.9)}
html[data-shell="app"] main .tradecard .tphase{color:var(--ph)!important;-webkit-text-fill-color:var(--ph)!important;background:none!important;font-size:10.5px!important;font-weight:900!important;letter-spacing:1.2px;opacity:1!important;text-shadow:none}
html[data-shell="app"] main .tradecard .ti-actions,html[data-shell="app"] main .tradecard > .sharebar{padding:10px 14px 0!important;margin-top:6px!important;border-top:1px solid var(--line)}
html[data-shell="app"] main .tradecard .ti-actions button,html[data-shell="app"] main .tradecard > .sharebar button{border-radius:10px!important;font-weight:800!important;letter-spacing:.2px}
html[data-shell="app"] main .tradecard .ti-actions button.secondary,html[data-shell="app"] main .tradecard > .sharebar button.secondary{color:var(--ink)!important;background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.28)!important}
html[data-shell="app"] main .tradecard .donetag{color:var(--ink)!important;font-weight:800}
html[data-shell="app"] main .tradecard details.edit{margin:4px 14px 0!important}
html[data-shell="app"] main .tradecard details.edit > summary{color:#4ade80!important;font-weight:800}
html[data-shell="app"] main .tradecard:has(.ti-completed){border-color:rgba(74,222,128,.45)!important}
html[data-shell="app"] main .tradecard:has(.ti-completed) .tno{background:linear-gradient(135deg,#4ade80,var(--ph))!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard{--ink:#0b1220;--sub:#334155;--plate:#ffffff;--line:rgba(15,23,42,.10);background:linear-gradient(180deg,rgba(var(--phs),.12),#ffffff 40%)!important;box-shadow:0 12px 28px -14px rgba(var(--phs),.55),0 1px 0 rgba(15,23,42,.04)!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard:has(.ph-p1){--ph:#0284c7;--phs:2,132,199}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard:has(.ph-p2){--ph:#7c3aed;--phs:124,58,237}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard:has(.ph-live){--ph:#0d9488;--phs:13,148,136}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard:has(.ph-fresh){--ph:#d97706;--phs:217,119,6}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tno{color:#fff!important;-webkit-text-fill-color:#fff!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tname{text-shadow:none}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tcount b{text-shadow:none}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tctry{background:#f1f5f9!important;border-color:#94a3b8!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .badge.ti-generated{color:#78350f!important;background:#fef3c7!important;border-color:#f59e0b!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .badge.ti-completed{color:#14532d!important;background:#dcfce7!important;border-color:#22c55e!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tdays{background:#ccfbf1!important;border-color:#14b8a6!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tdays b{color:#0f766e!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tlogo{box-shadow:0 8px 20px -10px rgba(15,23,42,.6)!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .ti-actions button.secondary,html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard > .sharebar button.secondary{background:#fff!important;border-color:#94a3b8!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard details.edit > summary{color:#047857!important}
html[data-shell="app"]:is([data-theme="novaday"],[data-theme="light"],[data-theme="warm"]) main .tradecard .tphase{color:#fff!important;-webkit-text-fill-color:#fff!important}

/* ===== Trade Ideas: phase label (P1 / P2 / LIVE / FRESH LIVE TRADE) in place of the TI reference (7 Oct 2026) ===== */
html[data-shell="app"] main .tradecard .ti-head > .ti-phref, html[data-shell="app"] main .tradecard .ti-phref{font-family:inherit!important;font-size:13.5px!important;font-weight:900!important;letter-spacing:1.6px!important;text-transform:uppercase;color:var(--ph)!important;background:rgba(var(--phs),.12)!important;border:1px solid rgba(var(--phs),.55)!important;padding:5px 14px!important;border-radius:999px!important;opacity:1!important}

/* ===== Daily Closing: Account Passing & Investment Results (8 Oct 2026) ===== */
main .pass-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
main .pass-head .pass-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0}
main .pass-tabs a{padding:8px 16px;border-radius:999px;font-weight:800;font-size:14px;text-decoration:none;border:1px solid var(--line,rgba(148,163,184,.35));color:inherit}
main .pass-tabs a.on{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;border-color:transparent;box-shadow:0 6px 16px -6px rgba(99,102,241,.7)}
main .pass-head .pass-pick{margin:0}
main .pass-head .cl-dl.pdf{margin-left:auto}
main .pass-tiles{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
main .pass-tile strong{font-size:28px;font-variant-numeric:tabular-nums}
main .pass-up{color:#16a34a;font-weight:900}
main .pass-down{color:#dc2626;font-weight:900}
main .pass-even{color:#d97706;font-weight:900}
html[data-theme="nova"] main .pass-up{color:#4ade80}
html[data-theme="nova"] main .pass-down{color:#f87171}
html[data-theme="nova"] main .pass-even{color:#fbbf24}
main .pass-t td,main .pass-t th{white-space:nowrap}
main .cl-pass-link{font-weight:800}
main .pass-t tr.pass-total td{border-top:2px solid rgba(148,163,184,.45);font-weight:900;background:rgba(99,102,241,.08)}
main .pass-tile strong.pass-up,main .pass-tile strong.pass-down,main .pass-tile strong.pass-even{font-size:26px;color:#fff!important;display:inline-block!important;width:auto!important;align-self:flex-start;padding:0 12px;border-radius:10px;margin:2px 0}
main .pass-tile strong.pass-up{background:#16a34a}
main .pass-tile strong.pass-down{background:#dc2626}
main .pass-tile strong.pass-even{background:#d97706}
main .pass-dash .rowline{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
main .pass-dash .pass-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0}
main .pass-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
main .pass-chip{padding:6px 12px;border-radius:999px;border:1px solid rgba(148,163,184,.35);font-size:13.5px}
main .pass-card h3.clp-sub{margin-top:18px}