/* ============================================================
   MIZAN X · MARBLE — theme pack (Phase 8)
   White stone ground, lacquer-black editorial ink, engraved gold.
   Drawn from docs/brand/mizanxlogo2-marble.png: cracked porcelain
   stone, a glossy black M, a polished gold blade and gold candles.
   The only light identity — every reskin below is contrast-audited
   (body text >= 4.5:1 against its real ground).
   ============================================================ */

@font-face {
  font-family: "Cormorant Garamond";
  src: url("/fonts/cormorant-600.woff2") format("woff2");
  font-weight: 600;
  font-display: optional;
}

/* ---------- 1 · Tokens ---------------------------------------- */
[data-theme="marble"] {
  /* stone elevations: ground is the darkest stone, panels get whiter */
  --ink-950: #ece7db;
  --ink-900: #f1ede3;
  --ink-850: #f6f3ea;
  --ink-800: #f9f6ef;
  --ink-750: #fdfbf6;
  --line: #cfc8b8;
  --line-soft: rgba(122, 112, 92, 0.34);
  --paper: #14110c; /* lacquer black */
  --paper-soft: #454034;
  --muted: #675f4f; /* 5.1:1 on the stone ground */
  --brass: #7a5817; /* engraved gold, 5.3:1 */
  --brass-soft: #6b4d12; /* deep engraved gold, 6.3:1 */
  --aqua: #16606d;
  --jade: #1d6b45;
  --coral: #a63a2a;
  --warning: #7a5817;
  --focus: #14555e;
  --shadow-1: 0 18px 60px rgba(76, 64, 42, 0.16);
  --shadow-brass: 0 14px 45px rgba(122, 88, 23, 0.16);
  --font-display: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  /* polished gold for CTAs (the blade of the X) */
  --marble-gold-hi: #e9cf8b;
  --marble-gold: #c9992f;
  --marble-gold-deep: #a37a20;
  --marble-card: rgba(255, 255, 255, 0.6);
  --marble-card-border: rgba(96, 86, 66, 0.28);
  --marble-well: rgba(23, 18, 8, 0.05);
  --marble-well-border: rgba(96, 86, 66, 0.24);
  /* live chart (read by LiveTradeChart via getComputedStyle) */
  --chart-bg: #f6f3ea;
  --chart-text: #675f4f;
  --chart-grid: rgba(20, 16, 8, 0.07);
  --chart-line: #cfc8b8;
  --chart-up: #c9992f; /* gold candles */
  --chart-down: #55431c;
  --chart-entry: #7a5817;
  --chart-stop: #a63a2a;
  --chart-target: #1d6b45;
  color-scheme: light;
}
html[data-theme="marble"] {
  background: var(--ink-950);
  color: var(--paper);
  overscroll-behavior-y: none;
}

/* ---------- 2 · The stone itself ------------------------------ */
[data-theme="marble"] body {
  background:
    radial-gradient(
      1300px 760px at 18% -10%,
      rgba(255, 255, 255, 0.85),
      transparent 58%
    ),
    radial-gradient(
      1100px 700px at 108% 12%,
      rgba(122, 88, 23, 0.05),
      transparent 55%
    ),
    linear-gradient(168deg, #f2efe7 0%, #ebe6d9 52%, #efeadd 100%),
    var(--ink-950);
  color: var(--paper);
}
/* replace the dark grid with marble mottling + faint diagonal veins
   (fixed layer = soft parallax against the scrolling content) */
[data-theme="marble"] body::before {
  opacity: 1;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='560'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.006 0.011' numOctaves='4' seed='11'/%3E%3CfeColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.31 0 0 0 0 0.23 0 0 0 0.9 -0.36'/%3E%3C/filter%3E%3Crect width='560' height='560' filter='url(%23m)'/%3E%3C/svg%3E"),
    repeating-linear-gradient(
      112deg,
      transparent 0 180px,
      rgba(96, 82, 58, 0.05) 180px 181px,
      transparent 181px 420px
    ),
    repeating-linear-gradient(
      74deg,
      transparent 0 260px,
      rgba(96, 82, 58, 0.035) 260px 261px,
      transparent 261px 560px
    );
  background-size:
    560px 560px,
    auto,
    auto;
  opacity: 0.55;
  mask-image: none;
}
/* slow light sweep drifting across the grain (<=0.06, 45s) */
@media (prefers-reduced-motion: no-preference) {
  [data-theme="marble"] body::after {
    position: fixed;
    inset: 0 -60%;
    z-index: -1;
    content: "";
    pointer-events: none;
    background: linear-gradient(
      104deg,
      transparent 42%,
      rgba(255, 255, 255, 0.6) 50%,
      transparent 58%
    );
    opacity: 0.055;
    animation: marble-sweep 45s ease-in-out infinite alternate;
    will-change: transform;
  }
  @keyframes marble-sweep {
    from {
      transform: translateX(-22%);
    }
    to {
      transform: translateX(22%);
    }
  }
}

/* ---------- 3 · Editorial typography -------------------------- */
[data-theme="marble"] h1,
[data-theme="marble"] h2,
[data-theme="marble"] h3,
[data-theme="marble"] .m3-trade-main h1,
[data-theme="marble"] .m3-page-intro h1 {
  font-family: var(--font-display);
  letter-spacing: 0.005em;
  font-weight: 600;
}
[data-theme="marble"] .clarity-hero h1 {
  letter-spacing: -0.015em;
  font-weight: 600;
}
[data-theme="marble"] .eyebrow,
[data-theme="marble"] .m3-page-intro > span {
  color: var(--brass-soft);
  letter-spacing: 0.24em;
}
[data-theme="marble"] .eyebrow::before {
  opacity: 0.9;
}
[data-theme="marble"] ::selection {
  color: var(--ink-950);
  background: #6b4d12;
}

/* ---------- 4 · Engraved buttons + gold shimmer --------------- */
[data-theme="marble"] .button-primary,
[data-theme="marble"] .m3-primary-button,
[data-theme="marble"] .pay-cta,
[data-theme="marble"] .pay-copy button,
[data-theme="marble"] .pay-wallets button,
[data-theme="marble"] .m3-install-banner > button {
  color: #171003;
  background: linear-gradient(
    165deg,
    var(--marble-gold-hi) 0%,
    var(--marble-gold) 62%,
    var(--marble-gold-deep) 100%
  );
  border-color: rgba(122, 88, 23, 0.4);
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 235, 0.65),
    0 10px 26px rgba(122, 88, 23, 0.24);
}
[data-theme="marble"] .button-primary:hover,
[data-theme="marble"] .m3-primary-button:hover {
  background: linear-gradient(165deg, #f0d99c 0%, #d3a438 62%, #ac8226 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 250, 235, 0.7),
    0 14px 32px rgba(122, 88, 23, 0.3);
}
/* engraved press: the button sinks into the stone */
[data-theme="marble"] .button:active,
[data-theme="marble"] .m3-primary-button:active,
[data-theme="marble"] .m3-secondary-button:active,
[data-theme="marble"] .pay-cta:active,
[data-theme="marble"] .pay-option:active {
  transform: translateY(1px);
  box-shadow:
    inset 0 2px 6px rgba(56, 42, 12, 0.35),
    0 4px 12px rgba(76, 64, 42, 0.14);
}
/* gold shimmer sweep across primary CTAs on hover/focus */
[data-theme="marble"] .button-primary,
[data-theme="marble"] .m3-primary-button,
[data-theme="marble"] .pay-cta {
  position: relative;
  overflow: hidden;
}
@media (prefers-reduced-motion: no-preference) {
  [data-theme="marble"] .button-primary::after,
  [data-theme="marble"] .m3-primary-button::after,
  [data-theme="marble"] .pay-cta::after {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background: linear-gradient(
      100deg,
      transparent 32%,
      rgba(255, 252, 240, 0.75) 50%,
      transparent 68%
    );
    transform: translateX(-140%) skewX(-18deg);
    will-change: transform;
  }
  [data-theme="marble"] .button-primary:hover::after,
  [data-theme="marble"] .button-primary:focus-visible::after,
  [data-theme="marble"] .m3-primary-button:hover::after,
  [data-theme="marble"] .m3-primary-button:focus-visible::after,
  [data-theme="marble"] .pay-cta:hover::after,
  [data-theme="marble"] .pay-cta:focus-visible::after {
    transform: translateX(140%) skewX(-18deg);
    transition: transform 0.9s ease;
  }
}
[data-theme="marble"] .button-secondary,
[data-theme="marble"] .m3-secondary-button {
  color: var(--paper);
  border-color: var(--line);
  background: rgba(255, 255, 255, 0.5);
}
[data-theme="marble"] .button-secondary:hover,
[data-theme="marble"] .m3-secondary-button:hover {
  border-color: #b3a98f;
  background: rgba(255, 255, 255, 0.8);
}
[data-theme="marble"] .button-ghost {
  color: var(--paper-soft);
}
[data-theme="marble"] .button-ghost:hover {
  background: rgba(23, 18, 8, 0.05);
  color: var(--paper);
}
[data-theme="marble"] .icon-button {
  border-color: var(--line);
  background: rgba(255, 255, 255, 0.55);
}
[data-theme="marble"] .icon-button:hover {
  border-color: #b3a98f;
  background: rgba(255, 255, 255, 0.85);
}

/* base chrome bits */
[data-theme="marble"] .toast {
  color: var(--paper);
  background: rgba(253, 251, 246, 0.96);
  border-color: var(--line);
}
[data-theme="marble"] .status-pill {
  background: rgba(255, 255, 255, 0.55);
}
/* (Phase 10 §2: .brand-glyph removed — the real logo renders via
   .brand-logo, mapped per theme in styles/base.css.) */

/* ============================================================
   5 · MEMBER APP (m3-*)
   ============================================================ */
[data-theme="marble"] .m3-shell {
  background:
    radial-gradient(
      circle at 88% -5%,
      rgba(122, 88, 23, 0.07),
      transparent 24rem
    ),
    radial-gradient(
      circle at 0 28%,
      rgba(255, 255, 255, 0.7),
      transparent 20rem
    ),
    transparent;
}
[data-theme="marble"] .m3-topbar {
  border-bottom-color: rgba(96, 86, 66, 0.22);
  background: rgba(243, 240, 231, 0.88);
}
[data-theme="marble"] .m3-bottom-nav {
  border-top-color: rgba(96, 86, 66, 0.22);
  background: rgba(248, 245, 238, 0.94);
}
[data-theme="marble"] .m3-bottom-nav > a {
  color: #6c6454;
}
[data-theme="marble"] .m3-bottom-nav > a.active {
  background: linear-gradient(to top, rgba(122, 88, 23, 0.09), transparent);
}
[data-theme="marble"] .m3-bottom-nav > a.active::before {
  box-shadow: 0 3px 13px rgba(122, 88, 23, 0.55);
}
@media (min-width: 980px) {
  [data-theme="marble"] .m3-sidebar {
    border-right-color: rgba(96, 86, 66, 0.22);
    background: rgba(246, 243, 235, 0.82);
  }
  [data-theme="marble"] .m3-sidebar nav > a.active {
    background: rgba(122, 88, 23, 0.1);
  }
}

/* white stone panels (raised cards) */
[data-theme="marble"] .m3-session-status,
[data-theme="marble"] .m3-truth-card,
[data-theme="marble"] .m3-next-card,
[data-theme="marble"] .m3-token-strip > a,
[data-theme="marble"] .m3-signal-list > a,
[data-theme="marble"] .m3-alert-list > a,
[data-theme="marble"] .m3-install-steps li,
[data-theme="marble"] .m3-radar-list > button,
[data-theme="marble"] .m3-method-row,
[data-theme="marble"] .m3-method-sheet li,
[data-theme="marble"] .m3-setup-heading > a,
[data-theme="marble"] .m3-setup-levels article,
[data-theme="marble"] .m3-risk-card,
[data-theme="marble"] .m3-journal-button,
[data-theme="marble"] .m3-copilot-card,
[data-theme="marble"] .m3-journal-stats article,
[data-theme="marble"] .m3-journal-list > article,
[data-theme="marble"] .m3-settings-tabs button,
[data-theme="marble"] .m3-settings-card,
[data-theme="marble"] .m3-service-picker > button,
[data-theme="marble"] .m3-chip-picker button,
[data-theme="marble"] .m3-telegram-card,
[data-theme="marble"] .m3-account-footer,
[data-theme="marble"] .m3-track-record,
[data-theme="marble"] .m3-position-calc,
[data-theme="marble"] .m3-compound-calc,
[data-theme="marble"] .m3-session-card,
[data-theme="marble"] .m3-prompt-chips button,
[data-theme="marble"] .m3-binary-picker button,
[data-theme="marble"] .m3-signal-plan > article,
[data-theme="marble"] .m3-trade-hero,
[data-theme="marble"] .m3-crypto-hero,
[data-theme="marble"] .m3-radar-toolbar > label,
[data-theme="marble"] .m3-radar-toolbar > div button,
[data-theme="marble"] .m3-journal-toolbar button,
[data-theme="marble"] .m3-top-actions > a,
[data-theme="marble"] .m3-top-actions > button,
[data-theme="marble"] .m3-chart-explain,
[data-theme="marble"] .m3-tradingview-offline,
[data-theme="marble"] .m3-evidence-section li,
[data-theme="marble"] .m3-track-stats span,
[data-theme="marble"] .m3-calc-output span,
[data-theme="marble"] .m3-compound-summary span,
[data-theme="marble"] .m3-journal-size,
[data-theme="marble"] .m3-risk-card > header button,
[data-theme="marble"] .m3-sheet-close,
[data-theme="marble"] .m3-mint-row button,
[data-theme="marble"] .m3-inspector-mint button {
  background: var(--marble-card);
  border-color: var(--marble-card-border);
}
[data-theme="marble"] .m3-trade-hero,
[data-theme="marble"] .m3-settings-card,
[data-theme="marble"] .m3-crypto-hero {
  box-shadow: 0 24px 60px rgba(76, 64, 42, 0.14);
}
[data-theme="marble"] .m3-empty {
  border-color: rgba(96, 86, 66, 0.4);
  background: rgba(255, 255, 255, 0.35);
}
/* ink wells (inputs, code, recessed cells) */
[data-theme="marble"] .m3-trade-levels > span,
[data-theme="marble"] .m3-trade-result,
[data-theme="marble"] .m3-crypto-metrics > span,
[data-theme="marble"] .m3-mint-row,
[data-theme="marble"] .m3-inspector-grid > span,
[data-theme="marble"] .m3-inspector-mint,
[data-theme="marble"] .m3-copilot-card label,
[data-theme="marble"] .m3-journal-sheet textarea,
[data-theme="marble"] .m3-calc-inputs input:not([type="range"]),
[data-theme="marble"] .m3-journal-size input,
[data-theme="marble"] .m3-risk-preset,
[data-theme="marble"] .m3-risk-override input,
[data-theme="marble"] .m3-compound-inputs input,
[data-theme="marble"] .m3-login-card input,
[data-theme="marble"] .m3-signal-plan dl > div,
[data-theme="marble"] .m3-daily-brain-metrics > span {
  background: var(--marble-well);
  border-color: var(--marble-well-border);
  color: var(--paper);
}
/* solid dark surfaces -> polished stone */
[data-theme="marble"] .m3-switcher-menu {
  border-color: #d6cfc0;
  background: #fbf9f3;
  box-shadow: 0 28px 80px rgba(76, 64, 42, 0.28);
}
[data-theme="marble"] .m3-guide-sheet {
  border-color: #d6cfc0;
  background: #faf7f0;
  box-shadow: 0 -30px 90px rgba(76, 64, 42, 0.3);
}
[data-theme="marble"] .m3-chart-overlay,
[data-theme="marble"] .m3-sheet-backdrop {
  background: rgba(232, 227, 215, 0.86);
}
[data-theme="marble"] .m3-chart-overlay > button {
  border-color: var(--line);
  background: #fdfbf6;
}
[data-theme="marble"] .m3-chart-overlay > section {
  background: #f6f3ea;
}
[data-theme="marble"] .m3-form-grid select {
  border-color: var(--marble-well-border);
  background: #fbf9f3;
  color: var(--paper);
}
[data-theme="marble"] .m3-toast {
  border-color: rgba(29, 107, 69, 0.4);
  color: #14532f;
  background: #eef4ec;
  box-shadow: 0 20px 50px rgba(76, 64, 42, 0.25);
}
[data-theme="marble"] .m3-toast.error {
  border-color: rgba(166, 58, 42, 0.4);
  color: #7c2a1c;
  background: #f8ece8;
}
[data-theme="marble"] .m3-login-page {
  background:
    radial-gradient(
      circle at 50% 7%,
      rgba(122, 88, 23, 0.09),
      transparent 26rem
    ),
    transparent;
}
[data-theme="marble"] .m3-login-card {
  border-color: var(--marble-card-border);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 34px 90px rgba(76, 64, 42, 0.2);
}
[data-theme="marble"] .m3-login-card input:focus {
  box-shadow: 0 0 0 3px rgba(122, 88, 23, 0.14);
}
[data-theme="marble"] .m3-login-error {
  color: #7c2a1c;
  background: rgba(166, 58, 42, 0.1);
}
[data-theme="marble"] .m3-chart-shell,
[data-theme="marble"] .m3-tradingview-frame,
[data-theme="marble"] .m3-live-trade-canvas {
  border-color: var(--marble-card-border);
  background: #f6f3ea;
}
[data-theme="marble"] .m3-skeleton {
  background: rgba(23, 18, 8, 0.07);
}
[data-theme="marble"] .m3-toggle-row {
  border-bottom-color: rgba(96, 86, 66, 0.2);
}
[data-theme="marble"] .m3-toggle-row > i {
  background: #d9d2c1;
}
[data-theme="marble"] .m3-toggle-row > i em {
  background: #fffdf8;
}
[data-theme="marble"] .m3-toggle-row > i.on {
  background: rgba(122, 88, 23, 0.55);
}
/* muted + inverted text corrections */
[data-theme="marble"] .m3-radar-toolbar input::placeholder {
  color: #7c7464;
}
[data-theme="marble"] .m3-chart-shell > a,
[data-theme="marble"] .m3-timeline-section time,
[data-theme="marble"] .m3-timeline-section small,
[data-theme="marble"] .m3-signal-plan dt,
[data-theme="marble"] .m3-active-signal-strip small,
[data-theme="marble"] .m3-active-signal-strip em {
  color: var(--muted);
}
[data-theme="marble"] .m3-signal-plan p,
[data-theme="marble"] .m3-timeline-section > div p,
[data-theme="marble"] .m3-timeline-section li p {
  color: var(--paper-soft);
}
[data-theme="marble"] .m3-signal-plan strong,
[data-theme="marble"] .m3-signal-plan dd,
[data-theme="marble"] .m3-timeline-section h2,
[data-theme="marble"] .m3-timeline-section li b,
[data-theme="marble"] .m3-active-signal-strip h2,
[data-theme="marble"] .m3-active-signal-strip > a,
[data-theme="marble"] .m3-tradingview-offline b,
[data-theme="marble"] .m3-tradingview-offline button,
[data-theme="marble"] .m3-track-months b {
  color: var(--paper);
}
[data-theme="marble"] .m3-tradingview-offline button {
  border-color: var(--line);
  background: rgba(255, 255, 255, 0.6);
}
[data-theme="marble"] .m3-signal-plan,
[data-theme="marble"] .m3-timeline-section {
  border-color: var(--marble-card-border);
}
[data-theme="marble"] .m3-timeline-section li::before {
  background: #d5cdbc;
}
[data-theme="marble"] .m3-timeline-section li > span {
  border-color: #b5ac99;
  background: #faf7f0;
}
[data-theme="marble"] .m3-alert-button i,
[data-theme="marble"] .m3-alert-icon i {
  border-color: #f4f0e8;
}
[data-theme="marble"] .m3-token-avatar i {
  border-color: #f4f0e8;
  background: #2c8657;
}
[data-theme="marble"] .m3-active-signal-strip {
  border-color: rgba(29, 107, 69, 0.35);
  background: rgba(29, 107, 69, 0.06);
}
[data-theme="marble"] .m3-active-signal-strip > a {
  border-color: var(--marble-card-border);
  background: rgba(255, 255, 255, 0.55);
}
[data-theme="marble"] .m3-active-signal-strip > a > span {
  color: #1d6b45;
  background: rgba(29, 107, 69, 0.1);
}

/* status greens / reds / blues (AA on light stone) */
[data-theme="marble"] .positive {
  color: #1d6b45 !important;
}
[data-theme="marble"] .negative {
  color: #a63a2a !important;
}
[data-theme="marble"] .m3-trade-result strong,
[data-theme="marble"] .m3-target-list article > span,
[data-theme="marble"] .m3-target-list article > svg,
[data-theme="marble"] .m3-info-callout > svg,
[data-theme="marble"] .m3-login-trust > svg,
[data-theme="marble"] .m3-telegram-card > svg,
[data-theme="marble"] .m3-crypto-time i,
[data-theme="marble"] .m3-radar-toolbar > small i,
[data-theme="marble"] .m3-session-card.open > header i,
[data-theme="marble"] .m3-session-card.open > strong,
[data-theme="marble"] .m3-replay-history > strong,
[data-theme="marble"] .m3-journal-list article > strong.taken,
[data-theme="marble"] .m3-journal-pnl.positive {
  color: #1d6b45;
}
[data-theme="marble"] .m3-crypto-time i,
[data-theme="marble"] .m3-radar-toolbar > small i {
  background: #1d6b45;
}
[data-theme="marble"] .m3-journal-pnl.negative,
[data-theme="marble"] .m3-compound-table td.negative,
[data-theme="marble"] .m3-risk-current.level-extreme b,
[data-theme="marble"] .m3-ruin-warning > b,
[data-theme="marble"] .m3-note-today,
[data-theme="marble"] .m3-install-reset-note,
[data-theme="marble"] .m3-compound-disclaimer svg,
[data-theme="marble"] .m3-compound-disclaimer b {
  color: #a63a2a;
}
[data-theme="marble"] .m3-risk-current.level-elevated b,
[data-theme="marble"] .m3-risk-preset.high svg {
  color: #7a5817;
}
[data-theme="marble"] .m3-delivery-banner > span,
[data-theme="marble"] .m3-delivery-banner > strong,
[data-theme="marble"] .m3-telegram-card > span {
  color: #16606d;
}
[data-theme="marble"] .m3-delivery-banner.linked > strong {
  color: #1d6b45;
}

/* the violet crypto family -> deep aubergine ink */
[data-theme="marble"] .m3-avatar.violet {
  border-color: rgba(74, 53, 121, 0.45);
  color: #4a3579;
}
[data-theme="marble"] .m3-live-pill.action {
  border-color: rgba(74, 53, 121, 0.4);
  color: #4a3579;
  background: rgba(74, 53, 121, 0.09);
  box-shadow: 0 0 34px rgba(74, 53, 121, 0.12);
}
[data-theme="marble"] .m3-live-pill.simulation {
  border-color: rgba(74, 53, 121, 0.42);
  background: rgba(74, 53, 121, 0.1);
  color: #4a3579;
}
[data-theme="marble"] .m3-live-pill.replay {
  border-color: rgba(122, 88, 23, 0.4);
  background: rgba(122, 88, 23, 0.08);
  color: var(--brass-soft);
}
[data-theme="marble"] .m3-card-icon.violet,
[data-theme="marble"] .m3-crypto-title h1 b,
[data-theme="marble"] .m3-crypto-title small,
[data-theme="marble"] .m3-radar-token small,
[data-theme="marble"] .m3-radar-token b em,
[data-theme="marble"] .m3-token-inspector > header small,
[data-theme="marble"] .m3-action-note > svg,
[data-theme="marble"] .m3-contract-card code,
[data-theme="marble"] .m3-contract-card button {
  color: #4a3579;
}
[data-theme="marble"] .m3-contract-card {
  border-color: rgba(74, 53, 121, 0.32);
  background: rgba(74, 53, 121, 0.07);
}
[data-theme="marble"] .m3-contract-card button {
  border-color: rgba(74, 53, 121, 0.45);
}
[data-theme="marble"] .m3-score-ring {
  border-color: rgba(74, 53, 121, 0.22);
  border-top-color: #4a3579;
}
[data-theme="marble"] .m3-score-bars i {
  background: rgba(23, 18, 8, 0.09);
}
[data-theme="marble"] .m3-score-bars em {
  background: linear-gradient(90deg, #4a3579, #7a63b6);
}
[data-theme="marble"] .m3-radar-list > button.selected {
  border-color: rgba(74, 53, 121, 0.4);
  background: rgba(74, 53, 121, 0.06);
}
[data-theme="marble"] .m3-radar-list > button.action {
  box-shadow: inset 3px 0 0 #4a3579;
}
[data-theme="marble"] .m3-token-inspector {
  border-color: rgba(74, 53, 121, 0.3);
}
[data-theme="marble"] .m3-action-note {
  border-color: rgba(74, 53, 121, 0.28);
  background: rgba(74, 53, 121, 0.07);
}
[data-theme="marble"] .m3-crypto-glow {
  border-color: rgba(74, 53, 121, 0.16);
}
[data-theme="marble"] .m3-token-avatar {
  border-color: rgba(23, 18, 8, 0.2);
  color: #241a3a;
  background-color: #d9d0f2;
  box-shadow: 0 8px 22px rgba(76, 64, 42, 0.2);
}

/* gold accents that were bright on dark */
[data-theme="marble"] .m3-install-banner {
  border-color: rgba(122, 88, 23, 0.32);
  background: linear-gradient(
    135deg,
    rgba(122, 88, 23, 0.08),
    rgba(74, 53, 121, 0.05)
  );
}
[data-theme="marble"] .m3-install-banner > span {
  color: var(--brass-soft);
  background: rgba(122, 88, 23, 0.12);
}
[data-theme="marble"] .m3-channel-badge.founder {
  color: #7a5817;
  border-color: rgba(122, 88, 23, 0.5);
}
[data-theme="marble"] .m3-channel-badge.other {
  border-color: rgba(23, 18, 8, 0.2);
}
[data-theme="marble"] .m3-account-footer > div > span {
  color: #fdfbf6;
  background: var(--brass);
}
[data-theme="marble"] .m3-guide-sheet,
[data-theme="marble"] .m3-tutorial-dots button {
  background-color: #faf7f0;
}
[data-theme="marble"] .m3-tutorial-dots button {
  background: rgba(23, 18, 8, 0.18);
}

/* ============================================================
   6 · LANDING (clarity)
   ============================================================ */
[data-theme="marble"] .clarity-landing {
  background:
    radial-gradient(
      circle at 82% 8%,
      rgba(122, 88, 23, 0.07),
      transparent 29rem
    ),
    transparent;
}
/* Phase 10 polish (owner verdict) — MARBLE hero = "the golden credits":
   SIX phones (trading trio: hoy·chart·chart-echo / crypto trio:
   crypto·radar·radar-echo) layered BEHIND the centered copy, which sits
   on a soft blurred stone plate. The phones own the first viewport.

   Three compositions per phone, all driven by custom-property sets so
   one keyframe choreographs everything:
     --stack-*  the layered center deck (what you see on arrival)
     --fan-*    the open arc (also the static fallback composition)
     --con-*    the converged layer stack (as the hero hands over)
   Where CSS scroll-driven animations exist (and motion is allowed) the
   hero grows a 195svh runway, both layers pin, and scrolling plays
   stack → open → converge while the copy rises away like film credits.
   Everywhere else the open fan renders statically: same DOM, CLS 0,
   the eager phones paint immediately (no hidden arming, ever). */
[data-theme="marble"] .clarity-hero {
  grid-template-columns: 1fr;
  min-height: min(calc(100dvh - 88px), 900px);
  padding-block: 0;
  text-align: center;
}
[data-theme="marble"] .clarity-hero > .clarity-hero-copy,
[data-theme="marble"] .clarity-hero > .hero-stage {
  grid-area: 1 / 1;
  align-self: stretch;
  justify-self: stretch;
}
[data-theme="marble"] .clarity-hero-copy {
  position: relative;
  z-index: 2;
  display: grid;
  width: 100%;
  max-width: none;
  align-content: center;
  justify-items: center;
  padding-inline: clamp(16px, 4vw, 32px);
}
/* NO plate, NO oval: the copy lives on clean marble by COMPOSITION —
   phones frame the copy from the edges and fade before they reach it. */
[data-theme="marble"] .hero-actions,
[data-theme="marble"] .hero-points {
  justify-content: center;
}
[data-theme="marble"] .clarity-hero-copy .eyebrow,
[data-theme="marble"] .clarity-hero-copy .hero-points li {
  text-shadow: none;
}
[data-theme="marble"] .hero-stage {
  position: relative;
  z-index: 1;
  display: grid;
  width: 100%;
  align-items: center;
  justify-items: center;
}
[data-theme="marble"] .hero-cluster {
  position: relative;
  z-index: 1;
}
@media (min-width: 721px) {
  /* 26a (owner) — FULL BLEED. The stage carries NO mask any more.
     A mask sized to the stage box (mask-size:100% 100%, no-repeat) is
     transparent EVERYWHERE outside that box, and the stage box is the
     shell's content box — so every phone was sliced off at the shell
     gutters and the two slivers read as lateral bands cropping the
     cluster. Nothing clips the phones now: they run to the viewport
     edges (.clarity-landing keeps overflow:clip, so no h-scroll).

     Legibility is bought back where it belongs — a soft radial scrim
     BEHIND THE COPY ONLY, drawn inside the copy's own stacking context
     (z-index:2), so it can never become a plate or a band over a phone.
     It is the stone's own colour feathering to nothing: no edge. */
  [data-theme="marble"] .clarity-hero-copy {
    max-width: 620px;
    margin-inline: auto;
  }
  [data-theme="marble"] .clarity-hero-copy::before {
    position: absolute;
    z-index: -1;
    inset: -7% -36%;
    content: "";
    pointer-events: none;
    /* Owner: the halo behind the headline read as a "light" sitting on the
       marble. Dissolved to a whisper — wide, low-opacity and feathered out
       long before its edge, so it only takes the busiest phone detail off
       the letters and never reads as a shape of its own. */
    background: radial-gradient(
      ellipse 62% 60% at 50% 48%,
      rgba(243, 240, 232, 0.5) 0%,
      rgba(243, 240, 232, 0.38) 34%,
      rgba(243, 240, 232, 0.2) 58%,
      rgba(243, 240, 232, 0.07) 78%,
      transparent 100%
    );
    filter: blur(26px);
  }
}
/* engraved-gold economy ambiance: drifting candle/coin/ticker glyphs */
[data-theme="marble"] .hero-stage::before {
  position: absolute;
  inset: -10% -4%;
  z-index: 0;
  content: "";
  pointer-events: none;
  opacity: 0.85;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='340' height='340'%3E%3Cg fill='none' stroke='%237a5817' stroke-width='1.1'%3E%3Cg opacity='.13'%3E%3Cpath d='M30 34v46M22 46h16v22H22zM56 22v54M48 40h16v26H48zM82 40v40M74 50h16v18H74z'/%3E%3C/g%3E%3Cg opacity='.1'%3E%3Ccircle cx='250' cy='64' r='15'/%3E%3Ccircle cx='250' cy='64' r='10'/%3E%3Cpath d='M250 56v16'/%3E%3C/g%3E%3Cg opacity='.12'%3E%3Cpath d='M150 306l38-30 26 16 44-38'/%3E%3Cpath d='M250 254h8v8'/%3E%3C/g%3E%3Cg opacity='.08'%3E%3Cpath d='M60 208l8 8-8 8-8-8z'/%3E%3Cpath d='M298 160v12M292 166h12'/%3E%3C/g%3E%3Cg opacity='.09'%3E%3Ccircle cx='96' cy='130' r='7'/%3E%3Ccircle cx='306' cy='268' r='9'/%3E%3Ccircle cx='306' cy='268' r='5'/%3E%3C/g%3E%3Ctext x='176' y='142' font-family='Georgia,serif' font-size='20' fill='%237a5817' fill-opacity='.12' stroke='none'%3E%E2%82%AC%3C/text%3E%3C/g%3E%3C/svg%3E")
    0 0 / 340px 340px;
}
/* all six slots render (their images are shared URLs — no extra bytes) */
[data-theme="marble"] .hero-phone-main,
[data-theme="marble"] .hero-phone-chart,
[data-theme="marble"] .hero-phone-crypto,
[data-theme="marble"] .hero-phone-radar,
[data-theme="marble"] .hero-echo {
  display: block;
}
[data-theme="marble"] .hero-cluster .device-frame {
  width: min(290px, 62vw);
  box-shadow:
    inset 0 0 0 1.5px rgba(163, 122, 32, 0.5),
    inset 0 0 0 4px #0b0c0e,
    0 30px 70px rgba(76, 64, 42, 0.35);
}
/* RTL mirrors every x offset and rotation through one multiplier */
[data-theme="marble"] .hero-phone {
  --dir: 1;
}
[data-theme="marble"] .clarity-landing[dir="rtl"] .hero-phone {
  --dir: -1;
}
/* — trading trio (start side) — */
[data-theme="marble"] .hero-phone-main {
  z-index: 6;
  --stack-x: calc(var(--dir) * -120px);
  --stack-y: 14px;
  --stack-r: calc(var(--dir) * -4deg);
  --stack-s: 1;
  --fan-x: calc(var(--dir) * clamp(360px, 37vw, 620px) * -1);
  --fan-y: 24px;
  --fan-rotate: calc(var(--dir) * -6deg);
  --fan-scale: 1.02;
  --con-x: calc(var(--dir) * -6px);
  --con-y: -12px;
  --con-r: calc(var(--dir) * -1.5deg);
  --con-s: 0.9;
}
[data-theme="marble"] .hero-phone-chart {
  z-index: 4;
  --stack-x: calc(var(--dir) * -250px);
  --stack-y: 48px;
  --stack-r: calc(var(--dir) * -9deg);
  --stack-s: 0.93;
  --fan-x: calc(var(--dir) * clamp(520px, 52vw, 820px) * -1);
  --fan-y: 76px;
  --fan-rotate: calc(var(--dir) * -11.5deg);
  --fan-scale: 0.9;
  --con-x: calc(var(--dir) * -28px);
  --con-y: 16px;
  --con-r: calc(var(--dir) * -5deg);
  --con-s: 0.84;
}
[data-theme="marble"] .hero-echo-a {
  z-index: 2;
  --stack-x: calc(var(--dir) * -380px);
  --stack-y: 78px;
  --stack-r: calc(var(--dir) * -14deg);
  --stack-s: 0.82;
  --fan-x: calc(var(--dir) * clamp(660px, 66vw, 1010px) * -1);
  --fan-y: 118px;
  --fan-rotate: calc(var(--dir) * -17deg);
  --fan-scale: 0.76;
  --con-x: calc(var(--dir) * -52px);
  --con-y: 38px;
  --con-r: calc(var(--dir) * -9deg);
  --con-s: 0.78;
}
/* — crypto/memecoin trio (end side) — */
[data-theme="marble"] .hero-phone-crypto {
  z-index: 5;
  --stack-x: calc(var(--dir) * 130px);
  --stack-y: 20px;
  --stack-r: calc(var(--dir) * 4.5deg);
  --stack-s: 1;
  --fan-x: calc(var(--dir) * clamp(360px, 37vw, 620px));
  --fan-y: 24px;
  --fan-rotate: calc(var(--dir) * 6deg);
  --fan-scale: 1.02;
  --con-x: calc(var(--dir) * 10px);
  --con-y: 0px;
  --con-r: calc(var(--dir) * 2deg);
  --con-s: 0.88;
}
[data-theme="marble"] .hero-phone-radar {
  z-index: 3;
  --stack-x: calc(var(--dir) * 260px);
  --stack-y: 52px;
  --stack-r: calc(var(--dir) * 9.5deg);
  --stack-s: 0.93;
  --fan-x: calc(var(--dir) * clamp(520px, 52vw, 820px));
  --fan-y: 76px;
  --fan-rotate: calc(var(--dir) * 11.5deg);
  --fan-scale: 0.9;
  --con-x: calc(var(--dir) * 32px);
  --con-y: 22px;
  --con-r: calc(var(--dir) * 5.5deg);
  --con-s: 0.84;
}
[data-theme="marble"] .hero-echo-b {
  z-index: 1;
  --stack-x: calc(var(--dir) * 390px);
  --stack-y: 82px;
  --stack-r: calc(var(--dir) * 14.5deg);
  --stack-s: 0.82;
  --fan-x: calc(var(--dir) * clamp(660px, 66vw, 1010px));
  --fan-y: 118px;
  --fan-rotate: calc(var(--dir) * 17deg);
  --fan-scale: 0.76;
  --con-x: calc(var(--dir) * 56px);
  --con-y: 42px;
  --con-r: calc(var(--dir) * 10deg);
  --con-s: 0.78;
}
[data-theme="marble"] .hero-echo {
  opacity: 0.6;
  filter: blur(2.5px);
}
/* alive: every phone breathes on its own tide; a gold shimmer sweeps
   the fan; the engraved glyphs drift. All transform-only. */
@media (prefers-reduced-motion: no-preference) {
  [data-theme="marble"] .hero-phone .device-shell {
    animation: marble-float 8s ease-in-out infinite alternate;
    will-change: transform;
  }
  [data-theme="marble"] .hero-phone-chart .device-shell {
    animation-duration: 9.2s;
    animation-delay: -3.1s;
  }
  [data-theme="marble"] .hero-phone-crypto .device-shell {
    animation-duration: 7.3s;
    animation-delay: -1.6s;
  }
  [data-theme="marble"] .hero-phone-radar .device-shell {
    animation-duration: 8.7s;
    animation-delay: -5.2s;
  }
  [data-theme="marble"] .hero-echo-a .device-shell {
    animation-duration: 10.5s;
    animation-delay: -2.4s;
  }
  [data-theme="marble"] .hero-echo-b .device-shell {
    animation-duration: 11.4s;
    animation-delay: -6.8s;
  }
  [data-theme="marble"] .hero-stage::before {
    animation: marble-glyph-drift 36s ease-in-out infinite alternate;
    will-change: transform;
  }
  [data-theme="marble"] .hero-stage::after {
    position: absolute;
    inset: -10% -30%;
    z-index: 2;
    content: "";
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(
      100deg,
      transparent 44%,
      rgba(233, 207, 139, 0.16) 50%,
      rgba(255, 252, 240, 0.26) 52%,
      transparent 58%
    );
    transform: translateX(-45%) skewX(-8deg);
    animation: marble-hero-sweep 9.5s ease-in-out 2.2s infinite;
    will-change: transform, opacity;
  }

  /* (The pinned "credits" scroll choreography is retired: the static fan
     with per-phone floats is the composition the owner approved. A future
     scroll act can return as a separate, tested feature.) */
}
@keyframes marble-float {
  from {
    transform: translate3d(0, -8px, 0) rotate(-0.45deg);
  }
  to {
    transform: translate3d(0, 10px, 0) rotate(0.55deg);
  }
}
@keyframes marble-glyph-drift {
  from {
    transform: translate3d(-1.5%, 1%, 0);
  }
  to {
    transform: translate3d(1.5%, -1.5%, 0);
  }
}
@keyframes marble-hero-sweep {
  0%,
  55% {
    opacity: 0;
    transform: translateX(-45%) skewX(-8deg);
  }
  62% {
    opacity: 1;
  }
  78%,
  100% {
    opacity: 0;
    transform: translateX(45%) skewX(-8deg);
  }
}
@keyframes marble-credits-phone {
  0% {
    transform: translate3d(var(--stack-x, 0px), var(--stack-y, 0px), 0)
      rotate(var(--stack-r, 0deg)) scale(var(--stack-s, 1));
  }
  42%,
  58% {
    transform: translate3d(var(--fan-x, 0px), var(--fan-y, 0px), 0)
      rotate(var(--fan-rotate, 0deg)) scale(var(--fan-scale, 1));
  }
  100% {
    transform: translate3d(var(--con-x, 0px), var(--con-y, 0px), 0)
      rotate(var(--con-r, 0deg)) scale(var(--con-s, 0.86));
  }
}
@keyframes marble-credits-copy {
  0% {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
  30% {
    transform: translate3d(0, -4svh, 0);
    opacity: 1;
  }
  62% {
    transform: translate3d(0, -30svh, 0);
    opacity: 0.66;
  }
  100% {
    transform: translate3d(0, -78svh, 0);
    opacity: 0;
  }
}
[data-theme="marble"] .landing-sparks i {
  background: var(--marble-gold);
  box-shadow: 0 0 12px 2px rgba(163, 122, 32, 0.3);
}
/* Scrolling on — the STORY chapters read as an engraved editorial page:
   ghost numerals cut into the stone, Cormorant chapter titles (inherited
   via --font-display), gold kicker rules. The beats themselves are laid
   out by landing.css; marble only re-inks. */
[data-theme="marble"] .story-index {
  color: rgba(23, 18, 8, 0.14);
}
[data-theme="marble"] .story-copy h3 {
  letter-spacing: -0.015em;
}
[data-theme="marble"] .story-phone .device-frame {
  box-shadow:
    inset 0 0 0 1.5px rgba(163, 122, 32, 0.5),
    inset 0 0 0 4px #0b0c0e,
    0 30px 70px rgba(76, 64, 42, 0.35);
}
/* Mobile 390×844: the six phones frame the copy — a blurred echo pair
   rises behind the headline, the inner pair peeks past the plate's
   shoulders, the outer pair flanks the CTAs from below. */

@media (max-width: 720px) {
  /* MOBILE COVER (owner): the FIRST screen must carry a real phone.
     Order tells the story: kicker → title → lead → CTA → the daily-
     signal phone LARGE bleeding off the end edge with the crypto phone
     tucked behind — then the three proof points close the act on clean
     marble. display:contents lets CSS order copy children around the
     stage without touching the DOM. */
  [data-theme="marble"] .clarity-hero {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: auto;
    padding-block: 8px 26px;
    text-align: start;
  }
  [data-theme="marble"] .clarity-hero > .clarity-hero-copy {
    display: contents;
  }
  [data-theme="marble"] .clarity-hero-copy > .eyebrow {
    order: 1;
    margin-top: 12px;
  }
  [data-theme="marble"] .clarity-hero h1 {
    order: 2;
    max-width: 12ch;
    margin: 18px 0;
    font-size: clamp(40px, 11.5vw, 52px);
  }
  [data-theme="marble"] .clarity-hero-copy > p {
    order: 3;
    max-width: 36ch;
  }
  [data-theme="marble"] .hero-actions {
    position: relative;
    z-index: 2;
    order: 4;
    width: 100%;
    margin-top: 26px;
  }
  [data-theme="marble"] .clarity-hero > .hero-stage {
    z-index: 1;
    order: 5;
    margin-top: -40px;
  }
  /* proof points close the hero, centered on clean marble */
  [data-theme="marble"] .hero-points {
    position: relative;
    z-index: 2;
    order: 6;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    justify-content: center;
    margin-top: 16px;
  }
  [data-theme="marble"] .hero-cluster {
    align-self: auto;
    margin-top: 0;
  }
  [data-theme="marble"] .hero-cluster .device-frame {
    width: min(252px, 66vw);
  }
  /* focus: only the duo on mobile (trading front, crypto behind) */
  [data-theme="marble"] .hero-phone-chart,
  [data-theme="marble"] .hero-phone-radar,
  [data-theme="marble"] .hero-echo {
    display: none;
  }
  [data-theme="marble"] .hero-phone-main {
    z-index: 6;
    --fan-x: calc(var(--dir) * 18vw);
    --fan-y: 0px;
    --fan-rotate: calc(var(--dir) * -6.5deg);
    --fan-scale: 1;
  }
  [data-theme="marble"] .hero-phone-crypto {
    z-index: 5;
    opacity: 0.92;
    --fan-x: calc(var(--dir) * -14vw);
    --fan-y: 44px;
    --fan-rotate: calc(var(--dir) * 8deg);
    --fan-scale: 0.82;
  }
  /* the engraved-gold glyphs pool quietly behind the duo */
  [data-theme="marble"] .hero-stage::before {
    opacity: 0.55;
  }
}
[data-theme="marble"] .clarity-steps article {
  background: var(--marble-card);
  border-color: var(--marble-card-border);
}
[data-theme="marble"] .clarity-steps article > span {
  color: rgba(23, 18, 8, 0.16);
}
[data-theme="marble"] .clarity-market-grid article > span {
  border-color: rgba(122, 88, 23, 0.35);
  background: rgba(122, 88, 23, 0.08);
}
[data-theme="marble"] .clarity-safety {
  border-color: rgba(22, 96, 109, 0.3);
  background: rgba(22, 96, 109, 0.05);
}
[data-theme="marble"] .clarity-safety aside {
  border-color: var(--marble-card-border);
  background: rgba(255, 255, 255, 0.5);
}
[data-theme="marble"] .clarity-start {
  border-color: rgba(122, 88, 23, 0.34);
  background: linear-gradient(120deg, rgba(122, 88, 23, 0.1), transparent);
}
[data-theme="marble"] .language-toggle {
  background: rgba(23, 18, 8, 0.045);
}
[data-theme="marble"] .footer-legal {
  color: var(--muted);
}
[data-theme="marble"] .public-footer > span {
  color: var(--muted);
}
[data-theme="marble"] .mobile-nav {
  background: rgba(248, 245, 238, 0.98);
}
/* Owner verdict: NO black slab in marble — the method section follows the
   light stone like everything else (inner phone screens stay dark on their
   own; the section chrome is engraved stone). */
[data-theme="marble"] .clarity-today {
  background: linear-gradient(172deg, #f4f1e9, #ece7db 62%, #f0ebdf);
  border-block: 1px solid rgba(96, 86, 66, 0.22);
  color: var(--paper);
}
/* Landing plan cards: three cuts of the same white stone, each with its
   identity re-inked for the light ground (the token-driven candle/coin
   layers in landing.css inherit marble's deep jade/coral/gold on their
   own; only the fixed-color SVG accents need engraved variants). */
[data-theme="marble"] .lp-plan {
  border-color: rgba(96, 86, 66, 0.32);
  background: linear-gradient(168deg, #fdfbf6, #f2eee4 58%, #efeadd);
  box-shadow: 0 14px 45px rgba(76, 64, 42, 0.12);
}
[data-theme="marble"] .lp-trading {
  --lp-grid: rgba(23, 18, 8, 0.055);
}
[data-theme="marble"] .lp-trading::before {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='150' fill='none'%3E%3Cpath d='M0 128 L56 108 88 118 132 84 168 96 224 56 262 70 318 30 356 44 420 12' stroke='%237a5817' stroke-opacity='.4' stroke-width='1.6'/%3E%3Cpath d='M0 84h420' stroke='%237a5817' stroke-opacity='.16' stroke-width='1' stroke-dasharray='3 6'/%3E%3Ccircle cx='224' cy='56' r='3.2' fill='%237a5817' fill-opacity='.45'/%3E%3C/svg%3E")
      50% 100% / 100% auto no-repeat,
    repeating-linear-gradient(
      90deg,
      var(--lp-grid) 0 1px,
      transparent 1px 32px
    ),
    repeating-linear-gradient(
      180deg,
      var(--lp-grid) 0 1px,
      transparent 1px 32px
    ),
    radial-gradient(
      120% 80% at 82% 0%,
      rgba(255, 255, 255, 0.7),
      transparent 55%
    );
}
/* memecoins on stone: the Solana violet→green wash lightened for the
   light ground; the real coin logos keep their own colors and get a
   stone-weight shadow instead of the dark-theme glow. */
[data-theme="marble"] .lp-memes::before {
  background:
    linear-gradient(
      132deg,
      rgba(153, 69, 255, 0.1),
      transparent 40%,
      rgba(13, 148, 94, 0.05) 72%,
      rgba(13, 148, 94, 0.1)
    ),
    radial-gradient(
      90% 70% at 10% 100%,
      rgba(74, 53, 121, 0.1),
      transparent 55%
    ),
    radial-gradient(circle at 86% 88%, rgba(13, 148, 94, 0.08), transparent 50%);
}
[data-theme="marble"] .lp-coins img {
  filter: drop-shadow(0 6px 14px rgba(76, 64, 42, 0.35));
}
[data-theme="marble"] .lp-memes::after {
  background:
    radial-gradient(circle 3px at 62% 54%, #0d945e 97%, transparent),
    radial-gradient(circle 2.5px at 38% 76%, #4a3579 97%, transparent),
    conic-gradient(
      from 270deg at 100% 100%,
      transparent 0deg,
      rgba(74, 53, 121, 0.24) 52deg,
      transparent 88deg
    ),
    repeating-radial-gradient(
      circle at 100% 100%,
      transparent 0 25px,
      rgba(122, 88, 23, 0.2) 25px 26px
    );
  opacity: 0.8;
}
[data-theme="marble"] .lp-memes {
  border-color: rgba(74, 53, 121, 0.34);
}
[data-theme="marble"] .lp-memes:hover {
  border-color: rgba(74, 53, 121, 0.55);
}
[data-theme="marble"] .lp-memes .lp-motif {
  border-color: rgba(74, 53, 121, 0.4);
  color: #4a3579;
  background: rgba(74, 53, 121, 0.07);
}
[data-theme="marble"] .lp-full {
  border-color: rgba(122, 88, 23, 0.55);
  background: linear-gradient(165deg, #fbf4e2, #f6efdd 48%, #f2ead2);
  box-shadow:
    inset 0 0 0 1px rgba(122, 88, 23, 0.22),
    0 18px 50px rgba(76, 64, 42, 0.16);
}
[data-theme="marble"] .lp-full::before {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cg fill='none' stroke='%23a37a20' stroke-linecap='round'%3E%3Cpath d='M-20 60 Q90 92 152 42 T330 72 T460 32' stroke-opacity='.16' stroke-width='1.1'/%3E%3Cpath d='M40 190 Q122 152 200 212 T400 182' stroke-opacity='.12' stroke-width='.9'/%3E%3Cpath d='M-10 322 Q82 362 172 320 T340 352 T450 330' stroke-opacity='.15' stroke-width='1.2'/%3E%3Cpath d='M242 -10 Q262 82 212 152 T262 302 T232 430' stroke-opacity='.13' stroke-width='.8'/%3E%3Cpath d='M96 -20 Q60 90 128 150 T96 320' stroke-opacity='.09' stroke-width='.7'/%3E%3C/g%3E%3C/svg%3E")
      0 0 / 420px 420px,
    radial-gradient(
      120% 90% at 14% 0%,
      rgba(255, 255, 255, 0.8),
      transparent 48%
    ),
    radial-gradient(
      110% 85% at 88% 100%,
      rgba(122, 88, 23, 0.12),
      transparent 52%
    ),
    linear-gradient(
      152deg,
      transparent 30%,
      rgba(122, 88, 23, 0.06) 45%,
      transparent 58%
    );
}
[data-theme="marble"] .lp-cta {
  border-color: rgba(96, 86, 66, 0.4);
}
/* the crown on stone: polished-gold ring glint + gold sheen (the cream
   glints of the dark themes would vanish on white marble) */
[data-theme="marble"] .lp-crown-ring::before {
  background: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(122, 88, 23, 0.75) 40deg,
    var(--marble-gold) 62deg,
    rgba(122, 88, 23, 0.75) 84deg,
    transparent 130deg,
    transparent 200deg,
    rgba(122, 88, 23, 0.55) 236deg,
    transparent 290deg
  );
}
[data-theme="marble"] .lp-crown-sheen {
  background: linear-gradient(
    105deg,
    transparent,
    rgba(201, 153, 47, 0.14) 46%,
    rgba(233, 207, 139, 0.34) 52%,
    transparent 66%
  );
}

/* ============================================================
   7 · ONBOARDING (incl. plan cards)
   ============================================================ */
[data-theme="marble"] .onboarding {
  background:
    radial-gradient(
      circle at 50% -10%,
      rgba(122, 88, 23, 0.06),
      transparent 34rem
    ),
    transparent;
}
[data-theme="marble"] .onboarding-footer {
  background: rgba(236, 231, 219, 0.92);
}
[data-theme="marble"] .progress-track {
  background: rgba(23, 18, 8, 0.08);
}
[data-theme="marble"] .instrument-board,
[data-theme="marble"] .scenario-panel,
[data-theme="marble"] .risk-options button,
[data-theme="marble"] .risk-dial,
[data-theme="marble"] .horizon-options button,
[data-theme="marble"] .tools-section,
[data-theme="marble"] .contact-form,
[data-theme="marble"] .review-row {
  background: var(--marble-card);
}
[data-theme="marble"] .review-row button:hover {
  background: rgba(23, 18, 8, 0.05);
}
[data-theme="marble"] .save-state,
[data-theme="marble"] .range-labels,
[data-theme="marble"] .scenario-panel > p,
[data-theme="marble"] .horizon-options > button > span {
  color: var(--muted);
}
[data-theme="marble"] .plan-motif {
  background: rgba(255, 255, 255, 0.55);
}
/* plan cards: three cuts of the same white stone */
[data-theme="marble"] .plan-trading {
  border-color: rgba(96, 86, 66, 0.32);
  background: linear-gradient(168deg, #fdfbf6, #f2eee4 58%, #efeadd);
}
/* the candle cluster goes gold on stone (same geometry, marble inks) */
[data-theme="marble"] .plan-trading::after {
  background:
    linear-gradient(rgba(122, 88, 23, 0.45), rgba(122, 88, 23, 0.45)) 6px 2px /
      1px 40px,
    linear-gradient(rgba(122, 88, 23, 0.45), rgba(122, 88, 23, 0.45)) 24px 6px /
      1px 36px,
    linear-gradient(rgba(122, 88, 23, 0.45), rgba(122, 88, 23, 0.45)) 42px 0 /
      1px 44px,
    linear-gradient(rgba(122, 88, 23, 0.45), rgba(122, 88, 23, 0.45)) 60px 4px /
      1px 38px,
    linear-gradient(rgba(85, 67, 28, 0.6), rgba(85, 67, 28, 0.6)) 78px 1px / 1px
      42px,
    linear-gradient(rgba(163, 122, 32, 0.85), rgba(163, 122, 32, 0.85)) 4px
      16px / 5px 15px,
    linear-gradient(rgba(163, 122, 32, 0.85), rgba(163, 122, 32, 0.85)) 22px
      12px / 5px 21px,
    linear-gradient(rgba(163, 122, 32, 0.85), rgba(163, 122, 32, 0.85)) 40px
      8px / 5px 17px,
    linear-gradient(rgba(163, 122, 32, 0.85), rgba(163, 122, 32, 0.85)) 58px
      14px / 5px 19px,
    linear-gradient(rgba(85, 67, 28, 0.9), rgba(85, 67, 28, 0.9)) 76px 7px / 5px
      20px;
  background-repeat: no-repeat;
}
[data-theme="marble"] .plan-trading .plan-flag,
[data-theme="marble"] .plan-trading .plan-motif {
  color: #55431c;
}
/* memecoins: the lightning cut reads as engraved gold on light stone */
[data-theme="marble"] .plan-memes::before {
  background:
    radial-gradient(
      circle at 84% 92%,
      rgba(122, 88, 23, 0.14),
      transparent 46%
    ),
    linear-gradient(
      118deg,
      transparent 43%,
      rgba(122, 88, 23, 0.06) 47%,
      rgba(122, 88, 23, 0.32) 50%,
      rgba(122, 88, 23, 0.06) 53%,
      transparent 57%
    ),
    linear-gradient(
      118deg,
      transparent 56%,
      rgba(122, 88, 23, 0.14) 58.5%,
      transparent 61%
    );
}
/* completo: warm stone sheens instead of white-on-black glints */
[data-theme="marble"] .plan-full::before {
  background:
    radial-gradient(
      120% 90% at 15% 8%,
      rgba(255, 255, 255, 0.75),
      transparent 45%
    ),
    radial-gradient(
      90% 70% at 85% 30%,
      rgba(122, 88, 23, 0.08),
      transparent 50%
    ),
    radial-gradient(
      100% 80% at 45% 96%,
      rgba(122, 88, 23, 0.1),
      transparent 55%
    ),
    linear-gradient(
      160deg,
      transparent 30%,
      rgba(122, 88, 23, 0.05) 42%,
      transparent 47%,
      rgba(255, 255, 255, 0.5) 60%,
      transparent 66%
    );
}
[data-theme="marble"] .plan-full .plan-flag {
  color: #fdfbf6;
  background: linear-gradient(100deg, #8a6420, #6b4d12);
}
[data-theme="marble"] .plan-full .plan-motif {
  color: #6b4d12;
}
[data-theme="marble"] .plan-memes .plan-flag,
[data-theme="marble"] .plan-memes .plan-bullet svg,
[data-theme="marble"] .plan-memes .plan-motif {
  color: #6b4d12;
}
[data-theme="marble"] .plan-trading .plan-bullet svg {
  color: #5d564a;
}
[data-theme="marble"] .plan-trading .plan-motif {
  border-color: rgba(96, 86, 66, 0.36);
}
[data-theme="marble"] .plan-trading:hover {
  border-color: rgba(96, 86, 66, 0.55);
}
[data-theme="marble"] .plan-trading.selected {
  border-color: rgba(69, 64, 52, 0.8);
  box-shadow: 0 14px 45px rgba(76, 64, 42, 0.16);
}
[data-theme="marble"] .plan-trading.selected .plan-select {
  border-color: rgba(69, 64, 52, 0.7);
  color: #14110c;
  background: rgba(69, 64, 52, 0.1);
}
[data-theme="marble"] .plan-memes {
  border-color: rgba(74, 53, 121, 0.34);
  background: linear-gradient(178deg, #fdfbf6, #f1ecf6 72%);
}
[data-theme="marble"] .plan-memes .plan-motif {
  border-color: rgba(74, 53, 121, 0.4);
  filter: none;
}
[data-theme="marble"] .plan-memes:hover {
  border-color: rgba(74, 53, 121, 0.55);
}
[data-theme="marble"] .plan-memes.selected {
  border-color: rgba(74, 53, 121, 0.75);
}
[data-theme="marble"] .plan-memes.selected .plan-select {
  border-color: rgba(74, 53, 121, 0.7);
  background: rgba(74, 53, 121, 0.12);
}
[data-theme="marble"] .plan-full {
  border-color: rgba(122, 88, 23, 0.55);
  background: linear-gradient(165deg, #fbf4e2, #f6efdd 48%, #f2ead2);
}
[data-theme="marble"] .plan-full:hover {
  border-color: rgba(122, 88, 23, 0.75);
}
[data-theme="marble"] .plan-full .plan-motif {
  border-color: rgba(122, 88, 23, 0.5);
  background: rgba(122, 88, 23, 0.08);
}
@supports (-webkit-background-clip: text) {
  [data-theme="marble"] .plan-full .plan-name {
    background: linear-gradient(95deg, #8a6420, #6b4d12 65%, #55431c);
    -webkit-background-clip: text;
    background-clip: text;
  }
}
[data-theme="marble"] .plan-full .plan-bullets {
  border-top-color: rgba(122, 88, 23, 0.3);
}
[data-theme="marble"] .plan-full.selected .plan-select {
  color: #171003;
  background: linear-gradient(
    100deg,
    var(--marble-gold-hi),
    var(--marble-gold)
  );
}
[data-theme="marble"] .instrument-options button.selected {
  border-color: rgba(22, 96, 109, 0.55);
  background: rgba(22, 96, 109, 0.06);
}
[data-theme="marble"] .telegram-explainer {
  border-color: rgba(22, 96, 109, 0.32);
  background: rgba(22, 96, 109, 0.05);
}
[data-theme="marble"] .success-plan.trading strong {
  color: #454034;
}
[data-theme="marble"] .form-error {
  border-color: rgba(166, 58, 42, 0.4);
  background: rgba(166, 58, 42, 0.07);
}

/* ============================================================
   8 · ADMIN — the same stone, back office
   ============================================================ */
[data-theme="marble"] .admin-shell {
  color: var(--paper);
  background: transparent;
}
[data-theme="marble"] .admin-sidebar {
  background: #f0ece1;
}
[data-theme="marble"] .admin-sidebar nav a {
  color: #605a4c;
}
[data-theme="marble"] .admin-sidebar nav a:hover {
  background: rgba(23, 18, 8, 0.045);
}
[data-theme="marble"] .admin-sidebar nav a.active {
  background: rgba(122, 88, 23, 0.1);
}
[data-theme="marble"] .admin-nav-label {
  color: #837b68;
}
[data-theme="marble"] .admin-topbar {
  background: rgba(240, 236, 227, 0.92);
}
[data-theme="marble"] .admin-search,
[data-theme="marble"] .admin-topbar > .admin-notification {
  color: #605a4c;
  background: rgba(23, 18, 8, 0.04);
}
[data-theme="marble"] .admin-system-state {
  color: #605a4c;
}
[data-theme="marble"] .applicant-drawer {
  background: #f6f3ea;
  box-shadow: -30px 0 90px rgba(76, 64, 42, 0.3);
}
[data-theme="marble"] .applicant-drawer-backdrop {
  background: rgba(60, 52, 36, 0.4);
}
[data-theme="marble"] .audience-preview details > div {
  border-color: #d6cfc0;
  background: #fbf9f3;
  box-shadow: 0 20px 60px rgba(76, 64, 42, 0.25);
}
[data-theme="marble"] .notification-actions {
  border-color: var(--marble-card-border);
  background: #faf8f1;
}
/* raised admin panels */
[data-theme="marble"] .admin-kpis article,
[data-theme="marble"] .coverage-board,
[data-theme="marble"] .studio-health,
[data-theme="marble"] .studio-flow,
[data-theme="marble"] .studio-tabs,
[data-theme="marble"] .studio-card,
[data-theme="marble"] .provider-board article,
[data-theme="marble"] .notification-drafts article,
[data-theme="marble"] .pipeline-counts button,
[data-theme="marble"] .applications-toolbar,
[data-theme="marble"] .application-table > header,
[data-theme="marble"] .studio-detail-grid section,
[data-theme="marble"] .manual-composer {
  background: var(--marble-card);
}
[data-theme="marble"] .application-row {
  background: rgba(255, 255, 255, 0.35);
}
[data-theme="marble"] .application-row:hover {
  background: rgba(255, 255, 255, 0.7);
}
[data-theme="marble"] .client-grid > button,
[data-theme="marble"] .plan-editor-grid > article {
  background: linear-gradient(145deg, #fbf9f3, #f2eee4);
}
[data-theme="marble"] .daily-brain-metrics > span,
[data-theme="marble"] .daily-job,
[data-theme="marble"] .manual-grid textarea,
[data-theme="marble"] .new-plan-card select {
  background: var(--marble-well);
  border-color: var(--marble-well-border);
  color: var(--paper);
}
/* admin muted grays, darkened for the light ground */
[data-theme="marble"] .audience-preview summary,
[data-theme="marble"] .audience-preview details small,
[data-theme="marble"] .studio-evidence > summary,
[data-theme="marble"] .studio-detail-grid small,
[data-theme="marble"] .studio-detail-grid p,
[data-theme="marble"] .admin-terminal-state,
[data-theme="marble"] .admin-page-title p,
[data-theme="marble"] .admin-kpis article > div,
[data-theme="marble"] .admin-kpis small,
[data-theme="marble"] .operations-queue header button,
[data-theme="marble"] .queue-item p,
[data-theme="marble"] .queue-item small,
[data-theme="marble"] .switch-list span small,
[data-theme="marble"] .switch-list em,
[data-theme="marble"] .system-foot small,
[data-theme="marble"] .coverage-market small,
[data-theme="marble"] .coverage-state > small,
[data-theme="marble"] .coverage-progress small,
[data-theme="marble"] .coverage-row > a,
[data-theme="marble"] .daily-brain-title p,
[data-theme="marble"] .daily-brain-metrics small,
[data-theme="marble"] .daily-job header small,
[data-theme="marble"] .daily-job > p,
[data-theme="marble"] .daily-job > footer,
[data-theme="marble"] .daily-candidate small,
[data-theme="marble"] .daily-safety-note small,
[data-theme="marble"] .studio-secondary-action small,
[data-theme="marble"] .studio-flow > div > span,
[data-theme="marble"] .studio-flow small,
[data-theme="marble"] .studio-tabs button,
[data-theme="marble"] .studio-instrument small,
[data-theme="marble"] .studio-card-body small,
[data-theme="marble"] .gate-row span,
[data-theme="marble"] .audience-preview small,
[data-theme="marble"] .provider-board p,
[data-theme="marble"] .provider-board dt,
[data-theme="marble"] .delivery-control-strip > span,
[data-theme="marble"] .delivery-control-strip small,
[data-theme="marble"] .notification-drafts p,
[data-theme="marble"] .notification-drafts small,
[data-theme="marble"] .notification-empty,
[data-theme="marble"] .pipeline-counts button,
[data-theme="marble"] .applications-toolbar > div,
[data-theme="marble"] .applications-toolbar button,
[data-theme="marble"] .application-table > header,
[data-theme="marble"] .application-row > span > b small,
[data-theme="marble"] .application-row > span:last-child,
[data-theme="marble"] .applicant-drawer > header p,
[data-theme="marble"] .applicant-summary small,
[data-theme="marble"] .application-timeline small,
[data-theme="marble"] .internal-note span,
[data-theme="marble"] .client-grid > button > div small,
[data-theme="marble"] .client-grid > button > footer,
[data-theme="marble"] .client-action-stack p,
[data-theme="marble"] .saved-admin-note small,
[data-theme="marble"] .plan-editor-grid label > span,
[data-theme="marble"] .plan-chip-list span,
[data-theme="marble"] .admin-safety small {
  color: #5f584a;
}
[data-theme="marble"] .audience-preview details p,
[data-theme="marble"] .studio-detail-grid b,
[data-theme="marble"] .notification-actions h2,
[data-theme="marble"] .saved-admin-note {
  color: var(--paper);
}
[data-theme="marble"] .delivery-control-strip > span {
  background: rgba(23, 18, 8, 0.04);
}
[data-theme="marble"] .switch-list i b {
  background: #fffdf8;
}
[data-theme="marble"] .switch-list i.on {
  border-color: rgba(29, 107, 69, 0.4);
  background: rgba(29, 107, 69, 0.1);
}
[data-theme="marble"] .studio-simulation-note {
  border-bottom-color: rgba(74, 53, 121, 0.3);
  color: #4a3579;
  background: rgba(74, 53, 121, 0.06);
}
[data-theme="marble"] .admin-real-gates .failed,
[data-theme="marble"] .button-danger {
  color: #a63a2a !important;
  border-color: rgba(166, 58, 42, 0.4) !important;
  background: rgba(166, 58, 42, 0.07) !important;
}
[data-theme="marble"] .admin-sidebar nav a b {
  color: #171003;
}

/* ============================================================
   9 · PAY PORTAL (token-driven; marble polish on top)
   ============================================================ */
[data-theme="marble"] .pay-shell {
  background: transparent;
}
[data-theme="marble"] .pay-hero {
  background: linear-gradient(160deg, #fdfbf6, #f2eee4);
}
[data-theme="marble"] .pay-amount {
  color: var(--brass-soft);
}
[data-theme="marble"] .pay-option:hover {
  border-color: var(--brass);
}
[data-theme="marble"] .pay-warn {
  border-color: rgba(122, 88, 23, 0.45);
  background: rgba(122, 88, 23, 0.07);
}
[data-theme="marble"] .pay-link {
  color: var(--brass-soft);
}

/* ---------- MARBLE hero, mobile: arc above + copy on clean marble ------ */