/* v30.18.0: app feel (nothing selectable / no long-press menus), the 3-2-1 intro, the app toast. */

/* ---- 1. behave like an app, not a web page ------------------------------------- */
html,body{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%;touch-action:manipulation}
body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
img,svg,canvas,video{-webkit-user-drag:none;user-drag:none;-webkit-touch-callout:none}
input,textarea,select,[contenteditable="true"],
input *,textarea *{-webkit-user-select:text!important;user-select:text!important;-webkit-touch-callout:default!important}
.account-code,[data-selectable]{-webkit-user-select:all!important;user-select:all!important;-webkit-touch-callout:default!important}
::selection{background:transparent}
input::selection,textarea::selection{background:rgba(255,214,102,.45)}

/* ---- 2. "TIPS Royale klargøres · 3-2-1" ----------------------------------------- */
.game-intro{position:fixed;inset:0;z-index:14000;display:grid;place-items:center;padding:16px;
  background:radial-gradient(70% 60% at 50% 45%,rgba(20,44,72,.92),rgba(3,9,16,.96));backdrop-filter:blur(6px);
  animation:introIn .35s ease-out both}
.game-intro.hidden{display:none!important}
.game-intro-card{display:grid;justify-items:center;gap:6px;text-align:center;color:#e8f0f7}
.game-intro-logo{width:min(210px,52vw);height:auto;filter:drop-shadow(0 8px 24px rgba(0,0,0,.6));animation:introLogo 1s ease-in-out infinite alternate}
.game-intro-title{margin-top:6px;font-size:clamp(18px,5vw,26px);font-weight:1000;letter-spacing:1px;color:#ffe591;text-shadow:0 0 18px rgba(255,214,102,.45)}
.game-intro-sub{font-size:clamp(12px,3.4vw,15px);font-weight:800;letter-spacing:2px;text-transform:uppercase;color:#9db2c7}
.game-intro-count{display:grid;place-items:center;width:clamp(120px,34vw,170px);aspect-ratio:1;margin-top:8px;border-radius:50%;
  font-size:clamp(64px,20vw,104px);font-weight:1000;line-height:1;color:#2b1a04;
  background:radial-gradient(circle at 38% 32%,#fff3b8,#f1c240 52%,#9a6b0d);
  box-shadow:0 0 0 5px rgba(255,241,184,.85),0 0 46px rgba(255,214,102,.75),inset 0 -8px 18px rgba(0,0,0,.25)}
.game-intro-count.pulse{animation:introPulse 1s cubic-bezier(.2,1.5,.4,1) both}
.game-intro-count.go{font-size:clamp(34px,10vw,52px);letter-spacing:1px;color:#fff;background:radial-gradient(circle at 38% 32%,#b8ffd9,#2fbf73 55%,#0d6b3a);box-shadow:0 0 0 5px rgba(200,255,225,.85),0 0 60px rgba(60,230,140,.8)}
.game-intro-count.go.pulse{animation:introGo .5s cubic-bezier(.2,1.6,.4,1) both}
.game-intro-dots{display:flex;gap:8px;margin-top:10px}
.game-intro-dots i{width:8px;height:8px;border-radius:50%;background:#ffd766;animation:introDot 1s ease-in-out infinite}
.game-intro-dots i:nth-child(2){animation-delay:.15s}.game-intro-dots i:nth-child(3){animation-delay:.3s}
@keyframes introIn{from{opacity:0}to{opacity:1}}
@keyframes introLogo{from{transform:scale(1)}to{transform:scale(1.04)}}
@keyframes introPulse{0%{transform:scale(.55);opacity:.2}35%{transform:scale(1.12);opacity:1}60%{transform:scale(.97)}100%{transform:scale(1)}}
@keyframes introGo{0%{transform:scale(.6)}60%{transform:scale(1.18)}100%{transform:scale(1.08)}}
@keyframes introDot{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}

/* ---- 3. app toast (outside the table) ----------------------------------------- */
.app-toast{position:fixed;left:50%;top:max(14px,env(safe-area-inset-top));z-index:15000;max-width:min(92vw,420px);
  padding:10px 16px;border-radius:12px;border:1px solid #c9a24a;background:linear-gradient(180deg,#2c2414,#171209);
  color:#ffe9b8;font-weight:800;font-size:14px;text-align:center;box-shadow:0 12px 34px rgba(0,0,0,.55);
  transform:translate(-50%,-140%);opacity:0;transition:transform .28s cubic-bezier(.2,1.2,.4,1),opacity .2s;pointer-events:none}
.app-toast.show{transform:translate(-50%,0);opacity:1}
.app-toast.tone-bad{border-color:#d0675c;background:linear-gradient(180deg,#3a1714,#1d0b09);color:#ffd6d0}

@media (prefers-reduced-motion: reduce){
  .game-intro,.game-intro-logo,.game-intro-count.pulse,.game-intro-count.go.pulse,.game-intro-dots i{animation:none}
}
