:root{--bg:#121016;--bg2:#1a171f;--panel:#1f1b25;--panel2:#2b2532;--line:#4a4050;--text:#ede6da;--muted:#a99f93;--brass:#c9a35a;--brass2:#ecd08c;--pick:#6dffa8;--sel:#ffd76a;--bad:#ff8a7a;--head:"Cinzel", "Georgia", serif;--body:"Alegreya Sans", "Segoe UI", sans-serif;--app-h:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(ellipse at 30% 0%, #2a2230 0%, var(--bg) 60%) fixed;color:var(--text);font-family:var(--body);font-size:15px}a{color:var(--brass2)}button{font-family:var(--body);background:var(--panel2);color:var(--text);border:1px solid var(--line);cursor:pointer;border-radius:6px;padding:6px 12px;font-size:15px;font-weight:700}button:hover:not(:disabled){border-color:var(--brass);background:#362e3e}button:disabled{opacity:.45;cursor:default}button.primary{border-color:var(--brass2);color:#1b1408;background:linear-gradient(#b8893c,#8a6224)}button.primary:hover:not(:disabled){background:linear-gradient(#cf9d4a,#9c6f2a)}button.small{padding:3px 8px;font-size:13px}input,select{font-family:var(--body);color:var(--text);border:1px solid var(--line);background:#0d0b10;border-radius:6px;padding:7px 9px;font-size:15px}h1,h2,h3{font-family:var(--head);color:var(--brass2);font-weight:600}h3{margin:14px 0 6px;font-size:16px}em{color:var(--muted);font-size:13px}.hint{color:var(--muted)}.warn{color:var(--bad)}.check{cursor:pointer;align-items:center;gap:6px;margin:4px 0;display:flex}.check.small,.fine{color:var(--muted);font-size:13px}.center-msg{height:100%;font-family:var(--head);place-items:center;font-size:22px;display:grid}.toast{top:calc(14px + env(safe-area-inset-top,0px));border:1px solid var(--bad);z-index:100;cursor:pointer;background:#6a2416;border-radius:8px;max-width:calc(100vw - 24px);padding:10px 16px;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 6px 24px #00000080}.conn-banner{z-index:100;background:#5a4210;border-radius:6px;padding:6px 12px;position:fixed;bottom:10px;right:10px}.tok{vertical-align:-2px}.vp-badge{color:#fff;clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);background:#111;place-items:center;font-weight:700;display:inline-grid}.dot{border:1px solid #0008;border-radius:50%;display:inline-block}.logo{flex-direction:column;align-items:flex-start;margin:6px 0 10px;line-height:1;display:flex}.logo-brass{font-family:var(--head);letter-spacing:.32em;color:#f3eee6;font-size:54px;font-weight:500}.logo-bham{font-family:var(--head);letter-spacing:.32em;color:var(--brass2);border-top:1px solid var(--brass);margin-top:4px;padding-top:6px;font-size:19px}.logo.small .logo-brass{font-size:34px}.logo.small .logo-bham{font-size:13px}.landing{place-items:center;min-height:100%;padding:24px 16px;display:grid}.landing:before{content:"";z-index:-1;filter:brightness(.42)blur(2px);background:url(/assets/board/board-2k.webp) 50% 40%/cover;position:fixed;inset:0}.landing-card{border:1px solid var(--line);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#121016eb;border-radius:14px;width:min(820px,100%);padding:26px 30px;box-shadow:0 20px 60px #0009}.landing-box{float:right;width:170px;margin:-6px -6px 10px 16px}.sub{color:var(--muted);margin-top:0}.landing label{color:var(--muted);margin:10px 0;display:block}.landing label input:not([type=checkbox]){width:100%;margin-top:4px;display:block}.landing label.check{align-items:flex-start;display:flex}.landing-cols{clear:both;grid-template-columns:1fr 1.4fr;gap:24px;display:grid}@media (width<=640px){.landing-card{padding:18px 16px}.landing-cols{grid-template-columns:1fr}.landing-box{width:110px}.logo-brass{font-size:40px}}.code-input{width:100%;font-family:var(--head);letter-spacing:.2em;text-transform:uppercase;margin-bottom:8px;font-size:22px}.options-form{flex-direction:column;gap:2px;margin-bottom:10px;display:flex}.my-tables{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.my-tables h3{margin-right:6px}.seats{padding:0;list-style:none}.seats li{align-items:center;gap:8px;padding:4px 0;display:flex}.seat-char{width:34px;height:34px}.seats em.off{color:var(--bad)}.color-pick{align-items:center;gap:8px;margin:10px 0;display:flex}.swatch{border-radius:50%;width:28px;height:28px;padding:0}.lobby-actions{justify-content:flex-end;gap:10px;margin-top:14px;display:flex}.linkbtn{border:1px dashed var(--line);color:var(--brass2);word-break:break-all;background:0 0;font-weight:400}.notify-btn{margin:8px 0}.notify-hint{color:var(--muted);font-size:13px}button.textlink{color:var(--brass2);background:0 0;border:none;padding:0;font-weight:500}.game{margin-top:env(safe-area-inset-top,0px)}.topbar{background:#0c0a0f;border-bottom:1px solid #3a3040;align-items:center;gap:14px;height:44px;padding:4px 10px;display:flex}.brand{background:0 0;border:none;flex-direction:column;align-items:flex-start;padding:0 6px 0 0;line-height:1;display:flex}.brand-brass{font-family:var(--head);letter-spacing:.3em;font-size:17px;font-weight:500}.brand-bham{font-family:var(--head);letter-spacing:.25em;color:var(--brass2);font-size:8.5px}.phase{font-family:var(--head);color:var(--brass2);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:15px;overflow:hidden}.top-right{align-items:center;gap:12px;font-size:13px;display:flex}.roomcode{color:var(--muted)}.main{gap:10px;padding:8px;display:flex}.game.wide .main{height:calc(var(--app-h) - 44px)}.game.wide .board-col{width:min(calc(var(--app-h) - 60px), calc(100vw - 390px));scrollbar-width:none;flex-direction:column;flex:none;gap:8px;display:flex;overflow-y:auto}.game.wide .board-col .board-outer{flex:none}.game.wide .side-col{flex:1;min-width:360px;padding-right:2px;overflow-y:auto}.game.narrow .main{flex-direction:column;padding:6px}.game.narrow .topbar .roomcode{display:none}@media (width<=560px){.topbar{gap:8px}.phase{font-size:12.5px}.brand-bham{display:none}}.side-col{flex-direction:column;gap:8px;display:flex}.box-title{font-family:var(--head);color:var(--brass2);margin-bottom:4px;font-size:13px}.board-outer{touch-action:pan-y;-webkit-user-select:none;user-select:none;background:#08070a;border-radius:8px;width:100%;position:relative;overflow:hidden}.game.wide .board-outer{touch-action:none}.board-inner{transform-origin:0 0;position:absolute;top:0;left:0}.board-img{pointer-events:none;width:4096px;height:4096px;position:absolute;top:0;left:0}.b-slot{border-radius:16px;position:absolute}.b-slot img{pointer-events:none;border-radius:14px;width:100%;height:100%;box-shadow:6px 8px 14px #000000bf}.b-slot.sel{cursor:pointer;box-shadow:0 0 0 12px var(--sel), 0 0 60px 20px #ffd76a99;z-index:3;animation:1.3s ease-in-out infinite glow}.b-slot.picked{box-shadow:0 0 0 14px var(--pick), 0 0 60px 24px #6dffa899;z-index:4;animation:none}.b-slot.hl:not(.sel):not(.picked){box-shadow:0 0 0 10px var(--hl,#fff), 0 0 40px 10px var(--hl,#fff)}@keyframes glow{50%{box-shadow:0 0 0 12px var(--sel), 0 0 30px 6px #ffd76a4d}}.b-cubes{pointer-events:none;filter:drop-shadow(3px 4px 3px #000c);flex-wrap:wrap-reverse;justify-content:flex-end;gap:2px;width:150px;display:flex;position:absolute;bottom:6px;right:6px}.b-used{color:#fff;z-index:5;pointer-events:none;background:#c8352a;border:4px solid #fff;border-radius:40px;padding:0 16px;font-size:46px;font-weight:700;position:absolute;top:-26px;right:-26px}.b-link{border-radius:16px;position:absolute}.b-link img{pointer-events:none;border-radius:12px;width:100%;height:100%;box-shadow:4px 6px 10px #000c}.b-link.sel{cursor:pointer;box-shadow:0 0 0 9px var(--sel), 0 0 40px 14px #ffd76a8c;z-index:3;background:#ffd76a59;animation:1.3s ease-in-out infinite glow}.b-link.picked{cursor:pointer;box-shadow:0 0 0 10px var(--pick);z-index:4;animation:none}.b-link.hl:not(.sel):not(.picked){box-shadow:0 0 0 8px var(--hl,#fff), 0 0 30px 8px var(--hl,#fff)}.b-merchant img{pointer-events:none;border-radius:14px;width:100%;height:100%}.b-merchant,.b-beer,.b-cube,.b-marker,.b-char,.b-pile{position:absolute}.b-beer{filter:drop-shadow(3px 5px 4px #000)}.b-beer.used{opacity:.3}.b-cube{filter:drop-shadow(3px 4px 3px #000c);pointer-events:none}.b-marker{z-index:2;border:7px solid #15121a;border-radius:50%;box-shadow:3px 5px 8px #000c}.b-marker.income{border-radius:12px;transform:rotate(45deg)scale(.82)}.b-char{z-index:2;background:#000;border:9px solid;border-radius:50%}.b-char img{pointer-events:none;border-radius:50%;width:100%;height:100%}.b-char.now{box-shadow:0 0 50px 18px var(--sel)}.b-spent{color:var(--sel);font:700 50px var(--head);border:4px solid var(--brass);white-space:nowrap;background:#2a2018;border-radius:24px;padding:0 18px;position:absolute;bottom:-38px;left:50%;transform:translate(-50%)}.b-pile{pointer-events:none;place-items:center;display:grid}.b-pile img{border-radius:16px;width:300px;box-shadow:8px 10px 20px #000c}.b-count{font:700 72px var(--head);color:var(--sel);background:#000000bf;border-radius:40px;padding:0 26px;position:absolute;bottom:18px;right:8px}.b-pile-label{font:600 38px var(--head);color:#e6d6b6;white-space:nowrap;background:#000000b3;border-radius:12px;padding:2px 16px;position:absolute;top:-6px}.zoom-btns{z-index:5;flex-direction:column;gap:4px;display:flex;position:absolute;top:8px;right:8px}.zoom-btns button{background:#141118d9;width:34px;height:34px;padding:0;font-size:20px}.prompt{background:var(--panel);border:1px solid var(--line);border-radius:8px;align-items:flex-start;gap:10px;padding:10px;display:flex}.prompt>:first-child{flex:1;min-width:0}.prompt.active{border-color:var(--brass);box-shadow:inset 4px 0 0 var(--brass)}.prompt-text{margin-bottom:6px;line-height:1.4}.prompt-text.wait{color:var(--muted);margin:0}.prompt-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.prompt-row .prompt-text{flex:1;margin:0}.undo{flex:none}.action-grid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px;display:grid}.action-btn{text-align:left;flex-direction:column;align-items:flex-start;gap:2px;padding:7px 9px;display:flex}.action-btn b{font-family:var(--head);color:var(--brass2);font-size:15px}.action-btn small{color:var(--muted);font-size:12px;font-weight:400;line-height:1.2}.draft{flex-direction:column;gap:8px;display:flex}.draft-head{flex-wrap:wrap;align-items:baseline;gap:10px;display:flex}.draft-head b{font-family:var(--head);color:var(--brass2);font-size:18px}.draft-btns{justify-content:flex-end;gap:8px;display:flex}.choice-row{flex-wrap:wrap;gap:6px;display:flex}.tile-btn{align-items:center;gap:8px;padding:4px 10px 4px 4px;font-weight:500;display:flex}.tile-btn img{border-radius:6px;width:48px;height:48px}.tile-btn.small img{width:34px;height:34px}.tile-line{align-items:flex-start;gap:10px;display:flex}.mini-tile{border-radius:6px;flex:none;width:52px;height:52px}.mini-card{vertical-align:middle;border-radius:3px;width:30px}.card-line,.chips{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.chip{border-radius:14px;padding:2px 9px;font-size:13px;font-weight:500}.chip.on{border-color:var(--pick);background:#2f6a46}.result{border-radius:6px;padding:8px 10px;font-size:14px}.result.ok{background:#1d2a22;border:1px solid #3b6b4c}.result.bad{color:#ffcfc6;background:#3a1d1a;border:1px solid #8a3a30}.result ul.what{margin:0 0 4px;padding-left:18px}.result .cost{color:var(--brass2)}.plans{flex-direction:column;gap:2px;margin-bottom:6px;display:flex}.plan{cursor:pointer;align-items:flex-start;gap:6px;display:flex}.sales{flex-direction:column;gap:6px;display:flex}.sale{align-items:flex-start;gap:8px;display:flex}.beer-pick{max-width:100%;margin-top:4px;padding:3px 6px;font-size:13px;display:block}.glo{flex-wrap:wrap;align-items:center;gap:4px;margin-top:4px;display:flex}.hand-box,.mat-box,.players{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px}.hand{grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;display:grid}.card{background:0 0;border:2px solid #0000;border-radius:6px;min-width:0;padding:0;transition:transform .12s}.card img{border-radius:4px;width:100%;display:block}.card.ok.picking{border-color:#ffd76acc}.card.sel{border-color:var(--pick);transform:translateY(-5px);box-shadow:0 6px 16px #6dffa859}.card.no{opacity:.35}.card:hover:not(:disabled){background:0 0;transform:translateY(-3px)}.hand>.hint{grid-column:1/-1}.card-cap{color:var(--text);text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-size:11px;font-weight:500;line-height:1.1;display:block;overflow:hidden}@media (width<=560px){.hand{gap:3px}.card-cap{font-size:9.5px}}.players{flex-direction:column;gap:5px;display:flex}.pcard{text-align:left;background:var(--bg2);border-left-width:4px;align-items:center;gap:8px;width:100%;padding:5px 8px;font-weight:400;display:flex}.pcard.turn{box-shadow:inset 0 0 0 1px var(--brass);background:#2c2620}.pcard.viewing{outline:1px dashed var(--muted)}.pc-char{flex:none;width:44px;height:44px}.pc-main{flex:1;min-width:0}.pc-name{align-items:center;gap:6px;display:flex}.pc-name b{font-family:var(--head);font-size:14px}.pc-order{background:#3a3040;border-radius:50%;place-items:center;width:18px;height:18px;font-size:11px;font-weight:700;display:inline-grid}.pc-stats{flex-wrap:wrap;gap:10px;font-size:14px;display:flex}.pc-stats.small{color:var(--muted);font-size:12.5px}.pc-discard{border-radius:3px;flex:none;width:34px}.mat{width:100%;position:relative}.mat-img{border-radius:6px;width:100%;height:100%;position:absolute;inset:0}.mat-tile{aspect-ratio:1;background:0 0;border:none;border-radius:4px;padding:0;position:absolute}.mat-tile:hover:not(:disabled){background:0 0}.mat-tile img{border-radius:4px;width:100%;height:100%;display:block;box-shadow:2px 2px #1a1a1a,4px 4px #00000073}.mat-tile.next img{box-shadow:0 0 0 2px #ffd76ad9,3px 3px #000}.mat-tile.blocked img{filter:grayscale(.7)brightness(.65)}.mat-tile.sel{cursor:pointer;z-index:2}.mat-tile.sel img{box-shadow:0 0 0 3px var(--pick), 0 0 14px 4px #6dffa899}.mat-n{color:#fff;background:#000d;border-radius:8px;padding:0 4px;font-size:11px;font-weight:700;position:absolute;top:-5px;right:-5px}.takeover{margin:0 4px}.tabs{gap:4px;display:flex}.tabs button{border-radius:6px 6px 0 0;flex:1}.tabs button.on{background:var(--panel);border-color:var(--brass)}.log{background:var(--panel);border:1px solid var(--line);border-radius:0 0 8px 8px;flex:none;height:260px;padding:6px;font-size:13.5px;overflow-y:auto}.logline{border-left:3px solid #0000;padding:2px 6px}.logline.hdr{font-family:var(--head);color:var(--brass2);margin-top:6px;font-size:13px}.chat{flex-direction:column;display:flex}.chat form input{width:100%;margin-top:4px}.modal-bg{z-index:50;background:#000a;place-items:center;display:grid;position:fixed;inset:0}.modal{background:var(--bg2);border:1px solid var(--brass);border-radius:12px;max-width:95vw;max-height:90vh;padding:20px;overflow:auto}.scores{border-collapse:collapse;margin:10px 0}.scores th,.scores td{text-align:right;border-bottom:1px solid var(--line);padding:4px 12px}.scores th{font-family:var(--head)}.scores td:first-child{text-align:left;color:var(--muted)}.scores tr.total td{font-family:var(--head);color:var(--brass2);font-size:18px}.reopen-scores{z-index:30;position:fixed;bottom:20px;right:16px}.preview{z-index:60;border:1px solid var(--brass);pointer-events:none;background:#141017f5;border-radius:10px;max-width:300px;padding:8px;position:fixed;box-shadow:0 10px 40px #000c}.preview.wide{max-width:420px}.preview img{object-fit:contain;border-radius:6px;width:100%;max-height:46vh;margin-bottom:6px;display:block}.preview-text b{font-family:var(--head);color:var(--brass2)}.preview-text p{margin:4px 0 0;line-height:1.35}.preview.touch{pointer-events:auto;max-width:92vw;transform:translate(-50%,-50%);top:50%!important;left:50%!important}.preview-backdrop{z-index:59;background:#0007;position:fixed;inset:0}.preview-hint{color:var(--muted);margin-top:6px;display:block}.aid-modal{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:12px;display:flex}.aid-modal img{border-radius:8px;max-width:min(46vw,520px);max-height:80vh}.aid-modal button{flex-basis:100%;max-width:120px}@media (width<=700px){.aid-modal img{max-width:100%;max-height:none}}@media (width<=560px){.action-grid{grid-template-columns:repeat(4,1fr)}.action-btn small{display:none}.action-btn{align-items:center;padding:8px 4px}.action-btn b{font-size:13px}.top-right .long{display:none}}@media (width>=561px){.top-right .short{display:none}}.money img{vertical-align:-2px;width:15px;height:15px;margin-right:3px}
