.goaok-prediction-dashboard { padding: clamp(24px, 4vw, 38px); border: 1px solid var(--goaok-border); border-radius: var(--goaok-radius-lg); background: linear-gradient(145deg, #181a3d, #111329); color: #f7f8ff; box-shadow: var(--goaok-shadow); }
.goaok-prediction-dashboard h2, .goaok-prediction-dashboard h3 { color: #fff; }
.goaok-prediction-top { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.goaok-prediction-card { min-width: 0; max-width: 100%; padding: 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 14px; background: rgba(255,255,255,.07); }
.goaok-prediction-label { display: block; margin-bottom: .45rem; color: #c9cbea; font-size: .86rem; font-weight: 750; }
.goaok-prediction-value { display: block; font-size: clamp(1.05rem, 2.4vw, 1.45rem); font-weight: 900; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.goaok-prediction-reference { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 18px 0; }
.goaok-reference-numbers { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.goaok-reference-number { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var(--goaok-accent); color: #17131f; font-weight: 950; font-variant-numeric: tabular-nums; }
.goaok-reference-colour { display: inline-flex; align-items: center; gap: 8px; }
.goaok-reference-colour::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: currentColor; }
.goaok-reference-colour[data-colour="Red"] { color: #ff8089; }
.goaok-reference-colour[data-colour="Green"] { color: #55d6a0; }
.goaok-reference-colour[data-colour="Violet"] { color: #caa7ff; }
.goaok-prediction-status { min-height: 1.6em; color: #d9dbf2; }
.goaok-history-wrap { max-width: 100%; overflow-x: auto; border-radius: 12px; border: 1px solid rgba(255,255,255,.12); }
.goaok-history-table { min-width: 620px; color: #f7f8ff; }
.goaok-history-table th { background: rgba(255,255,255,.1); }
.goaok-history-table th, .goaok-history-table td { border-color: rgba(255,255,255,.12); }
.goaok-prediction-disclaimer { margin-top: 18px; padding: 16px; border-left: 4px solid var(--goaok-accent); background: rgba(242,169,59,.1); border-radius: 10px; color: #f8ebce; }
@media (max-width: 900px) { .goaok-prediction-top { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px) { .goaok-prediction-top, .goaok-prediction-reference { grid-template-columns: 1fr; } .goaok-prediction-dashboard { padding: 18px; } }
@media (prefers-reduced-motion: reduce) { .goaok-reference-number { transition: none; } }