:root {
  --admin-light-bg: #f7f6fb;
  --admin-light-panel: #ffffff;
  --admin-light-panel-soft: #f5f3f8;
  --admin-light-line: rgba(57, 43, 76, .11);
  --admin-light-text: #1d1824;
  --admin-light-dim: #716979;
  --admin-light-shadow: 0 16px 38px rgba(62, 44, 84, .09);
}

html[data-native-admin="true"] {
  color-scheme: light;
  --bg: var(--admin-light-bg);
  --panel: var(--admin-light-panel);
  --panel-2: var(--admin-light-panel-soft);
  --line: var(--admin-light-line);
  --text: var(--admin-light-text);
  --dim: var(--admin-light-dim);
  background: var(--admin-light-bg);
}

html[data-native-admin="true"] body {
  color: var(--admin-light-text);
  background:
    radial-gradient(ellipse 520px 300px at 0% 0%, rgba(124, 92, 255, .10), transparent 68%),
    radial-gradient(ellipse 460px 280px at 100% 4%, rgba(236, 72, 153, .08), transparent 68%),
    linear-gradient(180deg, #fbfafe 0%, #f7f6fb 48%, #f4f6fa 100%);
  background-attachment: fixed;
}

html[data-native-admin="true"] .admin-app {
  width: min(520px, 100%);
  padding-right: 14px;
  padding-left: 14px;
}

html[data-native-admin="true"] .admin-app .age {
  display: none;
}

html[data-native-admin="true"] #adminBrand {
  pointer-events: none;
}

html[data-native-admin="true"] .admin-app > .topbar {
  position: sticky;
  top: max(8px, env(safe-area-inset-top));
  z-index: 40;
  min-height: 58px;
  margin-bottom: 10px;
  padding: 8px 10px;
  border: 1px solid rgba(57, 43, 76, .10);
  border-radius: 17px;
  background:
    linear-gradient(120deg, rgba(124, 92, 255, .035), rgba(236, 72, 153, .025)),
    rgba(255, 255, 255, .92);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .98),
    0 12px 34px rgba(56, 39, 78, .09);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  backdrop-filter: blur(22px) saturate(145%);
}

html[data-native-admin="true"] .brand {
  color: var(--admin-light-text);
  text-shadow: none;
}

html[data-native-admin="true"] .mark-img {
  box-shadow:
    0 0 0 1px rgba(83, 62, 112, .10),
    0 8px 20px rgba(87, 55, 130, .14),
    0 0 18px rgba(207, 63, 180, .12);
}

html[data-native-admin="true"] .notification-bell,
html[data-native-admin="true"] .automation-shortcut {
  border-color: rgba(57, 43, 76, .12);
  background: rgba(249, 248, 252, .96);
  color: #332a3d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .96);
}

html[data-native-admin="true"] .automation-shortcut {
  color: #7455ce;
}

html[data-native-admin="true"] .automation-shortcut i,
html[data-native-admin="true"] .notification-bell span {
  border-color: var(--admin-light-bg);
}

html[data-native-admin="true"] .admin-login,
html[data-native-admin="true"] .admin-hero,
html[data-native-admin="true"] .users-panel,
html[data-native-admin="true"] .user-card,
html[data-native-admin="true"] .admin-metrics article,
html[data-native-admin="true"] .site-metrics article,
html[data-native-admin="true"] .site-breakdowns > section,
html[data-native-admin="true"] .site-visit-row,
html[data-native-admin="true"] .site-funnel-panel,
html[data-native-admin="true"] .campaign-panel,
html[data-native-admin="true"] .autopost-panel,
html[data-native-admin="true"] .automation-rule,
html[data-native-admin="true"] .autopost-card,
html[data-native-admin="true"] .notification-item {
  border-color: var(--admin-light-line);
  background: rgba(255, 255, 255, .93);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .98),
    var(--admin-light-shadow);
}

html[data-native-admin="true"] .admin-login {
  margin-top: min(15vh, 118px);
  padding: 24px 19px;
}

html[data-native-admin="true"] .admin-hero {
  background:
    linear-gradient(120deg, rgba(124, 92, 255, .045), rgba(236, 72, 153, .028)),
    rgba(255, 255, 255, .94);
}

html[data-native-admin="true"] .admin-title h2,
html[data-native-admin="true"] .admin-hero h2,
html[data-native-admin="true"] h3 {
  color: var(--admin-light-text);
}

html[data-native-admin="true"] .eyebrow {
  background: linear-gradient(100deg, #7256dd, #e94696 58%, #ff7d4e);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html[data-native-admin="true"] .home-logo.small {
  background: linear-gradient(135deg, #6adcf2, #8d65ff 34%, #f3449b 70%, #ff8352);
  box-shadow: 0 12px 26px rgba(216, 68, 156, .18);
}

html[data-native-admin="true"] .home-logo svg {
  stroke: #1d1824;
}

html[data-native-admin="true"] .admin-login-form input,
html[data-native-admin="true"] .campaign-form input,
html[data-native-admin="true"] .campaign-form select,
html[data-native-admin="true"] .autopost-form textarea,
html[data-native-admin="true"] .autopost-form input,
html[data-native-admin="true"] .autopost-form select,
html[data-native-admin="true"] .automation-delay input,
html[data-native-admin="true"] .automation-messages textarea,
html[data-native-admin="true"] .users-filter-label select {
  border-color: var(--admin-light-line);
  background: rgba(246, 244, 249, .96);
  color: var(--admin-light-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .90);
}

html[data-native-admin="true"] input::placeholder,
html[data-native-admin="true"] textarea::placeholder {
  color: #9a92a3;
}

html[data-native-admin="true"] input:focus,
html[data-native-admin="true"] textarea:focus,
html[data-native-admin="true"] select:focus {
  outline: 0 !important;
  border-color: rgba(124, 92, 255, .42);
  box-shadow: 0 0 0 3px rgba(124, 92, 255, .09);
}

html[data-native-admin="true"] .admin-app,
html[data-native-admin="true"] .admin-app * {
  -webkit-tap-highlight-color: transparent;
}

html[data-native-admin="true"] .admin-app select,
html[data-native-admin="true"] .admin-app summary,
html[data-native-admin="true"] .admin-app label {
  outline: 0 !important;
}

html[data-native-admin="true"] .last-seen {
  outline: 0 !important;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

html[data-native-admin="true"] .last-seen:focus,
html[data-native-admin="true"] .last-seen:focus-visible {
  outline: 0 !important;
  background: rgba(245, 243, 248, .92);
  box-shadow: inset 0 0 0 1px rgba(124, 92, 255, .12);
}

html[data-native-admin="true"] .btn.primary {
  color: #17121d;
  overflow: hidden;
  border: 0;
  background: linear-gradient(110deg, #6dddf2 0%, #8d65ff 31%, #f3449b 68%, #ff8352 100%);
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-clip: padding-box;
  box-shadow:
    0 12px 28px rgba(224, 64, 153, .17),
    inset 0 1px 0 rgba(255, 255, 255, .34);
  animation: none;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

html[data-native-admin="true"] .admin-app .btn {
  outline: 0;
  -webkit-tap-highlight-color: transparent;
}

html[data-native-admin="true"] .admin-app .btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(124, 92, 255, .13);
}

html[data-native-admin="true"] .btn.ghost {
  border-color: var(--admin-light-line);
  background: rgba(255, 255, 255, .88);
  color: #302839;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .98);
}

html[data-native-admin="true"] .admin-menu {
  gap: 9px;
}

html[data-native-admin="true"] .admin-menu .btn {
  min-height: 46px;
  background:
    linear-gradient(130deg, rgba(124, 92, 255, .035), rgba(236, 72, 153, .022)),
    rgba(255, 255, 255, .92);
  box-shadow: 0 10px 25px rgba(59, 42, 80, .065);
}

html[data-native-admin="true"] .admin-menu-icon svg {
  color: #7459cd;
}

html[data-native-admin="true"] #adminLogout {
  overflow: hidden;
  border: 0;
  background: linear-gradient(135deg, #ff596f 0%, #f04498 58%, #c94cde 100%);
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-clip: padding-box;
  color: #fff;
  box-shadow: 0 9px 22px rgba(224, 61, 127, .20);
  animation: none;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

html[data-native-admin="true"] .site-visit-device,
html[data-native-admin="true"] .site-visit-location,
html[data-native-admin="true"] .site-funnel-step,
html[data-native-admin="true"] .campaign-card,
html[data-native-admin="true"] .campaign-stats span,
html[data-native-admin="true"] .autopost-meta span,
html[data-native-admin="true"] .report-counts > span,
html[data-native-admin="true"] .report-entry,
html[data-native-admin="true"] .last-seen,
html[data-native-admin="true"] .user-info-row,
html[data-native-admin="true"] .user-card-grid div {
  border-color: var(--admin-light-line);
  background: rgba(245, 243, 248, .92);
}

html[data-native-admin="true"] .campaign-link {
  border-color: rgba(124, 92, 255, .14);
  background: linear-gradient(120deg, rgba(124, 92, 255, .08), rgba(236, 72, 153, .035)), #f7f5fa;
}

html[data-native-admin="true"] .campaign-link b,
html[data-native-admin="true"] .audience-field small {
  color: #8253d2;
}

html[data-native-admin="true"] .campaign-delete {
  color: #d82f5f !important;
  background: rgba(240, 68, 120, .07) !important;
}

html[data-native-admin="true"] .autopost-switch label,
html[data-native-admin="true"] .autopost-buttons label,
html[data-native-admin="true"] .autopost-days label {
  border-color: var(--admin-light-line);
  background: rgba(247, 245, 250, .94);
}

html[data-native-admin="true"] .autopost-switch label {
  overflow: visible;
  -webkit-tap-highlight-color: transparent;
}

html[data-native-admin="true"] .autopost-form .autopost-switch input[type="radio"] {
  position: relative;
  display: inline-block;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 1.5px solid #817a88;
  border-radius: 50%;
  outline: 0;
  background: #fff;
  background-image: none;
  box-shadow: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

html[data-native-admin="true"] .autopost-form .autopost-switch input[type="radio"]:checked {
  border-color: #ed4898;
  background:
    radial-gradient(circle at center, #ed4898 0 42%, transparent 45%),
    #fff;
  box-shadow: 0 0 0 3px rgba(237, 72, 152, .13);
}

html[data-native-admin="true"] .autopost-form .autopost-switch input[type="radio"]:focus,
html[data-native-admin="true"] .autopost-form .autopost-switch input[type="radio"]:focus-visible {
  outline: 0;
  border-color: #ed4898;
  box-shadow: 0 0 0 3px rgba(237, 72, 152, .13);
}

html[data-native-admin="true"] .autopost-days label {
  position: relative;
  overflow: visible;
  -webkit-tap-highlight-color: transparent;
}

html[data-native-admin="true"] .autopost-form .autopost-days input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none !important;
  opacity: 0;
  pointer-events: none;
  -webkit-appearance: none;
  appearance: none;
}

html[data-native-admin="true"] .autopost-days label > span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

html[data-native-admin="true"] .autopost-days label > span::before {
  content: "";
  display: block;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  border: 1.5px solid #8b8492;
  border-radius: 4px;
  background: #fff;
  box-shadow: none;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

html[data-native-admin="true"] .autopost-days label > span::after {
  content: none;
}

html[data-native-admin="true"] .autopost-days input[type="checkbox"]:checked + span::before {
  border-color: #df3f8d;
  background-color: #ec4899;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
  box-shadow: none;
}

html[data-native-admin="true"] .autopost-days input[type="checkbox"]:focus-visible + span::before {
  border-color: #8d65ff;
  box-shadow: 0 0 0 3px rgba(124, 92, 255, .13);
}

html[data-native-admin="true"] .autopost-buttons .toggle-row i,
html[data-native-admin="true"] .automation-toggle i {
  overflow: hidden;
  border: 0;
  background: #ddd8e5;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-clip: padding-box;
  box-shadow: inset 0 1px 3px rgba(55, 40, 73, .13);
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

html[data-native-admin="true"] .autopost-buttons .toggle-row i::after,
html[data-native-admin="true"] .automation-toggle i::after {
  top: 4px;
  left: 4px;
  background: #fff;
  box-shadow: 0 4px 10px rgba(51, 37, 68, .20);
}

html[data-native-admin="true"] .autopost-buttons .toggle-row input:checked + i,
html[data-native-admin="true"] .automation-toggle input:checked + i {
  border: 0;
  background: linear-gradient(135deg, #8d65ff, #f3449b, #ff8352);
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
}

html[data-native-admin="true"] .autopost-buttons .toggle-row,
html[data-native-admin="true"] .automation-toggle {
  -webkit-tap-highlight-color: transparent;
}

html[data-native-admin="true"] .autopost-buttons .toggle-row input:focus-visible + i,
html[data-native-admin="true"] .automation-toggle input:focus-visible + i {
  box-shadow: 0 0 0 3px rgba(124, 92, 255, .13);
}

html[data-native-admin="true"] .autopost-media {
  border-color: var(--admin-light-line);
  background: #efedf3;
}

html[data-native-admin="true"] .notification-backdrop {
  background: rgba(35, 27, 44, .34);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

html[data-native-admin="true"] .notification-drawer {
  background:
    radial-gradient(ellipse 340px 220px at 100% 0%, rgba(236, 72, 153, .08), transparent 70%),
    #f8f7fb;
  box-shadow: -18px 0 50px rgba(45, 33, 59, .18);
}

html[data-native-admin="true"] .notification-item.unread {
  background:
    linear-gradient(120deg, rgba(124, 92, 255, .08), rgba(236, 72, 153, .055)),
    #fff;
}

html[data-native-admin="true"] .notification-content time,
html[data-native-admin="true"] .notification-retention {
  color: #8d8595;
}

html[data-native-admin="true"] .user-card.online {
  border-color: rgba(22, 163, 116, .23);
  background: linear-gradient(135deg, rgba(52, 211, 153, .075), transparent 48%), #fff;
}

html[data-native-admin="true"] .user-card.blocked {
  border-color: rgba(225, 55, 130, .24);
  background: linear-gradient(135deg, rgba(236, 72, 153, .075), transparent 50%), #fff;
}

html[data-native-admin="true"] .status-badge.online {
  color: #137a59;
  background: rgba(52, 211, 153, .07);
}

html[data-native-admin="true"] .status-badge.blocked {
  color: #c82f70;
  background: rgba(236, 72, 153, .07);
}

html[data-native-admin="true"] .toast {
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 14px 36px rgba(54, 39, 73, .15);
}

@media (max-width: 380px) {
  html[data-native-admin="true"] .admin-app {
    padding-right: 10px;
    padding-left: 10px;
  }

  html[data-native-admin="true"] .admin-hero {
    padding: 14px;
  }

  html[data-native-admin="true"] .admin-title h2,
  html[data-native-admin="true"] .admin-hero h2 {
    font-size: 21px;
  }
}