/* SetiAI premium design mode. All product-surface rules are opt-in via data-design-mode. */

.theme-mode-divider {
    height: 1px;
    margin: 0.45rem 0;
    background: rgba(148, 163, 184, 0.18);
}

.design-mode-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.45rem 0.65rem 0.35rem;
    color: #94a3b8;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.design-mode-btn.active {
    background: rgba(14, 165, 233, 0.14);
    color: #e0f2fe;
}

html[data-theme="light"] .design-mode-label,
html[data-design-mode="setiai-board"] .design-mode-label {
    color: #64748b;
}

html[data-theme="light"] .design-mode-btn.active,
html[data-design-mode="setiai-board"] .design-mode-btn.active {
    background: rgba(14, 165, 233, 0.12);
    color: #075985;
}

html[data-design-transition="active"] body,
html[data-design-transition="active"] .glass,
html[data-design-transition="active"] .glass-effect,
html[data-design-transition="active"] .public-shell-section,
html[data-design-transition="active"] .public-surface-card,
html[data-design-transition="active"] .notification-card,
html[data-design-transition="active"] .settings-card,
html[data-design-transition="active"] .security-card,
html[data-design-transition="active"] .sales-card,
html[data-design-transition="active"] .dashboard-card,
html[data-design-transition="active"] .stat-card,
html[data-design-transition="active"] .metric-card {
    transition-property: background-color, background, border-color, box-shadow, color, transform;
    transition-duration: 240ms;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

html[data-design-mode="setiai-board"] {
    color-scheme: light;
    --setiai-board-page: #eef4fb;
    --setiai-board-page-strong: #f8fbff;
    --setiai-board-surface: rgba(255, 255, 255, 0.94);
    --setiai-board-surface-strong: rgba(255, 255, 255, 0.98);
    --setiai-board-border: rgba(148, 163, 184, 0.18);
    --setiai-board-text: #0f172a;
    --setiai-board-muted: #64748b;
    --setiai-board-soft: #eaf2fb;
    --setiai-board-accent: #2563eb;
    --setiai-board-accent-soft: rgba(37, 99, 235, 0.1);
    --setiai-board-shadow: 0 22px 48px rgba(148, 163, 184, 0.16);
    --setiai-board-shadow-soft: 0 12px 28px rgba(148, 163, 184, 0.12);
}

html[data-design-mode="setiai-board"] body {
    background:
        radial-gradient(circle at 18% 0%, rgba(14, 165, 233, 0.09), transparent 32rem),
        linear-gradient(180deg, var(--setiai-board-page-strong) 0%, var(--setiai-board-page) 100%) !important;
    color: var(--setiai-board-text) !important;
    -webkit-font-smoothing: antialiased;
}

html[data-design-mode="setiai-board"] h1,
html[data-design-mode="setiai-board"] h2,
html[data-design-mode="setiai-board"] h3,
html[data-design-mode="setiai-board"] h4,
html[data-design-mode="setiai-board"] .font-bold,
html[data-design-mode="setiai-board"] .font-black,
html[data-design-mode="setiai-board"] .text-white {
    color: var(--setiai-board-text) !important;
    letter-spacing: 0;
}

html[data-design-mode="setiai-board"] p,
html[data-design-mode="setiai-board"] .text-gray-300,
html[data-design-mode="setiai-board"] .text-gray-400,
html[data-design-mode="setiai-board"] .text-gray-500,
html[data-design-mode="setiai-board"] .text-slate-500,
html[data-design-mode="setiai-board"] .text-slate-600 {
    color: var(--setiai-board-muted) !important;
}

html[data-design-mode="setiai-board"] .glass,
html[data-design-mode="setiai-board"] .glass-effect,
html[data-design-mode="setiai-board"] .public-shell-section,
html[data-design-mode="setiai-board"] .public-surface-card,
html[data-design-mode="setiai-board"] .public-footer-shell,
html[data-design-mode="setiai-board"] .notification-card,
html[data-design-mode="setiai-board"] .settings-card,
html[data-design-mode="setiai-board"] .security-card,
html[data-design-mode="setiai-board"] .sales-card,
html[data-design-mode="setiai-board"] .dashboard-card,
html[data-design-mode="setiai-board"] .stat-card,
html[data-design-mode="setiai-board"] .metric-card,
html[data-design-mode="setiai-board"] .agent-card,
html[data-design-mode="setiai-board"] .integration-card,
html[data-design-mode="setiai-board"] .chart-container,
html[data-design-mode="setiai-board"] .pricing-detail-feature-card,
html[data-design-mode="setiai-board"] .reset-card {
    background: linear-gradient(180deg, var(--setiai-board-surface-strong), var(--setiai-board-surface)) !important;
    border-color: var(--setiai-board-border) !important;
    box-shadow: var(--setiai-board-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
    color: var(--setiai-board-text) !important;
    backdrop-filter: blur(16px) saturate(150%);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
}

html[data-design-mode="setiai-board"] .public-shell-section,
html[data-design-mode="setiai-board"] .glass,
html[data-design-mode="setiai-board"] .glass-effect {
    border-radius: 1.25rem !important;
}

html[data-design-mode="setiai-board"] .public-surface-card,
html[data-design-mode="setiai-board"] .notification-card,
html[data-design-mode="setiai-board"] .settings-card,
html[data-design-mode="setiai-board"] .security-card,
html[data-design-mode="setiai-board"] .stat-card,
html[data-design-mode="setiai-board"] .metric-card,
html[data-design-mode="setiai-board"] .agent-card,
html[data-design-mode="setiai-board"] .integration-card {
    border-radius: 0.95rem !important;
}

html[data-design-mode="setiai-board"] .notification-card:hover,
html[data-design-mode="setiai-board"] .public-surface-card:hover,
html[data-design-mode="setiai-board"] .stat-card:hover,
html[data-design-mode="setiai-board"] .metric-card:hover,
html[data-design-mode="setiai-board"] .agent-card:hover,
html[data-design-mode="setiai-board"] .integration-card:hover {
    border-color: rgba(37, 99, 235, 0.22) !important;
    box-shadow: 0 26px 54px rgba(96, 165, 250, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transform: translateY(-1px);
}

html[data-design-mode="setiai-board"] .public-nav,
html[data-design-mode="setiai-board"] .unified-nav,
html[data-design-mode="setiai-board"] .sidebar,
html[data-design-mode="setiai-board"] .nav-container {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 18px 40px rgba(148, 163, 184, 0.14) !important;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
}

html[data-design-mode="setiai-board"] .nav-item,
html[data-design-mode="setiai-board"] .menu-item,
html[data-design-mode="setiai-board"] .public-nav-link,
html[data-design-mode="setiai-board"] .footer-link {
    color: #475569 !important;
}

html[data-design-mode="setiai-board"] .nav-item:hover,
html[data-design-mode="setiai-board"] .menu-item:hover,
html[data-design-mode="setiai-board"] .public-nav-link:hover,
html[data-design-mode="setiai-board"] .footer-link:hover {
    background: rgba(226, 232, 240, 0.72) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .nav-item.active,
html[data-design-mode="setiai-board"] .sidebar-nav-item.active {
    background: var(--setiai-board-accent-soft) !important;
    color: #1d4ed8 !important;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.18);
}

html[data-design-mode="setiai-board"] .unified-navigation .nav-container {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    max-width: none !important;
    gap: clamp(0.5rem, 0.8vw, 0.95rem) !important;
    padding: 0.65rem 0 !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .nav-logo {
    display: flex !important;
    width: auto !important;
    height: auto !important;
    min-width: max-content !important;
    background: transparent !important;
    border-radius: 0 !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .logo-link {
    align-items: baseline !important;
    font-size: 1.45rem !important;
    line-height: 1 !important;
    letter-spacing: -0.045em !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .logo-white {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .nav-search {
    flex: 0 1 12.5rem !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .search-input {
    width: min(12.5rem, 14vw) !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .nav-links {
    min-width: 0 !important;
    justify-content: center !important;
    gap: 0.15rem !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .nav-item {
    flex: 0 0 auto !important;
    gap: 0.26rem !important;
    padding: 0.48rem 0.38rem !important;
    font-size: 0.8rem !important;
}

html[data-design-mode="setiai-board"] .unified-navigation .nav-actions {
    gap: 0.5rem !important;
}

@media (max-width: 1360px) {
    html[data-design-mode="setiai-board"] .unified-navigation .nav-search {
        flex-basis: 11.25rem !important;
    }

    html[data-design-mode="setiai-board"] .unified-navigation .search-input {
        width: min(11.25rem, 13vw) !important;
    }

    html[data-design-mode="setiai-board"] .unified-navigation .nav-links {
        justify-content: flex-start !important;
        overflow-x: visible !important;
    }

    html[data-design-mode="setiai-board"] .unified-navigation .nav-links .nav-item {
        padding-inline: 0.52rem !important;
    }

    html[data-design-mode="setiai-board"] .unified-navigation .nav-links .nav-item span {
        display: none !important;
    }

    html[data-design-mode="setiai-board"] .unified-navigation .nav-links .nav-item.active span {
        display: inline-block !important;
        margin-left: 0.35rem !important;
    }
}

html[data-design-mode="setiai-board"] .notification-btn,
html[data-design-mode="setiai-board"] .user-btn,
html[data-design-mode="setiai-board"] .public-nav-btn,
html[data-design-mode="setiai-board"] .runtime-theme-trigger,
html[data-design-mode="setiai-board"] .filter-btn {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 251, 0.98)) !important;
    border-color: rgba(148, 163, 184, 0.2) !important;
    color: #334155 !important;
    box-shadow: var(--setiai-board-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

html[data-design-mode="setiai-board"] .btn-primary,
html[data-design-mode="setiai-board"] .public-nav-btn-primary,
html[data-design-mode="setiai-board"] button[type="submit"],
html[data-design-mode="setiai-board"] [class*="from-blue"] {
    box-shadow: 0 16px 34px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] input,
html[data-design-mode="setiai-board"] textarea,
html[data-design-mode="setiai-board"] select,
html[data-design-mode="setiai-board"] .form-input,
html[data-design-mode="setiai-board"] .form-textarea {
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(148, 163, 184, 0.22) !important;
    color: var(--setiai-board-text) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

html[data-design-mode="setiai-board"] input::placeholder,
html[data-design-mode="setiai-board"] textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] .modal,
html[data-design-mode="setiai-board"] .runtime-overlay-backdrop {
    background: rgba(15, 23, 42, 0.42) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

html[data-design-mode="setiai-board"] .modal-content,
html[data-design-mode="setiai-board"] .runtime-panel-surface,
html[data-design-mode="setiai-board"] .theme-menu,
html[data-design-mode="setiai-board"] .user-menu,
html[data-design-mode="setiai-board"] #notifications-dropdown {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 251, 0.98)) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    color: var(--setiai-board-text) !important;
    box-shadow: 0 28px 72px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

/* Messenger page: approved light board slice. Keep all rules scoped to the new design mode. */
html[data-design-mode="setiai-board"] body.messenger-page {
    background:
        radial-gradient(circle at 9% 12%, rgba(37, 99, 235, 0.1), transparent 28rem),
        radial-gradient(circle at 92% 18%, rgba(14, 165, 233, 0.08), transparent 24rem),
        linear-gradient(180deg, #fbfdff 0%, #eef4fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.messenger-page::before,
html[data-design-mode="setiai-board"] body.messenger-page::after {
    opacity: 0 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .setiai-app-shell {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    min-height: calc(100dvh - 7.75rem) !important;
    margin: 0 auto !important;
    padding-top: 1rem !important;
    padding-bottom: 1.4rem !important;
    gap: 1rem !important;
    align-items: stretch !important;
}

html[data-design-mode="setiai-board"] .messenger-page .ai-gradient {
    background: none !important;
    color: #2563eb !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .glass::before,
html[data-design-mode="setiai-board"] .messenger-page .modal-content::before,
html[data-design-mode="setiai-board"] .messenger-page .chat-item::before,
html[data-design-mode="setiai-board"] .messenger-page .sidebar::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar {
    width: clamp(19rem, 21vw, 21.5rem) !important;
    height: calc(100dvh - 7.75rem) !important;
    min-height: 45rem !important;
    padding: 0.85rem !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(247, 250, 254, 0.94)) !important;
    box-shadow: 0 24px 54px rgba(148, 163, 184, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    overflow: hidden !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-shell {
    gap: 0.78rem !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-panel {
    padding: 0.92rem !important;
    border: 1px solid rgba(203, 213, 225, 0.78) !important;
    border-radius: 1rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.9)) !important;
    box-shadow: 0 12px 28px rgba(148, 163, 184, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-panel--platforms {
    flex: 0 0 clamp(13.5rem, 27vh, 17.25rem) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-rail-grid {
    grid-template-rows: minmax(9.8rem, 1fr) minmax(8.8rem, 0.82fr) !important;
    gap: 0.78rem !important;
    flex: 0 0 clamp(16.75rem, 32vh, 20rem) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-panel--contacts {
    flex: 1 1 10.5rem !important;
    min-height: 8.5rem !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-panel--analysis {
    flex: 0 0 clamp(8.4rem, 16vh, 10.8rem) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-heading {
    padding-bottom: 0.55rem !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.95) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-kicker {
    display: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-title {
    color: #0f172a !important;
    font-size: 0.9rem !important;
    letter-spacing: -0.01em !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-meta {
    min-width: 2.25rem !important;
    background: #eef6ff !important;
    border-color: rgba(147, 197, 253, 0.72) !important;
    color: #1d4ed8 !important;
    font-variant-numeric: tabular-nums !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-note {
    display: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-scroll,
html[data-design-mode="setiai-board"] .messenger-page .chat-list-container,
html[data-design-mode="setiai-board"] .messenger-page #recentContactsContainer,
html[data-design-mode="setiai-board"] .messenger-page #messengerAnalysisContent {
    scrollbar-color: rgba(37, 99, 235, 0.22) transparent !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar-scroll::-webkit-scrollbar-thumb,
html[data-design-mode="setiai-board"] .messenger-page .chat-list-container::-webkit-scrollbar-thumb,
html[data-design-mode="setiai-board"] .messenger-page #recentContactsContainer::-webkit-scrollbar-thumb,
html[data-design-mode="setiai-board"] .messenger-page #messengerAnalysisContent::-webkit-scrollbar-thumb {
    background: rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .platform-item,
html[data-design-mode="setiai-board"] .messenger-page .chat-item,
html[data-design-mode="setiai-board"] .messenger-page #recentContactsContainer > *,
html[data-design-mode="setiai-board"] .messenger-page #messengerAnalysisContent > * {
    min-height: 3.2rem !important;
    margin-bottom: 0.42rem !important;
    padding: 0.62rem 0.68rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-left-width: 1px !important;
    border-radius: 0.88rem !important;
    background: rgba(255, 255, 255, 0.82) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
    transform: none !important;
    transition-property: background, border-color, box-shadow, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .platform-item:hover,
html[data-design-mode="setiai-board"] .messenger-page .chat-item:hover,
html[data-design-mode="setiai-board"] .messenger-page #recentContactsContainer > *:hover,
html[data-design-mode="setiai-board"] .messenger-page #messengerAnalysisContent > *:hover {
    border-color: rgba(37, 99, 235, 0.26) !important;
    background: #f8fbff !important;
    box-shadow: 0 10px 24px rgba(148, 163, 184, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .platform-item.active,
html[data-design-mode="setiai-board"] .messenger-page .chat-item.active {
    border-color: rgba(37, 99, 235, 0.38) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(219, 234, 254, 0.7)) !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.13), inset 0 0 0 1px rgba(37, 99, 235, 0.1) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .platform-icon,
html[data-design-mode="setiai-board"] .messenger-page .chat-item .w-10,
html[data-design-mode="setiai-board"] .messenger-page #currentChatAvatar,
html[data-design-mode="setiai-board"] .messenger-page #callAvatar,
html[data-design-mode="setiai-board"] .messenger-page #videoAvatar,
html[data-design-mode="setiai-board"] .messenger-page #infoChatAvatar {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), 0 8px 16px rgba(37, 99, 235, 0.16) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .chat-name,
html[data-design-mode="setiai-board"] .messenger-page .platform-item .font-medium {
    color: #0f172a !important;
    font-weight: 760 !important;
}

html[data-design-mode="setiai-board"] .messenger-page .platform-item [class*="text-[11px]"] {
    display: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .chat-preview,
html[data-design-mode="setiai-board"] .messenger-page .chat-meta,
html[data-design-mode="setiai-board"] .messenger-page .message-time,
html[data-design-mode="setiai-board"] .messenger-page .message-status,
html[data-design-mode="setiai-board"] .messenger-page .text-gray-300,
html[data-design-mode="setiai-board"] .messenger-page .text-gray-400,
html[data-design-mode="setiai-board"] .messenger-page .text-gray-500 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .messenger-page .unread-count,
html[data-design-mode="setiai-board"] .messenger-page .ai-badge {
    background: #2563eb !important;
    color: #ffffff !important;
    box-shadow: 0 8px 14px rgba(37, 99, 235, 0.18) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface {
    min-height: calc(100dvh - 7.75rem) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 254, 0.96)) !important;
    box-shadow: 0 24px 54px rgba(148, 163, 184, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.98) !important;
    overflow: hidden !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .glass {
    border-radius: 0 !important;
    border-width: 0 !important;
    background: rgba(255, 255, 255, 0.72) !important;
    box-shadow: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .glass:first-of-type {
    border-bottom: 1px solid rgba(226, 232, 240, 0.95) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .mb-4 {
    margin: 0 !important;
    padding: 0.9rem 1rem !important;
    border-width: 0 0 1px !important;
    border-color: rgba(226, 232, 240, 0.95) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, 0.72) !important;
    box-shadow: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .mb-4 p:first-child,
html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .mb-4 h2 + p,
html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .mb-4 .mt-4 {
    display: none !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .mb-4 h2 {
    font-size: 1rem !important;
    line-height: 1.35 !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface > .mb-4 p {
    max-width: 56rem !important;
    margin-top: 0.25rem !important;
    font-size: 0.83rem !important;
    line-height: 1.5 !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-stage {
    min-height: clamp(34rem, 61vh, 47rem) !important;
    max-height: none !important;
    background:
        linear-gradient(rgba(37, 99, 235, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37, 99, 235, 0.02) 1px, transparent 1px),
        #fbfdff !important;
    background-size: 42px 42px !important;
}

html[data-design-mode="setiai-board"] .messenger-page .chat-container {
    height: 100% !important;
    min-height: 0 !important;
    padding: clamp(1.25rem, 2vw, 2rem) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .chat-container:empty {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html[data-design-mode="setiai-board"] .messenger-page .chat-container:empty::before {
    content: "Сообщений пока нет\AНачните разговор или используйте быстрые действия справа.";
    width: min(100%, 28rem);
    padding: 1.25rem 1.4rem;
    border: 1px solid rgba(191, 219, 254, 0.74);
    border-radius: 1.1rem;
    background:
        radial-gradient(circle at 18% 18%, rgba(37, 99, 235, 0.12), transparent 7rem),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(239, 246, 255, 0.9));
    box-shadow: 0 18px 38px rgba(148, 163, 184, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.96);
    color: #475569;
    font-size: 0.92rem;
    font-weight: 650;
    line-height: 1.55;
    text-align: center;
    white-space: pre-line;
}

html[data-design-mode="setiai-board"] .messenger-page #messenger-loading {
    top: 5.65rem !important;
    right: max(1rem, calc((100vw - 1720px) / 2 + 1rem)) !important;
    padding: 0.7rem 1rem !important;
    border: 1px solid rgba(147, 197, 253, 0.72) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #1d4ed8 !important;
    box-shadow: 0 16px 34px rgba(37, 99, 235, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .message {
    margin-bottom: 0.9rem !important;
}

html[data-design-mode="setiai-board"] .messenger-page .message-bubble {
    max-width: min(72%, 42rem) !important;
    padding: 0.8rem 0.95rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 1.1rem !important;
    color: #0f172a !important;
    box-shadow: 0 12px 28px rgba(148, 163, 184, 0.15) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .message.user .message-bubble {
    border-color: rgba(37, 99, 235, 0.34) !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.24) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .message.user .message-time,
html[data-design-mode="setiai-board"] .messenger-page .message.user .message-status {
    color: rgba(255, 255, 255, 0.76) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .message.received .message-bubble {
    background: rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .message.ai .message-bubble {
    border-color: rgba(96, 165, 250, 0.28) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(224, 242, 254, 0.82)) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-toolbar-stack {
    max-width: 35rem !important;
    gap: 0.5rem !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-toolbar-group {
    gap: 0.4rem !important;
    padding: 0.28rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(248, 250, 252, 0.88) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-toolbar-group .glass,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel button,
html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface button:not(.btn-primary):not(#sendBtn) {
    min-width: 2.5rem !important;
    min-height: 2.5rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.8rem !important;
    background: rgba(255, 255, 255, 0.92) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-toolbar-group .glass:hover,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel button:hover,
html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface button:not(.btn-primary):not(#sendBtn):hover {
    border-color: rgba(37, 99, 235, 0.28) !important;
    color: #1d4ed8 !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface button:active,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #messageInput,
html[data-design-mode="setiai-board"] .messenger-page #messageSearchInput {
    min-height: 3rem !important;
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #messageInput:focus,
html[data-design-mode="setiai-board"] .messenger-page #messageSearchInput:focus {
    border-color: rgba(37, 99, 235, 0.38) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #filePreview,
html[data-design-mode="setiai-board"] .messenger-page #aiSuggestions button,
html[data-design-mode="setiai-board"] .messenger-page #groupParticipants > * {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    background: rgba(255, 255, 255, 0.9) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #sendBtn,
html[data-design-mode="setiai-board"] .messenger-page .btn-primary {
    border: 0 !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.24) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel {
    width: clamp(19rem, 21vw, 23rem) !important;
    height: calc(100dvh - 7.75rem) !important;
    min-height: 45rem !important;
    padding: 1rem !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(247, 250, 254, 0.94)) !important;
    box-shadow: 0 24px 54px rgba(148, 163, 184, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    overflow-y: auto !important;
    scrollbar-color: rgba(37, 99, 235, 0.22) transparent !important;
}

html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel > .flex:first-child {
    margin-bottom: 1rem !important;
    padding-bottom: 0.85rem !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.95) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel .glass,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel .glass-purple,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel .glass-emerald,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel .glass-cyan {
    padding: 0.9rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #0f172a !important;
    box-shadow: 0 12px 28px rgba(148, 163, 184, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel [class*="bg-white/5"],
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel [class*="border-white/10"],
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel #analyzingMessageContainer,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel #suggestedReplyContent,
html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel #messageSelectionList > * {
    border-color: rgba(203, 213, 225, 0.84) !important;
    background: rgba(248, 250, 252, 0.9) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel .space-y-2 > button {
    justify-content: flex-start !important;
    min-height: 4.35rem !important;
}

html[data-design-mode="setiai-board"] .messenger-page .modal,
html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-overlay {
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .modal-content,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-surface,
html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-panel {
    width: min(100%, 42rem) !important;
    padding: 1.55rem !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)) !important;
    color: #0f172a !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-panel--compact {
    width: min(100%, 34rem) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .form-input,
html[data-design-mode="setiai-board"] .messenger-page .form-select,
html[data-design-mode="setiai-board"] .messenger-page .form-textarea,
html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-input,
html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-select,
html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-textarea,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-field {
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-label,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-label {
    color: #334155 !important;
}

html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-muted,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-meta,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-time {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-secondary,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-secondary-btn,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-close-btn,
html[data-design-mode="setiai-board"] .messenger-page .runtime-modal-close {
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-list-row,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-card,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-card-soft,
html[data-design-mode="setiai-board"] .messenger-page .runtime-panel-preview {
    border-color: rgba(203, 213, 225, 0.86) !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #0f172a !important;
}

/* Dashboard page: board cockpit slice. Scoped so the classic dashboard remains untouched. */
html[data-design-mode="setiai-board"] body.dashboard-page {
    background:
        radial-gradient(circle at 10% 10%, rgba(37, 99, 235, 0.08), transparent 28rem),
        radial-gradient(circle at 92% 20%, rgba(14, 165, 233, 0.07), transparent 24rem),
        linear-gradient(180deg, #fbfdff 0%, #eef4fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-app-shell {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    gap: 1.15rem !important;
    align-items: flex-start !important;
    padding-top: 1rem !important;
    padding-bottom: 1.5rem !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar {
    width: clamp(18.5rem, 20vw, 20.5rem) !important;
    height: calc(100dvh - 7.75rem) !important;
    top: 5.9rem !important;
    padding: 0.85rem !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 254, 0.94)) !important;
    box-shadow: 0 24px 54px rgba(148, 163, 184, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar::before,
html[data-design-mode="setiai-board"] .dashboard-page .glass::before,
html[data-design-mode="setiai-board"] .dashboard-page .quick-action-btn::before,
html[data-design-mode="setiai-board"] .dashboard-page .stat-card::before,
html[data-design-mode="setiai-board"] .dashboard-page .btn-primary::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar h3.text-xs {
    margin: 0.35rem 0 0.55rem !important;
    padding: 0 0.25rem !important;
    color: #64748b !important;
    font-size: 0.68rem !important;
    font-weight: 850 !important;
    letter-spacing: 0.1em !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .sidebar-nav-item {
    min-height: 2.78rem !important;
    padding: 0.72rem 0.82rem !important;
    gap: 0.72rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #475569 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
    transform: none !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .sidebar-nav-item:hover {
    border-color: rgba(37, 99, 235, 0.26) !important;
    background: #f8fbff !important;
    color: #0f172a !important;
    box-shadow: 0 10px 24px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .sidebar-nav-item.active {
    border-color: rgba(37, 99, 235, 0.38) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(219, 234, 254, 0.7)) !important;
    color: #1d4ed8 !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.13), inset 0 0 0 1px rgba(37, 99, 235, 0.1) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .sidebar-nav-item::before {
    width: 0 !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .sidebar-icon {
    width: 1.35rem !important;
    font-size: 1.05rem !important;
    color: currentColor !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .notification-dot {
    right: 0.75rem !important;
    background: #f43f5e !important;
    border-color: #ffffff !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar .glass,
html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar .glass-purple {
    border: 1px solid rgba(203, 213, 225, 0.78) !important;
    border-radius: 1rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.9)) !important;
    box-shadow: 0 12px 28px rgba(148, 163, 184, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar .glass-purple {
    min-height: 18rem !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar .user-avatar {
    border-radius: 0.9rem !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    box-shadow: 0 10px 20px rgba(37, 99, 235, 0.2) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-app-shell > .flex-1 {
    min-width: 0 !important;
    padding: 0.45rem 0 0 !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboard-section > .mb-3:first-child {
    margin-bottom: 0.9rem !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboard-section > .mb-3:first-child h1 {
    color: #0f172a !important;
    font-size: clamp(1.55rem, 2.1vw, 2.15rem) !important;
    letter-spacing: -0.03em !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #dashboard-section > .setiai-panel {
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-panel-header {
    align-items: flex-end !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-panel-title,
html[data-design-mode="setiai-board"] .dashboard-page .setiai-card-title {
    color: #0f172a !important;
    letter-spacing: -0.015em !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-panel-title > span:first-child,
html[data-design-mode="setiai-board"] .dashboard-page .setiai-card-icon {
    width: 2.35rem !important;
    height: 2.35rem !important;
    border-radius: 0.95rem !important;
    box-shadow: 0 12px 24px rgba(37, 99, 235, 0.15) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-panel-subtitle,
html[data-design-mode="setiai-board"] .dashboard-page .setiai-quick-item-meta,
html[data-design-mode="setiai-board"] .dashboard-page .text-gray-300,
html[data-design-mode="setiai-board"] .dashboard-page .text-gray-400,
html[data-design-mode="setiai-board"] .dashboard-page .text-gray-500 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .stat-card,
html[data-design-mode="setiai-board"] .dashboard-page .glass,
html[data-design-mode="setiai-board"] .dashboard-page .chart-container {
    border: 1px solid rgba(203, 213, 225, 0.76) !important;
    border-radius: 1.15rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.92)) !important;
    box-shadow: 0 18px 42px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .stat-card {
    min-height: 11.6rem !important;
    padding: 1.25rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .stat-card:hover,
html[data-design-mode="setiai-board"] .dashboard-page .glass:hover {
    border-color: rgba(37, 99, 235, 0.22) !important;
    box-shadow: 0 22px 48px rgba(96, 165, 250, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .stat-number {
    font-size: clamp(1.8rem, 2.4vw, 2.55rem) !important;
    font-weight: 820 !important;
    letter-spacing: -0.04em !important;
    font-variant-numeric: tabular-nums !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .ai-indicator,
html[data-design-mode="setiai-board"] .dashboard-page .ai-indicator::before {
    animation: none !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .task-item,
html[data-design-mode="setiai-board"] .dashboard-page .setiai-quick-item,
html[data-design-mode="setiai-board"] .dashboard-page [class*="bg-black/40"],
html[data-design-mode="setiai-board"] .dashboard-page [class*="bg-gray-700"],
html[data-design-mode="setiai-board"] .dashboard-page [class*="from-blue-900"],
html[data-design-mode="setiai-board"] .dashboard-page [class*="from-green-900"],
html[data-design-mode="setiai-board"] .dashboard-page [class*="from-purple-900"],
html[data-design-mode="setiai-board"] .dashboard-page [class*="from-cyan-900"],
html[data-design-mode="setiai-board"] .dashboard-page [class*="from-red-900"],
html[data-design-mode="setiai-board"] .dashboard-page [class*="from-orange-900"] {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.76) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-quick-item:hover,
html[data-design-mode="setiai-board"] .dashboard-page .task-item:hover {
    border-color: rgba(37, 99, 235, 0.24) !important;
    background: #f8fbff !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-quick-item-title,
html[data-design-mode="setiai-board"] .dashboard-page .font-semibold {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .setiai-inline-pill,
html[data-design-mode="setiai-board"] .dashboard-page [class*="rounded-full"] {
    font-variant-numeric: tabular-nums !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .loader {
    width: 2.15rem !important;
    height: 2.15rem !important;
    border-color: rgba(37, 99, 235, 0.12) !important;
    border-top-color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .skeleton {
    background: linear-gradient(90deg, rgba(226, 232, 240, 0.62), rgba(248, 250, 252, 0.92), rgba(226, 232, 240, 0.62)) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .btn-primary,
html[data-design-mode="setiai-board"] .dashboard-page .btn-secondary,
html[data-design-mode="setiai-board"] .dashboard-page .setiai-card-action,
html[data-design-mode="setiai-board"] .dashboard-page button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn) {
    min-height: 2.55rem !important;
    border-radius: 0.9rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .btn-primary,
html[data-design-mode="setiai-board"] .dashboard-page button[type="submit"] {
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .btn-secondary {
    background: rgba(255, 255, 255, 0.86) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .modal,
html[data-design-mode="setiai-board"] .dashboard-page #quickTaskModal,
html[data-design-mode="setiai-board"] .dashboard-page #quickContactModal,
html[data-design-mode="setiai-board"] .dashboard-page #quickReportModal {
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .modal-content,
html[data-design-mode="setiai-board"] .dashboard-page #quickTaskModal > div,
html[data-design-mode="setiai-board"] .dashboard-page #quickContactModal > div,
html[data-design-mode="setiai-board"] .dashboard-page #quickReportModal > div {
    width: min(100%, 42rem) !important;
    padding: 1.55rem !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)) !important;
    color: #0f172a !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #addPlatformModal .modal-content {
    max-height: min(82dvh, 58rem) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
}

html[data-design-mode="setiai-board"] .dashboard-page #platformPickerGrid > * {
    min-height: 12.8rem !important;
    align-content: start !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .modal-content .close,
html[data-design-mode="setiai-board"] .dashboard-page .modal-content button[onclick*="close"],
html[data-design-mode="setiai-board"] .dashboard-page .close {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .input-field,
html[data-design-mode="setiai-board"] .dashboard-page input,
html[data-design-mode="setiai-board"] .dashboard-page textarea,
html[data-design-mode="setiai-board"] .dashboard-page select {
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .dashboard-page input::placeholder,
html[data-design-mode="setiai-board"] .dashboard-page textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] .dashboard-page label {
    color: #334155 !important;
}

html[data-design-mode="setiai-board"] .dashboard-page .platform-icon {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), 0 8px 16px rgba(37, 99, 235, 0.16) !important;
}

html[data-design-mode="setiai-board"] .assistant-page [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
}

/* Assistant page: agent board slice. Scoped so classic assistant rendering remains untouched. */
html[data-design-mode="setiai-board"] body.assistant-page {
    background:
        radial-gradient(circle at 12% 6%, rgba(37, 99, 235, 0.09), transparent 30rem),
        radial-gradient(circle at 88% 18%, rgba(14, 165, 233, 0.07), transparent 26rem),
        linear-gradient(180deg, #fbfdff 0%, #edf4fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.assistant-page::before,
html[data-design-mode="setiai-board"] body.assistant-page::after {
    opacity: 0 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .assistant-page .main-content {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    margin: 0 auto !important;
    padding-top: 1rem !important;
    padding-bottom: 1.5rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .main-content > .container {
    max-width: none !important;
    padding-inline: 0 !important;
}

html[data-design-mode="setiai-board"] .assistant-page .gradient-text,
html[data-design-mode="setiai-board"] .assistant-page .text-gradient-primary,
html[data-design-mode="setiai-board"] .assistant-page .text-gradient-success,
html[data-design-mode="setiai-board"] .assistant-page .text-gradient-warning {
    background: none !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .assistant-page .page-header {
    margin: 0 0 0.5rem !important;
    padding: 0.5rem 0.85rem !important;
    border-radius: 0.9rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .metric-card {
    min-height: 5.2rem !important;
    padding: 0.6rem 0.85rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

html[data-design-mode="setiai-board"] .assistant-page .metric-icon,
html[data-design-mode="setiai-board"] .assistant-page .agent-icon {
    width: 2.25rem !important;
    height: 2.25rem !important;
    font-size: 1rem !important;
    border-radius: 0.6rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .metric-value {
    margin: 0.15rem 0 !important;
    font-size: 1.35rem !important;
    font-weight: 800 !important;
    background: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    -webkit-text-fill-color: var(--setiai-board-text) !important;
    color: var(--setiai-board-text) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agents-grid {
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)) !important;
    gap: 0.65rem !important;
    margin-bottom: 0.5rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-card {
    min-height: 8.2rem !important;
    padding: 0.7rem 0.85rem !important;
    border-radius: 0.85rem !important;
    display: flex !important;
    flex-direction: column !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-header {
    margin-bottom: 0.4rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-title {
    font-size: 1.05rem !important;
    margin-bottom: 0.2rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-description {
    font-size: 0.75rem !important;
    line-height: 1.35 !important;
    margin-bottom: 0.4rem !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-stats {
    margin-top: auto !important;
    padding-top: 0.4rem !important;
    font-size: 0.72rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-header {
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-title,
html[data-design-mode="setiai-board"] .assistant-page .catalog-title,
html[data-design-mode="setiai-board"] .assistant-page .catalog-card-title,
html[data-design-mode="setiai-board"] .assistant-page .insights-title {
    color: #0f172a !important;
    letter-spacing: -0.025em !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-stats {
    margin-top: auto !important;
    border-color: rgba(226, 232, 240, 0.95) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .agent-badge,
html[data-design-mode="setiai-board"] .assistant-page .status-active,
html[data-design-mode="setiai-board"] .assistant-page .status-processing,
html[data-design-mode="setiai-board"] .assistant-page .status-idle {
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #1d4ed8 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .assistant-page .status-active::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-section,
html[data-design-mode="setiai-board"] .assistant-page .insights-section {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
    padding: 1.25rem !important;
    border-radius: 1.35rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-header {
    align-items: stretch !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-kicker,
html[data-design-mode="setiai-board"] .assistant-page .catalog-card-badge,
html[data-design-mode="setiai-board"] .assistant-page .catalog-card-module,
html[data-design-mode="setiai-board"] .assistant-page .catalog-card-meta-pill,
html[data-design-mode="setiai-board"] .assistant-page .catalog-card-capability,
html[data-design-mode="setiai-board"] .assistant-page .catalog-card-cta {
    border-color: rgba(147, 197, 253, 0.58) !important;
    background: rgba(239, 246, 255, 0.82) !important;
    color: #1d4ed8 !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-summary {
    align-content: start !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-summary-pill,
html[data-design-mode="setiai-board"] .assistant-page .catalog-tab,
html[data-design-mode="setiai-board"] .assistant-page .catalog-search,
html[data-design-mode="setiai-board"] .assistant-page .catalog-card,
html[data-design-mode="setiai-board"] .assistant-page .catalog-empty,
html[data-design-mode="setiai-board"] .assistant-page .insight-card {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-tab.active,
html[data-design-mode="setiai-board"] .assistant-page .catalog-tab:hover {
    border-color: rgba(37, 99, 235, 0.34) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(219, 234, 254, 0.72)) !important;
    color: #1d4ed8 !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.13), inset 0 0 0 1px rgba(37, 99, 235, 0.1) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-grid {
    grid-template-columns: repeat(auto-fit, minmax(18.5rem, 1fr)) !important;
    gap: 0.9rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-card {
    min-height: 22rem !important;
    padding: 1.15rem !important;
    display: flex !important;
    flex-direction: column !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-card-footer {
    margin-top: auto !important;
    border-color: rgba(226, 232, 240, 0.95) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .catalog-search input {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .assistant-page .insights-header {
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .assistant-page .insights-title i {
    color: #2563eb !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .assistant-page .modal {
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .modal-content {
    width: min(100%, 58rem) !important;
    max-height: min(86dvh, 60rem) !important;
    padding: 1.55rem !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)) !important;
    color: #0f172a !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .modal-header {
    border-color: rgba(226, 232, 240, 0.95) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .modal-close,
html[data-design-mode="setiai-board"] .assistant-page .modal-close-btn,
html[data-design-mode="setiai-board"] .assistant-page .contract-action-button {
    min-width: 2.55rem !important;
    min-height: 2.55rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .assistant-page .modal-close:hover,
html[data-design-mode="setiai-board"] .assistant-page .modal-close-btn:hover {
    border-color: rgba(239, 68, 68, 0.32) !important;
    background: rgba(254, 242, 242, 0.94) !important;
    color: #b91c1c !important;
}

html[data-design-mode="setiai-board"] .assistant-page .modal-content .glass,
html[data-design-mode="setiai-board"] .assistant-page .modal-content .glass-strong,
html[data-design-mode="setiai-board"] .assistant-page [class*="bg-black"],
html[data-design-mode="setiai-board"] .assistant-page [class*="bg-white/5"],
html[data-design-mode="setiai-board"] .assistant-page [class*="bg-blue-500/10"],
html[data-design-mode="setiai-board"] .assistant-page [class*="bg-emerald-"],
html[data-design-mode="setiai-board"] .assistant-page [class*="bg-sky-500/10"],
html[data-design-mode="setiai-board"] .assistant-page [class*="bg-yellow-500/10"] {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .form-input,
html[data-design-mode="setiai-board"] .assistant-page .form-textarea,
html[data-design-mode="setiai-board"] .assistant-page .form-select,
html[data-design-mode="setiai-board"] .assistant-page .business-data-input,
html[data-design-mode="setiai-board"] .assistant-page input,
html[data-design-mode="setiai-board"] .assistant-page textarea,
html[data-design-mode="setiai-board"] .assistant-page select {
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .assistant-page input::placeholder,
html[data-design-mode="setiai-board"] .assistant-page textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] .assistant-page .btn,
html[data-design-mode="setiai-board"] .assistant-page button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn) {
    min-height: 2.55rem !important;
    border-radius: 0.9rem !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .btn-primary,
html[data-design-mode="setiai-board"] .assistant-page button[type="submit"],
html[data-design-mode="setiai-board"] .assistant-page [class*="from-blue-700"] {
    border-color: transparent !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .btn-primary *,
html[data-design-mode="setiai-board"] .assistant-page button[type="submit"] *,
html[data-design-mode="setiai-board"] .assistant-page [class*="from-blue-700"] * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .assistant-page .btn-secondary,
html[data-design-mode="setiai-board"] .assistant-page .contract-action-link,
html[data-design-mode="setiai-board"] .assistant-page .contract-action-button {
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .assistant-page button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .loading {
    border-color: rgba(37, 99, 235, 0.12) !important;
    border-top-color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .assistant-page .skeleton {
    background: linear-gradient(90deg, rgba(226, 232, 240, 0.62), rgba(248, 250, 252, 0.92), rgba(226, 232, 240, 0.62)) !important;
}

/* Sales page: revenue board slice. Scoped so classic sales rendering remains untouched. */
html[data-design-mode="setiai-board"] body.sales-page {
    background:
        radial-gradient(circle at 14% 4%, rgba(20, 184, 166, 0.09), transparent 30rem),
        radial-gradient(circle at 86% 14%, rgba(37, 99, 235, 0.08), transparent 28rem),
        linear-gradient(180deg, #fbfdff 0%, #eef5fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.sales-page::before,
html[data-design-mode="setiai-board"] body.sales-page::after {
    opacity: 0 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-app-shell {
    padding-top: 1rem !important;
    padding-bottom: 1.5rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-app-shell > .container {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    max-width: none !important;
    padding-inline: 0 !important;
}

html[data-design-mode="setiai-board"] .sales-page .ai-gradient,
html[data-design-mode="setiai-board"] .sales-page .bg-clip-text {
    background: none !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .sales-page [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

html[data-design-mode="setiai-board"] .sales-page .glass::before,
html[data-design-mode="setiai-board"] .sales-page .sales-card::before,
html[data-design-mode="setiai-board"] .sales-page .metric-card::before,
html[data-design-mode="setiai-board"] .sales-page .btn-primary::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-page-header,
html[data-design-mode="setiai-board"] .sales-page .setiai-panel {
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-page-header {
    padding: 1.1rem 1.2rem !important;
    border: 1px solid rgba(203, 213, 225, 0.76) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.94)) !important;
    box-shadow: 0 20px 46px rgba(148, 163, 184, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-page-title,
html[data-design-mode="setiai-board"] .sales-page .setiai-panel-title,
html[data-design-mode="setiai-board"] .sales-page .setiai-card-title {
    color: #0f172a !important;
    letter-spacing: -0.025em !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-page-title {
    font-size: clamp(1.65rem, 2.2vw, 2.35rem) !important;
    letter-spacing: -0.04em !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-section-label,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-subtitle,
html[data-design-mode="setiai-board"] .sales-page .setiai-panel-subtitle,
html[data-design-mode="setiai-board"] .sales-page .sales-action-card__intro p,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-summary-caption,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-stage-item__caption,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-recommendation-item__caption,
html[data-design-mode="setiai-board"] .sales-page .setiai-closing-band-text,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-endcap-text,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-endcap-item-text,
html[data-design-mode="setiai-board"] .sales-page .text-gray-300,
html[data-design-mode="setiai-board"] .sales-page .text-gray-400,
html[data-design-mode="setiai-board"] .sales-page .text-gray-500 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-card-icon,
html[data-design-mode="setiai-board"] .sales-page .setiai-panel-title > span:first-child,
html[data-design-mode="setiai-board"] .sales-page .metric-card .w-9,
html[data-design-mode="setiai-board"] .sales-page .sales-card .w-9 {
    width: 2.45rem !important;
    height: 2.45rem !important;
    border-radius: 0.95rem !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), 0 10px 20px rgba(37, 99, 235, 0.15) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .sales-page .metric-card,
html[data-design-mode="setiai-board"] .sales-page .glass,
html[data-design-mode="setiai-board"] .sales-page .sales-card,
html[data-design-mode="setiai-board"] .sales-page .chart-container,
html[data-design-mode="setiai-board"] .sales-page .pipeline-stage,
html[data-design-mode="setiai-board"] .sales-page .lead-card,
html[data-design-mode="setiai-board"] .sales-page .deal-card,
html[data-design-mode="setiai-board"] .sales-page .setiai-closing-band,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-endcap {
    border: 1px solid rgba(203, 213, 225, 0.76) !important;
    border-radius: 1.18rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.92)) !important;
    box-shadow: 0 18px 42px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .sales-page .metric-card:hover,
html[data-design-mode="setiai-board"] .sales-page .glass:hover,
html[data-design-mode="setiai-board"] .sales-page .sales-card:hover,
html[data-design-mode="setiai-board"] .sales-page .pipeline-stage:hover,
html[data-design-mode="setiai-board"] .sales-page .lead-card:hover,
html[data-design-mode="setiai-board"] .sales-page .deal-card:hover {
    border-color: rgba(20, 184, 166, 0.28) !important;
    background: #f8fbff !important;
    box-shadow: 0 22px 48px rgba(20, 184, 166, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .sales-page .metric-card {
    min-height: 10.7rem !important;
    padding: 1.15rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

html[data-design-mode="setiai-board"] .sales-page .metric-card h3,
html[data-design-mode="setiai-board"] .sales-page .pipeline-stage .text-lg,
html[data-design-mode="setiai-board"] .sales-page .setiai-closing-band-value {
    color: #0f172a !important;
    font-variant-numeric: tabular-nums !important;
    letter-spacing: -0.035em !important;
}

html[data-design-mode="setiai-board"] .sales-page .metric-card h3 {
    font-size: clamp(1.55rem, 2vw, 2.15rem) !important;
    font-weight: 820 !important;
}

html[data-design-mode="setiai-board"] .sales-page .progress-bar {
    height: 0.48rem !important;
    background: rgba(226, 232, 240, 0.86) !important;
}

html[data-design-mode="setiai-board"] .sales-page .progress-fill {
    background: linear-gradient(90deg, #14b8a6, #2563eb) !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-card {
    min-height: 8.4rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    cursor: pointer !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-card > * {
    pointer-events: auto !important;
}

html[data-design-mode="setiai-board"] .sales-page .assistant-owner-handoff-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)) !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-card-header {
    align-items: flex-start !important;
}

html[data-design-mode="setiai-board"] .sales-page .tab-button {
    min-height: 2.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.82) !important;
    color: #475569 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .sales-page .tab-button.active,
html[data-design-mode="setiai-board"] .sales-page .tab-button:hover {
    border-color: rgba(20, 184, 166, 0.34) !important;
    background: linear-gradient(180deg, rgba(240, 253, 250, 0.98), rgba(204, 251, 241, 0.68)) !important;
    color: #0f766e !important;
    box-shadow: 0 12px 26px rgba(20, 184, 166, 0.13), inset 0 0 0 1px rgba(20, 184, 166, 0.1) !important;
}

html[data-design-mode="setiai-board"] .sales-page .pipeline-stage {
    min-height: 14.5rem !important;
    padding: 1rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .pipeline-stage.active {
    border-color: rgba(20, 184, 166, 0.34) !important;
    background: linear-gradient(180deg, rgba(240, 253, 250, 0.98), rgba(248, 250, 252, 0.94)) !important;
}

html[data-design-mode="setiai-board"] .sales-page .chart-container {
    min-height: 17rem !important;
    padding: 1.15rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid {
    gap: 1rem !important;
    align-items: stretch !important;
}

html:not([data-design-mode="setiai-board"]) .sales-page .sales-board-only,
.sales-page .sales-board-only {
    display: none !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__hero,
html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__rail,
html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__funnel {
    min-height: 100% !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__hero,
html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__funnel {
    display: flex !important;
    flex-direction: column !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__hero .sales-action-card__body,
html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__funnel #funnel-optimization-container {
    flex: 1 1 auto !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__hero .sales-action-card__body {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.9rem !important;
    min-height: 0 !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__hero .space-y-3 {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    gap: 0.75rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__hero .space-y-3 > * + * {
    margin-top: 0 !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-content-fill-grid.sales-board-only {
    display: grid !important;
    flex: 1 1 auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    align-content: stretch !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-content-fill-item {
    min-height: 7.8rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    gap: 0.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(241, 245, 249, 0.82)) !important;
    color: #0f172a !important;
    padding: 0.85rem !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-content-fill-label {
    color: #0e7490 !important;
    font-size: 0.68rem !important;
    font-weight: 820 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-content-fill-item strong {
    color: #0f172a !important;
    font-size: 0.94rem !important;
    line-height: 1.25 !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-content-fill-item p {
    margin: 0 !important;
    color: #64748b !important;
    font-size: 0.82rem !important;
    line-height: 1.45 !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__rail {
    gap: 1rem !important;
    align-content: stretch !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__rail > .glass {
    min-height: 0 !important;
    height: 100% !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__funnel #funnel-optimization-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.95rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__funnel .sales-funnel-stack {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    gap: 0.95rem !important;
    min-height: 100% !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__funnel .sales-funnel-block {
    padding: 0.95rem 1rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-execution-grid__funnel .sales-funnel-block h3 {
    margin: 0 0 0.8rem !important;
    color: #64748b !important;
    font-size: 0.75rem !important;
    font-weight: 820 !important;
    letter-spacing: 0.1em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-action-card__footer-item,
html[data-design-mode="setiai-board"] .sales-page .sales-content-preview,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-summary-item,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-block,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-stage-item,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-recommendation-item,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-stage-item__signal,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-recommendation-item__signal,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-endcap-item,
html[data-design-mode="setiai-board"] .sales-page [class*="bg-black/40"],
html[data-design-mode="setiai-board"] .sales-page [class*="bg-white/5"],
html[data-design-mode="setiai-board"] .sales-page [class*="bg-gray-700"],
html[data-design-mode="setiai-board"] .sales-page [class*="from-blue-900"],
html[data-design-mode="setiai-board"] .sales-page [class*="from-green-900"],
html[data-design-mode="setiai-board"] .sales-page [class*="from-purple-900"],
html[data-design-mode="setiai-board"] .sales-page [class*="from-red-900"],
html[data-design-mode="setiai-board"] .sales-page [class*="from-orange-900"] {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-action-card__footer-label,
html[data-design-mode="setiai-board"] .sales-page .sales-content-preview__label,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-summary-label,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-block h3,
html[data-design-mode="setiai-board"] .sales-page .setiai-closing-band-label,
html[data-design-mode="setiai-board"] .sales-page .setiai-closing-band-caption {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-action-card__footer-value,
html[data-design-mode="setiai-board"] .sales-page .sales-content-preview__title,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-summary-value,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-stage-item__title,
html[data-design-mode="setiai-board"] .sales-page .sales-funnel-recommendation-item__title,
html[data-design-mode="setiai-board"] .sales-page .setiai-closing-band-title,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-endcap-title,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-endcap-item-title {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-funnel-stage-item__signal--alert {
    color: #b91c1c !important;
    background: rgba(254, 226, 226, 0.9) !important;
    border-color: rgba(248, 113, 113, 0.28) !important;
}

html[data-design-mode="setiai-board"] .sales-page .sales-funnel-stage-item__signal--success {
    color: #047857 !important;
    background: rgba(220, 252, 231, 0.92) !important;
    border-color: rgba(16, 185, 129, 0.26) !important;
}

html[data-design-mode="setiai-board"] .sales-page .loader,
html[data-design-mode="setiai-board"] body.sales-page .loader,
html[data-design-mode="setiai-board"] body.sales-page .loading {
    border-color: rgba(37, 99, 235, 0.12) !important;
    border-top-color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .sales-page .btn-primary,
html[data-design-mode="setiai-board"] body.sales-page .btn-primary,
html[data-design-mode="setiai-board"] body.sales-page button[type="submit"] {
    border-color: transparent !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .sales-page .btn-primary *,
html[data-design-mode="setiai-board"] body.sales-page .btn-primary *,
html[data-design-mode="setiai-board"] body.sales-page button[type="submit"] * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .sales-page .btn-secondary,
html[data-design-mode="setiai-board"] .sales-page .setiai-card-action,
html[data-design-mode="setiai-board"] body.sales-page .btn-secondary,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-secondary,
html[data-design-mode="setiai-board"] body.sales-page button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn):not(.sales-card):not(.tab-button):not(.setiai-card-action):not(.runtime-modal-close):not(.btn-primary):not(.btn-success):not(.btn-danger):not([type="submit"]) {
    min-height: 2.55rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] body.sales-page button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .sales-page input,
html[data-design-mode="setiai-board"] .sales-page textarea,
html[data-design-mode="setiai-board"] .sales-page select,
html[data-design-mode="setiai-board"] body.sales-page input,
html[data-design-mode="setiai-board"] body.sales-page textarea,
html[data-design-mode="setiai-board"] body.sales-page select,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-input,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-select,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-textarea {
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .sales-page input::placeholder,
html[data-design-mode="setiai-board"] .sales-page textarea::placeholder,
html[data-design-mode="setiai-board"] body.sales-page input::placeholder,
html[data-design-mode="setiai-board"] body.sales-page textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] body.sales-page > .fixed,
html[data-design-mode="setiai-board"] body.sales-page > .runtime-modal-overlay,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
    overflow-y: auto !important;
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] body.sales-page > .fixed .glass,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-panel,
html[data-design-mode="setiai-board"] body.sales-page .modal-content {
    width: min(100%, 44rem) !important;
    max-height: min(86dvh, 60rem) !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)) !important;
    color: #0f172a !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-panel--compact {
    padding: 1.55rem !important;
}

html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-label,
html[data-design-mode="setiai-board"] body.sales-page label {
    display: block !important;
    margin-bottom: 0.45rem !important;
    color: #334155 !important;
    font-size: 0.86rem !important;
    font-weight: 700 !important;
}

html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-muted {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-panel form {
    display: grid !important;
    gap: 0.95rem !important;
}

html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-panel .space-y-4 > * + * {
    margin-top: 0 !important;
}

html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-input,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-select,
html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-textarea {
    width: 100% !important;
    min-height: 2.85rem !important;
    padding: 0.75rem 0.95rem !important;
    font-size: 0.94rem !important;
    line-height: 1.35 !important;
}

html[data-design-mode="setiai-board"] body.sales-page .runtime-modal-close,
html[data-design-mode="setiai-board"] body.sales-page > .fixed button[onclick*="remove"] {
    min-width: 2.55rem !important;
    min-height: 2.55rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] body.sales-page > .fixed .bg-white\/5,
html[data-design-mode="setiai-board"] body.sales-page > .fixed [class*="bg-black"],
html[data-design-mode="setiai-board"] body.sales-page > .fixed [class*="from-blue-900"],
html[data-design-mode="setiai-board"] body.sales-page > .fixed [class*="from-green-900"],
html[data-design-mode="setiai-board"] body.sales-page > .fixed [class*="from-purple-900"] {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-closing-cluster {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    margin: 0 auto 1.5rem !important;
}

html[data-design-mode="setiai-board"] .sales-page .setiai-closing-band,
html[data-design-mode="setiai-board"] .sales-page .setiai-page-endcap {
    padding: 1.25rem !important;
}

/* Planner page: focus board slice. Keep classic planner untouched. */
html[data-design-mode="setiai-board"] body.planner-page {
    background:
        radial-gradient(circle at 10% 4%, rgba(37, 99, 235, 0.1), transparent 28rem),
        radial-gradient(circle at 88% 10%, rgba(20, 184, 166, 0.08), transparent 26rem),
        linear-gradient(180deg, #fbfdff 0%, #eef5fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.planner-page::before,
html[data-design-mode="setiai-board"] body.planner-page::after {
    opacity: 0 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    min-height: calc(100dvh - 7.75rem) !important;
    margin: 0 auto !important;
    padding-top: 1rem !important;
    padding-bottom: 1.5rem !important;
    gap: 1rem !important;
    align-items: stretch !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell > .sidebar {
    flex: 0 0 20.5rem !important;
    width: 20.5rem !important;
    height: calc(100dvh - 6.6rem) !important;
    min-height: 42rem !important;
    top: 5.45rem !important;
    padding: 0.85rem !important;
    overflow: hidden !important;
    border: 1px solid rgba(203, 213, 225, 0.78) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.94)) !important;
    box-shadow: 0 22px 52px rgba(148, 163, 184, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell > .sidebar::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell > .flex-1 {
    min-width: 0 !important;
    padding: 0 !important;
}

html[data-design-mode="setiai-board"] .planner-page [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

html[data-design-mode="setiai-board"] .planner-page .ai-gradient,
html[data-design-mode="setiai-board"] .planner-page .bg-clip-text {
    background: none !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .glass::before,
html[data-design-mode="setiai-board"] .planner-page .ai-insight-block::before,
html[data-design-mode="setiai-board"] .planner-page .btn-primary::before,
html[data-design-mode="setiai-board"] .planner-page .quick-action-btn::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-page-header,
html[data-design-mode="setiai-board"] .planner-page .setiai-panel {
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-page-header,
html[data-design-mode="setiai-board"] .planner-page .setiai-panel,
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-grid,
html[data-design-mode="setiai-board"] .planner-page .glass,
html[data-design-mode="setiai-board"] .planner-page .glass-cyan,
html[data-design-mode="setiai-board"] .planner-page .glass-green,
html[data-design-mode="setiai-board"] .planner-page .glass-purple,
html[data-design-mode="setiai-board"] .planner-page .ai-insight-block,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap {
    border: 1px solid rgba(203, 213, 225, 0.76) !important;
    border-radius: 1.18rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.92)) !important;
    color: #0f172a !important;
    box-shadow: 0 18px 42px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-page-header {
    padding: 1.1rem 1.2rem !important;
    border-radius: 1.35rem !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-page-title,
html[data-design-mode="setiai-board"] .planner-page .setiai-panel-title,
html[data-design-mode="setiai-board"] .planner-page .setiai-card-title,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap-title,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap-item-title {
    color: #0f172a !important;
    letter-spacing: -0.025em !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-page-title {
    font-size: clamp(1.65rem, 2.2vw, 2.35rem) !important;
    letter-spacing: -0.04em !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-section-label,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-subtitle,
html[data-design-mode="setiai-board"] .planner-page .setiai-panel-subtitle,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap-text,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap-item-text,
html[data-design-mode="setiai-board"] .planner-page .text-gray-300,
html[data-design-mode="setiai-board"] .planner-page .text-gray-400,
html[data-design-mode="setiai-board"] .planner-page .text-gray-500,
html[data-design-mode="setiai-board"] .planner-page .text-white\/70,
html[data-design-mode="setiai-board"] .planner-page .text-white\/60 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .planner-page .text-white {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-card-icon,
html[data-design-mode="setiai-board"] .planner-page .setiai-panel-title > span:first-child,
html[data-design-mode="setiai-board"] .planner-page .quick-action-btn .w-8,
html[data-design-mode="setiai-board"] .planner-page .rounded-2xl.bg-gradient-to-br {
    border-radius: 0.95rem !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), 0 10px 20px rgba(37, 99, 235, 0.15) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-card-icon i,
html[data-design-mode="setiai-board"] .planner-page .setiai-panel-title > span:first-child i,
html[data-design-mode="setiai-board"] .planner-page .quick-action-btn .w-8 i,
html[data-design-mode="setiai-board"] .planner-page .rounded-2xl.bg-gradient-to-br i,
html[data-design-mode="setiai-board"] .planner-page .btn-primary *,
html[data-design-mode="setiai-board"] .planner-page button[type="submit"] *,
html[data-design-mode="setiai-board"] .planner-page [class*="from-blue-500"][class*="to-indigo"] *,
html[data-design-mode="setiai-board"] .planner-page [class*="from-emerald-500"][class*="to-blue"] *,
html[data-design-mode="setiai-board"] .planner-page [class*="from-teal-500"] * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .planner-page .quick-action-btn {
    min-height: 3.15rem !important;
    border-radius: 1rem !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .planner-page .quick-action-btn:hover,
html[data-design-mode="setiai-board"] .planner-page .glass:hover,
html[data-design-mode="setiai-board"] .planner-page .ai-insight-block:hover,
html[data-design-mode="setiai-board"] .planner-page .task-card:hover {
    border-color: rgba(37, 99, 235, 0.26) !important;
    background: #f8fbff !important;
    box-shadow: 0 22px 48px rgba(96, 165, 250, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .planner-page #todayScheduleContainer,
html[data-design-mode="setiai-board"] .planner-page #planner-upcoming-events {
    min-height: 12rem !important;
}

html[data-design-mode="setiai-board"] .planner-page .stat-card {
    min-height: 5.4rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .stat-card p:last-child,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap-item-title {
    color: #0f172a !important;
    font-variant-numeric: tabular-nums !important;
}

html[data-design-mode="setiai-board"] .planner-page .calendar-grid {
    gap: 0.35rem !important;
    padding: 0.35rem !important;
    border: 1px solid rgba(203, 213, 225, 0.74) !important;
    border-radius: 1rem !important;
    background: rgba(241, 245, 249, 0.78) !important;
}

html[data-design-mode="setiai-board"] .planner-page .calendar-day-header {
    min-height: 2.6rem !important;
    border: 1px solid rgba(203, 213, 225, 0.76) !important;
    border-radius: 0.85rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #64748b !important;
    font-size: 0.74rem !important;
    font-weight: 820 !important;
}

html[data-design-mode="setiai-board"] .planner-page .calendar-day,
html[data-design-mode="setiai-board"] .planner-page .week-day {
    border: 1px solid rgba(203, 213, 225, 0.78) !important;
    border-radius: 0.88rem !important;
    background: rgba(255, 255, 255, 0.86) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .planner-page .calendar-day:hover,
html[data-design-mode="setiai-board"] .planner-page .week-day:hover {
    border-color: rgba(37, 99, 235, 0.3) !important;
    background: rgba(239, 246, 255, 0.92) !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .planner-page .calendar-day.today,
html[data-design-mode="setiai-board"] .planner-page .week-day.today {
    border-color: rgba(37, 99, 235, 0.36) !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .planner-page .calendar-day.other-month {
    opacity: 1 !important;
    color: #94a3b8 !important;
    background: rgba(248, 250, 252, 0.68) !important;
}

html[data-design-mode="setiai-board"] .planner-page .event-item,
html[data-design-mode="setiai-board"] .planner-page .participant-card,
html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap-item,
html[data-design-mode="setiai-board"] .planner-page [class*="bg-black"],
html[data-design-mode="setiai-board"] .planner-page [class*="bg-gray-700"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-purple-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-cyan-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-green-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-emerald-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-gray-700"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-gray-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="via-gray-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="to-pink-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="to-blue-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="to-teal-900"],
html[data-design-mode="setiai-board"] .planner-page [class*="to-gray-800"] {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .planner-page #tasksContainer {
    max-height: 42rem !important;
    padding-right: 0.15rem !important;
}

html[data-design-mode="setiai-board"] .planner-page #tasksContainer > .glass,
html[data-design-mode="setiai-board"] .planner-page #tasksContainer [class*="border-l-4"] {
    padding: 1rem !important;
    border-left-width: 4px !important;
}

html[data-design-mode="setiai-board"] .planner-page .task-filter-btn,
html[data-design-mode="setiai-board"] .planner-page .task-status-filter,
html[data-design-mode="setiai-board"] .planner-page .task-priority-filter {
    min-height: 2.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.84) !important;
    color: #475569 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .planner-page .task-filter-btn.active,
html[data-design-mode="setiai-board"] .planner-page .task-status-filter.active,
html[data-design-mode="setiai-board"] .planner-page .task-priority-filter.active,
html[data-design-mode="setiai-board"] .planner-page .task-filter-btn:hover,
html[data-design-mode="setiai-board"] .planner-page .task-status-filter:hover,
html[data-design-mode="setiai-board"] .planner-page .task-priority-filter:hover {
    border-color: rgba(37, 99, 235, 0.34) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(219, 234, 254, 0.72)) !important;
    color: #1d4ed8 !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.13), inset 0 0 0 1px rgba(37, 99, 235, 0.1) !important;
}

html[data-design-mode="setiai-board"] .planner-page input,
html[data-design-mode="setiai-board"] .planner-page textarea,
html[data-design-mode="setiai-board"] .planner-page select {
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .planner-page input::placeholder,
html[data-design-mode="setiai-board"] .planner-page textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] .planner-page .btn-primary,
html[data-design-mode="setiai-board"] .planner-page button[type="submit"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-emerald-500"][class*="to-blue"],
html[data-design-mode="setiai-board"] .planner-page [class*="from-blue-500"][class*="to-indigo"] {
    border-color: transparent !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .planner-page .btn-secondary,
html[data-design-mode="setiai-board"] .planner-page .setiai-card-action,
html[data-design-mode="setiai-board"] body.planner-page button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn):not(.task-filter-btn):not(.task-status-filter):not(.task-priority-filter):not(.setiai-card-action):not(.close-modal):not(.btn-primary):not([type="submit"]) {
    min-height: 2.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] body.planner-page button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] body.planner-page > .fixed:not(.hidden):not(.theme-dropdown),
html[data-design-mode="setiai-board"] body.planner-page .modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
    overflow-y: auto !important;
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] body.planner-page > .fixed.hidden {
    display: none !important;
}

html[data-design-mode="setiai-board"] body.planner-page > .fixed:not(.hidden):not(.theme-dropdown) > .glass,
html[data-design-mode="setiai-board"] body.planner-page > .fixed:not(.hidden):not(.theme-dropdown) > div,
html[data-design-mode="setiai-board"] body.planner-page .modal-content {
    width: min(100%, 46rem) !important;
    max-height: min(88dvh, 62rem) !important;
    overflow-y: auto !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)) !important;
    color: #0f172a !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] body.planner-page #meetingsAnalysisModal > div,
html[data-design-mode="setiai-board"] body.planner-page #meetingAnalysisResultModal > div,
html[data-design-mode="setiai-board"] body.planner-page #calendarSyncModal > div,
html[data-design-mode="setiai-board"] body.planner-page #taskTemplatesModal > div,
html[data-design-mode="setiai-board"] body.planner-page #taskAutomationsModal > div {
    width: min(100%, 60rem) !important;
}

html[data-design-mode="setiai-board"] body.planner-page label {
    display: block !important;
    margin-bottom: 0.45rem !important;
    color: #334155 !important;
    font-size: 0.86rem !important;
    font-weight: 700 !important;
}

html[data-design-mode="setiai-board"] body.planner-page .close-modal,
html[data-design-mode="setiai-board"] body.planner-page > .fixed:not(.hidden):not(.theme-dropdown) button[onclick*="close"] {
    min-width: 2.55rem !important;
    min-height: 2.55rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] body.planner-page .close-modal:hover,
html[data-design-mode="setiai-board"] body.planner-page > .fixed:not(.hidden):not(.theme-dropdown) button[onclick*="close"]:hover {
    border-color: rgba(239, 68, 68, 0.32) !important;
    background: rgba(254, 242, 242, 0.94) !important;
    color: #b91c1c !important;
}

html[data-design-mode="setiai-board"] .planner-page .notification-toast {
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 20px 42px rgba(37, 99, 235, 0.24) !important;
}

html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    margin: 0 auto 1.5rem !important;
    padding: 1.25rem !important;
}

/* Network page: relationship board slice. Scoped so classic network remains untouched. */
html[data-design-mode="setiai-board"] body.network-page {
    background:
        radial-gradient(circle at 10% 4%, rgba(37, 99, 235, 0.1), transparent 28rem),
        radial-gradient(circle at 86% 12%, rgba(14, 165, 233, 0.08), transparent 26rem),
        linear-gradient(180deg, #fbfdff 0%, #eef5fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.network-page::before,
html[data-design-mode="setiai-board"] body.network-page::after {
    opacity: 0 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .network-page .setiai-app-shell {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
    height: calc(100dvh - 4.2rem) !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding-top: 0.5rem !important;
    padding-bottom: 4.8rem !important;
    gap: 0.5rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Universal One-Screen Layout Rules for Network Page */
.network-page .setiai-app-shell {
    height: calc(100vh - 4.2rem) !important;
    max-height: calc(100vh - 4.2rem) !important;
    min-height: 0 !important;
    padding-top: 0.5rem !important;
    padding-bottom: 4.8rem !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.network-page .workspace-area {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: stretch !important;
}

.network-page .sidebar {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    border-radius: 1.25rem !important;
}

html[data-design-mode="setiai-board"] .network-page .workspace-area {
    display: flex !important;
    flex-direction: row !important;
    flex: 1 1 0% !important;
    min-height: 0 !important;
    gap: 1rem !important;
    align-items: stretch !important;
    width: 100% !important;
}

html[data-design-mode="setiai-board"] .network-page .sidebar {
    height: 100% !important;
    min-height: 0 !important;
    flex: 0 0 20.5rem !important;
    width: 20.5rem !important;
    padding: 0.85rem !important;
    overflow: hidden !important;
    border: 1px solid rgba(203, 213, 225, 0.78) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.94)) !important;
    box-shadow: 0 22px 52px rgba(148, 163, 184, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .network-page .setiai-app-shell > .sidebar::before,
html[data-design-mode="setiai-board"] .network-page .glass::before,
html[data-design-mode="setiai-board"] .network-page .contact-card::before,
html[data-design-mode="setiai-board"] .network-page .btn-primary::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .network-page .sidebar > .flex-1 {
    gap: 0.75rem !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

html[data-design-mode="setiai-board"] .network-page .sidebar > .flex-1 > [id^="sidebar-block"] > .glass {
    flex: 1 1 0% !important;
    min-height: 0 !important;
    height: 100% !important;
}

html[data-design-mode="setiai-board"] .network-page #sidebar-block-contacts,
html[data-design-mode="setiai-board"] .network-page #sidebar-block-recommendations,
html[data-design-mode="setiai-board"] .network-page #sidebar-block-teams,
html[data-design-mode="setiai-board"] .network-page #networkRecommendationsContainer {
    flex: 1 1 0% !important;
    min-height: 0 !important;
    display: flex;
    flex-direction: column !important;
}

html[data-design-mode="setiai-board"] .network-page .network-tab-content.active {
    display: flex !important;
}

html[data-design-mode="setiai-board"] .network-page .workspace-area > .flex-1 {
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow-y: auto !important;
    padding-right: 0.5rem !important;
    min-width: 0 !important;
    padding: 0 !important;
}

html[data-design-mode="setiai-board"] .network-page [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

html[data-design-mode="setiai-board"] .network-page .ai-gradient,
html[data-design-mode="setiai-board"] .network-page .bg-clip-text {
    background: none !important;
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .network-page h1,
html[data-design-mode="setiai-board"] .network-page h2,
html[data-design-mode="setiai-board"] .network-page h3,
html[data-design-mode="setiai-board"] .network-page h4,
html[data-design-mode="setiai-board"] .network-page .font-bold,
html[data-design-mode="setiai-board"] .network-page .font-semibold,
html[data-design-mode="setiai-board"] .network-page .text-white {
    color: #0f172a !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .network-page h1 {
    font-size: clamp(1.65rem, 2.2vw, 2.35rem) !important;
    letter-spacing: -0.04em !important;
}

html[data-design-mode="setiai-board"] .network-page p,
html[data-design-mode="setiai-board"] .network-page .setiai-panel-subtitle,
html[data-design-mode="setiai-board"] .network-page .text-gray-300,
html[data-design-mode="setiai-board"] .network-page .text-gray-400,
html[data-design-mode="setiai-board"] .network-page .text-gray-500,
html[data-design-mode="setiai-board"] .network-page .text-white\/70,
html[data-design-mode="setiai-board"] .network-page .text-white\/60 {
    color: #64748b !important;
    text-wrap: pretty !important;
}

html[data-design-mode="setiai-board"] .network-page .text-blue-400,
html[data-design-mode="setiai-board"] .network-page .text-sky-400 {
    color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .network-page .text-cyan-400,
html[data-design-mode="setiai-board"] .network-page .text-teal-400 {
    color: #0e7490 !important;
}

html[data-design-mode="setiai-board"] .network-page .text-emerald-500,
html[data-design-mode="setiai-board"] .network-page .text-green-300 {
    color: #047857 !important;
}

html[data-design-mode="setiai-board"] .network-page .text-yellow-300,
html[data-design-mode="setiai-board"] .network-page .text-yellow-400,
html[data-design-mode="setiai-board"] .network-page .text-amber-400 {
    color: #b45309 !important;
}

html[data-design-mode="setiai-board"] .network-page .text-red-400 {
    color: #dc2626 !important;
}

html[data-design-mode="setiai-board"] .network-page .glass,
html[data-design-mode="setiai-board"] .network-page .glass-emerald,
html[data-design-mode="setiai-board"] .network-page .setiai-panel,
html[data-design-mode="setiai-board"] .network-page .assistant-owner-handoff-grid,
html[data-design-mode="setiai-board"] .network-page .contact-card,
html[data-design-mode="setiai-board"] .network-page .recommendation-card,
html[data-design-mode="setiai-board"] .network-page .stat-card,
html[data-design-mode="setiai-board"] .network-page .network-control-btn,
html[data-design-mode="setiai-board"] .network-page #networkViz,
html[data-design-mode="setiai-board"] .network-page [class*="bg-white/5"],
html[data-design-mode="setiai-board"] .network-page [class*="bg-black/40"],
html[data-design-mode="setiai-board"] .network-page [class*="bg-gray-700"],
html[data-design-mode="setiai-board"] .network-page [class*="bg-gray-900"],
html[data-design-mode="setiai-board"] .network-page [class*="from-gray-900"],
html[data-design-mode="setiai-board"] .network-page [class*="to-gray-800"] {
    border: 1px solid rgba(203, 213, 225, 0.76) !important;
    border-radius: 1.18rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.92)) !important;
    color: #0f172a !important;
    box-shadow: 0 18px 42px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .network-page .glass:hover,
html[data-design-mode="setiai-board"] .network-page .glass-emerald:hover,
html[data-design-mode="setiai-board"] .network-page .contact-card:hover,
html[data-design-mode="setiai-board"] .network-page .recommendation-card:hover {
    border-color: rgba(37, 99, 235, 0.26) !important;
    background: #f8fbff !important;
    box-shadow: 0 22px 48px rgba(96, 165, 250, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .network-page .network-container {
    height: auto !important;
    min-height: 30rem !important;
    max-height: none !important;
    border: 1px solid rgba(203, 213, 225, 0.76) !important;
    border-radius: 1.15rem !important;
    background: radial-gradient(circle at 52% 38%, rgba(96, 165, 250, 0.12), transparent 16rem), rgba(255, 255, 255, 0.78) !important;
}

html[data-design-mode="setiai-board"] .network-page #networkViz {
    min-height: 28rem !important;
    height: 100% !important;
    border-radius: 1rem !important;
    background:
        radial-gradient(circle at 50% 50%, rgba(37, 99, 235, 0.08), transparent 13rem),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.9)) !important;
}

html[data-design-mode="setiai-board"] .network-page .lg\:col-span-1.flex.flex-col > .glass,
html[data-design-mode="setiai-board"] .network-page #networkAIInsightsContainer,
html[data-design-mode="setiai-board"] .network-page #networkAIInsightsContainer + .glass-emerald,
html[data-design-mode="setiai-board"] .network-page #networkingStrategyWidget,
html[data-design-mode="setiai-board"] .network-page #followUpRemindersWidget {
    min-height: 0 !important;
}

html[data-design-mode="setiai-board"] .network-page #networkAIInsightsContainer,
html[data-design-mode="setiai-board"] .network-page #networkAIInsightsContainer + .glass-emerald,
html[data-design-mode="setiai-board"] .network-page .setiai-panel {
    display: flex !important;
    flex-direction: column !important;
}

html[data-design-mode="setiai-board"] .network-page #networkInsightsContent,
html[data-design-mode="setiai-board"] .network-page #networkRecommendationsList,
html[data-design-mode="setiai-board"] .network-page #networkingStrategyWidget,
html[data-design-mode="setiai-board"] .network-page #followUpRemindersWidget,
html[data-design-mode="setiai-board"] .network-page #connectionDetails,
html[data-design-mode="setiai-board"] .network-page #contactsListSidebar,
html[data-design-mode="setiai-board"] .network-page #networkRecommendationsContent,
html[data-design-mode="setiai-board"] .network-page #recommendedTeamsContainer,
html[data-design-mode="setiai-board"] .network-page #topActiveContacts,
html[data-design-mode="setiai-board"] .network-page #needAttentionContacts {
    scrollbar-color: rgba(37, 99, 235, 0.28) transparent !important;
}

.network-page .network-board-only {
    display: none !important;
}

html[data-design-mode="setiai-board"] .network-page .network-board-only {
    display: grid !important;
}

html[data-design-mode="setiai-board"] .network-page .network-insight-support-grid {
    grid-template-columns: 1fr !important;
    gap: 0.65rem !important;
    margin-top: 0.85rem !important;
}

html[data-design-mode="setiai-board"] .network-page .network-insight-support-item {
    min-height: 4.6rem !important;
    padding: 0.8rem 0.9rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .network-page .network-insight-support-item span,
html[data-design-mode="setiai-board"] .network-page .network-plan-stack span {
    display: block !important;
    color: #64748b !important;
    font-size: 0.72rem !important;
    font-weight: 760 !important;
    letter-spacing: 0.08em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .network-page .network-insight-support-item strong,
html[data-design-mode="setiai-board"] .network-page .network-plan-stack strong {
    display: block !important;
    margin-top: 0.25rem !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    font-variant-numeric: tabular-nums !important;
    letter-spacing: -0.02em !important;
}

html[data-design-mode="setiai-board"] .network-page .network-insight-support-item p {
    margin: 0.2rem 0 0 !important;
    color: #64748b !important;
    font-size: 0.82rem !important;
    line-height: 1.35 !important;
}

html[data-design-mode="setiai-board"] .network-page .network-plan-stack {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.65rem !important;
    margin-top: 0.85rem !important;
    padding-top: 0.85rem !important;
    border-top: 1px solid rgba(203, 213, 225, 0.82) !important;
}

html[data-design-mode="setiai-board"] .network-page .network-recommendation-summary {
    grid-template-columns: 1fr !important;
    gap: 0.65rem !important;
    margin-top: 0.85rem !important;
}

html[data-design-mode="setiai-board"] .network-page .network-recommendation-summary > div {
    min-height: 4.35rem !important;
    padding: 0.75rem 0.85rem !important;
    border: 1px solid rgba(14, 165, 233, 0.22) !important;
    border-radius: 0.95rem !important;
    background: rgba(240, 249, 255, 0.78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .network-page .network-recommendation-summary span {
    display: block !important;
    color: #0e7490 !important;
    font-size: 0.72rem !important;
    font-weight: 760 !important;
    letter-spacing: 0.08em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .network-page .network-recommendation-summary strong {
    display: block !important;
    margin-top: 0.25rem !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    font-variant-numeric: tabular-nums !important;
}

html[data-design-mode="setiai-board"] .network-page .network-recommendation-summary p {
    margin: 0.2rem 0 0 !important;
    color: #64748b !important;
    font-size: 0.82rem !important;
    line-height: 1.35 !important;
}

html[data-design-mode="setiai-board"] .network-page .network-plan-stack > div {
    min-height: 4.2rem !important;
    padding: 0.75rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .network-page #topActiveContacts,
html[data-design-mode="setiai-board"] .network-page #needAttentionContacts {
    height: 17rem !important;
}

html[data-design-mode="setiai-board"] .network-page .relationship-strength,
html[data-design-mode="setiai-board"] .network-page [class*="bg-gray-700"].h-1,
html[data-design-mode="setiai-board"] .network-page [class*="bg-gray-700"].h-2 {
    border: 0 !important;
    background: rgba(226, 232, 240, 0.92) !important;
    box-shadow: none !important;
}

html[data-design-mode="setiai-board"] .network-page .recommendation-tab,
html[data-design-mode="setiai-board"] .network-page .filter-tab,
html[data-design-mode="setiai-board"] .network-page [onclick^="filterContacts"],
html[data-design-mode="setiai-board"] .network-page [onclick^="filterConnections"],
html[data-design-mode="setiai-board"] .network-page #quickFilters button {
    min-height: 2.25rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.86) !important;
    color: #475569 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .network-page .recommendation-tab.active,
html[data-design-mode="setiai-board"] .network-page .filter-tab.active,
html[data-design-mode="setiai-board"] .network-page [onclick^="filterContacts"].bg-blue-600,
html[data-design-mode="setiai-board"] .network-page #quickFilters .bg-blue-600 {
    border-color: rgba(37, 99, 235, 0.34) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(219, 234, 254, 0.72)) !important;
    color: #1d4ed8 !important;
    box-shadow: 0 12px 26px rgba(37, 99, 235, 0.13), inset 0 0 0 1px rgba(37, 99, 235, 0.1) !important;
}

html[data-design-mode="setiai-board"] .network-page .btn-primary,
html[data-design-mode="setiai-board"] .network-page button[type="submit"],
html[data-design-mode="setiai-board"] .network-page button[class*="from-blue-500"][class*="to-blue-600"],
html[data-design-mode="setiai-board"] .network-page button[class*="from-blue-500"][class*="to-indigo"],
html[data-design-mode="setiai-board"] .network-page button[class*="from-sky-400"][class*="to-indigo"] {
    border-color: transparent !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .network-page .btn-primary *,
html[data-design-mode="setiai-board"] .network-page button[type="submit"] *,
html[data-design-mode="setiai-board"] .network-page button[class*="from-blue-500"][class*="to-blue-600"] *,
html[data-design-mode="setiai-board"] .network-page button[class*="from-blue-500"][class*="to-indigo"] *,
html[data-design-mode="setiai-board"] .network-page button[class*="from-sky-400"][class*="to-indigo"] *,
html[data-design-mode="setiai-board"] .network-page .setiai-card-icon *,
html[data-design-mode="setiai-board"] .network-page [class*="rounded-full"][class*="bg-gradient"] *,
html[data-design-mode="setiai-board"] .network-page [class*="rounded-full"][class*="from-blue"] *,
html[data-design-mode="setiai-board"] .network-page [class*="rounded-full"][class*="from-emerald"] * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .network-page .btn-secondary,
html[data-design-mode="setiai-board"] .network-page .setiai-card-action {
    min-height: 2.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] body.network-page button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .network-page input,
html[data-design-mode="setiai-board"] .network-page textarea,
html[data-design-mode="setiai-board"] .network-page select {
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .network-page input::placeholder,
html[data-design-mode="setiai-board"] .network-page textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden),
html[data-design-mode="setiai-board"] body.network-page #allContactsModal,
html[data-design-mode="setiai-board"] body.network-page #scheduleMeetingModal,
html[data-design-mode="setiai-board"] body.network-page #editContactNotesModal,
html[data-design-mode="setiai-board"] body.network-page #createFilterModal,
html[data-design-mode="setiai-board"] body.network-page #connectionRequestModal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
    overflow-y: auto !important;
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] body.network-page > .fixed.hidden {
    display: none !important;
}

html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) > div,
html[data-design-mode="setiai-board"] body.network-page #allContactsModal > div,
html[data-design-mode="setiai-board"] body.network-page #scheduleMeetingModal > div,
html[data-design-mode="setiai-board"] body.network-page #editContactNotesModal > div,
html[data-design-mode="setiai-board"] body.network-page #createFilterModal > div,
html[data-design-mode="setiai-board"] body.network-page #connectionRequestModal > div {
    width: min(100%, 48rem) !important;
    max-height: min(88dvh, 62rem) !important;
    overflow-y: auto !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)) !important;
    color: #0f172a !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] body.network-page #allContactsModal > div,
html[data-design-mode="setiai-board"] body.network-page #followUpModal > div {
    width: min(100%, 64rem) !important;
}

html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) label,
html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) .text-gray-300 {
    color: #334155 !important;
}

html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) .text-gray-400,
html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) .text-gray-500 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) [class*="bg-black/40"],
html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) [class*="bg-gray-700"],
html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) [class*="bg-gray-900"],
html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) [class*="from-gray-900"],
html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) [class*="to-gray-800"] {
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) button[onclick*="close"],
html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) button[onclick*="remove"] {
    min-width: 2.55rem !important;
    min-height: 2.55rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .network-page .notification-toast {
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 20px 42px rgba(37, 99, 235, 0.24) !important;
}

/* Feed page: social stream board slice. Scoped so classic feed stays untouched. */
html[data-design-mode="setiai-board"] .feed-page-shell {
    min-height: calc(100dvh - 4rem) !important;
    padding-top: 5.8rem !important;
    padding-bottom: 2rem !important;
    background:
        radial-gradient(circle at 12% 8%, rgba(37, 99, 235, 0.1), transparent 28rem),
        radial-gradient(circle at 86% 18%, rgba(14, 165, 233, 0.08), transparent 26rem),
        linear-gradient(180deg, #fbfdff 0%, #eef5fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell > .max-w-7xl {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1640px) !important;
    max-width: none !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .grid.lg\:grid-cols-3 {
    grid-template-columns: minmax(0, 1.85fr) minmax(20rem, 0.9fr) !important;
    align-items: start !important;
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .grid.lg\:grid-cols-3 > .lg\:col-span-2 {
    grid-column: auto !important;
    min-width: 0 !important;
}

.feed-board-only {
    display: none !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-only {
    display: grid !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell h1,
html[data-design-mode="setiai-board"] .feed-page-shell h2,
html[data-design-mode="setiai-board"] .feed-page-shell h3,
html[data-design-mode="setiai-board"] .feed-page-shell h4,
html[data-design-mode="setiai-board"] .feed-page-shell .font-bold,
html[data-design-mode="setiai-board"] .feed-page-shell .font-semibold,
html[data-design-mode="setiai-board"] .feed-page-shell .font-black,
html[data-design-mode="setiai-board"] .feed-page-shell .text-white {
    color: #0f172a !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell h1 {
    font-size: clamp(1.75rem, 2.4vw, 2.55rem) !important;
    letter-spacing: -0.045em !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell p,
html[data-design-mode="setiai-board"] .feed-page-shell .text-gray-300,
html[data-design-mode="setiai-board"] .feed-page-shell .text-gray-400,
html[data-design-mode="setiai-board"] .feed-page-shell .text-gray-500,
html[data-design-mode="setiai-board"] .feed-page-shell .text-purple-100,
html[data-design-mode="setiai-board"] .feed-page-shell .text-white\/70,
html[data-design-mode="setiai-board"] .feed-page-shell .text-white\/60 {
    color: #64748b !important;
    text-wrap: pretty !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .text-purple-400,
html[data-design-mode="setiai-board"] .feed-page-shell .text-blue-400,
html[data-design-mode="setiai-board"] .feed-page-shell .text-sky-400 {
    color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .text-red-400,
html[data-design-mode="setiai-board"] .feed-page-shell .text-red-500 {
    color: #dc2626 !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .text-emerald-400,
html[data-design-mode="setiai-board"] .feed-page-shell .text-green-400 {
    color: #047857 !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .bg-gradient-to-r.text-white,
html[data-design-mode="setiai-board"] .feed-page-shell .bg-gradient-to-r .text-white,
html[data-design-mode="setiai-board"] .feed-page-shell [class*="from-blue"][class*="to-sky"].text-white,
html[data-design-mode="setiai-board"] .feed-page-shell [class*="from-purple"][class*="to-blue"].text-white {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell [class*="from-blue-700"][class*="to-sky-600"],
html[data-design-mode="setiai-board"] .feed-page-shell .feed-composer-panel,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-filter-panel,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-sidebar-panel,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-post-card,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-post-attachment,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-comment-card,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-sidebar-row,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-hashtag-row,
html[data-design-mode="setiai-board"] .feed-page-shell .skeleton-card,
html[data-design-mode="setiai-board"] .feed-page-shell [class*="bg-black/40"],
html[data-design-mode="setiai-board"] .feed-page-shell [class*="bg-gray-800"],
html[data-design-mode="setiai-board"] .feed-page-shell [class*="bg-gray-700"] {
    border: 1px solid rgba(203, 213, 225, 0.78) !important;
    border-radius: 1.18rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.92)) !important;
    color: #0f172a !important;
    box-shadow: 0 18px 42px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-composer-panel {
    padding: 1rem !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-filter-panel {
    position: sticky !important;
    top: 5.55rem !important;
    z-index: 8 !important;
    padding: 0.85rem !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-sidebar-panel {
    margin-bottom: 0.85rem !important;
    padding: 1rem !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-profile-panel a,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-post-card:hover,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-sidebar-row:hover,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-hashtag-row:hover {
    border-color: rgba(37, 99, 235, 0.26) !important;
    background: #f8fbff !important;
    box-shadow: 0 22px 48px rgba(96, 165, 250, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-post-card {
    border-radius: 1.25rem !important;
    padding: 1.05rem !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-post-attachment,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-comment-card,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-sidebar-row {
    border-radius: 0.95rem !important;
    padding: 0.85rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.75rem !important;
    margin-top: 1rem !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-summary > div,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-rail-note {
    padding: 0.9rem !important;
    border: 1px solid rgba(203, 213, 225, 0.78) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.82) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-rail-note {
    gap: 0.25rem !important;
    margin-top: 0.85rem !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(255, 255, 255, 0.9)) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-summary span,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-rail-note span {
    display: block !important;
    color: #2563eb !important;
    font-size: 0.72rem !important;
    font-weight: 820 !important;
    letter-spacing: 0.08em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-summary strong,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-rail-note strong {
    display: block !important;
    margin-top: 0.25rem !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    letter-spacing: -0.02em !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-summary p,
html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-rail-note p {
    margin: 0.25rem 0 0 !important;
    color: #64748b !important;
    font-size: 0.82rem !important;
    line-height: 1.36 !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell img {
    outline: 1px solid rgba(0, 0, 0, 0.1) !important;
    outline-offset: -1px !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell input,
html[data-design-mode="setiai-board"] .feed-page-shell textarea,
html[data-design-mode="setiai-board"] .feed-page-shell select,
html[data-design-mode="setiai-board"] #event-modal input,
html[data-design-mode="setiai-board"] #event-modal textarea,
html[data-design-mode="setiai-board"] #event-modal select {
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell input::placeholder,
html[data-design-mode="setiai-board"] .feed-page-shell textarea::placeholder,
html[data-design-mode="setiai-board"] #event-modal input::placeholder,
html[data-design-mode="setiai-board"] #event-modal textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .filter-btn,
html[data-design-mode="setiai-board"] .feed-page-shell button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn),
html[data-design-mode="setiai-board"] #event-modal button,
html[data-design-mode="setiai-board"] #share-modal button {
    min-height: 2.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .filter-btn.active,
html[data-design-mode="setiai-board"] .feed-page-shell .filter-btn.bg-blue-600,
html[data-design-mode="setiai-board"] .feed-page-shell .filter-btn.bg-purple-600,
html[data-design-mode="setiai-board"] .feed-page-shell button[class*="from-blue"][class*="to-sky"],
html[data-design-mode="setiai-board"] .feed-page-shell button[class*="from-purple"][class*="to-blue"],
html[data-design-mode="setiai-board"] #event-modal button[class*="from-blue"][class*="to-sky"],
html[data-design-mode="setiai-board"] #share-modal button[class*="bg-purple-600"],
html[data-design-mode="setiai-board"] #share-modal button[class*="bg-blue-600"] {
    border-color: transparent !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell button:active,
html[data-design-mode="setiai-board"] #event-modal button:active,
html[data-design-mode="setiai-board"] #share-modal button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .rounded-full[class*="bg-gradient"],
html[data-design-mode="setiai-board"] .feed-page-shell .rounded-lg[class*="bg-gradient"] {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), 0 10px 20px rgba(37, 99, 235, 0.15) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .rounded-full[class*="bg-gradient"],
html[data-design-mode="setiai-board"] .feed-page-shell .rounded-full[class*="bg-gradient"] *,
html[data-design-mode="setiai-board"] .feed-page-shell .rounded-lg[class*="bg-gradient"],
html[data-design-mode="setiai-board"] .feed-page-shell .rounded-lg[class*="bg-gradient"] * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .border-gray-700,
html[data-design-mode="setiai-board"] .feed-page-shell .border-gray-600 {
    border-color: rgba(203, 213, 225, 0.82) !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell #feed-posts,
html[data-design-mode="setiai-board"] .feed-page-shell #popular-groups,
html[data-design-mode="setiai-board"] .feed-page-shell #my-groups,
html[data-design-mode="setiai-board"] .feed-page-shell #recommendations,
html[data-design-mode="setiai-board"] .feed-page-shell #trending-hashtags {
    scrollbar-color: rgba(37, 99, 235, 0.28) transparent !important;
}

html[data-design-mode="setiai-board"] .feed-page-shell .skeleton-title,
html[data-design-mode="setiai-board"] .feed-page-shell .skeleton-text {
    background: linear-gradient(90deg, rgba(226, 232, 240, 0.78), rgba(241, 245, 249, 0.98), rgba(226, 232, 240, 0.78)) !important;
}

html[data-design-mode="setiai-board"] #event-modal:not(.hidden),
html[data-design-mode="setiai-board"] #share-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
    overflow-y: auto !important;
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] #event-modal.hidden {
    display: none !important;
}

html[data-design-mode="setiai-board"] #event-modal .feed-modal-panel,
html[data-design-mode="setiai-board"] #share-modal .feed-share-modal-panel {
    width: min(100%, 42rem) !important;
    max-height: min(88dvh, 62rem) !important;
    overflow-y: auto !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)) !important;
    color: #0f172a !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] #event-modal h2,
html[data-design-mode="setiai-board"] #share-modal h2,
html[data-design-mode="setiai-board"] #event-modal label,
html[data-design-mode="setiai-board"] #share-modal .font-semibold {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] #event-modal .text-gray-300,
html[data-design-mode="setiai-board"] #event-modal .text-gray-400,
html[data-design-mode="setiai-board"] #share-modal .text-gray-400 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] #event-modal button[onclick*="close"],
html[data-design-mode="setiai-board"] #share-modal button[onclick*="remove"] {
    min-width: 2.55rem !important;
    min-height: 2.55rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(248, 250, 252, 0.92) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

/* Teams page: workspace board slice. Scoped so classic Teams stays untouched. */
.teams-board-only {
    display: none !important;
}

html[data-design-mode="setiai-board"] body.teams-page {
    background:
        radial-gradient(circle at 10% 10%, rgba(37, 99, 235, 0.1), transparent 29rem),
        radial-gradient(circle at 88% 20%, rgba(14, 165, 233, 0.08), transparent 28rem),
        linear-gradient(180deg, #fbfdff 0%, #eef5fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.teams-page::before,
html[data-design-mode="setiai-board"] body.teams-page::after {
    opacity: 0 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-page-shell {
    min-height: calc(100dvh - 4rem) !important;
    padding-top: 5.85rem !important;
    padding-bottom: 2rem !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-app-shell {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1640px) !important;
    max-width: none !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-board-only {
    display: grid !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-board-header {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-board-header > div {
    padding: 0.95rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 1.05rem !important;
    background: rgba(255, 255, 255, 0.86) !important;
    box-shadow: 0 16px 34px rgba(148, 163, 184, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-board-header span {
    display: block !important;
    color: #2563eb !important;
    font-size: 0.72rem !important;
    font-weight: 820 !important;
    letter-spacing: 0.09em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-board-header strong {
    display: block !important;
    margin-top: 0.25rem !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    letter-spacing: -0.02em !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-board-header p {
    margin: 0.25rem 0 0 !important;
    color: #64748b !important;
    font-size: 0.82rem !important;
    line-height: 1.38 !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-board-layout {
    align-items: flex-start !important;
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-left-sidebar,
html[data-design-mode="setiai-board"] .teams-page .teams-chat-panel {
    width: clamp(19rem, 22vw, 22.5rem) !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-main-panel {
    min-width: 0 !important;
}

html[data-design-mode="setiai-board"] .teams-page .sticky.top-20 {
    top: 5.65rem !important;
}

html[data-design-mode="setiai-board"] .teams-page h1,
html[data-design-mode="setiai-board"] .teams-page h2,
html[data-design-mode="setiai-board"] .teams-page h3,
html[data-design-mode="setiai-board"] .teams-page h4,
html[data-design-mode="setiai-board"] .teams-page .font-bold,
html[data-design-mode="setiai-board"] .teams-page .font-semibold,
html[data-design-mode="setiai-board"] .teams-page .text-white {
    color: #0f172a !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .teams-page p,
html[data-design-mode="setiai-board"] .teams-page .text-gray-300,
html[data-design-mode="setiai-board"] .teams-page .text-gray-400,
html[data-design-mode="setiai-board"] .teams-page .text-gray-500,
html[data-design-mode="setiai-board"] .teams-page .text-slate-200 {
    color: #64748b !important;
    text-wrap: pretty !important;
}

html[data-design-mode="setiai-board"] .teams-page .ai-gradient {
    background: none !important;
    color: #2563eb !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .teams-page .team-card,
html[data-design-mode="setiai-board"] .teams-page .project-card,
html[data-design-mode="setiai-board"] .teams-page .teams-empty-card,
html[data-design-mode="setiai-board"] .teams-page .teams-empty-panel,
html[data-design-mode="setiai-board"] .teams-page [id^="teamCalendarContainer_"],
html[data-design-mode="setiai-board"] .teams-page [id^="teamTasksContainer_"],
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-surface,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-card,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-list-row,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-card-accent,
html[data-design-mode="setiai-board"] body.teams-page .modal-content {
    border: 1px solid rgba(203, 213, 225, 0.8) !important;
    border-radius: 1.18rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.92)) !important;
    color: #0f172a !important;
    box-shadow: 0 18px 42px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .teams-page .team-card::before,
html[data-design-mode="setiai-board"] .teams-page .btn-primary::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .teams-page .team-card:hover,
html[data-design-mode="setiai-board"] .teams-page .project-card:hover,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-list-row:hover {
    border-color: rgba(37, 99, 235, 0.26) !important;
    background: #f8fbff !important;
    box-shadow: 0 22px 48px rgba(96, 165, 250, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .teams-page .team-card.active {
    border-color: rgba(37, 99, 235, 0.4) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(255, 255, 255, 0.94)) !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-empty-stage {
    min-height: clamp(26rem, calc(100dvh - 16rem), 42rem) !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-empty-card {
    width: 100% !important;
    max-width: none !important;
    padding: clamp(1.25rem, 2.6vw, 2rem) !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-empty-kicker,
html[data-design-mode="setiai-board"] .teams-page .status-badge,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-time,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-meta {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .teams-page .teams-empty-kicker,
html[data-design-mode="setiai-board"] .teams-page .text-sky-300,
html[data-design-mode="setiai-board"] .teams-page .text-sky-400,
html[data-design-mode="setiai-board"] .teams-page .text-blue-300,
html[data-design-mode="setiai-board"] .teams-page .text-blue-400,
html[data-design-mode="setiai-board"] .teams-page .text-purple-300,
html[data-design-mode="setiai-board"] .teams-page .text-purple-400 {
    color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .teams-page .text-emerald-300,
html[data-design-mode="setiai-board"] .teams-page .text-emerald-400,
html[data-design-mode="setiai-board"] .teams-page .text-emerald-500 {
    color: #047857 !important;
}

html[data-design-mode="setiai-board"] .teams-page .text-red-300,
html[data-design-mode="setiai-board"] .teams-page .text-red-400,
html[data-design-mode="setiai-board"] .teams-page .text-red-500 {
    color: #dc2626 !important;
}

html[data-design-mode="setiai-board"] .teams-page .member-avatar,
html[data-design-mode="setiai-board"] .teams-page .bg-blue-600,
html[data-design-mode="setiai-board"] .teams-page .bg-blue-600 *,
html[data-design-mode="setiai-board"] .teams-page [class*="bg-gradient"],
html[data-design-mode="setiai-board"] .teams-page [class*="bg-gradient"] *,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-surface [class*="bg-gradient"],
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-surface [class*="bg-gradient"] * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .teams-page .bg-blue-600 .text-purple-200,
html[data-design-mode="setiai-board"] .teams-page .bg-blue-600 .text-gray-400 {
    color: #dbeafe !important;
}

html[data-design-mode="setiai-board"] .teams-page .btn-primary,
html[data-design-mode="setiai-board"] .teams-page button[class*="bg-blue"],
html[data-design-mode="setiai-board"] .teams-page button[class*="bg-green"],
html[data-design-mode="setiai-board"] .teams-page button[class*="from-blue"],
html[data-design-mode="setiai-board"] .teams-page button[class*="from-purple"],
html[data-design-mode="setiai-board"] .teams-page button[class*="from-sky"],
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-surface button[type="submit"],
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-surface button[class*="from-"] {
    min-height: 2.45rem !important;
    border: 1px solid transparent !important;
    border-radius: 0.9rem !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .teams-page button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn):not([class*="bg-blue"]):not([class*="bg-green"]):not([class*="from-"]),
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-secondary-btn,
html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-secondary {
    min-height: 2.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .teams-page button:active,
html[data-design-mode="setiai-board"] body.teams-page .teams-runtime-modal button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .teams-page input,
html[data-design-mode="setiai-board"] .teams-page textarea,
html[data-design-mode="setiai-board"] .teams-page select,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-field,
html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-input,
html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-textarea {
    width: 100% !important;
    min-height: 2.85rem !important;
    padding: 0.7rem 0.9rem !important;
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-textarea {
    min-height: 7rem !important;
    resize: vertical !important;
}

html[data-design-mode="setiai-board"] body.teams-page .modal.active,
html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-overlay,
html[data-design-mode="setiai-board"] body.teams-page .runtime-overlay-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] body.teams-page .modal-content,
html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel,
html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-surface {
    max-height: min(88dvh, 62rem) !important;
    overflow-y: auto !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel {
    width: min(100%, 48rem) !important;
    padding: 2rem !important;
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 1.5rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 255, 0.96)) !important;
    color: #0f172a !important;
    box-shadow: 0 30px 90px rgba(37, 99, 235, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.98) !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel--compact {
    width: min(100%, 46rem) !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel h3 {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel button[type="submit"],
html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel button[class*="from-"],
html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel button[class*="from-"] * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-label {
    display: block !important;
    margin-bottom: 0.45rem !important;
    color: #334155 !important;
    font-weight: 700 !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel .space-y-4 {
    display: grid !important;
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-modal-panel .grid.grid-cols-2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-stat-number {
    background: none !important;
    color: #2563eb !important;
    -webkit-text-fill-color: #2563eb !important;
}

html[data-design-mode="setiai-board"] body.teams-page .runtime-panel-progress-track {
    background: #dbe5f0 !important;
}

html[data-design-mode="setiai-board"] .teams-page .bg-black\/40,
html[data-design-mode="setiai-board"] .teams-page .bg-white\/5,
html[data-design-mode="setiai-board"] .teams-page .bg-gray-700,
html[data-design-mode="setiai-board"] .teams-page .border-white\/10 {
    border-color: rgba(203, 213, 225, 0.8) !important;
}

/* Groups page: community board slice. Scoped so classic Groups stays untouched. */
.groups-board-only {
    display: none !important;
}

html[data-design-mode="setiai-board"] body.groups-page {
    background:
        radial-gradient(circle at 12% 8%, rgba(37, 99, 235, 0.1), transparent 30rem),
        radial-gradient(circle at 88% 18%, rgba(20, 184, 166, 0.08), transparent 28rem),
        linear-gradient(180deg, #fbfdff 0%, #eef5fb 100%) !important;
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.groups-page::before,
html[data-design-mode="setiai-board"] body.groups-page::after {
    opacity: 0 !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-page-shell {
    min-height: calc(100dvh - 4rem) !important;
    padding-top: 5.85rem !important;
    padding-bottom: 2rem !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-app-shell {
    width: min(100% - clamp(1rem, 2vw, 2.5rem), 1640px) !important;
    max-width: none !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-board-only {
    display: grid !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-board-header {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.85rem !important;
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-board-header > div {
    padding: 0.95rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    border-radius: 1.05rem !important;
    background: rgba(255, 255, 255, 0.86) !important;
    box-shadow: 0 16px 34px rgba(148, 163, 184, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-board-header span {
    display: block !important;
    color: #2563eb !important;
    font-size: 0.72rem !important;
    font-weight: 820 !important;
    letter-spacing: 0.09em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-board-header strong {
    display: block !important;
    margin-top: 0.25rem !important;
    color: #0f172a !important;
    font-size: 1rem !important;
    letter-spacing: -0.02em !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-board-header p {
    margin: 0.25rem 0 0 !important;
    color: #64748b !important;
    font-size: 0.82rem !important;
    line-height: 1.38 !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-board-layout {
    align-items: flex-start !important;
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-left-sidebar,
html[data-design-mode="setiai-board"] .groups-page .groups-members-panel {
    width: clamp(19rem, 22vw, 22.5rem) !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-main-panel {
    min-width: 0 !important;
}

html[data-design-mode="setiai-board"] .groups-page .sticky.top-20 {
    top: 5.65rem !important;
}

html[data-design-mode="setiai-board"] .groups-page h1,
html[data-design-mode="setiai-board"] .groups-page h2,
html[data-design-mode="setiai-board"] .groups-page h3,
html[data-design-mode="setiai-board"] .groups-page h4,
html[data-design-mode="setiai-board"] .groups-page .font-bold,
html[data-design-mode="setiai-board"] .groups-page .font-semibold,
html[data-design-mode="setiai-board"] .groups-page .text-white {
    color: #0f172a !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .groups-page p,
html[data-design-mode="setiai-board"] .groups-page .text-gray-200,
html[data-design-mode="setiai-board"] .groups-page .text-gray-300,
html[data-design-mode="setiai-board"] .groups-page .text-gray-400,
html[data-design-mode="setiai-board"] .groups-page .text-gray-500,
html[data-design-mode="setiai-board"] .groups-page .text-slate-200 {
    color: #64748b !important;
    text-wrap: pretty !important;
}

html[data-design-mode="setiai-board"] .groups-page .ai-gradient {
    background: none !important;
    color: #2563eb !important;
    -webkit-text-fill-color: currentColor !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-card,
html[data-design-mode="setiai-board"] .groups-page .post-card.group-post-card,
html[data-design-mode="setiai-board"] .groups-page .groups-empty-card,
html[data-design-mode="setiai-board"] .groups-page .groups-empty-panel,
html[data-design-mode="setiai-board"] .groups-page .group-content-header,
html[data-design-mode="setiai-board"] .groups-page .groups-list-empty,
html[data-design-mode="setiai-board"] .groups-page .groups-empty-posts,
html[data-design-mode="setiai-board"] .groups-page .group-comment-card,
html[data-design-mode="setiai-board"] .groups-page .group-member-row,
html[data-design-mode="setiai-board"] body.groups-page .modal-content {
    border: 1px solid rgba(203, 213, 225, 0.8) !important;
    border-radius: 1.18rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.92)) !important;
    color: #0f172a !important;
    box-shadow: 0 18px 42px rgba(148, 163, 184, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: none !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-card::before,
html[data-design-mode="setiai-board"] .groups-page .btn-primary::before {
    display: none !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-card:hover,
html[data-design-mode="setiai-board"] .groups-page .post-card.group-post-card:hover,
html[data-design-mode="setiai-board"] .groups-page .group-member-row:hover,
html[data-design-mode="setiai-board"] .groups-page .group-comment-card:hover {
    border-color: rgba(37, 99, 235, 0.26) !important;
    background: #f8fbff !important;
    box-shadow: 0 22px 48px rgba(96, 165, 250, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-card.active {
    border-color: rgba(37, 99, 235, 0.4) !important;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(255, 255, 255, 0.94)) !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-list-card {
    margin-bottom: 0.75rem !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-content-header {
    padding: 1.15rem !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-content-header-row {
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-toolbar {
    align-items: stretch !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-empty-stage {
    min-height: clamp(26rem, calc(100dvh - 16rem), 42rem) !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-empty-card {
    width: 100% !important;
    max-width: none !important;
    padding: clamp(1.25rem, 2.6vw, 2rem) !important;
}

html[data-design-mode="setiai-board"] .groups-page .groups-empty-kicker,
html[data-design-mode="setiai-board"] .groups-page .type-badge {
    border: 1px solid rgba(147, 197, 253, 0.58) !important;
    background: rgba(239, 246, 255, 0.86) !important;
    color: #1d4ed8 !important;
}

html[data-design-mode="setiai-board"] .groups-page .type-private {
    border-color: rgba(20, 184, 166, 0.28) !important;
    background: rgba(240, 253, 250, 0.88) !important;
    color: #0f766e !important;
}

html[data-design-mode="setiai-board"] .groups-page .text-sky-300,
html[data-design-mode="setiai-board"] .groups-page .text-sky-400,
html[data-design-mode="setiai-board"] .groups-page .text-blue-300,
html[data-design-mode="setiai-board"] .groups-page .text-blue-400,
html[data-design-mode="setiai-board"] .groups-page .text-purple-300,
html[data-design-mode="setiai-board"] .groups-page .text-purple-400 {
    color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .groups-page .text-yellow-500,
html[data-design-mode="setiai-board"] .groups-page .text-yellow-400 {
    color: #b45309 !important;
}

html[data-design-mode="setiai-board"] .groups-page .text-red-400,
html[data-design-mode="setiai-board"] .groups-page .text-red-500 {
    color: #dc2626 !important;
}

html[data-design-mode="setiai-board"] .groups-page .rounded-full[class*="bg-gradient"],
html[data-design-mode="setiai-board"] .groups-page .rounded-2xl[class*="bg-gradient"],
html[data-design-mode="setiai-board"] .groups-page [class*="bg-gradient"] *,
html[data-design-mode="setiai-board"] .groups-page .bg-blue-600,
html[data-design-mode="setiai-board"] .groups-page .bg-blue-600 *,
html[data-design-mode="setiai-board"] .groups-page .bg-red-600,
html[data-design-mode="setiai-board"] .groups-page .bg-red-600 * {
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .groups-page .btn-primary,
html[data-design-mode="setiai-board"] .groups-page button[class*="bg-blue"],
html[data-design-mode="setiai-board"] .groups-page button[class*="from-blue"],
html[data-design-mode="setiai-board"] .groups-page button[class*="from-indigo"],
html[data-design-mode="setiai-board"] body.groups-page .modal-content button[type="submit"] {
    min-height: 2.45rem !important;
    border: 1px solid transparent !important;
    border-radius: 0.9rem !important;
    background: linear-gradient(180deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.22) !important;
    transition-property: background, border-color, box-shadow, color, transform !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .groups-page button[class*="bg-red"] {
    background: linear-gradient(180deg, #ef4444, #dc2626) !important;
    box-shadow: 0 14px 30px rgba(220, 38, 38, 0.16) !important;
}

html[data-design-mode="setiai-board"] .groups-page button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn):not(.btn-primary):not([type="submit"]):not([class*="bg-blue"]):not([class*="bg-red"]):not([class*="from-"]),
html[data-design-mode="setiai-board"] body.groups-page .modal-content button[type="button"]:not(.btn-primary):not([class*="bg-blue"]):not([class*="from-"]),
html[data-design-mode="setiai-board"] body.groups-page .modal-content button[onclick*="closeModal"] {
    min-height: 2.45rem !important;
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: #334155 !important;
    box-shadow: 0 8px 18px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .groups-page button:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .groups-page input,
html[data-design-mode="setiai-board"] .groups-page textarea,
html[data-design-mode="setiai-board"] .groups-page select,
html[data-design-mode="setiai-board"] body.groups-page .modal-content .form-input,
html[data-design-mode="setiai-board"] body.groups-page .modal-content .form-textarea {
    width: 100% !important;
    min-height: 2.85rem !important;
    padding: 0.7rem 0.9rem !important;
    border: 1px solid rgba(203, 213, 225, 0.92) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .groups-page input::placeholder,
html[data-design-mode="setiai-board"] .groups-page textarea::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] .groups-page .post-card.group-post-card {
    padding: 1.1rem !important;
    margin-bottom: 1rem !important;
}

html[data-design-mode="setiai-board"] .groups-page .post-card.group-post-card.pinned {
    border-color: rgba(245, 158, 11, 0.34) !important;
    background: linear-gradient(180deg, rgba(255, 251, 235, 0.98), rgba(255, 255, 255, 0.94)) !important;
}

html[data-design-mode="setiai-board"] .groups-page .reaction-btn {
    min-height: 2.35rem !important;
    border: 1px solid rgba(203, 213, 225, 0.82) !important;
    background: rgba(255, 255, 255, 0.86) !important;
    color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .groups-page .reaction-btn.active,
html[data-design-mode="setiai-board"] .groups-page .reaction-btn:hover {
    border-color: rgba(37, 99, 235, 0.32) !important;
    background: rgba(239, 246, 255, 0.96) !important;
    color: #1d4ed8 !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-comments-panel,
html[data-design-mode="setiai-board"] .groups-page .group-comments-thread {
    border-color: rgba(226, 232, 240, 0.95) !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-comment-card {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] .groups-page .group-comment-composer {
    align-items: stretch !important;
}

html[data-design-mode="setiai-board"] .groups-page #group-members-list {
    display: grid !important;
    gap: 0.55rem !important;
}

html[data-design-mode="setiai-board"] body.groups-page .modal.active {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
    background: rgba(226, 232, 240, 0.76) !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] body.groups-page .modal-content {
    width: min(100%, 48rem) !important;
    max-height: min(88dvh, 62rem) !important;
    overflow-y: auto !important;
    padding: 2rem !important;
}

html[data-design-mode="setiai-board"] body.groups-page .modal-content label {
    color: #334155 !important;
    font-weight: 700 !important;
}

html:not([data-design-mode="setiai-board"]) .account-board-only {
    display: none !important;
}

html[data-design-mode="setiai-board"] body.account-page {
    min-height: 100vh !important;
    background:
        radial-gradient(circle at 12% 8%, rgba(37, 99, 235, 0.14), transparent 28rem),
        radial-gradient(circle at 88% 18%, rgba(14, 165, 233, 0.1), transparent 30rem),
        linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%) !important;
    color: var(--setiai-board-text) !important;
    overflow-x: hidden !important;
}

html[data-design-mode="setiai-board"] body.account-page::before {
    opacity: 0.7 !important;
    background-image:
        linear-gradient(rgba(37, 99, 235, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(14, 165, 233, 0.04) 1px, transparent 1px) !important;
    background-size: 56px 56px !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] body.account-page::after {
    opacity: 0.46 !important;
    background:
        radial-gradient(circle at 26% 44%, rgba(37, 99, 235, 0.08), transparent 26rem),
        radial-gradient(circle at 70% 70%, rgba(125, 211, 252, 0.12), transparent 24rem) !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] .account-page .account-page-shell {
    width: min(100% - clamp(1rem, 3vw, 3rem), 76rem) !important;
    max-width: none !important;
    padding-top: clamp(1.5rem, 3vw, 2.4rem) !important;
    padding-bottom: 4rem !important;
}

html[data-design-mode="setiai-board"] .account-page .account-page-shell--narrow {
    width: min(100% - clamp(1rem, 3vw, 3rem), 64rem) !important;
}

html[data-design-mode="setiai-board"] .account-page .account-page-shell--wide {
    width: min(100% - clamp(1rem, 3vw, 3rem), 78rem) !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-hero {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 28rem) !important;
    gap: 1rem !important;
    align-items: stretch !important;
    margin-bottom: 1.25rem !important;
    padding: clamp(1.2rem, 2vw, 1.8rem) !important;
    border: 1px solid rgba(148, 163, 184, 0.2) !important;
    border-radius: 1.75rem !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(239, 246, 255, 0.9)),
        radial-gradient(circle at 16% 10%, rgba(37, 99, 235, 0.12), transparent 22rem) !important;
    box-shadow: 0 28px 62px rgba(148, 163, 184, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-kicker {
    display: inline-flex !important;
    align-items: center !important;
    width: max-content !important;
    margin-bottom: 0.9rem !important;
    padding: 0.4rem 0.72rem !important;
    border: 1px solid rgba(37, 99, 235, 0.18) !important;
    border-radius: 999px !important;
    background: rgba(37, 99, 235, 0.08) !important;
    color: #1d4ed8 !important;
    font-size: 0.72rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-hero h1 {
    margin: 0 !important;
    color: #0f172a !important;
    font-size: clamp(2rem, 4vw, 3.5rem) !important;
    line-height: 0.94 !important;
    letter-spacing: -0.055em !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-hero p {
    max-width: 38rem !important;
    margin-top: 0.95rem !important;
    color: #64748b !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    text-wrap: pretty !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-hero-grid {
    display: grid !important;
    gap: 0.65rem !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-mini-card {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
    min-height: 4.25rem !important;
    padding: 0.85rem 1rem !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 1.1rem !important;
    background: rgba(255, 255, 255, 0.74) !important;
    color: #0f172a !important;
    text-decoration: none !important;
    box-shadow: 0 12px 24px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
    transition-property: transform, border-color, box-shadow, background !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-mini-card:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(37, 99, 235, 0.24) !important;
    box-shadow: 0 18px 34px rgba(96, 165, 250, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-mini-card.active {
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.96), rgba(14, 165, 233, 0.88)) !important;
    border-color: rgba(37, 99, 235, 0.26) !important;
    color: #ffffff !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-mini-card span {
    color: inherit !important;
    opacity: 0.72 !important;
    font-size: 0.72rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] .account-page .account-board-mini-card strong {
    color: inherit !important;
    font-size: 0.95rem !important;
}

html[data-design-mode="setiai-board"] .account-page .account-page-title {
    margin-bottom: 1.1rem !important;
    color: #0f172a !important;
    letter-spacing: -0.04em !important;
}

html[data-design-mode="setiai-board"] .account-page .account-page-header {
    align-items: end !important;
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] .account-page .settings-card,
html[data-design-mode="setiai-board"] .account-page .security-card,
html[data-design-mode="setiai-board"] .account-page .notification-card {
    position: relative !important;
    overflow: hidden !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 1.35rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.94)) !important;
    box-shadow: 0 20px 44px rgba(148, 163, 184, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
    color: #0f172a !important;
    backdrop-filter: blur(18px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] .account-page .settings-card::before,
html[data-design-mode="setiai-board"] .account-page .security-card::before,
html[data-design-mode="setiai-board"] .account-page .notification-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #2563eb, #38bdf8, transparent) !important;
    opacity: 0.82 !important;
    pointer-events: none !important;
}

html[data-design-mode="setiai-board"] .account-page .settings-card h2,
html[data-design-mode="setiai-board"] .account-page .security-card h2,
html[data-design-mode="setiai-board"] .account-page .notification-card h3,
html[data-design-mode="setiai-board"] .account-page .setting-item h3,
html[data-design-mode="setiai-board"] .account-page .session-item h3 {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] .account-page .setting-item,
html[data-design-mode="setiai-board"] .account-page .session-item,
html[data-design-mode="setiai-board"] .account-page .security-card .bg-white.bg-opacity-5,
html[data-design-mode="setiai-board"] .account-page .security-card .bg-white\/5 {
    border-color: rgba(148, 163, 184, 0.16) !important;
    background: rgba(248, 250, 252, 0.78) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

html[data-design-mode="setiai-board"] .account-page .setting-item {
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] .account-page .settings-card .setting-item:first-of-type,
html[data-design-mode="setiai-board"] .account-page .security-card .session-item:first-of-type {
    border-top-left-radius: 1rem !important;
    border-top-right-radius: 1rem !important;
}

html[data-design-mode="setiai-board"] .account-page .settings-card .setting-item:last-child {
    border-bottom-left-radius: 1rem !important;
    border-bottom-right-radius: 1rem !important;
}

html[data-design-mode="setiai-board"] .account-page .text-gray-400,
html[data-design-mode="setiai-board"] .account-page .text-gray-500,
html[data-design-mode="setiai-board"] .account-page .text-gray-600 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .account-page .text-red-400,
html[data-design-mode="setiai-board"] .account-page .text-red-500 {
    color: #dc2626 !important;
}

html[data-design-mode="setiai-board"] .account-page .text-emerald-500,
html[data-design-mode="setiai-board"] .account-page .text-green-300 {
    color: #059669 !important;
}

html[data-design-mode="setiai-board"] .account-page .text-sky-300,
html[data-design-mode="setiai-board"] .account-page .text-sky-400,
html[data-design-mode="setiai-board"] .account-page .text-blue-400 {
    color: #2563eb !important;
}

html[data-design-mode="setiai-board"] .account-page .form-input,
html[data-design-mode="setiai-board"] .account-page select {
    min-height: 2.75rem !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.9) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
}

html[data-design-mode="setiai-board"] .account-page .form-input:focus,
html[data-design-mode="setiai-board"] .account-page select:focus {
    outline: none !important;
    border-color: rgba(37, 99, 235, 0.42) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1) !important;
}

html[data-design-mode="setiai-board"] .account-page .filter-btn,
html[data-design-mode="setiai-board"] .account-page button:not(.runtime-theme-trigger):not(.notification-btn):not(.user-btn):not([class*="bg-gradient"]):not([class*="bg-blue"]):not([class*="bg-green"]):not([class*="bg-red"]) {
    min-height: 2.55rem !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 0.95rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #334155 !important;
    box-shadow: 0 10px 22px rgba(148, 163, 184, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
    transition-property: transform, border-color, box-shadow, background, color !important;
    transition-duration: 170ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .account-page .filter-btn:hover,
html[data-design-mode="setiai-board"] .account-page .filter-btn.active {
    border-color: rgba(37, 99, 235, 0.28) !important;
    background: rgba(37, 99, 235, 0.1) !important;
    color: #1d4ed8 !important;
    transform: translateY(-1px) !important;
}

html[data-design-mode="setiai-board"] .account-page button[class*="bg-gradient"],
html[data-design-mode="setiai-board"] .account-page button[class*="bg-blue"],
html[data-design-mode="setiai-board"] .account-page button[class*="from-blue"] {
    color: #ffffff !important;
    border: 1px solid rgba(37, 99, 235, 0.28) !important;
    border-radius: 0.95rem !important;
    background: linear-gradient(135deg, #2563eb, #0ea5e9) !important;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.2) !important;
}

html[data-design-mode="setiai-board"] .account-page button[class*="bg-green"] {
    color: #ffffff !important;
    background: linear-gradient(135deg, #059669, #10b981) !important;
    box-shadow: 0 16px 32px rgba(16, 185, 129, 0.18) !important;
}

html[data-design-mode="setiai-board"] .account-page button[class*="bg-red"] {
    color: #ffffff !important;
    background: linear-gradient(135deg, #dc2626, #f97316) !important;
    box-shadow: 0 16px 32px rgba(239, 68, 68, 0.16) !important;
}

html[data-design-mode="setiai-board"] .account-page button:active,
html[data-design-mode="setiai-board"] .account-page .filter-btn:active,
html[data-design-mode="setiai-board"] .account-page .account-board-mini-card:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] .account-page .slider {
    background: rgba(148, 163, 184, 0.32) !important;
    box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.12) !important;
}

html[data-design-mode="setiai-board"] .account-page .slider::before {
    background: #ffffff !important;
    box-shadow: 0 5px 12px rgba(15, 23, 42, 0.18) !important;
}

html[data-design-mode="setiai-board"] .account-page input:checked + .slider {
    background: linear-gradient(135deg, #2563eb, #0ea5e9) !important;
}

html[data-design-mode="setiai-board"] .account-page .notification-card {
    cursor: pointer !important;
    margin-bottom: 0.85rem !important;
    transition-property: transform, border-color, box-shadow, background !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] .account-page .notification-card:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(37, 99, 235, 0.24) !important;
    box-shadow: 0 24px 48px rgba(96, 165, 250, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

html[data-design-mode="setiai-board"] .account-page .notification-card.unread {
    border-left-color: #2563eb !important;
    background:
        linear-gradient(180deg, rgba(239, 246, 255, 0.98), rgba(255, 255, 255, 0.94)),
        radial-gradient(circle at 5% 0%, rgba(37, 99, 235, 0.12), transparent 12rem) !important;
}

html[data-design-mode="setiai-board"] .account-page .notification-icon,
html[data-design-mode="setiai-board"] .account-page .feature-icon,
html[data-design-mode="setiai-board"] .account-page .icon-lock {
    box-shadow: 0 14px 28px rgba(37, 99, 235, 0.16) !important;
}

html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip {
    display: grid !important;
    gap: 1rem !important;
    padding: 1.1rem !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 1.35rem !important;
    background:
        linear-gradient(180deg, rgba(239, 246, 255, 0.92), rgba(255, 255, 255, 0.9)),
        radial-gradient(circle at 0% 0%, rgba(37, 99, 235, 0.1), transparent 16rem) !important;
    box-shadow: 0 18px 38px rgba(96, 165, 250, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip > .flex {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 1rem !important;
}

html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip .max-w-3xl {
    max-width: none !important;
}

html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip .assistant-owner-handoff-grid {
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
}

html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip a {
    border-color: rgba(148, 163, 184, 0.18) !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84) !important;
}

html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip p,
html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip .text-slate-300,
html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip .text-slate-400 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] .account-page #unsavedIndicator {
    background: rgba(245, 158, 11, 0.12) !important;
    color: #92400e !important;
    border-color: rgba(245, 158, 11, 0.28) !important;
}

html:not([data-design-mode="setiai-board"]) .auth-board-only {
    display: none !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page {
    min-height: 100vh !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(1rem, 3vw, 2.5rem) !important;
    background:
        radial-gradient(circle at 12% 14%, rgba(37, 99, 235, 0.14), transparent 28rem),
        radial-gradient(circle at 88% 12%, rgba(14, 165, 233, 0.1), transparent 28rem),
        linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%) !important;
    color: var(--setiai-board-text) !important;
    overflow-x: hidden !important;
    -webkit-font-smoothing: antialiased !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page::before,
html[data-design-mode="setiai-board"] body.auth-entry-page::after {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page::before {
    opacity: 0.72 !important;
    background-image:
        linear-gradient(rgba(37, 99, 235, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(14, 165, 233, 0.04) 1px, transparent 1px) !important;
    background-size: 56px 56px !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page::after {
    opacity: 0.5 !important;
    background:
        radial-gradient(circle at 22% 54%, rgba(37, 99, 235, 0.08), transparent 24rem),
        radial-gradient(circle at 78% 76%, rgba(125, 211, 252, 0.14), transparent 25rem) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-card {
    position: relative !important;
    box-sizing: border-box !important;
    width: min(100%, 62rem) !important;
    max-width: none !important;
    padding: clamp(0.85rem, 1.8vw, 1.15rem) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 2rem !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(239, 246, 255, 0.9)),
        radial-gradient(circle at 14% 0%, rgba(37, 99, 235, 0.1), transparent 24rem) !important;
    box-shadow: 0 30px 72px rgba(148, 163, 184, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
    backdrop-filter: blur(22px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-login-card,
html[data-design-mode="setiai-board"] body.auth-entry-page .auth-reset-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(20rem, 0.82fr) !important;
    gap: 1rem !important;
    align-items: stretch !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-hero {
    display: flex !important;
    min-height: 100% !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    gap: 1.5rem !important;
    padding: clamp(1.35rem, 2.8vw, 2.35rem) !important;
    border: 1px solid rgba(37, 99, 235, 0.22) !important;
    border-radius: 1.55rem !important;
    background:
        radial-gradient(circle at 18% 12%, rgba(255, 255, 255, 0.22), transparent 18rem),
        linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 24px 52px rgba(37, 99, 235, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.26) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-hero h1 {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: clamp(2.25rem, 4.7vw, 4.4rem) !important;
    line-height: 0.92 !important;
    letter-spacing: -0.06em !important;
    text-wrap: balance !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-hero p {
    max-width: 34rem !important;
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    text-wrap: pretty !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-kicker {
    display: inline-flex !important;
    width: max-content !important;
    align-items: center !important;
    padding: 0.42rem 0.75rem !important;
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.14) !important;
    color: #ffffff !important;
    font-size: 0.72rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-steps {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.55rem !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-steps span {
    min-height: 3rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.65rem !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.13) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    font-size: 0.76rem !important;
    font-weight: 800 !important;
    text-align: center !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-main {
    min-width: 0 !important;
    padding: clamp(1.15rem, 2vw, 1.75rem) !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-radius: 1.45rem !important;
    background: rgba(255, 255, 255, 0.82) !important;
    color: #0f172a !important;
    box-shadow: 0 16px 34px rgba(148, 163, 184, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .icon-lock,
html[data-design-mode="setiai-board"] body.auth-entry-page .reset-badge {
    width: 4rem !important;
    height: 4rem !important;
    margin-bottom: 1.15rem !important;
    border-radius: 1.25rem !important;
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%) !important;
    box-shadow: 0 18px 34px rgba(37, 99, 235, 0.18) !important;
    animation: none !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .logo-gradient {
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-main h1,
html[data-design-mode="setiai-board"] body.auth-entry-page .reset-heading,
html[data-design-mode="setiai-board"] body.auth-entry-page .font-bold,
html[data-design-mode="setiai-board"] body.auth-entry-page .font-semibold,
html[data-design-mode="setiai-board"] body.auth-entry-page .text-slate-900 {
    color: #0f172a !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-main p,
html[data-design-mode="setiai-board"] body.auth-entry-page .reset-copy,
html[data-design-mode="setiai-board"] body.auth-entry-page .reset-label,
html[data-design-mode="setiai-board"] body.auth-entry-page .reset-link-muted,
html[data-design-mode="setiai-board"] body.auth-entry-page .text-slate-500,
html[data-design-mode="setiai-board"] body.auth-entry-page .text-gray-400,
html[data-design-mode="setiai-board"] body.auth-entry-page .text-gray-500 {
    color: #64748b !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .text-sky-400,
html[data-design-mode="setiai-board"] body.auth-entry-page .text-blue-300 {
    color: #2563eb !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .text-red-300,
html[data-design-mode="setiai-board"] body.auth-entry-page .text-red-200 {
    color: #dc2626 !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .text-green-300,
html[data-design-mode="setiai-board"] body.auth-entry-page .text-emerald-200 {
    color: #059669 !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .form-input {
    min-height: 3rem !important;
    padding: 0.85rem 1rem !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 1rem !important;
    background: rgba(255, 255, 255, 0.92) !important;
    color: #0f172a !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
    transition-property: border-color, box-shadow, background !important;
    transition-duration: 170ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .form-input::placeholder {
    color: #94a3b8 !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .form-input:focus {
    outline: none !important;
    border-color: rgba(37, 99, 235, 0.42) !important;
    background: rgba(255, 255, 255, 0.98) !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .btn-primary,
html[data-design-mode="setiai-board"] body.auth-entry-page a[class*="bg-sky"] {
    min-height: 3rem !important;
    border: 1px solid rgba(37, 99, 235, 0.28) !important;
    border-radius: 1rem !important;
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(37, 99, 235, 0.22) !important;
    transition-property: transform, border-color, box-shadow, background !important;
    transition-duration: 180ms !important;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .btn-primary:hover,
html[data-design-mode="setiai-board"] body.auth-entry-page a[class*="bg-sky"]:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 22px 42px rgba(37, 99, 235, 0.26) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .btn-primary:active,
html[data-design-mode="setiai-board"] body.auth-entry-page a[class*="bg-sky"]:active {
    transform: scale(0.96) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .feature-item {
    align-items: center !important;
    gap: 0.85rem !important;
    padding: 0.85rem !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-radius: 1rem !important;
    background: rgba(248, 250, 252, 0.82) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .feature-icon {
    width: 2.5rem !important;
    height: 2.5rem !important;
    border-radius: 0.9rem !important;
    background: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%) !important;
    box-shadow: 0 12px 22px rgba(37, 99, 235, 0.16) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .border-white\/10 {
    border-color: rgba(148, 163, 184, 0.16) !important;
}

html[data-design-mode="setiai-board"] body.auth-entry-page .bg-blue-500.bg-opacity-10,
html[data-design-mode="setiai-board"] body.auth-entry-page .bg-emerald-600.bg-opacity-10,
html[data-design-mode="setiai-board"] body.auth-entry-page .bg-red-500.bg-opacity-10,
html[data-design-mode="setiai-board"] body.auth-entry-page .bg-red-500\/10,
html[data-design-mode="setiai-board"] body.auth-entry-page .bg-emerald-500\/10 {
    background: rgba(239, 246, 255, 0.88) !important;
    border-color: rgba(147, 197, 253, 0.5) !important;
    color: #1d4ed8 !important;
}

@media (max-width: 820px) {
    html[data-design-mode="setiai-board"] body.auth-entry-page {
        align-items: start !important;
        padding: 0.75rem !important;
    }

    html[data-design-mode="setiai-board"] body.auth-entry-page .auth-login-card,
    html[data-design-mode="setiai-board"] body.auth-entry-page .auth-reset-card {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-hero {
        min-height: auto !important;
    }

    html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-hero h1 {
        font-size: clamp(2rem, 12vw, 3.2rem) !important;
    }

    html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-steps {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-card {
        border-radius: 1.5rem !important;
    }

    html[data-design-mode="setiai-board"] body.auth-entry-page .auth-entry-main {
        padding: 1rem !important;
    }
}

@media (max-width: 1180px) {
    html[data-design-mode="setiai-board"] .groups-page .groups-board-layout {
        flex-wrap: wrap !important;
    }

    html[data-design-mode="setiai-board"] .groups-page .groups-left-sidebar,
    html[data-design-mode="setiai-board"] .groups-page .groups-members-panel {
        width: calc(50% - 0.5rem) !important;
    }

    html[data-design-mode="setiai-board"] .groups-page .groups-main-panel {
        flex-basis: 100% !important;
        order: 3 !important;
    }
}

@media (max-width: 900px) {
    html[data-design-mode="setiai-board"] .groups-page .groups-page-shell {
        padding-top: 5.35rem !important;
    }

    html[data-design-mode="setiai-board"] .groups-page .groups-board-header,
    html[data-design-mode="setiai-board"] .groups-page .groups-empty-grid {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .groups-page .groups-board-layout,
    html[data-design-mode="setiai-board"] .groups-page .group-content-header-row,
    html[data-design-mode="setiai-board"] .groups-page .group-comment-composer {
        flex-direction: column !important;
    }

    html[data-design-mode="setiai-board"] .groups-page .groups-left-sidebar,
    html[data-design-mode="setiai-board"] .groups-page .groups-members-panel,
    html[data-design-mode="setiai-board"] .groups-page .groups-main-panel {
        width: 100% !important;
        flex-basis: auto !important;
        order: initial !important;
    }

    html[data-design-mode="setiai-board"] .groups-page .sticky.top-20 {
        position: relative !important;
        top: auto !important;
    }

    html[data-design-mode="setiai-board"] body.groups-page .modal-content {
        padding: 1rem !important;
    }
}

@media (max-width: 1180px) {
    html[data-design-mode="setiai-board"] .teams-page .teams-board-layout {
        flex-wrap: wrap !important;
    }

    html[data-design-mode="setiai-board"] .teams-page .teams-left-sidebar,
    html[data-design-mode="setiai-board"] .teams-page .teams-chat-panel {
        width: calc(50% - 0.5rem) !important;
    }

    html[data-design-mode="setiai-board"] .teams-page .teams-main-panel {
        flex-basis: 100% !important;
        order: 3 !important;
    }
}

@media (max-width: 900px) {
    html[data-design-mode="setiai-board"] .teams-page .teams-page-shell {
        padding-top: 5.35rem !important;
    }

    html[data-design-mode="setiai-board"] .teams-page .teams-board-header,
    html[data-design-mode="setiai-board"] .teams-page .teams-empty-grid,
    html[data-design-mode="setiai-board"] .teams-page .grid.grid-cols-2,
    html[data-design-mode="setiai-board"] .teams-page .md\:grid-cols-2,
    html[data-design-mode="setiai-board"] .teams-page .grid-cols-2 {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .teams-page .teams-board-layout {
        flex-direction: column !important;
    }

    html[data-design-mode="setiai-board"] .teams-page .teams-left-sidebar,
    html[data-design-mode="setiai-board"] .teams-page .teams-chat-panel,
    html[data-design-mode="setiai-board"] .teams-page .teams-main-panel {
        width: 100% !important;
        flex-basis: auto !important;
        order: initial !important;
    }

    html[data-design-mode="setiai-board"] .teams-page .sticky.top-20 {
        position: relative !important;
        top: auto !important;
    }
}

@media (max-width: 1180px) {
    html[data-design-mode="setiai-board"] .feed-page-shell .grid.lg\:grid-cols-3 {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .feed-page-shell .feed-filter-panel {
        position: static !important;
    }
}

@media (max-width: 900px) {
    html[data-design-mode="setiai-board"] .network-page .setiai-app-shell {
        width: min(100% - 1rem, 100%) !important;
    }

    html[data-design-mode="setiai-board"] .network-page .setiai-app-shell > .sidebar > .flex-1,
    html[data-design-mode="setiai-board"] .network-page .grid.grid-cols-2,
    html[data-design-mode="setiai-board"] .network-page .md\:grid-cols-2,
    html[data-design-mode="setiai-board"] .network-page .lg\:grid-cols-3 {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .network-page .network-container,
    html[data-design-mode="setiai-board"] .network-page #networkViz {
        min-height: 24rem !important;
    }

    html[data-design-mode="setiai-board"] body.network-page > .fixed:not(.hidden) > div {
        width: min(100% - 1rem, 48rem) !important;
        padding: 1rem !important;
    }

    html[data-design-mode="setiai-board"] .feed-page-shell {
        padding-top: 5.25rem !important;
    }

    html[data-design-mode="setiai-board"] .feed-page-shell > .max-w-7xl {
        width: min(100% - 1rem, 100%) !important;
    }

    html[data-design-mode="setiai-board"] .feed-page-shell .feed-board-summary {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .feed-page-shell .feed-composer-panel .flex.items-center.justify-between,
    html[data-design-mode="setiai-board"] .feed-page-shell .feed-post-card .flex.items-center.gap-4,
    html[data-design-mode="setiai-board"] .feed-page-shell .feed-filter-panel .flex.flex-wrap {
        align-items: stretch !important;
    }

    html[data-design-mode="setiai-board"] .feed-page-shell .feed-composer-panel .flex.items-center.justify-between {
        flex-direction: column !important;
        gap: 0.85rem !important;
    }

    html[data-design-mode="setiai-board"] #event-modal .feed-modal-panel,
    html[data-design-mode="setiai-board"] #share-modal .feed-share-modal-panel {
        width: min(100% - 1rem, 42rem) !important;
        padding: 1rem !important;
    }
}

@media (max-width: 1320px) {
    html[data-design-mode="setiai-board"] .messenger-page .setiai-app-shell {
        flex-wrap: wrap !important;
    }

    html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar,
    html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel {
        width: calc(50% - 0.5rem) !important;
        height: auto !important;
        min-height: 0 !important;
        position: relative !important;
    }

    html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface {
        order: 3 !important;
        flex-basis: 100% !important;
        min-height: 42rem !important;
    }
}

@media (max-width: 900px) {
    html[data-design-mode="setiai-board"] .messenger-page .setiai-app-shell {
        flex-direction: column !important;
    }

    html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar,
    html[data-design-mode="setiai-board"] .messenger-page #aiAssistantPanel,
    html[data-design-mode="setiai-board"] .messenger-page .messenger-chat-surface {
        width: 100% !important;
        min-height: 0 !important;
        position: static !important;
    }

    html[data-design-mode="setiai-board"] .messenger-page .messenger-sidebar {
        height: auto !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell {
        flex-direction: column !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell > .sidebar {
        position: relative !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell > .sidebar > .flex-1 {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.85rem !important;
        overflow: visible !important;
    }

    html[data-design-mode="setiai-board"] .planner-page #todayScheduleContainer,
    html[data-design-mode="setiai-board"] .planner-page #planner-upcoming-events {
        min-height: 11rem !important;
    }
}

@media (max-width: 1180px) {
    html[data-design-mode="setiai-board"] .dashboard-page .setiai-app-shell {
        align-items: stretch !important;
    }

    html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar {
        width: 18rem !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .catalog-header,
    html[data-design-mode="setiai-board"] .assistant-page .catalog-toolbar,
    html[data-design-mode="setiai-board"] .assistant-page .insights-header {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .catalog-summary {
        justify-content: stretch !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .catalog-summary-pill,
    html[data-design-mode="setiai-board"] .assistant-page .catalog-search {
        min-width: min(100%, 18rem) !important;
    }

    html[data-design-mode="setiai-board"] .sales-page .setiai-page-header,
    html[data-design-mode="setiai-board"] .sales-page .setiai-panel-header,
    html[data-design-mode="setiai-board"] .sales-page .setiai-card-header {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    html[data-design-mode="setiai-board"] .sales-page .setiai-page-actions {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0.65rem !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .setiai-page-header,
    html[data-design-mode="setiai-board"] .planner-page .setiai-panel-header,
    html[data-design-mode="setiai-board"] .planner-page .setiai-card-header {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell > .sidebar > .flex-1 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .lg\:grid-cols-3 {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 900px) {
    html[data-design-mode="setiai-board"] .dashboard-page .setiai-app-shell {
        flex-direction: column !important;
        padding-top: 5.25rem !important;
    }

    html[data-design-mode="setiai-board"] .dashboard-page #dashboardSidebar {
        width: min(86vw, 22rem) !important;
        height: calc(100dvh - 5.25rem) !important;
        top: 4.75rem !important;
        border-radius: 0 1.35rem 1.35rem 0 !important;
    }

    html[data-design-mode="setiai-board"] .dashboard-page .dashboard-mobile-menu-btn {
        background: rgba(255, 255, 255, 0.96) !important;
        border-color: rgba(203, 213, 225, 0.82) !important;
        color: #1d4ed8 !important;
        box-shadow: 0 16px 34px rgba(37, 99, 235, 0.16) !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .main-content {
        width: min(100% - 1rem, 100%) !important;
        padding-top: 5.25rem !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .page-header {
        padding: 1rem !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .agents-grid,
    html[data-design-mode="setiai-board"] .assistant-page .catalog-grid {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .catalog-tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        padding-bottom: 0.5rem !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .catalog-tab {
        min-width: 14rem !important;
        flex: 0 0 auto !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .modal-content {
        width: min(100% - 1rem, 58rem) !important;
        padding: 1rem !important;
    }

    html[data-design-mode="setiai-board"] .sales-page .setiai-app-shell {
        padding-top: 5.25rem !important;
    }

    html[data-design-mode="setiai-board"] .sales-page .setiai-app-shell > .container,
    html[data-design-mode="setiai-board"] .sales-page .setiai-closing-cluster {
        width: min(100% - 1rem, 100%) !important;
    }

    html[data-design-mode="setiai-board"] .sales-page .setiai-page-actions,
    html[data-design-mode="setiai-board"] .sales-page .sales-funnel-summary,
    html[data-design-mode="setiai-board"] .sales-page .sales-content-fill-grid.sales-board-only,
    html[data-design-mode="setiai-board"] .sales-page .sales-action-card__footer {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .sales-page .grid.grid-cols-4 {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell,
    html[data-design-mode="setiai-board"] .planner-page .setiai-page-endcap {
        width: min(100% - 1rem, 100%) !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .setiai-app-shell > .sidebar > .flex-1,
    html[data-design-mode="setiai-board"] .planner-page .grid.grid-cols-2,
    html[data-design-mode="setiai-board"] .planner-page .md\:grid-cols-2,
    html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .planner-page .flex.items-center.justify-between,
    html[data-design-mode="setiai-board"] .planner-page .flex.flex-wrap.gap-3 {
        align-items: stretch !important;
    }

    html[data-design-mode="setiai-board"] body.planner-page > .fixed:not(.hidden):not(.theme-dropdown) > div,
    html[data-design-mode="setiai-board"] body.planner-page .modal-content {
        width: min(100% - 1rem, 46rem) !important;
        padding: 1rem !important;
    }
}

@media (max-width: 900px) {
    html[data-design-mode="setiai-board"] .account-page .account-board-hero,
    html[data-design-mode="setiai-board"] .account-page .account-board-hero-grid {
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .account-page .account-page-header,
    html[data-design-mode="setiai-board"] .account-page .setting-item,
    html[data-design-mode="setiai-board"] .account-page .session-item,
    html[data-design-mode="setiai-board"] .account-page .security-card .flex.justify-between,
    html[data-design-mode="setiai-board"] .account-page .assistant-owner-handoff-strip > .flex,
    html[data-design-mode="setiai-board"] .account-page .notification-card .flex.justify-between {
        align-items: stretch !important;
        flex-direction: column !important;
        grid-template-columns: 1fr !important;
    }

    html[data-design-mode="setiai-board"] .account-page .account-page-shell {
        width: min(100% - 1rem, 100%) !important;
        padding-top: 1rem !important;
    }

    html[data-design-mode="setiai-board"] .account-page .settings-card,
    html[data-design-mode="setiai-board"] .account-page .security-card,
    html[data-design-mode="setiai-board"] .account-page .notification-card {
        padding: 1.1rem !important;
    }
}

/* --- ONE-SCREEN AND SCROLL OPTIMIZATIONS --- */
/* Отключение тяжелых фоновых анимаций на всех страницах */
html[data-design-mode="setiai-board"] body::before,
html[data-design-mode="setiai-board"] body::after {
    animation: none !important;
    will-change: auto !important;
}

@media (min-width: 769px) {
    /* Блокировка скролла body для One-Screen */
    html[data-design-mode="setiai-board"] body.network-page,
    html[data-design-mode="setiai-board"] body.teams-page,
    html[data-design-mode="setiai-board"] body.groups-page,
    html[data-design-mode="setiai-board"] body.feed-page,
    html[data-design-mode="setiai-board"] body.planner-page {
        height: 100vh !important;
        overflow: hidden !important;
    }

    /* Команды и Группы */
    html[data-design-mode="setiai-board"] .teams-board-layout,
    html[data-design-mode="setiai-board"] .groups-board-layout {
        height: calc(100vh - 7.5rem) !important;
        overflow: hidden !important;
    }
    html[data-design-mode="setiai-board"] .teams-left-sidebar,
    html[data-design-mode="setiai-board"] .groups-left-sidebar {
        height: 100% !important;
        overflow-y: auto !important;
        padding-right: 0.5rem;
    }
    html[data-design-mode="setiai-board"] .teams-main-panel,
    html[data-design-mode="setiai-board"] .groups-main-panel {
        height: 100% !important;
        overflow-y: auto !important;
        padding-right: 0.5rem;
    }
    html[data-design-mode="setiai-board"] .teams-chat-panel,
    html[data-design-mode="setiai-board"] .groups-chat-panel {
        height: 100% !important;
        overflow-y: auto !important;
    }



    /* Нетворкинг */
    html[data-design-mode="setiai-board"] .network-page .setiai-app-shell {
        height: calc(100vh - 7.5rem) !important;
        overflow: hidden !important;
    }
    html[data-design-mode="setiai-board"] .network-page .sidebar {
        height: 100% !important;
    }
    html[data-design-mode="setiai-board"] .network-page .workspace-area > .flex-1 {
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow-y: auto !important;
    padding-right: 0.5rem !important;
        height: 100% !important;
        overflow-y: auto !important;
        padding-right: 0.5rem;
    }

    /* Лента */
    html[data-design-mode="setiai-board"] .feed-page-shell {
        height: calc(100vh - 5.5rem) !important;
        overflow: hidden !important;
        padding-top: 5rem !important;
    }
    html[data-design-mode="setiai-board"] .feed-page-shell > .max-w-7xl,
    html[data-design-mode="setiai-board"] .feed-page-shell .grid {
        height: 100% !important;
        overflow: hidden !important;
    }
    html[data-design-mode="setiai-board"] .feed-page-shell .lg\:col-span-2 {
        height: 100% !important;
        overflow-y: auto !important;
        padding-right: 0.5rem;
    }
    html[data-design-mode="setiai-board"] .feed-page-shell .lg\:col-span-1 {
        height: 100% !important;
        overflow-y: auto !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html[data-design-mode="setiai-board"] *,
    html[data-design-transition="active"] * {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* --- PLANNER PAGE COMPACTNESS & VISUAL DENSITY OVERRIDES --- */
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-strip {
    padding: 0.75rem !important;
    margin-bottom: 0.75rem !important;
    border-radius: 1rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-strip .max-w-4xl {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0.5rem 1rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-strip .max-w-4xl p.text-sky-300\/80 {
    margin-bottom: 0 !important;
    font-size: 10px !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-strip .max-w-4xl h2 {
    font-size: 0.95rem !important;
    margin-bottom: 0 !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-strip .max-w-4xl p.text-slate-300 {
    margin-top: 0 !important;
    font-size: 0.75rem !important;
    line-height: 1.4 !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-grid {
    margin-top: 0.5rem !important;
    gap: 0.5rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-grid a {
    padding: 0.65rem 0.75rem !important;
    border-radius: 0.75rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-grid a p {
    margin-top: 0.25rem !important;
    font-size: 0.75rem !important;
    line-height: 1.3 !important;
}
html[data-design-mode="setiai-board"] .planner-page .assistant-owner-handoff-grid a .h-9 {
    width: 1.75rem !important;
    height: 1.75rem !important;
    border-radius: 0.5rem !important;
}

/* Calendar Day Cells Aspect-Ratio */
html[data-design-mode="setiai-board"] .planner-page .calendar-day,
html[data-design-mode="setiai-board"] .planner-page .week-day {
    aspect-ratio: 1.45 !important;
    padding: 0.35rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .calendar-day-header {
    min-height: 1.8rem !important;
    padding: 0.25rem !important;
}

/* My Tasks & Filter Buttons */
html[data-design-mode="setiai-board"] .planner-page .task-filter-btn {
    min-height: 2rem !important;
    padding: 0.3rem 0.75rem !important;
    font-size: 0.75rem !important;
    border-radius: 0.65rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .task-status-filter,
html[data-design-mode="setiai-board"] .planner-page .task-priority-filter {
    min-height: 1.65rem !important;
    padding: 0.15rem 0.5rem !important;
    font-size: 0.7rem !important;
    border-radius: 0.5rem !important;
}
html[data-design-mode="setiai-board"] .planner-page #tasksContainer {
    max-height: 350px !important;
}
html[data-design-mode="setiai-board"] .planner-page #tasksContainer .task-card {
    padding: 0.65rem 0.75rem !important;
    border-radius: 0.75rem !important;
}

/* AI 8 Bento Cards visual density */
html[data-design-mode="setiai-board"] .planner-page .setiai-panel {
    margin-bottom: 0.75rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .setiai-panel-header {
    padding: 0.75rem 1rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .setiai-panel-title {
    font-size: 1.1rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 {
    gap: 0.75rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div {
    border-radius: 1rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div .p-5 {
    padding: 0.75rem 0.85rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div .mb-4,
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div .mb-3 {
    margin-bottom: 0.5rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div .setiai-card-title,
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div h3 {
    font-size: 0.875rem !important;
    margin-bottom: 0.25rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div p,
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div span {
    font-size: 0.75rem !important;
    line-height: 1.35 !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div .p-2.5 {
    padding: 0.5rem 0.65rem !important;
    border-radius: 0.65rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .xl\:grid-cols-4 > div .w-20 {
    width: 4rem !important;
}
html[data-design-mode="setiai-board"] .planner-page .h-2.5 {
    height: 0.35rem !important;
}

/* One-Screen Viewport Height Containment for Planner Page */
@media (min-width: 769px) {
    .planner-page .setiai-app-shell {
        height: calc(100vh - 3.8rem) !important;
        overflow: hidden !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }
    .planner-page .planner-workspace-area {
        flex: 1 1 0% !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        overflow: hidden !important;
        gap: 1rem !important;
    }
    .planner-page .planner-main-column {
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }
    .planner-page .planner-tab-content {
        display: none;
    }
    .planner-page .planner-tab-content.active {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 0% !important;
        min-height: 0 !important;
        overflow-y: auto !important;
    }

    /* --- PLANNER COLLAPSIBLE DETAILED PANEL (CLOSING ENDCAP) --- */
    .planner-page .planner-closing-panel {
        background: linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.01) 100%) !important;
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
        border-radius: 20px !important;
        backdrop-filter: blur(20px) !important;
        transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
        overflow: hidden !important;
        margin-top: 8px !important;
        flex-shrink: 0 !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-header {
        padding: 0.75rem 1.25rem !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        cursor: pointer !important;
        user-select: none !important;
        border-bottom: 1px solid transparent !important;
        transition: border-color 0.3s, background 0.3s !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-header:hover {
        background: rgba(255, 255, 255, 0.02) !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-header.active {
        border-color: rgba(255, 255, 255, 0.08) !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-header-left {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-icon {
        width: 32px !important;
        height: 32px !important;
        border-radius: 8px !important;
        background: rgba(99, 102, 241, 0.1) !important;
        color: #6366f1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 14px !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-title {
        font-family: 'Outfit', sans-serif !important;
        font-size: 0.9rem !important;
        font-weight: 700 !important;
        color: #F8FAFC !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-trigger {
        width: 28px !important;
        height: 28px !important;
        border-radius: 6px !important;
        background: rgba(255, 255, 255, 0.04) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s !important;
        color: #94A3B8 !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-header:hover .collapsible-detailed-trigger {
        background: rgba(255, 255, 255, 0.08) !important;
        color: #F8FAFC !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-header.active .collapsible-detailed-trigger {
        transform: rotate(180deg) !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-body {
        max-height: 0;
        opacity: 0;
        overflow-y: auto;
        transition: max-height 0.6s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
        padding: 0 12px !important;
    }

    .planner-page .planner-closing-panel .collapsible-detailed-body.open {
        max-height: 480px;
        opacity: 1;
        padding: 12px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    }

    /* Sidebar Collapsible Cards */
    .planner-page .sidebar .sidebar-collapsible-card {
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }

    .planner-page .sidebar .sidebar-collapsible-header {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        cursor: pointer !important;
        user-select: none !important;
    }

    .planner-page .sidebar .sidebar-collapsible-trigger {
        transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
        color: rgba(255, 255, 255, 0.4) !important;
        font-size: 10px !important;
    }

    .planner-page .sidebar .sidebar-collapsible-header.active .sidebar-collapsible-trigger {
        transform: rotate(180deg) !important;
    }

    .planner-page .sidebar .sidebar-collapsible-body {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        transition: max-height 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
    }

    .planner-page .sidebar .sidebar-collapsible-body.open {
        max-height: 300px;
        opacity: 1;
        margin-top: 8px !important;
    }

    /* --- PLANNER & NETWORK QUICK ACTIONS SIDEBAR (RIGHT SLIDING) --- */
    .planner-page .quick-actions-sidebar,
    .network-page .quick-actions-sidebar {
        width: 50px !important;
        position: relative !important;
        transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
        z-index: 50 !important;
        flex-shrink: 0 !important;
        margin-top: 0 !important;
        height: 100% !important;
    }

    .planner-page .quick-actions-sidebar-content,
    .network-page .quick-actions-sidebar-content {
        position: absolute !important;
        top: 0 !important;
        bottom: 0 !important;
        right: 0 !important;
        width: 50px !important;
        background: rgba(14, 14, 26, 0.65) !important;
        border-left: 1px solid rgba(255, 255, 255, 0.05) !important;
        box-shadow: -8px 0 32px 0 rgba(0, 0, 0, 0.37) !important;
        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
        border-radius: 20px 0 0 20px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding: 16px 6px !important;
        gap: 12px !important;
        overflow: hidden !important;
        transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
    }

    .planner-page .quick-actions-sidebar:hover .quick-actions-sidebar-content,
    .network-page .quick-actions-sidebar:hover .quick-actions-sidebar-content {
        width: 200px !important;
        align-items: flex-start !important;
        padding: 16px !important;
        background: rgba(14, 14, 26, 0.95) !important;
        border-color: rgba(99, 102, 241, 0.3) !important;
    }

    .planner-page .quick-actions-sidebar .action-item,
    .network-page .quick-actions-sidebar .action-item {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        width: 36px !important;
        height: 36px !important;
        border-radius: 12px !important;
        color: #94a3b8 !important;
        cursor: pointer !important;
        background: rgba(255, 255, 255, 0.02) !important;
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
        transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        flex-shrink: 0 !important;
    }

    .planner-page .quick-actions-sidebar .action-item i,
    .network-page .quick-actions-sidebar .action-item i {
        width: 16px !important;
        text-align: center !important;
        flex-shrink: 0 !important;
    }

    .planner-page .quick-actions-sidebar:hover .action-item,
    .network-page .quick-actions-sidebar:hover .action-item {
        width: 100% !important;
        height: 38px !important;
        justify-content: flex-start !important;
        padding: 8px 12px !important;
        gap: 12px !important;
    }

    .planner-page .quick-actions-sidebar .action-item:hover,
    .network-page .quick-actions-sidebar .action-item:hover {
        background: rgba(99, 102, 241, 0.15) !important;
        border-color: rgba(99, 102, 241, 0.4) !important;
        color: #fff !important;
        box-shadow: 0 0 12px rgba(99, 102, 241, 0.25) !important;
    }

    .planner-page .quick-actions-sidebar .action-text,
    .network-page .quick-actions-sidebar .action-text {
        width: 0 !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition: opacity 0.2s ease, width 0.2s ease !important;
        font-size: 12px !important;
        font-weight: 500 !important;
        overflow: hidden !important;
    }

    .planner-page .quick-actions-sidebar:hover .action-text,
    .network-page .quick-actions-sidebar:hover .action-text {
        width: auto !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .planner-page .quick-actions-sidebar .sidebar-title,
    .network-page .quick-actions-sidebar .sidebar-title {
        font-size: 10px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.1em !important;
        color: #818cf8 !important;
        opacity: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        transition: opacity 0.2s ease !important;
        margin-bottom: 4px !important;
        flex-shrink: 0 !important;
    }

    .planner-page .quick-actions-sidebar:hover .sidebar-title,
    .network-page .quick-actions-sidebar:hover .sidebar-title {
        opacity: 1 !important;
        height: auto !important;
    }
}



/* --- GENERAL COLLAPSIBLE DETAILED PANEL --- */
.collapsible-detailed-panel {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.01) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 20px !important;
    backdrop-filter: blur(20px) !important;
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
    overflow: hidden !important;
    margin-top: 8px !important;
    flex-shrink: 0 !important;
    width: 100% !important;
}

.collapsible-detailed-panel .collapsible-detailed-header {
    padding: 0.75rem 1.25rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    cursor: pointer !important;
    user-select: none !important;
    border-bottom: 1px solid transparent !important;
    transition: border-color 0.3s, background 0.3s !important;
}

.collapsible-detailed-panel .collapsible-detailed-header:hover {
    background: rgba(255, 255, 255, 0.02) !important;
}

.collapsible-detailed-panel .collapsible-detailed-header.active {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

.collapsible-detailed-panel .collapsible-detailed-header-left {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.collapsible-detailed-panel .collapsible-detailed-icon {
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px !important;
    background: rgba(6, 182, 212, 0.1) !important;
    color: #06b6d4 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
}

.collapsible-detailed-panel .collapsible-detailed-title {
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    color: #F8FAFC !important;
}

.collapsible-detailed-panel .collapsible-detailed-trigger {
    width: 28px !important;
    height: 28px !important;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), background 0.3s !important;
    color: #94A3B8 !important;
}

.collapsible-detailed-panel .collapsible-detailed-header:hover .collapsible-detailed-trigger {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #F8FAFC !important;
}

.collapsible-detailed-panel .collapsible-detailed-header.active .collapsible-detailed-trigger {
    transform: rotate(180deg) !important;
}

.collapsible-detailed-panel .collapsible-detailed-body {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.6s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
    padding: 0 12px !important;
}

.collapsible-detailed-panel .collapsible-detailed-body.open {
    max-height: 1200px;
    opacity: 1;
    padding: 12px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    overflow-y: auto !important;
}

/* --- ASSISTANT PAGE ONE-SCREEN & TABS STYLES --- */
@media (min-width: 769px) {
    html[data-design-mode="setiai-board"] body.assistant-page {
        height: 100vh !important;
        overflow: hidden !important;
    }
    


    html[data-design-mode="setiai-board"] .assistant-page .setiai-app-shell {
        width: min(100% - clamp(1rem, 2vw, 2.5rem), 1720px) !important;
        height: calc(100vh - 3.8rem) !important;
        margin: 0 auto !important;
        overflow: hidden !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .assistant-tab-content {
        display: none;
    }

    html[data-design-mode="setiai-board"] .assistant-page .assistant-tab-content.active {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 0% !important;
        min-height: 0 !important;
        overflow-y: auto !important;
        padding-right: 0.5rem !important;
        padding-bottom: 5.5rem !important;
    }
    
    html[data-design-mode="setiai-board"] .assistant-page .catalog-section {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0.5rem !important;
    }

    html[data-design-mode="setiai-board"] .assistant-page .insights-section {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0.5rem !important;
    }
}

/* Сворачиваемая финальная панель на странице Assistant (Collapsible Detailed Panel) */
.assistant-page .setiai-closing-cluster {
    display: block !important;
    margin-top: 1rem !important;
    margin-bottom: 3rem !important;
    border-radius: 0.9rem !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Компактный отступ и отсутствие дыр у карточек контактов на странице Network */
.network-page .sidebar .network-contact-item {
    min-height: 2.2rem !important;
    padding: 0.4rem 0.65rem !important;
}

/* Отображение аккуратного компактного футера на странице Network */
.network-page .profile-footer-shell,
.network-page .standalone-footer-shell {
    display: block !important;
    position: relative !important;
    z-index: 10 !important;
    margin-top: 1rem !important;
    padding-top: 0.75rem !important;
    padding-bottom: 5.5rem !important;
    text-align: center !important;
    opacity: 0.8 !important;
}

/* Адаптивность для Network-page при max-width: 1024px (планшеты и мобильные) */
@media (max-width: 1024px) {
    html[data-design-mode="setiai-board"] body.network-page {
        height: auto !important;
        overflow: auto !important;
        overflow-x: hidden !important;
    }

    html[data-design-mode="setiai-board"] .network-page .setiai-app-shell {
        height: auto !important;
        overflow: visible !important;
        padding-bottom: 5.5rem !important; /* Учитываем плавающий Bottom Dock */
    }

    html[data-design-mode="setiai-board"] .network-page .workspace-area {
        flex-direction: column !important;
        height: auto !important;
        min-height: 0 !important;
        gap: 1.5rem !important;
    }

    html[data-design-mode="setiai-board"] .network-page .sidebar {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    html[data-design-mode="setiai-board"] .network-page .sidebar > .flex-1 {
        display: flex !important;
        flex-direction: column !important;
        overflow: visible !important;
    }

    html[data-design-mode="setiai-board"] .network-page .workspace-area > .flex-1 {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        height: auto !important;
        min-height: 0 !important;
    }
    
    html[data-design-mode="setiai-board"] .network-page .lg\:grid-cols-3,
    html[data-design-mode="setiai-board"] .network-page .lg\:grid-cols-2 {
        grid-template-columns: 1fr !important;
    }
}

/* AI Insights styles for Assistant Page */
html[data-design-mode="setiai-board"] .assistant-page .ai-insight {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.01) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 16px !important;
    backdrop-filter: blur(12px) !important;
    margin-bottom: 0.75rem !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

html[data-design-mode="setiai-board"] .assistant-page .ai-insight:hover {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
    border-color: rgba(59, 130, 246, 0.35) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 30px rgba(59, 130, 246, 0.1) !important;
}

html[data-theme="light"][data-design-mode="setiai-board"] .assistant-page .ai-insight {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(241, 245, 249, 0.98)) !important;
    border-color: rgba(148, 163, 184, 0.2) !important;
    box-shadow: 0 8px 24px rgba(148, 163, 184, 0.08) !important;
}

html[data-theme="light"][data-design-mode="setiai-board"] .assistant-page .ai-insight:hover {
    background: #ffffff !important;
    border-color: rgba(59, 130, 246, 0.4) !important;
    box-shadow: 0 16px 36px rgba(59, 130, 246, 0.12) !important;
}