/* White-mode counterparts of Dyal's current silver palette. */
:root, :root[data-theme=light] {
  color-scheme:light;
  --bg:#F5F5F5;
  --dial-face:#111111;
  --dial-ink:#FFFFFF;
  --surface:#FFFFFF;
  --sheet:#DADADA;
  --text:#111111;
  --secondary:#484848;
  --tertiary:#505050;
  --primary:#111111;
  --pressed:#333333;
  --accent:#333333;
  --muted:#ECECEC;
  --border:#B0B0B0;
  --strong:#767676;
  --danger:#B52A22;
  --success:#32663F;
  --disabled:#CACACA;
  --disabled-ink:#666666;
}
:root[data-theme=dark] {
  color-scheme:dark;
  --bg:#101010;
  --dial-face:#FFFFFF;
  --dial-ink:#111111;
  --surface:#292929;
  --sheet:#333333;
  --text:#F5F5F5;
  --secondary:#B8B8B8;
  --tertiary:#AAAAAA;
  --primary:#DADADA;
  --pressed:#B8B8B8;
  --accent:#DADADA;
  --muted:#353535;
  --border:#454545;
  --strong:#969696;
  --danger:#FF857A;
  --success:#79B58A;
  --disabled:#353535;
  --disabled-ink:#A0A0A0;
}
* {
  box-sizing:border-box
}
body {
  background:var(--bg);
  color:var(--text);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased
}
button,input {
  font:inherit
}
a,button,input {
  -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:5px
}
button {
  touch-action:manipulation
}
button:disabled {
  cursor:wait!important;
  background:var(--disabled)!important;
  color:var(--disabled-ink)!important;
  transform:none!important
}
.appearance {
  position:absolute;
  top:24px;
  right:28px;
  border:1px solid var(--border);
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  background:var(--surface);
  color:var(--secondary);
  border-radius:50%;
  cursor:pointer
}
.appearance svg {
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5
}
.appearance:hover {
  color:var(--accent);
  border-color:var(--strong)
}
[hidden] {
  display:none!important
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}
@media(prefers-contrast:more) {
  :root {
    --border:var(--strong);
    --secondary:var(--text);
    --tertiary:var(--text);
    --primary:#000000
  }
}

.appearance { z-index:10; }
:root[data-theme=dark] .input-row button, :root[data-theme=dark] .success-cta, :root[data-theme=dark] .ios-install a { color:#111111; }