.text-primary {
  color: var(--primary-color, #007bff) !important;
}

.text-secondary-color {
  color: var(--secondary-color, #6c757d) !important;
}

.text-accent {
  color: var(--accent-color, #ff6a5c) !important;
}

.text-success-color {
  color: var(--success-color, #28a745) !important;
}

.text-warning-color {
  color: var(--warning-color, #ffc107) !important;
}

.text-error {
  color: var(--danger-color, #dc3545) !important;
}

.text-info-color {
  color: var(--info-color, #17a2b8) !important;
}

.bg-primary-color {
  background-color: var(--primary-color, #007bff) !important;
}

.bg-secondary-color {
  background-color: var(--secondary-color, #6c757d) !important;
}

.bg-accent {
  background-color: var(--accent-color, #ff6a5c) !important;
}

.bg-success-color {
  background-color: var(--success-color, #28a745) !important;
}

.bg-warning-color {
  background-color: var(--warning-color, #ffc107) !important;
}

.bg-error {
  background-color: var(--danger-color, #dc3545) !important;
}

.bg-info-color {
  background-color: var(--info-color, #17a2b8) !important;
}

.border-primary-color {
  border-color: var(--primary-color, #007bff) !important;
}

.border-secondary-color {
  border-color: var(--secondary-color, #6c757d) !important;
}

.border-accent {
  border-color: var(--accent-color, #ff6a5c) !important;
}

.deeplink-landing {
  margin: 0;
  padding: 0;
  background-color: var(--bg-color, #ffffff);
  color: var(--text-color, #1a1a1a);
  font-family: var(--font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.dl-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: calc(var(--vh, 1vh) * 100);
  padding: 32px 24px;
  max-width: 480px;
  margin: 0 auto;
  box-sizing: border-box;
  gap: 32px;
}

.dl-logo {
  text-align: center;
}
.dl-logo__img {
  max-width: 160px;
  max-height: 60px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.dl-logo__text {
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--primary-color, #6366f1);
  letter-spacing: -0.5px;
}

.dl-message {
  text-align: center;
}
.dl-message__title {
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--text-color, #1a1a1a);
  line-height: 1.3;
  margin: 0 0 12px;
  letter-spacing: -0.3px;
}
.dl-message__sub {
  font-size: 1.5rem;
  color: var(--text-color-muted, #6c757d);
  line-height: 1.6;
  margin: 0;
}
.dl-message__sub strong {
  color: var(--primary-color, #6366f1);
  font-weight: 600;
}

.dl-cta {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.dl-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 56px;
  padding: 14px 24px;
  font-size: 1.6rem;
  font-weight: 600;
  border-radius: 14px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  box-sizing: border-box;
  transition: filter 0.2s ease, transform 0.15s ease;
  -webkit-tap-highlight-color: transparent;
}
.dl-btn:active {
  transform: scale(0.97);
}
.dl-btn--primary {
  background-color: var(--primary-color, #6366f1);
  color: #ffffff;
}
.dl-btn--primary:hover {
  filter: brightness(0.92);
}
.dl-btn--secondary {
  background-color: transparent;
  color: var(--primary-color, #6366f1);
  border: 2px solid var(--primary-color, #6366f1);
}
.dl-btn--secondary:hover {
  background-color: var(--primary-color, #6366f1);
  color: #ffffff;
}

.dl-stores {
  text-align: center;
  width: 100%;
}
.dl-stores__guide {
  font-size: 1.3rem;
  color: var(--text-color-muted, #6c757d);
  margin: 0 0 16px;
  line-height: 1.5;
}
.dl-stores__badges {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.dl-store-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 10px;
  font-size: 1.4rem;
  font-weight: 600;
  text-decoration: none;
  transition: filter 0.2s ease, transform 0.15s ease;
  -webkit-tap-highlight-color: transparent;
  min-height: 48px;
}
.dl-store-badge:active {
  transform: scale(0.97);
}
.dl-store-badge--apple {
  background-color: #000000;
  color: #ffffff;
}
.dl-store-badge--apple:hover {
  filter: brightness(1.2);
}
.dl-store-badge--google {
  background-color: #ffffff;
  color: #1a1a1a;
  border: 1px solid #e0e0e0;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.dl-store-badge--google:hover {
  filter: brightness(0.96);
}

.deeplink-error .dl-wrap {
  gap: 24px;
}

.dl-error-icon {
  color: var(--warning-color, #f59e0b);
  opacity: 0.85;
}
.dl-error-icon svg {
  display: block;
}

.dl-footer {
  font-size: 1.2rem;
  color: var(--text-color-muted, #adb5bd);
  text-align: center;
  margin-top: auto;
}

@media (max-width: 360px) {
  .dl-wrap {
    padding: 24px 16px;
    gap: 24px;
  }
  .dl-message__title {
    font-size: 2rem;
  }
  .dl-btn {
    font-size: 1.5rem;
    min-height: 52px;
  }
  .dl-stores__badges {
    flex-direction: column;
    align-items: center;
  }
  .dl-store-badge {
    width: 100%;
    justify-content: center;
  }
}
@media (prefers-color-scheme: dark) {
  .deeplink-landing {
    background-color: var(--bg-color, #121212);
    color: var(--text-color, #f0f0f0);
  }
  .dl-message__title {
    color: var(--text-color, #f0f0f0);
  }
  .dl-message__sub {
    color: var(--text-color-muted, #9ca3af);
  }
  .dl-store-badge--google {
    background-color: #2a2a2a;
    color: #f0f0f0;
    border-color: #444;
  }
  .dl-store-badge--google:hover {
    filter: brightness(1.15);
  }
  .dl-footer {
    color: var(--text-color-muted, #6b7280);
  }
}