:root{--bg1:#ffe7c2;--bg2:#bfe6f5;--ink:#3e2723;--muted:#8d6e63;--card:#fffdf8;--primary:#ff7043;--primary2:#f4511e;--warm:#ffb300;--good:#43a047;--danger:#e53935;--sea:#1e88e5;--radius:18px;--shadow:0 10px 30px #5e35162e, 0 2px 6px #5e35161f;color:var(--ink);-webkit-tap-highlight-color:transparent;font-family:Nunito,Trebuchet MS,Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:radial-gradient(1200px 600px at 10% -10%, #fff3d6 0%, transparent 60%), linear-gradient(160deg, var(--bg1), var(--bg2));min-height:100dvh}button,input,select{font:inherit;color:inherit}.muted{color:var(--muted)}.small{font-size:.85rem}.center{text-align:center}.err{color:var(--danger);min-height:1.2em;margin:.4rem 0 0;font-weight:700}.center-wrap{min-height:100dvh;padding:max(24px, env(safe-area-inset-top)) 16px 32px;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:24px;display:flex}.card{background:var(--card);box-shadow:var(--shadow);border:3px solid #fff;border-radius:26px;width:min(460px,100%);padding:24px}.card h2,.card h3{margin:18px 0 8px}.logo{letter-spacing:-.02em;background:linear-gradient(90deg,#e64a19,#ff8f00 50%,#1e88e5);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:2.6rem;font-weight:900}.logo.small{font-size:1.8rem}.logo.tiny{font-size:1.1rem}.tag{color:var(--muted);margin:4px 0 8px;font-weight:700}.hello{margin:4px 0}.home-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.hero-pawns{flex-wrap:wrap;justify-content:center;gap:2px;margin:10px 0 14px;display:flex}.hero-pawns img{width:52px;height:52px;animation:2.4s ease-in-out infinite bob;animation-delay:var(--d)}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}label{margin:10px 0;font-weight:700;display:block}input,select{background:#fff;border:2px solid #ead9c0;border-radius:14px;outline:none;width:100%;margin-top:4px;padding:12px 14px;font-size:1rem}input:focus,select:focus{border-color:var(--primary)}.btn{cursor:pointer;white-space:nowrap;background:#fff;border:2px solid #f1e2cb;border-radius:14px;min-height:44px;padding:11px 16px;font-weight:800;transition:transform 80ms,filter .15s;box-shadow:0 3px #e3cfb0,0 4px 10px #00000014}.btn:hover{filter:brightness(1.04)}.btn:active{transform:translateY(2px);box-shadow:0 1px #e3cfb0}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:linear-gradient(180deg, #ff8a65, var(--primary2));color:#fff;border-color:#e64a19;box-shadow:0 3px #bf360c,0 6px 14px #f4511e59}.btn.warm{background:linear-gradient(180deg, #ffd54f, var(--warm));border-color:#ffa000;box-shadow:0 3px #ff8f00}.btn.danger{color:var(--danger);background:#fff;border-color:#ffcdd2}.btn.ghost{box-shadow:none;color:var(--muted);background:0 0;border-color:#0000}.btn.big{width:100%;margin-top:10px;padding:14px 20px;font-size:1.08rem}.btn.tiny{min-height:32px;padding:4px 10px;font-size:.85rem}.btn-row{align-items:stretch;gap:8px;display:flex}.btn-row.wrap{flex-wrap:wrap}.btn-row .btn.big{flex:1;width:auto;margin-top:0}.tabs{background:#f6ebdb;border-radius:16px;gap:6px;margin:6px 0 4px;padding:5px;display:flex}.tab{cursor:pointer;background:0 0;border:0;border-radius:12px;flex:1;padding:10px;font-weight:800}.tab.on{color:var(--primary2);background:#fff;box-shadow:0 2px 6px #00000014}.ts{justify-content:center;min-height:70px;margin:6px 0;display:flex}.seg{background:#f6ebdb;border-radius:12px;gap:4px;padding:4px;display:inline-flex}.seg.wide{display:flex}.seg button{cursor:pointer;background:0 0;border:0;border-radius:9px;flex:1;padding:8px 12px;font-weight:800}.seg button.on{color:var(--primary2);background:#fff;box-shadow:0 2px 5px #00000014}.seg button:disabled{cursor:default}.join{gap:8px;margin-top:10px;display:flex}.join input{text-transform:uppercase;letter-spacing:.15em;margin:0;font-weight:800}.rules{margin-top:14px}.rules summary{cursor:pointer;color:var(--sea);font-weight:800}.rules-list{padding-left:18px;line-height:1.5}.badge{color:#e65100;vertical-align:middle;background:#ffe0b2;border-radius:99px;padding:2px 7px;font-size:.7rem;font-weight:800;display:inline-block}.badge.bot{color:#0277bd;background:#e1f5fe}.badge.good{color:#1b5e20;background:#c8e6c9}.badge.dark{color:#fff;background:#455a64}.lb table,.results{border-collapse:collapse;width:100%}.lb th,.lb td,.results th,.results td{text-align:left;border-bottom:1px dashed #ead9c0;padding:7px 6px}.lb th,.results th{color:var(--muted);font-size:.8rem}.lb tr.me td,.results tr.me td{background:#fff3e0;font-weight:800}.lb-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.lb-head h2{margin:0}.code-box{background:#fff3e0;border-radius:16px;flex-wrap:wrap;align-items:center;gap:10px;margin:10px 0;padding:12px 14px;display:flex}.code-box>div{flex:1}.code{letter-spacing:.2em;color:var(--primary2);font-size:2rem;font-weight:900}.members{margin:0 0 10px;padding:0;list-style:none}.members li{border-bottom:1px dashed #ead9c0;align-items:center;gap:10px;padding:6px 4px;display:flex}.members img{width:42px;height:42px}.members .nm{flex:1;font-weight:800}.pawn-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.pawn{cursor:pointer;background:#fff;border:2px solid #f1e2cb;border-radius:14px;flex-direction:column;align-items:center;padding:6px 4px;font-size:.78rem;font-weight:800;display:flex}.pawn img{width:58px;height:58px}.pawn.on{border-color:var(--primary);background:#fff3e0;box-shadow:0 0 0 3px #ffccbc}.pawn:disabled{opacity:.35;cursor:not-allowed}.waiting{text-align:center;color:var(--sea);margin-top:16px;font-weight:800;animation:1.6s infinite pulse}@keyframes pulse{50%{opacity:.5}}.conn{vertical-align:middle;background:#bdbdbd;border-radius:50%;width:10px;height:10px;margin:0 2px;display:inline-block}.conn.open{background:#4caf50;box-shadow:0 0 0 3px #c8e6c9}.conn.connecting{background:#ffb300;animation:1s infinite pulse}.conn.closed{background:#e53935}body.screen-game{overscroll-behavior:none;overflow:hidden}#stage{touch-action:none;position:fixed;inset:0}#stage canvas{width:100%;height:100%;display:block}#topbar{padding:calc(6px + env(safe-area-inset-top)) 10px 6px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:20;background:#fffdf8e0;justify-content:space-between;align-items:center;gap:8px;display:flex;position:fixed;top:0;left:0;right:0;box-shadow:0 2px 10px #00000014}.tb-left{align-items:center;gap:8px;display:flex}.room-code{letter-spacing:.12em;color:var(--muted);font-size:.85rem;font-weight:900}.tb-mid{text-align:center;flex-wrap:wrap;flex:1;justify-content:center;align-items:center;gap:8px;font-size:.95rem;font-weight:700;display:flex}.time-left{color:var(--primary2);min-width:40px;font-weight:900}.game-clock{color:var(--sea);font-size:.85rem;font-weight:800}.tb-right{gap:4px;display:flex}.icon-btn{cursor:pointer;background:#fff;border:0;border-radius:12px;width:40px;height:40px;font-size:1.1rem;position:relative;box-shadow:0 2px 5px #00000014}.icon-btn.off{opacity:.45}.icon-btn svg{vertical-align:middle;color:#5d4037}.icon-btn.on{box-shadow:0 0 0 2px var(--primary);background:#ffe0b2}.icon-btn.on svg{color:var(--primary2)}.unread:not(:empty){background:var(--danger);color:#fff;border-radius:99px;padding:1px 5px;font-size:.65rem;font-weight:900;position:absolute;top:-4px;right:-4px}#timebar{top:calc(52px + env(safe-area-inset-top));z-index:19;height:4px;position:fixed;left:0;right:0}#timefill{background:linear-gradient(90deg,#66bb6a,#ffca28);border-radius:0 3px 3px 0;height:100%;transition:width .25s linear}#timefill.warn{background:linear-gradient(90deg,#ff7043,#e53935)}.pc{color:var(--c);font-weight:900}.pc:before{content:"";background:var(--c);vertical-align:.05em;border-radius:50%;width:.6em;height:.6em;margin-right:3px;display:inline-block}.sqn{border-bottom:3px solid var(--g);font-weight:800}#players{left:10px;top:calc(66px + env(safe-area-inset-top));z-index:10;flex-direction:column;gap:8px;width:230px;max-height:calc(100dvh - 200px);display:flex;position:fixed;overflow-y:auto}.pcard{border-left:6px solid var(--c);cursor:pointer;background:#fffdf8f0;border-radius:16px;align-items:center;gap:8px;padding:6px 10px 6px 6px;transition:transform .2s;display:flex;box-shadow:0 3px 10px #0000001a}.pcard img{flex:none;width:44px;height:44px}.pcard.turn{box-shadow:0 0 0 3px var(--c), 0 6px 16px #0000002e;transform:translate(6px)}.pcard.me .pn:after{content:" (sen)";color:var(--muted);font-size:.75rem;font-weight:700}.pcard.out{opacity:.45;filter:grayscale(.8)}.pinfo{flex:1;min-width:0}.pn{white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;font-weight:900;overflow:hidden}.pm{color:var(--good);font-weight:900}.pp{flex-wrap:wrap;align-items:center;gap:2px;margin-top:2px;display:flex}.pp i{background:var(--g);border-radius:2px;width:9px;height:12px;display:inline-block}.pp i.mort{opacity:.35}.jc{font-size:.75rem}#actions{left:50%;bottom:calc(14px + env(safe-area-inset-bottom));z-index:45;box-shadow:var(--shadow);background:#fffdf8f2;border-radius:22px;flex-direction:column;align-items:center;gap:8px;min-width:280px;max-width:calc(100vw - 20px);padding:10px 12px;display:flex;position:fixed;transform:translate(-50%)}#actions .btn-row{flex-wrap:wrap;justify-content:center}#actions .btn.big{min-width:170px}.hint{text-align:center;font-size:.95rem;font-weight:700}#side{right:10px;top:calc(66px + env(safe-area-inset-top));z-index:12;width:300px;box-shadow:var(--shadow);background:#fffdf8f2;border-radius:18px;flex-direction:column;display:none;position:fixed;bottom:100px;overflow:hidden}#side.open{display:flex}.side-tabs{border-bottom:2px solid #f1e2cb;display:flex}.side-tabs button{cursor:pointer;background:0 0;border:0;flex:1;padding:10px;font-weight:800}.side-tabs button.on{color:var(--primary2);box-shadow:inset 0 -3px 0 var(--primary)}.side-tabs .x{flex:0 0 44px}.log,.chat{flex:1;padding:8px 12px;font-size:.86rem;line-height:1.45;overflow-y:auto}.log>div,.chat>div{border-bottom:1px dotted #f1e2cb;padding:3px 0}.lt{color:var(--muted);font-size:.78rem;font-weight:800}.chat-form{border-top:2px solid #f1e2cb;gap:6px;padding:8px;display:flex}.chat-form input{margin:0;padding:8px 10px}#sheetWrap{z-index:40;pointer-events:none;position:fixed;inset:0}.sheet-bg{pointer-events:auto;background:#3e272340;animation:.2s fade;position:absolute;inset:0}.sheet{background:var(--card);width:min(520px,100vw - 24px);max-height:calc(100dvh - 120px);box-shadow:var(--shadow);pointer-events:auto;border:3px solid #fff;border-radius:24px;flex-direction:column;animation:.22s cubic-bezier(.2,1.4,.4,1) pop;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.sheet.square{left:auto;right:16px;transform:translateY(-50%)}.sheet-body{padding:22px;overflow-y:auto}.sheet h2{margin:0 0 8px}.sheet-x{cursor:pointer;z-index:2;background:#f6ebdb;border:0;border-radius:50%;width:36px;height:36px;font-weight:900;position:absolute;top:10px;right:10px}@keyframes pop{0%{opacity:0;scale:.9}}@keyframes fade{0%{opacity:0}}.sq-head{background:var(--g);color:#fff;text-shadow:0 1px 2px #00000059;border-radius:21px 21px 0 0;margin:-22px -22px 12px;padding:18px 22px 14px}.sq-head h2{margin:0;font-size:1.6rem}.sq-group{opacity:.9;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:800}.price{font-size:1.1rem;font-weight:900}.desc{color:#5d4037;font-style:italic}.rent{border-collapse:collapse;width:100%;margin:6px 0}.rent td{border-bottom:1px dashed #ead9c0;padding:5px 8px}.rent td:last-child{text-align:right;font-weight:800}.rent tr.on td{color:var(--primary2);background:#fff3e0}.buy-box,.debt-box{background:#fff8e1;border:2px solid #ffe082;border-radius:16px;margin:10px 0;padding:12px}.mg{border:2px solid #f6ebdb;border-radius:14px;margin:10px 0;overflow:hidden}.mg-h{border-left:8px solid var(--g);background:#fffaf2;padding:8px 12px;font-weight:900}.mrow{border-top:1px dashed #ead9c0;padding:8px 12px}.mname{cursor:pointer;margin-bottom:6px;font-weight:800}.mrow .btn{min-height:36px;padding:6px 10px;font-size:.85rem}.tcols{grid-template-columns:1fr 1fr;gap:12px;display:grid}.tcol{background:#fffaf2;border-radius:14px;padding:10px}.tcol h4{margin:0 0 6px}.chips{flex-wrap:wrap;gap:6px;margin:6px 0;display:flex}.tchip{border:2px solid var(--g);cursor:pointer;background:#fff;border-radius:99px;align-items:center;gap:4px;margin:0;padding:5px 9px;font-size:.8rem;display:inline-flex}.tchip input{display:none}.tchip.on{background:var(--g);color:#fff}.tsum{background:#fffaf2;border-radius:14px;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0;padding:12px;display:grid}.tsum h4{margin:0 0 6px}.menu-list{flex-direction:column;gap:8px;display:flex}.over{text-align:center}.winner{background:linear-gradient(135deg,#fff8e1,#ffe0b2);border-radius:18px;justify-content:center;align-items:center;gap:12px;margin:10px 0 16px;padding:14px;display:flex}.winner img{width:80px;height:80px;animation:1.4s infinite bob}.wn{color:var(--primary2);font-size:1.6rem;font-weight:900}.over .results td,.over .results th{text-align:left}.over .btn-row{margin-top:16px}#cardPop{opacity:0;pointer-events:none;z-index:30;transition:all .35s cubic-bezier(.2,1.4,.4,1);position:fixed;top:30%;left:50%;transform:translate(-50%,-50%)scale(.6)}#cardPop.show{opacity:1;transform:translate(-50%,-50%)scale(1)rotate(-2deg)}.game-card{width:min(320px,80vw);box-shadow:var(--shadow);text-align:center;background:#fff;border:4px solid #ffb74d;border-radius:18px;padding:16px}.game-card.ruzgar{border-color:#4fc3f7}.game-card .deck{color:var(--primary2);text-transform:uppercase;letter-spacing:.1em;font-size:.85rem;font-weight:900}.game-card.ruzgar .deck{color:#0277bd}.game-card .txt{margin:10px 0;font-size:1.1rem;font-weight:800}#toasts{top:calc(70px + env(safe-area-inset-top));z-index:60;pointer-events:none;flex-direction:column;align-items:center;gap:6px;width:max-content;max-width:92vw;display:flex;position:fixed;left:50%;transform:translate(-50%)}.toast{color:#fff;box-shadow:var(--shadow);background:#3e2723;border-radius:14px;padding:10px 16px;font-weight:700;transition:opacity .4s,transform .4s;animation:.25s pop}.toast .pc{color:#fff}.toast.error{background:#c62828}.toast.good{background:#2e7d32}.toast.out{opacity:0;transform:translateY(-10px)}@media (width<=900px){#side{width:auto;top:auto;left:8px;right:8px;bottom:calc(150px + env(safe-area-inset-bottom));height:45dvh}.sheet.square{left:50%;right:auto;transform:translate(-50%,-50%)}}@media (width<=700px){.logo.tiny,.room-code{display:none}.icon-btn{border-radius:10px;width:36px;height:36px}.tb-right{gap:3px}#topbar{padding-left:8px;padding-right:8px}.tb-mid{justify-content:flex-start;font-size:.85rem}#timebar{top:calc(52px + env(safe-area-inset-top))}#players{width:auto;left:8px;right:8px;top:calc(58px + env(safe-area-inset-top));scrollbar-width:none;flex-direction:row;max-height:none;padding-bottom:4px;overflow:auto hidden}#players::-webkit-scrollbar{display:none}.pcard{flex:none;min-width:128px;padding:4px 8px 4px 4px}.pcard img{width:34px;height:34px}.pcard.turn{transform:translateY(2px)}.pn{max-width:90px;font-size:.78rem}.pp{display:none}#actions{min-width:0;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));border-radius:20px;transform:none}#actions .btn-row{width:100%}#actions .btn{flex:auto}.sheet,.sheet.square{left:6px;right:6px;bottom:calc(var(--actions-h,80px) + 14px + env(safe-area-inset-bottom));width:auto;max-height:calc(100dvh - var(--actions-h,80px) - 120px);border-radius:24px;animation:.25s ease-out up;top:auto;transform:none}@keyframes up{0%{opacity:.4;transform:translateY(40%)}}.tcols,.tsum{grid-template-columns:1fr}.card{padding:18px}.logo{font-size:2.1rem}.pawn img{width:48px;height:48px}}