body#panel-root:is(.panel-workspace, .login-page, .profile-completion) {
    --workspace-bg: #060814;
    --workspace-surface: rgba(30, 41, 59, 0.7);
    --workspace-ink: #ffffff;
    --workspace-muted: #cbd5e1;
    --workspace-primary: #00f2fe;
    --workspace-hover: #4facfe;
    --workspace-soft: rgba(0, 242, 254, 0.16);
    --workspace-border: rgba(255, 255, 255, 0.15);
    --workspace-success: #34d399;
    --workspace-warning: #fbbf24;
    --workspace-danger: #f87171;
    --workspace-success-bg: rgba(52, 211, 153, 0.22);
    --workspace-warning-bg: rgba(251, 191, 36, 0.22);
    --workspace-danger-bg: rgba(248, 113, 113, 0.22);
    --workspace-accent-grad: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%);
    --workspace-on-accent: #000000;
    --workspace-input-bg: #0f172a;
    --workspace-input-line: #334155;
    --workspace-header-height: calc(80px + env(safe-area-inset-top, 0px));
    --workspace-nav-width: 0px;
    --workspace-ticker-height: 0px;
    --workspace-gap: 24px;
    --store-ticker-h: 36px;
    --pt-bg: var(--workspace-bg);
    --pt-bg-2: var(--workspace-surface);
    --pt-surface: var(--workspace-surface);
    --pt-surface-2: rgba(30, 41, 59, 0.85);
    --pt-surface-3: #1e293b;
    --pt-line: var(--workspace-border);
    --pt-line-soft: rgba(255, 255, 255, 0.10);
    --pt-text: var(--workspace-ink);
    --pt-text-2: #cbd5e1;
    --pt-muted: var(--workspace-muted);
    --pt-violet: #4facfe;
    --pt-violet-2: #4facfe;
    --pt-cyan: var(--workspace-primary);
    --pt-cyan-2: var(--workspace-hover);
    --pt-accent-soft: var(--workspace-soft);
    --pt-accent-line: var(--workspace-primary);
    --pt-on-accent: #000000;
    --pt-gold: var(--workspace-warning);
    --pt-success: var(--workspace-success);
    --pt-success-bg: var(--workspace-success-bg);
    --pt-success-line: var(--workspace-success);
    --pt-warn: var(--workspace-warning);
    --pt-warn-bg: var(--workspace-warning-bg);
    --pt-warn-line: var(--workspace-warning);
    --pt-danger: var(--workspace-danger);
    --pt-danger-bg: var(--workspace-danger-bg);
    --pt-danger-line: var(--workspace-danger);
    --pt-info: var(--workspace-primary);
    --pt-info-bg: var(--workspace-soft);
    --pt-info-line: var(--workspace-primary);
    --pt-grad: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%);
    --pt-grad-soft: linear-gradient(135deg, rgba(0, 242, 254, 0.16) 0%, rgba(79, 172, 254, 0.16) 100%);
    --pt-shadow: 0 0 15px rgba(0, 242, 254, 0.10), 0 18px 38px -22px rgba(0, 0, 0, 0.55);
    --pt-shadow-lg: 0 0 24px rgba(0, 242, 254, 0.12), 0 26px 60px -28px rgba(0, 0, 0, 0.65);
    --primary: var(--workspace-primary) !important;
    --secondary: #4facfe !important;
    --bg-body: var(--workspace-bg) !important;
    --text-main: var(--workspace-ink) !important;
    --success: var(--workspace-success) !important;
    --warning: var(--workspace-warning) !important;
    --danger: var(--workspace-danger) !important;
    --ink: var(--workspace-ink) !important;
    --ink2: #cbd5e1 !important;
    --cyan: var(--workspace-primary) !important;
    --cyan2: var(--workspace-hover) !important;
    --stroke: var(--workspace-border) !important;
    --bs-body-bg: var(--workspace-bg);
    --bs-body-color: var(--workspace-ink);
    --bs-border-color: var(--workspace-border);
    --bs-heading-color: var(--workspace-ink);
    --bs-link-color: var(--workspace-primary);
    --bs-link-hover-color: var(--workspace-hover);
    --bs-card-bg: var(--workspace-surface);
    --bs-modal-bg: rgba(30, 41, 59, 0.97);
    --bs-modal-color: var(--workspace-ink);
    --bs-emphasis-color: var(--workspace-ink);
    --bs-secondary-color: var(--workspace-muted);
    --bs-tertiary-bg: #1e293b;
    box-sizing: border-box;
    margin: 0;
    background: var(--workspace-bg) !important;
    color: var(--workspace-ink) !important;
    font-family: 'Tajawal', Tahoma, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.6;
    color-scheme: dark;
    text-align: start;
    text-shadow: none !important;
}

html:has(> body#panel-root:is(.panel-workspace, .login-page, .profile-completion)) {
    background: #060814 !important;
    scroll-behavior: auto;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) *,
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) *::before,
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) *::after {
    box-sizing: border-box;
    text-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is([class], [id], [style]) {
    box-shadow: none !important;
    filter: none !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) [style*="gradient("] {
    background-image: none !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(button, input, select, textarea) {
    font-family: inherit;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(button, .btn, [role="button"], .log-btn, .social-btn, .pwa-btn) {
    min-height: 44px;
    min-width: 44px;
    font-size: 15px !important;
    line-height: 1.5;
    border-radius: 12px !important;
    touch-action: manipulation;
    cursor: pointer;
    transform: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) a {
    color: var(--workspace-primary);
    text-underline-offset: 3px;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) a:hover {
    color: var(--workspace-hover);
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :focus-visible {
    outline: 3px solid var(--workspace-primary) !important;
    outline-offset: 3px !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) ::selection {
    background: var(--workspace-primary);
    color: #000000 !important;
}

body#panel-root.panel-workspace {
    display: flex !important;
    flex-direction: row !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 0;
    overflow: hidden !important;
    direction: rtl;
}

body#panel-root.panel-workspace .main-container {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-width: 0;
    min-height: 0;
    width: calc(100% - var(--workspace-nav-width)) !important;
    max-width: none !important;
    height: 100vh;
    height: 100dvh;
    margin: 0 !important;
    margin-inline-start: var(--workspace-nav-width) !important;
    overflow: hidden !important;
    background: var(--workspace-bg) !important;
}

/* One offset also covers the formerly fixed chat view and both ticker branches. */
body#panel-root.panel-workspace :is(.app-view, #view-chat) {
    position: relative !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    height: auto !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 0 calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scroll-padding-block: 72px 24px;
    border-radius: 0 !important;
    background: var(--workspace-bg) !important;
    color: var(--workspace-ink) !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    display: none !important;
    opacity: 0;
    pointer-events: none;
    z-index: 10 !important;
}

body#panel-root.panel-workspace :is(.app-view, #view-chat).active {
    display: block !important;
    opacity: 1 !important;
    visibility: visible;
    pointer-events: auto !important;
}

body#panel-root.panel-workspace :is(.sidebar, .panel-desk-iconbar, .panel-dock, .btm-nav, .floating-menu-container, .fab-add) {
    display: none !important;
}

body#panel-root.panel-workspace .top-navbar {
    position: relative !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    z-index: 2100 !important;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: nowrap;
    height: var(--workspace-header-height);
    padding: env(safe-area-inset-top, 0px) var(--workspace-gap) 0;
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--workspace-ink) !important;
    border-bottom: 1px solid var(--workspace-border) !important;
    overflow: visible;
    flex-shrink: 0;
}

body#panel-root.panel-workspace :is(.top-navbar-left, .top-navbar-right) {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

body#panel-root.panel-workspace .top-navbar-left { flex: 1 1 auto; }
body#panel-root.panel-workspace .top-navbar-right { flex: 0 1 auto; }

body#panel-root.panel-workspace .top-navbar .balance-display {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 4px 8px;
    min-width: 0;
    min-height: 48px;
    max-width: 100%;
    padding: 8px 14px;
    background: var(--workspace-soft) !important;
    border: 1px solid var(--workspace-border) !important;
    color: var(--workspace-primary) !important;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

body#panel-root.panel-workspace:has(#view-home.active) .top-navbar .balance-display {
    display: flex !important;
}

body#panel-root.panel-workspace .top-navbar .balance-display:hover {
    background: var(--workspace-primary) !important;
    color: #000000 !important;
    border-color: var(--workspace-primary) !important;
}

body#panel-root.panel-workspace .top-navbar .balance-display :is(i, span) { color: inherit !important; }
body#panel-root.panel-workspace .workspace-balance-label { font-size: 15px; font-weight: 700; }
body#panel-root.panel-workspace :is(#desktop-ui-bal, #desktop-ui-sym) { direction: ltr; unicode-bidi: isolate; }

body#panel-root.panel-workspace #panel-menu-fab {
    position: static !important;
    display: inline-flex !important;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: auto;
    height: 48px;
    padding: 8px 12px;
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--workspace-ink) !important;
    border: 1px solid var(--workspace-border) !important;
    font-weight: 700;
}

body#panel-root.panel-workspace #panel-menu-fab.has-alert::after {
    position: static;
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    background: var(--workspace-danger);
    border: 0;
}

body#panel-root.panel-workspace .panel-menu-bars { width: 18px; gap: 5px; }
body#panel-root.panel-workspace .panel-menu-bars span { height: 2px; background: currentColor !important; }
body#panel-root.panel-workspace.panel-menu-open .panel-menu-bars span:first-child { transform: translateY(7px) rotate(45deg); }
body#panel-root.panel-workspace.panel-menu-open .panel-menu-bars span:last-child { transform: translateY(-7px) rotate(-45deg); }

body#panel-root.panel-workspace #panel-mobile-menu {
    position: fixed;
    inset-block: 0;
    inset-inline-start: 0;
    inset-inline-end: auto;
    z-index: 1060;
    display: none !important;
    width: min(88vw, 340px);
    height: 100vh;
    height: 100dvh;
    padding: calc(20px + env(safe-area-inset-top, 0px)) 12px calc(24px + env(safe-area-inset-bottom, 0px));
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--workspace-ink) !important;
    border: 0 !important;
    border-inline-end: 1px solid var(--workspace-border) !important;
    transform: none !important;
    transition: none;
    overflow-y: auto;
    overscroll-behavior: contain;
}

body#panel-root.panel-workspace.panel-menu-open #panel-mobile-menu,
body#panel-root.panel-workspace #panel-mobile-menu.is-open { display: block !important; }

body#panel-root.panel-workspace .panel-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1055;
    display: none !important;
    background: #0f172a99 !important;
}

body#panel-root.panel-workspace.panel-menu-open .panel-menu-backdrop,
body#panel-root.panel-workspace:has(#panel-mobile-menu.is-open) .panel-menu-backdrop { display: block !important; }

body#panel-root.panel-workspace .panel-mobile-menu-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 4px 18px;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--workspace-border) !important;
}

body#panel-root.panel-workspace .sidebar-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
body#panel-root.panel-workspace .sidebar-brand-text { min-width: 0; }
body#panel-root.panel-workspace .sidebar-brand-logo {
    width: 44px;
    height: 44px;
    object-fit: contain;
    flex: 0 0 44px;
    background: rgba(30, 41, 59, 0.7) !important;
    border: 1px solid var(--workspace-border) !important;
    border-radius: 12px;
}

body#panel-root.panel-workspace .panel-mobile-menu-brand { font-size: 18px; line-height: 1.4; overflow-wrap: anywhere; }
body#panel-root.panel-workspace .panel-mobile-menu-close { flex: 0 0 44px; width: 44px; height: 44px; }
body#panel-root.panel-workspace #panel-mobile-menu .panel-nav-label {
    padding: 18px 12px 7px;
    color: var(--workspace-muted) !important;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0;
    opacity: 1;
}

body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    padding: 10px 12px;
    margin-bottom: 4px;
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--workspace-ink) !important;
    border: 1px solid transparent !important;
    border-radius: 12px !important;
    text-align: start;
    white-space: normal;
    line-height: 1.5;
}

body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item i {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    font-size: 17px;
    background: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
}

body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item span { min-width: 0; overflow-wrap: anywhere; }
body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item:hover { background: var(--workspace-bg) !important; border-color: var(--workspace-border) !important; }
body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item:is(.active, .is-active, [aria-current="page"]) {
    background: var(--workspace-soft) !important;
    color: var(--workspace-primary) !important;
    border-color: var(--workspace-primary) !important;
    box-shadow: none !important;
    font-weight: 800;
}

body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item.is-logout { color: var(--workspace-danger) !important; }
body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item.is-logout:hover { background: var(--workspace-danger-bg) !important; border-color: var(--workspace-danger) !important; }
body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-item.is-wa { color: var(--workspace-success) !important; }

body#panel-root.panel-workspace .panel-offline-banner {
    position: relative;
    flex: 0 0 auto;
    min-height: 44px;
    max-height: 25dvh;
    overflow-y: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: var(--workspace-danger-bg) !important;
    color: var(--workspace-danger) !important;
    border: 1px solid var(--workspace-danger) !important;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.6;
}

body#panel-root.panel-workspace > .panel-offline-banner {
    width: calc(100% - var(--workspace-nav-width));
    z-index: 45;
    flex-shrink: 0;
}

body#panel-root.panel-workspace .panel-offline-banner i { color: inherit; }

body#panel-root:is(.panel-workspace, .login-page) .store-ticker {
    background: var(--workspace-soft) !important;
    color: var(--workspace-primary) !important;
    border-bottom: 1px solid var(--workspace-border) !important;
    height: var(--store-ticker-h) !important;
    padding: 0 !important;
    line-height: var(--store-ticker-h);
    font-size: 15px;
}

body#panel-root.panel-workspace .store-ticker {
    position: relative !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    z-index: 2000 !important;
    isolation: isolate;
    background: linear-gradient(90deg, rgba(30, 41, 59, 0.7) 0%, #1e293b 48%, #0f172a 100%) !important;
    display: none !important;
    flex-shrink: 0;
}

/* Show exactly one ticker bar, matching store-ticker.css breakpoints (desk >=992, mob <=991.98).
   The base rule above hides both with !important, so the display override must live here. */
@media (min-width: 992px) {
    body#panel-root.panel-workspace.has-desk-ticker .store-ticker-desk { display: block !important; }
}
@media (max-width: 991.98px) {
    body#panel-root.panel-workspace.has-mob-ticker .store-ticker-mob { display: block !important; }
}

body#panel-root.panel-workspace :is(.inner-header, .chat-header-fixed) {
    min-height: 68px;
    padding: 12px var(--workspace-gap) !important;
    margin: 0 !important;
    gap: 12px;
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--workspace-ink) !important;
    border-bottom: 1px solid var(--workspace-border) !important;
    box-shadow: none !important;
    z-index: 20;
}

body#panel-root.panel-workspace .inner-header { position: sticky !important; top: 0 !important; }
body#panel-root.panel-workspace :is(.inner-title, .svc-search-back h4, #form-svc-title, #chat-subject) {
    min-width: 0;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere;
    font-size: 19px;
    line-height: 1.5;
    color: var(--workspace-ink) !important;
}

body#panel-root.panel-workspace :is(.inner-header, .chat-header-fixed) > i,
body#panel-root.panel-workspace :is(.panel-back-btn, .file-upload-label, .topup-copy-btn, #remove-attach, .fav-star-form) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-width: 44px;
    min-height: 44px;
    border-radius: 12px;
    color: var(--workspace-primary) !important;
    background: var(--workspace-soft) !important;
    cursor: pointer;
}

body#panel-root.panel-workspace #view-home { padding: var(--workspace-gap) !important; }
body#panel-root.panel-workspace #view-home :is(.home-content-wrapper, .quick-access-container) { padding: 0 !important; margin-bottom: 24px; }
body#panel-root.panel-workspace #view-home :is(.mkh-bg, .mkh-dock, .mkh-brand, .mkh-bell, .mkh-wallet-pill, .mkh-promo-row, .mkh-footer-tag, .search-container, .mkh-all-btn) { display: none !important; }

body#panel-root.panel-workspace .mkh-hero {
    padding: 24px;
    margin: 0 0 20px;
    background: rgba(30, 41, 59, 0.7);
    border: 1px solid var(--workspace-border);
    border-radius: 16px;
}

body#panel-root.panel-workspace .mkh-hero-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
body#panel-root.panel-workspace .mkh-user { display: flex; align-items: center; gap: 14px; min-width: 0; flex: 1 1 260px; }
body#panel-root.panel-workspace :is(.mkh-user-copy, .mkh-kpi-body, .mkh-sec-copy) { min-width: 0; }
body#panel-root.panel-workspace .mkh-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: var(--workspace-soft) !important;
    color: var(--workspace-primary) !important;
    font-size: 24px;
    font-weight: 800;
}

body#panel-root.panel-workspace :is(.mkh-hi, .mkh-hi h1) {
    margin: 0;
    font-size: clamp(22px, 2.2vw, 30px);
    font-weight: 800;
    color: var(--workspace-ink);
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
}

body#panel-root.panel-workspace :is(.mkh-welcome-ar, .mkh-sec-sub, .mk-cat-sub, .mkh-kpi-lbl) {
    margin: 4px 0 0;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.7;
    color: var(--workspace-muted);
    white-space: normal;
    overflow-wrap: anywhere;
}

body#panel-root.panel-workspace .mkh-tier {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    padding: 6px 12px;
    border: 1px solid var(--workspace-border);
    border-radius: 12px;
    background: var(--workspace-soft);
    color: var(--workspace-primary);
    font-size: 15px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

body#panel-root.panel-workspace .mkh-dot { width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; background: currentColor; }
body#panel-root.panel-workspace .mkh-kpi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0 0 28px; }
body#panel-root.panel-workspace .mkh-kpi-card { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; min-width: 0; padding: 18px; background: rgba(30, 41, 59, 0.7); border: 1px solid var(--workspace-border); border-radius: 16px; }
body#panel-root.panel-workspace .mkh-kpi-body { flex: 1 1 100px; }
body#panel-root.panel-workspace .mkh-kpi-val { font-size: 26px; font-weight: 800; line-height: 1.4; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
body#panel-root.panel-workspace .mkh-kpi-ico { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; color: var(--workspace-primary); background: var(--workspace-soft); font-size: 19px; }
body#panel-root.panel-workspace .mkh-kpi-ico.is-green { color: var(--workspace-success); background: var(--workspace-success-bg); }
body#panel-root.panel-workspace .mkh-kpi-grow { display: inline-flex; align-items: center; gap: 5px; padding: 4px 8px; border-radius: 12px; font-size: 15px; background: var(--workspace-bg); color: var(--workspace-muted); }
body#panel-root.panel-workspace .mkh-kpi-grow.is-up { color: var(--workspace-success); background: var(--workspace-success-bg); }
body#panel-root.panel-workspace .mkh-kpi-grow.is-down { color: var(--workspace-danger); background: var(--workspace-danger-bg); }

body#panel-root.panel-workspace :is(.panel-section-head-root, .svc-cat-toolbar, .svc-search-toolbar, #cat-header) {
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 16px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

body#panel-root.panel-workspace .mkh-sec-copy { display: flex; flex-direction: column; flex: 1 1 220px; }
body#panel-root.panel-workspace .mkh-sec-title { font-size: 22px; font-weight: 800; color: var(--workspace-ink); }
body#panel-root.panel-workspace .mkh-sec-side { display: flex; align-items: center; gap: 8px; }
body#panel-root.panel-workspace .svc-card-switch { display: inline-flex; gap: 4px; padding: 4px; background: rgba(30, 41, 59, 0.7) !important; border: 1px solid var(--workspace-border) !important; border-radius: 16px; }
body#panel-root.panel-workspace .svc-card-switch-btn { width: 44px; height: 44px; padding: 8px; color: var(--workspace-muted) !important; background: rgba(30, 41, 59, 0.7); }
body#panel-root.panel-workspace .svc-card-switch-btn:hover { color: var(--workspace-primary) !important; background: var(--workspace-soft) !important; }
body#panel-root.panel-workspace .svc-card-switch-btn[aria-pressed="true"] { background: var(--workspace-primary) !important; color: #000000 !important; box-shadow: none !important; }

body#panel-root.panel-workspace :is(#view-home, #view-services) :is(.cat-card, .app-card, .svc-mini-card, .svc-card-style, .qa-card) {
    min-width: 0 !important;
    height: auto !important;
    background: rgba(30, 41, 59, 0.7) !important;
    border: 1px solid var(--workspace-border) !important;
    border-radius: 16px !important;
    color: var(--workspace-ink) !important;
    box-shadow: none !important;
    transform: none !important;
    transition: border-color .15s ease, background-color .15s ease !important;
    overflow: visible !important;
}

body#panel-root.panel-workspace :is(#view-home, #view-services) :is(.cat-card, .app-card, .svc-mini-card, .qa-card):hover { border-color: var(--workspace-primary) !important; }
body#panel-root.panel-workspace :is(#view-home, #view-services) .cat-card::before { display: none !important; }
body#panel-root.panel-workspace :is(.cat-icon-wrap, .svc-icon-box, .app-card-icon-box, .qa-icon, .icon-letter) {
    background: var(--workspace-soft) !important;
    color: var(--workspace-primary) !important;
    border: 1px solid var(--workspace-border) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

body#panel-root.panel-workspace #view-home .cat-grid .cat-icon-wrap { background: var(--workspace-soft) !important; box-shadow: none !important; }
body#panel-root.panel-workspace :is(.cat-fa, .svc-fa) { color: var(--workspace-primary) !important; -webkit-text-fill-color: currentColor !important; background: none !important; }
body#panel-root.panel-workspace :is(.cat-img, .svc-img, .app-card-icon-box img, .qa-icon img) { object-fit: contain; max-width: 100%; mix-blend-mode: normal; }

body#panel-root.panel-workspace :is(#view-home, #view-services) :is(.cat-name, .card-title, .svc-name, .qa-name, .mk-cat-sub) {
    display: block !important;
    min-width: 0 !important;
    max-width: 100%;
    height: auto !important;
    max-height: none !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    -webkit-box-orient: initial !important;
    overflow-wrap: anywhere;
    word-break: normal !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    -webkit-text-fill-color: currentColor !important;
}

body#panel-root.panel-workspace :is(#view-home, #view-services) :is(.cat-name, .card-title, .svc-name, .qa-name) { color: var(--workspace-ink) !important; font-weight: 700 !important; }
body#panel-root.panel-workspace :is(#view-home, #view-services) .mk-cat-sub { color: var(--workspace-muted) !important; }
body#panel-root.panel-workspace :is(.svc-card-head, .svc-info-cols, .svc-card-foot) { min-width: 0; }
body#panel-root.panel-workspace :is(.svc-card-meta, .svc-card-sub, .svc-info-cols > div:not(.card-title)) { font-size: 15px !important; color: var(--workspace-muted) !important; }
body#panel-root.panel-workspace :is(.svc-price, .card-price, .qa-price) { color: var(--workspace-primary) !important; font-size: 17px !important; line-height: 1.6; overflow-wrap: anywhere; }
body#panel-root.panel-workspace :is(.svc-price, .card-price) small { color: var(--workspace-muted) !important; font-size: 15px; }
body#panel-root.panel-workspace .svc-card-head { padding-inline-end: 42px; }
body#panel-root.panel-workspace .svc-card-top { padding-left: 0; padding-inline-end: 42px; }
body#panel-root.panel-workspace .svc-card-foot { margin-top: auto !important; }
body#panel-root.panel-workspace .fav-star {
    position: absolute;
    inset: 8px auto auto 8px !important;
    inset-inline-start: auto !important;
    inset-inline-end: 8px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    font-size: 18px !important;
    color: var(--workspace-muted) !important;
    background: rgba(30, 41, 59, 0.7);
    transform: none !important;
}

body#panel-root.panel-workspace :is(.fav-star, .fav-star-form):is(.active, .is-current) { color: var(--workspace-warning) !important; background: var(--workspace-warning-bg) !important; }
body#panel-root.panel-workspace .svc-order-btn { min-height: 44px !important; font-size: 15px !important; white-space: normal; }
body#panel-root.panel-workspace .svc-order-btn span { display: inline !important; }

body#panel-root.panel-workspace :is(.cat-grid, #cat-grid-content, #subcats-container) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; }
body#panel-root.panel-workspace :is(.svc-grid, #cat-svc-list, #services-list, #services-list-container) { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; padding: 20px var(--workspace-gap) !important; align-items: stretch; }
body#panel-root.panel-workspace #view-home :is(.svc-grid, #services-list) { padding: 0 !important; }

html[data-svc-card="row"] body#panel-root.panel-workspace :is(.cat-grid, #cat-grid-content, #subcats-container, .svc-grid, #cat-svc-list, #services-list, #services-list-container) { grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; }
html[data-svc-card="row"] body#panel-root.panel-workspace :is(.cat-card, .cat-grid .app-card) { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 14px !important; padding: 16px !important; }
html[data-svc-card="row"] body#panel-root.panel-workspace .mk-cat-sub { flex: 0 1 35%; margin: 0; }
html[data-svc-card="row"] body#panel-root.panel-workspace :is(.svc-mini-card, .svc-card-style) { display: grid !important; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center !important; gap: 12px !important; }
html[data-svc-card="row"] body#panel-root.panel-workspace .fav-star { position: static; grid-column: 1; grid-row: 1 / 3; }
html[data-svc-card="row"] body#panel-root.panel-workspace .svc-card-head { grid-column: 2; padding: 0; }
html[data-svc-card="row"] body#panel-root.panel-workspace .svc-card-foot { grid-column: 3; grid-row: 1 / 3; min-width: 112px; }
html[data-svc-card="row"] body#panel-root.panel-workspace .svc-order-btn { width: auto !important; min-width: 100px; padding: 8px 12px !important; }

html[data-svc-card="tile"] body#panel-root.panel-workspace :is(.cat-grid, #cat-grid-content, #subcats-container, .svc-grid, #cat-svc-list, #services-list, #services-list-container) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
html[data-svc-card="tile"] body#panel-root.panel-workspace .svc-card-head { padding-inline: 0; padding-top: 36px; }
html[data-svc-card="tile"] body#panel-root.panel-workspace :is(.svc-name, .card-title) { text-align: center !important; }
html[data-svc-card="tile"] body#panel-root.panel-workspace .svc-card-meta { font-size: 15px !important; }

body#panel-root.panel-workspace .qa-scroll { display: flex; align-items: stretch; gap: 12px; overflow-x: auto; padding: 4px 0 12px; scrollbar-width: thin; }
body#panel-root.panel-workspace .qa-card { flex: 0 0 190px; width: 190px; padding: 16px; }
body#panel-root.panel-workspace .qa-title { font-size: 18px; font-weight: 800; margin-bottom: 8px; }
body#panel-root.panel-workspace .qa-icon { width: 44px; height: 44px; margin-bottom: 10px; }

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.modern-inp, .log-inp, .inp, .form-control, .form-select, .pin-field, textarea, select, input[type="text"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="search"], input[type="time"]) {
    min-width: 0;
    min-height: 48px;
    max-width: 100%;
    padding: 12px 14px;
    background: var(--workspace-input-bg) !important;
    background-color: var(--workspace-input-bg) !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 1px solid var(--workspace-input-line) !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    line-height: 1.6;
    box-shadow: none !important;
    caret-color: var(--workspace-primary);
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(input, textarea)::placeholder { color: #94a3b8 !important; opacity: 1; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.modern-inp, .log-inp, .inp, .form-control, .form-select, textarea, select):focus { border-color: var(--workspace-primary) !important; box-shadow: 0 0 0 3px rgba(0, 242, 254, 0.18) !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(input, textarea):autofill { background-color: var(--workspace-input-bg) !important; color: #ffffff !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) input:-webkit-autofill { -webkit-text-fill-color: #ffffff !important; -webkit-box-shadow: 0 0 0 1000px var(--workspace-input-bg) inset !important; caret-color: var(--workspace-primary); }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) select option { background: var(--workspace-input-bg) !important; color: #ffffff !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(label, .form-label) { color: var(--workspace-ink) !important; font-size: 15px; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.form-text, small, .small) { font-size: 15px; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--workspace-primary); cursor: pointer; }
body#panel-root.panel-workspace .form-check { min-height: 44px; display: flex; align-items: center; }
body#panel-root.panel-workspace .form-check-input { min-width: 24px; min-height: 24px; margin-block: 0; }
body#panel-root.panel-workspace .form-switch .form-check-input { width: 44px; }
body#panel-root.panel-workspace textarea { resize: vertical; }

body#panel-root.panel-workspace :is(.top-navbar-search, .main-search-bar) {
    min-width: 0;
    min-height: 48px;
    max-width: 640px;
    padding: 0 8px !important;
    background: var(--workspace-input-bg) !important;
    border: 1px solid var(--workspace-input-line) !important;
    border-radius: 12px !important;
    color: var(--workspace-muted) !important;
}

body#panel-root.panel-workspace .top-navbar-search { flex: 1 1 auto; width: 100%; margin: 0; }
body#panel-root.panel-workspace :is(.top-navbar-search, .main-search-bar) .search-ico { width: 32px; height: 32px; background: transparent !important; color: var(--workspace-primary) !important; box-shadow: none !important; }
body#panel-root.panel-workspace :is(.top-navbar-search, .main-search-bar) input[type="text"] {
    width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
    min-height: 44px !important;
    padding: 0 4px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--workspace-ink) !important;
    box-shadow: none !important;
    line-height: 1.6 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
}

body#panel-root.panel-workspace :is(.top-navbar-search, .main-search-bar):focus-within { border-color: var(--workspace-primary) !important; outline: 2px solid var(--workspace-primary); outline-offset: 2px; box-shadow: none !important; }
body#panel-root.panel-workspace :is(.top-navbar-search, .main-search-bar) input:focus-visible { outline: none !important; }
body#panel-root.panel-workspace .qty-wrapper { border-radius: 12px; overflow: hidden; }
body#panel-root.panel-workspace .qty-wrapper .qty-input { min-width: 0; width: 0; flex: 1; border: 0 !important; border-radius: 0 !important; }

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.main-btn, .primary-btn, .btn-primary, .log-btn, .pwa-btn, .chat-send-btn, .svc-order-btn, .panel-header-cta, #btn-form-submit) {
    background: var(--workspace-accent-grad) !important;
    background-image: var(--workspace-accent-grad) !important;
    color: var(--workspace-on-accent) !important;
    border: 1px solid transparent !important;
    font-weight: 800 !important;
    box-shadow: 0 0 15px rgba(0, 242, 254, 0.35), 0 8px 18px -10px rgba(0, 0, 0, 0.6) !important;
    filter: none !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.main-btn, .primary-btn, .btn-primary, .log-btn, .pwa-btn, .chat-send-btn, .svc-order-btn, .panel-header-cta, #btn-form-submit):hover {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
    background-image: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
    color: var(--workspace-on-accent) !important;
    border-color: transparent !important;
    filter: none !important;
}

body#panel-root.panel-workspace :is(.btn-light, .btn-secondary, .btn-outline-primary, .btn-outline-secondary, .load-more-btn, .response-copy-btn, .topup-code-btn, .topup-copy-btn, .topup-ghost-btn, .topup-quick-btn, .qty-btn, .smm-qty-chip, #svc-desc-btn) {
    background: rgba(30, 41, 59, 0.7) !important;
    border: 1px solid var(--workspace-border) !important;
    color: var(--workspace-primary) !important;
    min-height: 44px;
}

body#panel-root.panel-workspace :is(.btn-light, .btn-secondary, .btn-outline-primary, .btn-outline-secondary, .load-more-btn, .response-copy-btn, .topup-code-btn, .topup-copy-btn, .topup-ghost-btn, .topup-quick-btn, .qty-btn, .smm-qty-chip, #svc-desc-btn):hover {
    background: var(--workspace-soft) !important;
    border-color: var(--workspace-primary) !important;
    color: var(--workspace-hover) !important;
}

body#panel-root.panel-workspace :is(.topup-quick-btn.active, .smm-qty-chip.is-active) { background: var(--workspace-primary) !important; color: #000000 !important; border-color: var(--workspace-primary) !important; }
body#panel-root.panel-workspace .btn-dark { background: #1e293b !important; color: #ffffff !important; border: 1px solid var(--workspace-border) !important; }
body#panel-root.panel-workspace .btn-success { background: var(--workspace-success) !important; color: var(--workspace-on-accent) !important; border: 1px solid var(--workspace-success) !important; font-weight: 800 !important; }
body#panel-root.panel-workspace .btn-warning { background: var(--workspace-warning) !important; color: var(--workspace-on-accent) !important; border: 1px solid var(--workspace-warning) !important; font-weight: 800 !important; }
body#panel-root.panel-workspace .btn-danger { background: var(--workspace-danger) !important; color: var(--workspace-on-accent) !important; border: 1px solid var(--workspace-danger) !important; font-weight: 800 !important; }
body#panel-root.panel-workspace .btn-outline-danger { background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-danger) !important; border: 1px solid var(--workspace-danger) !important; }
body#panel-root.panel-workspace .btn-outline-danger:hover { background: var(--workspace-danger) !important; color: var(--workspace-on-accent) !important; }
body#panel-root.panel-workspace :is(.btn-success, .btn-warning, .btn-danger, .btn-dark):hover { outline: 2px solid currentColor; outline-offset: 2px; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(button, .btn, #btn-form-submit):disabled {
    background: var(--workspace-bg) !important;
    color: var(--workspace-muted) !important;
    border-color: var(--workspace-border) !important;
    opacity: 1;
    cursor: not-allowed;
}

body#panel-root.panel-workspace :is(.card, .order-card, .ticket-card, .notif-item, .membership-card, .membership-current, .clean-list-box, .list-item, .response-box-styled, .panel-sheet-form, .topup-wallet, .topup-panel, .topup-card, .topup-pay-card, .topup-verify-card, .topup-pay-amount-box, .topup-copy-box, .topup-qr-box, .form-price-box) {
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--workspace-ink) !important;
    border: 1px solid var(--workspace-border) !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    transform: none !important;
}

body#panel-root.panel-workspace :is(.card-header, .card-footer, .card-body, .order-header, .order-body, .panel-sheet-body, .panel-sheet-foot, .membership-card-body) { background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-ink) !important; border-color: var(--workspace-border) !important; }
body#panel-root.panel-workspace :is(.order-header, .order-body) { padding: 16px; }
body#panel-root.panel-workspace :is(.order-body, .response-text, .clean-list-box, .list-item, .notif-content) { font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; }
body#panel-root.panel-workspace .list-item { gap: 12px; padding: 12px; flex-wrap: wrap; }
body#panel-root.panel-workspace .order-card::before { width: 4px; }
body#panel-root.panel-workspace .order-card.st-success::before { background: var(--workspace-success) !important; }
body#panel-root.panel-workspace .order-card:is(.st-warn, .st-warning)::before { background: var(--workspace-warning) !important; }
body#panel-root.panel-workspace .order-card.st-danger::before { background: var(--workspace-danger) !important; }
body#panel-root.panel-workspace :is(.notif-item.is-unread, .ticket-card.is-unread, .membership-card.is-current) { background: var(--workspace-soft) !important; border-color: var(--workspace-primary) !important; }
body#panel-root.panel-workspace :is(.membership-flag, .membership-card.is-current .membership-flag) { color: var(--workspace-primary); background: var(--workspace-soft); border-color: var(--workspace-border); font-size: 15px; }
body#panel-root.panel-workspace :is(.empty-state, .empty-view-box, .membership-empty, #history-container > .text-center, #financials-container > div:only-child:not([style*="display:flex"])) { padding: 28px 20px; color: var(--workspace-muted); font-size: 15px; line-height: 1.8; }

body#panel-root.panel-workspace :is(#history-container, #financials-container, #tickets-container, .panel-notif-list, .membership-page) { max-width: 1200px; margin-inline: auto; padding: 20px var(--workspace-gap) !important; }
body#panel-root.panel-workspace #financials-container > div[style*="display:flex"] { background: rgba(15, 23, 42, 0.45) !important; border-radius: 16px; gap: 12px; flex-wrap: wrap; }
body#panel-root.panel-workspace #financials-container > div > div { min-width: 0; overflow-wrap: anywhere; }
body#panel-root.panel-workspace #financials-container [style*="font-size"] { font-size: 15px !important; }
body#panel-root.panel-workspace #financials-container [style*="var(--success)"] { color: var(--workspace-success) !important; }
body#panel-root.panel-workspace #financials-container [style*="var(--danger)"] { color: var(--workspace-danger) !important; }
body#panel-root.panel-workspace #financials-container > div[style*="var(--success)"] { border-inline-start-color: var(--workspace-success) !important; color: var(--workspace-ink) !important; }
body#panel-root.panel-workspace #financials-container > div[style*="var(--danger)"] { border-inline-start-color: var(--workspace-danger) !important; color: var(--workspace-ink) !important; }

body#panel-root.panel-workspace #view-history .status-filters-container { justify-content: flex-start; gap: 8px; padding: 16px var(--workspace-gap); }
body#panel-root.panel-workspace #view-history .st-filter-btn[data-filter] { --filter-color: var(--workspace-primary); flex: 0 1 auto; min-width: 96px; min-height: 44px; padding: 8px 16px; white-space: normal; background: rgba(30, 41, 59, 0.7) !important; color: var(--filter-color) !important; border: 1px solid var(--filter-color) !important; box-shadow: none !important; }
body#panel-root.panel-workspace #view-history .st-filter-btn[data-filter="st-success"] { --filter-color: var(--workspace-success); }
body#panel-root.panel-workspace #view-history .st-filter-btn[data-filter="st-warning"] { --filter-color: var(--workspace-warning); }
body#panel-root.panel-workspace #view-history .st-filter-btn[data-filter="st-danger"] { --filter-color: var(--workspace-danger); }
body#panel-root.panel-workspace #view-history .st-filter-btn[data-filter]:is(.active, [aria-pressed="true"]) { background: var(--filter-color) !important; color: #ffffff !important; }
body#panel-root.panel-workspace #view-history .st-filter-btn[data-filter]:hover { outline: 2px solid var(--filter-color); outline-offset: 2px; }

body#panel-root.panel-workspace #view-profile .panel-sheet-form {
    width: calc(100% - 2 * var(--workspace-gap));
    max-width: 800px;
    margin: 20px auto;
    padding: 20px;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

body#panel-root.panel-workspace #view-profile :is(.panel-sheet-body, .tab-content, .tab-pane) { height: auto !important; max-height: none !important; overflow: visible !important; min-width: 0; }
body#panel-root.panel-workspace #view-profile .panel-sheet-body { padding: 0; border: 0; }
body#panel-root.panel-workspace #view-profile .panel-sheet-foot { padding: 20px 0 0; }
body#panel-root.panel-workspace #view-profile .tab-pane.active { display: block !important; opacity: 1 !important; transform: none; animation: none; }
body#panel-root.panel-workspace #view-profile .d-flex { gap: 12px; min-width: 0; flex-wrap: wrap; }
body#panel-root.panel-workspace #view-profile .d-flex > :is(div, span, input) { min-width: 0; overflow-wrap: anywhere; }
body#panel-root.panel-workspace #view-profile .d-flex > input { flex: 1 1 160px; }
body#panel-root.panel-workspace #view-profile :is(p, h6, [style*="font-size:0."]) { font-size: 15px !important; }
body#panel-root.panel-workspace #tab-api > div:has(#api-key-display) { padding-inline-end: 64px !important; }
body#panel-root.panel-workspace #tab-api [onclick^="copyText"] { width: 44px !important; height: 44px !important; }

body#panel-root.panel-workspace :is(.nav-tabs, .nav-pills) .nav-link { min-height: 44px; padding: 10px 16px; font-size: 15px; color: var(--workspace-muted) !important; border-radius: 12px !important; }
body#panel-root.panel-workspace :is(.nav-tabs, .nav-pills) .nav-link.active { background: var(--workspace-soft) !important; color: var(--workspace-primary) !important; border: 1px solid var(--workspace-primary) !important; }
body#panel-root.panel-workspace .dropdown-item { min-height: 44px; padding: 10px 16px; }
body#panel-root.panel-workspace .dropdown-item:is(.active, :active) { background: var(--workspace-primary) !important; color: #000000 !important; }

body#panel-root.panel-workspace .topup-shell { width: 100%; max-width: 720px; padding: 20px var(--workspace-gap) 24px; }
body#panel-root.panel-workspace .topup-steps { position: static; padding: 12px; background: rgba(30, 41, 59, 0.7) !important; border-radius: 16px; }
body#panel-root.panel-workspace .topup-step-lbl { font-size: 15px; text-align: center; }
body#panel-root.panel-workspace .topup-step-num { width: 32px; height: 32px; font-size: 15px; }
body#panel-root.panel-workspace .topup-step:is(.active, .is-active) .topup-step-num { background: var(--workspace-primary) !important; color: #000000 !important; }
body#panel-root.panel-workspace .topup-step.done .topup-step-num { background: var(--workspace-success) !important; color: #ffffff !important; }
body#panel-root.panel-workspace :is(.topup-label, .topup-methods-hint, .topup-limits-hint, .topup-wallet-kicker, .topup-code-head span, .topup-pay-amount-box .lbl, .pm-curr, .pm-badge) { font-size: 15px; }
body#panel-root.panel-workspace .topup-methods-head { flex-wrap: wrap; }
body#panel-root.panel-workspace .topup-amount-wrap .modern-inp { height: 72px; font-size: 28px !important; padding-inline: 64px !important; background: rgba(30, 41, 59, 0.7) !important; }
body#panel-root.panel-workspace .topup-amount-prefix { max-width: 56px; font-size: 15px !important; }
body#panel-root.panel-workspace .topup-footer { position: static; padding: 16px 0; background: rgba(30, 41, 59, 0.7) !important; }
body#panel-root.panel-workspace #view-topup-pay #topup-verify-cta { position: static; }
body#panel-root.panel-workspace .topup-cta:not(#paypal-checkout-link) { background: var(--workspace-primary) !important; color: #000000 !important; box-shadow: none !important; }
body#panel-root.panel-workspace .topup-cta:not(#paypal-checkout-link):hover { background: var(--workspace-hover) !important; }
body#panel-root.panel-workspace #paypal-checkout-link { background: #0070ba !important; color: #ffffff !important; box-shadow: none !important; }
body#panel-root.panel-workspace #paypal-checkout-link:hover { background: #005a96 !important; }
body#panel-root.panel-workspace :is(.topup-cta, #paypal-checkout-link):disabled { background: var(--workspace-bg) !important; color: var(--workspace-muted) !important; border-color: var(--workspace-border) !important; }
body#panel-root.panel-workspace :is(.tg-btn, #tg-btn-link) { background: #087eae !important; color: #ffffff !important; border: 1px solid #087eae !important; }
body#panel-root.panel-workspace .pm-item.active { background: var(--workspace-soft) !important; border-color: var(--workspace-primary) !important; }
body#panel-root.panel-workspace .pm-item.active .pm-check { background: var(--workspace-primary) !important; color: #000000 !important; }
body#panel-root.panel-workspace .pm-item .pm-name { white-space: normal; overflow: visible; overflow-wrap: anywhere; font-size: 15px; }
body#panel-root.panel-workspace .topup-verify-shell { min-height: 0; height: auto; }
body#panel-root.panel-workspace .topup-verify-card { min-height: 0; padding: 24px 16px; flex: 0 0 auto; }
body#panel-root.panel-workspace :is(.topup-verify-card p, .topup-note, .topup-ghost-btn) { font-size: 15px; }
body#panel-root.panel-workspace :is(.topup-sum-row, .topup-sum-pay, .form-price-total, .form-price-unit) { gap: 12px; flex-wrap: wrap; }
body#panel-root.panel-workspace :is(.topup-sum-fee, .topup-sum-fee b) { color: var(--workspace-warning) !important; }
body#panel-root.panel-workspace #view-topup-verify .timer-text { font-size: 32px; }
body#panel-root.panel-workspace .centered-view-content { width: 100%; max-width: 640px; height: auto; min-height: 0; margin: 0 auto; padding: 24px var(--workspace-gap); }

body#panel-root.panel-workspace #view-chat.active { display: flex !important; flex-direction: column; padding: 0 !important; overflow: hidden !important; }
body#panel-root.panel-workspace .chat-header-fixed { flex: 0 0 auto; }
body#panel-root.panel-workspace .chat-messages-area { flex: 1 1 0; min-height: 0; padding: 20px var(--workspace-gap); overflow-y: auto; background: var(--workspace-bg) !important; }
body#panel-root.panel-workspace .chat-msg { max-width: min(85%, 640px); border-radius: 16px; padding: 12px 16px; font-size: 15px; line-height: 1.7; }
body#panel-root.panel-workspace .chat-msg.msg-me { background: var(--workspace-primary) !important; color: #000000 !important; }
body#panel-root.panel-workspace .chat-msg.msg-admin { background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-ink) !important; }
body#panel-root.panel-workspace .chat-msg.msg-system { background: var(--workspace-warning-bg) !important; color: var(--workspace-warning) !important; }
body#panel-root.panel-workspace .chat-msg.msg-me :is(a, small, .msg-time) { color: #ffffff !important; opacity: 1; }
body#panel-root.panel-workspace .chat-msg:is(.msg-admin, .msg-system) .msg-time { color: var(--workspace-muted) !important; opacity: 1; }
body#panel-root.panel-workspace :is(#chat-footer, #chat-closed-banner) { position: relative; flex: 0 0 auto; padding: 12px var(--workspace-gap) calc(12px + env(safe-area-inset-bottom, 0px)) !important; gap: 8px; background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-muted) !important; }
body#panel-root.panel-workspace #chat-footer .chat-input { min-width: 0; width: 0; flex: 1 1 auto; margin: 0; border-radius: 12px !important; }
body#panel-root.panel-workspace .chat-send-btn { width: 48px; height: 48px; flex: 0 0 48px; }
body#panel-root.panel-workspace #attachment-preview { max-width: 100%; background: rgba(30, 41, 59, 0.7) !important; }

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.text-muted, .text-secondary, .form-text) { color: var(--workspace-muted) !important; }
body#panel-root.panel-workspace :is(.text-primary, .text-info) { color: var(--workspace-primary) !important; }
body#panel-root.panel-workspace .text-success { color: var(--workspace-success) !important; }
body#panel-root.panel-workspace .text-warning { color: var(--workspace-warning) !important; }
body#panel-root.panel-workspace .text-danger { color: var(--workspace-danger) !important; }
body#panel-root.panel-workspace :is(.bg-light, .bg-white) { background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-ink) !important; }
body#panel-root.panel-workspace .badge { font-size: 15px; line-height: 1.5; white-space: normal; border-radius: 12px; padding: 4px 10px; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) .alert { font-size: 15px; line-height: 1.7; border-radius: 12px; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.alert-success, .badge.bg-success, .bg-success, .smm-badge-new, .notif-icon.n-success) { background: var(--workspace-success-bg) !important; color: var(--workspace-success) !important; border-color: var(--workspace-success) !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.alert-warning, .badge.bg-warning, .bg-warning, .notif-icon.n-warn, .is-admin-btn) { background: var(--workspace-warning-bg) !important; color: var(--workspace-warning) !important; border-color: var(--workspace-warning) !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.alert-danger, .badge.bg-danger, .bg-danger, .smm-badge-hot, .notif-icon.n-danger) { background: var(--workspace-danger-bg) !important; color: var(--workspace-danger) !important; border-color: var(--workspace-danger) !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.alert-info, .badge.bg-primary, .badge.bg-info, .badge-social, .notif-icon.n-info) { background: var(--workspace-soft) !important; color: var(--workspace-primary) !important; border-color: var(--workspace-primary) !important; }
body#panel-root.panel-workspace #view-history .order-card .badge.bg-success { background: var(--workspace-success-bg) !important; color: var(--workspace-success) !important; }
body#panel-root.panel-workspace #view-history .order-card .badge.bg-warning { background: var(--workspace-warning-bg) !important; color: var(--workspace-warning) !important; }
body#panel-root.panel-workspace #view-history .order-card .badge.bg-danger { background: var(--workspace-danger-bg) !important; color: var(--workspace-danger) !important; }
body#panel-root.panel-workspace .unread-badge { background: var(--workspace-danger) !important; color: #ffffff !important; font-weight: 800 !important; font-size: 15px; }
body#panel-root.panel-workspace :is(.smm-badge, .badge-social) { font-size: 15px; }
body#panel-root.panel-workspace #pay-instructions-box.topup-note-warn { background: var(--workspace-warning-bg) !important; color: var(--workspace-warning) !important; border-color: var(--workspace-warning) !important; }
body#panel-root.panel-workspace #smart-pay-widget.topup-note-ok { background: var(--workspace-success-bg) !important; color: var(--workspace-success) !important; border-color: var(--workspace-success) !important; }
body#panel-root.panel-workspace .panel-wa-banner { background: var(--workspace-success-bg) !important; color: var(--workspace-success) !important; border-color: var(--workspace-success) !important; min-height: 44px; }
body#panel-root.panel-workspace :is(.progress-bar, .smm-progress-bar-fill) { background: var(--workspace-primary) !important; color: #000000 !important; }
body#panel-root.panel-workspace .progress-bar.bg-success { background: var(--workspace-success) !important; color: #000000 !important; font-weight: 800 !important; }
body#panel-root.panel-workspace .table {
    --bs-table-bg: rgba(30, 41, 59, 0.7);
    --bs-table-color: var(--workspace-ink);
    --bs-table-border-color: var(--workspace-border);
    --bs-table-striped-bg: var(--workspace-bg);
    --bs-table-striped-color: var(--workspace-ink);
    --bs-table-hover-bg: var(--workspace-soft);
    --bs-table-hover-color: var(--workspace-ink);
    font-size: 15px;
    line-height: 1.6;
}

body#panel-root.panel-workspace .table > thead th { background: var(--workspace-soft) !important; color: var(--workspace-ink) !important; }
body#panel-root.panel-workspace .table :is(th, td) { padding: 12px 16px; vertical-align: middle; }
body#panel-root.panel-workspace .table-responsive { max-width: 100%; overflow-x: auto; border: 1px solid var(--workspace-border); border-radius: 16px; }

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.modal-content, .custom-alert-box, .pwa-howto-box, #toast, #pwa-install-banner) { background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-ink) !important; border: 1px solid var(--workspace-border) !important; border-radius: 16px !important; box-shadow: none !important; }
body#panel-root.panel-workspace :is(.modal-header, .modal-body, .modal-footer) { background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-ink) !important; border-color: var(--workspace-border) !important; }
body#panel-root.panel-workspace .modal-content { overflow: hidden; }
body#panel-root.panel-workspace .modal-body { overflow-wrap: anywhere; }
body#panel-root.panel-workspace .modal-dialog { max-width: min(640px, calc(100% - 24px)); margin-inline: auto; }
body#panel-root.panel-workspace .modal-dialog-scrollable .modal-body { overflow-y: auto; }
body#panel-root.panel-workspace .btn-close { width: 44px; height: 44px; padding: 8px; opacity: 1; filter: none !important; background-size: 14px; }
body#panel-root.panel-workspace :is(.modal-backdrop, .custom-alert-overlay) { background: #0f172a99 !important; }
body#panel-root.panel-workspace :is(#loader-overlay, #page-load-overlay) { background: rgba(30, 41, 59, 0.7) !important; }
body#panel-root.panel-workspace :is(.spinner, .pl-spinner) { border-color: var(--workspace-border) !important; border-top-color: var(--workspace-primary) !important; }

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) #pwa-install-banner { padding: 48px 16px 16px; width: calc(100% - 32px); max-width: 440px; gap: 12px; flex-wrap: wrap; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) #pwa-install-banner > [onclick="closePWABanner()"] { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; top: 0 !important; left: 4px !important; color: var(--workspace-muted) !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) #pwa-install-banner [style*="font-size"] { font-size: 15px !important; opacity: 1 !important; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) #pwa-howto { background: #0f172a99 !important; overflow-y: auto; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) #pwa-howto .pwa-howto-box { max-height: calc(100dvh - 36px); overflow-y: auto; line-height: 1.8; }
body#panel-root:is(.panel-workspace, .login-page, .profile-completion) .pwa-howto-box button { width: 100%; padding: 10px 16px; background: var(--workspace-primary); color: #000000 !important; border: 0; }

body#panel-root:is(.login-page, .profile-completion) {
    display: block !important;
    position: relative;
    width: 100%;
    height: auto !important;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 40px 24px calc(32px + env(safe-area-inset-bottom, 0px));
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

body#panel-root.login-page .auth-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 480px;
    align-items: start;
    gap: 48px;
    width: 100%;
    max-width: 1100px;
    min-height: 0;
    margin: 24px auto;
}

body#panel-root.login-page .auth-intro { min-width: 0; padding: 24px 0; }
body#panel-root.login-page .auth-brand { display: inline-flex; align-items: center; gap: 12px; min-height: 48px; max-width: 100%; color: var(--workspace-ink); font-size: 24px; font-weight: 800; text-decoration: none; overflow-wrap: anywhere; }
body#panel-root.login-page .auth-brand img { width: 56px; height: 56px; object-fit: contain; border-radius: 12px; background: rgba(30, 41, 59, 0.7); mix-blend-mode: normal; }
body#panel-root.login-page .auth-kicker { display: block; margin: 40px 0 8px; color: var(--workspace-primary) !important; font-size: 15px; font-weight: 700; }
body#panel-root.login-page .auth-intro h2 { margin: 0 0 16px; color: var(--workspace-ink); font-size: clamp(28px, 3vw, 40px); font-weight: 800; line-height: 1.5; }
body#panel-root.login-page .auth-intro p { margin: 0 0 20px; color: var(--workspace-muted); font-size: 17px; line-height: 1.9; }
body#panel-root.login-page .auth-benefits { margin: 24px 0; padding: 0; list-style: none; color: var(--workspace-ink); }
body#panel-root.login-page .auth-benefits li { display: flex; align-items: baseline; gap: 12px; margin-block: 12px; }
body#panel-root.login-page .auth-benefits li > i { flex: 0 0 20px; color: var(--workspace-primary); }
body#panel-root.login-page :is(.auth-back, .switch-link, .out) { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding-block: 8px; color: var(--workspace-primary) !important; font-size: 15px; }
body#panel-root.login-page :is(.auth-back, .switch-link, .out):hover { color: var(--workspace-hover) !important; }
body#panel-root.login-page :is(.login-container, .box) {
    position: relative;
    width: 100%;
    max-width: 480px;
    min-width: 0;
    margin: 0 auto;
    padding: 32px;
    border: 1px solid var(--workspace-border) !important;
    border-radius: 16px !important;
    background: rgba(30, 41, 59, 0.7) !important;
    color: var(--workspace-ink) !important;
    box-shadow: none !important;
    text-align: start;
}

body#panel-root.login-page .auth-form-head { margin-bottom: 24px; }
body#panel-root.login-page :is(.auth-form-head h1, .box h2) { margin: 0 0 8px; font-size: 28px; font-weight: 800; line-height: 1.5; color: var(--workspace-ink); }
body#panel-root.login-page :is(.auth-form-head p, .auth-subtitle, .box p) { margin: 0 0 16px; color: var(--workspace-muted); font-size: 15px; line-height: 1.8; opacity: 1; }
body#panel-root.login-page .auth-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 0 0 24px; padding: 5px; background: var(--workspace-bg); border: 1px solid var(--workspace-border); border-radius: 16px; }
body#panel-root.login-page .auth-tabs a { display: flex; align-items: center; justify-content: center; gap: 8px; min-width: 0; min-height: 48px; padding: 8px; color: var(--workspace-muted); border: 1px solid transparent; border-radius: 12px; font-size: 15px; font-weight: 700; text-decoration: none; text-align: center; }
body#panel-root.login-page .auth-tabs a:hover { color: var(--workspace-primary); background: var(--workspace-soft); }
body#panel-root.login-page .auth-tabs a:is(.active, [aria-current="page"]) { background: var(--workspace-primary); color: #000000 !important; border-color: var(--workspace-primary); }
body#panel-root.login-page .input-box { position: relative; margin-bottom: 18px; }
body#panel-root.login-page .auth-label { display: block; margin: 0 0 7px; color: var(--workspace-ink); font-size: 15px; font-weight: 700; line-height: 1.6; }
body#panel-root.login-page .input-box > :is(input, select) { display: block; width: 100%; height: 52px; min-height: 52px; margin: 0; padding: 12px 46px 12px 14px; background: rgba(30, 41, 59, 0.7) !important; color: var(--workspace-ink) !important; }
body#panel-root.login-page .input-box > input { direction: ltr; text-align: left; }
body#panel-root.login-page .input-box > :is(.log-inp-ar, select) { direction: rtl !important; text-align: right !important; }
body#panel-root.login-page .input-box > select { appearance: auto; }
body#panel-root.login-page .input-box > i { position: absolute; top: auto; bottom: 17px; right: 16px; left: auto; transform: none; color: var(--workspace-muted); font-size: 17px; line-height: 18px; pointer-events: none; }
body#panel-root.login-page .input-box:focus-within > i { color: var(--workspace-primary); }
body#panel-root.login-page .log-btn { width: 100%; min-height: 52px; padding: 12px 16px; margin-top: 8px; border-radius: 12px; }
body#panel-root.login-page label[for^="trust_device"] { display: inline-flex; align-items: center; min-height: 44px; line-height: 1.6; cursor: pointer; }
body#panel-root.login-page .pass-rules { margin: -4px 0 18px !important; padding: 12px 14px; background: var(--workspace-bg); border: 1px solid var(--workspace-border); border-radius: 12px; font-size: 15px !important; color: var(--workspace-muted) !important; line-height: 1.8 !important; text-align: start !important; }
body#panel-root.login-page .pass-rules [data-rule] { color: var(--workspace-muted); }
body#panel-root.login-page :is(.err-msg, .err, #reg-pass-err) { margin-bottom: 18px; padding: 12px 14px; border: 1px solid var(--workspace-danger); border-radius: 12px; background: var(--workspace-danger-bg); color: var(--workspace-danger) !important; font-size: 15px !important; line-height: 1.7; }
body#panel-root.login-page .social-sep { display: flex; align-items: center; gap: 12px; margin: 24px 0 16px; color: var(--workspace-muted); font-size: 15px; }
body#panel-root.login-page .social-sep::before,
body#panel-root.login-page .social-sep::after { content: ""; height: 1px; flex: 1; background: var(--workspace-border); }
body#panel-root.login-page :is(.social-grid, .social-buttons) { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
body#panel-root.login-page .social-btn { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; width: 100%; padding: 10px 14px; direction: ltr; background: rgba(30, 41, 59, 0.7) !important; border: 1px solid var(--workspace-border) !important; color: var(--workspace-ink) !important; text-decoration: none; font-weight: 700; }
body#panel-root.login-page .social-btn:hover { background: var(--workspace-bg) !important; border-color: var(--workspace-primary) !important; }
body#panel-root.login-page .social-btn span { color: var(--workspace-ink) !important; }
body#panel-root.login-page .social-btn[href*="provider=facebook"] i { color: #1877f2; }
body#panel-root.login-page .social-btn[href*="provider=google"] i { color: #4285f4; }
body#panel-root.login-page .social-btn[href*="provider=github"] i,
body#panel-root.login-page .social-btn[href*="provider=apple"] i { color: #ffffff; }
body#panel-root.login-page .tg-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 16px; padding: 12px 16px; border: 1px solid #087eae; background: #087eae; color: #ffffff; }
body#panel-root.login-page .auth-credit { display: block; max-width: 1100px; margin: 24px auto 0; color: var(--workspace-muted) !important; font-size: 15px; text-align: center; direction: ltr; opacity: 1 !important; }
body#panel-root.profile-completion .box { margin: clamp(16px, 8vh, 80px) auto; }
body#panel-root.profile-completion .inp { width: 100%; margin-bottom: 16px; }
body#panel-root.profile-completion .box .btn { width: 100%; min-height: 48px; padding: 12px 16px; background: var(--workspace-primary); color: #000000 !important; border: 1px solid var(--workspace-primary); font-weight: 700; }
body#panel-root.profile-completion .box .btn:hover { background: var(--workspace-hover); }

body#panel-root.panel-workspace :is(.app-view, #panel-mobile-menu, .qa-scroll, .chat-messages-area) { scrollbar-width: thin; scrollbar-color: var(--workspace-muted) var(--workspace-bg); }
body#panel-root.panel-workspace .app-view::-webkit-scrollbar { width: 8px; height: 8px; }
body#panel-root.panel-workspace .app-view::-webkit-scrollbar-track { background: var(--workspace-bg); }
body#panel-root.panel-workspace .app-view::-webkit-scrollbar-thumb { background: var(--workspace-muted); border-radius: 12px; }
body#panel-root.panel-workspace .app-view::-webkit-scrollbar-thumb:hover { background: var(--workspace-primary); }

@media (min-width: 768px) {
    body#panel-root.panel-workspace :is(.cat-grid, #cat-grid-content, #subcats-container) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    body#panel-root.panel-workspace :is(.svc-grid, #cat-svc-list, #services-list, #services-list-container) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    html[data-svc-card="tile"] body#panel-root.panel-workspace :is(.cat-grid, #cat-grid-content, #subcats-container) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    html[data-svc-card="tile"] body#panel-root.panel-workspace :is(.svc-grid, #cat-svc-list, #services-list, #services-list-container) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (min-width: 1100px) {
    body#panel-root.panel-workspace { --workspace-nav-width: 240px; }
    body#panel-root.panel-workspace #panel-mobile-menu { display: block !important; width: 240px; z-index: 50; }
    body#panel-root.panel-workspace #panel-menu-fab,
    body#panel-root.panel-workspace #panel-mobile-menu .panel-mobile-menu-close,
    body#panel-root.panel-workspace.panel-menu-open .panel-menu-backdrop,
    body#panel-root.panel-workspace:has(#panel-mobile-menu.is-open) .panel-menu-backdrop,
    body#panel-root.panel-workspace .panel-menu-backdrop { display: none !important; }
    /* Ticker visibility is governed solely by store-ticker.css (desk >=992, mob <=991.98) so exactly one bar shows at every width. */
    body#panel-root.panel-workspace.has-desk-ticker { --workspace-ticker-height: var(--store-ticker-h); }
}

@media (max-width: 1099.98px) {
    body#panel-root.panel-workspace.has-mob-ticker { --workspace-ticker-height: var(--store-ticker-h); }
    body#panel-root.login-page .auth-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; max-width: 560px; margin-block: 0; }
    body#panel-root.login-page .auth-intro { padding: 0; }
    body#panel-root.login-page .auth-benefits { display: none; }
    body#panel-root.login-page .auth-kicker { margin-top: 20px; }
    body#panel-root.login-page .auth-intro h2 { font-size: 26px; }
    body#panel-root.login-page .auth-intro p { font-size: 15px; margin-bottom: 8px; }
    body#panel-root.login-page .login-container { max-width: none; }
}

@media (max-width: 767.98px) {
    body#panel-root.panel-workspace { --workspace-gap: 16px; }
    body#panel-root.panel-workspace .mkh-kpi { gap: 10px; }
    body#panel-root.panel-workspace .mkh-kpi-card { padding: 14px; }
    body#panel-root.panel-workspace .mkh-kpi-val { font-size: 24px; }
    body#panel-root.panel-workspace .mkh-hero { padding: 20px; }
    body#panel-root.panel-workspace .membership-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 599.98px) {
    body#panel-root.panel-workspace { --workspace-header-height: calc(128px + env(safe-area-inset-top, 0px)); }
    body#panel-root.panel-workspace .top-navbar { display: grid !important; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: 52px 48px; gap: 8px 12px; padding-inline: 14px; padding-top: calc(10px + env(safe-area-inset-top, 0px)); padding-bottom: 10px; }
    body#panel-root.panel-workspace .top-navbar-left { display: contents; }
    body#panel-root.panel-workspace #panel-menu-fab { grid-column: 1; grid-row: 1; }
    body#panel-root.panel-workspace .top-navbar-right { grid-column: 2; grid-row: 1; justify-content: flex-end; }
    body#panel-root.panel-workspace .top-navbar .balance-display { padding: 5px 10px; gap: 2px 6px; line-height: 1.3; }
    body#panel-root.panel-workspace .workspace-balance-label { width: 100%; }
    body#panel-root.panel-workspace .top-navbar-search { grid-column: 1 / -1; grid-row: 2; max-width: none; }
    body#panel-root.panel-workspace .mkh-kpi { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    body#panel-root.panel-workspace .mkh-kpi-card { flex-direction: column; align-items: flex-start; flex-wrap: nowrap; gap: 6px; padding: 12px 10px; }
    body#panel-root.panel-workspace .mkh-kpi-body { flex: 1 1 auto; }
    body#panel-root.panel-workspace .mkh-kpi-ico { width: 32px; height: 32px; font-size: 16px; }
    body#panel-root.panel-workspace .mkh-kpi-val { font-size: 22px; }
    body#panel-root.panel-workspace .mkh-kpi-lbl { font-size: 14px; }
    body#panel-root.panel-workspace .mkh-kpi-grow { flex: 0 1 auto; font-size: 13px; padding: 3px 6px; }
    body#panel-root.panel-workspace .mkh-hero { padding: 16px; }
    body#panel-root.panel-workspace .mkh-user { flex-basis: 180px; }
    body#panel-root.panel-workspace .mkh-tier { font-size: 14px; padding: 4px 8px; }
    html[data-svc-card="row"] body#panel-root.panel-workspace .mk-cat-sub { display: none !important; }
    html[data-svc-card="row"] body#panel-root.panel-workspace :is(.svc-mini-card, .svc-card-style) { grid-template-columns: 44px minmax(0, 1fr); }
    html[data-svc-card="row"] body#panel-root.panel-workspace .svc-card-foot { grid-column: 2; grid-row: 2; flex-direction: row !important; flex-wrap: wrap; align-items: center !important; justify-content: space-between !important; gap: 8px !important; min-width: 0; }
    body#panel-root.panel-workspace #view-profile .panel-sheet-form { padding: 16px; }
    body#panel-root.panel-workspace :is(.inner-header, .chat-header-fixed) { gap: 8px; }
    body#panel-root.panel-workspace .membership-grid { grid-template-columns: minmax(0, 1fr); }
    body#panel-root.login-page { padding: 20px 16px calc(24px + env(safe-area-inset-bottom, 0px)); }
    body#panel-root.login-page .auth-intro { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
    body#panel-root.login-page .auth-intro :is(.auth-kicker, h2, p) { display: none; }
    body#panel-root.login-page .auth-brand { font-size: 20px; }
    body#panel-root.login-page :is(.login-container, .box) { padding: 24px 18px; }
    body#panel-root.login-page :is(.auth-form-head h1, .box h2) { font-size: 24px; }
}

/* ===== التلفون (560px وأقل): ضغط المساحات الزايدة بدل تكرارها عبر الشاشات ===== */
@media (max-width: 560px) {
    body#panel-root.panel-workspace { --workspace-gap: 12px; }

    body#panel-root.panel-workspace :is(.inner-header, .chat-header-fixed) { min-height: 0; padding: 8px var(--workspace-gap) !important; }
    body#panel-root.panel-workspace :is(.inner-header, .chat-header-fixed) > i,
    body#panel-root.panel-workspace .panel-back-btn { min-width: 40px; min-height: 40px; }
    body#panel-root.panel-workspace :is(.inner-title, .svc-search-back h4, #form-svc-title, #chat-subject) { font-size: 17px; }

    body#panel-root.panel-workspace #view-home :is(.home-content-wrapper, .quick-access-container) { margin-bottom: 16px; }
    body#panel-root.panel-workspace .mkh-hero { padding: 14px; margin: 0 0 12px; border-radius: 14px; }
    body#panel-root.panel-workspace .mkh-hero-top { gap: 12px; }
    body#panel-root.panel-workspace .mkh-user { flex: 1 1 100%; flex-basis: 100%; gap: 10px; }
    body#panel-root.panel-workspace .mkh-avatar { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 12px; font-size: 19px; }
    body#panel-root.panel-workspace :is(.mkh-hi, .mkh-hi h1) { font-size: 18px; }
    body#panel-root.panel-workspace .mkh-tier { font-size: 13px; padding: 3px 8px; }
    body#panel-root.panel-workspace .mkh-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0 0 16px; }
    body#panel-root.panel-workspace .mkh-kpi-card:last-child:nth-child(3) { grid-column: 1 / -1; }
    body#panel-root.panel-workspace .mkh-kpi-card { padding: 10px; border-radius: 14px; }
    body#panel-root.panel-workspace .mkh-kpi-val { font-size: 19px; }
    body#panel-root.panel-workspace .mkh-kpi-lbl { font-size: 13px; }
    body#panel-root.panel-workspace .mkh-kpi-ico { width: 28px; height: 28px; font-size: 14px; }

    body#panel-root.panel-workspace :is(.cat-grid, #cat-grid-content, #subcats-container) { gap: 10px !important; }
    body#panel-root.panel-workspace :is(.svc-grid, #cat-svc-list, #services-list, #services-list-container) { gap: 10px !important; padding: 14px var(--workspace-gap) !important; }
    body#panel-root.panel-workspace .qa-card { flex-basis: 148px; width: 148px; padding: 12px; }
    body#panel-root.panel-workspace .qa-title { font-size: 16px; }
    body#panel-root.panel-workspace .qa-icon { width: 36px; height: 36px; margin-bottom: 8px; }

    body#panel-root.panel-workspace :is(.order-header, .order-body) { padding: 12px; }
    body#panel-root.panel-workspace .list-item { gap: 8px; padding: 10px; }
    body#panel-root.panel-workspace :is(#history-container, #financials-container, #tickets-container, .panel-notif-list, .membership-page) { padding: 14px var(--workspace-gap) !important; }
    body#panel-root.panel-workspace :is(.empty-state, .empty-view-box, .membership-empty) { padding: 20px 14px; }
    body#panel-root.panel-workspace #view-history .status-filters-container { padding: 10px var(--workspace-gap); }
    body#panel-root.panel-workspace #view-history .st-filter-btn[data-filter] { flex: 1 1 44%; min-width: 0; padding: 8px 10px; }
    body#panel-root.panel-workspace #view-profile .panel-sheet-form { width: 100%; margin: 12px auto; padding: 14px; }
    body#panel-root.panel-workspace #view-profile .panel-sheet-foot { padding: 14px 0 0; }
    body#panel-root.panel-workspace .centered-view-content { padding: 16px var(--workspace-gap); }
    body#panel-root.panel-workspace .topup-verify-card { padding: 16px 12px; }
    body#panel-root.panel-workspace #view-topup-verify .timer-text { font-size: 26px; }
    body#panel-root.panel-workspace .chat-messages-area { padding: 14px var(--workspace-gap); }
    body#panel-root.panel-workspace .chat-msg { max-width: 92%; padding: 10px 12px; }
    body#panel-root.panel-workspace .membership-card .tier-shot-media { max-height: 200px; }
}

@media (min-width: 992px) {
    body#panel-root.login-page.has-desk-ticker { padding-top: calc(var(--store-ticker-h) + 32px); }
}

@media (max-width: 991.98px) {
    body#panel-root.login-page.has-mob-ticker { padding-top: calc(var(--store-ticker-h) + env(safe-area-inset-top, 0px) + 20px); }
}

body#panel-root.panel-workspace :is(#view-home, #view-services) .is-filtered-out,
body#panel-root.panel-workspace .svc-cat-toolbar.is-hidden { display: none !important; }

body#panel-root.panel-workspace .store-ticker:not(:has(.store-ticker-item:not(:empty))) { display: none !important; }

@media (prefers-reduced-motion: reduce) {
    body#panel-root:is(.panel-workspace, .login-page, .profile-completion) *,
    body#panel-root:is(.panel-workspace, .login-page, .profile-completion) *::before,
    body#panel-root:is(.panel-workspace, .login-page, .profile-completion) *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    body#panel-root:is(.panel-workspace, .login-page) .store-ticker { overflow-x: auto; }
    body#panel-root:is(.panel-workspace, .login-page) .store-ticker-track { animation: none !important; transform: none !important; will-change: auto; }
    body#panel-root:is(.panel-workspace, .login-page) .store-ticker-group + .store-ticker-group { display: none; }
}

/* ===================================================================
   HIGH-READABILITY LAYER — نص أبيض صريح، أسطح فاتحة، حدود واضحة
   =================================================================== */

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    h1, h2, h3, h4, h5, h6,
    .mkh-hi, .mkh-sec-title, .mkh-kpi-val, .mkh-tier, .qa-title,
    .card-title, .section-title, .panel-title, .stat-value, .detail-value,
    .order-title, .ticket-title, .notif-title, .summary-value, .price, .amount, .balance
) {
    color: #ffffff !important;
    font-weight: 800 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    p, .muted, .text-muted, .small, small,
    .mkh-sec-sub, .mkh-kpi-lbl, .mk-cat-sub, .mkh-welcome-ar,
    .stat-label, .detail-key, .form-label, label, .card-text, .order-meta, .notif-time
) {
    color: #cbd5e1 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.stat-label, .detail-key, .mkh-kpi-lbl, .form-label, label) {
    font-weight: 700 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .card, .order-card, .ticket-card, .notif-item, .membership-card, .membership-current,
    .clean-list-box, .list-item, .response-box-styled, .panel-sheet-form, .mkh-kpi-card,
    .mkh-hero, .topup-wallet, .topup-panel, .topup-card, .form-price-box, .modal-content,
    .dropdown-menu, .panel-popover, .table
) {
    background: rgba(30, 41, 59, 0.7) !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

body#panel-root.panel-workspace :is(.sidebar, .panel-desk-iconbar, .panel-dock, .btm-nav, .top-navbar) {
    border-width: 1px !important;
    border-style: solid !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.sidebar-nav-item, .panel-mobile-menu-item, .nav-link) {
    color: #cbd5e1 !important;
    font-weight: 600 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.sidebar-nav-item, .panel-mobile-menu-item, .nav-link):is(.active, .is-active, :hover) {
    color: #00f2fe !important;
    font-weight: 800 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) .table > tbody > tr > * {
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) .table > thead > tr > th {
    color: #ffffff !important;
    font-weight: 800 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) .badge {
    font-weight: 800 !important;
    padding: 0.36rem 0.62rem;
    border-width: 1px;
    border-style: solid;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .alert-success, .badge.bg-success, .bg-success, .smm-badge-new, .notif-icon.n-success,
    .order-card.st-success .badge
) {
    background: rgba(52, 211, 153, 0.30) !important;
    color: #ffffff !important;
    border-color: rgba(52, 211, 153, 0.75) !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .alert-warning, .badge.bg-warning, .bg-warning, .notif-icon.n-warn, .is-admin-btn
) {
    background: rgba(251, 191, 36, 0.30) !important;
    color: #ffffff !important;
    border-color: rgba(251, 191, 36, 0.75) !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .alert-danger, .badge.bg-danger, .bg-danger, .smm-badge-hot, .notif-icon.n-danger
) {
    background: rgba(248, 113, 113, 0.30) !important;
    color: #ffffff !important;
    border-color: rgba(248, 113, 113, 0.75) !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .alert-info, .badge.bg-primary, .badge.bg-info, .badge-social, .notif-icon.n-info
) {
    background: rgba(0, 242, 254, 0.22) !important;
    color: #ffffff !important;
    border-color: rgba(0, 242, 254, 0.75) !important;
}

body#panel-root.panel-workspace #view-history .order-card .badge:is(.bg-success, .bg-warning, .bg-danger) {
    color: #ffffff !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .modern-inp, .log-inp, .inp, .form-control, .form-select, .pin-field,
    textarea, select,
    input[type="text"], input[type="email"], input[type="number"], input[type="password"],
    input[type="tel"], input[type="search"], input[type="url"], input[type="date"],
    input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"]
) {
    background: #0f172a !important;
    background-color: #0f172a !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 1px solid #334155 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(input, textarea)::placeholder {
    color: #94a3b8 !important;
    opacity: 1;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) input:-webkit-autofill {
    -webkit-text-fill-color: #ffffff !important;
    -webkit-box-shadow: 0 0 0 1000px #0f172a inset !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) select option {
    background: #0f172a !important;
    color: #ffffff !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .main-btn, .primary-btn, .btn-primary, .log-btn, .pwa-btn, .chat-send-btn,
    .svc-order-btn, .panel-header-cta, #btn-form-submit, .btn-save
):not(.btn-danger):not(.btn-outline-danger):not(.btn-success):not(.btn-warning):not(.btn-dark):not(.btn-light):not(.btn-secondary):not(.btn-outline-primary):not(.btn-outline-secondary):not(:disabled) {
    background: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%) !important;
    background-image: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%) !important;
    color: #000000 !important;
    font-weight: 800 !important;
    border-color: transparent !important;
    box-shadow: 0 0 15px rgba(0, 242, 254, 0.35), 0 8px 18px -10px rgba(0, 0, 0, 0.6) !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(
    .main-btn, .primary-btn, .btn-primary, .log-btn, .pwa-btn, .chat-send-btn,
    .svc-order-btn, .panel-header-cta, #btn-form-submit, .btn-save
):not(.btn-danger):not(.btn-outline-danger):not(.btn-success):not(.btn-warning):not(.btn-dark):not(.btn-light):not(.btn-secondary):not(.btn-outline-primary):not(.btn-outline-secondary):not(:disabled):hover {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
    background-image: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
    color: #000000 !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(button, .btn):disabled {
    background: #1e293b !important;
    color: #94a3b8 !important;
    box-shadow: none !important;
}

body#panel-root:is(.panel-workspace, .login-page, .profile-completion) :is(.top-navbar-search, .main-search-bar) input[type="text"] {
    background: transparent !important;
    color: #ffffff !important;
}

/* ===================================================================
   SERVICE SECTION TABS — 4 أقسام خدمات نصية مسطّحة (IMEI / تفعيلات /
   سوشيال / عن بُعد) فوق كروت الأقسام، RTL، بنفس هيكل الجلاس النيوني
   =================================================================== */
body#panel-root.panel-workspace #svc-type-tabs.svc-type-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: flex-start !important;
    margin: 0 0 14px !important;
    padding: 8px !important;
    background: rgba(15, 23, 42, 0.55) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    border-radius: 16px !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

body#panel-root.panel-workspace .svc-type-tab {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex: 0 1 auto !important;
    padding: 9px 15px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    color: #e2e8f0 !important;
    background: rgba(30, 41, 59, 0.70) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transform: none !important;
    transition: color .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease !important;
    cursor: pointer !important;
}

body#panel-root.panel-workspace .svc-type-tab > span {
    display: inline-block !important;
    white-space: normal !important;
}

body#panel-root.panel-workspace .svc-type-tab .svc-type-count {
    display: inline-block !important;
    min-width: 20px !important;
    padding: 1px 6px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    color: #94a3b8 !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: none !important;
    border-radius: 999px !important;
}

body#panel-root.panel-workspace .svc-type-tab:hover {
    color: #ffffff !important;
    background: rgba(51, 65, 85, 0.85) !important;
    border-color: rgba(0, 242, 254, 0.45) !important;
}

body#panel-root.panel-workspace .svc-type-tab.is-on {
    color: #000000 !important;
    background: #00f2fe !important;
    border-color: transparent !important;
    box-shadow: 0 0 18px rgba(0, 242, 254, 0.38) !important;
}

body#panel-root.panel-workspace .svc-type-tab.is-on .svc-type-count {
    color: #000000 !important;
    background: rgba(0, 0, 0, 0.18) !important;
}

body#panel-root.panel-workspace .svc-type-tab.is-on:focus-visible,
body#panel-root.panel-workspace .svc-type-tab:focus-visible {
    outline: 2px solid #4facfe !important;
    outline-offset: 2px !important;
}

body#panel-root.panel-workspace .svc-tab-empty {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 18px 0 !important;
    padding: 26px 14px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #cbd5e1 !important;
    background: rgba(30, 41, 59, 0.55) !important;
    border: 1px dashed rgba(255, 255, 255, 0.18) !important;
    border-radius: 16px !important;
}

/* شارة القسم على الكارت — مسطّحة، لون مميز لكل قسم */
body#panel-root.panel-workspace .smm-badge.smm-badge-sec {
    font-size: 10px !important;
    font-weight: 800 !important;
    padding: 3px 8px !important;
    border-radius: 8px !important;
    background: rgba(15, 23, 42, 0.75) !important;
    color: #e2e8f0 !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow: none !important;
}

body#panel-root.panel-workspace .smm-badge-sec.sec-imei {
    color: #00f2fe !important;
    border-color: rgba(0, 242, 254, 0.55) !important;
    background: rgba(0, 242, 254, 0.14) !important;
}

body#panel-root.panel-workspace .smm-badge-sec.sec-activation {
    color: #fbbf24 !important;
    border-color: rgba(251, 191, 36, 0.55) !important;
    background: rgba(251, 191, 36, 0.14) !important;
}

body#panel-root.panel-workspace .smm-badge-sec.sec-social {
    color: #4facfe !important;
    border-color: rgba(79, 172, 254, 0.55) !important;
    background: rgba(79, 172, 254, 0.14) !important;
}

body#panel-root.panel-workspace .smm-badge-sec.sec-remote {
    color: #34d399 !important;
    border-color: rgba(52, 211, 153, 0.55) !important;
    background: rgba(52, 211, 153, 0.14) !important;
}

@media (max-width: 640px) {
    body#panel-root.panel-workspace #svc-type-tabs.svc-type-tabs {
        gap: 6px !important;
        padding: 6px !important;
        border-radius: 14px !important;
    }

    body#panel-root.panel-workspace .svc-type-tab {
        flex: 1 1 calc(50% - 6px) !important;
        padding: 8px 10px !important;
        font-size: 12px !important;
    }
}