:root{--sky: #7cc4ff;--pearl: #fbf8ff;--gold: #ffcf4a;--gold-deep: #e09a12;--violet: #5b2ca8;--violet-deep: #24104d;--ink: #1e1438}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#24104d;font-family:Fredoka,system-ui,sans-serif;color:var(--pearl);-webkit-user-select:none;user-select:none}#game{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.hidden{display:none!important}button{font-family:inherit;font-weight:600;font-size:15px;border:none;border-radius:14px;padding:10px 16px;cursor:pointer;color:var(--ink);background:var(--pearl);box-shadow:0 4px #b9a8e0;transition:transform .08s}button:hover{transform:translateY(-2px)}button:active{transform:translateY(2px);box-shadow:0 1px #b9a8e0}button.big{font-size:20px;padding:14px 22px;width:100%}button.gold{background:linear-gradient(#ffe48a,var(--gold));box-shadow:0 5px 0 var(--gold-deep)}.screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;padding:32px;gap:24px}#menu{justify-content:space-between;background:linear-gradient(90deg,rgba(36,16,77,.85),rgba(36,16,77,.2) 55%,transparent)}.menu-left{width:min(420px,100%);display:flex;flex-direction:column;gap:12px}.logo{font-size:58px;margin:0;line-height:1;color:var(--pearl);text-shadow:0 4px 0 var(--violet),0 0 24px #ffe48a;letter-spacing:-1px}.logo span{color:var(--gold)}.tagline{margin:0 0 8px;opacity:.9}.hint{font-size:13px;opacity:.75;margin:0}.name-row{display:flex;align-items:center;gap:10px}.name-row input{flex:1;font:inherit;font-size:16px;padding:8px 12px;border-radius:10px;border:2px solid var(--gold);background:#ffffff1f;color:var(--pearl)}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.menu-row{display:flex;gap:8px;flex-wrap:wrap}.menu-right{display:flex;align-items:flex-end}.profile-card{background:#24104db3;border:2px solid rgba(255,207,74,.5);border-radius:18px;padding:14px 18px;min-width:230px}.stars{font-size:22px;font-weight:700;color:var(--gold)}.title-badge{margin-top:4px;font-weight:600}.stats{font-size:13px;opacity:.8;margin-top:4px}#locker,#help,#results,#online{align-items:center;justify-content:center;background:#14083099}.locker-panel{background:linear-gradient(#3a1d78,#24104d);border:3px solid var(--gold);border-radius:22px;padding:22px;width:min(640px,100%);max-height:100%;overflow:auto;display:flex;flex-direction:column;gap:12px}.locker-panel h2{margin:0;color:var(--gold);font-size:30px}.locker-panel h3{margin:6px 0 0;color:var(--gold)}#locker{justify-content:flex-start;background:linear-gradient(90deg,rgba(20,8,48,.85),transparent 70%)}#locker .locker-panel{width:min(460px,100%)}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tabs button{font-size:13px;padding:6px 10px}.tabs button.active{background:var(--gold)}.items{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}.item{background:#ffffff14;border:2px solid transparent;border-radius:12px;padding:8px;cursor:pointer;text-align:center;font-size:14px}.item.equipped{border-color:var(--gold);background:#ffcf4a2e}.item.locked{opacity:.55}.item .price{font-size:12px;color:var(--gold)}.swatch{width:26px;height:26px;border-radius:50%;margin:0 auto 4px;border:2px solid #fff}.keys{border-collapse:collapse}.keys td{padding:4px 10px;border-bottom:1px solid rgba(255,255,255,.1)}.keys td:first-child{color:var(--gold);font-weight:600}.ph{display:flex;gap:10px;align-items:baseline;padding:3px 0;font-size:14px}.ph b{color:var(--gold);min-width:20px}.ph i{opacity:.7}#hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}#roundInfo{position:absolute;top:14px;left:16px;background:#24104da6;padding:8px 14px;border-radius:14px}#roundName{font-weight:700;color:var(--gold);font-size:18px}#roundGoal{font-size:13px;opacity:.9}#timer{position:absolute;top:14px;left:50%;transform:translate(-50%);font-size:30px;font-weight:700;text-shadow:0 3px 0 var(--violet)}#counter{position:absolute;top:14px;right:16px;background:#24104da6;padding:8px 14px;border-radius:14px;font-weight:700;font-size:18px}#banner{position:absolute;top:28%;width:100%;text-align:center;font-size:54px;font-weight:700;color:var(--pearl);text-shadow:0 5px 0 var(--violet),0 0 30px var(--gold);opacity:0;transition:opacity .25s,transform .25s;transform:scale(.8);padding:0 16px}#banner.show{opacity:1;transform:scale(1)}#subBanner{position:absolute;top:calc(28% + 70px);width:100%;text-align:center;font-size:22px;opacity:0;transition:opacity .25s;text-shadow:0 2px 0 var(--violet);padding:0 16px}#subBanner.show{opacity:1}#chant{position:absolute;bottom:140px;width:100%;text-align:center;font-size:26px;font-style:italic;font-weight:600;color:var(--gold);text-shadow:0 0 14px #fff8;opacity:0;transition:opacity .2s}#chant.show{opacity:1}#feed{position:absolute;top:116px;right:16px;display:flex;flex-direction:column;gap:4px;align-items:flex-end;font-size:14px}#feed div{background:#24104db3;padding:4px 10px;border-radius:10px;animation:fadein .2s}#favor{position:absolute;top:78px;left:16px;background:linear-gradient(#ffe48a,var(--gold));color:var(--ink);padding:6px 12px;border-radius:12px;font-weight:700}@keyframes fadein{0%{opacity:0;transform:translate(20px)}}#powerBar{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:auto}#energy{position:relative;width:420px;max-width:90vw;height:16px;background:#24104dbf;border-radius:10px;overflow:hidden;border:2px solid rgba(255,255,255,.4)}#energyFill{height:100%;width:50%;background:linear-gradient(90deg,#8f5bff,#7cc4ff,var(--gold));transition:width .1s}#energyText{position:absolute;top:0;right:0;bottom:0;left:0;text-align:center;font-size:11px;line-height:13px;font-weight:700}#powers{display:flex;gap:6px}.pw{position:relative;width:66px;height:66px;border-radius:14px;background:#24104dcc;border:2px solid rgba(255,255,255,.35);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:26px;cursor:pointer;overflow:hidden}.pw .k{position:absolute;top:2px;left:5px;font-size:11px;font-weight:700}.pw .c{position:absolute;bottom:2px;right:5px;font-size:10px;color:var(--gold)}.pw .cd{position:absolute;left:0;right:0;bottom:0;background:#0009}.pw.ready{border-color:var(--gold);box-shadow:0 0 10px var(--gold)}.pw.poor{filter:grayscale(.8)}.pw.active{background:#ffcf4a66}#spectate{position:absolute;bottom:120px;left:50%;transform:translate(-50%);background:#24104dcc;padding:10px 16px;border-radius:14px;display:flex;gap:14px;align-items:center;pointer-events:auto}#results ol{margin:0;padding-left:26px;max-height:40vh;overflow:auto;columns:2}#results li{padding:1px 0}#results li.me{color:var(--gold);font-weight:700}#results li.out{opacity:.5;text-decoration:line-through}#resReward{color:var(--gold);font-weight:700;font-size:18px}#flash{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;pointer-events:none;transition:opacity .4s}@media (max-width: 760px){.screen{padding:16px;flex-direction:column;overflow:auto}.logo{font-size:42px}#banner{font-size:34px}.pw{width:50px;height:50px;font-size:20px}#results ol{columns:1}}button.online{background:linear-gradient(#cfe8ff,#7cc4ff);box-shadow:0 5px #3a7fc4}.join-row{display:flex;gap:8px}.join-row input,#online select{flex:1;font:inherit;font-size:20px;letter-spacing:4px;text-transform:uppercase;padding:8px 12px;border-radius:10px;border:2px solid var(--gold);background:#ffffff1f;color:var(--pearl)}#online select{font-size:15px;letter-spacing:0;text-transform:none;width:100%;margin-top:4px}#online select option{color:var(--ink)}#online label{display:block;font-size:14px;margin-bottom:8px}#online label.check{display:flex;gap:8px;align-items:center}.code-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.lobby-code{font-size:36px;font-weight:700;letter-spacing:6px;color:var(--gold)}.lobby-players{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}.lobby-players li{background:#ffffff14;border-radius:10px;padding:6px 10px;display:flex;justify-content:space-between;align-items:center;gap:6px}.lobby-players li.me{border:2px solid var(--gold)}.lobby-players li button{padding:2px 8px;font-size:12px}#onlineStatus.err{color:#ff9a9a;opacity:1}#netBadge{position:absolute;bottom:16px;left:16px;background:#24104da6;padding:6px 10px;border-radius:10px;font-size:13px}#netBadge.bad{color:#ffb0a0}#rank{position:absolute;top:64px;right:16px;font-size:40px;font-weight:700;color:#ffb0a0;text-shadow:0 3px 0 var(--violet);line-height:1}#rank.safe{color:#9dffb8}#rank sup{font-size:18px}#rank small{font-size:15px;margin-left:4px;color:var(--pearl);opacity:.8}
