:root {
  --document-paper: var(--page-paper);
  --document-paper-soft: color-mix(in srgb, var(--page-paper) 88%, var(--paper-2));
  --document-ink: var(--ink);
  --document-ink-2: var(--ink-2);
  --document-ink-3: var(--ink-3);
  --document-rule: var(--rule);
  --document-rule-2: var(--rule-2);
  --document-accent: var(--accent);
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --font-serif: Georgia, "Times New Roman", serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* palettes:begin (generated by scripts/palettes.mjs) */
:root[data-theme="crimson"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #ffeeed;
  --paper-2: #ffdcd9;
  --paper-3: #ffc8c5;
  --plain: #fffbfa;
  --plain-soft: #fff4f3;
  --page-paper: #fffdfd;
  --page-line: #ffbcb8;
  --ink: #301717;
  --ink-2: #503130;
  --ink-3: #6f4a49;
  --ink-4: #a07c7a;
  --rule: #ef9491;
  --rule-2: #fac5c3;
  --chrome: #9b0d23;
  --chrome-rule: #6c0816;
  --chrome-ink: #fff4f3;
  --chrome-accent: #ffcbd3;
  --accent: #a7001c;
  --accent-2: #b32d32;
  --link: #005398;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #c22630;
  --row-hover: #ffe2e0;
}

:root,
:root[data-theme="sand"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #fff0e0;
  --paper-2: #fce0c2;
  --paper-3: #f6d0a8;
  --plain: #fffbf7;
  --plain-soft: #fff5ec;
  --page-paper: #fffdfb;
  --page-line: #f3c697;
  --ink: #2c1b08;
  --ink-2: #4a3620;
  --ink-3: #685037;
  --ink-4: #998269;
  --rule: #dfa360;
  --rule-2: #efceab;
  --chrome: #833b00;
  --chrome-rule: #5b2600;
  --chrome-ink: #fff4ef;
  --chrome-accent: #77f2f1;
  --accent: #824700;
  --accent-2: #965200;
  --link: #005e66;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #9e5700;
  --row-hover: #fee5ca;
}

:root[data-theme="ember"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #f2f2f2;
  --paper-2: #e5e5e5;
  --paper-3: #d7d7d7;
  --plain: #fcfcfc;
  --plain-soft: #f7f7f7;
  --page-paper: #fdfdfd;
  --page-line: #f4c761;
  --ink: #1f1f1f;
  --ink-2: #3a3a3a;
  --ink-3: #555555;
  --ink-4: #868686;
  --rule: #c2982a;
  --rule-2: #e9be57;
  --chrome: #ffffff;
  --chrome-rule: #c2982a;
  --chrome-ink: #1b1b1b;
  --chrome-accent: #876200;
  --accent: #805c00;
  --accent-2: #765400;
  --link: #725200;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #966c00;
  --row-hover: #e9e9e9;
}

:root[data-theme="cypress"] {
  color-scheme: var(--theme-color-scheme, dark);
  --paper: #003915;
  --paper-2: #002f10;
  --paper-3: #00461c;
  --plain: #043e19;
  --plain-soft: #003413;
  --page-paper: #07411c;
  --page-line: #1d6835;
  --ink: #f0f8f1;
  --ink-2: #d1e4d4;
  --ink-3: #b3d0b8;
  --ink-4: #7d9b82;
  --rule: #21763c;
  --rule-2: #115629;
  --chrome: #00451b;
  --chrome-rule: #006b2e;
  --chrome-ink: #ebf8ec;
  --chrome-accent: #c7e186;
  --accent: #a3cf68;
  --accent-2: #92bf4f;
  --link: #64ded7;
  --warn: #ff9d7f;
  --ok: #7fd994;
  --good-border: #448c56;
  --good-bg: #17351f;
  --warn-border: #aa7d2d;
  --warn-bg: #3c2a0d;
  --warn-ink: #f9cc87;
  --bar-fill: #90c045;
  --row-hover: #034e21;
}

:root[data-theme="tidepool"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #dffaf2;
  --paper-2: #c3f1e4;
  --paper-3: #a8e7d6;
  --plain: #f4fffb;
  --plain-soft: #e9fcf6;
  --page-paper: #f9fffd;
  --page-line: #96e1cd;
  --ink: #05251e;
  --ink-2: #1e423a;
  --ink-3: #355f54;
  --ink-4: #698f85;
  --rule: #57c8ae;
  --rule-2: #abe2d3;
  --chrome: #006151;
  --chrome-rule: #004237;
  --chrome-ink: #edfaf6;
  --chrome-accent: #ffcebf;
  --accent: #00675a;
  --accent-2: #007768;
  --link: #005884;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #007e6e;
  --row-hover: #cbf4e8;
}

:root[data-theme="mist"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #ddf8ff;
  --paper-2: #c0effa;
  --paper-3: #a3e4f3;
  --plain: #f6fdff;
  --plain-soft: #eafbff;
  --page-paper: #fbfeff;
  --page-line: #90ddef;
  --ink: #02242b;
  --ink-2: #1b4149;
  --ink-3: #325d66;
  --ink-4: #678e97;
  --rule: #4cc3dc;
  --rule-2: #a7dfec;
  --chrome: #5bd0e9;
  --chrome-rule: #1fa3bb;
  --chrome-ink: #00242b;
  --chrome-accent: #005860;
  --accent: #00646d;
  --accent-2: #00747e;
  --link: #4642a2;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #007a85;
  --row-hover: #c8f2fc;
}

:root[data-theme="glacier"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #e9f4ff;
  --paper-2: #d2e8ff;
  --paper-3: #badbff;
  --plain: #f9fcff;
  --plain-soft: #f1f8ff;
  --page-paper: #fcfeff;
  --page-line: #abd4ff;
  --ink: #102031;
  --ink-2: #283c51;
  --ink-3: #405870;
  --ink-4: #7289a1;
  --rule: #79b6f4;
  --rule-2: #b7d8fb;
  --chrome: #005494;
  --chrome-rule: #003967;
  --chrome-ink: #f1f8ff;
  --chrome-accent: #77f0fd;
  --accent: #005e8c;
  --accent-2: #006da2;
  --link: #204ca4;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #0073aa;
  --row-hover: #daecff;
}

:root[data-theme="ultramarine"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #eef2ff;
  --paper-2: #dce4ff;
  --paper-3: #cad6ff;
  --plain: #fbfcff;
  --plain-soft: #f4f7ff;
  --page-paper: #fdfdff;
  --page-line: #bfcdff;
  --ink: #191e32;
  --ink-2: #323952;
  --ink-3: #4b5471;
  --ink-4: #7c85a2;
  --rule: #99adf7;
  --rule-2: #c6d3fd;
  --chrome: #2522a6;
  --chrome-rule: #150079;
  --chrome-ink: #f4f6ff;
  --chrome-accent: #ffd29e;
  --accent: #4242bf;
  --accent-2: #4f56c5;
  --link: #663693;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #5358d6;
  --row-hover: #e2e9ff;
}

:root[data-theme="lilac"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #f4f0ff;
  --paper-2: #e8e0ff;
  --paper-3: #dccfff;
  --plain: #fcfbff;
  --plain-soft: #f8f5ff;
  --page-paper: #fefdff;
  --page-line: #d5c5fe;
  --ink: #221b30;
  --ink-2: #3d354f;
  --ink-3: #584f6e;
  --ink-4: #89819e;
  --rule: #b9a2ee;
  --rule-2: #d8ccf7;
  --chrome: #b9a3e9;
  --chrome-rule: #8d79bb;
  --chrome-ink: #231838;
  --chrome-accent: #50349c;
  --accent: #5c37b8;
  --accent-2: #684dbf;
  --link: #3049a4;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #6f4ecf;
  --row-hover: #ece5ff;
}

:root[data-theme="starlight"] {
  color-scheme: var(--theme-color-scheme, dark);
  --paper: #362151;
  --paper-2: #2c1a43;
  --paper-3: #432b62;
  --plain: #3b2656;
  --plain-soft: #321e4a;
  --page-paper: #3e2959;
  --page-line: #64478b;
  --ink: #f6f3fc;
  --ink-2: #e1daef;
  --ink-3: #ccc1e0;
  --ink-4: #988bac;
  --rule: #70509b;
  --rule-2: #523874;
  --chrome: #46206e;
  --chrome-rule: #664293;
  --chrome-ink: #f6f1ff;
  --chrome-accent: #f5d073;
  --accent: #e6b642;
  --accent-2: #bd96fe;
  --link: #62dedd;
  --warn: #ff9d7f;
  --ok: #7fd994;
  --good-border: #448c56;
  --good-bg: #17351f;
  --warn-border: #aa7d2d;
  --warn-bg: #3c2a0d;
  --warn-ink: #f9cc87;
  --bar-fill: #d9a500;
  --row-hover: #4a306b;
}

:root[data-theme="orchid"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #fdecfe;
  --paper-2: #f7dbf9;
  --paper-3: #efc9f1;
  --plain: #fffaff;
  --plain-soft: #fef3ff;
  --page-paper: #fffcff;
  --page-line: #eabeed;
  --ink: #29182a;
  --ink-2: #463248;
  --ink-3: #634c65;
  --ink-4: #947d96;
  --rule: #d499d9;
  --rule-2: #e9c7eb;
  --chrome: #7d2386;
  --chrome-rule: #56165d;
  --chrome-ink: #fcf4fd;
  --chrome-accent: #d4e590;
  --accent: #832298;
  --accent-2: #8f3ca1;
  --link: #284ba4;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #993aae;
  --row-hover: #f9e0fb;
}

:root[data-theme="rose"] {
  color-scheme: var(--theme-color-scheme, light);
  --paper: #ffedf1;
  --paper-2: #ffdae2;
  --paper-3: #ffc6d2;
  --plain: #fffafb;
  --plain-soft: #fff4f6;
  --page-paper: #fffdfd;
  --page-line: #fdbac9;
  --ink: #2f171d;
  --ink-2: #4f3038;
  --ink-3: #6d4a52;
  --ink-4: #9f7b83;
  --rule: #ec93a9;
  --rule-2: #f8c4d0;
  --chrome: #f0a6b7;
  --chrome-rule: #c17b8c;
  --chrome-ink: #36111c;
  --chrome-accent: #8c0e46;
  --accent: #a20050;
  --accent-2: #ae2c5e;
  --link: #006336;
  --warn: #a73200;
  --ok: #0d7435;
  --good-border: #7cc58c;
  --good-bg: #def8e2;
  --warn-border: #e1ad57;
  --warn-bg: #fff0d8;
  --warn-ink: #7d460b;
  --bar-fill: #bc2563;
  --row-hover: #ffe1e7;
}
/* palettes:end */

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 24px;
  padding: 0.12rem 0.42rem;
  border: 1px solid color-mix(in srgb, var(--chrome-ink) 38%, transparent);
  border-radius: 2px;
  background: color-mix(in srgb, var(--chrome-ink) 6%, transparent);
  color: var(--chrome-ink);
  cursor: pointer;
  font: 700 0.6rem/1 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.theme-toggle:hover,
.theme-toggle:focus-visible,
.theme-toggle[aria-expanded="true"] {
  border-color: var(--chrome-accent);
  color: var(--chrome-accent);
  outline: none;
}

.theme-icon {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.amyc-has-public-records-footer {
  padding-bottom: calc(var(--amyc-public-records-footer-height, 30px) + env(safe-area-inset-bottom, 0px));
}

.amyc-public-records-footer {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: var(--amyc-public-records-footer-z, 80);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: var(--amyc-public-records-footer-height, 30px);
  padding: 0.28rem 0.85rem calc(0.28rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--rule);
  background: color-mix(in srgb, var(--paper-2) 94%, var(--plain));
  box-shadow: 0 -8px 20px color-mix(in srgb, var(--ink) 10%, transparent);
  color: var(--ink-3);
  font: 0.64rem/1.25 var(--font-mono);
  letter-spacing: 0;
  text-align: center;
}

.amyc-public-records-footer span,
.amyc-public-records-footer a {
  min-width: 0;
}

.amyc-public-records-footer a {
  color: var(--link);
  text-decoration: none;
  white-space: nowrap;
}

.amyc-public-records-footer a:hover,
.amyc-public-records-footer a:focus-visible {
  text-decoration: underline;
  outline: none;
}

@media (max-width: 620px) {
  .amyc-public-records-footer {
    align-items: baseline;
    flex-wrap: wrap;
    min-height: var(--amyc-public-records-footer-height-mobile, 44px);
    padding-right: 0.55rem;
    padding-left: 0.55rem;
    font-size: 0.58rem;
  }

  body.amyc-has-public-records-footer {
    padding-bottom: calc(var(--amyc-public-records-footer-height-mobile, 44px) + env(safe-area-inset-bottom, 0px));
  }
}

.theme-panel {
  position: absolute;
  top: calc(100% + 0.26rem);
  right: 0.85rem;
  z-index: 90;
  display: grid;
  gap: 0.28rem;
  width: min(286px, calc(100vw - 1.2rem));
  padding: 0.34rem;
  border: 1px solid var(--rule);
  border-radius: 3px;
  background: var(--paper);
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ink) 18%, transparent);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 0.72rem;
  letter-spacing: 0;
  text-transform: none;
}

.theme-panel[hidden] {
  display: none;
}

.theme-panel-head,
.custom-css-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  color: var(--ink-2);
  font-family: var(--font-mono);
  font-size: 0.52rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.theme-spectrum-row {
  position: relative;
  display: flex;
  min-width: 0;
}

.amyc-snap-track {
  position: relative;
}

.amyc-snap-track > input {
  position: relative;
  z-index: 1;
}

.amyc-snap {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  background: color-mix(in srgb, var(--ink-3) 58%, transparent);
}

.amyc-snap-track:not(.is-vertical) .amyc-snap {
  top: 1px;
  width: 1px;
  height: 7px;
  transform: translateX(-50%);
}

.amyc-snap-track:not(.is-vertical) .amyc-snap-min {
  left: 0;
}

.amyc-snap-track:not(.is-vertical) .amyc-snap-default {
  left: var(--snap-default, 50%);
  height: 10px;
  background: var(--accent-2);
}

.amyc-snap-track:not(.is-vertical) .amyc-snap-max {
  left: 100%;
}

.amyc-snap-track.is-vertical .amyc-snap {
  left: 50%;
  width: 8px;
  height: 1px;
  transform: translateX(-50%);
}

.amyc-snap-track.is-vertical .amyc-snap-min {
  bottom: 0;
}

.amyc-snap-track.is-vertical .amyc-snap-default {
  bottom: var(--snap-default, 50%);
  width: 11px;
  background: var(--accent-2);
}

.amyc-snap-track.is-vertical .amyc-snap-max {
  top: 0;
}

.theme-control-grid {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 0.3rem;
  align-items: stretch;
}

.theme-spectrum {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

.lightness-control {
  display: grid;
  grid-template-rows: 8px 58px 8px auto;
  justify-items: center;
  align-content: start;
  gap: 2px;
  width: 20px;
  color: var(--ink-3);
}

.lightness-endpoint {
  box-sizing: border-box;
  display: block;
  width: 8px;
  height: 8px;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: var(--ink-2);
}

.lightness-endpoint.is-dark {
  background: currentColor;
}

.lightness-value {
  font-family: var(--font-mono);
  font-size: 0.42rem;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}

.lightness-value {
  color: var(--ink-2);
  font-size: 0.48rem;
  font-weight: 700;
}

.lightness-slider-wrap {
  position: relative;
  display: block;
  width: 16px;
  height: 58px;
}

.lightness-input {
  appearance: none;
  -webkit-appearance: none;
  position: absolute;
  top: 50%;
  left: 50%;
  height: 18px;
  width: 58px;
  margin: 0;
  background: transparent;
  accent-color: var(--accent-2);
  cursor: ns-resize;
  transform: translate(-50%, -50%) rotate(-90deg);
}

.theme-spectrum-input {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  height: 16px;
  background: transparent;
  accent-color: var(--accent-2);
  cursor: grab;
}

.lightness-input::-webkit-slider-runnable-track,
.theme-spectrum-input::-webkit-slider-runnable-track {
  height: 3px;
  border: 0;
  border-radius: 999px;
  background: var(--rule);
}

.lightness-input::-webkit-slider-thumb,
.theme-spectrum-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 11px;
  height: 11px;
  margin-top: -4px;
  border: 2px solid var(--paper);
  border-radius: 50%;
  background: var(--accent-2);
  box-shadow: 0 0 0 1px var(--rule);
}

.theme-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.22rem;
}

.theme-choice {
  display: grid;
  gap: 0.14rem;
  min-height: 42px;
  padding: 0.18rem;
  border: 1px solid var(--rule);
  border-radius: 3px;
  background: var(--plain);
  color: var(--ink-2);
  cursor: pointer;
  text-align: left;
}

.theme-choice:hover,
.theme-choice:focus-visible,
.theme-choice[aria-pressed="true"] {
  border-color: var(--accent-2);
  background: var(--plain-soft);
  outline: none;
}

.theme-swatch {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  overflow: hidden;
  height: 17px;
  border: 1px solid var(--swatch-rule);
  border-radius: 2px;
}

.theme-swatch span:nth-child(1) { background: var(--swatch-chrome); }
.theme-swatch span:nth-child(2) { background: var(--swatch-paper-2); }
.theme-swatch span:nth-child(3) { background: var(--swatch-accent); }
.theme-swatch span:nth-child(4) { background: var(--swatch-plain); }

.theme-name {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--ink-2);
  font-family: var(--font-mono);
  font-size: 0.48rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.theme-note {
  display: none;
}

.theme-actions,
.amyc-font-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  padding-top: 0.24rem;
  border-top: 1px solid var(--rule-2);
}

.theme-panel .hbtn,
.amyc-display-panel .hbtn {
  min-height: 23px;
  padding: 0.16rem 0.4rem;
  border: 1px solid var(--rule);
  border-radius: 2px;
  background: var(--plain);
  color: var(--ink-2);
  cursor: pointer;
  font: 700 0.52rem/1 var(--font-mono);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.theme-panel .hbtn:hover,
.theme-panel .hbtn:focus-visible,
.amyc-display-panel .hbtn:hover,
.amyc-display-panel .hbtn:focus-visible {
  border-color: var(--accent-2);
  color: var(--accent);
  outline: none;
}

.theme-persistence-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  min-width: 0;
  min-height: 23px;
  padding: 0.16rem 0.5rem 0.16rem 0.3rem;
  border: 1px solid var(--rule);
  border-radius: 999px;
  background: var(--plain);
  color: var(--ink-3);
  cursor: pointer;
  font: 700 0.52rem/1 var(--font-mono);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.theme-persistence-toggle:hover,
.theme-persistence-toggle:focus-visible {
  border-color: var(--accent-2);
  color: var(--accent);
  outline: none;
}

.theme-persistence-toggle:focus-visible {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent-2) 45%, transparent);
}

.theme-persistence-toggle[aria-checked="true"] {
  border-color: var(--accent);
  background: var(--accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent);
  color: var(--paper);
}

.theme-persistence-toggle[aria-checked="true"]:hover,
.theme-persistence-toggle[aria-checked="true"]:focus-visible {
  border-color: var(--accent-2);
  background: var(--accent-2);
}

.theme-sync-knob {
  position: relative;
  flex: 0 0 auto;
  width: 17px;
  height: 9px;
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 28%, transparent);
}

.theme-sync-knob::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  transition: transform 160ms ease;
}

.theme-persistence-toggle[aria-checked="true"] .theme-sync-knob::after {
  transform: translateX(8px);
}

@media (prefers-reduced-motion: reduce) {
  .theme-persistence-toggle,
  .theme-sync-knob::after {
    transition: none;
  }
}

.custom-css-box {
  padding-top: 0.24rem;
  border-top: 1px solid var(--rule-2);
}

.custom-css-summary {
  cursor: pointer;
}

.custom-css-summary::marker,
.custom-css-summary::-webkit-details-marker {
  display: none;
  content: "";
}

.custom-css-summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--ink-3);
  font-size: 0.64rem;
  line-height: 1;
}

.custom-css-box[open] .custom-css-summary::after {
  content: "-";
}

.custom-css-body {
  display: grid;
  gap: 0.24rem;
  margin-top: 0.24rem;
}

.custom-css-input {
  width: 100%;
  min-height: 72px;
  resize: vertical;
  padding: 0.3rem;
  border: 1px solid var(--rule);
  border-radius: 2px;
  background: var(--plain);
  color: var(--ink);
  font: 0.62rem/1.32 var(--font-mono);
}

.custom-css-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}

.custom-css-status {
  color: var(--ink-3);
  font-size: 0.58rem;
}