:root {
  --ui-bg-page: #f4f1fa;
  --ui-surface: rgba(255, 255, 255, .78);
  --ui-surface-strong: rgba(255, 255, 255, .94);
  --ui-primary: #7c3aed;
  --ui-primary-soft: #a78bfa;
  --ui-accent: #db2777;
  --ui-text: #332f3a;
  --ui-muted: #635f69;
  --ui-subtle: #8a8492;
  --ui-border: rgba(124, 58, 237, .12);
  --ui-success: #059669;
  --ui-warning: #d97706;
  --ui-danger: #be123c;
  --ui-radius-card: 24px;
  --ui-radius-control: 16px;
  --ui-shadow-card: 18px 18px 36px rgba(160, 150, 180, .22), -12px -12px 28px rgba(255, 255, 255, .96);
}

body {
  color: var(--ui-text);
  background:
    radial-gradient(circle at 10% 4%, rgba(167, 139, 250, .16), transparent 28%),
    radial-gradient(circle at 92% 14%, rgba(219, 39, 119, .1), transparent 24%),
    linear-gradient(180deg, #fbf8ff 0%, var(--ui-bg-page) 52%, #efe9fb 100%);
}

body:not(.is-authenticated) {
  background:
    radial-gradient(circle at 10% 4%, rgba(167, 139, 250, .18), transparent 30%),
    radial-gradient(circle at 92% 16%, rgba(219, 39, 119, .14), transparent 26%),
    linear-gradient(180deg, #fbf8ff 0%, var(--ui-bg-page) 52%, #efe9fb 100%);
}

body:not(.is-authenticated) .auth-stage__eyebrow {
  color: var(--ui-primary);
}

body:not(.is-authenticated) .auth-stage__title,
body:not(.is-authenticated) .auth-stage__copy {
  color: var(--ui-text);
}

body:not(.is-authenticated) .auth-stage__copy {
  color: var(--ui-muted);
}

body:not(.is-authenticated) .auth-card--login {
  border-color: rgba(124, 58, 237, .12) !important;
  background: var(--ui-surface-strong) !important;
  box-shadow: var(--ui-shadow-card) !important;
}

body:not(.is-authenticated) .primary-button {
  border-color: transparent;
  background: linear-gradient(135deg, var(--ui-primary-soft), var(--ui-primary) 55%, var(--ui-accent)) !important;
  color: #fff !important;
  box-shadow: 12px 12px 24px rgba(124, 58, 237, .2), -8px -8px 18px rgba(255, 255, 255, .72) !important;
}

body:not(.is-authenticated) .auth-stage__footer {
  border-top-color: var(--ui-border);
  color: var(--ui-muted);
}

body:not(.is-authenticated) .auth-stage__footer code {
  background: rgba(124, 58, 237, .08);
  color: var(--ui-primary);
}

.auth-stage__visual,
.sidebar {
  color: var(--ui-text);
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, .58), transparent 28%),
    linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(238, 229, 255, .9)) !important;
  border: 1px solid rgba(255, 255, 255, .82) !important;
  box-shadow: var(--ui-shadow-card) !important;
}

.auth-stage__visual .auth-stage__eyebrow,
.auth-stage__visual .auth-stage__copy,
.auth-stage__visual .auth-stage__tile p,
.auth-stage__visual .auth-stage__footer {
  color: var(--ui-muted);
}

.auth-stage__visual .auth-stage__title,
.brand-block h1,
.section-heading h3,
.auth-card h3,
.panel-title-row h4,
.hero-panel h2,
.hero-sidecard h3 {
  color: var(--ui-text);
}

.auth-stage__tile,
.auth-card,
.topbar,
.hero-panel,
.section-card,
.list-panel,
.form-panel,
.preflight-panel,
.payment-panel {
  border: 1px solid rgba(255, 255, 255, .74) !important;
  border-radius: var(--ui-radius-card) !important;
  background: var(--ui-surface) !important;
  box-shadow: var(--ui-shadow-card) !important;
}

.auth-stage__tile {
  background: rgba(255, 255, 255, .52) !important;
}

.topbar,
.hero-panel,
.section-card,
.list-panel,
.form-panel {
  color: var(--ui-text);
}

.nav-item {
  color: var(--ui-muted);
  border: 1px solid transparent;
  border-radius: var(--ui-radius-control);
  background: transparent;
}

.nav-item:hover,
.nav-item.is-active {
  color: var(--ui-primary);
  border-color: var(--ui-border);
  background: rgba(124, 58, 237, .1);
}

.nav-item__desc,
.brand-copy,
.permission-summary,
.sidebar-note,
.panel-subtitle,
.section-copy,
.hero-text,
.hero-sidecard p,
.auth-card__meta,
.auth-card__demo {
  color: var(--ui-muted);
}

input,
textarea,
select {
  color: var(--ui-text);
  border-color: var(--ui-border) !important;
  border-radius: var(--ui-radius-control) !important;
  background: rgba(255, 255, 255, .86) !important;
}

input:focus,
textarea:focus,
select:focus,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  border-color: rgba(124, 58, 237, .45) !important;
  box-shadow: 0 0 0 4px rgba(124, 58, 237, .12) !important;
}

.primary-button,
.primary-button--wide {
  color: #fff !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, var(--ui-primary-soft), var(--ui-primary) 55%, var(--ui-accent)) !important;
  box-shadow: 12px 12px 24px rgba(124, 58, 237, .2), -8px -8px 18px rgba(255, 255, 255, .72) !important;
}

.ghost-button,
.text-button {
  color: var(--ui-primary) !important;
}

.ghost-button {
  border-color: var(--ui-border) !important;
  border-radius: var(--ui-radius-control) !important;
  background: var(--ui-surface-strong) !important;
}

.text-button {
  border-color: transparent !important;
  background: transparent !important;
}

.danger-button {
  color: var(--ui-danger) !important;
  border-color: rgba(190, 18, 60, .16) !important;
  background: rgba(255, 241, 242, .92) !important;
}

.status-pill,
.role-chip,
.panel-count,
.payment-pill {
  border-color: var(--ui-border) !important;
  color: var(--ui-primary) !important;
  background: rgba(124, 58, 237, .1) !important;
}

.status-pill--success,
.payment-pill--success {
  color: var(--ui-success) !important;
  background: rgba(5, 150, 105, .12) !important;
}

.status-pill--warning,
.payment-pill--pending {
  color: var(--ui-warning) !important;
  background: rgba(217, 119, 6, .12) !important;
}

.status-pill--danger,
.payment-pill--error {
  color: var(--ui-danger) !important;
  background: rgba(190, 18, 60, .1) !important;
}

.flash--success { color: var(--ui-success); }
.flash--error { color: var(--ui-danger); }
.flash--info { color: var(--ui-primary); }

.metric-card,
.overview-ribbon,
.shortcut-card,
.entity-card,
.detail-card,
.table-shell {
  border-color: rgba(255, 255, 255, .74) !important;
  border-radius: var(--ui-radius-card) !important;
  background: rgba(255, 255, 255, .66) !important;
  box-shadow: 12px 12px 26px rgba(160, 150, 180, .14), -8px -8px 18px rgba(255, 255, 255, .72) !important;
}

.primary-button:disabled,
.primary-button--wide:disabled,
.ghost-button:disabled,
.danger-button:disabled,
.text-button:disabled {
  cursor: not-allowed;
  opacity: .55;
  filter: saturate(.35);
  box-shadow: none !important;
  transform: none !important;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid rgba(219, 39, 119, .36);
  outline-offset: 3px;
}

@media (max-width: 900px) {
  .main-shell { min-width: 0; }
  .section-card,
  .list-panel,
  .form-panel { min-width: 0; }
}

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