/* COSMO8 First 888 — proposal-only campaign surface. */
:root {
  --campaign-navy: #171b3f;
  --campaign-navy-deep: #0e112b;
  --campaign-navy-soft: #20264f;
  --campaign-pink: #c4356a;
  --campaign-pink-bright: #e85d8f;
  --campaign-lavender: #7d68b5;
  --campaign-ink: #171b3f;
  --campaign-paper: #f8f7fb;
  --campaign-white: #ffffff;
  --campaign-muted: #c9cbd8;
  --campaign-muted-dark: #72758a;
  --campaign-line: rgba(255, 255, 255, 0.18);
  --campaign-line-dark: #dddce6;
  --campaign-success: #7fd2ad;
  --campaign-danger: #ff9fba;
  --campaign-warning: #f1cf86;
  --campaign-focus: #ffffff;
  --campaign-body: Arial, "Noto Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --campaign-radius-sm: 12px;
  --campaign-radius-md: 20px;
  --campaign-radius-lg: 32px;
  --campaign-pill: 999px;
  --campaign-shadow: 0 28px 80px rgba(5, 7, 24, 0.34);
  --campaign-page-x: clamp(18px, 5vw, 72px);
  --campaign-content: 1120px;
  --campaign-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html {
  min-width: 280px;
  color-scheme: dark;
  background: var(--campaign-navy);
}

body.campaign-page {
  min-height: 100svh;
  margin: 0;
  overflow-x: hidden;
  color: var(--campaign-white);
  background:
    radial-gradient(circle at 82% 12%, rgba(125, 104, 181, 0.18), transparent 28rem),
    radial-gradient(circle at 4% 92%, rgba(196, 53, 106, 0.12), transparent 30rem),
    var(--campaign-navy);
  font-family: var(--campaign-body);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

body.campaign-page.is-light {
  color: var(--campaign-ink);
  background:
    radial-gradient(circle at 82% 12%, rgba(125, 104, 181, 0.1), transparent 28rem),
    var(--campaign-paper);
}

button, input, select { font: inherit; }
button, select { cursor: pointer; touch-action: manipulation; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p, figure, fieldset { margin: 0; }
fieldset { min-width: 0; padding: 0; border: 0; }
[hidden] { display: none !important; }

::selection { color: var(--campaign-white); background: var(--campaign-pink); }

:focus-visible {
  outline: 3px solid var(--campaign-focus);
  outline-offset: 4px;
}

.campaign-skip {
  position: fixed;
  z-index: 1000;
  top: 10px;
  left: 12px;
  min-height: 44px;
  padding: 11px 16px;
  border-radius: var(--campaign-pill);
  color: var(--campaign-navy);
  background: var(--campaign-white);
  transform: translateY(-160%);
  transition: transform 160ms ease;
}

.campaign-skip:focus { transform: translateY(0); }

.proposal-strip {
  position: relative;
  z-index: 20;
  display: flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  padding: 7px var(--campaign-page-x);
  color: var(--campaign-white);
  background: var(--campaign-pink);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.13em;
  line-height: 1.35;
  text-align: center;
  text-transform: uppercase;
}

.campaign-topbar {
  position: relative;
  z-index: 10;
  display: flex;
  width: min(100% - (2 * var(--campaign-page-x)), var(--campaign-content));
  min-height: 72px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-inline: auto;
  padding-block: 14px;
}

.campaign-brand {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 11px;
  color: var(--campaign-white);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.campaign-brand.is-static { pointer-events: none; }

.campaign-brand-mini {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid var(--campaign-line);
  border-radius: 50%;
  font-size: 9px;
  letter-spacing: 0.03em;
}

.campaign-utilities { display: flex; align-items: center; gap: 8px; }

.utility-button,
.icon-button {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 13px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-pill);
  color: var(--campaign-white);
  background: rgba(255, 255, 255, 0.06);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}

.utility-button:hover,
.icon-button:hover { border-color: rgba(255, 255, 255, 0.44); background: rgba(255, 255, 255, 0.12); }
.utility-button:active,
.icon-button:active { background: rgba(255, 255, 255, 0.18); }

.campaign-shell {
  width: min(100% - (2 * var(--campaign-page-x)), var(--campaign-content));
  margin-inline: auto;
  padding: clamp(24px, 6vw, 72px) 0 clamp(64px, 9vw, 112px);
}

.campaign-shell.is-narrow { max-width: 720px; }
.campaign-shell.is-card-width { max-width: 920px; }

.campaign-eyebrow {
  margin-bottom: 12px;
  color: var(--campaign-pink-bright);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.campaign-title {
  max-width: 860px;
  font-size: clamp(40px, 9vw, 84px);
  font-weight: 700;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.campaign-title.is-compact { font-size: clamp(36px, 7vw, 64px); }

.campaign-lede {
  max-width: 680px;
  margin-top: 20px;
  color: var(--campaign-muted);
  font-size: clamp(17px, 2.1vw, 21px);
  line-height: 1.6;
}

.campaign-section-head { margin-bottom: clamp(28px, 5vw, 48px); }

.campaign-kicker-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.campaign-back {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  color: var(--campaign-muted);
  font-size: 14px;
  font-weight: 700;
}

.campaign-back:hover { color: var(--campaign-white); }

.status-chip {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 5px 10px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--campaign-pill);
  color: var(--campaign-muted);
  background: rgba(255, 255, 255, 0.04);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.status-chip.is-pink { color: var(--campaign-white); border-color: rgba(196, 53, 106, 0.7); background: rgba(196, 53, 106, 0.22); }
.status-chip.is-demo { color: var(--campaign-warning); border-color: rgba(241, 207, 134, 0.45); }

.campaign-button {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: var(--campaign-radius-sm);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-align: center;
  transition: border-color 180ms ease, background 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.campaign-button:hover { box-shadow: 0 14px 34px rgba(3, 5, 22, 0.26); }
.campaign-button:active { box-shadow: none; }
.campaign-button.is-primary { color: var(--campaign-white); background: var(--campaign-pink); }
.campaign-button.is-primary:hover { background: var(--campaign-pink-bright); }
.campaign-button.is-secondary { color: var(--campaign-white); border-color: var(--campaign-line); background: rgba(255, 255, 255, 0.06); }
.campaign-button.is-quiet { color: var(--campaign-muted); border-color: var(--campaign-line); background: transparent; }
.campaign-button[disabled] { cursor: not-allowed; opacity: 0.55; box-shadow: none; }
.campaign-button.is-full { width: 100%; }

.hero-campaign {
  display: grid;
  min-height: calc(100svh - 108px);
  place-items: center;
  padding: clamp(34px, 6vw, 72px) var(--campaign-page-x) clamp(64px, 8vw, 96px);
}

.hero-campaign-inner {
  display: grid;
  width: min(100%, 520px);
  justify-items: center;
  text-align: center;
}

.co-symbol {
  position: relative;
  width: 132px;
  height: 78px;
  margin-bottom: clamp(32px, 7vw, 56px);
}

.co-symbol.is-small { width: 72px; height: 42px; margin: 0; }
.co-symbol.is-card-mark { width: 180px; height: 104px; margin: 0; }

.co-letter,
.co-lens {
  position: absolute;
  top: 0;
  width: 78px;
  height: 78px;
  border-radius: 50%;
}

.is-small .co-letter,
.is-small .co-lens { width: 42px; height: 42px; }
.is-card-mark .co-letter,
.is-card-mark .co-lens { width: 104px; height: 104px; }

.co-letter {
  border: 2px solid rgba(255, 255, 255, 0.84);
}

.co-letter-c {
  left: 0;
  border-right-color: transparent;
  transform: rotate(26deg);
}

.co-letter-o { right: 0; }

.co-lens {
  left: 27px;
  z-index: 1;
  width: 30px;
  border-radius: 50%;
  background: rgba(196, 53, 106, 0.78);
}

.is-small .co-lens { left: 15px; width: 14px; }
.is-card-mark .co-lens { left: 38px; width: 38px; }

.hero-campaign .campaign-title { max-width: 490px; }
.hero-campaign .campaign-lede { max-width: 430px; }

.hero-campaign .campaign-button {
  width: min(100%, 360px);
  margin-top: 34px;
}

.hero-footnote {
  margin-top: 18px;
  color: var(--campaign-muted);
  font-size: 12px;
  line-height: 1.5;
}

.surface {
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-lg);
  background: rgba(255, 255, 255, 0.055);
  box-shadow: var(--campaign-shadow);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.form-surface { padding: clamp(22px, 5vw, 42px); }

.field-grid { display: grid; gap: 20px; }
.field-row { display: grid; gap: 7px; }

.field-label,
.fieldset-label {
  color: var(--campaign-white);
  font-size: 14px;
  font-weight: 700;
}

.field-hint {
  color: var(--campaign-muted);
  font-size: 12px;
  line-height: 1.5;
}

.field-input,
.field-select {
  width: 100%;
  min-height: 52px;
  padding: 0 15px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: var(--campaign-radius-sm);
  color: var(--campaign-white);
  background: rgba(8, 11, 37, 0.38);
  outline: none;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.field-input::placeholder { color: #aeb1c4; }
.field-select { color-scheme: dark; }
.field-input:hover,
.field-select:hover { border-color: rgba(255, 255, 255, 0.42); }
.field-input:focus,
.field-select:focus { border-color: var(--campaign-white); box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.13); }
.field-input[aria-invalid="true"],
.field-select[aria-invalid="true"] { border-color: var(--campaign-danger); }

.field-error {
  color: var(--campaign-danger);
  font-size: 12px;
  font-weight: 700;
}

.consent-box {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 12px;
  padding: 17px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-sm);
  background: rgba(255, 255, 255, 0.04);
}

.consent-box input {
  width: 20px;
  height: 20px;
  margin: 2px 0 0;
  accent-color: var(--campaign-pink);
}

.consent-copy {
  color: var(--campaign-muted);
  font-size: 13px;
  line-height: 1.55;
}

.consent-copy strong { display: block; margin-bottom: 4px; color: var(--campaign-white); }

.consent-version {
  display: block;
  margin-top: 8px;
  color: #aeb1c4;
  font-size: 11px;
}

.form-actions { display: grid; gap: 12px; margin-top: 24px; }

.privacy-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--campaign-muted);
  font-size: 12px;
  line-height: 1.5;
}

.privacy-note svg { flex: 0 0 auto; margin-top: 2px; }

.alert {
  display: grid;
  gap: 7px;
  margin-bottom: 20px;
  padding: 16px 18px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-sm);
  color: var(--campaign-white);
  background: rgba(255, 255, 255, 0.06);
}

.alert strong { font-size: 14px; }
.alert p { color: var(--campaign-muted); font-size: 13px; }
.error-summary-list { display: grid; gap: 5px; margin: 4px 0 0; padding-left: 18px; color: var(--campaign-white); font-size: 12px; }
.error-summary-list a { text-decoration: underline; text-underline-offset: 3px; }
.alert.is-error { border-color: rgba(255, 159, 186, 0.55); background: rgba(196, 53, 106, 0.14); }
.alert.is-success { border-color: rgba(127, 210, 173, 0.52); background: rgba(55, 129, 96, 0.15); }
.alert.is-warning { border-color: rgba(241, 207, 134, 0.5); background: rgba(150, 109, 29, 0.13); }

.state-stage { position: relative; }

.state-overlay {
  display: grid;
  min-height: 300px;
  place-items: center;
  padding: 32px;
  text-align: center;
}

.state-overlay-copy { display: grid; max-width: 430px; justify-items: center; gap: 12px; }
.state-overlay h2 { font-size: clamp(25px, 5vw, 40px); line-height: 1.08; }
.state-overlay p { color: var(--campaign-muted); }

.spinner {
  width: 38px;
  height: 38px;
  border: 3px solid rgba(255, 255, 255, 0.18);
  border-top-color: var(--campaign-pink-bright);
  border-radius: 50%;
  animation: campaign-spin 800ms linear infinite;
}

@keyframes campaign-spin { to { transform: rotate(360deg); } }

.state-switcher {
  width: min(100% - (2 * var(--campaign-page-x)), var(--campaign-content));
  margin: 0 auto 32px;
  padding: 14px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-md);
  background: rgba(7, 9, 30, 0.48);
}

.state-switcher-title {
  margin-bottom: 10px;
  color: var(--campaign-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.state-switcher-buttons { display: flex; flex-wrap: wrap; gap: 8px; }

.state-button {
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-pill);
  color: var(--campaign-muted);
  background: transparent;
  font-size: 12px;
  font-weight: 700;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease;
}

.state-button:hover { color: var(--campaign-white); border-color: rgba(255, 255, 255, 0.42); }
.state-button[aria-pressed="true"] { color: var(--campaign-white); border-color: var(--campaign-pink); background: rgba(196, 53, 106, 0.22); }

.prototype-note {
  width: min(100% - (2 * var(--campaign-page-x)), var(--campaign-content));
  margin: 0 auto 28px;
  color: var(--campaign-muted);
  font-size: 12px;
  text-align: center;
}

.card-workspace {
  display: grid;
  align-items: start;
  gap: 28px;
}

.founder-card-wrap { display: grid; justify-items: center; gap: 18px; }

.founder-card {
  position: relative;
  display: flex;
  width: min(100%, 360px);
  aspect-ratio: 9 / 16;
  flex-direction: column;
  overflow: hidden;
  padding: 34px 28px 30px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 28px;
  color: var(--campaign-white);
  background:
    radial-gradient(circle at 75% 28%, rgba(125, 104, 181, 0.26), transparent 32%),
    var(--campaign-navy-deep);
  box-shadow: 0 30px 80px rgba(4, 6, 22, 0.48);
  transition: width 260ms var(--campaign-ease), aspect-ratio 260ms var(--campaign-ease);
}

.founder-card[data-format="square"] { width: min(100%, 500px); aspect-ratio: 1 / 1; }

.founder-card::after {
  position: absolute;
  right: -15%;
  bottom: -12%;
  width: 62%;
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  content: "";
}

.founder-card-label {
  margin-top: clamp(30px, 8vw, 72px);
  color: var(--campaign-pink-bright);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.founder-number {
  margin-top: 8px;
  font-size: clamp(64px, 18vw, 102px);
  font-weight: 700;
  letter-spacing: -0.07em;
  line-height: 1;
}

.founder-statement {
  max-width: 250px;
  margin-top: 20px;
  font-size: clamp(24px, 6.5vw, 38px);
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.06;
}

.founder-signature {
  z-index: 1;
  margin-top: auto;
  padding-top: 28px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.card-controls { display: grid; gap: 14px; }
.segmented-control { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

.segment-button {
  min-height: 48px;
  padding: 0 12px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-sm);
  color: var(--campaign-muted);
  background: transparent;
  font-weight: 700;
}

.segment-button[aria-pressed="true"] { color: var(--campaign-white); border-color: var(--campaign-pink); background: rgba(196, 53, 106, 0.22); }

.session-list { display: grid; gap: 14px; }

.session-card {
  display: grid;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-md);
  background: rgba(255, 255, 255, 0.05);
}

.session-card.is-full { opacity: 0.7; }
.session-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.session-time { font-size: clamp(22px, 5vw, 30px); font-weight: 700; letter-spacing: -0.03em; }
.session-date { margin-top: 3px; color: var(--campaign-muted); font-size: 13px; }
.session-capacity { text-align: right; }
.session-capacity strong { display: block; color: var(--campaign-warning); font-size: 17px; }
.session-capacity small { color: var(--campaign-muted); }
.session-meta { display: flex; flex-wrap: wrap; gap: 8px; color: var(--campaign-muted); font-size: 12px; }

.radio-select {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  align-items: center;
  cursor: pointer;
}

.radio-select input { width: 19px; height: 19px; accent-color: var(--campaign-pink); }

.checkin-layout { display: grid; gap: 24px; }

.staff-panel {
  padding: 20px;
  border: 1px solid rgba(241, 207, 134, 0.4);
  border-radius: var(--campaign-radius-md);
  background: rgba(150, 109, 29, 0.12);
}

.staff-panel strong { color: var(--campaign-warning); }
.staff-panel p { margin-top: 6px; color: var(--campaign-muted); font-size: 13px; }

.result-ticket {
  display: grid;
  gap: 18px;
  padding: clamp(22px, 5vw, 34px);
  border: 1px solid rgba(127, 210, 173, 0.42);
  border-radius: var(--campaign-radius-lg);
  background: rgba(55, 129, 96, 0.13);
}

.result-ticket-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.result-ticket-number { font-size: clamp(44px, 12vw, 72px); font-weight: 700; letter-spacing: -0.06em; }
.result-ticket dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 18px; margin: 0; }
.result-ticket dt { color: var(--campaign-muted); font-size: 12px; }
.result-ticket dd { margin: 0; font-size: 13px; font-weight: 700; }

.gallery-shell { width: min(100% - (2 * var(--campaign-page-x)), 1480px); }
.gallery-intro { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 40px; }

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 24px;
}

.gallery-item {
  overflow: hidden;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-lg);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: var(--campaign-shadow);
}

.gallery-item-head {
  display: flex;
  min-height: 74px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--campaign-line);
}

.gallery-item-head h2 { font-size: 16px; }
.gallery-item-head p { margin-top: 3px; color: var(--campaign-muted); font-size: 11px; }
.gallery-open { display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; border: 1px solid var(--campaign-line); border-radius: 50%; }
.gallery-open:hover { background: rgba(255, 255, 255, 0.1); }

.gallery-frame {
  display: block;
  width: 100%;
  height: 640px;
  border: 0;
  background: var(--campaign-navy);
}

.gallery-data-map {
  margin-top: 28px;
  padding: 22px;
  border: 1px solid var(--campaign-line);
  border-radius: var(--campaign-radius-md);
  color: var(--campaign-muted);
  background: rgba(255, 255, 255, 0.04);
  font-size: 13px;
}

.gallery-data-map strong { color: var(--campaign-white); }

.skeleton-stack { display: grid; width: 100%; gap: 14px; }
.skeleton-line { height: 14px; border-radius: var(--campaign-pill); background: rgba(255, 255, 255, 0.12); animation: campaign-pulse 1.1s ease-in-out infinite alternate; }
.skeleton-line:nth-child(2) { width: 76%; }
.skeleton-line:nth-child(3) { width: 54%; }
@keyframes campaign-pulse { to { opacity: 0.42; } }

@media (min-width: 760px) {
  .field-grid.is-two-column { grid-template-columns: 1fr 1fr; }
  .card-workspace { grid-template-columns: minmax(340px, 1fr) 280px; }
  .card-controls { position: sticky; top: 28px; }
  .checkin-layout { grid-template-columns: minmax(0, 1fr) minmax(280px, 0.8fr); }
}

@media (min-width: 1040px) {
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 420px) {
  .campaign-topbar { min-height: 64px; }
  .campaign-brand { font-size: 13px; }
  .campaign-brand-mini { display: none; }
  .proposal-strip { min-height: 42px; font-size: 9px; }
  .campaign-shell { padding-top: 18px; }
  .surface { border-radius: 24px; }
  .founder-card { border-radius: 22px; }
  .gallery-frame { height: 580px; }
}

@media (max-width: 560px) {
  .session-card.radio-select {
    position: relative;
    display: block;
    padding-left: 52px;
  }

  .radio-select > input {
    position: absolute;
    top: 26px;
    left: 18px;
  }

  .session-head {
    display: grid;
    justify-content: stretch;
    gap: 10px;
  }

  .session-time { display: block; }
  .session-date { display: block; }
  .session-capacity { text-align: left; }
  .session-capacity strong { display: inline; }
  .session-capacity small { margin-left: 4px; }
  .session-meta { margin-top: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}