/*
 * Perpeto Backtest Page Styles
 * Enqueued via functions.php — only loads on pages using "Backtest Study" template
 * All selectors scoped to .perpeto-backtest wrapper
 */

:root {
  /* Perpeto brand palette */
  --purple: #6B67FB;
  --purple-deep: #5346D4;
  --purple-dark: #0E0B6B;
  --purple-soft: #DBE4F7;
  --purple-wash: #F5F5FF;
  --purple-ghost: rgba(107,103,251,0.08);
  --purple-line: rgba(107,103,251,0.18);

  --bg: #ffffff;
  --bg-alt: #F5F5FF;
  --paper: #ffffff;

  --ink: #0E0B6B;
  --ink-soft: #3A3A44;
  --ink-muted: #959595;

  --accent: var(--purple);
  --accent-soft: var(--purple-soft);
  --hairline: rgba(14,11,107,.10);
  --line: #0E0B6B;

  --gain: #1F7A4C;
  --loss: #B8325A;

  /* Chart colors */
  --c-cash: #DBE4F7;
  --c-alloc: #6B67FB;
  --c-profit: #0E0B6B;
}
.perpeto-backtest * { box-sizing: border-box; margin: 0; padding: 0; }
.perpeto-backtest {
  background: var(--bg);
  color: var(--ink);
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
.display { font-family: 'Inter', sans-serif; font-weight: 700; letter-spacing: -0.02em; }
.mono { font-family: 'Inter', sans-serif; font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }

/* layout */
.container { max-width: 1180px; margin: 0 auto; padding: 0 48px; }
.perpeto-backtest section { border-bottom: 1px solid var(--hairline); padding: 80px 0; position: relative; }

/* top bar */
.topbar {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--hairline);
  padding: 18px 48px;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px;
}
.logo {
  display: flex; align-items: center;
}
.logo svg {
  height: 32px; width: auto; display: block;
}
.topbar-meta { font-family: 'Inter', sans-serif; font-size: 11px; color: var(--ink-muted); letter-spacing: .1em; }

/* hero */
.hero {
  padding-top: 80px; padding-bottom: 100px;
  background: linear-gradient(180deg, var(--purple-wash) 0%, #ffffff 85%);
  border-bottom: 1px solid var(--hairline);
}
.hero-label {
  display: inline-block;
  font-family: 'Inter', sans-serif; font-size: 13px;
  letter-spacing: .15em; font-weight: 600; text-transform: uppercase; color: var(--ink-muted);
  margin-bottom: 48px;
}
.hero h1 {
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: clamp(36px, 4.5vw, 58px);
  line-height: 1.05;
  letter-spacing: -0.025em;
  max-width: 22ch;
  margin-bottom: 48px;
  color: var(--ink);
}
.hero h1 .accent { color: var(--purple); font-weight: 700; }
.hero h1 em { font-style: normal; font-weight: 700; color: var(--ink); }
.hero-sub {
  font-family: 'Inter', sans-serif; font-weight: 300;
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.35; max-width: 52ch;
  color: var(--ink-soft);
  margin-bottom: 64px;
}
.hero-intro {
  max-width: 62ch; font-size: 17px; line-height: 1.65;
  color: var(--ink-soft); margin-bottom: 80px;
}
.hero-intro p + p { margin-top: 18px; }
.hero-intro strong { color: var(--ink); font-weight: 700; }

/* key fact strip */
.keyfacts {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--hairline); border: 1px solid var(--hairline);
}
.keyfact { background: var(--paper); padding: 28px 24px; }
.keyfact-label {
  font-family: 'Inter', sans-serif; font-size: 10px;
  letter-spacing: .18em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 12px;
}
.keyfact-value {
  font-family: 'Inter', sans-serif; font-size: 26px; font-weight: 700;
  letter-spacing: -.03em; color: var(--ink);
}
.keyfact-value .muted { color: var(--ink-muted); font-weight: 600; }
.keyfact-value .accent-text { color: var(--purple); }
.keyfact-value .kf-split {
  font-size: 19px; font-weight: 700; letter-spacing: -.015em;
  color: var(--ink); display: inline-block;
}
.keyfact-value .kf-dot { color: var(--purple); font-weight: 600; margin: 0 4px; }
.keyfact-note { font-size: 12px; color: var(--ink-muted); margin-top: 6px; }

/* section headers */
.section-kicker {
  font-family: 'Inter', sans-serif; font-size: 13px;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--ink-muted); margin-bottom: 24px; font-weight: 600; font-weight: 600;
}
h2.section-title {
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: clamp(28px, 3vw, 40px); line-height: 1.1;
  letter-spacing: -0.02em; max-width: 18ch; margin-bottom: 28px;
  color: var(--ink);
}
h2.section-title em { font-style: normal; color: var(--purple); }
.section-lede {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 22px; line-height: 1.4; color: var(--ink-soft);
  max-width: 56ch; margin-bottom: 60px;
}

/* methodology */
.method-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px; align-items: start; }
.method-prose p { font-size: 16px; line-height: 1.7; color: var(--ink-soft); margin-bottom: 20px; }
.method-prose strong { color: var(--ink); font-weight: 700; }
.method-specs { border-top: 2px solid var(--ink); }
.spec-row {
  display: grid; grid-template-columns: 1fr 1.5fr;
  border-bottom: 1px solid var(--hairline);
  padding: 20px 0; gap: 32px;
}
.spec-label {
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: .15em; text-transform: uppercase; color: var(--ink-muted);
}
.spec-value { font-size: 15px; line-height: 1.5; color: var(--ink); font-weight: 500; }

.caveat-box {
  margin-top: 48px; padding: 36px 40px;
  background: var(--purple-wash); border-left: 3px solid var(--purple);
  border-radius: 0 8px 8px 0;
}
.caveat-title {
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; color: var(--purple-dark); margin-bottom: 18px;
}
.caveat-list { list-style: none; }
.caveat-list li {
  font-size: 14px; line-height: 1.6; color: var(--ink-soft);
  padding: 10px 0 10px 22px; position: relative;
  border-top: 1px solid rgba(14,11,107,.12);
}
.caveat-list li:first-child { border-top: none; }
.caveat-list li::before {
  content: "—"; position: absolute; left: 0; color: var(--purple);
  font-family: 'Inter', sans-serif; font-weight: 600;
}
.caveat-list strong { color: var(--ink); font-weight: 700; }

.method-close {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 22px; line-height: 1.4; color: var(--ink);
  max-width: 44ch; margin-top: 72px; padding-left: 24px;
  border-left: 3px solid var(--purple);
}

/* results - cards */
.result-cards { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; margin-top: 0; }

.tables-context {
  font-family: 'Inter', sans-serif;
  font-size: 10px; font-weight: 500; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-muted);
  text-align: right; padding-bottom: 12px;
  border-bottom: 1px solid var(--hairline);
  margin-top: 40px;
}
.result-card {
  background: var(--paper); padding: 28px 24px;
  border: 1px solid var(--hairline); border-radius: 12px;
  position: relative;
  box-shadow: 0 2px 24px rgba(14,11,107,.06);
}
.result-tag {
  font-family: 'Inter', sans-serif; font-size: 9px; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 12px;
}
.result-tag::before { content: "⏵ "; color: var(--purple); }
.result-card h3 {
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 28px;
  letter-spacing: -.015em; margin-bottom: 6px;
}
.result-subtitle {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 13px; color: var(--ink-soft); margin-bottom: 18px;
  min-height: 20px;
}
.result-narrative { font-size: 13px; line-height: 1.55; color: var(--ink-soft); margin-bottom: 20px; min-height: 100px; }
.result-narrative strong { color: var(--ink); font-weight: 700; }

/* metric table */
.metrics { border-top: 2px solid var(--ink); border-bottom: 1px solid var(--ink); }
.metrics-header {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 8px;
  padding: 10px 0; font-family: 'Inter', sans-serif;
  font-size: 9px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600;
  color: var(--ink-muted); border-bottom: 1px solid var(--hairline);
}
.metrics-header > div:last-child {
  background: var(--purple-wash);
  margin: -10px -6px; padding: 10px 6px;
}
.metric-row {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 8px;
  padding: 10px 0; border-bottom: 1px solid var(--hairline);
  align-items: baseline;
}
.metric-row > div:last-child {
  background: var(--purple-wash);
  margin: -10px -6px; padding: 10px 6px;
}
.metric-row:last-child { border-bottom: none; }
.metric-name { font-size: 11.5px; color: var(--ink-soft); line-height: 1.3; }
.metric-cagr-note { display: block; font-size: 9px; color: var(--ink-muted); font-weight: 400; letter-spacing: .02em; margin-top: 2px; }

/* metric-name tooltips */
.metric-name.has-tip {
  position: relative;
}
.metric-name.has-tip .tip-word {
  border-bottom: 1px dotted var(--ink-muted);
  cursor: help;
}
.metric-name.has-tip .tip-word:hover + .tip-body,
.metric-name.has-tip .tip-word:focus + .tip-body {
  opacity: 1; visibility: visible; transform: translateY(-4px);
}
.metric-name.has-tip .tip-body {
  position: absolute; z-index: 100;
  bottom: 100%; left: 0;
  background: var(--ink); color: #fff;
  padding: 10px 14px; border-radius: 6px;
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 400;
  line-height: 1.5; letter-spacing: 0;
  min-width: 220px; max-width: 260px;
  opacity: 0; visibility: hidden;
  transition: opacity .15s, visibility .15s, transform .15s;
  pointer-events: none;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.metric-name.has-tip .tip-body::after {
  content: ""; position: absolute; top: 100%; left: 20px;
  border: 6px solid transparent; border-top-color: var(--ink);
}
.metric-val {
  font-family: 'Inter', sans-serif; font-size: 13px;
  font-weight: 400; letter-spacing: -.01em; color: var(--ink);
}
.metric-val.win { font-weight: 700; }
.metric-val.dim { color: var(--ink-muted); }
.metric-val.loss { color: var(--loss); font-weight: 400; }
.metric-val.loss.win { font-weight: 700; }

.result-reading {
  margin-top: 20px; padding-top: 18px; border-top: 1px dashed var(--hairline);
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 13px; line-height: 1.5; color: var(--ink);
}
.result-reading strong { font-weight: 700; color: var(--purple); }

/* decisive */
.decisive {
  margin-top: 80px;
  background: linear-gradient(135deg, var(--purple-deep) 0%, var(--purple) 100%);
  color: #ffffff;
  padding: 64px 56px; position: relative; overflow: hidden;
  border-radius: 12px;
}
.decisive::before {
  content: "THE DECISIVE NUMBER";
  position: absolute; top: 22px; right: 32px;
  font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: .3em; color: rgba(255,255,255,.4);
}
.decisive h4 {
  font-family: 'Inter', sans-serif; font-weight: 600;
  font-size: 22px; line-height: 1.25; letter-spacing: -.015em;
  margin-bottom: 12px; max-width: 24ch;
}
.decisive-lede { color: rgba(255,255,255,.72); font-size: 15px; margin-bottom: 40px; max-width: 56ch; }
.decisive-table { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 0; }
.decisive-table > div {
  padding: 24px 0; border-top: 1px solid rgba(255,255,255,.2);
}
.decisive-table .dt-head {
  font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255,255,255,.55); border-top: none; padding-bottom: 14px; padding-top: 0;
}
.decisive-table .dt-asset {
  font-family: 'Inter', sans-serif; font-size: 22px; font-weight: 700;
}
.decisive-table .dt-val {
  font-family: 'Inter', sans-serif; font-size: 18px; font-weight: 500;
  color: rgba(255,255,255,.65);
}
.decisive-table .dt-val.strong {
  color: #ffffff; font-weight: 700;
}
.decisive-table .dt-date {
  display: block; margin-top: 4px;
  font-size: 10px; font-weight: 400;
  letter-spacing: .08em; color: rgba(255,255,255,.4);
}
.decisive-close {
  margin-top: 40px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.2);
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 20px; line-height: 1.4; color: rgba(255,255,255,.95); max-width: 46ch;
}

/* charts */
.asset-switch {
  display: flex; border: 1.5px solid var(--ink); margin-bottom: 48px;
  font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .1em;
  border-radius: 4px; overflow: hidden; max-width: 100%;
}
.asset-switch button {
  flex: 1; background: transparent; border: none; padding: 12px 20px;
  font-family: inherit; font-size: inherit; font-weight: inherit; letter-spacing: inherit;
  color: var(--ink-soft); cursor: pointer; transition: all .2s;
  text-transform: uppercase;
}
.asset-switch button.active { background: var(--purple); color: #fff; }

.chart-block { margin-bottom: 72px; }
.chart-header {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-bottom: 20px; border-bottom: 2px solid var(--ink); margin-bottom: 32px;
}
.chart-title {
  font-family: 'Inter', sans-serif; font-size: 26px; font-weight: 700;
  letter-spacing: -.025em;
}
.chart-title em { font-style: normal; color: var(--purple); }
.chart-num {
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .2em; color: var(--ink-muted); text-transform: uppercase;
}
.chart-desc { font-size: 14px; color: var(--ink-soft); margin-bottom: 28px; max-width: 72ch; line-height: 1.6; }
.chart-desc strong { color: var(--ink); font-weight: 700; }
.chart-container {
  background: var(--paper); border: 1px solid var(--hairline);
  padding: 32px; height: 380px; position: relative; border-radius: 8px;
}
.chart-container canvas { max-height: 100%; }

.process-notes {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 32px; margin-top: 48px;
}
.pn-context {
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: .15em; text-transform: uppercase; color: var(--ink-muted);
  margin-top: 80px; padding-top: 24px;
  border-top: 2px solid var(--ink);
}
.pn-context span { color: var(--purple); font-weight: 700; }
.process-note h5 {
  font-family: 'Inter', sans-serif; font-size: 16px; font-weight: 600;
  letter-spacing: -.01em; margin-bottom: 10px;
}
.process-note h5::before {
  content: attr(data-num);
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 600;
  color: var(--purple); margin-right: 10px; letter-spacing: .15em;
}
.process-note p { font-size: 13px; line-height: 1.6; color: var(--ink-soft); }
.process-note strong { color: var(--ink); font-weight: 700; }
.process-note .bignum {
  font-family: 'Inter', sans-serif; font-size: 36px;
  font-weight: 700; letter-spacing: -.02em; color: var(--purple);
  display: block; margin: 8px 0;
}

/* honest */
.honest-grid { display: grid; grid-template-columns: 1fr; gap: 0; }
.honest-item {
  display: grid; grid-template-columns: 80px 1fr; gap: 48px;
  padding: 48px 0; border-top: 1px solid var(--hairline);
  align-items: start;
}
.honest-item:first-child { border-top: 2px solid var(--ink); }
.honest-item:last-child { border-bottom: 2px solid var(--ink); }
.honest-num {
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 48px; line-height: 1; color: var(--purple);
  letter-spacing: -.04em;
}
.honest-body h4 {
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 22px;
  letter-spacing: -.015em; margin-bottom: 14px; line-height: 1.2;
}
.honest-body p { font-size: 15px; line-height: 1.7; color: var(--ink-soft); max-width: 64ch; }
.honest-body strong { color: var(--ink); font-weight: 700; }
.honest-close {
  margin-top: 64px; font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 24px; line-height: 1.4; color: var(--ink);
  max-width: 48ch; padding-left: 24px; border-left: 3px solid var(--purple);
}

/* conclusion */
.conclusion {
  background: linear-gradient(135deg, var(--purple-dark) 0%, var(--purple-deep) 100%);
  color: #fff; border-bottom: none;
}
.conclusion .section-kicker { color: #DBE4F7; }
.conclusion h2.section-title { color: #fff; max-width: 24ch; }
.conclusion h2.section-title em { color: #DBE4F7; }
.conclusion-body {
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px;
  margin-top: 60px; padding-top: 60px; border-top: 1px solid rgba(255,255,255,.18);
}
.conclusion-col p {
  font-family: 'Inter', sans-serif; font-weight: 300; font-size: 19px;
  line-height: 1.5; color: rgba(255,255,255,.88); margin-bottom: 20px;
}
.conclusion-col p.tag {
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase;
  color: #DBE4F7; margin-bottom: 16px;
}
.conclusion-col p em { font-weight: 700; color: #fff; font-style: normal; }
.conclusion-close {
  margin-top: 60px; padding-top: 60px;
  border-top: 1px solid rgba(255,255,255,.18);
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: 26px; line-height: 1.4; max-width: 46ch; color: #fff;
}
.conclusion-close strong { font-weight: 700; color: #DBE4F7; }

/* CTA */
.cta-block { margin-top: 80px; display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.btn {
  font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700;
  letter-spacing: .03em;
  padding: 20px 36px; border: 1.5px solid; cursor: pointer;
  transition: all .2s; text-decoration: none; display: inline-block;
  border-radius: 6px;
}
.btn-primary {
  background: #fff; color: var(--purple-dark); border-color: #fff;
}
.btn-primary:hover { background: var(--purple-soft); color: var(--purple-dark); }
.btn-secondary {
  background: transparent; color: #fff; border-color: rgba(255,255,255,.4);
}
.btn-secondary:hover { border-color: #fff; }
.cta-micro {
  font-family: 'Inter', sans-serif; font-size: 11px;
  letter-spacing: .1em; color: rgba(255,255,255,.5);
  margin-top: 28px; display: block;
}

/* footer */
.perpeto-backtest footer {
  background: #0E0B6B; color: rgba(255,255,255,.4);
  padding: 32px 48px; font-family: 'Inter', sans-serif;
  font-size: 11px; letter-spacing: .1em;
  display: flex; justify-content: space-between;
}

@media (max-width: 1199px) {

  .container { padding: 0 32px; }
  section { padding: 72px 0; }
  .method-grid { grid-template-columns: 1fr; gap: 48px; }
  .result-cards { grid-template-columns: 1fr; gap: 24px; }
  .result-card { padding: 32px 24px; }
  .keyfacts { grid-template-columns: repeat(2, 1fr); }
  .decisive { padding: 40px 28px; }
  .decisive-table { grid-template-columns: 1fr; }
  .decisive-table .dt-head { display: none; }
  .decisive-table .dt-asset {
    font-size: 18px; padding: 20px 0 6px 0;
    border-top: 1px solid rgba(255,255,255,.2);
  }
  .decisive-table > div:nth-child(2),
  .decisive-table > div:nth-child(3),
  .decisive-table > div:nth-child(4) {
    border-top: none;
  }
  .decisive-table .dt-val { font-size: 15px; padding: 4px 0; display: flex; justify-content: space-between; align-items: baseline; }
  .decisive-table .dt-val::before {
    font-family: 'Inter', sans-serif;
    font-size: 10px; letter-spacing: .15em; text-transform: uppercase;
    color: rgba(255,255,255,.5);
  }
  .decisive-table .dt-val:nth-child(4n+2)::before { content: "Peak equity"; }
  .decisive-table .dt-val:nth-child(4n+3)::before { content: "Final equity"; }
  .decisive-table .dt-val:nth-child(4n)::before { content: "Loss from peak"; }
  .decisive-table .dt-date { display: inline; margin-left: 6px; }
  .process-notes { grid-template-columns: 1fr 1fr; gap: 24px; }
  .honest-item { grid-template-columns: 1fr; gap: 12px; }
  .conclusion-body { grid-template-columns: 1fr; gap: 40px; }

  /* Mobile chart fixes */
  .chart-container {
    padding: 12px;
    height: 300px;
    width: 100%;
    box-sizing: border-box;
  }
  .chart-container canvas {
    display: block;
  }
  .chart-title { font-size: 22px; }
  .chart-desc { font-size: 13px; }
  }

/* reinvest toggle + strip */
.reinvest-toggle{display:inline-flex;border:1px solid var(--purple-line);border-radius:8px;overflow:hidden;margin:4px 0 12px;background:var(--paper)}
.reinvest-toggle button{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.02em;padding:10px 16px;border:0;background:transparent;color:var(--ink-muted);cursor:pointer;transition:background .15s,color .15s}
.reinvest-toggle button.active{background:var(--purple);color:#fff;font-weight:600}
.reinvest-toggle button:not(.active):hover{color:var(--ink)}
.reinvest-note{font-size:13px;line-height:1.55;color:var(--ink-muted);margin:0 0 30px;max-width:66ch}
.reinvest-note strong{color:var(--ink);font-weight:700}
@media(max-width:520px){.reinvest-toggle{flex-direction:column;width:100%}.reinvest-toggle button{width:100%}}
.reinvest-strip{background:var(--purple-wash);border-top:1px solid var(--purple-line);border-bottom:1px solid var(--purple-line);padding:56px 0}
.reinvest-strip .rs-kicker{font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-muted);font-weight:600;margin-bottom:16px}
.reinvest-strip .rs-lede{font-size:17px;line-height:1.6;color:var(--ink-soft);max-width:70ch;margin-bottom:32px}
.reinvest-strip .rs-lede strong{color:var(--ink);font-weight:700}
.rs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--purple-line);border:1px solid var(--purple-line)}
.rs-cell{background:var(--paper);padding:24px}
.rs-asset{font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:10px}
.rs-values{font-family:'Inter',sans-serif;font-size:22px;font-weight:700;letter-spacing:-.015em;color:var(--ink)}
.rs-values .rs-arrow{color:var(--ink-muted);font-weight:600;margin:0 6px}
.rs-values .rs-to{color:var(--purple)}
.rs-delta{font-size:13px;color:var(--purple-deep);font-weight:700;margin-top:6px}
.rs-note{font-size:12px;color:var(--ink-muted);margin-top:4px}
.rs-foot{font-size:13px;color:var(--ink-muted);margin-top:24px}
.rs-foot strong{color:var(--ink)}
@media(max-width:767px){.rs-grid{grid-template-columns:1fr}}

/* compact toggles + reinvested badge */
.reinvest-toggle.compact{margin:0 0 18px}
.reinvest-toggle.compact button{padding:6px 13px;font-size:11px}
.chart-right{display:flex;align-items:center;gap:10px}
.ri-badge{display:none;align-items:center;gap:6px;font-family:'Inter',sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:#fff;background:var(--purple);padding:4px 9px;border-radius:5px;line-height:1;white-space:nowrap}
.ri-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;display:inline-block}
body.reinvest-on .ri-badge{display:inline-flex}
.decisive-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.tables-context .ri-badge{margin-left:10px}
@media (max-width: 1199px) {
  .chart-container { padding: 24px 16px; }
}

@media (max-width: 767px) {
  .container { padding: 0 20px; }
  section { padding: 56px 0; }
  .chart-container { padding: 16px 8px; height: 320px; }
  .asset-switch { font-size: 11px; }
  .asset-switch button { padding: 12px 8px; }
  .hero-label { font-size: 12px; margin-bottom: 32px; }
  .section-kicker { font-size: 12px; margin-bottom: 18px; }
}

/* Force tabular numerals for data alignment */
.perpeto-backtest .metric-val,
.perpeto-backtest .keyfact-value,
.perpeto-backtest .spec-value,
.perpeto-backtest .chart-num,
.perpeto-backtest .decisive-table .dt-val,
.perpeto-backtest .keyfact-label,
.perpeto-backtest .spec-label,
.perpeto-backtest .metrics-header,
.perpeto-backtest .result-tag {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

/* ================================================
 * WP theme override: force button visibility & prevent
 * Hello Elementor / Elementor Pro from injecting red/pink hover
 * ================================================ */

/* Asset switcher (BTC/USDT, ETH/USDT tabs) */
.perpeto-backtest .asset-switch button,
.perpeto-backtest .asset-switch button:hover,
.perpeto-backtest .asset-switch button:focus,
.perpeto-backtest .asset-switch button:active {
  background: transparent;
  color: var(--ink);
  border: 0;
  box-shadow: none;
  outline: none;
  text-shadow: none;
  font-family: 'Inter', sans-serif;
}
.perpeto-backtest .asset-switch button:not(.active):hover {
  background: rgba(107,103,251,0.08);
  color: var(--purple);
}
.perpeto-backtest .asset-switch button.active,
.perpeto-backtest .asset-switch button.active:hover,
.perpeto-backtest .asset-switch button.active:focus {
  background: var(--purple);
  color: #fff;
}

/* Reinvest toggle (Standard/Reinvested pill) */
.perpeto-backtest .reinvest-toggle button,
.perpeto-backtest .reinvest-toggle button:hover,
.perpeto-backtest .reinvest-toggle button:focus,
.perpeto-backtest .reinvest-toggle button:active {
  background: transparent;
  color: var(--ink);
  border: 0;
  box-shadow: none;
  outline: none;
  text-shadow: none;
  font-family: 'Inter', sans-serif;
}
.perpeto-backtest .reinvest-toggle button:not(.active):hover {
  background: rgba(107,103,251,0.08);
  color: var(--purple);
}
.perpeto-backtest .reinvest-toggle button.active,
.perpeto-backtest .reinvest-toggle button.active:hover,
.perpeto-backtest .reinvest-toggle button.active:focus {
  background: var(--purple);
  color: #fff;
  font-weight: 600;
}

/* Prevent WP theme from styling ANY button inside backtest wrapper */
.perpeto-backtest button:focus-visible {
  outline: 2px solid var(--purple);
  outline-offset: 2px;
}