:root{color-scheme:dark;--table:#192e32;--ink:#e9eee7;--muted:#a1b5ad;--accent:#e5be63;--board:#edf0e5;--board-ink:#243734;--app-height:100dvh;--header-height:40px;font:13px/1.4 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--table)}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}a{color:inherit}h1,h2,h3,p{margin:0}h1{font-size:23px;font-weight:600}h2{font-size:16px;font-weight:600}h3{font-size:14px}[hidden]{display:none!important}
.topbar{height:var(--header-height);max-width:800px;margin:auto;padding:0 10px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:7px;text-decoration:none;font-size:17px;font-weight:650}.brand img{width:23px;height:23px;border-radius:3px}.app-controls{display:flex;align-items:center;gap:9px}.icon-button,.quiet{background:none;border:0;border-radius:3px;color:inherit;padding:4px 7px}.icon-button{height:28px;min-width:28px;font-size:16px}.icon-button:hover,.quiet:hover{background:#ffffff12}.connection{font-size:0;display:flex;align-items:center;gap:5px}.connection::before{content:"";width:6px;height:6px;border-radius:50%;background:#9bc6a4}.connection.offline,.connection.pending{font-size:10px}.connection.offline::before{background:#ed9285}.connection.pending::before{background:var(--accent)}
.game-menu{position:relative;z-index:8}.game-menu summary{cursor:pointer;list-style:none;font-size:18px;line-height:28px;width:28px;text-align:center}.game-menu summary::-webkit-details-marker{display:none}.menu-items{position:absolute;right:0;top:33px;min-width:170px;border:1px solid #5a7068;border-radius:5px;background:#243b3d;box-shadow:0 6px 18px #0005;padding:4px}.menu-items button{display:block;width:100%;text-align:left;background:none;border:0;border-radius:3px;padding:9px 11px}.menu-items button:hover{background:#ffffff12}.menu-items button:disabled{opacity:.4}
.primary,.secondary{min-height:36px;border-radius:4px;border:1px solid #75958a;padding:7px 14px;font-weight:600;white-space:nowrap}.primary{background:var(--accent);color:#25362f;border-color:var(--accent)}.secondary{background:#2a4343;color:var(--ink)}.primary:hover{background:#f0cd7b}.secondary:hover{background:#385151}.primary:disabled,.secondary:disabled{opacity:.4}.full{width:100%}.home{min-height:calc(var(--app-height) - var(--header-height));display:grid;place-items:center;padding:15px}.setup-card{width:min(100%,360px);border:1px solid #4e6861;border-radius:6px;padding:22px;background:#20383a}.setup-card h1{margin-bottom:18px}label{display:block;font-size:12px}input:not([type=radio]),select{display:block;width:100%;height:36px;border:1px solid #56746b;border-radius:3px;background:#192e32;color:var(--ink);padding:6px 9px;margin-top:5px}fieldset{border:0;padding:0;margin:15px 0}legend{font-size:12px;margin-bottom:6px}.mode-picker>div{display:flex;gap:3px;background:#172d2f;padding:3px;border-radius:4px}.mode-picker label{flex:1;text-align:center;position:relative;cursor:pointer;font-size:11px}.mode-picker input{position:absolute;opacity:0}.mode-picker span{display:block;padding:8px 2px;border-radius:3px}.mode-picker input:checked+span{background:#4c6e60;color:#fff}.mode-picker input:focus-visible+span{outline:2px solid var(--accent)}.form-pair{display:flex;gap:12px;margin-bottom:17px}.form-pair label{flex:1}.join-divider{border-top:1px solid #4c655d;margin:18px 0}.join-form{display:flex;gap:7px}.join-form input{margin:0;min-width:0;text-transform:uppercase;letter-spacing:1px}.recent-tables{font-size:11px;margin-top:15px}.recent-tables:empty{display:none}.recent-tables p{color:var(--muted);margin-bottom:5px}.recent-tables button{display:inline-block;border:0;background:none;color:#d0dfcf;padding:4px 8px 4px 0;text-decoration:underline;text-underline-offset:3px}

body.in-game{height:var(--app-height);overflow:hidden}.table{max-width:720px;margin:0 auto;padding:0 8px 6px}body.in-game .table{height:calc(var(--app-height) - var(--header-height));display:flex;flex-direction:column;gap:4px}.table-heading{min-height:23px;display:flex;align-items:center;gap:9px;flex-shrink:0;padding:0 3px;font-size:11px}#table-title{white-space:nowrap;font-weight:600}#table-kind{margin-left:auto;color:#9bb1a7;font-size:10px}#turn-banner{display:flex;align-items:center;gap:5px;min-width:0;color:#a8c9b8;white-space:nowrap;overflow:hidden;font-size:11px}#turn-banner .tile-art{width:17px;height:17px}#turn-banner .quiet{padding:0 4px;line-height:20px;font-size:16px}#turn-banner.own-turn{color:#f2d283}.game-layout{flex:1;min-height:0;display:grid;grid-template-rows:auto auto auto;align-content:start;gap:5px}.market{padding:4px 2px 0;min-height:0}.factories{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;max-width:100%;margin:0 auto}.factory{width:var(--factory-size,62px);height:var(--factory-size,62px);background:#2b4444;border:1px solid #526e63;border-radius:50%;display:grid;place-items:center;position:relative;flex-shrink:0}.factory.empty{border-style:dashed;opacity:.35;background:transparent}.factory-tiles{display:grid;grid-template-columns:repeat(2,var(--draft-size,23px));gap:3px}.factory-number{position:absolute;top:-1px;left:-3px;font-size:8px;color:#acc0b5;background:var(--table);border-radius:50%;padding:0 2px;line-height:11px}.draft-tile{width:var(--draft-size,23px);height:var(--draft-size,23px);border:0;padding:0;border-radius:3px;background:none;transition:transform .1s}.tile-art{display:block;width:100%;height:100%;object-fit:cover;border-radius:3px;pointer-events:none}.draft-tile:hover:not(:disabled){transform:translateY(-2px)}.draft-tile.selected{outline:2px solid #ffdc81;outline-offset:2px}.draft-tile.dimmed{opacity:.4}.center-pool{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px;min-height:0;padding:3px 0}.marker{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid #cf9f42;background:#f2d681;color:#523c11;font-size:13px;font-weight:650;flex-shrink:0}

.player-board{--cell:24px;color-scheme:light;min-height:0;background:var(--board);color:var(--board-ink);border-radius:4px;padding:5px 8px;display:flex;flex-direction:column;overflow:hidden;border:1px solid #90a99a}.opponent-board{background:#d5dfd1;touch-action:pan-y;user-select:none;-webkit-user-select:none}.player-board[data-turn=true]{border-color:#e9c35b;box-shadow:inset 0 0 0 1px #e9c35b}.board-header{height:23px;flex-shrink:0;display:flex;align-items:center;gap:8px;width:min(100%,calc(10 * var(--cell) + 57px));margin:0 auto 2px}.board-name{font-size:13px;font-weight:600;line-height:21px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.board-name.active::before{content:"";display:inline-block;height:5px;width:5px;border-radius:50%;background:#587946;margin-right:5px;vertical-align:2px}.board-score{margin-left:auto;font-size:19px;font-weight:650;font-variant-numeric:tabular-nums;line-height:22px}.carousel-controls{display:flex;align-items:center;margin-left:auto;gap:3px}.carousel-controls+.board-score{margin-left:9px}.carousel-arrow{border:0;background:transparent;color:#365245;width:24px;height:23px;padding:0;line-height:20px;font-size:22px;border-radius:3px}.carousel-arrow:hover{background:#799a7c33}.carousel-dots{display:flex;align-items:center;gap:3px}.carousel-dot{width:13px;height:19px;padding:4px;background:none;border:0}.carousel-dot::after{display:block;content:"";width:5px;height:5px;border-radius:50%;background:#a2b5a2}.carousel-dot.active::after{background:#35574c}.board-grid{flex:none;min-height:0;width:min(100%,calc(10 * var(--cell) + 57px));margin:0 auto;display:grid;grid-template-rows:repeat(5,var(--cell));gap:3px}.board-row{display:grid;grid-template-columns:minmax(0,1fr) 15px minmax(0,1fr);gap:5px;align-items:center;min-height:0}.pattern-row{width:100%;line-height:1;display:flex;align-items:center;justify-content:flex-end;gap:3px;height:100%;min-height:0;border:1px solid transparent;background:transparent;border-radius:3px;padding:0 2px}.row-index{font-size:8px;color:#697c68;margin-right:auto}.pattern-row.legal{border-color:#89a56d;background:#d4e1bb;cursor:pointer}.pattern-row.legal:hover{border-color:#517340;background:#c0d395}.pattern-row.invalid{opacity:.4}.pattern-row .preview-tile{opacity:.4}.row-arrow{font-size:min(12px,var(--cell));line-height:1;height:var(--cell);display:grid;place-items:center;text-align:center;color:#9ba88e}.row-arrow.ready{color:#4d713b}.wall-row{display:flex;gap:3px;align-items:center;height:var(--cell)}.slot{width:var(--cell);height:var(--cell);flex-shrink:0;display:inline-block;position:relative;border:1px solid #c3cdb9;background:#dce3d1;border-radius:3px}.wall-slot.empty .tile-art{opacity:.19}.wall-slot.filled{border-color:#637969}.wall-slot.target{outline:1px solid #688f45}.wall-slot.target .tile-art{opacity:.55}.wall-slot.newly-placed{border-color:#c59932;box-shadow:0 0 0 1px #c59932}.preview-points{position:absolute;right:-3px;top:-3px;background:#4f6c3f;color:#fff;font-size:8px;padding:0 2px;border-radius:2px}.floor-area{flex-shrink:0;height:30px;margin:3px auto 0;width:min(100%,calc(10 * var(--cell) + 57px));display:flex;align-items:center;justify-content:flex-end;gap:6px}.floor-target{display:flex;align-items:center;gap:6px;padding:0 3px;height:30px;border:1px solid transparent;background:transparent;color:#56694f;border-radius:3px;font-size:9px}.floor-target.legal{border-color:#ac8b51;background:#f0dfb4;color:#795529}.floor-target.legal:hover{background:#edd193}.floor-slots{display:flex;gap:4px}.floor-cell{display:flex;flex-direction:column;align-items:center;gap:0}.floor-cell .slot{width:17px;height:17px;border-radius:2px}.floor-penalty{font-size:8px;color:#94634c;line-height:9px}.floor-cell .marker{width:15px;height:15px;margin:0;font-size:10px;line-height:13px}.floor-overflow{font-size:9px;color:#94634c}
.round-summary{min-height:30px;flex-shrink:0;display:flex;align-items:center;gap:8px;font-size:11px;padding:0 3px}.round-summary .primary{min-height:27px;padding:3px 10px;font-size:11px;margin-left:auto}.round-summary .quiet{font-size:11px}.round-summary .round-result{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.join-notice{padding:8px;color:#dfc98c;font-size:11px}body.in-game .join-notice{flex-shrink:0;padding:2px;font-size:10px}.lobby{max-width:410px;margin:30px auto;padding:20px;border:1px solid #526b61;border-radius:5px;background:#20383a}.room-code{font-size:28px;letter-spacing:4px;margin:8px 0 15px;font-weight:600}.lobby-players{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}.lobby-seat{padding:9px 10px;border:1px solid #5c7669;border-radius:3px;font-size:12px}.lobby-seat.empty{border-style:dashed;color:var(--muted)}.lobby-seat small{font-size:10px;color:var(--muted);margin-left:6px}.lobby-actions{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.lobby-actions .quiet,.lobby .subtle{font-size:11px}
.rules-dialog,.score-dialog{color-scheme:light;background:#eef0e5;color:#283a31;border:1px solid #8f9f8a;border-radius:5px;width:min(540px,calc(100% - 24px));max-height:calc(var(--app-height) - 32px);padding:17px 20px}dialog::backdrop{background:#081b21a8}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.rules-dialog h3{margin:16px 0 5px}.rules-dialog p,.rules-steps{font-size:12px;line-height:1.65}.rules-steps{padding-left:18px}.rules-steps li{padding:0 0 9px 3px}.round-score-row{display:flex;justify-content:space-between;gap:15px;padding:8px 0;border-bottom:1px solid #cbd3c1;font-size:13px}.result-bonuses{color:#687961;font-size:11px}.toast{position:fixed;bottom:8px;left:50%;transform:translateX(-50%);z-index:15;background:#e6d49d;color:#263b33;box-shadow:0 3px 16px #0005;border-radius:4px;padding:8px 13px;max-width:min(460px,calc(100% - 20px));font-size:12px;text-align:center}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:600px){:root{--header-height:35px}.topbar{padding:0 9px}.brand{font-size:15px}.brand img{width:20px;height:20px}.table{padding:0 5px 4px}.table-heading{min-height:21px}.game-layout{gap:4px}.player-board{padding:4px 6px}.board-header{height:21px}.board-name{font-size:12px}.board-score{font-size:17px}.center-pool{gap:4px}.round-summary{gap:5px;font-size:10px}}
@media(max-height:500px){:root{--header-height:29px}.brand img{width:18px;height:18px}.table-heading{min-height:18px}.game-layout{gap:3px}.player-board{padding:2px 5px}.board-header{height:18px;margin-bottom:0}.board-name{font-size:11px}.board-score{font-size:15px;line-height:18px}.carousel-arrow{height:18px}.floor-area,.floor-target{height:24px;margin-top:1px}.floor-cell .slot{width:13px;height:13px}.floor-cell .marker{width:11px;height:11px;font-size:8px;line-height:9px}.factories{gap:3px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.center-pool .draft-tile{width:var(--pot-size,23px);height:var(--pot-size,23px)}.center-pool>.marker{width:var(--pot-size,23px);height:var(--pot-size,23px);font-size:clamp(9px,calc(var(--pot-size,23px) * .6),18px)}.market.side-pot{display:flex;align-items:center;gap:8px}.side-pot .factories{flex:1}.side-pot .center-pool{flex:0 0 var(--pot-width,160px);width:var(--pot-width,160px)}

.center-group{position:relative;display:block;flex-shrink:0;border:0;border-radius:3px;background:none;padding:0;height:var(--pot-size,23px)}.pot-base,.pot-layer{display:flex;gap:3px}.center-group .tile-art{width:var(--pot-size,23px);height:var(--pot-size,23px)}.center-group.selected{outline:2px solid var(--accent);outline-offset:2px}.center-group.dimmed{opacity:.4}.center-group.pot-stack{height:calc(var(--pot-size,23px) + var(--pile-offset,7px))}.pot-stack .pot-base{padding-top:var(--pile-offset,7px)}.pot-layer{position:absolute;top:0;left:0;pointer-events:none}.pot-layer .tile-art{box-shadow:0 1px 2px #0008}.pot-count{position:absolute;right:1px;bottom:1px;z-index:1;padding:0 3px;min-width:14px;border:1px solid #25382f;border-radius:3px;background:#efdda9;color:#182b2d;font-size:clamp(10px,calc(var(--pot-size,23px) * .4),18px);font-weight:750;line-height:1.1;pointer-events:none}
