/* Menus and overlays: table select, medals, help, pause, game over, toast, splash, flipper foreground. */
/* overlays: painel de vidro sobre a mesa */
.ov{position:absolute;box-sizing:border-box;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:18px;
  background:rgba(2,6,16,.55);border-radius:8px;pointer-events:auto;touch-action:manipulation;}
.ovIn{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;transform-origin:center center;
  color:var(--text);padding:28px 28px 22px;width:min(380px,100%);box-sizing:border-box;}
.eyebrow{font-weight:700;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-soft);}
.logo{font-family:var(--f-plate);font-weight:900;font-style:italic;font-size:58px;letter-spacing:.04em;line-height:1;margin:2px 0 0;padding:0 .1em;
  background:linear-gradient(180deg,#fff 0%,#aef6ff 55%,#2aa9ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 10px color-mix(in srgb,var(--neon) 60%,transparent)) drop-shadow(0 2px 0 #001a33);}
.plate{font-weight:800;font-size:13px;letter-spacing:.18em;color:var(--hot);text-shadow:0 0 10px rgba(255,150,40,.5);}
.tables{display:grid;grid-auto-flow:column;grid-auto-columns:96px;gap:10px;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:8px 6px 12px;box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--neon) transparent;overscroll-behavior-x:contain;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent);mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent);}
.tcard{scroll-snap-align:center;}
/* setas nas pontas da fita: mostram que há mais mesas do que cabem (os cartões cortados não diziam isso) e somem no fim */
.strip{position:relative;width:100%;}
.sarr{position:absolute;top:50px;z-index:2;width:36px;height:36px;border-radius:50%;padding:0 0 4px;cursor:pointer;display:grid;place-items:center;
  font:900 30px/1 var(--f-plate);color:var(--neon);text-shadow:0 0 6px var(--neon);border:2px solid transparent;
  background:radial-gradient(circle at 38% 30%,#1c2638,#0a0f1a 62%,#03050a) padding-box,var(--chrome) border-box;
  box-shadow:0 0 0 1px #000,0 4px 10px rgba(0,0,0,.6),0 0 10px var(--neon-soft);transition:opacity .2s;}
.sarr:disabled{opacity:0;pointer-events:none;}
.sarr:focus-visible{outline:2px solid var(--neon);outline-offset:3px;}
#tPrev{left:-14px;} #tNext{right:-14px;}
/* menos movimento: modo calmo do jogo ou pedido do sistema desligam animação e transição da interface */
body.calm *,body.calm *::before{animation:none !important;transition:none !important;}
body.calm .tcard:hover{transform:none;}
@media (prefers-reduced-motion: reduce){*,*::before{animation:none !important;transition:none !important;}.tcard:hover{transform:none;}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.tcard img{transition:transform .25s cubic-bezier(.2,1.4,.4,1),box-shadow .25s;}
.tcard.pick img{transform:scale(1.1);box-shadow:0 0 0 2px #fff,0 0 0 4px var(--neon),0 0 40px var(--neon);}
.ov.leaving{transition:opacity .26s ease-in;opacity:0;pointer-events:none;}
.tcard{display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:0;background:none;cursor:pointer;color:#fff;font-family:var(--f-plate);transition:transform .15s;}
.tcard img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:12px;display:block;
  box-shadow:0 0 0 2px #b4bfcc,0 0 0 4px #0a0f18,0 10px 20px rgba(0,0,0,.5);transition:box-shadow .2s,filter .2s;filter:saturate(.7) brightness(.75);}
.tcard b{font-weight:900;font-style:italic;font-size:17px;letter-spacing:.04em;text-shadow:0 1px 0 #000;}
.tcard small{font-weight:700;font-size:11px;color:var(--text-soft);min-height:1em;}
.tcard:hover{transform:translateY(-3px);}
.tcard[aria-pressed="true"] img{filter:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--neon),0 0 26px var(--neon),0 10px 20px rgba(0,0,0,.5);}
.tcard[aria-pressed="true"] b{color:var(--neon);text-shadow:0 0 10px var(--neon),0 1px 0 #000;}
.tcard:focus-visible{outline:2px solid var(--neon);outline-offset:4px;border-radius:12px;}
/* campanha: mesa fechada fica escura com cadeado; três medalhas embaixo de cada nome */
.tcard{position:relative;}
.tcard .lock{display:none;position:absolute;left:50%;top:38%;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;background:rgba(4,8,18,.85);
  box-shadow:0 0 0 2px #8ea0bb;place-items:center;color:#cfe0f2;}
.tcard .lock svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;}
.tcard.locked img{filter:grayscale(1) brightness(.35);} .tcard.locked b{color:#7d8aa0;} .tcard.locked .lock{display:grid;}
.tcard.locked:hover{transform:none;} .tcard.nope{animation:nope .35s;}
@keyframes nope{20%{transform:translateX(-6px);}40%{transform:translateX(5px);}60%{transform:translateX(-3px);}80%{transform:translateX(2px);}}
.pips{display:flex;gap:4px;justify-content:center;min-height:10px;} .tcard.locked .pips{visibility:hidden;}
.md{width:10px;height:10px;border-radius:50%;background:#1b2436;box-shadow:inset 0 0 0 1.5px #3a4864;display:inline-block;}
.md.on.b{background:radial-gradient(circle at 35% 30%,#ffd9b8,#b8743f);box-shadow:0 0 6px #e0955a;}
.md.on.p{background:radial-gradient(circle at 35% 30%,#fff,#9aa8bd);box-shadow:0 0 6px #cfe0f2;}
.md.on.o{background:radial-gradient(circle at 35% 30%,#fff3b0,#e0a21a);box-shadow:0 0 8px #ffc23a;}
.md.on.x{background:radial-gradient(circle at 35% 30%,#c8fbff,#1aa7c4);box-shadow:0 0 8px #38e8ff;}
.mdbig{width:auto;height:46px;aspect-ratio:143/200;flex:none;border-radius:0;background:center/contain no-repeat !important;box-shadow:none !important;
  filter:grayscale(1) brightness(.35) opacity(.75);} .mdbig.on{filter:drop-shadow(0 2px 6px rgba(0,0,0,.55));}
.mdbig.b{background-image:url(marca/medalha-b.webp) !important;} .mdbig.p{background-image:url(marca/medalha-p.webp) !important;}
.mdbig.o{background-image:url(marca/medalha-o.webp) !important;} .mdbig.x{background-image:url(marca/medalha-x.webp) !important;}
#ovFinal .mdbig{height:120px;animation:stamp .7s cubic-bezier(.3,1.7,.5,1) backwards .3s;} body.calm #ovFinal .mdbig{animation:none;}
#toast .mdbig{height:52px;margin:-10px 0;}
/* coleção: janela larga sobre a tela toda, vidro fosco atrás; um cartão por mesa com as três medalhas */
#ovMedals{position:fixed !important;inset:0 !important;width:auto !important;height:auto !important;z-index:40;padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,env(safe-area-inset-bottom,0px));
  background:rgba(3,7,16,.6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);}
#ovMedals .ovIn{width:min(1100px,100%);max-height:100%;overflow:auto;padding:22px clamp(14px,3vw,30px);}
/* escolha de mesa: janela larga como a das medalhas, todas as 13 mesas em grade (a fita de 96 px dentro da mesa era apertada);
   clicar no cartão já joga. Embaixo sobra espaço para os flippers do primeiro plano. */
#ovTitle{position:fixed !important;inset:0 !important;width:auto !important;height:auto !important;z-index:40;
  padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,env(safe-area-inset-bottom,0px));background:rgba(3,7,16,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);}
#ovTitle .ovIn{width:min(1060px,100%);max-height:100%;overflow:auto;padding:22px clamp(14px,3vw,30px) 20px;gap:14px;}
#ovTitle .sarr{display:none;}
/* como jogar: um cartão por jeito de jogar (no PC teclado e mouse, no celular o toque) */
#ovHelp{position:fixed !important;inset:0 !important;width:auto !important;height:auto !important;z-index:45;
  padding:max(12px,env(safe-area-inset-top,0px)) 12px max(12px,env(safe-area-inset-bottom,0px));background:rgba(3,7,16,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);}
#ovHelp .ovIn{width:min(760px,100%);max-height:100%;overflow:auto;padding:22px clamp(14px,3vw,30px) 20px;gap:14px;}
.hgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;width:100%;}
.hcard{border-radius:14px;padding:12px 16px 8px;text-align:left;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);}
.hcard h3{margin:0 0 4px;font:900 15px var(--f-plate);letter-spacing:.14em;text-transform:uppercase;color:var(--neon);text-shadow:0 0 8px var(--neon-soft);}
.hrow{display:flex;align-items:center;gap:12px;padding:7px 0;border-top:1px solid rgba(255,255,255,.07);} .hcard h3+.hrow{border-top:0;}
.hk{flex:none;width:112px;display:flex;flex-wrap:wrap;gap:4px;align-items:center;}
.hk kbd{font:800 12px var(--f-plate);color:#fff;background:#141c2e;border:1px solid #3a4a68;border-bottom-width:3px;border-radius:6px;padding:3px 7px;min-width:28px;text-align:center;}
.hk small{font:700 12px var(--f-plate);color:#cfe0f2;}
.hrow>span{font:600 14px/1.3 var(--f-plate);color:#d7e3f5;}
.hcard p{margin:6px 0 4px;font-size:12px;color:var(--text-soft);}
.mico{width:20px;height:28px;flex:none;color:#cfe0f2;}
.hgoal{margin:0;color:var(--text-soft);font-size:14px;max-width:60ch;}
.tog.nock::before{content:none;}
#ovTitle .tables{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:16px 14px;overflow:visible;
  scroll-snap-type:none;padding:8px 6px 4px;-webkit-mask-image:none;mask-image:none;}
#ovTitle .tcard b{font-size:16px;}
#ovTitle .trow{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;}
#ovTitle .trow .btn{margin:0;}
@media (max-width:520px){ #ovTitle{padding-bottom:calc(44vw*.5 + 4vh);} #ovTitle .tables{grid-template-columns:repeat(3,1fr);gap:12px 10px;} #ovTitle .tcard b{font-size:13px;}
  #ovTitle .trow{position:sticky;bottom:-20px;z-index:2;width:calc(100% + 32px);margin:0 -16px;padding:14px 8px 16px;background:linear-gradient(transparent,rgba(8,12,24,.97) 28%);} }
.mhero{display:flex;align-items:center;gap:16px;text-align:left;padding:10px 18px 10px 12px;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);}
.mhero .mdbig{height:78px;} .mhero b{display:block;font:900 20px var(--f-plate);font-style:italic;color:#fff;} .mhero small{font:600 13px var(--f-plate);color:#9fb0d4;}
.mhero .cnt{margin-left:auto;white-space:nowrap;font:900 30px var(--f-plate);color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 0 14px var(--neon);}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;width:100%;}
.mcard{position:relative;border-radius:12px;overflow:hidden;background:#0b1222;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);text-align:left;}
.mcard .art{position:relative;height:86px;background:center 30%/cover no-repeat;}
.mcard .art::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 35%,#0b1222);}
.mcard .art b{position:absolute;left:10px;bottom:4px;z-index:1;font:900 15px var(--f-plate);font-style:italic;color:#fff;text-shadow:0 1px 3px #000;}
.mcard .row3{display:flex;justify-content:space-around;padding:6px 6px 10px;} .mcard .row3 .mdbig{height:48px;}
.mcard.done{box-shadow:inset 0 0 0 2px #ffc23a,0 0 18px rgba(255,194,58,.35);}
.mcard.locked .art{filter:grayscale(1) brightness(.3);} .mcard.locked .row3{visibility:hidden;}
.mcard .lockt{display:none;position:absolute;left:0;right:0;bottom:16px;text-align:center;font:700 12px var(--f-plate);color:#9fb0d4;padding:0 8px;}
.mcard.locked .lockt{display:block;} .mcard.locked .art b{color:#7d8aa0;}
.mlegend .mdbig{height:28px;vertical-align:middle;} .mlegend span.it{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;margin:0 6px;}
@media (min-width:1000px){ .mgrid{grid-template-columns:repeat(7,1fr);} }
@media (max-width:520px){ .mgrid{grid-template-columns:repeat(2,1fr);} .mhero .mdbig{height:60px;} .mhero .cnt{font-size:22px;} } .tbar{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;}
/* aviso de medalha durante o jogo: desce do alto da mesa com mola e sobe de volta */
#toast{position:absolute;z-index:6;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 9px;border-radius:999px;pointer-events:none;
  background:rgba(6,10,22,.9);box-shadow:0 0 0 2px var(--neon),0 0 24px var(--neon-soft),0 10px 26px rgba(0,0,0,.6);color:#fff;font-family:var(--f-plate);
  transform:translate(-50%,-140%);opacity:0;transition:transform .5s cubic-bezier(.3,1.6,.5,1),opacity .25s;}
#toast.in{transform:translate(-50%,0);opacity:1;} #toast b{display:block;font-weight:900;font-size:14px;letter-spacing:.06em;text-transform:uppercase;}
#toast small{display:block;font-size:12px;color:#cfe0f2;} body.calm #toast{transition:opacity .2s;}
/* fim de jogo: medalhas da partida e mesa nova */
#overNews{display:flex;flex-direction:column;align-items:center;gap:8px;} #overNews:empty{display:none;}
#overNews .got{display:flex;gap:8px;} #overNews .got .md{animation:stamp .5s cubic-bezier(.3,1.7,.5,1) backwards;}
@keyframes stamp{from{transform:scale(2.4);opacity:0;}to{transform:scale(1);opacity:1;}} body.calm #overNews .got .md{animation:none;}
.newt{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border-radius:12px;background:color-mix(in srgb,var(--neon) 12%,transparent);box-shadow:0 0 0 1px var(--neon);}
.newt img{width:38px;height:50px;object-fit:cover;border-radius:6px;} .newt span{font:800 12px var(--f-plate);letter-spacing:.12em;text-transform:uppercase;color:var(--neon);text-align:left;}
.newt span b{display:block;color:#fff;font-size:17px;font-style:italic;letter-spacing:.04em;}
/* coleção de medalhas */
.mlist{display:grid;gap:5px;width:min(420px,100%);text-align:left;}
.mrow{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;padding:4px 8px 4px 4px;border-radius:8px;background:rgba(255,255,255,.03);}
.mrow img{width:30px;height:40px;object-fit:cover;border-radius:5px;} .mrow b{font:800 13px var(--f-plate);font-style:italic;color:#fff;}
.mrow small{display:block;font:600 11px var(--f-plate);color:#9fb0d4;} .mrow.locked img{filter:grayscale(1) brightness(.35);} .mrow.locked b{color:#6f7d96;}
.mrow .tbar{gap:5px;}
.mlegend{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;justify-content:center;font:600 12px var(--f-plate);color:#cfe0f2;}
.mlegend .md{margin-left:6px;}
#overNews .got{flex-direction:column;align-items:flex-start;gap:6px;} #overNews .got div{display:flex;align-items:center;gap:8px;font:800 13px var(--f-plate);color:#fff;text-align:left;}
#overNews .got small{display:block;font-weight:600;font-size:11px;color:#9fb0d4;} .mrow .md{width:16px;height:16px;}
/* final da odisseia */
#ovFinal .ovTitle{font-size:30px;} #ovFinal p{max-width:30ch;color:#dfeaf7;font:600 15px/1.45 var(--f-text);margin:0;}
.fig{width:170px;height:134px;display:block;border-radius:12px;box-shadow:0 0 0 2px #b4bfcc,0 0 0 4px #0a0f18,0 0 18px var(--neon-soft);}
.btn{font-family:var(--f-plate);font-weight:900;font-size:20px;letter-spacing:.14em;text-transform:uppercase;padding:11px 34px 10px;cursor:pointer;color:#fff;
  border:2px solid #ffd9a0;border-radius:999px;text-shadow:0 1px 0 #7a2600,0 0 6px rgba(0,0,0,.4);
  /* brilho só numa faixa fina no topo: as letras brancas ficam sobre laranja escuro (contraste ≥ 3:1, texto grande) */
  background:linear-gradient(180deg,#ffb35c 0%,#f06a0a 22%,#e05a00 50%,#c44400 51%,#a83600 100%);
  box-shadow:0 4px 0 #6e2400,0 8px 18px rgba(0,0,0,.5),0 0 22px rgba(255,120,0,.45);}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 #6e2400,0 0 16px rgba(255,120,0,.4);}
.btn.ghost{background:color-mix(in srgb,var(--neon) 6%,transparent);border-color:var(--neon);color:#e6fbff;font-size:14px;padding:8px 22px;text-shadow:0 1px 0 #000;
  box-shadow:0 0 12px var(--neon-soft),inset 0 0 10px color-mix(in srgb,var(--neon) 12%,transparent);}
.btn.ghost:active{box-shadow:0 0 6px var(--neon-soft);}
.ctl{font-size:14px;font-weight:600;color:#d3e6f2;line-height:1.45;max-width:32ch;}
.toggles{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;}
.vols{display:grid;gap:6px;width:min(280px,100%);}
.vol{display:grid;grid-template-columns:70px 1fr 34px;align-items:center;gap:10px;font:700 12px var(--f-plate);letter-spacing:.06em;text-transform:uppercase;color:#cfe0f2;}
.vol b{font-variant-numeric:tabular-nums;text-align:right;color:var(--neon);font-weight:800;}
.vol input{width:100%;accent-color:var(--neon);height:28px;cursor:pointer;}
.tog{font-family:var(--f-plate);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:6px 12px;border-radius:999px;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--neon) 40%,transparent);background:rgba(255,255,255,.03);color:#7f9fb3;}
.tog[aria-pressed="true"]::before{content:"✓ ";}
.tog[aria-pressed="true"]{background:color-mix(in srgb,var(--neon) 18%,transparent);color:#fff;border-color:var(--neon);box-shadow:0 0 10px var(--neon-soft);text-shadow:0 0 6px var(--neon);}
/* menu de idioma: pílula como os .tog, nomes de cada idioma na própria língua */
.lang{font:700 12px var(--f-plate);letter-spacing:.06em;padding:6px 12px;border-radius:999px;cursor:pointer;color:#cfe0f2;
  border:1px solid color-mix(in srgb,var(--neon) 40%,transparent);background:rgba(255,255,255,.03);}
.lang option{background:#0a1222;color:#fff;} .lang:focus-visible{outline:2px solid var(--neon);outline-offset:4px;}
.ovTitle{font-family:var(--f-plate);font-weight:900;font-size:34px;letter-spacing:.14em;text-transform:uppercase;line-height:1;color:#fff;text-shadow:0 0 14px var(--neon),0 2px 0 #001a33;}
.final{font-weight:900;font-size:46px;color:#fff;font-variant-numeric:tabular-nums;line-height:1;text-shadow:0 0 16px rgba(255,180,60,.6),0 2px 0 #000;}
@keyframes stamp{0%{transform:scale(1.9) rotate(-9deg);opacity:0}55%{transform:scale(.9) rotate(2deg);opacity:1}100%{transform:scale(1) rotate(-2deg);opacity:1}}
@keyframes pop{0%{transform:scale(1.14)}100%{transform:scale(1)}}
.newrec.stamp{animation:stamp .42s cubic-bezier(.2,1.4,.4,1) both;}
.final.pop{animation:pop .32s ease-out;}
.newrec{font-weight:900;font-size:12px;letter-spacing:.18em;color:#3a1600;background:linear-gradient(#ffe08a,#ff9a1f);padding:4px 12px 3px;border-radius:999px;box-shadow:0 0 14px rgba(255,150,30,.6);}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:6px 22px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-soft);text-align:left;}
.stats b{display:block;font-weight:800;font-size:22px;color:#fff;font-variant-numeric:tabular-nums;text-transform:none;text-shadow:0 1px 0 #000;}
.small{font-size:12px;font-weight:600;color:var(--text-soft);}
#rotate{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--room);text-align:center;padding:24px;font-size:18px;font-weight:600;color:var(--text-soft);}
#rotate b{font-weight:900;font-style:italic;font-size:40px;letter-spacing:.06em;color:#fff;text-shadow:0 0 14px var(--neon);}
/* sala: a arte da mesa atual, bem desfocada e escura, atrás de tudo (antes era um azul liso). Duas camadas para cruzar
   na troca de mesa; respiro lento só com mouse e fora do modo calmo (no celular fica parado, para poupar bateria) */
#amb{position:fixed;inset:0;overflow:hidden;background:var(--room);transition:transform .8s cubic-bezier(.2,.7,.2,1);}
#amb i{position:absolute;inset:-10%;background:center/cover no-repeat;filter:blur(38px) saturate(1.45) brightness(.66);opacity:0;transition:opacity 1s ease;transform:scale(1.06);}
#amb i.on{opacity:1;}
@media (pointer:fine){ body:not(.calm) #amb i.on{animation:ambDrift 26s ease-in-out infinite alternate;} }
@keyframes ambDrift{from{transform:scale(1.06) translate(0,0);}to{transform:scale(1.16) translate(-2.5%,1.8%);}}
#amb.glow{animation:ambGlow 1.6s ease-out;}
@keyframes ambGlow{0%{filter:brightness(1);}18%{filter:brightness(1.45) saturate(1.15);}100%{filter:brightness(1);}}
body.calm #amb{transition:none;} body.calm #amb.glow{animation:none;}
/* abertura: vidro fosco sobre o jogo inteiro; some com um zoom curto no toque */
#splash{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,3vh,28px);
  padding:max(24px,env(safe-area-inset-top,0px)) 16px max(24px,env(safe-area-inset-bottom,0px));cursor:pointer;text-align:center;
  background:rgba(3,7,16,.42);-webkit-backdrop-filter:blur(22px) saturate(1.2);backdrop-filter:blur(22px) saturate(1.2);transition:opacity .45s ease;}
#splash.out{opacity:0;pointer-events:none;}
#splash img.logo{width:min(86vw,560px);height:auto;filter:drop-shadow(0 6px 24px rgba(0,0,0,.6)) drop-shadow(0 0 26px var(--neon-soft));
  animation:logoIn .9s cubic-bezier(.3,1.5,.5,1) both,logoGlow 3.2s ease-in-out .9s infinite alternate;}
@keyframes logoIn{from{transform:scale(.6) translateY(-20px);opacity:0;}to{transform:none;opacity:1;}}
@keyframes logoGlow{from{filter:drop-shadow(0 6px 24px rgba(0,0,0,.6)) drop-shadow(0 0 18px var(--neon-soft));}to{filter:drop-shadow(0 6px 24px rgba(0,0,0,.6)) drop-shadow(0 0 34px var(--neon));}}
body.calm #splash img.logo{animation:none;}
#splash .sub{font:800 clamp(12px,1.6vw,15px) var(--f-plate);letter-spacing:.32em;text-transform:uppercase;color:#cfe3f5;margin-top:-6px;}
#splash .card{width:min(46vw,34vh,300px);aspect-ratio:3/4;border-radius:16px;overflow:hidden;position:relative;
  box-shadow:0 0 0 3px #b4bfcc,0 0 0 5px #0a0f18,0 0 40px var(--neon-soft),0 26px 60px rgba(0,0,0,.65);animation:spFloat 4.5s ease-in-out infinite alternate;transition:transform .45s cubic-bezier(.3,1.5,.5,1);}
#splash .card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .9s ease;}
#splash.out .card{transform:scale(1.12);}
#splash .go{font:800 clamp(14px,2vw,18px) var(--f-plate);letter-spacing:.24em;text-transform:uppercase;color:var(--neon);text-shadow:0 0 10px var(--neon);
  animation:spPulse 1.8s ease-in-out infinite;}
#splash .brand{position:absolute;bottom:max(14px,env(safe-area-inset-bottom,0px));font:700 11px var(--f-plate);letter-spacing:.3em;text-transform:uppercase;color:#7f93b0;}
@keyframes spFloat{from{transform:translateY(-6px) rotate(-1.2deg);}to{transform:translateY(6px) rotate(1.2deg);}}
@keyframes spPulse{0%,100%{opacity:.45;}50%{opacity:1;}}
body.calm #splash .card,body.calm #splash .go{animation:none;}
/* flippers em primeiro plano nos menus (abertura, escolha de mesa, fim): seguem o mouse ao contrário do fundo,
   balançam devagar e batem sozinhos de vez em quando ou com as teclas de flipper. Nunca pegam clique. */
#fg{position:fixed;inset:0;z-index:60;pointer-events:none;display:none;--w:clamp(150px,min(21vw,34vh),340px);
  transform:translate(var(--fx,0px),var(--fy,0px));transition:transform .6s cubic-bezier(.2,.7,.2,1);}
body:has(#splash:not([hidden])) #fg,body:has(#ovTitle:not([hidden])) #fg,body:has(#ovOver:not([hidden])) #fg,body:has(#ovFinal:not([hidden])) #fg{display:block;}
#fg img{position:absolute;bottom:max(12px,5vh);width:var(--w);height:auto;filter:drop-shadow(0 12px 18px rgba(0,0,0,.6)) drop-shadow(0 0 22px var(--neon-soft));
  transition:rotate .3s cubic-bezier(.3,1.6,.5,1);animation:fgBob 3.6s ease-in-out infinite alternate;}
#fg .l{left:calc(var(--w)*-.12);transform-origin:17% 31%;rotate:16deg;} #fg .r{right:calc(var(--w)*-.12);transform-origin:83% 31%;rotate:-16deg;animation-delay:-1.8s;}
#fg .l.kick{rotate:-16deg;transition-duration:.06s;} #fg .r.kick{rotate:16deg;transition-duration:.06s;}
@keyframes fgBob{from{translate:0 0;}to{translate:0 -7px;}}
body.calm #fg,body.calm #fg img{transition:none;animation:none;}
@media (max-width:520px){ #fg{--w:44vw;} }
/* End of css/menus.css */