/* Tournament console: fixed feedback, a separate checklist rail, no overlays. */
:root {
  --bg: #090909;
  --bg-soft: #111111;
  --surface: #151515;
  --surface-raised: #1c1c1c;
  --surface-strong: #262626;
  --text: #ffffff;
  --text-soft: #d4d4d4;
  --muted: #969696;
  --accent: #ed1c23;
  --accent-ink: #ffffff;
  --divider: #2c2c2c;
  --divider-strong: #454545;
  --success: #55b986;
  --warning: #e6b94f;
  --danger: #9c3b50;
  --check-rail-width: clamp(260px, 22vw, 320px);
}

body { background: var(--bg); }
.topbar, .coach-panel, .panel-tabs { background: #101010; }
.mobile-training-float { display: none !important; }

.checkpoint-rail {
  position: sticky;
  top: 68px;
  align-self: start;
  min-width: 0;
  height: calc(100dvh - 68px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 18px 12px;
  border-inline: 1px solid var(--divider);
  background: #111111;
}
.checkpoint-rail .audit-head { align-items: flex-start; gap: 6px; }
.audit-head-controls { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.audit-head-controls > strong { color: var(--muted); font: 12px var(--font-mono); }
.audit-toggle { display: inline-flex; align-items: center; gap: 8px; border: 0; padding: 6px 0; background: none; cursor: pointer; }
.checkpoint-rail .audit-toggle > span { color: var(--text-soft); font-size: 12px; }
.audit-toggle i { display: block; width: 36px; height: 21px; padding: 3px; border-radius: 20px; background: #525252; transition: background 160ms ease; }
.audit-toggle i::after { content: ''; display: block; width: 15px; height: 15px; border-radius: 50%; background: white; transition: transform 160ms ease; }
.audit-toggle[aria-checked="true"] i { background: #b91720; }
.audit-toggle[aria-checked="true"] i::after { transform: translateX(15px); }
.checkpoint-rail .audit-head span { font-size: 9px; letter-spacing: 0; }
.checkpoint-rail h3 { margin-top: 7px; font-size: 17px; }
.audit-stages { display: grid; gap: 6px; margin-top: 20px; }
.audit-stage-button {
  display: grid;
  grid-template-columns: 22px 1fr auto;
  align-items: center;
  gap: 6px;
  min-height: 48px;
  padding: 10px;
  border: 1px solid #333;
  border-radius: 6px;
  background: #191919;
  text-align: left;
  cursor: pointer;
}
.audit-stage-button > span { color: #888; font: 11px var(--font-mono); }
.audit-stage-button strong { font-size: 13px; }
.audit-stage-button small { color: var(--muted); font-size: 10px; }
.audit-stage-button:hover { background: #242424; }
.audit-stage-button.is-selected { border-color: var(--accent); background: #251315; }
.audit-stage-button.is-complete > span { color: var(--success); }
.audit-stage-note { margin: 16px 1px 8px; color: #aaa; font-size: 11px; line-height: 1.7; }
.checkpoint-rail .audit-check { align-items: start; padding: 10px 7px; grid-template-columns: 20px minmax(0, 1fr); gap: 7px; border-radius: 5px; }
.checkpoint-rail .audit-check > span:first-child { width: 18px; height: 18px; border-radius: 4px; font-size: 10px; }
.checkpoint-rail .audit-check strong { font-size: 12px; line-height: 1.6; }
.checkpoint-rail .audit-check small { font-size: 11px; line-height: 1.7; }
.checkpoint-rail .audit-check.is-checked { border-color: #315144; background: #14221b; }
.audit-recheck-label { color: var(--warning); font-size: 11px; margin: 12px 0 0; }

/* Observation tests stay in the dedicated rail; results never cover the table. */
.observation-score { display: grid; grid-template-columns: 1fr auto; gap: 5px; padding: 12px 0; border-block: 1px solid #333; margin-bottom: 8px; }
.observation-score > span { font-size: 14px; }
.observation-score > strong { color: #fff; font-size: 24px; line-height: 1; }
.observation-score strong small { color: #888; font-size: 12px; }
.observation-score p { grid-column: 1 / -1; margin: 0; color: #aaa; font-size: 12px; line-height: 1.7; }
.observation-question { min-width: 0; padding: 14px 10px; border: 1px solid #333; border-radius: 6px; background: #151515; }
.observation-question > small { color: #9b9b9b; font-size: 12px; }
.observation-question h3 { margin: 8px 0 12px; font-size: 14px; line-height: 1.7; font-weight: 600; }
.observation-help, .checkpoint-rail .audit-check small.observation-help { display: block; margin: 0 0 14px; color: #bcbcbc; font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
.checkpoint-rail .audit-check small.observation-help { margin: 9px 0 0; }
.training-glossary { margin: 12px 0 16px; border-block: 1px solid var(--divider); font-size: 14px; line-height: 1.8; }
.training-glossary summary { padding: 10px 0; color: #ded0af; cursor: pointer; }
.training-glossary summary:focus-visible { outline: 2px solid white; outline-offset: 3px; }
.training-glossary dl { margin: 0; }
.training-glossary dt { color: #eee; font-weight: 600; margin-top: 12px; }
.training-glossary dd { margin: 3px 0 10px; color: #bbb; }
.training-glossary a { color: #b9b9b9; font-size: 12px; }
.observation-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.observation-options button { min-width: 0; min-height: 38px; padding: 7px 5px; border: 1px solid #494949; border-radius: 4px; color: #eee; background: #232323; font: inherit; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.observation-options button:last-child:nth-child(odd) { grid-column: 1 / -1; }
.observation-options button[aria-pressed="true"] { background: #393939; border-color: #ddd; }
.observation-options button:hover:not(:disabled) { border-color: #eee; }
.observation-question button:focus-visible, .observation-question input:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.observation-number { display: grid; gap: 8px; }
.observation-number label { display: grid; gap: 5px; color: #aaa; font-size: 12px; }
.observation-number input { width: 100%; min-width: 0; padding: 9px; border: 1px solid #555; border-radius: 4px; background: #090909; color: white; font: 16px var(--font-mono); }
.observation-number button { padding: 9px; border: 1px solid #777; border-radius: 4px; background: #303030; color: white; font: inherit; font-size: 14px; }
.observation-question[data-tone="error"] { border: 2px solid #9c3b50; animation: observation-correction 1.4s ease-in-out 2; }
@keyframes observation-correction { 50% { box-shadow: 0 0 0 2px #9c3b5040; border-color: #ef99ad; } }
.observation-question[data-tone="success"] { border-color: #55b986; }
.observation-question[data-tone="plan"] { border-color: #e6b94f; }
.observation-feedback { margin-top: 12px; padding-top: 10px; border-top: 1px solid #3a3a3a; font-size: 13px; line-height: 1.8; }
.observation-feedback p { margin: 5px 0 0; color: #bbb; overflow-wrap: anywhere; }
[data-tone="error"] .observation-feedback strong { color: #ef99ad; }
[data-tone="success"] .observation-feedback strong { color: #78d6a7; }
[data-tone="plan"] .observation-feedback strong { color: #e6b94f; }
@media (max-width: 959px) { .observation-score { grid-column: 1 / -1; } }

/* The result comes first. Context and previous-hand detail remain below it. */
.coach-panel { display: flex; flex-direction: column; }
.coach-panel > * { flex-shrink: 0; }
.coach-panel > .coach-utilities { order: -1; }
.coach-utilities .session-metrics { position: static; display: grid; width: 100%; min-width: 0; min-height: 58px; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 8px 4px; border: 0; border-bottom: 1px solid var(--divider); }
.coach-utilities .session-metrics > div { min-width: 0; padding: 0 8px; }
.coach-utilities .session-metrics strong { overflow-wrap: anywhere; font-size: 13px; }
.coach-utilities .topbar-actions { position: static; display: grid; width: 100%; min-width: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; padding: 8px; border: 0; border-bottom: 1px solid var(--divider); border-radius: 0; background: #101010; }
.coach-utilities .topbar-actions button { min-width: 0; padding-inline: 3px; font-size: 11px; }
.coach-utilities #open-member-card { color: #dbc18a; border-color: #6c5b36; }
.member-card-sheet { width: min(940px, calc(100vw - 32px)); background: #111; }
.member-card-sheet .modal-head span { color: #dbc18a; }
.member-card-art { display: block; width: 100%; height: auto; }
.member-card-details { padding: 22px; }
.member-card-details dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 0; }
.member-card-details dt { color: #999; font-size: 12px; }
.member-card-details dd { margin: 6px 0 0; color: #e5cc96; font-size: 14px; }
.member-card-details p { font-size: 13px; line-height: 1.8; color: #aaa; }
.member-card-download { display: inline-flex; min-height: 42px; align-items: center; text-decoration: none; font-size: 13px; color: #e5cc96; }
.coach-panel > .coach-console-head { order: 0; }
.coach-panel > .panel-tabs { order: 1; }
.coach-panel > .panel-view { order: 2; }
.coach-panel > .action-thread { order: 3; padding: 18px; margin: 0; border-top: 1px solid var(--divider); }
.coach-panel > .hand-summary { order: 4; }
.coach-panel > .coach-situation { order: 5; }
.coach-panel > .context-strip { order: 6; }
.coach-panel > .seat-advice { order: 7; }
.coach-panel > .opponent-focus { order: 8; }
.coach-panel > .coach-console-head { min-height: 68px; padding-block: 14px; }
.coach-empty .decision-protocol { display: none; }
.coach-empty { padding: 20px; }
.coach-empty h2 { font-size: 19px; }
.coach-empty p { font-size: 13px; line-height: 1.7; }
.analysis-card { border: 2px solid var(--verdict-color, var(--divider)); border-radius: 8px; padding: 18px; margin: 12px; }
.analysis-card[data-tone] { border-color: var(--verdict-color); }
.analysis-card[data-tone="success"] { --verdict-color: #55b986; }
.analysis-card[data-tone="warning"] { --verdict-color: #e6b94f; }
.analysis-card[data-tone="error"] { --verdict-color: #9c3b50; }
.analysis-card .verdict-label { color: #aaa; }
.analysis-card .verdict-head h2, .analysis-card .verdict-score { color: var(--verdict-color); }
.analysis-card.is-new-verdict { animation: verdict-border-pulse 1.2s ease-in-out 3; }
.correction-summary > strong { display: block; margin-top: 12px; font-size: 14px; color: var(--text); }
.analysis-caveat { color: var(--muted); font-size: 10px; line-height: 1.6; }
@keyframes verdict-border-pulse {
  0%, 100% { border-color: var(--verdict-color); box-shadow: 0 0 0 0 transparent; }
  50% { border-color: var(--verdict-color); box-shadow: 0 0 0 3px color-mix(in srgb, var(--verdict-color) 24%, transparent); }
}

/* Wider original-still crop: fully clothed head and upper body, no retouching. */
.dealer-avatar { background-image: url("./assets/dealer-zhang-jiawen-mature-shirt.jpg"); background-size: 260%; background-position: 6% 16%; }
@media (min-width: 681px) {
  .dealer-avatar { width: 110px; height: 110px; margin: -30px 0 0 -15px; }
}

/* One outer layout contract. No fixed drawers, implicit grid tracks, or
   summary-state widths may push the decision columns off the viewport. */
.table-scene { display: contents; }
@media (min-width: 960px) {
  .app-shell { --right-rail-width: clamp(300px, 26vw, 420px); --workspace-header-height: 58px; width: 100%; }
  .topbar {
    position: fixed; inset: 0 0 auto 0;
    width: auto; height: var(--workspace-header-height); min-height: var(--workspace-header-height); grid-template-columns: minmax(0, 1fr);
    padding: 7px 16px; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none;
  }
  .workspace {
    display: grid; grid-template-columns: minmax(0, 1fr) var(--check-rail-width) var(--right-rail-width);
    grid-template-rows: minmax(0, 1fr); align-items: start;
    width: 100%; height: 100dvh; min-height: 0; padding: 0; gap: 0;
  }
  .play-column, .app-shell:has(.hand-summary:not([hidden])) .play-column {
    grid-column: 1; grid-row: 1; width: 100%; height: 100dvh; min-height: 0;
    padding-top: var(--workspace-header-height); border: 0; overflow: hidden;
  }
  .table-stage, .app-shell:has(.hand-summary:not([hidden])) .table-stage {
    min-height: 0; flex: 1 1 0; width: 100%; padding: 0; overflow: hidden;
  }
  .table-scene {
    position: absolute; display: grid; place-items: center;
    width: 1260px; height: 740px; left: 50%; top: 50%;
    transform: translate(-50%, -50%) scale(var(--scene-scale, .4)); transform-origin: center;
  }
  .table-scene .poker-table { width: 1180px; min-width: 0; aspect-ratio: 2.18 / 1; }
  .checkpoint-rail, .coach-panel {
    position: sticky; inset: auto; top: var(--workspace-header-height); align-self: start;
    width: auto; min-width: 0; height: calc(100dvh - var(--workspace-header-height)); min-height: 0; max-height: calc(100dvh - var(--workspace-header-height));
    margin: var(--workspace-header-height) 0 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain;
    border-radius: 0; transform: none; box-shadow: none; scrollbar-width: thin;
  }
  .checkpoint-rail { grid-column: 2; grid-row: 1; padding: 0 14px 22px; }
  .checkpoint-rail .audit-head { position: sticky; top: 0; z-index: 3; margin: 0 -14px; padding: 16px 14px; background: #111; border-bottom: 1px solid var(--divider); }
  .coach-panel { grid-column: 3; grid-row: 1; border: 0; }
  .audit-stages { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; margin-top: 14px; }
  .audit-stage-button { display: flex; flex-direction: column; gap: 6px; padding: 9px 2px; text-align: center; }
  .audit-stage-button strong { font-size: 12px; white-space: nowrap; }
  .audit-stage-button small { font-size: 9px; }
  .action-dock, .app-shell:has(.hand-summary:not([hidden])) .action-dock {
    position: relative; inset: auto; width: 100%; min-width: 0; min-height: 96px;
    flex: 0 0 auto; margin: 16px 0 0; padding: 12px;
    grid-template-columns: minmax(0, 1fr); background: var(--bg); box-shadow: none;
  }
  .action-dock .action-controls { width: 100%; grid-template-columns: 64px 72px 72px minmax(0, 1fr) 64px; gap: 8px; }
  .action-dock .custom-sizing { min-width: 0; }
  .action-dock .sizing-row { grid-template-columns: minmax(0, 1fr) 82px 58px; gap: 6px; }
  .action-dock .sizing-row input { min-width: 0; width: 100%; }
  .mobile-coach-toggle { display: none; }
}
@media (min-width: 681px) and (max-width: 1279px) {
  .action-dock .action-controls { width: 100%; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .action-dock .custom-sizing { grid-column: 1 / -1; grid-row: 2; }
  .action-dock .action-allin { grid-column: 4; grid-row: 1; }
  .action-dock .sizing-row { grid-template-columns: minmax(0, 1fr) 82px 58px; }
  .action-dock .sizing-row input { min-width: 0; width: 100%; }
}
@media (max-width: 959px) {
  .topbar { grid-template-columns: minmax(0, 1fr); }
  .workspace { display: flex; flex-direction: column; }
  .checkpoint-rail { position: relative; top: auto; width: 100%; height: auto; max-height: none; padding: 16px; }
  .audit-stages { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; margin-top: 12px; }
  .audit-stage-button { display: flex; flex-direction: column; padding: 8px 3px; text-align: center; gap: 5px; }
  .audit-stage-button strong { font-size: 12px; }
  .checkpoint-rail .audit-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-recheck-label { grid-column: 1 / -1; }
  .coach-panel { position: relative; inset: auto; width: 100%; height: auto; max-height: none; transform: none; }
  .mobile-coach-toggle { display: none; }
  .dealer-avatar { background-size: 260%; }
}
@media (max-width: 420px) {
  .checkpoint-rail .audit-checks { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .analysis-card.is-new-verdict { animation: none; }
  .observation-question[data-tone="error"] { animation: none; }
}