/* Dark version. The CI files (tokens / base / components) use colour tokens
   throughout, so dark only redefines the tokens. It follows the device
   setting unless someone picks Light or Dark in the account menu
   (data-theme on <html>, kept in localStorage "mr-theme"). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ink:        #F2EFE8;
    --ink-soft:   #DAD6CD;
    --graphite:   #A9A59D;
    --slate:      #8C8881;
    --mist:       #47443F;
    --fog:        #2F2C28;
    --bone:       #25231F;
    --chalk:      #1C1B18;
    --snow:       #121110;
    --positive:      #6FBF8B;
    --positive-tint: #1C2B21;
    --negative:      #E27B72;
    --negative-tint: #3A201E;
    --caution:       #A395E6;
    --caution-tint:  #26223B;
    --accent:        #DB7C9E;
    --accent-tint:   #3B1F2B;
  }
  :root:not([data-theme="light"]) .logo { filter: invert(1); }
  :root:not([data-theme="light"]) .select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M1 3.5L5 7.5L9 3.5' stroke='%23F2EFE8' stroke-width='1' fill='none'/></svg>");
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink:        #F2EFE8;
  --ink-soft:   #DAD6CD;
  --graphite:   #A9A59D;
  --slate:      #8C8881;
  --mist:       #47443F;
  --fog:        #2F2C28;
  --bone:       #25231F;
  --chalk:      #1C1B18;
  --snow:       #121110;
  --positive:      #6FBF8B;
  --positive-tint: #1C2B21;
  --negative:      #E27B72;
  --negative-tint: #3A201E;
  --caution:       #A395E6;
  --caution-tint:  #26223B;
  --accent:        #DB7C9E;
  --accent-tint:   #3B1F2B;
}
:root[data-theme="dark"] .logo { filter: invert(1); }
:root[data-theme="dark"] .select {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M1 3.5L5 7.5L9 3.5' stroke='%23F2EFE8' stroke-width='1' fill='none'/></svg>");
}