#analysis-dialog {
  width: min(1120px, calc(100% - 24px));
  max-height: calc(100dvh - 24px);
  box-sizing: border-box;
  margin: auto;
  padding: 20px;
  overflow: auto;
  overscroll-behavior: contain;
  background: var(--app-panel);
  color: var(--app-text);
  border: 1px solid var(--glass-border);
  border-radius: 8px;
  box-shadow: 0 20px 70px #0006;
}
#analysis-dialog::backdrop { background: #0009; backdrop-filter: blur(8px); }
#analysis-dialog .help-header { margin-bottom: 16px; }
#analysis-dialog .help-header h2 { font-size: 1.3rem; overflow-wrap: anywhere; }
#analysis-dialog .menu-close-button { width: 40px; height: 40px; }
#analysis-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, 1fr); gap: 24px; align-items: start; }
#analysis-layout[hidden], #analysis-promotion[hidden] { display: none; }
.analysis-board-column, .analysis-results { min-width: 0; }
.analysis-board-column { width: min(100%, 560px, max(260px, calc(100dvh - 480px))); justify-self: center; }
#analysis-board { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); grid-template-rows: repeat(8, minmax(0, 1fr)); width: 100%; aspect-ratio: 1; overflow: hidden; touch-action: none; user-select: none; -webkit-user-select: none; }
#analysis-board .square { width: 100%; height: 100%; min-width: 0; min-height: 0; border: 0; border-radius: 0; padding: 0; cursor: grab; }
#analysis-board .computer-selected { outline: 3px solid var(--accent-blue); outline-offset: -3px; }
#analysis-board .computer-legal::after { content: ''; position: absolute; inset: 36%; border-radius: 50%; background: #1119; pointer-events: none; }
#analysis-board .square:focus-visible { outline: 3px solid var(--accent-blue); outline-offset: -3px; }
#analysis-board { position: relative; }
.board-arrows { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; overflow: visible; }
.board-arrows polygon { fill: #159b51; stroke: #effff0; stroke-width: 1.5; stroke-opacity: 0.5; }
#analysis-turn { margin: 8px 0; color: var(--app-muted); font-size: 0.875rem; }
.analysis-navigation { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; max-width: 270px; margin: 12px auto; }
.analysis-navigation button, #analysis-copy { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex: 0 0 40px; padding: 8px; border: 1px solid var(--glass-border); border-radius: 50%; background: var(--glass-fill-strong); color: var(--app-text); cursor: pointer; }
.analysis-navigation button { width: 100%; height: auto; aspect-ratio: 1; padding: 5px; }
#analysis-dialog .sf-symbol { width: 22px; height: 22px; flex: 0 0 22px; }
#analysis-previous .sf-symbol { transform: rotate(180deg); }
#analysis-dialog button:disabled { opacity: 0.35; cursor: default; }
#analysis-dialog button:focus-visible, #analysis-dialog select:focus-visible { outline: 2px solid var(--accent-blue); outline-offset: 2px; }
.analysis-options { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 20px 0 12px; }
.analysis-options label { display: grid; gap: 6px; font-size: 0.875rem; min-width: 0; }
.analysis-line-outcome { grid-column: 1 / -1; color: var(--app-muted); line-height: 1.5; }
.analysis-options select, #analysis-fen { color: var(--app-text); background: var(--app-panel-2); border: 1px solid var(--glass-border); border-radius: 6px; padding: 8px; min-height: 40px; font: inherit; min-width: 0; }
.analysis-command { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 8px 12px; border: 1px solid var(--glass-border); border-radius: 6px; background: var(--glass-fill-strong); color: var(--app-text); font: inherit; font-size: 0.875rem; cursor: pointer; }
#analysis-run {
  min-width: 108px;
  border-color: #5ba575;
  background: linear-gradient(145deg, #39825a, #245d3e);
  color: #fff;
  -webkit-text-fill-color: #fff;
}
.analysis-evaluation { display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px; }
#analysis-score { font-size: 2rem; font-variant-numeric: tabular-nums; }
#analysis-balance { font-size: 0.875rem; color: var(--app-muted); }
#analysis-status, #analysis-maia-status { font-size: 0.875rem; min-height: 1.3em; margin: 0 0 8px; overflow-wrap: anywhere; }
#analysis-stats, #analysis-maia-stats { font-size: 0.875rem; color: var(--app-muted); font-variant-numeric: tabular-nums; min-height: 1.3em; margin: 0 0 16px; }
.analysis-engine-heading { font-size: 1rem; margin: 16px 0 12px; }
#analysis-maia-results { margin-top: 20px; }
#analysis-dialog [hidden] { display: none; }
.analysis-combined #analysis-lines { max-height: 210px; overflow: auto; overscroll-behavior: contain; }
@media (min-width: 801px) {
  .analysis-combined .analysis-board-column { position: sticky; top: 0; }
}
.analysis-line { display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 8px; padding: 12px 0; border-top: 1px solid var(--glass-border); font-size: 0.875rem; }
.analysis-line > strong { font-variant-numeric: tabular-nums; padding-top: 5px; overflow-wrap: anywhere; }
.analysis-line-moves { display: flex; flex-wrap: wrap; align-content: start; gap: 2px; }
.analysis-line button, #analysis-moves button { font: inherit; font-size: 0.875rem; line-height: 1.4; padding: 5px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--app-text); cursor: pointer; }
.analysis-line button:hover, #analysis-moves button:hover { background: var(--glass-fill-strong); }
#analysis-moves { position: relative; max-height: 110px; overflow: auto; border-block: 1px solid var(--glass-border); padding: 6px 0; margin: 12px 0; }
#analysis-moves [aria-current] { background: var(--glass-fill-strong); border-color: var(--accent-green); }
.analysis-fen-label { display: block; font-size: 0.75rem; color: var(--app-muted); margin-bottom: 6px; }
.analysis-fen-row { display: flex; align-items: center; gap: 8px; }
#analysis-fen { width: 100%; resize: vertical; font: 0.75rem/1.5 ui-monospace, monospace; overflow-wrap: anywhere; }
#analysis-promotion h3 { font-size: 1rem; }
#analysis-promotion .computer-promotion-options { max-width: 320px; margin: 8px 0; }
#analysis-error { font-size: 0.875rem; overflow-wrap: anywhere; }
#analysis-error:empty { display: none; }
.analysis-footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; border-top: 1px solid var(--glass-border); margin-top: 20px; padding-top: 16px; }
@media (max-width: 800px) {
  #analysis-dialog { padding: 16px; }
  #analysis-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .analysis-board-column { width: min(100%, 460px); }
  .analysis-results { width: min(100%, 460px); justify-self: center; }
}
