:root{--bg:#F6F7F1;--panel:#FFFFFF;--felt:#1E6F5C;--text:#1E2528;--muted:#66706A;--border:#D8DED4;--accent:#C28A2E;--success:#2E7D4F;--danger:#B8463E;--spacer-xs:4px;--spacer-sm:8px;--spacer-md:16px;--spacer-lg:24px;--spacer-xl:32px}*{box-sizing:border-box}body,html{min-height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1.45;letter-spacing:0}button,input{font:inherit;letter-spacing:0}button{cursor:pointer}button:disabled{cursor:not-allowed}.app-shell{min-height:100vh;padding:var(--spacer-lg)}.table-layout{display:grid;grid-template-columns:280px minmax(520px,1fr) 320px;grid-gap:var(--spacer-lg);gap:var(--spacer-lg);align-items:start}.control-rail,.rail{display:grid;grid-gap:var(--spacer-md);gap:var(--spacer-md)}.panel{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:var(--spacer-md)}.panel-title{margin:0 0 var(--spacer-sm);font-size:12px;font-weight:700;line-height:1.25;text-transform:uppercase;color:var(--muted)}.start-strip,.status-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--spacer-md);margin-bottom:var(--spacer-lg)}.start-copy h1{margin:0;font-size:20px;line-height:1.25}.start-copy p{margin:var(--spacer-xs) 0 0;color:var(--muted)}.seat-selector{display:flex;gap:var(--spacer-sm)}.seat-button{width:44px;height:44px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text);font-weight:700}.seat-button.is-selected{border-color:var(--accent);background:#EAF3EF}.bid-button,.call-button,.primary-button,.secondary-button{min-height:40px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text);font-weight:700}.primary-button{border-color:var(--accent);background:var(--accent);color:#FFFFFF}.primary-button,.secondary-button{padding:0 var(--spacer-md)}.status-pill{display:inline-flex;align-items:center;gap:var(--spacer-sm);min-height:32px;padding:0 var(--spacer-sm);border:1px solid var(--border);border-radius:999px;background:var(--panel);color:var(--muted);font-size:12px;font-weight:700}.status-pill.connected{color:var(--success)}.status-pill.disconnected{color:var(--danger)}.metadata-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:var(--spacer-sm);gap:var(--spacer-sm)}.metadata-item{padding:var(--spacer-sm);border:1px solid var(--border);border-radius:8px;background:var(--bg)}.metadata-item span,.mini-label{display:block;font-size:12px;font-weight:700;color:var(--muted)}.metadata-item strong{display:block;margin-top:var(--spacer-xs);font-size:15px}.table-surface{position:relative;min-height:560px;border-radius:18px;background:var(--felt);color:#FFFFFF;overflow:hidden;padding:var(--spacer-lg)}.seat-zone{position:absolute;display:grid;grid-gap:var(--spacer-sm);gap:var(--spacer-sm);justify-items:center;min-width:180px}.seat-zone.north{top:var(--spacer-lg)}.seat-zone.north,.seat-zone.south{left:50%;transform:translateX(-50%)}.seat-zone.south{bottom:var(--spacer-lg)}.seat-zone.west{left:var(--spacer-lg)}.seat-zone.east,.seat-zone.west{top:50%;transform:translateY(-50%)}.seat-zone.east{right:var(--spacer-lg)}.seat-label{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:2px solid rgba(255,255,255,.45);border-radius:999px;font-weight:800}.seat-label.is-turn{border-color:var(--accent);box-shadow:0 0 0 4px rgba(194,138,46,.25)}.hand-row{flex-wrap:wrap;gap:var(--spacer-xs);max-width:280px}.hand-row,.hidden-hand{display:flex;justify-content:center}.hidden-hand{align-items:center;width:128px;height:48px;border:1px solid rgba(255,255,255,.35);border-radius:8px;background:rgba(255,255,255,.14);font-weight:700}.card-button{width:48px;height:68px;display:grid;align-content:start;justify-items:start;grid-gap:0;gap:0;border:1px solid var(--border);border-radius:6px;background:#FFFFFF;color:var(--text);padding:6px;font-weight:800;line-height:1}.card-button.red{color:var(--danger)}.card-button.playable{border-color:var(--accent)}.card-button:disabled,.card-button[aria-disabled=true]{opacity:.45}.card-suit{font-size:12px}.trick-center{position:absolute;inset:42% auto auto 50%;transform:translate(-50%,-50%);grid-gap:var(--spacer-sm);justify-items:center}.trick-cards,.trick-center{display:grid;gap:var(--spacer-sm)}.trick-cards{grid-template-columns:repeat(4,52px);grid-gap:var(--spacer-sm);min-height:72px}.trick-play{justify-items:center;grid-gap:var(--spacer-xs);color:#FFFFFF}.auction-grid,.trick-play{display:grid;gap:var(--spacer-xs)}.auction-grid{grid-template-columns:repeat(4,1fr);grid-gap:var(--spacer-xs)}.auction-call,.auction-head{min-height:28px;padding:var(--spacer-xs);border-radius:6px;text-align:center;font-weight:700}.auction-head{color:var(--muted);background:var(--bg)}.auction-call{border-left:3px solid transparent}.auction-call.is-turn{border-left-color:var(--accent);background:#F7F1E7}.action-controls{display:grid;grid-gap:var(--spacer-md);gap:var(--spacer-md)}.call-grid{grid-template-columns:repeat(3,1fr);grid-gap:var(--spacer-sm)}.bid-grid,.call-grid{display:grid;gap:var(--spacer-sm)}.bid-grid{grid-template-columns:repeat(5,1fr);grid-gap:var(--spacer-sm)}.play-grid{display:flex;flex-wrap:wrap;gap:var(--spacer-xs)}.error-box{border:1px solid var(--danger);border-radius:8px;padding:var(--spacer-sm);color:var(--danger);background:#FFF5F3}.result-score{margin:0;color:var(--accent);font-size:28px;font-weight:800;line-height:1.15}.summary-list{display:grid;grid-gap:var(--spacer-sm);gap:var(--spacer-sm);margin:var(--spacer-md) 0}.summary-row{display:flex;justify-content:space-between;gap:var(--spacer-md)}.history-list{max-height:260px;overflow:auto;margin:0;padding-left:20px}.dev-panel{margin-top:var(--spacer-md);border-top:1px solid var(--border);padding-top:var(--spacer-md);color:var(--muted);font-size:12px}@media (max-width:1119px){.table-layout{grid-template-columns:1fr}.control-rail,.rail{grid-template-columns:repeat(2,minmax(0,1fr))}.table-surface{min-height:520px}.card-button{width:42px;height:60px}}@media (max-width:640px){.app-shell{padding:var(--spacer-sm)}.start-strip,.status-bar{position:-webkit-sticky;position:sticky;top:0;z-index:5;background:var(--bg);padding:var(--spacer-sm) 0}.control-rail,.metadata-grid,.rail{grid-template-columns:1fr}.seat-button{width:40px;height:40px}.table-surface{min-height:460px;padding:var(--spacer-sm)}.seat-zone{min-width:132px}.hand-row{max-width:180px;overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start}.card-button{width:36px;height:52px;padding:4px}.trick-cards{grid-template-columns:repeat(4,40px)}}