/* Palette shared by the controls, preview and army gallery. Model and alpha
   colours stay unchanged when the surrounding workbench changes theme. */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #15191a;
  --panel: #1d2324;
  --raised: #252d2e;
  --field: #141b1c;
  --line: #3d4748;
  --line-strong: #657272;
  --muted: #aab7b6;
  --ink: #f2f1e9;
  --accent: #e4b77d;
  --accent-hover: #f1c994;
  --accent-ink: #251d13;
  --accent-soft: #3d352a;
  --accent-line: #8a7150;
  --button: #2c3536;
  --button-hover: #374445;
  --overlay: #202829f2;
  --shadow: #05090959;
  --backdrop: #070d0dd4;
  --scene-center: #344041;
  --scene-edge: #1a2223;
  --grid-color: #5d6d6c;
  --tool-bg: #173438;
  --tool-ink: #c6f0ea;
  --tool-muted: #aecbc8;
  --tool-line: #528180;
  --tool-accent: #71d7ca;
  --tool-active-ink: #102b2b;
  --danger: #ffbaab;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #e8e6df;
  --panel: #f4f1e9;
  --raised: #fffdf7;
  --field: #fffdf8;
  --line: #c9c5b8;
  --line-strong: #858b80;
  --muted: #62675e;
  --ink: #29312d;
  --accent: #995025;
  --accent-hover: #7e3e1a;
  --accent-ink: #fffdf8;
  --accent-soft: #f2e2cc;
  --accent-line: #b8865c;
  --button: #e9e7dd;
  --button-hover: #dce1d5;
  --overlay: #fffdf7f5;
  --shadow: #39433820;
  --backdrop: #313d3b80;
  --scene-center: #faf8ef;
  --scene-edge: #d9ded4;
  --grid-color: #9da99b;
  --tool-bg: #e0efea;
  --tool-ink: #18594f;
  --tool-muted: #426a60;
  --tool-line: #81a99d;
  --tool-accent: #286d60;
  --tool-active-ink: #fffdf8;
  --danger: #a63527;
}

body { background: var(--bg); color: var(--ink); }
aside,
#army-gallery { scrollbar-color: var(--line-strong) transparent; }
button { color: var(--ink); background: var(--button); border-color: var(--line); }
button:hover:not(:disabled) { background: var(--button-hover); }
button:disabled { cursor: not-allowed; }
button:focus-visible,
a:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
input,
select { accent-color: var(--accent); }
select,
input[type="number"],
input[type="text"],
input[type="search"],
#floor-filter,
#side-text-panel input[type="text"] {
  color: var(--ink);
  background: var(--field);
  border-color: var(--line-strong);
}
input::placeholder { color: var(--muted); opacity: .85; }
input:disabled,
select:disabled { opacity: .65; }
input[type="file"] { color: var(--muted); }
input::file-selector-button,
.model-panel input::file-selector-button {
  background: var(--button);
  color: var(--ink);
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  padding: 8px 10px;
  margin-right: 8px;
  cursor: pointer;
}
input::file-selector-button:hover { background: var(--button-hover); }
.primary,
.transform-buttons button[aria-pressed="true"] {
  background: var(--accent);
  color: var(--accent-ink);
  border-color: var(--accent);
}
.primary:hover:not(:disabled),
.transform-buttons button[aria-pressed="true"]:hover:not(:disabled) {
  background: var(--accent-hover);
  color: var(--accent-ink);
}
.quiet:hover:not(:disabled),
.variant-heading #randomize-variant:hover:not(:disabled) { background: var(--accent-soft); }
.shape { border-color: var(--muted); }
.shapes button[aria-pressed="true"],
.category[aria-pressed="true"],
.model-slot>button[aria-pressed="true"],
.builder-mode button[aria-pressed="true"] {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent-line);
}
.shapes button[aria-pressed="true"]:hover:not(:disabled),
.category[aria-pressed="true"]:hover:not(:disabled),
.model-slot>button[aria-pressed="true"]:hover:not(:disabled),
.builder-mode button[aria-pressed="true"]:hover:not(:disabled) { background: var(--accent-soft); border-color: var(--accent); }
.category { background: var(--raised); border-color: var(--line); }
.category[aria-pressed="true"]:after { color: var(--accent-ink); }
.variant-tile { background: var(--field); border-color: var(--line-strong); }
/* Keep small image labels legible against the monochrome alpha itself. */
.variant-tile span { background: #17201de8; color: #fffdf8; }
.variant-tile[aria-pressed="true"] span { color: var(--accent-ink); }
.blur-test { background: var(--accent-soft); border-color: var(--accent-line); }

.workflow-accordion,
.export-bar { background: var(--raised); border-color: var(--line); }
.workflow-accordion[open]>summary { background: var(--button); border-color: var(--line); }
.workflow-accordion>summary:hover { background: var(--button-hover); }
.workflow-accordion>summary::after,
.workflow-value,
.inline-setting>summary span { color: var(--muted); }
.workflow-accordion .model-count { color: var(--muted)!important; }
.sub-tool { background: var(--panel); border-color: var(--line); }
.sub-tool[open]>summary,
.inline-tip,
.inline-setting { border-color: var(--line); }
.inline-tip>summary,
.inline-setting>summary { color: var(--ink); }
.sub-tool>summary:hover { background: var(--button-hover); }

.viewport { background: radial-gradient(ellipse at 52% 48%,var(--scene-center) 0%,var(--scene-edge) 75%); }
.units { color: var(--muted); border-color: var(--line-strong); }
.view-tools,
.alpha-card,
#loading,
.model-toolbar { background: var(--overlay); border-color: var(--line); }
.model-toolbar { box-shadow: 0 6px 24px var(--shadow); }
.view-tools button[aria-pressed="true"] { background: var(--button-hover); color: var(--ink); }
.orbit-help { color: var(--muted); }
#download-menu { background: var(--raised); box-shadow: 0 12px 40px var(--shadow); }
#download-parts label { background: var(--panel); border: 1px solid transparent; }
#download-parts label:hover { border-color: var(--line-strong); }
.fused-download-number { box-shadow: 0 0 0 3px var(--scene-edge),0 3px 15px #0005; }

/* Teal identifies the joint and splitting tools in both themes. */
#mini-workshop { border-color: var(--tool-line); }
#mini-workshop summary,
#mini-workshop #part-info,
#model-ring-start,
#joint-ring-section>.small-heading,
#ring-angles output { color: var(--tool-ink); }
#model-ring-start { border-color: var(--tool-line); }
#model-ring-start:hover:not(:disabled) { background: var(--tool-bg); }
#model-ring-help,
#part-split-help { background: var(--tool-bg); color: var(--tool-ink); border-color: var(--tool-line); }
#model-ring-help[aria-expanded="true"],
#part-split-help[aria-expanded="true"],
#ring-begin,
#ring-keep { background: var(--tool-accent); color: var(--tool-active-ink); border-color: var(--tool-accent); }
#ring-begin:hover:not(:disabled),
#ring-keep:hover:not(:disabled),
#model-ring-help[aria-expanded="true"]:hover,
#part-split-help[aria-expanded="true"]:hover { background: var(--tool-accent); filter: brightness(.94); }
#model-ring-tutorial,
#part-split-tutorial,
#ring-controls,
.ring-overlay { background: var(--tool-bg); color: var(--tool-ink); border-color: var(--tool-line); }
#model-ring-tutorial strong,
#part-split-tutorial strong { color: var(--tool-ink); }
#model-ring-tutorial p,
#part-split-tutorial p { color: var(--tool-muted); }
.ring-overlay { box-shadow: 0 6px 24px var(--shadow); }
#ring-angles { border-color: var(--tool-line); }
#ring-angles input { accent-color: var(--tool-accent); }
#text-info[style*="color"] { color: var(--danger)!important; }

.builder-mode { background: var(--field); }
.army-size-row,
.army-card { background: var(--raised); border-color: var(--line); }
.army-size-row .army-remove { background: var(--button); }
.army-error { color: var(--danger); }
#army-gallery { background: var(--bg); }
#army-progress { background: var(--accent-soft); color: var(--accent); border-color: var(--accent-line); box-shadow: 0 6px 20px var(--shadow); }
#army-empty { border-color: var(--line-strong); }
#army-empty>span { color: var(--accent); }
.army-badge { background: var(--accent-soft); color: var(--accent); border-color: var(--accent-line); }
.army-card-top label { color: var(--muted); }
.army-thumbnail,
.army-thumbnail:hover:not(:disabled),
#army-inspector-host { background: radial-gradient(ellipse at 50% 40%,var(--scene-center),var(--scene-edge)); }
.army-thumbnail:hover:not(:disabled) { box-shadow: inset 0 0 0 1px var(--line-strong); }
.army-inspector { background: var(--raised); border-color: var(--line-strong); box-shadow: 0 24px 100px var(--shadow); }
.army-inspector::backdrop { background: var(--backdrop); }

:root[data-theme="light"] .category img,
:root[data-theme="light"] .variant-tile img { filter: none; }
/* Axis colours retain their meaning, with darker text for the pale toolbar. */
:root[data-theme="light"] .axis-x { color: #a53434; }
:root[data-theme="light"] .axis-y { color: #277442; }
:root[data-theme="light"] .axis-z { color: #285faf; }

@media (prefers-reduced-motion: no-preference) {
  body,
  aside,
  .export-bar,
  .workflow-accordion,
  #army-gallery { transition: background-color .16s ease,color .16s ease,border-color .16s ease; }
}
