.auth-screen{color:#244759;background:#eaf0e8;place-items:center;min-height:100dvh;padding:42px 20px;font-family:Arial,Helvetica,sans-serif;display:grid;position:relative;overflow:hidden}.auth-color-band{height:7px;display:flex;position:absolute;inset:0 0 auto}.auth-color-band i{flex:1}.auth-color-band i:first-child,.auth-colors i:first-child{background:#78af32}.auth-color-band i:nth-child(2),.auth-colors i:nth-child(2){background:#cd343e}.auth-color-band i:nth-child(3),.auth-colors i:nth-child(3){background:#259dce}.auth-color-band i:nth-child(4),.auth-colors i:nth-child(4){background:#ebc31c}.auth-scene{pointer-events:none;background:radial-gradient(at 90% 0,#b1dce1 0%,#0000 55%),radial-gradient(at 0 100%,#e5c3a1 0%,#0000 50%);position:absolute;inset:0}.auth-cross{border:85px solid #ffffff35;border-radius:80px;width:620px;height:620px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(25deg)}.auth-dot{border:24px solid #78af3220;border-radius:50%;width:115px;height:115px;position:absolute}.auth-dot.one{top:18%;left:10%}.auth-dot.two{border-color:#cd343e15;bottom:14%;right:7%}.auth-card{background:#fffcf5;border:1px solid #fff;border-radius:28px;width:100%;max-width:420px;padding:35px 33px 29px;position:relative;box-shadow:0 24px 85px #28483a16}.auth-brand{letter-spacing:1px;color:#183b4e;align-items:center;gap:9px;margin-bottom:30px;font-size:19px;font-weight:850;display:flex}.auth-brand>svg{color:#cd343e}.auth-colors{gap:3px;margin-left:auto;display:flex}.auth-colors i{border-radius:3px;width:6px;height:22px;display:block}.auth-card h1{letter-spacing:-.7px;margin:0 0 10px;font-size:27px;font-weight:800;line-height:1.2}.auth-subtitle{color:#6b8183;margin:0 0 24px;font-size:13px;line-height:1.6}.auth-tabs{background:#edf2e9;border-radius:12px;margin-bottom:23px;padding:4px;display:flex}.auth-tabs>button{color:#69817d;cursor:pointer;background:0 0;border:0;border-radius:9px;flex:1;padding:11px 6px;font-size:12px;font-weight:700}.auth-tabs>button.selected{color:#244759;background:#fffdf6;box-shadow:0 2px 6px #204f6310}.auth-field{margin-bottom:17px;font-size:12px;font-weight:650;display:block}.auth-field>span{color:#729089;background:#fff;border:1px solid #d5dfd6;border-radius:12px;align-items:center;gap:10px;margin-top:7px;padding:0 12px;display:flex}.auth-field>span:focus-within{border-color:#2886a4;box-shadow:0 0 0 3px #2886a41a}.auth-field input{color:#244759;background:0 0;border:0;outline:0;width:100%;min-width:0;height:47px;padding:0;font-size:14px}.auth-field input::placeholder{color:#9aa9a3;font-size:12px}.auth-eye{color:#77918c;cursor:pointer;background:0 0;border:0;place-items:center;padding:6px 0;display:grid}.auth-submit{color:#fff;cursor:pointer;background:#207fa6;border:1px solid #146587;border-radius:12px;justify-content:center;align-items:center;gap:10px;width:100%;height:49px;margin-top:24px;font-size:14px;font-weight:700;display:flex;box-shadow:0 3px #145771}.auth-submit:disabled{opacity:.6;cursor:wait}.auth-submit:hover:not(:disabled){background:#288eb7}.auth-error{color:#a44d35;background:#fff0e8;border:1px solid #e7c8ba;border-radius:10px;margin:8px 0;padding:10px 12px;font-size:12px;line-height:1.5}.auth-next{text-align:center;color:#87988e;border-top:1px solid #e5e8dc;margin-top:28px;padding-top:21px;font-size:10px}.auth-next>div{color:#5b7a79;justify-content:center;align-items:center;gap:8px;margin-top:9px;font-size:10px;display:flex}.auth-next i{background:#a7b8a5;border-radius:50%;width:3px;height:3px}.auth-loading{color:#6b8581;flex-direction:column;justify-content:center;align-items:center;gap:15px;min-height:220px;font-size:13px;display:flex}.auth-spin{animation:1s linear infinite auth-spin}@keyframes auth-spin{to{transform:rotate(360deg)}}@media (max-width:480px){.auth-screen{padding:24px 15px}.auth-card{border-radius:23px;padding:29px 24px 25px}.auth-card h1{font-size:25px}.auth-brand{margin-bottom:26px;font-size:18px}.auth-dot{display:none}}.immersive{color:#183448;--accent:#2b8bb7;--cyan:#3399b7;--bg:#eaf2f3;background:#bce5f6;height:100dvh;min-height:450px;overflow:hidden}.play-header{z-index:5;background:#fffcf4;border-bottom:1px solid #152d4315;justify-content:space-between;align-items:center;gap:12px;height:58px;padding:0 24px;display:flex;position:relative}.play-brand{color:#17374b;align-items:center;gap:9px;display:flex}.play-brand>svg{color:#d84140}.play-brand strong{letter-spacing:.6px;font-size:17px;font-weight:850}.four-colors{gap:3px;margin-left:3px;display:flex}.four-colors i{border-radius:2px;width:6px;height:18px;display:block}.play-header-actions{align-items:center;gap:8px;display:flex}.play-header-actions>button{color:#315466;border-radius:10px;align-items:center;gap:7px;min-height:40px;padding:7px 10px;font-size:12px;display:flex}.play-header-actions>button:hover{background:#e6f0ed}.play-header-actions .avatar{border-color:#d5dcda;width:25px;height:25px}.play-header-actions>button:last-child{padding-right:0}.immersive .table-screen{background:#bce5f6;max-width:none;height:calc(100dvh - 58px);min-height:392px;margin:0;padding:0;position:relative;overflow:hidden}.board-scene{touch-action:none;position:absolute;inset:0;overflow:hidden}.board-scene>canvas{cursor:grab;outline:none;width:100%;height:100%;display:block}.board-scene>canvas:active{cursor:grabbing}.table-players{pointer-events:none;flex-wrap:wrap;gap:8px;max-width:calc(100% - 175px);display:flex;position:absolute;top:16px;left:20px}.table-player{color:#345565;opacity:.86;background:#fffdf2ed;border:1px solid #fff9;border-radius:40px;align-items:center;gap:8px;min-width:0;padding:7px 10px 7px 6px;display:flex;box-shadow:0 3px 16px #183d4712}.table-player.current{opacity:1;box-shadow:0 0 0 2px var(--color),0 4px 18px #1f453322}.table-player>.avatar{border:2px solid var(--color);width:30px;height:30px}.table-player>span{text-overflow:ellipsis;white-space:nowrap;max-width:140px;font-size:12px;font-weight:650;overflow:hidden}.table-player>small{color:#708588;padding-left:4px;font-size:9px}.table-camera{gap:6px;display:flex;position:absolute;top:18px;right:20px}.table-camera>button{color:#315568;background:#fffdf2ed;border:1px solid #fff9;border-radius:50%;place-items:center;width:38px;height:38px;display:grid;box-shadow:0 3px 15px #24434e12}.table-camera>button:hover,.table-camera>button.selected{color:#fff;background:#204f63}.play-dock{left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:3;background:#fffdf6f5;border:1px solid #fff;border-radius:22px;align-items:center;gap:18px;width:min(790px,100% - 40px);min-height:86px;padding:14px 18px;display:flex;position:absolute;transform:translate(-50%);box-shadow:0 8px 40px #5a372f26}.dock-info{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.dock-turn{color:#234459;text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:7px;font-size:13px;font-weight:750;display:flex;overflow:hidden}.dock-turn>i{background:var(--color);border-radius:50%;flex-shrink:0;width:7px;height:7px}.dock-status{color:#6b7e82;font-size:11px;line-height:1.5}.immersive .primary{color:#fff;background:#207fa6;border:1px solid #136586;border-radius:13px;font-weight:650;box-shadow:0 3px #145771}.immersive .primary:hover:not(:disabled){background:#288eb7}.dock-play{white-space:nowrap;justify-content:center;align-items:center;gap:10px;min-width:150px;height:48px;padding:0 20px;font-size:14px;display:flex}.dock-die{flex-shrink:0;place-items:center;width:52px;height:52px;display:grid}.dock-die .die{background:linear-gradient(135deg,#f66556,#ca3539);border:1px solid #ff9a83;border-radius:9px;gap:4px;width:43px;height:43px;padding:8px;transform:rotate(-7deg);box-shadow:3px 4px #a12e31}.dock-die .die i.on{box-shadow:none;background:#fff5e9}.dock-shield{color:#578086;border-left:1px solid #d6e2df;place-items:center;width:40px;height:44px;display:grid}.dock-shield.armed{color:#d99c20;background:#fff0c9;border-radius:9px}.dock-shield:disabled{opacity:.25}.dock-moves{flex-wrap:wrap;gap:6px;max-width:290px;display:flex}.dock-moves>button{color:#355d31;background:#e8f1e6;border:1px solid #afcba4;border-radius:10px;justify-content:center;align-items:center;gap:5px;padding:12px 11px;font-size:12px;font-weight:650;display:flex}.dock-moves>button:hover{background:#d1e9c9}.dock-code{letter-spacing:3px;color:#1a6c8b;align-items:center;gap:9px;font-size:24px;font-weight:750;display:flex}.dock-room{color:#217e98;letter-spacing:1px;align-self:flex-start;align-items:center;gap:5px;font-size:10px;display:flex}.dock-wait{color:#607d86;font-size:12px}.dock-winner{color:#9c6a12;align-items:center;gap:8px;font-size:14px;font-weight:700;display:flex}.phase-pill{color:#3e666b;background:#fffdf2de;border:1px solid #fff9;border-radius:20px;align-items:center;gap:7px;padding:7px 10px;font-size:10px;display:flex;position:absolute;bottom:122px;left:20px}.phase-pill>span{color:#6d8586;border-left:1px solid #a3b9b8;padding-left:8px;font-size:9px}.compatible-board{aspect-ratio:1;background:#fff;width:min(74vh,88vw);position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);box-shadow:0 15px 50px #422e3438}.flat-art{width:100%;height:100%}.flat-pawn{filter:drop-shadow(0 2px 2px #0005);width:34px;height:60px;position:absolute;transform:translate(-50%,-78%);opacity:1!important}.flat-pawn img{object-fit:contain;height:100%}.flat-pawn span{background:var(--color);color:#fff;border-radius:50%;width:12px;height:12px;font-size:8px;position:absolute;bottom:0;left:12px}.flat-pawn:enabled{border-radius:12px;outline:2px solid #1d758a}.compatible-note{color:#50706d;background:#fffd;padding:3px 5px;font-size:8px;position:absolute;bottom:5px;left:8px}.immersive .modal-backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0e2b3a88}.immersive .modal{color:#244759;background:#fffcf4;border-color:#fff;border-radius:24px;box-shadow:0 20px 100px #12334455}.immersive .modal h2{color:#173c50}.immersive .eyebrow{color:#41848b}.immersive .modal-subtitle,.immersive .modal-note{color:#6c8386}.immersive .modal-close{color:#6e858c;background:#e8efea}.immersive .mode-card{color:#274b5c;background:#f0f5ed;border-color:#d3e0d3}.immersive .mode-card:hover{background:#e4f0de;border-color:#9fc48e}.immersive .mode-card span{color:#6b8585}.immersive .mode-card>svg{color:#488a8c}.immersive .modal-icon{color:#37868c;background:#e2efe9;border-color:#c3dbd0}.immersive .field-label{color:#3d6674}.immersive input{color:#274d60;background:#fff;border-color:#cbdad4}.immersive .outline{color:#3f7044;background:#e6f0e3;border-color:#b5d0ae}.immersive .avatar-gallery>button{color:#244958;background:#eaf0e9;border-color:#c6d9d5}.immersive .avatar-gallery>button.chosen{border-color:#75a657;box-shadow:0 0 0 2px #8aba6740}.immersive .avatar-gallery>button>img,.immersive .avatar-gallery>button:nth-child(2)>img{background:radial-gradient(at 50% 70%,#c9e2c599,#0000 70%),#eff4e8}.immersive .avatar-gallery small{color:#749188}.immersive .chosen-icon{color:#fff;background:#85ba61}.immersive .rules-tabs{background:#eaf0e8}.immersive .rules-tabs>button{color:#6b8182}.immersive .rules-tabs>button.selected{color:#fff;background:#428d98}.immersive .rule-phase{background:#eaf2e9;border-color:#c8dcc1}.immersive .rule-phase strong{color:#52824a}.immersive .rule-phase p,.immersive .rules-list{color:#597583}.immersive .rules-list strong{color:#284f60}.immersive .mini-avatar-select>span,.immersive .upload-label{color:#5b8188}.immersive .toast{color:#315c60;background:#fffaf0;border-color:#cbdac8}.immersive .room-code{color:#1d8199;border-color:#b3d2d1}.immersive .text-danger{color:#c4524d}.immersive .modal .muted{color:#698285}@media (max-width:760px){.play-header{height:52px;padding:0 13px}.play-brand strong{font-size:14px}.play-brand>svg{width:21px}.four-colors{display:none}.play-header-actions{gap:2px}.play-header-actions>button{padding:5px 8px;font-size:11px}.play-header-actions>button:first-child>span{display:none}.immersive .table-screen{height:calc(100dvh - 52px)}.table-players{gap:5px;max-width:calc(100% - 100px);top:12px;left:12px}.table-player{gap:5px;padding:4px 7px 4px 4px}.table-player>.avatar{width:25px;height:25px}.table-player>span{max-width:85px;font-size:10px}.table-player>small{font-size:8px}.table-camera{grid-template-columns:repeat(2,32px);gap:5px;display:grid;top:12px;right:12px}.table-camera>button{width:32px;height:32px}.table-camera>button:last-child{display:none}.play-dock{bottom:max(12px,env(safe-area-inset-bottom));border-radius:17px;flex-wrap:wrap;gap:10px;width:calc(100% - 20px);min-height:78px;padding:11px 12px}.dock-info{flex:1;min-width:calc(100% - 180px)}.dock-turn{font-size:11px}.dock-status{font-size:10px}.dock-play{gap:7px;min-width:117px;height:43px;padding:0 12px;font-size:12px}.dock-play svg{width:17px}.dock-die{width:38px;height:43px}.dock-die .die{border-radius:7px;gap:3px;width:33px;height:33px;padding:6px}.dock-die .die i{width:auto;height:auto}.dock-shield{width:29px;height:38px}.dock-moves{gap:5px;max-width:none}.dock-moves>button{padding:10px 8px;font-size:11px}.dock-code{letter-spacing:2px;font-size:19px}.dock-wait{max-width:130px;font-size:10px}.phase-pill{padding:5px 8px;font-size:9px;bottom:120px;left:12px}.phase-pill>span{font-size:8px}.dock-winner{font-size:12px}.immersive .modal{padding:28px 20px}}@media (max-width:450px){.play-dock .dock-info{flex-direction:row;flex-basis:100%;justify-content:space-between;align-items:center;gap:3px}.dock-status{text-align:right;max-width:58%;font-size:9px}.dock-play,.dock-moves,.dock-moves>button{flex:1}.dock-room{display:none}.dock-code{flex:1}.phase-pill{bottom:126px}.table-player>span{max-width:68px}.table-player>small{display:none}.table-players{max-width:calc(100% - 90px)}.immersive{min-height:400px}}@media (max-height:520px) and (min-width:600px){.play-header{height:42px}.immersive .table-screen{height:calc(100dvh - 42px)}.play-dock{border-radius:14px;gap:12px;max-width:650px;min-height:58px;padding:8px 12px;bottom:8px}.dock-play{height:37px;font-size:12px}.dock-info{gap:3px}.dock-turn{font-size:11px}.dock-status{font-size:9px}.table-players{top:9px}.table-player>.avatar{width:24px;height:24px}.table-player>span{font-size:10px}.table-camera{top:10px}.table-camera>button{width:31px;height:31px}.phase-pill{bottom:80px}}.courtyard-backdrop{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.board-scene[data-renderer=compatible]{perspective:1200px}.compatible-board{--fallback-tilt:43deg;width:min(78vh,86vw);transform:translate(-50%,-50%) rotateX(var(--fallback-tilt));transform-style:preserve-3d;border:5px solid #fffdf4;top:57%;box-shadow:0 5px #f2efe0,0 10px #a1a09a,0 13px #f4eee0,0 35px 45px #6d534c66}.flat-pawn{transform:translate(-50%,-75%) translateZ(5px) rotateX(calc(-1 * var(--fallback-tilt)));transform-style:preserve-3d;transform-origin:50% 90%}.compatible-note{opacity:.55;font-size:6px;bottom:3px;left:4px}.board-scene[data-view=top] .compatible-board{--fallback-tilt:0deg;width:min(75vh,86vw);top:48%}@media (max-width:760px){.compatible-board{--fallback-tilt:35deg;width:89vw;top:55%}.compatible-note{font-size:5px}.flat-pawn{width:27px;height:48px}.flat-pawn span{width:10px;height:10px;font-size:7px;left:9px}}@media (max-height:520px) and (min-width:600px){.compatible-board{--fallback-tilt:40deg;width:72vh;top:49%}.board-scene[data-view=top] .compatible-board{width:68vh}}.compatible-board{--angle:0deg;--tilt:var(--fallback-tilt)}.compatible-board .pawn.with-body{transform:translate(-50%,-72%) translateZ(14px) rotateX(calc(-1 * var(--fallback-tilt)));transform-origin:50% 92%}.immersive,.immersive .table-screen{min-height:0}.compatible-board{width:min(65dvh,86vw);top:48%}.board-scene[data-view=top] .compatible-board{width:min(100dvh - 250px,86vw);top:45%}@media (max-width:760px) and (min-height:521px){.compatible-board{width:min(89vw,65dvh);top:51%}}@media (max-height:520px) and (min-width:600px){.compatible-board{width:56dvh;top:44%}.board-scene[data-view=top] .compatible-board{width:52dvh;top:44%}}.board-scene[data-view=community] .courtyard-backdrop{object-fit:contain;background:#bce5f6}