body {

    margin: 0;

    font-family:
        Inter,
        Arial,
        sans-serif;

    background:
        #07111f;

    color:
        #eef6ff;
}

a {
    color: inherit;
    text-decoration: none;
}

.admin-shell {

    display: grid;

    grid-template-columns:
        260px 1fr;

    min-height: 100vh;
}

.admin-sidebar {

    padding: 28px;

    background:
        rgba(255,255,255,.06);

    border-right:
        1px solid rgba(255,255,255,.12);
}

.admin-sidebar h2 {
    margin-top: 0;
}

.admin-sidebar nav {

    display: grid;

    gap: 10px;
}

.admin-sidebar a {

    padding:
        12px 14px;

    border-radius:
        14px;

    background:
        rgba(255,255,255,.06);
}

.admin-main {

    padding: 34px;
}

.card {

    background:
        rgba(255,255,255,.08);

    border:
        1px solid rgba(255,255,255,.14);

    border-radius:
        24px;

    padding:
        24px;

    box-shadow:
        0 24px 70px rgba(0,0,0,.35);
}

.grid {

    display: grid;

    gap: 18px;
}

.dashboard-grid {

    grid-template-columns:
        repeat(3, 1fr);
}

input,
select,
textarea {

    width: 100%;

    padding:
        13px 15px;

    border-radius:
        14px;

    border:
        1px solid rgba(255,255,255,.18);

    background:
        rgba(255,255,255,.08);

    color: #fff;
}

textarea {

    min-height: 160px;
}

label {

    display: grid;

    gap: 8px;

    font-weight: 700;
}

.form-grid {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 18px;
}

.full {

    grid-column:
        1 / -1;
}

.btn {

    display: inline-flex;

    border: 0;

    border-radius:
        999px;

    padding:
        12px 18px;

    background:
        linear-gradient(
            135deg,
            #163765,
            #7ab8ff
        );

    color: #fff;

    font-weight: 800;

    cursor: pointer;
}

.table {

    width: 100%;

    border-collapse: collapse;
}

.table th,
.table td {

    padding: 14px;

    border-bottom:
        1px solid rgba(255,255,255,.12);

    text-align: left;
}

.badge {

    padding:
        6px 10px;

    border-radius:
        999px;

    background:
        rgba(122,184,255,.18);
}

.login-page {

    min-height: 100vh;

    display: grid;

    place-items: center;

    padding: 20px;
}

.login-box {

    width:
        min(
            420px,
            100%
        );
}

@media (max-width: 800px) {

    .admin-shell {

        grid-template-columns:
            1fr;
    }

    .dashboard-grid,
    .form-grid {

        grid-template-columns:
            1fr;
    }
}