/* ===================== Simulations ===================== */
.sim-grid { display: grid; gap: 22px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); }
.sim-card { display: flex; flex-direction: column; border-radius: var(--r-panel); overflow: hidden; border: 1px solid var(--line);
  background: var(--panel); box-shadow: inset 0 3px 0 var(--sc-primary); }
.sim-card:hover { border-color: var(--sc-primary); }
.sim-card__art { display: block; text-decoration: none; aspect-ratio: 16 / 9; background: linear-gradient(135deg, var(--sc-bg1), var(--sc-bg2)); overflow: hidden; }
.sim-card__art img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.sim-card:hover .sim-card__art img { transform: scale(1.03); }
.sim-card__ph { display: grid; place-items: center; height: 100%; font: 800 1.4rem/1 var(--sc-font); color: var(--sc-text); opacity: .8; }
.sim-card__body { padding: 18px 20px 20px; display: grid; gap: 10px; flex: 1; align-content: start; }
.sim-card__title { margin: 0; font: 700 1.25rem/1.25 var(--sc-font); }
.sim-card__title a { color: var(--text); text-decoration: none; }
.sim-card__time, .sim-card__winner { margin: 0; color: var(--muted); display: flex; gap: 8px; align-items: center; }
.sim-card__time strong { color: var(--text); font-variant-numeric: tabular-nums; }
.sim-card__actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.sim-card .btn--primary { --b-bg: var(--sc-primary); --b-border: var(--sc-primary); }

.sim-section + .sim-section { margin-top: 56px; }
.sim-section__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.sim-section__head h2 { margin: 0; }
.sim-section__head p { margin: 4px 0 0; color: var(--muted); }

/* hub */
.sim-status { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.countdown-big { display: inline-flex; align-items: baseline; gap: 10px; padding: 10px 18px; border-radius: 999px; background: var(--t-surface-strong); border: 1px solid var(--t-border); }
.countdown-big strong { font: 800 1.15rem/1 var(--t-font-heading); font-variant-numeric: tabular-nums; }

/* vote grid */
.vote-intro { display: flex; justify-content: space-between; gap: 16px; align-items: center; flex-wrap: wrap; margin-bottom: 20px; }
.vote-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
.vote-btn { position: relative; display: grid; gap: 12px; justify-items: center; padding: 22px 14px 18px; border-radius: var(--r-panel); border: 1px solid var(--t-border);
  background: var(--t-surface); color: var(--t-text); font: 700 1.05rem/1.2 var(--t-font-body); cursor: pointer; transition: transform .12s ease, border-color .12s ease, background .12s;
  backdrop-filter: blur(var(--t-blur)); }
.vote-btn:hover { transform: translateY(-3px); border-color: var(--t-primary); }
.vote-btn img { width: 84px; height: 63px; object-fit: cover; border-radius: 10px; box-shadow: 0 10px 24px -10px rgba(0,0,0,.6); }
.vote-btn__initial { width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; background: var(--t-primary); color: var(--t-on-primary); font: 800 1.6rem/1 var(--t-font-heading); }
.vote-btn.is-voting { animation: vote-pop .6s ease forwards; border-color: var(--t-accent); background: color-mix(in srgb, var(--t-accent) 30%, var(--t-surface)); }
.vote-locked .vote-btn:not(.is-voting) { opacity: .4; pointer-events: none; }
@keyframes vote-pop { 30% { transform: scale(1.08); } 100% { transform: scale(1); } }
.vote-done { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; background: color-mix(in srgb, var(--t-bg1) 80%, transparent); backdrop-filter: blur(8px); }
.vote-done[hidden] { display: none; }
.vote-done__box { text-align: center; padding: 36px; border-radius: var(--t-radius); background: var(--t-surface-strong); border: 1px solid var(--t-border); max-width: 420px; animation: toast-in .3s ease; }
.vote-done__box .pts { width: 84px; height: 84px; font-size: 2rem; border-radius: 22px; margin-bottom: 14px; }
.auth-warning { padding: 14px 18px; border-radius: var(--r-control); background: color-mix(in srgb, var(--t-accent) 22%, var(--t-surface)); border: 1px solid var(--t-accent); margin-bottom: 20px; font-weight: 600; }

/* info */
.info-steps { counter-reset: step; display: grid; gap: 16px; }
.info-step { display: grid; grid-template-columns: 48px 1fr; gap: 16px; padding: 20px; border-radius: var(--r-panel); background: var(--t-surface); border: 1px solid var(--t-border); }
.info-step::before { counter-increment: step; content: counter(step); width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: var(--t-primary); color: var(--t-on-primary); font: 800 1.2rem/1 var(--t-font-heading); }
.info-step h3 { margin: 4px 0 6px; }
.info-step p:last-child { margin-bottom: 0; }
.formula { display: inline-block; padding: 8px 14px; border-radius: 10px; background: var(--t-surface-strong); font-weight: 700; }
.split-bar { display: flex; height: 16px; border-radius: 999px; overflow: hidden; margin: 10px 0; }
.split-bar span:first-child { background: var(--t-jury); }
.split-bar span:last-child { background: var(--t-tele); }
.prob-bar { height: 8px; border-radius: 999px; background: var(--t-surface-strong); overflow: hidden; min-width: 80px; }
.prob-bar span { display: block; height: 100%; background: var(--t-primary); }
.live-bar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 18px; }
.stat-tiles { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin-bottom: 22px; }
.stat-tile { padding: 16px 18px; border-radius: var(--r-panel); background: var(--t-surface); border: 1px solid var(--t-border); }
.stat-tile strong { display: block; font: 800 1.7rem/1.1 var(--t-font-heading); }
.stat-tile span { color: var(--t-muted); font-size: .88rem; }
.show-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 20px; }
.show-bar .chip { text-decoration: none; }
.show-bar .chip.is-active { background: var(--t-primary); color: var(--t-on-primary); border-color: var(--t-primary); }

/* qualifiers and duels in the results tab */
.q-badge { display: inline-block; margin-left: 8px; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 800; letter-spacing: .04em; background: var(--t-highlight, var(--gold)); color: #111; vertical-align: middle; }
.q-badge--jw { background: var(--t-jury, var(--jury)); color: #fff; }
.q-badge--pw { background: var(--t-tele, var(--tele)); color: #fff; }
.rank-table tr.is-qualified td { background: rgba(255,255,255,.04); }
.duel-list { display: grid; gap: 12px; }
.duel-card { display: grid; grid-template-columns: auto 1fr auto 1fr; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--t-surface, var(--surface)); border: 1px solid var(--t-border, var(--border)); }
.duel-card__n { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--t-muted, var(--muted)); }
.duel-card__side { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; opacity: .6; }
.duel-card__side.is-win { opacity: 1; }
.duel-card__side.is-win strong::after { content: " ✓"; color: var(--t-highlight, var(--gold)); }
.duel-card__side b { margin-left: auto; font-size: 1.2rem; }
.duel-card__vs { font-weight: 800; color: var(--t-muted, var(--muted)); }
.duel-card__bar { grid-column: 1 / -1; }
.duel-card__bar span:last-child { background: var(--t-jury, var(--jury)); }
.duel-card__bar span:first-child { background: var(--t-tele, var(--tele)); }
@media (max-width: 640px) { .duel-card { grid-template-columns: 1fr; } .duel-card__vs { text-align: center; } }

/* ---------- gala planner (developers, on the scoreboard tab) ---------- */
.gp { margin-bottom: 18px; }
.gp-show { padding: 14px; border-radius: 16px; border: 1px solid var(--t-border, var(--line)); background: var(--t-surface, var(--panel)); margin-bottom: 12px; }
.gp-num { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--t-primary, var(--pink)); color: var(--t-on-primary, #fff); font-weight: 800; }
.gp-body { margin-top: 10px; }
.gp-grid { display: grid; gap: 4px; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); max-height: 220px; overflow: auto; }
.gp-pick { display: grid; grid-template-columns: auto 26px 1fr; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 8px; font-size: .88rem; cursor: pointer; }
.gp-pick img { width: 26px; height: 18px; object-fit: cover; border-radius: 3px; }
.gp-pick.is-elsewhere { opacity: .55; }
.gp-pick:has(input:checked) { background: color-mix(in srgb, var(--t-primary, #ff3d8b) 14%, transparent); }
.gp-extra summary { cursor: pointer; font-weight: 700; font-size: .9rem; margin: 6px 0; }
.gp-results { display: grid; gap: 8px; }
.gp-result { display: grid; grid-template-columns: 1fr auto auto; gap: 6px 14px; align-items: center; padding: 10px 14px; border-radius: 14px; background: var(--t-surface-strong, var(--panel-2)); }
.gp-result > strong { grid-column: 1; }
.gp-result > .muted { grid-column: 1; }
.gp-result > .row { grid-column: 3; grid-row: 1 / span 2; }
.gp-q { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-wrap: wrap; gap: 3px; max-width: 260px; }
.gp-q img { width: 24px; height: 16px; object-fit: cover; border-radius: 2px; }
.gp-cards { margin-top: 16px; }
@media (max-width: 720px) { .gp-result { grid-template-columns: 1fr; } .gp-result > .row, .gp-q { grid-column: 1; grid-row: auto; } }

/* ---------- vote page: live counter, rewards, paid jury, my vote ---------- */
.live-counter { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.live-counter > div { padding: 12px 16px; border-radius: 16px; background: var(--t-surface); border: 1px solid var(--t-border); display: grid; }
.live-counter strong { font: 800 1.6rem/1.1 var(--t-font-heading); font-variant-numeric: tabular-nums; }
.live-counter span { color: var(--t-muted); font-size: .85rem; }
.live-counter__hour { grid-template-columns: auto 1fr; column-gap: 8px; align-items: center; }
.live-counter__hour span:last-child { grid-column: 1 / -1; }
.live-dot { width: 10px; height: 10px; border-radius: 50%; background: #3ddc97; box-shadow: 0 0 0 0 rgba(61, 220, 151, .6); animation: livedot 1.8s infinite; }
@keyframes livedot { 70% { box-shadow: 0 0 0 10px rgba(61, 220, 151, 0); } 100% { box-shadow: 0 0 0 0 rgba(61, 220, 151, 0); } }
@media (max-width: 640px) { .live-counter { grid-template-columns: 1fr 1fr; } .live-counter__hour { grid-column: 1 / -1; } }
.vote-done__bar { height: 10px; border-radius: 999px; background: color-mix(in srgb, var(--t-text) 12%, transparent); overflow: hidden; margin: 0 auto 16px; max-width: 280px; }
.vote-done__bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--gold), #ff8a3d); transition: width .6s ease; }
.jury-intro { display: flex; gap: 20px; justify-content: space-between; align-items: flex-start; margin-bottom: 18px; }
.jury-intro p { max-width: 70ch; }
.jury-choices { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.jury-choice { display: grid; grid-template-columns: 52px 1fr auto; grid-template-areas: "flag name cost" "flag meta cost"; gap: 2px 12px; align-items: center; padding: 10px 12px; border-radius: 16px; border: 1px solid var(--t-border); background: var(--t-surface); color: var(--t-text); text-align: left; cursor: pointer; font: inherit; }
.jury-choice:hover { border-color: var(--t-primary); transform: translateY(-1px); }
.jury-choice.is-poor { opacity: .55; }
.jury-choice__flag { grid-area: flag; width: 52px; height: 36px; object-fit: cover; border-radius: 6px; }
.jury-choice__name { grid-area: name; font-weight: 800; }
.jury-choice__meta { grid-area: meta; font-size: .78rem; color: var(--t-muted); }
.jury-choice__cost { grid-area: cost; display: inline-flex; align-items: center; gap: 6px; font: 800 1.05rem/1 var(--t-font-heading); }
.jury-builder { display: grid; grid-template-columns: 1fr minmax(280px, 380px); gap: 18px; align-items: start; }
@media (max-width: 860px) { .jury-builder { grid-template-columns: 1fr; } }
.jury-pool { display: grid; gap: 6px; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.jury-pool__item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--t-border); background: var(--t-surface); color: var(--t-text); cursor: pointer; font: 700 .9rem/1.2 var(--t-font-body); text-align: left; }
.jury-pool__item.is-used { opacity: .3; }
.jury-pool__item .flag { width: 28px; height: 20px; }
.jury-rank { list-style: none; margin: 0; padding: 12px; border-radius: 18px; background: var(--t-surface-strong); border: 1px solid var(--t-border); display: grid; gap: 6px; position: sticky; top: 90px; }
.jury-rank__slot { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 10px; min-height: 42px; padding: 4px 6px; border-radius: 12px; border: 1px dashed var(--t-border); }
.jury-rank__slot.is-full { border-style: solid; background: var(--t-surface); }
.jury-rank__tools { display: flex; gap: 4px; }
.jury-rank__tools .btn-icon { width: 28px; height: 28px; font-size: .85rem; }
.jury-done__list { columns: 2; padding-left: 0; list-style: none; }
.jury-done__list li { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; break-inside: avoid; }
.flag--ph { display: inline-block; background: color-mix(in srgb, var(--t-text) 15%, transparent); }
.my-vote { margin-bottom: 20px; border-color: color-mix(in srgb, var(--t-accent) 50%, transparent); }
.my-vote__lead { display: flex; align-items: center; gap: 12px; font-size: 1.15rem; }
.my-vote__list { display: flex; flex-wrap: wrap; gap: 6px; }
.jury-formula { margin-top: 8px; }
.jury-formula summary { cursor: pointer; font-weight: 700; }
.jury-formula ul { margin: 8px 0; padding-left: 20px; }
.jury-formula .formula { display: inline-block; }