:root {
    color-scheme: dark;
    --jlvc-bg: #020408;
    --jlvc-bg-raised: #07111d;
    --jlvc-panel: rgba(5, 10, 20, 0.92);
    --jlvc-panel-strong: #050a14;
    --jlvc-cyan: #00f3ff;
    --jlvc-blue: #0066ff;
    --jlvc-green: #00ff66;
    --jlvc-red: #ff3333;
    --jlvc-amber: #ffcc00;
    --jlvc-text: #e0e0e0;
    --jlvc-muted: #8aa7b5;
    --jlvc-border: rgba(0, 243, 255, 0.3);
    --jlvc-font: 'Arial Narrow', 'Segoe UI', sans-serif;
    --jlvc-mono: Consolas, 'Courier New', monospace;
}

::selection {
    color: #001014;
    background: var(--jlvc-cyan);
}

body {
    color: var(--jlvc-text) !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(0, 243, 255, 0.10), transparent 42%),
        var(--jlvc-bg) !important;
    font-family: var(--jlvc-font) !important;
    scrollbar-color: var(--jlvc-cyan) var(--jlvc-bg-raised);
}

body a {
    color: #67f8ff;
}

body a:hover {
    color: var(--jlvc-green);
}

.admin-container,
.page,
.login-card {
    color: var(--jlvc-text);
    font-family: var(--jlvc-font);
}

.admin-container h1,
.page h1,
.login-card .eyebrow {
    color: var(--jlvc-cyan) !important;
    font-family: var(--jlvc-mono);
    letter-spacing: 0.08em;
}

.admin-container .status-card,
.admin-container .config-section,
.admin-container .config-subsection,
.admin-container .config-workflow-panel,
.page .card,
.login-card {
    background: var(--jlvc-panel) !important;
    border-color: var(--jlvc-border) !important;
    box-shadow: 0 0 18px rgba(0, 243, 255, 0.08);
}

.admin-container input,
.admin-container select,
.admin-container textarea,
.page input,
.page select,
.page textarea,
.login-card input {
    color: var(--jlvc-text) !important;
    background: #030912 !important;
    border-color: #294256 !important;
}

.admin-container input:focus,
.admin-container select:focus,
.admin-container textarea:focus,
.page input:focus,
.page select:focus,
.page textarea:focus,
.login-card input:focus {
    border-color: var(--jlvc-cyan) !important;
    box-shadow: 0 0 0 2px rgba(0, 243, 255, 0.12);
    outline: none;
}

.admin-container button,
.admin-container .quick-join-button,
.admin-container .btn-logout,
.page button,
.page .button,
.login-card button {
    font-family: var(--jlvc-mono);
    border-color: var(--jlvc-border);
}

.admin-container .quick-join-button.primary,
.page button.primary,
.login-card button {
    color: #67f8ff !important;
    background: rgba(0, 243, 255, 0.11) !important;
    border-color: #00c7d2 !important;
}

.admin-container .quick-join-button.primary:hover,
.page button.primary:hover,
.login-card button:hover {
    background: rgba(0, 243, 255, 0.2) !important;
    box-shadow: 0 0 15px rgba(0, 243, 255, 0.18);
}

.page .tabs button.active {
    color: var(--jlvc-cyan) !important;
    background: rgba(0, 243, 255, 0.08) !important;
    border-color: var(--jlvc-cyan) !important;
}
