@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@700;800&display=swap";:root{color:#fff;background:#6f4a46;font-family:Fredoka,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#6f4a46;min-height:100vh;margin:0;overflow-x:hidden}main{width:min(100vw,1920px);margin:0 auto}.panel{box-shadow:none;background:0 0;border:0;margin:0;padding:0}.hero{background:#b85b49;grid-template-columns:minmax(430px,.9fr) minmax(540px,1.1fr);align-items:center;gap:28px;min-height:100vh;padding:4vh 5vw 4vh 4vw;display:grid;position:relative;overflow:hidden}.hero:before{content:"";opacity:.9;background:#fff8cf;border:18px solid #f7b43a;border-radius:120px;position:absolute;inset:-30% -35% 55% -20%;transform:skew(-14deg)rotate(-2deg)}.hero:after{content:"";opacity:.55;background:#8b4a3f;border-radius:50% 50% 0 0/60px 60px 0 0;position:absolute;inset:62% -20% -25% -25%}.heroLeft{z-index:1;justify-items:start;gap:14px;min-width:0;display:grid;position:relative}.heroLeft h1{margin:.1rem 0 .3rem}.heroRight{z-index:2;justify-items:end;gap:16px;min-width:0;display:grid;position:relative}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:#f97316;margin:0;font-size:clamp(1.1rem,2vw,2rem);font-weight:900}.sub{color:#6f4a46;max-width:680px;margin:.5rem 0 0;font-size:clamp(1rem,1.5vw,1.55rem)}h1{color:#fff8cf;text-shadow:0 8px #863a32,0 13px #6e2f2a;letter-spacing:-.06em;margin:.2rem 0;font-size:clamp(4rem,9vw,8.2rem);line-height:.72}.arenaWrap{filter:drop-shadow(0 26px 24px #3c140a73);width:min(560px,100%)}.arenaPreview{transform-origin:50% 80%;border-radius:26px;width:100%;height:auto;transform:perspective(900px)rotateX(26deg)}.powerTiles{flex-wrap:wrap;gap:10px;max-width:560px;display:flex}.powerTile{color:#1f1300;text-transform:uppercase;letter-spacing:.02em;border:3px solid #ffffffa6;border-radius:999px;align-items:center;gap:7px;padding:8px 14px;font-size:.85rem;font-weight:900;display:flex;box-shadow:0 4px #3c140a59}.powerIcon{font-size:1rem}.lobbyCard{background:#76524f;border:8px solid #f8bd45;border-radius:24px;gap:12px;width:min(100%,620px);padding:24px;display:grid;position:relative;overflow:visible;box-shadow:0 12px #5a3733,0 24px 40px #280c0866}.lobbyCard h2{color:#fff8cf;letter-spacing:-.02em;text-transform:uppercase;margin:0;font-size:1.6rem}.fieldLabel{color:#f8bd45;text-transform:uppercase;letter-spacing:.08em;margin:2px 0 0;font-size:.8rem;font-weight:900}.mascotGrid{grid-template-columns:repeat(5,minmax(76px,1fr));gap:8px;display:grid}.mascot{cursor:pointer;text-transform:none;border:4px solid #ffffff59;border-radius:14px;justify-items:center;gap:2px;min-width:0;padding:8px 4px;font-weight:900;transition:transform 80ms;display:grid;box-shadow:0 4px #3c140a59}.mascot:hover{transform:translateY(-2px)}.mascot.selected{border-color:#fff8cf;outline:4px solid #f97316;transform:translateY(-2px)scale(1.04)}.mEmoji{font-size:1.5rem;line-height:1}.mName{text-align:center;font-size:.62rem;line-height:1.1}.lobbySplit{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;gap:14px;display:grid}.lobbyCol{align-content:start;gap:10px;display:grid}.lobbyDivider{color:#f8bd45;text-transform:uppercase;place-items:center;padding:0 2px;font-weight:900;display:grid;position:relative}.lobbyDivider:before{content:"";background:#8b5b51;border-radius:2px;width:3px;position:absolute;top:0;bottom:0;left:50%}.lobbyDivider span{background:#76524f;padding:6px 2px;position:relative}.codeInput{letter-spacing:.35em;text-align:center;font-size:1.15rem}.lobbyError{color:#fff8cf;background:#b91c1c;border-radius:12px;margin:0;padding:10px 14px;font-weight:900}.gameShell{background:#6f4a46;place-items:center;width:100vw;height:100vh;display:grid;position:relative;overflow:hidden}.field{background:#67cce0;width:min(100vw,177.777vh);height:auto;display:block}.threeField{height:100vh}.gameHud{z-index:5;pointer-events:none;gap:8px;width:min(1080px,100vw - 28px);display:grid;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.gameHud>*{pointer-events:auto}.domScore{text-align:center;background:#6f4a46e6;border:5px solid #f8bd45;border-radius:18px;grid-template-columns:auto 70px 1fr 70px auto;align-items:center;gap:12px;padding:8px 14px;display:grid;box-shadow:0 7px #3c140a66}.domScore span{color:#fff8cf;font-size:2.1rem}.domScore small{color:#f8bd45}.actions,.inventory{background:#6f4a46cc;border-radius:14px;flex-wrap:wrap;justify-content:center;gap:8px;padding:8px;display:flex}.inventory{color:#fff8cf;align-items:center}.inventory b{color:#f8bd45;margin-right:6px}.hint small{color:#fff8cf}button,select,input{font:inherit;color:#6f4a46;background:#fff8cf;border:4px solid #f8bd45;border-radius:12px;padding:10px 14px;font-weight:900;box-shadow:0 4px #9b5144}button{cursor:pointer;text-transform:uppercase}button:hover{filter:brightness(1.05);transform:translateY(-1px)}button:disabled{filter:grayscale();opacity:.55;cursor:not-allowed}.selected,button.primary{color:#fff8cf;background:#f97316}.error{z-index:8;color:#fff8cf;background:#b91c1c;border-radius:12px;padding:10px 14px;font-weight:900;position:absolute;top:72px;right:18px}.roomCode{z-index:6;background:#6f4a46e6;border:5px solid #f8bd45;border-radius:16px;align-items:center;gap:10px;padding:8px 12px;display:flex;position:absolute;top:14px;left:14px;box-shadow:0 6px #3c140a66}.roomCodeLabel{color:#f8bd45;text-transform:uppercase;letter-spacing:.1em;font-size:.75rem;font-weight:900}.roomCodeValue{color:#fff8cf;letter-spacing:.24em;font-size:1.5rem;font-weight:900}.roomCode button{border-width:3px;padding:6px 10px;font-size:.7rem;box-shadow:0 3px #9b5144}@media (width<=1100px){.hero{grid-template-columns:1fr;gap:18px;overflow:auto}.heroRight{justify-items:start;max-width:720px}.lobbyCard{width:100%}}@media (width<=900px){.roomCode{flex-wrap:wrap;max-width:60vw}.roomCodeValue{font-size:1.1rem}.domScore{grid-template-columns:auto 42px 1fr 42px auto;font-size:.75rem}.domScore span{font-size:1.4rem}.roomPanel{width:230px;font-size:.82rem;top:76px}.miniMascots{grid-template-columns:repeat(3,1fr)}}@media (width<=640px){.hero{padding:24px}.mascotGrid{grid-template-columns:repeat(2,1fr)}.lobbySplit{grid-template-columns:1fr}.lobbyDivider:before{display:none}.powerTile{font-size:.72rem}.roomCode{max-width:92vw}.gameHud{bottom:8px}.actions,.inventory{font-size:.75rem}}.lobbyMascotPreview{grid-template-columns:1fr 1fr;gap:10px;display:grid}.teamPreviewCard{border:4px solid #ffffff8c;border-radius:16px;gap:2px;padding:10px 12px;display:grid;box-shadow:0 5px #3c140a59}.teamPreviewCard span{text-transform:uppercase;letter-spacing:.08em;font-size:.7rem}.teamPreviewCard b{font-size:.95rem}.roomPanel{z-index:5;background:#6f4a46e6;border:5px solid #f8bd45;border-radius:18px;gap:10px;width:270px;padding:10px;display:grid;position:absolute;top:88px;left:14px;box-shadow:0 6px #3c140a66}.roomPanel>b{color:#f8bd45;text-transform:uppercase;letter-spacing:.08em}.sidePreview{background:#fff8cf1a;border:4px solid #f8bd45;border-radius:14px;gap:7px;padding:8px;display:grid}.sideHeader{justify-content:space-between;align-items:center;gap:8px;display:flex}.sideHeader span{color:#f8bd45;font-size:.7rem}.sideHeader strong{color:#fff8cf;text-align:right}.miniMascots{grid-template-columns:repeat(5,1fr);gap:5px;display:grid}.miniMascots button{border-width:2px;border-radius:8px;padding:4px;box-shadow:0 2px #9b5144}.playerPreview{flex-wrap:wrap;gap:5px;display:flex}.playerPreview span{color:#6f4a46;background:#fff8cf;border-radius:999px;padding:3px 7px;font-size:.75rem}.playerPreview .you{color:#fff8cf;background:#f97316}.cheat{color:#fff8cf;background:#b91c1c}.targetPicker select{padding:6px 10px}.hudToggle{z-index:7;border-width:3px;padding:8px 12px;font-size:.72rem;position:absolute;bottom:14px;right:14px;box-shadow:0 3px #9b5144}.cheatPanel{background:#7f1d1dcc;border:3px solid #b91c1c}.cheatPanel .cheatWarn{text-align:center;color:#fecaca;flex-basis:100%;font-weight:900}.targetName{color:#083b38;text-transform:uppercase;background:#38f0e6;border-radius:999px;padding:3px 10px;font-size:.8rem;font-weight:900}@media (width<=900px){.roomPanel{width:230px;font-size:.82rem;top:76px}.miniMascots{grid-template-columns:repeat(3,1fr)}}