:root{--color-bg:#f6f5f2;--color-panel:#fff;--color-border:#e4e1da;--color-ink:#1c1c1c;--color-sub:#8a867d;--color-accent-team:#6e7a4a;--color-accent-opponent:#9c5a3c;--color-card-spread-outline:var(--color-ink);--color-joker:#3d6b5e;--color-table-bg:#5c2430;--color-table-text:#e9ddd6;--color-surface-dark:#2e1a1f;--font-ui:Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display:"Copperplate", "Copperplate Gothic Light", "Copperplate Gothic", serif;--font-size-score-value:17px;--font-weight-score-value:700;--font-size-label:11px;--font-weight-label:600;--letter-spacing-label:.4px;--card-width-small:44px;--card-height-small:62px;--card-width-medium:72px;--card-height-medium:102px;--card-radius:6px;--card-overlap-small:calc(var(--card-width-small) * -.64);--card-overlap-medium:calc(var(--card-width-medium) * -.33)}.card-stack{display:flex}.card-stack--horizontal.card-stack--small>.card+.card{margin-left:var(--card-overlap-small)}.card-stack--horizontal.card-stack--medium>.card+.card{margin-left:var(--card-overlap-medium)}.card-stack--upside-down{transform:rotate(180deg)}.card-stack .card{outline:1px solid var(--color-card-spread-outline);outline-offset:-1px}*{box-sizing:border-box}body{font-family:var(--font-ui);color:var(--color-ink);background:var(--color-bg);margin:0}button{font:inherit;appearance:none}.lobby-screen{background:var(--color-panel);border:1px solid var(--color-border);border-radius:var(--card-radius);max-width:360px;font-family:var(--font-display);flex-direction:column;align-items:center;gap:16px;margin:80px auto;padding:24px;display:flex}.lobby-screen__title{letter-spacing:2px;text-transform:uppercase;color:var(--color-ink);margin:0;font-size:30px;font-weight:400}.lobby-screen__input{border:1px solid var(--color-border);border-radius:var(--card-radius);width:100%;font:inherit;box-sizing:border-box;padding:8px 10px}.lobby-screen__actions{flex-direction:column;gap:12px;width:100%;display:flex}.lobby-screen__join{gap:8px;display:flex}.lobby-screen__input--code{text-transform:uppercase}.lobby-screen__button{border:1px solid var(--color-table-bg);border-radius:var(--card-radius);background:var(--color-table-bg);color:var(--color-panel);font:inherit;cursor:pointer;white-space:nowrap;padding:8px 14px;font-weight:600}.lobby-screen__button:disabled{opacity:.5;cursor:default}.lobby-screen__button:focus-visible{outline:2px solid var(--color-table-bg);outline-offset:2px}.lobby-screen__status{color:var(--color-sub);font-size:var(--font-size-label);text-align:center}.lobby-screen__room-code{font-size:var(--font-size-label);color:var(--color-sub)}.lobby-screen__room-code strong{font-family:var(--font-display);letter-spacing:4px;color:var(--color-ink);font-size:.88rem}.lobby-screen__seats{gap:16px;width:100%;display:flex}.lobby-screen__seat-column{flex-direction:column;flex:1;gap:8px;display:flex}.lobby-screen__team-label{font-size:var(--font-size-label);color:var(--color-sub);text-align:center;margin:0}.lobby-screen__seat{border:1px solid var(--color-border);border-radius:var(--card-radius);background:var(--color-panel);font:inherit;cursor:pointer;flex-direction:column;align-items:center;gap:2px;padding:8px 6px;display:flex}.lobby-screen__seat:disabled{cursor:default}.lobby-screen__seat--yours{border-color:var(--color-accent-team)}.lobby-screen__seat-number{font-size:var(--font-size-label);color:var(--color-sub)}.lobby-screen__seat-name{color:var(--color-ink);font-weight:600}.lobby-screen__seat-tag{font-size:var(--font-size-label);color:var(--color-accent-team)}.lobby-screen__seat-tag--dealer{color:var(--color-sub)}.lobby-screen__dealer-picker{flex-direction:column;align-items:center;gap:8px;width:100%;display:flex}.lobby-screen__dealer-options{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.lobby-screen__dealer-option{border:1px solid var(--color-border);border-radius:var(--card-radius);background:var(--color-panel);font:inherit;cursor:pointer;padding:6px 10px}.lobby-screen__dealer-option:disabled{opacity:.5;cursor:default}.lobby-screen__dealer-option--selected{border-color:var(--color-accent-team);background:var(--color-accent-team);color:var(--color-panel)}.lobby-screen__rules-link{font:inherit;color:var(--color-sub);cursor:pointer;background:0 0;border:none;padding:0;font-size:12px;text-decoration:underline}.lobby-screen__rules-link:hover{color:var(--color-ink)}.score-display{font-family:var(--font-display);gap:24px;display:flex}.score-display__item{flex-direction:column;align-items:flex-start;display:flex}.score-display__label{font-size:var(--font-size-label);font-weight:var(--font-weight-label);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-sub)}.score-display__value{font-size:var(--font-size-score-value);font-weight:var(--font-weight-score-value)}.score-display__value--team{color:var(--color-accent-team)}.score-display__value--opponent{color:var(--color-accent-opponent)}.seat-label{background:var(--color-panel);font-family:var(--font-display);border:2px solid #0000;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;display:inline-flex}.seat-label--active{border-color:gold;box-shadow:0 0 0 3px #ffd70059,0 0 10px 1px #ffd70099}.seat-label--disconnected{opacity:.6}.seat-label__disconnected-tag{font-size:9px;font-weight:var(--font-weight-label);color:var(--color-accent-opponent);text-transform:uppercase;letter-spacing:.3px}.seat-label__dot{width:8px;height:8px}.seat-label__dot--yours{background:var(--color-accent-team);border-radius:50%}.seat-label__dot--opponents{background:var(--color-accent-opponent);border-radius:1px;transform:rotate(45deg)}.seat-label__name{font-size:var(--font-size-label);font-weight:var(--font-weight-label);color:var(--color-ink)}.card{background:var(--color-panel);border:1px solid var(--color-ink);border-radius:var(--card-radius);box-sizing:border-box;font-family:var(--font-display);margin:0;padding:0;display:inline-flex;position:relative}.card--small{width:var(--card-width-small);height:var(--card-height-small)}.card--medium{width:var(--card-width-medium);height:var(--card-height-medium)}.card--facedown{overflow:hidden}.card__back{width:100%;height:100%;display:block}.card--interactive{cursor:pointer;transition:transform .15s}.card--interactive:hover{transform:translateY(-6px)}.card--interactive:focus-visible{outline:2px solid var(--color-accent-team);outline-offset:2px}.card--selected{border:2px solid var(--color-accent-team);box-shadow:0 0 0 4px #3d6b5226}.card__corner{color:var(--color-ink);font-weight:700;line-height:1;font-size:calc(var(--card-width-medium) * .253);flex-direction:column;align-items:center;gap:0;display:flex;position:absolute;top:6%;left:8%}.card--small .card__corner{font-size:calc(var(--card-width-small) * .253)}.card__corner--red{color:var(--color-accent-opponent)}.card__corner-suit{width:calc(var(--card-width-medium) * .1771);height:calc(var(--card-width-medium) * .1771);margin-top:-3px}.card--small .card__corner-suit{width:calc(var(--card-width-small) * .2024);height:calc(var(--card-width-small) * .2024);margin-top:-1.8px}.card__pip-frame{width:calc(var(--card-width-medium) * .462);height:calc(var(--card-height-medium) * .55);border-style:solid;border-color:var(--color-border);box-sizing:border-box;border-radius:5px;position:absolute;top:61.5%;left:50%;transform:translate(-50%,-50%)}.card--medium .card__pip-frame{border-width:1.2px}.card--small .card__pip-frame{width:calc(var(--card-width-small) * .46);height:calc(var(--card-height-small) * .54);border-width:.8px;border-radius:4px;top:62.1%}.card__suit-center{opacity:.85;color:var(--color-ink);width:calc(var(--card-width-medium) * .297);height:calc(var(--card-width-medium) * .297);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card--small .card__suit-center{width:calc(var(--card-width-small) * .3);height:calc(var(--card-width-small) * .3)}.card__suit-center--red{color:var(--color-accent-opponent)}.card__pip{opacity:.85;color:var(--color-ink);width:calc(var(--card-width-medium) * .0935);height:calc(var(--card-width-medium) * .0935);position:absolute}.card--small .card__pip{width:calc(var(--card-width-small) * .1);height:calc(var(--card-width-small) * .1)}.card__pip--red{color:var(--color-accent-opponent)}.card__face-center{opacity:.85;color:var(--color-ink);width:calc(var(--card-width-medium) * .352);height:calc(var(--card-width-medium) * .352);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card--small .card__face-center{width:calc(var(--card-width-small) * .36);height:calc(var(--card-width-small) * .36)}.card__face-center--red{color:var(--color-accent-opponent)}.card__joker-icon{width:calc(var(--card-width-medium) * .374);height:calc(var(--card-width-medium) * .374);color:var(--color-joker);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card--small .card__joker-icon{width:calc(var(--card-width-small) * .38);height:calc(var(--card-width-small) * .38)}.card__joker-label{letter-spacing:.5px;color:var(--color-joker);white-space:nowrap;font-size:11.5px;font-weight:700;position:absolute;top:8%;left:50%;transform:translate(-50%)}.card--small .card__joker-label{font-size:8.05px}.player-hand{justify-content:center;padding-top:12px}.opponent-hand--rotated-wrapper{width:var(--card-height-small);height:calc(var(--card-width-small) + (var(--n) - 1) * (var(--card-width-small) + var(--card-overlap-small)));position:relative}.opponent-hand--rotated-fan{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(90deg)}.opponent-hand--rotated-fan.opponent-hand--rotated-east{transform:translate(-50%,-50%)rotate(-90deg)}.kitty-area{flex-direction:column;align-items:center;gap:6px;display:flex}.kitty-area__label{font-size:var(--font-size-label);font-weight:var(--font-weight-label);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-table-text)}.kitty-area .card-stack{margin:19px 0;transform:scale(1.6875)}.kitty-exchange{flex-direction:column;align-items:center;gap:12px;padding-bottom:12px;display:flex}.kitty-exchange__instructions{font-family:var(--font-display);font-size:var(--font-size-label);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-sub);text-align:center;margin:0}.kitty-exchange__progress{color:var(--color-ink);font-weight:700}.kitty-exchange__confirm{border:1px solid var(--color-accent-team);border-radius:var(--card-radius);background:var(--color-accent-team);color:var(--color-panel);font:inherit;cursor:pointer;white-space:nowrap;padding:8px 14px;font-weight:600}.kitty-exchange__confirm:disabled{opacity:.5;cursor:default}.kitty-exchange__confirm:focus-visible{outline:2px solid var(--color-accent-team);outline-offset:2px}.trick-area{flex-direction:column;align-items:center;gap:6px;display:flex}.trick-area__label{font-size:var(--font-size-label);font-weight:var(--font-weight-label);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-table-text)}.trick-area__grid{grid-template-areas:".north.""west.east"".south.";grid-template-columns:var(--card-width-small) var(--card-width-small) var(--card-width-small);justify-content:center;align-items:center;gap:4px;display:grid}.trick-area__slot--north{grid-area:north}.trick-area__slot--west{grid-area:west}.trick-area__slot--east{grid-area:east}.trick-area__slot--south{grid-area:south}.trick-area__empty{width:var(--card-width-small);height:var(--card-height-small);border:1px dashed var(--color-border);border-radius:var(--card-radius);box-sizing:border-box}.trump-badge{border:1px solid var(--color-border);border-radius:var(--card-radius);background:var(--color-panel);flex-direction:column;align-items:center;gap:1.5px;padding:4.5px 10.5px;display:flex}.trump-badge__value{font-size:calc(var(--font-size-score-value) * .75);font-weight:var(--font-weight-score-value);color:var(--color-ink);align-items:center;gap:4.5px;display:flex}.trump-badge__value--red{color:var(--color-accent-opponent)}.trump-badge__glyph{width:.825em;height:.825em}.trick-pile{width:calc(var(--card-width-small) + 24px);height:calc(var(--card-width-small) + 24px);position:relative}.trick-pile__card{transform-origin:50%;position:absolute;top:0;left:0}.trick-pile__card .card{outline:1px solid var(--color-card-spread-outline);outline-offset:-1px}.trick-pile__count{background:var(--color-ink);min-width:20px;color:var(--color-panel);text-align:center;border-radius:999px;padding:2px 5px;font-size:14px;font-weight:700;line-height:1.4;position:absolute;bottom:-4px;right:-4px}.dealing-overlay{z-index:10;background:var(--color-table-bg);flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:absolute;inset:0}.dealing-overlay__label{font-size:var(--font-size-label);font-weight:var(--font-weight-label);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-table-text);margin:0}.dealing-overlay__seats{width:100%;max-width:620px;height:320px;position:relative}.dealing-overlay__seat{gap:22px;display:flex;position:absolute}.dealing-overlay__seat--north{top:0;left:50%;transform:translate(-50%)}.dealing-overlay__seat--south{bottom:0;left:50%;transform:translate(-50%)}.dealing-overlay__seat--west{top:50%;left:0;transform:translateY(-50%)}.dealing-overlay__seat--east{top:50%;right:0;transform:translateY(-50%)}.dealing-overlay__stack{width:calc(var(--card-width-small) + 6px);height:calc(var(--card-height-small) + 6px);position:relative}.dealing-overlay__stack-card{position:absolute;top:0;left:0}.dealing-overlay__stack-card .card{outline:1px solid var(--color-card-spread-outline);outline-offset:-1px}.bidding-grid{font-family:var(--font-display);flex-direction:column;align-items:center;gap:10px;display:flex}.bidding-grid__history{font-size:var(--font-size-label);color:var(--color-sub);flex-wrap:wrap;gap:6px;display:flex}.bidding-grid__history-entry--turn{color:var(--color-accent-team);font-weight:700}.bidding-grid__banned-note{font-size:var(--font-size-label);color:var(--color-sub);align-items:center;gap:4px;margin:0;display:flex}.bidding-grid__banned-note-icon{width:12px;height:12px}.bidding-grid__table{grid-template-columns:26px repeat(6,38px);gap:4px;display:grid}.bidding-grid__corner{width:26px}.bidding-grid__header-cell{font-size:var(--font-size-label);font-weight:var(--font-weight-label);color:var(--color-sub);justify-content:center;align-items:center;display:flex}.bidding-grid__header-icon{width:14px;height:14px}.bidding-grid__row-label{font-size:var(--font-size-label);font-weight:var(--font-weight-label);color:var(--color-sub);justify-content:center;align-items:center;display:flex}.bidding-grid__cell{border-radius:var(--card-radius);height:36px;font:inherit;font-size:13px;font-weight:600}.bidding-grid__cell--available{background:var(--color-panel);border:1px solid var(--color-border);color:var(--color-ink);cursor:pointer;transition:border-color .15s}.bidding-grid__cell--available:hover{border-color:var(--color-accent-team)}.bidding-grid__cell--available:focus-visible{outline:2px solid var(--color-accent-team);outline-offset:2px}.bidding-grid__cell--unavailable{background:color-mix(in srgb, var(--color-border) 50%, var(--color-bg) 50%);color:var(--color-ink);opacity:.45;cursor:default;pointer-events:none;border:1px solid #0000}.bidding-grid__cell--winning{border:2px solid var(--color-accent-team);box-shadow:0 0 0 4px #3d6b5226}.bidding-grid__pass{border:1px solid var(--color-accent-opponent);border-radius:var(--card-radius);background:var(--color-panel);color:var(--color-accent-opponent);font:inherit;cursor:pointer;padding:8px 20px;font-weight:600}.bidding-grid__pass:hover{background:var(--color-accent-opponent);color:var(--color-panel)}.bidding-grid__pass:focus-visible{outline:2px solid var(--color-accent-team);outline-offset:2px}.game-over-screen__overlay{z-index:100;background:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.game-over-screen{background:var(--color-surface-dark);max-width:480px;max-height:80vh;font-family:var(--font-display);border-radius:10px;flex-direction:column;align-items:center;gap:16px;padding:28px 32px;display:flex;overflow-y:auto;box-shadow:0 8px 24px #0006}.game-over-screen__title{letter-spacing:2px;text-transform:uppercase;color:var(--color-table-text);margin:0;font-size:28px;font-weight:400}.game-over-screen__result{color:var(--color-table-text);margin:0;font-size:18px}.game-over-screen__callout{text-align:center;color:var(--color-table-text);margin:0;font-style:italic}.game-over-screen__table-wrap{width:100%;max-height:280px;overflow-y:auto}.game-over-screen__table{border-collapse:collapse;width:100%;font-size:var(--font-size-label);color:var(--color-table-text)}.game-over-screen__table th,.game-over-screen__table td{text-align:center;border-bottom:1px solid #e9ddd633;padding:6px 10px}.game-over-screen__table th{text-transform:uppercase;letter-spacing:.5px;color:var(--color-sub)}.table{background:var(--color-table-bg);min-height:100svh;font-family:var(--font-display);grid-template:"header header header""north north north""west center east"1fr"south south south""footer footer footer"/minmax(120px,1fr) auto minmax(120px,1fr);display:grid;position:relative}.table__header{background:var(--color-panel);border-bottom:1px solid var(--color-border);grid-area:header;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.table__hand-label{font-size:var(--font-size-label);font-weight:var(--font-weight-label);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-sub)}.table__rules-link{font-family:var(--font-ui);color:var(--color-sub);font-size:12px;text-decoration:underline}.table__rules-link:hover{color:var(--color-ink)}.table__footer{background:var(--color-panel);border-top:1px solid var(--color-border);grid-area:footer;padding:16px 24px 24px}.table__seat{flex-direction:column;align-items:center;gap:10px;padding:24px 16px;display:flex}.table__seat--north{grid-area:north}.table__seat--south{grid-area:south}.table__seat--west{grid-area:west;justify-self:end}.table__seat--east{grid-area:east;justify-self:start}.table__center{flex-direction:column;grid-area:center;justify-content:center;align-items:center;gap:20px;padding:24px;display:flex}.table__status{font-size:var(--font-size-label);color:var(--color-table-text);text-align:center;margin:0}@media (width<=640px){.table{grid-template-columns:minmax(60px,1fr) auto minmax(60px,1fr)}.table__seat{padding:12px 8px}.table__center{gap:12px;padding:12px}}.hand-tally-overlay{z-index:90;background:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.hand-tally{background:var(--color-surface-dark);border-radius:10px;flex-direction:column;align-items:center;gap:12px;min-width:240px;padding:24px 32px;display:flex;box-shadow:0 8px 24px #0006}.hand-tally__title{font-family:var(--font-display);font-size:var(--font-size-label);letter-spacing:.5px;text-transform:uppercase;color:var(--color-sub);margin:0 0 4px}.hand-tally__row{width:100%;font-family:var(--font-display);color:var(--color-table-text);justify-content:space-between;gap:24px;display:flex}.hand-tally__count{font-size:1.4rem;font-weight:700}.action-error-modal__overlay{z-index:100;background:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.action-error-modal{background:var(--color-surface-dark);border-radius:10px;flex-direction:column;align-items:center;gap:16px;max-width:360px;padding:24px 28px;display:flex;box-shadow:0 8px 24px #0006}.action-error-modal__message{font-family:var(--font-display);text-align:center;color:var(--color-table-text);margin:0}.joker-suit-picker,.misdeal-decision__actions{gap:12px;display:flex}.joker-suit-picker__option{border:1px solid var(--color-border);border-radius:var(--card-radius);background:var(--color-panel);cursor:pointer;justify-content:center;align-items:center;width:48px;height:48px;padding:8px;display:flex}.joker-suit-picker__icon{width:100%;height:100%;color:var(--color-ink)}.rules-screen__page{background:var(--color-bg);justify-content:center;min-height:100svh;padding:32px 16px;display:flex}.rules-screen{background:var(--color-panel);border:1px solid var(--color-border);border-radius:var(--card-radius);width:100%;max-width:720px;height:fit-content;font-family:var(--font-ui);color:var(--color-ink);flex-direction:column;display:flex;box-shadow:0 4px 16px #0000001f}.rules-screen__header{border-bottom:1px solid var(--color-border);flex-shrink:0;padding:20px 24px 16px}.rules-screen__title{font-family:var(--font-display);letter-spacing:.5px;color:var(--color-ink);margin:0;font-size:22px;font-weight:400}.rules-screen__body{padding:20px 24px 28px;overflow-y:auto}.rules-screen__section h2{font-family:var(--font-display);letter-spacing:.3px;color:var(--color-ink);margin:0 0 8px;font-size:17px;font-weight:400}.rules-screen__section h3{font-size:var(--font-size-label);font-weight:var(--font-weight-label);letter-spacing:var(--letter-spacing-label);text-transform:uppercase;color:var(--color-sub);margin:18px 0 8px}.rules-screen__section p{color:var(--color-ink);margin:0 0 8px;font-size:13.5px;line-height:1.5}.rules-screen__section ul{flex-direction:column;gap:8px;margin:0;padding-left:20px;display:flex}.rules-screen__section li{font-size:13.5px;line-height:1.5}.rules-screen__divider{border:none;border-top:1px solid var(--color-border);margin:22px 0}.rules-screen__badge{letter-spacing:.3px;text-transform:uppercase;color:var(--color-panel);background:var(--color-accent-opponent);white-space:nowrap;border-radius:4px;margin-right:4px;padding:2px 6px;font-size:10px;font-weight:700;display:inline-block}.rules-screen__table{border-collapse:collapse;width:100%;margin-top:8px;font-size:12.5px}.rules-screen__table th,.rules-screen__table td{border:1px solid var(--color-border);text-align:center;padding:4px 8px}.rules-screen__table th{background:var(--color-bg);color:var(--color-sub);font-weight:600}
