/* ══ Inline "Try it" quick backtest (partials/try_backtest.php) ═════════ */
.tb-card { background: var(--tl-bg2, #fff); border: 1.5px solid #bfdbfe; border-radius: 14px; padding: 16px 18px; margin-bottom: 16px;
  box-shadow: 0 6px 22px rgba(37, 99, 235, .08); scroll-margin-top: 80px; }
.tb-head { display: flex; gap: 12px; align-items: flex-start; }
.tb-bolt { flex-shrink: 0; width: 36px; height: 36px; border-radius: 10px; background: #fff7ed; color: #ea580c; display: flex; align-items: center; justify-content: center; font-size: 18px; }
.tb-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 16px; color: var(--tl-text-dark, #0f172a); margin: 0; letter-spacing: -.01em; }
.tb-sub { font-size: 12.5px; color: var(--tl-text2, #475569); margin: 3px 0 0; line-height: 1.5; }

.tb-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-top: 12px; }
.tb-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.tb-field label { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--tl-text3, #94a3b8); }
.tb-field select { font: inherit; font-size: 13px; padding: 8px 10px; border: 1.5px solid #e2e8f0; border-radius: 8px; background: #fff; color: #0f172a; max-width: 100%; }
.tb-field select:focus { outline: none; border-color: #2563eb; }
.tb-strat { flex: 1 1 200px; }
.tb-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.tb-chip { font: inherit; font-size: 12px; font-weight: 600; padding: 6px 10px; border: 1.5px solid #e2e8f0; border-radius: 99px; background: #fff; color: #334155; cursor: pointer; }
.tb-chip:hover { border-color: #93c5fd; }
.tb-chip.on { background: #1e3a8a; border-color: #1e3a8a; color: #fff; }
.tb-run { font: inherit; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; min-height: 40px; border: 0; border-radius: 9px;
  background: #ea580c; color: #fff; font-size: 13.5px; font-weight: 700; cursor: pointer; transition: background .15s; }
.tb-run:hover { background: #c2410c; }
.tb-run[disabled] { opacity: .6; cursor: wait; }
.tb-spin { width: 14px; height: 14px; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff; border-radius: 50%; animation: tbspin .7s linear infinite; }
@keyframes tbspin { to { transform: rotate(360deg); } }
.tb-note { font-size: 11px; color: var(--tl-text3, #94a3b8); margin-top: 8px; }

.tb-out { margin-top: 14px; }
.tb-out:empty { display: none; }
.tb-verdict { font-size: 14px; line-height: 1.5; color: #0f172a; background: #f8fafc; border-radius: 10px; padding: 10px 12px; }
.tb-verdict b.pos { color: #15803d; } .tb-verdict b.neg { color: #b91c1c; }
.tb-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.tb-metric { border: 1px solid #e2e8f0; border-radius: 9px; padding: 8px 10px; }
.tb-metric .l { font-size: 10.5px; font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: .04em; }
.tb-metric .v { font-size: 17px; font-weight: 800; color: #0f172a; font-variant-numeric: tabular-nums; margin-top: 2px; }
.tb-metric .v.pos { color: #15803d; } .tb-metric .v.neg { color: #b91c1c; }
.tb-spark { margin-top: 10px; height: 70px; }
.tb-spark svg { width: 100%; height: 100%; display: block; }
.tb-trades { width: 100%; border-collapse: collapse; font-size: 12px; margin-top: 10px; font-variant-numeric: tabular-nums; }
.tb-trades th { text-align: left; font-size: 10.5px; color: #94a3b8; font-weight: 700; padding: 4px 6px; border-bottom: 1px solid #f1f5f9; }
.tb-trades td { padding: 5px 6px; border-bottom: 1px solid #f8fafc; color: #334155; }
.tb-trades td.pos { color: #15803d; font-weight: 700; } .tb-trades td.neg { color: #b91c1c; font-weight: 700; }
.tb-locked { position: relative; }
.tb-locked tbody tr:nth-child(n+3) { filter: blur(3.5px); user-select: none; }   /* guests: first 2 trades readable */
.tb-cta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 12px; padding: 12px; border-radius: 10px; background: #eff6ff; }
.tb-cta p { flex: 1 1 220px; margin: 0; font-size: 12.5px; color: #1e3a8a; line-height: 1.5; }
.tb-cta a.tb-btn { display: inline-flex; align-items: center; padding: 9px 16px; border-radius: 8px; background: #1e3a8a; color: #fff; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.tb-cta a.tb-btn:hover { background: #1d4ed8; }
.tb-cta a.tb-alt { font-size: 12.5px; color: #475569; text-decoration: none; }
.tb-msg { font-size: 13px; line-height: 1.55; border-radius: 10px; padding: 10px 12px; }
.tb-msg.err { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.tb-msg.limit { background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; }
.tb-disclaimer { font-size: 10.5px; color: #94a3b8; margin-top: 8px; }

.tb-row-btn { font: inherit; font-size: 11px; font-weight: 700; color: #ea580c; background: #fff7ed; border: 1px solid #fed7aa; border-radius: 6px; padding: 3px 8px; cursor: pointer; white-space: nowrap; }
.tb-row-btn:hover { background: #ffedd5; }

@media (max-width: 640px) {
  .tb-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tb-run { width: 100%; }
  .tb-strat { flex-basis: 100%; }
}
