/* Voorschoten Quiz Arena - FINAL arcade show style */
:root{
  --bg:#050613;
  --panel:#0c1030;
  --panel2:#151a46;
  --text:#fff8ff;
  --muted:#b7bee8;
  --cyan:#35e8ff;
  --pink:#ff42d0;
  --purple:#8d59ff;
  --yellow:#ffdc55;
  --orange:#ff9346;
  --green:#43ffac;
  --line:rgba(255,255,255,.16);
  --shadow:0 38px 110px rgba(0,0,0,.55);
}
*{box-sizing:border-box}
html{background:#050613;min-height:100%}
body{
  margin:0;min-height:100vh;color:var(--text);
  font:700 16px/1.45 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#050613;overflow-x:hidden;
}
body:before{
  content:"";position:fixed;inset:0;z-index:-5;
  background:
    linear-gradient(105deg, rgba(53,232,255,.82) 0 15%, transparent 15% 85%, rgba(255,66,208,.8) 85% 100%),
    radial-gradient(circle at 20% 20%, rgba(53,232,255,.35), transparent 28%),
    radial-gradient(circle at 82% 24%, rgba(255,66,208,.34), transparent 30%),
    radial-gradient(circle at 50% 105%, rgba(141,89,255,.44), transparent 40%),
    #050613;
}
body:after{
  content:"";position:fixed;inset:0;z-index:-4;opacity:.55;pointer-events:none;
  background:
    repeating-linear-gradient(to bottom, rgba(255,255,255,.03) 0 1px, transparent 1px 7px),
    radial-gradient(circle at 50% 20%, rgba(255,255,255,.10), transparent 28%);
}
.arena-bg{position:fixed;inset:0;z-index:-3;pointer-events:none;overflow:hidden}
.arena-bg:before,.arena-bg:after{
  content:"";position:absolute;width:55vw;height:140vh;top:-20vh;opacity:.42;filter:blur(4px);
  background:linear-gradient(180deg, transparent, rgba(53,232,255,.45), transparent);
  transform-origin:top center;animation:swing 7s ease-in-out infinite alternate;
}
.arena-bg:before{left:5vw;transform:rotate(16deg)}
.arena-bg:after{right:7vw;background:linear-gradient(180deg, transparent, rgba(255,66,208,.45), transparent);transform:rotate(-16deg);animation-delay:-2s}
@keyframes swing{to{transform:rotate(-8deg)}}
.beam{position:fixed;bottom:-18vh;width:18vw;height:50vh;filter:blur(12px);opacity:.7;pointer-events:none;z-index:-2}
.beam-left{left:0;background:linear-gradient(180deg,transparent,var(--cyan));clip-path:polygon(30% 0,70% 0,100% 100%,0 100%)}
.beam-right{right:0;background:linear-gradient(180deg,transparent,var(--pink));clip-path:polygon(30% 0,70% 0,100% 100%,0 100%)}
.confetti-field{position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:radial-gradient(circle,var(--yellow) 0 2px,transparent 3px),radial-gradient(circle,var(--pink) 0 2px,transparent 3px),radial-gradient(circle,var(--cyan) 0 2px,transparent 3px);background-size:160px 160px,220px 220px,190px 190px;background-position:20px 30px,80px 100px,150px 10px;opacity:.12;animation:confettiDrift 18s linear infinite}
@keyframes confettiDrift{to{background-position:20px 360px,80px 430px,150px 340px}}

a{color:inherit}
.arena-shell{width:min(1280px,100%);margin:0 auto;padding:24px 26px;position:relative}
.arena-topbar{display:grid;grid-template-columns:300px 1fr 86px;gap:20px;align-items:center;margin-bottom:16px}
.arena-logo{
  min-height:130px;border-radius:34px;text-decoration:none;display:grid;grid-template-columns:62px 1fr;grid-template-areas:"cup kicker" "cup main" "cup sub";gap:0 14px;align-items:center;padding:20px 24px;
  background:linear-gradient(135deg,rgba(53,232,255,.20),rgba(255,66,208,.22)),rgba(5,6,19,.76);
  border:1px solid rgba(255,255,255,.18);box-shadow:var(--shadow),0 0 32px rgba(53,232,255,.25), inset 0 1px 0 rgba(255,255,255,.22);
  position:relative;overflow:hidden;
}
.arena-logo:after{content:"⚡";position:absolute;right:25px;top:24px;color:var(--yellow);font-size:28px;text-shadow:0 0 16px var(--yellow);animation:flicker 1.3s infinite}
@keyframes flicker{0%,100%{opacity:1}45%{opacity:.45}55%{opacity:1}}
.logo-cup{grid-area:cup;width:58px;height:58px;border-radius:20px;background:linear-gradient(135deg,var(--yellow),var(--pink));display:grid;place-items:center;font-size:30px;box-shadow:0 0 30px rgba(255,66,208,.35)}
.logo-kicker{grid-area:kicker;font-size:12px;letter-spacing:.16em;color:var(--yellow);font-weight:1000}
.arena-logo strong{grid-area:main;font:1000 48px/.78 "Baloo 2",Inter,sans-serif;letter-spacing:-.04em;text-shadow:0 4px 0 rgba(0,0,0,.4),0 0 28px rgba(53,232,255,.45)}
.arena-logo em{grid-area:sub;font:1000 34px/.9 "Baloo 2",Inter,sans-serif;color:var(--pink);font-style:normal;text-shadow:0 0 24px rgba(255,66,208,.55)}
.top-hud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.hud-pill{height:104px;border-radius:28px;padding:18px 22px;background:rgba(5,6,19,.72);border:1px solid rgba(255,255,255,.16);box-shadow:0 22px 70px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.16)}
.hud-pill span{display:block;font-size:12px;color:var(--muted);letter-spacing:.14em;font-weight:1000}
.hud-pill strong{display:block;margin-top:7px;font:1000 42px/.9 "Baloo 2",Inter,sans-serif;letter-spacing:-.03em}
.hud-pill.cyan strong{color:var(--cyan);text-shadow:0 0 24px rgba(53,232,255,.55)}
.hud-pill.pink strong{color:#ff83df;text-shadow:0 0 24px rgba(255,66,208,.55)}
.hud-pill.gold strong{color:var(--yellow);text-shadow:0 0 24px rgba(255,220,85,.45)}
.sound-toggle{width:82px;height:82px;border:0;border-radius:28px;background:linear-gradient(135deg,rgba(255,66,208,.38),rgba(141,89,255,.26));color:#fff;font-size:30px;box-shadow:0 18px 55px rgba(0,0,0,.35),0 0 25px rgba(255,66,208,.25);cursor:pointer}
.mega-progress{height:38px;display:grid;grid-template-columns:repeat(15,1fr);gap:12px;align-items:center;margin:0 80px 18px}
.mega-progress span{height:13px;border-radius:999px;background:rgba(255,255,255,.20);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.mega-progress span.done{background:linear-gradient(90deg,var(--cyan),var(--pink));box-shadow:0 0 22px rgba(255,66,208,.45)}
.mega-progress span.active{background:#fff;box-shadow:0 0 26px #fff;animation:activeBeat 1s infinite}
@keyframes activeBeat{50%{transform:scaleY(1.55)}}

.show-grid{display:grid;grid-template-columns:180px minmax(0,1fr) 230px;gap:20px;align-items:start}
.hype-rail{min-height:620px;position:relative}
.speech-bubble{position:absolute;top:140px;left:18px;padding:20px 26px;border-radius:26px;background:rgba(9,10,28,.86);border:1px solid rgba(255,66,208,.65);box-shadow:0 0 34px rgba(255,66,208,.38);font:1000 21px/1.05 "Baloo 2";text-align:center}
.speech-bubble:after{content:"";position:absolute;left:42px;bottom:-18px;border:10px solid transparent;border-top-color:rgba(255,66,208,.75)}
.host-avatar{position:absolute;bottom:0;left:10px;width:150px;height:270px;filter:drop-shadow(0 0 35px rgba(255,66,208,.45))}
.host-head{position:absolute;top:55px;left:48px;width:58px;height:58px;border-radius:50%;background:linear-gradient(135deg,#ffd0aa,#ff8ec9)}
.host-body{position:absolute;top:120px;left:28px;width:100px;height:135px;border-radius:45px 45px 18px 18px;background:linear-gradient(135deg,#292054,#111830);border:1px solid rgba(255,255,255,.18)}
.host-mic{position:absolute;top:113px;right:15px;width:20px;height:95px;background:linear-gradient(var(--cyan),var(--pink));border-radius:999px;transform:rotate(-18deg)}
.host-arm{position:absolute;top:122px;left:5px;width:86px;height:20px;background:#ffb78e;border-radius:999px;transform:rotate(-30deg);transform-origin:right center}

.question-card{
  border-radius:36px;padding:30px 34px;background:linear-gradient(145deg,rgba(17,22,70,.88),rgba(40,19,65,.80));border:1px solid rgba(255,255,255,.18);box-shadow:var(--shadow),0 0 0 2px rgba(141,89,255,.16),0 0 46px rgba(255,66,208,.22);position:relative;overflow:hidden;animation:cardIn .35s ease-out
}
@keyframes cardIn{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
.question-card:before{content:"";position:absolute;inset:0;border-radius:36px;padding:2px;background:linear-gradient(135deg,var(--cyan),var(--pink),var(--purple));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.75}
.card-meta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:18px}
.question-badge{display:inline-flex;align-items:center;padding:9px 18px;border-radius:14px;background:linear-gradient(90deg,var(--purple),var(--pink));font-weight:1000;letter-spacing:.08em;box-shadow:0 0 28px rgba(255,66,208,.44)}
.card-meta strong{font-weight:1000;font-size:18px}
.question-card h1{margin:0 0 18px;font:1000 clamp(38px,5vw,66px)/.9 "Baloo 2",Inter,sans-serif;letter-spacing:-.045em;text-shadow:0 5px 0 rgba(0,0,0,.38),0 0 30px rgba(255,255,255,.18)}
.context-panel{margin:0 0 20px;padding:15px 18px;border-radius:20px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#eef3ff}
.question-photo{margin:0 0 22px;border-radius:28px;overflow:hidden;border:2px solid rgba(255,66,208,.55);box-shadow:0 26px 70px rgba(0,0,0,.35),0 0 35px rgba(255,66,208,.26)}
.question-photo img{display:block;width:100%;height:clamp(220px,28vw,350px);object-fit:cover}
.answers{display:grid;gap:14px}
.answer-card{min-height:82px;display:grid;grid-template-columns:74px 1fr 44px;align-items:center;gap:18px;padding:0 18px 0 0;border-radius:18px;background:rgba(4,9,31,.75);border:2px solid rgba(53,232,255,.55);box-shadow:0 15px 45px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.12);cursor:pointer;transition:.18s;position:relative;overflow:hidden}
.answer-card:hover{transform:translateY(-2px) scale(1.01);border-color:var(--pink);box-shadow:0 20px 55px rgba(255,66,208,.22)}
.answer-card input{position:absolute;opacity:0}
.answer-letter{height:100%;display:grid;place-items:center;background:rgba(53,232,255,.15);color:var(--cyan);font:1000 36px "Baloo 2";text-shadow:0 0 16px rgba(53,232,255,.62);border-right:1px solid rgba(53,232,255,.35)}
.answer-text{font-size:21px;font-weight:1000}
.answer-check{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--pink);opacity:0;transform:scale(.4);transition:.18s}
.answer-card:has(input:checked){border-color:var(--pink);background:linear-gradient(90deg,rgba(255,66,208,.38),rgba(4,9,31,.75));box-shadow:0 0 34px rgba(255,66,208,.35)}
.answer-card:has(input:checked) .answer-check{opacity:1;transform:scale(1)}
.tip-strip{margin:18px auto 0;width:min(520px,100%);padding:10px 16px;border-radius:999px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.14);text-align:center;color:#f5f0ff}
.arena-button{margin:20px auto 0;width:min(560px,100%);border:0;border-radius:24px;padding:18px 26px;background:linear-gradient(90deg,#0ab7ff,var(--pink));color:#fff;display:flex;align-items:center;justify-content:center;gap:18px;font:1000 21px "Baloo 2";letter-spacing:.03em;box-shadow:0 0 38px rgba(255,66,208,.42);cursor:pointer;text-decoration:none}
.arena-button strong{font-size:36px;line-height:1}
.stats-rail{display:grid;gap:18px}
.stat-box{min-height:150px;border-radius:28px;background:rgba(5,6,19,.82);border:1px solid rgba(255,255,255,.16);box-shadow:var(--shadow),0 0 28px rgba(141,89,255,.18);padding:24px;text-align:center}
.stat-box span{display:block;color:var(--cyan);font-weight:1000;letter-spacing:.08em}
.stat-box strong{display:block;margin-top:10px;font:1000 54px/.9 "Baloo 2";text-shadow:0 0 22px rgba(255,255,255,.22)}
.stat-box em{font-style:normal;color:var(--yellow);font-weight:1000}
.stat-box.flame span{color:var(--yellow)}
.challenge-bar{margin-top:24px;display:grid;grid-template-columns:74px 1fr auto;gap:18px;align-items:center;padding:18px 24px;border-radius:28px;background:rgba(5,6,19,.82);border:1px solid rgba(255,66,208,.42);box-shadow:0 0 38px rgba(255,66,208,.18)}
.gift{font-size:44px;filter:drop-shadow(0 0 16px rgba(255,220,85,.5))}
.challenge-bar strong{font:1000 26px "Baloo 2";color:var(--yellow)}
.challenge-bar p{margin:2px 0 0;color:var(--muted)}
.challenge-bar a{padding:14px 20px;border-radius:18px;background:rgba(255,66,208,.20);border:1px solid rgba(255,66,208,.45);text-decoration:none;font-weight:1000}
.finish-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px}
.finish-card,.leaderboard-panel{border-radius:36px;padding:32px;background:linear-gradient(145deg,rgba(17,22,70,.90),rgba(40,19,65,.84));border:1px solid rgba(255,255,255,.18);box-shadow:var(--shadow)}
.finish-card h1{font:1000 clamp(40px,5vw,70px)/.9 "Baloo 2";margin:12px 0}
.finish-score{display:flex;gap:20px;align-items:end;margin:20px 0}
.finish-score strong{font:1000 86px/.8 "Baloo 2";color:var(--yellow);text-shadow:0 0 35px rgba(255,220,85,.4)}
.finish-score span{font:1000 34px "Baloo 2";color:var(--cyan)}
.result-form{display:grid;gap:14px;margin-top:20px}
.result-form label{display:grid;gap:8px;color:var(--muted)}
.result-form input[type=text],.result-form input[type=email],.share-input{width:100%;border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:16px;background:rgba(255,255,255,.08);color:#fff;font:inherit}
.checkline{display:flex!important;gap:10px;align-items:flex-start}.checkline input{margin-top:5px}
.leaderboard-panel h2{font:1000 30px "Baloo 2";margin:0 0 14px}
.leader-row{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:12px 0;border-top:1px solid rgba(255,255,255,.10)}
.leader-row b{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:rgba(53,232,255,.16);color:var(--cyan)}
.leader-row span{font-weight:1000}.leader-row em{grid-column:2;color:var(--muted);font-style:normal;font-size:13px;margin-top:-8px}
.saved-box{display:grid;gap:12px}.empty-state{width:min(720px,calc(100% - 32px));margin:15vh auto;padding:30px;border-radius:30px;background:rgba(255,255,255,.08);color:#fff}
.score-pop{position:fixed;left:50%;top:40%;z-index:20;transform:translate(-50%,-50%);font:1000 74px "Baloo 2";color:var(--yellow);text-shadow:0 0 30px rgba(255,220,85,.75);pointer-events:none;animation:scorePop .9s ease-out forwards}
@keyframes scorePop{from{opacity:0;transform:translate(-50%,-35%) scale(.7)}35%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}to{opacity:0;transform:translate(-50%,-80%) scale(.95)}}

@media(max-width:1050px){.show-grid{grid-template-columns:1fr 220px}.hype-rail{display:none}.arena-topbar{grid-template-columns:1fr}.sound-toggle{position:absolute;right:18px;top:18px}.mega-progress{margin-left:0;margin-right:0}}
@media(max-width:820px){.top-hud{grid-template-columns:repeat(3,1fr);gap:8px}.hud-pill{height:76px;padding:12px}.hud-pill strong{font-size:28px}.show-grid,.finish-grid{grid-template-columns:1fr}.stats-rail{grid-template-columns:repeat(3,1fr)}.stat-box{min-height:auto;padding:16px}.stat-box strong{font-size:34px}.arena-logo{min-height:96px}.mega-progress{gap:6px}.question-card{padding:22px}.question-card h1{font-size:42px}.answer-text{font-size:18px}.challenge-bar{grid-template-columns:1fr;text-align:center}.gift{display:none}}
@media(max-width:560px){.arena-shell{padding:12px}.arena-logo{grid-template-columns:50px 1fr;padding:14px 16px}.logo-cup{width:48px;height:48px}.arena-logo strong{font-size:36px}.arena-logo em{font-size:26px}.sound-toggle{width:54px;height:54px;border-radius:18px;font-size:22px}.hud-pill span{font-size:9px}.hud-pill strong{font-size:22px}.mega-progress{gap:4px}.mega-progress span{height:9px}.question-card{border-radius:28px;padding:18px}.question-card h1{font-size:34px}.question-photo img{height:210px}.answer-card{grid-template-columns:54px 1fr 32px;min-height:72px}.answer-letter{font-size:28px}.answer-text{font-size:16px}.stats-rail{grid-template-columns:1fr}.finish-score strong{font-size:60px}}


.save-error{
  margin:16px 0;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,77,115,.14);
  border:1px solid rgba(255,77,115,.42);
  color:#fff;
  font-weight:900;
}
/* EXTRA ARCADE BACKGROUND UPGRADE */
body{
  background:
    radial-gradient(circle at 50% -10%, rgba(255,255,255,.12), transparent 20%),
    radial-gradient(circle at 18% 18%, rgba(53,232,255,.45), transparent 25%),
    radial-gradient(circle at 82% 20%, rgba(255,66,208,.42), transparent 26%),
    radial-gradient(circle at 50% 115%, rgba(255,220,85,.18), transparent 35%),
    linear-gradient(145deg,#03040f 0%,#071044 46%,#24084b 100%) !important;
}
body:before{
  background:
    linear-gradient(102deg, rgba(53,232,255,.9) 0 9%, transparent 9% 91%, rgba(255,66,208,.88) 91% 100%),
    radial-gradient(circle at 20% 22%, rgba(53,232,255,.52), transparent 24%),
    radial-gradient(circle at 80% 18%, rgba(255,66,208,.50), transparent 26%),
    linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.42)) !important;
}
.arcade-floor,
body .arena-bg:before{
  animation-duration:5s;
}
.arena-bg{
  opacity:1 !important;
  background:
    linear-gradient(rgba(53,232,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,66,208,.07) 1px, transparent 1px),
    radial-gradient(circle at 25% 30%, rgba(255,220,85,.35) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 22%, rgba(53,232,255,.34) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 70%, rgba(255,66,208,.30) 0 2px, transparent 3px) !important;
  background-size:54px 54px,54px 54px,180px 180px,240px 240px,210px 210px !important;
  perspective:700px;
}
.arena-bg:after{
  content:"";
  position:absolute;
  left:-10%;
  right:-10%;
  bottom:-18%;
  height:46%;
  background:
    linear-gradient(rgba(53,232,255,.22) 2px, transparent 2px),
    linear-gradient(90deg, rgba(255,66,208,.22) 2px, transparent 2px);
  background-size:80px 44px;
  transform:rotateX(62deg);
  transform-origin:bottom center;
  opacity:.55;
  filter:drop-shadow(0 0 14px rgba(53,232,255,.28));
  animation:floorMove 1.8s linear infinite;
}
@keyframes floorMove{
  from{background-position:0 0,0 0}
  to{background-position:0 44px,80px 0}
}
.confetti-field{
  opacity:.22 !important;
  background-image:
    radial-gradient(circle,var(--yellow) 0 2px,transparent 3px),
    radial-gradient(circle,var(--pink) 0 2px,transparent 3px),
    radial-gradient(circle,var(--cyan) 0 2px,transparent 3px),
    linear-gradient(45deg, transparent 0 48%, rgba(255,255,255,.35) 49% 51%, transparent 52%) !important;
  background-size:140px 140px,210px 210px,170px 170px,260px 260px !important;
}
.beam-left,.beam-right{
  opacity:.9 !important;
  filter:blur(7px) drop-shadow(0 0 30px currentColor) !important;
}
.arena-shell:before,
.arena-shell:after{
  content:"";
  position:fixed;
  top:16vh;
  width:18px;
  height:64vh;
  border-radius:999px;
  pointer-events:none;
  opacity:.55;
  z-index:-1;
}
.arena-shell:before{
  left:26px;
  background:linear-gradient(180deg,transparent,var(--cyan),transparent);
  box-shadow:0 0 34px var(--cyan), 0 0 80px rgba(53,232,255,.42);
}
.arena-shell:after{
  right:26px;
  background:linear-gradient(180deg,transparent,var(--pink),transparent);
  box-shadow:0 0 34px var(--pink), 0 0 80px rgba(255,66,208,.42);
}
.question-card,
.finish-card,
.leaderboard-panel{
  background:
    radial-gradient(circle at 25% 0%, rgba(53,232,255,.20), transparent 28%),
    radial-gradient(circle at 82% 8%, rgba(255,66,208,.20), transparent 30%),
    linear-gradient(145deg,rgba(17,22,70,.94),rgba(40,19,65,.88)) !important;
}
.answer-card{
  background:
    linear-gradient(90deg, rgba(53,232,255,.12), rgba(255,66,208,.08)),
    rgba(4,9,31,.78) !important;
}
.answer-card:hover{
  box-shadow:0 20px 55px rgba(255,66,208,.24),0 0 22px rgba(53,232,255,.18) !important;
}


/* MAX SPANNING MODE */
.stress-mode .question-card{
  animation: stressPulse .68s ease-in-out infinite;
  box-shadow:
    var(--shadow),
    0 0 0 2px rgba(255,220,85,.38),
    0 0 45px rgba(255,220,85,.30),
    0 0 85px rgba(255,66,208,.24) !important;
}
.danger-mode .question-card{
  animation: dangerShake .34s ease-in-out infinite;
  box-shadow:
    var(--shadow),
    0 0 0 3px rgba(255,50,90,.52),
    0 0 60px rgba(255,50,90,.45),
    0 0 120px rgba(255,66,208,.34) !important;
}
@keyframes stressPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(calc(1.006 + (var(--stress-level, 1) * .001)))}
}
@keyframes dangerShake{
  0%,100%{transform:translateX(0) scale(1.01)}
  25%{transform:translateX(-3px) scale(1.012)}
  75%{transform:translateX(3px) scale(1.012)}
}
.stress-mode .question-badge{
  background:linear-gradient(90deg,#ffb000,#ff3d6e) !important;
  box-shadow:0 0 26px rgba(255,176,0,.55),0 0 40px rgba(255,61,110,.35) !important;
}
.danger-mode .question-badge{
  background:linear-gradient(90deg,#ff174f,#ff7a00) !important;
  animation: badgeBlink .55s infinite;
}
@keyframes badgeBlink{
  50%{filter:brightness(1.45);transform:scale(1.04)}
}
.stress-warning{
  position:absolute;
  top:22px;
  right:22px;
  z-index:8;
  display:grid;
  gap:2px;
  padding:12px 16px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,176,0,.96),rgba(255,61,110,.96));
  color:#180513;
  box-shadow:0 0 32px rgba(255,176,0,.42),0 14px 35px rgba(0,0,0,.30);
  animation: warningIn .25s ease-out, warningPulse .75s infinite .25s;
  text-align:center;
}
.stress-warning strong{
  font:1000 19px "Baloo 2", Inter, sans-serif;
  letter-spacing:.02em;
}
.stress-warning span{
  font-size:12px;
  font-weight:1000;
}
@keyframes warningIn{
  from{opacity:0;transform:translateY(-12px) scale(.88)}
  to{opacity:1;transform:none}
}
@keyframes warningPulse{
  50%{transform:scale(1.045)}
}
.stress-mode .arena-bg:after{
  opacity:.85 !important;
  animation-duration:.95s !important;
}
.danger-mode .arena-bg:after{
  animation-duration:.45s !important;
}
.stress-mode .hud-pill.pink{
  box-shadow:0 22px 70px rgba(0,0,0,.38),0 0 32px rgba(255,176,0,.35), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
.danger-mode .hud-pill.pink{
  box-shadow:0 22px 70px rgba(0,0,0,.38),0 0 42px rgba(255,50,90,.5), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
.stress-mode .answer-card{
  border-color:rgba(255,220,85,.55) !important;
}
.danger-mode .answer-card{
  border-color:rgba(255,66,208,.58) !important;
}
@media(max-width:560px){
  .stress-warning{
    position:relative;
    top:auto;
    right:auto;
    margin:0 0 14px;
  }
}


/* ZENUWSLOPEND MODE */
.panic-mode .question-card{
  animation: panicShake .18s ease-in-out infinite !important;
}
@keyframes panicShake{
  0%,100%{transform:translate(0,0) scale(1.014)}
  25%{transform:translate(-5px,2px) scale(1.016)}
  50%{transform:translate(4px,-2px) scale(1.016)}
  75%{transform:translate(-2px,-3px) scale(1.016)}
}
.countdown-bomb{
  position:fixed;
  left:50%;
  top:50%;
  z-index:80;
  transform:translate(-50%,-50%);
  width:150px;
  height:150px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  font:1000 70px/1 "Baloo 2", Inter, sans-serif;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.45), transparent 22%),
    linear-gradient(135deg, #ff174f, #ff7a00);
  box-shadow:
    0 0 40px rgba(255,23,79,.7),
    0 0 90px rgba(255,122,0,.45),
    0 22px 80px rgba(0,0,0,.45);
  border:4px solid rgba(255,255,255,.75);
  pointer-events:none;
}
.countdown-bomb.pop{
  animation: countdownPop .72s cubic-bezier(.2,1.5,.4,1);
}
@keyframes countdownPop{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.45) rotate(-10deg)}
  35%{opacity:1;transform:translate(-50%,-50%) scale(1.18) rotate(5deg)}
  100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}
}
.danger-mode .hud-pill.pink strong{
  animation: timerPanic .5s infinite;
}
@keyframes timerPanic{
  50%{transform:scale(1.12);filter:brightness(1.45)}
}
.panic-mode:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:70;
  pointer-events:none;
  background:radial-gradient(circle, transparent 42%, rgba(255,23,79,.22));
  animation: panicFlash .35s infinite;
}
@keyframes panicFlash{
  50%{opacity:.35}
}
.stress-mode .speech-bubble{
  animation:bubbleStress .5s infinite;
}
@keyframes bubbleStress{
  50%{transform:scale(1.06) rotate(-1deg)}
}
@media(max-width:560px){
  .countdown-bomb{
    width:112px;
    height:112px;
    font-size:52px;
  }
}


/* CINEMATIC INTRO SCREEN */
.tip-strip{display:none!important;}

.cinematic-start{
  min-height:calc(100vh - 230px);
  display:grid;
  place-items:center;
  padding:24px 0 44px;
  position:relative;
}
.cinematic-start:before{
  content:"";
  position:absolute;
  inset:5% 8%;
  border-radius:44px;
  background:
    radial-gradient(circle at 50% 15%, rgba(255,255,255,.16), transparent 20%),
    radial-gradient(circle at 20% 70%, rgba(53,232,255,.22), transparent 28%),
    radial-gradient(circle at 80% 65%, rgba(255,66,208,.22), transparent 30%);
  filter:blur(2px);
  opacity:.9;
  pointer-events:none;
}
.cinema-card{
  position:relative;
  width:min(820px,100%);
  padding:42px;
  border-radius:42px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,220,85,.18), transparent 20%),
    linear-gradient(145deg,rgba(17,22,70,.95),rgba(40,19,65,.90));
  border:2px solid rgba(255,255,255,.18);
  box-shadow:
    0 0 0 2px rgba(53,232,255,.12),
    0 0 55px rgba(53,232,255,.22),
    0 0 90px rgba(255,66,208,.20),
    var(--shadow);
  overflow:hidden;
  animation:cinemaIn .65s cubic-bezier(.2,1.4,.3,1);
}
.cinema-card:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(110deg, transparent 0 35%, rgba(255,255,255,.16) 45%, transparent 55% 100%);
  transform:translateX(-120%);
  animation:cinemaSweep 3.4s ease-in-out infinite;
}
@keyframes cinemaSweep{
  0%,35%{transform:translateX(-120%)}
  65%,100%{transform:translateX(120%)}
}
@keyframes cinemaIn{
  from{opacity:0;transform:translateY(26px) scale(.96)}
  to{opacity:1;transform:none}
}
.cinema-logo{
  display:inline-grid;
  grid-template-columns:auto auto;
  grid-template-areas:"cup main" "cup sub";
  align-items:center;
  gap:0 14px;
  margin-bottom:18px;
  position:relative;
  z-index:1;
}
.cinema-logo span{
  grid-area:cup;
  width:64px;
  height:64px;
  border-radius:22px;
  display:grid;
  place-items:center;
  font-size:32px;
  background:linear-gradient(135deg,var(--yellow),var(--pink));
  box-shadow:0 0 35px rgba(255,66,208,.45);
}
.cinema-logo strong{
  grid-area:main;
  font:1000 42px/.8 "Baloo 2", Inter, sans-serif;
  letter-spacing:-.04em;
  text-shadow:0 5px 0 rgba(0,0,0,.38),0 0 30px rgba(53,232,255,.45);
}
.cinema-logo em{
  grid-area:sub;
  font:1000 32px/.9 "Baloo 2", Inter, sans-serif;
  color:var(--pink);
  font-style:normal;
  text-align:left;
}
.cinema-kicker{
  position:relative;
  z-index:1;
  display:inline-flex;
  padding:9px 15px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  color:var(--yellow);
  font-weight:1000;
  letter-spacing:.08em;
  margin:0 0 18px;
}
.cinema-card h1{
  position:relative;
  z-index:1;
  margin:0;
  font:1000 clamp(46px,7vw,86px)/.85 "Baloo 2", Inter, sans-serif;
  letter-spacing:-.06em;
  text-shadow:0 6px 0 rgba(0,0,0,.42),0 0 36px rgba(255,255,255,.16);
}
.cinema-intro{
  position:relative;
  z-index:1;
  width:min(620px,100%);
  margin:18px auto 0;
  color:#eaf0ff;
  font-size:18px;
}
.cinema-rules{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:26px 0;
}
.cinema-rules span{
  padding:14px 12px;
  border-radius:18px;
  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.14);
  font-weight:1000;
}
.cinema-start-btn{
  position:relative;
  z-index:1;
  border:0;
  border-radius:26px;
  min-width:min(430px,100%);
  padding:20px 28px;
  cursor:pointer;
  color:#fff;
  font:1000 30px "Baloo 2", Inter, sans-serif;
  letter-spacing:.04em;
  background:linear-gradient(90deg,#00c8ff,var(--pink),#ff9b31);
  box-shadow:0 0 45px rgba(255,66,208,.42),0 18px 65px rgba(0,0,0,.35);
  transition:transform .18s ease, filter .18s ease;
}
.cinema-start-btn:hover{
  transform:translateY(-3px) scale(1.025);
  filter:saturate(1.15) brightness(1.05);
}
.cinema-start-btn.launching{
  animation:launchBtn .5s ease-in-out infinite;
}
@keyframes launchBtn{
  50%{transform:scale(1.05);filter:brightness(1.25)}
}
.cinema-launch .cinema-card{
  animation:launchScreen .45s ease-in forwards;
}
@keyframes launchScreen{
  to{opacity:.2;transform:scale(1.08)}
}
@media(max-width:700px){
  .cinema-card{padding:26px 18px;border-radius:32px}
  .cinema-rules{grid-template-columns:1fr}
  .cinema-logo strong{font-size:34px}
  .cinema-logo em{font-size:26px}
  .cinema-logo span{width:54px;height:54px}
  .cinema-start-btn{font-size:24px}
}


/* PRO INTRO + PLAYER NAME */
.arena-topbar{
  grid-template-columns:300px 1fr auto auto;
}
.player-chip{
  align-self:center;
  min-width:150px;
  padding:15px 18px;
  border-radius:22px;
  background:rgba(5,6,19,.72);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 18px 55px rgba(0,0,0,.30),0 0 24px rgba(53,232,255,.16);
  font-weight:1000;
  color:#fff;
  white-space:nowrap;
}
.cinema-player-form{
  position:relative;
  z-index:2;
  display:grid;
  gap:14px;
  margin-top:22px;
}
.cinema-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.cinema-fields label{
  display:grid;
  gap:7px;
  text-align:left;
  color:#dfe8ff;
  font-weight:1000;
}
.cinema-fields span{
  font-size:13px;
  color:var(--muted);
  letter-spacing:.04em;
}
.cinema-fields input{
  width:100%;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  padding:16px 17px;
  background:rgba(0,0,0,.28);
  color:#fff;
  font:800 16px Inter,system-ui,sans-serif;
  outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09);
}
.cinema-fields input:focus{
  border-color:rgba(53,232,255,.7);
  box-shadow:0 0 0 4px rgba(53,232,255,.10), inset 0 1px 0 rgba(255,255,255,.10);
}
.cinema-check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  justify-content:center;
  color:#dfe8ff;
  font-weight:900;
  font-size:14px;
}
.cinema-check input{
  margin-top:4px;
  accent-color:#ff42d0;
}
.save-error{
  margin:16px 0;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,77,115,.14);
  border:1px solid rgba(255,77,115,.42);
  color:#fff;
  font-weight:900;
}
.saved-box strong:before{
  content:"✅ ";
}
@media(max-width:1050px){
  .arena-topbar{
    grid-template-columns:1fr auto;
  }
  .top-hud{
    grid-column:1/-1;
  }
  .player-chip{
    grid-column:1/-1;
    justify-self:start;
  }
}
@media(max-width:700px){
  .cinema-fields{
    grid-template-columns:1fr;
  }
  .player-chip{
    font-size:14px;
    padding:12px 14px;
  }
}


/* TIMER 00:00 + ARCADE COUNTDOWN */
.countdown-screen{
  min-height:calc(100vh - 230px);
  display:grid;
  place-items:center;
  padding:24px 0 44px;
  position:relative;
}
.countdown-card{
  width:min(760px,100%);
  min-height:500px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:44px;
  border-radius:44px;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,220,85,.20), transparent 22%),
    radial-gradient(circle at 20% 75%, rgba(53,232,255,.22), transparent 30%),
    radial-gradient(circle at 80% 75%, rgba(255,66,208,.25), transparent 32%),
    linear-gradient(145deg,rgba(17,22,70,.96),rgba(40,19,65,.92));
  border:2px solid rgba(255,255,255,.18);
  box-shadow:
    0 0 0 2px rgba(53,232,255,.12),
    0 0 60px rgba(53,232,255,.26),
    0 0 105px rgba(255,66,208,.24),
    var(--shadow);
  position:relative;
  overflow:hidden;
}
.countdown-card:before{
  content:"";
  position:absolute;
  inset:-40%;
  background:conic-gradient(from 0deg, transparent, rgba(53,232,255,.22), transparent, rgba(255,66,208,.22), transparent);
  animation:countdownSpin 3s linear infinite;
}
@keyframes countdownSpin{to{transform:rotate(360deg)}}
.countdown-card > *{position:relative;z-index:1}
.countdown-mini-logo{
  align-self:end;
  color:var(--yellow);
  font:1000 24px "Baloo 2", Inter, sans-serif;
  letter-spacing:.04em;
  text-shadow:0 0 24px rgba(255,220,85,.35);
}
.countdown-mini-logo span{
  color:var(--pink);
}
.countdown-card p{
  margin:0;
  color:#eaf0ff;
  font-weight:1000;
  font-size:22px;
}
.countdown-number{
  width:220px;
  height:220px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  font:1000 112px/.9 "Baloo 2", Inter, sans-serif;
  background:
    radial-gradient(circle at 35% 22%, rgba(255,255,255,.44), transparent 22%),
    linear-gradient(135deg,var(--cyan),var(--pink));
  border:5px solid rgba(255,255,255,.7);
  box-shadow:
    0 0 48px rgba(53,232,255,.55),
    0 0 100px rgba(255,66,208,.42),
    0 22px 80px rgba(0,0,0,.45);
}
.countdown-number.boom{
  animation:countdownBoom .75s cubic-bezier(.2,1.6,.35,1);
}
.countdown-number.go{
  width:270px;
  border-radius:42px;
  font-size:80px;
  background:linear-gradient(90deg,var(--yellow),var(--orange),var(--pink));
}
@keyframes countdownBoom{
  0%{transform:scale(.35) rotate(-12deg);opacity:.2}
  45%{transform:scale(1.18) rotate(5deg);opacity:1}
  100%{transform:scale(1) rotate(0);opacity:1}
}
.countdown-sub{
  align-self:start;
  color:var(--muted);
  font-weight:1000;
  letter-spacing:.04em;
}
.countdown-launch .countdown-card{
  animation:launchScreen .65s ease-in forwards;
}
@media(max-width:700px){
  .countdown-card{
    min-height:420px;
    padding:28px 18px;
    border-radius:34px;
  }
  .countdown-number{
    width:160px;
    height:160px;
    font-size:82px;
  }
  .countdown-number.go{
    width:210px;
    font-size:62px;
  }
}


/* Intro top 3 podium */
.intro-podium{position:relative;z-index:2;margin:22px auto 0;width:min(640px,100%);padding:16px;border-radius:24px;background:rgba(0,0,0,.24);border:1px solid rgba(255,255,255,.14);box-shadow:0 0 28px rgba(53,232,255,.12)}
.intro-podium h2{margin:0 0 12px;font:1000 24px "Baloo 2",Inter,sans-serif;color:var(--yellow);text-shadow:0 0 18px rgba(255,220,85,.35)}
.podium-list{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px;align-items:end}
.podium-card{display:grid;gap:3px;min-height:92px;padding:13px 12px;border-radius:20px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);box-shadow:0 12px 30px rgba(0,0,0,.22)}
.podium-card strong{font:1000 28px "Baloo 2",Inter,sans-serif;color:var(--cyan)}
.podium-card span{font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.podium-card em{font-style:normal;color:var(--muted);font-size:13px}
.podium-card.place-1{min-height:110px;background:linear-gradient(145deg,rgba(255,220,85,.20),rgba(255,66,208,.10));border-color:rgba(255,220,85,.42)}
.podium-card.place-1 strong{color:var(--yellow)}
.bonus-time{display:block;margin-top:6px;color:var(--yellow);font-style:normal;font-weight:1000}
.bonus-toast{margin:0 0 16px;padding:12px 16px;border-radius:18px;background:rgba(255,220,85,.14);border:1px solid rgba(255,220,85,.38);color:#fff6bf;font-weight:1000;box-shadow:0 0 24px rgba(255,220,85,.16);animation:bonusPop .45s ease-out}
@keyframes bonusPop{from{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:none}}
.badge-wall{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:18px 0}
.badge-card{padding:14px;border-radius:20px;background:linear-gradient(145deg,rgba(255,220,85,.16),rgba(255,66,208,.11));border:1px solid rgba(255,255,255,.16);box-shadow:0 0 25px rgba(255,66,208,.12);display:grid;gap:4px;text-align:center}
.badge-card b{font-size:32px}
.badge-card span{font-weight:1000;color:#fff}
@media(max-width:700px){.podium-list{grid-template-columns:1fr}.podium-card,.podium-card.place-1{min-height:auto}.intro-podium{padding:13px}}


/* LEVEL 2 - safe game layer */
.level2-champion{position:relative;z-index:2;width:min(620px,100%);margin:20px auto 18px;display:grid;grid-template-columns:70px 1fr;gap:16px;align-items:center;text-align:left;padding:16px 18px;border-radius:26px;background:radial-gradient(circle at 20% 15%,rgba(255,220,85,.28),transparent 34%),linear-gradient(135deg,rgba(255,220,85,.18),rgba(255,66,208,.14)),rgba(0,0,0,.26);border:1px solid rgba(255,220,85,.48);box-shadow:0 0 32px rgba(255,220,85,.22),0 18px 50px rgba(0,0,0,.28)}
.level2-crown{width:62px;height:62px;border-radius:22px;display:grid;place-items:center;font-size:34px;background:linear-gradient(135deg,var(--yellow),var(--orange),var(--pink));box-shadow:0 0 26px rgba(255,220,85,.42)}
.level2-champion b{display:block;color:var(--yellow);font-size:12px;letter-spacing:.12em;font-weight:1000}
.level2-champion strong{display:block;font:1000 30px/.9 "Baloo 2",Inter,sans-serif;color:#fff}
.level2-champion em{display:block;margin-top:4px;color:#eaf0ff;font-style:normal;font-weight:900}
.level2-beat-banner,.level2-target-banner{display:inline-grid;place-items:center;margin:0 0 16px;padding:12px 18px;border-radius:18px;font-weight:1000;box-shadow:0 0 34px rgba(255,220,85,.24),0 14px 40px rgba(0,0,0,.25)}
.level2-beat-banner{color:#17051e;background:linear-gradient(90deg,var(--yellow),var(--orange),var(--pink))}
.level2-target-banner{color:#fff;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16)}
.share-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.share-btn{border:0;border-radius:17px;padding:13px 12px;text-align:center;text-decoration:none;color:#fff;font:1000 15px Inter,system-ui,sans-serif;cursor:pointer;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);box-shadow:0 12px 34px rgba(0,0,0,.22)}
.share-btn.whatsapp{background:linear-gradient(135deg,#12c65a,#089342)}
.share-btn.facebook{background:linear-gradient(135deg,#407cff,#1e49bd)}
.share-btn.mail{background:linear-gradient(135deg,var(--purple),var(--pink))}
.share-btn.copy{background:linear-gradient(135deg,var(--cyan),#4b6dff);color:#06101f}
.level2-mini-awards{display:grid;gap:8px;margin-top:10px}
.level2-mini-awards span{display:block;border-radius:999px;padding:9px 10px;background:rgba(255,220,85,.14);border:1px solid rgba(255,220,85,.30);color:#fff;font-size:12px;font-weight:1000;text-align:center}
@media(max-width:760px){.share-actions{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.level2-champion{grid-template-columns:1fr;text-align:center}.level2-crown{margin:0 auto}.share-actions{grid-template-columns:1fr}}


/* FOTO QUIZ PRO */
.photo-pro-card{
  position:relative;
  cursor:zoom-in;
}
.photo-pro-card img{
  transition:transform .45s ease, filter .35s ease;
}
.photo-pro-card:hover img{
  transform:scale(1.035);
  filter:saturate(1.12) contrast(1.04);
}
.photo-pro-card.zoomed img{
  transform:scale(1.16);
}
.photo-pro-badge{
  position:absolute;
  left:16px;
  top:16px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:9px 13px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--yellow),var(--pink));
  color:#18051f;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.08em;
  box-shadow:0 0 28px rgba(255,66,208,.38),0 10px 30px rgba(0,0,0,.28);
}
.photo-pro-card figcaption{
  position:absolute;
  left:14px;
  right:14px;
  bottom:14px;
  z-index:3;
  margin:0;
  padding:10px 13px;
  border-radius:16px;
  background:rgba(5,6,19,.72);
  color:#fff;
  font-size:13px;
  font-weight:900;
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.16);
}
.photo-pro-card:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px);
  background-size:54px 54px;
  opacity:.16;
  mix-blend-mode:screen;
}


/* Voorschoten Online PRO badge */
.vo-pro-question-badge{
  display:inline-flex;
  align-items:center;
  padding:8px 13px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--cyan),var(--purple));
  color:#fff;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.08em;
  box-shadow:0 0 22px rgba(53,232,255,.32);
}


/* Verslavender finish rewards + lokale titel */
.addictive-finish-rewards{
  display:grid;
  gap:12px;
  margin:18px 0 8px;
}
.perfect-run-reward,
.almost-top-reward{
  padding:14px 16px;
  border-radius:20px;
  font-weight:1000;
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 14px 40px rgba(0,0,0,.25),0 0 34px rgba(255,66,208,.20);
}
.perfect-run-reward{
  color:#17051e;
  background:linear-gradient(90deg,var(--yellow),var(--orange),var(--pink));
  animation:rewardPulse .8s infinite;
}
.almost-top-reward{
  background:linear-gradient(90deg,rgba(255,122,0,.92),rgba(255,66,208,.88));
}
.almost-top-reward.podium{
  color:#17051e;
  background:linear-gradient(90deg,var(--yellow),var(--cyan));
}
.addictive-streak-badge{
  margin-top:10px;
  padding:11px 12px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--yellow),var(--pink));
  color:#17051e;
  font-size:13px;
  font-weight:1000;
  text-align:center;
  box-shadow:0 0 26px rgba(255,66,208,.28);
  animation:rewardPulse .9s infinite;
}
@keyframes rewardPulse{
  50%{transform:scale(1.035);filter:brightness(1.18)}
}