.admin-hub-wrap {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 10px 2px 20px;
}

.admin-hero-shell {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    flex-wrap: wrap;
    position: static;
    gap: 14px;
    border: 1px solid #315062;
    border-radius: 14px;
    padding: 14px 16px 28px;
    min-height: 156px;
    overflow: hidden;
    background:
        radial-gradient(120% 120% at 100% 0%, rgba(47, 144, 236, 0.18) 0%, rgba(47, 144, 236, 0) 62%),
        linear-gradient(180deg, #1f3a49 0%, #183140 100%);
}

.admin-hero-copy {
    min-width: 0;
    flex: 1 1 640px;
    max-width: 920px;
    align-self: flex-start;
}

.admin-kicker {
    margin: 0 0 4px;
    color: #89b9d8;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-title {
    margin: 0;
    color: #f2fbff;
    font-size: clamp(24px, 3.2vw, 50px);
    line-height: 1.12;
    letter-spacing: 0.01em;
    word-break: break-word;
}

.admin-subtitle {
    margin: 12px 0 0;
    max-width: 100%;
    color: #cde3f0;
    line-height: 1.42;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-hero-badge {
    min-width: 176px;
    flex: 0 0 auto;
    border: 1px solid #3f6176;
    border-radius: 12px;
    padding: 10px 12px;
    background: #173041;
    text-align: right;
}

.admin-hero-badge span {
    color: #87abc1;
    font-size: 12px;
}

.admin-hero-badge strong {
    display: block;
    color: #eaf8ff;
    font-size: 36px;
    line-height: 1;
    margin-top: 2px;
}

.admin-hero-badge small {
    color: #8db0c6;
    display: block;
    margin-top: 4px;
}

.admin-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    align-items: stretch;
}

.admin-console-panel {
    display: none;
}

.admin-console-panel.is-active {
    display: grid;
    gap: 14px;
}

.admin-metric-card {
    border: 1px solid #304d5f;
    border-radius: 12px;
    background: #17303f;
    padding: 12px;
    min-height: 118px;
    display: grid;
    align-content: start;
    gap: 6px;
}

.admin-metric-card small {
    display: block;
    color: #9ec0d5;
    font-size: 13px;
}

.admin-metric-value-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.admin-metric-card strong {
    color: #f2fbff;
    font-size: clamp(28px, 2.4vw, 40px);
    line-height: 1;
}

.admin-metric-card p {
    margin: 0;
    color: #b6cfde;
    font-size: 13px;
    line-height: 1.35;
}

.admin-trend {
    font-weight: 700;
    font-size: 12px;
    padding: 3px 7px;
    border-radius: 999px;
    white-space: nowrap;
}

.admin-trend.positive {
    color: #8ff2bf;
    background: rgba(45, 174, 109, 0.2);
}

.admin-trend.negative {
    color: #ffb1bd;
    background: rgba(208, 75, 98, 0.2);
}

.admin-trend.neutral {
    color: #cee1ee;
    background: rgba(78, 113, 134, 0.3);
}

.admin-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

.admin-bento-nav {
    border: 1px solid #315063;
    border-radius: 12px;
    background: #152f3f;
    padding: 12px;
    position: static;
    top: auto;
}

.admin-bento-nav h2 {
    margin: 0 0 8px;
    font-size: 18px;
    color: #ecf8ff;
}

.admin-nav-cluster + .admin-nav-cluster {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #2a4a5d;
}

.admin-nav-cluster p {
    margin: 0 0 6px;
    font-size: 12px;
    color: #93b9cf;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.admin-nav-cluster a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    border-radius: 8px;
    padding: 0 10px;
    color: #deedf6;
    text-decoration: none;
    border: 1px solid transparent;
    background: #1a3748;
    margin-bottom: 6px;
}

.admin-nav-cluster a:hover {
    border-color: #4f7e98;
    background: #224356;
}

.admin-nav-cluster a.is-active {
    border-color: #5ea4d8;
    background: #25526a;
}

.admin-nav-cluster i {
    width: 16px;
    text-align: center;
    color: #8dc4e2;
}

.admin-panel {
    border: 1px solid #315063;
    border-radius: 12px;
    background: #183242;
    padding: 14px;
    min-width: 0;
}

.admin-panel-head h2 {
    margin: 0;
    color: #eef8ff;
    font-size: 28px;
    line-height: 1.1;
}

.admin-panel-head p {
    margin: 6px 0 0;
    color: #b5cede;
    line-height: 1.35;
}

.admin-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 12px;
}

.admin-field {
    display: grid;
    gap: 6px;
}

.admin-field-wide {
    grid-column: 1 / -1;
}

.admin-field span {
    color: #d5e8f5;
    font-size: 13px;
}

.admin-field input,
.admin-field select {
    box-sizing: border-box;
    min-height: 42px;
    width: 100%;
    border: 1px solid #4b6d82;
    border-radius: 8px;
    background: #102d3e;
    color: #f3fbff;
    padding: 0 10px;
    font-size: 15px;
}

.admin-primary-btn,
.admin-secondary-btn {
    min-height: 42px;
    border-radius: 9px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.admin-primary-btn {
    margin-top: 12px;
    width: 100%;
    border: 1px solid #54a0e8;
    background: linear-gradient(180deg, #348ee7 0%, #2a77cb 100%);
    color: #eef8ff;
}

.admin-secondary-btn {
    border: 1px solid #4f7e98;
    background: #224356;
    color: #dbedf8;
    padding: 0 14px;
}

.admin-quick-actions {
    margin-top: 10px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.admin-quick-btn {
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid #4e748a;
    border-radius: 8px;
    background: #2a4a5d;
    color: #e5f2fa;
    font-weight: 700;
    cursor: pointer;
}

.admin-quick-btn:hover {
    background: #325b72;
}

.admin-balance-strip {
    margin-top: 12px;
    border: 1px solid #345669;
    border-radius: 10px;
    background: #123041;
    padding: 10px;
    display: grid;
    gap: 8px;
}

.admin-balance-strip > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.admin-balance-strip span {
    color: #b5cede;
}

.admin-balance-strip strong {
    color: #ecf8ff;
}

.admin-feedback {
    margin: 10px 0 0;
    min-height: 18px;
    color: #9ed8ff;
    font-weight: 700;
    font-size: 13px;
}

.admin-checklist {
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 9px;
}

.admin-checklist li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #d5e7f2;
}

.admin-checklist .dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block;
}

.admin-checklist .dot.green { background: #31d97a; }
.admin-checklist .dot.amber { background: #f2b64b; }
.admin-checklist .dot.red { background: #ff6b7f; }

.admin-live-log {
    margin-top: 12px;
    border: 1px solid #345669;
    border-radius: 10px;
    background: #112e3d;
    padding: 10px;
    display: grid;
    gap: 8px;
}

.admin-live-head {
    margin: 0;
    color: #cde4f3;
    font-weight: 700;
    font-size: 13px;
}

.admin-log-row {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 8px;
    align-items: start;
    color: #c5dae8;
    font-size: 13px;
    line-height: 1.35;
}

.admin-log-row .time {
    color: #85b5cf;
    font-weight: 700;
}

.admin-tools-shell {
    display: grid;
    gap: 12px;
}

.admin-tab-nav {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.admin-tab-btn {
    min-height: 36px;
    padding: 0 12px;
    border-radius: 8px;
    border: 1px solid #4f7085;
    background: #1c394a;
    color: #cfe4f2;
    font-weight: 700;
    cursor: pointer;
}

.admin-tab-btn.is-active {
    border-color: #5aa7df;
    background: #26556e;
    color: #eff9ff;
}

.admin-tab-panel {
    display: none;
}

.admin-tab-panel.is-active {
    display: block;
}

.admin-users-toolbar {
    display: flex;
    gap: 10px;
    align-items: end;
    margin-bottom: 10px;
}

.admin-users-search {
    flex: 1;
}

.admin-users-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #355669;
    border-radius: 10px;
    background: #112e3d;
}

.admin-users-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 860px;
}

.admin-users-table th,
.admin-users-table td {
    padding: 10px;
    border-bottom: 1px solid #27485c;
    text-align: left;
    font-size: 13px;
    color: #d3e6f2;
    white-space: nowrap;
}

.admin-users-table th {
    color: #9cc0d6;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 12px;
}

.admin-users-empty {
    text-align: center;
    color: #9ec0d5;
}

.admin-role-pill,
.admin-status-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.admin-role-pill.admin {
    color: #ffdf9f;
    background: rgba(216, 144, 50, 0.2);
}

.admin-role-pill.user {
    color: #b6d8f2;
    background: rgba(71, 130, 173, 0.25);
}

.admin-status-pill.active {
    color: #a4efc8;
    background: rgba(47, 155, 97, 0.22);
}

.admin-status-pill.inactive {
    color: #ffc2cc;
    background: rgba(194, 66, 89, 0.2);
}

.admin-tools-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.admin-tool-card {
    border: 1px solid #315062;
    border-radius: 12px;
    background: #173141;
    padding: 12px;
    display: grid;
    gap: 10px;
    min-height: 150px;
}

.admin-tool-card h3 {
    margin: 0;
    color: #eef8ff;
}

.admin-tool-card p {
    margin: 0;
    color: #bed5e4;
    font-size: 14px;
    line-height: 1.35;
}

.admin-tool-card button {
    min-height: 36px;
    border-radius: 8px;
    border: 1px dashed #5d7e93;
    background: #274556;
    color: #aac6d8;
    font-weight: 700;
}

.admin-toast {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 2400;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid #4f8d6b;
    border-radius: 10px;
    background: rgba(27, 69, 50, 0.95);
    color: #dcffef;
    font-weight: 700;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.admin-toast.show {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 1220px) {
    .admin-main-grid {
        grid-template-columns: 1fr 1fr;
    }

    .admin-bento-nav {
        grid-column: 1 / -1;
        position: static;
    }
}

@media (max-width: 1080px) {
    .admin-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-hero-badge {
        text-align: left;
    }
}

@media (max-width: 780px) {
    .admin-metrics-grid,
    .admin-main-grid,
    .admin-form-grid,
    .admin-tools-grid {
        grid-template-columns: 1fr;
    }

    .admin-title {
        font-size: clamp(30px, 9vw, 48px);
    }

    .admin-subtitle {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    .admin-users-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-secondary-btn {
        width: 100%;
    }

}