/* DELUX Arena V30 — mobile-first game lobby and cinematic entry */
:root{--v30-gold:#edc879;--v30-ink:#07090d;--v30-panel:rgba(12,16,23,.88);--v30-line:rgba(237,200,121,.32)}
html,body{min-height:100%;background:#05070b}
body{background:radial-gradient(ellipse at 50% 0,#1a2634 0,#080b11 43%,#030405 100%);padding-bottom:env(safe-area-inset-bottom)}
header{position:sticky;top:0;z-index:30;min-height:58px;padding:10px max(15px,env(safe-area-inset-left));background:rgba(4,6,10,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--v30-line)}
header h1{font-size:clamp(20px,5vw,26px);letter-spacing:.04em;text-shadow:0 2px 18px #e9bc6a33}
header a{font-size:12px;text-decoration:none;color:#e8c77f}
main{width:100%;max-width:1120px;margin:0 auto;padding:clamp(12px,3vw,26px)}
#s-login,#s-lobby{width:100%;max-width:100%;margin:0 auto}
#s-login .hero,#s-lobby .hero{position:relative;width:100%;max-width:none;margin:0 auto 16px;overflow:hidden;border:1px solid var(--v30-line);border-radius:clamp(15px,3vw,24px);box-shadow:0 24px 65px #0009,0 0 34px #d6a94b12;background:#070b10}
#s-login .hero canvas,#s-lobby .hero canvas{display:block;width:100%;height:auto;min-height:0;aspect-ratio:16/9;object-fit:cover}
#s-login .ht,#s-lobby .ht{inset:0;justify-content:center;padding:0 14px;background:linear-gradient(180deg,#02050a16 5%,#03060a32 48%,#020306c9 100%)}
#s-login .ht h2,#s-lobby .ht h2{font-size:clamp(58px,15vw,132px);letter-spacing:.035em;text-shadow:0 8px 32px #000}
#s-login .ht h3,#s-lobby .ht h3{font-size:clamp(16px,4vw,30px);letter-spacing:.55em;margin-left:.55em;text-shadow:0 4px 18px #000}
#s-lobby .k2{text-align:left;margin:18px 3px 4px;color:#f3eee3;font-size:15px}
#s-lobby #dlx-pais{margin:4px 3px 14px;color:#aeb8c6;font-size:12px}
#s-lobby .menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:16px 0 18px}
#s-lobby .big{display:flex;align-items:center;justify-content:center;gap:8px;min-height:66px;padding:13px 10px;margin:0;border-radius:14px;font-size:clamp(14px,3.7vw,17px);font-weight:800;letter-spacing:.025em;box-shadow:0 9px 24px #0007;transition:transform .16s,filter .16s}
#s-lobby .big:active{transform:scale(.97);filter:brightness(1.15)}
#s-lobby .big:not(.sec){background:linear-gradient(135deg,#fff2c8 0,#edc879 52%,#a97931 100%);border:1px solid #ffe5a5;color:#171108}
#s-lobby .big.sec{background:linear-gradient(145deg,#202a38,#0b1018);border:1px solid #a98b53;color:#f3d99f}
#s-lobby .big .bi{font-size:20px}
#s-lobby .pl{display:block;padding:13px 14px;margin:10px 0;border:1px solid #ffffff20;border-radius:14px;background:var(--v30-panel);color:#c0c8d3;font-size:13px}
#s-lobby select{display:block;width:100%;min-height:48px;margin-top:8px;background:#080c13;border:1px solid #8f7548;color:#f4e7c9;border-radius:10px}
#s-lobby details.card{background:var(--v30-panel);border:1px solid #ffffff24;border-radius:15px;box-shadow:0 14px 34px #0005}
#s-lobby details summary{font-size:16px;font-weight:700;color:#f2d99f}
#s-lobby .tiny{font-size:11px;line-height:1.65;color:#9ea9b8}
#s-login .card{max-width:680px;margin:16px auto;background:linear-gradient(145deg,rgba(21,28,39,.97),rgba(7,10,16,.98));border:1px solid #ffffff22;box-shadow:0 20px 55px #0008}
#s-login .soc{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin:8px 0;border-radius:12px}
button,select,input{touch-action:manipulation}
button{min-height:46px}
/* Cinematic first-entry screen; existing authentication still runs underneath. */
#dlx-entry{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;justify-content:space-between;align-items:center;overflow:hidden;padding:calc(env(safe-area-inset-top) + 10vh) 22px calc(env(safe-area-inset-bottom) + 7vh);background:linear-gradient(180deg,rgba(2,4,8,.3),rgba(2,4,8,.55) 48%,#030508 100%),url('cover-v38.jpg') center/cover no-repeat,#05070b;opacity:1;transition:opacity .6s ease,visibility .6s ease}
#dlx-entry:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 42%,transparent 0,rgba(0,0,0,.12) 35%,rgba(0,0,0,.78) 100%);pointer-events:none}
#dlx-entry .entry-noise{position:absolute;inset:0;opacity:.13;pointer-events:none;background-image:linear-gradient(transparent 49%,#ffffff18 50%,transparent 51%);background-size:100% 4px}
.entry-brand,.entry-bottom{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center}
.entry-kicker,.entry-season{font-size:10px;font-weight:800;letter-spacing:.32em;color:#f1d69b;text-shadow:0 2px 10px #000}
.entry-brand strong{margin-top:18px;font:900 clamp(76px,22vw,150px)/.83 Georgia,serif;letter-spacing:-.065em;color:#f0d28c;text-shadow:0 5px 0 #72501e,0 12px 35px #000;}
.entry-brand>span:last-child{margin:14px 0 0 .55em;font-size:clamp(20px,6vw,36px);font-weight:800;letter-spacing:.55em;color:#fff;text-shadow:0 4px 16px #000}
.entry-bottom{width:min(100%,420px);gap:14px}
#dlx-enter{width:100%;min-height:58px;border:1px solid #fff0bd;border-radius:999px;background:linear-gradient(135deg,#fff0bd,#e7bd68 55%,#9e702e);color:#171108;font-size:15px;font-weight:900;letter-spacing:.14em;box-shadow:0 10px 34px #0009,0 0 30px #e8c37a30}
#dlx-enter span{margin-left:10px;font-size:20px}
.entry-bottom small{color:#e8dfcd;font-size:11px;letter-spacing:.12em;text-shadow:0 2px 8px #000}
#dlx-entry.leaving{opacity:0;visibility:hidden;pointer-events:none}
@media(min-width:760px){#s-lobby .menu{grid-template-columns:repeat(4,minmax(0,1fr))}#s-lobby .big{min-height:70px}#s-lobby .hero{max-width:1040px}}
@media(max-width:420px){main{padding:10px 10px 26px}#s-lobby .hero{border-radius:13px}#s-lobby .menu{gap:8px}#s-lobby .big{min-height:58px;padding:10px 6px;font-size:13px}#s-lobby .tiny{font-size:10px}}
@media(prefers-reduced-motion:reduce){#dlx-entry{transition:none}#s-lobby .big{transition:none}}