@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes bounceIn { 0% { opacity: 0; transform: scale(.85); } 65% { transform: scale(1.04); } 100% { opacity: 1; transform: scale(1); } }
@keyframes shake { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
@keyframes spark { 50% { opacity: .25; transform: translateY(-18px) rotate(7deg); } }
@keyframes scoreUp { from { stroke-dashoffset: 314; } to { stroke-dashoffset: var(--score-offset); } }
@keyframes confetti { 0% { opacity: 0; transform: translateY(-18px) rotate(0deg); } 20% { opacity: 1; } 100% { opacity: 0; transform: translateY(120px) rotate(190deg); } }
@keyframes float-up { 0% { opacity: 0; transform: translateY(100vh) rotate(0deg); } 10%, 90% { opacity: .18; } 100% { opacity: 0; transform: translateY(-10vh) rotate(360deg); } }
@keyframes skeleton { 0%, 100% { opacity: .4; } 50% { opacity: .82; } }
:root,
html,
body {
    color-scheme: light !important;
}
html.dark {
    color-scheme: light !important;
}
html,
body {
    background-color: #f9fafb !important;
    color: #1f2937 !important;
}
.math-spark { animation: spark 4s ease-in-out infinite; }
.math-float { animation: float-up linear infinite; color: white; font-size: 2rem; position: absolute; }
.math-float:nth-child(1) { animation-duration: 12s; left: 10%; }
.math-float:nth-child(2) { animation-delay: 2s; animation-duration: 15s; left: 25%; }
.math-float:nth-child(3) { animation-delay: 4s; animation-duration: 11s; left: 45%; }
.math-float:nth-child(4) { animation-delay: 1s; animation-duration: 14s; left: 65%; }
.math-float:nth-child(5) { animation-delay: 3s; animation-duration: 13s; left: 80%; }
.badge-confetti { animation: confetti 1.4s ease-out infinite; }
.stagger-children > * { animation: fadeIn .4s ease-out both; }
.stagger-children > *:nth-child(1) { animation-delay: .05s; }
.stagger-children > *:nth-child(2) { animation-delay: .1s; }
.stagger-children > *:nth-child(3) { animation-delay: .15s; }
.stagger-children > *:nth-child(4) { animation-delay: .2s; }
.stagger-children > *:nth-child(5) { animation-delay: .25s; }
body.exam-mode { -webkit-user-select: none; overscroll-behavior: none; user-select: none; }
body.exam-mode input, body.exam-mode textarea { -webkit-user-select: auto; user-select: auto; }
input, select, textarea { font-size: max(16px, 1em); }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]),
textarea,
select {
    color: #111827 !important;
    caret-color: #111827;
}
input::placeholder,
textarea::placeholder {
    color: #9ca3af !important;
    opacity: 1;
}
select option {
    background-color: #ffffff;
    color: #111827;
}
input:disabled,
textarea:disabled,
select:disabled {
    opacity: .75;
    cursor: not-allowed;
}
.bottom-bar { padding-bottom: env(safe-area-inset-bottom, 12px); }
[data-mobile-nav].mobile-nav-open { transform: translateY(0) !important; }
[data-admin-sidebar] { scrollbar-color: rgba(255,255,255,.24) transparent; scrollbar-width: thin; }
[data-admin-sidebar]::-webkit-scrollbar { width: 8px; }
[data-admin-sidebar]::-webkit-scrollbar-track { background: transparent; }
[data-admin-sidebar]::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 999px; }
/* The Tailwind CDN can miss project theme extensions on some WAMP/CSP/browser combinations. */
.bg-brand-50 { background-color: #eef2ff; }
.bg-brand-50\/40 { background-color: rgb(238 242 255 / .4); }
.bg-brand-200 { background-color: #c7d2fe; }
.bg-brand-400 { background-color: #818cf8; }
.bg-brand-500 { background-color: #6366f1; }
.bg-brand-600 { background-color: #4f46e5; }
.bg-brand-700 { background-color: #4338ca; }
.text-brand-100 { color: #e0e7ff; }
.text-brand-200 { color: #c7d2fe; }
.text-brand-300 { color: #a5b4fc; }
.text-brand-600 { color: #4f46e5; }
.text-brand-700 { color: #4338ca; }
.border-brand-100 { border-color: #e0e7ff; }
.border-brand-200 { border-color: #c7d2fe; }
.border-brand-300 { border-color: #a5b4fc; }
.border-brand-400 { border-color: #818cf8; }
.border-brand-500 { border-color: #6366f1; }
.border-brand-600 { border-color: #4f46e5; }
.border-brand-700 { border-color: #4338ca; }
.ring-brand-100 { --tw-ring-color: #e0e7ff; }
.ring-brand-200 { --tw-ring-color: #c7d2fe; }
.from-brand-500 { --tw-gradient-from: #6366f1 var(--tw-gradient-from-position); --tw-gradient-to: rgb(99 102 241 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-brand-700 { --tw-gradient-from: #4338ca var(--tw-gradient-from-position); --tw-gradient-to: rgb(67 56 202 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-brand-900 { --tw-gradient-from: #312e81 var(--tw-gradient-from-position); --tw-gradient-to: rgb(49 46 129 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.via-brand-600 { --tw-gradient-to: rgb(79 70 229 / 0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), #4f46e5 var(--tw-gradient-via-position), var(--tw-gradient-to); }
.to-brand-600 { --tw-gradient-to: #4f46e5 var(--tw-gradient-to-position); }
.to-brand-800 { --tw-gradient-to: #3730a3 var(--tw-gradient-to-position); }
.shadow-brand-500\/25 { --tw-shadow-color: rgb(99 102 241 / .25); --tw-shadow: var(--tw-shadow-colored); }
.hover\:bg-brand-50:hover { background-color: #eef2ff; }
.hover\:bg-brand-50\/40:hover { background-color: rgb(238 242 255 / .4); }
.hover\:bg-brand-700:hover { background-color: #4338ca; }
.hover\:border-brand-300:hover { border-color: #a5b4fc; }
.hover\:border-brand-400:hover { border-color: #818cf8; }
.focus\:border-brand-500:focus { border-color: #6366f1; }
.focus\:ring-brand-100:focus { --tw-ring-color: #e0e7ff; }
.bg-success-50 { background-color: #f0fdf4; }
.bg-success-500 { background-color: #22c55e; }
.bg-success-600 { background-color: #16a34a; }
.text-success-600 { color: #16a34a; }
.border-success-500 { border-color: #22c55e; }
.border-success-600 { border-color: #16a34a; }
.to-success-600 { --tw-gradient-to: #16a34a var(--tw-gradient-to-position); }
.bg-danger-50 { background-color: #fef2f2; }
.bg-danger-600 { background-color: #dc2626; }
.text-danger-500 { color: #ef4444; }
.text-danger-600 { color: #dc2626; }
.border-danger-100 { border-color: #fee2e2; }
.border-danger-500 { border-color: #ef4444; }
.border-danger-600 { border-color: #dc2626; }
.bg-warning-50 { background-color: #fffbeb; }
.bg-warning-500 { background-color: #f59e0b; }
.text-warning-500 { color: #f59e0b; }
.text-warning-600 { color: #d97706; }
.border-warning-500 { border-color: #f59e0b; }
html.dark,
html.dark body {
    background-color: #f9fafb !important;
    color: #1f2937 !important;
}
@media (prefers-color-scheme: dark) {
    html,
    body {
        background-color: #f9fafb !important;
        color: #1f2937 !important;
        color-scheme: light !important;
    }
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]),
    textarea,
    select {
        background-color: #ffffff !important;
        color: #111827 !important;
        caret-color: #111827 !important;
    }
}
@media print {
    header, nav, aside, button, [data-print-hidden], #toast-container { display: none !important; }
    body, main { background: white !important; color: #111827 !important; }
    details { display: block !important; break-inside: avoid; }
    summary { list-style: none; }
}