@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Space+Grotesk:wght@400;600;700&display=swap');
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#eef1e8;background-image:linear-gradient(#14222608 1px,transparent 1px),linear-gradient(90deg,#14222608 1px,transparent 1px);background-size:24px 24px;color:#142226;font-family:'Space Grotesk',sans-serif}main{width:min(1120px,calc(100% - 36px));margin:42px auto;display:grid;grid-template-columns:1.42fr .7fr;background:#fbfcf8;border:1px solid #ccd4ca;box-shadow:10px 12px #c8cfc3}.game{padding:30px;border-right:1px solid #d8ded5}header,.logo,.stats,.leader-head,footer{display:flex;align-items:center;justify-content:space-between}.logo{justify-content:start;gap:11px}.logo>b{display:grid;place-items:center;width:39px;height:39px;border-radius:50% 50% 50% 8px;background:#cffb4b;transform:rotate(-30deg);font-size:24px}.logo small,.leader-head small,.overlay small,footer{font:10px 'DM Mono';letter-spacing:1px;color:#778685}h1,h2{margin:2px 0 0;line-height:.9;letter-spacing:-1.5px}h1{font-size:24px}h2{font-size:30px}i{color:#ff4f8c;font-style:normal}header>button{border:1px solid #cbd3c9;border-radius:50%;background:transparent;width:33px;height:33px;font-size:17px}.stats{margin:27px 0 18px;padding:13px 16px;background:#f1f4ed;border:1px solid #e0e5dd;font:10px 'DM Mono';color:#758280}.stats strong{display:block;color:#142226;font-size:21px;margin-top:3px}.arena{position:relative;aspect-ratio:1;background:#142226;box-shadow:8px 8px #c7d0c1}canvas{display:block;width:100%;height:100%}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;background:#0b1d1f91;color:#f6f9ed;backdrop-filter:blur(2px)}.overlay[hidden]{display:none}.overlay h2{font-size:37px;margin:7px 0 12px}.overlay p{max-width:290px;color:#cad5cd;font-size:14px;line-height:1.5;margin:0 0 22px}.overlay button{border:0;background:#cffb4b;padding:13px 17px;font:700 13px 'Space Grotesk';box-shadow:4px 4px #76961c}.overlay button b{margin-left:15px;font-size:17px}.overlay>small:last-child{margin-top:26px;color:#a9b4ad}.legend{display:flex;justify-content:space-between;gap:10px;font:10px 'DM Mono';color:#657573;margin:21px 0 0}.legend span:first-child{color:#93bd25}.legend span:nth-child(2){color:#d35b82}.legend b{color:#142226}aside{min-height:620px;padding:32px 27px 20px;background:#f5f7f1;display:flex;flex-direction:column}.leader-head{align-items:start}.live{color:#667773}.live:first-letter{color:#8fdc3e}ol{padding:0;margin:31px 0;list-style:none;flex:1;counter-reset:rank}li{counter-increment:rank;display:grid;grid-template-columns:30px 1fr auto;border-top:1px solid #dce2d9;padding:13px 2px;font:13px 'DM Mono'}li:before{content:counter(rank,decimal-leading-zero);font-size:10px;color:#9ba7a0}.empty{display:block;color:#7b8986;font-size:10px}.empty:before{display:none}.submit{padding:15px;background:#142226;color:#fff}.submit>small{font:10px 'DM Mono';color:#c5d0c9}.submit div{display:flex;margin-top:8px}.submit input{min-width:0;flex:1;border:0;padding:9px;font:11px 'DM Mono'}.submit button{border:0;background:#cffb4b;font:700 10px 'DM Mono';padding:0 10px}#notice{display:block;color:#ff8eb2;margin-top:7px;min-height:9px}footer{border-top:1px solid #dce2d9;padding-top:16px}footer button{border:0;background:transparent;font:10px 'DM Mono';color:#142226}@media(max-width:760px){main{display:block;width:100%;margin:0}.game{padding:20px;border:0}aside{min-height:420px}.legend{font-size:8px}}