/* Dashboard-inspired amber. An sRGB interpretation, not calibrated 605 nm light.
   Night is a session-only preference; power controls the instrument illumination. */
.night-switch {
  display: block;
  margin: 0 auto 12px;
  padding: 8px 12px;
  border: 1px solid #ab967345;
  border-radius: 20px;
  background: transparent;
  color: #796b55;
  font:
    10px Arial,
    sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
}
.night-switch:not(#help-open)::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 9px;
  border: 1px solid currentColor;
  border-radius: 50%;
}
.night-switch:hover {
  border-color: currentColor;
}
.night-switch:focus-visible {
  outline: 2px solid #bc712e;
  outline-offset: 4px;
}
/* The same ivory receiver in a dim room; light lives behind the glass. */
body.night-mode {
  color-scheme: light;
  background: radial-gradient(
    ellipse at 50% 32%,
    #746858 0%,
    #514b42 52%,
    #35332f 100%
  );
  color: #413829;
}
.night-mode .radio {
  --panel-ink: #493c28;
  --amber: #ffa044;
  background:
    radial-gradient(ellipse at 50% 24%, #e0cba229, transparent 65%),
    linear-gradient(115deg, #c8baa0, #b8aa8e 55%, #bdae92);
  border-color: #9e8d70;
  box-shadow:
    inset 0 0 0 3px #d3c5a9,
    inset 0 0 0 5px #a8987b,
    0 30px 60px -12px #15120e80,
    0 2px 4px #1f1a1440;
}
.night-mode .brand {
  color: #383327;
}
.night-mode .edition,
.night-mode .label,
.night-mode .status {
  color: #504530;
}
.night-mode .dial {
  isolation: isolate;
  border-color: #9b8c6e;
  background: linear-gradient(180deg, #93856a, #b6a789 50%, #a99a7c);
  box-shadow:
    inset 0 7px 17px #352d2150,
    inset 0 -1px 3px #f4dbac40;
}
.night-mode .on .dial {
  border-color: #b29a6d;
  background:
    radial-gradient(ellipse at 3% 48%, #ffd79b80, transparent 45%),
    radial-gradient(ellipse at 97% 48%, #ffc46f60, transparent 45%),
    linear-gradient(180deg, #af966a, #dfc496 40%, #e5cba0 68%, #c5ab7d);
  box-shadow:
    inset 0 7px 16px #4b362845,
    inset 0 0 26px #ffbd6545,
    inset 0 -2px 6px #ffe4b675,
    0 1px 3px #ffe0a352,
    0 7px 25px #ffc27330,
    0 18px 65px #ffb45822;
}
/* Faint oblique reflections and a feathered lower edge suggest curved glass.
   No hit area: the dial remains fully interactive through the reflection. */
.night-mode .dial::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(115deg, transparent 4%, #fff4da12 22%, transparent 40%),
    linear-gradient(
      180deg,
      #fff5dd18,
      transparent 24%,
      transparent 72%,
      #ffdba51c
    );
  opacity: 0.35;
  transition: opacity 1.2s ease;
}
.night-mode .on .dial::after {
  opacity: 1;
}
.night-mode .upper {
  border-bottom-color: #7f643c38;
}
.night-mode .scale-row .scale-heading,
.night-mode .scale-row .printed-numbers {
  color: #51412a;
}
.night-mode .scale-row .scale-tick {
  background: #5d492e;
}
.night-mode .scale-row .needle-down,
.night-mode .scale-row .needle-up {
  background: #95542f;
  box-shadow: none;
}
.night-mode .on .scale-row .needle-down,
.night-mode .on .scale-row .needle-up {
  background: #b95a26;
  box-shadow:
    0 0 4px #ffb66490,
    0 0 11px #ff9b3945;
}
.night-mode .speaker {
  --hole-core: #393126;
  --hole-rim: #817052;
}
.night-mode .controls .knob {
  border-color: #96815e;
  box-shadow: 0 7px 12px #35291b45;
}
.night-mode .knob::after {
  background: repeating-conic-gradient(#8e7c5b 0 2deg, #c2b18e 2deg 4deg);
}
.night-mode .knob::before {
  background: linear-gradient(135deg, #d9c9a8, #bdac89 60%, #a89776);
  border-color: #9f8860;
  box-shadow:
    inset 0 0 0 3px #c6b591,
    inset 0 1px 3px #efdbb575;
}
.night-mode .pointer::before {
  background: #50422c;
}
.night-mode .on .pointer::before {
  background: #9b532c;
  box-shadow: 0 0 5px #ffc87870;
}
.night-mode .knob-scale line {
  stroke: #625035;
}
.night-mode .knob-scale text {
  fill: #625035;
}
.night-mode .power,
.night-mode .library-key {
  background: linear-gradient(145deg, #a79574, #c7b795);
  border-color: #9e8862;
  box-shadow:
    inset 0 2px 3px #59412830,
    0 1px 0 #ecd7b055;
}
.night-mode .power .push-cap,
.night-mode .library-key span {
  background: linear-gradient(145deg, #dccbab, #bfae8b);
  border-color: #e3cfaa;
  box-shadow:
    inset 0 1px 1px #f5e0bc65,
    0 2px 3px #51412a30;
}
.night-mode .power-word,
.night-mode .library-key span {
  color: #625037;
}
.night-mode .on .power .push-cap {
  background: linear-gradient(145deg, #e6cc9f, #d2b689);
  box-shadow:
    inset 0 0 12px #ffd79750,
    0 0 13px #ffb45125;
}
.night-mode .on .power-word {
  color: #91451f;
  text-shadow:
    0 0 4px #ffdf9faf,
    0 0 10px #ffa34065;
}
.night-mode .on .library-key span {
  text-shadow: 0 0 7px #ffd29965;
}
.night-mode .radio-bottom-row {
  border-color: #806b4530;
}
.night-mode .makers-mark,
.night-mode .makers-mark .makers-intro,
.night-mode .makers-series,
.night-mode .makers-credit,
.night-mode .makers-credit span {
  color: #695639;
  text-shadow: 0 1px 0 #e6cf9d55;
}
.night-mode .site-note {
  color: #cbbba1;
}
.night-mode .night-switch {
  color: #835025;
  border-color: #9c855655;
}
.night-mode .night-switch:not(#help-open)::before {
  background: #ffc075;
  box-shadow: 0 0 8px #ffa04455;
}
.night-mode #library {
  background: linear-gradient(125deg, #d6c6a8, #bfaf91);
  color: #483b28;
  border-color: #9e8862;
  box-shadow:
    inset 0 0 0 2px #e3d1ad,
    0 22px 60px #17130e80;
}
.night-mode #library::backdrop {
  background: #26211bb0;
}
.night-mode .library-close {
  color: #51412c;
}
.night-mode .library-shell,
.night-mode .library-list {
  border-color: #9f8963;
}
.night-mode .library-list {
  scrollbar-color: #99815b #cbbb9b;
}
.night-mode .library-row {
  border-color: #9f896350;
}
.night-mode .library-row.selected {
  border-color: #a96e37;
}
.night-mode .library-row input {
  accent-color: #a46730;
}
.night-mode .library-row small,
.night-mode .library-reference,
.night-mode .reference-note,
.night-mode .file-option > span,
.night-mode .forthcoming {
  color: #6b593e;
}
.night-mode .open-file {
  background: #bdae92;
  color: #807157;
  border-color: #a69473;
}
.night-mode .library-tune {
  background: linear-gradient(#ac723c, #925324);
  border-color: #8c582b;
  color: #fff0da;
  box-shadow: inset 0 1px 0 #e4af7360;
}
.night-mode :focus-visible {
  outline-color: #925123;
}
@media (prefers-reduced-motion: no-preference) {
  .radio,
  .night-switch,
  .scale-tick,
  .pointer::before {
    transition:
      color 0.5s,
      background-color 0.5s,
      border-color 0.5s,
      box-shadow 0.8s;
  }
}
@media (prefers-reduced-motion: reduce) {
  .night-mode .dial,
  .night-mode .dial::after {
    transition: none;
  }
}

.night-mode .makers-credit .makers-link {
  color: #8f4b23;
}
.night-mode .makers-credit .makers-link:hover {
  color: #733714;
}

.night-mode .loaded-idea {
  color: #543b23;
  text-shadow: none;
}

.night-mode .voice-meter {
  background: linear-gradient(180deg, #93856a, #b6a789 50%, #a99a7c);
  border-color: #93764c;
  box-shadow: inset 0 1px 3px #57412b50;
}
.night-mode .on .voice-meter {
  background:
    radial-gradient(ellipse at 15% 45%, #ffd79b60, transparent 65%),
    linear-gradient(180deg, #af966a, #dfc496 40%, #e5cba0 68%, #c5ab7d);
  box-shadow:
    inset 0 1px 3px #57412b40,
    0 0 8px #ffbe5c40;
}
.night-mode #help-dialog {
  background: linear-gradient(125deg, #d6c6a8, #bfaf91);
  color: #483b28;
  border-color: #9e8862;
}
.night-mode .help-shell {
  border-color: #9f8963;
}
.night-mode #help-dialog::backdrop {
  background: #26211bb0;
}
.night-mode .help-intro,
.night-mode .help-notes p,
.night-mode .help-gesture small {
  color: #665236;
}
.night-mode #help-done {
  background: #c8b18b;
  border-color: #99805a;
  color: #483b28;
}

.night-mode .radio-bottom-row .site-note {
  color: #756044;
}
.night-mode .site-note .makers-link {
  color: #895329;
}