/* Naab game: colors, type and controls shared by the player, booth and admin pages. */
:root{
  --bg:#EDF1F5;
  --surface:#FFFFFF;
  --surface-2:#F5F8FB;
  --ink:#1A1A1A;
  --muted:#5A6672;
  --line:#DCE3EA;
  --azure:#009CFF;
  --azure-text:#0070BD;
  --azure-soft:#E2F2FF;
  --btn:#007FD4;
  --btn-ink:#FFFFFF;
  --good:#14965C; --good-soft:#DCF4E7; --good-ink:#0A6B3F;
  --bad:#DC3F45; --bad-soft:#FCE7E8; --bad-ink:#A5262B;
  --warn:#B26A00; --warn-soft:#FFF1D6;
  --tooth:#FFFFFF; --tooth-line:#A9B7C5; --groove:#CBD5DF; --gum:#E3EFF9;
  --shadow:rgba(16,40,70,.32);
  --sky-1:#006FBA; --sky-2:#0A9BF5; --on-sky:#FFFFFF; --on-sky-soft:rgba(255,255,255,.55);
  --qr-bg:#FFFFFF;
  --veil:rgba(255,255,255,.74);
  --font-body:"Readex Pro","Segoe UI",Tahoma,system-ui,sans-serif;
  --font-num:"Outfit","Readex Pro","Segoe UI",system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#0D1218; --surface:#151C24; --surface-2:#1A232D; --ink:#EDF1F5; --muted:#97A4B1; --line:#27323E;
    --azure:#2AABFF; --azure-text:#62C3FF; --azure-soft:#102A40; --btn:#1388DB; --btn-ink:#FFFFFF;
    --good:#38C77F; --good-soft:#0F2E1F; --good-ink:#7BE3AC; --bad:#FF6A6F; --bad-soft:#3A1719; --bad-ink:#FF9EA1;
    --warn:#F2B04A; --warn-soft:#3A2A10;
    --tooth:#EEF3F8; --tooth-line:#7D8E9E; --groove:#AFBCC8; --gum:#1B3247;
    --shadow:rgba(0,0,0,.6);
    --sky-1:#004F87; --sky-2:#0676C4; --veil:rgba(21,28,36,.8);
    color-scheme:dark;
  }
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
.num{font-family:var(--font-num);font-variant-numeric:tabular-nums}
h1,h2,h3{text-wrap:balance}
button{font:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--azure);outline-offset:2px}

.logo{display:block;height:24px;width:auto;--logo-mark:var(--azure);--logo-word:var(--ink)}
.logo.on-sky{--logo-mark:var(--on-sky);--logo-word:var(--on-sky)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;font-weight:600;transition:transform .12s ease, background-color .15s ease;text-decoration:none}
.btn:active{transform:scale(.98)}
.btn.primary{background:var(--btn);color:var(--btn-ink);height:54px;font-size:17px;width:100%;padding:0 22px}
.btn.ghost{background:var(--azure-soft);color:var(--azure-text);height:44px;font-size:15px;padding:0 16px}
.btn.sm{height:36px;font-size:14px;padding:0 14px}
.btn[disabled]{opacity:.55;cursor:default}

.tag{font-size:12px;padding:3px 10px;border-radius:99px;background:var(--surface-2);color:var(--muted);border:1px solid var(--line);white-space:nowrap}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
