/* /public_html/style.css */
:root {
    --beast-bg-main: #0a0a0a;
    --beast-bg-secondary: #1a1a1a;
    --beast-card-bg: rgba(0, 123, 255, 0.05); /* Very subtle transparent blue */
    --beast-card-border: rgba(0, 123, 255, 0.3);
    --beast-card-flash: rgba(0, 123, 255, 0.8);
    --beast-text-main: #e0e0e0;
    --beast-text-muted: #888888;
    --beast-accent: #007bff;
}

body {
    background-color: var(--beast-bg-main);
    color: var(--beast-text-main);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Base Card Styling - used on both public and admin sides */
.beast-card {
    background-color: var(--beast-card-bg);
    border: 1px solid var(--beast-card-border);
    border-radius: 8px;
    transition: all 0.3s ease;
    overflow: hidden;
}

/* Time-based Flipper Flash Effect */
.beast-card.flash-active {
    border-color: var(--beast-card-flash);
    box-shadow: 0 0 15px var(--beast-card-flash);
}