/* Compact version of the predictor's filled, rounded-square history cells. */
.predictor-demo-bead{
  width:100%;height:auto;aspect-ratio:1;min-width:0;box-sizing:border-box;
  border:0;border-radius:clamp(7px,1.7cqi,11px);color:#fff;font-size:clamp(10px,2.5cqi,16px);
  background:linear-gradient(145deg,color-mix(in srgb,var(--bead-color) 78%,white),color-mix(in srgb,var(--bead-color) 78%,#13151a));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--bead-color) 36%,transparent),inset 0 0 0 2px rgba(10,5,15,.24),inset 0 1px rgba(255,255,255,.3),0 5px 10px rgba(0,0,0,.54);
  filter:none;animation:none;position:relative;z-index:1;
}
.predictor-demo-road{position:relative;container-type:inline-size;grid-auto-rows:auto;gap:6px;align-items:start}
.predictor-demo-workspace{position:relative}
.preview-pattern-layer{position:absolute;inset:0;z-index:5;pointer-events:none}
.preview-pattern-layer>i{position:absolute;border:2px solid #e9c36c;border-radius:10px;box-shadow:0 0 12px #e9c36c55;animation:preview-pattern-breathe 1.35s ease-in-out infinite}
.preview-pattern-layer[data-state="win"]>i{border-color:#55e5b5;box-shadow:0 0 16px #55e5b566}
.preview-pattern-layer[data-state="loss"]>i{border-color:#ff667b;box-shadow:0 0 12px #ff667b44;animation:none}
.preview-pattern-layer[data-state="push"]>i{border-color:#55dcb0}
.predictor-demo-hand.is-pattern-hand{outline:2px solid #e9c36c;outline-offset:3px}
.predictor-demo-input [data-sim-outcome]{position:relative}
.predictor-demo-input [data-sim-outcome].is-bet{border-color:var(--outcome-color);box-shadow:0 0 18px color-mix(in srgb,var(--outcome-color) 25%,transparent)}
.predictor-demo-input [data-sim-outcomes]{padding-top:24px}
.demo-bet-hand{display:none;position:absolute;top:-36px;left:calc(50% - 14px);width:28px;font-size:32px;line-height:36px;color:#fff;filter:drop-shadow(0 2px 4px #000);pointer-events:none}
.is-bet-pending .demo-bet-hand{display:block;animation:preview-bet-point .9s ease-in-out infinite}
.demo-bet-summary{display:grid;gap:7px;margin:12px 16px 4px;padding:13px 14px;border:1px solid #2a303a;border-radius:10px;background:#0c0f14}
.demo-bet-summary>strong{font-size:11px;letter-spacing:.07em;color:#e9c36c}
.demo-bet-summary>span{font-size:12px;color:#e2e5ea;line-height:1.4}
.demo-bet-summary>small{font-size:10px;line-height:1.5;color:#929ba8}
@keyframes preview-pattern-breathe{0%,100%{opacity:.65}50%{opacity:1}}
@keyframes preview-bet-point{0%,100%{transform:translateY(-3px)}50%{transform:translateY(3px)}}
.predictor-demo-bead.is-latest{z-index:3;animation:preview-result-arrive 650ms cubic-bezier(.18,.9,.25,1)}
.predictor-demo-input i{border-radius:6px}
@keyframes preview-result-arrive{
  0%{transform:scale(1);filter:brightness(1)}
  38%{transform:scale(1.24);filter:brightness(1.4)}
  72%{transform:scale(.97);filter:brightness(1.08)}
  100%{transform:scale(1);filter:brightness(1)}
}
@media(prefers-reduced-motion:reduce){.predictor-demo-bead.is-latest{animation:none}}