:root {
    --app-bg: #0f1216;
    --glass: rgba(255,255,255,0.04);
    --glass-border: rgba(255,255,255,0.08);
}
.bg-app { background: radial-gradient(1200px 600px at -10% -10%, #17202b 0%, var(--app-bg) 60%) fixed; }
.bg-navbar { background-color: rgba(18, 22, 27, 0.95) !important; backdrop-filter: saturate(120%) blur(6px); }

.card-glass {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow: 0 6px 18px rgba(0,0,0,0.35);
}

a.nav-link.active { font-weight: 600; }

.table-modern {
    --bs-table-bg: transparent;
    border-color: var(--glass-border);
}
.table-modern thead th {
    position: sticky; top: 0; z-index: 1;
    background: rgba(0,0,0,0.2);
    backdrop-filter: blur(3px);
}
.table-modern tbody tr:hover {
    background: rgba(255,255,255,0.03);
}

.input-group .form-control, .form-select, .form-control {
    background-color: rgba(0,0,0,0.2);
    border-color: var(--glass-border);
    color: #e6e6e6;
}
.input-group-text {
    background: rgba(0,0,0,0.25);
    border-color: var(--glass-border);
    color: #c9c9c9;
}

.badge-soft {
    background: rgba(255,255,255,0.08);
    border: 1px solid var(--glass-border);
    color: #e6e6e6;
}

.btn-ghost {
    background: transparent;
    border: 1px solid var(--glass-border);
    color: #e6e6e6;
}
.btn-ghost:hover {
    background: rgba(255,255,255,0.06);
}

.code-block {
    background: rgba(0,0,0,0.35);
    border: 1px solid var(--glass-border);
    border-radius: .5rem;
    padding: .75rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    color: #e0e0e0;
    overflow: auto;
}

.json-key { color: #9cdcfe; }
.json-string { color: #ce9178; }
.json-number { color: #b5cea8; }
.json-boolean { color: #569cd6; }
.json-null { color: #808080; }