:root {
    color-scheme: dark;
    --bg:#050d17;
    --panel:#0a1828;
    --panel2:#0d2135;
    --border:rgba(126,170,205,.16);
    --text:#edf6ff;
    --muted:#8199ad;
    --cyan:#64ddff;
    --green:#72e39a;
    --red:#ff8092;
    --purple:#c9a4ff;
}

* { box-sizing:border-box; }

html,body {
    margin:0;
    min-height:100%;
    background:
        radial-gradient(circle at 12% 0%, rgba(68,160,220,.09), transparent 27rem),
        radial-gradient(circle at 90% 4%, rgba(169,110,255,.08), transparent 25rem),
        var(--bg);
    color:var(--text);
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

a { color:inherit; }

.qf-topbar {
    min-height:72px;
    padding:16px clamp(18px,4vw,54px);
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid var(--border);
    background:rgba(5,13,23,.82);
}

.qf-brand {
    color:var(--cyan);
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.qf-kicker,
.qf-eyebrow,
.qf-card-label {
    margin-top:3px;
    color:var(--muted);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.qf-main {
    width:min(1220px,calc(100% - 32px));
    margin:30px auto 60px;
}

.qf-hero {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:25px;
    padding:28px;
    border:1px solid var(--border);
    border-radius:22px;
    background:linear-gradient(145deg,rgba(13,33,53,.94),rgba(7,18,31,.94));
}

.qf-hero h1 {
    margin:8px 0 6px;
    font-size:clamp(2rem,5vw,3.4rem);
}

.qf-hero p {
    max-width:720px;
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.qf-counter {
    min-width:120px;
    text-align:center;
}

.qf-counter strong {
    display:block;
    color:var(--purple);
    font-size:2.5rem;
}

.qf-counter span {
    color:var(--muted);
    font-size:.8rem;
}

.qf-toolbar {
    margin-top:18px;
    padding:17px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    border:1px solid var(--border);
    border-radius:16px;
    background:rgba(10,24,40,.7);
}

.qf-toolbar strong,
.qf-toolbar span {
    display:block;
}

.qf-toolbar span {
    margin-top:3px;
    color:var(--muted);
    font-size:.8rem;
}

.qf-grid {
    margin-top:18px;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
    gap:18px;
}

.qf-card,
.qf-empty {
    padding:22px;
    border:1px solid var(--border);
    border-radius:18px;
    background:linear-gradient(145deg,rgba(13,33,53,.88),rgba(6,17,29,.94));
    box-shadow:0 18px 45px rgba(0,0,0,.18);
}

.qf-card-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:15px;
}

.qf-card h2 {
    margin:5px 0 0;
    font-size:1.55rem;
}

.qf-mode {
    padding:6px 9px;
    border:1px solid rgba(100,221,255,.18);
    border-radius:999px;
    background:rgba(100,221,255,.06);
    color:var(--cyan);
    font-size:.72rem;
    font-weight:900;
}

.qf-status-grid {
    margin-top:20px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
}

.qf-status-grid > div {
    padding:11px 12px;
    border:1px solid rgba(126,170,205,.10);
    border-radius:12px;
    background:rgba(0,0,0,.12);
}

.qf-status-grid span,
.qf-status-grid strong {
    display:block;
}

.qf-status-grid span {
    color:var(--muted);
    font-size:.7rem;
}

.qf-status-grid strong {
    margin-top:5px;
    font-size:.76rem;
}

.is-active { color:var(--green); }
.is-inactive { color:var(--red); }

.qf-card-actions {
    margin-top:18px;
    display:flex;
    gap:9px;
}

.qf-btn {
    appearance:none;
    border:1px solid rgba(100,221,255,.25);
    border-radius:10px;
    padding:9px 13px;
    background:rgba(100,221,255,.08);
    color:#dff8ff;
    font:inherit;
    font-size:.78rem;
    font-weight:800;
    text-decoration:none;
    cursor:pointer;
}

.qf-btn:hover {
    background:rgba(100,221,255,.13);
}

.qf-btn-ghost {
    border-color:var(--border);
    background:rgba(255,255,255,.03);
    color:#b7c9d8;
}

.qf-btn:disabled {
    opacity:.38;
    cursor:not-allowed;
}

.qf-roadmap {
    margin-top:18px;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.qf-roadmap > div {
    padding:15px;
    border:1px solid var(--border);
    border-radius:13px;
    background:rgba(10,24,40,.52);
}

.qf-roadmap strong,
.qf-roadmap span {
    display:block;
}

.qf-roadmap span {
    margin-top:4px;
    color:var(--muted);
    font-size:.76rem;
    line-height:1.45;
}

.qf-login-body {
    min-height:100vh;
}

.qf-login-wrap {
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:20px;
}

.qf-login-card {
    width:min(100%,430px);
    padding:28px;
    border:1px solid var(--border);
    border-radius:20px;
    background:linear-gradient(145deg,rgba(13,33,53,.96),rgba(6,17,29,.97));
    box-shadow:0 30px 80px rgba(0,0,0,.35);
}

.qf-login-card h1 {
    margin:22px 0 5px;
    font-size:2rem;
}

.qf-login-card p,
.qf-login-note {
    color:var(--muted);
    font-size:.8rem;
    line-height:1.5;
}

.qf-login-card form {
    margin-top:22px;
    display:grid;
    gap:10px;
}

.qf-login-card label {
    margin-top:4px;
    color:#b7c9d8;
    font-size:.75rem;
    font-weight:800;
}

.qf-login-card input {
    width:100%;
    border:1px solid rgba(126,170,205,.18);
    border-radius:10px;
    padding:11px 12px;
    background:#06111e;
    color:var(--text);
    outline:none;
}

.qf-login-card input:focus {
    border-color:rgba(100,221,255,.46);
}

.qf-login-card button {
    margin-top:7px;
}

.qf-login-note {
    margin-top:18px;
}

.qf-alert {
    margin-top:15px;
    padding:10px 12px;
    border-radius:10px;
    font-size:.78rem;
}

.qf-alert-error {
    border:1px solid rgba(255,128,146,.26);
    background:rgba(255,128,146,.07);
    color:#ffc0c9;
}

@media (max-width:700px) {
    .qf-hero,
    .qf-toolbar,
    .qf-card-head {
        align-items:flex-start;
        flex-direction:column;
    }

    .qf-counter {
        text-align:left;
    }

    .qf-status-grid,
    .qf-roadmap {
        grid-template-columns:1fr;
    }

    .qf-card-actions {
        flex-wrap:wrap;
    }
}


/* QSOFORGE_ADMIN_02A_CSS */

.qf-admin-head-actions {
    display:flex;
    align-items:center;
    gap:9px;
    flex-wrap:wrap;
}

.qf-manage-grid {
    margin-top:18px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}

.qf-manage-wide {
    grid-column:1 / -1;
}

.qf-detail-row {
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border-bottom:1px solid rgba(126,170,205,.10);
}

.qf-detail-row:last-child {
    border-bottom:0;
}

.qf-detail-row span {
    color:var(--muted);
    font-size:.78rem;
}

.qf-detail-row strong {
    text-align:right;
    font-size:.8rem;
}

.qf-card-copy {
    margin:12px 0 0;
    color:var(--muted);
    line-height:1.55;
    font-size:.8rem;
}

.qf-control-actions {
    margin-top:18px;
    display:flex;
    align-items:center;
    gap:9px;
    flex-wrap:wrap;
}

.qf-control-actions form {
    margin:0;
}

.qf-btn-danger {
    border-color:rgba(255,128,146,.30);
    background:rgba(255,128,146,.08);
    color:#ffc0c9;
}

.qf-btn-danger:hover {
    background:rgba(255,128,146,.14);
}

.qf-btn-warn {
    border-color:rgba(255,205,120,.28);
    background:rgba(255,205,120,.07);
    color:#ffe0a8;
}

.qf-btn-warn:hover {
    background:rgba(255,205,120,.12);
}

.qf-service-list {
    margin-top:12px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:24px;
}

.qf-secret-card {
    margin-top:18px;
    padding:22px;
    border:1px solid rgba(114,227,154,.30);
    border-radius:16px;
    background:rgba(114,227,154,.06);
}

.qf-secret-value {
    margin-top:12px;
    padding:14px;
    border-radius:10px;
    background:#041018;
    font-family:monospace;
    font-size:1.25rem;
    font-weight:900;
    letter-spacing:.05em;
    word-break:break-all;
}

.qf-secret-card p {
    margin:10px 0 0;
    color:var(--muted);
    font-size:.78rem;
}

.qf-alert-ok {
    border:1px solid rgba(114,227,154,.26);
    background:rgba(114,227,154,.07);
    color:#a8f3c0;
}

@media (max-width:760px) {
    .qf-manage-grid {
        grid-template-columns:1fr;
    }

    .qf-manage-wide {
        grid-column:auto;
    }

    .qf-service-list {
        grid-template-columns:1fr;
    }

    .qf-detail-row {
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
        padding:10px 0;
    }

    .qf-detail-row strong {
        text-align:left;
    }
}


/* ==========================================================
   QSOForge DVSwitch Server - Admin Background
   ========================================================== */

html,
body {
    background:
        linear-gradient(
            rgba(3, 8, 18, 0.72),
            rgba(3, 8, 18, 0.88)
        ),
        url('/_qsoforge/img/qsoforge-dvswitch-server-bg.png')
        center center / cover fixed no-repeat;
}

.qf-login-body {
    background:
        linear-gradient(
            rgba(3, 8, 18, 0.65),
            rgba(3, 8, 18, 0.82)
        ),
        url('/_qsoforge/img/qsoforge-dvswitch-server-bg.png')
        center center / cover fixed no-repeat;
}