:root {
    color-scheme: dark;
    --page: #0a0a0b;
    --surface: #151517;
    --surface-2: #202023;
    --border: #303034;
    --text: #f5f5f5;
    --muted: #aaaab1;
    --accent: #58e6ff;
    --accent-text: #171710;
    --danger: #ff8f8f;
}

* {
    box-sizing: border-box;
}

body {
    min-height: 100vh;
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(88, 230, 255, 0.08), transparent 30%),
        var(--page);
    color: var(--text);
    font-family: Arial, Helvetica, sans-serif;
}

.page-center {
    display: grid;
    min-height: 100vh;
    padding: 24px;
    place-items: center;
}

.card {
    border: 1px solid var(--border);
    border-radius: 18px;
    background: rgba(21, 21, 23, 0.96);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.28);
}

.hero-card,
.login-card {
    width: min(100%, 620px);
    padding: 38px;
}

.login-card {
    width: min(100%, 460px);
}

.eyebrow {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--accent);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

h1,
h2 {
    margin-top: 0;
}

h1 {
    margin-bottom: 14px;
    font-size: clamp(2rem, 5vw, 3.25rem);
}

h2 {
    font-size: 1.15rem;
}

p {
    color: var(--muted);
    line-height: 1.65;
}

.signed-in {
    margin-top: 28px;
}

.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}

.button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 0 17px;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    text-decoration: none;
}

.button-primary {
    background: var(--accent);
    color: var(--accent-text);
}

.button-secondary {
    border-color: var(--border);
    background: var(--surface-2);
    color: var(--text);
}

.button-full {
    width: 100%;
}

.form-stack {
    display: grid;
    gap: 10px;
    margin-top: 26px;
}

input:not([type="checkbox"]) {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 10px;
    outline: none;
    background: #0c0c0e;
    color: var(--text);
    padding: 13px 14px;
    font: inherit;
}

input:focus {
    border-color: var(--accent);
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 8px 0 6px;
    color: var(--muted);
}

.form-error {
    margin: 0 0 5px;
    color: var(--danger);
    font-size: 0.9rem;
}

.text-link {
    display: inline-block;
    margin-top: 20px;
    color: var(--accent);
    text-decoration: none;
}

.dashboard-shell {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
    padding: 36px 0;
}

.dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 26px;
}

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

.dashboard-grid .card {
    padding: 26px;
}

.badge-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.badge {
    border: 1px solid rgba(88, 230, 255, 0.4);
    border-radius: 999px;
    background: rgba(88, 230, 255, 0.1);
    color: var(--accent);
    padding: 7px 11px;
    font-size: 0.85rem;
    font-weight: 800;
}

@media (max-width: 680px) {
    .hero-card,
    .login-card {
        padding: 26px;
    }

    .dashboard-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}

/* MARKUZI-ADMIN-STYLES */
.admin-shell {
    display: grid;
    min-height: 100vh;
    grid-template-columns: 280px minmax(0, 1fr);
    background: var(--page);
}

.admin-sidebar {
    display: flex;
    position: sticky;
    top: 0;
    min-height: 100vh;
    flex-direction: column;
    border-right: 1px solid var(--border);
    background: #111113;
    padding: 22px 16px 16px;
}

.admin-brand {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0 8px 30px;
    color: var(--text);
    text-decoration: none;
}

.admin-brand-mark {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    background: var(--accent);
    color: var(--accent-text);
    font-weight: 900;
}

.admin-brand strong,
.admin-brand small,
.admin-user-card strong,
.admin-user-card small {
    display: block;
}

.admin-brand strong {
    letter-spacing: 0.1em;
    font-size: 0.83rem;
}

.admin-brand small,
.admin-user-card small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 0.75rem;
}

.admin-navigation {
    display: grid;
    gap: 5px;
}

.admin-nav-link,
.admin-nav-group summary,
.admin-nav-children a {
    border-radius: 10px;
    color: var(--muted);
    font-size: 0.93rem;
    font-weight: 700;
    text-decoration: none;
}

.admin-nav-link,
.admin-nav-group summary {
    display: flex;
    min-height: 44px;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
}

.admin-nav-link:hover,
.admin-nav-group summary:hover,
.admin-nav-children a:hover {
    background: var(--surface-2);
    color: var(--text);
}

.admin-nav-link.is-active,
.admin-nav-children a.is-active {
    background: rgba(88, 230, 255, 0.12);
    color: var(--accent);
}

.admin-nav-icon {
    width: 18px;
    color: var(--accent);
    text-align: center;
    font-size: 1rem;
}

.admin-nav-group summary {
    justify-content: space-between;
    cursor: pointer;
    list-style: none;
}

.admin-nav-group summary::-webkit-details-marker {
    display: none;
}

.admin-nav-group-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.admin-nav-chevron {
    display: inline-block;
    color: var(--muted);
    transition: transform 0.18s ease;
}

.admin-nav-group[open] .admin-nav-chevron {
    transform: rotate(180deg);
}

.admin-nav-children {
    display: grid;
    gap: 3px;
    margin: 4px 0 8px 39px;
    border-left: 1px solid var(--border);
    padding: 2px 0 2px 10px;
}

.admin-nav-children a {
    padding: 9px 10px;
    font-size: 0.87rem;
}

.admin-sidebar-footer {
    display: grid;
    gap: 12px;
    margin-top: auto;
    padding: 16px 8px 2px;
}

.admin-user-card {
    display: flex;
    align-items: center;
    gap: 10px;
    border-top: 1px solid var(--border);
    padding-top: 17px;
}

.admin-user-avatar {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 50%;
    background: rgba(88, 230, 255, 0.12);
    color: var(--accent);
    font-weight: 900;
}

.admin-user-card strong {
    font-size: 0.86rem;
}

.admin-back-link,
.admin-logout-button {
    border: 0;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font: inherit;
    font-size: 0.83rem;
    text-align: left;
    text-decoration: none;
}

.admin-back-link:hover,
.admin-logout-button:hover {
    color: var(--accent);
}

.admin-main {
    min-width: 0;
    padding: 38px clamp(22px, 4vw, 58px);
}

.admin-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 28px;
}

.admin-header h1 {
    margin-bottom: 0;
    font-size: clamp(2rem, 4vw, 2.75rem);
}

.admin-header-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    padding: 9px 12px;
    font-size: 0.8rem;
    font-weight: 700;
}

.admin-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 10px rgba(88, 230, 255, 0.75);
}

.admin-empty-card,
.admin-welcome-card,
.admin-next-card {
    border: 1px solid var(--border);
    border-radius: 18px;
    background:
        radial-gradient(circle at right top, rgba(88, 230, 255, 0.09), transparent 38%),
        var(--surface);
    padding: clamp(24px, 4vw, 36px);
}

.admin-empty-card {
    max-width: 860px;
}

.admin-empty-card h2,
.admin-welcome-card h2,
.admin-next-card h2 {
    margin-bottom: 10px;
    font-size: 1.5rem;
}

.admin-empty-card p,
.admin-welcome-card p,
.admin-next-card p {
    max-width: 690px;
    margin-bottom: 0;
}

.admin-empty-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.admin-planned-badge {
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface-2);
    color: var(--muted);
    padding: 7px 11px;
    font-size: 0.82rem;
    font-weight: 800;
}

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

    .admin-sidebar {
        position: static;
        min-height: auto;
        border-right: 0;
        border-bottom: 1px solid var(--border);
    }

    .admin-navigation {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-sidebar-footer {
        margin-top: 20px;
    }
}

@media (max-width: 620px) {
    .admin-main {
        padding: 26px 18px;
    }

    .admin-navigation {
        grid-template-columns: 1fr;
    }

    .admin-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* MARKUZI-USER-LIST-STYLES */
.admin-page-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 20px;
}

.admin-page-heading h2 {
    margin: 0 0 10px;
    font-size: 1.55rem;
}

.admin-page-heading p {
    max-width: 700px;
    margin: 0;
}

.admin-page-metric {
    display: grid;
    min-width: 132px;
    gap: 3px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    padding: 15px 18px;
}

.admin-page-metric span,
.admin-page-metric small {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.admin-page-metric strong {
    color: var(--accent);
    font-size: 1.75rem;
    line-height: 1;
}

.admin-table-card {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--surface);
}

.admin-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid var(--border);
    padding: 20px;
}

.admin-search-field {
    display: grid;
    min-width: min(100%, 380px);
    gap: 8px;
}

.admin-search-field label {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.admin-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.admin-table-wrap {
    overflow-x: auto;
}

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

.admin-table th,
.admin-table td {
    border-bottom: 1px solid var(--border);
    padding: 17px 20px;
    text-align: left;
}

.admin-table th {
    background: rgba(255, 255, 255, 0.018);
    color: var(--muted);
    font-size: 0.74rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.admin-table tbody tr:last-child td {
    border-bottom: 0;
}

.admin-table tbody tr:hover {
    background: rgba(255, 255, 255, 0.018);
}

.user-identity {
    display: flex;
    align-items: center;
    gap: 11px;
}

.user-avatar {
    display: grid;
    width: 37px;
    height: 37px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    background: rgba(88, 230, 255, 0.12);
    color: var(--accent);
    font-size: 0.88rem;
    font-weight: 900;
}

.user-identity strong,
.user-identity small {
    display: block;
}

.user-identity strong {
    font-size: 0.9rem;
}

.user-identity small,
.admin-muted {
    color: var(--muted);
    font-size: 0.8rem;
}

.user-identity small {
    margin-top: 3px;
}

.admin-email {
    color: #dedee2;
    font-size: 0.87rem;
}

.role-pill-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.role-pill {
    border: 1px solid rgba(88, 230, 255, 0.32);
    border-radius: 999px;
    background: rgba(88, 230, 255, 0.09);
    color: var(--accent);
    padding: 5px 9px;
    font-size: 0.76rem;
    font-weight: 800;
}

.admin-no-results {
    padding: 20px 4px;
    color: var(--muted);
    text-align: center;
}

.admin-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    padding: 15px 20px;
    font-size: 0.85rem;
    font-weight: 700;
}

.admin-pagination a {
    color: var(--accent);
    text-decoration: none;
}

.pagination-disabled {
    color: #65656c;
}

@media (max-width: 720px) {
    .admin-page-heading,
    .admin-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-page-metric,
    .admin-search-field {
        width: 100%;
    }

    .admin-toolbar-actions {
        width: 100%;
    }

    .admin-toolbar-actions .button {
        flex: 1;
    }
}

/* MARKUZI-USER-CREATE-STYLES */
.admin-page-heading-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.admin-flash-success {
    margin-bottom: 18px;
    border: 1px solid rgba(88, 230, 255, 0.34);
    border-radius: 12px;
    background: rgba(88, 230, 255, 0.1);
    color: var(--accent);
    padding: 14px 16px;
    font-size: 0.9rem;
    font-weight: 800;
}

.admin-form-card {
    max-width: 900px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--surface);
    padding: clamp(22px, 4vw, 34px);
}

.admin-form {
    display: grid;
    gap: 28px;
}

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

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

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

.admin-field label {
    color: var(--text);
    font-size: 0.84rem;
    font-weight: 800;
}

.admin-field select {
    width: 100%;
    min-height: 47px;
    border: 1px solid var(--border);
    border-radius: 10px;
    outline: none;
    background: #0c0c0e;
    color: var(--text);
    padding: 11px 13px;
    font: inherit;
}

.admin-field select:focus {
    border-color: var(--accent);
}

.admin-field-hint {
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.4;
}

.admin-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid var(--border);
    padding-top: 22px;
}

@media (max-width: 720px) {
    .admin-page-heading-actions {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .admin-page-heading-actions .button {
        width: 100%;
    }

    .admin-form-grid {
        grid-template-columns: 1fr;
    }

    .admin-field-full {
        grid-column: auto;
    }

    .admin-form-actions {
        flex-direction: column-reverse;
    }

    .admin-form-actions .button {
        width: 100%;
    }
}

/* MARKUZI-USER-EDIT-STYLES */
.admin-table-action-column,
.admin-table-actions {
    text-align: right !important;
    white-space: nowrap;
}

.table-action-button {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    border: 1px solid rgba(88, 230, 255, 0.32);
    border-radius: 8px;
    background: rgba(88, 230, 255, 0.08);
    color: var(--accent);
    padding: 0 10px;
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
}

.table-action-button:hover {
    background: rgba(88, 230, 255, 0.16);
}

.table-protected-label {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

/* MARKUZI-ROLE-MANAGEMENT-STYLES */
.admin-role-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.admin-role-card {
    display: grid;
    gap: 20px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--surface);
    padding: 24px;
}

.admin-role-card.is-system-role {
    background:
        radial-gradient(circle at right top, rgba(88, 230, 255, 0.11), transparent 42%),
        var(--surface);
}

.admin-role-card-top,
.admin-role-card-footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.admin-role-card h3 {
    margin: 0;
    font-size: 1.35rem;
}

.admin-role-card p {
    margin: 0;
    font-size: 0.9rem;
}

.admin-role-statistics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 12px;
}

.admin-role-statistics > div {
    display: grid;
    gap: 4px;
    padding: 14px;
}

.admin-role-statistics > div + div {
    border-left: 1px solid var(--border);
}

.admin-role-statistics strong {
    color: var(--accent);
    font-size: 1.4rem;
}

.admin-role-statistics span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.admin-role-warning {
    max-width: 920px;
    margin-bottom: 18px;
    border: 1px solid rgba(88, 230, 255, 0.34);
    border-radius: 14px;
    background: rgba(88, 230, 255, 0.08);
    padding: 18px 20px;
}

.admin-role-warning strong {
    color: var(--accent);
    font-size: 0.94rem;
}

.admin-role-warning p {
    margin: 7px 0 0;
    font-size: 0.88rem;
}

.admin-permission-form {
    display: grid;
    gap: 22px;
    max-width: 1120px;
}

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

.admin-permission-group {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--surface);
}

.admin-permission-group header {
    border-bottom: 1px solid var(--border);
    padding: 18px 20px;
}

.admin-permission-group h3 {
    margin: 0;
    font-size: 1.08rem;
}

.admin-permission-list {
    display: grid;
}

.permission-checkbox {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--border);
    padding: 14px 18px;
}

.permission-checkbox:last-child {
    border-bottom: 0;
}

.permission-checkbox:hover {
    background: rgba(255, 255, 255, 0.02);
}

.permission-checkbox.is-locked {
    cursor: not-allowed;
    background: rgba(88, 230, 255, 0.035);
}

.permission-checkbox input {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    accent-color: var(--accent);
}

.permission-checkbox-text {
    display: grid;
    flex: 1;
    gap: 3px;
    min-width: 0;
}

.permission-checkbox-text strong {
    font-size: 0.85rem;
}

.permission-checkbox-text small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.74rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.permission-locked-label {
    border: 1px solid rgba(88, 230, 255, 0.3);
    border-radius: 999px;
    color: var(--accent);
    padding: 4px 8px;
    font-size: 0.7rem;
    font-weight: 800;
}

.admin-form-error-box {
    border: 1px solid rgba(255, 143, 143, 0.35);
    border-radius: 10px;
    background: rgba(255, 143, 143, 0.08);
    padding: 13px 15px;
}

@media (max-width: 900px) {
    .admin-role-grid,
    .admin-permission-group-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .admin-role-card-top,
    .admin-role-card-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-role-card-footer .button {
        width: 100%;
    }

    .permission-checkbox {
        align-items: flex-start;
    }
}

/* MARKUZI-ROLE-LOCK-STYLES */
.admin-flash-error {
    margin-bottom: 18px;
    border: 1px solid rgba(255, 143, 143, 0.38);
    border-radius: 12px;
    background: rgba(255, 143, 143, 0.08);
    color: #ffc0c0;
    padding: 14px 16px;
    font-size: 0.9rem;
    font-weight: 800;
}

.admin-security-tip {
    max-width: 920px;
    margin-bottom: 18px;
    border: 1px solid rgba(88, 230, 255, 0.22);
    border-radius: 14px;
    background: rgba(88, 230, 255, 0.045);
    padding: 17px 20px;
}

.admin-security-tip strong {
    color: var(--accent);
    font-size: 0.92rem;
}

.admin-security-tip p {
    margin: 7px 0 0;
    font-size: 0.86rem;
}

.permission-checkbox-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--border);
}

.permission-checkbox-row:last-child {
    border-bottom: 0;
}

.permission-checkbox-row .permission-checkbox {
    flex: 1;
    border-bottom: 0;
}

.permission-lock-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-right: 14px;
}

.permission-lock-button,
.permission-unlock-button {
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface-2);
    color: var(--muted);
    cursor: pointer;
    padding: 7px 9px;
    font: inherit;
    font-size: 0.72rem;
    font-weight: 800;
    white-space: nowrap;
}

.permission-lock-button {
    border-color: rgba(88, 230, 255, 0.3);
    color: var(--accent);
}

.permission-lock-button:hover {
    background: rgba(88, 230, 255, 0.1);
}

.permission-unlock-button:hover {
    border-color: rgba(255, 143, 143, 0.45);
    color: #ffc0c0;
}

.permission-locked-label {
    white-space: nowrap;
}

@media (max-width: 620px) {
    .permission-checkbox-row {
        align-items: stretch;
        flex-direction: column;
        gap: 0;
    }

    .permission-lock-actions {
        justify-content: flex-end;
        padding: 0 14px 12px;
    }
}

/* MARKUZI-ACCOUNT-PROTECTION-STYLES */
.admin-security-owner-banner {
    max-width: 920px;
    margin-bottom: 18px;
    border: 1px solid rgba(88, 230, 255, 0.36);
    border-radius: 14px;
    background: rgba(88, 230, 255, 0.09);
    padding: 18px 20px;
}

.admin-security-owner-banner strong {
    color: var(--accent);
    font-size: 0.94rem;
}

.admin-security-owner-banner p {
    margin: 7px 0 0;
    font-size: 0.87rem;
}

.admin-field-lock-note {
    margin: 0;
    color: var(--accent);
    font-size: 0.78rem;
    font-weight: 800;
}

.admin-field input[readonly],
.admin-field select:disabled {
    border-color: rgba(88, 230, 255, 0.22);
    background: rgba(88, 230, 255, 0.04);
    color: var(--muted);
    cursor: not-allowed;
}

.admin-locked-field {
    display: flex;
    min-height: 47px;
    align-items: center;
    border: 1px solid rgba(88, 230, 255, 0.22);
    border-radius: 10px;
    background: rgba(88, 230, 255, 0.04);
    color: var(--muted);
    padding: 11px 13px;
    font-size: 0.88rem;
}

.admin-account-protection {
    max-width: 1120px;
    margin-top: 22px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--surface);
    padding: clamp(22px, 4vw, 30px);
}

.admin-account-protection-header {
    margin-bottom: 18px;
}

.admin-account-protection h2 {
    margin: 0 0 10px;
    font-size: 1.45rem;
}

.admin-account-protection-header p {
    max-width: 700px;
    margin: 0;
}

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

.admin-account-lock-card {
    display: grid;
    gap: 16px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 18px;
}

.admin-account-lock-card.is-locked {
    border-color: rgba(88, 230, 255, 0.3);
    background: rgba(88, 230, 255, 0.05);
}

.admin-account-lock-card h3 {
    margin: 0 0 7px;
    font-size: 0.98rem;
}

.admin-account-lock-card p {
    margin: 0;
    font-size: 0.82rem;
}

.admin-account-lock-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.admin-unlocked-label {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
}

@media (max-width: 720px) {
    .admin-account-lock-grid {
        grid-template-columns: 1fr;
    }

    .admin-account-lock-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-account-lock-footer form,
    .admin-account-lock-footer button {
        width: 100%;
    }
}

/* MARKUZI-PERMISSION-MANAGEMENT-STYLES */
.permission-table {
    min-width: 1050px;
}

.permission-name {
    display: block;
    color: var(--accent);
    font-size: 0.83rem;
}

.permission-name + .admin-muted {
    display: block;
    margin-top: 5px;
}

.permission-description {
    display: block;
    max-width: 350px;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.permission-group-label,
.permission-system-label,
.permission-custom-label {
    display: inline-flex;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 0.73rem;
    font-weight: 800;
    white-space: nowrap;
}

.permission-group-label {
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--muted);
}

.permission-system-label {
    border: 1px solid rgba(88, 230, 255, 0.28);
    background: rgba(88, 230, 255, 0.08);
    color: var(--accent);
}

.permission-custom-label {
    border: 1px solid rgba(137, 170, 255, 0.32);
    background: rgba(137, 170, 255, 0.09);
    color: #b8c8ff;
}

.admin-field textarea {
    width: 100%;
    resize: vertical;
    border: 1px solid var(--border);
    border-radius: 10px;
    outline: none;
    background: #0c0c0e;
    color: var(--text);
    padding: 13px 14px;
    font: inherit;
    line-height: 1.5;
}

.admin-field textarea:focus {
    border-color: var(--accent);
}

.permission-usage-card {
    max-width: 900px;
    margin-top: 22px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--surface);
    padding: clamp(22px, 4vw, 30px);
}

.permission-usage-card h2 {
    margin: 0 0 18px;
    font-size: 1.35rem;
}

.permission-usage-card > p {
    margin: 18px 0 0;
    font-size: 0.86rem;
}

.permission-usage-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 12px;
}

.permission-usage-grid > div {
    display: grid;
    gap: 5px;
    padding: 15px;
}

.permission-usage-grid > div + div {
    border-left: 1px solid var(--border);
}

.permission-usage-grid strong {
    color: var(--accent);
    font-size: 1.45rem;
}

.permission-usage-grid span {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
}

.permission-delete-button {
    border-color: rgba(255, 143, 143, 0.4);
    background: rgba(255, 143, 143, 0.09);
    color: #ffc0c0;
}

@media (max-width: 620px) {
    .permission-usage-grid {
        grid-template-columns: 1fr;
    }

    .permission-usage-grid > div + div {
        border-top: 1px solid var(--border);
        border-left: 0;
    }
}

/* MARKUZI-CASINO-INDEX-STYLES */
.casino-stat-grid {
    margin-top: 0;
    margin-bottom: 18px;
}

.admin-filter-field {
    display: grid;
    min-width: 180px;
    gap: 8px;
}

.admin-filter-field label {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.admin-filter-field select {
    min-height: 46px;
    border: 1px solid var(--border);
    border-radius: 10px;
    outline: none;
    background: #0c0c0e;
    color: var(--text);
    padding: 0 12px;
    font: inherit;
}

.admin-filter-field select:focus {
    border-color: var(--accent);
}

.casino-table {
    min-width: 1160px;
}

.casino-identity {
    display: flex;
    align-items: center;
    gap: 11px;
}

.casino-logo-placeholder {
    display: grid;
    width: 39px;
    height: 39px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 11px;
    background: linear-gradient(
        135deg,
        rgba(88, 230, 255, 0.22),
        rgba(88, 230, 255, 0.06)
    );
    color: var(--accent);
    font-weight: 900;
}

.casino-identity strong,
.casino-identity small {
    display: block;
}

.casino-identity strong {
    font-size: 0.9rem;
}

.casino-identity small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 0.77rem;
}

.casino-bonus-text {
    display: block;
    max-width: 250px;
    color: #e7e7ea;
    font-size: 0.84rem;
    line-height: 1.45;
}

.casino-bonus-text + .admin-muted {
    display: block;
    margin-top: 5px;
}

.casino-code {
    display: inline-flex;
    border: 1px solid rgba(88, 230, 255, 0.28);
    border-radius: 7px;
    background: rgba(88, 230, 255, 0.08);
    color: var(--accent);
    padding: 5px 8px;
    font-size: 0.76rem;
    font-weight: 800;
}

.casino-meta-list {
    display: flex;
    max-width: 250px;
    flex-wrap: wrap;
    gap: 6px;
}

.casino-meta-chip,
.payment-method-chip {
    display: inline-flex;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface-2);
    color: var(--muted);
    padding: 5px 8px;
    font-size: 0.71rem;
    font-weight: 800;
}

.payment-method-chip {
    border-color: rgba(137, 170, 255, 0.24);
    background: rgba(137, 170, 255, 0.07);
    color: #c2ceff;
}

.casino-status-stack {
    display: grid;
    justify-items: start;
    gap: 7px;
}

.casino-status,
.casino-verified-label {
    display: inline-flex;
    border-radius: 999px;
    padding: 5px 8px;
    font-size: 0.72rem;
    font-weight: 800;
    white-space: nowrap;
}

.casino-status-draft {
    border: 1px solid rgba(255, 196, 100, 0.33);
    background: rgba(255, 196, 100, 0.08);
    color: #ffd28c;
}

.casino-status-published {
    border: 1px solid rgba(88, 230, 255, 0.3);
    background: rgba(88, 230, 255, 0.09);
    color: var(--accent);
}

.casino-status-archived {
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--muted);
}

.casino-verified-label {
    border: 1px solid rgba(111, 217, 171, 0.32);
    background: rgba(111, 217, 171, 0.08);
    color: #9cf0c3;
}

.casino-no-results {
    display: grid;
    gap: 7px;
}

.casino-no-results strong {
    color: var(--text);
}

.casino-no-results span {
    font-size: 0.84rem;
}

@media (max-width: 860px) {
    .admin-toolbar {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .admin-filter-field {
        min-width: min(100%, 220px);
    }
}

/* MARKUZI-CASINO-CREATE-STYLES */
.casino-form-card {
    max-width: 1120px;
}

.casino-form-section {
    display: grid;
    gap: 20px;
}

.casino-form-section + .casino-form-section {
    border-top: 1px solid var(--border);
    padding-top: 28px;
}

.casino-form-section-heading h3 {
    margin: 0;
    font-size: 1.15rem;
}

.casino-toggle {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface-2);
    cursor: pointer;
    padding: 15px;
}

.casino-toggle input {
    width: 18px;
    height: 18px;
    margin-top: 1px;
    accent-color: var(--accent);
}

.casino-toggle strong,
.casino-toggle small {
    display: block;
}

.casino-toggle strong {
    font-size: 0.88rem;
}

.casino-toggle small {
    margin-top: 4px;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.4;
}

.casino-option-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.casino-option-panel {
    min-width: 0;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 18px;
}

.casino-option-panel legend {
    color: var(--text);
    padding: 0 5px;
    font-size: 0.92rem;
    font-weight: 800;
}

.casino-option-list {
    display: grid;
    gap: 8px;
    margin-top: 8px;
}

.casino-option-card {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid transparent;
    border-radius: 9px;
    cursor: pointer;
    padding: 10px;
}

.casino-option-card:hover {
    border-color: var(--border);
    background: rgba(255, 255, 255, 0.025);
}

.casino-option-card input {
    width: 17px;
    height: 17px;
    accent-color: var(--accent);
}

.casino-option-card span {
    color: #e1e1e5;
    font-size: 0.84rem;
    font-weight: 700;
}

.casino-logo-image {
    width: 39px;
    height: 39px;
    flex: 0 0 auto;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: #fff;
    object-fit: contain;
    padding: 3px;
}

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

/* MARKUZI-CASINO-EDIT-STYLES */
.casino-current-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.casino-current-logo img {
    width: 58px;
    height: 58px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    object-fit: contain;
    padding: 4px;
}

.casino-remove-logo {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 700;
}

.casino-remove-logo input {
    width: 16px;
    height: 16px;
    accent-color: var(--accent);
}

/* MARKUZI-CASINO-DELETE-STYLES */
.casino-table-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.casino-table-actions form {
    margin: 0;
}

.table-action-delete {
    border: 1px solid rgba(255, 143, 143, 0.36);
    border-radius: 8px;
    background: rgba(255, 143, 143, 0.08);
    color: #ffc0c0;
    cursor: pointer;
    padding: 7px 9px;
    font: inherit;
    font-size: 0.75rem;
    font-weight: 800;
}

.table-action-delete:hover {
    border-color: rgba(255, 143, 143, 0.7);
    background: rgba(255, 143, 143, 0.14);
}

/* MARKUZI-CASINO-META-STYLES */
.casino-meta-grid {
    display: grid;
    gap: 22px;
}

.casino-meta-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.casino-meta-card-heading h2 {
    margin: 2px 0 0;
    font-size: 1.25rem;
}

.casino-meta-table {
    min-width: 760px;
}

.casino-meta-form-card {
    max-width: 860px;
}

@media (max-width: 620px) {
    .casino-meta-card-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* MARKUZI-CASINO-TAG-STYLES */
.casino-tag-table {
    min-width: 760px;
}

.casino-option-panel-full {
    grid-column: 1 / -1;
}

.casino-option-panel-full .casino-option-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.casino-option-card small {
    margin-left: 4px;
    color: var(--muted);
    font-size: 0.72rem;
}

@media (max-width: 900px) {
    .casino-option-panel-full .casino-option-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .casino-option-panel-full .casino-option-list {
        grid-template-columns: 1fr;
    }
}

/* MARKUZI-CASINO-GRANULAR-PERMISSION-STYLES */
.casino-option-permission-note {
    margin: 8px 0 12px;
    border-left: 3px solid rgba(255, 196, 100, 0.7);
    color: #ffd28c;
    padding-left: 10px;
    font-size: 0.78rem;
    line-height: 1.45;
}

.casino-option-card input:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.casino-option-card input:disabled + span {
    cursor: not-allowed;
    opacity: 0.58;
}

/* MARKUZI-RECOVERY-CODE-STYLES */
.user-recovery-code-section {
    margin-top: 22px;
}

.recovery-code-status {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.recovery-code-status small {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.recovery-code-status-active,
.recovery-code-status-revoked,
.recovery-code-status-empty {
    display: inline-flex;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 0.76rem;
    font-weight: 900;
}

.recovery-code-status-active {
    border: 1px solid rgba(111, 217, 171, 0.35);
    background: rgba(111, 217, 171, 0.09);
    color: #9cf0c3;
}

.recovery-code-status-revoked {
    border: 1px solid rgba(255, 196, 100, 0.36);
    background: rgba(255, 196, 100, 0.08);
    color: #ffd28c;
}

.recovery-code-status-empty {
    border: 1px solid var(--border);
    background: var(--surface-2);
    color: var(--muted);
}

.recovery-code-reveal-card {
    display: grid;
    justify-items: start;
    gap: 16px;
    max-width: 760px;
    border: 1px solid rgba(88, 230, 255, 0.32);
    border-radius: 18px;
    background: var(--surface);
    padding: clamp(22px, 4vw, 30px);
}

.recovery-code-reveal-card code {
    display: block;
    width: 100%;
    overflow-wrap: anywhere;
    border: 1px dashed rgba(88, 230, 255, 0.42);
    border-radius: 12px;
    background: #0b0d0e;
    color: var(--accent);
    padding: 18px;
    font-size: clamp(1.05rem, 3vw, 1.5rem);
    font-weight: 900;
    letter-spacing: 0.09em;
    text-align: center;
}

.recovery-code-warning {
    border-left: 3px solid rgba(255, 196, 100, 0.75);
    color: #ffe0aa;
    padding-left: 12px;
    font-size: 0.85rem;
    line-height: 1.55;
}

/* MARKUZI-AUTH-RESET-LINK-STYLES */
.auth-password-reset-link {
    margin: 16px 0 0;
    text-align: center;
}

.auth-password-reset-link a {
    color: var(--accent);
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
}

.auth-password-reset-link a:hover {
    text-decoration: underline;
}

/* MARKUZI-EMAIL-TWO-FACTOR-STYLES */
.form-success {
    margin: 18px 0 0;
    border: 1px solid rgba(111, 217, 171, 0.34);
    border-radius: 10px;
    background: rgba(111, 217, 171, 0.08);
    color: #9cf0c3;
    padding: 11px 12px;
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.45;
}

.two-factor-card {
    max-width: 480px;
}

.two-factor-expiry {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.5;
}

.two-factor-code-input {
    min-height: 56px;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 0.48em;
    padding-left: 0.48em;
    text-align: center;
}

.two-factor-resend {
    margin-top: 16px;
}

.two-factor-resend .muted {
    margin: 0;
    font-size: 0.8rem;
    text-align: center;
}

/* MARKUZI-EMAIL-TWO-FACTOR-EXPIRY-STYLES */
.two-factor-expiry {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 16px 0 0;
    border: 1px solid rgba(88, 230, 255, 0.2);
    border-radius: 10px;
    background: rgba(88, 230, 255, 0.05);
    color: var(--muted);
    padding: 10px 12px;
    font-size: 0.79rem;
    line-height: 1.45;
}

.two-factor-expiry strong {
    color: var(--text);
}

.two-factor-countdown {
    flex-shrink: 0;
    color: var(--accent);
    font-weight: 900;
    white-space: nowrap;
}

.two-factor-countdown-expired {
    color: #ffb0b0;
}

@media (max-width: 440px) {
    .two-factor-expiry {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* MARKUZI-CASINO-TRASH-STYLES */
.trash-casino-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin: 22px 0;
}

.trash-casino-search-label {
    display: block;
    margin-bottom: 7px;
    color: var(--muted);
    font-size: 0.77rem;
    font-weight: 800;
}

.trash-casino-search-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.trash-casino-search-row input {
    min-width: min(100%, 270px);
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
    color: var(--text);
    padding: 11px 12px;
}

.trash-casino-count {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
}

.trash-casino-card {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--surface);
}

.trash-casino-table-wrap {
    overflow-x: auto;
}

.trash-casino-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
}

.trash-casino-table th,
.trash-casino-table td {
    border-bottom: 1px solid var(--border);
    padding: 15px 16px;
    text-align: left;
    vertical-align: middle;
}

.trash-casino-table th {
    background: rgba(255, 255, 255, 0.025);
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.trash-casino-table tbody tr:last-child td {
    border-bottom: 0;
}

.trash-casino-name {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 190px;
}

.trash-casino-name img,
.trash-casino-placeholder {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 10px;
    background: #101216;
    color: var(--accent);
    object-fit: cover;
    font-size: 0.92rem;
    font-weight: 900;
}

.trash-casino-name strong,
.trash-casino-table td > strong {
    display: block;
    color: var(--text);
    font-size: 0.85rem;
}

.trash-casino-name small,
.trash-casino-table td small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 0.72rem;
}

.trash-casino-status {
    display: inline-flex;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--muted);
    padding: 6px 9px;
    font-size: 0.72rem;
    font-weight: 800;
}

.trash-casino-meta {
    display: grid;
    gap: 4px;
    color: var(--muted);
    font-size: 0.75rem;
}

.trash-casino-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.trash-casino-actions form {
    margin: 0;
}

.trash-casino-actions-heading {
    text-align: right !important;
}

.trash-casino-message {
    margin: 18px 0;
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 0.84rem;
    font-weight: 750;
}

.trash-casino-message-success {
    border: 1px solid rgba(111, 217, 171, 0.35);
    background: rgba(111, 217, 171, 0.08);
    color: #9cf0c3;
}

.trash-casino-message-error {
    border: 1px solid rgba(255, 143, 143, 0.35);
    background: rgba(255, 143, 143, 0.08);
    color: #ffb0b0;
}

.trash-casino-empty {
    padding: 52px 24px;
    text-align: center;
}

.trash-casino-empty-icon {
    display: grid;
    width: 48px;
    height: 48px;
    margin: 0 auto 14px;
    place-items: center;
    border-radius: 14px;
    background: rgba(88, 230, 255, 0.08);
    font-size: 1.4rem;
}

.trash-casino-empty h3 {
    margin: 0;
    color: var(--text);
    font-size: 1rem;
}

.trash-casino-empty p {
    max-width: 540px;
    margin: 8px auto 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.6;
}

.trash-casino-pagination {
    border-top: 1px solid var(--border);
    padding: 16px;
}

@media (max-width: 720px) {
    .trash-casino-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .trash-casino-count {
        white-space: normal;
    }
}

/* MARKUZI-CASINO-ARCHIVE-STYLES */
.archive-casino-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin: 22px 0;
}

.archive-casino-search-label {
    display: block;
    margin-bottom: 7px;
    color: var(--muted);
    font-size: 0.77rem;
    font-weight: 800;
}

.archive-casino-search-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.archive-casino-search-row input {
    min-width: min(100%, 270px);
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
    color: var(--text);
    padding: 11px 12px;
}

.archive-casino-count {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
}

.archive-casino-card {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--surface);
}

.archive-casino-table-wrap {
    overflow-x: auto;
}

.archive-casino-table {
    width: 100%;
    min-width: 780px;
    border-collapse: collapse;
}

.archive-casino-table th,
.archive-casino-table td {
    border-bottom: 1px solid var(--border);
    padding: 15px 16px;
    text-align: left;
    vertical-align: middle;
}

.archive-casino-table th {
    background: rgba(255, 255, 255, 0.025);
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.archive-casino-table tbody tr:last-child td {
    border-bottom: 0;
}

.archive-casino-name {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 190px;
}

.archive-casino-name img,
.archive-casino-placeholder {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 10px;
    background: #101216;
    color: var(--accent);
    object-fit: cover;
    font-size: 0.92rem;
    font-weight: 900;
}

.archive-casino-name strong,
.archive-casino-table td > strong {
    display: block;
    color: var(--text);
    font-size: 0.85rem;
}

.archive-casino-name small,
.archive-casino-table td small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 0.72rem;
}

.archive-casino-meta {
    display: grid;
    gap: 4px;
    color: var(--muted);
    font-size: 0.75rem;
}

.archive-casino-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.archive-casino-actions form {
    margin: 0;
}

.archive-casino-actions-heading {
    text-align: right !important;
}

.archive-casino-message {
    margin: 18px 0;
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 0.84rem;
    font-weight: 750;
}

.archive-casino-message-success {
    border: 1px solid rgba(111, 217, 171, 0.35);
    background: rgba(111, 217, 171, 0.08);
    color: #9cf0c3;
}

.archive-casino-message-error {
    border: 1px solid rgba(255, 143, 143, 0.35);
    background: rgba(255, 143, 143, 0.08);
    color: #ffb0b0;
}

.archive-casino-empty {
    padding: 52px 24px;
    text-align: center;
}

.archive-casino-empty-icon {
    display: grid;
    width: 48px;
    height: 48px;
    margin: 0 auto 14px;
    place-items: center;
    border-radius: 14px;
    background: rgba(88, 230, 255, 0.08);
    color: var(--accent);
    font-size: 1.4rem;
}

.archive-casino-empty h3 {
    margin: 0;
    color: var(--text);
    font-size: 1rem;
}

.archive-casino-empty p {
    max-width: 540px;
    margin: 8px auto 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.6;
}

.archive-casino-pagination {
    border-top: 1px solid var(--border);
    padding: 16px;
}

.casino-archive-action-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-top: 22px;
    border: 1px solid rgba(88, 230, 255, 0.25);
    border-radius: 16px;
    background: rgba(88, 230, 255, 0.045);
    padding: 20px;
}

.casino-archive-action-card h2 {
    margin: 5px 0 7px;
    color: var(--text);
    font-size: 1rem;
}

.casino-archive-action-card p {
    max-width: 650px;
    margin: 0;
    color: var(--muted);
    font-size: 0.83rem;
    line-height: 1.55;
}

.casino-archive-action-card form {
    flex: 0 0 auto;
    margin: 0;
}

@media (max-width: 720px) {
    .archive-casino-toolbar,
    .casino-archive-action-card {
        align-items: stretch;
        flex-direction: column;
    }

    .archive-casino-count {
        white-space: normal;
    }
}

/* MARKUZI-HOMEPAGE-ADMIN-THEME */
.admin-shell {
    --text: #f7fbff;
    --muted: #8ea3c4;
    --accent: #58e6ff;
    --border: rgba(104, 147, 208, 0.24);
    --surface: #08152b;
    --surface-2: #0c1d38;

    min-height: 100vh;
    background:
        radial-gradient(circle at 82% -12%, rgba(88, 230, 255, 0.12), transparent 30rem),
        radial-gradient(circle at 20% 10%, rgba(255, 210, 31, 0.06), transparent 24rem),
        #020817;
    color: var(--text);
}

.admin-shell .admin-sidebar {
    background:
        linear-gradient(180deg, rgba(9, 25, 51, 0.98), rgba(3, 12, 29, 0.99));
    border-right: 1px solid rgba(98, 150, 220, 0.26);
    box-shadow: 18px 0 55px rgba(0, 0, 0, 0.16);
}

.admin-shell .admin-main {
    background:
        radial-gradient(circle at 92% 0%, rgba(88, 230, 255, 0.06), transparent 24rem),
        transparent;
}

.admin-shell .admin-header {
    border-bottom: 1px solid rgba(98, 150, 220, 0.2);
    background: rgba(2, 8, 23, 0.68);
    backdrop-filter: blur(15px);
}

.admin-shell .admin-header h1,
.admin-shell .admin-page-heading h2,
.admin-shell h1,
.admin-shell h2,
.admin-shell h3 {
    color: #f7fbff;
}

.admin-shell .eyebrow {
    color: #58e6ff;
}

.admin-shell .admin-status-dot {
    background: #67e99e;
    box-shadow: 0 0 0 5px rgba(103, 233, 158, 0.1);
}

.admin-shell .admin-header-status {
    border: 1px solid rgba(103, 233, 158, 0.22);
    background: rgba(103, 233, 158, 0.07);
    color: #b9f8d2;
}

.admin-shell .admin-nav-group > summary {
    color: #dbe8fa;
}

.admin-shell .admin-nav-group > summary:hover {
    background: rgba(88, 230, 255, 0.06);
    color: #ffffff;
}

.admin-shell .admin-nav-children a,
.admin-shell .admin-back-link {
    color: #9eb2d0;
}

.admin-shell .admin-nav-children a:hover,
.admin-shell .admin-back-link:hover {
    background: rgba(88, 230, 255, 0.08);
    color: #f7fbff;
}

.admin-shell .admin-nav-children a.is-active {
    border: 1px solid rgba(88, 230, 255, 0.3);
    background:
        linear-gradient(135deg, rgba(88, 230, 255, 0.18), rgba(88, 230, 255, 0.06));
    box-shadow: inset 3px 0 0 #58e6ff;
    color: #ffffff;
}

.admin-shell .admin-user-card {
    border: 1px solid rgba(98, 150, 220, 0.22);
    background: rgba(8, 21, 43, 0.78);
}

.admin-shell .admin-user-avatar {
    background: linear-gradient(135deg, #58e6ff, #67e99e);
    color: #04111f;
    box-shadow: 0 8px 20px rgba(88, 230, 255, 0.18);
}

.admin-shell .card,
.admin-shell .admin-card,
.admin-shell .dashboard-card,
.admin-shell .stats-card,
.admin-shell .account-protection-card,
.admin-shell .role-management-card,
.admin-shell .permission-management-card,
.admin-shell .trash-casino-card,
.admin-shell .archive-casino-card {
    border-color: rgba(98, 150, 220, 0.23);
    background:
        linear-gradient(145deg, rgba(12, 29, 56, 0.96), rgba(6, 18, 38, 0.98));
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.17);
}

.admin-shell input,
.admin-shell select,
.admin-shell textarea {
    border-color: rgba(98, 150, 220, 0.3);
    background: rgba(2, 10, 25, 0.88);
    color: #f7fbff;
}

.admin-shell input:focus,
.admin-shell select:focus,
.admin-shell textarea:focus {
    border-color: #58e6ff;
    box-shadow: 0 0 0 3px rgba(88, 230, 255, 0.11);
}

.admin-shell .button-primary {
    border-color: transparent;
    background: linear-gradient(135deg, #68e99f, #55dfe9);
    box-shadow: 0 11px 24px rgba(83, 225, 190, 0.17);
    color: #031322;
}

.admin-shell .button-primary:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}

.admin-shell .button-secondary,
.admin-shell .button-ghost {
    border-color: rgba(98, 150, 220, 0.34);
    background: rgba(11, 29, 56, 0.8);
    color: #dcecff;
}

.admin-shell .button-secondary:hover,
.admin-shell .button-ghost:hover {
    border-color: rgba(88, 230, 255, 0.56);
    background: rgba(88, 230, 255, 0.1);
    color: #ffffff;
}

.admin-shell .permission-delete-button {
    border-color: rgba(255, 132, 145, 0.42);
    background: rgba(255, 101, 120, 0.1);
    color: #ffb3bd;
}

.admin-shell table th {
    border-color: rgba(98, 150, 220, 0.2);
    background: rgba(2, 11, 27, 0.56);
    color: #8ea8cd;
}

.admin-shell table td {
    border-color: rgba(98, 150, 220, 0.16);
}

.admin-shell table tbody tr:hover td {
    background: rgba(88, 230, 255, 0.035);
}

.admin-shell .form-error,
.admin-shell .security-auth-error {
    border-color: rgba(255, 140, 151, 0.34);
    background: rgba(255, 118, 132, 0.08);
    color: #ffc1c8;
}

.admin-shell .form-success,
.admin-shell .trash-casino-message-success,
.admin-shell .archive-casino-message-success {
    border-color: rgba(103, 233, 158, 0.3);
    background: rgba(103, 233, 158, 0.08);
    color: #b9f8d2;
}

.admin-shell .muted,
.admin-shell small,
.admin-shell p {
    color: #9eb1cd;
}

@media (max-width: 900px) {
    .admin-shell .admin-header {
        background: rgba(2, 8, 23, 0.92);
    }
}


/* MARKUZI-HOMEPAGE-VISUAL-POLISH */
.admin-shell {
    --accent: #58e6ff;
    --surface: #08152b;
    --surface-2: #0c1d38;
    --border: rgba(91, 146, 214, 0.27);
    --text: #f7fbff;
    --muted: #9bb1d0;
}

/* Rechte und Rollen: Cyan statt gelblicher Akzente */
.admin-shell .role-card,
.admin-shell .role-management-card,
.admin-shell .role-overview-card,
.admin-shell .role-summary-card {
    border-color: rgba(91, 146, 214, 0.33);
    background:
        linear-gradient(145deg, rgba(12, 29, 56, 0.98), rgba(5, 17, 36, 0.99));
}

.admin-shell .role-card .role-permission-count,
.admin-shell .role-card .role-badge,
.admin-shell .role-management-card .role-permission-count,
.admin-shell .role-management-card .role-badge,
.admin-shell [class*="role"] [class*="rights"],
.admin-shell [class*="role"] [class*="count"],
.admin-shell [class*="role"] [class*="badge"] {
    border-color: rgba(88, 230, 255, 0.42);
    background: rgba(88, 230, 255, 0.1);
    color: #58e6ff;
}

.admin-shell .role-card .eyebrow,
.admin-shell .role-management-card .eyebrow {
    color: #58e6ff;
}

/* Sidebar-Benutzerkarte */
.admin-shell .admin-sidebar-footer {
    padding: 16px;
}

.admin-shell .admin-user-card {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    border: 1px solid rgba(88, 230, 255, 0.28);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(10, 31, 60, 0.96), rgba(5, 17, 36, 0.98));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
    padding: 12px;
}

.admin-shell .admin-user-card > div:last-child {
    min-width: 0;
}

.admin-shell .admin-user-card strong {
    color: #f7fbff;
}

.admin-shell .admin-user-card small {
    display: block;
    overflow: hidden;
    color: #92afd2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .admin-user-avatar {
    background: linear-gradient(135deg, #58e6ff, #67e99e);
    color: #031322;
}

/* Login an das Homepage-Design angleichen */
.page-center:has(.login-card) {
    min-height: 100vh;
    background:
        radial-gradient(circle at 50% 14%, rgba(88, 230, 255, 0.12), transparent 25rem),
        radial-gradient(circle at 20% 80%, rgba(103, 233, 158, 0.07), transparent 24rem),
        #020817;
}

.page-center .login-card {
    border: 1px solid rgba(91, 146, 214, 0.31);
    border-radius: 22px;
    background:
        linear-gradient(145deg, rgba(12, 29, 56, 0.98), rgba(4, 14, 30, 0.99));
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.38);
}

.page-center .login-card .eyebrow {
    color: #58e6ff;
}

.page-center .login-card h1 {
    color: #f7fbff;
}

.page-center .login-card .muted {
    color: #9db5d5;
}

.page-center .login-card input {
    border-color: rgba(91, 146, 214, 0.32);
    background: rgba(2, 10, 25, 0.9);
    color: #f7fbff;
}

.page-center .login-card input:focus {
    border-color: #58e6ff;
    box-shadow: 0 0 0 3px rgba(88, 230, 255, 0.12);
}

.page-center .login-card .button-primary {
    border-color: transparent;
    background: linear-gradient(135deg, #67e99e, #58e6ff);
    box-shadow: 0 12px 25px rgba(83, 225, 190, 0.18);
    color: #031322;
}

.page-center .login-card .button-primary:hover {
    filter: brightness(1.05);
    transform: translateY(-1px);
}

.page-center .login-card .auth-password-reset-link a,
.page-center .login-card .text-link {
    color: #58e6ff;
}

.page-center .login-card .auth-password-reset-link a:hover,
.page-center .login-card .text-link:hover {
    color: #a7f4ff;
}

/* Gelb nur noch als Markenakzent, nicht als Admin-Interaktionsfarbe */
.admin-shell .button-primary,
.admin-shell .button-secondary,
.admin-shell .button-ghost,
.admin-shell .permission-delete-button {
    transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}
/* END MARKUZI-HOMEPAGE-VISUAL-POLISH */

/* MARKUZI-ACCOUNT-PROTECTION-CYAN-POLISH */
.admin-shell .account-protection-card,
.admin-shell .account-protection-card [class*="protection"],
.admin-shell .account-protection-card [class*="lock"] {
    border-color: rgba(88, 230, 255, 0.28);
}

/* Status „Geschützt“: Cyan statt Gelb/Grün */
.admin-shell .account-protection-card span,
.admin-shell .account-protection-card [class*="status"],
.admin-shell .account-protection-card [class*="badge"] {
    border-color: rgba(88, 230, 255, 0.42);
}

/* Nur kleine Status-Badges anpassen, nicht Überschriften oder Texte */
.admin-shell .account-protection-card span[class*="status"],
.admin-shell .account-protection-card span[class*="lock"],
.admin-shell .account-protection-card .security-lock-status,
.admin-shell .account-protection-card .account-protection-status {
    border: 1px solid rgba(88, 230, 255, 0.48);
    background: rgba(88, 230, 255, 0.1);
    color: #58e6ff;
    box-shadow: none;
}

/* Falls der Status ohne eigene Klasse direkt als kleiner Badge ausgegeben wird */
.admin-shell .account-protection-card span:not(.eyebrow) {
    text-shadow: none;
}

/* Entsperren bleibt als kontrollierte Blau-Aktion sichtbar */
.admin-shell .account-protection-card .button-secondary {
    border-color: rgba(88, 150, 255, 0.36);
    background: rgba(24, 75, 145, 0.22);
    color: #b9d7ff;
}

.admin-shell .account-protection-card .button-secondary:hover {
    border-color: rgba(88, 230, 255, 0.62);
    background: rgba(88, 230, 255, 0.12);
    color: #f7fbff;
}

/* MARKUZI-ADMIN-REMOVE-LEGACY-LIME */
.admin-shell .account-protection-card,
.admin-shell .account-protection-card > div,
.admin-shell .account-protection-card section,
.admin-shell .account-protection-card article,
.admin-shell .account-protection-card [class*="card"],
.admin-shell .account-protection-card [class*="action"],
.admin-shell .account-protection-card [class*="lock"],
.admin-shell .account-protection-card [class*="security"],
.admin-shell .account-protection-card [class*="protection"] {
    border-color: rgba(88, 230, 255, 0.32) !important;
}

/* Geschützt-Status und ähnliche Sicherheits-Badges */
.admin-shell .account-protection-card span[class],
.admin-shell .account-protection-card [class*="badge"],
.admin-shell .account-protection-card [class*="status"],
.admin-shell .account-protection-card [class*="pill"],
.admin-shell .account-protection-card [class*="locked"] {
    border-color: rgba(88, 230, 255, 0.48) !important;
}

.admin-shell .account-protection-card span[class*="badge"],
.admin-shell .account-protection-card span[class*="status"],
.admin-shell .account-protection-card span[class*="pill"],
.admin-shell .account-protection-card span[class*="locked"],
.admin-shell .account-protection-card .security-lock-status,
.admin-shell .account-protection-card .account-protection-status {
    background: rgba(88, 230, 255, 0.10) !important;
    color: #58e6ff !important;
}

/* Rollen-Anzeigen wie Admin, Entwickler und Rechte-Zähler */
.admin-shell [class*="role"][class*="badge"],
.admin-shell [class*="role"][class*="pill"],
.admin-shell [class*="role"][class*="status"],
.admin-shell [class*="permission"][class*="count"],
.admin-shell [class*="rights"][class*="count"],
.admin-shell [class*="role"] span[class*="badge"],
.admin-shell [class*="role"] span[class*="pill"] {
    border-color: rgba(88, 230, 255, 0.48) !important;
    background: rgba(88, 230, 255, 0.10) !important;
    color: #58e6ff !important;
}

/* Sekundäre Verwaltungsaktionen: Blau/Cyan statt Lime */
.admin-shell .account-protection-card button,
.admin-shell .account-protection-card .button-secondary,
.admin-shell .account-protection-card .button-ghost,
.admin-shell .role-management-card .button-secondary,
.admin-shell .role-management-card .button-ghost,
.admin-shell .role-card .button-secondary,
.admin-shell .role-card .button-ghost {
    border-color: rgba(88, 150, 255, 0.46) !important;
    background: rgba(20, 67, 132, 0.28) !important;
    color: #b9d7ff !important;
}

.admin-shell .account-protection-card button:hover,
.admin-shell .account-protection-card .button-secondary:hover,
.admin-shell .account-protection-card .button-ghost:hover,
.admin-shell .role-management-card .button-secondary:hover,
.admin-shell .role-management-card .button-ghost:hover,
.admin-shell .role-card .button-secondary:hover,
.admin-shell .role-card .button-ghost:hover {
    border-color: rgba(88, 230, 255, 0.74) !important;
    background: rgba(88, 230, 255, 0.13) !important;
    color: #f7fbff !important;
}

/* Auch Tabellen-Zeilen mit Rollenstatus bereinigen */
.admin-shell table [class*="role"],
.admin-shell table [class*="status"],
.admin-shell table [class*="badge"],
.admin-shell table [class*="pill"] {
    border-color: rgba(88, 230, 255, 0.46) !important;
}

.admin-shell table span[class*="role"],
.admin-shell table span[class*="status"],
.admin-shell table span[class*="badge"],
.admin-shell table span[class*="pill"] {
    background: rgba(88, 230, 255, 0.10) !important;
    color: #58e6ff !important;
}
/* END MARKUZI-ADMIN-REMOVE-LEGACY-LIME */


/* MARKUZI-LOCKED-STATE-RED */

/*
|--------------------------------------------------------------------------
| Gesperrte bzw. geschützte Elemente
|--------------------------------------------------------------------------
|
| Rot bedeutet: Aktion oder Recht ist absichtlich gesperrt.
| Cyan bleibt für neutrale Informationen und Rollen.
|
*/
.admin-shell [class*="lock"],
.admin-shell [class*="locked"],
.admin-shell [class*="protection"],
.admin-shell [class*="protected"],
.admin-shell [class*="security-lock"],
.admin-shell [class*="role-lock"],
.admin-shell [class*="role-protection"] {
    border-color: rgba(255, 119, 137, 0.48) !important;
}

/* Hinweis-Karten wie „Geschützte Kernrechte“ */
.admin-shell [class*="lock"] > div,
.admin-shell [class*="locked"] > div,
.admin-shell [class*="protection"] > div,
.admin-shell [class*="protected"] > div,
.admin-shell [class*="security-lock"] > div,
.admin-shell [class*="role-lock"] > div,
.admin-shell [class*="role-protection"] > div {
    border-color: rgba(255, 119, 137, 0.38) !important;
}

/* Badge „Geschützt“, „Gesperrt“ oder vergleichbare Statusanzeigen */
.admin-shell [class*="lock"] span,
.admin-shell [class*="locked"] span,
.admin-shell [class*="protection"] span,
.admin-shell [class*="protected"] span,
.admin-shell [class*="security-lock"] span,
.admin-shell [class*="role-lock"] span,
.admin-shell [class*="role-protection"] span {
    border-color: rgba(255, 119, 137, 0.58) !important;
    background: rgba(255, 92, 112, 0.11) !important;
    color: #ffabb6 !important;
}

/* Überschriften in geschützten Bereichen */
.admin-shell [class*="lock"] h1,
.admin-shell [class*="lock"] h2,
.admin-shell [class*="lock"] h3,
.admin-shell [class*="locked"] h1,
.admin-shell [class*="locked"] h2,
.admin-shell [class*="locked"] h3,
.admin-shell [class*="protection"] h1,
.admin-shell [class*="protection"] h2,
.admin-shell [class*="protection"] h3,
.admin-shell [class*="protected"] h1,
.admin-shell [class*="protected"] h2,
.admin-shell [class*="protected"] h3,
.admin-shell [class*="role-lock"] h1,
.admin-shell [class*="role-lock"] h2,
.admin-shell [class*="role-lock"] h3 {
    color: #ffd0d5 !important;
}

/*
|--------------------------------------------------------------------------
| Neutrale Rollen-Badges
|--------------------------------------------------------------------------
|
| Admin, Entwickler, Editor und User sind keine Warnung.
| Sie bleiben Cyan statt Gelb.
|
*/
.admin-shell [class*="role-badge"],
.admin-shell [class*="role-pill"],
.admin-shell [class*="role-status"],
.admin-shell [class*="permission-count"],
.admin-shell [class*="rights-count"] {
    border-color: rgba(88, 230, 255, 0.48) !important;
    background: rgba(88, 230, 255, 0.10) !important;
    color: #58e6ff !important;
}

/*
|--------------------------------------------------------------------------
| Verwaltungsaktionen
|--------------------------------------------------------------------------
*/
.admin-shell [class*="lock"] .button-secondary,
.admin-shell [class*="lock"] .button-ghost,
.admin-shell [class*="locked"] .button-secondary,
.admin-shell [class*="locked"] .button-ghost,
.admin-shell [class*="protection"] .button-secondary,
.admin-shell [class*="protection"] .button-ghost,
.admin-shell [class*="protected"] .button-secondary,
.admin-shell [class*="protected"] .button-ghost,
.admin-shell [class*="role-lock"] .button-secondary,
.admin-shell [class*="role-lock"] .button-ghost {
    border-color: rgba(82, 151, 255, 0.48) !important;
    background: rgba(22, 72, 145, 0.30) !important;
    color: #bddaff !important;
}

.admin-shell [class*="lock"] .button-secondary:hover,
.admin-shell [class*="lock"] .button-ghost:hover,
.admin-shell [class*="locked"] .button-secondary:hover,
.admin-shell [class*="locked"] .button-ghost:hover,
.admin-shell [class*="protection"] .button-secondary:hover,
.admin-shell [class*="protection"] .button-ghost:hover,
.admin-shell [class*="protected"] .button-secondary:hover,
.admin-shell [class*="protected"] .button-ghost:hover,
.admin-shell [class*="role-lock"] .button-secondary:hover,
.admin-shell [class*="role-lock"] .button-ghost:hover {
    border-color: rgba(88, 230, 255, 0.75) !important;
    background: rgba(88, 230, 255, 0.13) !important;
    color: #f7fbff !important;
}

/* END MARKUZI-LOCKED-STATE-RED */

/* MARKUZI-MANUAL-ACCOUNT-LOCK-STYLES */
.admin-shell .account-manual-lock-card {
    display: grid;
    gap: 18px;
    margin-top: 22px;
    border: 1px solid rgba(255, 112, 130, 0.5) !important;
    border-radius: 16px;
    background:
        linear-gradient(145deg, rgba(59, 14, 29, 0.42), rgba(15, 17, 35, 0.96)) !important;
    padding: 21px;
}

.account-manual-lock-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.account-manual-lock-heading h2 {
    margin: 5px 0 7px;
    color: #ffd6db !important;
    font-size: 1.05rem;
}

.account-manual-lock-heading p {
    max-width: 700px;
    margin: 0;
    color: #d6aeb6 !important;
    font-size: 0.84rem;
    line-height: 1.55;
}

.account-manual-lock-badge {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    border: 1px solid rgba(255, 112, 130, 0.64) !important;
    border-radius: 999px;
    background: rgba(255, 91, 112, 0.16) !important;
    color: #ffb7c0 !important;
    padding: 7px 10px;
    font-size: 0.72rem;
    font-weight: 900;
    white-space: nowrap;
}

.account-manual-lock-badge-open {
    border-color: rgba(103, 233, 158, 0.45) !important;
    background: rgba(103, 233, 158, 0.1) !important;
    color: #adf5ca !important;
}

.account-manual-lock-details {
    border: 1px solid rgba(255, 112, 130, 0.34);
    border-radius: 12px;
    background: rgba(24, 7, 17, 0.38);
    padding: 14px;
}

.account-manual-lock-details strong {
    display: block;
    color: #ffd6db;
    font-size: 0.82rem;
}

.account-manual-lock-details p {
    margin: 8px 0;
    color: #f1c8ce !important;
    font-size: 0.86rem;
    line-height: 1.55;
    white-space: pre-wrap;
}

.account-manual-lock-details small {
    color: #d598a4 !important;
}

.account-manual-lock-form {
    display: grid;
    gap: 9px;
}

.account-manual-lock-form label {
    color: #ffd6db;
    font-size: 0.8rem;
    font-weight: 850;
}

.admin-shell .account-manual-lock-form textarea {
    min-height: 104px;
    border-color: rgba(255, 112, 130, 0.42) !important;
    background: rgba(18, 6, 15, 0.76) !important;
    color: #f7fbff !important;
    resize: vertical;
}

.admin-shell .account-manual-lock-form textarea:focus {
    border-color: #ff8a9a !important;
    box-shadow: 0 0 0 3px rgba(255, 112, 130, 0.12) !important;
}

.account-manual-lock-button {
    width: fit-content;
    border: 1px solid rgba(255, 112, 130, 0.65) !important;
    background: linear-gradient(135deg, #d75468, #ff7b8b) !important;
    color: #25050d !important;
}

.account-manual-lock-button:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}

@media (max-width: 620px) {
    .account-manual-lock-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .account-manual-lock-badge {
        width: fit-content;
    }

    .account-manual-lock-button {
        width: 100%;
    }
}


/* MARKUZI-SUPPORT-TICKET-STYLES */

.admin-shell .support-admin-overview,
.admin-shell .support-ticket-admin-detail,
.admin-shell .support-category-page,
.admin-shell .support-category-form-page {
    display: grid;
    gap: 20px;
}

.admin-shell .support-admin-intro,
.admin-shell .support-ticket-admin-topbar,
.admin-shell .support-ticket-admin-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.admin-shell .support-admin-intro h2,
.admin-shell .support-ticket-admin-heading h2 {
    margin: 6px 0 7px;
    color: #f7fbff;
    font-size: clamp(1.4rem, 2.4vw, 1.95rem);
}

.admin-shell .support-admin-intro p,
.admin-shell .support-ticket-admin-heading p {
    max-width: 710px;
    margin: 0;
    color: #8ea3c4;
    line-height: 1.55;
}

.admin-shell .support-ticket-admin-heading p a {
    color: #58e6ff;
    text-decoration: none;
}

.admin-shell .support-admin-alert {
    border-radius: 14px;
    padding: 13px 15px;
    font-size: 0.86rem;
}

.admin-shell .support-admin-alert-success {
    border: 1px solid rgba(103, 233, 158, 0.32);
    background: rgba(47, 123, 87, 0.18);
    color: #bdf5d6;
}

.admin-shell .support-admin-alert-error {
    border: 1px solid rgba(255, 119, 137, 0.4);
    background: rgba(116, 21, 38, 0.25);
    color: #ffd0d5;
}

.admin-shell .support-admin-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
}

.admin-shell .support-admin-stats article {
    display: grid;
    gap: 7px;
    border: 1px solid rgba(88, 230, 255, 0.18);
    border-radius: 16px;
    background: rgba(10, 24, 50, 0.72);
    padding: 16px;
}

.admin-shell .support-admin-stats span {
    color: #8ea3c4;
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-shell .support-admin-stats strong {
    color: #58e6ff;
    font-size: 1.65rem;
}

.admin-shell .support-ticket-filter-card,
.admin-shell .support-admin-meta-card,
.admin-shell .support-admin-composer-card,
.admin-shell .support-admin-note-card,
.admin-shell .support-category-form-card {
    border: 1px solid rgba(88, 230, 255, 0.18);
    border-radius: 18px;
    background: rgba(9, 20, 43, 0.78);
    padding: 18px;
}

.admin-shell .support-ticket-filter-card form {
    display: grid;
    grid-template-columns: minmax(190px, 1.5fr) repeat(4, minmax(120px, 1fr)) auto;
    gap: 11px;
    align-items: end;
}

.admin-shell .support-ticket-filter-card label,
.admin-shell .support-category-form-card label {
    display: grid;
    gap: 7px;
}

.admin-shell .support-ticket-filter-card label > span,
.admin-shell .support-category-form-card label > span {
    color: #9eb3d3;
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-shell .support-ticket-filter-card input,
.admin-shell .support-ticket-filter-card select,
.admin-shell .support-admin-inline-form select,
.admin-shell .support-admin-composer textarea,
.admin-shell .support-category-form-card input {
    width: 100%;
    min-height: 42px;
    border: 1px solid rgba(142, 163, 196, 0.28);
    border-radius: 10px;
    background: rgba(1, 9, 25, 0.82);
    color: #f7fbff;
    padding: 9px 11px;
    font: inherit;
}

.admin-shell .support-admin-composer textarea {
    min-height: 142px;
    line-height: 1.55;
    resize: vertical;
}

.admin-shell .support-ticket-filter-card input:focus,
.admin-shell .support-ticket-filter-card select:focus,
.admin-shell .support-admin-inline-form select:focus,
.admin-shell .support-admin-composer textarea:focus,
.admin-shell .support-category-form-card input:focus {
    border-color: rgba(88, 230, 255, 0.72);
    box-shadow: 0 0 0 3px rgba(88, 230, 255, 0.1);
    outline: none;
}

.admin-shell .support-ticket-filter-actions {
    display: flex;
    gap: 8px;
}

.admin-shell .support-ticket-filter-actions .button {
    min-height: 42px;
    white-space: nowrap;
}

.admin-shell .support-ticket-table td strong,
.admin-shell .support-ticket-table td small {
    display: block;
}

.admin-shell .support-ticket-table td small {
    margin-top: 4px;
    color: #8ea3c4;
    font-size: 0.74rem;
    line-height: 1.4;
}

.admin-shell .support-status-badge,
.admin-shell .support-priority-badge,
.admin-shell .support-category-state {
    display: inline-flex;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 0.7rem;
    font-weight: 900;
    white-space: nowrap;
}

.admin-shell .support-status-open {
    border-color: rgba(88, 230, 255, 0.43);
    background: rgba(88, 230, 255, 0.1);
    color: #9ff3ff;
}

.admin-shell .support-status-in_progress {
    border-color: rgba(151, 129, 255, 0.42);
    background: rgba(113, 84, 230, 0.16);
    color: #ddd5ff;
}

.admin-shell .support-status-waiting_user {
    border-color: rgba(255, 211, 117, 0.36);
    background: rgba(122, 81, 15, 0.24);
    color: #ffe2a3;
}

.admin-shell .support-status-resolved {
    border-color: rgba(103, 233, 158, 0.38);
    background: rgba(44, 132, 85, 0.18);
    color: #bdf5d6;
}

.admin-shell .support-status-closed {
    border-color: rgba(255, 119, 137, 0.46);
    background: rgba(126, 24, 43, 0.25);
    color: #ffd0d5;
}

.admin-shell .support-priority-low {
    border-color: rgba(142, 163, 196, 0.32);
    background: rgba(142, 163, 196, 0.1);
    color: #c7d4e7;
}

.admin-shell .support-priority-normal {
    border-color: rgba(88, 230, 255, 0.35);
    background: rgba(88, 230, 255, 0.08);
    color: #9ff3ff;
}

.admin-shell .support-priority-high {
    border-color: rgba(255, 119, 137, 0.48);
    background: rgba(126, 24, 43, 0.25);
    color: #ffd0d5;
}

.admin-shell .support-admin-empty {
    display: grid;
    gap: 6px;
    padding: 17px 0;
    color: #9eb3d3;
    text-align: center;
}

.admin-shell .support-ticket-admin-grid {
    display: grid;
    grid-template-columns: minmax(245px, 0.72fr) minmax(0, 1.65fr);
    gap: 18px;
    align-items: start;
}

.admin-shell .support-ticket-admin-meta {
    display: grid;
    gap: 14px;
    position: sticky;
    top: 20px;
}

.admin-shell .support-admin-meta-card {
    display: grid;
    gap: 13px;
}

.admin-shell .support-admin-meta-card dl {
    display: grid;
    gap: 11px;
    margin: 0;
}

.admin-shell .support-admin-meta-card dl > div {
    display: grid;
    gap: 3px;
    border-bottom: 1px solid rgba(142, 163, 196, 0.14);
    padding-bottom: 10px;
}

.admin-shell .support-admin-meta-card dl > div:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.admin-shell .support-admin-meta-card dt {
    color: #8ea3c4;
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.admin-shell .support-admin-meta-card dd {
    margin: 0;
    color: #e7f0ff;
    font-size: 0.82rem;
    line-height: 1.45;
}

.admin-shell .support-admin-inline-form {
    display: grid;
    gap: 9px;
}

.admin-shell .support-ticket-admin-conversation {
    display: grid;
    gap: 16px;
}

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

.admin-shell .support-admin-message {
    border: 1px solid rgba(142, 163, 196, 0.2);
    border-radius: 17px;
    background: rgba(9, 20, 43, 0.78);
    padding: 16px;
}

.admin-shell .support-admin-message.is-visitor {
    border-color: rgba(88, 230, 255, 0.28);
    background: rgba(7, 45, 68, 0.5);
}

.admin-shell .support-admin-message.is-staff {
    border-color: rgba(103, 233, 158, 0.22);
    background: rgba(12, 47, 40, 0.34);
}

.admin-shell .support-admin-message.is-internal {
    border-color: rgba(151, 129, 255, 0.34);
    background: rgba(47, 30, 91, 0.34);
}

.admin-shell .support-admin-message-meta {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 9px;
}

.admin-shell .support-admin-message-meta strong {
    color: #58e6ff;
    font-size: 0.8rem;
}

.admin-shell .support-admin-message.is-internal .support-admin-message-meta strong {
    color: #d5caff;
}

.admin-shell .support-admin-message-meta span,
.admin-shell .support-admin-message small {
    color: #8ea3c4;
    font-size: 0.72rem;
}

.admin-shell .support-admin-message-body {
    color: #e5edf9;
    font-size: 0.9rem;
    line-height: 1.65;
}

.admin-shell .support-admin-composer-card,
.admin-shell .support-admin-note-card {
    display: grid;
    gap: 15px;
}

.admin-shell .support-admin-composer-card h3,
.admin-shell .support-admin-note-card h3 {
    margin: 5px 0 7px;
    color: #f7fbff;
    font-size: 1rem;
}

.admin-shell .support-admin-composer-card p,
.admin-shell .support-admin-note-card p {
    margin: 0;
    color: #8ea3c4;
    font-size: 0.82rem;
    line-height: 1.5;
}

.admin-shell .support-admin-composer {
    display: grid;
    gap: 10px;
}

.admin-shell .support-admin-composer .button {
    width: fit-content;
}

.admin-shell .support-ticket-admin-closed {
    border: 1px solid rgba(255, 119, 137, 0.38);
    border-radius: 16px;
    background: rgba(126, 24, 43, 0.18);
    color: #ffd0d5;
    padding: 16px;
}

.admin-shell .support-ticket-admin-closed p {
    margin: 6px 0 0;
    color: #e5b6c0;
    font-size: 0.84rem;
    line-height: 1.5;
}

.admin-shell .support-category-state.is-active {
    border-color: rgba(103, 233, 158, 0.38);
    background: rgba(44, 132, 85, 0.18);
    color: #bdf5d6;
}

.admin-shell .support-category-state.is-inactive {
    border-color: rgba(142, 163, 196, 0.28);
    background: rgba(142, 163, 196, 0.1);
    color: #c7d4e7;
}

.admin-shell .support-category-form-page {
    max-width: 780px;
}

.admin-shell .support-category-form-card {
    display: grid;
    gap: 16px;
    margin-top: 2px;
}

.admin-shell .support-category-form-card h2 {
    margin: 5px 0 7px;
    color: #f7fbff;
}

.admin-shell .support-category-form-card p {
    margin: 0;
    color: #8ea3c4;
    font-size: 0.84rem;
    line-height: 1.5;
}

.admin-shell .support-category-checkbox {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
}

.admin-shell .support-category-checkbox input {
    width: 18px;
    min-height: 18px;
    accent-color: #58e6ff;
}

.admin-shell .support-category-checkbox span {
    color: #dbe8f7 !important;
    font-size: 0.83rem !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

@media (max-width: 1120px) {
    .admin-shell .support-ticket-filter-card form {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .admin-shell .support-ticket-admin-grid {
        grid-template-columns: 1fr;
    }

    .admin-shell .support-ticket-admin-meta {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .admin-shell .support-admin-intro,
    .admin-shell .support-ticket-admin-topbar,
    .admin-shell .support-ticket-admin-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .support-admin-stats,
    .admin-shell .support-ticket-filter-card form,
    .admin-shell .support-ticket-admin-meta {
        grid-template-columns: 1fr;
    }

    .admin-shell .support-ticket-filter-actions,
    .admin-shell .support-ticket-filter-actions .button,
    .admin-shell .support-admin-composer .button {
        width: 100%;
    }

    .admin-shell .support-admin-message-meta {
        align-items: start;
        flex-direction: column;
        gap: 4px;
    }
}

/* END MARKUZI-SUPPORT-TICKET-STYLES */


/* MARKUZI-SUPPORT-ATTACHMENT-ARCHIVE-STYLES */

.admin-shell .support-ticket-action-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
}

.admin-shell .support-ticket-action-row form {
    margin: 0;
}

.admin-shell .support-force-delete-button {
    border-color: rgba(255, 119, 137, 0.58) !important;
    background: rgba(126, 24, 43, 0.3) !important;
    color: #ffd0d5 !important;
}

.admin-shell .support-force-delete-button:hover {
    border-color: rgba(255, 119, 137, 0.86) !important;
    background: rgba(176, 37, 62, 0.38) !important;
}

.admin-shell .support-archive-banner {
    display: grid;
    gap: 5px;
    border: 1px solid rgba(151, 129, 255, 0.42);
    border-radius: 15px;
    background: rgba(47, 30, 91, 0.28);
    color: #ded6ff;
    padding: 14px 16px;
}

.admin-shell .support-archive-banner strong {
    color: #ede9ff;
    font-size: 0.84rem;
}

.admin-shell .support-archive-banner span {
    color: #bfb4ee;
    font-size: 0.78rem;
}

.admin-shell .support-admin-attachments {
    display: grid;
    gap: 7px;
    margin-top: 13px;
}

.admin-shell .support-admin-attachments > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(88, 230, 255, 0.23);
    border-radius: 10px;
    background: rgba(1, 9, 25, 0.46);
    padding: 8px 9px;
}

.admin-shell .support-admin-attachments a {
    color: #8ff2ff;
    font-size: 0.77rem;
    font-weight: 800;
    text-decoration: none;
}

.admin-shell .support-admin-attachments a:hover {
    color: #f7fbff;
    text-decoration: underline;
}

.admin-shell .support-admin-attachments small {
    color: #8ea3c4;
    font-size: 0.7rem;
}

.admin-shell .support-admin-attachments form {
    margin: 0 0 0 auto;
}

.admin-shell .support-admin-attachments button {
    border: 1px solid rgba(255, 119, 137, 0.42);
    border-radius: 8px;
    background: rgba(126, 24, 43, 0.22);
    color: #ffc3cc;
    cursor: pointer;
    padding: 5px 7px;
    font: inherit;
    font-size: 0.7rem;
    font-weight: 850;
}

.admin-shell .support-admin-attachments button:hover {
    border-color: rgba(255, 119, 137, 0.72);
    background: rgba(176, 37, 62, 0.3);
}

.admin-shell .support-admin-attachment-input {
    display: grid;
    gap: 7px;
    border: 1px dashed rgba(88, 230, 255, 0.34);
    border-radius: 12px;
    background: rgba(88, 230, 255, 0.04);
    padding: 12px;
}

.admin-shell .support-admin-attachment-input > span {
    color: #dbe8f7;
    font-size: 0.78rem;
    font-weight: 850;
}

.admin-shell .support-admin-attachment-input input[type="file"] {
    width: 100%;
    min-height: 40px;
    border: 1px dashed rgba(142, 163, 196, 0.34);
    border-radius: 9px;
    background: rgba(1, 9, 25, 0.82);
    color: #e7f0ff;
    padding: 8px;
}

.admin-shell .support-admin-attachment-input small {
    color: #8ea3c4;
    font-size: 0.72rem;
    line-height: 1.45;
}

@media (max-width: 640px) {
    .admin-shell .support-ticket-action-row {
        justify-content: flex-start;
    }

    .admin-shell .support-admin-attachments form {
        margin-left: 0;
    }
}

/* END MARKUZI-SUPPORT-ATTACHMENT-ARCHIVE-STYLES */


/* MARKUZI-SUPPORT-TAGS-TEMPLATES-STYLES */

.admin-shell .support-ticket-filter-card form {
    grid-template-columns:
        minmax(185px, 1.45fr)
        repeat(5, minmax(110px, 1fr))
        auto;
}

.admin-shell .support-ticket-tag-list,
.admin-shell .support-ticket-tag-options {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.admin-shell .support-ticket-tag {
    display: inline-flex;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 0.7rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.admin-shell .support-ticket-tag-cyan {
    border-color: rgba(88, 230, 255, 0.42);
    background: rgba(88, 230, 255, 0.10);
    color: #a3f4ff;
}

.admin-shell .support-ticket-tag-mint {
    border-color: rgba(103, 233, 158, 0.42);
    background: rgba(103, 233, 158, 0.10);
    color: #c3f8d8;
}

.admin-shell .support-ticket-tag-purple {
    border-color: rgba(163, 139, 250, 0.44);
    background: rgba(124, 58, 237, 0.16);
    color: #e0d8ff;
}

.admin-shell .support-ticket-tag-gold {
    border-color: rgba(255, 211, 117, 0.42);
    background: rgba(122, 81, 15, 0.24);
    color: #ffe3a4;
}

.admin-shell .support-ticket-tag-red {
    border-color: rgba(255, 119, 137, 0.5);
    background: rgba(126, 24, 43, 0.25);
    color: #ffd0d5;
}

.admin-shell .support-ticket-tag-slate {
    border-color: rgba(142, 163, 196, 0.32);
    background: rgba(142, 163, 196, 0.1);
    color: #cbd8ea;
}

.admin-shell .support-ticket-tag-empty {
    color: #8ea3c4;
    font-size: 0.78rem;
}

.admin-shell .support-ticket-tag-form {
    display: grid;
    gap: 11px;
    margin-top: 4px;
}

.admin-shell .support-ticket-tag-options label {
    cursor: pointer;
}

.admin-shell .support-ticket-tag-options input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.admin-shell .support-ticket-tag-options input + span {
    opacity: 0.52;
    transition: 0.16s ease;
}

.admin-shell .support-ticket-tag-options input:checked + span {
    box-shadow: 0 0 0 2px rgba(247, 251, 255, 0.14);
    opacity: 1;
    transform: translateY(-1px);
}

.admin-shell .support-ticket-tag-options label:hover input + span {
    opacity: 1;
}

.admin-shell .support-reply-template-select {
    display: grid;
    gap: 7px;
    border: 1px dashed rgba(88, 230, 255, 0.32);
    border-radius: 12px;
    background: rgba(88, 230, 255, 0.04);
    padding: 12px;
}

.admin-shell .support-reply-template-select > span {
    color: #dbe8f7;
    font-size: 0.78rem;
    font-weight: 850;
}

.admin-shell .support-reply-template-select select {
    width: 100%;
    min-height: 42px;
    border: 1px solid rgba(142, 163, 196, 0.28);
    border-radius: 10px;
    background: rgba(1, 9, 25, 0.82);
    color: #f7fbff;
    padding: 9px 11px;
    font: inherit;
}

.admin-shell .support-reply-template-select small {
    color: #8ea3c4;
    font-size: 0.72rem;
    line-height: 1.45;
}

.admin-shell .support-category-form-card textarea {
    width: 100%;
    min-height: 180px;
    border: 1px solid rgba(142, 163, 196, 0.28);
    border-radius: 10px;
    background: rgba(1, 9, 25, 0.82);
    color: #f7fbff;
    padding: 11px;
    font: inherit;
    line-height: 1.55;
    resize: vertical;
}

.admin-shell .support-category-form-card select {
    width: 100%;
    min-height: 42px;
    border: 1px solid rgba(142, 163, 196, 0.28);
    border-radius: 10px;
    background: rgba(1, 9, 25, 0.82);
    color: #f7fbff;
    padding: 9px 11px;
    font: inherit;
}

.admin-shell .support-category-form-card textarea:focus,
.admin-shell .support-category-form-card select:focus {
    border-color: rgba(88, 230, 255, 0.72);
    box-shadow: 0 0 0 3px rgba(88, 230, 255, 0.1);
    outline: none;
}

.admin-shell .support-category-form-card code {
    border: 1px solid rgba(88, 230, 255, 0.25);
    border-radius: 6px;
    background: rgba(88, 230, 255, 0.08);
    color: #a4f3ff;
    padding: 2px 5px;
    font-size: 0.78rem;
}

@media (max-width: 1240px) {
    .admin-shell .support-ticket-filter-card form {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .admin-shell .support-ticket-tag-options {
        display: grid;
        grid-template-columns: 1fr;
    }

    .admin-shell .support-ticket-tag-options label,
    .admin-shell .support-ticket-tag-options span {
        width: 100%;
    }
}

/* END MARKUZI-SUPPORT-TAGS-TEMPLATES-STYLES */

/* MARKUZI-SUPPORT-WORKSPACE-STYLES */

.admin-shell .support-workspace-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.admin-shell .support-workspace-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 22px 0;
}

.admin-shell .support-workspace-stats article {
    display: grid;
    gap: 7px;
    min-height: 104px;
    border: 1px solid rgba(88, 230, 255, 0.20);
    border-radius: 15px;
    background: linear-gradient(
        145deg,
        rgba(13, 34, 60, 0.90),
        rgba(3, 12, 30, 0.92)
    );
    padding: 16px;
}

.admin-shell .support-workspace-stats span {
    color: #9eb4d1;
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1.35;
}

.admin-shell .support-workspace-stats strong {
    color: #f7fbff;
    font-size: 1.42rem;
    letter-spacing: -0.02em;
}

.admin-shell .support-workspace-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.admin-shell .support-workspace-card {
    overflow: hidden;
    border: 1px solid rgba(88, 230, 255, 0.20);
    border-radius: 16px;
    background: rgba(4, 15, 34, 0.84);
}

.admin-shell .support-workspace-card-wide {
    grid-column: 1 / -1;
}

.admin-shell .support-workspace-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid rgba(142, 163, 196, 0.16);
    padding: 17px 18px;
}

.admin-shell .support-workspace-card-heading h3 {
    margin: 5px 0 0;
    color: #f7fbff;
    font-size: 1rem;
}

.admin-shell .support-workspace-card-heading a {
    color: #9df3ff;
    font-size: 0.76rem;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

.admin-shell .support-workspace-card-heading a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.admin-shell .support-workspace-ticket {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid rgba(142, 163, 196, 0.12);
    color: inherit;
    padding: 14px 18px;
    text-decoration: none;
}

.admin-shell .support-workspace-ticket:last-child {
    border-bottom: 0;
}

.admin-shell .support-workspace-ticket:hover {
    background: rgba(88, 230, 255, 0.055);
}

.admin-shell .support-workspace-ticket > div:first-child {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.admin-shell .support-workspace-ticket strong {
    overflow: hidden;
    color: #f7fbff;
    font-size: 0.84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .support-workspace-ticket span,
.admin-shell .support-workspace-ticket small {
    color: #91a7c5;
    font-size: 0.72rem;
}

.admin-shell .support-workspace-ticket-meta {
    display: grid;
    justify-items: end;
    gap: 6px;
    flex: 0 0 auto;
}

.admin-shell .support-workspace-empty {
    color: #91a7c5;
    font-size: 0.8rem;
    padding: 22px 18px;
}

.admin-shell .support-notification-page {
    display: grid;
    gap: 16px;
    max-width: 880px;
}

.admin-shell .support-notification-card {
    display: grid;
    gap: 20px;
    border: 1px solid rgba(88, 230, 255, 0.20);
    border-radius: 17px;
    background: rgba(4, 15, 34, 0.84);
    padding: 22px;
}

.admin-shell .support-notification-card h2 {
    margin: 6px 0 8px;
    color: #f7fbff;
}

.admin-shell .support-notification-card p {
    margin: 0;
    color: #9eb4d1;
    line-height: 1.6;
}

.admin-shell .support-notification-options {
    display: grid;
    gap: 10px;
}

.admin-shell .support-notification-options label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid rgba(142, 163, 196, 0.20);
    border-radius: 12px;
    background: rgba(1, 9, 25, 0.45);
    cursor: pointer;
    padding: 14px;
}

.admin-shell .support-notification-options label:hover {
    border-color: rgba(88, 230, 255, 0.46);
    background: rgba(88, 230, 255, 0.055);
}

.admin-shell .support-notification-options input {
    accent-color: #67e8f9;
    margin-top: 3px;
}

.admin-shell .support-notification-options span {
    display: grid;
    gap: 4px;
}

.admin-shell .support-notification-options strong {
    color: #eaf4ff;
    font-size: 0.84rem;
}

.admin-shell .support-notification-options small {
    color: #8fa6c4;
    font-size: 0.75rem;
    line-height: 1.45;
}

.admin-shell .support-notification-permission-note {
    display: grid;
    gap: 5px;
    border: 1px solid rgba(255, 195, 96, 0.35);
    border-radius: 12px;
    background: rgba(113, 73, 8, 0.20);
    color: #ffdc99;
    padding: 13px 14px;
}

.admin-shell .support-notification-permission-note strong {
    font-size: 0.8rem;
}

.admin-shell .support-notification-permission-note span {
    color: #e4c789;
    font-size: 0.76rem;
    line-height: 1.5;
}

@media (max-width: 1120px) {
    .admin-shell .support-workspace-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .admin-shell .support-workspace-grid {
        grid-template-columns: 1fr;
    }

    .admin-shell .support-workspace-card-wide {
        grid-column: auto;
    }

    .admin-shell .support-workspace-ticket {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-shell .support-workspace-ticket-meta {
        justify-items: start;
    }
}

@media (max-width: 500px) {
    .admin-shell .support-workspace-stats {
        grid-template-columns: 1fr;
    }

    .admin-shell .support-workspace-actions {
        display: grid;
    }

    .admin-shell .support-workspace-actions .button {
        width: 100%;
        text-align: center;
    }
}

/* END MARKUZI-SUPPORT-WORKSPACE-STYLES */

/* MARKUZI-SUPPORT-RATING-ADMIN-STYLES */

.admin-shell .support-rating-admin-page {
    display: grid;
    gap: 18px;
}

.admin-shell .support-rating-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.admin-shell .support-rating-stats article {
    display: grid;
    gap: 7px;
    border: 1px solid rgba(88, 230, 255, 0.20);
    border-radius: 15px;
    background: linear-gradient(
        145deg,
        rgba(13, 34, 60, 0.90),
        rgba(3, 12, 30, 0.92)
    );
    padding: 16px;
}

.admin-shell .support-rating-stats span {
    color: #9eb4d1;
    font-size: 0.74rem;
    font-weight: 800;
}

.admin-shell .support-rating-stats strong {
    color: #f7fbff;
    font-size: 1.35rem;
}

.admin-shell .support-rating-stats strong small {
    color: #9eb4d1;
    font-size: 0.74rem;
}

.admin-shell .support-rating-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-shell .support-rating-filter a {
    border: 1px solid rgba(142, 163, 196, 0.28);
    border-radius: 999px;
    color: #abc0da;
    font-size: 0.76rem;
    font-weight: 800;
    padding: 8px 12px;
    text-decoration: none;
}

.admin-shell .support-rating-filter a:hover,
.admin-shell .support-rating-filter a.is-active {
    border-color: rgba(88, 230, 255, 0.72);
    background: rgba(88, 230, 255, 0.12);
    color: #dffbff;
}

.admin-shell .support-rating-table td {
    vertical-align: top;
}

.admin-shell .support-rating-table td > strong,
.admin-shell .support-rating-table td > small {
    display: block;
}

.admin-shell .support-rating-table td > small {
    margin-top: 4px;
    color: #8fa6c4;
    font-size: 0.72rem;
}

.admin-shell .support-rating-table-stars {
    display: inline-flex;
    gap: 2px;
    color: #465b78;
    font-size: 1rem;
}

.admin-shell .support-rating-table-stars .is-filled {
    color: #8ff3ff;
}

.admin-shell .support-rating-comment-cell {
    min-width: 250px;
    color: #c7d7ea;
    line-height: 1.55;
    white-space: pre-line;
}

.admin-shell .support-rating-ticket-card {
    display: grid;
    gap: 14px;
    margin-top: 18px;
    border: 1px solid rgba(88, 230, 255, 0.26);
    border-radius: 16px;
    background: rgba(4, 15, 34, 0.84);
    padding: 20px;
}

.admin-shell .support-rating-ticket-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.admin-shell .support-rating-ticket-card-heading h2 {
    margin: 5px 0 0;
    color: #f7fbff;
    font-size: 1rem;
}

.admin-shell .support-rating-score {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: #465b78;
    font-size: 1.2rem;
}

.admin-shell .support-rating-score .is-filled {
    color: #8ff3ff;
}

.admin-shell .support-rating-score strong {
    margin-left: 6px;
    color: #dffbff;
    font-size: 0.82rem;
}

.admin-shell .support-rating-comment {
    margin: 0;
    border-left: 3px solid #67e8f9;
    color: #d3e5f8;
    line-height: 1.7;
    padding-left: 13px;
}

.admin-shell .support-rating-no-comment,
.admin-shell .support-rating-ticket-date {
    color: #91a7c5;
    font-size: 0.78rem;
}

@media (max-width: 860px) {
    .admin-shell .support-rating-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-shell .support-rating-ticket-card-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 500px) {
    .admin-shell .support-rating-stats {
        grid-template-columns: 1fr;
    }
}

/* END MARKUZI-SUPPORT-RATING-ADMIN-STYLES */

/* MARKUZI-CRITICAL-RATINGS-DASHBOARD-STYLES */

.admin-shell .support-workspace-stat-critical {
    border-color: rgba(255, 116, 132, 0.48) !important;
    background: linear-gradient(
        145deg,
        rgba(71, 17, 31, 0.88),
        rgba(30, 8, 20, 0.94)
    ) !important;
}

.admin-shell .support-workspace-stat-critical strong {
    color: #ffb4bf;
}

.admin-shell .support-critical-rating-card {
    border-color: rgba(255, 116, 132, 0.34);
}

.admin-shell .support-critical-rating-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid rgba(142, 163, 196, 0.12);
    color: inherit;
    padding: 15px 18px;
    text-decoration: none;
}

.admin-shell .support-critical-rating-row:last-child {
    border-bottom: 0;
}

.admin-shell .support-critical-rating-row:hover {
    background: rgba(255, 116, 132, 0.07);
}

.admin-shell .support-critical-rating-row > div:first-child {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.admin-shell .support-critical-rating-row strong {
    overflow: hidden;
    color: #f7fbff;
    font-size: 0.84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .support-critical-rating-row span,
.admin-shell .support-critical-rating-row small {
    color: #9bb0cb;
    font-size: 0.72rem;
    line-height: 1.45;
}

.admin-shell .support-critical-rating-row > div:first-child > small {
    color: #c7d7ea;
}

.admin-shell .support-critical-rating-meta {
    display: grid;
    justify-items: end;
    gap: 6px;
    flex: 0 0 auto;
}

.admin-shell .support-critical-rating-stars {
    display: inline-flex;
    gap: 2px;
    color: #536984;
    font-size: 1rem;
}

.admin-shell .support-critical-rating-stars .is-filled {
    color: #ff9cab;
}

@media (max-width: 640px) {
    .admin-shell .support-critical-rating-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-shell .support-critical-rating-meta {
        justify-items: start;
    }
}

/* END MARKUZI-CRITICAL-RATINGS-DASHBOARD-STYLES */

/* MARKUZI-ACCOUNT-PROFILE-STYLES */

.admin-shell .account-profile-page {
    display: grid;
    gap: 18px;
    max-width: 1100px;
}

.admin-shell .account-profile-intro {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 22px;
}

.admin-shell .account-profile-intro h2 {
    margin: 6px 0 8px;
    color: #f7fbff;
}

.admin-shell .account-profile-intro p {
    margin: 0;
    color: #9eb4d1;
    line-height: 1.6;
    max-width: 670px;
}

.admin-shell .account-profile-identity {
    display: flex;
    align-items: center;
    gap: 11px;
    flex: 0 0 auto;
    border: 1px solid rgba(88, 230, 255, 0.20);
    border-radius: 14px;
    background: rgba(4, 15, 34, 0.84);
    padding: 11px 14px;
}

.admin-shell .account-profile-identity > span {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(103, 232, 249, 0.16);
    color: #a9f7ff;
    font-size: 0.9rem;
    font-weight: 900;
}

.admin-shell .account-profile-identity div {
    display: grid;
    gap: 3px;
}

.admin-shell .account-profile-identity strong {
    color: #effaff;
    font-size: 0.82rem;
}

.admin-shell .account-profile-identity small {
    color: #9eb4d1;
    font-size: 0.7rem;
}

.admin-shell .account-profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.admin-shell .account-profile-card {
    display: grid;
    align-content: start;
    gap: 18px;
    border: 1px solid rgba(88, 230, 255, 0.20);
    border-radius: 16px;
    background: rgba(4, 15, 34, 0.84);
    padding: 21px;
}

.admin-shell .account-profile-card h3 {
    margin: 6px 0 8px;
    color: #f7fbff;
    font-size: 1.05rem;
}

.admin-shell .account-profile-card p {
    margin: 0;
    color: #9eb4d1;
    font-size: 0.82rem;
    line-height: 1.6;
}

.admin-shell .account-profile-card p strong {
    color: #dffbff;
    overflow-wrap: anywhere;
}

.admin-shell .account-profile-form {
    display: grid;
    gap: 13px;
}

.admin-shell .account-profile-form label {
    display: grid;
    gap: 7px;
}

.admin-shell .account-profile-form label > span {
    color: #c9d9ec;
    font-size: 0.78rem;
    font-weight: 800;
}

.admin-shell .account-profile-form input {
    width: 100%;
    border: 1px solid rgba(142, 163, 196, 0.28);
    border-radius: 10px;
    background: rgba(1, 9, 25, 0.64);
    color: #eef9ff;
    outline: none;
    padding: 11px 12px;
}

.admin-shell .account-profile-form input:focus {
    border-color: rgba(103, 232, 249, 0.74);
    box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.10);
}

.admin-shell .account-profile-lock-note {
    display: grid;
    gap: 5px;
    border: 1px solid rgba(255, 116, 132, 0.38);
    border-radius: 12px;
    background: rgba(93, 18, 34, 0.24);
    color: #ffd6dc;
    padding: 14px;
}

.admin-shell .account-profile-lock-note strong {
    font-size: 0.8rem;
}

.admin-shell .account-profile-lock-note span {
    color: #eeb3bd;
    font-size: 0.76rem;
    line-height: 1.5;
}

@media (max-width: 820px) {
    .admin-shell .account-profile-intro {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .account-profile-identity {
        width: fit-content;
    }

    .admin-shell .account-profile-grid {
        grid-template-columns: 1fr;
    }
}

/* END MARKUZI-ACCOUNT-PROFILE-STYLES */

/* MARKUZI-USER-LIVE-STATUS-STYLES */

.admin-shell .admin-user-status-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 130px;
}

.admin-shell .admin-user-status {
    display: inline-flex;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.69rem;
    font-weight: 850;
    line-height: 1;
    padding: 7px 9px;
    white-space: nowrap;
}

.admin-shell .admin-user-status-active {
    border-color: rgba(108, 244, 190, 0.34);
    background: rgba(31, 129, 98, 0.20);
    color: #a9ffd9;
}

.admin-shell .admin-user-status-login {
    border-color: rgba(255, 145, 158, 0.44);
    background: rgba(121, 25, 44, 0.24);
    color: #ffc0c9;
}

.admin-shell .admin-user-status-manual {
    border-color: rgba(255, 96, 115, 0.58);
    background: rgba(104, 14, 31, 0.42);
    color: #ffb0ba;
}

.admin-shell .admin-email-protected {
    border: 1px solid rgba(142, 163, 196, 0.24);
    border-radius: 999px;
    color: #9eb4d1;
    font-size: 0.73rem;
    font-weight: 800;
    padding: 6px 9px;
}

/* END MARKUZI-USER-LIVE-STATUS-STYLES */

/* MARKUZI-LOCK-ACTION-REFRESH */

.admin-shell .account-manual-lock-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 16px;
    border: 1px solid rgba(255, 110, 132, 0.32);
    border-radius: 18px;
    background:
        linear-gradient(135deg, rgba(58, 10, 24, 0.28), rgba(16, 7, 27, 0.84)),
        rgba(7, 15, 34, 0.92);
    padding: 22px;
}

.admin-shell .account-manual-lock-card .account-manual-lock-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-right: 250px;
}

.admin-shell .account-manual-lock-card .account-manual-lock-heading h2 {
    margin: 6px 0 8px;
    color: #f8fbff;
}

.admin-shell .account-manual-lock-card .account-manual-lock-heading p {
    margin: 0;
    max-width: 720px;
    color: #b8c7dc;
    line-height: 1.6;
}

.admin-shell .account-manual-lock-card .account-manual-lock-details {
    display: grid;
    gap: 6px;
    max-width: calc(100% - 270px);
    border: 1px solid rgba(255, 110, 132, 0.18);
    border-radius: 14px;
    background: rgba(14, 10, 24, 0.34);
    padding: 14px 16px;
}

.admin-shell .account-manual-lock-card .account-manual-lock-details strong {
    color: #ffe5ea;
    font-size: 0.82rem;
    font-weight: 900;
}

.admin-shell .account-manual-lock-card .account-manual-lock-details p {
    margin: 0;
    color: #d7ddeb;
    line-height: 1.55;
}

.admin-shell .account-manual-lock-card .account-manual-lock-details small {
    color: #aebcd3;
    font-size: 0.72rem;
}

.admin-shell .account-manual-lock-card .account-manual-lock-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    border: 1px solid rgba(255, 120, 140, 0.42);
    border-radius: 999px;
    background: rgba(113, 21, 39, 0.32);
    color: #ffd6de;
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1;
    padding: 9px 14px;
    white-space: nowrap;
}

.admin-shell .account-manual-lock-card .account-manual-lock-badge-open {
    border-color: rgba(103, 232, 249, 0.28);
    background: rgba(13, 64, 78, 0.30);
    color: #aef5ff;
}

.admin-shell .account-manual-lock-card .account-protection-actions {
    position: absolute;
    top: 22px;
    right: 22px;
    display: grid;
    gap: 10px;
    width: 220px;
    margin: 0;
}

.admin-shell .account-manual-lock-card .account-protection-actions form {
    margin: 0;
}

.admin-shell .account-manual-lock-card .account-protection-actions .button,
.admin-shell .account-manual-lock-card .account-protection-actions .permission-delete-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    border-radius: 12px;
    font-weight: 900;
    text-align: center;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}

.admin-shell .account-manual-lock-card .account-protection-actions .button.button-primary {
    border: 1px solid rgba(108, 244, 190, 0.30);
    background: linear-gradient(135deg, rgba(108, 244, 190, 0.94), rgba(103, 232, 249, 0.90));
    color: #041425;
}

.admin-shell .account-manual-lock-card .account-protection-actions .button.button-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(79, 196, 174, 0.24);
}

.admin-shell .account-manual-lock-card .account-protection-actions .permission-delete-button,
.admin-shell .account-manual-lock-card .account-protection-actions .button.button-danger {
    border: 1px solid rgba(255, 118, 138, 0.42);
    background: linear-gradient(135deg, rgba(149, 31, 56, 0.96), rgba(111, 17, 43, 0.96));
    color: #fff3f6;
}

.admin-shell .account-manual-lock-card .account-protection-actions .permission-delete-button:hover,
.admin-shell .account-manual-lock-card .account-protection-actions .button.button-danger:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(124, 17, 40, 0.28);
}

@media (max-width: 980px) {
    .admin-shell .account-manual-lock-card .account-manual-lock-heading {
        padding-right: 0;
    }

    .admin-shell .account-manual-lock-card .account-manual-lock-details {
        max-width: 100%;
    }

    .admin-shell .account-manual-lock-card .account-protection-actions {
        position: static;
        width: 100%;
    }
}

/* END MARKUZI-LOCK-ACTION-REFRESH */

/* MARKUZI-SECURITY-ACTIONS-TOP-FIX */

.admin-shell .user-edit-top-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(340px, 0.8fr);
    align-items: start;
    gap: 20px;
    margin-bottom: 22px;
}

.admin-shell .user-edit-top-grid.is-single-column {
    grid-template-columns: minmax(0, 1fr);
}

.admin-shell .user-edit-top-grid > .admin-form-card {
    margin: 0;
    min-width: 0;
}

.admin-shell .user-security-actions-card {
    display: grid;
    gap: 14px;
    min-width: 0;
    border: 1px solid rgba(255, 112, 136, 0.36);
    border-radius: 18px;
    background:
        linear-gradient(
            160deg,
            rgba(69, 13, 31, 0.28),
            rgba(4, 13, 29, 0.96)
        );
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.20);
    padding: 20px;
}

.admin-shell .user-security-actions-header {
    border-bottom: 1px solid rgba(255, 112, 136, 0.18);
    padding-bottom: 15px;
}

.admin-shell .user-security-actions-header .eyebrow {
    color: #ffb3c0;
}

.admin-shell .user-security-actions-header h2 {
    margin: 6px 0 8px;
    color: #f7fbff;
    font-size: 1.08rem;
}

.admin-shell .user-security-actions-header p {
    margin: 0;
    color: #afbed2;
    font-size: 0.79rem;
    line-height: 1.55;
}

.admin-shell .user-security-action {
    display: grid;
    gap: 12px;
    border: 1px solid rgba(141, 170, 209, 0.18);
    border-radius: 14px;
    background: rgba(2, 9, 23, 0.54);
    padding: 15px;
}

.admin-shell .user-security-action-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.admin-shell .user-security-action-kicker {
    display: block;
    color: #ffb4c0;
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.10em;
    text-transform: uppercase;
}

.admin-shell .user-security-action h3 {
    margin: 5px 0 0;
    color: #f7fbff;
    font-size: 0.94rem;
}

.admin-shell .user-security-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.67rem;
    font-weight: 900;
    line-height: 1;
    padding: 8px 10px;
    white-space: nowrap;
}

.admin-shell .user-security-status.is-safe {
    border-color: rgba(102, 232, 249, 0.34);
    background: rgba(13, 91, 108, 0.28);
    color: #aaf6ff;
}

.admin-shell .user-security-status.is-danger {
    border-color: rgba(255, 113, 135, 0.44);
    background: rgba(124, 21, 44, 0.30);
    color: #ffd3da;
}

.admin-shell .user-security-action-copy {
    margin: 0;
    color: #c1d0e4;
    font-size: 0.78rem;
    line-height: 1.58;
}

.admin-shell .user-security-action-copy strong {
    color: #f5f9ff;
}

.admin-shell .user-security-action-meta {
    color: #9baec8;
    font-size: 0.71rem;
}

.admin-shell .user-security-action form {
    margin: 0;
}

.admin-shell .user-security-action-button {
    width: 100%;
    min-height: 42px;
    border-radius: 11px;
    font-weight: 900;
}

.admin-shell .user-security-lock-form {
    display: grid;
    gap: 9px;
}

.admin-shell .user-security-lock-form label {
    color: #d4dfef;
    font-size: 0.75rem;
    font-weight: 850;
}

.admin-shell .user-security-lock-form textarea {
    display: block;
    width: 100%;
    min-height: 96px;
    resize: vertical;
    border: 1px solid rgba(255, 123, 145, 0.30);
    border-radius: 10px;
    background: rgba(1, 8, 21, 0.78);
    color: #f6f9ff;
    font-family: inherit;
    font-size: 0.78rem;
    line-height: 1.45;
    outline: none;
    padding: 11px 12px;
}

.admin-shell .user-security-lock-form textarea:focus {
    border-color: rgba(255, 136, 154, 0.74);
    box-shadow: 0 0 0 3px rgba(255, 110, 132, 0.12);
}

.admin-shell .user-security-lock-form .account-manual-lock-button {
    border: 1px solid rgba(255, 112, 136, 0.50);
    background: linear-gradient(135deg, #a82647, #71142e);
    color: #fff6f8;
}

.admin-shell .user-security-lock-form .account-manual-lock-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(128, 18, 47, 0.30);
}

@media (max-width: 1080px) {
    .admin-shell .user-edit-top-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 480px) {
    .admin-shell .user-security-action-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .user-security-status {
        width: fit-content;
    }
}

/* END MARKUZI-SECURITY-ACTIONS-TOP-FIX */

/* MARKUZI-SIDEBAR-NEWS-AND-NOTIFICATIONS */

.admin-shell .admin-sidebar {
    position: relative;
}

.admin-shell .admin-notification-bell {
    position: absolute;
    top: 18px;
    right: 18px;
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 2px solid rgba(255, 154, 72, 0.96);
    border-radius: 50%;
    background: #ff6a12;
    color: #08182d;
    box-shadow: 0 8px 18px rgba(255, 93, 10, 0.24);
    text-decoration: none;
    transform: rotate(-5deg);
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.admin-shell .admin-notification-bell:hover {
    box-shadow: 0 11px 24px rgba(255, 93, 10, 0.35);
    transform: rotate(0deg) translateY(-1px);
}

.admin-shell .admin-notification-bell-icon {
    font-size: 1.22rem;
    line-height: 1;
    transform: rotate(5deg);
}

.admin-shell .admin-notification-badge {
    position: absolute;
    top: -7px;
    right: -8px;
    display: grid;
    place-items: center;
    min-width: 21px;
    height: 21px;
    border: 2px solid #081a31;
    border-radius: 999px;
    background: #f34d66;
    color: #fff8fa;
    font-size: 0.62rem;
    font-weight: 950;
    line-height: 1;
    padding: 0 5px;
    transform: rotate(5deg);
}

.admin-shell .admin-notification-bell.has-unread {
    animation: markuzi-notification-pulse 2.8s ease-in-out infinite;
}

@keyframes markuzi-notification-pulse {
    0%, 100% {
        box-shadow: 0 8px 18px rgba(255, 93, 10, 0.24);
    }

    50% {
        box-shadow: 0 8px 25px rgba(255, 93, 10, 0.52);
    }
}

.admin-shell .notification-center-page,
.admin-shell .news-hub-page {
    display: grid;
    gap: 18px;
    max-width: 1160px;
}

.admin-shell .notification-center-heading,
.admin-shell .news-hub-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.admin-shell .notification-center-heading h2,
.admin-shell .news-hub-heading h2 {
    margin: 5px 0 8px;
    color: #f7fbff;
}

.admin-shell .notification-center-heading p,
.admin-shell .news-hub-heading p {
    max-width: 720px;
    margin: 0;
    color: #a9bfd9;
    line-height: 1.6;
}

.admin-shell .notification-empty-card,
.admin-shell .news-hub-empty {
    display: flex;
    align-items: center;
    gap: 14px;
    border: 1px solid rgba(87, 230, 255, 0.20);
    border-radius: 15px;
    background: rgba(5, 19, 42, 0.82);
    color: #c7d9ee;
    padding: 19px;
}

.admin-shell .notification-empty-card strong,
.admin-shell .news-hub-empty strong {
    display: block;
    color: #f6fbff;
}

.admin-shell .notification-empty-card p,
.admin-shell .news-hub-empty p {
    margin: 5px 0 0;
    color: #a7bcd6;
    line-height: 1.55;
}

.admin-shell .notification-empty-icon {
    font-size: 1.7rem;
}

.admin-shell .notification-list {
    display: grid;
    gap: 10px;
}

.admin-shell .notification-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border: 1px solid rgba(116, 160, 212, 0.23);
    border-radius: 14px;
    background: rgba(5, 19, 42, 0.82);
    padding: 15px;
}

.admin-shell .notification-item.is-unread {
    border-color: rgba(87, 230, 255, 0.42);
    background: rgba(9, 48, 76, 0.52);
}

.admin-shell .notification-item-main {
    display: flex;
    align-items: flex-start;
    gap: 11px;
}

.admin-shell .notification-item-dot {
    width: 9px;
    height: 9px;
    flex: 0 0 auto;
    margin-top: 5px;
    border-radius: 50%;
    background: #7892b6;
}

.admin-shell .notification-item.is-unread .notification-item-dot {
    background: #65efd0;
}

.admin-shell .notification-item strong {
    color: #f6fbff;
}

.admin-shell .notification-item p {
    margin: 4px 0;
    color: #b4c7df;
    line-height: 1.5;
}

.admin-shell .notification-item small {
    color: #8fa8c8;
}

.admin-shell .news-hub-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
}

.admin-shell .news-hub-card {
    display: grid;
    align-content: start;
    gap: 10px;
    border: 1px solid rgba(87, 230, 255, 0.22);
    border-radius: 15px;
    background: rgba(5, 19, 42, 0.82);
    padding: 18px;
}

.admin-shell .news-hub-card h3 {
    margin: 0;
    color: #f7fbff;
    font-size: 1rem;
}

.admin-shell .news-hub-card p {
    margin: 0;
    color: #b2c6df;
    font-size: 0.82rem;
    line-height: 1.58;
}

.admin-shell .news-hub-card small {
    color: #8da7c6;
}

.admin-shell .news-hub-category {
    width: fit-content;
    border: 1px solid rgba(87, 230, 255, 0.30);
    border-radius: 999px;
    color: #a8f8ff;
    font-size: 0.66rem;
    font-weight: 900;
    padding: 6px 8px;
}

@media (max-width: 760px) {
    .admin-shell .notification-center-heading,
    .admin-shell .news-hub-heading,
    .admin-shell .notification-item {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .news-hub-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* END MARKUZI-SIDEBAR-NEWS-AND-NOTIFICATIONS */

/* MARKUZI-NOTIFICATION-BELL-REFRESH */

.admin-shell .admin-notification-bell {
    top: 17px;
    right: 18px;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 143, 70, 0.46);
    border-radius: 13px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 129, 52, 0.16),
            rgba(31, 20, 24, 0.76)
        );
    color: #ffa05c;
    box-shadow:
        inset 0 1px 0 rgba(255, 201, 157, 0.12),
        0 7px 18px rgba(0, 0, 0, 0.20);
    transform: none;
}

.admin-shell .admin-notification-bell:hover {
    border-color: rgba(255, 166, 96, 0.82);
    background:
        linear-gradient(
            145deg,
            rgba(255, 141, 61, 0.28),
            rgba(46, 24, 27, 0.90)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 218, 188, 0.18),
        0 10px 22px rgba(0, 0, 0, 0.28);
    color: #ffb276;
    transform: translateY(-1px);
}

.admin-shell .admin-notification-bell-svg {
    width: 20px;
    height: 20px;
}

.admin-shell .admin-notification-bell-icon {
    display: none;
}

.admin-shell .admin-notification-badge {
    top: -7px;
    right: -7px;
    min-width: 20px;
    height: 20px;
    border: 2px solid #08172c;
    background: #f04e68;
    box-shadow: 0 4px 10px rgba(116, 11, 35, 0.28);
    font-size: 0.61rem;
    transform: none;
}

.admin-shell .admin-notification-bell.has-unread {
    animation: markuzi-notification-pulse 3s ease-in-out infinite;
}

@keyframes markuzi-notification-pulse {
    0%,
    100% {
        box-shadow:
            inset 0 1px 0 rgba(255, 201, 157, 0.12),
            0 7px 18px rgba(0, 0, 0, 0.20);
    }

    50% {
        box-shadow:
            inset 0 1px 0 rgba(255, 201, 157, 0.18),
            0 8px 23px rgba(255, 107, 34, 0.20);
    }
}

/* END MARKUZI-NOTIFICATION-BELL-REFRESH */

/* MARKUZI-NEWS-MANAGEMENT-LIST */

.admin-shell .news-management-page {
    display: grid;
    gap: 18px;
    max-width: 1320px;
}

.admin-shell .news-management-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.admin-shell .news-management-heading h2 {
    margin: 5px 0 8px;
    color: #f7fbff;
}

.admin-shell .news-management-heading p {
    max-width: 760px;
    margin: 0;
    color: #a9bfd9;
    line-height: 1.6;
}

.admin-shell .news-status-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-shell .news-status-filter a {
    border: 1px solid rgba(117, 156, 205, 0.26);
    border-radius: 999px;
    color: #a9bfd9;
    font-size: 0.73rem;
    font-weight: 850;
    padding: 8px 11px;
    text-decoration: none;
}

.admin-shell .news-status-filter a:hover,
.admin-shell .news-status-filter a.is-active {
    border-color: rgba(87, 230, 255, 0.48);
    background: rgba(10, 91, 113, 0.28);
    color: #c8fbff;
}

.admin-shell .news-management-empty {
    border: 1px solid rgba(87, 230, 255, 0.20);
    border-radius: 15px;
    background: rgba(5, 19, 42, 0.82);
    color: #c5d8ee;
    padding: 20px;
}

.admin-shell .news-management-empty strong {
    color: #f7fbff;
}

.admin-shell .news-management-empty p {
    margin: 6px 0 0;
    color: #a9bfd9;
}

.admin-shell .news-management-list {
    display: grid;
    gap: 11px;
}

.admin-shell .news-management-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    border: 1px solid rgba(111, 154, 208, 0.25);
    border-radius: 15px;
    background: rgba(5, 19, 42, 0.82);
    padding: 17px;
}

.admin-shell .news-management-item-main {
    display: grid;
    gap: 9px;
    min-width: 0;
}

.admin-shell .news-management-item-topline {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.admin-shell .news-management-status,
.admin-shell .news-management-category {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.66rem;
    font-weight: 900;
    line-height: 1;
    padding: 7px 9px;
}

.admin-shell .news-management-category {
    border-color: rgba(87, 230, 255, 0.25);
    color: #a9f8ff;
}

.admin-shell .news-management-status.is-draft {
    border-color: rgba(154, 173, 200, 0.32);
    background: rgba(95, 113, 141, 0.20);
    color: #d2ddec;
}

.admin-shell .news-management-status.is-pending {
    border-color: rgba(255, 190, 87, 0.42);
    background: rgba(120, 80, 15, 0.22);
    color: #ffe1a4;
}

.admin-shell .news-management-status.is-published {
    border-color: rgba(107, 244, 190, 0.38);
    background: rgba(27, 120, 89, 0.21);
    color: #b8ffe0;
}

.admin-shell .news-management-status.is-scheduled {
    border-color: rgba(102, 224, 255, 0.37);
    background: rgba(12, 94, 120, 0.22);
    color: #b4f8ff;
}

.admin-shell .news-management-status.is-rejected {
    border-color: rgba(255, 113, 135, 0.43);
    background: rgba(123, 20, 43, 0.25);
    color: #ffd0d8;
}

.admin-shell .news-management-status.is-archived {
    border-color: rgba(146, 161, 185, 0.28);
    background: rgba(48, 60, 79, 0.24);
    color: #c0cad8;
}

.admin-shell .news-management-item h3 {
    margin: 0;
    color: #f7fbff;
    font-size: 1.02rem;
}

.admin-shell .news-management-item p {
    max-width: 820px;
    margin: 0;
    color: #aec1da;
    font-size: 0.82rem;
    line-height: 1.58;
}

.admin-shell .news-management-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 14px;
    color: #8fa8c8;
    font-size: 0.71rem;
}

.admin-shell .news-management-review-note {
    border: 1px solid rgba(255, 113, 135, 0.28);
    border-radius: 11px;
    background: rgba(101, 16, 39, 0.20);
    color: #ffd5dc;
    font-size: 0.78rem;
    line-height: 1.55;
    padding: 11px 12px;
}

.admin-shell .news-management-review-note strong {
    color: #fff0f3;
}

.admin-shell .news-management-item-actions {
    display: grid;
    justify-items: end;
    flex: 0 0 auto;
}

.admin-shell .news-management-waiting-label {
    color: #9db2cc;
    font-size: 0.73rem;
    font-weight: 850;
    padding: 10px 2px;
}

@media (max-width: 720px) {
    .admin-shell .news-management-heading,
    .admin-shell .news-management-item {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .news-management-item-actions {
        justify-items: stretch;
    }
}

/* END MARKUZI-NEWS-MANAGEMENT-LIST */

/* MARKUZI-NEWS-FORM */

.admin-shell .news-form-page {
    display: grid;
    gap: 18px;
    max-width: 1320px;
}

.admin-shell .news-form-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.admin-shell .news-form-heading h2 {
    margin: 5px 0 8px;
    color: #f7fbff;
}

.admin-shell .news-form-heading p {
    max-width: 760px;
    margin: 0;
    color: #a9bfd9;
    line-height: 1.6;
}

.admin-shell .news-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(310px, 0.38fr);
    align-items: start;
    gap: 18px;
}

.admin-shell .news-form-card,
.admin-shell .news-workflow-card {
    border: 1px solid rgba(111, 154, 208, 0.27);
    border-radius: 16px;
    background: rgba(5, 19, 42, 0.82);
    padding: 20px;
}

.admin-shell .news-editor-form,
.admin-shell .news-editor-grid,
.admin-shell .news-workflow-card,
.admin-shell .news-workflow-form {
    display: grid;
    gap: 15px;
}

.admin-shell .news-editor-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-shell .news-editor-field {
    display: grid;
    gap: 7px;
}

.admin-shell .news-editor-field-full {
    grid-column: 1 / -1;
}

.admin-shell .news-editor-field > span,
.admin-shell .news-workflow-form label > span {
    color: #d5e1f0;
    font-size: 0.76rem;
    font-weight: 850;
}

.admin-shell .news-editor-field input,
.admin-shell .news-editor-field select,
.admin-shell .news-editor-field textarea,
.admin-shell .news-workflow-form input,
.admin-shell .news-workflow-form textarea {
    width: 100%;
    border: 1px solid rgba(143, 170, 207, 0.28);
    border-radius: 10px;
    background: rgba(1, 9, 24, 0.73);
    color: #eef9ff;
    font: inherit;
    outline: none;
    padding: 11px 12px;
}

.admin-shell .news-editor-field textarea,
.admin-shell .news-workflow-form textarea {
    resize: vertical;
    line-height: 1.55;
}

.admin-shell .news-editor-field input:focus,
.admin-shell .news-editor-field select:focus,
.admin-shell .news-editor-field textarea:focus,
.admin-shell .news-workflow-form input:focus,
.admin-shell .news-workflow-form textarea:focus {
    border-color: rgba(87, 230, 255, 0.68);
    box-shadow: 0 0 0 3px rgba(87, 230, 255, 0.10);
}

.admin-shell .news-editor-hint,
.admin-shell .news-workflow-form small {
    color: #90a9c8;
    font-size: 0.69rem;
}

.admin-shell .news-editor-image-preview {
    display: grid;
    gap: 10px;
    border: 1px solid rgba(111, 154, 208, 0.22);
    border-radius: 12px;
    background: rgba(2, 11, 27, 0.45);
    padding: 12px;
}

.admin-shell .news-editor-image-preview img {
    width: 100%;
    max-height: 260px;
    border-radius: 9px;
    object-fit: cover;
}

.admin-shell .news-editor-remove-image {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #b9cbe1;
    font-size: 0.74rem;
}

.admin-shell .news-editor-actions {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid rgba(111, 154, 208, 0.18);
    padding-top: 16px;
}

.admin-shell .news-workflow-card header {
    display: grid;
    gap: 8px;
    border-bottom: 1px solid rgba(111, 154, 208, 0.20);
    padding-bottom: 15px;
}

.admin-shell .news-workflow-card h3 {
    margin: 0;
    color: #f7fbff;
}

.admin-shell .news-workflow-status {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    border: 1px solid rgba(154, 173, 200, 0.32);
    border-radius: 999px;
    background: rgba(95, 113, 141, 0.20);
    color: #d2ddec;
    font-size: 0.68rem;
    font-weight: 900;
    padding: 7px 9px;
}

.admin-shell .news-workflow-status.is-pending_review {
    border-color: rgba(255, 190, 87, 0.42);
    background: rgba(120, 80, 15, 0.22);
    color: #ffe1a4;
}

.admin-shell .news-workflow-status.is-published {
    border-color: rgba(107, 244, 190, 0.38);
    background: rgba(27, 120, 89, 0.21);
    color: #b8ffe0;
}

.admin-shell .news-workflow-status.is-scheduled {
    border-color: rgba(102, 224, 255, 0.37);
    background: rgba(12, 94, 120, 0.22);
    color: #b4f8ff;
}

.admin-shell .news-workflow-status.is-rejected {
    border-color: rgba(255, 113, 135, 0.43);
    background: rgba(123, 20, 43, 0.25);
    color: #ffd0d8;
}

.admin-shell .news-workflow-meta {
    display: grid;
    gap: 4px;
    color: #8fa8c8;
    font-size: 0.72rem;
}

.admin-shell .news-workflow-meta strong {
    margin-bottom: 7px;
    color: #dceafa;
    font-size: 0.79rem;
}

.admin-shell .news-workflow-review-note {
    border: 1px solid rgba(255, 113, 135, 0.28);
    border-radius: 11px;
    background: rgba(101, 16, 39, 0.20);
    color: #ffd5dc;
    font-size: 0.78rem;
    line-height: 1.55;
    padding: 11px 12px;
}

.admin-shell .news-workflow-review-note p {
    margin: 5px 0 0;
}

.admin-shell .news-workflow-button,
.admin-shell .news-workflow-reject-button,
.admin-shell .news-workflow-delete-button {
    width: 100%;
    min-height: 42px;
}

.admin-shell .news-workflow-reject-button,
.admin-shell .news-workflow-delete-button {
    border: 1px solid rgba(255, 113, 135, 0.44);
    border-radius: 11px;
    background: rgba(118, 21, 44, 0.32);
    color: #ffdce2;
    cursor: pointer;
    font-weight: 900;
}

.admin-shell .news-workflow-delete-button {
    background: rgba(98, 13, 33, 0.46);
    color: #fff1f4;
}

.admin-shell .news-workflow-readonly-note {
    margin: 0;
    color: #9fb2ca;
    font-size: 0.77rem;
    line-height: 1.55;
}

@media (max-width: 980px) {
    .admin-shell .news-form-layout {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 720px) {
    .admin-shell .news-form-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .news-editor-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .admin-shell .news-editor-field-full {
        grid-column: auto;
    }
}

/* END MARKUZI-NEWS-FORM */

/* MARKUZI-STICKY-ADMIN-SIDEBAR */

@media (min-width: 901px) {
    .admin-shell {
        min-height: 100vh;
        align-items: start;
    }

    .admin-shell .admin-sidebar {
        position: sticky;
        top: 0;
        display: flex;
        flex-direction: column;
        height: 100vh;
        max-height: 100vh;
        overflow: hidden;
    }

    .admin-shell .admin-navigation {
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: rgba(82, 221, 255, 0.40) transparent;
    }

    .admin-shell .admin-navigation::-webkit-scrollbar {
        width: 6px;
    }

    .admin-shell .admin-navigation::-webkit-scrollbar-track {
        background: transparent;
    }

    .admin-shell .admin-navigation::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: rgba(82, 221, 255, 0.34);
    }

    .admin-shell .admin-navigation::-webkit-scrollbar-thumb:hover {
        background: rgba(82, 221, 255, 0.58);
    }

    .admin-shell .admin-sidebar-footer,
    .admin-shell .admin-user-card {
        flex: 0 0 auto;
    }
}

/* END MARKUZI-STICKY-ADMIN-SIDEBAR */

/* MARKUZI-SIDEBAR-FOOTER-PINNED */

@media (min-width: 901px) {
    .admin-shell .admin-sidebar {
        display: flex;
        flex-direction: column;
        height: 100vh;
        min-height: 100vh;
        max-height: 100vh;
        overflow: hidden;
    }

    /*
     * Das Menü bleibt oben bei seinen echten Menüpunkten.
     * Es darf erst bei sehr vielen Einträgen intern scrollen.
     */
    .admin-shell .admin-sidebar .admin-navigation {
        flex: 0 1 auto;
        min-height: 0;
        max-height: calc(100vh - 260px);
        overflow-x: hidden;
        overflow-y: auto;
    }

    /*
     * Der direkte Bereich mit Benutzerkarte / Profil / Website / Logout
     * wird zuverlässig an das untere Ende der Sidebar gedrückt.
     */
    .admin-shell .admin-sidebar > :has(.admin-user-card),
    .admin-shell .admin-sidebar > :has(a[href*="konto/profil"]) {
        flex: 0 0 auto;
        margin-top: auto;
    }

    .admin-shell .admin-sidebar .admin-user-card {
        margin-top: 0;
    }
}

/* END MARKUZI-SIDEBAR-FOOTER-PINNED */

/* MARKUZI-ROLE-PERMISSIONS-V2 */

.admin-shell .role-permission-summary-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border: 1px solid rgba(82, 221, 255, 0.24);
    border-radius: 16px;
    background:
        linear-gradient(
            135deg,
            rgba(9, 69, 99, 0.32),
            rgba(5, 19, 42, 0.86)
        );
    padding: 20px;
}

.admin-shell .role-permission-summary-main h3 {
    margin: 5px 0 7px;
    color: #f7fbff;
    font-size: 1.08rem;
}

.admin-shell .role-permission-summary-main h3 span {
    color: #9db6d3;
    font-weight: 700;
}

.admin-shell .role-permission-summary-main p {
    max-width: 700px;
    margin: 0;
    color: #a7bdd7;
    font-size: 0.81rem;
    line-height: 1.55;
}

.admin-shell .role-permission-summary-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(72px, 1fr));
    gap: 8px;
    flex: 0 0 auto;
}

.admin-shell .role-permission-summary-stats > div {
    display: grid;
    gap: 3px;
    border: 1px solid rgba(120, 164, 213, 0.23);
    border-radius: 11px;
    background: rgba(1, 11, 28, 0.48);
    padding: 10px 12px;
    text-align: center;
}

.admin-shell .role-permission-summary-stats strong {
    color: #76efff;
    font-size: 1.08rem;
}

.admin-shell .role-permission-summary-stats span {
    color: #90a9c8;
    font-size: 0.65rem;
    font-weight: 850;
    text-transform: uppercase;
}

.admin-shell .role-permission-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    border: 1px solid rgba(110, 155, 207, 0.19);
    border-radius: 14px;
    background: rgba(5, 19, 42, 0.62);
    padding: 14px 16px;
}

.admin-shell .role-permission-search {
    display: grid;
    gap: 6px;
    width: min(100%, 470px);
}

.admin-shell .role-permission-search > span {
    color: #c6d8eb;
    font-size: 0.72rem;
    font-weight: 900;
}

.admin-shell .role-permission-search input {
    width: 100%;
    border: 1px solid rgba(133, 168, 209, 0.29);
    border-radius: 10px;
    background: rgba(1, 10, 25, 0.74);
    color: #effaff;
    font: inherit;
    font-size: 0.8rem;
    outline: none;
    padding: 10px 12px;
}

.admin-shell .role-permission-search input:focus {
    border-color: rgba(82, 229, 255, 0.66);
    box-shadow: 0 0 0 3px rgba(82, 229, 255, 0.10);
}

.admin-shell .role-permission-toolbar p {
    margin: 0 0 2px;
    color: #91aac8;
    font-size: 0.73rem;
    font-weight: 750;
}

.admin-shell .role-permission-groups-v2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 16px;
}

.admin-shell .role-permission-group-v2 {
    overflow: hidden;
    border: 1px solid rgba(111, 156, 209, 0.28);
    border-radius: 15px;
    background: rgba(5, 19, 42, 0.84);
}

.admin-shell .role-permission-group-v2[hidden] {
    display: none;
}

.admin-shell .role-permission-group-v2 > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    cursor: pointer;
    list-style: none;
    padding: 16px 18px;
}

.admin-shell .role-permission-group-v2 > summary::-webkit-details-marker {
    display: none;
}

.admin-shell .role-permission-group-v2 > summary:hover {
    background: rgba(10, 71, 97, 0.24);
}

.admin-shell .role-permission-group-title {
    display: grid;
    gap: 5px;
}

.admin-shell .role-permission-group-title strong {
    color: #f7fbff;
    font-size: 0.95rem;
}

.admin-shell .role-permission-group-summary {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #9bb1ca;
    font-size: 0.68rem;
    font-weight: 800;
    white-space: nowrap;
}

.admin-shell .role-permission-group-summary b {
    color: #74efff;
}

.admin-shell .role-permission-group-summary small {
    border: 1px solid rgba(255, 111, 133, 0.30);
    border-radius: 999px;
    color: #ffd4dd;
    font-size: 0.61rem;
    font-weight: 900;
    padding: 4px 6px;
}

.admin-shell .role-permission-group-chevron {
    color: #64eaff;
    font-size: 1rem;
    line-height: 1;
    transition: transform 160ms ease;
}

.admin-shell .role-permission-group-v2[open] .role-permission-group-chevron {
    transform: rotate(180deg);
}

.admin-shell .role-permission-list-v2 {
    border-top: 1px solid rgba(111, 156, 209, 0.20);
}

.admin-shell .role-permission-row-v2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid rgba(111, 156, 209, 0.16);
    padding: 11px 14px 11px 16px;
}

.admin-shell .role-permission-row-v2:last-child {
    border-bottom: 0;
}

.admin-shell .role-permission-row-v2[hidden] {
    display: none;
}

.admin-shell .role-permission-toggle-v2 {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 10px;
    cursor: pointer;
}

.admin-shell .role-permission-toggle-v2 input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.admin-shell .role-permission-checkbox-visual {
    display: grid;
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(139, 170, 207, 0.46);
    border-radius: 5px;
    background: rgba(2, 12, 29, 0.82);
    color: transparent;
    font-size: 0.71rem;
    font-weight: 950;
    transition: 140ms ease;
}

.admin-shell .role-permission-toggle-v2 input:checked
+ .role-permission-checkbox-visual {
    border-color: rgba(91, 240, 205, 0.84);
    background: rgba(34, 178, 137, 0.30);
    color: #c4ffe7;
}

.admin-shell .role-permission-toggle-v2 input:focus-visible
+ .role-permission-checkbox-visual {
    box-shadow: 0 0 0 3px rgba(82, 229, 255, 0.18);
}

.admin-shell .role-permission-toggle-v2.is-locked {
    cursor: not-allowed;
    opacity: 0.78;
}

.admin-shell .role-permission-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.admin-shell .role-permission-copy strong {
    color: #f3f9ff;
    font-size: 0.78rem;
    line-height: 1.3;
}

.admin-shell .role-permission-copy small {
    overflow: hidden;
    color: #82bbf4;
    font-size: 0.66rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .role-permission-lock-v2 {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    justify-content: end;
}

.admin-shell .role-permission-lock-state {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid rgba(255, 120, 145, 0.35);
    border-radius: 999px;
    background: rgba(114, 23, 47, 0.20);
    color: #ffd3dc;
    font-size: 0.63rem;
    font-weight: 900;
    padding: 6px 8px;
    white-space: nowrap;
}

.admin-shell .role-permission-lock-button-v2,
.admin-shell .role-permission-unlock-v2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 30px;
    border-radius: 8px;
    cursor: pointer;
    font: inherit;
    font-size: 0.65rem;
    font-weight: 900;
    padding: 0 9px;
}

.admin-shell .role-permission-lock-button-v2 {
    border: 1px solid rgba(255, 112, 137, 0.48);
    background: rgba(92, 21, 43, 0.22);
    color: #ffced8;
}

.admin-shell .role-permission-lock-button-v2:hover {
    border-color: rgba(255, 132, 156, 0.76);
    background: rgba(124, 23, 51, 0.37);
}

.admin-shell .role-permission-unlock-v2 {
    border: 1px solid rgba(101, 231, 255, 0.38);
    background: rgba(12, 87, 112, 0.22);
    color: #b7f6ff;
}

.admin-shell .role-permission-unlock-v2:hover {
    border-color: rgba(101, 231, 255, 0.70);
    background: rgba(13, 113, 143, 0.34);
}

@media (max-width: 1060px) {
    .admin-shell .role-permission-groups-v2 {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 720px) {
    .admin-shell .role-permission-summary-card,
    .admin-shell .role-permission-toolbar,
    .admin-shell .role-permission-group-v2 > summary,
    .admin-shell .role-permission-row-v2 {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .role-permission-summary-stats {
        width: 100%;
    }

    .admin-shell .role-permission-toolbar {
        align-items: stretch;
    }

    .admin-shell .role-permission-toolbar p {
        margin: 0;
    }

    .admin-shell .role-permission-group-summary {
        justify-content: space-between;
    }

    .admin-shell .role-permission-lock-v2 {
        justify-content: start;
    }
}

/* END MARKUZI-ROLE-PERMISSIONS-V2 */

/* MARKUZI-NEWS-CATEGORY-HEADER-ACTIONS */

.admin-shell .news-management-header-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

@media (max-width: 720px) {
    .admin-shell .news-management-header-actions {
        justify-content: flex-start;
    }
}

/* END MARKUZI-NEWS-CATEGORY-HEADER-ACTIONS */


/* BEGIN MARKUZI-PHASE-16-3-1-OWN-WALLET */
.mk-wallet-page {
    display: grid;
    width: min(1180px, calc(100% - 32px));
    gap: 16px;
    margin: 34px auto 60px;
}

.mk-wallet-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    overflow: hidden;
    padding: 28px 30px;
    border: 1px solid rgba(75, 205, 255, .2);
    border-radius: 22px;
    background:
        radial-gradient(
            circle at 84% 22%,
            rgba(59, 220, 255, .18),
            transparent 31%
        ),
        radial-gradient(
            circle at 69% 0,
            rgba(60, 228, 180, .08),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            rgba(7, 35, 65, .97),
            rgba(2, 13, 30, .98)
        );
    box-shadow: 0 24px 70px rgba(0, 0, 0, .24);
}

.mk-wallet-hero > div:first-child > a {
    display: inline-flex;
    margin-bottom: 12px;
    color: #79dff8;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-wallet-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.04;
}

.mk-wallet-hero p {
    max-width: 690px;
    margin: 12px 0 0;
    color: #a9bdd1;
    font-size: .94rem;
    line-height: 1.65;
}

.mk-wallet-balance {
    display: grid;
    flex: 0 0 245px;
    min-height: 145px;
    place-items: center;
    align-content: center;
    gap: 5px;
    border: 1px solid rgba(60, 228, 180, .29);
    border-radius: 18px;
    background: rgba(17, 158, 117, .08);
}

.mk-wallet-balance small {
    color: #8aa3b9;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.mk-wallet-balance strong {
    color: #fff;
    font-size: 2.25rem;
    line-height: 1;
}

.mk-wallet-balance span {
    color: #78eac7;
    font-size: .82rem;
    font-weight: 900;
}

.mk-wallet-notice {
    padding: 13px 15px;
    border: 1px solid rgba(255, 211, 94, .28);
    border-radius: 12px;
    background: rgba(194, 142, 0, .08);
    color: #ffe08a;
    font-size: .84rem;
    line-height: 1.5;
}

.mk-wallet-notice.is-error {
    border-color: rgba(255, 100, 123, .28);
    background: rgba(183, 37, 64, .08);
    color: #ff9bab;
}

.mk-wallet-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
}

.mk-wallet-stat-grid article {
    display: flex;
    min-height: 92px;
    align-items: center;
    gap: 12px;
    padding: 15px;
    border: 1px solid rgba(75, 205, 255, .17);
    border-radius: 15px;
    background: linear-gradient(
        145deg,
        rgba(7, 30, 56, .95),
        rgba(3, 15, 32, .97)
    );
}

.mk-wallet-stat-grid article > span {
    display: grid;
    width: 43px;
    height: 43px;
    place-items: center;
    border: 1px solid rgba(59, 220, 255, .25);
    border-radius: 12px;
    background: rgba(0, 132, 187, .08);
    color: #82e5ff;
    font-size: 1rem;
    font-weight: 950;
}

.mk-wallet-stat-grid :is(strong, small) {
    display: block;
}

.mk-wallet-stat-grid strong {
    color: #fff;
    font-size: 1.15rem;
}

.mk-wallet-stat-grid small {
    margin-top: 5px;
    color: #8299b1;
    font-size: .72rem;
}

.mk-wallet-panel {
    overflow: hidden;
    border: 1px solid rgba(75, 205, 255, .18);
    border-radius: 17px;
    background: linear-gradient(
        145deg,
        rgba(6, 27, 51, .95),
        rgba(2, 14, 30, .97)
    );
}

.mk-wallet-panel > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 17px 19px;
    border-bottom: 1px solid rgba(74, 166, 211, .12);
}

.mk-wallet-panel > header h2 {
    margin: 0;
    color: #f5f9ff;
    font-size: 1.08rem;
}

.mk-wallet-panel > header p {
    margin: 6px 0 0;
    color: #7f96ad;
    font-size: .75rem;
}

.mk-wallet-panel > header > span {
    color: #7891ab;
    font-size: .7rem;
}

.mk-wallet-filters {
    display: grid;
    grid-template-columns:
        minmax(160px, .4fr)
        minmax(180px, .5fr)
        auto
        auto;
    align-items: end;
    gap: 9px;
    padding: 13px 17px;
    border-bottom: 1px solid rgba(74, 166, 211, .1);
}

.mk-wallet-filters label {
    display: grid;
    gap: 6px;
}

.mk-wallet-filters label > span {
    color: #cbd9e8;
    font-size: .72rem;
    font-weight: 800;
}

.mk-wallet-filters select {
    width: 100%;
    min-height: 42px;
    padding: 0 10px;
    border: 1px solid rgba(75, 205, 255, .2);
    border-radius: 9px;
    background: rgba(2, 15, 32, .88);
    color: #f4f8ff;
    font: inherit;
    font-size: .78rem;
}

.mk-wallet-filters :is(button, a) {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border: 1px solid rgba(59, 220, 255, .21);
    border-radius: 9px;
    background: rgba(0, 132, 187, .08);
    color: #82e5ff;
    font: inherit;
    font-size: .74rem;
    font-weight: 850;
    cursor: pointer;
    text-decoration: none;
}

.mk-wallet-transactions {
    display: grid;
}

.mk-wallet-transactions > article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    padding: 15px 18px;
    border-bottom: 1px solid rgba(74, 166, 211, .09);
}

.mk-wallet-transaction-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid rgba(60, 228, 180, .24);
    border-radius: 11px;
    background: rgba(17, 158, 117, .06);
    color: #78eac7;
    font-size: 1rem;
    font-weight: 950;
}

.mk-wallet-transactions
    article.is-debit .mk-wallet-transaction-icon {
    border-color: rgba(255, 211, 94, .24);
    background: rgba(199, 144, 0, .05);
    color: #ffd970;
}

.mk-wallet-transaction-content {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.mk-wallet-transaction-content strong {
    color: #eaf3fd;
    font-size: .86rem;
}

.mk-wallet-transaction-content small {
    color: #7188a1;
    font-size: .7rem;
}

.mk-wallet-transaction-content code {
    color: #607991;
    font-size: .64rem;
}

.mk-wallet-transaction-value {
    display: grid;
    justify-items: end;
    gap: 5px;
}

.mk-wallet-transaction-value strong {
    color: #78eac7;
    font-size: .92rem;
}

.is-debit .mk-wallet-transaction-value strong {
    color: #ffd970;
}

.mk-wallet-transaction-value small {
    color: #7188a1;
    font-size: .68rem;
}

.mk-wallet-empty {
    display: grid;
    justify-items: center;
    gap: 8px;
    padding: 45px 20px;
    color: #8299b2;
    text-align: center;
}

.mk-wallet-empty > span {
    color: #7fe5ff;
    font-size: 1.55rem;
}

.mk-wallet-empty strong {
    color: #eaf3fd;
}

.mk-wallet-empty p {
    max-width: 470px;
    margin: 0;
    font-size: .78rem;
    line-height: 1.5;
}

.mk-wallet-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 18px;
    border-top: 1px solid rgba(74, 166, 211, .1);
    color: #8299b2;
    font-size: .75rem;
}

.mk-wallet-pagination a {
    color: #82e5ff;
    text-decoration: none;
}

.mk-wallet-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.mk-wallet-footer a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 0 12px;
    border: 1px solid rgba(59, 220, 255, .18);
    border-radius: 9px;
    background: rgba(0, 132, 187, .06);
    color: #82e5ff;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-profile-wallet-card {
    display: flex;
    width: min(1100px, calc(100% - 32px));
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 18px auto 45px;
    padding: 20px 22px;
    border: 1px solid rgba(60, 228, 180, .2);
    border-radius: 16px;
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(60, 228, 180, .1),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            rgba(6, 27, 51, .95),
            rgba(2, 14, 30, .97)
        );
}

.mk-profile-wallet-card h2 {
    margin: 0;
    color: #f5f9ff;
}

.mk-profile-wallet-card p {
    max-width: 660px;
    margin: 7px 0 0;
    color: #8ca2b8;
    font-size: .82rem;
    line-height: 1.5;
}

@media (max-width: 900px) {
    .mk-wallet-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-wallet-balance {
        flex-basis: auto;
        width: 100%;
    }

    .mk-wallet-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .mk-wallet-page {
        width: min(100% - 20px, 1180px);
        margin-top: 16px;
    }

    .mk-wallet-hero {
        padding: 21px;
    }

    .mk-wallet-stat-grid,
    .mk-wallet-filters {
        grid-template-columns: 1fr;
    }

    .mk-wallet-transactions > article {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .mk-wallet-transaction-value {
        grid-column: 1 / -1;
        justify-items: start;
        padding-left: 51px;
    }

    .mk-wallet-panel > header,
    .mk-profile-wallet-card,
    .mk-wallet-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-profile-wallet-card .button,
    .mk-wallet-footer a {
        width: 100%;
        justify-content: center;
    }
}
/* END MARKUZI-PHASE-16-3-1-OWN-WALLET */


/* BEGIN MARKUZI-PHASE-16-4-PROMOCODES-USER */
.mk-user-promocode-page {
    display: grid;
    width: min(1180px, calc(100% - 32px));
    gap: 16px;
    margin: 34px auto 60px;
}

.mk-user-promocode-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    overflow: hidden;
    padding: 28px 30px;
    border: 1px solid rgba(75,205,255,.2);
    border-radius: 22px;
    background:
        radial-gradient(circle at 84% 22%, rgba(60,228,180,.17), transparent 31%),
        radial-gradient(circle at 70% 0, rgba(59,220,255,.08), transparent 25%),
        linear-gradient(135deg, rgba(7,35,65,.97), rgba(2,13,30,.98));
    box-shadow: 0 24px 70px rgba(0,0,0,.24);
}

.mk-user-promocode-hero > div:first-child > a {
    display: inline-flex;
    margin-bottom: 12px;
    color: #79dff8;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-user-promocode-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem,4vw,3.2rem);
    line-height: 1.04;
}

.mk-user-promocode-hero p {
    max-width: 700px;
    margin: 12px 0 0;
    color: #a9bdd1;
    font-size: .94rem;
    line-height: 1.65;
}

.mk-user-promocode-balance {
    display: grid;
    flex: 0 0 235px;
    min-height: 140px;
    place-items: center;
    align-content: center;
    gap: 5px;
    border: 1px solid rgba(60,228,180,.29);
    border-radius: 18px;
    background: rgba(17,158,117,.08);
}

.mk-user-promocode-balance small {
    color: #8aa3b9;
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.mk-user-promocode-balance strong {
    color: #fff;
    font-size: 2.15rem;
    line-height: 1;
}

.mk-user-promocode-balance span {
    color: #78eac7;
    font-size: .82rem;
    font-weight: 900;
}

.mk-user-promocode-flash {
    padding: 13px 15px;
    border: 1px solid rgba(60,228,180,.25);
    border-radius: 12px;
    background: rgba(17,158,117,.08);
    color: #81e8c9;
    font-size: .84rem;
}

.mk-user-promocode-flash.is-error {
    border-color: rgba(255,100,123,.28);
    background: rgba(183,37,64,.08);
    color: #ff9bab;
}

.mk-user-promocode-layout {
    display: grid;
    grid-template-columns: minmax(330px,.75fr) minmax(0,1.25fr);
    align-items: start;
    gap: 14px;
}

.mk-user-promocode-card {
    overflow: hidden;
    padding: 21px;
    border: 1px solid rgba(75,205,255,.18);
    border-radius: 17px;
    background: linear-gradient(145deg, rgba(6,27,51,.95), rgba(2,14,30,.97));
}

.mk-user-promocode-card h2 {
    margin: 0;
    color: #f5f9ff;
    font-size: 1.2rem;
}

.mk-user-promocode-card > form {
    display: grid;
    gap: 11px;
    margin-top: 17px;
}

.mk-user-promocode-card form label {
    display: grid;
    gap: 7px;
}

.mk-user-promocode-card form label > span {
    color: #cbd9e8;
    font-size: .75rem;
    font-weight: 800;
}

.mk-user-promocode-card form input {
    width: 100%;
    min-height: 48px;
    padding: 0 13px;
    border: 1px solid rgba(75,205,255,.22);
    border-radius: 10px;
    outline: 0;
    background: rgba(2,15,32,.9);
    color: #fff;
    font: inherit;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.mk-user-promocode-card form button {
    min-height: 46px;
    border: 1px solid rgba(73,226,255,.6);
    border-radius: 10px;
    background: linear-gradient(135deg,#0aa5ff,#15d5ff);
    color: #00101f;
    font: inherit;
    font-size: .84rem;
    font-weight: 900;
    cursor: pointer;
}

.mk-user-promocode-security {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 15px;
    padding: 12px;
    border: 1px solid rgba(60,228,180,.18);
    border-radius: 10px;
    background: rgba(17,158,117,.045);
}

.mk-user-promocode-security > span {
    color: #78eac7;
    font-weight: 950;
}

.mk-user-promocode-security p {
    margin: 0;
    color: #8198ae;
    font-size: .74rem;
    line-height: 1.5;
}

.mk-user-promocode-history {
    display: grid;
    gap: 9px;
    margin-top: 17px;
}

.mk-user-promocode-history article {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 13px;
    border: 1px solid rgba(75,205,255,.12);
    border-radius: 11px;
    background: rgba(0,12,27,.45);
}

.mk-user-promocode-history :is(strong,small,time) {
    display: block;
}

.mk-user-promocode-history strong {
    color: #eaf3fd;
    font-size: .86rem;
}

.mk-user-promocode-history small {
    margin-top: 5px;
    color: #8ca2b8;
    font-size: .72rem;
}

.mk-user-promocode-history time {
    margin-top: 6px;
    color: #7188a1;
    font-size: .68rem;
}

.mk-user-promocode-history article > span {
    color: #78eac7;
    font-size: .94rem;
    font-weight: 900;
}

.mk-user-promocode-empty {
    padding: 28px 15px;
    color: #8299b2;
    text-align: center;
}

.mk-user-promocode-pagination {
    margin-top: 12px;
}

.mk-user-promocode-footer {
    display: flex;
    justify-content: flex-start;
}

.mk-user-promocode-footer a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 0 12px;
    border: 1px solid rgba(59,220,255,.18);
    border-radius: 9px;
    background: rgba(0,132,187,.06);
    color: #82e5ff;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-wallet-promocode-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border: 1px solid rgba(60,228,180,.2);
    border-radius: 15px;
    background:
        radial-gradient(circle at 90% 18%, rgba(60,228,180,.11), transparent 32%),
        linear-gradient(145deg, rgba(6,27,51,.95), rgba(2,14,30,.97));
}

.mk-wallet-promocode-card h2 {
    margin: 0;
    color: #f5f9ff;
    font-size: 1rem;
}

.mk-wallet-promocode-card p {
    margin: 7px 0 0;
    color: #8ca2b8;
    font-size: .78rem;
    line-height: 1.5;
}

.mk-wallet-promocode-card > a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    border: 1px solid rgba(73,226,255,.58);
    border-radius: 9px;
    background: linear-gradient(135deg,#0aa5ff,#15d5ff);
    color: #00101f;
    font-size: .76rem;
    font-weight: 900;
    text-decoration: none;
}

@media (max-width: 900px) {
    .mk-user-promocode-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-user-promocode-balance {
        flex-basis: auto;
        width: 100%;
    }

    .mk-user-promocode-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .mk-user-promocode-page {
        width: min(100% - 20px,1180px);
        margin-top: 16px;
    }

    .mk-user-promocode-hero {
        padding: 21px;
    }

    .mk-user-promocode-history article {
        grid-template-columns: 1fr;
    }

    .mk-user-promocode-history article > span {
        justify-self: start;
    }

    .mk-wallet-promocode-card {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-wallet-promocode-card > a {
        width: 100%;
    }
}
/* END MARKUZI-PHASE-16-4-PROMOCODES-USER */


/* BEGIN MARKUZI-PHASE-16-5-GIVEAWAYS-USER */
.mk-user-giveaways-page {
    display: grid;
    width: min(1180px, calc(100% - 32px));
    gap: 16px;
    margin: 34px auto 60px;
}

.mk-user-giveaways-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    overflow: hidden;
    padding: 28px 30px;
    border: 1px solid rgba(75,205,255,.2);
    border-radius: 22px;
    background:
        radial-gradient(circle at 84% 22%, rgba(255,211,94,.16), transparent 31%),
        radial-gradient(circle at 70% 0, rgba(59,220,255,.08), transparent 25%),
        linear-gradient(135deg, rgba(7,35,65,.97), rgba(2,13,30,.98));
    box-shadow: 0 24px 70px rgba(0,0,0,.24);
}

.mk-user-giveaways-hero > div:first-child > a {
    display: inline-flex;
    margin-bottom: 12px;
    color: #79dff8;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-user-giveaways-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem,4vw,3.2rem);
    line-height: 1.04;
}

.mk-user-giveaways-hero p {
    max-width: 700px;
    margin: 12px 0 0;
    color: #a9bdd1;
    font-size: .94rem;
    line-height: 1.65;
}

.mk-user-giveaways-summary {
    display: grid;
    flex: 0 0 245px;
    min-height: 145px;
    place-items: center;
    align-content: center;
    gap: 5px;
    border: 1px solid rgba(255,211,94,.27);
    border-radius: 18px;
    background: rgba(199,144,0,.07);
}

.mk-user-giveaways-summary small {
    color: #8aa3b9;
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.mk-user-giveaways-summary strong {
    color: #fff;
    font-size: 2.15rem;
    line-height: 1;
}

.mk-user-giveaways-summary span {
    color: #ffd970;
    font-size: .76rem;
    font-weight: 850;
}

.mk-user-giveaways-flash {
    padding: 13px 15px;
    border: 1px solid rgba(60,228,180,.25);
    border-radius: 12px;
    background: rgba(17,158,117,.08);
    color: #81e8c9;
    font-size: .84rem;
}

.mk-user-giveaways-flash.is-error {
    border-color: rgba(255,100,123,.28);
    background: rgba(183,37,64,.08);
    color: #ff9bab;
}

.mk-user-giveaways-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
}

.mk-user-giveaways-grid > article {
    display: grid;
    align-content: start;
    gap: 14px;
    overflow: hidden;
    padding: 20px;
    border: 1px solid rgba(75,205,255,.18);
    border-radius: 17px;
    background:
        radial-gradient(circle at 95% 0, rgba(59,220,255,.08), transparent 32%),
        linear-gradient(145deg,rgba(6,27,51,.95),rgba(2,14,30,.97));
}

.mk-user-giveaways-grid > article.is-drawn {
    border-color: rgba(182,140,255,.22);
}

.mk-user-giveaways-grid > article > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.mk-user-giveaways-grid h2 {
    margin: 7px 0 0;
    color: #f5f9ff;
    font-size: 1.15rem;
    line-height: 1.2;
}

.mk-user-giveaway-status,
.mk-user-entry-badge,
.mk-user-winner-badge {
    display: inline-flex;
    width: fit-content;
    min-height: 24px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(75,205,255,.2);
    border-radius: 999px;
    color: #8ba7bf;
    font-size: .64rem;
    font-weight: 900;
    text-transform: uppercase;
}

.mk-user-entry-badge {
    border-color: rgba(60,228,180,.23);
    color: #78eac7;
}

.mk-user-winner-badge {
    border-color: rgba(255,211,94,.27);
    background: rgba(199,144,0,.07);
    color: #ffd970;
}

.mk-user-giveaway-description {
    margin: 0;
    color: #9cb1c5;
    font-size: .84rem;
    line-height: 1.6;
    white-space: pre-line;
}

.mk-user-giveaway-prizes {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
}

.mk-user-giveaway-prizes span {
    display: grid;
    gap: 5px;
    padding: 11px;
    border: 1px solid rgba(255,211,94,.16);
    border-radius: 10px;
    background: rgba(199,144,0,.04);
    color: #d7e3ee;
    font-size: .78rem;
}

.mk-user-giveaway-prizes b {
    color: #ffd970;
    font-size: .65rem;
    text-transform: uppercase;
}

.mk-user-giveaways-grid dl {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 7px;
    margin: 0;
}

.mk-user-giveaways-grid dl div {
    padding: 9px;
    border: 1px solid rgba(75,205,255,.11);
    border-radius: 9px;
    background: rgba(0,132,187,.025);
}

.mk-user-giveaways-grid dt {
    color: #7188a1;
    font-size: .63rem;
}

.mk-user-giveaways-grid dd {
    margin: 5px 0 0;
    color: #dfeaf5;
    font-size: .74rem;
    font-weight: 800;
    line-height: 1.4;
}

.mk-user-giveaways-grid details {
    padding: 10px 11px;
    border: 1px solid rgba(75,205,255,.12);
    border-radius: 9px;
    background: rgba(0,132,187,.025);
}

.mk-user-giveaways-grid summary {
    color: #82e5ff;
    font-size: .74rem;
    font-weight: 800;
    cursor: pointer;
}

.mk-user-giveaways-grid details p {
    margin: 9px 0 0;
    color: #8ca2b8;
    font-size: .76rem;
    line-height: 1.55;
    white-space: pre-line;
}

.mk-user-public-winners {
    display: grid;
    gap: 8px;
    padding: 11px;
    border: 1px solid rgba(182,140,255,.19);
    border-radius: 10px;
    background: rgba(100,60,180,.045);
}

.mk-user-public-winners > strong {
    color: #c8aaff;
    font-size: .76rem;
}

.mk-user-public-winners > div {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.mk-user-public-winners span {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(182,140,255,.18);
    border-radius: 999px;
    color: #d6c3ff;
    font-size: .68rem;
}

.mk-user-giveaways-grid > article > footer {
    display: flex;
    min-height: 42px;
    align-items: flex-end;
    margin-top: auto;
}

.mk-user-giveaways-grid footer form {
    width: 100%;
    margin: 0;
}

.mk-user-giveaways-grid footer button {
    width: 100%;
    min-height: 42px;
    border: 1px solid rgba(73,226,255,.58);
    border-radius: 9px;
    background: linear-gradient(135deg,#0aa5ff,#15d5ff);
    color: #00101f;
    font: inherit;
    font-size: .78rem;
    font-weight: 900;
    cursor: pointer;
}

.mk-user-giveaways-grid footer button.is-withdraw {
    border-color: rgba(255,100,123,.22);
    background: rgba(183,37,64,.07);
    color: #ff9bac;
}

.mk-user-giveaways-grid footer > span {
    display: inline-flex;
    width: 100%;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(75,205,255,.13);
    border-radius: 9px;
    color: #8299b2;
    font-size: .75rem;
}

.mk-user-giveaways-empty {
    grid-column: 1 / -1;
    padding: 45px 20px;
    border: 1px solid rgba(75,205,255,.16);
    border-radius: 16px;
    color: #8299b2;
    text-align: center;
}

.mk-user-giveaways-pagination {
    padding: 14px 0;
}

.mk-user-giveaways-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.mk-user-giveaways-footer a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border: 1px solid rgba(59,220,255,.18);
    border-radius: 9px;
    background: rgba(0,132,187,.06);
    color: #82e5ff;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-wallet-giveaway-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border: 1px solid rgba(255,211,94,.2);
    border-radius: 15px;
    background:
        radial-gradient(circle at 90% 18%, rgba(255,211,94,.1), transparent 32%),
        linear-gradient(145deg,rgba(6,27,51,.95),rgba(2,14,30,.97));
}

.mk-wallet-giveaway-card h2 {
    margin: 0;
    color: #f5f9ff;
    font-size: 1rem;
}

.mk-wallet-giveaway-card p {
    margin: 7px 0 0;
    color: #8ca2b8;
    font-size: .78rem;
    line-height: 1.5;
}

.mk-wallet-giveaway-card > a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    border: 1px solid rgba(255,211,94,.34);
    border-radius: 9px;
    background: linear-gradient(135deg,#d8a816,#ffd35e);
    color: #201700;
    font-size: .76rem;
    font-weight: 900;
    text-decoration: none;
}

@media (max-width: 900px) {
    .mk-user-giveaways-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-user-giveaways-summary {
        flex-basis: auto;
        width: 100%;
    }

    .mk-user-giveaways-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .mk-user-giveaways-page {
        width: min(100% - 20px,1180px);
        margin-top: 16px;
    }

    .mk-user-giveaways-hero {
        padding: 21px;
    }

    .mk-user-giveaway-prizes,
    .mk-user-giveaways-grid dl {
        grid-template-columns: 1fr;
    }

    .mk-user-giveaways-grid > article > header,
    .mk-user-giveaways-footer,
    .mk-wallet-giveaway-card {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-wallet-giveaway-card > a {
        width: 100%;
    }
}
/* END MARKUZI-PHASE-16-5-GIVEAWAYS-USER */


/* BEGIN MARKUZI-PHASE-16-6-BADGES-ACTIVITY-USER */
:is(
    .mk-user-badges-page,
    .mk-user-activity-page
) {
    display: grid;
    width: min(1180px,calc(100% - 32px));
    gap: 16px;
    margin: 34px auto 60px;
}

:is(
    .mk-user-badges-hero,
    .mk-user-activity-hero
) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 28px 30px;
    border: 1px solid rgba(75,205,255,.2);
    border-radius: 22px;
    background:
        radial-gradient(circle at 84% 22%, rgba(182,140,255,.16), transparent 31%),
        radial-gradient(circle at 70% 0, rgba(59,220,255,.08), transparent 25%),
        linear-gradient(135deg,rgba(7,35,65,.97),rgba(2,13,30,.98));
}

:is(
    .mk-user-badges-hero,
    .mk-user-activity-hero
) > div:first-child > a {
    display: inline-flex;
    margin-bottom: 12px;
    color: #79dff8;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

:is(
    .mk-user-badges-hero,
    .mk-user-activity-hero
) h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem,4vw,3.2rem);
}

:is(
    .mk-user-badges-hero,
    .mk-user-activity-hero
) p {
    max-width: 700px;
    margin: 12px 0 0;
    color: #a9bdd1;
    font-size: .94rem;
    line-height: 1.65;
}

.mk-user-badges-summary {
    display: grid;
    flex: 0 0 235px;
    min-height: 140px;
    place-items: center;
    align-content: center;
    gap: 5px;
    border: 1px solid rgba(182,140,255,.27);
    border-radius: 18px;
    background: rgba(100,60,180,.07);
}

.mk-user-badges-summary small {
    color: #8aa3b9;
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.mk-user-badges-summary strong {
    color: #fff;
    font-size: 2.15rem;
}

.mk-user-badges-summary span {
    color: #c8aaff;
    font-size: .76rem;
    font-weight: 850;
}

.mk-user-activity-badges {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    padding: 0 14px;
    border: 1px solid rgba(182,140,255,.28);
    border-radius: 10px;
    background: rgba(100,60,180,.07);
    color: #c8aaff;
    font-size: .8rem;
    font-weight: 900;
    text-decoration: none;
}

.mk-user-badges-section,
.mk-user-activity-panel {
    overflow: hidden;
    padding: 20px;
    border: 1px solid rgba(75,205,255,.18);
    border-radius: 17px;
    background: linear-gradient(145deg,rgba(6,27,51,.95),rgba(2,14,30,.97));
}

.mk-user-badges-section > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 15px;
}

.mk-user-badges-section h2 {
    margin: 0;
    color: #f5f9ff;
    font-size: 1.2rem;
}

.mk-user-badges-section > header > a {
    color: #82e5ff;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-user-badge-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 11px;
}

.mk-user-badge-grid article {
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 16px;
    border: 1px solid color-mix(in srgb, var(--badge-color) 22%, transparent);
    border-radius: 14px;
    background:
        radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--badge-color) 10%, transparent), transparent 35%),
        rgba(0,12,27,.47);
}

.mk-user-badge-grid article.is-locked {
    filter: saturate(.3);
    opacity: .7;
}

.mk-user-badge-icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--badge-color) 40%, transparent);
    border-radius: 15px;
    background: color-mix(in srgb, var(--badge-color) 9%, transparent);
    color: var(--badge-color);
    font-size: 1.05rem;
}

.mk-user-badge-grid h3 {
    margin: 2px 0 0;
    color: #f1f7fd;
    font-size: .92rem;
}

.mk-user-badge-grid p {
    margin: 0;
    color: #8da4ba;
    font-size: .76rem;
    line-height: 1.5;
}

.mk-user-badge-grid small {
    color: var(--badge-color);
    font-size: .69rem;
    font-weight: 800;
}

.mk-user-badge-grid em {
    color: #a9bdd1;
    font-size: .7rem;
}

.mk-user-badges-empty,
.mk-user-activity-empty {
    grid-column: 1 / -1;
    padding: 34px 16px;
    color: #8299b2;
    text-align: center;
}

.mk-user-activity-list {
    display: grid;
}

.mk-user-activity-list article {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border-bottom: 1px solid rgba(75,205,255,.09);
}

.mk-user-activity-list article > span {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid rgba(182,140,255,.22);
    border-radius: 11px;
    color: #c8aaff;
}

.mk-user-activity-list :is(strong,small,time) {
    display: block;
}

.mk-user-activity-list strong {
    color: #eaf3fd;
    font-size: .86rem;
}

.mk-user-activity-list p {
    margin: 5px 0;
    color: #8ca2b8;
    font-size: .76rem;
}

.mk-user-activity-list :is(small,time) {
    color: #7188a1;
    font-size: .68rem;
}

@media (max-width: 1000px) {
    .mk-user-badge-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 700px) {
    :is(
        .mk-user-badges-hero,
        .mk-user-activity-hero,
        .mk-user-badges-section > header
    ) {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-user-badges-summary {
        flex-basis: auto;
        width: 100%;
    }

    .mk-user-badge-grid {
        grid-template-columns: 1fr;
    }

    .mk-user-activity-list article {
        grid-template-columns: auto minmax(0,1fr);
    }

    .mk-user-activity-list time {
        grid-column: 2;
    }
}
/* END MARKUZI-PHASE-16-6-BADGES-ACTIVITY-USER */


/* BEGIN MARKUZI-PHASE-16-6-1-PUBLIC-BADGE-PROFILES-USER */
.mk-user-badge-strip {
    display: inline-flex;
    max-width: 100%;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    text-decoration: none;
}

.mk-user-badge-chip {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    border: 1px solid color-mix(
        in srgb,
        var(--badge-color,#35d8ff) 34%,
        transparent
    );
    border-radius: 999px;
    background: color-mix(
        in srgb,
        var(--badge-color,#35d8ff) 8%,
        transparent
    );
    color: var(--badge-color,#35d8ff);
}

.mk-user-badge-chip b {
    font-size: .65rem;
    line-height: 1;
}

.mk-user-badge-chip small {
    color: inherit;
    font-size: .7rem;
    font-weight: 850;
}

.mk-user-inline-profile {
    color: inherit;
    font-weight: 800;
    text-decoration: none;
}

.mk-user-inline-profile:hover {
    color: #82e5ff;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.mk-community-user-profile {
    display: grid;
    width: min(1120px,calc(100% - 32px));
    gap: 17px;
    margin: 34px auto 60px;
}

.mk-community-user-hero {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: center;
    gap: 24px;
    padding: 28px 30px;
    border: 1px solid rgba(75,205,255,.2);
    border-radius: 22px;
    background:
        radial-gradient(
            circle at 87% 15%,
            rgba(182,140,255,.15),
            transparent 31%
        ),
        radial-gradient(
            circle at 68% 0,
            rgba(59,220,255,.08),
            transparent 25%
        ),
        linear-gradient(
            135deg,
            rgba(7,35,65,.97),
            rgba(2,13,30,.98)
        );
    box-shadow: 0 24px 70px rgba(0,0,0,.24);
}

.mk-community-user-avatar {
    display: grid;
    width: 112px;
    height: 112px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(75,205,255,.27);
    border-radius: 28px;
    background:
        radial-gradient(
            circle at 35% 25%,
            rgba(59,220,255,.16),
            transparent 45%
        ),
        rgba(0,132,187,.06);
}

.mk-community-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mk-community-user-avatar > span {
    color: #82e5ff;
    font-size: 2.4rem;
    font-weight: 950;
}

.mk-community-user-copy > a {
    display: inline-flex;
    margin-bottom: 11px;
    color: #79dff8;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-community-user-copy h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem,4vw,3.15rem);
    line-height: 1.05;
}

.mk-community-user-copy > p {
    max-width: 720px;
    margin: 13px 0 0;
    color: #9eb3c8;
    font-size: .86rem;
    line-height: 1.6;
}

.mk-community-user-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 12px;
}

.mk-community-user-meta span {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(75,205,255,.16);
    border-radius: 999px;
    background: rgba(0,132,187,.04);
    color: #a8bed1;
    font-size: .7rem;
    font-weight: 800;
}

.mk-community-user-badges {
    overflow: hidden;
    padding: 20px;
    border: 1px solid rgba(75,205,255,.18);
    border-radius: 17px;
    background:
        radial-gradient(
            circle at 94% 0,
            rgba(182,140,255,.08),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            rgba(6,27,51,.95),
            rgba(2,14,30,.97)
        );
}

.mk-community-user-badges > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    margin-bottom: 16px;
}

.mk-community-user-badges h2 {
    margin: 0;
    color: #f5f9ff;
    font-size: 1.25rem;
}

.mk-community-user-badges > header > span {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 0 10px;
    border: 1px solid rgba(182,140,255,.2);
    border-radius: 999px;
    color: #c8aaff;
    font-size: .72rem;
    font-weight: 850;
}

.mk-community-user-badge-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 11px;
}

.mk-community-user-badge-grid article {
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 17px;
    border: 1px solid color-mix(
        in srgb,
        var(--badge-color) 24%,
        transparent
    );
    border-radius: 14px;
    background:
        radial-gradient(
            circle at 88% 10%,
            color-mix(
                in srgb,
                var(--badge-color) 11%,
                transparent
            ),
            transparent 34%
        ),
        rgba(0,12,27,.48);
}

.mk-community-user-badge-icon {
    display: grid;
    width: 49px;
    height: 49px;
    place-items: center;
    border: 1px solid color-mix(
        in srgb,
        var(--badge-color) 42%,
        transparent
    );
    border-radius: 15px;
    background: color-mix(
        in srgb,
        var(--badge-color) 9%,
        transparent
    );
    color: var(--badge-color);
    font-size: 1.05rem;
}

.mk-community-user-badge-grid h3 {
    margin: 2px 0 0;
    color: #f1f7fd;
    font-size: .94rem;
}

.mk-community-user-badge-grid p {
    margin: 0;
    color: #8da4ba;
    font-size: .77rem;
    line-height: 1.52;
}

.mk-community-user-badge-grid small {
    color: var(--badge-color);
    font-size: .68rem;
    font-weight: 800;
}

.mk-community-user-empty {
    grid-column: 1 / -1;
    padding: 42px 20px;
    border: 1px dashed rgba(75,205,255,.17);
    border-radius: 13px;
    color: #8299b2;
    text-align: center;
}

@media (max-width: 900px) {
    .mk-community-user-badge-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 650px) {
    .mk-community-user-profile {
        width: min(100% - 20px,1120px);
        margin-top: 16px;
    }

    .mk-community-user-hero {
        grid-template-columns: 1fr;
        padding: 21px;
    }

    .mk-community-user-avatar {
        width: 88px;
        height: 88px;
        border-radius: 22px;
    }

    .mk-community-user-badges > header {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-community-user-badge-grid {
        grid-template-columns: 1fr;
    }
}
/* END MARKUZI-PHASE-16-6-1-PUBLIC-BADGE-PROFILES-USER */


/* BEGIN MARKUZI-PHASE-16-7-CHANGELOG-USER */
.mk-user-changelog-page {
    display: grid;
    width: min(1120px,calc(100% - 32px));
    gap: 17px;
    margin: 34px auto 60px;
}

.mk-user-changelog-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 28px 30px;
    border: 1px solid rgba(75,205,255,.2);
    border-radius: 22px;
    background:
        radial-gradient(circle at 84% 22%, rgba(59,220,255,.14), transparent 31%),
        radial-gradient(circle at 70% 0, rgba(182,140,255,.08), transparent 25%),
        linear-gradient(135deg,rgba(7,35,65,.97),rgba(2,13,30,.98));
    box-shadow: 0 24px 70px rgba(0,0,0,.24);
}

.mk-user-changelog-hero > div > a {
    display: inline-flex;
    margin-bottom: 12px;
    color: #79dff8;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.mk-user-changelog-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem,4vw,3.2rem);
}

.mk-user-changelog-hero p {
    max-width: 700px;
    margin: 12px 0 0;
    color: #a9bdd1;
    font-size: .94rem;
    line-height: 1.65;
}

.mk-user-changelog-symbol {
    display: grid;
    width: 78px;
    height: 78px;
    place-items: center;
    border: 1px solid rgba(59,220,255,.28);
    border-radius: 20px;
    background: rgba(0,132,187,.07);
    color: #82e5ff;
    font-size: 1.5rem;
    font-weight: 950;
}

.mk-user-changelog-list {
    display: grid;
    gap: 13px;
}

.mk-user-changelog-list > article {
    display: grid;
    grid-template-columns: 100px minmax(0,1fr);
    gap: 18px;
    padding: 20px;
    border: 1px solid rgba(75,205,255,.18);
    border-radius: 17px;
    background:
        radial-gradient(circle at 95% 0, rgba(59,220,255,.06), transparent 32%),
        linear-gradient(145deg,rgba(6,27,51,.95),rgba(2,14,30,.97));
}

.mk-user-changelog-list > article.is-security {
    border-color: rgba(255,211,94,.2);
}

.mk-user-changelog-list > article.is-feature {
    border-color: rgba(182,140,255,.2);
}

.mk-user-changelog-list > article.is-fix {
    border-color: rgba(60,228,180,.2);
}

.mk-user-changelog-list > article > aside {
    display: grid;
    align-content: start;
    justify-items: center;
    gap: 9px;
}

.mk-user-changelog-list > article > aside > span {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid rgba(59,220,255,.24);
    border-radius: 15px;
    color: #82e5ff;
    font-size: .9rem;
    font-weight: 950;
}

.mk-user-changelog-list > article > aside time {
    color: #7188a1;
    font-size: .68rem;
    font-weight: 800;
}

.mk-user-changelog-list article header > div {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.mk-user-changelog-list article header :is(span,b) {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 0 8px;
    border: 1px solid rgba(75,205,255,.16);
    border-radius: 999px;
    color: #8da4ba;
    font-size: .64rem;
    font-weight: 850;
}

.mk-user-changelog-list h2 {
    margin: 10px 0 0;
    color: #f5f9ff;
    font-size: 1.3rem;
}

.mk-user-changelog-summary {
    margin: 10px 0 0;
    color: #b2c4d5;
    font-size: .88rem;
    font-weight: 700;
    line-height: 1.55;
}

.mk-user-changelog-content {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid rgba(75,205,255,.1);
    color: #8da4ba;
    font-size: .8rem;
    line-height: 1.72;
}

.mk-user-changelog-empty {
    padding: 46px 20px;
    border: 1px solid rgba(75,205,255,.16);
    border-radius: 16px;
    color: #8299b2;
    text-align: center;
}

@media (max-width: 700px) {
    .mk-user-changelog-page {
        width: min(100% - 20px,1120px);
        margin-top: 16px;
    }

    .mk-user-changelog-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 21px;
    }

    .mk-user-changelog-list > article {
        grid-template-columns: 1fr;
    }

    .mk-user-changelog-list > article > aside {
        justify-items: start;
        grid-template-columns: auto auto;
        align-items: center;
    }
}
/* END MARKUZI-PHASE-16-7-CHANGELOG-USER */


/* BEGIN MARKUZI-PHASE-16-8-SLOTGAME-USER */
.mk-slot-game-page {
    --slot-purple: #b68cff;
    --slot-cyan: #62e3ff;
    --slot-mint: #72e8c5;
    --slot-gold: #ffd66d;
    display: grid;
    width: min(1320px,calc(100% - 30px));
    gap: 16px;
    margin: 28px auto 60px;
}

.mk-slot-game-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    overflow: hidden;
    padding: 28px 30px;
    border: 1px solid rgba(182,140,255,.25);
    border-radius: 23px;
    background:
        radial-gradient(circle at 88% 16%, rgba(182,140,255,.21), transparent 31%),
        radial-gradient(circle at 68% 0, rgba(59,220,255,.09), transparent 26%),
        linear-gradient(135deg,rgba(24,16,64,.98),rgba(2,12,29,.99));
    box-shadow: 0 28px 80px rgba(0,0,0,.28);
}

.mk-slot-game-hero > div:first-child > a {
    display: inline-flex;
    margin-bottom: 11px;
    color: #bea8ff;
    font-size: .78rem;
    font-weight: 850;
    text-decoration: none;
}

.mk-slot-game-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem,5vw,3.8rem);
    line-height: .95;
}

.mk-slot-game-hero h1 span {
    display: block;
    margin-top: 9px;
    color: var(--slot-purple);
    text-shadow: 0 0 22px rgba(182,140,255,.35);
}

.mk-slot-game-hero p {
    max-width: 760px;
    margin: 14px 0 0;
    color: #a9b8cd;
    font-size: .94rem;
    line-height: 1.65;
}

.mk-slot-balance-card {
    display: grid;
    min-width: 220px;
    justify-items: center;
    padding: 19px 23px;
    border: 1px solid rgba(98,227,255,.24);
    border-radius: 18px;
    background: rgba(0,113,156,.07);
}

.mk-slot-balance-card span,
.mk-slot-balance-card small {
    color: #87a4ba;
    font-size: .72rem;
}

.mk-slot-balance-card strong {
    margin: 6px 0 2px;
    color: #f4fbff;
    font-size: 2.1rem;
    text-shadow: 0 0 18px rgba(98,227,255,.22);
}

.mk-slot-game-alert {
    display: grid;
    gap: 4px;
    padding: 13px 15px;
    border: 1px solid rgba(255,211,94,.24);
    border-radius: 11px;
    background: rgba(158,112,0,.08);
    color: #ffd970;
}

.mk-slot-game-alert.is-error {
    border-color: rgba(255,100,123,.25);
    background: rgba(183,37,64,.08);
    color: #ff9bac;
}

.mk-slot-game-alert strong {
    font-size: .84rem;
}

.mk-slot-game-alert span {
    font-size: .76rem;
}

.mk-slot-game-layout {
    display: grid;
    grid-template-columns: minmax(0,1.45fr) minmax(330px,.55fr);
    align-items: start;
    gap: 15px;
}

.mk-slot-machine {
    overflow: hidden;
    border: 1px solid rgba(182,140,255,.28);
    border-radius: 24px;
    background:
        radial-gradient(circle at 50% 0, rgba(182,140,255,.11), transparent 33%),
        linear-gradient(160deg,rgba(17,15,48,.98),rgba(2,10,25,.99));
    box-shadow:
        inset 0 0 45px rgba(111,63,198,.05),
        0 24px 70px rgba(0,0,0,.25);
}

.mk-slot-machine-top {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    padding: 16px 21px;
    border-bottom: 1px solid rgba(182,140,255,.14);
}

.mk-slot-machine-top span {
    color: #778ba4;
    font-size: .7rem;
    font-weight: 850;
}

.mk-slot-machine-top span:last-child {
    text-align: right;
}

.mk-slot-machine-top strong {
    color: #dacbff;
    font-size: .9rem;
    letter-spacing: .13em;
    text-shadow: 0 0 16px rgba(182,140,255,.28);
}

.mk-slot-reel-window {
    display: grid;
    gap: 7px;
    margin: 22px;
    padding: 12px;
    border: 1px solid rgba(98,227,255,.2);
    border-radius: 18px;
    background:
        linear-gradient(180deg,rgba(0,0,0,.28),rgba(22,12,53,.26)),
        rgba(1,8,20,.92);
    box-shadow:
        inset 0 0 30px rgba(0,0,0,.52),
        0 0 28px rgba(98,227,255,.06);
}

.mk-slot-reel-row {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 7px;
}

.mk-slot-reel-cell {
    display: grid;
    min-height: 105px;
    place-items: center;
    border: 1px solid rgba(182,140,255,.18);
    border-radius: 15px;
    background:
        radial-gradient(circle,rgba(182,140,255,.11),rgba(8,11,29,.94) 70%);
    color: #dacbff;
    font-size: clamp(2rem,5vw,3.3rem);
    font-weight: 950;
    text-shadow: 0 0 18px rgba(182,140,255,.3);
    transition:
        transform 140ms ease,
        border-color 140ms ease,
        box-shadow 140ms ease;
}

.mk-slot-game-page.is-spinning .mk-slot-reel-cell {
    transform: translateY(2px) scale(.98);
    filter: blur(.55px);
}

.mk-slot-game-page.has-win .mk-slot-reel-cell {
    border-color: rgba(255,214,109,.55);
    box-shadow:
        inset 0 0 26px rgba(255,214,109,.08),
        0 0 18px rgba(255,214,109,.12);
    color: #ffe6a3;
}

.mk-slot-reel-cell[data-symbol="seven"] {
    color: #ff7f99;
}

.mk-slot-reel-cell[data-symbol="diamond"] {
    color: #72e8ff;
}

.mk-slot-reel-cell[data-symbol="star"] {
    color: #ffd86e;
}

.mk-slot-reel-cell[data-symbol="wild"] {
    color: #d3c0ff;
}

.mk-slot-result-panel {
    display: grid;
    grid-template-columns: repeat(2,minmax(150px,.35fr)) minmax(0,1fr);
    align-items: center;
    gap: 10px;
    margin: 0 22px;
    padding: 13px;
    border: 1px solid rgba(182,140,255,.14);
    border-radius: 14px;
    background: rgba(3,13,31,.68);
}

.mk-slot-result-panel > div {
    padding: 9px 10px;
    border: 1px solid rgba(182,140,255,.1);
    border-radius: 10px;
    background: rgba(37,21,74,.16);
}

.mk-slot-result-panel span,
.mk-slot-result-panel strong {
    display: block;
}

.mk-slot-result-panel span {
    color: #72869f;
    font-size: .68rem;
}

.mk-slot-result-panel strong {
    margin-top: 5px;
    color: #f3f7ff;
    font-size: 1.05rem;
}

.mk-slot-result-panel p {
    margin: 0;
    color: #8da0b6;
    font-size: .79rem;
    line-height: 1.5;
}

.mk-slot-controls {
    display: grid;
    grid-template-columns: minmax(0,1fr) 180px;
    align-items: stretch;
    gap: 13px;
    padding: 20px 22px;
}

.mk-slot-controls fieldset {
    margin: 0;
    padding: 12px;
    border: 1px solid rgba(182,140,255,.14);
    border-radius: 13px;
}

.mk-slot-controls legend {
    padding: 0 6px;
    color: #8da1b7;
    font-size: .72rem;
    font-weight: 850;
}

.mk-slot-controls fieldset > div {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(70px,1fr));
    gap: 7px;
}

.mk-slot-controls label {
    position: relative;
}

.mk-slot-controls input {
    position: absolute;
    opacity: 0;
}

.mk-slot-controls label span {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(182,140,255,.16);
    border-radius: 10px;
    background: rgba(45,25,88,.19);
    color: #94a5bb;
    font-size: .79rem;
    font-weight: 900;
    cursor: pointer;
}

.mk-slot-controls input:checked + span {
    border-color: rgba(182,140,255,.65);
    background: linear-gradient(135deg,rgba(116,74,205,.32),rgba(75,43,142,.27));
    color: #eee8ff;
    box-shadow: 0 0 20px rgba(182,140,255,.13);
}

.mk-slot-controls > button {
    display: grid;
    place-content: center;
    border: 1px solid rgba(182,140,255,.7);
    border-radius: 15px;
    background:
        radial-gradient(circle at 50% 0,rgba(255,255,255,.16),transparent 42%),
        linear-gradient(135deg,#7c4bd8,#b68cff);
    color: #100520;
    cursor: pointer;
    box-shadow:
        0 13px 30px rgba(105,59,190,.24),
        inset 0 1px rgba(255,255,255,.25);
}

.mk-slot-controls > button:disabled {
    cursor: not-allowed;
    filter: grayscale(.65);
    opacity: .55;
}

.mk-slot-controls > button span,
.mk-slot-controls > button small {
    display: block;
}

.mk-slot-controls > button span {
    font-size: 1.35rem;
    font-weight: 1000;
    letter-spacing: .08em;
}

.mk-slot-controls > button small {
    margin-top: 3px;
    font-size: .65rem;
    font-weight: 850;
}

.mk-slot-machine > footer {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 0 22px 19px;
    color: #71859d;
    font-size: .69rem;
}

.mk-slot-machine > footer strong {
    color: #cbd7e5;
}

.mk-slot-game-side {
    display: grid;
    gap: 13px;
}

.mk-slot-game-side > section {
    overflow: hidden;
    border: 1px solid rgba(182,140,255,.17);
    border-radius: 17px;
    background: linear-gradient(145deg,rgba(10,24,49,.96),rgba(2,13,29,.98));
}

.mk-slot-game-side > section > header {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(182,140,255,.1);
}

.mk-slot-game-side h2 {
    margin: 2px 0 0;
    color: #f3f7ff;
    font-size: 1rem;
}

.mk-slot-game-page .mk-slot-symbol {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid rgba(182,140,255,.25);
    border-radius: 10px;
    background:
        radial-gradient(
            circle,
            rgba(182,140,255,.17),
            rgba(28,16,57,.2)
        );
    color: #d9caff;
    font-size: .88rem;
    font-weight: 950;
}

.mk-slot-game-page .mk-slot-symbol.is-seven {
    color: #ff7c96;
}

.mk-slot-game-page .mk-slot-symbol.is-diamond {
    color: #72e8ff;
}

.mk-slot-game-page .mk-slot-symbol.is-star {
    color: #ffd86e;
}

.mk-slot-user-paytable {
    display: grid;
    gap: 7px;
    padding: 11px;
}

.mk-slot-user-paytable strong,
.mk-slot-user-paytable small {
    display: block;
}

.mk-slot-user-paytable strong {
    color: #e7edf6;
    font-size: .75rem;
}

.mk-slot-user-paytable small {
    margin-top: 4px;
    color: #778ca4;
    font-size: .65rem;
}

.mk-slot-user-history {
    display: grid;
    gap: 6px;
    padding: 10px;
}

.mk-slot-user-history article {
    display: grid;
    grid-template-columns: minmax(85px,.6fr) minmax(100px,1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(182,140,255,.1);
    border-radius: 10px;
    background: rgba(2,11,27,.52);
}

.mk-slot-user-history article div strong,
.mk-slot-user-history article div small {
    display: block;
}

.mk-slot-user-history article div strong {
    color: #d9caff;
    font-size: .79rem;
}

.mk-slot-user-history article div small,
.mk-slot-user-history article > span {
    margin-top: 3px;
    color: #70859d;
    font-size: .64rem;
}

.mk-slot-user-history article > b {
    color: #8195aa;
    font-size: .74rem;
}

.mk-slot-user-history article > b.is-win {
    color: var(--slot-mint);
}

.mk-slot-user-empty {
    padding: 28px 14px;
    color: #788ca4;
    font-size: .72rem;
    text-align: center;
}

.mk-slot-rules {
    padding: 15px 17px;
    border: 1px solid rgba(255,211,94,.16);
    border-radius: 13px;
    background: rgba(140,99,0,.05);
}

.mk-slot-rules strong {
    color: #ffd970;
    font-size: .81rem;
}

.mk-slot-rules p {
    margin: 6px 0 0;
    color: #8497ad;
    font-size: .76rem;
    line-height: 1.6;
}

@media (max-width: 1030px) {
    .mk-slot-game-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .mk-slot-game-page {
        width: min(100% - 18px,1320px);
        margin-top: 12px;
    }

    .mk-slot-game-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 21px;
    }

    .mk-slot-balance-card {
        min-width: 0;
    }

    .mk-slot-reel-window {
        gap: 4px;
        margin: 12px;
        padding: 7px;
    }

    .mk-slot-reel-row {
        gap: 4px;
    }

    .mk-slot-reel-cell {
        min-height: 70px;
        border-radius: 10px;
        font-size: 1.8rem;
    }

    .mk-slot-result-panel {
        grid-template-columns: repeat(2,minmax(0,1fr));
        margin: 0 12px;
    }

    .mk-slot-result-panel p {
        grid-column: 1 / -1;
    }

    .mk-slot-controls {
        grid-template-columns: 1fr;
        padding: 14px 12px;
    }

    .mk-slot-controls > button {
        min-height: 86px;
    }

    .mk-slot-machine > footer {
        flex-direction: column;
        padding: 0 12px 15px;
    }
}
/* END MARKUZI-PHASE-16-8-SLOTGAME-USER */


/* BEGIN MARKUZI-PHASE-16-9-1-STREAM-TOURNAMENT-PUBLIC */
.mk-stream-public-page {
    display: grid;
    width: min(1320px,calc(100% - 30px));
    gap: 16px;
    margin: 28px auto 60px;
}

.mk-stream-public-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    overflow: hidden;
    padding: 28px 30px;
    border: 1px solid rgba(255,211,94,.22);
    border-radius: 23px;
    background:
        radial-gradient(circle at 88% 16%, rgba(255,211,94,.16), transparent 31%),
        radial-gradient(circle at 68% 0, rgba(182,140,255,.1), transparent 26%),
        linear-gradient(135deg,rgba(31,19,61,.98),rgba(2,12,29,.99));
    box-shadow: 0 28px 80px rgba(0,0,0,.28);
}

.mk-stream-public-hero > div:first-child > a {
    display: inline-flex;
    margin-bottom: 11px;
    color: #e7c969;
    font-size: .78rem;
    font-weight: 850;
    text-decoration: none;
}

.mk-stream-public-hero h1 {
    max-width: 820px;
    margin: 0;
    color: #fff;
    font-size: clamp(2rem,5vw,3.7rem);
    line-height: 1;
}

.mk-stream-public-hero p {
    max-width: 760px;
    margin: 14px 0 0;
    color: #a7b7cc;
    font-size: .94rem;
    line-height: 1.65;
}

.mk-stream-public-hero > div:last-child {
    display: grid;
    min-width: 210px;
    justify-items: center;
    padding: 18px 22px;
    border: 1px solid rgba(255,211,94,.23);
    border-radius: 18px;
    background: rgba(119,83,0,.08);
}

.mk-stream-public-hero > div:last-child > span {
    color: #ffdc79;
    font-size: 1.4rem;
}

.mk-stream-public-hero > div:last-child > strong {
    margin: 5px 0 2px;
    color: #fff;
    font-size: 2rem;
}

.mk-stream-public-hero > div:last-child > small {
    color: #88a0b6;
    font-size: .7rem;
}

.mk-stream-public-alert {
    display: grid;
    gap: 4px;
    padding: 13px 15px;
    border: 1px solid rgba(255,211,94,.23);
    border-radius: 11px;
    background: rgba(156,111,0,.07);
    color: #ffdc79;
    font-size: .76rem;
}

.mk-stream-public-alert.is-success {
    border-color: rgba(60,228,180,.24);
    background: rgba(17,158,117,.08);
    color: #82e8ca;
}

.mk-stream-public-alert.is-error {
    border-color: rgba(255,100,123,.25);
    background: rgba(183,37,64,.08);
    color: #ff9bac;
}

.mk-stream-public-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 13px;
}

.mk-stream-public-grid > article,
.mk-stream-public-panel {
    overflow: hidden;
    border: 1px solid rgba(255,211,94,.16);
    border-radius: 17px;
    background: linear-gradient(145deg,rgba(10,24,49,.96),rgba(2,13,29,.98));
}

.mk-stream-public-grid > article {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 15px;
}

.mk-stream-public-grid > article > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.mk-stream-public-grid > article > header span,
.mk-stream-public-grid > article > header strong {
    font-size: .67rem;
}

.mk-stream-public-grid > article > header span {
    color: #e4c86f;
}

.mk-stream-public-grid > article > header strong {
    color: #8196ad;
}

.mk-stream-public-grid h2 {
    margin: 0;
    color: #f4f8ff;
    font-size: 1.06rem;
}

.mk-stream-public-grid p {
    margin: 0;
    color: #8095ad;
    font-size: .76rem;
    line-height: 1.55;
}

.mk-stream-public-grid dl {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 7px;
    margin: 0;
}

.mk-stream-public-grid dl > div {
    padding: 8px;
    border: 1px solid rgba(255,211,94,.08);
    border-radius: 9px;
    background: rgba(3,13,30,.5);
}

.mk-stream-public-grid dt,
.mk-stream-public-grid dd {
    display: block;
    font-size: .66rem;
}

.mk-stream-public-grid dt {
    color: #71869e;
}

.mk-stream-public-grid dd {
    margin: 4px 0 0;
    color: #e1e8f1;
    font-weight: 850;
}

.mk-stream-own-entry,
.mk-stream-public-winner {
    display: grid;
    gap: 3px;
    padding: 10px;
    border: 1px solid rgba(255,211,94,.14);
    border-radius: 10px;
    background: rgba(107,75,0,.07);
}

.mk-stream-own-entry span,
.mk-stream-own-entry small,
.mk-stream-public-winner span,
.mk-stream-public-winner small {
    color: #8196ad;
    font-size: .65rem;
}

.mk-stream-own-entry strong,
.mk-stream-public-winner strong {
    color: #ffdc79;
    font-size: .82rem;
}

.mk-stream-own-entry.is-large b {
    color: #eef3fa;
    font-size: .78rem;
}

.mk-stream-public-grid > article > a {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    border: 1px solid rgba(255,211,94,.3);
    border-radius: 10px;
    color: #e6ca70;
    font-size: .74rem;
    font-weight: 900;
    text-decoration: none;
}

.mk-stream-public-layout {
    display: grid;
    grid-template-columns: minmax(0,1.2fr) minmax(330px,.8fr);
    align-items: start;
    gap: 14px;
}

.mk-stream-public-panel > header {
    padding: 14px 15px;
    border-bottom: 1px solid rgba(255,211,94,.09);
}

.mk-stream-public-panel h2 {
    margin: 2px 0 0;
    color: #f3f7ff;
    font-size: 1rem;
}

.mk-stream-public-panel > form,
.mk-stream-public-panel > .mk-stream-own-entry,
.mk-stream-public-panel > .mk-stream-public-empty {
    margin: 13px;
}

.mk-stream-public-join {
    display: grid;
    gap: 10px;
}

.mk-stream-public-join label {
    display: grid;
    gap: 6px;
}

.mk-stream-public-join label span {
    color: #c9d4e2;
    font-size: .72rem;
    font-weight: 850;
}

.mk-stream-public-join input,
.mk-stream-public-panel form select {
    width: 100%;
    min-height: 42px;
    padding: 0 11px;
    border: 1px solid rgba(255,211,94,.17);
    border-radius: 10px;
    outline: 0;
    background: rgba(2,13,30,.9);
    color: #f4f8ff;
    font: inherit;
    font-size: .76rem;
}

.mk-stream-public-join button,
.mk-stream-public-panel > form > button {
    min-height: 42px;
    padding: 0 13px;
    border: 1px solid rgba(255,211,94,.55);
    border-radius: 10px;
    background: linear-gradient(135deg,#bf9227,#ffd76b);
    color: #211500;
    font: inherit;
    font-size: .74rem;
    font-weight: 950;
    cursor: pointer;
}

.mk-stream-public-facts {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 12px;
}

.mk-stream-public-facts > div {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(255,211,94,.09);
    border-radius: 9px;
    background: rgba(4,15,32,.52);
}

.mk-stream-public-facts dt,
.mk-stream-public-facts dd {
    font-size: .72rem;
}

.mk-stream-public-facts dt {
    color: #7b90a7;
}

.mk-stream-public-facts dd {
    margin: 0;
    color: #e6edf6;
    font-weight: 850;
}

.mk-stream-public-rules {
    margin: 0 12px 12px;
    padding: 11px;
    border: 1px solid rgba(255,211,94,.1);
    border-radius: 10px;
    background: rgba(64,43,0,.05);
}

.mk-stream-public-rules strong {
    color: #e6ca70;
    font-size: .74rem;
}

.mk-stream-public-rules p {
    margin: 6px 0 0;
    color: #8195ac;
    font-size: .69rem;
    line-height: 1.6;
}

.mk-stream-public-participants {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 11px;
}

.mk-stream-public-participants article {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(255,211,94,.09);
    border-radius: 10px;
    background: rgba(3,13,30,.48);
}

.mk-stream-public-participants article > span {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(255,211,94,.2);
    border-radius: 50%;
    color: #ffdb79;
    font-size: .72rem;
    font-weight: 950;
}

.mk-stream-public-participants strong,
.mk-stream-public-participants small {
    display: block;
}

.mk-stream-public-participants strong {
    color: #eaf0f8;
    font-size: .76rem;
}

.mk-stream-public-participants small {
    margin-top: 3px;
    color: #778ca4;
    font-size: .66rem;
}

.mk-stream-public-participants b {
    grid-column: 1 / -1;
    color: #a5945a;
    font-size: .62rem;
    font-weight: 850;
}

.mk-stream-public-table-wrap {
    overflow-x: auto;
}

.mk-stream-public-table {
    width: 100%;
    border-collapse: collapse;
}

.mk-stream-public-table th {
    padding: 10px;
    border-bottom: 1px solid rgba(255,211,94,.1);
    color: #71869e;
    font-size: .66rem;
    text-align: left;
    white-space: nowrap;
}

.mk-stream-public-table td {
    padding: 10px;
    border-bottom: 1px solid rgba(255,211,94,.07);
    color: #cdd8e5;
    font-size: .7rem;
}

.mk-stream-public-table td > span {
    display: inline-flex;
    padding: 4px 7px;
    border: 1px solid rgba(255,211,94,.13);
    border-radius: 999px;
    color: #d5be6d;
    font-size: .62rem;
}

.mk-stream-public-table tr.is-won td {
    background: rgba(26,135,101,.04);
}

.mk-stream-public-table tr.is-lost td {
    background: rgba(151,27,53,.035);
}

.mk-stream-public-empty,
.mk-stream-public-pagination {
    padding: 28px 14px;
    color: #7d91a8;
    font-size: .72rem;
    text-align: center;
}

@media (max-width: 1040px) {
    .mk-stream-public-grid,
    .mk-stream-public-participants {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .mk-stream-public-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .mk-stream-public-page {
        width: min(100% - 18px,1320px);
        margin-top: 12px;
    }

    .mk-stream-public-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 21px;
    }

    .mk-stream-public-hero > div:last-child {
        min-width: 0;
    }

    .mk-stream-public-grid,
    .mk-stream-public-participants {
        grid-template-columns: 1fr;
    }
}
/* END MARKUZI-PHASE-16-9-1-STREAM-TOURNAMENT-PUBLIC */


/* BEGIN MARKUZI-WALLET-CLEANUP */
.mk-wallet-top-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px;
    border: 1px solid rgba(75, 205, 255, .16);
    border-radius: 13px;
    background:
        linear-gradient(
            145deg,
            rgba(6, 27, 51, .92),
            rgba(2, 14, 30, .96)
        );
}

.mk-wallet-top-actions-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.mk-wallet-top-action {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    border-radius: 9px;
    font-size: .76rem;
    font-weight: 850;
    text-decoration: none;
    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease;
}

.mk-wallet-top-action:hover {
    transform: translateY(-1px);
}

.mk-wallet-top-action.is-secondary {
    border: 1px solid rgba(59, 220, 255, .2);
    background: rgba(0, 132, 187, .06);
    color: #82e5ff;
}

.mk-wallet-top-action.is-secondary:hover {
    border-color: rgba(59, 220, 255, .42);
    background: rgba(0, 132, 187, .11);
}

.mk-wallet-top-action.is-primary {
    border: 1px solid rgba(60, 228, 180, .42);
    background:
        linear-gradient(
            135deg,
            rgba(20, 181, 137, .92),
            rgba(57, 225, 180, .96)
        );
    color: #001a13;
    box-shadow: 0 8px 24px rgba(20, 181, 137, .14);
}

.mk-wallet-top-action.is-primary:hover {
    border-color: rgba(96, 244, 203, .68);
    background:
        linear-gradient(
            135deg,
            rgba(31, 196, 150, .98),
            rgba(76, 235, 193, 1)
        );
}

@media (max-width: 650px) {
    .mk-wallet-top-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .mk-wallet-top-actions-group {
        display: grid;
        grid-template-columns: 1fr;
    }

    .mk-wallet-top-action {
        width: 100%;
    }
}
/* END MARKUZI-WALLET-CLEANUP */


/* BEGIN MARKUZI-PROMOCODE-LAYOUT-CLEANUP-V2 */
.mk-promocode-top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    padding: 10px;
    border: 1px solid rgba(75, 205, 255, .16);
    border-radius: 13px;
    background:
        linear-gradient(
            145deg,
            rgba(6, 27, 51, .92),
            rgba(2, 14, 30, .96)
        );
}

.mk-promocode-top-actions-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.mk-promocode-top-action {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 13px;
    border: 1px solid rgba(59, 220, 255, .2);
    border-radius: 9px;
    background: rgba(0, 132, 187, .06);
    color: #82e5ff;
    font-size: .76rem;
    font-weight: 850;
    text-decoration: none;
    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease;
}

.mk-promocode-top-action:hover {
    transform: translateY(-1px);
    border-color: rgba(59, 220, 255, .42);
    background: rgba(0, 132, 187, .11);
}

@media (max-width: 650px) {
    .mk-promocode-top-actions-group {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr;
    }

    .mk-promocode-top-action {
        width: 100%;
    }
}
/* END MARKUZI-PROMOCODE-LAYOUT-CLEANUP-V2 */