@import "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Karla:wght@400;500;600;700&display=swap";:root{color:#20372f;font-synthesis:none;background:#0d382e;font-family:Karla,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 15% 10%,#1b5142,#0000 31%),#0d382e;min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button,a{cursor:pointer}.eyebrow,label{letter-spacing:2px;color:#a47c31;font-size:11px;font-weight:700}.brand-link{text-decoration:none}.brand{color:#f8eedb;align-items:center;gap:10px;display:flex}.brand>img{border-radius:50%;width:39px;height:39px}.brand>div{display:grid}.brand strong{font:600 26px/1 Fraunces}.brand small{letter-spacing:2.2px;color:#c6bda9;margin-top:5px;font-size:8px}.topbar{border-bottom:1px solid #ffffff18;justify-content:space-between;align-items:center;height:82px;padding:0 5vw;display:flex}.account{color:#eee5d5;align-items:center;gap:9px;display:flex}.account>span,.player-avatar{color:#173b31;background:#d6ab54;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:700;display:grid}.account button,.room-code button{color:#c9c5b8;background:0 0;border:0}.room-code{letter-spacing:2px;color:#9fb0a9;font-size:10px}.room-code b{color:#e5bb63;margin-left:8px;font-size:14px}.primary{color:#fff;background:#174b3b;border:0;border-radius:4px;justify-content:center;gap:15px;width:100%;padding:16px 20px;font-weight:700;display:flex}.primary:hover{background:#0e3d30}.primary:disabled{opacity:.6;cursor:wait}.form-error{color:#96362e;background:#a43d3420;border-radius:4px;margin-top:14px;padding:10px 12px;font-size:13px}.dark-error{color:#ffc5bf;background:#d8746926;max-width:480px}.auth-layout{grid-template-columns:minmax(520px,58%) 1fr;min-height:100vh;display:grid}.auth-card{background:#fbf6e9;flex-direction:column;justify-content:center;padding:110px clamp(35px,9vw,150px) 40px;display:flex}.auth-card>.brand{color:#173b31;position:absolute;top:36px;left:5vw}.auth-card>.brand small{color:#817a6c}.auth-intro h1,.lobby-welcome h1{letter-spacing:-2px;color:#173b31;margin:18px 0;font:600 clamp(42px,5vw,70px)/.98 Fraunces}.auth-intro h1 em,.lobby-welcome h1 em{color:#ae7e27}.auth-intro p,.lobby-welcome>p{color:#69736e;max-width:530px;line-height:1.6}.auth-tabs{border-bottom:1px solid #d9d1bf;margin-top:25px;display:flex}.auth-tabs a{color:#8b8b80;padding:14px 24px 12px;font-weight:700;text-decoration:none}.auth-tabs a.active{color:#173b31;border-bottom:2px solid #b88831}.auth-card label{margin-top:20px;display:block}.auth-card input,.join-form input,.chat input{color:#173b31;background:#fffdf6;border:1px solid #d8d0bd;border-radius:4px;outline:0;width:100%;margin-top:7px;padding:15px}.auth-card input:focus,.join-form input:focus{border-color:#b48736;box-shadow:0 0 0 3px #b487361b}.auth-card form>.primary{margin-top:24px}.security-note{text-align:center;color:#969187;margin-top:13px;display:block}.turnstile-widget{place-items:center;margin-top:16px;display:grid}.auth-art{color:#f7ecd9;background:linear-gradient(145deg,#19483b,#082a23);flex-direction:column;justify-content:flex-end;padding:7vw 5vw;display:flex;position:relative;overflow:hidden}.auth-art blockquote{max-width:490px;margin:0 0 25px;font:500 clamp(28px,3.3vw,50px)/1.18 Fraunces}.auth-art>div{color:#c89a3e;font:100px/.7 Fraunces}.auth-art>span{letter-spacing:2px;color:#d2a74f;font-size:11px}.auth-art>b{opacity:.08;font:500px Fraunces;position:absolute;top:20px;right:-80px}.lobby-layout{color:#f7efdf;grid-template-columns:1fr 1fr;align-items:center;gap:8vw;min-height:calc(100vh - 82px);padding:5vw 9vw;display:grid}.lobby-welcome h1{color:#f7efdf}.lobby-welcome>p{color:#b8c2bc}.new-game{max-width:480px;margin-top:24px}.bot-picker{max-width:480px;margin-top:25px}.bot-picker>.eyebrow{margin-bottom:9px;display:block}.bot-picker>div{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.bot-picker button{color:#f4ead7;text-align:left;background:#ffffff0a;border:1px solid #ffffff24;border-top-width:3px;border-radius:5px;gap:3px;padding:12px 8px;display:grid}.bot-picker button:hover{background:#ffffff12;border-color:#d0a146}.bot-picker .easy{border-top-color:#6caf7d}.bot-picker .medium{border-top-color:#d1a447}.bot-picker .hard{border-top-color:#a44b40}.bot-picker b{font:600 17px Fraunces}.bot-picker small{color:#a9b9b2;text-transform:uppercase;font-size:9px}.or{letter-spacing:2px;color:#92a49d;align-items:center;gap:15px;max-width:480px;margin:27px 0 12px;font-size:10px;display:flex}.or i{background:#ffffff20;flex:1;height:1px}.join-form{gap:8px;max-width:480px;display:flex}.join-form input{color:#fff;letter-spacing:4px;background:#ffffff0c;border-color:#ffffff24;margin:0}.join-form button{white-space:nowrap;color:#e0b863;background:0 0;border:1px solid #ba8d38;border-radius:4px;padding:0 25px}.sessions{color:#173b31;background:#f8f0df;border-radius:8px;max-height:570px;padding:22px;box-shadow:0 24px 70px #001b1555}.sessions>header{border-bottom:1px solid #ded2b9;justify-content:space-between;align-items:center;padding-bottom:16px;display:flex}.sessions h2{margin:5px 0;font:600 29px Fraunces}.sessions>header>span{color:#f5e7c9;background:#163f34;border-radius:50%;place-items:center;width:34px;height:34px;display:grid}.session-list{gap:9px;max-height:440px;margin-top:14px;display:grid;overflow:auto}.session-card{text-align:left;color:#1a3d32;background:#fffaf0;border:1px solid #ded2bc;border-radius:5px;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:12px;display:grid}.session-card:hover{border-color:#b58b3c;transform:translateY(-1px)}.session-card>span:nth-child(2){gap:4px;display:grid}.session-card small{color:#8b8374;text-transform:capitalize}.session-card>i{color:#af8132;font-size:20px;font-style:normal}.session-avatar{place-items:center;width:36px;height:36px;font-size:29px;display:grid}.bot-avatar{overflow:hidden;background:#165343!important;padding:0!important}.bot-avatar img{object-fit:cover;width:100%;height:100%;display:block}.session-avatar.bot-avatar{border-radius:50%;box-shadow:0 0 0 2px #d0a44955}.empty-sessions{text-align:center;color:#8d877b;padding:45px 10px}.empty-sessions span{color:#baa272;font-size:45px}.game-layout{grid-template-columns:minmax(480px,720px) minmax(300px,390px);justify-content:center;gap:32px;padding:28px max(3vw,20px) 50px;display:grid}.board-column{min-width:0}.status{color:#284c40;text-align:center;background:#f8f1df;border-radius:99px;width:max-content;max-width:95%;margin:0 auto 14px;padding:8px 16px;font-size:12px;font-weight:700;box-shadow:0 5px 20px #001c1655}.status.ended{background:#d5aa52}.status i{background:#37a26d;border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block}.player-row{color:#d9d7cc;letter-spacing:1px;justify-content:space-between;align-items:center;height:48px;font-size:11px;display:flex}.player-row>div{align-items:center;gap:10px;display:flex}.player-avatar{width:30px;height:30px;font-size:13px}.player-row small{color:#16392f;background:#d1a64d;padding:2px 5px}.board{aspect-ratio:1;-webkit-user-select:none;user-select:none;border:7px solid #5b3928;grid-template-columns:repeat(8,1fr);display:grid;box-shadow:0 22px 48px #001d1766}.square{aspect-ratio:1;border:0;place-items:center;padding:0;display:grid;position:relative}.square.light{background:#eadbb8}.square.dark{background:#815b40}.square.last{box-shadow:inset 0 0 0 100px #d7af4366}.square.selected{box-shadow:inset 0 0 0 5px #e4ba4e}.square.check{box-shadow:inset 0 0 20px 8px #c53333}.piece{filter:drop-shadow(0 2px 1px #0006);z-index:2;font-size:clamp(31px,5vw,59px);line-height:1}.piece.white{color:#fff9e9;text-shadow:0 0 1px #211}.piece.black{color:#162c25}.move-dot{z-index:3;background:#173e32aa;border-radius:50%;width:19%;height:19%;position:absolute}.capture-ring{z-index:3;border:5px solid #173e3288;border-radius:50%;position:absolute;inset:7%}.square small{opacity:.65;font-size:9px;font-weight:700;position:absolute}.square .file{bottom:1px;right:3px}.square .rank{top:2px;left:3px}.socket-error{color:#fff;text-align:center;background:#8d332d;border-radius:4px;margin-bottom:8px;padding:9px 12px;font-size:12px}.game-sidebar{grid-template-rows:auto minmax(160px,1fr) auto minmax(210px,1.2fr);gap:12px;max-height:800px;padding-top:48px;display:grid}.panel{background:#faf4e5;border:1px solid #ddcfb3;border-radius:5px;overflow:hidden}.panel>header{color:#78694e;letter-spacing:2px;border-bottom:1px solid #dfd5c1;padding:13px 16px;font-size:11px;font-weight:700}.captured>div{min-height:49px;padding:10px 15px}.captured span{font-size:24px}.captured em{color:#aaa395;font-size:12px}.moves>div,.messages{height:calc(100% - 40px);max-height:250px;overflow:auto}.moves p{border-bottom:1px solid #eee5d4;grid-template-columns:32px 1fr 1fr;margin:0;padding:8px 13px;font-size:13px;display:grid}.moves p span{color:#aaa18f}.empty-panel{color:#aaa18f;text-align:center;padding:30px 10px;font-size:12px}.game-actions{grid-template-columns:1fr 1fr;gap:10px;display:grid}.game-actions button{color:#ede5d5;background:0 0;border:1px solid #b8a887;border-radius:4px;padding:12px;font-weight:700}.game-actions .gold{color:#17382f;background:#c79b42;border-color:#c79b42}.game-actions button:disabled{opacity:.4;cursor:not-allowed}.chat{flex-direction:column;display:flex}.chat>header{justify-content:space-between;display:flex}.chat>header span{color:#4d9569;font-size:8px}.messages{flex:1;padding:12px}.messages article{margin-bottom:12px}.messages article small{color:#9e9687;font-size:9px}.messages article p{background:#eee5d2;border-radius:3px;margin:3px 0;padding:7px 10px;font-size:12px;display:table}.messages article.mine{flex-direction:column;align-items:flex-end;display:flex}.messages article.mine p{background:#d7e4dc}.chat form{border-top:1px solid #ddd2bd;padding:8px;display:flex}.chat input{box-shadow:none;background:0 0;border:0;margin:0;padding:8px}.chat form button{color:#fff;background:#174a3a;border:0;border-radius:50%;min-width:32px;height:32px}.modal-backdrop{z-index:10;background:#001b1688;place-items:center;display:grid;position:fixed;inset:0}.promotion{text-align:center;background:#fbf5e6;border-radius:6px;padding:28px}.promotion h2{margin:8px;font:28px Fraunces}.promotion button{color:#18382f;background:#eee2ca;border:1px solid #d6c7aa;width:68px;height:68px;margin:4px;font-size:45px}.app-loading,.game-loading,.not-found{color:#e6dcc9;text-align:center;place-content:center;justify-items:center;gap:18px;min-height:100vh;display:grid}.game-loading button,.not-found a{color:#e5bb63;background:0 0;border:1px solid #e5bb63;border-radius:4px;padding:10px 15px;text-decoration:none}.not-found h1{font:40px Fraunces}@media (width<=900px){.auth-layout{grid-template-columns:1fr}.auth-art{display:none}.auth-card{min-height:100vh;padding:110px max(7vw,28px) 40px}.lobby-layout{grid-template-columns:minmax(0,680px);justify-content:center;align-items:start;padding:55px 8vw}.sessions,.session-list{max-height:none}.game-layout{grid-template-columns:minmax(0,680px)}.game-sidebar{grid-template-rows:auto 260px auto 300px;max-height:none;padding-top:0}.piece{font-size:clamp(27px,10vw,57px)}}@media (width<=520px){.topbar{height:68px;padding:0 14px}.topbar .brand>img{width:31px;height:31px}.topbar .brand strong{font-size:20px}.topbar .brand small{display:none}.account{font-size:13px}.account button{display:none}.room-code{letter-spacing:1px}.auth-card{padding-left:22px;padding-right:22px}.auth-card>.brand{left:22px}.auth-intro h1{font-size:40px}.lobby-layout{gap:38px;min-height:calc(100vh - 68px);padding:38px 18px}.lobby-welcome h1{font-size:43px}.new-game{width:100%}.bot-picker>div{grid-template-columns:1fr}.bot-picker button{grid-template-columns:1fr auto;align-items:center}.join-form{flex-direction:column}.join-form button{height:48px}.sessions{padding:14px}.sessions h2{font-size:24px}.session-card{grid-template-columns:36px 1fr auto;padding:10px 8px}.game-layout{gap:12px;padding:8px 4px 30px}.board{border-width:3px}.piece{font-size:clamp(24px,11vw,50px)}.capture-ring{border-width:3px}.square small{font-size:7px}.player-row{padding:0 5px}.game-sidebar{grid-template-rows:auto 230px auto 300px;padding:0 3px}.game-actions{z-index:4;position:sticky;bottom:5px}.not-found h1{font-size:30px}}.header-share{font-weight:700;color:#e8bd65!important;border:1px solid #cfa34d!important;border-radius:99px!important;margin-left:9px!important;padding:6px 10px!important;font-size:10px!important}.invite-banner{color:#eee4d3;text-align:left;background:#ffffff0b;border:1px solid #d1a64d66;border-radius:5px;justify-content:space-between;align-items:center;width:100%;margin:-3px 0 7px;padding:9px 13px;display:flex}.invite-banner b{color:#e5b95e}.share-notice{z-index:20;color:#173b31;background:#f7efddef;border:1px solid #d5ae5a;border-radius:99px;padding:9px 16px;font-size:12px;font-weight:700;position:fixed;top:94px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #001b1666}.game-actions{grid-template-columns:repeat(3,1fr)}.mobile-game-tools,.mobile-panel-backdrop{display:none}@media (width<=900px){.game-layout{padding-bottom:88px}.desktop-sidebar{display:none}.mobile-game-tools{left:50%;bottom:max(10px, env(safe-area-inset-bottom));z-index:8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#153f34ee;border:1px solid #ffffff20;border-radius:12px;grid-template-columns:repeat(3,1fr);width:min(94vw,520px);padding:6px;display:grid;position:fixed;transform:translate(-50%);box-shadow:0 12px 35px #001b1699}.mobile-game-tools button{color:#f2e9d8;background:0 0;border:0;border-right:1px solid #ffffff18;padding:11px 8px;font-weight:700;position:relative}.mobile-game-tools button:last-child{border-right:0}.mobile-game-tools span{color:#17392f;background:#d2a64e;border-radius:9px;place-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 4px;font-size:10px;display:inline-grid}.mobile-panel-backdrop{z-index:30;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#001b1699;display:block;position:fixed;inset:0}.mobile-game-panel{height:min(72dvh,580px);padding-bottom:env(safe-area-inset-bottom);background:#f8f0df;border-radius:18px 18px 0 0;flex-direction:column;display:flex;position:absolute;bottom:0;left:0;right:0;box-shadow:0 -15px 45px #001b1688}.mobile-panel-header{color:#173b31;text-transform:capitalize;border-bottom:1px solid #dacdaf;flex:none;justify-content:space-between;align-items:center;height:54px;padding:0 18px;display:flex}.mobile-panel-header b{font:600 21px Fraunces}.mobile-panel-header button{color:#173b31;background:#e9ddc5;border:0;border-radius:50%;width:34px;height:34px;font-size:24px;line-height:1}.mobile-panel-content{flex-direction:column;flex:1;gap:12px;min-height:0;padding:12px;display:flex}.mobile-panel-content>.panel{min-height:0}.mobile-panel-content>.moves,.mobile-panel-content>.chat{flex-direction:column;height:100%;display:flex}.mobile-panel-content>.moves>div,.mobile-panel-content>.chat>.messages{flex:1;height:auto;min-height:0;max-height:none}.mobile-panel-content .game-actions{margin-top:auto;position:static}.mobile-game-panel .chat form{padding:10px}.mobile-game-panel .chat input{font-size:16px}.mobile-game-panel .messages{overscroll-behavior:contain}.share-notice{top:76px}}@media (width<=520px){.game-layout{padding:4px 3px 82px}.status{margin-bottom:7px}.invite-banner{margin-bottom:3px;font-size:12px}.room-code{font-size:0}.room-code b{margin-left:0;font-size:12px}.header-share{margin-left:5px!important;padding:5px 7px!important}.account{gap:0}.account>b{display:none}.mobile-game-tools{bottom:max(6px, env(safe-area-inset-bottom));width:calc(100vw - 12px)}.mobile-game-panel{height:min(76dvh,620px)}.share-notice{white-space:nowrap;top:72px}}.mobile-account-menu{display:none;position:relative}.mobile-menu-trigger{color:#173b31;background:#d6ab54;border:0;border-radius:50%;width:36px;height:36px;font-weight:800}.mobile-menu-popover{z-index:40;color:#173b31;background:#faf3e3;border:1px solid #d9c8a7;border-radius:8px;width:180px;padding:12px;display:grid;position:absolute;top:46px;right:0;box-shadow:0 16px 40px #001b1688}.mobile-menu-popover small{color:#8b826f;font-size:10px}.mobile-menu-popover>b{text-overflow:ellipsis;margin:2px 0 10px;overflow:hidden}.mobile-menu-popover a,.mobile-menu-popover>button{color:#173b31;text-align:left;background:0 0;border:0;border-top:1px solid #e2d6bf;padding:11px 4px;font-weight:700;text-decoration:none}.mobile-menu-popover>button{color:#9c3f36}@media (width<=900px){.topbar>.account{display:none}.mobile-account-menu{display:block}input,textarea,select{font-size:16px}}.color-picker{max-width:480px;margin-top:22px}.color-picker>span{color:#9fb0a9;letter-spacing:1.7px;margin-bottom:8px;font-size:10px;font-weight:700;display:block}.color-picker>div{background:#ffffff09;border:1px solid #ffffff25;border-radius:7px;grid-template-columns:1fr 1fr;padding:4px;display:grid}.color-picker button{color:#c7d0cb;background:0 0;border:0;border-radius:4px;padding:8px;font-weight:700}.color-picker button.active{color:#173b31;background:#f5ecd9;box-shadow:0 3px 12px #001b1644}.color-picker i{vertical-align:-2px;margin-right:5px;font-size:19px;font-style:normal}.result-backdrop{z-index:60;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#001b16b8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.result-modal{text-align:center;color:#173b31;background:#faf3e3;border:1px solid #d5c49e;border-radius:12px;width:min(430px,100%);padding:34px;box-shadow:0 28px 80px #001510aa}.result-piece{color:#e5b95e;background:#173f34;border-radius:50%;place-items:center;width:74px;height:74px;margin:0 auto 14px;font-size:45px;display:grid}.result-modal>small{color:#a47c31;letter-spacing:2px;font-weight:800}.result-modal h2{margin:8px 0 5px;font:600 36px Fraunces}.result-modal p{color:#766e60;margin:0 0 24px}.result-modal>.primary{background:#174b3b}.result-secondary{grid-template-columns:1fr 1fr;gap:8px;margin-top:9px;display:grid}.result-secondary button{color:#52635d;background:0 0;border:1px solid #d8c9aa;border-radius:4px;padding:11px 6px}.result-secondary button:hover{color:#173b31;border-color:#b88d3c}@media (width<=520px){.color-picker{width:100%}.result-backdrop{align-items:end;padding:0}.result-modal{width:100%;padding:28px 20px calc(24px + env(safe-area-inset-bottom));border-radius:18px 18px 0 0}.result-piece{width:62px;height:62px;font-size:38px}.result-modal h2{font-size:31px}}
