:root {
  color-scheme:light;
  --ink:#1d1d1f;
  --muted:#6e6e73;
  --blue:#0071e3;
  --paper:#f5f5f7;
  --surface:#fff;
  --border:#dcdce1;
  --result:#eaf3fc;
  --download:linear-gradient(135deg,#e5effa,#fff 50%,#edf0fc);
}

:root[data-theme="dark"] {
  color-scheme:dark;
  --ink:#f5f5f7;
  --muted:#aaaab2;
  --blue:#59aaff;
  --paper:#141416;
  --surface:#222225;
  --border:#38383e;
  --result:#1c2b3c;
  --download:linear-gradient(135deg,#1c2b3c,#222225 50%,#28283d);
}

@media (prefers-color-scheme:dark) {
  :root:not([data-theme]) {
  color-scheme:dark;
  --ink:#f5f5f7;
  --muted:#aaaab2;
  --blue:#59aaff;
  --paper:#141416;
  --surface:#222225;
  --border:#38383e;
  --result:#1c2b3c;
  --download:linear-gradient(135deg,#1c2b3c,#222225 50%,#28283d);
  }
}

.theme-select {
  -webkit-appearance:none;
  appearance:none;
  font:inherit;
  font-size:13px;
  color:var(--ink);
  background:var(--surface);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m2 4 4 4 4-4' fill='none' stroke='%23808080' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 10px center;
  background-size:12px 12px;
  border:1px solid var(--border);
  border-radius:20px;
  min-height:44px;
  padding:8px 32px 8px 10px;
  cursor:pointer;
}