/* High-End Styling for StatPro */

:root {
    --emerald: #10b981;
    --emerald-dark: #059669;
}

body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* Custom Scrollbar for Logs */
.custom-scrollbar::-webkit-scrollbar {
    width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.2);
    border-radius: 2px;
}
.dark .custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(51, 65, 85, 0.5);
}

/* Preset Cards */
.preset-card {
    @apply border border-slate-100 dark:border-slate-800 bg-white dark:bg-slate-900 p-6 rounded-[24px] flex flex-col transition-all duration-300;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
}

.preset-card:hover {
    @apply border-emerald-200 dark:border-emerald-800 bg-emerald-50/10 dark:bg-emerald-900/10 -translate-y-1;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.02);
}

.preset-card.active {
    @apply border-emerald-500 bg-emerald-50/30 dark:bg-emerald-900/40 ring-4 ring-emerald-500/5;
}

.preset-card.active p {
    @apply text-emerald-900 dark:text-emerald-400;
}

.preset-icon {
    @apply w-10 h-10 rounded-xl flex items-center justify-center shrink-0 transition-transform duration-500;
}

.preset-card.active .preset-icon {
    @apply scale-110;
}

/* Console Box Shadow */
.console-box {
    animation: entrance 1s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes entrance {
    from {
        opacity: 0;
        transform: translateY(40px) scale(0.95);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Progress Indicator Circular Math */
#progress-indicator {
    stroke-dashoffset: 440; /* 2 * PI * r */
    transition: stroke-dashoffset 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Success Badge Animation */
#result-view .bg-emerald-50 {
    animation: badge-pop 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes badge-pop {
    0% { transform: scale(0.9); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

/* Floating Animation for Header Blobs */
.bg-emerald-100\/50 {
    animation: float 20s ease-in-out infinite alternate;
    filter: blur(100px);
}

@keyframes float {
    from { transform: translate(-10%, -10%) scale(1); }
    to { transform: translate(10%, 10%) scale(1.2); }
}

/* More Subtle Dots */
[background-size="32px_32px"] {
    mask-image: radial-gradient(white, transparent 80%);
}

/* Navigation Blur Persistence */
nav {
    border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}
.dark nav {
    border-bottom: 1px solid rgba(30, 41, 59, 0.8);
}

/* Utilities */
.text-transparent {
    -webkit-background-clip: text;
}