:root{color-scheme:dark;font-family:Tahoma,Verdana,Arial,sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:radial-gradient(circle at 50% 20%,#1c4d7e,#07172e 68%);color:#fff}button,input,select{font:inherit}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}main{height:100%;display:grid;place-items:center;padding:12px}.lobby{width:min(100%,720px);aspect-ratio:4/3;display:grid;place-items:end center;padding:26px;background:radial-gradient(circle at 50% 15%,#fff8d7,#dfb14a 72%,#9a5c12);border:7px solid #efa810;border-radius:16px;box-shadow:0 25px 80px #000b,inset 0 0 0 2px #ffe57a}.lobby-card{position:relative;width:min(410px,100%);padding:17px 22px;background:#f5f0e8f2;color:#4a3a20;border:3px solid #b5a277;border-radius:16px;box-shadow:0 10px 35px #5d4c3077,inset 0 1px #fff;text-align:center}.language-select{position:absolute;right:10px;top:8px;width:auto!important;padding:3px 5px!important;border-width:1px!important;font-size:.64rem}.kicker{margin:0 0 11px;color:#b95b0a;font-weight:900;letter-spacing:.17em;font-size:.76rem}.lobby label{display:block;text-align:left;font-size:.72rem;font-weight:bold;text-transform:uppercase;margin-bottom:5px}.lobby input,.lobby select{width:100%;padding:9px 12px;border:2px solid #ad9b75;border-radius:8px;background:#fffdf8;color:#352812;outline:none}.lobby input:focus,.lobby select:focus{border-color:#157cca;box-shadow:0 0 0 3px #157cca33}.choices{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.choices label{margin:0}.choices select{display:block;margin-top:5px}.lobby button,.local-button{border:0;border-radius:8px;padding:9px 16px;color:#fff;font-weight:900;text-shadow:0 1px #0007;background:linear-gradient(#f7b936,#c66a04);box-shadow:inset 0 2px #fff6,inset 0 -3px #0002,0 3px #70400b}.lobby #solo{width:100%;margin-top:10px;background:linear-gradient(#f7b936,#c66a04)}.lobby .primary{width:100%;margin:9px 0 11px;background:linear-gradient(#36a8f5,#075cac);box-shadow:inset 0 2px #fff6,inset 0 -3px #0002,0 3px #043b74}.join{display:grid;grid-template-columns:1fr auto;gap:8px}.join input{text-align:center;text-transform:uppercase;letter-spacing:.14em}.lobby .local-button{display:block;margin-top:11px;color:#fff;text-decoration:none;background:linear-gradient(#62ac55,#287933);font-size:.78rem}.legal-note{margin:13px 0 0;color:#77694f;font-size:.58rem;line-height:1.35;font-weight:normal;text-align:center}.stage{width:min(calc(100vw - 24px),calc((100vh - 80px)*4/3))}.bar{height:42px;display:flex;align-items:center;gap:9px;padding:0 4px;color:#d9e6f7;font-size:.78rem}.bar>span{margin-right:auto}.bar i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#e39a17;box-shadow:0 0 8px currentColor}.bar .online i{background:#4ed46d}.bar button{border:1px solid #405675;border-radius:6px;background:#122943;color:#e7eef8;padding:6px 10px}.bar b{color:#ffd35a;letter-spacing:.09em;margin-left:4px}#player-frame{width:100%;aspect-ratio:4/3;background:#000;border:1px solid #415776;box-shadow:0 18px 70px #000c}ruffle-player{display:block;width:100%;height:100%}.peer-left{height:100%;display:grid;place-content:center;justify-items:center;gap:12px;background:radial-gradient(circle,#204e7c,#07172e 70%);text-align:center;color:#dce9f8}.peer-left strong{font-size:clamp(1.4rem,4vw,2.5rem);color:#ffd35a}.peer-left span{color:#aebed2}.peer-left button{margin-top:8px;border:1px solid #6891bf;border-radius:8px;background:#157cca;color:#fff;padding:10px 18px;font-weight:bold}#status{height:20px;text-align:center;margin:7px 0 0;color:#aebed2;font-size:.75rem}@media(max-width:650px){main{padding:4px}.lobby{width:100%;min-height:calc(100vh - 8px);aspect-ratio:auto;padding:105px 10px 12px;border-width:4px}.lobby-card{padding:14px}.stage{width:100%}.bar{height:38px}.bar span{max-width:50%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.legal-note{font-size:.54rem}}
.lobby{width:min(100%,850px);aspect-ratio:16/11;place-items:center;padding:26px}.lobby-layout{width:min(700px,100%);display:grid;grid-template-columns:minmax(0,410px) minmax(190px,250px);gap:18px;align-items:end}.lobby-card{width:100%}.public-toggle{display:flex!important;align-items:center;justify-content:center;gap:8px;margin:10px 0 0!important;text-align:center!important;text-transform:none!important;color:#5d5038}.public-toggle input{width:17px!important;height:17px;margin:0;padding:0;accent-color:#167bc4}.public-panel{align-self:end;padding:16px;border:2px solid #b5a277;border-radius:14px;background:#f5f0e8e8;color:#4a3a20;box-shadow:0 10px 30px #5d4c3055;text-align:left}.public-panel h2{margin:13px 0 9px;font-size:.92rem;color:#875013}.online-indicator{display:flex;align-items:center;gap:7px;font-size:.72rem}.online-indicator i{width:9px;height:9px;border-radius:50%;background:#32b753;box-shadow:0 0 8px #32b753}.public-panel #public-games{display:grid;gap:7px;max-height:190px;overflow:auto}.public-panel #public-games>p{margin:0;color:#786c55;font-size:.68rem;line-height:1.4}.lobby .public-game{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:8px 9px;background:linear-gradient(#fffdf8,#e7dcc4);color:#4a3a20;text-shadow:none;box-shadow:0 2px 5px #5d4c3033;border:1px solid #b7a67d;font-size:.7rem;text-align:left}.public-game span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.public-game b{color:#0868b4;letter-spacing:.08em}
@media(max-width:720px){html,body{height:auto;min-height:100%}main{height:auto;min-height:100vh}.lobby{width:100%;min-height:calc(100vh - 8px);aspect-ratio:auto;padding:70px 10px 18px;border-width:4px}.lobby-layout{grid-template-columns:1fr;width:min(430px,100%);gap:12px}.lobby-card{padding:14px}.public-panel{width:100%}.public-panel #public-games{max-height:130px}.stage{width:100%}.bar{height:38px}.bar span{max-width:50%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.legal-note{font-size:.54rem}}
