.prediction-card { display: flex; flex-direction: column; min-height: 260px; padding: 1.25rem; }
.prediction-card-betting { border-color: color-mix(in srgb, var(--accent) 18%, var(--border)); background: radial-gradient(circle at 100% 0, color-mix(in srgb, var(--accent) 7%, transparent), transparent 38%), var(--surface); box-shadow: 0 4px 14px var(--shadow); }
.prediction-card-link { position: relative; overflow: hidden; isolation: isolate; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.prediction-card-link::before { position: absolute; z-index: 2; top: -28%; left: -48%; width: 32%; height: 156%; content: ''; pointer-events: none; opacity: 0; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 8%, transparent), rgba(255, 255, 255, .28), color-mix(in srgb, var(--accent) 8%, transparent), transparent); filter: blur(1.2px); transform: skewX(-20deg) translateX(0); }
.prediction-card-link:hover::before { animation: prediction-card-sheen .96s ease-out; }
@keyframes prediction-card-sheen { 0% { opacity: 0; transform: skewX(-20deg) translateX(0); } 20% { opacity: .52; } 100% { opacity: 0; transform: skewX(-20deg) translateX(470%); } }
.prediction-card-link:hover { transform: translateY(-2px) scale(1.012); border-color: color-mix(in srgb, var(--accent) 48%, var(--border)); box-shadow: 0 6px 16px var(--shadow); }
.prediction-card-link:focus-visible { border-color: color-mix(in srgb, var(--accent) 58%, var(--border)); box-shadow: 0 0 0 3px var(--accent-soft), 0 6px 16px var(--shadow); }
.prediction-card-express { background: radial-gradient(circle at 100% 0, color-mix(in srgb, var(--accent) 11%, transparent), transparent 42%), var(--surface); }
.prediction-card-top, .prediction-market, .prediction-card > :nth-last-child(2) { margin-bottom: .85rem; }
.prediction-card-top { display: flex; align-items: center; gap: .35rem; }
.prediction-card-top .sport-badge { min-width: 0; }
.prediction-card-footer { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.prediction-card-top-ai { flex-wrap: nowrap; }
.prediction-card-top-ai .sport-badge { min-width: 0; max-width: none; }
.prediction-card-top-ai .sport-badge, .prediction-card-top-ai .prediction-source, .prediction-card-top-ai .status { white-space: nowrap; }
:is(.prediction-sport-tabs, .free-history-tabs) { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; width: min(100%, 760px); min-width: 0; margin: 0 auto; }
:is(.prediction-sport-tabs, .free-history-tabs) a { position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 52px; min-width: min(104px, 100%); max-width: 100%; padding: .72rem 1rem; overflow: hidden; border: 1px solid var(--border); border-radius: .95rem; background: var(--surface); color: var(--text-muted); box-shadow: 0 3px 12px var(--shadow); font-size: .82rem; font-weight: 700; text-align: center; overflow-wrap: anywhere; transition: border-color .2s, box-shadow .2s, color .2s, transform .2s; }
:is(.prediction-sport-tabs, .free-history-tabs) a::after { position: absolute; right: .75rem; bottom: 0; left: .75rem; height: 3px; content: ''; border-radius: 3px 3px 0 0; background: var(--accent); opacity: 0; transform: scaleX(.45); transition: opacity .2s, transform .2s; }
:is(.prediction-sport-tabs, .free-history-tabs) a:hover { border-color: color-mix(in srgb, var(--accent) 42%, var(--border)); color: var(--text); box-shadow: 0 5px 14px var(--shadow); transform: translateY(-1px) scale(1.012); }
:is(.prediction-sport-tabs, .free-history-tabs) a[aria-current='page'] { border-color: color-mix(in srgb, var(--accent) 48%, var(--border)); background: linear-gradient(135deg, var(--accent-soft), var(--surface) 72%); color: var(--text); }
:is(.prediction-sport-tabs, .free-history-tabs) a[aria-current='page']::after { opacity: 1; transform: scaleX(1); }
:is(.prediction-sport-tabs, .free-history-tabs) a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (max-width: 760px) { :is(.prediction-sport-tabs, .free-history-tabs) { gap: .4rem; }:is(.prediction-sport-tabs, .free-history-tabs) a { min-width: min(92px, 100%); min-height: 44px; padding: .6rem .8rem; font-size: .76rem; } }
@media (prefers-reduced-motion: reduce) { :is(.prediction-sport-tabs, .free-history-tabs) a, :is(.prediction-sport-tabs, .free-history-tabs) a::after { transition: none; }:is(.prediction-sport-tabs, .free-history-tabs) a:hover { transform: none; } }
.catalog-results { display: grid; gap: 2rem; }
[data-prediction-catalog] { align-content: start; overflow-anchor: none; }
[data-prediction-catalog][aria-busy='true'] nav a { cursor: progress; }
.catalog-error { margin: 0; padding: .75rem 1rem; color: var(--text-muted); }
.catalog-error .button { margin-left: .5rem; }
.sport-badge { max-width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: .26rem .52rem; border-radius: .42rem; background: var(--accent-soft); color: var(--accent); font-size: .68rem; font-weight: 700; }
.status, .prediction-source { flex: 0 0 auto; padding: .24rem .5rem; border-radius: 999px; font-size: .63rem; font-weight: 750; white-space: nowrap; }
.status-pending { background: #f6ecd8; color: #8b6014; }
.status-won, .prediction-source { background: var(--accent-soft); color: var(--accent); }
.status-lost { background: #f9e2e2; color: #a33e3e; }
.status-refund { background: var(--surface-hover); color: var(--text-muted); }
.prediction-source-ai { background: color-mix(in srgb, #7869c7 16%, var(--surface)); color: #6556b4; }
.prediction-card h3 { margin: 1rem 0 .3rem; font-size: 1rem; line-height: 1.35; }
.prediction-date { margin: 0; color: var(--text-muted); font-size: .72rem; }
.prediction-score { margin: .35rem 0 0; color: var(--text-muted); font-size: .7rem; }
.prediction-score strong { color: var(--text); font-variant-numeric: tabular-nums; }
.prediction-market, .locked-prediction { min-height: 54px; margin: .85rem 0 0; border: 1px solid var(--border); border-radius: .65rem; }
.prediction-market { display: flex; align-items: center; gap: .35rem; min-width: 0; padding: .7rem .75rem; font-size: .76rem; }
.prediction-market span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prediction-market strong { flex: 0 0 auto; color: var(--accent); font-size: .72rem; white-space: nowrap; }
.locked-prediction { display: flex; align-items: center; gap: .65rem; padding: .55rem .7rem; background: linear-gradient(110deg, var(--surface-hover), var(--surface)); }
.locked-icon { width: 1.3rem; height: 1.3rem; color: var(--accent); }
.locked-prediction b, .locked-prediction small { display: block; }
.locked-prediction b { font-size: .7rem; }
.locked-prediction small { color: var(--text-muted); font-size: .64rem; }
.prediction-card-footer { margin: auto 0 0; padding-top: .7rem; border-top: 1px solid var(--border); color: var(--text-muted); font-size: .68rem; }
.prediction-price { color: var(--accent); font-size: .82rem; }
@media (max-width: 420px) { .prediction-card-top-ai { column-gap: .25rem; }.prediction-card-top-ai .sport-badge, .prediction-card-top-ai .prediction-source, .prediction-card-top-ai .status { padding: .2rem .38rem; font-size: .57rem; } }
@media (prefers-reduced-motion: reduce) { .prediction-card-link::before { display: none; animation: none !important; } }
:root[data-theme='dark'] .status-pending { background: #473b22; color: #f0c86a; }
:root[data-theme='dark'] .status-lost { background: #48282d; color: #f0959d; }

@media (max-width: 767px) {
  :is(.prediction-sport-tabs, .free-history-tabs) { width: 100%; justify-content: flex-start; flex-wrap: nowrap; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; padding: 3px 0 10px; }
  :is(.prediction-sport-tabs, .free-history-tabs) a { flex: 0 0 auto; min-width: 0; min-height: 44px; padding: 10px 16px; font-size: 14px; white-space: nowrap; }
  .prediction-card { padding: 20px; }
  .prediction-card h3 { font-size: 18px; line-height: 1.4; }
  .prediction-card-top, .prediction-card-top-ai { flex-wrap: wrap; gap: 8px; }
  .prediction-card-top :is(.sport-badge, .prediction-source, .status) { max-width: 100%; font-size: 12px; padding: 5px 8px; white-space: normal; }
  .prediction-date, .prediction-score { font-size: 13px; }
  .prediction-market { align-items: flex-start; flex-wrap: wrap; gap: 8px; font-size: 15px; }
  .prediction-market span { white-space: normal; overflow: visible; }
  .prediction-market strong { font-size: 15px; margin-left: auto; }
  .prediction-card-footer { flex-wrap: wrap; gap: 10px; font-size: 13px; }
  .prediction-price { font-size: 17px; }
  .locked-prediction b { font-size: 14px; }
  .locked-prediction small { font-size: 12px; }
  .prediction-card-link:hover { transform: none; }
}