:root, [data-theme="mimpi"] {
  font-family: "DM Sans", sans-serif;
  --color-base-100: oklch(99% 0.006 275); --color-base-200: oklch(97% 0.012 275); --color-base-300: oklch(91% 0.02 275); --color-base-content: oklch(25% 0.035 275);
  --color-primary: oklch(54% 0.23 275); --color-primary-content: oklch(98% 0.01 275); --color-secondary: oklch(65% 0.18 315); --color-secondary-content: oklch(98% 0.01 315);
  --color-accent: oklch(75% 0.16 80); --color-accent-content: oklch(26% 0.04 80); --color-neutral: oklch(28% 0.035 275); --color-neutral-content: oklch(98% 0.01 275);
  --color-info: oklch(70% 0.14 235); --color-success: oklch(68% 0.16 155); --color-warning: oklch(78% 0.16 80); --color-error: oklch(64% 0.22 25);
  --radius-selector:.75rem; --radius-field:.75rem; --radius-box:1.25rem;
}
.font-display, h1, h2, h3, h4 { font-family: "Manrope", sans-serif; }
body { background-image: radial-gradient(circle at 10% -10%, rgb(79 70 229 / .08), transparent 28rem); }
.surface { background: color-mix(in oklab, var(--color-base-100) 92%, transparent); border: 1px solid var(--color-base-300); box-shadow: 0 18px 50px rgb(35 28 85 / .08); }
.hero-glow { background: radial-gradient(circle at 80% 20%, rgb(255 255 255 / .18), transparent 28rem), linear-gradient(135deg, #312e81, #6d28d9 55%, #a21caf); }
.text-gradient { background: linear-gradient(110deg, #4338ca, #9333ea); -webkit-background-clip: text; color: transparent; }
.card-mimpi { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.card-mimpi:hover { transform: translateY(-4px); border-color: color-mix(in oklab, var(--color-primary) 40%, var(--color-base-300)); box-shadow: 0 20px 50px rgb(54 43 120 / .12); }
.badge-islamic { background:#e0e7ff; color:#3730a3; }
.badge-primbon { background:#dcfce7; color:#166534; }
.badge-western { background:#fef3c7; color:#92400e; }
.badge-anonymous { background:#f1f5f9; color:#475569; }
.btn-interaction.active { background:var(--color-primary); border-color:var(--color-primary); color:var(--color-primary-content); }
.dream-content { color: color-mix(in oklab, var(--color-base-content) 78%, transparent); line-height: 1.85; }
.comment-item { border:1px solid var(--color-base-300); border-radius:1rem; padding:1rem; background:var(--color-base-100); }
.comment-avatar { display:grid; width:3rem; height:3rem; place-items:center; border-radius:999px; background:var(--color-base-200); color:var(--color-primary); }
.breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; font-size:.875rem; color:color-mix(in oklab,var(--color-base-content) 55%,transparent); }
.breadcrumb-item + .breadcrumb-item::before { content:"/"; margin-right:.5rem; opacity:.45; }
.breadcrumb-item.active { max-width:28rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--color-base-content); }
.a2a_kit { display:flex !important; justify-content:center; gap:.4rem; }
.card-custom { border:1px solid var(--color-base-300); background:var(--color-base-100); box-shadow:0 12px 35px rgb(35 28 85 / .07); }
.card-header { padding:1rem 1.5rem; border-bottom:1px solid var(--color-base-300); font-weight:700; }
.card-footer { padding:1rem 1.5rem; border-top:1px solid var(--color-base-300); }
.gradient-primary { background:linear-gradient(135deg,#4338ca,#9333ea); }
.h3 { font-family:"Manrope",sans-serif; font-size:1.75rem; line-height:1.2; font-weight:800; }
.stat-number { font-family:"Manrope",sans-serif; font-size:2rem; line-height:1; font-weight:800; }
.stat-label { color:color-mix(in oklab,var(--color-base-content) 58%,transparent); font-size:.875rem; font-weight:600; }
.progress-track { width:100%; height:1.25rem; overflow:hidden; border-radius:999px; background:var(--color-base-200); }
.progress-fill { display:flex; height:100%; min-width:2rem; align-items:center; justify-content:center; border-radius:999px; background:var(--color-primary); color:var(--color-primary-content); font-size:.7rem; font-weight:700; }
.pagination { display:flex; justify-content:center; }
.page-item { display:flex; }
.page-link { display:grid; min-width:2.5rem; height:2.5rem; place-items:center; border:1px solid var(--color-base-300); background:var(--color-base-100); padding:0 .75rem; font-weight:600; }
.page-item:first-child .page-link { border-radius:.75rem 0 0 .75rem; }
.page-item:last-child .page-link { border-radius:0 .75rem .75rem 0; }
.page-item.active .page-link { background:var(--color-primary); border-color:var(--color-primary); color:var(--color-primary-content); }
.page-item.disabled .page-link { opacity:.45; pointer-events:none; }
.input-group { display:flex; align-items:stretch; }
.input-group-text { display:grid; place-items:center; border:1px solid var(--color-base-300); border-right:0; border-radius:.75rem 0 0 .75rem; padding:0 .9rem; }
.input-group .input { border-radius:0 .75rem .75rem 0; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; } }
