/* Shared visual-language generated geometry + upstream native primitives; consumer palette below. */
/* Generated by Terrazzo 2.x. Palette and font roles belong to the consumer. */
:root {
  --dpr: 1;
  --dp: calc(1px / var(--dpr));
  --case-upper: 1;
  --fw-base: 400;
  --fw-bold: 700;
  --fw-mid: 700;
  --rule-multiplier: 1;
  --rule-s: solid;
  --track: 1;
  --cap-height: 1cap;
  --character: 1ch;
  --line-box: 1lh;
  --dg-hatch-pitch: round(calc(0.5 * 1rem), var(--dp));
  --dg-rule-offset: round(calc(-0.25 * 1rem), var(--dp));
  --divider-break: round(calc(0.75 * 1rem), var(--dp));
  --divider-grip-h: round(calc(2.75 * 1rem), var(--dp));
  --divider-grip-w: round(calc(0.4375 * 1rem), calc(2 * var(--dp)));
  --divider-hit: round(calc(1.25 * 1rem), var(--dp));
  --divider-stack: round(calc(48 * 1rem), var(--dp));
  --gut: var(--s6);
  --ldg-head-h: var(--s24);
  --ldg-row-h: var(--u20);
  --mtr-h: var(--u8);
  --mtr-scale-h: round(calc(1.75 * 1rem), var(--dp));
  --mtr-tick-proud: var(--s3);
  --mtr-tick-w: var(--s3);
  --prog-h: var(--u16);
  --sl-cap: round(calc(0.5 * 1rem), var(--dp));
  --sl-h: var(--u16);
  --sl-len: round(calc(18 * 1rem), var(--dp));
  --sl-proud: 0.16666666666666666;
  --sl-v-len: round(calc(8 * 1rem), var(--dp));
  --t-pad-x: var(--s6);
  --t-row-pad-y: var(--s3);
  --t-stamp-gap: var(--u10);
  --t-word-h: var(--u20);
  --edit-gutter: 0.5ch;
  --field-gap: 0.75ch;
  --fmeta-gap: 1.5ch;
  --focus-height-ratio: 0.3333333333333333;
  --hair: 1px;
  --hex-cols: 8;
  --ldg-gap: 2ch;
  --ldg-pad-x: 1ch;
  --meter-clip: 0.95;
  --meter-warn: 0.75;
  --mk-strokes: 2;
  --mtr-readout-cols: 4;
  --numeric-cols: 6;
  --pin-gap: 0.33ch;
  --prog-readout-cols: 4;
  --r2-clip-density-min: 0.3;
  --r2-depth-falloff: 0.6;
  --r2-edge-density: 0.85;
  --r2-grip-density: 0.75;
  --r2-phase: 0.5;
  --r2-x: 0.7548776662;
  --r2-y: 0.569840291;
  --readout-cols: 3;
  --rhythm-grid: 2px;
  --rhythm-ratio: 1.2;
  --t-word-cols: 5;
  --box: round(calc(0.85 * 1em), var(--dp));
  --btn-pad-x: round(calc(0.8333333333333334 * 1em), var(--dp));
  --btn-travel: round(calc(0.1875 * 1em), var(--dp));
  --depth-carried: round(calc(0.5 * 1em), var(--dp));
  --depth-modal: round(calc(0.375 * 1em), var(--dp));
  --fmeta-height: round(calc(1.4 * 1em), var(--dp));
  --ic-baseline: round(calc(-0.125 * 1em), var(--dp));
  --ic-button-size: round(calc(1.1666666666666667 * 1em), var(--dp));
  --ic-gap-baseline: round(calc(-0.05 * 1em), var(--dp));
  --ic-gap-size: round(calc(0.8 * 1em), var(--dp));
  --ic-size: round(calc(1 * 1em), var(--dp));
  --leading: round(calc(1.2 * 1em), var(--dp));
  --mk: round(calc(0.6 * 1em), var(--dp));
  --pad-y: round(calc(0.5 * 1em), var(--dp));
  --secret-height: round(calc(1.1 * 1em), var(--dp));
  --sl-fine-inset: round(calc(0.125 * 1em), var(--dp));
  --sl-fine-pitch: round(calc(0.3125 * 1em), var(--dp));
  --sl-origin-length: round(calc(0.3125 * 1em), var(--dp));
  --sl-witness-gap: round(calc(0.5 * 1em), var(--dp));
  --divider-rule-widths: 3;
  --freshness-rule-offset: round(calc(0.25 * 1rem), var(--dp));
  --meter-digits: 3;
  --meter-major-step: 0.25;
  --meter-numeric-size: round(calc(2.5 * 1rem), var(--dp));
  --meter-tick-step: 0.05;
  --neck-reach: round(calc(3 * 1em), var(--dp));
  --sl-maximum: 100;
  --s2: var(--u2);
  --s3: round(calc(0.25 * 1rem), var(--dp));
  --s4: var(--u4);
  --s6: round(calc(0.5 * 1rem), var(--dp));
  --s8: var(--u8);
  --s9: round(calc(0.75 * 1rem), var(--dp));
  --s10: var(--u10);
  --s12: round(calc(1 * 1rem), var(--dp));
  --s14: var(--u14);
  --s15: round(calc(1.25 * 1rem), var(--dp));
  --s16: var(--u16);
  --s18: round(calc(1.5 * 1rem), var(--dp));
  --s24: round(calc(2 * 1rem), var(--dp));
  --ls-06: calc(0.06em * var(--track));
  --ls-08: calc(0.08em * var(--track));
  --ls-10: calc(0.1em * var(--track));
  --ls-12: calc(0.12em * var(--track));
  --fs-0: round(calc(1 * 1rem), var(--dp));
  --fs-2xl: var(--u16);
  --fs-2xs: var(--u8);
  --fs-n1: round(calc(0.875 * 1rem), var(--dp));
  --fs-n2: round(calc(0.75 * 1rem), var(--dp));
  --fs-p1: round(calc(1.25 * 1rem), var(--dp));
  --fs-p2: round(calc(1.5 * 1rem), var(--dp));
  --fs-p3: round(calc(2 * 1rem), var(--dp));
  --fs-s: var(--u10);
  --fs-xl: var(--u14);
  --fs-xs: round(calc(0.75 * 1rem), var(--dp));
  --u2: round(calc(0.16666666666666666 * 1rem), var(--dp));
  --u4: round(calc(0.3333333333333333 * 1rem), var(--dp));
  --u8: round(calc(0.6666666666666666 * 1rem), var(--dp));
  --u10: round(calc(0.8333333333333334 * 1rem), var(--dp));
  --u14: round(calc(1.1666666666666667 * 1rem), var(--dp));
  --u16: round(calc(1.3333333333333333 * 1rem), var(--dp));
  --u20: round(calc(1.6666666666666667 * 1rem), var(--dp));
  --u22: round(calc(1.8333333333333333 * 1rem), var(--dp));
  --u26: round(calc(2.1666666666666665 * 1rem), var(--dp));
  --u28: round(calc(2.3333333333333335 * 1rem), var(--dp));
  --rule-w: max(var(--dp), round(calc(var(--rule-multiplier) * var(--hair)), var(--dp)));
  --line: var(--rule-w) var(--rule-s) var(--base02);
  --mk-w: calc(var(--rule-w) * var(--mk-strokes));
  --mk-inset: calc(-1 * var(--rule-w));
  --mk-ink: var(--base07);
  --ctl-h: calc(var(--leading) + 2 * var(--pad-y) + 2 * var(--rule-w));
  --case: uppercase;
}
.rule-solid {
  --rule-multiplier: 1;
  --rule-s: solid;
}
.rule-heavy {
  --rule-multiplier: 2;
  --rule-s: solid;
}
.rule-dashed {
  --rule-multiplier: 1;
  --rule-s: dashed;
}
.track-tight {
  --track: 0.5;
}
.track-norm {
  --track: 1;
}
.track-wide {
  --track: 1.25;
}
.case-upper {
  --case-upper: 1;
  --case: uppercase;
}
.case-plain {
  --case-upper: 0;
  --case: none;
}
.fw-light {
  --fw-base: 400;
  --fw-bold: 700;
  --fw-mid: 400;
}
.fw-norm {
  --fw-base: 400;
  --fw-bold: 700;
  --fw-mid: 700;
}
.fw-heavy {
  --fw-base: 700;
  --fw-bold: 700;
  --fw-mid: 700;
}
@media (max-width: 48em) { .r2-divider { display: none; } }

/* Settled Quickshell source adaptation. Source attribution: README.md. */

/* Visual defaults; applications supply state. */
.btn {
  --op: 0;
  --drain: 1;
  --hold: 0;
}
:is(.modal, .r2-lift, .r2-grip) {
  --r2-top: 0px;
  --r2-left: 0px;
  --r2-width: 0px;
  --r2-height: 0px;
  --r2-mask: none;
}
.r2-divider {
  --rule-x: 0px;
}
.sl {
  --sl-pitch: 100%;
  --sl-low: 0;
  --sl-span: 0;
  --sl-origin-x: 0%;
  --sl-origin-y: 100%;
}
.prog {
  --prog-pitch: 100%;
}
.dwell-edge {
  --dwell: 1;
}
.ldg {
  --ldg-cols: minmax(0, 1fr);
  --ldg-h: auto;
}
.divide {
  --divide-cols: repeat(3, minmax(0, 1fr));
}
.clip-overlay {
  --clip-mask: none;
}
.ic {
  --icon: none;
}

* {
  box-sizing: border-box;
  line-height: var(--leading);
}

[hidden] {
  display: none !important;
}

button {
  position: relative;
  font: inherit;
}

::selection {
  background: var(--base04);
  color: var(--base00);
}

input[type="search"]::-webkit-search-cancel-button {
  display: none;
}

:is(button, .btn, .mk) {
  --mk-show: none;
}
:is(button, .btn, .mk):is(:focus-visible, .is-focus) {
  outline: none;
  --mk-show: block;
}
/* a disabled choice stays disabled; its focus marks still say which one is chosen */
.btn:is(.active, :has(> input:checked)):is(:disabled, .is-disabled, :has(> input:disabled)) {
  --mk-show: block;
}

:is(button, .btn, .mk)::after {
  content: "";
  display: var(--mk-show, none);
  position: absolute;
  inset: var(--mk-inset);
  z-index: 3;
  pointer-events: none;
  border: var(--mk-w) var(--rule-s) var(--mk-ink);
  mask-image:
    linear-gradient(var(--base07), var(--base07)),
    linear-gradient(var(--base07), var(--base07)),
    linear-gradient(var(--base07), var(--base07)),
    linear-gradient(var(--base07), var(--base07));
  mask-position:
    left top,
    right top,
    left bottom,
    right bottom;
  mask-size: var(--mk) var(--mk);
  mask-repeat: no-repeat;
}

.btn {
  --btn-size: var(--ctl-h);

  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: var(--pad-y) var(--btn-pad-x);
  border: var(--line);
  border-radius: 0;
  color: var(--base04);
  background: var(--base01);
  cursor: pointer;
  user-select: none;
}

@property --depth {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
:is(.modal, .r2-lift)::before {
  content: "";
  position: absolute;
  top: var(--r2-top, 0px);
  left: var(--r2-left, 0px);
  width: var(--r2-width, 0px);
  height: var(--r2-height, 0px);
  background: var(--base04);
  mask: var(--r2-mask, none) 0 0 / 100% 100% no-repeat;
  pointer-events: none;
  visibility: hidden;
}
:is(.modal, .r2-lift)[style*="--r2-mask"]::before {
  visibility: inherit;
}
.modal {
  --depth: var(--depth-modal);
}
.r2-lift {
  --depth: var(--depth-carried);
}
.popout,
.modal,
.r2-lift {
  position: relative;
}
.r2-lift:not(.is-lifted)::before {
  display: none;
}

.r2-lift.is-lifted {
  z-index: 2;
  background: var(--base00);
}
.r2-slot {
  background: var(--dg-hatch);
}
.r2-slot > * {
  visibility: hidden;
}

.r2-divider {
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--rule-x, 0px);
  width: var(--divider-hit);
  translate: -50% 0;
  z-index: 3;
  cursor: ew-resize;
  touch-action: none;
  display: grid;
  place-items: center;
  outline: none;
  --divider-ink: var(--base02);
}

.r2-grip {
  display: block;
  width: var(--divider-grip-w);
  height: var(--divider-grip-h);
  position: relative;
  z-index: 2;
  background: var(--base04);
  mask: var(--r2-mask, none) 0 0 / 100% 100% no-repeat;
  pointer-events: none;
}

/* The rule stops short of the grip, so the break shows whatever surface lies beneath. */
.r2-divider::before,
.r2-divider::after {
  content: "";
  position: absolute;
  left: 50%;
  height: max(0px, calc(50% - (var(--divider-grip-h) + var(--divider-break)) / 2));
  translate: -50% 0;
  border-left: var(--rule-w) var(--rule-s) var(--divider-ink);
}
.r2-divider::before {
  top: 0;
}
.r2-divider::after {
  bottom: 0;
}
.r2-divider:is(:focus-visible, .is-focus) {
  --divider-ink: var(--base07);
}
.r2-divider:is(:hover, .is-hover, :focus-visible, .is-focus, .is-held) .r2-grip {
  background: var(--base07);
}

.btn:is(:active, .is-press):not(:disabled, .is-disabled, .is-busy) {
  translate: 0 var(--btn-travel);
}

.btn .lbl {
  white-space: nowrap;
}

.btn :is(kbd, .sub) {
  color: var(--base04);
}

.btn:is(:hover, .is-hover):not(:where(:disabled, .is-disabled, .is-busy))
  :is(kbd, .sub) {
  color: var(--base05);
}

kbd {
  font: inherit;
  font-size: var(--fs-label);
  color: var(--base04);
}

.btn:has(.sub) {
  flex-direction: column;
  gap: var(--hair);
}

.btn .line {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}

.btn .sub {
  font-size: var(--fs-label);
  line-height: 1;
  letter-spacing: var(--ls-caps);
}

.btn.primary {
  color: var(--base07);
}

.btn.iconic {
  min-width: var(--btn-size);
  min-height: var(--btn-size);
  padding-inline: 0;
}

.btn.iconic:has(kbd) {
  padding-inline: var(--btn-pad-x);
}

.btn svg.ic {
  width: var(--ic-button-size);
  height: var(--ic-button-size);
}


.btn:is(.is-armed, .active):where(:not(:disabled, .is-disabled, :has(> input:disabled)))::after,
.btn:has(> input:checked):where(:not(:disabled, .is-disabled, :has(> input:disabled)))::after {
  --mk-ink: var(--base00);
  --mk-inset: 0;
}

.btn.is-armed:is(:active, .is-press)::after {
  --mk-ink: var(--base07);
}

.btn:hover,
.btn.is-hover {
  background: var(--base02);
  border-color: var(--base03);
  color: var(--base07);
}

.btn:disabled,
.btn:has(> input:disabled),
.btn.is-disabled {
  color: var(--base03);
  background: var(--base01);
  border-color: var(--base02);
  cursor: default;
}

.btn.is-busy {
  background: var(--base01);
  border-color: var(--base03);
  color: var(--base05);
  cursor: default;
}

.btn.is-busy.reject {
  background: var(--base02);
}

.btn.is-held {
  background: var(--base01);
  border-color: var(--base0A);
  color: var(--base0A);
}

.btn.is-armed {
  background: var(--base01);
  border-color: var(--base0A);
  color: var(--base0A);
}

.btn.destr:is(.is-armed, .is-held) {
  border-color: var(--base08);
  color: var(--base08);
}

.btn.destr.instant {
  border-color: var(--base08);
  color: var(--base08);
}

:is(.bgroup, .split, .menu)
  .btn:is(
    :hover,
    .is-hover,
    .is-press,
    .is-ok,
    .is-fail,
    .is-busy,
    .is-armed,
    .is-held,
    .active
  ) {
  z-index: 1;
}

:is(.bgroup, .split, .menu) .btn:is(.is-focus, :focus-visible) {
  z-index: 2;
}

.btn.is-ok {
  background: var(--base01);
  border-color: var(--base0B);
  color: var(--base0B);
}

.btn.is-fail {
  background: var(--base01);
  border-color: var(--base08);
  color: var(--base08);
}

.btn:is(:active, .is-press):not(:disabled, .is-disabled, .is-busy) {
  background: var(--base02);
  border-color: var(--base05);
  color: var(--base07);
}

.btn:is(.is-armed, .is-held, .is-ok, .is-fail, :active, .is-press, .active, .on)
  :is(kbd, .sub) {
  color: inherit;
}

.btn.is-armed:is(:active, .is-press) {
  background: var(--base00);
  border-color: var(--base0A);
  color: var(--base0A);
}

.btn.destr.is-armed:is(:active, .is-press) {
  border-color: var(--base08);
  color: var(--base08);
}

.btn .kl {
  text-decoration: underline;
  text-decoration-thickness: var(--rule-w);
  text-underline-offset: calc(1rem / 6);
}

.btn {
  --span: 100%;
  --gauge-fill: transparent;
  --gauge-ink: inherit;
}

.btn > :is(.edge, .drain, .track) {
  position: absolute;
  inset-block: 0;
  left: 0;
}

.btn > :is(.edge, .drain) {
  width: calc(var(--span) * var(--q, 0));
  background: var(--gauge-fill);
}

.btn > .track {
  right: 0;
}

.btn > .track > i {
  display: block;
  height: 100%;
  width: calc(100% * var(--q, 0));
  background: var(--gauge-fill);
}

.btn.is-busy {
  --q: var(--op, 0);
  --gauge-fill: var(--base02);
  --gauge-ink: var(--base07);
}

.btn.is-armed {
  --q: var(--drain, 1);
  --gauge-fill: var(--base0A);
  --gauge-ink: var(--base00);
}

.btn.destr:is(.is-armed, .is-held) {
  --gauge-fill: var(--base08);
}

.btn.is-held {
  --q: var(--hold, 0);
  --gauge-fill: var(--base0A);
  --gauge-ink: var(--base00);
}

.btn > .fill-ink {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  flex-direction: inherit;
  justify-content: inherit;
  gap: inherit;
  padding: inherit;
  color: var(--gauge-ink);
  pointer-events: none;
}

.btn > .fill-ink {
  clip-path: inset(0 calc(100% - var(--span) * var(--q, 0)) 0 0);
}

.btn:not(.is-busy, .is-armed, .is-held) > .fill-ink {
  display: none;
}

.bgroup {
  display: inline-flex;
}

.bgroup .btn + .btn {
  margin-left: calc(-1 * var(--rule-w));
}

.btn.active:where(:not(:disabled, .is-disabled, :has(> input:disabled))),
.btn:has(> input:checked:not(:disabled)):where(:not(.is-disabled)) {
  background: var(--base07);
  border-color: var(--base07);
  color: var(--base00);
}

.btn.on {
  border-color: var(--base0A);
  color: var(--base0A);
}

.btn.mini {
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
}

.btn.chip {
  --pad-y: var(--hair);
  background: transparent;
  font-size: var(--fs-body);
}

.btn.chip.active {
  background: var(--base01);
  border-color: var(--base04);
  color: var(--base07);
}

.bgroup.fill {
  display: flex;
  width: 100%;
}

.bgroup.fill > .btn {
  flex: 1;
  --btn-pad-x: calc(1rem / 3);
}

.split {
  position: relative;
  display: inline-flex;
}

.split > .btn + .btn {
  margin-left: calc(-1 * var(--rule-w));
}

.split .menucell {
  width: calc(var(--btn-size) - .5rem);
  min-width: calc(var(--btn-size) - .5rem);
  font-size: var(--fs-body);
}

.menu {
  position: absolute;
  position-area: block-end span-inline-end;
  position-try-fallbacks: flip-inline, flip-block;
  min-width: anchor-size(width);
  margin: 0;
  inset: auto;
  padding: 0;
  overflow: visible;
  border: var(--line);
  color: inherit;
  background: var(--base00);
}

.menu:popover-open {
  display: grid;
}

.btn:has(+ .menu:popover-open) {
  background: var(--base07);
  border-color: var(--base07);
  color: var(--base00);
}

.rail {
  display: flex;
  flex-direction: column;
}
:is(.menu, .rail) .btn {
  border: 0;
  border-bottom: var(--line);
  justify-content: flex-start;
}

:is(.menu, .rail) .btn:last-child {
  border-bottom: 0;
}

.menu.side {
  position-area: inline-end span-block-end;
}

svg.ic {
  width: var(--ic-size);
  height: var(--ic-size);
  flex: none;
  vertical-align: var(--ic-baseline);
  overflow: visible;
}

svg.st {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

svg.fl {
  fill: currentColor;
  stroke: none;
}

svg.fl.carbon {
  stroke: currentColor;
  stroke-width: 0;
}

.ic-gap {
  display: inline-block;
  width: var(--ic-gap-size);
  height: var(--ic-gap-size);
  flex: none;
  vertical-align: var(--ic-gap-baseline);
  border: var(--rule-w) dashed var(--base08);
}

.num {
  text-align: right;
}
.ell {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ro {
  min-width: calc(var(--readout-cols) * var(--character));
  text-align: right;
  color: var(--base07);
  font-size: var(--fs-readout);
  font-weight: var(--fw-bold);
}

.mut {
  color: var(--base04);
}

.meta {
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
}

/* Label-size text kept as written: no caps, so no caps tracking. */
.note {
  color: var(--base04);
  font-size: var(--fs-label);
  text-transform: none;
}

:is(.sl-trk, .prog-plate, .mtr-lane) {
  position: relative;
  border: var(--line);
  background: var(--base01);
}

.dg-lbl {
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
}
.dg-val {
  position: relative;
  color: var(--base05);
  font-weight: var(--fw-mid);
}
.dg-rule {
  display: none;
  position: absolute;
  inset: auto 0 var(--dg-rule-offset);
  height: calc(1rem / 6);
}
.dg-stale .dg-rule {
  display: block;
}
.dg-stale :is(.dg-fill, .dg-rule) {
  background: var(--dg-hatch);
}
:is(.dg-cold, .dg-gone) .dg-val {
  color: var(--base03);
  font-weight: var(--fw-base);
}
.dg-gone.dg-warn .dg-lbl {
  color: var(--base0A);
}
:is(.dg-gone, .dg-stale).dg-crit .dg-lbl {
  color: var(--base08);
}
.dg-settle .dg-val {
  color: var(--base0B);
}
.dg-settle .dg-fill {
  background: var(--base0B);
}
.dg-reason {
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
  font-weight: var(--fw-mid);
}

:is(.dg-reason, .dg-val, .ro, .num).dg-ok,
:not(.dg-gone, .dg-cold).dg-ok > .dg-val {
  color: var(--base0B);
}
:is(.dg-reason, .dg-val, .ro, .num).dg-warn,
:not(.dg-gone, .dg-cold).dg-warn > .dg-val {
  color: var(--base0A);
}
:is(.dg-reason, .dg-val, .ro, .num).dg-crit,
:not(.dg-gone, .dg-cold).dg-crit > .dg-val {
  color: var(--base08);
}

.sl {
  --v: 0;
  --h: var(--sl-h);
  --proud: round(calc(var(--h) / 6), var(--dp));
  --ink: var(--base05);
  --slab: var(--base07);
  position: relative;
  display: flex;
  align-items: center;
  gap: calc(2rem / 3);
  outline: none;
}
.sl-trk {
  width: var(--sl-len);
  height: var(--h);
  touch-action: none;
  cursor: crosshair;
}
.sl.fill {
  flex: 1;
  min-width: 0;
}
.sl.fill .sl-trk {
  flex: 1;
  width: auto;
}
.sl-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: calc(var(--v) * 100%);
  background: var(--ink);
}
.sl-cap {
  position: absolute;
  z-index: 2;
  top: calc(-1 * var(--proud));
  bottom: calc(-1 * var(--proud));
  left: calc(var(--v) * 100% - var(--sl-cap) / 2);
  width: var(--sl-cap);
  background: var(--slab);
}

:is(
  .sl[style*="--sl-pitch"] .sl-trk,
  .prog[style*="--prog-pitch"] .prog-plate
)::before {
  content: "";
  position: absolute;
  inset: 50% 0 0 0;
  z-index: 1;
  pointer-events: none;
  border-inline: var(--rule-w) var(--rule-s) transparent;
  background: repeating-linear-gradient(
      90deg,
      var(--base02) 0 var(--rule-w),
      transparent 0 var(--sl-pitch, var(--prog-pitch))
    )
    border-box;
  background-clip: padding-box;
}

.sl:is(:focus-visible, .is-focus) .sl-trk {
  --mk-show: block;
  --mk: round(calc(var(--h) / 3), var(--dp));
}
.sl.off {
  --ink: var(--base03);
  --slab: var(--base03);
}
.sl.off .sl-trk {
  cursor: default;
}
.sl.off .ro {
  color: var(--base03);
}
.sl.v .sl-trk {
  width: var(--h);
  height: var(--sl-v-len);
}
.sl.v .sl-fill {
  inset: auto 0 0 0;
  width: auto;
  height: calc(var(--v) * 100%);
}
.sl.v .sl-cap {
  top: auto;
  left: calc(-1 * var(--proud));
  right: calc(-1 * var(--proud));
  width: auto;
  height: var(--sl-cap);
  bottom: calc(var(--v) * 100% - var(--sl-cap) / 2);
}
.sl.v[style*="--sl-pitch"] .sl-trk::before {
  inset: 0 0 0 50%;
  border-inline: 0;
  border-block: var(--rule-w) var(--rule-s) transparent;
  background: repeating-linear-gradient(
      0deg,
      var(--base02) 0 var(--rule-w),
      transparent 0 var(--sl-pitch)
    )
    border-box;
  background-clip: padding-box;
}

.sl {
  touch-action: none;
}
.sl.sl-numeric > :is(.ro, .dg-val) {
  min-width: calc(var(--t-word-cols) * var(--character));
}

.sl.is-adjusting .sl-cap {
  box-shadow: inset 0 0 0 var(--rule-w) var(--base04);
}
.sl-witness {
  position: absolute;
  z-index: 2;
  pointer-events: none;
  visibility: hidden;
  top: calc(100% + var(--sl-witness-gap));
  left: calc(var(--sl-low, 0) * 100%);
  width: calc(var(--sl-span, 0) * 100%);
  height: 0;
  border-top: var(--rule-w) var(--rule-s) var(--base04);
}
.sl.is-adjusting .sl-witness {
  visibility: visible;
}
.sl-witness::before {
  content: "";
  position: absolute;
  top: calc(-1 * var(--sl-origin-length));
  left: var(--sl-origin-x, 0%);
  width: var(--rule-w);
  height: var(--sl-origin-length);
  background: var(--base04);
}
.sl.v .sl-witness {
  top: auto;
  bottom: calc(var(--sl-low, 0) * 100%);
  left: auto;
  right: calc(100% + var(--sl-witness-gap));
  width: 0;
  height: calc(var(--sl-span, 0) * 100%);
  border: 0;
  border-right: var(--rule-w) var(--rule-s) var(--base04);
}
.sl.v .sl-witness::before {
  top: var(--sl-origin-y, 100%);
  left: auto;
  right: calc(-1 * var(--sl-origin-length));
  width: var(--sl-origin-length);
  height: var(--rule-w);
}

.sl.is-fine .sl-cap::after {
  content: "";
  position: absolute;
  inset: calc(var(--proud) + var(--sl-fine-inset)) var(--sl-fine-inset);
  background: linear-gradient(
      transparent calc(50% - var(--rule-w) / 2),
      var(--base00) 0 calc(50% + var(--rule-w) / 2),
      transparent 0
    )
    center / 100% var(--sl-fine-pitch);
  pointer-events: none;
}
.sl.v.is-fine .sl-cap::after {
  inset: var(--sl-fine-inset) calc(var(--proud) + var(--sl-fine-inset));
  background: linear-gradient(
      90deg,
      transparent calc(50% - var(--rule-w) / 2),
      var(--base00) 0 calc(50% + var(--rule-w) / 2),
      transparent 0
    )
    center / var(--sl-fine-pitch) 100%;
}

.sl > :is(.ro, .dg-val) {
  position: relative;
}

.sl-edit {
  position: absolute;
  inset: calc(-1 * var(--rule-w))
    calc(calc(-1 * var(--edit-gutter)) - var(--rule-w));
  z-index: 3;
  display: none;
  visibility: visible;
  align-items: center;
  justify-items: end;
}
.sl.sl-editing .sl-edit {
  display: grid;
}
.sl.sl-editing > :is(.ro, .dg-val) {
  visibility: hidden;
}
.sl-edit .field {
  width: 100%;
  height: 100%;
  padding: 0 var(--edit-gutter);
}
.sl-edit:is(:focus-within, .is-focus) .field {
  --mk-show: block;
  --mk-ink: var(--base07);
  z-index: 2;
}
.sl-edit .field.invalid {
  border-color: var(--base08);
  --mk-ink: var(--base08);
}
.sl-edit .finput {
  width: 100%;
  text-align: right;
}

.prog {
  --v: 0;
  --h: var(--prog-h);
  --ink: var(--base05);
  display: flex;
  align-items: center;
  gap: calc(2rem / 3);
}
.prog-plate {
  flex: 1;
  height: var(--h);
}
.prog-plate > i {
  display: block;
  height: 100%;
  width: calc(var(--v) * 100%);
  background: var(--ink);
}
.prog.unknown .prog-plate > i {
  display: none;
}
.prog .lbl {
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
  text-transform: var(--case);
}
.prog .ro {
  min-width: calc(var(--prog-readout-cols) * var(--character));
  font-size: inherit;
}
.prog.dg-cold {
  --ink: var(--base02);
}
.prog.dg-warn {
  --ink: var(--base0A);
}
.prog.dg-crit {
  --ink: var(--base08);
}
.prog.dg-ok {
  --ink: var(--base0B);
}
.prog:is(.dg-cold, .dg-crit) .ro {
  color: var(--base03);
}


.mtr {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;

  grid-template-rows: var(--mtr-h) auto;
  grid-template-areas: "lane num" "scale .";
  column-gap: 1rem;
  row-gap: calc(1rem / 6);
}
.mtr-lane {
  grid-area: lane;
  height: var(--mtr-h);
}
.mtr-lane > i {
  position: absolute;
  top: 0;
  bottom: 0;
}
.mtr-lane > .ok {
  left: 0;
  background: var(--base0B);
}
.mtr-lane > .hot {
  background: var(--base0A);
}

.mtr-lane > :is(.pk, .lt) {
  top: calc(-1 * var(--mtr-tick-proud));
  bottom: calc(-1 * var(--mtr-tick-proud));
  width: var(--mtr-tick-w);
  border-inline: var(--rule-w) var(--rule-s) var(--base00);
  transform: translateX(-50%);
}
.mtr-lane > .pk {
  background: var(--base07);
}
.mtr-lane > .lt {
  background: var(--base08);
}

.mtr > .ro {
  grid-area: num;
  align-self: center;
  min-width: calc(var(--prog-readout-cols) * var(--character));
  text-box: trim-both cap alphabetic;
}
.mtr-scale {
  grid-area: scale;
  position: relative;
  height: var(--mtr-scale-h);
}
.mtr-scale > u {
  position: absolute;
  top: 0;
  width: var(--rule-w);
  height: .5rem;
  background: var(--base03);
}
.mtr-scale > u.minor {
  height: .25rem;
  background: var(--base02);
}
.mtr-scale > u.w {
  background: var(--base0A);
}
.mtr-scale > u.c {
  background: var(--base08);
}
.mtr-scale > b {
  position: absolute;
  top: calc(2rem / 3);
  transform: translateX(-50%);
  color: var(--base04);
  font-size: var(--fs-label);
  font-weight: var(--fw-base);
}
.mtr-scale > b:first-of-type {
  transform: none;
}
.mtr-scale > b:last-of-type {
  transform: translateX(-100%);
}

.mtr.dg-gone :is(.ok, .hot, .pk) {
  visibility: hidden;
}
.mtr.dg-gone > .ro {
  color: var(--base03);
}
.mtr.dg-stale :is(.ok, .hot) {
  background: var(--dg-hatch);
}

.dwell-edge {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(1rem / 6);
}
.dwell-edge > i {
  display: block;
  height: 100%;
  width: calc(var(--dwell, 1) * 100%);
  background: var(--base03);
}
.dwell-edge.veiled {
  visibility: hidden;
}
:is(.held .dwell-edge, .dwell-edge.dg-warn) > i {
  background: var(--base0A);
}

.field-row {
  position: relative;
  display: flex;
  align-items: stretch;
}
.field-row.dg-cold {
  --edge: var(--base03);
}
.field-row.dg-crit {
  --edge: var(--base08);
}
.field-row.dg-ok {
  --edge: var(--base0B);
}
.field-row:is(:focus-within, .is-focus) .field {
  --mk-show: block;
  --mk-ink: var(--edge, var(--base07));
  z-index: 2;
}
.field-label {
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
  text-transform: var(--case);
}
.field {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--field-gap);
  min-width: 0;

  --gut: .5rem;
  padding: var(--pad-y) var(--gut);
  background: var(--base00);
  border: var(--line);
  border-color: var(--edge, var(--base02));
}

.field.fit {
  flex: 0 0 auto;
}
.finput {
  flex: 1;
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--base05);
  background: none;
  font: inherit;
  caret-color: var(--base07);
}
.finput::placeholder {
  color: var(--base03);
}
.finput.n6 {
  flex: 0 0 calc(var(--numeric-cols) * var(--character));
  text-align: right;
}
.finput.w8 {
  flex: 0 0 calc(var(--hex-cols) * var(--character));
}

.pinbox {
  display: flex;
  gap: var(--pin-gap);
  outline: 0;
}
.pinbox i {
  width: var(--character);
  height: var(--leading);
  border: var(--rule-w) var(--rule-s) var(--base02);
}
.pinbox i.fill {
  border-color: var(--base05);
  background: var(--base05);
}
.pinbox:focus i.next,
.is-focus .pinbox i.next {
  border-color: var(--base05);
}
.dg-crit .pinbox i {
  border-color: var(--base08);
}
.dg-crit .pinbox i.fill {
  border-color: var(--base08);
  background: var(--base08);
}
.finput.secret {
  min-height: var(--secret-height);
  display: flex;
  align-items: center;
  overflow: hidden;
  color: var(--base07);
  font-size: var(--fs-readout);
  line-height: 1;
  letter-spacing: var(--ls-caps);
  white-space: nowrap;
}
.bcaret {
  display: inline-block;
  flex: none;
  width: var(--character);
  height: var(--secret-height);
  background: var(--base07);
}

.ftoken {
  color: var(--base04);
}

:is(.ftoken.mode, .token) {
  padding: 0 var(--edit-gutter);
  color: var(--base00);
  background: var(--base07);
}
.funit {
  padding-left: var(--field-gap);
  border-left: var(--line);
  color: var(--base04);
}
.fcount {
  margin-left: auto;
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
}
.fcount.zero {
  color: var(--base08);
}

.field .ghost-wrap {
  flex: 1;
  display: flex;
  min-width: 0;
  cursor: text;
}
.field .ghost-wrap .finput {
  flex: none;
  min-width: var(--character);
  field-sizing: content;
}
.field .ghost {
  color: var(--base02);
}
.field .finput.prefix {
  color: var(--base05);
}
.field .finput.full {
  color: var(--base0B);
}
.field + .btn {
  margin-left: calc(-1 * var(--rule-w));
}

.field + .field {
  margin-left: calc(2rem / 3);
}

.field.flush {
  border-width: 0 0 var(--rule-w);
}

.fmeta {
  display: flex;
  gap: var(--fmeta-gap);
  min-height: var(--fmeta-height);
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
}


.tog {
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  cursor: pointer;
  text-align: left;
  --mk-inset: 0;
}
span.tog {
  cursor: default;
}
.t-stamp {
  display: flex;
  align-items: center;
  gap: var(--t-stamp-gap);
  width: 100%;
  padding: .25rem var(--t-pad-x);
}
.t-stamp .t-label {
  font-size: var(--fs-readout);
}
.t-stamp.inline {
  width: auto;
  padding-inline: 0;
}
.t-stamp.inline .t-label {
  font-size: inherit;
}
.t-label {
  margin-inline-end: auto;
  color: var(--base05);
}
.t-word {
  position: relative;
  display: grid;
  place-items: center;
  width: calc(var(--t-word-cols) * var(--character));
  height: var(--t-word-h);
  border: var(--rule-w) var(--rule-s) var(--base03);
  color: var(--base04);
  font-size: var(--fs-readout);
  font-weight: var(--fw-bold);

  --mk-inset: calc(-1 * var(--rule-w));
  --mk: round(calc(var(--t-word-h) * var(--focus-height-ratio)), var(--dp));
}
.t-word.active {
  --mk-inset: 0;
  --mk-ink: var(--base00);
}
.tog.t-stamp::after {
  display: none;
}
.t-stamp:is(:focus-visible, .is-focus) .t-word {
  --mk-show: block;
}

.t-row {
  display: flex;
  align-items: center;
  gap: calc(2rem / 3);
  width: 100%;
  padding: calc(var(--t-row-pad-y) + (var(--line-box) - var(--cap-height)) / 2)
    var(--t-pad-x);
}
.t-row > :is(.t-label, .t-count) {
  text-box: trim-both cap alphabetic;
}
.t-count {
  margin-inline-start: auto;
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
}
.t-box {
  position: relative;
  flex: none;
  /* The box is a fraction of the row's text; an input's own font is the UA's. */
  font: inherit;
  width: var(--box);
  height: var(--box);
  border: var(--rule-w) var(--rule-s) var(--base03);
}
.t-box.mixed::before,
input.t-box[type="checkbox"]:indeterminate::before {
  content: "";
  position: absolute;
  inset: calc(50% - var(--rule-w)) calc(1rem / 6);
  background: var(--base07);
}

.t-group {
  display: grid;
  width: 100%;
  align-content: start;
}

.t-group.one .t-row::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--t-pad-x) + var(--box) / 2 - var(--rule-w) / 2);
  width: var(--rule-w);
  background: var(--base03);
}

.ldg.t-group > .ldg-row > .t-row {
  align-self: stretch;
  padding-block: 0;
  --t-pad-x: 0px;
}
.t-group.one > .t-row:first-child::before,
.t-group.one > .ldg-row:nth-child(1 of .ldg-row) > .t-row::before {
  top: calc(50% - var(--cap-height) / 2);
}
.t-group.one > .t-row:last-child::before,
.t-group.one > .ldg-row:nth-last-child(1 of .ldg-row) > .t-row::before {
  bottom: calc(50% - var(--cap-height) / 2);
}

.t-group.one .t-row:is(:focus-visible, .is-focus)::before {
  display: none;
}
.t-group.one .t-box:not(.active, .on, .is-fail) {
  border-color: transparent;
}
:is(.t-word, .t-box).active {
  border-color: var(--base07);
  background: var(--base07);
  color: var(--base00);
}
:is(.t-word, .t-box).on {
  border-color: var(--base0A);
  color: var(--base0A);
}
:is(.t-word, .t-box).is-fail {
  border-color: var(--base08);
  color: var(--base08);
}
.tog:is(:disabled, .is-disabled) {
  cursor: default;
}
.tog:is(:disabled, .is-disabled) :is(.t-label, .t-count) {
  color: var(--base03);
}
.tog:is(:disabled, .is-disabled) :is(.t-word, .t-box) {
  border-color: var(--base02);
  color: var(--base03);
}
.tog:is(:disabled, .is-disabled) :is(.t-word, .t-box).active {
  background: var(--base02);
}
.tog:is(:disabled, .is-disabled) .t-box.mixed::before,
input.t-box:disabled:is(.mixed, [type="checkbox"]:indeterminate)::before {
  background: var(--base02);
}

.fl-pane {
  display: flex;
  flex-direction: column;
  border: var(--line);
  background: var(--base01);
}
.fl-pane.active {
  border-color: var(--base07);
}
.fl-title {
  display: flex;
  gap: var(--character);
  padding: .5rem;
  border-bottom: var(--line);
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
  text-transform: var(--case);
  user-select: none;
}
.fl-pane.active > .fl-title {
  background: var(--base07);
  border-color: var(--base07);
  color: var(--base00);
}
.fl-pane > .t-group {
  flex: 1;
  padding: .25rem 0;
}
.fl-head {
  display: flex;
  align-items: center;
  gap: calc(2rem / 3);
  padding: calc(.25rem + (var(--line-box) - var(--cap-height)) / 2) .5rem;
  border-bottom: var(--line);
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
  text-transform: var(--case);
}
.fl-head > span {
  text-box: trim-both cap alphabetic;
}
.fl-head .t-box {
  visibility: hidden;
}

.ldg {
  display: grid;
  grid-template-columns: var(--ldg-cols);
  column-gap: var(--ldg-gap, var(--ldg-gap));
  align-content: start;
  height: var(--ldg-h, auto);
  overflow: hidden auto;
  color: var(--base05);
  background: var(--base00);
}
.ldg-head,
.ldg-row,
.ldg-foot {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 1 / -1;
  align-items: center;
  padding-inline: var(--ldg-pad-x, var(--character));
}
.ldg-row {
  position: relative;
  min-height: var(--ldg-row-h);
}
button.ldg-row {
  margin: 0;
  border: 0;
  border-radius: 0;
  padding-block: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
button.ldg-row:disabled {
  cursor: default;
}

button.ldg-row.is-press {
  background: var(--base07);
  color: var(--base00);
}
button.ldg-row.is-press > * {
  color: inherit;
}
.ldg-head,
.ldg-foot {
  position: sticky;
  z-index: 3;
  background: var(--base00);
}
.ldg-head {
  top: 0;
  height: var(--ldg-head-h);
  border-bottom: var(--line);
  color: var(--base04);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
  text-transform: var(--case);
  white-space: nowrap;
}

.ldg-head > * {
  text-box: trim-both cap alphabetic;
}
.ldg-foot {
  bottom: 0;
  min-height: calc(13rem / 6);
  border-top: var(--line);
  color: var(--base04);
}
.ldg-row.now {
  color: var(--base07);
  font-weight: var(--fw-bold);
}

.ldg-head [data-col] {
  cursor: pointer;
}
.ldg-head [data-col]:hover,
.ldg-head .sorted {
  color: var(--base07);
}
.ldg-empty {
  grid-column: 1 / -1;
  padding: calc(2rem / 3) var(--ldg-pad-x, var(--character));
  color: var(--base04);
}

:is(.ldg-row, .t-row, .mk).sel,
.t-row:is(:focus-visible, .is-focus) {
  --mk-show: block;
  --mk-inset: 0;
}

.att-neck {
  position: absolute;
  z-index: 8;
  background: var(--base00);
  border-inline: var(--rule-w) var(--rule-s) var(--base04);
  pointer-events: none;
}
.att-neck::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: var(--rule-w);
  background: var(--base00);
}

.rhythm {
  position: relative;
  padding: var(--rhythm) calc(var(--rhythm) * 1);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.sz-label {
  font-size: var(--fs-label);
  line-height: var(--lh-label);
}

.sz-body {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.sz-readout {
  font-size: var(--fs-readout);
  line-height: var(--lh-readout);
}

.sz-display {
  font-size: var(--fs-display);
  line-height: var(--lh-display);
}

.sz-title {
  font-size: var(--fs-title);
  line-height: var(--lh-title);
}

.spec-h {
  margin: 0 0 var(--rhythm);
  color: var(--base07);
  font-weight: var(--fw-bold);
}

.spec-body {
  margin: 0;
  max-width: 100%;
}

.m-num {
  display: grid;
  justify-items: center;
  gap: .5rem;
}

.m-num .ro {
  font-size: var(--fs-display);
  line-height: 1;
}

.m-num .ro.dg-warn {
  color: var(--base0A);
}

.m-num .ro.dg-crit {
  color: var(--base08);
}

.m-num.dg-gone .ro {
  color: var(--base03);
}

.mm {
  display: flex;
  gap: 1.5rem;
  color: var(--base03);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
}

.mm b {
  color: var(--base04);
  font-weight: var(--fw-base);
}

.mm b.dg-crit {
  color: var(--base08);
}

.m-num.dg-stale .ro {
  position: relative;
}

.m-num.dg-stale .ro::after {
  content: "";
  position: absolute;

  right: 0;
  width: calc(3 * var(--character));
  bottom: var(--dg-rule-offset);
  height: calc(1rem / 6);
  background: var(--dg-hatch);
}

.vu {
  display: grid;
  grid-template-columns: var(--ldg-gap) 1fr;
  gap: .5rem calc(5rem / 6);
  align-items: start;
}

.chl {
  color: var(--base03);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-caps);
  line-height: calc(2rem / 3);
}

.ldg.rules1 > .ldg-row.grp-end {
  border-bottom: var(--line);
}

.ldg.rules2 > .ldg-foot {
  border-top: 0;
}

.ldg.dens2 > .ldg-row {
  align-self: start;
  min-height: 0;
  padding-block: calc(1rem / 3);
}

.ldg .meta {
  display: none;
}

.ldg.dens2 .meta {
  display: block;
  grid-row: 2;
  grid-column: 3 / -1;
  color: var(--base04);
  font-size: var(--fs-label);

  text-box: trim-both cap alphabetic;
}


.ldg-row.unread {
  background: var(--base01);
}


.ldg-row.dim > span,
.ldg-row.dim .num {
  color: var(--base03);
}

.ldg-row.struck > span {
  color: var(--base03);
  text-decoration: line-through;
}

.ldg-row:is(.dim, .struck) .mtr-lane > .ok {
  background: var(--base02);
}

.divide {
  position: relative;
  display: grid;
  grid-template-columns: var(--divide-cols, repeat(3, minmax(0, 1fr)));
}
.divide > :not(.r2-divider) {
  min-width: 0;
}

input.finput.secret {
  display: block;
}
.field[data-clip] {
  isolation: isolate;
}
.ldg-head button {
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  text-align: inherit;
  cursor: pointer;
}

:root {
  --dg-hatch: repeating-linear-gradient(
    135deg,
    var(--base04) 0 calc(1rem / 6),
    transparent calc(1rem / 6) var(--dg-hatch-pitch)
  );
}

/* Intrinsic metrics are shared tokens. Native controls keep keyboard, IME and autofill behavior. */
:where(.ic:not(svg)) {
  display: inline-block;
  width: var(--ic-size);
  height: var(--ic-size);
  flex: none;
  vertical-align: var(--ic-baseline);
  background: currentColor;
  mask: var(--icon) center / contain no-repeat;
}
.btn .ic {
  width: var(--ic-button-size);
  height: var(--ic-button-size);
}
:is(.ic.dg-ok) {
  color: var(--base0B);
}
:is(.ic.dg-warn) {
  color: var(--base0A);
}
:is(.ic.dg-crit) {
  color: var(--base08);
}
:is(.ic.disabled, .ic.is-disabled) {
  color: var(--base03);
}
.secret-wrap,
.pinbox {
  position: relative;
}
.secret-wrap {
  flex: 1;
  min-width: 0;
}
.secret-native,
.pin-native {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: text;
}
.secret-wrap .secret {
  pointer-events: none;
}
.secret-wrap:not(:focus-within) .bcaret {
  visibility: hidden;
}
.pinbox:focus-within i.next {
  border-color: var(--base05);
}
.clip-overlay {
  position: absolute;
  pointer-events: none;
  background: var(--base04);
  mask: var(--clip-mask) 0 0 / 100% 100% no-repeat;
  visibility: hidden;
}
.clip-overlay[style*="--clip-mask"] {
  visibility: inherit;
}
.divide.is-stacked {
  grid-template-columns: minmax(0, 1fr);
}
.divide.is-stacked > .r2-divider {
  display: none;
}
.ldg.rules1 > [data-group-end] {
  border-bottom: var(--line);
}

/* Native controls own interaction; these rules only supply the visual skin. */
input.sl {
  appearance: none;
  display: inline-block;
  width: var(--sl-len);
  min-width: 0;
  height: var(--sl-h);
  margin: 0;
  padding: 0;
  border: var(--line);
  border-radius: 0;
  --sl-fill-direction: to right;
  background: linear-gradient(var(--sl-fill-direction), var(--ink) 0 calc(var(--v) * 100%), var(--base01) 0);
  color: var(--base07);
  accent-color: var(--base07);
}
input.sl:not(.v):dir(rtl) {
  --sl-fill-direction: to left;
}
input.sl::-webkit-slider-runnable-track {
  height: 100%;
  background: transparent;
}
input.sl::-webkit-slider-thumb {
  appearance: none;
  inline-size: var(--sl-cap);
  block-size: calc(var(--sl-h) - 2 * var(--rule-w) + 2 * var(--proud));
  margin-block-start: calc(-1 * var(--proud));
  border: 0;
  border-radius: 0;
  background: currentColor;
}
input.sl::-moz-range-track {
  background: transparent;
}
input.sl::-moz-range-thumb {
  inline-size: var(--sl-cap);
  block-size: calc(var(--sl-h) - 2 * var(--rule-w) + 2 * var(--proud));
  border: 0;
  border-radius: 0;
  background: currentColor;
}
input.sl.v {
  writing-mode: vertical-lr;
  direction: rtl;
  width: var(--sl-h);
  height: var(--sl-v-len);
  --sl-fill-direction: to top;
}
input.sl:disabled {
  --ink: var(--base03);
  color: var(--base03);
}
input.sl:focus-visible {
  outline: var(--mk-w) var(--rule-s) var(--mk-ink);
  outline-offset: calc(-1 * var(--mk-inset) - var(--mk-w));
}
.finput:disabled {
  color: var(--base03);
}
.t-group.one .t-row:has(> input:disabled)::before {
  background: var(--base02);
}
.t-group.one .t-row:has(> input:focus-visible)::before {
  display: none;
}
.tog.mk > input.t-box:focus-visible {
  outline: none;
}
.btn > input:is([type="radio"], [type="checkbox"]) {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: inherit;
}
.btn:has(> input:focus-visible) { outline: none; --mk-show: block; }
input.t-word {
  appearance: none;
  margin: 0;
  font-family: inherit;
  background: none;
  outline: none;
  cursor: inherit;
}
input.t-word::before { content: "OFF"; }
input.t-word:checked::before { content: "ON"; }
input.t-word[data-word]::before { content: attr(data-word); }
input.t-word:checked:not(.on, .is-fail, :disabled) {
  border-color: var(--base07);
  background: var(--base07);
  color: var(--base00);
  --mk-inset: 0;
  --mk-ink: var(--base00);
}
input.t-word:focus-visible { --mk-show: block; }
input.t-word:disabled { border-color: var(--base02); color: var(--base03); }
input.t-word:disabled:checked { background: var(--base02); }
input.t-box {
  appearance: none;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: none;
  cursor: inherit;
}
input.t-box:checked {
  background: var(--base07);
  border-color: var(--base07);
}
input.t-box:disabled {
  border-color: var(--base02);
}
input.t-box:disabled:checked {
  background: var(--base02);
}
.tog:has(> input:disabled) {
  cursor: default;
}
.tog:has(> input:disabled) :is(.t-label, .t-count) {
  color: var(--base03);
}
.tog:has(input:focus-visible) {
  --mk-show: block;
}
.field:focus-within {
  --mk-show: block;
  --mk-ink: var(--edge, var(--base07));
}


:root {
 color-scheme:light; --bg:#f5f0e6; --panel:#ebe6dc; --line:#d0ccc2; --ink:#17150f; --muted:#504d45;
 --base00:var(--bg); --base01:var(--panel); --base02:var(--line); --base03:#aaa69d; --base04:var(--muted); --base05:var(--ink); --base06:var(--ink); --base07:var(--ink);
 --series-1:#00578c; --series-2:#8a3a33; --series-3:#276627; --series-4:#725909; --series-5:#6a4586; --series-6:#006b69; --series-7:#995023;
 --dem:var(--series-1); --rep:var(--series-2); --ribbon-ink:#f5f0e6;
 font-family:"Public Sans",system-ui,sans-serif; font-size:16px; font-variant-numeric:tabular-nums;
}
@media(prefers-color-scheme:dark){:root{color-scheme:dark;--bg:#14100d;--panel:#27221d;--line:#4f4841;--ink:#f4ebd6;--muted:#aaa195;--base03:#7d756c;--series-1:#73bbff;--series-2:#ff998e;--series-3:#8bcd82;--series-4:#ddb857;--series-5:#c5a3e6;--series-6:#73cfca;--series-7:#efa46f;--ribbon-ink:#14100d}}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);line-height:1.6}.wrap{max-width:1280px;margin:auto;padding-inline:24px}.top{border-bottom:1px solid var(--ink)}.top .wrap{padding-block:32px 24px}h1{font-size:clamp(1.8rem,4vw,3.2rem);line-height:1.2;letter-spacing:-.035em;margin:0 0 16px}h1 .vs{font-weight:400;color:var(--muted)}.deck{max-width:850px;margin:0 0 24px}.controls{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center}.status,.export{font-size:.8rem;color:var(--muted)}a{color:inherit}.export{padding:8px}.btn{cursor:pointer}.btn:disabled{cursor:progress;opacity:.6}main.wrap{padding-top:32px}.card{border-bottom:1px solid var(--ink);padding-bottom:24px;margin-bottom:32px}.card-head h2{font-size:1rem;text-transform:uppercase;letter-spacing:.05em;margin:0 0 8px}.sub{font-size:.85rem;color:var(--muted);max-width:960px;margin:0 0 18px}.footnote,.foot{font-size:.78rem;color:var(--muted);line-height:1.65}.footnote{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}code{font:inherit;color:var(--ink)}.legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,max-content));gap:8px}.chip{display:grid;grid-template-columns:20px auto;gap:8px;align-items:center;font-size:.8rem;border:1px solid var(--ink);padding:8px 10px;background:var(--panel);color:var(--ink);cursor:pointer}.chip:hover{background:var(--line)}.chip.off,.chip.off:hover{background:var(--bg);border-style:dashed;color:var(--muted)}.chip.off .swatch{opacity:.25}.swatch{height:3px;width:20px}.encoding{font-size:.75rem;color:var(--muted);line-height:1.9}.sample{display:inline-block;width:22px;border-top:2px solid var(--ink);vertical-align:middle;margin-inline:8px 4px}.sample.dashed{border-top-style:dashed}.ring{display:inline-block;border:1.5px solid var(--ink);width:7px;height:7px;border-radius:50%;margin-inline:8px 4px}.chart{position:relative;overflow-x:auto}.chart svg{display:block;width:100%;min-width:1000px;height:auto}.tip{position:absolute;pointer-events:none;background:var(--bg);border:1px solid var(--ink);padding:10px;font-size:.75rem;opacity:0;z-index:5}.tip b{display:block}.tip .row{display:grid;grid-template-columns:auto auto;gap:16px}.elections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.epanel{background:var(--panel);border-top:2px solid var(--ink);padding:16px}.epanel h3{margin:0;font-size:1rem}.epanel .meta,.med,.empty{color:var(--muted);font-size:.75rem}.epanel svg{display:block;width:100%;height:auto}.empty{padding:24px 0}.findings{margin-top:24px;border-top:1px solid var(--line);padding-top:16px}.findings h3{font-size:1rem;margin:0 0 8px}.findings ul{font-size:.85rem;padding-left:20px}.findings li{margin-bottom:8px}.coverage{overflow-x:auto}.coverage table{width:100%;border-collapse:collapse;font-size:.8rem;white-space:nowrap}.coverage th,.coverage td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left}.coverage th{text-transform:uppercase;font-size:.7rem;letter-spacing:.06em;color:var(--muted)}.coverage .num{text-align:right}.foot{padding-bottom:32px}.skip{position:absolute;top:-100px;background:var(--bg);padding:12px;z-index:10}.skip:focus{top:0}:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@media(max-width:700px){.wrap{padding-inline:16px}.controls{grid-template-columns:auto 1fr}.status{grid-row:2;grid-column:1/-1;overflow-wrap:anywhere}.export{justify-self:end}.elections{grid-template-columns:1fr}.top .wrap{padding-block:24px}.legend{grid-template-columns:repeat(2,minmax(0,1fr))}.chip{font-size:.75rem}.chart:before{content:"Scroll chart horizontally →";display:block;font-size:.75rem;color:var(--muted);margin-bottom:8px}}