.menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(400px,100%);margin-top:12px}.menu-actions button{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#264966c9;border:1px solid #9fe2f078;border-radius:10px;padding:15px 17px;min-height:51px;font-size:14px;font-weight:800;color:#fff}.menu-actions button:first-child{background:#b5eaf7;color:#12304b;border-color:#c8f4ff}.menu-actions span{font-size:20px;font-weight:400}.overlay .froggy-play{margin-top:14px;font-size:13px}.overlay>small{margin-top:14px}.lobby-rules{margin-bottom:19px}
.room-overlay{position:absolute;inset:0;z-index:9;display:grid;align-items:safe center;padding:28px 34px;overflow:auto;background:linear-gradient(110deg,#10203cfb,#142e4af7 60%,#247d86ed);color:#f3f8ff}.room-overlay:focus{outline:none}.room-shell{width:100%;max-width:1030px;margin:auto;animation:loading-enter .25s ease both}.room-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.room-head h2{font-family:'Barlow Condensed',Impact,sans-serif;font-size:50px;font-style:italic;line-height:1;margin:8px 0 0;letter-spacing:-.5px}.room-head .secondary{background:#ffffff10;border:1px solid #ffffff2f;border-radius:8px;padding:12px 15px;min-height:44px;font-size:14px}.room-head .overline{font-size:12px;letter-spacing:1.4px;color:#b8efff}
.room-entry{max-width:560px;margin:12px auto;padding:30px;border:1px solid #b2dff94d;border-radius:18px;background:#0d1e37a3;box-shadow:0 20px 50px #09172544}.room-entry>p{font-size:16px;line-height:1.6;color:#c7dbed;margin:0 0 22px}.room-entry .play{min-width:0;width:100%;margin:18px 0 0;font-size:16px}.room-entry label{display:block;font-size:14px;font-weight:700;margin-bottom:10px}.room-code-input{display:block;width:100%;min-height:72px;padding:10px 16px;text-align:center;font-family:ui-monospace,monospace;font-size:36px;font-weight:800;letter-spacing:.21em;text-transform:uppercase;background:#071a31;color:#fff;border:2px solid #8cd9e580;border-radius:10px;outline-offset:4px}.room-code-input::placeholder{color:#557e9c}.room-entry small{display:block;margin-top:15px;color:#b0cbe0;font-size:13px;line-height:1.5}
.room-topline{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:19px;align-items:center}.room-code-box{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 20px;border-radius:13px;background:#0c213b;border:1px solid #b1e4fc50}.room-code-box small{font-size:12px;font-weight:800;letter-spacing:1.4px;color:#b9d6ee;display:block}.room-code-box strong{display:block;font-family:ui-monospace,monospace;font-size:34px;letter-spacing:.13em;color:#ffdf68;margin-top:8px;line-height:1.1}.room-copy{background:#274d66;border:1px solid #8bd7ef66;border-radius:8px;padding:11px 13px;min-height:44px;font-size:13px;font-weight:800}.room-summary b{display:block;font-size:19px;color:#fff}.room-summary p{margin:8px 0 0;color:#bbd2e7;line-height:1.45;font-size:14px}.room-seat-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.room-seat-heading h3{font-size:14px;margin:0;font-weight:700}.room-seat-heading span{font-size:12px;color:#bfd5e9}
.room-seats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.room-seat{display:flex;align-items:center;gap:9px;padding:10px;border:1px solid #ffffff25;border-radius:9px;background:#193b53;min-width:0}.room-seat>i{flex-shrink:0;display:grid;place-items:center;min-width:29px;height:31px;border-radius:8px;background:var(--seat-color,#426078);color:#142c42;font-size:12px;font-style:normal;font-weight:800;box-shadow:inset 0 -3px #00000016}.room-seat div{min-width:0}.room-seat b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}.room-seat small{display:block;margin-top:3px;font-size:10px;color:#c2d9e9;letter-spacing:.5px}.room-seat.is-you{border-color:#ffdf68;background:#315055}.room-seat.is-empty{background:#172e47;border:1px dashed #718ca44a}.room-seat.is-empty b{color:#b1c7dc;font-weight:500}.room-seat.is-empty small{color:#8da9c3}.room-seat.is-offline{opacity:.5}
.room-footer{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-top:22px;padding-top:18px;border-top:1px solid #ffffff24}.room-footer p{font-size:14px;color:#c4d9ec;line-height:1.5;margin:0;max-width:430px}.room-footer .play{min-width:240px;font-size:15px;padding:15px 20px}.room-footer .play:disabled{background:#46667b;color:#e2f3ff;box-shadow:none;opacity:.8}.room-error{margin:14px 0 0;padding:12px 15px;color:#ffddba;background:#572e3e;border:1px solid #d47c7866;border-radius:8px;font-size:14px;line-height:1.5}.room-connection{font-size:12px;color:#cbe8e0}.room-overlay[data-view="entry"] .room-head{max-width:560px;margin:0 auto 22px}.room-overlay[data-view="entry"] .room-head h2{font-size:58px}.room-note{font-size:12px;color:#c9dced;margin:12px 0 0;line-height:1.4}.room-network{position:absolute;z-index:11;top:15px;left:50%;transform:translateX(-50%);border-radius:8px;background:#17314fec;border:1px solid #d5eefa78;color:#fff;padding:12px 18px;font-size:14px;text-align:center;max-width:90%;pointer-events:none}
@media(max-width:900px){.room-overlay{padding:22px}.room-head{margin-bottom:16px}.room-head h2{font-size:43px}.room-seats{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.room-topline{gap:14px}.room-seat{padding:9px;gap:7px}.room-seat b{font-size:12px}.room-footer{margin-top:17px;padding-top:14px}.room-footer .play{min-width:215px}.room-code-box{padding:13px 15px}.room-code-box strong{font-size:29px}}
@media(max-width:600px){.menu-actions{max-width:300px;gap:8px}.menu-actions button{font-size:12px;padding:12px;min-height:45px}.menu-actions span{font-size:18px}.overlay .froggy-play{font-size:12px;margin-top:12px}.room-overlay{padding:20px 17px;align-items:start}.room-head{gap:10px;margin-bottom:16px}.room-head h2{font-size:36px}.room-head .secondary{font-size:12px;padding:10px 12px}.room-head .overline{font-size:11px;letter-spacing:.8px}.room-topline{grid-template-columns:1fr;gap:12px;margin-bottom:15px}.room-code-box{padding:13px 15px}.room-code-box strong{font-size:31px}.room-summary b{font-size:16px}.room-summary p{font-size:13px;margin-top:5px}.room-seats{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.room-seat{display:block;text-align:center;padding:7px 3px;min-height:61px}.room-seat>i{width:24px;min-width:24px;height:24px;border-radius:6px;margin:0 auto 5px;font-size:10px}.room-seat b{font-size:10px}.room-seat small{font-size:9px;margin-top:2px;letter-spacing:0}.room-seat-heading h3{font-size:12px}.room-seat-heading span{font-size:11px}.room-footer{flex-direction:column;align-items:stretch;gap:12px;margin-top:15px;padding-top:12px}.room-footer p{font-size:12px;line-height:1.4}.room-footer .play{width:100%;min-width:0;font-size:14px;padding:13px;min-height:46px}.room-entry{padding:22px 18px;margin-top:25px}.room-entry>p{font-size:15px}.room-code-input{font-size:30px;min-height:65px}.room-overlay[data-view="entry"] .room-head h2{font-size:46px}.room-entry .play{font-size:14px}.room-error{font-size:13px}.room-note{font-size:11px}}
@media(prefers-reduced-motion:reduce){.room-shell{animation:none}}
@media(max-width:600px){#roomWaiting{display:flex;flex-direction:column}.room-topline{order:0}.room-footer{order:1;margin:0 0 16px;padding:0;border:0}.room-seat-heading{order:2}.room-seats{order:3;grid-template-columns:repeat(5,minmax(0,1fr))}.room-note{order:4}.room-seat{min-height:59px}.room-seat b{font-size:10px}}