/* predict-reveal: every selector starts with .predict-reveal- */
.predict-reveal-root { display: grid; gap: var(--s4); }
.predict-reveal-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s2) var(--s4); }
.predict-reveal-step { margin: 0; font: 700 var(--fs-small)/1.3 var(--font-ui); color: var(--ink-2); }
/* the scenario: plain text under a red rule on the left, no panel */
.predict-reveal-card { display: grid; gap: var(--s1); padding: 2px 0 2px var(--s4); border-left: 2px solid var(--brand); }
.predict-reveal-kicker { font: 700 var(--fs-eyebrow)/1.3 var(--font-ui); color: var(--brand-ink); text-transform: uppercase; letter-spacing: var(--track-eyebrow); }
.predict-reveal-event { margin: 0; font: 700 var(--fs-ui-lg)/1.4 var(--font-ui); color: var(--ink); overflow-wrap: anywhere; }
.predict-reveal-ask { margin: 0; min-height: 1.45em; font: 400 var(--fs-ui)/1.45 var(--font-ui); color: var(--ink); }
.predict-reveal-ask:empty { display: none; }
.predict-reveal-btns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); }
.predict-reveal-btns .w-btn { padding: 10px var(--s2); }
.predict-reveal-btns .w-btn[aria-pressed="true"] { outline: 2px solid var(--ink); outline-offset: 2px; opacity: 1; }
.predict-reveal-chart { min-height: 170px; }
.predict-reveal-start { stroke: var(--ink-3); stroke-width: 1; stroke-dasharray: 6 4; }
.predict-reveal-slab { fill: var(--ink); font-weight: 700; }
.predict-reveal-level { stroke: var(--ink); stroke-width: 1.5; stroke-dasharray: 3 3; }
.predict-reveal-llab { fill: var(--ink); font-weight: 700; }
.predict-reveal-ax { font: 400 var(--fs-chart) var(--font-ui); fill: var(--ink-3); }
.predict-reveal-q { font: 700 var(--fs-chart) var(--font-ui); fill: var(--ink-2); }
.predict-reveal-line { stroke: var(--ink); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.predict-reveal-line-up { stroke: var(--up); }
.predict-reveal-line-down { stroke: var(--down); }
.predict-reveal-now { fill: var(--brand); stroke: var(--paper); stroke-width: 2; }
.predict-reveal-end { font: 700 var(--fs-chart) var(--font-ui); font-variant-numeric: tabular-nums; }
.predict-reveal-end-up { fill: var(--up); }
.predict-reveal-end-down { fill: var(--down); }
.predict-reveal-explain { display: grid; gap: var(--s3); padding-top: var(--s3); border-top: var(--rule); animation: predict-reveal-in .4s var(--ease); outline: none; }
.predict-reveal-explain:focus-visible { box-shadow: var(--focus); }
@keyframes predict-reveal-in { from { opacity: 0; transform: translateY(6px); } }
.predict-reveal-verdict { margin: 0; font: 700 var(--fs-ui)/1.45 var(--font-ui); color: var(--ink); }
.predict-reveal-verdict[data-tone="up"] { color: var(--up); }
.predict-reveal-verdict[data-tone="down"] { color: var(--down); }
.predict-reveal-why { margin: 0; font: 400 var(--fs-ui)/1.5 var(--font-ui); color: var(--ink); }
.predict-reveal-nav { display: flex; flex-wrap: wrap; gap: var(--s3); }
.predict-reveal-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s2) var(--s3); }
.predict-reveal-tally { margin: 0; font: 400 var(--fs-small)/1.3 var(--font-ui); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.predict-reveal-dots { display: inline-flex; flex-wrap: wrap; gap: var(--s1); }
.predict-reveal-dot { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--mist); font: 700 var(--fs-small)/1 var(--font-ui); color: var(--ink-2); }
.predict-reveal-dot[data-tone="up"] { background: var(--up-wash); color: var(--up); }
.predict-reveal-dot[data-tone="down"] { background: var(--down-wash); color: var(--down); }
.predict-reveal-dot[data-tone="neutral"] { background: var(--mist-2); color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .predict-reveal-explain { animation: none; } }
@media (max-width: 24rem) {
  .predict-reveal-btns .w-btn { padding-inline: var(--s1); }
}
