@font-face {
  font-family: "IBM Plex Sans";
  src: url("fonts/IBMPlexSans-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("fonts/IBMPlexSans-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("fonts/IBMPlexSans-SemiBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("fonts/IBMPlexSans-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  color-scheme: light;
  --ink: #17223b;
  --ink-2: #273653;
  --paper: #f4f0e6;
  --paper-2: #ede8dd;
  --paper-3: #faf8f2;
  --line: #c8c0b2;
  --muted: #696860;
  --gold: #c68b12;
  --gold-soft: #f3e5b9;
  --red: #b42318;
  --red-soft: #f8e3df;
  --green: #176b46;
  --green-soft: #e4f1e8;
  --white: #ffffff;
  font-family: "IBM Plex Sans", Arial, sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--paper); color: var(--ink); }
body { min-width: 320px; min-height: 100vh; min-height: 100dvh; margin: 0; background: var(--paper); color: var(--ink); }
button, input, select { font: inherit; }
button { touch-action: manipulation; }
[hidden] { display: none !important; }
img { display: block; max-width: 100%; }
fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

:focus-visible { outline: 3px solid #315a94; outline-offset: 2px; }

.offline-banner,
.update-banner {
  position: relative;
  z-index: 100;
  min-height: 38px;
  padding: 8px 14px;
  text-align: center;
  font-size: .78rem;
  font-weight: 750;
}
.offline-banner { color: #fff; background: #8b3e0c; }
.update-banner { display: flex; align-items: center; justify-content: center; gap: 14px; color: #fff; background: var(--ink); }
.update-banner button { min-height: 30px; padding: 3px 10px; color: #fff; border: 1px solid rgba(255,255,255,.7); background: transparent; font-weight: 800; }

.button {
  min-height: 44px;
  padding: 9px 15px;
  border: 1px solid var(--ink);
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font-weight: 760;
  cursor: pointer;
}
.button:disabled { cursor: not-allowed; opacity: .38; }
.button-primary { color: #fff; background: var(--ink); }
.button-primary:hover { background: var(--ink-2); }
.button-secondary { background: transparent; }
.button-danger { color: #fff; border-color: var(--red); background: var(--red); }
.button-large { width: 100%; min-height: 50px; }
.danger-text { color: var(--red) !important; }

/* Setup */
.setup-view { width: min(720px, calc(100% - 32px)); margin: 0 auto; padding: clamp(32px, 8vh, 82px) 0 36px; }
.setup-brand { display: grid; grid-template-columns: 92px 1fr; gap: 22px; align-items: end; padding-bottom: 20px; border-bottom: 2px solid var(--ink); }
.setup-brand img { width: 92px; height: 92px; object-fit: contain; }
.eyebrow { margin: 0 0 7px; color: var(--muted); font-size: .66rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.setup-brand h1 { margin: 0; font-size: clamp(2.2rem, 8vw, 4.8rem); font-weight: 520; letter-spacing: -.055em; line-height: .86; }
.setup-form { display: grid; gap: 26px; padding-top: 24px; }
.setup-section { display: grid; gap: 10px; }
.setup-section legend { margin-bottom: 9px; color: var(--muted); font-size: .7rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.segmented { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--ink); }
.segmented button { min-height: 46px; border: 0; border-right: 1px solid var(--ink); background: transparent; color: var(--ink); font-weight: 820; }
.segmented button:last-child { border-right: 0; }
.segmented button.selected { color: #fff; background: var(--ink); }
.name-fields { border-top: 1px solid var(--line); }
.name-field { display: grid; grid-template-columns: 52px 1fr; align-items: center; min-height: 48px; border-bottom: 1px solid var(--line); }
.player-dot { font-size: .68rem; font-weight: 900; }
.name-field input { width: 100%; height: 47px; padding: 0; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--ink); }
.name-field input:focus { border-bottom-color: var(--ink); outline: 0; }
.setup-toggle { display: grid; grid-template-columns: 24px 1fr; gap: 10px; align-items: start; padding: 14px 0; border-block: 1px solid var(--line); cursor: pointer; }
.setup-toggle input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--ink); }
.setup-toggle strong, .setup-toggle small { display: block; }
.setup-toggle strong { font-size: .88rem; }
.setup-toggle small { margin-top: 3px; color: var(--muted); font-size: .74rem; line-height: 1.4; }
.setup-buttons { display: grid; grid-template-columns: 1fr; gap: 8px; }
.setup-buttons:has(#cancelSetup:not([hidden])) { grid-template-columns: .75fr 1.25fr; }
.privacy-note { margin: 14px 0 0; color: var(--muted); font-size: .72rem; }

/* Game shell */
.game-view { min-height: 100dvh; }
.game-shell { min-height: 100dvh; display: grid; grid-template-columns: 206px minmax(0, 1fr); }
.game-nav {
  position: sticky;
  z-index: 45;
  top: 0;
  align-self: start;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  padding: 18px 14px 14px;
  border-right: 1px solid var(--ink);
  background: var(--paper-3);
}
.nav-brand { display: grid; grid-template-columns: 44px 1fr; gap: 10px; align-items: center; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.nav-brand img { width: 44px; height: 44px; object-fit: contain; }
.nav-brand strong, .nav-brand small { display: block; }
.nav-brand strong { font-size: .95rem; }
.nav-brand small { margin-top: 4px; color: var(--muted); font-size: .62rem; line-height: 1.2; }
.view-nav { display: grid; margin-top: 18px; border-top: 1px solid var(--ink); }
.view-nav button,
.nav-tool {
  min-height: 45px;
  padding: 0 4px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  text-align: left;
  font-weight: 760;
  cursor: pointer;
}
.view-nav button { position: relative; }
.view-nav button.active::before { content: ""; position: absolute; top: 9px; bottom: 9px; left: -14px; width: 4px; background: var(--gold); }
.nav-tools { display: grid; margin-top: auto; border-top: 1px solid var(--ink); }
.score-privacy { display: grid; grid-template-columns: 20px 1fr; gap: 8px; align-items: center; min-height: 48px; border-bottom: 1px solid var(--line); font-size: .72rem; font-weight: 720; cursor: pointer; }
.score-privacy input { width: 18px; height: 18px; margin: 0; accent-color: var(--ink); }
.menu-wrap { position: relative; }
.actions-menu { position: absolute; z-index: 80; right: -1px; bottom: 45px; width: 250px; border: 1px solid var(--ink); background: var(--paper-3); }
.actions-menu button { display: block; width: 100%; min-height: 43px; padding: 9px 11px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; font-weight: 680; }
.actions-menu button:last-child { border-bottom: 0; }
.actions-menu button:hover, .view-nav button:hover, .nav-tool:hover { background: var(--paper-2); }
.workspace { min-width: 0; }
.view-panel { width: 100%; }

/* Round view */
.round-shell { width: min(1500px, 100%); margin: 0 auto; padding: 34px clamp(24px, 4vw, 60px) 22px; }
.round-heading { display: grid; grid-template-columns:minmax(0,1fr) auto; gap: 24px; align-items: end; padding-bottom: 15px; border-bottom: 2px solid var(--ink); }
.round-title-row { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: baseline; }
.round-title-row h1 { margin: 0; font-size: clamp(2rem, 4.4vw, 4.1rem); font-weight: 520; letter-spacing: -.055em; line-height: .9; }
.round-heading p { margin: 8px 0 0; color: var(--muted); font-size: .78rem; font-weight: 650; }
.round-tools { display: grid; justify-items: end; gap: 7px; }
.round-counter { color: var(--muted); font-size: .72rem; font-weight: 850; font-variant-numeric: tabular-nums; }
.badge { display: inline-block; padding: 1px 0 2px; border-bottom: 2px solid currentColor; font-size: .64rem; font-weight: 900; letter-spacing: .04em; }
.badge-trump { color: #815800; }
.badge-locked { color: var(--green); }

.round-overview { display: grid; grid-template-columns:minmax(0, 1.25fr) minmax(360px,.75fr); border-bottom: 1px solid var(--ink); }
.order-block { min-width: 0; padding: 15px 20px 15px 0; border-right: 1px solid var(--line); }
.block-label { margin: 0 0 9px; color: var(--muted); font-size: .62rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.order-flow { display: flex; overflow-x: auto; gap: 7px; align-items: center; padding-bottom: 2px; scrollbar-width: thin; }
.order-chip { flex: 0 0 auto; font-size: .77rem; font-weight: 760; }
.order-chip.starter { color: #805900; }
.order-arrow { color: #979288; }
.totals-block { display: grid; grid-template-columns: repeat(var(--players), minmax(72px,1fr)); min-width: 0; overflow-x: auto; }
.score-pill { min-width: 72px; padding: 13px 9px; border-right: 1px solid var(--line); }
.score-pill:last-child { border-right: 0; }
.score-pill span, .score-pill strong { display: block; }
.score-pill span { overflow: hidden; color: var(--muted); font-size: .62rem; font-weight: 760; text-overflow: ellipsis; white-space: nowrap; }
.score-pill strong { margin-top: 3px; font-size: 1rem; font-variant-numeric: tabular-nums; }

.entry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(22px, 3vw, 46px); padding-top: 26px; }
.entry-section { min-width: 0; border-top: 2px solid var(--ink); }
.entry-title { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; min-height: 42px; padding: 9px 0 8px; border-bottom: 1px solid var(--line); }
.entry-title h2 { margin: 0; font-size: .8rem; letter-spacing: .05em; text-transform: uppercase; }
.entry-title small { color: var(--muted); font-size: .68rem; text-align: right; }
.entry-list { border-bottom: 1px solid var(--ink); }
.entry-row { display: grid; grid-template-columns:minmax(0,1fr) 96px 58px; gap: 12px; align-items: center; min-height: 55px; padding: 5px 0; border-bottom: 1px solid var(--line); }
.entry-row:last-child { border-bottom: 0; }
.entry-row.is-last { background: rgba(198,139,18,.07); }
.entry-row label { min-width: 0; padding-left: 4px; }
.entry-row label strong, .entry-row label small { display: block; }
.entry-row label strong { overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.entry-row label small { margin-top: 3px; color: var(--muted); font-size: .64rem; }
.entry-row select { width: 96px; height: 39px; padding: 0 8px; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; background: transparent; color: var(--ink); font-weight: 820; }
.entry-row select:disabled { color: #8a887f; border-bottom-color: #aaa59c; background: var(--paper-2); opacity: 1; }
.round-score { text-align: right; font-size: .9rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.positive { color: var(--green) !important; }
.negative { color: var(--red) !important; }
.neutral { color: var(--muted) !important; }
.starter-star { color: #966700; font-weight: 950; }

.round-status { min-height: 48px; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-top: 16px; padding: 10px 0 10px 12px; border-left: 4px solid var(--line); font-size: .76rem; font-weight: 720; }
.round-status.error { color: var(--red); border-left-color: var(--red); }
.round-status.valid { color: var(--green); border-left-color: var(--green); }
.round-status.locked { color: var(--ink); border-left-color: var(--green); }
.round-status button { min-height: 36px; padding: 5px 10px; border: 1px solid currentColor; background: transparent; color: inherit; font-weight: 800; }
.correction-note { color: #6f5105; border-left-color: var(--gold); }

.round-nav { width: min(1500px, 100%); margin: 0 auto; display: grid; grid-template-columns: 72px minmax(180px, 1fr); gap: 9px; padding: 0 clamp(24px, 4vw, 60px) 32px; }
.round-nav .back-button { font-size: 1.1rem; }
.round-nav .primary-action { min-height: 48px; }

/* Sheet */
.sheet-shell { min-width: 0; padding: 28px 0 40px; }
.sheet-intro, .standings-head { width: min(1500px, calc(100% - 48px)); margin: 0 auto 16px; display: flex; gap: 20px; align-items: end; justify-content: space-between; }
.sheet-intro h1, .standings-head h1 { margin: 0; font-size: clamp(1.7rem, 3vw, 2.7rem); font-weight: 560; letter-spacing: -.04em; }
.sheet-intro p, .standings-head p { margin: 5px 0 0; color: var(--muted); font-size: .72rem; }
.table-scroll { max-height: calc(100dvh - 100px); overflow: auto; border-block: 1px solid var(--ink); background: var(--paper-3); }
.score-table { width: max-content; min-width: 100%; border-collapse: separate; border-spacing: 0; font-size: .73rem; font-variant-numeric: tabular-nums; }
.score-table th, .score-table td { height: 42px; padding: 5px 6px; border-right: 1px solid #ded8cd; border-bottom: 1px solid #ded8cd; text-align: center; white-space: nowrap; }
.score-table thead th { position: sticky; z-index: 12; top: 0; color: #fff; background: var(--ink); font-size: .67rem; }
.score-table thead tr:nth-child(2) th { top: 42px; color: var(--ink); background: var(--paper-2); }
.score-table .sticky-left { position: sticky; z-index: 10; left: 0; min-width: 132px; max-width: 132px; border-right: 2px solid var(--ink); background: var(--paper-3); text-align: left; }
.score-table thead .sticky-left { z-index: 20; color: #fff; background: var(--ink); }
.score-table tbody tr:nth-child(even) td { background: #f1ede4; }
.score-table tbody tr:nth-child(even) .sticky-left { background: #f1ede4; }
.score-table tbody tr.is-viewed td { box-shadow: inset 0 2px 0 var(--gold), inset 0 -2px 0 var(--gold); }
.score-table tbody tr.is-viewed .sticky-left { box-shadow: inset 0 2px 0 var(--gold), inset 0 -2px 0 var(--gold); }
.score-table tbody tr.locked td { color: #6f6d66; }
.score-table tbody tr.no-trump .round-kind { color: #795500; font-weight: 900; }
.round-label-cell button { min-height: 30px; padding: 2px 6px; border: 1px solid var(--line); background: transparent; color: var(--ink); font-size: .62rem; font-weight: 800; }
.round-number { display: inline-block; min-width: 24px; color: var(--muted); font-weight: 850; }
.mini-input { width: 54px; height: 32px; padding: 0 4px; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; background: transparent; color: var(--ink); text-align: center; font-weight: 800; }
.mini-input:disabled { border-bottom-color: #aaa59c; background: #e8e3da; color: #8a887f; opacity: 1; }
.score-cell { min-width: 50px; font-weight: 900; }
.player-head { min-width: 166px; border-top: 4px solid var(--player-color) !important; }
.table-error { max-width: 190px; color: var(--red); text-align: left !important; white-space: normal !important; line-height: 1.25; }

/* Standings */
.standings-shell { width: min(920px, calc(100% - 48px)); margin: 0 auto; padding: 34px 0 44px; }
.standings-head { width: 100%; margin-bottom: 24px; padding-bottom: 14px; border-bottom: 2px solid var(--ink); }
.ranking { border-top: 1px solid var(--ink); }
.rank-row { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; gap: 16px; align-items: center; min-height: 62px; border-bottom: 1px solid var(--line); }
.rank-number { color: var(--muted); font-size: .76rem; font-variant-numeric: tabular-nums; }
.rank-name { overflow: hidden; font-weight: 830; text-overflow: ellipsis; white-space: nowrap; }
.rank-score { font-size: 1.16rem; font-weight: 920; font-variant-numeric: tabular-nums; }
.scores-hidden-note { padding: 22px 0; border-block: 1px solid var(--line); color: var(--muted); font-size: .9rem; }
.export-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }

/* Rounds manager */
.rounds-dialog, .confirm-dialog { padding: 0; border: 1px solid var(--ink); border-radius: 0; background: var(--paper-3); color: var(--ink); }
.rounds-dialog { width: min(860px, calc(100% - 28px)); max-height: min(90dvh, 900px); }
.confirm-dialog { width: min(430px, calc(100% - 28px)); }
.rounds-dialog::backdrop, .confirm-dialog::backdrop { background: rgba(23,34,59,.56); }
.rounds-dialog form, .confirm-dialog form { margin: 0; }
.dialog-head { position: sticky; z-index: 3; top: 0; display: flex; justify-content: space-between; gap: 20px; align-items: end; padding: 15px 17px; border-bottom: 2px solid var(--ink); background: var(--paper-3); }
.dialog-head h2 { margin: 0; font-size: 1.55rem; letter-spacing: -.035em; }
.dialog-close { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: var(--ink); line-height: 1; cursor: pointer; }
.dialog-close svg { width: 20px; height: 20px; }
.round-manager { max-height: calc(90dvh - 76px); overflow: auto; }
.round-manager-note { margin: 0; padding: 12px 17px; color: var(--muted); border-bottom: 1px solid var(--line); font-size: .72rem; line-height: 1.45; }
.program-undo { display:none; }
.round-list { border-bottom: 1px solid var(--ink); }
.round-list-row { display: grid; grid-template-columns: 46px 36px minmax(180px,1fr) minmax(120px,.7fr) auto; gap: 8px; align-items: center; min-height: 54px; padding: 5px 14px; border-bottom: 1px solid var(--line); }
.round-list-row:nth-child(odd) { background: #faf8f2; }
.round-list-row:nth-child(even) { background: #ede8dd; }
.round-list-row:last-child { border-bottom: 0; }
.round-list-row.is-past { color: #7c7971; }
.round-list-row.is-current { box-shadow: inset 4px 0 0 var(--gold); }
.round-list-row.sortable-ghost { opacity: .35; }
.round-list-row.sortable-chosen { outline: 2px solid var(--gold); outline-offset: -2px; }
.drag-handle { width: 36px; height: 38px; padding: 0; border: 0; background: transparent; color: var(--muted); font-size: 1rem; cursor: grab; touch-action: none; }
.drag-handle:active { cursor: grabbing; }
.drag-handle:disabled { visibility: hidden; }
.round-list-index { font-size: .68rem; font-weight: 850; font-variant-numeric: tabular-nums; }
.round-list-main strong, .round-list-main span { display: block; }
.round-list-main strong { font-size: .79rem; }
.round-list-main span, .round-starter { margin-top: 2px; color: var(--muted); font-size: .63rem; }
.round-starter { margin: 0; }
.round-list-actions { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.round-list-actions button { min-height: 34px; min-width: 34px; padding: 4px 7px; border: 1px solid #aaa59c; background: rgba(255,255,255,.35); color: var(--ink); font-size: .64rem; font-weight: 800; }
.round-list-actions button:disabled { opacity: .25; }
.round-adder { display: grid; grid-template-columns: 100px 1fr 1.45fr auto; gap: 9px; align-items: end; padding: 16px 17px 18px; }
.round-adder label { display: grid; gap: 5px; color: var(--muted); font-size: .62rem; font-weight: 820; letter-spacing: .06em; text-transform: uppercase; }
.round-adder select { min-height: 40px; padding: 0 8px; border: 1px solid var(--ink); border-radius: 0; background: var(--paper-3); color: var(--ink); }
.round-adder .button { min-height: 40px; }

.confirm-dialog form { padding: 20px; }
.confirm-dialog h2 { margin: 0 0 8px; font-size: 1.24rem; }
.confirm-dialog p { margin: 0 0 20px; color: var(--muted); line-height: 1.5; }
.dialog-actions { display: flex; gap: 8px; justify-content: flex-end; }

.toast { position: fixed; z-index: 120; right: 20px; bottom: 20px; max-width: min(440px, calc(100vw - 32px)); padding: 11px 14px; color: #fff; background: var(--ink); font-size: .78rem; font-weight: 750; }

@media (max-width: 1099px) {
  .game-shell { display: block; }
  .game-nav {
    position: sticky;
    top: 0;
    height: auto;
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    grid-template-areas:
      "brand spacer tools"
      "views views views";
    gap: 0 12px;
    padding: 8px 14px 0;
    border-right: 0;
    border-bottom: 1px solid var(--ink);
    background: var(--paper-3);
  }
  .nav-brand { grid-area: brand; grid-template-columns: 34px auto; width: max-content; padding: 0 0 7px; border: 0; }
  .nav-brand img { width: 34px; height: 34px; }
  .nav-brand strong { font-size: .82rem; }
  .nav-brand small { font-size: .56rem; }
  .view-nav { grid-area: views; grid-template-columns: repeat(3,1fr); margin: 0; border-top: 1px solid var(--line); }
  .view-nav button { min-height: 42px; border-bottom: 0; text-align: center; font-size: .72rem; }
  .view-nav button.active::before { top: auto; right: 0; bottom: -1px; left: 0; width: auto; height: 3px; }
  .nav-tools { grid-area: tools; display: flex; align-items: center; align-self: center; margin: 0; border: 0; }
  .nav-tool { min-height: 38px; padding: 0 8px; border: 0; border-left: 1px solid var(--line); font-size: .67rem; text-align: center; }
  .score-privacy { min-height: 38px; padding: 0 7px; border: 0; border-left: 1px solid var(--line); font-size: .64rem; }
  .score-privacy input { width: 17px; height: 17px; }
  .actions-menu { top: 38px; right: 0; bottom: auto; }
  .round-shell { padding-top: 24px; }
  .table-scroll { max-height: calc(100dvh - 130px); }
}

@media (max-width: 820px) {
  .round-overview { grid-template-columns: 1fr; }
  .order-block { padding-right: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .entry-grid { grid-template-columns: 1fr; gap: 20px; }
  .round-shell { padding-inline: 16px; padding-bottom: 88px; }
  .round-nav { position: fixed; z-index: 35; right: 0; bottom: 0; left: 0; grid-template-columns: 62px minmax(0,1fr); padding: 8px 14px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid var(--ink); background: var(--paper-3); }
  .sheet-intro, .standings-head, .standings-shell { width: calc(100% - 28px); }
  .round-list-row { grid-template-columns: 38px 32px minmax(0,1fr); }
  .round-starter { grid-column: 3; }
  .round-list-actions { grid-column: 3; justify-content: flex-start; padding-bottom: 5px; }
  .round-adder { grid-template-columns: 1fr 1fr; }
  .round-adder label:nth-child(3), .round-adder .button { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .setup-view { width: min(100% - 28px, 720px); padding-top: 28px; }
  .setup-brand { grid-template-columns: 66px 1fr; gap: 14px; }
  .setup-brand img { width: 66px; height: 66px; }
  .setup-brand h1 { font-size: clamp(2rem, 13vw, 3.5rem); }
  .game-nav { grid-template-columns: auto 1fr auto; padding-inline: 10px; gap: 0 6px; }
  .nav-brand { grid-template-columns: 30px auto; gap: 6px; }
  .nav-brand img { width: 30px; height: 30px; }
  .nav-brand small { display: none; }
  .nav-tools { gap: 0; }
  .nav-tool { padding: 0 6px; }
  .score-privacy { grid-template-columns: 18px auto; gap: 5px; padding-inline: 6px; }
  .score-privacy span { max-width: 52px; line-height: 1.05; }
  .nav-tools > .nav-tool[data-action="edit-rounds"] { display: none; }
  .round-heading { grid-template-columns: 1fr auto; gap: 10px; }
  .round-title-row h1 { font-size: clamp(1.7rem, 10vw, 2.5rem); }
  .round-heading p { font-size: .68rem; }
  .round-overview { margin-top: 0; }
  .totals-block { grid-template-columns: repeat(var(--players), minmax(68px,1fr)); }
  .entry-row { grid-template-columns:minmax(0,1fr) 82px 50px; gap: 8px; }
  .entry-row select { width: 82px; }
  .round-status { align-items: flex-start; }
  .round-status button { width: 100%; }
  .sheet-shell { padding-top: 18px; }
  .sheet-intro { align-items: flex-start; }
  .sheet-intro .button { min-height: 38px; padding: 5px 8px; font-size: .68rem; }
  .toast { right: 0; bottom: 0; left: 0; max-width: none; }
  .rounds-dialog { width: 100%; max-width: none; height: 100dvh; max-height: none; border: 0; }
  .round-manager { max-height: calc(100dvh - 76px); }
}


/* V4 — neutral surfaces, larger work area, explicit controls */
:root {
  --ink: #17223b;
  --ink-2: #26344f;
  --paper: #f7f7f4;
  --paper-2: #f0f2f2;
  --paper-3: #fcfcfa;
  --line: #d6d9d9;
  --muted: #666b70;
  --gold: #b33a32;
  --gold-soft: #f5e8e6;
  --red: #a72d27;
  --red-soft: #f7e7e5;
  --green: #176846;
  --green-soft: #e8f2ed;
}
html, body { background-color: var(--paper); background-image: url("assets/paper-noise.svg"); background-repeat: repeat; }

.button { border-color:#aeb6bd; border-radius:7px; background:rgba(255,255,255,.62); transition:background-color .14s ease,border-color .14s ease,transform .08s ease; }
.button:hover { border-color:#7e8993; background:#fff; }
.button:active:not(:disabled) { transform:translateY(1px); }
.button-primary { border-color:var(--ink); background:var(--ink); }
.button-primary:hover { border-color:var(--ink-2); background:var(--ink-2); }
.button-secondary { background:rgba(255,255,255,.45); }

.setup-view { width:min(790px,calc(100% - 36px)); padding-top:clamp(36px,7vh,72px); }
.setup-brand { grid-template-columns:128px 1fr; gap:26px; align-items:center; padding-bottom:24px; border-bottom-color:#afb5ba; }
.setup-brand img { width:128px; height:128px; }
.setup-brand h1 { font-size:clamp(2.7rem,7vw,4.9rem); }
.setup-form { gap:28px; padding-top:28px; }
.segmented { overflow:hidden; border-color:#aeb5bb; border-radius:8px; background:rgba(255,255,255,.44); }
.segmented button { min-height:50px; border-right-color:#c7cccf; cursor:pointer; transition:background-color .12s ease,color .12s ease; }
.segmented button:hover:not(.selected) { background:#eef1f2; }
.segmented button.selected { background:var(--ink); }
.name-fields { border-top-color:#bfc4c7; }
.name-field { min-height:52px; border-bottom-color:#d1d4d5; }
.name-field input { height:51px; font-size:.98rem; }

.game-shell { grid-template-columns:246px minmax(0,1fr); }
.game-nav { padding:24px 18px 18px; border-right-color:#c7cbce; background:rgba(252,252,250,.94); backdrop-filter:blur(6px); }
.nav-brand { grid-template-columns:76px 1fr; gap:14px; min-height:92px; padding:0 2px 18px; border-bottom-color:#d3d6d8; }
.nav-brand img { width:76px; height:76px; }
.nav-brand strong { font-size:1.08rem; letter-spacing:-.015em; }
.view-nav { gap:4px; margin-top:18px; border-top:0; }
.view-nav button,.nav-tool { min-height:46px; padding:0 12px; border:0; border-radius:7px; text-align:left; }
.view-nav button { color:#3e4855; }
.view-nav button.active { color:#fff; background:var(--ink); }
.view-nav button.active::before { display:none; }
.view-nav button:hover:not(.active),.nav-tool:hover { background:#eef1f2; }
.nav-tools { gap:5px; margin-top:auto; padding-top:15px; border-top-color:#c7cbce; }
.nav-tool-primary { color:var(--ink); background:#e9edf0; font-weight:820; }
.score-privacy { min-height:46px; padding:0 11px; border:0; border-radius:7px; background:transparent; font-size:.74rem; }
.score-privacy:hover { background:#eef1f2; }
.score-privacy input { width:19px; height:19px; accent-color:var(--ink); }
.utility-actions { display:grid; gap:2px; margin-top:4px; padding-top:8px; border-top:1px solid var(--line); }
.utility-actions button { min-height:38px; padding:0 11px; border:0; border-radius:6px; background:transparent; color:#505962; text-align:left; font-size:.7rem; font-weight:720; cursor:pointer; }
.utility-actions button:hover { background:#eef1f2; color:var(--ink); }
.utility-actions .danger-text { margin-top:3px; border-top:1px solid var(--line); border-radius:0; }

.round-shell { padding-top:38px; }
.round-heading { border-bottom-color:#aeb4b8; }
.round-title-row h1 { font-size:clamp(2.15rem,4vw,3.85rem); }
.badge-trump,.order-chip.starter,.starter-star { color:var(--red); }
.entry-row.is-last { background:#f1f3f4; }
.entry-row select { background:rgba(255,255,255,.2); }
.entry-row select:disabled { color:#7b8085; border-bottom-color:#b7bdc1; background:#eff1f1; }
.correction-note { color:#475362; border-left-color:#75879b; }
.round-status { border-radius:0 6px 6px 0; background:rgba(255,255,255,.38); }
.round-nav .primary-action { min-height:52px; font-size:.92rem; }

.sheet-shell { padding-top:34px; }
.sheet-intro h1,.standings-head h1 { font-size:clamp(2rem,3.2vw,3rem); }
.table-scroll { background:rgba(252,252,250,.88); }
.score-table { font-size:.84rem; }
.score-table th,.score-table td { height:48px; padding:7px 9px; border-right-color:#d9dddf; border-bottom-color:#d9dddf; }
.score-table thead th { font-size:.74rem; }
.score-table thead tr:nth-child(2) th { top:48px; background:#eef1f2; }
.score-table .sticky-left { min-width:158px; max-width:158px; background:#fbfbf9; }
.score-table tbody tr:nth-child(odd) td { background:#fbfbf9; }
.score-table tbody tr:nth-child(even) td { background:#f0f2f2; }
.score-table tbody tr:nth-child(odd) .sticky-left { background:#fbfbf9; }
.score-table tbody tr:nth-child(even) .sticky-left { background:#f0f2f2; }
.score-table tbody tr.is-viewed td,.score-table tbody tr.is-viewed .sticky-left { box-shadow:inset 0 2px 0 #647991,inset 0 -2px 0 #647991; }
.score-table tbody tr.no-trump .round-kind { color:var(--red); }
.player-head { min-width:190px; }
.mini-input { width:62px; height:36px; font-size:.84rem; }
.mini-input:disabled { background:#e9ecec; }
.round-label-cell button { min-height:34px; border-radius:5px; background:rgba(255,255,255,.55); }

.rounds-dialog,.confirm-dialog { border-color:#aab1b6; border-radius:10px; background:#fbfbf9; }
.rounds-dialog { width:min(940px,calc(100% - 30px)); }
.rounds-dialog::backdrop,.confirm-dialog::backdrop { background:rgba(17,27,46,.48); backdrop-filter:blur(1.5px); }
.dialog-head { padding:18px 20px; border-bottom-color:#aeb4b8; background:#fbfbf9; }
.dialog-head h2 { font-size:1.75rem; }
.dialog-close { border-radius:50%; }
.dialog-close:hover { background:#edf0f1; }
.round-manager-note { padding:13px 20px; }
.program-undo { padding-inline:20px; background:#e7edf2; }
.round-list-row { grid-template-columns:48px 38px minmax(190px,1fr) minmax(130px,.72fr) auto; min-height:58px; padding:6px 16px; }
.round-list-row:nth-child(odd) { background:#fbfbf9; }
.round-list-row:nth-child(even) { background:#eef1f2; }
.round-list-row.is-past { color:#73787d; }
.round-list-row.is-current { background:#e8edf2; box-shadow:inset 4px 0 0 #5d738a; }
.round-list-row.is-dragging { opacity:.58; outline:2px solid #5d738a; outline-offset:-2px; }
.drag-handle { width:40px; height:42px; border:1px solid transparent; border-radius:6px; color:#526170; font-size:1.25rem; }
.drag-handle:not(:disabled):hover { border-color:#b7c0c7; background:rgba(255,255,255,.72); }
.round-list-actions { gap:6px; }
.round-list-actions button { min-height:36px; min-width:36px; padding:5px 9px; border-radius:6px; background:rgba(255,255,255,.72); }
.round-list-actions .round-action-move { border-color:#aab4bc; color:#35485c; }
.round-list-actions .round-action-delete { border-color:#d7aaa6; color:#8d2a24; }
.round-list-actions .round-action-end { border-color:#97a8b8; color:#35485c; background:#eef3f6; }
.round-adder { padding:18px 20px 20px; }
.round-adder select { border-color:#aeb5bb; border-radius:6px; background:#fff; }

@media (max-width:1099px) {
  .game-nav { grid-template-columns:1fr; grid-template-areas:"brand" "views" "tools"; gap:0; padding:8px 12px 10px; background:rgba(252,252,250,.96); }
  .nav-brand { grid-area:brand; grid-template-columns:48px 1fr; min-height:56px; width:100%; gap:10px; padding:0 0 7px; border-bottom:0; }
  .nav-brand img { width:48px; height:48px; }
  .nav-brand strong { font-size:.94rem; }
  .view-nav { grid-area:views; grid-template-columns:repeat(3,1fr); gap:4px; margin:4px 0 7px; padding:4px; border:1px solid var(--line); border-radius:8px; background:#f0f2f2; }
  .view-nav button { min-height:40px; border-radius:6px; text-align:center; }
  .nav-tools { grid-area:tools; display:grid; grid-template-columns:minmax(150px,auto) minmax(150px,auto) minmax(0,1fr); gap:6px; margin:0; padding:0; border:0; }
  .nav-tool { min-height:40px; padding:0 10px; border:1px solid var(--line); text-align:center; }
  .score-privacy { min-height:40px; padding:0 10px; border:1px solid var(--line); background:rgba(255,255,255,.5); }
  .utility-actions { display:flex; min-width:0; gap:4px; overflow-x:auto; margin:0; padding:0 0 2px; border:0; scrollbar-width:thin; }
  .utility-actions button { flex:0 0 auto; min-height:40px; padding:0 10px; border:1px solid var(--line); border-radius:6px; background:rgba(255,255,255,.5); text-align:center; }
  .utility-actions .danger-text { margin:0; border-top:1px solid var(--line); }
  .round-shell { padding-top:28px; }
  .table-scroll { max-height:calc(100dvh - 190px); }
}

@media (max-width:720px) {
  .setup-view { width:min(100% - 28px,790px); padding-top:26px; }
  .setup-brand { grid-template-columns:84px 1fr; gap:15px; }
  .setup-brand img { width:84px; height:84px; }
  .setup-brand h1 { font-size:clamp(2.25rem,12vw,3.6rem); }
  .game-nav { position:sticky; top:0; }
  .nav-brand { grid-template-columns:44px 1fr; min-height:50px; }
  .nav-brand img { width:44px; height:44px; }
  .nav-tools { grid-template-columns:1fr 1fr; }
  .score-privacy span { max-width:none; line-height:1.2; }
  .utility-actions { grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); overflow:visible; }
  .utility-actions button { min-width:0; min-height:42px; padding:5px 6px; white-space:normal; line-height:1.15; font-size:.64rem; }
  .round-shell { padding-inline:14px; }
  .round-tools .button { font-size:.68rem; padding-inline:8px; }
  .score-table { font-size:.8rem; }
  .score-table th,.score-table td { height:45px; padding:6px 7px; }
  .score-table thead tr:nth-child(2) th { top:45px; }
  .rounds-dialog { width:100%; max-width:none; height:100dvh; max-height:none; border:0; border-radius:0; }
  .round-list-row { grid-template-columns:42px 34px minmax(0,1fr); padding-inline:12px; }
  .round-starter { grid-column:3; }
  .round-list-actions { grid-column:3; justify-content:flex-start; padding-bottom:5px; }
}

@media print {
  .game-nav, .round-nav, .sheet-intro .button, .toast, .offline-banner, .update-banner { display: none !important; }
  .game-shell { display: block; }
  .table-scroll { max-height: none; overflow: visible; }
  .score-table { font-size: 8pt; }
}

/* V5 — history, typography and destructive-action contrast */
.program-history {
  display:flex;
  gap:16px;
  align-items:center;
  justify-content:space-between;
  padding:12px 20px;
  border-bottom:1px solid var(--line);
  background:#eef1f3;
}
.program-history-copy strong,.program-history-copy span { display:block; }
.program-history-copy strong { font-size:.72rem; font-weight:700; }
.program-history-copy span { margin-top:2px; color:var(--muted); font-size:.65rem; }
.program-history-actions { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; }
.program-history-actions button {
  min-height:36px;
  padding:5px 10px;
  border:1px solid #aeb6bd;
  border-radius:6px;
  background:#fff;
  color:var(--ink);
  font:inherit;
  font-size:.68rem;
  font-weight:600;
  cursor:pointer;
}
.program-history-actions button:hover:not(:disabled) { border-color:#7e8993; background:#f8f9f9; }
.program-history-actions button:disabled { opacity:.38; cursor:not-allowed; }
.program-history-actions .program-reset { border-color:#7f8e9b; background:#e7edf1; }
.confirm-dialog .button-danger {
  color:#fff;
  border-color:var(--red);
  background:var(--red);
}
.confirm-dialog .button-danger:hover {
  color:#fff;
  border-color:#85231f;
  background:#85231f;
}
.confirm-dialog .button-secondary { color:var(--ink); background:#fff; }
@media (max-width:720px) {
  .program-history { align-items:flex-start; flex-direction:column; }
  .program-history-actions { width:100%; justify-content:flex-start; }
}

/* One scroll container keeps the editor reachable on folded and short screens. */
.rounds-dialog {
  inset: 0;
  width: min(940px, calc(100% - 24px));
  height: auto;
  max-height: calc(100vh - 24px);
  max-height: calc(100dvh - 24px);
  margin: auto;
  overflow: auto;
  overscroll-behavior: contain;
}
.round-manager { max-height: none; overflow: visible; padding-bottom: env(safe-area-inset-bottom, 0px); }
.round-adder { border-bottom: 1px solid var(--line); }
.round-adder label, .round-list-main { min-width: 0; }
.round-adder select { width: 100%; min-width: 0; }
.full-deck-note { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: .75rem; }
.tools-toggle { display: none; }

@media screen and (max-width:1099px) {
  /* Only the three views and one tools button occupy the normal header. */
  .game-nav {
    position: relative;
    height: auto;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "views toggle" "tools tools";
    gap: 0 8px;
    padding: 6px 10px;
  }
  .nav-brand { display: none; }
  .view-nav { margin: 0; padding: 2px; min-width: 0; }
  .view-nav button { min-height: 40px; padding: 0 6px; }
  .tools-toggle { display: block; grid-area: toggle; min-height: 44px; padding: 0 10px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--ink); font: inherit; font-size: .75rem; font-weight: 700; }
  .tools-toggle[aria-expanded="true"] { background: #e9edf0; }
  .game-nav:not(.tools-open) .nav-tools { display: none; }
  .nav-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 8px; }
  .nav-tools > .nav-tool[data-action="edit-rounds"] { display: block; }
  .utility-actions { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; }
  .utility-actions button { min-width: 0; white-space: normal; padding: 6px; }
  /* Let the sheet itself use the remaining viewport, not a second fixed menu. */
  .game-shell:has(#sheetView:not([hidden])) { height: 100dvh; min-height: 0; display: flex; flex-direction: column; }
  .game-shell:has(#sheetView:not([hidden])) .game-nav { flex: 0 0 auto; }
  .game-shell:has(#sheetView:not([hidden])) .workspace { flex: 1; min-height: 0; }
  #sheetView:not([hidden]) { height: 100%; }
  .sheet-shell { height: 100%; display: flex; flex-direction: column; padding: 10px 0 0; }
  .sheet-intro { width: calc(100% - 24px); flex: 0 0 auto; margin-bottom: 10px; align-items: center; gap: 8px; }
  .sheet-intro h1 { font-size: 1.35rem; }
  .sheet-intro p { font-size: .65rem; margin-top: 2px; }
  .sheet-intro .button { min-height: 36px; font-size: .7rem; }
  .table-scroll { flex: 1; min-height: 0; max-height: none; overscroll-behavior: contain; padding-bottom: env(safe-area-inset-bottom, 0px); }
  .score-table .sticky-left { min-width: 90px; max-width: 90px; white-space: normal; }
  .score-table thead th { height: 38px; }
  .score-table thead tr:nth-child(2) th { top: 38px; }
  .round-label-cell button { display: block; margin-bottom: 3px; }
}
@media screen and (max-width:720px) {
  .dialog-head { padding: 12px; gap: 8px; }
  .dialog-head h2 { font-size: 1.25rem; }
  .dialog-close { flex: 0 0 44px; }
  .round-manager-note { padding: 10px 12px; }
  .round-adder { padding: 12px; gap: 8px; }
  .program-history { padding: 10px 12px; gap: 8px; }
  .program-history-actions { gap: 4px; }
  .program-history-actions button { padding-inline: 7px; }
}

/* Compact entry: each player has one row and two deliberately separate inputs. */
.round-heading { align-items: center; padding-bottom: 14px; }
.round-heading h1 { margin: 0; font-size: clamp(1.65rem, 3vw, 2.8rem); line-height: 1.1; font-weight: 650; letter-spacing: -.03em; }
.round-counter { white-space: nowrap; font-size: .85rem; }
.round-overview { display: flex; flex-direction: column; }
.round-overview .order-flow { padding: 14px 0; }
.order-chip { font-size: .9rem; }
.totals-block { border-top: 1px solid var(--line); }
.score-pill span { font-size: .8rem; }
.score-pill strong { font-size: 1.2rem; }
.round-entry { --name-column: minmax(0,1fr); --bid-column: 96px; --tricks-column: 150px; border-left: 4px solid var(--red); padding-left: 12px; margin-top: 20px; }
.round-entry.valid { border-left-color: var(--green); }
.entry-head, .round-entry .entry-row { display: grid; grid-template-columns: var(--name-column) var(--bid-column) var(--tricks-column); gap: 12px; align-items: center; }
.entry-head { border-bottom: 1px solid var(--line); padding-bottom: 8px; align-items: start; }
.entry-head > h2 { grid-column: 2; }
.entry-head > div { grid-column: 3; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.entry-head h2 { margin: 0; font-size: .9rem; font-weight: 650; }
.tricks-counter { color: var(--muted); font-size: .85rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tricks-counter.negative { color: var(--red); }
.tricks-counter.positive { color: var(--green); }
.round-entry .entry-row { min-height: 66px; padding-block: 7px; }
.entry-player { font-size: clamp(1rem, 1.6vw, 1.3rem); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.tricks-entry { display: flex; align-items: center; gap: 8px; min-width: 0; }
.score-input { position: relative; display: inline-block; min-width: 0; width: 100%; }
.score-input select { width: 100%; height: 48px; padding: 0 5px; border: 1px solid #afb8bd; border-radius: 6px; background: #fff; color: var(--ink); font: inherit; font-size: 1.5rem; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }
.score-input select:disabled { opacity: 1; background: #e9edee; color: #6b747b; border-color: #c9cfd2; }
.tricks-entry > .score-input { flex: 1; }
.round-entry .round-score { width: 40px; flex: 0 0 40px; font-size: 1.25rem; }
.bid-unlock { position: absolute; inset: 0; width: 100%; border: 1px solid #b8c1c7; border-radius: 6px; background: #e1e6e9; color: #596873; font: inherit; font-size: 1.5rem; font-weight: 700; cursor: pointer; }
.bid-unlock:focus-visible, .score-input select:focus-visible { outline: 3px solid #6f91aa; outline-offset: 2px; }
.score-input.is-starter { outline: 1px solid #b33a3290; outline-offset: 2px; border-radius: 6px; }
.score-input.mini { width: 68px; }
.score-input.mini select, .score-input.mini .bid-unlock { font-size: 1.15rem; height: 40px; }
.round-nav .correction-action { grid-column: 1 / -1; min-height: 48px; }
.sheet-options { display: flex; align-items: center; gap: 7px; font-size: .8rem; white-space: nowrap; }
.sheet-options input { width: 18px; height: 18px; accent-color: var(--ink); }
.sheet-intro { flex-wrap: wrap; gap: 8px 12px; }
.sheet-intro > div { margin-right: auto; }
.score-table.scores-only .player-head { min-width: 90px; }
.score-table .round-edit { display: inline-flex; align-items: center; justify-content: center; width: 32px; min-height: 32px; padding: 4px; margin: 0 4px 0 0; }
.score-table .round-edit svg { flex-shrink: 0; }
.print-value { display: none; }
.transfer-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.transfer-heading h2 { margin: 0; }
.transfer-actions { display: grid; gap: 10px; margin-top: 20px; }
.tools-toggle { display: block; min-height: 44px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--ink); font: inherit; font-weight: 700; }
.game-nav:not(.tools-open):not(.tools-pinned) .nav-tools { display: none; }
@media screen and (max-width:1099px) {
  .game-nav { grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 0 6px; padding: 6px; }
  .view-nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .view-nav button, .tools-toggle { font-size: .95rem; }
  .round-shell { padding-top: 20px; }
}
@media screen and (max-width:620px) {
  .round-shell { padding: 16px 10px 88px; }
  .round-shell:has(+ .round-nav .correction-action) { padding-bottom: 144px; }
  .round-entry { --name-column: minmax(0,1fr); --bid-column: 62px; --tricks-column: 104px; padding-left: 7px; margin-top: 14px; }
  .entry-head, .round-entry .entry-row { gap: 6px; }
  .entry-head h2 { font-size: .78rem; }
  .entry-head > div { flex-wrap: wrap; }
  .tricks-counter { font-size: .8rem; }
  .round-entry .entry-row { min-height: 64px; }
  .round-entry .round-score { width: 35px; flex-basis: 35px; font-size: 1.1rem; }
  .tricks-entry { gap: 5px; }
  .entry-player { font-size: 1rem; }
  .sheet-options { font-size: .72rem; }
  .score-pill { padding: 8px 6px; }
}
@media print {
  @page { size: A4 landscape; margin: 8mm; }
  html, body { background: white !important; }
  #setupView, #roundView, #standingsView, .game-nav, .round-nav, .sheet-intro, .toast, .offline-banner, dialog { display: none !important; }
  #gameView, #sheetView { display: block !important; }
  .game-shell, .workspace, .sheet-shell, .table-scroll { display: block !important; height: auto !important; max-height: none !important; overflow: visible !important; padding: 0; }
  .score-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; font-size: 13pt; }
  .score-table th, .score-table td { height: 25px; padding: 3px 1px; color: #17223b; border: 1px solid #999; background: #fff !important; box-shadow: none !important; white-space: normal; }
  .score-table thead { display: table-header-group; }
  .score-table thead th { position: static; color: #17223b; font-size: 9pt; }
  .score-table thead .sticky-left { color: #17223b; }
  .score-table tr { break-inside: avoid; }
  .score-table .sticky-left, .score-table .player-head, .score-table.scores-only .player-head { position: static; min-width: 0; max-width: none; }
  .score-table .sticky-left { width: 18mm; font-size: 11pt; }
  .score-table .score-cell { min-width: 0; font-size: 13pt; }
  .score-input, .score-input.mini { width: auto; outline: none; }
  .score-input select, .bid-unlock, .round-edit { display: none !important; }
  .print-value { display: inline; font-size: 13pt; font-weight: 700; color: #17223b; }
}

/* Read-only sheet and the same full-width navigation in every view. */
.game-nav { width: 100%; }
.tools-toggle { display: flex; align-items: center; justify-content: center; margin-top: 16px; flex-shrink: 0; }
.tools-toggle img { display: block; }
.game-nav.tools-pinned .tools-toggle { border: 0; background: transparent; opacity: 1; cursor: default; align-self: flex-start; }
.game-nav.tools-pinned .nav-tools { display: grid; margin-top: 8px; padding-top: 8px; }
.nav-tools .nav-tool, .score-privacy, .utility-actions button { font-size: .95rem; }
.game-nav .view-nav, .game-nav .nav-brand { flex-shrink: 0; }
.game-nav .nav-tools { flex-shrink: 0; }
.tricks-counter { font-size: 1.05rem; font-weight: 800; }
.entry-head h2 { font-size: 1rem; }
.entry-head > div { flex-wrap: wrap; }
.left-handed .entry-head, .left-handed .round-entry .entry-row { grid-template-columns: var(--bid-column) var(--tricks-column) var(--name-column); }
.left-handed .entry-player { grid-column: 3; grid-row: 1; text-align: right; }
.left-handed .entry-row > .score-input { grid-column: 1; grid-row: 1; }
.left-handed .entry-row > .tricks-entry { grid-column: 2; grid-row: 1; }
.left-handed .entry-head > h2 { grid-column: 1; grid-row: 1; }
.left-handed .entry-head > div { grid-column: 2; grid-row: 1; }
.sheet-options { font-size: 1rem; }
.print-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.print-button img { flex-shrink: 0; }
.print-button { min-width: 44px; min-height: 44px; padding: 7px; }
.score-table { font-size: 1.5rem; }
.score-table th, .score-table td { height: 52px; padding: 6px 10px; }
.score-table thead th { font-size: 1.2rem; height: 52px; }
.score-table thead tr:nth-child(2) th { top: 52px; font-size: 1rem; }
.score-table .player-head, .score-table.scores-only .player-head { min-width: 144px; }
.score-table .score-cell { font-size: 1.5rem; min-width: 64px; font-weight: 750; }
.score-table .sticky-left { min-width: 150px; max-width: none; }
.round-sheet-label { display: flex; align-items: center; gap: 8px; }
.score-table .round-number { font-size: .95rem; min-width: 22px; color: var(--muted); }
.score-table .round-kind, .score-table tbody tr.no-trump .round-kind { font-size: 1.2rem; font-weight: 700; color: var(--ink); white-space: nowrap; }
.score-table .round-edit { margin: 0 0 0 auto; width: 36px; height: 40px; flex-shrink: 0; }
.score-table .round-edit:disabled { opacity: .2; }
.sheet-number { display: inline-block; min-width: 1.8em; line-height: 1.4; font-weight: 650; }
.sheet-number.is-starter { outline: 1px solid #b33a3270; border-radius: 4px; }
.score-table tfoot th, .score-table tfoot td { border-top: 2px solid var(--ink); font-weight: 800; background: #e8edf0; }
.toast.toast-error { top: max(12px, env(safe-area-inset-top)); bottom: auto; left: 50%; right: auto; transform: translateX(-50%); width: max-content; max-width: calc(100vw - 24px); background: #7f1d1d; border-radius: 8px; padding: 14px 18px; font-size: 1rem; box-shadow: 0 3px 16px #0003; }
@media screen and (min-width:1100px) {
  .game-nav { overflow-y: auto; }
}
@media screen and (max-width:1099px) {
  .game-nav, .game-shell:has(#sheetView:not([hidden])) .game-nav { align-self: stretch; width: 100%; grid-template-columns: minmax(0,1fr) 48px; }
  .tools-toggle { margin: 0; padding: 0; }
  .nav-tools { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .nav-tools .nav-tool-primary { grid-column: 1 / -1; }
  .sheet-intro .print-button { font-size: .95rem; min-height: 42px; }
  .score-table thead th { height: 48px; }
  .score-table thead tr:nth-child(2) th { top: 48px; }
}
@media screen and (max-width:620px) {
  .entry-head h2 { font-size: .85rem; }
  .tricks-counter { font-size: 1rem; }
  .sheet-options { font-size: .95rem; }
  .score-table th, .score-table td { padding-inline: 7px; }
  .score-table .sticky-left { min-width: 142px; }
  .utility-actions { grid-template-columns: 1fr; }
}
@media screen {
  .score-table.scores-only { width: auto; min-width: 0; table-layout: fixed; }
  .score-table.scores-only th, .score-table.scores-only td { width: 64px; min-width: 64px; max-width: 64px; padding: 5px 3px; }
  .score-table.scores-only .player-head { width: 64px; min-width: 64px; max-width: 64px; font-size: 14px; }
  .score-table.scores-only .player-head span { display: -webkit-box; width: 57px; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; overflow-wrap: anywhere; line-height: 1.15; }
  .score-table.scores-only .sticky-left { width: 88px; min-width: 88px; max-width: 88px; }
  .score-table.scores-only thead .sticky-left { font-size: 15px; }
  .scores-only .round-sheet-label { display: grid; grid-template-columns: minmax(0,1fr) 30px; gap: 0 2px; }
  .score-table.scores-only .round-number { grid-column: 1; grid-row: 1; font-size: 12px; line-height: 1.1; min-width: 0; }
  .score-table.scores-only .round-kind { grid-column: 1; grid-row: 2; font-size: 18px; line-height: 1.2; }
  .score-table.scores-only .round-edit { grid-column: 2; grid-row: 1 / 3; width: 30px; height: 40px; margin: 0; }
}
@media print {
  @page { size: A4 portrait; margin: 8mm; }
  .score-table, .score-table .score-cell, .score-table.scores-only, .score-table.scores-only .score-cell { font-size: min(18pt, calc(var(--print-row) * .62)); }
  .score-table th, .score-table td { height: var(--print-row); padding: 0 1px; line-height: 1; }
  .score-table .score-cell { min-width: 0; }
  .score-table thead th, .score-table thead tr:nth-child(2) th { position: static; height: auto; font-size: min(10pt, calc(var(--print-row) * .42)); }
  .score-table .sticky-left { min-width: 0; width: 24mm; font-size: 13pt; }
  .round-sheet-label { gap: 7px; }
  .score-table .round-kind, .score-table tbody tr.no-trump .round-kind { font-size: min(12pt, calc(var(--print-row) * .5)); }
  .score-table .round-number { font-size: min(10pt, calc(var(--print-row) * .42)); }
  .sheet-number { min-width: 0; line-height: 1.05; outline: none !important; }
  .score-table .player-head, .score-table.scores-only .player-head { min-width: 0; overflow-wrap: anywhere; }
  .score-table tfoot { display: table-row-group; }
}
