@import url('design-tokens.css');
/* Shared room and game furniture. No gameplay selectors or private data are generated here. */
body.jalsa-play{--display:var(--j-font);--body:var(--j-font);--bg:var(--j-paper);--surface:var(--j-surface);--sunk:#eee2cf;--ink:var(--j-ink);--line:var(--j-line);background:var(--j-paper);color:var(--j-ink);font-family:var(--j-font)}body.jalsa-play::before{display:none}body.jalsa-play :is(h1,h2,h3){font-family:var(--j-font);letter-spacing:0}body.jalsa-play :is(p,label,legend){line-height:1.85}body.jalsa-play :is(.main,.side,.panel){min-width:0}
.jalsa-gamebar{display:flex;align-items:center;justify-content:space-between;gap:22px;background:var(--j-surface);color:var(--j-ink);min-height:82px;padding:16px max(24px,calc((100vw - 1290px)/2));border-bottom:1px solid var(--j-line);position:relative}.jalsa-gamebar::before{content:'';position:absolute;top:0;inset-inline:0;height:4px;background:var(--j-wine)}.jalsa-gamebar a{color:inherit;text-decoration:none}.jalsa-wordmark{font:700 40px/1 'Aref Ruqaa',serif;color:var(--j-wine)!important;padding-bottom:8px}.jalsa-game-location{display:flex;gap:24px;align-items:center}.jalsa-game-location>span{font-size:14px;border-inline-start:1px solid var(--j-line);padding-inline-start:24px;color:var(--j-wood)}.jalsa-game-actions{display:flex;gap:10px;align-items:center}.jalsa-game-actions a,.jalsa-game-actions button{border:1px solid var(--j-line);min-height:44px;border-radius:7px;padding:9px 15px;font:13px var(--j-font);color:var(--j-wood);background:transparent;cursor:pointer}.jalsa-game-actions button{background:var(--j-wine);border-color:var(--j-wine);color:var(--j-surface)}.jalsa-game-actions :is(a,button):hover{filter:brightness(.92)}
body.jalsa-play #app{padding:30px 24px 60px;gap:24px}body.jalsa-play .panel{background:var(--j-surface);border:1px solid var(--j-line);border-radius:14px;box-shadow:var(--j-shadow);padding:26px}body.jalsa-play .panel>h2{font-size:23px;line-height:1.5;margin-bottom:18px;color:var(--j-ink);font-weight:700}body.jalsa-play .panel>p{margin-block:12px}body.jalsa-play .btn{border-radius:8px;box-shadow:none;min-height:48px;font:500 15px/1.6 var(--j-font);padding:11px 20px}body.jalsa-play .btn:not(:disabled):hover{filter:brightness(.94)}body.jalsa-play .btn:disabled{cursor:not-allowed;opacity:.5}body.jalsa-play :is(input,textarea,select){font-family:var(--j-font);font-size:16px;border:1px solid #bdaa94;border-radius:8px;background:#fffdf8;color:var(--j-ink);min-height:48px;box-shadow:none}body.jalsa-play :is(input[type=checkbox],input[type=radio]){width:20px;min-height:20px}body.jalsa-play :is(input[type=range],input[type=color]){padding:0;min-height:36px}body.jalsa-play :is(button,a,input,summary,textarea,select):focus-visible{outline:3px solid #9f6e33;outline-offset:4px}body.jalsa-play label{font-size:14px}
body.jalsa-play .rules{border:1px solid var(--j-line);border-radius:10px;background:#eee2cf;padding:18px 21px;color:var(--j-wood)}body.jalsa-play .rules summary{cursor:pointer;font-weight:500;font-size:14px;min-height:30px;display:list-item}body.jalsa-play .rules ol{padding-inline-start:23px;line-height:2;font-size:14px}body.jalsa-play .code{font-variant-numeric:tabular-nums;letter-spacing:8px;color:var(--j-gold)}body.jalsa-play .joinQr{background:white;padding:12px;border:1px solid var(--j-line);border-radius:12px;width:max-content;max-width:100%;margin-block:16px}body.jalsa-play .joinQr svg{display:block;max-width:100%}body.jalsa-play .err{background:#f7e5e0;border:1px solid #d4a399;border-inline-start:4px solid #a32b38;color:#802c3d;border-radius:8px;padding:13px 16px;font-size:14px;line-height:1.8}body.jalsa-play .note{font-size:13px;line-height:1.9}body.jalsa-play .lobbyList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;list-style:none;padding:0;width:100%}body.jalsa-play .lobbyList li{padding:12px 16px;border:1px solid #ffffff30;border-radius:8px;background:#ffffff0b}body.jalsa-play .waiting{padding:20px;border:1px dashed var(--j-line);border-radius:10px;line-height:1.9}body.jalsa-play :is(.status,.note,.err){overflow-wrap:anywhere}
body.jalsa-play.jalsa-lobby #app>.side .hero{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0;background:var(--j-surface);color:var(--j-ink);border:1px solid var(--j-line);border-radius:20px;overflow:hidden;padding:0 28px 30px;text-align:start;margin:0}body.jalsa-play.jalsa-lobby #app>.side .hero h1{color:var(--j-ink);font-size:38px;line-height:1.45;margin:26px 0 14px}body.jalsa-play.jalsa-lobby #app>.side .hero .tag{color:var(--j-muted);line-height:1.95;font-size:15px;margin:0;max-width:none}body.jalsa-play.jalsa-lobby #app>.side .hero .sadu{display:none}body.jalsa-play.jalsa-lobby #app>.side .hero .scene{display:flex;align-items:center;justify-content:center;width:calc(100% + 56px);height:auto;aspect-ratio:640/350;max-width:none;margin:0 -28px!important;border-radius:0;background:var(--j-sand);overflow:hidden;filter:none;padding:0;gap:0}body.jalsa-play.jalsa-lobby #app>.side .hero .scene>svg{width:100%;height:auto;flex:none}body.jalsa-play.jalsa-lobby #app>.side .hero .scene>*{zoom:1}body.jalsa-play.jalsa-lobby #app>.side .hero :is(.rg-chip,.aj-pill,.im-pill,.mm-pill){align-self:start;margin-top:18px;background:var(--j-sand);border-radius:5px;padding:6px 12px;font-size:12px;color:var(--j-wood)}body.jalsa-play.jalsa-lobby #app>.main{display:flex;flex-direction:column;gap:18px}body.jalsa-play.jalsa-lobby #app>.main>.panel:first-child{border-top:4px solid var(--j-wine)}
body.jalsa-play :is(.rg-room,.aj-room,.mm-room,.im-room,.pc-room){background:#eaddc8;text-align:center}body.jalsa-play :is(.rg-room-code,.aj-room-code,.mm-room-code,.im-room-code,.pc-room .code){font-weight:700;font-size:40px;color:var(--j-wine);letter-spacing:9px}body.jalsa-play :is(.rg-room,.aj-room,.mm-room,.im-room,.pc-room) .joinQr{margin-inline:auto}body.jalsa-play .rg-choice{border-radius:7px;font-size:14px;min-height:44px;background:#eee2cf;border-color:var(--j-line)}body.jalsa-play .rg-choice[aria-pressed=true]{background:var(--j-wine);color:var(--j-surface)}body.jalsa-play .rg-chip{border-radius:5px;font-size:12px}body.jalsa-play .rg-scores li{border-radius:7px;border:1px solid var(--j-line);background:var(--j-surface);padding:13px 16px}body.jalsa-play .rg-scores li:first-child{border-inline-start:4px solid var(--j-gold)}body.jalsa-play .rg-scores strong{font-variant-numeric:tabular-nums}
.jalsa-rule-dialog{border:1px solid var(--j-line);border-radius:16px;background:var(--j-surface);color:var(--j-ink);max-width:640px;width:calc(100% - 32px);max-height:86dvh;padding:0;box-shadow:0 20px 80px #231f2040;font-family:var(--j-font)}.jalsa-rule-dialog::backdrop{background:#292421c7;backdrop-filter:blur(3px)}.jalsa-rule-head{display:flex;align-items:center;justify-content:space-between;padding:22px 26px;gap:20px;background:var(--j-wine);color:var(--j-surface)}.jalsa-rule-head h2{color:inherit;font-size:22px;margin:0;font-weight:500}.jalsa-rule-head button{border:1px solid #ffffff55;border-radius:50%;width:44px;height:44px;flex-shrink:0;display:grid;place-content:center;background:none;color:inherit;cursor:pointer;font-size:25px}.jalsa-rule-content{padding:28px;line-height:2;font-size:15px}.jalsa-rule-content ol{padding-inline-start:24px;margin:0}.jalsa-rule-content li+li{margin-top:14px}.jalsa-rule-content .rules{border:0!important;background:transparent!important;padding:0!important}.jalsa-rule-content .rules summary{display:none}.jalsa-rule-note{padding:18px 28px;background:var(--j-sand);font-size:12px;color:var(--j-wood);line-height:1.9;margin:0}
.jalsa-game-kicker{display:block;color:var(--j-wine);font-size:11px;letter-spacing:1px;margin-top:23px}.jalsa-game-kicker+h1{margin-top:9px!important}.jalsa-progress{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:12px 18px;border:1px solid var(--j-line);border-radius:10px;background:var(--j-surface);color:var(--j-muted);font-size:12px;margin-bottom:18px}.jalsa-progress strong{color:var(--j-wine);font-size:14px}.jalsa-progress span+span::before{content:'·';padding-inline:4px 10px}.jalsa-progress a{color:var(--j-wood)}
@media(min-width:960px){body.jalsa-play.jalsa-lobby #app{max-width:1240px;display:grid;grid-template-columns:minmax(300px,.85fr) minmax(420px,1.15fr);gap:50px;align-items:start;padding-top:42px}body.jalsa-play.jalsa-lobby #app>.side{position:sticky;top:24px}body.jalsa-play.jalsa-lobby #app>.side>.iconBtn{margin-bottom:18px}}
@media(max-width:700px){.jalsa-gamebar{padding:14px 16px;min-height:72px;gap:12px}.jalsa-wordmark{font-size:33px}.jalsa-game-location{gap:14px}.jalsa-game-location>span{padding-inline-start:14px;font-size:12px;max-width:135px}.jalsa-game-actions{gap:6px}.jalsa-game-actions a{display:none}.jalsa-game-actions button{font-size:12px;padding:8px 12px}body.jalsa-play #app{padding:20px 16px 40px}body.jalsa-play .panel{padding:20px;border-radius:12px}body.jalsa-play .panel>h2{font-size:21px}body.jalsa-play .btn{font-size:14px;padding:11px 16px}body.jalsa-play.jalsa-lobby #app>.side .hero{display:grid;grid-template-columns:105px 1fr;column-gap:17px;padding:20px;align-items:center;border-radius:14px}body.jalsa-play.jalsa-lobby #app>.side .hero .scene{grid-column:1;grid-row:1/5;width:105px;height:135px;aspect-ratio:auto;margin:0!important;border-radius:50px 50px 8px 8px}body.jalsa-play.jalsa-lobby #app>.side .hero .scene>svg{height:100%;width:auto;max-width:none}body.jalsa-play.jalsa-lobby #app>.side .hero h1{grid-column:2;font-size:27px;margin:0 0 8px!important}body.jalsa-play.jalsa-lobby #app>.side .hero .tag{grid-column:2;font-size:12px}body.jalsa-play.jalsa-lobby #app>.side .hero :is(.rg-chip,.aj-pill,.im-pill,.mm-pill){grid-column:2;justify-self:start;margin-top:10px;font-size:10px;padding:4px 7px}.jalsa-game-kicker{grid-column:2;margin-top:0;font-size:10px;margin-bottom:7px}.jalsa-rule-head{padding:18px}.jalsa-rule-head h2{font-size:20px}.jalsa-rule-content{padding:23px;font-size:14px}.jalsa-rule-note{padding:17px 23px}.jalsa-progress{padding:10px 12px;font-size:11px;gap:6px}.jalsa-progress strong{font-size:13px}}
@media(max-width:370px){body.jalsa-play.jalsa-lobby #app>.side .hero{grid-template-columns:80px 1fr;padding:16px;gap:12px}body.jalsa-play.jalsa-lobby #app>.side .hero .scene{width:80px;height:125px}body.jalsa-play.jalsa-lobby #app>.side .hero h1{font-size:23px}}
@media(min-width:1500px){body.tv .jalsa-gamebar{padding-inline:40px}body.tv .jalsa-game-location>span{font-size:20px}body.tv .jalsa-game-actions{display:none}}