/* nova_vote.css — the listener vote card inside NOVA's live view (29 Oct 2026, assets/js/nova_vote.js). Uses NOVA's own tokens
   (--tx, --tx-muted, --line, --acc) with fallbacks, so every NOVA look keeps its colours. No blur, no transform on a fixed layer. */
.nv-vote{position:relative;margin:14px 0 4px;padding:14px 14px 12px;border-radius:22px;overflow:hidden;color:var(--tx,#eef2ff);
  border:1px solid rgba(34,211,238,.38);
  background:radial-gradient(120% 90% at 100% 0%,rgba(34,211,238,.18),transparent 60%),radial-gradient(90% 80% at 0% 100%,rgba(167,139,250,.16),transparent 65%),rgba(10,14,34,.72);
  box-shadow:0 18px 40px -24px rgba(34,211,238,.7)}
.nv-vote[hidden]{display:none!important}
.nv-vote.open::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--nv-a,0deg),transparent 0 70%,#22d3ee 80%,#a78bfa 90%,transparent);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:nv-orbit 3.2s linear infinite}
@property --nv-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes nv-orbit{to{--nv-a:360deg}}
.nv-vote.done{border-color:rgba(251,191,36,.45);background:radial-gradient(120% 90% at 50% 0%,rgba(251,191,36,.2),transparent 60%),rgba(10,14,34,.72)}
.nv-vote.nv-in{animation:nv-rise .55s cubic-bezier(.2,.9,.25,1.2) both}
@keyframes nv-rise{from{opacity:0;transform:translateY(14px) scale(.97)}}
.nv-h{display:flex;align-items:center;gap:10px}
.nv-h b{flex:1;font-size:15.5px;font-weight:900;line-height:1.3}
.nv-ico{width:38px;height:38px;flex:none;display:grid;place-items:center;font-size:22px;border-radius:12px;background:rgba(34,211,238,.12)}
.nv-ico .mi{width:34px;height:34px}
.nv-left{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-weight:900;font-size:13px;font-variant-numeric:tabular-nums;
  color:#ff8fa0;background:rgba(255,93,115,.14);border:1px solid rgba(255,93,115,.45);direction:ltr}
.nv-left i{width:7px;height:7px;border-radius:50%;background:currentColor;animation:nv-lamp 1.2s ease-in-out infinite}
.nv-left.won{color:#fbbf24;background:rgba(251,191,36,.14);border-color:rgba(251,191,36,.45);font-size:15px}
@keyframes nv-lamp{50%{opacity:.25}}
.nv-sub{margin:8px 0 12px;font-size:13px;line-height:1.5;color:var(--tx-muted,#aab3cc)}
.nv-c{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.nv-c button{position:relative;display:grid;gap:6px;align-content:start;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nv-c button[disabled]{cursor:default}
.nv-cv{position:relative;display:grid;place-items:center;aspect-ratio:1;border-radius:18px;overflow:visible;font-size:30px;font-weight:900;color:#fff;
  background:linear-gradient(135deg,hsl(var(--h,200) 70% 46%),hsl(calc(var(--h,200) + 60) 70% 30%));box-shadow:0 10px 22px -12px rgba(0,0,0,.8);
  transition:transform .18s cubic-bezier(.3,1.6,.4,1),box-shadow .25s,filter .3s}
.nv-cv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.nv-vote.open .nv-c button:not([disabled]) .nv-cv{animation:nv-bob 2.6s ease-in-out infinite}
.nv-vote.open .nv-c button:nth-child(2):not([disabled]) .nv-cv{animation-delay:.3s}
.nv-vote.open .nv-c button:nth-child(3):not([disabled]) .nv-cv{animation-delay:.6s}
@keyframes nv-bob{50%{transform:translateY(-4px)}}
.nv-c button:not([disabled]):active .nv-cv,.nv-c button.pressed .nv-cv{transform:scale(.92)}
.nv-c button:not([disabled]):hover .nv-cv{box-shadow:0 0 0 2px #22d3ee,0 12px 26px -12px #22d3ee}
.nv-c button.mine .nv-cv{box-shadow:0 0 0 3px #22d3ee,0 0 26px rgba(34,211,238,.55)}
.nv-c button.lead .nv-cv{box-shadow:0 0 0 3px #fbbf24,0 0 24px rgba(251,191,36,.5)}
.nv-c button.win .nv-cv{box-shadow:0 0 0 3px #fbbf24,0 0 36px rgba(251,191,36,.65);animation:nv-winpop .8s cubic-bezier(.3,1.6,.4,1) both}
.nv-c button.lose .nv-cv{filter:grayscale(.6) brightness(.7)}
@keyframes nv-winpop{from{transform:scale(.6) rotate(-8deg)}}
.nv-tick{position:absolute;top:-7px;inset-inline-end:-7px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:14px;color:#06121f;background:#22d3ee;box-shadow:0 4px 12px rgba(0,0,0,.4);animation:nv-winpop .5s cubic-bezier(.3,1.6,.4,1) both}
.nv-crown{position:absolute;top:-18px;left:50%;translate:-50% 0;font-size:24px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.5));animation:nv-bob 2s ease-in-out infinite}
.nv-t{font-size:12.5px;font-weight:800;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.nv-n{font-size:11.5px;color:var(--tx-muted,#aab3cc);font-variant-numeric:tabular-nums}
.nv-b{height:6px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden}
.nv-b i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#22d3ee,#a78bfa);transition:width .8s cubic-bezier(.2,.85,.25,1)}
.nv-c button.lead .nv-b i,.nv-c button.win .nv-b i{background:linear-gradient(90deg,#fbbf24,#fb7185)}
.nv-spark{position:absolute;left:50%;top:35%;font-size:15px;color:var(--c);pointer-events:none;animation:nv-spark 1.2s cubic-bezier(.2,.8,.3,1) forwards}
@keyframes nv-spark{0%{transform:translate(-50%,0) scale(.4);opacity:1}100%{transform:translate(calc(-50% + var(--dx)),var(--dy)) scale(1.1) rotate(160deg);opacity:0}}
html.mibl-rm .nv-vote *,html.mibl-rm .nv-vote::before,html.mibl-rm .nv-vote{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){.nv-vote *,.nv-vote::before,.nv-vote{animation:none!important;transition:none!important}}