:root {
    --dashboard-panel: rgba(59, 64, 77, 0.7);
    --dashboard-panel-deep: rgba(18, 22, 29, 0.78);
    --dashboard-line: rgba(255, 255, 255, 0.11);
    --dashboard-line-strong: rgba(255, 255, 255, 0.19);
    --dashboard-text: #f5f8fb;
    --dashboard-muted: rgba(226, 235, 241, 0.62);
    --dashboard-cyan: #4fd4ee;
    --dashboard-pink: #fcacd3;
    --dashboard-green: #00ffa3;
}

.dashboard-body {
    color: var(--dashboard-text);
}

.dashboard-main {
    width: min(100% - 1.5rem, 1500px);
    max-width: 1500px;
}

.dashboard-toolbar,
.dashboard-toolbar-copy,
.dashboard-toolbar-side,
.dashboard-login-copy,
.dashboard-login-account-copy,
.dashboard-identity,
.dashboard-nameplate,
.dashboard-channel-toolbar,
.dashboard-channel-summary,
.dashboard-content,
.dashboard-section-header,
.dashboard-manager-card {
    text-align: left;
}

.dashboard-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(18px, 3vw, 44px);
    margin-bottom: 10px;
}

.dashboard-toolbar-copy {
    display: flex;
    align-items: center;
    min-width: 0;
}

.dashboard-eyebrow {
    margin: 0;
    color: var(--dashboard-pink);
    font-family: "TarkovBoard Bender", sans-serif;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.dashboard-toolbar-copy h1 {
    margin: 0 0 4px;
    font-size: clamp(1.18rem, 2.1vw, 1.65rem);
}

.dashboard-toolbar-copy span,
.dashboard-section-header span {
    color: var(--dashboard-muted);
}

.dashboard-text-link {
    flex: 0 0 auto;
    color: #c8f6ff;
    font-weight: 700;
    text-decoration: none;
}

.dashboard-text-link:hover,
.dashboard-text-link:focus-visible {
    color: #fff;
}

.dashboard-toolbar-side,
.dashboard-login-account {
    display: flex;
    align-items: center;
}

.dashboard-toolbar-side {
    flex: 0 0 auto;
    gap: 18px;
}

.dashboard-login-account {
    gap: 10px;
    border-right: 1px solid var(--dashboard-line);
    padding-right: 18px;
}

.dashboard-login-avatar {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    overflow: hidden;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 11px;
    background: rgba(10, 14, 20, 0.5);
}

.dashboard-login-avatar img {
    width: 70%;
    height: 70%;
    object-fit: contain;
}

.dashboard-login-avatar.has-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dashboard-login-account-copy {
    display: grid;
    min-width: 110px;
}

.dashboard-login-account-copy span {
    color: var(--dashboard-muted);
    font-size: 0.7rem;
}

.dashboard-login-account-copy strong {
    overflow: hidden;
    font-size: 0.9rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-logout-button {
    min-height: 34px;
    padding: 5px 10px;
    font-size: 0.76rem;
}

.dashboard-alert {
    margin: 10px 0;
    border: 1px solid rgba(255, 125, 145, 0.4);
    border-radius: 14px;
    padding: 13px 16px;
    color: #ffe6eb;
    background: rgba(93, 31, 45, 0.62);
}

.dashboard-login-panel,
.dashboard-panel {
    width: calc(100% - 1.5rem);
    margin: 10px auto 0;
    border: 1px solid var(--dashboard-line);
    border-radius: 20px;
    background: var(--dashboard-panel);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.48);
    overflow: hidden;
    backdrop-filter: blur(9px);
}

.dashboard-login-panel {
    display: grid;
    grid-template-columns: minmax(250px, 0.8fr) minmax(320px, 1.2fr);
    min-height: 480px;
}

.dashboard-login-visual {
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-right: 1px solid var(--dashboard-line);
    background:
        radial-gradient(circle at 50% 45%, rgba(0, 255, 163, 0.16), transparent 42%),
        linear-gradient(145deg, rgba(79, 212, 238, 0.1), rgba(252, 172, 211, 0.04)),
        rgba(12, 17, 23, 0.58);
}

.dashboard-login-visual::before,
.dashboard-login-visual::after {
    content: "";
    position: absolute;
    width: 330px;
    height: 330px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 50%;
}

.dashboard-login-visual::after {
    width: 230px;
    height: 230px;
    border-color: rgba(79, 212, 238, 0.14);
}

.dashboard-login-visual img {
    position: relative;
    z-index: 2;
    width: 118px;
    height: 118px;
    border-radius: 28px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.48), 0 0 36px rgba(0, 255, 163, 0.16);
}

.dashboard-login-orbit {
    position: absolute;
    z-index: 1;
    width: 182px;
    height: 182px;
    border: 1px solid rgba(0, 255, 163, 0.32);
    border-radius: 50%;
    box-shadow: inset 0 0 35px rgba(0, 255, 163, 0.06);
}

.dashboard-login-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(28px, 5vw, 64px);
}

.dashboard-login-copy h2 {
    margin: 9px 0 12px;
    font-size: clamp(1.55rem, 3.2vw, 2.3rem);
}

.dashboard-login-copy > p:not(.dashboard-eyebrow) {
    max-width: 650px;
    color: var(--dashboard-muted);
    line-height: 1.72;
}

.dashboard-login-points {
    display: grid;
    gap: 8px;
    margin: 15px 0 25px;
    padding: 0;
    list-style: none;
}

.dashboard-login-points li {
    position: relative;
    padding-left: 22px;
    color: rgba(244, 248, 251, 0.82);
}

.dashboard-login-points li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 0.55em;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--dashboard-green);
    box-shadow: 0 0 10px rgba(0, 255, 163, 0.6);
}

.dashboard-primary-button,
.dashboard-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    border-radius: 10px;
    padding: 9px 15px;
    font-weight: 800;
    text-decoration: none;
    transition: transform 140ms ease, border-color 140ms ease, background 140ms ease, opacity 140ms ease;
}

.dashboard-primary-button {
    border: 1px solid rgba(79, 212, 238, 0.56);
    color: #081218;
    background: linear-gradient(135deg, var(--dashboard-cyan), #9cecf6);
    box-shadow: 0 8px 24px rgba(79, 212, 238, 0.14);
}

.dashboard-secondary-button {
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #f0f5f8;
    background: rgba(255, 255, 255, 0.055);
}

.dashboard-primary-button:hover,
.dashboard-primary-button:focus-visible,
.dashboard-secondary-button:hover,
.dashboard-secondary-button:focus-visible {
    transform: translateY(-1px);
    text-decoration: none;
}

.dashboard-primary-button:disabled,
.dashboard-secondary-button:disabled {
    cursor: default;
    opacity: 0.43;
    transform: none;
}

.dashboard-login-button img {
    width: 22px;
    height: 22px;
    border-radius: 5px;
}

.dashboard-login-button {
    border-color: #00e58f;
    color: #04110c;
    background: linear-gradient(135deg, #00ffa3, #00e58f);
    box-shadow: 0 10px 26px rgba(0, 255, 163, 0.2);
}

.dashboard-login-button:hover,
.dashboard-login-button:focus-visible {
    border-color: #55ffc1;
    color: #020b07;
    background: linear-gradient(135deg, #35ffb7, #00f095);
}

.dashboard-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: clamp(16px, 2vw, 26px);
    padding: clamp(18px, 2.3vw, 28px);
    border-bottom: 1px solid var(--dashboard-line);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.065), rgba(17, 21, 28, 0.32));
}

.dashboard-avatar {
    display: grid;
    place-items: center;
    width: 96px;
    aspect-ratio: 1;
    overflow: hidden;
    border: 1px solid rgba(238, 242, 246, 0.22);
    border-radius: 20px;
    background:
        radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.16), transparent 58%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(15, 19, 26, 0.74));
    box-shadow: inset 0 0 26px rgba(255, 255, 255, 0.08), 0 16px 34px rgba(0, 0, 0, 0.28);
}

.dashboard-avatar img {
    width: 72%;
    height: 72%;
    object-fit: contain;
}

.dashboard-avatar-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dashboard-nameplate {
    min-width: 0;
}

.dashboard-identity-kicker {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 8px;
    color: var(--dashboard-muted);
    font-weight: 700;
    letter-spacing: 0.12em;
}

.dashboard-verified,
.dashboard-role-badge,
.dashboard-count-badge {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    border: 1px solid rgba(79, 212, 238, 0.28);
    border-radius: 999px;
    padding: 3px 9px;
    color: #caf8ff;
    background: rgba(79, 212, 238, 0.1);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.dashboard-name-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.dashboard-name-row h2 {
    margin: 0;
    font-size: clamp(1.5rem, 3vw, 2.2rem);
}

.dashboard-name-row code {
    display: block;
    margin-top: 4px;
    color: rgba(205, 220, 229, 0.58);
    font-size: 0.76rem;
}

.dashboard-profile-meta {
    margin: 10px 0 0;
    color: var(--dashboard-muted);
}

.dashboard-channel-toolbar {
    display: grid;
    grid-template-columns: minmax(230px, 0.8fr) minmax(210px, 1fr) auto;
    align-items: end;
    gap: 16px;
    padding: 18px clamp(20px, 2.8vw, 36px);
    border-bottom: 1px solid var(--dashboard-line);
    background: rgba(10, 14, 20, 0.36);
}

.dashboard-channel-select-group label,
#dashboardCommandForm label,
.dashboard-cooldown-panel label {
    display: grid;
    gap: 7px;
    color: rgba(229, 237, 242, 0.72);
    font-size: 0.82rem;
    font-weight: 700;
}

.dashboard-channel-select-group select,
#dashboardCommandForm input,
.dashboard-cooldown-panel input {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 10px;
    padding: 9px 12px;
    color: var(--dashboard-text);
    background: rgba(7, 11, 16, 0.68);
    outline: none;
}

.dashboard-channel-select-group select:focus,
#dashboardCommandForm input:focus,
.dashboard-cooldown-panel input:focus {
    border-color: rgba(79, 212, 238, 0.64);
    box-shadow: 0 0 0 3px rgba(79, 212, 238, 0.1);
}

.dashboard-channel-summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    min-height: 42px;
}

.dashboard-toolbar-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.dashboard-save-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

#dashboardSaveButton.is-saving .dashboard-save-dot {
    animation: dashboard-save-pulse 700ms ease-in-out infinite alternate;
}

@keyframes dashboard-save-pulse {
    to { opacity: 0.28; transform: scale(0.72); }
}

.dashboard-content {
    padding: 0 clamp(20px, 2.8vw, 36px);
}

.dashboard-section {
    padding: clamp(25px, 3.6vw, 46px) 0;
    border-bottom: 1px solid var(--dashboard-line);
}

.dashboard-section:last-child {
    border-bottom: 0;
}

.dashboard-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
    padding-top: 0;
}

.dashboard-section-header h2 {
    margin: 5px 0 3px;
    font-size: clamp(1.22rem, 2vw, 1.65rem);
}

.dashboard-section-description {
    display: block;
    margin-top: 4px;
    font-size: 0.84rem;
    line-height: 1.5;
}

.dashboard-dirty-status {
    min-height: 22px;
    color: var(--dashboard-pink);
    font-size: 0.82rem;
    font-weight: 800;
}

.dashboard-toggle-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-toggle-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 90px;
    border: 1px solid var(--dashboard-line);
    border-radius: 14px;
    padding: 16px 18px;
    background: rgba(10, 14, 20, 0.38);
    cursor: pointer;
    transition: border-color 140ms ease, background 140ms ease;
}

.dashboard-toggle-card-primary {
    grid-column: 1 / -1;
    background: linear-gradient(100deg, rgba(79, 212, 238, 0.1), rgba(252, 172, 211, 0.055));
}

.dashboard-toggle-card:hover {
    border-color: rgba(79, 212, 238, 0.36);
    background-color: rgba(79, 212, 238, 0.06);
}

.dashboard-toggle-card strong,
.dashboard-toggle-card small {
    display: block;
}

.dashboard-toggle-card strong {
    color: #f7fafc;
}

.dashboard-toggle-card small {
    margin-top: 5px;
    color: var(--dashboard-muted);
    line-height: 1.45;
}

.dashboard-toggle-card input {
    flex: 0 0 auto;
    width: 1.35rem;
    height: 1.35rem;
    accent-color: var(--dashboard-cyan);
}

.dashboard-cooldown-panel {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) 180px 180px;
    align-items: center;
    gap: 14px;
    margin-top: 12px;
    border: 1px solid var(--dashboard-line);
    border-radius: 14px;
    padding: 17px 18px;
    background: rgba(10, 14, 20, 0.28);
}

.dashboard-section-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--dashboard-line);
}

.dashboard-section-actions button {
    min-width: 92px;
}

.dashboard-cooldown-panel > div strong,
.dashboard-cooldown-panel > div span {
    display: block;
}

.dashboard-cooldown-panel > div span {
    margin-top: 5px;
    color: var(--dashboard-muted);
    font-size: 0.84rem;
}

.dashboard-cooldown-panel label {
    position: relative;
}

.dashboard-cooldown-panel label small {
    position: absolute;
    right: 12px;
    bottom: 11px;
    color: var(--dashboard-muted);
}

.dashboard-cooldown-panel input {
    padding-right: 35px;
}

#dashboardCommandForm {
    display: grid;
    grid-template-columns: minmax(160px, 0.65fr) minmax(260px, 1.6fr) auto;
    align-items: end;
    gap: 10px;
}

.dashboard-command-form-actions {
    display: flex;
    gap: 8px;
}

.dashboard-command-table-wrap {
    margin-top: 18px;
    overflow: auto;
    border: 1px solid var(--dashboard-line);
    border-radius: 14px;
}

.dashboard-command-table-wrap table {
    width: 100%;
    border-collapse: collapse;
}

.dashboard-command-table-wrap th,
.dashboard-command-table-wrap td {
    padding: 13px 15px;
    border-bottom: 1px solid var(--dashboard-line);
    text-align: left;
    vertical-align: middle;
}

.dashboard-command-table-wrap tbody tr:last-child td {
    border-bottom: 0;
}

.dashboard-command-table-wrap th {
    color: rgba(229, 237, 242, 0.66);
    background: rgba(7, 11, 16, 0.45);
    font-size: 0.76rem;
    letter-spacing: 0.06em;
}

.dashboard-command-table-wrap code {
    color: var(--dashboard-pink);
    font-weight: 800;
}

.dashboard-command-table-wrap td:last-child {
    width: 180px;
}

.dashboard-command-actions {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
}

.dashboard-command-actions button {
    min-height: 34px;
    padding: 5px 10px;
    font-size: 0.76rem;
}

.dashboard-manager-header-actions {
    display: flex;
    align-items: center;
    gap: 9px;
}

#dashboardManagerSync {
    align-self: flex-start;
    min-height: 34px;
    padding: 5px 10px;
    font-size: 0.76rem;
}

.dashboard-manager-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 10px;
}

.dashboard-manager-card {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    border: 1px solid var(--dashboard-line);
    border-radius: 13px;
    padding: 12px 14px;
    background: rgba(10, 14, 20, 0.34);
}

.dashboard-manager-card img {
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    border: 1px solid var(--dashboard-line-strong);
    border-radius: 12px;
    object-fit: cover;
    background: rgba(255, 255, 255, 0.04);
}

.dashboard-manager-card div {
    min-width: 0;
}

.dashboard-manager-card strong,
.dashboard-manager-card small,
.dashboard-manager-card code {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-manager-card strong {
    font-size: 0.92rem;
}

.dashboard-manager-card code {
    margin-top: 3px;
    color: var(--dashboard-muted);
    font-size: 0.68rem;
}

.dashboard-manager-role {
    margin-top: 2px;
    color: #bfeff7;
    font-size: 0.7rem;
}

.dashboard-manager-empty {
    grid-column: 1 / -1;
    margin: 0;
    border: 1px dashed var(--dashboard-line);
    border-radius: 13px;
    padding: 22px;
    text-align: left;
}

.dashboard-muted {
    color: var(--dashboard-muted);
    font-size: 0.82rem;
}

.dashboard-empty {
    padding: clamp(36px, 6vw, 72px);
    text-align: left;
}

.dashboard-empty h2 {
    margin: 0 0 10px;
}

.dashboard-empty p {
    margin: 0;
    color: var(--dashboard-muted);
}

.swal2-popup {
    border: 1px solid var(--dashboard-line-strong);
    color: var(--dashboard-text);
    background: #222833;
}

.swal2-title,
.swal2-html-container {
    color: var(--dashboard-text) !important;
}

@media (max-width: 1050px) {
    .dashboard-channel-toolbar {
        grid-template-columns: minmax(220px, 1fr) minmax(180px, 1fr);
    }

    .dashboard-toolbar-actions {
        grid-column: 1 / -1;
    }

    .dashboard-cooldown-panel {
        grid-template-columns: 1fr 1fr;
    }

    .dashboard-cooldown-panel > div {
        grid-column: 1 / -1;
    }

    #dashboardCommandForm {
        grid-template-columns: minmax(150px, 0.7fr) minmax(240px, 1.3fr);
    }

    .dashboard-command-form-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .dashboard-toolbar,
    .dashboard-toolbar-copy,
    .dashboard-name-row,
    .dashboard-section-header {
        align-items: stretch;
        flex-direction: column;
    }

    .dashboard-toolbar-copy {
        display: flex;
    }

    .dashboard-toolbar-side {
        width: 100%;
        justify-content: space-between;
    }

    .dashboard-login-account {
        min-width: 0;
        border-right: 0;
        padding-right: 0;
    }

    .dashboard-login-panel {
        grid-template-columns: 1fr;
    }

    .dashboard-login-visual {
        min-height: 235px;
        border-right: 0;
        border-bottom: 1px solid var(--dashboard-line);
    }

    .dashboard-identity {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .dashboard-avatar {
        width: 94px;
    }

    .dashboard-channel-toolbar,
    .dashboard-toggle-list,
    .dashboard-cooldown-panel,
    #dashboardCommandForm {
        grid-template-columns: 1fr;
    }

    .dashboard-toggle-card-primary,
    .dashboard-cooldown-panel > div,
    .dashboard-toolbar-actions,
    .dashboard-command-form-actions {
        grid-column: auto;
    }

    .dashboard-toolbar-actions,
    .dashboard-command-form-actions,
    .dashboard-manager-header-actions {
        justify-content: stretch;
        flex-direction: column;
    }

    .dashboard-toolbar-actions button,
    .dashboard-command-form-actions button {
        width: 100%;
    }

    .dashboard-manager-header-actions {
        align-items: stretch;
    }

    .dashboard-section-actions button {
        min-width: 86px;
    }

    .dashboard-command-table-wrap th:nth-child(2),
    .dashboard-command-table-wrap td:nth-child(2) {
        min-width: 240px;
    }
}

@media (max-width: 460px) {
    .dashboard-main {
        width: min(100% - 0.75rem, 1500px);
    }

    .dashboard-login-panel,
    .dashboard-panel {
        width: 100%;
        border-radius: 14px;
    }

    .dashboard-login-copy,
    .dashboard-identity,
    .dashboard-channel-toolbar,
    .dashboard-content {
        padding-left: 15px;
        padding-right: 15px;
    }

    .dashboard-login-copy h2,
    .dashboard-name-row h2 {
        font-size: 1.5rem;
    }


    .dashboard-toolbar-side {
        align-items: flex-start;
        flex-direction: column;
    }
}
