/* Shared archive and broadcast viewer proportions. */
.chess-viewer { --viewer-size: 560px; font-family: Arial, Helvetica, sans-serif; color: #111827; padding: 16px; max-width: 1600px; margin: auto; }
.chess-viewer .game-layout, .chess-viewer .live-layout { display: grid; gap: 16px; align-items: start; justify-content: stretch; width: 100%; margin: auto; }
.chess-viewer .game-layout { grid-template-columns:minmax(180px,240px) minmax(0,1fr) minmax(260px,320px); }
.chess-viewer .live-layout { grid-template-columns:minmax(180px,240px) minmax(0,1fr) minmax(260px,320px); }
.chess-viewer .viewer-header { width: 100%; margin: 0 auto 16px; }
.chess-viewer .viewer-tournament { font-size: 24px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.chess-viewer .viewer-context { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 14px; color: #6b7280; margin-top: 6px; }
.chess-viewer .game-center { grid-column:2;grid-row:1; }
.chess-viewer .game-layout > .viewer-games { grid-column:1;grid-row:1; }
.chess-viewer .game-layout > .game-moves { grid-column:3; grid-row: 1; }
.chess-viewer .game-side { grid-column: 1 / -1; grid-row: 2; }
.chess-viewer .game-details { display:flex;flex-wrap:wrap;gap:12px 36px; }
.chess-viewer .game-details > div { min-width: 90px; }
.chess-viewer .game-center, .chess-viewer .viewer-center { width: 100%; min-width: 0; align-items:flex-start; }
.chess-viewer .board-card { padding: 0 !important; width: var(--viewer-size) !important; max-width: 100%; border-radius: 0; }
.chess-viewer .board-wrap { position:relative; width: var(--viewer-size); max-width: 100%; }
.chess-viewer .white-1e1d7 { background-color: #f0d9b5; color: #b58863; }
.chess-viewer .black-3c85d { background-color: #b58863; color: #f0d9b5; }
.chess-viewer .square-55d63.viewer-last-move { box-shadow: inset 0 0 0 100px rgba(155, 199, 0, .36); }
.chess-viewer .notation-322f9 { font-size: 13px; font-weight: 600; }
.chess-viewer .player-bar { width: var(--viewer-size); max-width: 100% !important; min-height: 54px; padding: 8px 12px; display: flex; gap: 12px; align-items: center; justify-content: space-between; border-radius: 0; background: #eee; color: #444; margin: 0; box-sizing: border-box; }
.chess-viewer .player-info { min-width: 0; }
.chess-viewer .player-bar .name-line, .chess-viewer .archive-player-name { font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.chess-viewer .archive-player-name { color: inherit; }
.chess-viewer .player-color { font-size: 12px; color: #777; }
.chess-viewer .clock-display { font-family: Arial, Helvetica, sans-serif; font-size: 24px; font-weight: 400; font-variant-numeric: tabular-nums; padding: 6px 10px; }
.chess-viewer .player-bar.black-bar .clock-display { color: inherit; background: rgba(0,0,0,.06); }
.chess-viewer .clock-display.active-turn { background: #d4e4f6 !important; color: #333 !important; }
.chess-viewer .title-badge { background: none; color: #b57700; font-size: 14px; padding: 0; }
.chess-viewer .viewer-nav { display: flex; justify-content: center; gap: 6px; margin-top: 8px; width: 100%; }
.chess-viewer .viewer-nav button { min-height: 44px; min-width: 44px; font-size: 22px; color: #666; background: transparent; border-radius: 4px; padding: 4px 12px; }
.chess-viewer .viewer-nav button:hover { background: #ddd; }
.chess-viewer .viewer-nav #btn-reset { font-size: 14px; }
.chess-viewer .game-side, .chess-viewer .viewer-games, .chess-viewer .game-moves { min-width: 0; }
.chess-viewer .viewer-games { padding: 0; overflow: hidden; }
.chess-viewer .viewer-games > :first-child { padding: 14px; margin: 0; border-bottom: 1px solid #ddd; }
.chess-viewer #games-list { max-height: calc(var(--viewer-size) + 108px); }
.chess-viewer .game-card { padding: 10px 12px; border-radius: 0; border-bottom: 1px solid #eee; font-size: 15px; }
.chess-viewer .game-card .text-xs { font-size: 15px; line-height: 1.45; }
.chess-viewer .game-card.active { background: #d4e4f6; }
.chess-viewer .engine-panel { min-height: 130px; padding: 14px; }
.chess-viewer .moves-panel { padding: 0; margin-top: 12px; overflow: hidden; }
.chess-viewer .moves-panel > :first-child { padding: 10px 14px; border-bottom: 1px solid #ddd; }
.chess-viewer #moves-list { position: relative; margin: 0; max-height: calc(var(--viewer-size) - 70px); min-height: 160px; overflow-y: auto; font-size: 19px; line-height: 1.5; }
.chess-viewer .move-row { display: grid; grid-template-columns: 42px minmax(0,1fr) minmax(0,1fr); gap: 0; padding: 0; }
.chess-viewer .move-row:nth-child(even) { background: #f4f4f4; }
.chess-viewer .move-number { color: #999; font-size: 14px; text-align: center; padding: 6px 2px; background: rgba(0,0,0,.025); }
.chess-viewer .move-btn { min-height: 36px; padding: 4px 10px; text-align: left; border-radius: 0; color: #555; }
.chess-viewer .move-btn:hover { background: #d4e4f6; color: #222; }
.chess-viewer .move-btn:focus-visible { outline: 2px solid #438bc7; outline-offset: -2px; }
.chess-viewer .move-btn.bg-gray-200 { background: #438bc7; color: white; font-weight: 600; }
.dark .chess-viewer { color: #e5e7eb; }
.dark .chess-viewer .viewer-context { color: #9ca3af; }
.dark .chess-viewer .player-bar { background: #333; color: #ddd; }
.dark .chess-viewer .player-color { color: #aaa; }
.dark .chess-viewer .move-row:nth-child(even) { background: #2d333d; }
.dark .chess-viewer .move-btn { color: #ddd; }
.dark .chess-viewer .move-btn:hover { background: #454c59; }
.dark .chess-viewer .move-btn.bg-gray-200 { background: #366fa3; color: white; }
.dark .chess-viewer .viewer-nav button { color: #bbb; }
.dark .chess-viewer .viewer-nav button:hover { background: #444; }
.dark .chess-viewer .game-card.active { background: #314b69; }
.dark .chess-viewer .game-card, .dark .chess-viewer .moves-panel > :first-child, .dark .chess-viewer .viewer-games > :first-child { border-color: #444; }
@media (max-width: 1099px) and (min-width: 700px) {
  .chess-viewer .game-layout, .chess-viewer .live-layout { grid-template-columns: minmax(0,1.4fr) minmax(260px,1fr); }
  .chess-viewer .game-center, .chess-viewer .viewer-center { grid-column: 1; grid-row: 1; }
  .chess-viewer .game-layout > .game-moves, .chess-viewer .live-layout > .game-moves { grid-column: 2; grid-row: 1; }
  .chess-viewer .game-side, .chess-viewer .viewer-games { grid-column: 1 / -1; grid-row: 2; }
  .chess-viewer #games-list { max-height: 360px; }
}
@media (max-width: 699px) {
  .chess-viewer { padding: 12px 8px; }
  .chess-viewer .game-layout, .chess-viewer .live-layout { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .chess-viewer .game-center, .chess-viewer .viewer-center { grid-row: 1; grid-column: 1; }
  .chess-viewer .game-layout > .game-moves, .chess-viewer .live-layout > .game-moves { grid-row: 2; grid-column: 1; }
  .chess-viewer .game-side, .chess-viewer .viewer-games { grid-row: 3; grid-column: 1; }
  .chess-viewer #moves-list { max-height: 360px; }
  .chess-viewer #games-list { max-height: 360px; }
  .chess-viewer .move-btn { min-height: 44px; }
  .chess-viewer .player-bar .name-line, .chess-viewer .archive-player-name { font-size: 16px; }
  .chess-viewer .viewer-tournament { font-size: 21px; }
  .chess-viewer .clock-display { font-size: 20px; padding: 4px 8px; }
}

.viewer-share { margin:20px 0 0; padding:18px; border:1px solid #d1d5db; border-radius:8px; background:#fff; }
.viewer-share h2 { font-size:18px;font-weight:600;margin:0 0 12px; }
.viewer-share-actions { display:flex;flex-wrap:wrap;gap:8px; }
.viewer-share button { border-radius:5px;padding:10px 14px;background:#1976c5;color:#fff;font-size:14px;font-weight:600;min-height:44px; }
.viewer-share button:hover { background:#155f9f; }
.viewer-share button:disabled { opacity:.55;cursor:wait; }
.viewer-share-status { font-size:14px;margin:8px 0; }
.viewer-share-status:empty { display:none; }
.viewer-share-links { margin-top:16px; }
.viewer-share-links summary { cursor:pointer;min-height:44px;display:flex;align-items:center;text-decoration:underline; }
.viewer-share-initial { display:flex;align-items:center;gap:10px;min-height:44px; }
.viewer-share-field { margin:14px 0 0; }
.viewer-share-field label { display:block;margin-bottom:6px;font-size:14px;font-weight:600; }
.viewer-share-field > div { display:flex;gap:6px; }
.viewer-share-field input { min-width:0;flex:1;padding:10px;border:1px solid #d1d5db;border-radius:5px;color:inherit;background:transparent;font-size:14px; }
.viewer-copy-fallback { display:block;width:100%;height:160px; }
.dark .viewer-share { background:#1f2937;border-color:#4b5563; }
.dark .viewer-share-field input { border-color:#4b5563; }
@media(max-width:450px) { .viewer-share { padding:12px; }.viewer-share-actions button { flex:1 1 125px; }.viewer-share-links summary { font-size:14px; } }
html.embedded-viewer body > nav,html.embedded-viewer #sidebar,html.embedded-viewer #sidebarBackdrop { display:none!important; }
html.embedded-viewer #main-content { margin:0!important;padding:0!important; }
html.embedded-viewer main > div { padding:0!important; }
html.embedded-viewer .chess-viewer { padding:8px!important; }
html.embedded-viewer .game-layout,html.embedded-viewer .live-layout { grid-template-columns:1fr!important; }
html.embedded-viewer .game-side,html.embedded-viewer .game-moves,html.embedded-viewer .live-games-panel,html.embedded-viewer .viewer-analysis,html.embedded-viewer .viewer-share,html.embedded-viewer .round-nav,html.embedded-viewer .viewer-context { display:none!important; }
html.embedded-viewer .viewer-tournament { font-size:18px; }

html.embedded-viewer .viewer-games { display:none!important; }
html.embedded-viewer .viewer-center,html.embedded-viewer .game-center { grid-row:1!important;grid-column:1!important; }
.viewer-share { margin-left:auto; margin-right:auto; }

.viewer-evalbar { position:absolute;top:0;left:calc(100% + 3px);width:12px;height:100%;background:#333;overflow:hidden;border:1px solid #aaa;border-radius:3px; }
.viewer-eval-white { position:absolute;bottom:0;left:0;right:0;height:50%;background:#fafafa;transition:height .25s ease; }
.viewer-eval-label { position:absolute;bottom:5px;left:0;right:0;color:#222;text-align:center;font-size:9px;font-weight:700;writing-mode:vertical-rl;line-height:12px; }
.viewer-evalbar.eval-black-winning .viewer-eval-label { top:5px;bottom:auto;color:#fafafa; }
.viewer-evalbar.eval-unavailable { background:repeating-linear-gradient(0deg,#777 0,#777 8px,#999 8px,#999 16px); }
.viewer-evalbar.eval-unavailable .viewer-eval-white { visibility:hidden; }
.viewer-evalbar.eval-unavailable .viewer-eval-label { color:#fff; }
.round-games-heading { display:flex;flex-direction:column;gap:4px; }
.round-games-heading a { font-weight:600;text-decoration:underline; }
.round-games-count { font-size:12px;color:#6b7280; }
.round-games-list { max-height:calc(var(--viewer-size) + 30px);overflow-y:auto; }
.chess-viewer .round-game { display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:8px;align-items:center;color:inherit;text-decoration:none;min-height:62px; }
.round-game-number { font-size:12px;color:#777; }
.round-game-players { min-width:0;display:flex;flex-direction:column;gap:4px;font-size:14px; }
.round-game-players > span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.round-game-result { font-size:13px; }
.chess-viewer .game-card { display:block;color:inherit;text-decoration:none; }
.chess-viewer .round-game { display:grid; }
.round-games-pagination { display:flex;gap:10px;justify-content:space-between;align-items:center;padding:8px;font-size:12px;border-top:1px solid #ddd; }
.round-games-pagination[hidden] { display:none; }
.round-games-pagination a { min-height:44px;display:flex;align-items:center;text-decoration:underline; }
.round-games-error { padding:8px;font-size:13px; }
.dark .archived-round-games { background:#1f2937;border-color:#4b5563; }
.archived-round-games { background:#fff;border:1px solid #d1d5db;border-radius:8px; }
@media(max-width:1099px) and (min-width:700px) {
  .chess-viewer .game-layout > .viewer-games { grid-column:1 / -1;grid-row:3; }
  .round-games-list { max-height:360px; }
}
@media(max-width:699px) {
  .chess-viewer .game-layout > .viewer-games { grid-column:1;grid-row:3; }
  .chess-viewer .game-side { grid-row:4; }
  .round-games-list { max-height:360px; }
}
html.embedded-viewer .viewer-evalbar { display:none!important; }

/* Stable evaluations and two per-player result scores. */
.viewer-evalbar.eval-pending .viewer-eval-label { opacity:.7; }
.chess-viewer .round-game { grid-template-columns:14px 10px minmax(0,1fr);gap:6px; }
.chess-viewer .round-game .round-player { display:flex;align-items:center;gap:5px;overflow:visible; }
.round-player-name { min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.round-player .f24 { flex:0 0 24px; }
.player-score { font-variant-numeric:tabular-nums;flex:none;min-width:15px;text-align:center;font-size:14px;line-height:1.4; }
.player-score.score-win { color:#397b15; }
.player-score.score-loss { color:#c62828; }
.player-score.score-draw,.player-score.score-pending { color:#666; }
.main-player-score { border-radius:5px;padding:3px 8px;font-size:18px;min-width:32px; }
.main-player-score.score-win { background:#4d8b22;color:#fff; }
.main-player-score.score-loss { background:#c62828;color:#fff; }
.main-player-score.score-draw { background:#777;color:#fff; }
.player-outcome { display:flex;align-items:center;gap:10px;flex-shrink:0; }
.archive-player-flag { margin-right:6px; }
.mini-eval { position:relative;display:block;align-self:center;width:10px;height:42px;background:#444;border:1px solid #999;border-radius:4px;overflow:hidden;flex:none; }
.mini-eval-white { position:absolute;bottom:0;left:0;right:0;height:50%;background:#fafafa;transition:height .35s ease; }
.mini-eval::after { content:'';position:absolute;top:50%;left:0;right:0;border-top:1px solid #e19760; }
.mini-eval.eval-unavailable { background:repeating-linear-gradient(0deg,#888 0,#888 5px,#aaa 5px,#aaa 10px); }
.mini-eval.eval-unavailable .mini-eval-white,.mini-eval.eval-unavailable::after { visibility:hidden; }
.dark .player-score.score-win { color:#93d870; }
.dark .player-score.score-loss { color:#ff8b8b; }
.dark .player-score.score-draw,.dark .player-score.score-pending { color:#bbb; }
.dark .main-player-score.score-win,.dark .main-player-score.score-loss,.dark .main-player-score.score-draw { color:#fff; }
@media(max-width:699px) { .player-outcome { gap:4px; }.chess-viewer .clock-display { font-size:18px;padding:4px; } }
@media(prefers-reduced-motion:reduce) { .viewer-eval-white,.mini-eval-white { transition:none; } }
