@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Space+Grotesk:wght@600;700&display=swap');

:root {
  --bg: #06101c;
  --bg-soft: #0a1726;
  --card: rgba(13, 29, 46, .9);
  --card-strong: #10233a;
  --line: rgba(255,255,255,.09);
  --text: #f5f8fb;
  --muted: #8ca0b7;
  --lime: #b9ff39;
  --cyan: #34d9ff;
  --purple: #9e7bff;
  --orange: #ffad45;
  --red: #ff5f6d;
  --green: #38e59d;
  --shadow: 0 18px 50px rgba(0,0,0,.28);
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; color: var(--text); background: radial-gradient(circle at 15% -5%, #163154 0, transparent 32%), radial-gradient(circle at 90% 5%, rgba(78,44,151,.25), transparent 28%), var(--bg); font-family: Inter, system-ui, sans-serif; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }

.ambient { position: fixed; pointer-events: none; filter: blur(90px); opacity: .18; z-index: -1; border-radius: 50%; }
.ambient-one { width: 330px; height: 330px; background: var(--cyan); left: -120px; top: 35%; }
.ambient-two { width: 380px; height: 380px; background: var(--purple); right: -180px; top: 12%; }

.public-topbar, .admin-topbar { height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 clamp(18px, 4vw, 64px); border-bottom: 1px solid var(--line); background: rgba(5,13,24,.82); backdrop-filter: blur(22px); position: sticky; top: 0; z-index: 50; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: linear-gradient(145deg, var(--lime), #70e700); color: #07110b; font: 800 15px/1 Space Grotesk; box-shadow: 0 0 28px rgba(185,255,57,.18); }
.brand > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.brand strong { font: 800 16px/1 Space Grotesk; letter-spacing: .08em; }
.brand small { color: var(--muted); font-size: 9px; letter-spacing: .18em; }

.league-switch { display: flex; align-items: center; gap: 7px; padding: 6px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.035); }
.league-tab { min-width: 130px; border: 0; border-radius: 13px; background: transparent; color: var(--muted); padding: 10px 18px; cursor: pointer; display: flex; align-items: center; gap: 8px; justify-content: center; transition: .2s ease; }
.league-tab span { font-weight: 800; color: inherit; }
.league-tab small { font-size: 10px; }
.league-tab:hover { color: var(--text); background: rgba(255,255,255,.045); }
.league-tab.active { color: #07110b; background: var(--lime); box-shadow: 0 10px 24px rgba(185,255,57,.12); }
.league-tab.active small { color: rgba(7,17,11,.7); }
.topbar-actions, .admin-user { display: flex; align-items: center; gap: 16px; }
.live-connection { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.status-orb { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 5px rgba(255,173,69,.12); }
.status-orb.connected { background: var(--green); box-shadow: 0 0 0 5px rgba(56,229,157,.12); }
.status-orb.error { background: var(--red); box-shadow: 0 0 0 5px rgba(255,95,109,.12); }
.ghost-button { color: var(--text); font-size: 12px; border: 1px solid var(--line); background: rgba(255,255,255,.04); padding: 10px 14px; border-radius: 12px; cursor: pointer; }
.ghost-button:hover { background: rgba(255,255,255,.08); }

.section-shell { width: min(1380px, calc(100% - 40px)); margin-inline: auto; }
.public-hero { min-height: 390px; display: grid; grid-template-columns: minmax(0,1.5fr) minmax(320px,.6fr); align-items: center; gap: 58px; padding-block: 64px 42px; }
.hero-copy h1 { margin: 10px 0 16px; font: 700 clamp(42px,6vw,80px)/.98 Space Grotesk; letter-spacing: -.055em; }
.hero-copy p { max-width: 720px; margin: 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
.eyebrow { color: var(--lime); font-size: 10px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.live-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--lime); margin-right: 8px; box-shadow: 0 0 0 5px rgba(185,255,57,.1); animation: pulse 1.8s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 9px rgba(185,255,57,0); } }
.hero-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.hero-meta span { border: 1px solid var(--line); background: rgba(255,255,255,.035); padding: 9px 12px; border-radius: 999px; color: #b6c4d3; font-size: 11px; }
.glass-card, .panel-card { border: 1px solid var(--line); background: linear-gradient(145deg, rgba(19,40,63,.88), rgba(9,22,36,.88)); box-shadow: var(--shadow); border-radius: var(--radius); }
.history-card { padding: 22px; }
.history-heading, .panel-heading, .parlay-head, .game-card-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.history-heading div, .panel-heading div { display: flex; flex-direction: column; gap: 5px; }
.history-heading small, .panel-heading small { color: var(--muted); font-size: 9px; letter-spacing: .16em; }
.history-heading strong { font-size: 18px; }
.calendar-icon { color: var(--lime); font-size: 27px; }
.history-card label, .stack-form label, .form-grid label { display: flex; flex-direction: column; gap: 8px; margin-top: 20px; }
label > span { color: #aebdcd; font-size: 11px; font-weight: 600; }
input, select, textarea { width: 100%; border: 1px solid var(--line); background: #091726; color: var(--text); border-radius: 12px; padding: 12px 13px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: rgba(185,255,57,.58); box-shadow: 0 0 0 3px rgba(185,255,57,.08); }
textarea { resize: vertical; min-height: 100px; line-height: 1.5; }
.primary-button, .secondary-button { border: 0; border-radius: 12px; padding: 12px 17px; font-weight: 800; cursor: pointer; transition: .2s ease; display: inline-flex; align-items: center; justify-content: center; }
.primary-button { color: #07110b; background: var(--lime); }
.primary-button:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(185,255,57,.15); }
.secondary-button { color: var(--text); border: 1px solid var(--line); background: rgba(255,255,255,.05); }
.secondary-button:hover { background: rgba(255,255,255,.09); }
.full { width: 100%; }
.history-card .secondary-button { margin-top: 12px; }
.last-check { display: flex; justify-content: space-between; gap: 10px; padding-top: 15px; margin-top: 15px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.last-check strong { color: var(--text); font-weight: 600; }

.ticker-wrap { border-block: 1px solid var(--line); background: rgba(2,9,16,.45); overflow: hidden; }
.live-ticker { width: min(1500px,100%); margin: auto; min-height: 78px; padding: 12px 20px; display: flex; gap: 10px; overflow-x: auto; scrollbar-width: thin; }
.ticker-game { min-width: 190px; border: 1px solid var(--line); background: rgba(255,255,255,.035); border-radius: 14px; padding: 10px 12px; display: grid; grid-template-columns: auto 1fr auto; gap: 11px; align-items: center; }
.ticker-league { font-size: 8px; font-weight: 800; color: var(--lime); writing-mode: vertical-rl; transform: rotate(180deg); }
.ticker-game div { display: flex; flex-direction: column; gap: 4px; }
.ticker-game strong { font-size: 12px; }
.ticker-status { color: var(--muted); font-size: 9px; text-align: right; max-width: 65px; }
.ticker-status.live { color: var(--lime); }
.ticker-status.final { color: var(--cyan); }
.ticker-empty { margin: auto; color: var(--muted); font-size: 12px; }

.metrics-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; padding-block: 34px 10px; }
.metric-card { min-height: 114px; display: flex; align-items: center; gap: 15px; border: 1px solid var(--line); border-radius: 19px; background: rgba(12,28,45,.78); padding: 18px; box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.metric-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; font-size: 20px; font-weight: 800; flex: none; }
.accent-lime { color: var(--lime); background: rgba(185,255,57,.1); }
.accent-cyan { color: var(--cyan); background: rgba(52,217,255,.1); }
.accent-purple { color: var(--purple); background: rgba(158,123,255,.1); }
.accent-orange { color: var(--orange); background: rgba(255,173,69,.1); }
.metric-card div { display: flex; flex-direction: column; min-width: 0; gap: 3px; }
.metric-card small { color: var(--muted); font-size: 8px; letter-spacing: .14em; }
.metric-card strong { font-size: 17px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.metric-card span:last-child { color: #8396aa; font-size: 10px; }

.content-section { padding-block: 52px 12px; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 22px; margin-bottom: 20px; }
.section-head h2, .panel-heading h2 { margin: 5px 0 0; font: 700 clamp(25px,3vw,36px)/1.1 Space Grotesk; letter-spacing: -.03em; }
.segmented { display: flex; gap: 5px; padding: 5px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.03); }
.segment { border: 0; border-radius: 10px; background: transparent; color: var(--muted); padding: 10px 14px; font-size: 11px; font-weight: 700; cursor: pointer; }
.segment.active { color: #07110b; background: var(--lime); }
.search-box { display: flex; align-items: center; gap: 8px; min-width: 230px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.035); padding-left: 12px; }
.search-box span { color: var(--muted); }
.search-box input { border: 0; background: transparent; box-shadow: none; padding-left: 0; }

.parlay-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
.parlay-card { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(155deg, #11253b, #091827 70%); padding: 21px; box-shadow: var(--shadow); }
.parlay-card::before { content: ''; position: absolute; inset: 0 auto auto 0; height: 3px; width: 100%; background: var(--orange); }
.parlay-card.live::before { background: var(--lime); }
.parlay-card.won::before { background: var(--green); }
.parlay-card.lost::before { background: var(--red); }
.parlay-head h3 { margin: 5px 0 0; font-size: 18px; }
.parlay-status { border-radius: 999px; padding: 7px 9px; font-size: 8px; font-weight: 800; letter-spacing: .1em; color: var(--orange); background: rgba(255,173,69,.1); }
.parlay-status.live { color: var(--lime); background: rgba(185,255,57,.1); }
.parlay-status.won { color: var(--green); background: rgba(56,229,157,.1); }
.parlay-status.lost { color: var(--red); background: rgba(255,95,109,.1); }
.parlay-meta { display: flex; flex-wrap: wrap; gap: 7px; margin: 15px 0 12px; }
.parlay-meta span { color: #9badbf; font-size: 9px; border: 1px solid var(--line); border-radius: 999px; padding: 6px 8px; }
.progress-track { height: 5px; background: rgba(255,255,255,.06); border-radius: 999px; overflow: hidden; margin-bottom: 14px; }
.progress-track span { display: block; height: 100%; background: linear-gradient(90deg,var(--lime),var(--cyan)); border-radius: inherit; transition: width .35s ease; }
.legs { display: flex; flex-direction: column; gap: 8px; }
.leg { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 9px; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.027); }
.leg-state { width: 27px; height: 27px; border-radius: 9px; display: grid; place-items: center; color: var(--muted); background: rgba(255,255,255,.06); font-weight: 800; }
.leg.won .leg-state { color: #04130d; background: var(--green); }
.leg.lost .leg-state { color: white; background: var(--red); }
.leg.live .leg-state { color: #07110b; background: var(--lime); animation: pulse 1.7s infinite; }
.leg > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.leg strong { font-size: 11px; line-height: 1.4; }
.leg small { color: var(--muted); font-size: 9px; line-height: 1.4; }
.leg em { color: var(--cyan); font-size: 9px; font-style: normal; }
.leg-label { color: var(--muted); font-size: 8px; white-space: nowrap; }
.leg.won .leg-label { color: var(--green); }
.leg.lost .leg-label { color: var(--red); }
.leg.live .leg-label { color: var(--lime); }
.parlay-foot { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: end; gap: 12px; }
.parlay-foot span { color: var(--muted); font-size: 9px; line-height: 1.5; }
.parlay-foot strong { color: var(--lime); font-size: 10px; white-space: nowrap; }

.game-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.game-card { border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(150deg, rgba(16,35,56,.94), rgba(8,21,34,.95)); padding: 20px; box-shadow: 0 14px 35px rgba(0,0,0,.18); }
.game-card-head small { display: block; color: var(--muted); font-size: 9px; margin-bottom: 4px; }
.game-card-head strong { font-size: 11px; }
.game-status { border-radius: 999px; padding: 7px 9px; background: rgba(255,255,255,.06); color: var(--muted); font-size: 8px; font-weight: 800; }
.game-status.live { color: var(--lime); background: rgba(185,255,57,.1); }
.game-status.final { color: var(--cyan); background: rgba(52,217,255,.1); }
.scoreboard { margin: 18px 0; display: flex; flex-direction: column; gap: 10px; }
.team-line { display: grid; grid-template-columns: 43px 1fr auto; align-items: center; gap: 12px; }
.team-code { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 13px; background: rgba(255,255,255,.06); color: var(--lime); font-size: 10px; font-weight: 800; }
.team-line div { display: flex; flex-direction: column; gap: 3px; }
.team-line strong { font-size: 13px; }
.team-line small { color: var(--muted); font-size: 9px; }
.team-line b { font: 700 27px/1 Space Grotesk; }
.market-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.market-grid > div { padding: 11px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.025); display: flex; flex-direction: column; gap: 4px; }
.market-grid span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.market-grid strong { font-size: 10px; line-height: 1.35; }
.market-grid small { color: var(--lime); font-size: 9px; }
details { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 12px; }
summary { list-style: none; display: flex; align-items: center; justify-content: space-between; color: #afbdcc; font-size: 10px; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
.detail-body { display: grid; gap: 8px; margin-top: 12px; }
.detail-body > div { padding: 10px; background: rgba(255,255,255,.025); border-radius: 11px; display: flex; flex-direction: column; gap: 4px; }
.detail-body strong { font-size: 10px; }
.detail-body span { color: var(--muted); font-size: 9px; line-height: 1.5; }

.two-panel-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.panel-card { padding: 22px; }
.panel-heading { margin-bottom: 18px; }
.panel-heading h2 { font-size: 24px; }
.ranking-list, .avoid-list { display: flex; flex-direction: column; gap: 9px; }
.ranking-row { display: grid; grid-template-columns: 34px 1fr auto; gap: 11px; align-items: center; padding: 11px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.025); }
.rank-number { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 10px; color: #07110b; background: var(--lime); font-size: 10px; font-weight: 800; }
.ranking-row div, .avoid-row div { display: flex; flex-direction: column; gap: 4px; }
.ranking-row strong, .avoid-row strong { font-size: 11px; }
.ranking-row small, .avoid-row small { color: var(--muted); font-size: 9px; line-height: 1.45; }
.probability-pill { color: var(--cyan); font-size: 10px; font-weight: 800; }
.avoid-row { display: grid; grid-template-columns: 31px 1fr; gap: 10px; align-items: center; padding: 11px; border: 1px solid rgba(255,95,109,.15); border-radius: 13px; background: rgba(255,95,109,.04); }
.avoid-row > span { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 10px; color: var(--red); background: rgba(255,95,109,.1); font-weight: 800; }

.disclaimer { margin-top: 56px; margin-bottom: 40px; display: flex; gap: 16px; align-items: flex-start; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.025); padding: 17px; }
.disclaimer strong { color: var(--orange); font-size: 11px; min-width: 100px; }
.disclaimer p { color: var(--muted); font-size: 10px; line-height: 1.6; margin: 0; }
footer { width: min(1380px,calc(100% - 40px)); margin: auto; padding: 25px 0 34px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; color: #667a90; font-size: 9px; letter-spacing: .12em; }

.empty-state { grid-column: 1/-1; min-height: 160px; border: 1px dashed var(--line); border-radius: 18px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; color: var(--muted); text-align: center; padding: 25px; }
.empty-state strong { color: var(--text); }
.empty-state.compact { min-height: 100px; }
.skeleton { overflow: hidden; position: relative; }
.skeleton::after { content: ''; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent); animation: shimmer 1.4s infinite; }
.skeleton-line { width: 55%; height: 12px; background: rgba(255,255,255,.06); border-radius: 999px; margin-bottom: 12px; }
.skeleton-line.wide { width: 80%; }
.skeleton-block { height: 130px; background: rgba(255,255,255,.045); border-radius: 14px; }
@keyframes shimmer { 100% { transform: translateX(100%); } }
.toast-region { position: fixed; right: 22px; bottom: 22px; z-index: 100; display: grid; gap: 8px; }
.toast { color: #06110b; background: var(--lime); border-radius: 12px; padding: 12px 15px; font-size: 11px; font-weight: 800; box-shadow: var(--shadow); animation: toastIn .2s ease; }
.toast.error { color: #fff; background: var(--red); }
@keyframes toastIn { from { opacity: 0; transform: translateY(8px); } }

/* Administración e instalación */
.auth-body, .admin-body { background: radial-gradient(circle at 20% 0,#18395b,transparent 34%), var(--bg); }
.auth-shell, .setup-shell { min-height: 100vh; display: grid; place-items: center; padding: 28px; }
.auth-card { width: min(440px,100%); border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(155deg,#10243a,#081624); box-shadow: var(--shadow); padding: 28px; }
.setup-card { width: min(760px,100%); }
.auth-card h1 { margin: 32px 0 7px; font: 700 32px/1 Space Grotesk; }
.muted { color: var(--muted); font-size: 11px; line-height: 1.6; }
.stack-form { display: flex; flex-direction: column; gap: 13px; margin-top: 20px; }
.stack-form label { margin-top: 0; }
.text-link, .danger-link { color: var(--lime); font-size: 10px; border: 0; padding: 0; background: none; cursor: pointer; }
.auth-card > .text-link { display: inline-block; margin-top: 18px; }
.danger-link { color: var(--red); }
.notice { margin: 15px 0; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: rgba(255,255,255,.04); color: #dce7f0; font-size: 11px; line-height: 1.5; }
.notice.error { border-color: rgba(255,95,109,.3); background: rgba(255,95,109,.08); color: #ffb6bd; }
.notice.success { border-color: rgba(56,229,157,.3); background: rgba(56,229,157,.08); color: #a8f8d6; display: flex; flex-direction: column; gap: 4px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-grid label { margin: 0; }
.span-2 { grid-column: 1/-1; }
.form-divider { color: var(--lime); border-top: 1px solid var(--line); padding-top: 16px; margin-top: 5px; font-size: 10px; letter-spacing: .12em; }
.admin-body { min-height: 100vh; }
.admin-user > span { color: var(--muted); font-size: 11px; }
.admin-shell { width: min(1280px,calc(100% - 40px)); margin: auto; padding: 42px 0 60px; }
.admin-hero { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 28px; }
.admin-hero h1 { font: 700 clamp(34px,5vw,56px)/1 Space Grotesk; margin: 7px 0 10px; }
.admin-hero p { color: var(--muted); font-size: 12px; margin: 0; }
.admin-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }
.two-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.chip { padding: 7px 9px; border-radius: 999px; background: rgba(185,255,57,.1); color: var(--lime); font-size: 9px; font-weight: 800; }
.chip.warning { color: var(--orange); background: rgba(255,173,69,.1); }
.records-panel { margin-top: 18px; }
.table-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px; text-align: left; border-bottom: 1px solid var(--line); font-size: 10px; }
th { color: var(--muted); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.row-actions { display: flex; gap: 12px; align-items: center; }
.row-actions form { margin: 0; }
.league-mini { display: inline-flex; padding: 6px 8px; border-radius: 8px; color: var(--cyan); background: rgba(52,217,255,.08); font-weight: 800; }
.league-mini.kbo { color: var(--purple); background: rgba(158,123,255,.08); }
.empty-cell { text-align: center; color: var(--muted); padding: 30px; }

@media (max-width: 1100px) {
  .parlay-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .metrics-grid { grid-template-columns: repeat(2,1fr); }
  .public-hero { grid-template-columns: 1fr .65fr; gap: 28px; }
  .admin-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .public-topbar { height: auto; min-height: 76px; flex-wrap: wrap; padding-block: 12px; }
  .league-switch { order: 3; width: 100%; }
  .league-tab { flex: 1; }
  .league-tab small { display: none; }
  .live-connection { display: none; }
  .public-hero { grid-template-columns: 1fr; min-height: auto; padding-top: 46px; }
  .history-card { max-width: none; }
  .game-grid, .two-panel-layout { grid-template-columns: 1fr; }
  .section-head { align-items: flex-start; flex-direction: column; }
  .search-box { width: 100%; }
  .admin-topbar { height: auto; padding-block: 13px; }
  .admin-user > span { display: none; }
}
@media (max-width: 620px) {
  .section-shell, .admin-shell, footer { width: min(100% - 24px,1380px); }
  .parlay-grid, .metrics-grid { grid-template-columns: 1fr; }
  .hero-copy h1 { font-size: 46px; }
  .brand small { display: none; }
  .segment { padding: 9px 10px; font-size: 9px; }
  .segmented { width: 100%; }
  .segment { flex: 1; }
  .market-grid { grid-template-columns: 1fr; }
  .form-grid, .two-cols { grid-template-columns: 1fr; }
  .span-2 { grid-column: auto; }
  .admin-hero { align-items: flex-start; flex-direction: column; }
  .parlay-card, .game-card, .panel-card { padding: 17px; }
  .leg { grid-template-columns: 25px 1fr; }
  .leg-label { grid-column: 2; }
  .toast-region { left: 12px; right: 12px; bottom: 12px; }
}
.db-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.db-summary span { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.db-summary small { color: var(--muted); font-size: 8px; letter-spacing: .1em; }
.db-summary strong { font-size: 10px; overflow: hidden; text-overflow: ellipsis; }
@media(max-width:620px){.db-summary{grid-template-columns:1fr;}}

/* Compatibilidad schema 1.1 y probabilidades visibles */
.combined-probability { color: var(--lime) !important; border-color: rgba(185,255,57,.2) !important; background: rgba(185,255,57,.06); font-weight: 800; }
.leg-copy { min-width: 0; }
.leg-matchup { color: var(--cyan) !important; font-size: 8px !important; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.leg-side { min-width: 68px !important; align-items: flex-end; text-align: right; }
.selection-probability { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; padding: 5px 7px; border-radius: 999px; color: #07110b; background: var(--lime); font-size: 9px; font-weight: 900; }
.leg.won .selection-probability { background: var(--green); }
.leg.lost .selection-probability { color: #fff; background: var(--red); }
.leg.review .selection-probability, .leg.unavailable .selection-probability { color: var(--text); background: rgba(255,255,255,.1); }
.probability-calculation { margin-top: 10px; padding: 9px 10px; border-radius: 11px; background: rgba(52,217,255,.055); color: #91dff0; font-size: 8px; line-height: 1.5; }
.brand strong { text-transform: none; }

@media (max-width: 620px) {
  .leg { grid-template-columns: 25px 1fr; align-items: start; }
  .leg-side { grid-column: 2; width: 100%; flex-direction: row !important; align-items: center !important; justify-content: space-between; text-align: left; margin-top: 4px; }
  .leg-label { grid-column: auto; }
}