:root{--pink: #9a55ff;--pink-dk: #6f2fd8;--yellow: #ffb340;--yellow-dk: #e08a00;--cyan: #2bd9c4;--purple: #38cfe8;--mint: #3df0a8;--ink: #2c2247;--paper: #fdfaff;--sky1: #45d3c2;--sky2: #a9ece2}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{width:100%;height:100%;overflow:hidden}body{background:var(--sky1);color:var(--ink);font-family:"Baloo 2",Segoe UI,system-ui,-apple-system,sans-serif;-webkit-user-select:none;user-select:none}#game{display:block;width:100%;height:100%}.hidden{display:none!important}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#35c9b7,#8fe6d9 45%,#ffe3c2);z-index:30;overflow:hidden}.stage{position:relative;z-index:3;display:flex;align-items:center;gap:26px;padding:18px;max-width:1040px;width:100%;max-height:100vh}.stage .leftCol{flex:0 0 420px;max-width:92vw;align-self:center}.stage .rightCol{flex:1 1 380px;min-width:300px;align-self:center;display:flex;flex-direction:column;gap:12px}.overlay:before{content:"";position:absolute;left:50%;top:50%;width:240vmax;height:240vmax;transform:translate(-50%,-50%);background:repeating-conic-gradient(#ffffff29,#ffffff29 9deg,#fff0 9deg,#fff0 18deg);animation:rays 60s linear infinite;pointer-events:none}@keyframes rays{to{transform:translate(-50%,-50%) rotate(360deg)}}.overlay:after{content:"";position:absolute;inset:auto 0 -18vh 0;height:44vh;background:radial-gradient(60% 100% at 50% 100%,rgba(154,85,255,.35),transparent 70%);pointer-events:none}#menuHexes{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}#menuHexes span{position:absolute;bottom:-12vh;color:var(--pink);opacity:0;text-shadow:0 3px 0 rgba(0,0,0,.08);animation:hexFloat linear infinite}#menuHexes span:nth-child(2n){color:var(--yellow)}#menuHexes span:nth-child(3n){color:var(--cyan)}#menuHexes span:nth-child(5n){color:var(--mint)}@keyframes hexFloat{0%{transform:translateY(0) rotate(0);opacity:0}12%{opacity:.85}85%{opacity:.6}to{transform:translateY(-118vh) rotate(220deg);opacity:0}}#heroBean{position:absolute;right:max(2vw,calc(50% - 620px));bottom:0;height:min(72vh,640px);filter:drop-shadow(0 18px 30px rgba(44,34,71,.35));animation:beanBob 3.2s ease-in-out infinite;pointer-events:none;z-index:2}@keyframes beanBob{0%,to{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-18px) rotate(2deg)}}.buddyBean{position:absolute;pointer-events:none;filter:drop-shadow(0 14px 24px rgba(44,34,71,.3));z-index:1}#beanCyan{left:max(2vw,calc(50% - 600px));bottom:4vh;height:min(46vh,400px);animation:beanHop 2.4s ease-in-out infinite}#beanYellow{left:max(13vw,calc(50% - 430px));bottom:-2vh;height:min(30vh,250px);z-index:4;animation:beanWobble 3.6s ease-in-out infinite}@keyframes beanHop{0%,to{transform:translateY(0) rotate(4deg)}45%{transform:translateY(-34px) rotate(-3deg)}}@keyframes beanWobble{0%,to{transform:translateY(0) rotate(-9deg)}50%{transform:translateY(-10px) rotate(9deg)}}@media (max-width: 1100px){.buddyBean{display:none}}@media (max-width: 860px){.overlay{overflow:auto}.stage{flex-direction:column;align-items:center;gap:16px;padding:16px;max-height:none}.stage .leftCol{flex:none;width:min(440px,94vw)}.stage .rightCol{flex:none;width:min(440px,94vw);order:-1}.previewWrap{aspect-ratio:1 / 1;max-height:46vh}}#ca{position:absolute;top:14px;left:16px;transform:rotate(-.6deg);z-index:40;display:flex;align-items:center;gap:8px;max-width:min(48vw,460px);padding:6px 14px;background:var(--paper);border:3px solid var(--ink);border-radius:999px;box-shadow:0 5px #2c224747;font-weight:800;font-size:13px;cursor:pointer}#ca:hover{transform:rotate(-.6deg) scale(1.04)}#ca .caLabel{flex:none;padding:1px 8px;background:var(--pink);color:#fff;border-radius:999px;font-size:11px;letter-spacing:1px}#ca #caText{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;letter-spacing:.3px}.panel{position:relative;z-index:3;background:var(--paper);border:5px solid var(--ink);border-radius:28px;padding:20px 30px 22px;width:100%;text-align:center;box-shadow:0 14px #2c224747,0 30px 60px #2e1e7840;transform:rotate(-1.2deg)}.hexLogo{font-size:42px;line-height:1;color:var(--pink);text-shadow:0 5px 0 rgba(44,34,71,.2);animation:logoBob 2.6s ease-in-out infinite}@keyframes logoBob{0%,to{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-9px) rotate(6deg)}}.title{font-size:46px;font-weight:800;letter-spacing:2px;margin:4px 0 2px;background:linear-gradient(180deg,var(--pink) 20%,var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2px var(--ink);filter:drop-shadow(0 4px 0 rgba(44,34,71,.22));transform:rotate(.8deg)}.subtitle{margin:-2px 0 6px;font-size:17px;font-weight:800;letter-spacing:5px;text-transform:uppercase;color:var(--cyan);-webkit-text-stroke:1px var(--ink);text-shadow:0 2px 0 rgba(44,34,71,.18)}.tag{color:#544a75;margin:8px 0 16px;font-size:14.5px;line-height:1.4;font-weight:600}.tag b{color:var(--pink-dk)}.fieldLabel{display:block;text-align:left;margin:0 4px 4px;font-size:11.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:#7466a3}.fieldLabel .opt{color:#a89ccc;font-weight:700;text-transform:none;letter-spacing:0}#name,#wallet{width:100%;padding:12px 14px;border:4px solid var(--ink);border-radius:999px;background:#fff;color:var(--ink);font-size:15px;font-weight:700;font-family:inherit;margin-bottom:12px;text-align:center}#name::placeholder,#wallet::placeholder{color:#a89ccc}#name:focus,#wallet:focus{outline:none;border-color:var(--cyan)}#wallet{font-size:13px;letter-spacing:.2px}#wallet.good{border-color:var(--mint)}#wallet.bad{border-color:var(--pink)}.walletNote{text-align:left;margin:-8px 4px 10px;font-size:11.5px;font-weight:700;min-height:14px}.walletNote.ok{color:#16a06a}.walletNote.err{color:var(--pink-dk)}.prize{display:flex;align-items:center;justify-content:center;gap:8px;margin:2px 0 16px;padding:9px 12px;background:linear-gradient(180deg,#fff6d8,#ffe9a8);border:3px solid var(--ink);border-radius:14px;font-weight:800;font-size:15px;color:var(--ink);box-shadow:0 4px 0 var(--yellow-dk)}.prize b{color:var(--pink-dk)}.prizeCoin{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c9f7e2,#14f195 60%,#0fae6b);border:2px solid var(--ink);color:#0a3b28;font-weight:900;font-size:14px}.previewWrap{position:relative;width:100%;aspect-ratio:4 / 5;max-height:54vh;background:radial-gradient(120% 100% at 50% 18%,#fff,#e6dcff 55%,#cdbcff);border:5px solid var(--ink);border-radius:26px;overflow:hidden;box-shadow:0 14px #2c224747,0 30px 60px #2e1e7840;transform:rotate(1deg)}#preview{display:block;width:100%;height:100%}.previewTag{position:absolute;left:50%;bottom:12px;transform:translate(-50%);background:var(--paper);border:3px solid var(--ink);border-radius:999px;padding:3px 14px;font-size:12.5px;font-weight:800;color:var(--ink);box-shadow:0 3px #2c224738}.customizeHead{text-align:center;font-weight:800;font-size:14px;letter-spacing:1px;text-transform:uppercase;color:#fff;-webkit-text-stroke:1.2px var(--ink);text-shadow:0 2px 0 rgba(44,34,71,.3)}button{width:100%;padding:15px;border:4px solid var(--ink);border-radius:999px;background:linear-gradient(180deg,#b98aff,var(--pink));color:#fff;font-family:inherit;font-weight:800;font-size:20px;letter-spacing:3px;text-shadow:0 2px 0 rgba(44,34,71,.35);cursor:pointer;box-shadow:0 7px 0 var(--pink-dk);transition:transform .08s ease,box-shadow .08s ease}button:hover{transform:translateY(-2px);box-shadow:0 9px 0 var(--pink-dk)}button:active{transform:translateY(4px);box-shadow:0 2px 0 var(--pink-dk)}#customizer{margin-bottom:12px;display:flex;flex-direction:column;gap:6px}.wearRow{display:flex;flex-wrap:wrap;gap:5px;justify-content:center}.wearChip{width:auto;padding:5px 10px;font-size:12px;font-weight:800;letter-spacing:.3px;border:2.5px solid var(--ink);border-radius:999px;background:#fff;color:var(--ink);cursor:pointer;box-shadow:0 3px #2c22472e;transition:transform .06s ease,box-shadow .06s ease}.wearChip:hover{transform:translateY(-1px)}.wearChip:active{transform:translateY(2px);box-shadow:0 1px #2c22472e}.wearChip.on{background:var(--yellow);box-shadow:0 3px 0 var(--yellow-dk)}.how{list-style:none;margin-top:12px;font-size:12.5px;color:#544a75;font-weight:600}.how li{margin:5px 0}.how b{color:var(--ink);background:var(--yellow);border:2px solid var(--ink);border-radius:8px;padding:0 7px 1px;box-shadow:0 2px 0 var(--yellow-dk);display:inline-block;font-size:12px}#hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:20}#phaseBar{position:absolute;top:14px;left:50%;transform:translate(-50%) rotate(-.6deg);display:inline-flex;align-items:stretch;overflow:hidden;background:var(--paper);border:4px solid var(--ink);border-radius:999px;box-shadow:0 6px #2c224740;font-weight:800}.pbHex{display:inline-flex;align-items:center;padding:0 12px;color:var(--pink);font-size:19px;border-right:3px solid var(--ink);background:#f0e8ff}#phaseName{display:inline-flex;align-items:center;padding:8px 16px;color:var(--ink);letter-spacing:3px;font-size:15px}#timer{display:inline-flex;align-items:center;justify-content:center;padding:8px 16px;min-width:64px;background:var(--yellow);border-left:3px solid var(--ink);color:var(--ink);font-weight:800;font-variant-numeric:tabular-nums;font-size:15px}#objective{position:absolute;top:72px;left:50%;transform:translate(-50%);text-align:center;max-width:min(80vw,620px)}#objTitle{font-size:24px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#fff;-webkit-text-stroke:1.5px var(--ink);text-shadow:0 3px 0 rgba(44,34,71,.35)}#objSub{display:inline-block;margin-top:5px;font-size:13.5px;font-weight:700;color:var(--ink);background:#fffaf4e6;border:2.5px solid var(--ink);border-radius:999px;padding:3px 14px;box-shadow:0 3px #2c224738}#feed{position:absolute;left:16px;bottom:16px;display:flex;flex-direction:column-reverse;gap:6px;max-width:380px}.feedItem{background:#fffaf4f0;border:3px solid var(--ink);border-left:8px solid var(--pink);border-radius:12px;padding:6px 12px;font-size:13px;font-weight:700;color:var(--ink);box-shadow:0 4px #2c22472e;animation:feedIn .26s cubic-bezier(.2,.8,.2,1)}.feedItem.win{border-left-color:var(--yellow);background:#fff6d8}@keyframes feedIn{0%{opacity:0;transform:translate(-14px) rotate(-2deg)}to{opacity:1;transform:none}}#scoreboard{position:absolute;right:16px;top:16px;min-width:215px;padding:0;overflow:hidden;background:#fffaf4f0;border:4px solid var(--ink);border-radius:18px;box-shadow:0 6px #2c224740;font-size:13.5px;transform:rotate(.5deg)}.sbHead{padding:8px 14px;font-weight:800;letter-spacing:1.5px;color:var(--ink);text-transform:uppercase;font-size:12.5px;background:linear-gradient(90deg,var(--yellow),#ffe27d);border-bottom:3px solid var(--ink)}.sbRow{display:flex;align-items:center;gap:9px;padding:5px 14px;border-bottom:2px solid rgba(44,34,71,.08);font-weight:700}.sbRow:last-child{border-bottom:0}.sbDot{width:14px;height:14px;border-radius:50%;flex:0 0 auto;border:2.5px solid var(--ink)}.sbName{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}.sbTag{font-size:11.5px;color:#7466a3;font-variant-numeric:tabular-nums;font-weight:800}.sbRow.me{background:#f0e8ff;box-shadow:inset 4px 0 0 var(--pink)}.sbRow.dead{opacity:.55}.sbRow.dead .sbName{text-decoration:line-through;text-decoration-color:var(--pink-dk)}#hitflash{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:24;background:radial-gradient(circle at center,#9a55ff00 30%,#9a55ff66);animation:flash .25s ease}@keyframes flash{0%{opacity:1}to{opacity:0}}#banner{position:absolute;top:34%;left:50%;transform:translate(-50%);text-align:center;z-index:25;pointer-events:none;font-size:clamp(44px,8.5vw,80px);font-weight:800;letter-spacing:2px;text-transform:uppercase;background:linear-gradient(180deg,var(--yellow) 25%,var(--pink) 75%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2.5px var(--ink);filter:drop-shadow(0 6px 0 rgba(44,34,71,.3)) drop-shadow(0 14px 26px rgba(44,34,71,.35));animation:bannerPop .45s cubic-bezier(.2,.9,.2,1.4)}#banner .sub{display:block;margin-top:10px;letter-spacing:1px;font-size:18px;font-weight:800;color:#fff;-webkit-text-fill-color:#fff;-webkit-text-stroke:0;text-shadow:0 2px 0 var(--ink),0 4px 10px rgba(44,34,71,.5);filter:none}@keyframes bannerPop{0%{transform:translate(-50%) scale(.55) rotate(-4deg);opacity:0}65%{transform:translate(-50%) scale(1.06) rotate(1deg);opacity:1}to{transform:translate(-50%) scale(1) rotate(0)}}@media (prefers-reduced-motion: reduce){.overlay:before,.feedItem,#banner,.hexLogo,#heroBean,.buddyBean{animation:none!important}}