:root {
  --sd-cream: #F3ECE0;
  --sd-beige: #E9DDCC;
  --sd-wine: #750018;
  --sd-wine-dark: #5B0012;
  --sd-blue: #ACC6DD;
  --sd-blue-soft: #DCEAF4;
  --sd-muted: #525050;
  --sd-ink: #1F1F1F;
  --sd-shadow: 0 16px 44px rgba(82, 80, 80, .08);
  --sd-shadow-large: 0 24px 68px rgba(82, 80, 80, .12);
}

html, body, button, input, textarea, select {
  font-family: "Montserrat", "Manrope", Arial, sans-serif !important;
}

body, #root {
  color: var(--sd-ink) !important;
}

body,
.app,
.login-page,
.dashboard,
.editor-page,
.admin-page {
  background:
    radial-gradient(circle at 88% 12%, rgba(172, 198, 221, .34), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(243, 236, 224, .98)) !important;
}

.login-form,
.login-card,
.prez-card,
.presentation-card,
.folder-section,
.sidebar,
.toolbar,
.modal,
.modal-content,
.panel,
.settings-panel,
.admin-card,
.empty-state {
  background: rgba(255, 255, 255, .86) !important;
  border: 1px solid rgba(117, 0, 24, .16) !important;
  box-shadow: var(--sd-shadow) !important;
}

.login-form,
.login-card {
  border-radius: 34px 76px 38px 64px !important;
}

.prez-card,
.presentation-card {
  border-radius: 28px 44px 28px 36px !important;
}

.prez-card:nth-child(3n+2),
.presentation-card:nth-child(3n+2) {
  background: rgba(220, 234, 244, .88) !important;
  border-radius: 44px 24px 38px 26px !important;
}

.prez-card:nth-child(3n),
.presentation-card:nth-child(3n) {
  background: rgba(233, 221, 204, .9) !important;
  border-radius: 24px 46px 26px 42px !important;
}

.prez-card:hover,
.presentation-card:hover {
  border-color: var(--sd-wine) !important;
  box-shadow: var(--sd-shadow-large) !important;
  transform: translateY(-2px) !important;
}

h1, h2, h3,
.login-title,
.dashboard-title,
.page-title,
.modal-title,
.section-title {
  color: var(--sd-wine) !important;
  font-weight: 800 !important;
  letter-spacing: -.025em !important;
}

.login-subtitle,
.dashboard-subtitle,
.dashboard-user-name,
.muted,
.helper-text,
.description {
  color: var(--sd-muted) !important;
}

.btn-primary,
.btn-new-prez,
.login-btn,
.btn-generate,
button[type="submit"] {
  background: var(--sd-wine) !important;
  color: var(--sd-cream) !important;
  border: 1px solid var(--sd-wine) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}

.btn-primary:hover,
.btn-new-prez:hover,
.login-btn:hover,
.btn-generate:hover,
button[type="submit"]:hover {
  background: var(--sd-wine-dark) !important;
  border-color: var(--sd-wine-dark) !important;
}

.btn-secondary,
.btn-admin,
.btn-toolbar,
.btn-nav,
.palette-trigger,
.icon-button {
  background: #fff !important;
  color: var(--sd-wine-dark) !important;
  border: 1px solid rgba(117, 0, 24, .18) !important;
  border-radius: 999px !important;
}

.btn-secondary:hover,
.btn-admin:hover,
.btn-toolbar:hover,
.btn-nav:hover,
.palette-trigger:hover,
.icon-button:hover {
  background: var(--sd-blue-soft) !important;
  border-color: var(--sd-blue) !important;
}

input, textarea, select {
  color: var(--sd-ink) !important;
  background: rgba(255, 255, 255, .92) !important;
  border: 1px solid rgba(117, 0, 24, .18) !important;
  border-radius: 16px !important;
}

input:focus, textarea:focus, select:focus {
  border-color: var(--sd-wine) !important;
  box-shadow: 0 0 0 3px rgba(117, 0, 24, .08) !important;
  outline: none !important;
}

.slide-thumb.active,
.btn-toolbar-active,
.active-tab,
.tab.active {
  background: var(--sd-wine) !important;
  color: var(--sd-cream) !important;
  border-color: var(--sd-wine) !important;
}

.preview,
.preview-area,
.canvas-wrap,
.workspace {
  background: var(--sd-beige) !important;
}

.sidebar,
.toolbar {
  border-radius: 24px !important;
}

.badge,
.tag,
.status-badge {
  background: var(--sd-blue-soft) !important;
  color: var(--sd-wine-dark) !important;
  border-color: rgba(172, 198, 221, .8) !important;
}

@media (max-width: 700px) {
  .dashboard,
  .editor-page,
  .admin-page { padding: 24px 16px !important; }
  .dashboard-header { flex-direction: column !important; gap: 18px !important; }
  .dashboard-header-actions { flex-wrap: wrap !important; }
  .prez-grid,
  .presentations-grid { grid-template-columns: 1fr !important; }
  h1, .dashboard-title, .login-title { font-size: clamp(28px, 8vw, 38px) !important; }
  body, input, textarea, select, button { font-size: 16px !important; }
}