:root { color-scheme: light; }
.dark { color-scheme: dark; }
html { scroll-behavior: smooth; }
body { font-feature-settings: "ss01"; }
.mana-skip-link { position: fixed; right: 1rem; top: -5rem; z-index: 100; border-radius: .75rem; background: #fff; padding: .75rem 1rem; color: #111827; box-shadow: 0 10px 30px rgba(0,0,0,.12); }
.mana-skip-link:focus { top: 1rem; }
.mana-alert { border-radius: 1rem; border: 1px solid; padding: .9rem 1.1rem; font-size: .875rem; font-weight: 700; }
.mana-alert-success { border-color: #86efac; background: #f0fdf4; color: #166534; }
.mana-alert-warning { border-color: #fde047; background: #fefce8; color: #854d0e; }
.mana-alert-error { border-color: #fca5a5; background: #fef2f2; color: #991b1b; }
.mana-mobile-overlay { position: fixed; inset: 0; z-index: 60; background: rgba(2,6,23,.55); backdrop-filter: blur(3px); }
.mana-mobile-menu { position: fixed; z-index: 70; top: 0; right: 0; width: min(20rem, 88vw); height: 100dvh; overflow-y: auto; background: #fff; transform: translateX(105%); transition: transform .3s ease; }
.dark .mana-mobile-menu { background: #030712; }
.mana-mobile-menu.is-open { transform: translateX(0); }
.mana-mobile-menu nav a { display: block; border-radius: .75rem; padding: .8rem 1rem; }
.mana-mobile-menu nav a:hover { background: #f3f4f6; color: #2563eb; }
.dark .mana-mobile-menu nav a:hover { background: #111827; }
.mana-product-card { height: 100%; border: 1px solid #e5e7eb; border-radius: 1.25rem; background: #fff; padding: .85rem; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.mana-product-card:hover { transform: translateY(-4px); border-color: #bfdbfe; box-shadow: 0 20px 40px rgba(15,23,42,.08); }
.dark .mana-product-card { border-color: #1f2937; background: #030712; }
.mana-card-action { display: inline-flex; width: 2.65rem; height: 2.65rem; align-items: center; justify-content: center; border-radius: .85rem; background: #0f172a; color: #fff; transition: .2s; }
.mana-card-action:hover { background: #2563eb; transform: scale(1.05); }
.mana-desktop-nav { display: flex; align-items: center; gap: 1.4rem; }
.mana-desktop-nav a { white-space: nowrap; }
.mana-hero-action { display: inline-flex; border-radius: .8rem; background: #fff; padding: .8rem 1.5rem; color: #0f172a !important; font-size: .875rem; font-weight: 900; }
.mana-page-shell { padding-top: 2rem; padding-bottom: 2rem; }
.mana-panel { border: 1px solid #e5e7eb; border-radius: 1.5rem; background: #fff; padding: clamp(1.1rem, 3vw, 2rem); }
.dark .mana-panel { border-color: #1f2937; background: #030712; }
.mana-prose { color: #4b5563; line-height: 2.1; font-size: .95rem; }
.mana-prose h2,.mana-prose h3,.mana-prose h4 { color: #111827; font-weight: 900; margin: 1.6rem 0 .7rem; }
.mana-prose p,.mana-prose ul,.mana-prose ol { margin: .8rem 0; }
.mana-prose img { max-width: 100%; height: auto; border-radius: 1rem; margin: 1.25rem auto; }
.dark .mana-prose { color: #9ca3af; }
.dark .mana-prose h2,.dark .mana-prose h3,.dark .mana-prose h4 { color: #f9fafb; }
.mana-input { width: 100%; border: 1px solid #d1d5db; border-radius: .9rem; background: #fff; padding: .8rem 1rem; color: #111827; outline: none; }
.mana-input:focus { border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,.12); }
.dark .mana-input { border-color: #374151; background: #111827; color: #f9fafb; }
.mana-btn-primary { display: inline-flex; min-height: 2.9rem; align-items: center; justify-content: center; border-radius: .9rem; background: #0f172a; padding: .7rem 1.4rem; color: #fff; font-size: .875rem; font-weight: 800; transition: .2s; }
.mana-btn-primary:hover { background: #2563eb; }
.mana-btn-secondary { display: inline-flex; min-height: 2.9rem; align-items: center; justify-content: center; border: 1px solid #d1d5db; border-radius: .9rem; padding: .7rem 1.4rem; color: #374151; font-size: .875rem; font-weight: 800; }
.dark .mana-btn-secondary { border-color: #374151; color: #e5e7eb; }
.mana-social { border: 1px solid #d1d5db; border-radius: .75rem; padding: .5rem .7rem; font-size: .7rem; }
.mana-tab { flex: 0 0 auto; border-bottom: 2px solid transparent; padding: .9rem 1rem; color: #6b7280; font-size: .8rem; font-weight: 800; }
.mana-tab.is-active { border-color: #2563eb; color: #2563eb; }
.mana-btn-primary:disabled { cursor: not-allowed; opacity: .5; }
.mana-filter-toggle { display: none; color: #2563eb; font-size: .72rem; font-weight: 800; }
.field-validation-error,.validation-summary-errors { color: #dc2626; font-size: .75rem; font-weight: 700; }
.input-validation-error { border-color: #ef4444 !important; }
[hidden] { display: none !important; }
@media (min-width: 1024px) {
    .mana-mobile-menu,.mana-mobile-overlay { display: none !important; }
    .mana-shop-grid { grid-template-columns: 280px minmax(0,1fr); }
    .mana-blog-grid { grid-template-columns: 250px minmax(0,1fr); }
}
@media (min-width: 1280px) { .mana-order-grid { grid-template-columns: minmax(0,1fr) 340px; } }
@media (max-width: 1023px) {
    .mana-filter-toggle { display: inline-flex; }
    .mana-filter-form { display: none; }
    .mana-filter-form.is-open { display: block; }
}
