:root {
    color-scheme: light;
    --nc-bg: #0f172a;
    --nc-accent: #22c55e;
    --nc-card: #ffffff;
    --nc-text: #1f2937;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: system-ui, -apple-system, Segoe UI, sans-serif;
    background: #f4f6f8;
    color: var(--nc-text);
}

.topbar {
    background: var(--nc-bg);
    color: #fff;
    padding: 1rem 1.5rem;
    font-weight: 700;
}

.topbar a { color: #fff; text-decoration: none; }

main {
    max-width: 480px;
    margin: 3rem auto;
    padding: 0 1rem;
}

.auth-card {
    background: var(--nc-card);
    padding: 2rem;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,.1);
}

.auth-card label {
    display: block;
    margin-bottom: 1rem;
    font-size: .9rem;
}

.auth-card input, .auth-card select {
    width: 100%;
    padding: .6rem;
    margin-top: .3rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
}

.auth-card button {
    background: var(--nc-accent);
    color: #fff;
    border: none;
    padding: .7rem 1.2rem;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
}

.error { color: #dc2626; font-size: .9rem; }

.footer {
    text-align: center;
    color: #6b7280;
    font-size: .8rem;
    padding: 2rem 0;
}

.status-badge.ok::before { content: "🟢 "; }
.status-badge.off::before { content: "🔴 "; }