:root {
    --admin-bg: #07090a;
    --admin-bg-soft: #0b0d0f;
    --admin-panel: #101315;
    --admin-panel-2: #15181b;
    --admin-panel-3: #1a1e21;

    --admin-border: rgba(255, 255, 255, 0.075);
    --admin-border-strong: rgba(255, 179, 0, 0.26);

    --admin-text: #f6f7f8;
    --admin-text-soft: #aeb4b9;
    --admin-muted: #747b82;

    --admin-gold: #ffb000;
    --admin-gold-2: #ffca3a;
    --admin-orange: #ff7a00;

    --admin-green: #16d179;
    --admin-red: #ff4d55;
    --admin-blue: #3188ff;
    --admin-yellow: #ffbd2e;

    --admin-radius-sm: 10px;
    --admin-radius: 16px;
    --admin-radius-lg: 22px;

    --admin-sidebar-width: 258px;

    --admin-shadow:
        0 18px 48px rgba(0, 0, 0, 0.28);
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    min-height: 100%;
}

body {
    background:
        radial-gradient(
            circle at 82% 6%,
            rgba(255, 176, 0, 0.055),
            transparent 28%
        ),
        var(--admin-bg);

    color: var(--admin-text);

    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    -webkit-font-smoothing: antialiased;
}

button,
input,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

[hidden] {
    display: none !important;
}

.admin-card {
    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.017),
            rgba(255, 255, 255, 0)
        ),
        var(--admin-panel);

    border:
        1px solid var(--admin-border);

    border-radius:
        var(--admin-radius);

    box-shadow:
        var(--admin-shadow);
}

.admin-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;

    padding:
        22px 24px;

    border-bottom:
        1px solid var(--admin-border);
}

.admin-card-header.compact {
    padding-bottom: 18px;
}

.admin-card-header h2 {
    margin:
        4px 0 0;

    font-size:
        19px;

    line-height:
        1.2;

    letter-spacing:
        -0.02em;
}

.admin-card-header p {
    margin:
        6px 0 0;

    color:
        var(--admin-text-soft);

    font-size:
        13px;
}

.admin-card-eyebrow,
.admin-page-eyebrow,
.admin-login-eyebrow {
    color:
        var(--admin-gold);

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        0.13em;
}

.admin-primary-button {
    width:
        100%;

    min-height:
        48px;

    border:
        1px solid rgba(255, 207, 70, 0.7);

    border-radius:
        12px;

    background:
        linear-gradient(
            135deg,
            #ffca3a,
            #ff9f00
        );

    color:
        #171000;

    font-weight:
        800;

    box-shadow:
        0 10px 28px rgba(255, 176, 0, 0.16);

    transition:
        transform 0.15s ease,
        box-shadow 0.15s ease;
}

.admin-primary-button:hover {
    transform:
        translateY(-1px);

    box-shadow:
        0 14px 34px rgba(255, 176, 0, 0.23);
}

.admin-field {
    display:
        grid;

    gap:
        7px;
}

.admin-field > span {
    color:
        #d9dde0;

    font-size:
        12px;

    font-weight:
        650;
}

.admin-field-control {
    display:
        flex;

    align-items:
        center;

    min-height:
        46px;

    padding:
        0 13px;

    border:
        1px solid var(--admin-border);

    border-radius:
        11px;

    background:
        #171a1d;

    transition:
        border-color 0.15s ease,
        box-shadow 0.15s ease;
}

.admin-field-control:focus-within {
    border-color:
        rgba(255, 176, 0, 0.54);

    box-shadow:
        0 0 0 3px rgba(255, 176, 0, 0.07);
}

.admin-field-icon {
    width:
        26px;

    opacity:
        0.7;
}

.admin-field-control input {
    width:
        100%;

    border:
        0;

    outline:
        0;

    background:
        transparent;

    color:
        var(--admin-text);

    font-size:
        13px;
}

.admin-field-control input::placeholder {
    color:
        #666d73;
}

.admin-form-status {
    min-height:
        18px;

    color:
        var(--admin-text-soft);

    font-size:
        12px;
}

.admin-form-status.error {
    color:
        #ff7a80;
}

.admin-form-status.success {
    color:
        var(--admin-green);
}

.admin-login-gate {
    min-height:
        100vh;

    display:
        grid;

    place-items:
        center;

    padding:
        28px;

    background:
        radial-gradient(
            circle at 50% -10%,
            rgba(255, 176, 0, 0.12),
            transparent 34%
        ),
        #080a0b;
}

.admin-login-card {
    width:
        min(100%, 430px);

    padding:
        30px;

    border:
        1px solid var(--admin-border);

    border-radius:
        22px;

    background:
        linear-gradient(
            155deg,
            rgba(255, 176, 0, 0.035),
            transparent 30%
        ),
        #101315;

    box-shadow:
        0 30px 90px rgba(0, 0, 0, 0.46);
}

.admin-login-brand {
    display:
        flex;

    gap:
        14px;

    align-items:
        center;

    padding-bottom:
        24px;

    border-bottom:
        1px solid var(--admin-border);
}

.admin-login-brand-icon,
.admin-brand-symbol {
    display:
        grid;

    place-items:
        center;

    border:
        1px solid rgba(255, 191, 0, 0.54);

    background:
        linear-gradient(
            135deg,
            rgba(255, 176, 0, 0.22),
            rgba(255, 122, 0, 0.07)
        );

    color:
        var(--admin-gold-2);

    font-weight:
        900;

    box-shadow:
        inset 0 0 28px rgba(255, 176, 0, 0.04);
}

.admin-login-brand-icon {
    width:
        52px;

    height:
        52px;

    border-radius:
        15px;
}

.admin-login-brand h1 {
    margin:
        4px 0 2px;

    font-size:
        20px;
}

.admin-login-brand p {
    margin:
        0;

    color:
        var(--admin-text-soft);

    font-size:
        12px;
}

.admin-login-copy {
    padding:
        26px 0 18px;
}

.admin-login-copy h2 {
    margin:
        0;

    font-size:
        27px;

    letter-spacing:
        -0.035em;
}

.admin-login-copy p {
    margin:
        8px 0 0;

    color:
        var(--admin-text-soft);

    font-size:
        13px;

    line-height:
        1.6;
}

.admin-login-form {
    display:
        grid;

    gap:
        15px;
}

.admin-login-security {
    display:
        flex;

    gap:
        10px;

    align-items:
        center;

    margin-top:
        20px;

    padding:
        13px 14px;

    border:
        1px solid var(--admin-border);

    border-radius:
        11px;

    background:
        rgba(255, 255, 255, 0.018);

    color:
        var(--admin-text-soft);

    font-size:
        11px;

    line-height:
        1.45;
}