/** * Glass cascade lock — load LAST on every staff glass page. * Applies ONLY master tokens. No independent colors. * Neutralizes theme-light + staff-frosted-glass + page CSS paint fights. * * Tune look in: staff-glass-master.css (TUNABLE tokens only) */ /* Force legacy var names → master (even if frosted/theme redefine later in cascade) */ html, html[data-theme="light"], html body.light-theme, html body.dark-theme { --staff-glass-fill: var(--glass-l2-bg) !important; --staff-glass-fill-soft: var(--glass-l2-bg) !important; --staff-glass-fill-chip: var(--glass-l3-bg) !important; --staff-glass-blur: var(--glass-l2-blur) !important; --staff-glass-border: var(--glass-l2-border) !important; --staff-glass-border-top: var(--glass-l2-border-top) !important; --staff-glass-shadow: var(--glass-l2-shadow) !important; --staff-glass-shadow-chip: var(--glass-l3-shadow) !important; --staff-pad-bg: var(--glass-l1-pad) !important; --glass-surface: var(--glass-l2-bg) !important; --glass-surface-soft: var(--glass-l2-bg) !important; --glass-surface-strong: var(--glass-l3-bg) !important; --glass-blur: var(--glass-l2-blur) !important; --glass-border: var(--glass-l2-border) !important; --glass-shadow: var(--glass-l2-shadow) !important; --glass-shadow-soft: var(--glass-l2-shadow) !important; } /* ========== Layer 1 lock ========== */ html, html body, html body .app-fullscreen-frame, html[data-theme="light"] body, html[data-theme="light"] body .app-fullscreen-frame, html body.light-theme, html body.light-theme .app-fullscreen-frame, html body.dark-theme, html body.dark-theme .app-fullscreen-frame { background: var(--glass-l1-pad) !important; background-image: var(--glass-l1-pad) !important; background-color: transparent !important; background-attachment: fixed !important; color: var(--glass-ink) !important; } html body::before, html body::after, html body .app-fullscreen-frame::before, html body .app-fullscreen-frame::after { content: none !important; display: none !important; background: none !important; } /* ========== Layer 2 lock — all staff shells ========== */ html[data-glass-page] #dashboardGrid .cell--topbar, html[data-glass-page] #dashboardGrid .cell--sidebar, html[data-glass-page] #dashboardGrid .cell--profile, html[data-glass-page] #dashboardGrid .cell--server, html[data-glass-page] #dashboardGrid .cell--week, html[data-glass-page] #dashboardGrid .cell--announce, html[data-glass-page] #dashboardGrid .cell--payment, html[data-glass-page] #dashboardGrid .member-link-box, html[data-glass-page] #dashboardGrid .week-header, html[data-glass-page] #dashboardGrid .week-panel, html[data-glass-page] #dashboardGrid .nav-row, html[data-glass-page] #dashboardGrid .announce-form-card, html[data-glass-page] #dashboardGrid .payment-page__list, html[data-glass-page] #dashboardGrid .payment-page__detail, html[data-glass-page] #dashboardGrid .payment-detail, html[data-glass-page] #dashboardGrid .period-2d-panel, html[data-glass-page] #dashboardGrid .period-3d-panel, html[data-glass-page] #dashboardGrid .period-2d-panel .pp-box, html[data-glass-page] #dashboardGrid .period-3d-panel .pp-box, html[data-glass-page] #dashboardGrid .period-2d-panel .pp-readiness, html[data-glass-page] #dashboardGrid .period-3d-panel .pp-readiness, html[data-glass-page] #dashboardGrid .ma-card, html[data-glass-page] #dashboardGrid .mc-card, html[data-glass-page] #dashboardGrid .lc-card, html[data-glass-page] #dashboardGrid .agent-mgmt-card, html[data-glass-page] #dashboardGrid .summary-page, html[data-glass-page] #dashboardGrid .delete-data-card, html[data-glass-page] #dashboardGrid #announcePanel, html[data-glass-page] #dashboardGrid #paymentPanel, html[data-glass-page] #dashboardGrid #period2dPanel, html[data-glass-page] #dashboardGrid #period3dPanel, html[data-glass-page] #dashboardGrid #memberAgentPanel, html[data-glass-page] #dashboardGrid #memberCreatePanel, html[data-glass-page] #dashboardGrid #leaderCreatePanel, html[data-glass-page] #dashboardGrid #summary2dPanel, html[data-glass-page] #dashboardGrid #summary3dPanel, html[data-glass-page] #dashboardGrid #report2dAdminPanel, html[data-glass-page] #dashboardGrid #report2dAgentPanel, html[data-glass-page] #dashboardGrid #report2dMemberPanel, html[data-glass-page] #dashboardGrid #report3dAdminPanel, html[data-glass-page] #dashboardGrid #report3dAgentPanel, html[data-glass-page] #dashboardGrid #report3dMemberPanel, html[data-glass-page] #dashboardGrid #delete2dPanel, html[data-glass-page] #dashboardGrid #delete3dPanel, html[data-theme="light"][data-glass-page] #dashboardGrid .cell--topbar, html[data-theme="light"][data-glass-page] #dashboardGrid .cell--sidebar, html[data-theme="light"][data-glass-page] #dashboardGrid .cell--profile, html[data-theme="light"][data-glass-page] #dashboardGrid .cell--server, html[data-theme="light"][data-glass-page] #dashboardGrid .cell--week, html[data-theme="light"][data-glass-page] #dashboardGrid .cell--announce, html[data-theme="light"][data-glass-page] #dashboardGrid .announce-form-card, html[data-theme="light"][data-glass-page] #dashboardGrid .ma-card, html[data-theme="light"][data-glass-page] #dashboardGrid .mc-card, html[data-theme="light"][data-glass-page] #dashboardGrid .lc-card, html[data-theme="light"][data-glass-page] #dashboardGrid .period-2d-panel .pp-box, html[data-theme="light"][data-glass-page] #dashboardGrid .period-3d-panel .pp-box, html[data-theme="light"][data-glass-page] #dashboardGrid .summary-page, html[data-theme="light"][data-glass-page] #dashboardGrid .member-link-box, html[data-theme="light"][data-glass-page] #dashboardGrid .week-header, html body.hub-role-page .card, html body.role-login-page .role-login-card, html[data-theme="light"] body.hub-role-page .card, html[data-theme="light"] body.role-login-page .role-login-card, html body.light-theme.hub-role-page .card, html body.light-theme.role-login-page .role-login-card, html body.dark-theme.hub-role-page .card, html body.dark-theme.role-login-page .role-login-card, html[data-glass-page^="main"] .my-header, html[data-glass-page^="main"] .main-board-aside, html[data-glass-page^="main"] .main-board-aside--win-tree, html[data-glass-page^="main"] .main-board-aside--dense-list, html[data-glass-page^="main"] .main-board-main, html[data-glass-page^="main"] .main-board-main-head, html[data-glass-page^="main"] .main-board-footer, html[data-theme="light"][data-glass-page^="main"] .my-header, html[data-theme="light"][data-glass-page^="main"] .main-board-aside, html[data-theme="light"][data-glass-page^="main"] .main-board-aside--win-tree, html[data-theme="light"][data-glass-page^="main"] .main-board-aside--dense-list, html[data-theme="light"][data-glass-page^="main"] .main-board-main, body.main-board-page .my-header, body.main-board-page .main-board-aside, body.main-board-page .main-board-aside--win-tree, body.main-board-page .main-board-aside--dense-list, body.main-board-page .main-board-main, html[data-theme="light"] body.main-board-page .my-header, html[data-theme="light"] body.main-board-page .main-board-aside, html[data-theme="light"] body.main-board-page .main-board-aside--win-tree, html[data-theme="light"] body.main-board-page .main-board-aside--dense-list, html[data-theme="light"] body.main-board-page .main-board-main, html body.sa-app .sa-drawer, html body.sa-app .sa-split__list, html body.sa-app .sa-split__detail, html body.sa-app .sa-member-meta, html[data-theme="light"] body.sa-app .sa-drawer, html[data-theme="light"] body.sa-app .sa-split__list, html[data-theme="light"] body.sa-app .sa-split__detail, html[data-theme="light"] body.sa-app .sa-member-meta, .glass-l2, .glass-container { background: var(--glass-l2-bg) !important; background-image: none !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; border-left: var(--glass-l2-border-left) !important; box-shadow: var(--glass-l2-shadow) !important; } /* member.agent light — shell clear + clearer L2 cards (not dark) */ html[data-theme="light"][data-glass-page="member.agent"] #dashboardGrid #memberAgentPanel, html[data-theme="light"][data-glass-page="member.agent"] #dashboardGrid #memberAgentPanel .member-agent-panel, html[data-theme="light"] #dashboardGrid[data-workspace-view="member.agent"] > #memberAgentPanel, html[data-theme="light"] #dashboardGrid[data-workspace-view="member.agent"] .member-agent-panel { background: transparent !important; background-color: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html[data-theme="light"][data-glass-page="member.agent"] #dashboardGrid #memberAgentPanel .ma-card, html[data-theme="light"][data-glass-page="member.agent"] #dashboardGrid #memberAgentPanel .agent-mgmt-card, html[data-theme="light"] #dashboardGrid[data-workspace-view="member.agent"] .ma-card, html[data-theme="light"] #dashboardGrid[data-workspace-view="member.agent"] .agent-mgmt-card { background: var(--glass-l2-bg) !important; background-color: transparent !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; box-shadow: var(--glass-l2-shadow) !important; border-radius: var(--glass-l2-radius) !important; color: var(--glass-ink) !important; isolation: auto !important; } /* period.3d light — shell clear + clearer L2 cards */ html[data-theme="light"][data-glass-page="period.3d"] #dashboardGrid #period3dPanel, html[data-theme="light"][data-glass-page="period.3d"] #dashboardGrid #period3dPanel .period-3d-panel, html[data-theme="light"] #dashboardGrid[data-workspace-view="period.3d"] > #period3dPanel, html[data-theme="light"] #dashboardGrid[data-workspace-view="period.3d"] .period-3d-panel { background: transparent !important; background-color: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html[data-theme="light"][data-glass-page="period.3d"] #dashboardGrid #period3dPanel .pp-box, html[data-theme="light"][data-glass-page="period.3d"] #dashboardGrid #period3dPanel .pp-readiness, html[data-theme="light"] #dashboardGrid[data-workspace-view="period.3d"] .period-3d-panel .pp-box, html[data-theme="light"] #dashboardGrid[data-workspace-view="period.3d"] .period-3d-panel .pp-readiness { background: var(--glass-l2-bg) !important; background-color: transparent !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; box-shadow: var(--glass-l2-shadow) !important; border-radius: var(--glass-l2-radius) !important; color: var(--glass-ink) !important; isolation: auto !important; } /* Agent/Admin member.create — panel clear (L1); cards keep L2 via .mc-card */ html[data-glass-page^="member"] #dashboardGrid #memberCreatePanel, html[data-glass-page^="member"] #dashboardGrid #leaderCreatePanel, html[data-theme="light"][data-glass-page^="member"] #dashboardGrid #memberCreatePanel, html[data-theme="light"][data-glass-page^="member"] #dashboardGrid #leaderCreatePanel, #dashboardGrid[data-workspace-view^="member"] > #memberCreatePanel, #dashboardGrid[data-workspace-view^="member"] > #leaderCreatePanel { background: transparent !important; background-color: transparent !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } /* period.2d — keep page L1 pad (richer than generic master pad) */ html[data-glass-page="period.2d"], html[data-glass-page="period.2d"] body, html[data-glass-page="period.2d"] body .app-fullscreen-frame, html:has(#dashboardGrid[data-workspace-view="period.2d"]), html:has(#dashboardGrid[data-workspace-view="period.2d"]) body, html:has(#dashboardGrid[data-workspace-view="period.2d"]) body .app-fullscreen-frame { background: var(--p2d-pad, var(--glass-l1-pad)) !important; background-image: var(--p2d-pad, var(--glass-l1-pad)) !important; background-color: transparent !important; background-attachment: fixed !important; } /* period.2d — shell clear (L1); L2 glass on cards only (nested blur kills dark glass) */ html[data-glass-page="period.2d"] #dashboardGrid #period2dPanel, html[data-glass-page="period.2d"] #dashboardGrid #period2dPanel .period-2d-panel, html[data-theme="light"][data-glass-page="period.2d"] #dashboardGrid #period2dPanel, html[data-theme="light"][data-glass-page="period.2d"] #dashboardGrid #period2dPanel .period-2d-panel, #dashboardGrid[data-workspace-view="period.2d"] > #period2dPanel, #dashboardGrid[data-workspace-view="period.2d"] .period-2d-panel { background: transparent !important; background-color: transparent !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html[data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-box, html[data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-readiness, html[data-theme="light"][data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-box, html[data-theme="light"][data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-readiness, #dashboardGrid[data-workspace-view="period.2d"] .period-2d-panel .pp-box, #dashboardGrid[data-workspace-view="period.2d"] .period-2d-panel .pp-readiness { background: var(--glass-l2-bg) !important; background-image: none !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; border-left: var(--glass-l2-border-left) !important; box-shadow: var(--glass-l2-shadow) !important; border-radius: var(--glass-l2-radius) !important; isolation: auto !important; } /* summary.2d dark — table glass (beats frosted opaque --staff-table-bg) */ html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel, html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel .summary-2d-panel, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] > #summary2dPanel, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] .summary-2d-panel { background: transparent !important; background-color: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel .su-grid-frame, html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel .table-wrap, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] .su-grid-frame, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] .table-wrap { background: rgba(15, 23, 42, 0.28) !important; background-color: rgba(15, 23, 42, 0.28) !important; -webkit-backdrop-filter: blur(16px) saturate(1.1) !important; backdrop-filter: blur(16px) saturate(1.1) !important; border: 1px solid rgba(255, 255, 255, 0.16) !important; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; } html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel #adminSummaryDataTable, html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel #adminSummaryDataTable thead th, html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel #adminSummaryDataTable tbody td, html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel #adminSummaryDataTable tfoot td, html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel #adminSummaryDataTable tbody tr:nth-child(even) td, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable thead th, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable tbody td, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable tfoot td, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable tbody tr:nth-child(even) td { background: transparent !important; background-color: transparent !important; color: #f1f5f9 !important; -webkit-text-fill-color: #f1f5f9 !important; } html[data-glass-page="summary.2d"]:not([data-theme="light"]) #dashboardGrid #summary2dPanel #adminSummaryDataTable thead th, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable thead th { background: rgba(255, 255, 255, 0.06) !important; } /* summary.3d dark — table glass (same as summary.2d) */ html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel, html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel .summary-3d-panel, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] > #summary3dPanel, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] .summary-3d-panel { background: transparent !important; background-color: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel .su3d-grid-frame, html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel .table-wrap, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] .su3d-grid-frame, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] .table-wrap { background: rgba(15, 23, 42, 0.28) !important; background-color: rgba(15, 23, 42, 0.28) !important; -webkit-backdrop-filter: blur(16px) saturate(1.1) !important; backdrop-filter: blur(16px) saturate(1.1) !important; border: 1px solid rgba(255, 255, 255, 0.16) !important; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; } html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel #admin3dSummaryDataTable, html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel #admin3dSummaryDataTable thead th, html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel #admin3dSummaryDataTable tbody td, html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel #admin3dSummaryDataTable tfoot td, html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel #admin3dSummaryDataTable tbody tr:nth-child(even) td, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable thead th, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable tbody td, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable tfoot td, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable tbody tr:nth-child(even) td { background: transparent !important; background-color: transparent !important; color: #f1f5f9 !important; -webkit-text-fill-color: #f1f5f9 !important; } html[data-glass-page="summary.3d"]:not([data-theme="light"]) #dashboardGrid #summary3dPanel #admin3dSummaryDataTable thead th, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable thead th { background: rgba(255, 255, 255, 0.06) !important; } /* summary.2d / .3d light — clearer L2 (beats theme-light #fff grid + 0.58 liquid) */ html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel, html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel .summary-2d-panel, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel .summary-3d-panel, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] > #summary2dPanel, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] .summary-2d-panel, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] > #summary3dPanel, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] .summary-3d-panel { background: transparent !important; background-color: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel .summary-page, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel .summary-page, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] .summary-page, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] .summary-page { background: var(--glass-l2-bg) !important; background-color: transparent !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; box-shadow: var(--glass-l2-shadow) !important; isolation: auto !important; } html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel .su-grid-frame, html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel .table-wrap, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel .su3d-grid-frame, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel .table-wrap, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] .su-grid-frame, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] .table-wrap, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] .su3d-grid-frame, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] .table-wrap { background: var(--glass-l2-bg) !important; background-color: transparent !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; isolation: auto !important; } html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel #adminSummaryDataTable, html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel #adminSummaryDataTable thead th, html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel #adminSummaryDataTable tbody td, html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel #adminSummaryDataTable tfoot td, html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel #adminSummaryDataTable tbody tr:nth-child(even) td, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel #admin3dSummaryDataTable, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel #admin3dSummaryDataTable thead th, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel #admin3dSummaryDataTable tbody td, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel #admin3dSummaryDataTable tfoot td, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel #admin3dSummaryDataTable tbody tr:nth-child(even) td, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable thead th, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable tbody td, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable tfoot td, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable tbody tr:nth-child(even) td, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable thead th, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable tbody td, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable tfoot td, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable tbody tr:nth-child(even) td { background: rgba(255, 255, 255, 0.18) !important; color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; } html[data-theme="light"][data-glass-page="summary.2d"] #dashboardGrid #summary2dPanel #adminSummaryDataTable thead th, html[data-theme="light"][data-glass-page="summary.3d"] #dashboardGrid #summary3dPanel #admin3dSummaryDataTable thead th, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.2d"] #adminSummaryDataTable thead th, html[data-theme="light"] #dashboardGrid[data-workspace-view="summary.3d"] #admin3dSummaryDataTable thead th { background: rgba(255, 255, 255, 0.42) !important; } /* Dark — kill white week-round table slab inside Week round setup */ html[data-glass-page="period.2d"]:not([data-theme="light"]) #dashboardGrid #period2dPanel .pp-week-round-table, html[data-glass-page="period.2d"]:not([data-theme="light"]) #dashboardGrid #period2dPanel .pp-week-round-mount, html[data-glass-page="period.2d"]:not([data-theme="light"]) #dashboardGrid #period2dPanel .pp-week-round-table th, html[data-glass-page="period.2d"]:not([data-theme="light"]) #dashboardGrid #period2dPanel .pp-week-round-table td, html[data-glass-page="period.2d"]:not([data-theme="light"]) #dashboardGrid #period2dPanel .pp-week-round-table tbody th, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="period.2d"] .pp-week-round-table, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="period.2d"] .pp-week-round-mount, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="period.2d"] .pp-week-round-table th, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="period.2d"] .pp-week-round-table td, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="period.2d"] .pp-week-round-table tbody th { background: transparent !important; background-color: transparent !important; color: var(--glass-ink, #f1f5f9) !important; } html[data-glass-page="period.2d"]:not([data-theme="light"]) #dashboardGrid #periodPageBoxWeekDay, html:not([data-theme="light"]) #dashboardGrid[data-workspace-view="period.2d"] #periodPageBoxWeekDay { background: rgba(51, 65, 85, 0.22) !important; background-color: rgba(51, 65, 85, 0.22) !important; -webkit-backdrop-filter: blur(20px) saturate(1.15) !important; backdrop-filter: blur(20px) saturate(1.15) !important; } html[data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-period-status__cell, html[data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-created-row, html[data-theme="light"][data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-period-status__cell, html[data-theme="light"][data-glass-page="period.2d"] #dashboardGrid #period2dPanel .pp-created-row, #dashboardGrid[data-workspace-view="period.2d"] .period-2d-panel .pp-period-status__cell, #dashboardGrid[data-workspace-view="period.2d"] .period-2d-panel .pp-created-row { background: var(--glass-l3-bg) !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; } html[data-glass-page^="member"] #dashboardGrid #memberCreatePanel .mc-card, html[data-glass-page^="member"] #dashboardGrid #leaderCreatePanel .mc-card, html[data-glass-page^="member"] #dashboardGrid #memberCreatePanel .agent-mgmt-card, html[data-glass-page^="member"] #dashboardGrid #leaderCreatePanel .agent-mgmt-card, #dashboardGrid[data-workspace-view^="member"] .mc-card, #dashboardGrid[data-workspace-view^="member"] .agent-mgmt-card { background: var(--glass-l2-bg) !important; background-image: none !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; box-shadow: var(--glass-l2-shadow) !important; border-radius: var(--glass-l2-radius) !important; } html[data-glass-page^="member"] #dashboardGrid .mc-member-roster--win-tree.mc-member-roster--in-card, #dashboardGrid[data-workspace-view^="member"] .mc-member-roster--win-tree.mc-member-roster--in-card { background: var(--glass-l3-bg) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; border: var(--glass-l3-border) !important; box-shadow: var(--glass-l3-shadow) !important; border-radius: var(--glass-l3-radius) !important; } /* * Sub Agent create / report / password — true 3-layer stack (load-critical). * L1 = body pad · L2 = cards only · L3 = inputs / arrows * Detail pane + view shell stay clear so L1 shows through. */ html body.sa-app[data-sa-view="create"] .sa-split__detail, html body.sa-app[data-sa-view="password"] .sa-split__detail, html body.sa-app[data-sa-view="report"] .sa-split__detail, html[data-glass-page="member.create"] body.sa-app .sa-split__detail, html[data-glass-page^="report"] body.sa-app .sa-split__detail, html body.sa-app[data-sa-view="create"] #saViewCreate.sa-view--create, html body.sa-app[data-sa-view="password"] #saViewPassword.sa-view--password, html body.sa-app[data-sa-view="report"] #saViewReport.sa-view--report, html[data-glass-page="member.create"] body.sa-app #saViewCreate.sa-view--create, html[data-glass-page="member.create"] body.sa-app #saViewPassword.sa-view--password, html[data-glass-page^="report"] body.sa-app #saViewReport.sa-view--report { background: transparent !important; background-color: transparent !important; background-image: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: none !important; border: none !important; } /* L2 — create / password cards (purge agent #fff .mc-card) */ html body.sa-app[data-sa-view="create"] #saMemberCreateRoot .mc-card, html body.sa-app[data-sa-view="create"] #saMemberCreateRoot .agent-mgmt-card, html body.sa-app[data-sa-view="create"] #saMemberCreateRoot .sa-create-glass__card, html body.sa-app[data-sa-view="password"] #saViewPassword .mc-card, html body.sa-app[data-sa-view="password"] #saViewPassword .sa-create-glass__card, html body.sa-app[data-sa-view="report"] #saViewReport .sa-report-glass__card, html body.sa-app[data-sa-view="report"] #saViewReport .sa-report-glass__intro, html[data-glass-page="member.create"] body.sa-app #saMemberCreateRoot .mc-card, html[data-glass-page="member.create"] body.sa-app #saMemberCreateRoot .agent-mgmt-card, html[data-glass-page="member.create"] body.sa-app #saViewPassword .mc-card, html[data-glass-page^="report"] body.sa-app #saViewReport .sa-report-glass__card, html[data-glass-page^="report"] body.sa-app #saViewReport .sa-report-glass__intro { background: var(--glass-l2-bg) !important; background-color: var(--glass-l2-bg) !important; background-image: none !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; box-shadow: var(--glass-l2-shadow) !important; border-radius: var(--glass-l2-radius) !important; color: var(--glass-ink) !important; } /* Nested sheets clear — L3 controls sit on L2 card */ html body.sa-app[data-sa-view="create"] #saMemberCreateRoot .sa-create-glass__form-sheet, html body.sa-app[data-sa-view="create"] #saMemberCreateRoot .sa-create-glass__table-shell, html body.sa-app[data-sa-view="password"] #saViewPassword .sa-create-glass__form-sheet, html body.sa-app[data-sa-view="report"] #saViewReport .sa-report-glass__table-shell, html[data-glass-page="member.create"] body.sa-app #saMemberCreateRoot .sa-create-glass__form-sheet, html[data-glass-page="member.create"] body.sa-app #saMemberCreateRoot .sa-create-glass__table-shell { background: transparent !important; background-image: none !important; border: none !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } /* L3 — create / password fields */ html body.sa-app[data-sa-view="create"] #saMemberCreateRoot input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html body.sa-app[data-sa-view="create"] #saMemberCreateRoot select, html body.sa-app[data-sa-view="create"] #saMemberCreateRoot textarea, html body.sa-app[data-sa-view="create"] #saMemberCreateRoot .sa-member-agent-prefix-bar, html body.sa-app[data-sa-view="password"] #saViewPassword input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html body.sa-app[data-sa-view="report"] #saViewReport .sa-report-2d__week-arrow, html body.sa-app[data-sa-view="report"] #saViewReport .sa-report-2d__toggle, html[data-glass-page="member.create"] body.sa-app #saMemberCreateRoot input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-glass-page="member.create"] body.sa-app #saMemberCreateRoot select, html[data-glass-page="member.create"] body.sa-app #saViewPassword input:not([type="checkbox"]):not([type="radio"]):not([type="range"]) { background: var(--glass-l3-bg) !important; background-image: none !important; border: var(--glass-l3-border) !important; border-top-color: var(--glass-l3-border-top) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; box-shadow: var(--glass-l3-shadow) !important; color: var(--glass-l3-ink) !important; -webkit-text-fill-color: var(--glass-l3-ink) !important; border-radius: var(--glass-l3-radius) !important; } html[data-theme="light"] body.sa-app[data-sa-view="create"] #saMemberCreateRoot input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-theme="light"] body.sa-app[data-sa-view="create"] #saMemberCreateRoot select, html[data-theme="light"] body.sa-app[data-sa-view="password"] #saViewPassword input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-theme="light"][data-glass-page="member.create"] body.sa-app #saMemberCreateRoot input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), html[data-theme="light"][data-glass-page="member.create"] body.sa-app #saMemberCreateRoot select { color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; } /* 2D/3D agent-list tree panel — same L2 surface as other main panels */ html[data-glass-page^="main"] .main-board-aside--win-tree, html[data-glass-page^="main"] .main-board-aside--dense-list, html[data-theme="light"][data-glass-page^="main"] .main-board-aside--win-tree, html[data-theme="light"][data-glass-page^="main"] .main-board-aside--dense-list, body.main-board-page .main-board-aside--win-tree, body.main-board-page .main-board-aside--dense-list, html[data-theme="light"] body.main-board-page .main-board-aside--win-tree, html[data-theme="light"] body.main-board-page .main-board-aside--dense-list { /* Do NOT set background-color:transparent after this — it wipes rgba L2 fills */ background-color: var(--glass-l2-bg) !important; background-image: none !important; background: var(--glass-l2-bg) !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; box-shadow: var(--glass-l2-shadow) !important; /* Tree chrome vars ride L2/L3 master tokens */ --mb-win-agent-bg: var(--glass-l3-bg); --mb-win-agent-bg-hover: var(--glass-l3-bg-hover); --mb-win-agent-bg-selected: var(--glass-l3-bg-hover); --mb-win-all-agents-bg: var(--glass-l3-bg); --mb-win-all-agents-bg-hover: var(--glass-l3-bg-hover); --mb-win-all-agents-bg-selected: var(--glass-l3-bg-hover); } html[data-glass-page^="main"] .main-board-aside--win-tree::before, html[data-glass-page^="main"] .main-board-aside--dense-list::before, html[data-glass-page^="main"] .main-board-aside::before, body.main-board-page .main-board-aside--win-tree::before, body.main-board-page .main-board-aside--dense-list::before, body.main-board-page .main-board-aside::before { content: none !important; display: none !important; background: none !important; } html[data-glass-page^="main"] .main-board-aside--win-tree .main-board-user-list, html[data-theme="light"][data-glass-page^="main"] .main-board-aside--win-tree .main-board-user-list, body.main-board-page .main-board-aside--win-tree .main-board-user-list, html[data-theme="light"] body.main-board-page .main-board-aside--win-tree .main-board-user-list { background: transparent !important; background-image: none !important; box-shadow: none !important; } html[data-glass-page^="main"] .main-board-aside--win-tree .main-board-aside-title, html[data-theme="light"][data-glass-page^="main"] .main-board-aside--win-tree .main-board-aside-title, body.main-board-page .main-board-aside--win-tree .main-board-aside-title, html[data-theme="light"] body.main-board-page .main-board-aside--win-tree .main-board-aside-title { background: var(--glass-l3-bg) !important; background-image: none !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; border: var(--glass-l3-border) !important; box-shadow: var(--glass-l3-shadow) !important; color: var(--glass-ink) !important; } /* Sub-agent header — brand tint ON TOP of L2 token (still tunable via --glass-l2-bg) */ html body.sa-app .sa-header, html[data-theme="light"] body.sa-app .sa-header, html body.light-theme.sa-app .sa-header, html body.dark-theme.sa-app .sa-header { background: linear-gradient(180deg, rgba(115, 96, 242, 0.35) 0%, rgba(91, 74, 203, 0.18) 100%), var(--glass-l2-bg) !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: none !important; border-bottom: var(--glass-l2-border) !important; box-shadow: var(--glass-l2-shadow) !important; } /* ========== Layer 3 lock — explicit glass controls only ========== */ /* (Do not force all .btn — hub/role brand gradients stay intact) */ .glass-l3, .glass-btn { background: var(--glass-l3-bg) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; border: var(--glass-l3-border) !important; box-shadow: var(--glass-l3-shadow) !important; color: var(--glass-l3-ink) !important; } /* * Dashboard sidebar sub-headings (Period / Member / Summary / Report / Delete) * Dark — keep frosted dark glass (do not flatten). * Light — one shared soft-slate fill (readable on light pad; left accent stays). */ html[data-theme="light"] #dashboardGrid .cell--sidebar .submenu, html[data-theme="light"] body.light-theme #dashboardGrid .cell--sidebar .submenu { background: rgba(148, 163, 184, 0.18) !important; background-color: rgba(148, 163, 184, 0.18) !important; background-image: none !important; -webkit-backdrop-filter: blur(12px) saturate(1.15) !important; backdrop-filter: blur(12px) saturate(1.15) !important; border-top: 1px solid rgba(148, 163, 184, 0.35) !important; box-shadow: none !important; } html[data-theme="light"] #dashboardGrid .cell--sidebar .submenu .nav-item, html[data-theme="light"] #dashboardGrid .nav-row--period .submenu .nav-item, html[data-theme="light"] #dashboardGrid .nav-row--member .submenu .nav-item, html[data-theme="light"] #dashboardGrid .nav-row--summary .submenu .nav-item, html[data-theme="light"] #dashboardGrid .nav-row--report .submenu .nav-item, html[data-theme="light"] #dashboardGrid .nav-row--delete .submenu .nav-item, html[data-theme="light"] body.light-theme #dashboardGrid .cell--sidebar .submenu .nav-item, html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="period.2d"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="period.3d"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="member.agent"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="member.create"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="member.leader-create"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="summary.2d"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="summary.3d"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="report.2d-admin"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="report.2d-agent"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="report.3d-admin"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="report.3d-agent"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="delete.2d"], html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key="delete.3d"] { /* Shared light fill — same for every sub heading */ background: rgba(100, 116, 139, 0.22) !important; background-color: rgba(100, 116, 139, 0.22) !important; background-image: none !important; -webkit-backdrop-filter: blur(10px) saturate(1.2) !important; backdrop-filter: blur(10px) saturate(1.2) !important; color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; border: 1px solid rgba(100, 116, 139, 0.38) !important; border-left: 3px solid color-mix(in srgb, var(--sub-accent, #2563eb) 85%, #64748b) !important; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.55) !important; border-radius: 10px !important; } html[data-theme="light"] #dashboardGrid .cell--sidebar .submenu .nav-item:hover, html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key]:hover { background: rgba(100, 116, 139, 0.34) !important; background-color: rgba(100, 116, 139, 0.34) !important; color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; border-left-color: var(--sub-accent, #2563eb) !important; } html[data-theme="light"] #dashboardGrid .cell--sidebar .submenu .nav-item--active, html[data-theme="light"] .cell--sidebar .submenu .nav-item[data-nav-key].nav-item--active { background: rgba(59, 130, 246, 0.28) !important; background-color: rgba(59, 130, 246, 0.28) !important; color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; border: 1px solid rgba(59, 130, 246, 0.45) !important; border-left: 3px solid var(--sub-accent, #1d4ed8) !important; box-shadow: inset 3px 0 0 var(--sub-accent, #1d4ed8), 0 1px 3px rgba(37, 99, 235, 0.18) !important; } /* ========== 2D/3D Agent report tree — 3-step hierarchy (size + color) ========== * L1 Agent = tallest + blue * L2 Sub + direct = one step smaller + teal * L3 under Sub = smallest + sky */ html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-agent-header-btn, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-agent-header-btn, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-agent-header-btn[data-role="agent"], html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-agent-header-btn[data-role="agent"], #dashboardGrid .report-2d-agent-panel button.main-board-agent-header-btn, #dashboardGrid .report-3d-agent-panel button.main-board-agent-header-btn, #dashboardGrid .report-2d-agent-panel button.main-board-agent-header-btn[data-role="agent"], #dashboardGrid .report-3d-agent-panel button.main-board-agent-header-btn[data-role="agent"] { flex: 0 0 auto !important; min-height: 1.95rem !important; max-height: 1.95rem !important; height: 1.95rem !important; padding: 0.22rem 0.45rem !important; box-sizing: border-box !important; font-size: 0.88rem !important; overflow: hidden !important; } html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-agent-header-btn .main-board-agent-title, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-agent-header-btn .main-board-agent-title, #dashboardGrid .report-2d-agent-panel button.main-board-agent-header-btn .main-board-agent-title, #dashboardGrid .report-3d-agent-panel button.main-board-agent-header-btn .main-board-agent-title { font-size: 0.88rem !important; font-weight: 700 !important; line-height: 1.1 !important; } /* L2 — Sub-agent + agent-direct Member — teal */ html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-sub-agent-header-btn, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-sub-agent-header-btn, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn:not(.main-board-member-btn--nested):not(.main-board-member-btn--tier3), html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn:not(.main-board-member-btn--nested):not(.main-board-member-btn--tier3), #dashboardGrid .report-2d-agent-panel button.main-board-sub-agent-header-btn, #dashboardGrid .report-3d-agent-panel button.main-board-sub-agent-header-btn, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn:not(.main-board-member-btn--nested):not(.main-board-member-btn--tier3), #dashboardGrid .report-3d-agent-panel button.main-board-member-btn:not(.main-board-member-btn--nested):not(.main-board-member-btn--tier3) { flex: 0 0 auto !important; min-height: 1.4rem !important; max-height: 1.4rem !important; height: 1.4rem !important; padding: 0.1rem 0.34rem !important; box-sizing: border-box !important; font-size: 0.74rem !important; overflow: hidden !important; background: #ccfbf1 !important; background-color: #ccfbf1 !important; background-image: none !important; color: #022c22 !important; -webkit-text-fill-color: #022c22 !important; border: 1px solid #5eead4 !important; border-left: 3px solid #14b8a6 !important; border-radius: 7px !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; filter: none !important; text-shadow: none !important; } html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-sub-agent-header-btn.selected, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-sub-agent-header-btn.selected, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2.selected, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2.selected, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-sub-agent-header-btn.is-active, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-sub-agent-header-btn.is-active, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2.is-active, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2.is-active, #dashboardGrid .report-2d-agent-panel button.main-board-sub-agent-header-btn.selected, #dashboardGrid .report-3d-agent-panel button.main-board-sub-agent-header-btn.selected, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2.selected, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2.selected, #dashboardGrid .report-2d-agent-panel button.main-board-sub-agent-header-btn.is-active, #dashboardGrid .report-3d-agent-panel button.main-board-sub-agent-header-btn.is-active, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2.is-active, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2.is-active { background: #99f6e4 !important; background-color: #99f6e4 !important; color: #022c22 !important; -webkit-text-fill-color: #022c22 !important; border-left-color: #0f766e !important; } html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-title, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-title, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .main-board-org-tier1__name, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .main-board-org-tier1__name, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2 .main-board-member-btn__label, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2 .main-board-member-btn__label, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-caret, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-caret, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-title, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-title, #dashboardGrid .report-2d-agent-panel .main-board-org-tier1__name, #dashboardGrid .report-3d-agent-panel .main-board-org-tier1__name, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier2 .main-board-member-btn__label, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier2 .main-board-member-btn__label, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-caret, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-caret { font-size: 0.74rem !important; font-weight: 700 !important; line-height: 1.05 !important; color: inherit !important; -webkit-text-fill-color: inherit !important; background: transparent !important; box-shadow: none !important; } /* L3 — members under Sub-agent — smallest + sky */ html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-members button.main-board-member-btn, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-members button.main-board-member-btn, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-members button.main-board-member-btn, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-members button.main-board-member-btn, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested { flex: 0 0 auto !important; min-height: 1.05rem !important; max-height: 1.05rem !important; height: 1.05rem !important; padding: 0.02rem 0.28rem !important; box-sizing: border-box !important; font-size: 0.64rem !important; overflow: hidden !important; background: #e0f2fe !important; background-color: #e0f2fe !important; background-image: none !important; color: #0c4a6e !important; -webkit-text-fill-color: #0c4a6e !important; border: 1px solid #7dd3fc !important; border-left: 3px solid #0284c7 !important; border-radius: 7px !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; filter: none !important; text-shadow: none !important; } html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.selected, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.selected, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3.selected, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3.selected, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested.selected, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested.selected, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.is-active, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.is-active, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3.is-active, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3.is-active, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested.is-active, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested.is-active, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.selected, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.selected, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3.selected, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3.selected, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested.selected, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested.selected, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.is-active, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-members button.main-board-member-btn.is-active, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3.is-active, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3.is-active, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested.is-active, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested.is-active { background: #bae6fd !important; background-color: #bae6fd !important; color: #0c4a6e !important; -webkit-text-fill-color: #0c4a6e !important; border-left-color: #0369a1 !important; } html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested .main-board-member-btn__label, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested .main-board-member-btn__label, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3 .main-board-member-btn__label, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3 .main-board-member-btn__label, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--nested .main-board-member-btn__label, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--nested .main-board-member-btn__label, #dashboardGrid .report-2d-agent-panel button.main-board-member-btn--tier3 .main-board-member-btn__label, #dashboardGrid .report-3d-agent-panel button.main-board-member-btn--tier3 .main-board-member-btn__label { font-size: 0.64rem !important; font-weight: 700 !important; line-height: 1.05 !important; color: inherit !important; -webkit-text-fill-color: inherit !important; background: transparent !important; box-shadow: none !important; } /* Report tree caret — closed ">" · open "v" (never rotate to "<") */ #dashboardGrid .report-2d-agent-panel .main-board-agent-caret, #dashboardGrid .report-3d-agent-panel .main-board-agent-caret, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-caret, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-caret, #dashboardGrid .report-2d-agent-panel .rp2d-tree-sub__chev, #dashboardGrid .report-2d-agent-panel .rp3d-tree-sub__chev, #dashboardGrid .report-3d-agent-panel .rp2d-tree-sub__chev, #dashboardGrid .report-3d-agent-panel .rp3d-tree-sub__chev { transform: none !important; } #dashboardGrid .report-2d-agent-panel .main-board-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-agent-caret::before, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-caret::before, #dashboardGrid .report-2d-agent-panel .rp2d-tree-sub__chev::before, #dashboardGrid .report-2d-agent-panel .rp3d-tree-sub__chev::before, #dashboardGrid .report-3d-agent-panel .rp2d-tree-sub__chev::before, #dashboardGrid .report-3d-agent-panel .rp3d-tree-sub__chev::before { content: ">" !important; transform: none !important; } #dashboardGrid .report-2d-agent-panel .main-board-agent-block.is-expanded > .main-board-agent-header-btn .main-board-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-agent-block.is-expanded > .main-board-agent-header-btn .main-board-agent-caret::before, #dashboardGrid .report-2d-agent-panel .main-board-agent-block:not(.collapsed) > .main-board-agent-header-btn .main-board-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-agent-block:not(.collapsed) > .main-board-agent-header-btn .main-board-agent-caret::before, #dashboardGrid .report-2d-agent-panel .main-board-agent-header-btn[aria-expanded="true"] .main-board-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-agent-header-btn[aria-expanded="true"] .main-board-agent-caret::before, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-block.is-expanded > .main-board-sub-agent-header-btn .main-board-sub-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-block.is-expanded > .main-board-sub-agent-header-btn .main-board-sub-agent-caret::before, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-block:not(.collapsed) > .main-board-sub-agent-header-btn .main-board-sub-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-block:not(.collapsed) > .main-board-sub-agent-header-btn .main-board-sub-agent-caret::before, #dashboardGrid .report-2d-agent-panel .main-board-sub-agent-header-btn[aria-expanded="true"] .main-board-sub-agent-caret::before, #dashboardGrid .report-3d-agent-panel .main-board-sub-agent-header-btn[aria-expanded="true"] .main-board-sub-agent-caret::before { content: "v" !important; transform: none !important; } /* ========== Role buttons — Announce-style colors (system-wide) ========== * Beats page .btn:hover white film. Skips hub brand .btn--admin/agent/member * and tree pills (those are not .btn--*). */ #dashboardGrid .btn--primary, #dashboardGrid[data-workspace-view] .btn--primary, #dashboardGrid .pp-btn--primary, #dashboardGrid[data-workspace-view] .pp-btn--primary, html body.sa-app .btn--primary, body.main-board-page .btn--primary, html[data-glass-page] .btn--primary { background: var(--glass-l3-primary-bg) !important; color: var(--glass-l3-primary-ink) !important; -webkit-text-fill-color: var(--glass-l3-primary-ink) !important; border: var(--glass-l3-border) !important; border-top-color: var(--glass-l3-border-top) !important; border-radius: var(--glass-l3-radius) !important; box-shadow: var(--glass-l3-shadow) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; } #dashboardGrid .btn--primary:hover, #dashboardGrid[data-workspace-view] .btn--primary:hover, #dashboardGrid .pp-btn--primary:hover, #dashboardGrid[data-workspace-view] .pp-btn--primary:hover, html body.sa-app .btn--primary:hover, body.main-board-page .btn--primary:hover, html[data-glass-page] .btn--primary:hover { background: var(--glass-l3-primary-bg-hover) !important; color: var(--glass-l3-primary-ink) !important; -webkit-text-fill-color: var(--glass-l3-primary-ink) !important; } #dashboardGrid .btn--danger, #dashboardGrid .btn--signout, #dashboardGrid[data-workspace-view] .btn--danger, #dashboardGrid[data-workspace-view] .btn--signout, #dashboardGrid .pp-btn--danger, #dashboardGrid[data-workspace-view] .pp-btn--danger, html body.sa-app .btn--danger, body.main-board-page .btn--danger, body.main-board-page .btn--signout, html[data-glass-page] .btn--danger, html[data-glass-page] .btn--signout { background: var(--glass-l3-danger-bg) !important; color: var(--glass-l3-danger-ink) !important; -webkit-text-fill-color: var(--glass-l3-danger-ink) !important; border: var(--glass-l3-border) !important; border-top-color: var(--glass-l3-border-top) !important; border-radius: var(--glass-l3-radius) !important; box-shadow: var(--glass-l3-shadow) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; } #dashboardGrid .btn--danger:hover, #dashboardGrid .btn--signout:hover, #dashboardGrid[data-workspace-view] .btn--danger:hover, #dashboardGrid[data-workspace-view] .btn--signout:hover, #dashboardGrid .pp-btn--danger:hover, #dashboardGrid[data-workspace-view] .pp-btn--danger:hover, html body.sa-app .btn--danger:hover, body.main-board-page .btn--danger:hover, body.main-board-page .btn--signout:hover, html[data-glass-page] .btn--danger:hover, html[data-glass-page] .btn--signout:hover { background: var(--glass-l3-danger-bg-hover) !important; color: var(--glass-l3-danger-ink) !important; -webkit-text-fill-color: var(--glass-l3-danger-ink) !important; } #dashboardGrid .btn--ghost, #dashboardGrid[data-workspace-view] .btn--ghost, html body.sa-app .btn--ghost, body.main-board-page .btn--ghost, html[data-glass-page] .btn--ghost { background: var(--glass-l3-ghost-bg) !important; color: var(--glass-l3-ghost-ink) !important; -webkit-text-fill-color: var(--glass-l3-ghost-ink) !important; border: var(--glass-l3-border) !important; border-top-color: var(--glass-l3-border-top) !important; border-radius: var(--glass-l3-radius) !important; box-shadow: var(--glass-l3-shadow) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; } #dashboardGrid .btn--ghost:hover, #dashboardGrid[data-workspace-view] .btn--ghost:hover, html body.sa-app .btn--ghost:hover, body.main-board-page .btn--ghost:hover, html[data-glass-page] .btn--ghost:hover { background: var(--glass-l3-ghost-bg-hover) !important; color: var(--glass-l3-ghost-ink) !important; -webkit-text-fill-color: var(--glass-l3-ghost-ink) !important; } #dashboardGrid .btn--dark, #dashboardGrid[data-workspace-view] .btn--dark, html body.sa-app .btn--dark, body.main-board-page .btn--dark, html[data-glass-page] .btn--dark { background: var(--glass-l3-dark-bg) !important; color: var(--glass-l3-dark-ink) !important; -webkit-text-fill-color: var(--glass-l3-dark-ink) !important; border: var(--glass-l3-border) !important; border-top-color: var(--glass-l3-border-top) !important; border-radius: var(--glass-l3-radius) !important; box-shadow: var(--glass-l3-shadow) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; } #dashboardGrid .btn--dark:hover, #dashboardGrid[data-workspace-view] .btn--dark:hover, html body.sa-app .btn--dark:hover, body.main-board-page .btn--dark:hover, html[data-glass-page] .btn--dark:hover { background: var(--glass-l3-dark-bg-hover) !important; color: var(--glass-l3-dark-ink) !important; -webkit-text-fill-color: var(--glass-l3-dark-ink) !important; } #dashboardGrid .pp-btn--secondary, #dashboardGrid[data-workspace-view] .pp-btn--secondary, #dashboardGrid .btn--secondary, #dashboardGrid[data-workspace-view] .btn--secondary { background: var(--glass-l3-secondary-bg) !important; color: var(--glass-l3-secondary-ink) !important; -webkit-text-fill-color: var(--glass-l3-secondary-ink) !important; border: var(--glass-l3-border) !important; border-top-color: var(--glass-l3-border-top) !important; border-radius: var(--glass-l3-radius) !important; box-shadow: var(--glass-l3-shadow) !important; -webkit-backdrop-filter: var(--glass-l3-blur) !important; backdrop-filter: var(--glass-l3-blur) !important; } #dashboardGrid .pp-btn--secondary:hover, #dashboardGrid[data-workspace-view] .pp-btn--secondary:hover, #dashboardGrid .btn--secondary:hover, #dashboardGrid[data-workspace-view] .btn--secondary:hover { background: var(--glass-l3-secondary-bg-hover) !important; color: var(--glass-l3-secondary-ink) !important; -webkit-text-fill-color: var(--glass-l3-secondary-ink) !important; } #dashboardGrid .btn--success, #dashboardGrid[data-workspace-view] .btn--success, html body.sa-app .btn--success { background: var(--glass-l3-success-bg) !important; color: var(--glass-l3-success-ink) !important; -webkit-text-fill-color: var(--glass-l3-success-ink) !important; border: var(--glass-l3-border) !important; border-radius: var(--glass-l3-radius) !important; } #dashboardGrid .btn--success:hover, #dashboardGrid[data-workspace-view] .btn--success:hover, html body.sa-app .btn--success:hover { background: var(--glass-l3-success-bg-hover) !important; color: var(--glass-l3-success-ink) !important; -webkit-text-fill-color: var(--glass-l3-success-ink) !important; } /* ========== Topbar SET/Val/W/Status — 5s poll flash (beats page glass L3) ========== */ @keyframes staff-tb-flash-keyframes { 0%, 40% { background: #bae6fd; background-color: #bae6fd; box-shadow: 0 0 6px 2px rgba(56, 189, 248, 0.45); border-color: #38bdf8; } 100% { background: var(--toolbar-live-set-bg, #f0fdf4); background-color: var(--toolbar-live-set-bg, #f0fdf4); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04); border-color: var(--toolbar-live-set-border, #86efac); } } html[data-theme="light"] #dashboardGrid .cell--topbar .tb-box.flash-highlight, html[data-theme="light"] #dashboardGrid[data-workspace-view] .cell--topbar .tb-box.flash-highlight, #dashboardGrid .cell--topbar .tb-box.flash-highlight, #dashboardGrid[data-workspace-view] .cell--topbar .tb-box.flash-highlight, html[data-theme="light"] body.main-board-page .my-header .tb-box.flash-highlight, body.main-board-page .my-header .tb-box.flash-highlight { background: #bae6fd !important; background-color: #bae6fd !important; background-image: none !important; box-shadow: 0 0 6px 2px rgba(56, 189, 248, 0.45) !important; border-color: #38bdf8 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; animation: staff-tb-flash-keyframes 1.5s ease-out !important; } html[data-theme="light"] #dashboardGrid .cell--topbar .tb-box.tb-box--poll-tick, html[data-theme="light"] #dashboardGrid[data-workspace-view] .cell--topbar .tb-box.tb-box--poll-tick, #dashboardGrid .cell--topbar .tb-box.tb-box--poll-tick, #dashboardGrid[data-workspace-view] .cell--topbar .tb-box.tb-box--poll-tick, html[data-theme="light"] body.main-board-page .my-header .tb-box.tb-box--poll-tick, body.main-board-page .my-header .tb-box.tb-box--poll-tick { animation: staff-tb-flash-keyframes 1.5s ease-out !important; } html[data-theme="light"] #dashboardGrid .cell--topbar .tb-box.flash-highlight.tb-box--poll-tick, #dashboardGrid .cell--topbar .tb-box.flash-highlight.tb-box--poll-tick, body.main-board-page .my-header .tb-box.flash-highlight.tb-box--poll-tick { animation: staff-tb-flash-keyframes 1.5s ease-out !important; } /* Topbar clock — white on dark, black on light */ html .cell--topbar .topbar-clock, html .cell--topbar .topbar-clock__time, html .cell--topbar .topbar-clock__date, html .my-header .topbar-clock, html .my-header .topbar-clock__time, html .my-header .topbar-clock__date, html body.dark-theme .cell--topbar .topbar-clock, html body.dark-theme .cell--topbar .topbar-clock__time, html body.dark-theme .cell--topbar .topbar-clock__date, html body.dark-theme .my-header .topbar-clock, html body.dark-theme .my-header .topbar-clock__time, html body.dark-theme .my-header .topbar-clock__date { color: #f8fafc !important; -webkit-text-fill-color: #f8fafc !important; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important; opacity: 1 !important; } html[data-theme="light"] .cell--topbar .topbar-clock, html[data-theme="light"] .cell--topbar .topbar-clock__time, html[data-theme="light"] .cell--topbar .topbar-clock__date, html[data-theme="light"] .my-header .topbar-clock, html[data-theme="light"] .my-header .topbar-clock__time, html[data-theme="light"] .my-header .topbar-clock__date, html[data-theme="light"] .my-header #topbarClock, html[data-theme="light"] .my-header #topbarClock .topbar-clock__time, html[data-theme="light"] .grid-20x15-container:has(.my-workspace--full) .my-header .topbar-clock, html[data-theme="light"] .grid-20x15-container:has(.my-workspace--full) .my-header .topbar-clock__time, html[data-theme="light"] .grid-20x15-container:has(.my-workspace--full) .my-header #topbarClock, html[data-theme="light"] .grid-20x15-container:has(.my-workspace--full) .my-header #topbarClock .topbar-clock__time, html body.light-theme .cell--topbar .topbar-clock, html body.light-theme .cell--topbar .topbar-clock__time, html body.light-theme .cell--topbar .topbar-clock__date, html body.light-theme .my-header .topbar-clock, html body.light-theme .my-header .topbar-clock__time, html body.light-theme .my-header .topbar-clock__date, html body.light-theme .grid-20x15-container:has(.my-workspace--full) .my-header .topbar-clock, html body.light-theme .grid-20x15-container:has(.my-workspace--full) .my-header .topbar-clock__time, html body.light-theme .grid-20x15-container:has(.my-workspace--full) .my-header #topbarClock .topbar-clock__time { color: #000000 !important; -webkit-text-fill-color: #000000 !important; background: transparent !important; background-color: transparent !important; background-image: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; text-shadow: none !important; opacity: 1 !important; filter: none !important; } /* Light — member / agent tree panels → Layer 2 (kill solid #f1f5f9 / #fff fills) */ html[data-theme="light"] .main-board-shell .main-board-aside--win-tree, html[data-theme="light"] body.main-board-page .main-board-aside--win-tree, html[data-theme="light"] #dashboardGrid #memberAgentPanel .admin-agent-settings-name-list, html[data-theme="light"] #dashboardGrid #memberAgentPanel .admin-agent-settings-name-list.main-board-aside--win-tree, html[data-theme="light"] #dashboardGrid .report-2d-member-panel .rp2d-member-list, html[data-theme="light"] #dashboardGrid .report-2d-member-panel .rp2d-member-list--tree, html[data-theme="light"] #dashboardGrid .report-3d-member-panel .rp3d-member-list, html[data-theme="light"] #dashboardGrid .report-3d-member-panel .rp3d-member-list--tree, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .rp2d-member-list, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .rp2d-member-list--tree, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .rp3d-member-list, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .rp3d-member-list--tree, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .main-board-aside--win-tree, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .main-board-aside--win-tree, html body.light-theme .main-board-shell .main-board-aside--win-tree, html body.light-theme #dashboardGrid #memberAgentPanel .admin-agent-settings-name-list, html body.light-theme #dashboardGrid .report-2d-member-panel .rp2d-member-list, html body.light-theme #dashboardGrid .report-2d-member-panel .rp2d-member-list--tree, html body.light-theme #dashboardGrid .report-2d-agent-panel .rp2d-member-list--tree { /* background-color AFTER shorthand so rgba L2 is not wiped to transparent */ background-image: none !important; background-color: var(--glass-l2-bg) !important; -webkit-backdrop-filter: var(--glass-l2-blur) !important; backdrop-filter: var(--glass-l2-blur) !important; border: var(--glass-l2-border) !important; border-top: var(--glass-l2-border-top) !important; box-shadow: var(--glass-l2-shadow) !important; } html[data-theme="light"] #dashboardGrid .report-2d-member-panel .rp2d-member-list__scroll, html[data-theme="light"] #dashboardGrid .report-2d-agent-panel .rp2d-member-list__scroll, html[data-theme="light"] #dashboardGrid .report-3d-member-panel .rp3d-member-list__scroll, html[data-theme="light"] #dashboardGrid .report-3d-agent-panel .rp3d-member-list__scroll, html[data-theme="light"] .main-board-shell .main-board-aside--win-tree .main-board-user-list, html[data-theme="light"] #dashboardGrid #memberAgentPanel .admin-agent-settings-name-list .main-board-user-list { background: transparent !important; background-image: none !important; } /* Theme