.ds-button {
  --ds-button-bg: var(--seeto-action-primary-bg);
  --ds-button-border: var(--ds-button-bg);
  --ds-button-color: var(--seeto-action-primary-text);
  --ds-button-height: var(--seeto-button-height-medium);
  --ds-button-padding-x: var(--seeto-button-padding-x-medium);
  align-items: center;
  appearance: none;
  background: var(--ds-button-bg);
  border: 1px solid var(--ds-button-border);
  border-radius: var(--seeto-radius-pill);
  color: var(--ds-button-color);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--seeto-font-card-extended);
  font-size: var(--seeto-type-label-size);
  font-weight: 600;
  gap: var(--seeto-space-4);
  min-block-size: var(--ds-button-height);
  justify-content: center;
  letter-spacing: 0;
  line-height: var(--seeto-type-label-line);
  padding: 0 var(--ds-button-padding-x);
  text-decoration: none;
  touch-action: manipulation;
  transition:
    background-color var(--seeto-motion-fast) ease,
    border-color var(--seeto-motion-fast) ease,
    color var(--seeto-motion-fast) ease,
    opacity var(--seeto-motion-fast) ease,
    transform var(--seeto-motion-fast) var(--seeto-motion-ease-standard);
  user-select: none;
  white-space: nowrap;
}

.ds-button:hover {
  --ds-button-bg: var(--seeto-action-primary-bg-hover);
}

.ds-button:active {
  --ds-button-bg: var(--seeto-action-primary-bg-active);
  transform: scale(0.98);
}

.ds-button:focus-visible,
.ds-icon-button:focus-visible,
.ds-chip:focus-visible,
.ds-input:focus-visible,
.ds-card-link:focus-visible {
  outline: var(--seeto-border-width-2) solid var(--seeto-focus-ring);
  outline-offset: 3px;
}

.ds-button[aria-disabled="true"],
.ds-button:disabled {
  --ds-button-bg: var(--seeto-action-disabled-bg);
  --ds-button-border: var(--seeto-action-disabled-bg);
  --ds-button-color: var(--seeto-action-disabled-text);
  cursor: not-allowed;
  opacity: var(--seeto-action-disabled-opacity);
  pointer-events: none;
}

.ds-button[data-variant="secondary"] {
  --ds-button-bg: var(--seeto-action-secondary-bg);
  --ds-button-border: var(--seeto-border-default);
  --ds-button-color: var(--seeto-action-secondary-text);
}

.ds-button[data-variant="ghost"] {
  --ds-button-bg: transparent;
  --ds-button-border: var(--seeto-border-default);
  --ds-button-color: var(--seeto-text-primary);
}

.ds-button[data-variant="alt"] {
  --ds-button-bg: var(--seeto-action-alt-bg);
  --ds-button-border: var(--seeto-action-alt-bg);
  --ds-button-color: var(--seeto-action-alt-text);
}

.ds-button[data-size="small"] {
  --ds-button-height: var(--seeto-button-height-small);
  --ds-button-padding-x: var(--seeto-button-padding-x-small);
  font-size: 13px;
}

.ds-button[data-size="large"] {
  --ds-button-height: var(--seeto-button-height-large);
  --ds-button-padding-x: var(--seeto-button-padding-x-large);
}

.ds-icon-button {
  --ds-icon-button-bg: rgba(10, 10, 11, 0.08);
  --ds-icon-button-border: var(--seeto-border-default);
  --ds-icon-button-color: var(--seeto-icon-primary);
  align-items: center;
  appearance: none;
  backdrop-filter: blur(var(--seeto-blur-glass-md));
  background: var(--ds-icon-button-bg);
  border: 1px solid var(--ds-icon-button-border);
  border-radius: var(--seeto-radius-6);
  color: var(--ds-icon-button-color);
  cursor: pointer;
  display: inline-flex;
  inline-size: var(--ds-icon-button-size, 46px);
  block-size: var(--ds-icon-button-size, 46px);
  justify-content: center;
  padding: 0;
  touch-action: manipulation;
}

.ds-icon-button[data-size="small"] {
  --ds-icon-button-size: 40px;
}

.ds-chip {
  --ds-chip-bg: var(--seeto-chip-bg);
  --ds-chip-border: var(--seeto-chip-border);
  --ds-chip-color: var(--seeto-chip-text);
  align-items: center;
  background: var(--ds-chip-bg);
  border: 1px solid var(--ds-chip-border);
  border-radius: var(--seeto-radius-pill);
  color: var(--ds-chip-color);
  display: inline-flex;
  font-family: var(--seeto-font-card);
  font-size: var(--seeto-type-body-small-size);
  font-weight: 500;
  gap: var(--seeto-space-3);
  line-height: 16px;
  min-block-size: 32px;
  padding: 4px 10px;
  white-space: nowrap;
}

.ds-chip[aria-current="true"],
.ds-chip[data-state="active"] {
  --ds-chip-bg: var(--seeto-chip-active-bg);
  --ds-chip-border: var(--seeto-chip-active-bg);
  --ds-chip-color: var(--seeto-chip-active-text);
}

.ds-badge {
  --ds-badge-bg: var(--seeto-color-accent-rose);
  --ds-badge-color: var(--seeto-text-primary);
  align-items: center;
  background: var(--ds-badge-bg);
  border-radius: var(--seeto-radius-pill);
  color: var(--ds-badge-color);
  display: inline-flex;
  font-family: var(--seeto-font-card);
  font-size: var(--seeto-type-caption-size);
  font-weight: 500;
  gap: var(--seeto-space-2);
  line-height: var(--seeto-type-caption-line);
  min-block-size: 24px;
  padding: 4px 8px;
}

.ds-badge[data-tone="event"] {
  --ds-badge-bg: var(--seeto-color-accent-rose);
}

.ds-badge[data-tone="place"],
.ds-badge[data-tone="booking"] {
  --ds-badge-bg: var(--seeto-color-accent-sand);
  --ds-badge-color: var(--seeto-text-on-warm);
}

.ds-badge[data-tone="collection"],
.ds-badge[data-tone="today"] {
  --ds-badge-bg: var(--seeto-color-state-success);
  --ds-badge-color: var(--seeto-text-on-warm);
}

.ds-field {
  display: grid;
  gap: var(--seeto-space-3);
}

.ds-label {
  color: var(--seeto-text-secondary);
  font-family: var(--seeto-font-card);
  font-size: var(--seeto-type-body-small-size);
  line-height: var(--seeto-type-body-small-line);
}

.ds-input {
  background: var(--seeto-input-bg);
  border: 1px solid var(--seeto-input-border);
  border-radius: var(--seeto-radius-4);
  color: var(--seeto-input-text);
  font: 500 var(--seeto-type-body-small-size) / var(--seeto-type-body-small-line) var(--seeto-font-card);
  min-block-size: 44px;
  padding: 0 var(--seeto-space-6);
}

.ds-input::placeholder {
  color: var(--seeto-input-placeholder);
}

.ds-input:focus {
  border-color: var(--seeto-input-focus);
}

.ds-helper-text {
  color: var(--seeto-text-tertiary);
  font-family: var(--seeto-font-card);
  font-size: var(--seeto-type-caption-size);
  line-height: var(--seeto-type-caption-line);
  margin: 0;
}

.ds-card {
  background: var(--ds-card-bg, var(--seeto-bg-card-default));
  border: 1px solid var(--ds-card-border, var(--seeto-border-soft));
  border-radius: var(--ds-card-radius, var(--seeto-card-radius));
  box-shadow: var(--ds-card-shadow, var(--seeto-card-shadow));
  color: var(--ds-card-color, var(--seeto-text-primary));
  overflow: hidden;
  position: relative;
}

.ds-card-link {
  color: inherit;
  display: block;
  text-decoration: none;
}

.ds-event-card {
  --ds-event-card-accent: var(--seeto-color-warm-gray);
  --ds-event-card-accent-rgb: 146, 136, 125;
  --ds-event-card-accent-strong: var(--ds-event-card-accent);
  --ds-event-card-body: rgba(255, 255, 255, 0.8);
  --ds-event-card-footer-bg: var(--ds-event-card-surface);
  --ds-event-card-footer-color: rgba(255, 255, 255, 0.5);
  --ds-event-card-footer-height: 0px;
  --ds-event-card-gradient: linear-gradient(180deg, rgba(var(--ds-event-card-surface-rgb), 0) 0%, rgba(var(--ds-event-card-surface-rgb), 0.9) 38%, var(--ds-event-card-surface) 100%);
  --ds-event-card-surface: #202025;
  --ds-event-card-surface-rgb: 32, 32, 37;
  --ds-event-card-tag: var(--ds-event-card-accent-strong);
  aspect-ratio: 361 / 545;
  background: var(--ds-event-card-surface);
  border-radius: var(--seeto-card-radius);
  box-shadow: var(--seeto-card-shadow);
  color: var(--seeto-text-primary);
  overflow: hidden;
  position: relative;
}

.ds-event-card[data-card-variant="default"] {
  --ds-event-card-accent: #202025;
  --ds-event-card-accent-rgb: 32, 32, 37;
  --ds-event-card-accent-strong: #1c1c20;
  --ds-event-card-footer-height: var(--seeto-card-footer-height);
}

.ds-event-card[data-card-variant="accent-footer"],
.ds-event-card[data-card-variant="accent"] {
  --ds-event-card-footer-bg: var(--ds-event-card-accent);
  --ds-event-card-surface: var(--ds-event-card-accent);
  --ds-event-card-surface-rgb: var(--ds-event-card-accent-rgb);
}

.ds-event-card[data-card-variant="accent-footer"] {
  --ds-event-card-footer-color: rgba(10, 10, 11, 0.5);
  --ds-event-card-footer-height: var(--seeto-card-footer-height);
}

.ds-event-card[data-card-variant="inverted"],
.ds-event-card[data-card-variant="accent-inverted"] {
  --ds-event-card-body: var(--seeto-color-warm-gray);
  --ds-event-card-footer-bg: #ebe0d9;
  --ds-event-card-footer-color: rgba(10, 10, 11, 0.5);
  --ds-event-card-surface: #ebe0d9;
  --ds-event-card-surface-rgb: 235, 224, 217;
  color: var(--seeto-color-warm-graphite);
}

.ds-event-card[data-card-variant="inverted"] {
  --ds-event-card-accent: var(--seeto-color-warm-gray);
  --ds-event-card-accent-rgb: 146, 136, 125;
}

.ds-event-card[data-card-variant="accent-inverted"] {
  --ds-event-card-footer-height: var(--seeto-card-footer-height);
}

.ds-event-card::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.1) 42%, rgba(255, 255, 255, 0) 100%);
  border-radius: inherit;
  content: "";
  inset: 0;
  padding: 1px;
  pointer-events: none;
  position: absolute;
  z-index: 3;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
}

.ds-event-card__image {
  block-size: 100%;
  inline-size: 100%;
  inset: 0;
  object-fit: cover;
  position: absolute;
}

.ds-event-card__shade {
  background: var(--ds-event-card-gradient);
  block-size: var(--seeto-card-content-height);
  inset: auto 0 var(--ds-event-card-footer-height);
  position: absolute;
  z-index: 1;
}

.ds-event-card__content {
  display: grid;
  gap: var(--seeto-space-3);
  inset: auto 76px calc(var(--ds-event-card-footer-height) + var(--seeto-space-12)) var(--seeto-space-12);
  position: absolute;
  z-index: 2;
}

.ds-event-card__kind {
  background: var(--ds-event-card-tag);
  border-radius: var(--seeto-radius-pill);
  color: var(--seeto-text-primary);
  font: 500 14px / 16px var(--seeto-font-card);
  inline-size: fit-content;
  padding: 4px 8px 2px;
}

.ds-event-card__title {
  font-family: var(--seeto-font-display);
  font-size: var(--seeto-type-card-title-size);
  font-weight: 900;
  line-height: var(--seeto-type-card-title-line);
  margin: 0;
  text-transform: uppercase;
}

.ds-event-card__description {
  color: var(--ds-event-card-body);
  font: 500 var(--seeto-type-body-small-size) / 16px var(--seeto-font-card);
  margin: 0;
}

.ds-date-badge {
  align-items: center;
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.2), rgba(10, 10, 11, 0.2)), var(--ds-date-badge-bg, var(--ds-event-card-accent, var(--seeto-color-warm-gray)));
  border-radius: var(--seeto-date-badge-radius);
  color: var(--seeto-text-primary);
  display: inline-flex;
  flex-direction: column;
  inset: var(--seeto-space-12) auto auto var(--seeto-space-12);
  min-inline-size: var(--seeto-date-badge-min-width);
  padding: var(--seeto-date-badge-padding);
  position: absolute;
  z-index: 2;
}

.ds-date-badge strong {
  font-family: var(--seeto-font-card-extended);
  font-size: 24px;
  font-weight: 700;
  line-height: 24px;
}

.ds-date-badge span {
  font-family: var(--seeto-font-card);
  font-size: 10px;
  line-height: 10px;
}

.ds-action-stack {
  display: grid;
  gap: var(--seeto-space-3);
  inset: auto var(--seeto-space-12) calc(var(--ds-event-card-footer-height) + var(--seeto-space-12)) auto;
  position: absolute;
  z-index: 2;
}

.ds-event-card__footer {
  align-items: center;
  background: var(--ds-event-card-footer-bg);
  border-block-start: 1px solid var(--seeto-border-default);
  block-size: var(--seeto-card-footer-height);
  color: var(--ds-event-card-footer-color);
  display: flex;
  gap: var(--seeto-space-6);
  inset: auto 0 0;
  justify-content: space-between;
  padding: var(--seeto-space-12);
  position: absolute;
  z-index: 2;
}

.ds-event-card__footer strong,
.ds-event-card__footer span {
  display: block;
  font-family: var(--seeto-font-card);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ds-event-card__footer strong {
  font-size: 14px;
  line-height: 16px;
}

.ds-event-card__footer span {
  font-size: 12px;
  line-height: 16px;
}

.ds-main-menu {
  align-items: center;
  color: var(--seeto-color-warm-gray);
  display: flex;
  gap: var(--seeto-space-3);
  inline-size: var(--seeto-main-menu-width);
  min-block-size: var(--seeto-main-menu-height);
}

.ds-main-menu__cluster {
  align-items: center;
  backdrop-filter: blur(var(--seeto-blur-glass-sm));
  background: linear-gradient(90deg, rgba(10, 10, 11, 0.7), rgba(10, 10, 11, 0.7)), linear-gradient(0deg, rgba(0, 0, 0, 0.13), rgba(255, 255, 255, 0.13));
  border: 1px solid transparent;
  border-radius: var(--seeto-main-menu-radius);
  box-shadow: var(--seeto-shadow-action);
  display: flex;
  min-block-size: var(--seeto-main-menu-height);
  padding: var(--seeto-space-3) var(--seeto-space-6);
}

.ds-accordion {
  border-block: 1px solid var(--seeto-border-default);
}

.ds-accordion__item + .ds-accordion__item {
  border-block-start: 1px solid var(--seeto-border-default);
}

.ds-accordion__button {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  color: var(--seeto-text-primary);
  cursor: pointer;
  display: flex;
  font: 500 var(--seeto-type-body-base-size) / var(--seeto-type-body-base-line) var(--seeto-font-card);
  inline-size: 100%;
  justify-content: space-between;
  min-block-size: 64px;
  padding: var(--seeto-space-8);
  text-align: start;
}

.ds-accordion__panel {
  color: var(--seeto-text-secondary);
  font: 500 var(--seeto-type-body-base-size) / var(--seeto-type-body-base-line) var(--seeto-font-card);
  padding: 0 var(--seeto-space-8) var(--seeto-space-8);
}

@media (prefers-reduced-motion: reduce) {
  .ds-button,
  .ds-icon-button,
  .ds-chip {
    transition-duration: 1ms;
  }
}