input,select{max-width:100%}input:not([type=checkbox]){border:1px solid #cbd6e5;border-radius:9px;background:#f8fafd;padding:13px;width:100%;margin:8px 0;font:inherit;color:#192a47}#roomInput{text-transform:uppercase;letter-spacing:4px;font-weight:800;font-size:23px}.roomForms{display:grid;grid-template-columns:1fr 1fr;gap:24px}.roomForms .panel{display:block}.roomForms .panel h2{font-size:26px}.roomForms select{margin-bottom:12px}.roomHeader{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}.roomCode{text-align:right}.roomCode span{display:block;letter-spacing:2px;font-size:10px;color:#61718c}.roomCode b{display:block;letter-spacing:3px;font-size:24px;margin:5px 0}.matchBanner{padding:13px 18px;background:#e3ebfc;border:1px solid #bfceec;border-radius:11px;margin-bottom:14px;font-weight:600;line-height:1.5;font-size:14px}.matchButtons{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:20px}.matchLayout{display:grid;grid-template-columns:minmax(0,670px) minmax(240px,1fr);gap:28px;align-items:start}.playStation{min-width:0}.playerStrip{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#e4ebf7;border:2px solid transparent;border-radius:10px}.playerStrip.black{background:#142745;color:#fff}.playerStrip.active{border-color:#e95163}.playerStrip span{font-size:12px;font-weight:700}.playerStrip strong{font-size:27px;font-variant-numeric:tabular-nums}.pocket{display:flex;justify-content:space-between;gap:7px;padding:8px 0;min-height:56px}.pocket button{display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #c9d6e9;border-radius:8px;background:#e6eefb;color:#192a47;flex:1;min-width:0;padding:3px 6px}.pocket button svg{width:34px;height:34px}.pocket button strong{font-size:15px}.pocket button.selected{background:#fbd7dc;border:2px solid #e95163}.pocket button:disabled{opacity:.45}.square.legal:after{content:'';position:absolute;width:20%;height:20%;background:#192a4755;border:2px solid #fff8;border-radius:50%;pointer-events:none}.square.inCheck{background:#ed8da0}.companion{display:flex;flex-direction:column;gap:18px}.companion h2{font-size:23px}.companion .panel{display:block;padding:22px}.companion p{font-size:13px;line-height:1.7}.teamOne{color:#245ce3}.teamTwo{color:#c32c4c}.miniBoard{margin-top:13px;pointer-events:none}.miniBoard .square{aspect-ratio:1}.miniBoard .piece{width:93%;height:93%}.miniClocks{display:flex;justify-content:space-between;font-size:12px;gap:10px;margin-top:12px;font-variant-numeric:tabular-nums}.connectionLine{display:flex;justify-content:space-between;gap:10px;color:#61718c;font-size:10px;min-height:16px}.connectionLine .offline{color:#a2223e}.rules{display:block;margin-top:30px}.rules summary{cursor:pointer;font-weight:700}.rules p{font-size:13px;line-height:1.8}.boardStatus{min-height:36px;margin:8px 0 2px;line-height:1.5}#message:empty{display:none}#message{background:#fff0f3;border:1px solid #f0b4c2;color:#8e2641;padding:12px 16px;border-radius:10px;margin-bottom:18px;font-size:13px}dialog{width:440px;max-height:90dvh;overflow:auto}.dialogHeading{display:flex;justify-content:space-between;align-items:center;gap:16px}.dialogHeading h2{font-size:24px}dialog label{display:block;margin:18px 0;font-size:13px}dialog select{display:block;width:100%;padding:10px;border:1px solid #cbd6e5;border-radius:8px;margin-top:6px;background:#f8fafd}.resignRow{display:flex;gap:9px;margin-top:22px}.resignRow button{flex:1;color:#a22b45}.rotated{transform:rotate(180deg)}
.babyFocus{overflow:hidden;overscroll-behavior:none}.babyFocus header,.babyFocus footer,.babyFocus .rules,.babyFocus .roomHeader,.babyFocus .companion,.babyFocus #otherRooms{display:none}.babyFocus main{max-width:none;height:100dvh;padding:max(7px,env(safe-area-inset-top)) max(9px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(9px,env(safe-area-inset-left))}.babyFocus #room{height:100%;display:flex;flex-direction:column}.babyFocus .matchBanner{margin:0 0 5px;padding:4px 8px;text-align:center;font-size:11px;flex-shrink:0}.babyFocus .matchButtons{margin:0 0 5px;justify-content:center;gap:5px;flex-shrink:0}.babyFocus .matchButtons button{padding:6px 10px;font-size:11px}.babyFocus .matchLayout{flex:1;min-height:0;display:block;container-type:size}.babyFocus .playStation{height:100%;display:flex;align-items:center;flex-direction:column;justify-content:center}.babyFocus .boardFrame{width:min(100cqw,calc(100cqh - 198px));aspect-ratio:1;flex-shrink:0;padding:5px;touch-action:none}.babyFocus .playerStrip,.babyFocus .pocket,.babyFocus .boardStatus,.babyFocus .connectionLine{width:min(100cqw,calc(100cqh - 198px));max-width:720px;flex-shrink:0}.babyFocus .playerStrip{padding:2px 9px;height:34px}.babyFocus .playerStrip strong{font-size:23px}.babyFocus .playerStrip span{font-size:10px}.babyFocus .pocket{min-height:38px;height:38px;padding:3px 0;gap:5px}.babyFocus .pocket button{padding:1px}.babyFocus .pocket button svg{width:25px;height:25px}.babyFocus .pocket button strong{font-size:12px}.babyFocus .boardStatus{font-size:11px;line-height:1.3;min-height:29px;margin:5px 0 0}.babyFocus .connectionLine{font-size:9px;height:16px}.babyFocus #message{position:fixed;bottom:8px;left:10px;right:10px;z-index:8;font-size:12px;padding:8px;pointer-events:none}.babyFocus .square{touch-action:none}.babyFocus .coordinate{font-size:7px}@media(max-width:750px){.roomForms,.matchLayout{grid-template-columns:1fr}.companion{display:grid;grid-template-columns:1fr 1fr;gap:12px}.companion .panel{padding:14px}.roomCode b{font-size:19px;letter-spacing:2px}.roomHeader h1{font-size:29px}.roomHeader{gap:10px}.matchButtons button{font-size:12px;padding:10px}.pocket button svg{width:28px;height:28px}}@media(max-width:460px){.companion{grid-template-columns:1fr}.miniBoard{max-width:230px;margin-left:auto;margin-right:auto}.roomCode .textButton{font-size:10px}.roomForms h2{font-size:23px}.roomForms{gap:15px}}@media(max-height:520px) and (orientation:landscape){.babyFocus .playStation{display:grid;grid-template-columns:minmax(0,1fr) 220px;grid-template-rows:34px 38px 38px 34px minmax(28px,1fr) 16px;column-gap:12px;max-width:1000px;margin:auto}.babyFocus .boardFrame{grid-column:1;grid-row:1/7;width:min(100%,100cqh);justify-self:center}.babyFocus .playerStrip,.babyFocus .pocket,.babyFocus .boardStatus,.babyFocus .connectionLine{grid-column:2;width:220px}.babyFocus #topStrip{grid-row:1}.babyFocus #topPocket{grid-row:2}.babyFocus #bottomPocket{grid-row:3}.babyFocus #bottomStrip{grid-row:4}.babyFocus .boardStatus{grid-row:5}.babyFocus .connectionLine{grid-row:6}}

.roomForms label{display:block;font-size:13px;margin:10px 0 5px}.roomForms select{width:100%;padding:10px;border:1px solid #cbd6e5;border-radius:9px;background:#f8fafd}.seatChoices{display:grid;grid-template-columns:1fr 1fr;gap:8px}.seatChoices button{font-size:12px;padding:13px 8px}.seatChoices button:disabled{opacity:.5}.players{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}.players span{padding:8px 11px;border:1px dashed #bac8de;border-radius:8px;font-size:12px;color:#61718c}.players .joined{background:#e2f0ea;border:1px solid #b3d8c5;color:#245343}.babyFocus .players{display:none}.roomCode .textButton{display:block;margin-left:auto}#invite{text-align:center}#invite .dialogHeading{text-align:left}#qrCode{background:white;margin:18px auto 10px;width:min(100%,300px);aspect-ratio:1}#qrCode svg{display:block;width:100%;height:100%}#qrRoomCode{display:block;font-size:25px;letter-spacing:4px}#inviteLink{display:block;margin-top:14px}select[hidden]{display:none}
