/* TIPS Royale v30.11.0 - "Vælg spil" after LET'S PLAY (Original / Ultra / Extreme) and the
   game logo on the front page, which takes you back to the picker. */
.game-picker{
  position:fixed;inset:0;z-index:5000;overflow:auto;
  display:grid;place-items:center;
  padding:max(16px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom));
  background:radial-gradient(circle at 50% 18%,rgba(45,91,139,.58),transparent 40%),radial-gradient(circle at 50% 80%,rgba(183,125,22,.16),transparent 42%),#07101b;
  color:#e8f0f7;
}
.game-picker.hidden{display:none!important}
.game-picker-inner{width:min(1080px,100%);text-align:center}
.game-picker-kicker{font-size:12px;font-weight:1000;letter-spacing:3px;color:#d9bd68}
.game-picker-title{margin:2px 0 clamp(12px,2.6dvh,26px);font-size:clamp(26px,4.4dvh,40px);font-weight:1000;color:#ffe591;text-shadow:0 4px 18px rgba(0,0,0,.5)}
.game-picker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,24px);align-items:stretch}
.game-pick{
  position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:clamp(10px,1.6dvh,18px) 10px clamp(12px,1.8dvh,18px);
  border:1px solid #2f4d6b;border-radius:20px;cursor:pointer;
  background:linear-gradient(180deg,rgba(23,52,81,.9),rgba(10,24,38,.92));
  color:#fff;font:inherit;touch-action:manipulation;
  box-shadow:0 14px 34px rgba(0,0,0,.38);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,filter .18s ease;
}
.game-pick img{width:min(100%,clamp(150px,34dvh,300px));aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 12px 24px rgba(0,0,0,.5));transition:transform .25s ease}
.game-pick strong{font-size:clamp(14px,2.1dvh,18px);font-weight:1000;color:#ffe591}
.game-pick-tag{padding:4px 12px;border-radius:999px;font-size:11px;font-weight:1000;letter-spacing:1px;text-transform:uppercase;background:#2a3b4f;color:#cbdceb}
.game-pick-tag.play{background:linear-gradient(180deg,#2fa36a,#1c7a4c);color:#fff;box-shadow:0 0 16px rgba(47,163,106,.45)}
.game-pick.available{border-color:#d1a83e;box-shadow:0 14px 34px rgba(0,0,0,.38),0 0 0 2px rgba(209,168,62,.18),0 0 34px rgba(255,214,102,.18)}
.game-pick.available:hover,.game-pick.available:focus-visible{transform:translateY(-4px);border-color:#ffe591;box-shadow:0 18px 40px rgba(0,0,0,.45),0 0 44px rgba(255,214,102,.32)}
.game-pick.available:hover img{transform:scale(1.04) rotate(-1deg)}
.game-pick.coming-soon{cursor:default}
.game-pick.coming-soon img{filter:grayscale(.55) brightness(.72) drop-shadow(0 12px 24px rgba(0,0,0,.5))}
.game-pick.coming-soon strong{color:#c9b98a}
.game-pick.coming-soon::after{
  content:"COMING SOON";position:absolute;top:18px;right:-6px;padding:5px 12px;border-radius:6px 0 0 6px;
  background:linear-gradient(180deg,#d33a3a,#9b1f22);color:#fff;font-size:11px;font-weight:1000;letter-spacing:1.4px;
  box-shadow:0 6px 14px rgba(0,0,0,.4);
}
.game-pick.nudge{animation:gamePickNudge .42s ease}
@keyframes gamePickNudge{20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.game-picker-note{min-height:1.4em;margin-top:clamp(10px,2dvh,18px);font-weight:800;color:#ffe591}

/* phones: Original large on top, Ultra and Extreme side by side below */
@media(max-width:700px){
  .game-picker-grid{grid-template-columns:1fr 1fr;gap:10px}
  .game-pick.available{grid-column:1/-1}
  .game-pick.available img{width:min(78vw,34dvh)}
  .game-pick.coming-soon img{width:min(38vw,19dvh)}
  .game-pick.coming-soon::after{top:10px;font-size:9px;padding:4px 8px}
  .game-pick strong{font-size:14px}
  .game-pick.coming-soon strong{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.game-pick,.game-pick img{transition:none}.game-pick.nudge{animation:none}}

/* the logo on the front page goes back to the picker */
.front-logo-btn{display:block;position:relative;margin:0 auto;padding:0;border:0;background:none;cursor:pointer;touch-action:manipulation}
.front-logo-btn .front-logo{transition:transform .2s ease,filter .2s ease}
.front-logo-btn:hover .front-logo,.front-logo-btn:focus-visible .front-logo{transform:scale(1.03);filter:drop-shadow(0 0 18px rgba(255,214,102,.35))}
.front-logo-switch{
  position:absolute;left:50%;bottom:clamp(6px,1.2dvh,12px);transform:translateX(-50%);white-space:nowrap;
  padding:3px 10px;border:1px solid #d1a83e;border-radius:999px;background:rgba(10,24,38,.88);
  color:#ffe591;font-size:11px;font-weight:900;letter-spacing:.4px;
}