.ds-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ds-s-2);
  border-radius: var(--ds-radius);
  border: 1px solid transparent;
  -webkit-user-select: none;
  user-select: none;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ds-motion), border-color var(--ds-motion), color var(--ds-motion), box-shadow var(--ds-motion), transform var(--ds-motion);
}

.ds-btn__icon {
  flex: none;
  display: block;
  width: var(--ds-s-3);
  height: var(--ds-s-3);
}

.ds-btn--l { height: var(--ds-h-l); padding: 0 var(--ds-s-5); }
.ds-btn--m { height: var(--ds-h-m); padding: 0 var(--ds-s-4); }
.ds-btn--xs { height: var(--ds-h-xs); padding: 0 var(--ds-s-3); }

.ds-btn--fill {
  border-color: var(--ds-accent);
  background: var(--ds-accent-fill);
  color: var(--ds-accent-ink);
}
.ds-btn--fill:hover {
  border-color: var(--ds-ink-1);
  background: var(--ds-ink-1);
  color: var(--ds-page);
}
.ds-btn--fill:focus-visible {
  border-color: var(--ds-accent);
  box-shadow: var(--ds-ring);
}
.ds-btn--fill.ds-btn--glow:focus-visible {
  box-shadow: var(--ds-ring), var(--ds-glow-cta);
}
.ds-btn--fill:active {
  border-color: var(--ds-accent);
  background: var(--ds-accent-55);
  color: var(--ds-accent-ink);
  transform: translateY(1px);
}
.ds-btn--fill:disabled,
.ds-btn--fill[aria-disabled="true"] {
  border-color: var(--ds-line);
  background: transparent;
  color: var(--ds-ink-4);
  cursor: not-allowed;
}

.ds-btn--outline {
  border-color: var(--ds-stroke);
  background: transparent;
  color: var(--ds-ink-2);
}
.ds-btn--outline:hover {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
}
.ds-btn--veil:hover {
  border-color: var(--ds-ink-1);
  background: var(--ds-ink-1);
  color: var(--ds-page);
}
.ds-btn--outline:focus-visible {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
  box-shadow: var(--ds-ring);
}
.ds-btn--veil:hover:focus-visible:not(:active) { color: var(--ds-page); }
.ds-btn--outline:active {
  border-color: var(--ds-accent);
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
  transform: translateY(1px);
}
.ds-btn--outline:disabled,
.ds-btn--outline[aria-disabled="true"] {
  border-color: var(--ds-line);
  background: transparent;
  color: var(--ds-ink-4);
  cursor: not-allowed;
}

.ds-btn--glow { box-shadow: var(--ds-glow-cta); }

.ds-btn--veil {
  border-color: var(--ds-stroke);
  background: var(--ds-veil);
  color: var(--ds-ink-1);
}

.ds-btn--ghost {
  border-color: transparent;
  background: transparent;
  color: var(--ds-ink-3);
}
.ds-btn--ghost:hover {
  color: var(--ds-accent-text);
}
.ds-btn--ghost:focus-visible {
  color: var(--ds-accent-text);
  box-shadow: var(--ds-ring);
}
.ds-btn--ghost:active {
  color: var(--ds-ink-1);
  transform: translateY(1px);
}
.ds-btn--ghost:disabled,
.ds-btn--ghost[aria-disabled="true"] {
  color: var(--ds-ink-4);
  cursor: not-allowed;
}

.ds-field {
  display: block;
  width: 100%;
  height: var(--ds-h-m);
  padding: 0 var(--ds-s-3);
  background: var(--ds-page);
  border: 1px solid var(--ds-stroke);
  border-radius: var(--ds-radius);
  color: var(--ds-ink-1);
  font-family: var(--ds-font-text);
  font-size: var(--ds-t-value);
  transition: background-color var(--ds-motion), border-color var(--ds-motion), color var(--ds-motion), box-shadow var(--ds-motion);
}
.ds-field:hover {
  border-color: var(--ds-ink-4);
}
.ds-field:focus {
  border-color: var(--ds-accent);
  box-shadow: var(--ds-ring);
  outline: none;
}
.ds-field:disabled {
  border-color: var(--ds-line);
  color: var(--ds-ink-4);
  cursor: not-allowed;
}
.ds-affix {
  display: inline-flex;
  align-items: stretch;
  min-width: 0;
  background: var(--ds-page);
  border: 1px solid var(--ds-stroke);
  border-radius: var(--ds-radius);
  transition: border-color var(--ds-motion), box-shadow var(--ds-motion);
}
.ds-affix:hover {
  border-color: var(--ds-ink-4);
}
.ds-affix:focus-within {
  border-color: var(--ds-accent);
  box-shadow: var(--ds-ring);
  outline: none;
}
.ds-affix__input {
  width: var(--ds-grid-min-2xs);
  height: var(--ds-h-xs);
  min-width: 0;
  padding: 0 var(--ds-s-2);
  border: 0;
  background: transparent;
  color: var(--ds-ink-1);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-value);
  letter-spacing: var(--ds-track-value);
  text-align: right;
  -moz-appearance: textfield;
  appearance: textfield;
}
.ds-affix__input:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}
.ds-affix:focus-within .ds-affix__input:focus-visible {
  box-shadow: none;
}
.ds-affix__input::-webkit-outer-spin-button,
.ds-affix__input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
}
.ds-affix__unit {
  display: grid;
  place-items: center;
  height: var(--ds-h-xs);
  min-width: var(--ds-h-xs);
  padding: 0 var(--ds-s-2);
  border-left: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-value);
  color: var(--ds-ink-3);
}
.ds-affix:has(.ds-affix__input:disabled) {
  border-color: var(--ds-line);
}
.ds-affix__input:disabled {
  color: var(--ds-ink-4);
  cursor: not-allowed;
}
.ds-affix:has(.ds-affix__input:disabled) .ds-affix__unit {
  border-left-color: var(--ds-line);
  color: var(--ds-ink-4);
}

.ds-field--mono {
  font-family: var(--ds-font-mono);
  letter-spacing: var(--ds-track-value);
}
.ds-field--error {
  border-color: var(--ds-accent);
}
.ds-field--multiline {
  height: auto;
  padding: var(--ds-s-3);
  resize: vertical;
  line-height: 1.5;
}

.ds-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ds-s-2);
  height: var(--ds-h-xs);
  padding: 0 var(--ds-s-3);
  border: 1px solid var(--ds-stroke);
  border-radius: var(--ds-radius);
  background: transparent;
  color: var(--ds-ink-3);
  -webkit-user-select: none;
  user-select: none;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ds-motion), border-color var(--ds-motion), color var(--ds-motion), box-shadow var(--ds-motion), transform var(--ds-motion);
}
.ds-chip:hover {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
}
.ds-chip:focus-visible {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
  box-shadow: var(--ds-ring);
  outline: none;
}
.ds-chip:active {
  background: var(--ds-accent-14);
  border-color: var(--ds-accent);
  color: var(--ds-ink-1);
  transform: translateY(1px);
}
.ds-chip:disabled,
.ds-chip[aria-disabled="true"] {
  border-color: var(--ds-line);
  color: var(--ds-ink-4);
  cursor: not-allowed;
}
.ds-chip[aria-disabled="true"]:focus-visible {
  border-color: var(--ds-accent);
}

.ds-chip--on,
.ds-chip--on:not(:disabled):not([aria-disabled="true"]):focus-visible,
.ds-chip--on:not(:disabled):not([aria-disabled="true"]):active {
  border-color: var(--ds-accent);
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
}
.ds-chip--on:not(:disabled):not([aria-disabled="true"]):hover {
  border-color: var(--ds-ink-1);
  color: var(--ds-ink-1);
}

.ds-chip--static {
  cursor: default;
}
.ds-chip--static:hover,
.ds-chip--static:focus-visible,
.ds-chip--static:active {
  border-color: var(--ds-stroke);
  color: var(--ds-ink-3);
  background: transparent;
  box-shadow: none;
  transform: none;
  cursor: default;
}
.ds-chip--static.ds-chip--on:hover,
.ds-chip--static.ds-chip--on:focus-visible,
.ds-chip--static.ds-chip--on:active {
  border-color: var(--ds-accent);
  color: var(--ds-ink-1);
  background: var(--ds-accent-14);
}

.ds-chip--wrap {
  height: auto;
  min-height: var(--ds-h-xs);
  padding: var(--ds-s-1) var(--ds-s-3);
  white-space: normal;
  line-height: var(--ds-lh-text);
  text-wrap: pretty;
}

.ds-label {
  display: inline-block;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-accent-text);
  -webkit-user-select: none;
  user-select: none;
}
.ds-label--tight {
  letter-spacing: var(--ds-track-tight);
}

.ds-card {
  display: grid;
  align-content: start;
  gap: var(--ds-s-2);
  width: 100%;
  padding: var(--ds-s-3);
  border-radius: var(--ds-radius);
  transition: background-color var(--ds-motion), border-color var(--ds-motion), box-shadow var(--ds-motion), transform var(--ds-motion);
}

.ds-card--object {
  background: var(--ds-card);
  border: 1px solid var(--ds-line);
}
.ds-card--object:hover {
  border-color: var(--ds-stroke);
  transform: translateY(calc(0px - 1px));
}
.ds-card--object:focus-visible {
  border-color: var(--ds-accent);
  box-shadow: var(--ds-ring);
  outline: none;
}
.ds-card--object:active {
  border-color: var(--ds-accent);
  background: var(--ds-accent-14);
}
.ds-card--object[aria-disabled="true"] {
  border-color: var(--ds-line);
  opacity: .5;
}

.ds-card--quiet {
  background: var(--ds-card);
  border: none;
}
.ds-card--quiet:hover {
  transform: translateY(calc(0px - 1px));
}

.ds-card--accent {
  background: var(--ds-accent-14);
  border: 1px solid var(--ds-accent-30);
}
.ds-card--accent:hover {
  border-color: var(--ds-accent);
  transform: translateY(calc(0px - 1px));
}
.ds-card--accent:focus-visible {
  border-color: var(--ds-accent);
  box-shadow: var(--ds-ring);
  outline: none;
}

.ds-divider {
  display: block;
  width: 100%;
  border: none;
  border-top: 1px solid var(--ds-line);
  margin: 0;
}

.ds-dot {
  display: inline-block;
  flex: none;
  width: calc(var(--ds-s-2) - 1px);
  height: calc(var(--ds-s-2) - 1px);
  border-radius: 50%;
  background: var(--ds-accent);
  animation: var(--ds-anim-blink);
}

.ds-logo__name {
  font-weight: 500;
  letter-spacing: var(--ds-track);
}

.ds-logo__sep {
  color: var(--ds-ink-4);
}

.ds-page {
  position: relative;
  min-height: 100vh;
  max-width: var(--ds-page-max);
  margin: 0 auto;
  background: var(--ds-page);
}

.ds-scanlines {
  position: absolute;
  inset: 0;
  z-index: var(--ds-z-scan);
  pointer-events: none;
  background-image: linear-gradient(var(--ds-scan) 1px, transparent 1px);
  background-size: 100% calc(var(--ds-s-1) - 1px);
}
.ds-scanlines--fixed {
  position: fixed;
  mix-blend-mode: overlay;
}

.ds-stepper {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--ds-stroke);
  border-radius: var(--ds-radius);
}

.ds-stepper__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ds-h-xs);
  height: var(--ds-h-xs);
  border: none;
  background: transparent;
  color: var(--ds-ink-3);
  cursor: pointer;
  transition: background-color var(--ds-motion), color var(--ds-motion);
}
.ds-stepper__btn svg {
  flex: none;
  display: block;
  width: var(--ds-s-3);
  height: var(--ds-s-3);
}
.ds-stepper__btn:hover {
  color: var(--ds-accent-text);
}
.ds-stepper__btn:focus-visible {
  color: var(--ds-accent-text);
  box-shadow: var(--ds-ring);
  outline: none;
}
.ds-stepper__btn:active {
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
}
.ds-stepper__btn:disabled {
  color: var(--ds-ink-4);
  cursor: not-allowed;
}

.ds-stepper__value {
  display: inline-block;
  min-width: var(--ds-grid-min-3xs);
  text-align: center;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-value);
  letter-spacing: var(--ds-track-value);
  color: var(--ds-ink-1);
}

@media (pointer: coarse) {
  .ds-chip {
    min-height: var(--ds-tap);
  }
  .ds-stepper__btn {
    width: var(--ds-tap);
    height: var(--ds-tap);
  }
  .ds-lightbox [data-lightbox-close],
  .ds-lightbox [data-lightbox-prev],
  .ds-lightbox [data-lightbox-next] {
    width: var(--ds-tap);
    height: var(--ds-tap);
  }
  .ds-lightbox [data-lightbox-reset] {
    min-height: var(--ds-tap);
  }
  .ds-progress--lightbox {
    min-height: var(--ds-tap);
  }
  .ds-hit {
    position: relative;
  }
  .ds-hit::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: max(100%, var(--ds-tap));
    height: max(100%, var(--ds-tap));
    transform: translate(-50%, -50%);
  }
}

.ds-uploader {
  display: grid;
  gap: var(--ds-s-2);
  width: 100%;
  padding: var(--ds-s-3);
  border: 1px dashed var(--ds-stroke);
  border-radius: var(--ds-radius);
  background: var(--ds-card);
  cursor: pointer;
  transition: border-color var(--ds-motion), background-color var(--ds-motion), color var(--ds-motion);
}
.ds-uploader:hover,
.ds-uploader:focus-visible {
  border-color: var(--ds-accent-55);
}
.ds-uploader:active {
  background: var(--ds-accent-14);
}
.ds-uploader[aria-disabled="true"] {
  border-color: var(--ds-line);
  cursor: not-allowed;
}
.ds-uploader--filled {
  border-color: var(--ds-accent-55);
}

.ds-uploader__label {
  color: var(--ds-ink-1);
}

.ds-uploader__note {
  font-size: var(--ds-t-small);
  color: var(--ds-ink-3);
}

.ds-uploader__status {
  display: inline-flex;
  align-items: center;
  gap: var(--ds-s-2);
  color: var(--ds-ink-3);
}
.ds-uploader:hover .ds-uploader__status,
.ds-uploader:focus-visible .ds-uploader__status,
.ds-uploader--filled .ds-uploader__status {
  color: var(--ds-accent-text);
}
.ds-uploader[aria-disabled="true"] .ds-uploader__status {
  color: var(--ds-ink-4);
}

.ds-uploader__status svg {
  flex: none;
  display: block;
  width: var(--ds-s-3);
  height: var(--ds-s-3);
}

.ds-uploader-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--ds-uploader-min-w)), 1fr));
  gap: var(--ds-s-2);
  align-items: start;
}

.ds-uploader__tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--ds-tile), 1fr));
  gap: var(--ds-s-2);
}

.ds-uploader__tile {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--ds-stroke);
  background: var(--ds-page);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  color: var(--ds-ink-4);
}

.ds-uploader__tile-remove {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--ds-s-4);
  height: var(--ds-s-4);
  display: grid;
  place-items: center;
  border: none;
  background: var(--ds-page);
  color: var(--ds-ink-2);
  cursor: pointer;
}
.ds-uploader__tile-remove svg {
  flex: none;
  display: block;
  width: var(--ds-s-2);
  height: var(--ds-s-2);
}

.ds-uploader__tile:hover {
  border-color: var(--ds-accent);
}
.ds-uploader__tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ds-file-preview {
  position: fixed;
  z-index: var(--ds-z-overlay);
  display: grid;
  gap: var(--ds-s-2);
  padding: var(--ds-s-2);
  border: 1px solid var(--ds-accent-30);
  background: var(--ds-card);
  box-shadow: var(--ds-shadow-menu);
  pointer-events: none;
}
.ds-file-preview[hidden] {
  display: none;
}
.ds-file-preview img {
  display: block;
  width: var(--ds-file-preview-w);
  max-height: var(--ds-file-preview-max-h);
  object-fit: contain;
}
.ds-file-preview__name {
  max-width: var(--ds-file-preview-w);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-3);
}

.ds-overlay-backdrop {
  display: none;
}
.ds-overlay-backdrop:not([hidden]) {
  display: block;
  position: fixed;
  inset: 0;
  z-index: var(--ds-z-overlay);
  background: var(--ds-veil-strong);
  animation: var(--ds-anim-soft);
}

.ds-drawer {
  display: none;
}
.ds-drawer:not([hidden]) {
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: var(--ds-z-overlay);
  width: var(--ds-drawer-w);
  min-width: var(--ds-panel-min);
  overflow-y: auto;
  background: var(--ds-card);
  border-left: 1px solid var(--ds-stroke);
  animation: var(--ds-anim-soft);
}

.ds-drawer__head {
  position: sticky;
  top: 0;
  z-index: var(--ds-z-header);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  min-height: var(--ds-h-m);
  padding: 0 var(--ds-s-4);
  background: var(--ds-card);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-ink-3);
}

.ds-drawer__body {
  display: grid;
  gap: var(--ds-s-3);
  align-content: start;
  padding: var(--ds-s-4);
  font-size: var(--ds-t-body);
  line-height: var(--ds-lh-text);
  color: var(--ds-ink-3);
}

.ds-steps {
  display: flex;
  gap: calc(var(--ds-s-1) - 1px);
  width: 100%;
}

.ds-steps__mark {
  flex: 1 1 0;
  height: calc(var(--ds-s-1) - 1px);
  background: var(--ds-line);
}
.ds-steps__mark--done {
  background: var(--ds-accent);
}
.ds-steps__mark--current {
  background: var(--ds-accent-55);
}

.ds-formstep {
  display: grid;
  gap: var(--ds-s-2);
  width: 100%;
  padding: var(--ds-s-3);
  border: 1px solid var(--ds-line);
  background: var(--ds-card);
}

.ds-formstep__note {
  max-width: var(--ds-measure);
  font-size: var(--ds-t-small);
  line-height: var(--ds-lh-desc);
  color: var(--ds-ink-3);
  text-wrap: pretty;
}

.ds-formstep__fields {
  display: grid;
  gap: var(--ds-s-3);
}

.ds-fieldtext {
  display: grid;
  gap: var(--ds-s-2);
  min-width: 0;
}
.ds-fieldtext__hint,
.ds-fieldtext__limit {
  max-width: var(--ds-measure);
  font-size: var(--ds-t-small);
  line-height: var(--ds-lh-desc);
  color: var(--ds-ink-3);
  text-wrap: pretty;
}
.ds-fieldtext__row {
  display: flex;
  gap: var(--ds-s-2);
  align-items: stretch;
  min-height: var(--ds-h-m);
}
.ds-fieldtext__row .ds-field {
  flex: 1 1 0;
  min-width: 0;
}
.ds-fieldtext__limit {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
}

.ds-media {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--ds-card);
  border: 1px solid var(--ds-line);
  border-radius: var(--ds-radius);
  transition: background-color var(--ds-motion), border-color var(--ds-motion), box-shadow var(--ds-motion), transform var(--ds-motion);
}
.ds-media:hover {
  border-color: var(--ds-stroke);
  transform: translateY(calc(0px - 1px));
}
.ds-media:focus-visible {
  border-color: var(--ds-accent);
}
.ds-media:active {
  border-color: var(--ds-accent);
  background: var(--ds-accent-14);
}
.ds-media[aria-disabled="true"] {
  border-color: var(--ds-line);
  opacity: .5;
}

.ds-media--feed {
  aspect-ratio: 4 / 3;
}
.ds-media--hero {
  aspect-ratio: 16 / 9;
}
.ds-media--locked {
  aspect-ratio: 4 / 3;
}

.ds-media__bg {
  position: absolute;
  inset: 0;
  background: var(--ds-page);
}

.ds-media__overlay {
  position: absolute;
  inset: 0;
  background: var(--ds-overlay-media);
}

.ds-media__locked {
  position: relative;
  display: grid;
  justify-items: center;
  gap: var(--ds-s-2);
  color: var(--ds-accent-text);
}

.ds-media__locked-icon {
  flex: none;
  display: block;
  width: var(--ds-s-5);
  height: var(--ds-s-5);
}

.ds-media__locked-label {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-2);
}

.ds-media__caption {
  position: absolute;
  left: var(--ds-s-3);
  bottom: var(--ds-s-2);
  display: inline-flex;
  align-items: center;
  gap: var(--ds-s-2);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-2);
}

.ds-media__caption svg {
  flex: none;
  display: block;
  width: var(--ds-s-3);
  height: var(--ds-s-3);
}

.ds-checkbox {
  display: inline-flex;
  align-items: center;
  gap: var(--ds-s-2);
  min-height: var(--ds-h-xs);
  cursor: pointer;
}

.ds-checkbox__input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.ds-checkbox__box {
  flex: none;
  display: grid;
  place-items: center;
  width: calc(var(--ds-s-3) + var(--ds-s-1));
  height: calc(var(--ds-s-3) + var(--ds-s-1));
  border: 1px solid var(--ds-stroke);
  background: var(--ds-page);
  color: transparent;
  transition: background-color var(--ds-motion), border-color var(--ds-motion), color var(--ds-motion);
}
.ds-checkbox__box svg {
  flex: none;
  display: block;
  width: var(--ds-s-3);
  height: var(--ds-s-3);
}

.ds-checkbox__input:checked + .ds-checkbox__box {
  border-color: var(--ds-accent);
  background: var(--ds-accent);
  color: var(--ds-accent-ink);
}
.ds-checkbox__input:focus-visible + .ds-checkbox__box {
  border-color: var(--ds-accent);
  box-shadow: var(--ds-ring);
  outline: none;
}
.ds-checkbox__input:disabled + .ds-checkbox__box {
  border-color: var(--ds-line);
  color: var(--ds-ink-4);
}
.ds-checkbox__input:disabled ~ .ds-checkbox__label {
  color: var(--ds-ink-4);
}

.ds-checkbox__label {
  font-family: var(--ds-font-text);
  font-size: var(--ds-t-small);
  color: var(--ds-ink-2);
}
.ds-checkbox:hover .ds-checkbox__label,
.ds-checkbox__input:checked ~ .ds-checkbox__label {
  color: var(--ds-ink-1);
}

.ds-switch {
  display: inline-flex;
  gap: var(--ds-s-2);
  align-items: flex-start;
}

.ds-switch__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ds-s-2);
  height: var(--ds-h-xs);
  padding: 0 var(--ds-s-3);
  border: 1px solid var(--ds-stroke);
  border-radius: var(--ds-radius);
  background: transparent;
  color: var(--ds-ink-2);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-value);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--ds-motion), border-color var(--ds-motion), color var(--ds-motion), box-shadow var(--ds-motion), transform var(--ds-motion);
}
.ds-switch__trigger svg {
  flex: none;
  display: block;
  width: var(--ds-s-3);
  height: var(--ds-s-3);
}
.ds-switch__trigger:hover,
.ds-switch__trigger:focus-visible {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
}
.ds-switch__trigger:active,
.ds-switch--open .ds-switch__trigger {
  border-color: var(--ds-accent);
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
  transform: translateY(1px);
}

.ds-switch__menu {
  display: grid;
  border: 1px solid var(--ds-stroke);
  border-radius: var(--ds-radius);
  background: var(--ds-card);
}
.ds-switch--currency .ds-switch__menu {
  box-shadow: var(--ds-shadow-menu);
}

.ds-popover {
  display: none;
  gap: var(--ds-s-2);
  padding: var(--ds-s-4);
  border: 1px solid var(--ds-accent-30);
  background: var(--ds-card);
  box-shadow: var(--ds-shadow-menu);
}
.ds-popover:not([hidden]) {
  display: grid;
}

.terms-peni-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-width: var(--ds-h-xs);
  min-height: var(--ds-h-xs);
  border: 1px solid var(--ds-accent-30);
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
  font-family: var(--ds-font-mono);
  cursor: help;
}
.terms-peni-btn:hover,
.terms-peni-btn:focus-visible {
  background: var(--ds-accent);
  color: var(--ds-accent-ink);
}

@media (pointer: coarse) {
  .terms-peni-btn {
    min-width: var(--ds-tap);
    min-height: var(--ds-tap);
  }
}

.terms-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-4);
  min-height: var(--ds-h-l);
  padding: var(--ds-s-3) var(--ds-s-4);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
}

.terms-prefs {
  display: flex;
  align-items: center;
  gap: var(--ds-s-3);
  margin-left: auto;
}

.terms-back {
  display: inline-flex;
  align-items: center;
  min-height: var(--ds-h-xs);
  padding: 0 var(--ds-s-3);
  border: 1px solid var(--ds-stroke);
  color: var(--ds-ink-2);
  white-space: nowrap;
}
.terms-back:hover {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
}

@media (max-width: 520px) {
  .terms-back {
    display: none;
  }
}

.terms-reachbar {
  display: none;
}

@media (max-width: 520px) {
  .terms-reachbar {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--ds-z-header);
    gap: var(--ds-tap-gap);
    padding: var(--ds-s-2) var(--ds-s-3) calc(var(--ds-s-2) + env(safe-area-inset-bottom));
    border-top: 1px solid var(--ds-line);
    background: var(--ds-veil-strong);
    backdrop-filter: blur(var(--ds-blur));
  }
  .terms-reachbar a {
    flex: 1 1 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--ds-tap);
    padding: 0 var(--ds-s-4);
    border: 1px solid var(--ds-stroke);
    font-family: var(--ds-font-mono);
    font-size: var(--ds-t-label);
    letter-spacing: var(--ds-track-tight);
    text-transform: uppercase;
    color: var(--ds-ink-2);
  }
  .terms-reachbar a:hover,
  .terms-reachbar a:focus-visible {
    border-color: var(--ds-accent);
    color: var(--ds-accent-text);
  }
  .terms-reach-spacer {
    height: var(--ds-reach-pad);
  }
}

.ds-switch__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  padding: var(--ds-s-2);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  color: var(--ds-ink-3);
}
.ds-switch__row:last-child {
  border-bottom: none;
}
.ds-switch__row--active {
  color: var(--ds-accent-text);
}

.ds-switch__row-code {
  color: var(--ds-ink-4);
}

.ds-row {
  display: flex;
  align-items: stretch;
  gap: var(--ds-s-2);
  width: 100%;
  min-height: var(--ds-h-m);
}

.ds-linkrow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ds-s-1);
  width: 100%;
}
.ds-linkrow > :last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.ds-kv {
  display: grid;
  width: 100%;
}

.ds-kv__row {
  display: grid;
  grid-template-columns: minmax(0, calc(var(--ds-h-m) * 2 + var(--ds-s-1))) minmax(0, 1fr);
  gap: var(--ds-s-3);
  padding: var(--ds-s-2) 0;
  border-bottom: 1px solid var(--ds-line);
  font-size: var(--ds-t-small);
}

.ds-kv__key {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-accent-text);
}

.ds-kv__value {
  font-family: var(--ds-font-text);
  color: var(--ds-ink-2);
}

@media (max-width: 520px) {
  .ds-kv__row {
    grid-template-columns: 1fr;
    gap: var(--ds-s-1);
    padding: 0;
    border-bottom: none;
    justify-items: start;
  }
  .ds-kv__key {
    color: var(--ds-ink-4);
  }
  .ds-kv__value {
    font-size: var(--ds-t-body);
    line-height: var(--ds-lh-dense);
  }
}

.ds-progress {
  position: relative;
  display: block;
  width: 100%;
  height: var(--ds-h-m);
  border: 1px solid var(--ds-line);
  background: var(--ds-card);
  border-radius: var(--ds-radius);
  overflow: hidden;
  -webkit-user-select: none;
  user-select: none;
}

.ds-progress__fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: var(--ds-progress-pct, 45%);
  background: var(--ds-accent-14);
}

.ds-progress__cursor {
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--ds-progress-pct, 45%);
  width: calc(var(--ds-s-1) / 2);
  background: var(--ds-accent);
}

.ds-progress__labels {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--ds-s-3);
}

.ds-progress__label {
  position: relative;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-4);
}

.ds-progress__label::after,
.commission-tl-track__labels span::after,
.hero-bar__stage::after,
.hero-bar__clock::after {
  content: attr(data-text) / "";
  position: absolute;
  inset: 0;
  color: var(--ds-ink-1);
  clip-path: inset(0 calc(100% - var(--ds-label-fill-pct, 0%)) 0 0);
  pointer-events: none;
}

.ds-progress--lightbox {
  flex: 1 1 var(--ds-grid-min-s);
  min-width: 0;
  min-height: var(--ds-tap);
  height: var(--ds-h-xs);
  cursor: ew-resize;
  touch-action: none;
}

.ds-progress--lightbox[aria-disabled="true"] {
  cursor: not-allowed;
}
.ds-progress--lightbox[aria-disabled="true"] .ds-progress__fill,
.ds-progress--lightbox[aria-disabled="true"] .ds-progress__cursor {
  background: var(--ds-line);
}

.ds-overlay-backdrop--veil:not([hidden]) {
  background: var(--ds-veil);
}
.ds-overlay-backdrop--full:not([hidden]) {
  background: var(--ds-veil-full);
}

.ds-overlay-head {
  position: sticky;
  top: 0;
  z-index: var(--ds-z-header);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  min-width: 0;
  min-height: var(--ds-h-m);
  padding: 0 var(--ds-s-4);
  background: var(--ds-card);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-ink-3);
}

.ds-overlay-head__actions {
  display: inline-flex;
  align-items: center;
  gap: var(--ds-s-3);
  white-space: nowrap;
}

.ds-overlay-head__title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ds-ink-1);
}

.ds-overlay-head--lightbox {
  border: 1px solid var(--ds-line);
}

.ds-sheet {
  display: none;
}
.ds-sheet:not([hidden]) {
  display: grid;
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(var(--ds-tap) + var(--ds-s-5));
  z-index: var(--ds-z-overlay);
  border-top: 1px solid var(--ds-stroke);
  background: var(--ds-card);
  box-shadow: var(--ds-shadow-menu);
  animation: var(--ds-anim-soft);
}

.ds-sheet__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  min-height: var(--ds-tap);
  padding: 0 var(--ds-s-4);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-2);
}
.ds-sheet__item--active {
  color: var(--ds-accent-text);
}

.ds-sheet__item-no {
  color: var(--ds-ink-4);
}

.ds-sheet__bar {
  display: flex;
  gap: var(--ds-tap-gap);
  padding: var(--ds-s-2);
  background: var(--ds-veil-strong);
}

.ds-splash {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  border: 1px solid var(--ds-stroke);
  background: var(--ds-card);
  border-radius: var(--ds-radius);
}

.ds-splash__body {
  display: grid;
  gap: var(--ds-s-2);
  align-content: center;
  padding: var(--ds-s-3);
  border-left: 1px solid var(--ds-line);
}

.ds-splash-overlay {
  display: none;
  -webkit-user-select: none;
  user-select: none;
}
.ds-splash-overlay:not([hidden]) {
  display: flex;
  position: fixed;
  inset: 0;
  z-index: var(--ds-z-overlay);
  flex-wrap: wrap;
  align-items: stretch;
  overflow: auto;
  background: var(--ds-page);
}

.ds-splash-overlay__art {
  position: relative;
  flex: 1 1 52%;
  min-width: var(--ds-splash-art-min-w);
  min-height: var(--ds-splash-art-min-h);
  overflow: hidden;
}

.ds-splash-overlay__art-layer {
  position: absolute;
  inset: 0;
  background-color: var(--ds-splash-accent, var(--ds-card));
  background-image: linear-gradient(var(--ds-veil-strong), var(--ds-veil-strong));
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.ds-splash-overlay__art-layer--blur {
  filter: blur(var(--ds-blur-up));
}

.ds-splash-overlay__art-layer--full {
  opacity: 0;
  transition: opacity var(--ds-motion-crossfade);
}
.ds-splash-overlay__art-layer--full.is-ready {
  opacity: 1;
}

.ds-splash-overlay__scrim {
  position: absolute;
  inset: 0;
  background: var(--ds-splash-scrim);
}

.ds-splash-overlay__logo {
  position: absolute;
  top: var(--ds-splash-logo-top);
  left: var(--ds-splash-logo-x);
  display: flex;
  align-items: center;
  gap: var(--ds-s-3);
  font-family: var(--ds-font-text);
  font-size: var(--ds-t-body);
  font-weight: 700;
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-ink-1);
}

.ds-splash-overlay__stub {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  padding-top: calc(var(--ds-splash-art-floor) + var(--ds-s-3));
}

.ds-splash-overlay__stub[hidden] {
  display: none;
}

.ds-splash-overlay__stub > span {
  padding: var(--ds-s-2) var(--ds-s-3);
  border: 1px solid var(--ds-line);
  background: var(--ds-card);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-4);
}

.ds-splash-overlay__body {
  flex: 1 1 var(--ds-splash-text-min-w);
  min-width: 0;
  display: grid;
  align-content: center;
  gap: var(--ds-s-4);
  padding: var(--ds-s-6);
  border-left: 1px solid var(--ds-line);
}

.ds-splash-overlay__kicker {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-accent-text);
}

.ds-splash-overlay__hint {
  margin: 0;
  font-family: var(--ds-font-text);
  font-size: var(--ds-t-lead);
  font-weight: 300;
  line-height: var(--ds-lh-lead);
  color: var(--ds-ink-1);
  text-wrap: pretty;
  animation: var(--ds-anim-soft);
}

.ds-splash-overlay__progress .ds-progress__label {
  color: var(--ds-ink-3);
}
.ds-splash-overlay__progress .ds-progress__label--value {
  color: var(--ds-ink-2);
}

.ds-promo-chips {
  display: grid;
  gap: var(--ds-s-2);
  animation: var(--ds-anim-soft);
}

.ds-promo-chips__kicker {
  display: flex;
  align-items: center;
  gap: var(--ds-s-2);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-accent-text);
}

.ds-promo-chips__note {
  font-size: var(--ds-t-small);
  line-height: var(--ds-lh-desc);
  color: var(--ds-ink-2);
  text-wrap: pretty;
}

.ds-promo-chips__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ds-tap-gap);
}

.ds-promo-chip {
  gap: var(--ds-s-2);
  min-height: var(--ds-tap);
  font-size: var(--ds-t-value);
}
.ds-promo-chips:has(.ds-promo-chip:disabled) .ds-promo-chips__kicker,
.ds-promo-chips:has(.ds-promo-chip:disabled) .ds-promo-chips__note {
  color: var(--ds-ink-4);
}
.ds-promo-chips:has(.ds-promo-chip:disabled) .ds-dot {
  display: none;
}

.ds-promo {
  display: grid;
  gap: var(--ds-s-2);
  padding: var(--ds-s-4);
  border: 1px dashed var(--ds-accent-55);
  background: var(--ds-accent-14);
  transition: background-color var(--ds-motion), border-color var(--ds-motion), opacity var(--ds-motion), visibility var(--ds-motion);
}
.ds-promo[aria-disabled="true"] {
  visibility: hidden;
  opacity: 0;
}
.ds-promo:hover,
.ds-promo:focus-visible {
  border-style: solid;
  background: var(--ds-accent-30);
}

.ds-promo-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-ink-1);
}

.ds-promo-state {
  display: flex;
  align-items: center;
  gap: var(--ds-s-2);
}

.ds-promo-period {
  color: var(--ds-ink-3);
}

.ds-promo-title {
  font-size: var(--ds-t-h3);
  font-weight: 700;
  letter-spacing: calc(var(--ds-track-title) * -1);
  color: var(--ds-ink-1);
}

.ds-promo-blurb {
  font-size: var(--ds-t-small);
  line-height: var(--ds-lh-desc);
  color: var(--ds-ink-2);
  text-wrap: pretty;
}

.ds-promo-cta {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-1);
}

.ds-splash-overlay__build {
  position: fixed;
  right: var(--ds-s-3);
  bottom: var(--ds-s-3);
  pointer-events: none;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-caption);
  letter-spacing: var(--ds-track-tight);
  color: var(--ds-ink-4);
}

.ds-splash-overlay__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-4);
}

.ds-splash-overlay__skip {
  flex: none;
  opacity: 0;
  pointer-events: none;
}
.ds-splash-overlay__skip.is-visible {
  opacity: 1;
  pointer-events: auto;
  animation: var(--ds-anim-soft);
}

@media (max-width: 520px) {
  .ds-splash-overlay:not([hidden]) {
    display: grid;
    grid-template-rows: minmax(var(--ds-splash-art-floor), 1fr) auto;
  }
  .ds-splash-overlay__art {
    min-height: 0;
  }
  .ds-splash-overlay__foot {
    flex-direction: column;
    align-items: stretch;
  }
  .ds-splash-overlay__skip {
    width: 100%;
    min-height: var(--ds-tap);
  }
}

@media (max-width: 520px) and (max-height: 790px), (orientation: landscape) and (max-height: 640px) {
  .ds-splash-overlay:not([hidden]) {
    grid-template-rows: 1fr;
    padding-bottom: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px + env(safe-area-inset-bottom));
    scroll-padding-bottom: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px + env(safe-area-inset-bottom));
  }
  .ds-splash-overlay__art {
    display: none;
  }
  .ds-splash-overlay__foot {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--ds-z-header);
    flex-wrap: nowrap;
    gap: var(--ds-tap-gap);
    padding: var(--ds-s-2) var(--ds-s-3) calc(var(--ds-s-2) + env(safe-area-inset-bottom));
    border-top: 1px solid var(--ds-line);
    background: var(--ds-veil-strong);
  }
  .ds-splash-overlay__skip {
    flex: 1 1 auto;
    min-height: var(--ds-tap);
  }
  .ds-splash-overlay__build {
    position: static;
    justify-self: end;
  }
}

.ds-lightbox {
  display: none;
}
.ds-lightbox:not([hidden]) {
  display: grid;
  position: fixed;
  inset: 0;
  z-index: var(--ds-z-overlay);
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: var(--ds-s-3);
  padding: var(--ds-s-4) var(--ds-s-5);
  background: var(--ds-veil-strong);
  animation: var(--ds-anim-soft);
}

.ds-lightbox__stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  min-height: 0;
}

.ds-lightbox__zoombox {
  position: relative;
  display: grid;
  place-items: safe center;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  touch-action: none;
  cursor: zoom-in;
}
.ds-lightbox__zoombox--zoomed {
  overflow: auto;
  cursor: grab;
}
.ds-lightbox__zoombox--locked {
  cursor: default;
}

.ds-lightbox__loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--ds-s-2);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-4);
}

.ds-lightbox__zoombox img.is-loading {
  visibility: hidden;
}

.ds-lightbox__zoombox img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-width: 100%;
  object-fit: contain;
  user-select: none;
}
.ds-lightbox__zoombox--zoomed img {
  max-width: none;
  height: auto;
}

.ds-lightbox__zoombox .is-locked {
  filter: var(--ds-lightbox-lock-filter);
  transform: scale(var(--ds-lightbox-lock-scale));
}

[data-soft-blur] .ds-lightbox__zoombox .is-locked {
  filter: var(--ds-lightbox-lock-filter-soft);
}

.ds-lightbox__lock {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}
.ds-lightbox__lock .ds-media__locked {
  padding: var(--ds-s-3) var(--ds-s-4);
  background: var(--ds-veil-full);
}

.ds-lightbox__bottom {
  display: grid;
  gap: var(--ds-s-3);
}

.ds-lightbox__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ds-s-4);
  padding: var(--ds-s-3);
  border: 1px solid var(--ds-stroke);
  background: var(--ds-card);
}

.ds-lightbox__nav {
  display: flex;
  align-items: center;
  gap: var(--ds-s-1);
  flex: none;
}

.ds-lightbox__nav .ds-btn {
  background: var(--ds-veil);
}

.ds-lightbox__zoom-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ds-s-3);
  flex: 1 1 var(--ds-grid-min-s);
  min-width: 0;
}

.ds-lightbox__zoom-caption {
  flex: none;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-3);
}

.ds-lightbox__zoom-group--off,
.ds-lightbox__hint--off {
  visibility: hidden;
}

@media (max-width: 899px) {
  .ds-lightbox__zoom-group--off,
  .ds-lightbox__hint--off {
    display: none;
  }
}

.ds-lightbox__hint {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-4);
}

.ds-lightbox__swipe-hint {
  position: absolute;
  inset-block-end: var(--ds-s-3);
  justify-self: center;
  padding: var(--ds-s-2) var(--ds-s-3);
  background: var(--ds-veil-full);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-1);
  white-space: nowrap;
  pointer-events: none;
  animation: var(--ds-anim-soft);
}

@media (hover: none) and (pointer: coarse) {
  .ds-lightbox__controls:not(:focus-within) {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .ds-lightbox__zoom-group,
  .ds-lightbox__hint {
    display: none;
  }
}


.ds-lightbox__footer {
  display: grid;
  gap: var(--ds-s-2);
}

.ds-lightbox__links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ds-s-2);
}

.ds-lightbox__links > :last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

@media (min-width: 520px) {
  .ds-lightbox__links {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
  }

  .ds-lightbox__links > :last-child {
    grid-column: auto;
  }
}

.ds-lightbox__platform {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  min-height: var(--ds-h-m);
  padding: 0 var(--ds-s-2);
  border: 1px solid var(--ds-accent);
  background: var(--ds-accent-fill);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-accent-ink);
  transition: background-color var(--ds-motion), border-color var(--ds-motion), color var(--ds-motion), box-shadow var(--ds-motion);
}

.ds-lightbox__platform-text {
  display: block;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ds-lightbox__platform:hover,
.ds-lightbox__platform:focus-visible {
  background: transparent;
  color: var(--ds-accent-text);
}

.ds-lightbox__platform:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}

.ds-message {
  display: grid;
  gap: var(--ds-s-2);
  width: 100%;
  padding: var(--ds-s-3);
  border-left: calc(var(--ds-s-1) / 2) solid var(--ds-stroke);
  background: var(--ds-soft);
}
.ds-message--warning,
.ds-message--error {
  border-left-color: var(--ds-accent);
  background: var(--ds-accent-14);
}
.ds-message__label {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-3);
}
.ds-message--warning .ds-message__label,
.ds-message--error .ds-message__label {
  color: var(--ds-ink-1);
}
.ds-message__text {
  font-size: var(--ds-t-small);
  line-height: var(--ds-lh-text);
  color: var(--ds-ink-2);
}
.ds-message--warning .ds-message__text,
.ds-message--error .ds-message__text {
  color: var(--ds-ink-1);
}
.ds-message__actions {
  display: flex;
  gap: var(--ds-s-2);
}
.ds-message--toast {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: var(--ds-z-overlay);
  width: auto;
  padding: var(--ds-s-3) max(var(--ds-s-4), calc((100% - var(--ds-measure)) / 2)) calc(var(--ds-s-3) + env(safe-area-inset-bottom));
  border-left: none;
  border-top: calc(var(--ds-s-1) / 2) solid var(--ds-accent);
  background: var(--ds-card);
  box-shadow: var(--ds-shadow-menu);
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: var(--ds-s-3);
  font-size: var(--ds-t-small);
  animation: var(--ds-anim-soft);
}
.ds-message--toast .ds-message__label {
  grid-column: 1 / -1;
}
@media (max-width: 520px) {
  .ds-message--toast {
    grid-template-columns: minmax(0, 1fr);
  }
  .ds-message--toast .ds-message__actions {
    flex-wrap: wrap;
  }
  .ds-message--toast .ds-message__actions > * {
    flex: 1 1 auto;
  }
}

.ds-kicker {
  display: flex;
  justify-content: space-between;
  gap: var(--ds-s-3);
  width: 100%;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
  color: var(--ds-ink-2);
  -webkit-user-select: none;
  user-select: none;
}
.ds-kicker--tight {
  letter-spacing: var(--ds-track-tight);
}
.ds-kicker__code {
  color: var(--ds-ink-4);
}

.ds-counter {
  display: grid;
  gap: var(--ds-s-2);
}
.ds-counter .ds-kicker {
  color: var(--ds-ink-1);
}
.ds-counter__value {
  font-size: var(--ds-t-h3);
  font-weight: 700;
  letter-spacing: calc(var(--ds-track-display) * -1);
  color: var(--ds-ink-1);
}

.ds-empty {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-4);
}

.ds-card--own {
  border-color: var(--ds-accent-30);
}

.ds-price-row {
  display: flex;
  justify-content: space-between;
  gap: var(--ds-s-3);
  padding: var(--ds-s-2) 0;
  border-bottom: 1px solid var(--ds-line);
}
.ds-price-row__label {
  font-size: var(--ds-t-value);
  color: var(--ds-ink-1);
}
.ds-price-row__value {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-value);
  letter-spacing: var(--ds-track-value);
  color: var(--ds-accent-text);
}

.ds-price-estimate,
.ds-price-formula {
  display: grid;
  gap: var(--ds-s-2);
  width: 100%;
  padding: var(--ds-s-3);
  background: var(--ds-accent-14);
  border: 1px solid var(--ds-accent-30);
}
.ds-price-estimate__label,
.ds-price-formula__label {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-1);
}
.ds-price-estimate__value {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-h3);
  letter-spacing: var(--ds-track-value);
  color: var(--ds-ink-1);
}
.ds-price-formula__value {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-value);
  letter-spacing: var(--ds-track-value);
  color: var(--ds-ink-1);
}
.ds-price-estimate__note,
.ds-price-formula__note {
  font-size: var(--ds-t-small);
  line-height: var(--ds-lh-desc);
  color: var(--ds-ink-3);
}

.ds-callout {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: var(--ds-s-3);
  width: 100%;
  padding: var(--ds-s-4);
  text-align: center;
  border: 1px dashed var(--ds-accent-55);
  background: var(--ds-accent-14);
  transition: transform var(--ds-motion), border-color var(--ds-motion), opacity var(--ds-motion);
  cursor: pointer;
}
.ds-callout:hover {
  transform: translateY(calc(0px - 1px));
}
.ds-callout:focus-visible {
  border-color: var(--ds-accent);
}
.ds-callout[aria-disabled="true"] {
  opacity: .5;
  cursor: not-allowed;
}
.ds-callout--muted {
  border-color: var(--ds-stroke);
  background: var(--ds-soft);
}
.ds-callout__icon {
  display: grid;
  place-items: center;
  width: var(--ds-h-m);
  height: var(--ds-h-m);
  border: 1px solid var(--ds-accent-55);
  color: var(--ds-accent-text);
}
.ds-callout--muted .ds-callout__icon {
  border-color: var(--ds-stroke);
  color: var(--ds-ink-2);
}
.ds-callout__text {
  font-family: var(--ds-font-text);
  font-size: var(--ds-t-body);
  color: var(--ds-ink-1);
}
.ds-callout__action {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-1);
}
.ds-callout--muted .ds-callout__action {
  color: var(--ds-ink-3);
}

.contacts-list {
  display: grid;
  border-top: 1px solid var(--ds-line);
}

.contacts-row {
  display: grid;
  grid-template-columns: var(--ds-contacts-no-w) 1fr auto;
  gap: var(--ds-s-4);
  align-items: center;
  min-height: var(--ds-h-l);
  padding: 0 var(--ds-s-1);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-value);
  letter-spacing: var(--ds-track-value);
  color: var(--ds-ink-1);
  transition: background-color var(--ds-motion), color var(--ds-motion), box-shadow var(--ds-motion);
}

.contacts-row:hover,
.contacts-row:focus-visible {
  background: var(--ds-soft);
  color: var(--ds-ink-1);
}

.contacts-row:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}

.contacts-row__no {
  color: var(--ds-ink-4);
}

.contacts-row__label {
  letter-spacing: var(--ds-track);
  text-transform: uppercase;
}

.contacts-row__mark {
  color: var(--ds-ink-3);
}

.contacts-mail {
  display: inline-flex;
  align-items: center;
  min-height: var(--ds-h-m);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-h3);
  letter-spacing: var(--ds-track-value);
  color: var(--ds-ink-1);
}

.contacts-mail:hover,
.contacts-mail:focus-visible {
  color: var(--ds-accent-text);
}
.contacts-mail:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}

.paid-strip__links {
  display: grid;
  flex: 1 1 var(--ds-grid-min-lx);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--ds-grid-min-1xs)), 1fr));
  gap: var(--ds-tap-gap);
  min-width: 0;
}

.paid-strip__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: var(--ds-h-m);
  padding: 0 var(--ds-s-2);
  border: 1px solid var(--ds-accent);
  background: var(--ds-accent-fill);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-accent-ink);
  transition: background-color var(--ds-motion), color var(--ds-motion), box-shadow var(--ds-motion);
}

.paid-strip__link-text {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.paid-strip__link:hover,
.paid-strip__link:focus-visible {
  background: transparent;
  color: var(--ds-accent-text);
}

.paid-strip__link:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}

.terms-column {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  max-width: var(--ds-terms-max);
  margin: 0 auto;
  width: 100%;
}

.terms-item {
  display: grid;
  grid-template-columns: var(--ds-s-6) minmax(0, 1fr);
  gap: var(--ds-s-4);
  padding: var(--ds-s-5) 0;
  border-top: 1px solid var(--ds-line);
}

.terms-item__no {
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-value-s);
  letter-spacing: var(--ds-track-tight);
  color: var(--ds-accent-text);
}

.terms-item__body {
  display: grid;
  gap: var(--ds-s-3);
}

.terms-item__forget { justify-self: start; }

.terms-item__title {
  margin: 0;
  font-size: var(--ds-t-h3);
  font-weight: 600;
  letter-spacing: calc(var(--ds-track-title) * -1);
}

.terms-item__text {
  display: grid;
  gap: var(--ds-s-3);
  max-width: var(--ds-measure);
  font-size: var(--ds-t-body);
  line-height: var(--ds-lh-text);
  color: var(--ds-ink-2);
  text-wrap: pretty;
}

.terms-item__text > * {
  margin: 0;
}

.prefs {
  display: flex;
  align-items: center;
  gap: var(--ds-s-3);
}

.prefs__item {
  position: relative;
  display: flex;
  align-items: center;
}

.prefs__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--ds-s-2);
  min-height: var(--ds-h-xs);
  padding: 0 var(--ds-s-3);
  border: 1px solid var(--ds-stroke);
  background: transparent;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-value);
  color: var(--ds-ink-2);
  white-space: nowrap;
  cursor: pointer;
}
.prefs__btn svg {
  flex: none;
  display: block;
}
.prefs__btn:hover,
.prefs__btn:focus-visible {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
}
.prefs__btn:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}
.prefs__btn[aria-expanded="true"] {
  border-color: var(--ds-accent);
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
}

.prefs__menu {
  position: absolute;
  top: calc(100% + var(--ds-s-2));
  right: 0;
  z-index: var(--ds-z-scan);
  display: none;
  width: max-content;
  border: 1px solid var(--ds-stroke);
  background: var(--ds-card);
  box-shadow: var(--ds-shadow-menu);
}
.prefs__menu:not([hidden]) {
  display: grid;
}
.prefs__menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  min-height: var(--ds-h-xs);
  padding: 0 var(--ds-s-3);
  border-bottom: 1px solid var(--ds-line);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-value);
  text-transform: none;
  color: var(--ds-ink-2);
}
.prefs__menu a:hover,
.prefs__menu a:focus-visible {
  background: var(--ds-soft);
  color: var(--ds-accent-text);
}
.prefs__menu a:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}
.prefs__menu a[aria-current="true"] {
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
}
.prefs__code {
  color: var(--ds-ink-4);
}

.prefs__sheet,
.prefs__backdrop {
  display: none;
}

.prefs__tap {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--ds-tap);
  min-width: var(--ds-tap);
  padding: 0 var(--ds-s-3);
  border: 1px solid var(--ds-stroke);
  background: transparent;
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-value);
  text-transform: uppercase;
  color: var(--ds-ink-2);
  cursor: pointer;
}
.prefs__tap:hover,
.prefs__tap:focus-visible {
  border-color: var(--ds-accent);
  color: var(--ds-accent-text);
}
.prefs__tap:focus-visible {
  box-shadow: var(--ds-ring);
  outline: none;
}
.prefs__tap[aria-expanded="true"] {
  border-color: var(--ds-accent);
  background: var(--ds-accent-14);
  color: var(--ds-ink-1);
}

@media (pointer: coarse) {
  .prefs__menu a {
    min-height: var(--ds-tap);
  }
}

@media (max-width: 520px) {
  .prefs {
    display: none;
  }

  .prefs__backdrop:not([hidden]) {
    display: block;
    position: fixed;
    inset: 0;
    z-index: var(--ds-z-header);
    background: var(--ds-veil);
  }

  .prefs__sheet:not([hidden]) {
    display: grid;
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(var(--ds-tap) + var(--ds-s-5));
    z-index: var(--ds-z-header);
    border-top: 1px solid var(--ds-stroke);
    background: var(--ds-card);
    box-shadow: var(--ds-shadow-menu);
    animation: var(--ds-anim-soft);
  }
  .prefs__sheet a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ds-s-3);
    min-height: var(--ds-tap);
    padding: 0 var(--ds-s-4);
    border-bottom: 1px solid var(--ds-line);
    font-family: var(--ds-font-mono);
    font-size: var(--ds-t-label);
    letter-spacing: var(--ds-track-value);
    color: var(--ds-ink-1);
  }
  .prefs__sheet a:hover,
  .prefs__sheet a:focus-visible {
    background: var(--ds-soft);
    color: var(--ds-accent-text);
  }
  .prefs__sheet a:focus-visible {
    box-shadow: var(--ds-ring);
    outline: none;
  }
  .prefs__sheet a[aria-current="true"] {
    background: var(--ds-accent-14);
    color: var(--ds-ink-1);
  }
}

@media (orientation: landscape) and (max-height: 640px) {
  .ds-drawer:not([hidden]) {
    width: 100%;
    min-width: 100%;
  }

  .prefs {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--ds-tap-gap);
  }

  .prefs__btn {
    writing-mode: vertical-rl;
    justify-content: center;
    width: 100%;
    min-height: var(--ds-tap);
    padding: var(--ds-s-2) 0;
  }

  .prefs__menu {
    top: auto;
    bottom: 0;
    right: calc(100% + var(--ds-s-2));
  }

  .ds-page {
    padding-left: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px);
    padding-right: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px);
  }

  .terms-header {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: var(--ds-z-header);
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-end;
    gap: var(--ds-tap-gap);
    width: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px);
    min-height: 0;
    padding: var(--ds-s-2);
    border-bottom: 0;
    border-left: 1px solid var(--ds-line);
    background: var(--ds-veil-strong);
  }

  .terms-logo {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: var(--ds-z-header);
    writing-mode: vertical-rl;
    width: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px);
    padding: var(--ds-s-2) 0;
    border-right: 1px solid var(--ds-line);
    background: var(--ds-veil-strong);
  }

  .terms-back {
    writing-mode: vertical-rl;
    justify-content: center;
    width: 100%;
    min-height: var(--ds-tap);
    padding: var(--ds-s-2) 0;
  }

  .terms-prefs {
    flex-direction: column;
    align-items: stretch;
    gap: var(--ds-tap-gap);
    margin-left: 0;
  }
}

.ds-btn,
.ds-chip,
.ds-label,
.ds-stepper__btn,
.ds-switch__trigger,
.ds-progress__label,
.ds-message__label,
.ds-steps__mark,
.commission-tl-btn,
.prefs,
.prefs__sheet,
.prefs__tap {
  -webkit-user-select: none;
  user-select: none;
}

.cookie-notice {
  z-index: var(--ds-z-header);
  padding-inline: max(var(--ds-s-4), env(safe-area-inset-left)) max(var(--ds-s-4), env(safe-area-inset-right));
  grid-template-columns: minmax(0, var(--ds-measure)) auto;
  justify-content: space-between;
}
.ds-page:has([data-nav-panel]:not([data-nav-panel="tl"]):not([hidden]), [data-splash]:not([hidden]), [data-lightbox]:not([hidden])) .cookie-notice {
  display: none;
}

@media (max-width: 520px) {
  .cookie-notice {
    grid-template-columns: minmax(0, 1fr);
    bottom: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px + env(safe-area-inset-bottom));
    padding-bottom: var(--ds-s-3);
  }
}

@media (orientation: landscape) and (max-height: 640px) {
  .cookie-notice {
    left: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px);
    right: calc(var(--ds-tap) + var(--ds-s-2) * 2 + 1px);
  }
}

.pay-methods {
  grid-template-columns: 1fr;
}

@media (min-width: 520px) {
  .pay-methods {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--ds-grid-min-xs)), 1fr));
  }
}

footer {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ds-s-3);
  min-height: var(--ds-h-l);
  padding: var(--ds-s-4);
  border-top: 1px solid var(--ds-line);
  background: var(--ds-page);
  font-family: var(--ds-font-mono);
  font-size: var(--ds-t-label);
  letter-spacing: var(--ds-track-tight);
  text-transform: uppercase;
  color: var(--ds-ink-4);
  text-align: center;
}

@media (min-width: 520px) {
  footer {
    flex-direction: row;
    flex-wrap: wrap;
    text-align: start;
  }
}

footer a {
  color: var(--ds-ink-3);
}