:root{--navy:#2E5A87;--nd:#1d3c5c;--ndd:#132a42;--cream:#F4ECD8;--c2:#e6dcc0;--ochre:#E3A21A;--terra:#B4471C;--ink:#16263a;--tile:52px;--mini:16px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{overflow-x:hidden}
body{margin:0;font-family:"Trebuchet MS",Verdana,sans-serif;color:var(--cream);min-height:100vh;background:var(--navy);
background-image:radial-gradient(ellipse at 50% 30%,#ffffff12,#0000 60%,#00000044),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cpath d='M30 6l24 24-24 24L6 30z' fill='none' stroke='%23F4ECD8' stroke-opacity='.06' stroke-width='2'/%3E%3Ccircle cx='30' cy='30' r='3' fill='%23E3A21A' fill-opacity='.08'/%3E%3C/svg%3E")}
header{display:flex;align-items:center;gap:6px;padding:8px 10px;background:var(--ndd);border-bottom:3px solid #0c1c2c;flex-wrap:wrap;position:sticky;top:0;z-index:20}
.wm img{height:24px;display:block}.title{font-size:20px;letter-spacing:1px;color:var(--ochre)}.sp{flex:1}
.ptbadge{background:var(--ochre);color:var(--ink);font:bold 11px sans-serif;padding:3px 7px;border-radius:6px;letter-spacing:.5px;text-transform:uppercase}
button{font:bold 15px "Trebuchet MS",sans-serif;background:linear-gradient(#fbf5e6,#e3d7b8);color:var(--ndd);border:0;border-radius:10px;padding:9px 14px;min-height:44px;box-shadow:0 4px 0 #a99d7d;cursor:pointer;margin:3px;touch-action:manipulation}
button:active{transform:translateY(3px);box-shadow:0 1px 0 #a99d7d}button:disabled{opacity:.4;cursor:default;transform:none}
button.gold{background:linear-gradient(#f3c55a,var(--ochre));color:var(--ink);box-shadow:0 4px 0 #8a5f08}
button.big{font-size:17px;padding:11px 22px;min-height:50px}button.wide{width:100%}
button.warn{background:linear-gradient(#d9774f,var(--terra));color:#fff;box-shadow:0 4px 0 #6d2a10}
button.lest{background:linear-gradient(#ffffff,#f4ecd8);color:var(--terra);border:3px solid var(--terra);font-size:18px}
button.on{outline:3px solid var(--ochre)}
button.ic{width:44px;padding:0;font-size:19px;border-radius:50%}button.ic.off{opacity:.5;text-decoration:line-through}
.lbtn{font-size:13px}
main{display:grid;grid-template-columns:1fr 250px;gap:12px;padding:12px;max-width:1280px;margin:auto}
@media(max-width:900px){main{grid-template-columns:1fr;padding:8px}}
#table{min-width:0}
.panel{background:#00000030;border:1px solid #F4ECD822;border-radius:12px;padding:10px;margin-bottom:10px}
.zone{background:#0000002a;border:1px solid #F4ECD81a;border-radius:14px;padding:8px;margin-bottom:8px;min-width:0}
.zl{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:13px;color:var(--c2)}.small{font-size:12px;opacity:.8}
.t{display:inline-block;width:var(--tile);height:var(--tile);border-radius:5px;background:var(--tc) center/cover no-repeat;box-shadow:inset 0 0 0 1px #0004,0 2px 3px #0006;position:relative;font-style:normal;vertical-align:middle}
.t em{position:absolute;right:2px;bottom:1px;font:bold 10px sans-serif;color:#fff;text-shadow:0 0 3px #000;font-style:normal;opacity:.9}
.t.empty{background:#00000033;box-shadow:inset 0 0 0 1px #F4ECD826}
.press{display:flex;gap:5px;justify-content:center;flex-wrap:nowrap}
.pt{padding:3px;margin:0;min-height:0;border-radius:9px;background:#F4ECD81f;box-shadow:none;transition:transform .2s}
.pt.slot{width:calc(var(--tile) + 6px);height:calc(var(--tile) + 6px);border:2px dashed #F4ECD833;border-radius:9px}
.pt.sel{background:var(--ochre);transform:translateY(-8px);box-shadow:0 6px 12px #0008}.pt.bot{background:#fff}
.coachhi{animation:coach 1.1s ease-in-out infinite;outline:3px solid #fff;outline-offset:2px}
@keyframes coach{50%{outline-color:var(--ochre);transform:translateY(-4px)}}
.status{text-align:center;font-size:16px;font-weight:bold;margin:8px auto;padding:10px 12px;max-width:680px;min-height:46px;background:#0000003d;border-radius:12px;border-left:5px solid var(--ochre)}
.status small{display:block;font-weight:normal;font-size:12.5px;opacity:.85;margin-top:3px}
.coach{background:var(--ochre);color:var(--ink);border-radius:6px;padding:1px 6px;font-size:12px;margin-right:4px}
.dots3::after{content:'';animation:dots 1.2s steps(4) infinite}@keyframes dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
.acts{text-align:center;min-height:52px}
.taken{display:flex;justify-content:center;gap:6px;min-height:0}
.tk{padding:3px;min-height:0;position:relative;background:#F4ECD830;box-shadow:none}.tk.brk .t{filter:grayscale(.8) brightness(.6);transform:rotate(-8deg)}
.tk s{position:absolute;top:-6px;right:-6px;background:var(--terra);color:#fff;border-radius:8px;font:bold 11px sans-serif;padding:1px 4px;text-decoration:none}
.mezone{display:flex;gap:14px;justify-content:center;align-items:flex-start;margin:6px 0 10px;flex-wrap:wrap}
.mehead{margin-bottom:4px;text-align:center}
.board{display:grid;grid-template-columns:repeat(5,var(--tile));gap:4px;padding:8px;background:linear-gradient(#e9dfc4,#d5c7a2);border-radius:12px;box-shadow:inset 0 0 0 3px #b9a983,0 6px 14px #0007}
#floor .t{cursor:pointer}
.board .t.empty{background:#b9a98355;box-shadow:inset 0 0 0 1px #8f805c66}
.t.lastq{box-shadow:0 0 0 3px var(--ochre),0 2px 3px #0006}
.t.hi{box-shadow:0 0 0 3px #fff,0 0 14px #fff;animation:breathe 1.2s ease-in-out infinite}@keyframes breathe{50%{box-shadow:0 0 0 3px var(--ochre),0 0 18px var(--ochre)}}
.t.ghost{opacity:.75;transform:scale(.92);box-shadow:0 0 0 3px #fff}
.t.sw{outline:3px solid #fff}
.t.newt{animation:drop .45s cubic-bezier(.3,1.5,.5,1) both}@keyframes drop{0%{transform:translateY(-30px) scale(1.3);opacity:0}100%{transform:none;opacity:1}}
.t.glow{animation:glow .8s ease-in-out 3}@keyframes glow{50%{transform:scale(1.12);box-shadow:0 0 0 3px #fff,0 0 20px var(--ochre)}}
.t.used1::after,.t.used2::after{content:'';position:absolute;left:3px;top:3px;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 2px #000}
.t.used2::before{content:'';position:absolute;left:12px;top:3px;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 2px #000}
.meside{max-width:240px}.hand,.shop{display:flex;gap:6px;flex-wrap:wrap}
.mc{width:72px;cursor:pointer;text-align:center;font-size:11px;border-radius:8px;transition:transform .2s}.mc img{width:72px;border-radius:6px;display:block;box-shadow:0 2px 5px #0008}
.mc.can{outline:3px solid var(--ochre);outline-offset:1px;animation:coach 1.4s ease-in-out infinite}
.pubs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pc{background:var(--cream);color:var(--ink);border-radius:10px;padding:6px;text-align:center;position:relative;cursor:pointer;box-shadow:0 3px 6px #0007;border:2px solid #16263a}
.pc.gone{background:#00000022;border:2px dashed #F4ECD833;box-shadow:none;min-height:90px}
.pv{position:absolute;left:6px;top:3px;font:bold 20px Georgia,serif}.pn{font:bold 13px sans-serif;margin:2px 0 4px 16px}
.pg{display:grid;grid-template-columns:repeat(3,18px);gap:2px;justify-content:center}.pg .t{--tile:18px;border-radius:3px}.pg .t em{display:none}
.pg .hole{background:none;box-shadow:inset 0 0 0 1px #16263a55;border:1px dashed #16263a77}.pg .none{visibility:hidden}
.pc.priv{width:120px}.pc.big{width:140px}.pc.big .pg{grid-template-columns:repeat(3,28px)}.pc.big .pg .t{--tile:28px}
.pc.tiny{transform:scale(.8)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tray{display:flex;gap:6px;flex-wrap:wrap}.trt{padding:2px 6px 2px 2px;min-height:0;display:flex;align-items:center;gap:3px;background:#F4ECD826;color:var(--cream);box-shadow:none}.trt .t{--tile:28px}.trt.sel{background:var(--ochre)}
.opps{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:8px}
.opp{background:#0000002e;border:2px solid transparent;border-radius:12px;padding:6px 8px;text-align:center;transition:border-color .3s}
.opp.active{border-color:var(--ochre);box-shadow:0 0 16px #E3A21A55}
.oh{display:flex;gap:4px;justify-content:center;align-items:center;font-size:13px;margin-bottom:3px}
.board.mini{--tile:var(--mini);gap:2px;padding:4px;border-radius:6px;box-shadow:inset 0 0 0 2px #b9a983}.board.mini .t{border-radius:2px}.board.mini .t em{display:none}
.ostat{display:flex;gap:8px;justify-content:center;font-size:12px;margin-top:3px}
.lestTag{background:var(--terra);color:#fff;border-radius:5px;padding:0 5px;font-size:11px}
.sr{display:flex;justify-content:space-between;padding:5px 6px;border-radius:7px}.sr.active{background:#E3A21A33}
.log{font-size:12px;max-height:280px;overflow:auto;opacity:.9}.log div{padding:2px 0;border-bottom:1px solid #F4ECD812}
.ov{position:fixed;inset:0;background:#0b1828cc;display:flex;align-items:center;justify-content:center;z-index:50;padding:12px;overflow:auto}
.ov.hidden,.hidden{display:none!important}
.box{background:var(--cream);color:var(--ink);border-radius:18px;padding:18px;max-width:560px;width:100%;box-shadow:0 20px 50px #000a;text-align:center;max-height:94vh;overflow:auto;animation:pop .3s ease-out}
@keyframes pop{0%{transform:scale(.9);opacity:0}100%{transform:none;opacity:1}}
.box h2{margin:6px 0 10px;color:var(--navy)}.box .small{opacity:.75}.box hr{border:0;border-top:1px solid #16263a22;margin:14px 0}
.logo{max-width:220px;height:auto;border-radius:10px}.lead{font-size:16px;margin:6px 0 12px}
.seg,.seats{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}.seatrow{display:flex;align-items:center;gap:4px;width:100%;justify-content:center}
.segb{font-size:14px;min-height:40px;padding:6px 12px}.segb.on{background:linear-gradient(#f3c55a,var(--ochre))}
.btns{display:flex;justify-content:center;flex-wrap:wrap;gap:4px;margin-top:10px}
.pick2,.row3{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.pickpc{background:none;box-shadow:none;padding:2px}.pickpc.on .pc{outline:4px solid var(--ochre)}
.row3 .pc{width:90px}
.key{display:inline-block;background:var(--navy);color:var(--cream);font:bold 13px monospace;letter-spacing:3px;padding:6px 16px;border-radius:7px}
.sum{text-align:left;padding-left:18px;line-height:1.45;font-size:15px}.sum li{margin-bottom:7px}
.zoomc,#zoomI{max-width:min(320px,90vw);border-radius:12px}
.boards{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:8px}.fb{padding:6px;border-radius:10px}.fb.win{background:#E3A21A55}.fb .board.mini{--mini:14px;margin:4px auto}
.sct{width:100%;border-collapse:collapse;font-size:14px}.sct td,.sct th{padding:4px 6px;border-bottom:1px solid #16263a1c;text-align:center}.sct td:first-child{text-align:left}
.sct .neg{color:var(--terra)}.sct .pos{color:#1d6b3a}.sct .tot td{font-weight:bold;font-size:16px;border-top:2px solid var(--ink)}
.banner{position:fixed;left:50%;top:38%;transform:translate(-50%,-50%);z-index:60;background:var(--ochre);color:var(--ink);border-radius:18px;padding:12px 28px;text-align:center;box-shadow:0 12px 30px #000a;pointer-events:none}
.banner b{display:block;font:bold 40px Georgia,serif}.banner.pop{animation:bpop 1.2s ease both}@keyframes bpop{0%{transform:translate(-50%,-50%) scale(.4);opacity:0}15%{transform:translate(-50%,-50%) scale(1.08);opacity:1}80%{opacity:1}100%{transform:translate(-50%,-80%) scale(1);opacity:0}}
.toast{position:fixed;left:50%;bottom:18px;transform:translate(-50%,40px);opacity:0;background:var(--ndd);color:var(--cream);border:2px solid var(--ochre);border-radius:12px;padding:10px 16px;z-index:70;max-width:92vw;text-align:center;transition:.25s;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}.toast.bad{border-color:var(--terra);animation:shake .35s}
@keyframes shake{25%{margin-left:-6px}75%{margin-left:6px}}
.fx{position:fixed;inset:0;pointer-events:none;z-index:55;overflow:hidden}.fx i{position:absolute;top:-30px;width:22px;height:22px;background-size:cover;border-radius:3px;animation:fall 2s linear forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(540deg)}}
@media(max-width:900px){aside{order:2}}
@media(max-width:600px){:root{--tile:calc((100vw - 76px)/8.6)} .board{--tile:min(54px,calc((100vw - 60px)/5.4))}
 .press{gap:3px}.pt{padding:2px}.title{font-size:17px}header{gap:3px}header button{padding:6px 10px}.wm img{height:20px}
 .pubs{grid-template-columns:repeat(4,1fr);gap:4px}.pc{padding:3px}.pn{font-size:10px;margin-left:12px}.pv{font-size:15px}.pg{grid-template-columns:repeat(3,13px)}.pg .t{--tile:13px}
 .meside{max-width:100%;display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center}.meside .zl{width:100%;justify-content:center}
 .mc{width:58px}.mc img{width:58px}.status{font-size:14.5px}}