/* Embed-only overrides. Without ?embed=1 the copied full guide keeps its original appearance. */
html.chess-embed {
  --embed-bg: #f5f3eb;
  --embed-panel: #fbfcf6;
  --embed-soft: #f1f5e8;
  --embed-node: #f9fbf4;
  --embed-controller: #f3f1e8;
  --embed-active: #e3efb6;
  --embed-finished: #e9efdd;
  --embed-accent: #607d39;
  --embed-selected: #dae6ac;
  --embed-strong: #293624;
  --embed-on-strong: #f6f8ed;
  --paper: var(--embed-bg);
  --ink: #232820;
  --muted: #62675c;
  --line: #cbd5bd;
  height: auto;
  min-height: 0;
  overflow: hidden;
  scroll-behavior: auto;
  scroll-padding: 0;
  color-scheme: light;
}
html.chess-embed[data-embed-theme="dark"] {
  --embed-bg: #101311;
  --embed-panel: #181d19;
  --embed-soft: #20281f;
  --embed-node: #242c24;
  --embed-controller: #2c2a24;
  --embed-active: #394c2d;
  --embed-finished: #2a3627;
  --embed-accent: #b0cf83;
  --embed-selected: #36472c;
  --embed-strong: #c9e4a5;
  --embed-on-strong: #1a2415;
  --ink: #eef1e9;
  --muted: #b0baaa;
  --line: #485441;
  color-scheme: dark;
}
.chess-embed body { margin: 0; padding: 0; min-height: 0; height: auto; overflow: hidden; background: var(--embed-bg); }
.chess-embed body > :not(main),
.chess-embed main > :not(#swarm),
.chess-embed .swarm-heading { display: none !important; }
.chess-embed main { margin: 0; padding: 0; }
.chess-embed #swarm { width: 100%; max-width: none; margin: 0; padding: 4px 4px 2px; }
.chess-embed .swarm-tabs { margin-bottom: 14px; }
.chess-embed .swarm-tabs button { background: var(--embed-soft); border-color: var(--line); }
.chess-embed .swarm-tabs button[aria-selected="true"] { background: var(--embed-selected); border-color: var(--embed-accent); box-shadow: inset 0 -2px var(--embed-accent); }
.chess-embed .swarm-panel { background: var(--embed-panel); border-color: var(--line); }
.chess-embed .swarm-panel-head { padding: 18px 22px; border-color: var(--line); }
.chess-embed .swarm-panel-head h3 { font-size: clamp(20px, 2.9vw, 25px); }
.chess-embed .compare-toggle { border-color: var(--line); }
.chess-embed .compare-toggle button[aria-pressed="true"] { background: var(--embed-strong); color: var(--embed-on-strong); }
.chess-embed .swarm-metrics { color: var(--muted); background: var(--embed-soft); border-color: var(--line); }
.chess-embed .swarm-metrics strong { color: var(--ink); }
.chess-embed .swarm-stage { background: var(--embed-soft); }
.chess-embed .swarm-node { color: var(--ink); background: var(--embed-node); border-color: var(--line); box-shadow: 0 3px 0 #00000018; }
.chess-embed .swarm-controller { background: var(--embed-controller); }
.chess-embed .swarm-input, .chess-embed .swarm-output { background: var(--embed-soft); }
.chess-embed .swarm-node small, .chess-embed .swarm-legend { color: var(--muted); }
.chess-embed .swarm-node.working { background: var(--embed-active); border-color: var(--embed-accent); box-shadow: 0 0 0 2px #9bb96f33; }
.chess-embed .swarm-node.finished { background: var(--embed-finished); border-color: var(--line); }
.chess-embed .swarm-node.finished .agent-state:after { color: var(--embed-accent); }
.chess-embed .swarm-node[aria-pressed="true"] { outline-color: var(--embed-accent); }
.chess-embed .agent-state { background: var(--line); }
.chess-embed .swarm-node.working .agent-state { background: var(--embed-accent); }
.chess-embed .swarm-legend, .chess-embed .swarm-footer { border-color: var(--line); }
.chess-embed .swarm-legend i { background: var(--embed-node); border-color: var(--embed-accent); }
.chess-embed .swarm-legend .controller-key { background: var(--embed-controller); }
.chess-embed .swarm-legend .active-key { background: var(--embed-accent); }
.chess-embed .swarm-now, .chess-embed .swarm-node-inspect { background: var(--embed-soft); border-color: var(--line); }
.chess-embed .swarm-now { padding: 20px 22px; }
.chess-embed .swarm-transfer { border-color: var(--line); }
.chess-embed .swarm-transfer > strong { color: var(--embed-accent); }
.chess-embed .swarm-progress { background: var(--embed-panel); }
.chess-embed .swarm-progress button:not(:last-child):after { background: var(--line); }
.chess-embed .swarm-progress button > span { background: var(--embed-node); color: var(--muted); border-color: var(--line); }
.chess-embed .swarm-progress button small { color: var(--muted); }
.chess-embed .swarm-progress button[aria-current="step"] > span { background: var(--embed-strong); color: var(--embed-on-strong); border-color: var(--embed-strong); }
.chess-embed .swarm-progress button[aria-current="step"] small { color: var(--ink); }
.chess-embed .button.dark { background: var(--embed-strong); color: var(--embed-on-strong); border-color: var(--embed-strong); }
.chess-embed .icon-button:hover { background: var(--embed-selected); }
.chess-embed .swarm-bottom { margin-top: 18px; }
.chess-embed .swarm-bottom > div > span { color: var(--embed-accent); }
.chess-embed .swarm-footer { margin-top: 14px; padding-bottom: 8px; flex-wrap: wrap; }
.chess-embed .swarm-footer .text-link { min-height: 32px; }
.chess-embed .swarm-footer .micro { overflow-wrap: anywhere; }
.chess-embed .swarm-mobile { background: var(--embed-soft); }
.chess-embed .mobile-incoming p, .chess-embed .mobile-arrow { color: var(--embed-accent); }
.chess-embed .mobile-agent { background: var(--embed-active); border-color: var(--embed-accent); color: var(--ink); text-decoration: none; box-shadow: 0 3px 0 #00000018; }
.chess-embed .mobile-agent small { color: var(--muted); }
.chess-embed .mobile-agent.controller { background: var(--embed-controller); }
.chess-embed .mobile-agent.input, .chess-embed .mobile-agent.output, .chess-embed .mobile-outgoing { background: var(--embed-node); border-color: var(--line); }
.chess-embed :is(button, a, input):focus-visible { outline: 2px solid var(--embed-accent); outline-offset: 2px; }
.chess-embed .embed-share-fallback { display: grid; gap: 8px; padding: 12px 4px; font-size: 12px; }
.chess-embed .embed-share-fallback input { min-width: 0; width: 100%; padding: 10px; border: 1px solid var(--line); border-radius: 4px; color: var(--ink); background: var(--embed-panel); }
@media (max-width: 760px) {
  .chess-embed .swarm-footer .micro { order: 3; width: 100%; }
  .chess-embed .swarm-panel-head { display: block; }
  .chess-embed .compare-toggle { margin-top: 12px; width: max-content; }
}
@media (max-width: 600px) {
  .chess-embed .swarm-panel-head, .chess-embed .swarm-now { padding: 16px; }
  .chess-embed .swarm-bottom { gap: 14px; }
  .chess-embed .swarm-controls { gap: 7px; padding-inline: 8px; }
}
