body.design-beta {
    --beta-bg: #f7f8fa;
    --beta-surface: #ffffff;
    --beta-surface-subtle: #f2f4f7;
    --beta-surface-elevated: #fcfcfd;
    --beta-text: #111827;
    --beta-text-muted: #6b7280;
    --beta-text-soft: #94a3b8;
    --beta-border: #e5e7eb;
    --beta-border-strong: #d7dde5;
    --beta-navy: #112033;
    --beta-navy-soft: #1d2c43;
    --beta-cyan: #00b2cc;
    --beta-cyan-soft: rgba(0, 178, 204, 0.12);
    --beta-orange: #c96e1b;
    --beta-success: #0f8b5f;
    --beta-danger: #c2413a;
    --beta-radius-xs: 8px;
    --beta-radius-sm: 10px;
    --beta-radius-md: 14px;
    --beta-radius-lg: 18px;
    --beta-shadow-1: 0 1px 2px rgba(15, 23, 42, 0.05);
    --beta-shadow-2: 0 10px 24px rgba(15, 23, 42, 0.08);
    --beta-shadow-3: 0 24px 48px rgba(15, 23, 42, 0.12);
    --beta-header-height: 60px;
    --beta-toolbar-height: 40px;
    --beta-table-row: 44px;
    --beta-control-height: 36px;
    --beta-control-height-compact: 34px;
    --beta-font-meta: 11px;
    --beta-font-sm: 12px;
    --beta-font-md: 13px;
    --beta-font-lg: 14px;
    --beta-font-xl: 16px;
    --beta-font-modal-title: 17px;
    --beta-font-page-title: clamp(24px, 1.55vw, 28px);
    --beta-font-kpi: clamp(20px, 1.45vw, 24px);
    --beta-font-kpi-compact: clamp(18px, 1.2vw, 20px);
    --beta-font-hero: 20px;
    --assistant-shell-width: 432px;
    --assistant-shell-gap: 14px;
    --assistant-launcher-width: 46px;
    --sidebar-width: 238px;
    --sidebar-collapsed-width: 76px;
    --primary-dark: var(--beta-navy);
    --primary-cyan: var(--beta-cyan);
    --primary-silver: var(--beta-bg);
    --accent-orange: var(--beta-orange);
    --text-dark: var(--beta-text);
    --text-gray: var(--beta-text-muted);
    --border-color: var(--beta-border);
    --hover-color: var(--beta-surface-subtle);
    --shadow-sm: var(--beta-shadow-1);
    --shadow-md: var(--beta-shadow-2);
    --shadow-lg: var(--beta-shadow-3);
    background: var(--beta-bg);
    color: var(--beta-text);
    font-size: var(--beta-font-md);
    line-height: 1.45;
}

body.design-beta,
body.design-beta input,
body.design-beta select,
body.design-beta textarea,
body.design-beta button {
    font-family: 'Inter', sans-serif;
}

body.design-beta h1,
body.design-beta h2,
body.design-beta h3,
body.design-beta h4,
body.design-beta h5,
body.design-beta h6,
body.design-beta .page-title,
body.design-beta .card-title,
body.design-beta .nav-section-title,
body.design-beta .logo-text {
    font-family: 'Montserrat', sans-serif;
}

body.design-beta :focus-visible {
    outline: 2px solid rgba(0, 178, 204, 0.55);
    outline-offset: 2px;
}

html.design-beta-boot .loading-screen,
body.design-beta .loading-screen {
    background:
        radial-gradient(circle at top left, rgba(15, 23, 42, 0.08), transparent 32%),
        radial-gradient(circle at bottom right, rgba(0, 178, 204, 0.08), transparent 24%),
        var(--beta-bg);
}

html.design-beta-boot .loading-panel,
body.design-beta .loading-panel {
    min-width: min(460px, calc(100vw - 48px));
    border: 1px solid rgba(215, 221, 229, 0.88);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 28px 72px rgba(15, 23, 42, 0.1);
    backdrop-filter: blur(20px);
}

html.design-beta-boot .loading-brand,
body.design-beta .loading-brand {
    margin-bottom: 18px;
    gap: 12px;
}

html.design-beta-boot .loading-logo-mark,
body.design-beta .loading-logo-mark {
    width: 34px;
    height: 34px;
    border: 0;
    background: transparent;
}

html.design-beta-boot .loading-logo-text,
body.design-beta .loading-logo-text {
    width: 128px;
    line-height: 0;
}

html.design-beta-boot .loading-logo-mark img,
body.design-beta .loading-logo-mark img,
html.design-beta-boot .loading-logo-text img,
body.design-beta .loading-logo-text img {
    filter: none;
}

html.design-beta-boot .loading-indicator,
body.design-beta .loading-indicator {
    gap: 12px;
}

html.design-beta-boot .loading-spinner,
body.design-beta .loading-spinner {
    width: 36px;
    height: 36px;
    border-width: 2px;
    border-color: rgba(17, 24, 39, 0.08);
    border-top-color: var(--beta-cyan);
}

html.design-beta-boot .loading-screen p,
body.design-beta .loading-screen p {
    color: var(--beta-text);
    font-size: var(--beta-font-lg);
}

body.design-beta .app-container {
    background: var(--beta-bg);
}

body.design-beta .sidebar {
    display: flex;
    flex-direction: column;
    width: var(--sidebar-width);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    background: #101b2c;
    box-shadow: none;
}

body.design-beta .sidebar::-webkit-scrollbar {
    width: 10px;
}

body.design-beta .sidebar::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.26);
    border-radius: 999px;
}

body.design-beta .sidebar-header {
    min-height: 72px;
    padding: 14px 14px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body.design-beta .logo {
    gap: 10px;
    min-width: 0;
}

body.design-beta .logo-icon {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    box-shadow: none;
    border: 0;
    background: transparent;
}

body.design-beta .logo-icon::after {
    display: none;
}

body.design-beta .logo-text-block {
    gap: 3px;
}

body.design-beta .logo-text {
    width: 110px;
    line-height: 0;
}

body.design-beta .logo-text img {
    filter: none;
}

body.design-beta .logo-subtext {
    color: rgba(226, 232, 240, 0.64);
    font-size: 9px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

body.design-beta .logo img.company-logo {
    max-height: 36px;
    max-width: 160px;
}

body.design-beta .sidebar .sidebar-toggle {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 9px;
    color: rgba(241, 245, 249, 0.78);
}

body.design-beta .sidebar .sidebar-toggle:hover {
    background: rgba(255, 255, 255, 0.06);
}

body.design-beta .nav-menu {
    padding: 10px 10px 14px;
}

body.design-beta .nav-section {
    margin-bottom: 10px;
    padding-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

body.design-beta .nav-section:first-child {
    padding-top: 0;
    border-top: 0;
}

body.design-beta .nav-section.nav-section-active .nav-section-title {
    color: rgba(226, 232, 240, 0.74);
}

body.design-beta .nav-section-title {
    padding: 0 10px 5px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
    color: rgba(226, 232, 240, 0.46);
}

body.design-beta .nav-item {
    position: relative;
    min-height: 36px;
    gap: 10px;
    padding: 8px 10px 8px 12px;
    margin-bottom: 2px;
    border-left: 0;
    border-radius: 10px;
    color: rgba(226, 232, 240, 0.78);
    font-size: var(--beta-font-sm);
    font-weight: 500;
}

body.design-beta .nav-item::before {
    content: '';
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 5px;
    width: 2px;
    border-radius: 999px;
    background: rgba(144, 205, 255, 0.92);
    opacity: 0;
    transform: scaleY(0.6);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

body.design-beta .nav-item:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
}

body.design-beta .nav-item.active {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

body.design-beta .nav-item.active::before {
    opacity: 1;
    transform: scaleY(1);
}

body.design-beta .nav-item.active .nav-label {
    font-weight: 600;
}

body.design-beta .nav-icon {
    width: 16px;
    color: rgba(226, 232, 240, 0.84);
}

body.design-beta .nav-icon svg {
    width: 16px;
    height: 16px;
    stroke-width: 1.85;
}

body.design-beta .app-container.sidebar-collapsed .sidebar {
    width: var(--sidebar-collapsed-width);
}

body.design-beta .app-container.sidebar-collapsed .sidebar-header {
    padding: 12px 10px;
    gap: 8px;
}

body.design-beta .app-container.sidebar-collapsed .nav-item {
    justify-content: center;
    padding: 8px 0;
}

body.design-beta .app-container.sidebar-collapsed .nav-item::before {
    left: 9px;
}

body.design-beta .main-content {
    margin-left: var(--sidebar-width);
    margin-right: 0;
    background: var(--beta-bg);
    transition: margin-right 0.22s ease;
}

body.design-beta .app-container.sidebar-collapsed .main-content {
    margin-left: var(--sidebar-collapsed-width);
}

body.design-beta.assistant-v3-shell-open .main-content {
    margin-right: calc(var(--assistant-shell-width) + var(--assistant-shell-gap) + 12px);
}

body.design-beta .main-header {
    position: relative;
    z-index: 20;
    min-height: var(--beta-header-height);
    padding: 10px 18px;
    border-bottom: 1px solid rgba(17, 24, 39, 0.06);
    background: rgba(247, 248, 250, 0.9);
    backdrop-filter: blur(18px);
    box-shadow: none;
}

body.design-beta .header-left,
body.design-beta .header-right {
    gap: 8px;
    min-width: 0;
}

body.design-beta .header-right {
    flex-wrap: nowrap;
    justify-content: flex-end;
}

body.design-beta .sidebar-toggle {
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid var(--beta-border);
    border-radius: 9px;
    color: var(--beta-text-muted);
    background: var(--beta-surface);
}

body.design-beta .sidebar-toggle:hover {
    background: var(--beta-surface-subtle);
}

body.design-beta .command-bar {
    min-width: min(620px, 48vw);
    min-height: 40px;
    padding: 0 5px 0 8px;
    gap: 3px;
    border: 1px solid var(--beta-border-strong);
    border-radius: 12px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .command-bar input {
    min-width: 0;
    font-size: var(--beta-font-md);
    color: var(--beta-text);
}

body.design-beta .command-bar input::placeholder {
    color: #98a2b3;
}

body.design-beta .search-btn,
body.design-beta .search-clear,
body.design-beta .header-btn,
body.design-beta .command-bar-shortcut,
body.design-beta .btn-ghost {
    color: var(--beta-text-muted);
}

body.design-beta .search-btn,
body.design-beta .search-clear,
body.design-beta .header-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 8px;
}

body.design-beta .command-bar-shortcut {
    min-width: 50px;
    min-height: 28px;
    padding: 0 9px;
    border: 1px solid var(--beta-border);
    border-radius: 8px;
    background: var(--beta-surface-subtle);
    font-size: var(--beta-font-meta);
    font-weight: 600;
}

body.design-beta .command-bar-shortcut:hover {
    background: #eef1f5;
}

body.design-beta .btn,
body.design-beta .header-btn,
body.design-beta .company-switcher-btn {
    min-height: 34px;
    padding: 0.38rem 0.72rem;
    border-radius: 9px;
    font-size: var(--beta-font-sm);
    font-weight: 500;
    transform: none;
    box-shadow: none;
}

body.design-beta .btn-sm {
    min-height: 30px;
    padding: 0.28rem 0.56rem;
    border-radius: 8px;
    font-size: var(--beta-font-sm);
}

body.design-beta .btn:hover,
body.design-beta .header-btn:hover,
body.design-beta .company-switcher-btn:hover {
    transform: none;
    box-shadow: none;
}

body.design-beta .btn-primary {
    background: var(--beta-navy);
    color: #fff;
}

body.design-beta .btn-primary:hover {
    background: var(--beta-navy-soft);
}

body.design-beta .design-toggle-btn {
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    gap: 0;
    border: 1px solid var(--beta-border-strong);
    border-radius: 10px;
    background: var(--beta-surface);
    color: #334155;
}

body.design-beta .design-toggle-btn:hover {
    border-color: #cbd5e1;
    background: var(--beta-surface-subtle);
    color: var(--beta-text);
}

body.design-beta .btn-outline {
    border: 1px solid var(--beta-border-strong);
    color: #334155;
    background: var(--beta-surface);
}

body.design-beta .btn-outline:hover {
    border-color: #cbd5e1;
    background: var(--beta-surface-subtle);
    color: var(--beta-text);
}

body.design-beta .btn-ghost,
body.design-beta .header-btn,
body.design-beta .company-switcher-btn {
    background: transparent;
}

body.design-beta .btn-ghost:hover,
body.design-beta .header-btn:hover,
body.design-beta .company-switcher-btn:hover {
    background: var(--beta-surface-subtle);
}

body.design-beta .btn-success {
    background: var(--beta-success);
    color: #fff;
}

body.design-beta .btn-danger {
    background: var(--beta-danger);
    color: #fff;
}

body.design-beta .design-toggle-btn.is-active,
body.design-beta .header-command-btn.is-open {
    background: var(--beta-navy);
    border-color: var(--beta-navy);
    color: #fff;
}

body.design-beta .btn-icon-shell,
body.design-beta .header-btn-icon,
body.design-beta .company-icon {
    width: 16px;
    height: 16px;
}

body.design-beta .btn-icon-shell svg,
body.design-beta .header-btn-icon svg,
body.design-beta .company-icon svg {
    width: 16px;
    height: 16px;
    stroke-width: 1.9;
}

body.design-beta .company-context {
    min-height: 34px;
    max-width: 220px;
    padding: 0 10px;
    border: 1px solid var(--beta-border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .header-company-cluster,
body.design-beta .header-actions-cluster {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

body.design-beta .header-actions-cluster {
    padding-left: 8px;
    margin-left: 2px;
    border-left: 1px solid rgba(17, 24, 39, 0.08);
}

body.design-beta .company-info {
    min-width: 0;
    gap: 1px;
}

body.design-beta .company-name {
    display: block;
    overflow: hidden;
    font-size: var(--beta-font-sm);
    font-weight: 600;
    color: var(--beta-text);
    white-space: nowrap;
    text-overflow: ellipsis;
}

body.design-beta .user-role {
    display: block;
    overflow: hidden;
    font-size: 10px;
    letter-spacing: 0.08em;
    color: var(--beta-text-muted);
    white-space: nowrap;
    text-transform: uppercase;
    text-overflow: ellipsis;
}

body.design-beta .notification-badge {
    top: -4px;
    right: -4px;
    min-width: 16px;
    padding: 0 5px;
    background: var(--beta-orange);
    font-size: 10px;
}

body.design-beta .dropdown-menu,
body.design-beta .notifications-menu {
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-3);
}

body.design-beta .profile-flyout {
    min-width: 292px;
    padding: 8px;
    border-radius: 16px;
    border: 1px solid var(--beta-border);
    box-shadow: var(--beta-shadow-2);
}

body.design-beta .profile-flyout-summary {
    gap: 9px;
    padding: 2px 2px 8px;
}

body.design-beta .profile-flyout-summary-avatar {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--beta-navy);
    border: 1px solid rgba(17, 32, 51, 0.08);
    font-size: 11px;
    box-shadow: none;
}

body.design-beta .profile-flyout-name {
    font-family: 'Montserrat', sans-serif;
    font-size: var(--beta-font-md);
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--beta-text);
}

body.design-beta .profile-flyout-email {
    font-size: 11px;
    color: var(--beta-text-muted);
}

body.design-beta .profile-flyout-meta {
    gap: 4px;
    margin-top: 5px;
}

body.design-beta .profile-flyout-role,
body.design-beta .profile-flyout-company {
    min-height: 18px;
    padding: 0 7px;
    background: var(--beta-surface-subtle);
    font-size: 9px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--beta-text-muted);
}

body.design-beta .profile-flyout-section {
    padding-top: 1px;
}

body.design-beta .profile-flyout-section--divider,
body.design-beta .profile-flyout-section--session,
body.design-beta .company-admin-section.profile-flyout-section {
    margin-top: 4px;
    padding-top: 5px;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .profile-flyout-link {
    gap: 9px;
    min-height: 32px;
    padding: 7px 9px !important;
    border-radius: 10px;
    font-size: var(--beta-font-sm);
    color: var(--beta-text);
}

body.design-beta .profile-flyout-link:hover {
    background: var(--beta-surface-subtle);
}

body.design-beta .profile-flyout-link-icon {
    width: 14px;
    height: 14px;
    color: var(--beta-text-muted);
}

body.design-beta .profile-flyout-link-icon svg {
    width: 14px;
    height: 14px;
    stroke-width: 1.9;
}

body.design-beta .profile-flyout-link--danger,
body.design-beta .profile-flyout-link--danger .profile-flyout-link-icon {
    color: var(--beta-danger) !important;
}

body.design-beta .profile-flyout-language {
    min-height: 32px;
    padding: 6px 9px;
    border: 1px solid var(--beta-border);
    border-radius: 10px;
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta .profile-flyout-language .current-language {
    font-size: 11px;
    color: var(--beta-text);
}

body.design-beta .profile-flyout-language .current-language::after {
    width: 6px;
    height: 6px;
    margin-left: 6px;
    color: var(--beta-text-soft);
}

body.design-beta .profile-flyout-language .language-options {
    top: calc(100% + 6px);
    border: 1px solid var(--beta-border);
    border-radius: 10px;
    box-shadow: var(--beta-shadow-2);
}

body.design-beta .profile-flyout-language .language-options a {
    padding: 7px 9px;
    font-size: 11px;
    border-bottom-color: var(--beta-border);
}

body.design-beta .profile-flyout-language .language-options a.active {
    background: var(--beta-surface-subtle);
    color: var(--beta-text);
}

body.design-beta .profile-flyout-language .language-options a.active::before {
    background: var(--beta-cyan);
}

body.design-beta .user-avatar {
    width: 34px;
    height: 34px;
    border-width: 1px;
    background: var(--beta-navy);
    box-shadow: none;
}

body.design-beta #quickLogTimeBtn,
body.design-beta .header-command-btn {
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid var(--beta-border);
}

body.design-beta #quickLogTimeBtn:hover,
body.design-beta .header-command-btn:hover {
    background: var(--beta-surface);
}

body.design-beta .page-container {
    padding: 16px clamp(16px, 1.8vw, 28px) 20px;
    background: var(--beta-bg);
}

body.design-beta .app-footer {
    display: none;
}

body.design-beta .page {
    min-width: 0;
}

body.design-beta .page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

body.design-beta .page-header-left {
    min-width: 0;
}

body.design-beta .page-header .header-content {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-width: 0;
}

body.design-beta .page-header .header-content > div:first-child,
body.design-beta .page-header .page-header-left {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

body.design-beta .page-header-actions,
body.design-beta .dashboard-page-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page-title,
body.design-beta .page-header h1 {
    margin: 0;
    font-size: var(--beta-font-page-title);
    line-height: 1.08;
    font-weight: 600;
    letter-spacing: -0.03em;
    color: var(--beta-text);
}

body.design-beta .offers-page-subtitle,
body.design-beta .crm-page-subtitle,
body.design-beta .reports-page-subtitle,
body.design-beta .time-tracking-page-subtitle,
body.design-beta .dashboard-page-subtitle,
body.design-beta .project-list-page-subtitle,
body.design-beta .costs-page-subtitle,
body.design-beta .billing-page-subtitle,
body.design-beta .newsletter-page-subtitle {
    margin-top: 4px;
    max-width: 64ch;
    font-size: var(--beta-font-sm);
    line-height: 1.38;
    color: var(--beta-text-muted);
}

body.design-beta .project-detail-context-bar,
body.design-beta .dashboard-context-bar,
body.design-beta .offers-context-bar,
body.design-beta .crm-context-bar,
body.design-beta .reports-context-bar,
body.design-beta .time-tracking-context-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 6px;
}

body.design-beta .project-detail-context-chip,
body.design-beta .project-detail-context-bar .project-model-pill,
body.design-beta .badge,
body.design-beta .tag,
body.design-beta .chip {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 9px;
    border: 1px solid var(--beta-border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    color: #475467;
    font-size: var(--beta-font-meta);
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}

body.design-beta .project-detail-context-chip--strong {
    border-color: rgba(17, 32, 51, 0.12);
    background: rgba(17, 32, 51, 0.06);
    color: var(--beta-navy);
}

body.design-beta .project-detail-context-bar .project-model-pill {
    box-shadow: none;
    gap: 0;
}

body.design-beta .card {
    margin-bottom: 10px;
    border: 1px solid var(--beta-border);
    border-radius: var(--beta-radius-md);
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .card-header {
    padding: 12px 14px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .card-title {
    font-size: var(--beta-font-xl);
    font-weight: 600;
    color: var(--beta-text);
    letter-spacing: -0.02em;
}

body.design-beta .card-body {
    padding: 14px;
}

@media (min-width: 1101px) {
    body.design-beta .main-header {
        padding-left: clamp(16px, 1.8vw, 28px);
        padding-right: clamp(16px, 1.8vw, 28px);
    }

    body.design-beta .header-left {
        flex: 1 1 auto;
    }

    body.design-beta .command-bar {
        min-width: min(680px, 58vw);
    }

    body.design-beta .header-company-cluster {
        max-width: 176px;
    }

    body.design-beta .page-container {
        padding-top: 12px;
    }
}

body.design-beta .card-footer {
    padding: 10px 14px 14px;
    background: transparent;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .card.compact .card-header,
body.design-beta .project-detail-tabs-shell .card-body,
body.design-beta .reports-workspace-tabs-shell .card-body,
body.design-beta .time-tracking-tabs-shell .card-body,
body.design-beta .crm-products-tabs-shell .card-body,
body.design-beta .costs-workspace-tabs-shell .card-body,
body.design-beta .billing-workspace-tabs-shell .card-body,
body.design-beta .newsletter-workspace-tabs-shell .card-body {
    padding: 8px 10px;
}

body.design-beta .project-detail-tabs-shell,
body.design-beta .reports-workspace-tabs-shell,
body.design-beta .time-tracking-tabs-shell,
body.design-beta .crm-products-tabs-shell,
body.design-beta .costs-workspace-tabs-shell,
body.design-beta .billing-workspace-tabs-shell,
body.design-beta .newsletter-workspace-tabs-shell,
body.design-beta .project-workspace-view-shell {
    background: transparent;
    border: 0;
    box-shadow: none;
    margin-bottom: 8px;
}

body.design-beta .project-detail-tabs-list,
body.design-beta .project-workspace-view-list,
body.design-beta .reports-tabs,
body.design-beta .time-tracking-tabs,
body.design-beta .crm-products-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .time-tracking-mode-switch {
    display: none;
}

body.design-beta .project-detail-tab-button,
body.design-beta .project-list-display-button,
body.design-beta .reports-tab-button,
body.design-beta .time-tracking-tab-button,
body.design-beta .crm-products-tab-button,
body.design-beta .project-workspace-view-button {
    min-height: 32px;
    padding: 0 10px;
    gap: 6px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #475467;
    font-size: var(--beta-font-sm);
    font-weight: 500;
}

body.design-beta .project-detail-tab-button:hover,
body.design-beta .project-list-display-button:hover,
body.design-beta .reports-tab-button:hover,
body.design-beta .time-tracking-tab-button:hover,
body.design-beta .crm-products-tab-button:hover,
body.design-beta .project-workspace-view-button:hover {
    background: var(--beta-surface-subtle);
}

body.design-beta .project-detail-tab-button.is-active,
body.design-beta .project-list-display-button.is-active,
body.design-beta .reports-tab-button.is-active,
body.design-beta .time-tracking-tab-button.is-active,
body.design-beta .crm-products-tab-button.is-active,
body.design-beta .project-workspace-view-button.is-active {
    background: rgba(17, 32, 51, 0.08);
    color: var(--beta-navy);
}

body.design-beta .evaluation-workspace {
    gap: 10px;
}

body.design-beta .evaluation-nav {
    gap: 6px;
    padding: 8px;
    border-color: var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .evaluation-nav-heading {
    font-size: var(--beta-font-meta);
    color: var(--beta-text-muted);
}

body.design-beta .evaluation-nav-list {
    gap: 3px;
}

body.design-beta .evaluation-nav-button {
    padding: 8px 10px;
    border-radius: 9px;
    color: #475467;
}

body.design-beta .evaluation-nav-button:hover {
    background: var(--beta-surface-subtle);
    border-color: transparent;
}

body.design-beta .evaluation-nav-button.is-active {
    background: rgba(17, 32, 51, 0.08);
    border-color: transparent;
    box-shadow: none;
    color: var(--beta-navy);
}

body.design-beta .evaluation-nav-button-label {
    font-size: var(--beta-font-sm);
    font-weight: 500;
    line-height: 1.2;
}

body.design-beta .evaluation-workspace .evaluation-section {
    border-color: var(--beta-border);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .evaluation-overview-visuals {
    gap: 10px;
}

body.design-beta .evaluation-overview-card {
    border-radius: 14px;
}

body.design-beta .evaluation-overview-callout {
    color: var(--beta-success);
}

body.design-beta .evaluation-overview-callout.is-negative,
body.design-beta .evaluation-overview-chip-value.is-negative {
    color: var(--beta-danger);
}

body.design-beta .evaluation-overview-chip {
    border-radius: 10px;
    background: var(--beta-surface-subtle);
}

body.design-beta .evaluation-overview-chip-label,
body.design-beta .evaluation-overview-donut-label,
body.design-beta .evaluation-overview-card-subtitle {
    font-size: var(--beta-font-meta);
    color: var(--beta-text-muted);
}

body.design-beta .evaluation-overview-chip-value,
body.design-beta .evaluation-overview-metric-value,
body.design-beta .evaluation-overview-donut-value {
    color: var(--beta-navy);
}

body.design-beta .evaluation-overview-bar-label,
body.design-beta .evaluation-overview-bar-value,
body.design-beta .evaluation-overview-metric-label,
body.design-beta .evaluation-overview-caption {
    color: var(--beta-text-muted);
}

body.design-beta .evaluation-overview-bar-track,
body.design-beta .evaluation-overview-donut-track {
    background: var(--beta-surface-subtle);
    stroke: var(--beta-surface-subtle);
}

body.design-beta .evaluation-overview-donut-center {
    box-shadow: inset 0 0 0 1px var(--beta-border);
}

body.design-beta .evaluation-overview-card--financial {
    background:
        linear-gradient(180deg, rgba(17, 32, 51, 0.03) 0%, rgba(255, 255, 255, 1) 42%),
        var(--beta-surface);
}

body.design-beta .evaluation-overview-card--collection {
    background:
        radial-gradient(circle at top center, rgba(0, 178, 204, 0.12), transparent 58%),
        var(--beta-surface);
}

body.design-beta .evaluation-overview-card--hours {
    background:
        radial-gradient(circle at top center, rgba(15, 139, 95, 0.12), transparent 58%),
        var(--beta-surface);
}

body.design-beta .page[data-page-id="projects"] .project-detail-page-header--beta {
    margin-bottom: 8px;
}

body.design-beta .page[data-page-id="projects"] .project-detail-breadcrumb {
    margin-bottom: 4px;
}

body.design-beta .page[data-page-id="projects"] .project-detail-tabs-shell {
    position: sticky;
    top: calc(var(--beta-header-height, 64px) + 8px);
    z-index: 4;
}

body.design-beta .page[data-page-id="projects"] .project-detail-tabs-mobile-switch {
    display: none;
}

body.design-beta .page[data-page-id="projects"] .project-detail-content--beta {
    display: grid;
    gap: 10px;
    min-width: 0;
}

body.design-beta .page[data-page-id="projects"] .project-detail-tab-panel--beta {
    display: grid;
    gap: 10px;
    min-width: 0;
    overflow: hidden;
}

body.design-beta .page[data-page-id="projects"] .project-detail-tab-panel--beta > .card {
    margin-bottom: 0 !important;
    border-color: var(--beta-border);
    box-shadow: none;
}

body.design-beta .page[data-page-id="projects"] .project-tab-card-header {
    gap: 8px;
    align-items: flex-start;
}

body.design-beta .page[data-page-id="projects"] .project-tab-card-copy {
    display: grid;
    gap: 2px;
}

body.design-beta .page[data-page-id="projects"] .project-tab-card-description,
body.design-beta .page[data-page-id="projects"] .project-tab-card-meta {
    display: none;
}

body.design-beta .page[data-page-id="projects"] .project-tab-card-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page[data-page-id="projects"] .project-overview-beta,
body.design-beta .page[data-page-id="projects"] .project-overview-beta-main,
body.design-beta .page[data-page-id="projects"] .project-overview-beta-side {
    display: grid;
    gap: 10px;
}

body.design-beta .page[data-page-id="projects"] .project-overview-beta-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(320px, 0.9fr);
    gap: 10px;
    align-items: start;
}

body.design-beta .page[data-page-id="projects"] .project-overview-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="projects"] .project-overview-summary-item {
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="projects"] .project-overview-summary-label {
    font-size: var(--beta-font-meta);
    font-weight: 600;
    color: var(--beta-text-muted);
    margin-bottom: 4px;
}

body.design-beta .page[data-page-id="projects"] .project-overview-summary-value {
    font-size: var(--beta-font-md);
    font-weight: 600;
    color: var(--beta-text);
    line-height: 1.3;
}

body.design-beta .page[data-page-id="projects"] .project-overview-section-card {
    margin-bottom: 0 !important;
}

body.design-beta .page[data-page-id="projects"] .project-overview-section-head {
    min-height: 0;
    padding: 10px 12px;
    gap: 8px;
    align-items: center;
}

body.design-beta .page[data-page-id="projects"] .project-overview-section-head .card-title {
    font-size: var(--beta-font-lg);
    letter-spacing: -0.01em;
}

body.design-beta .page[data-page-id="projects"] .project-overview-section-card > .card-body {
    padding: 12px;
}

body.design-beta .page[data-page-id="projects"] .project-overview-intro-card {
    display: none;
}

body.design-beta .page[data-page-id="projects"] #budgetPlanningAnalysis .text-gray {
    display: none;
}

@media (max-width: 1180px) {
    body.design-beta .page[data-page-id="projects"] .project-overview-beta-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    body.design-beta .page[data-page-id="projects"] .project-overview-summary-strip {
        grid-template-columns: minmax(0, 1fr);
    }
}

body.design-beta .project-workspace-view-icon,
body.design-beta .project-list-display-button .project-workspace-view-icon {
    width: 16px;
    height: 16px;
    line-height: 0;
}

body.design-beta .project-workspace-view-icon svg,
body.design-beta .project-list-display-button .project-workspace-view-icon svg {
    width: 16px;
    height: 16px;
}

body.design-beta .form-label {
    margin-bottom: 4px;
    font-size: var(--beta-font-sm);
    font-weight: 600;
    color: #475467;
}

body.design-beta .form-input,
body.design-beta .form-select,
body.design-beta .form-textarea {
    min-height: var(--beta-control-height);
    padding: 0 10px;
    border: 1px solid var(--beta-border-strong);
    border-radius: 9px;
    background: var(--beta-surface);
    color: var(--beta-text);
    font-size: var(--beta-font-md);
    box-shadow: none;
}

body.design-beta .form-control {
    min-height: var(--beta-control-height);
    padding: 0 10px;
    border: 1px solid var(--beta-border-strong);
    border-radius: 9px;
    background: var(--beta-surface);
    color: var(--beta-text);
    font-size: var(--beta-font-md);
    box-shadow: none;
}

body.design-beta .form-textarea {
    padding-top: 8px;
    padding-bottom: 8px;
}

body.design-beta textarea.form-control {
    min-height: 96px;
    padding-top: 8px;
    padding-bottom: 8px;
}

body.design-beta .form-input:focus,
body.design-beta .form-select:focus,
body.design-beta .form-textarea:focus {
    border-color: rgba(0, 178, 204, 0.45);
    box-shadow: 0 0 0 4px rgba(0, 178, 204, 0.08);
}

body.design-beta .form-control:focus {
    border-color: rgba(0, 178, 204, 0.45);
    box-shadow: 0 0 0 4px rgba(0, 178, 204, 0.08);
}

body.design-beta .form-control[readonly],
body.design-beta .form-control:disabled {
    background: #f8fafc;
    color: #475467;
}

body.design-beta .table-container,
body.design-beta .table-responsive {
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
}

body.design-beta .table {
    margin-top: 0;
}

body.design-beta .table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 10px 11px;
    background: #f8fafc;
    color: #475467;
    font-size: var(--beta-font-meta);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

body.design-beta .table td {
    padding: 10px 11px;
    font-size: var(--beta-font-md);
    color: var(--beta-text);
}

body.design-beta .table tbody tr:hover {
    background: rgba(17, 32, 51, 0.03);
}

body.design-beta .tabulator {
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
    box-shadow: none;
    overflow: hidden;
}

body.design-beta .tabulator .tabulator-header {
    border-bottom: 1px solid var(--beta-border);
    background: #f8fafc;
}

body.design-beta .tabulator .tabulator-header .tabulator-col {
    min-height: 40px;
    padding: 0 10px;
    border-right-color: rgba(229, 231, 235, 0.8);
    background: transparent;
    color: #475467;
    font-size: var(--beta-font-meta);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

body.design-beta .tabulator .tabulator-row {
    min-height: var(--beta-table-row);
    border-bottom: 1px solid rgba(229, 231, 235, 0.85);
    background: var(--beta-surface);
}

body.design-beta .tabulator .tabulator-row:hover {
    background: rgba(17, 32, 51, 0.03);
}

body.design-beta .tabulator .tabulator-cell {
    padding: 10px 11px;
    font-size: 13px;
    color: var(--beta-text);
}

body.design-beta .tabulator .tabulator-footer {
    border-top: 1px solid var(--beta-border);
    background: var(--beta-surface);
}

body.design-beta .stats-grid,
body.design-beta .offers-metrics-grid,
body.design-beta .billing-metrics-grid,
body.design-beta .time-tracking-snapshot-grid,
body.design-beta .reports-stats-grid {
    gap: 8px;
    margin-bottom: 0;
}

body.design-beta .stat-card {
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .stat-card:hover {
    box-shadow: none;
    transform: none;
}

body.design-beta .stat-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    margin-bottom: 2px;
}

body.design-beta .stat-title,
body.design-beta .stat-label {
    color: #475467;
    font-size: var(--beta-font-meta);
    font-weight: 600;
    letter-spacing: 0.01em;
}

body.design-beta .stat-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 0;
}

body.design-beta .stat-icon svg {
    width: 16px;
    height: 16px;
}

body.design-beta .stat-value {
    font-size: var(--beta-font-kpi);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.03em;
    text-align: left !important;
}

body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-value {
    font-size: var(--beta-font-kpi);
    line-height: 1.05;
}

body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-label {
    font-size: var(--beta-font-meta);
    line-height: 1.3;
}

body.design-beta .page[data-page-id="offers"] .offers-metrics-grid .stat-value,
body.design-beta .page[data-page-id="costs"] .stats-grid--costs .stat-value,
body.design-beta .page[data-page-id="invoices"] .billing-metrics-grid .stat-value,
body.design-beta .page[data-page-id="bills"] .billing-metrics-grid .stat-value,
body.design-beta .page[data-page-id="reimbursements"] .reimbursements-metrics-grid .stat-value,
body.design-beta .page[data-page-id="reports"] .reports-stats-grid .stat-value,
body.design-beta .stats-grid--compact .stat-value,
body.design-beta .stats-grid--invoices .stat-value {
    font-size: var(--beta-font-kpi-compact);
    line-height: 1.05;
}

body.design-beta .stat-change {
    margin-top: 4px;
    font-size: var(--beta-font-meta);
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-workspace,
body.design-beta .page[data-page-id="costs"] .costs-workspace,
body.design-beta .page[data-page-id="offers"] .offers-workspace,
body.design-beta .page[data-page-id="time-tracking"] .time-tracking-workspace,
body.design-beta .page[data-page-id="reports"] .reports-tab-stack,
body.design-beta .page[data-page-id="projects"] .project-list-workspace {
    gap: 10px;
}

body.design-beta .page[data-page-id="dashboard"] .stats-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-layout-shell {
    display: none;
    position: sticky;
    top: 10px;
    z-index: 6;
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="dashboard"].customize-mode .dashboard-layout-shell {
    display: block;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-layout-shell .card-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-layout-hint {
    margin: 0;
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-page-header-actions .btn {
    min-height: 34px;
    border-radius: 10px;
    padding-inline: 10px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-card-subtitle {
    display: none;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-page-header {
    align-items: flex-end;
    gap: 12px;
    margin-bottom: 8px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-page-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-page-heading {
    flex: 1 1 auto;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-page-header-actions {
    gap: 8px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-refresh-btn {
    width: 34px;
    min-width: 34px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    border-radius: 10px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-refresh-btn svg {
    width: 16px;
    height: 16px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-page-header-actions #resetLayoutBtn[hidden] {
    display: none !important;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-context-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-context-bar[hidden] {
    display: none;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-context-bar .project-detail-context-chip {
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-size: var(--beta-font-meta);
    font-weight: 600;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-context-bar .project-detail-context-chip--strong {
    background: var(--beta-surface);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid {
    gap: 10px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card,
body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .stats-grid {
    order: 20;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card {
    border: 1px solid var(--beta-border);
    border-radius: 18px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card .card-header {
    padding: 12px 14px 0;
    align-items: center;
    gap: 10px;
    border-bottom: 0;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card .card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 14px 14px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card .card-actions,
body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card .filter-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card .card-actions .btn,
body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card .filter-controls .btn {
    min-height: 32px;
    border-radius: 8px;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="stats-grid"] {
    order: 1;
    grid-column: span 12;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="quick-time-entry"] {
    order: 2;
    grid-column: span 7;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="quick-actions"] {
    order: 3;
    grid-column: span 5;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="approval-inbox"] {
    order: 4;
    grid-column: span 6;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="missing-time-entries"] {
    order: 5;
    grid-column: span 6;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="research-institutional-funding"] {
    order: 6;
    grid-column: span 6;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="research-public-funded-compliance"] {
    order: 7;
    grid-column: span 6;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="my-work-plan"] {
    order: 8;
    grid-column: span 5;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="company-tasks-kanban"] {
    order: 9;
    grid-column: span 7;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="open-checklist-items"] {
    order: 10;
    grid-column: span 5;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="company-news"] {
    order: 11;
    grid-column: span 7;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="recent-projects"] {
    order: 12;
    grid-column: span 6;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="recent-activity"] {
    order: 13;
    grid-column: span 6;
}

body.design-beta .page[data-page-id="dashboard"] [data-widget-id="mini-calendar"] {
    order: 14;
    grid-column: span 5;
}

body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-card {
    min-height: 72px;
    padding: 12px 14px;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-icon {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: var(--beta-surface-subtle);
    font-size: 0;
}

body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-content {
    gap: 2px;
}

body.design-beta .page[data-page-id="dashboard"] #timeEntryWidgetForm .form-row {
    grid-template-columns: minmax(220px, 1.95fr) minmax(140px, 1fr) minmax(124px, 0.9fr) minmax(90px, 0.68fr);
    gap: 10px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-secondary {
    grid-template-columns: minmax(0, 1.8fr) minmax(240px, 1.15fr) auto;
    gap: 10px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-project-search-wrap {
    position: relative;
    min-width: 0;
    width: 100%;
}

body.design-beta .page[data-page-id="dashboard"] #quickEntryIntervalFields {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-flags {
    padding: 8px 10px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-submit {
    min-width: 132px;
}

body.design-beta .page[data-page-id="dashboard"] .widget-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 2px;
    padding-top: 0;
    border-top: 0;
}

body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric {
    padding: 8px 10px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric-label {
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric-value {
    font-size: var(--beta-font-md);
}

body.design-beta .page[data-page-id="dashboard"] .today-entries {
    gap: 6px;
}

body.design-beta .page[data-page-id="dashboard"] .today-entry-row {
    padding: 8px 10px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="dashboard"] .today-entry-hours {
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="dashboard"] .today-entry-range,
body.design-beta .page[data-page-id="dashboard"] .today-entry-meta {
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="dashboard"] .today-entry-project {
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card.dashboard-research-card {
    border-color: var(--beta-border);
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card.dashboard-research-card::before {
    display: none;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card.dashboard-research-card .card-header {
    padding-top: 12px;
    border-bottom: 0;
    background: transparent;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-widget-summary {
    gap: 6px;
    margin-bottom: 2px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-summary-pill {
    min-height: 28px;
    padding: 0 9px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-summary-pill--strong {
    background: var(--beta-surface);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-compact-list,
body.design-beta .page[data-page-id="dashboard"] #openChecklistItemsList,
body.design-beta .page[data-page-id="dashboard"] #recentActivity,
body.design-beta .page[data-page-id="dashboard"] #companyNews {
    min-height: 0;
    max-height: 360px;
    overflow: auto;
    padding-right: 2px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-feed-row,
body.design-beta .page[data-page-id="dashboard"] #openChecklistItemsList .list-row,
body.design-beta .page[data-page-id="dashboard"] .activity-item,
body.design-beta .page[data-page-id="dashboard"] .news-item {
    padding: 10px 11px !important;
    border: 1px solid var(--beta-border) !important;
    border-radius: 12px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-feed-title {
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-feed-meta,
body.design-beta .page[data-page-id="dashboard"] .dashboard-feed-meta--muted,
body.design-beta .page[data-page-id="dashboard"] .dashboard-empty-state-copy {
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-empty-state {
    padding: 10px 12px;
    border: 1px dashed var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-empty-state-title {
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-row-actions .btn {
    min-height: 30px;
    padding-inline: 9px;
    border-radius: 8px;
}

body.design-beta .page[data-page-id="dashboard"] .dashboard-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="dashboard"] .quick-action-card {
    min-height: 0;
    padding: 10px 12px;
    border-radius: 14px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    text-align: left;
    flex: none;
}

body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .widget-handle,
body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .tile-handle,
body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .resize-controls,
body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .resize-edge,
body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .resize-edge-right,
body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .resize-edge-bottom,
body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .grid-ruler,
body.design-beta .page[data-page-id="dashboard"]:not(.customize-mode) .grid-guides {
    display: none !important;
}

body.design-beta .quick-action-card {
    border: 1px solid var(--beta-border);
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .quick-action-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--beta-surface-subtle);
    color: var(--beta-navy);
}

body.design-beta .quick-action-icon svg {
    width: 16px;
    height: 16px;
}

body.design-beta .page[data-page-id="dashboard"] .quick-action-label {
    font-size: var(--beta-font-sm);
    line-height: 1.3;
}

body.design-beta .page[data-page-id="dashboard"] #companyTasksKanban {
    gap: 10px !important;
}

body.design-beta .page[data-page-id="dashboard"] .kanban-column {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface-subtle);
    padding: 10px;
}

body.design-beta .page[data-page-id="dashboard"] .kanban-count {
    border-color: var(--beta-border);
    background: var(--beta-surface);
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="dashboard"] .kanban-card {
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    padding: 10px 11px;
    box-shadow: none;
}

body.design-beta .page[data-page-id="dashboard"] .kanban-title {
    font-size: var(--beta-font-meta);
    color: var(--beta-text-muted);
}

@media (max-width: 1180px) {
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="quick-time-entry"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="quick-actions"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="approval-inbox"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="missing-time-entries"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="research-institutional-funding"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="research-public-funded-compliance"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="my-work-plan"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="company-tasks-kanban"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="open-checklist-items"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="company-news"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="recent-projects"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="recent-activity"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="mini-calendar"] {
        grid-column: span 6;
    }
}

@media (max-width: 860px) {
    body.design-beta .page[data-page-id="dashboard"] .dashboard-page-header {
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-page-header-actions {
        width: 100%;
        justify-content: flex-start;
    }

    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="quick-time-entry"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="quick-actions"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="approval-inbox"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="missing-time-entries"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="research-institutional-funding"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="research-public-funded-compliance"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="my-work-plan"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="company-tasks-kanban"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="open-checklist-items"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="company-news"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="recent-projects"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="recent-activity"],
    body.design-beta .page[data-page-id="dashboard"] [data-widget-id="mini-calendar"] {
        grid-column: span 12;
    }

    body.design-beta .page[data-page-id="dashboard"] #timeEntryWidgetForm .form-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-field--project,
    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-secondary,
    body.design-beta .page[data-page-id="dashboard"] #quickEntryIntervalFields {
        grid-column: 1 / -1;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-secondary,
    body.design-beta .page[data-page-id="dashboard"] #quickEntryIntervalFields {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="dashboard"] .widget-metrics,
    body.design-beta .page[data-page-id="dashboard"] .dashboard-actions,
    body.design-beta .page[data-page-id="dashboard"] #companyTasksKanban {
        grid-template-columns: 1fr !important;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-top {
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-actions {
        width: 100%;
        margin-left: 0;
    }
}

body.design-beta .page[data-page-id="projects"] .project-workspace-view-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0;
}

body.design-beta .page[data-page-id="projects"] .project-list-filters-shell,
body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell,
body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card,
body.design-beta .page[data-page-id="budget"] .budget-toolbar-card,
body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-card,
body.design-beta .page[data-page-id="offers"] .offers-section-card:nth-of-type(2),
body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar,
body.design-beta .page[data-page-id="crm"] .crm-filters-card,
body.design-beta .page[data-page-id="crm"] .crm-toolbar-card,
body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell,
body.design-beta .page[data-page-id="reports"] .reports-controls {
    position: sticky;
    top: 10px;
    z-index: 5;
}

body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .form-input,
body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .form-select,
body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .form-input,
body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .form-select,
body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .form-input,
body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .form-select,
body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .form-input,
body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .form-select,
body.design-beta .page[data-page-id="crm"] .crm-filters-card .form-input,
body.design-beta .page[data-page-id="crm"] .crm-filters-card .form-select,
body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .form-input,
body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .form-select,
body.design-beta .page[data-page-id="reports"] .reports-controls .form-input,
body.design-beta .page[data-page-id="reports"] .reports-controls .form-select,
body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .form-input,
body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .form-select,
body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .form-input,
body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .form-select,
body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .form-input,
body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .form-select,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .form-input,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .form-select {
    min-height: var(--beta-control-height-compact);
    padding-inline: 9px;
}

body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .btn,
body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .btn,
body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .btn,
body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .btn,
body.design-beta .page[data-page-id="crm"] .crm-filters-card .btn,
body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .btn,
body.design-beta .page[data-page-id="reports"] .reports-controls .btn,
body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .btn,
body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .btn,
body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .btn,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .btn {
    min-height: 32px;
    border-radius: 8px;
}

body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .card-header,
body.design-beta .page[data-page-id="offers"] .offers-section-card .project-tab-card-description,
body.design-beta .page[data-page-id="crm"] .crm-filters-card .project-tab-card-description,
body.design-beta .page[data-page-id="reports"] .reports-controls .project-tab-card-description {
    display: none;
}

body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .card-body,
body.design-beta .page[data-page-id="offers"] .offers-section-card .card-body,
body.design-beta .page[data-page-id="crm"] .crm-filters-card .card-body,
body.design-beta .page[data-page-id="reports"] .reports-controls .card-body {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="projects"] .project-list-filters-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    align-items: end;
}

body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .card-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="projects"] .project-list-beta-views {
    flex: 1 1 auto;
}

body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page[data-page-id="projects"] .project-list-filter--search,
body.design-beta .page[data-page-id="projects"] .project-list-filter--sort {
    grid-column: span 2;
}

body.design-beta .page[data-page-id="projects"] .project-list-results-shell .card-body {
    padding-top: 10px;
}

body.design-beta .page[data-page-id="projects"] .project-list-results-shell--beta .card-body {
    padding: 8px 0 0;
}

body.design-beta .page[data-page-id="offers"] .offers-metrics-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="offers"] .offers-section-card--metrics-beta .card-body,
body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .card-body {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

body.design-beta .page[data-page-id="offers"] .offers-filters-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    align-items: end;
}

body.design-beta .page[data-page-id="offers"] .offers-filter-span-2 {
    grid-column: span 2;
}

body.design-beta .page[data-page-id="offers"] .offers-section-card--register-beta .card-body {
    padding-top: 8px;
}

body.design-beta .project-list-results-actions,
body.design-beta .offers-results-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .offers-results-actions .form-select {
    width: auto;
    min-width: 152px;
    flex: 0 0 auto;
}

body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top .btn-primary {
    align-self: flex-start;
}

body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .card-body,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="invoices"] .billing-beta-toolbar-top,
body.design-beta .page[data-page-id="bills"] .billing-beta-toolbar-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions--primary,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions--primary {
    margin-left: auto;
}

body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions--primary .form-select,
body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions--primary .form-select {
    width: auto;
    min-width: 150px;
    flex: 0 0 auto;
}

body.design-beta .page[data-page-id="invoices"] .billing-filters-grid--beta,
body.design-beta .page[data-page-id="bills"] .billing-filters-grid--beta {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    align-items: end;
}

body.design-beta .page[data-page-id="invoices"] .billing-filters-grid--invoices {
    grid-template-columns: minmax(112px, 0.9fr) minmax(136px, 1fr) minmax(168px, 1.2fr) minmax(108px, 0.9fr) minmax(124px, 0.95fr) minmax(124px, 0.95fr) minmax(220px, 1.5fr);
}

body.design-beta .page[data-page-id="invoices"] .billing-filters-grid--invoices .billing-filter-span-2 {
    grid-column: auto;
}

body.design-beta .page[data-page-id="bills"] .billing-filters-grid--bills {
    grid-template-columns: minmax(112px, 0.9fr) minmax(144px, 1.1fr) minmax(150px, 1fr) minmax(124px, 0.95fr) minmax(124px, 0.95fr) minmax(232px, 1.6fr);
}

body.design-beta .page[data-page-id="bills"] .billing-filters-grid--bills .billing-filter-span-2 {
    grid-column: auto;
}

body.design-beta .page[data-page-id="invoices"] .billing-results-card--beta .card-body,
body.design-beta .page[data-page-id="bills"] .billing-results-card--beta .card-body {
    padding: 6px 0 0;
}

body.design-beta .page[data-page-id="costs"] .costs-overview-card--beta .card-body,
body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .card-body {
    padding: 10px 14px;
}

body.design-beta .page[data-page-id="costs"] .costs-context-bar {
    display: none;
}

body.design-beta .page[data-page-id="costs"] .costs-workspace-tabs-shell .card-body {
    padding: 8px 12px;
}

body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.design-beta .page[data-page-id="costs"] .costs-toolbar-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions--primary {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions--primary .form-select {
    width: auto;
    min-width: 168px;
    flex: 0 0 auto;
}

body.design-beta .page[data-page-id="costs"] .costs-filter-grid--beta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    align-items: end;
}

body.design-beta .page[data-page-id="costs"] .costs-results-card--beta .card-body {
    padding: 8px 0 0;
}

body.design-beta .page[data-page-id="budget"] .budget-toolbar-card {
    margin-bottom: 12px;
}

body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px 14px;
}

body.design-beta .page[data-page-id="budget"] .budget-toolbar-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="budget"] .budget-scope-pills--beta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    flex: 1 1 520px;
}

body.design-beta .page[data-page-id="budget"] .budget-scope-pills--beta .budget-scope-pill {
    min-height: 0;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="budget"] .budget-scope-pills--beta .budget-scope-pill strong {
    font-size: 11px;
    letter-spacing: 0.08em;
}

body.design-beta .page[data-page-id="budget"] .budget-scope-pills--beta .budget-scope-pill span {
    font-size: 13px;
}

body.design-beta .page[data-page-id="budget"] .budget-toolbar-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page[data-page-id="budget"] .budget-toolbar-controls .form-select {
    width: auto;
    min-width: 164px;
    flex: 0 0 auto;
}

body.design-beta .page[data-page-id="budget"] .budget-filter-layout--beta {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.design-beta .page[data-page-id="budget"] .budget-filter-grid--beta-compact {
    display: grid;
    grid-template-columns: 1.1fr 1.1fr 0.85fr 1.25fr;
    gap: 10px;
    align-items: end;
}

body.design-beta .page[data-page-id="budget"] .budget-toolbar-footer {
    padding-top: 10px;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="budget"] .budget-toolbar-footer--filters {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 0;
    border-top: 0;
}

body.design-beta .page[data-page-id="budget"] .budget-inline-actions--toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="budget"] .budget-inline-actions--primary {
    margin-left: auto;
}

body.design-beta .page[data-page-id="budget"] .budget-results-card--beta .card-body {
    padding: 8px 0 0;
}

body.design-beta .page[data-page-id="budget"] .budget-results-card--beta #budgetTableContainer {
    border-top: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="budget"] .budget-page-tabs {
    background: rgba(148, 163, 184, 0.12);
    border-color: var(--beta-border);
}

body.design-beta .page[data-page-id="budget"] .budget-page-tab.is-active {
    background: var(--beta-ink);
}

body.design-beta .page[data-page-id="crm"] .crm-workspace {
    display: grid;
    grid-template-columns: minmax(320px, 400px) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="crm"] .crm-workspace.crm-workspace--beta {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

body.design-beta .page[data-page-id="crm"] .crm-workspace.crm-workspace--beta > * {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

body.design-beta .page[data-page-id="crm"] .crm-filters-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="crm"] .crm-toolbar-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="crm"] .crm-form-grid {
    display: grid;
    gap: 10px 12px;
}

body.design-beta .page[data-page-id="crm"] .crm-form-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="crm"] .crm-form-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="crm"] .crm-client-detail-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="crm"] .crm-filter-chip-row--beta {
    flex: 1 1 420px;
}

body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page[data-page-id="crm"] .crm-search-grid {
    gap: 10px;
}

body.design-beta .page[data-page-id="crm"] .crm-search-grid--beta {
    display: grid;
    grid-template-columns: minmax(0, 2.4fr) minmax(180px, 1fr) minmax(150px, 0.8fr);
    gap: 10px;
    align-items: end;
}

body.design-beta .page[data-page-id="crm"] .crm-toolbar-row {
    margin-top: 6px;
}

body.design-beta .page[data-page-id="crm"] .crm-toolbar-row--beta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 0;
}

body.design-beta .page[data-page-id="crm"] .crm-toolbar-row--beta .crm-toolbar-actions {
    flex: 1 1 auto;
}

body.design-beta .page[data-page-id="crm"] .crm-toolbar-row--beta .crm-selection-indicator {
    margin-left: auto;
}

body.design-beta .page[data-page-id="crm"] .crm-results-card--beta {
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

body.design-beta .page[data-page-id="crm"] .crm-results-card--beta .card-body {
    padding: 8px 0 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
}

body.design-beta .page[data-page-id="crm"] .crm-results-card--beta .crm-table-frame {
    width: 100%;
    min-width: 0;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="crm"] #clientsTabulator,
body.design-beta .page[data-page-id="crm"] .crm-table-frame .tabulator {
    width: 100%;
    min-width: 0;
    max-width: none;
}

body.design-beta .page[data-page-id="crm"] .crm-results-card--beta .pagination-container {
    padding: 0 16px 16px;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] .stat-card {
    padding: 10px 11px;
    min-height: 0;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] .stat-title {
    font-size: 11px;
    line-height: 1.25;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] .stat-value {
    font-size: 20px;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .card-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-period {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid var(--beta-border);
    border-radius: 999px;
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-section-card .card-header,
body.design-beta .page[data-page-id="time-tracking"] .time-tracking-tab-stack .card-header {
    padding-bottom: 12px;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-week-card .card-body,
body.design-beta .page[data-page-id="time-tracking"] .time-tracking-entries-card .card-body {
    padding-top: 12px;
}

body.design-beta .page[data-page-id="time-tracking"] .time-tracking-entries-card .card-header {
    gap: 8px;
}

body.design-beta .page[data-page-id="reports"] .reports-controls {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="reports"] .reports-workspace-tabs-shell .card-body {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="reports"] .reports-controls .card-body {
    gap: 10px;
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="reports"] .reports-controls--beta #reportsLookupStatus {
    display: none !important;
}

body.design-beta .page[data-page-id="reports"] .reports-controls-row--primary {
    gap: 8px;
}

body.design-beta .page[data-page-id="reports"] .reports-controls-row--filters {
    padding-top: 8px;
    gap: 10px;
}

body.design-beta .page[data-page-id="reports"] .reports-advanced-panel {
    margin-top: 4px;
    padding: 12px;
    border-radius: 14px;
    background: var(--beta-surface-subtle);
    box-shadow: inset 0 0 0 1px rgba(215, 221, 229, 0.9);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-body {
    padding: 12px;
    background:
        radial-gradient(circle at top left, rgba(16, 185, 129, 0.05), transparent 34%),
        radial-gradient(circle at bottom right, rgba(249, 115, 22, 0.05), transparent 28%),
        linear-gradient(180deg, rgba(250, 251, 252, 0.98) 0%, rgba(255, 255, 255, 0.99) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-layout {
    gap: 12px;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-grid {
    gap: 12px;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel {
    border: 1px solid rgba(213, 220, 229, 0.9);
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(247, 250, 255, 0.96) 100%);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.06);
    padding: 18px;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero {
    background:
        radial-gradient(circle at 92% 12%, rgba(16, 185, 129, 0.1), transparent 28%),
        radial-gradient(circle at 4% 100%, rgba(249, 115, 22, 0.1), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(247, 249, 251, 0.98) 100%);
    border-color: rgba(213, 220, 229, 0.95);
    color: var(--beta-text-strong);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--budget-runway {
    background:
        radial-gradient(circle at top right, rgba(14, 165, 233, 0.09), transparent 24%),
        radial-gradient(circle at bottom left, rgba(16, 185, 129, 0.08), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(248, 251, 255, 0.98) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero .reports-dashboard-panel-kicker,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero .reports-dashboard-panel-title,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero .reports-dashboard-panel-copy {
    color: inherit;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel-kicker {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: #98a2b3;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel-title {
    font-size: 1.08rem;
    letter-spacing: -0.02em;
    color: var(--beta-text-strong);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel-copy {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-kpi,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-card {
    border-color: rgba(213, 220, 229, 0.92);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-kpi--positive {
    background: linear-gradient(180deg, rgba(240, 253, 248, 0.98) 0%, rgba(255, 255, 255, 0.94) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-kpi--negative {
    background: linear-gradient(180deg, rgba(255, 247, 237, 0.98) 0%, rgba(255, 255, 255, 0.94) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-card--budget {
    background:
        radial-gradient(circle at 100% 0%, rgba(14, 165, 233, 0.08), transparent 26%),
        linear-gradient(180deg, rgba(248, 251, 255, 0.98) 0%, rgba(255, 255, 255, 0.96) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-card--risk {
    background:
        radial-gradient(circle at 0% 100%, rgba(249, 115, 22, 0.08), transparent 28%),
        linear-gradient(180deg, rgba(255, 250, 245, 0.98) 0%, rgba(255, 255, 255, 0.96) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-card-title,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-kpi-label {
    color: #667085;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-kpi-value,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-card-value,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-quarter-label,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-payout-name,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-payout-value {
    color: var(--beta-text-strong);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-card-copy,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-kpi-meta,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-legend,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-meter-label,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-payout-head {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-progress {
    background: rgba(226, 232, 240, 0.88);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-segment.is-actual,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-dot.is-actual,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-quarter-bar.is-actual {
    background: linear-gradient(180deg, #344054 0%, #1f2937 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-segment.is-remaining,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-dot.is-remaining,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-quarter-bar.is-planned {
    background: linear-gradient(180deg, rgba(56, 189, 248, 0.7) 0%, rgba(37, 99, 235, 0.2) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-segment.is-positive,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-dot.is-positive {
    background: linear-gradient(90deg, #34d399 0%, #10b981 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-segment.is-neutral,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-dot.is-neutral,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-dot.is-projected {
    background: linear-gradient(90deg, #38bdf8 0%, #2563eb 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-segment.is-negative,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-dot.is-negative {
    background: linear-gradient(90deg, #fb923c 0%, #f97316 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-segment.is-muted,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-dot.is-muted {
    background: rgba(148, 163, 184, 0.62);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-marker {
    background: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-quarter-bars,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-overview-statline > span {
    border-color: rgba(213, 220, 229, 0.9);
    background: rgba(255, 255, 255, 0.82);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-payout-bar-fill {
    background: linear-gradient(90deg, rgba(14, 165, 233, 0.86) 0%, rgba(37, 99, 235, 0.96) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero .reports-dashboard-signal {
    border-color: rgba(148, 163, 184, 0.18);
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(16px);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero .reports-dashboard-signal-label,
body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero .reports-dashboard-signal-meta {
    color: rgba(226, 232, 240, 0.78);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-panel--hero .reports-dashboard-signal-value {
    color: #f8fafc;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-meter {
    background: rgba(226, 232, 240, 0.14);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-meter-fill.is-positive {
    background: linear-gradient(90deg, #34d399 0%, #10b981 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-meter-fill.is-negative {
    background: linear-gradient(90deg, #fb7185 0%, #f97316 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-meter-fill.is-neutral {
    background: linear-gradient(90deg, #38bdf8 0%, #2563eb 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-summary-chip,
body.design-beta .page[data-page-id="reports"] .reports-balance-lane {
    border-color: rgba(213, 220, 229, 0.9);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-summary-chip strong {
    font-size: 1rem;
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-legend {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-legend-dot.is-planned {
    background: rgba(37, 99, 235, 0.34);
}

body.design-beta .page[data-page-id="reports"] .reports-dashboard-legend-dot.is-actual {
    background: #0f172a;
}

body.design-beta .page[data-page-id="reports"] .reports-domain-runway-range,
body.design-beta .page[data-page-id="reports"] .reports-domain-legend-item,
body.design-beta .page[data-page-id="reports"] .reports-domain-period-card {
    border-color: rgba(213, 220, 229, 0.9);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

body.design-beta .page[data-page-id="reports"] .reports-domain-section-copy,
body.design-beta .page[data-page-id="reports"] .reports-domain-runway-copy,
body.design-beta .page[data-page-id="reports"] .reports-domain-runway-range span,
body.design-beta .page[data-page-id="reports"] .reports-domain-runway-range small,
body.design-beta .page[data-page-id="reports"] .reports-domain-legend-item,
body.design-beta .page[data-page-id="reports"] .reports-domain-view-title {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-domain-legend-label,
body.design-beta .page[data-page-id="reports"] .reports-domain-period-label,
body.design-beta .page[data-page-id="reports"] .reports-domain-runway-range strong,
body.design-beta .page[data-page-id="reports"] .reports-domain-period-top strong {
    color: var(--beta-text-strong);
}

body.design-beta .page[data-page-id="reports"] .reports-domain-stack {
    background: rgba(226, 232, 240, 0.88);
}

body.design-beta .page[data-page-id="reports"] .reports-domain-stack.is-empty {
    border-color: rgba(213, 220, 229, 0.9);
    background: rgba(248, 250, 252, 0.92);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-track {
    height: 230px;
    border-radius: 22px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.78) 0%, rgba(226, 232, 240, 0.7) 100%),
        repeating-linear-gradient(
            to top,
            rgba(148, 163, 184, 0.1) 0,
            rgba(148, 163, 184, 0.1) 1px,
            transparent 1px,
            transparent 25%
        );
    border-color: rgba(213, 220, 229, 0.92);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-bar--planned {
    background: linear-gradient(180deg, rgba(96, 165, 250, 0.9) 0%, rgba(37, 99, 235, 0.28) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-bar--actual {
    background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-values,
body.design-beta .page[data-page-id="reports"] .reports-balance-item-top,
body.design-beta .page[data-page-id="reports"] .reports-reimbursement-head {
    font-variant-numeric: tabular-nums;
}

body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight {
    border-color: rgba(213, 220, 229, 0.9);
    background:
        radial-gradient(circle at top right, rgba(125, 211, 252, 0.16), transparent 32%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-focus,
body.design-beta .page[data-page-id="reports"] .reports-budget-period-card {
    border-color: rgba(213, 220, 229, 0.9);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.96) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-focus-toggle {
    border-color: rgba(213, 220, 229, 0.9);
    background: rgba(248, 250, 252, 0.92);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-focus-toggle-btn {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-focus-toggle-btn.is-active {
    background: linear-gradient(180deg, #344054 0%, #1f2937 100%);
    color: #fff;
}

body.design-beta .page[data-page-id="reports"] .reports-budget-focus-control-label,
body.design-beta .page[data-page-id="reports"] .reports-budget-period-row,
body.design-beta .page[data-page-id="reports"] .reports-budget-period-note {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-period-card-label,
body.design-beta .page[data-page-id="reports"] .reports-budget-period-row strong,
body.design-beta .page[data-page-id="reports"] .reports-budget-period-note strong {
    color: var(--beta-text-strong);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-period-bar.is-planned > span {
    background: linear-gradient(90deg, rgba(96, 165, 250, 0.95) 0%, rgba(37, 99, 235, 0.3) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-period-bar.is-actual > span {
    background: linear-gradient(90deg, #0f172a 0%, #1e293b 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight-kicker,
body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight-value span {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight-track {
    background: rgba(37, 99, 235, 0.1);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight-track-shell {
    background: linear-gradient(90deg, rgba(96, 165, 250, 0.32) 0%, rgba(37, 99, 235, 0.18) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight-value {
    border-color: rgba(213, 220, 229, 0.88);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight-note {
    background: rgba(15, 23, 42, 0.05);
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-budget-spotlight-note.is-empty {
    background: rgba(249, 115, 22, 0.08);
    color: #b45309;
}

body.design-beta .page[data-page-id="reports"] .reports-time-overview-card {
    border-color: rgba(213, 220, 229, 0.92);
    background:
        radial-gradient(circle at top right, rgba(14, 165, 233, 0.18), transparent 30%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%);
    box-shadow: var(--beta-shadow-3);
}

body.design-beta .page[data-page-id="reports"] .reports-time-chart-panel {
    border-color: rgba(213, 220, 229, 0.88);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

body.design-beta .page[data-page-id="reports"] .reports-time-chart-panel .card-subtitle {
    color: var(--beta-text-strong);
}

body.design-beta .page[data-page-id="reports"] .reports-time-trend-empty-kicker,
body.design-beta .page[data-page-id="reports"] .reports-time-trend-value span,
body.design-beta .page[data-page-id="reports"] .reports-time-trend-spotlight-kicker {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="reports"] .reports-time-trend-value {
    border-color: rgba(213, 220, 229, 0.88);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

body.design-beta .page[data-page-id="reports"] .reports-time-trend-track {
    background: rgba(37, 99, 235, 0.1);
}

body.design-beta .page[data-page-id="reports"] .reports-time-trend-track-billable {
    background: linear-gradient(90deg, rgba(16, 185, 129, 0.92) 0%, rgba(5, 150, 105, 0.94) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-time-trend-track-nonbillable {
    background: linear-gradient(90deg, rgba(248, 113, 113, 0.74) 0%, rgba(239, 68, 68, 0.62) 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-balance-bar,
body.design-beta .page[data-page-id="reports"] .reports-reimbursement-bar {
    background: rgba(148, 163, 184, 0.14);
}

body.design-beta .page[data-page-id="reports"] .reports-balance-bar-fill.is-positive {
    background: linear-gradient(90deg, rgba(16, 185, 129, 0.18) 0%, #10b981 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-balance-bar-fill.is-negative {
    background: linear-gradient(90deg, rgba(244, 114, 182, 0.16) 0%, #f97316 100%);
}

body.design-beta .page[data-page-id="reports"] .reports-reimbursement-bar-fill {
    background: linear-gradient(90deg, #0ea5e9 0%, #2563eb 100%);
}

body.design-beta .search-results {
    top: calc(100% + 8px);
    border: 1px solid var(--beta-border);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: var(--beta-shadow-3);
    max-height: min(72vh, 640px);
    padding: 8px;
}

body.design-beta .search-section {
    border-bottom: 0;
}

body.design-beta .search-title {
    padding: 8px 10px 6px;
    font-size: var(--beta-font-meta);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #98a2b3;
}

body.design-beta .search-section-items {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

body.design-beta .search-item {
    width: 100%;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: inherit;
    text-align: left;
}

body.design-beta .search-item:hover,
body.design-beta .search-item.active {
    background: #f2f4f7;
}

body.design-beta .search-item-icon {
    color: #667085;
}

body.design-beta .search-item-icon svg {
    width: 16px;
    height: 16px;
}

body.design-beta .search-item-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

body.design-beta .search-item-label {
    font-size: var(--beta-font-md);
    font-weight: 500;
    color: var(--beta-text);
}

body.design-beta .search-item-subtitle,
body.design-beta .search-item-meta,
body.design-beta .search-empty {
    font-size: var(--beta-font-sm);
    color: var(--beta-text-muted);
}

body.design-beta .search-item mark {
    padding: 0;
    background: transparent;
    color: var(--beta-navy);
    font-weight: 700;
}

body.design-beta .search-empty {
    padding: 12px;
}

body.design-beta .modal,
body.design-beta .modal-overlay {
    background: rgba(15, 23, 42, 0.38);
    backdrop-filter: blur(6px);
    padding: 8px;
}

body.design-beta .modal-content {
    width: min(680px, calc(100vw - 16px));
    max-height: calc(100vh - 16px);
    border: 1px solid rgba(229, 231, 235, 0.92);
    border-radius: 16px;
    box-shadow: var(--beta-shadow-3);
}

body.design-beta .modal-header {
    padding: 12px 14px 8px;
    gap: 10px;
    align-items: center;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .modal-title {
    margin: 0;
    color: var(--beta-text);
    font-size: 16px;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

body.design-beta .modal-body {
    padding: 10px 14px 12px;
    max-height: calc(100vh - 108px);
    background: var(--beta-surface);
}

body.design-beta .modal-footer {
    padding: 8px 14px 10px;
    gap: 6px;
    flex-wrap: wrap;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .modal-close {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    font-size: 16px;
}

body.design-beta .modal-content .btn {
    min-height: 32px;
    height: 32px;
    font-size: var(--beta-font-sm);
}

body.design-beta .modal-content .form-input,
body.design-beta .modal-content .form-select {
    min-height: 32px;
    height: 32px;
    font-size: var(--beta-font-md);
}

body.design-beta .modal-content .form-textarea {
    min-height: 64px;
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: var(--beta-font-md);
}

body.design-beta .modal-content .form-label {
    margin-bottom: 4px;
    color: var(--beta-text-muted);
    font-size: var(--beta-font-meta);
    font-weight: 600;
}

body.design-beta .modal-content .form-group {
    margin-bottom: 8px;
}

body.design-beta .modal-content .form-group:last-child {
    margin-bottom: 0;
}

body.design-beta .modal-content .form-hint,
body.design-beta .modal-content .muted,
body.design-beta .modal-content .text-muted,
body.design-beta .modal-content .text-gray,
body.design-beta .modal-content small {
    font-size: var(--beta-font-meta);
    line-height: 1.45;
    color: var(--beta-text-muted);
}

body.design-beta .modal-panel,
body.design-beta .modal-content .modal-panel > form,
body.design-beta .modal-content form {
    display: grid;
    gap: 8px;
}

body.design-beta .modal-content .form-section {
    margin-bottom: 0;
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta .modal-content .form-section-header {
    margin-bottom: 6px;
    padding-bottom: 6px;
}

body.design-beta .modal-content .form-section-header h6 {
    font-size: var(--beta-font-md);
}

body.design-beta .modal-content .card {
    margin: 0;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta .modal-content .card-header {
    min-height: 0;
    padding: 8px 10px;
    border-bottom: 1px solid var(--beta-border);
    background: transparent;
}

body.design-beta .modal-content .card-body,
body.design-beta .modal-content .card-footer {
    padding: 8px 10px;
}

body.design-beta .modal-content .card-title {
    font-size: var(--beta-font-sm);
    letter-spacing: 0;
}

body.design-beta .modal-content .table thead th {
    padding: 8px 10px;
    font-size: var(--beta-font-meta);
}

body.design-beta .modal-content .table tbody td {
    padding: 8px 10px;
    font-size: var(--beta-font-md);
}

body.design-beta .modal-list {
    max-height: 34vh;
    padding: 8px;
    border-color: var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
    gap: 8px;
}

body.design-beta .modal-content.modal-compact {
    width: min(640px, calc(100vw - 16px));
}

body.design-beta .modal-content.modal-lg {
    width: min(1040px, calc(100vw - 16px));
}

body.design-beta .modal-content.modal-lg .modal-body {
    max-height: calc(100vh - 104px);
}

body.design-beta .modal-content.modal-compact > .modal-body > .offer-form-card,
body.design-beta .modal-content.modal-compact > .modal-body > .modal-panel > .offer-form-card {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.design-beta .modal-content.modal-compact .validation-error:empty,
body.design-beta .modal-content.modal-compact .form-hint:empty {
    display: none;
}

body.design-beta .modal-content.modal-compact [style*="grid-template-columns"] {
    gap: 10px !important;
}

body.design-beta .modal-content.modal-compact [style*="margin-top: 1rem"],
body.design-beta .modal-content.modal-compact [style*="margin-top:1rem"] {
    margin-top: 8px !important;
}

body.design-beta .modal-content.modal-compact [style*="margin-top:16px"] {
    margin-top: 10px !important;
}

body.design-beta .modal-content.modal-compact .btn-sm {
    min-height: 30px;
    height: 30px;
}

body.design-beta #projectDetailModal,
body.design-beta #createProjectModal,
body.design-beta #projectInfoModal,
body.design-beta #teamModal,
body.design-beta #tasksModal,
body.design-beta #timeEntriesModal,
body.design-beta #costsModal,
body.design-beta #invoicesModal,
body.design-beta #plannerCardModal,
body.design-beta #plannerTrashModal,
body.design-beta #invoiceModal,
body.design-beta #einvoiceDetailsModal,
body.design-beta #billModal,
body.design-beta #reimbursement-modal,
body.design-beta #reimbursement-receipts-modal,
body.design-beta #viewOfferModal,
body.design-beta #createOfferModal,
body.design-beta #offerDocModal,
body.design-beta #clientDetailModal,
body.design-beta #timeEntryModal {
    justify-content: flex-end;
    padding: 10px 12px 10px 24px;
}

    body.design-beta .project-detail-modal,
    body.design-beta .project-create-modal,
    body.design-beta .project-info-modal,
    body.design-beta .project-team-modal,
    body.design-beta .project-tasks-modal,
    body.design-beta .project-time-modal,
    body.design-beta .project-costs-modal,
    body.design-beta .project-invoices-modal,
    body.design-beta .project-planner-card-modal,
    body.design-beta .project-planner-trash-modal,
    body.design-beta .invoice-modal,
    body.design-beta .einvoice-modal,
body.design-beta .bill-modal,
body.design-beta .reimbursement-modal,
body.design-beta .reimbursement-receipts-modal,
body.design-beta .offer-detail-modal,
body.design-beta .offer-create-modal,
body.design-beta .offer-doc-modal,
body.design-beta .crm-client-detail-modal,
body.design-beta .time-entry-modal {
    width: min(820px, calc(100vw - 20px)) !important;
    max-width: 820px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    margin-left: auto;
    border-radius: 20px 16px 16px 20px;
    transform: translateX(20px);
}

body.design-beta .modal.active .project-detail-modal,
body.design-beta .modal.active .project-create-modal,
body.design-beta .modal.active .project-info-modal,
body.design-beta .modal.active .project-team-modal,
body.design-beta .modal.active .project-tasks-modal,
body.design-beta .modal.active .project-time-modal,
body.design-beta .modal.active .project-costs-modal,
body.design-beta .modal.active .project-invoices-modal,
body.design-beta .modal.active .project-planner-card-modal,
body.design-beta .modal.active .project-planner-trash-modal,
body.design-beta .modal.active .invoice-modal,
body.design-beta .modal.active .einvoice-modal,
body.design-beta .modal.active .bill-modal,
body.design-beta .modal.active .reimbursement-modal,
body.design-beta .modal.active .reimbursement-receipts-modal,
body.design-beta .modal.active .offer-detail-modal,
body.design-beta .modal.active .offer-create-modal,
body.design-beta .modal.active .offer-doc-modal,
body.design-beta .modal.active .crm-client-detail-modal,
body.design-beta .modal.active .time-entry-modal {
    transform: translateX(0);
}

body.design-beta #assistantFab {
    display: none !important;
}

body.design-beta #bugReportFab {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    right: 12px;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 78px);
    width: 54px;
    height: 54px;
    border-radius: 16px;
    border: 1px solid rgba(201, 110, 27, 0.2);
    background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
    color: #9a3412;
    box-shadow: 0 14px 24px rgba(15, 23, 42, 0.12);
}

body.design-beta #bugReportFab:hover,
body.design-beta #bugReportFab:focus-visible {
    transform: none;
    box-shadow: 0 18px 30px rgba(15, 23, 42, 0.16);
    background: linear-gradient(180deg, #fffaf4 0%, #fed7aa 100%);
}

body.design-beta #timeEntryModal #timeEntryForm,
body.design-beta #expenseModal #expenseForm {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta #timeEntryModal .form-group:has(input[type="hidden"][name="project_id"]),
body.design-beta #timeEntryModal .form-group:has(textarea),
body.design-beta #timeEntryModal .form-group:has(.time-entry-flags),
body.design-beta #expenseModal .form-group:has(textarea) {
    grid-column: 1 / -1;
}

body.design-beta #timeEntryModal #timeEntryIntervalFields {
    gap: 10px !important;
}

body.design-beta #timeEntryModal .time-entry-flags {
    gap: 10px;
}

body.design-beta .page[data-page-id="costs"] #costDetailModal .modal-body,
body.design-beta .page[data-page-id="costs"] #costModal .modal-body,
body.design-beta .page[data-page-id="costs"] #rejectCostModal .modal-body,
body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-body,
body.design-beta .page[data-page-id="invoices"] #einvoiceDetailsModal .einvoice-modal-body {
    background: transparent;
    gap: 10px;
}

body.design-beta .page[data-page-id="costs"] .cost-form-card {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.design-beta .page[data-page-id="costs"] #costForm {
    gap: 10px;
}

body.design-beta .page[data-page-id="costs"] .cost-form-grid {
    gap: 10px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal form {
    display: grid;
    grid-template-columns: minmax(0, 1.42fr) minmax(300px, 0.92fr);
    gap: 10px 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-grid,
body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-details,
body.design-beta .page[data-page-id="invoices"] #invoiceModal .line-items-container {
    gap: 8px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .form-section,
body.design-beta .page[data-page-id="invoices"] #einvoiceDetailsBody {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal {
    width: min(1120px, calc(100vw - 16px)) !important;
    max-width: 1120px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px 16px 16px 20px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .modal-body {
    padding-top: 10px;
    max-height: calc(100vh - 132px);
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-details {
    grid-column: 1 / -1;
    border-radius: 14px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-items-section {
    grid-column: 1;
    align-self: start;
    border-radius: 14px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-sidebar {
    grid-column: 2;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    align-self: start;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-notes-section,
body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-card {
    margin: 0;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-card .card-header,
body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-card .card-body {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-grid--compact {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .line-item .row {
    gap: 6px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .line-items-container {
    max-height: min(34vh, 340px);
    overflow: auto;
    padding-right: 2px;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-upload {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: start;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-list {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: min(24vh, 220px);
    overflow: auto;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-list .list-item {
    padding: 6px 0 !important;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-list .list-item:last-child {
    border-bottom: 0;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .totals-section {
    margin-top: 8px;
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .totals-row {
    padding: 4px 0;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .totals-row.total-row {
    margin-top: 6px;
    padding-top: 8px;
    font-size: var(--beta-font-lg);
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-grid--secondary {
    align-items: start;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoiceStatusBadge,
body.design-beta .page[data-page-id="invoices"] #invoiceStatusBadge {
    margin-left: auto;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .modal-footer {
    padding-top: 10px;
}

body.design-beta #billModal .bill-modal {
    width: min(1120px, calc(100vw - 16px)) !important;
    max-width: 1120px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px 16px 16px 20px;
}

body.design-beta #billModal .modal-body {
    padding-top: 10px;
    max-height: calc(100vh - 132px);
    background: transparent !important;
}

body.design-beta #billModal .bill-modal-form {
    display: grid !important;
    grid-template-columns: minmax(0, 1.6fr) minmax(300px, 0.95fr) !important;
    gap: 12px !important;
}

body.design-beta #billModal .bill-modal-grid {
    display: grid;
    gap: 10px;
}

body.design-beta #billModal .bill-modal-details {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface-subtle);
}

body.design-beta #billModal .bill-modal-grid--compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-column: 1 / -1;
}

body.design-beta #billModal .bill-line-items-section {
    grid-column: 1;
    align-self: start;
    margin: 0;
    border-radius: 14px;
}

body.design-beta #billModal .bill-modal-sidebar {
    grid-column: 2;
    grid-template-columns: 1fr;
    align-self: start;
}

body.design-beta #billModal .bill-notes-section,
body.design-beta #billModal .bill-receipts-card,
body.design-beta #billModal .bill-status-section {
    margin: 0;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta #billModal .bill-notes-section,
body.design-beta #billModal .bill-status-section,
body.design-beta #billModal .bill-receipts-card .card-header,
body.design-beta #billModal .bill-receipts-card .card-body {
    padding: 10px 12px;
}

body.design-beta #billModal .bill-line-items-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

body.design-beta #billModal .bill-totals-section {
    text-align: right;
    margin-top: 8px;
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--beta-surface);
}

body.design-beta #billModal .line-items-container {
    max-height: min(34vh, 340px);
    overflow: auto;
    padding-right: 2px;
}

body.design-beta #billModal .bill-line-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 96px 118px 92px auto;
    gap: 8px;
    align-items: center;
    margin-bottom: 6px;
}

body.design-beta #billModal .bill-line-item-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    justify-content: flex-end;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-label,
body.design-beta #billModal .bill-line-item-label {
    margin-bottom: 4px;
    font-size: 11px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-row {
    align-items: end;
}

body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

body.design-beta #billModal .bill-receipts-upload {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
}

body.design-beta #billModal .bill-receipts-list {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: min(24vh, 220px);
    overflow: auto;
}

body.design-beta #billModal .modal-footer {
    padding-top: 10px;
}

@media (max-width: 1180px) {
    body.design-beta .page[data-page-id="invoices"] #invoiceModal form {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-items-section,
    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-sidebar {
        grid-column: auto;
    }

    body.design-beta #billModal .bill-modal-form {
        grid-template-columns: 1fr !important;
    }

    body.design-beta #billModal .bill-line-items-section,
    body.design-beta #billModal .bill-modal-sidebar {
        grid-column: auto;
    }
}

@media (max-width: 900px) {
    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-grid--compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta #billModal .bill-modal-grid--compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta #billModal .bill-line-item {
        grid-template-columns: minmax(0, 1fr) 88px 100px 84px auto;
    }
}

@media (max-width: 720px) {
    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-grid--compact {
        grid-template-columns: 1fr;
    }

    body.design-beta #billModal .bill-modal-grid--compact,
    body.design-beta #billModal .bill-modal-details,
    body.design-beta #billModal .bill-line-item {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    body.design-beta #invoiceModal,
    body.design-beta #billModal,
    body.design-beta #arCreateModal,
    body.design-beta #arEditModal,
    body.design-beta #mtTypesModal,
    body.design-beta #mtProtocolModal {
        justify-content: stretch;
        align-items: stretch;
        padding: 0;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal,
    body.design-beta #billModal .bill-modal,
    body.design-beta .project-ar-create-modal,
    body.design-beta .project-ar-edit-modal,
    body.design-beta .project-mt-types-modal,
    body.design-beta .project-mt-protocol-modal {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        border-radius: 0 !important;
        margin: 0;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .modal-header,
    body.design-beta #billModal .modal-header,
    body.design-beta #arCreateModal .modal-header,
    body.design-beta #arEditModal .modal-header,
    body.design-beta #mtTypesModal .modal-header,
    body.design-beta #mtProtocolModal .modal-header {
        padding-inline: 14px;
        gap: 8px;
        flex-wrap: wrap;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceStatusBadge,
    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoiceStatusBadge {
        margin-left: 0;
        order: 3;
        width: 100%;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .modal-body,
    body.design-beta #billModal .modal-body,
    body.design-beta #arCreateModal .modal-body,
    body.design-beta #arEditModal .modal-body,
    body.design-beta #mtTypesModal .modal-body,
    body.design-beta #mtProtocolModal .modal-body {
        padding: 0 12px 12px;
        max-height: none;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .modal-footer,
    body.design-beta #billModal .modal-footer,
    body.design-beta #arCreateModal .modal-footer,
    body.design-beta #arEditModal .modal-footer,
    body.design-beta #mtTypesModal .modal-footer,
    body.design-beta #mtProtocolModal .modal-footer {
        padding: 10px 12px max(12px, env(safe-area-inset-bottom, 0px));
        gap: 8px;
        flex-direction: column-reverse;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .modal-footer .btn,
    body.design-beta #billModal .modal-footer .btn,
    body.design-beta #arCreateModal .modal-footer .btn,
    body.design-beta #arEditModal .modal-footer .btn,
    body.design-beta #mtTypesModal .modal-footer .btn,
    body.design-beta #mtProtocolModal .modal-footer .btn {
        width: 100%;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal form,
    body.design-beta #billModal .bill-modal-form {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-details,
    body.design-beta #billModal .bill-modal-details {
        grid-template-columns: 1fr;
        padding: 10px;
        border-radius: 12px;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-grid--compact,
    body.design-beta #billModal .bill-modal-grid--compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-items-section,
    body.design-beta #billModal .bill-line-items-section,
    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-modal-sidebar,
    body.design-beta #billModal .bill-modal-sidebar {
        grid-column: auto;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .line-items-container,
    body.design-beta #billModal .line-items-container,
    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-receipts-list,
    body.design-beta #billModal .bill-receipts-list {
        max-height: none;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .line-item,
    body.design-beta #billModal .bill-line-item {
        padding: 10px;
        border: 1px solid var(--beta-border);
        border-radius: 12px;
        background: var(--beta-surface);
        margin-bottom: 8px;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin: 0;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-row > [class*="col-"] {
        width: auto;
        max-width: none;
        flex: initial;
        padding: 0;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-field--description,
    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-field--actions,
    body.design-beta #billModal .bill-line-item-field--description,
    body.design-beta #billModal .bill-line-item-actions {
        grid-column: 1 / -1;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .invoice-line-item-actions,
    body.design-beta #billModal .bill-line-item-actions {
        justify-content: space-between;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .form-section-header,
    body.design-beta #billModal .form-section-header {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="invoices"] #invoiceModal .form-section-header .btn,
    body.design-beta #billModal .form-section-header .btn {
        width: 100%;
    }

    body.design-beta #arCreateForm,
    body.design-beta #arEditForm,
    body.design-beta #mtTypesModal .card > div[style*="grid-template-columns"],
    body.design-beta #mtProtocolModal #mtProtocolWizardSteps,
    body.design-beta #mtProtocolModal div[style*="grid-template-columns: 160px 1fr"] {
        grid-template-columns: 1fr !important;
    }

    body.design-beta #mtProtocolModal #mtProtocolWizardSteps {
        gap: 8px !important;
    }

    body.design-beta #arCreateForm > div[style*="grid-column:1 / span 2;"],
    body.design-beta #arEditForm > div[style*="grid-column:1 / span 2;"] {
        grid-column: auto !important;
    }

    body.design-beta .page[data-page-id="projects"] #meetingsTab .project-tab-card-actions,
    body.design-beta .page[data-page-id="projects"] #phasesTab .project-tab-card-actions,
    body.design-beta .page[data-page-id="projects"] #milestonesTab .project-tab-card-actions {
        width: 100%;
    }

    body.design-beta .page[data-page-id="projects"] #meetingsTab .project-tab-card-actions .btn,
    body.design-beta .page[data-page-id="projects"] #meetingsTab .project-tab-card-actions .form-select,
    body.design-beta .page[data-page-id="projects"] #phasesTab .project-tab-card-actions .btn,
    body.design-beta .page[data-page-id="projects"] #milestonesTab .project-tab-card-actions .btn {
        width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="projects"] #meetingsTab .table-container,
    body.design-beta .page[data-page-id="projects"] #phasesTab .table-container,
    body.design-beta .page[data-page-id="projects"] #milestonesTab .table-container,
    body.design-beta .page[data-page-id="projects"] #notesTab .table-container,
    body.design-beta .page[data-page-id="projects"] #rfisTab .table-container,
    body.design-beta .page[data-page-id="projects"] #budgetTab .table-container {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-x: contain;
    }
}

body.design-beta #createProjectModal .project-create-modal {
    width: min(980px, calc(100vw - 20px)) !important;
    max-width: 980px !important;
}

body.design-beta #projectInfoModal {
    justify-content: flex-end;
    align-items: stretch;
    padding: 10px 12px 10px 24px;
}

body.design-beta #projectInfoModal .project-info-modal {
    width: min(1080px, calc(100vw - 16px)) !important;
    max-width: 1080px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px 16px 16px 20px;
}

body.design-beta #projectInfoModal .modal-body {
    background: transparent !important;
    padding-top: 10px;
}

body.design-beta #projectInfoModal .project-info-panel {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.design-beta #projectInfoModal #projectEditForm {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 10px;
    align-items: start;
}

body.design-beta #projectInfoModal #projectEditForm > div,
body.design-beta #projectInfoModal #projectEditForm > .form-group {
    min-width: 0;
    margin-bottom: 0 !important;
}

body.design-beta #projectInfoModal #projectEditForm > :nth-child(1),
body.design-beta #projectInfoModal #projectEditForm > :nth-child(2),
body.design-beta #projectInfoModal #projectEditForm > :nth-child(5),
body.design-beta #projectInfoModal #projectEditForm > :nth-child(8) {
    grid-column: 1 / -1;
}

body.design-beta #projectInfoModal #projectEditForm > :nth-child(4) {
    grid-column: span 2;
}

body.design-beta #projectInfoModal #projectEditForm > div[style*="grid-template-columns"] {
    display: contents;
}

body.design-beta #projectInfoModal #projectEditForm textarea[name="description"] {
    min-height: 76px;
}

body.design-beta #projectInfoModal #projectEditForm .form-label {
    margin-bottom: 3px;
}

body.design-beta #projectInfoModal #projectEditForm .form-hint,
body.design-beta #projectInfoModal #projectEditForm small.text-gray {
    margin-top: 3px;
    font-size: 11px;
    line-height: 1.35;
}

body.design-beta #projectInfoModal #projectEditForm [data-i18n="phrases.Prefilled from company settings."],
body.design-beta #projectInfoModal #projectEditForm [data-i18n="projects.defaultBillableHint"],
body.design-beta #projectInfoModal #projectEditForm small.text-gray {
    display: none;
}

body.design-beta #projectInfoModal .modal-footer .btn {
    min-height: 32px;
    height: 32px;
    padding: 0 12px;
    font-size: 12px;
}

body.design-beta #plannerCardModal,
body.design-beta #plannerTrashModal {
    justify-content: flex-end;
    align-items: stretch;
    padding: 10px 12px 10px 24px;
}

body.design-beta #plannerCardModal .project-planner-card-modal {
    width: min(1180px, calc(100vw - 16px)) !important;
    max-width: 1180px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px 16px 16px 20px;
    overflow: hidden !important;
}

body.design-beta #plannerCardModal .modal-body,
body.design-beta #plannerTrashModal .modal-body {
    background: transparent;
    padding-top: 10px;
}

body.design-beta #plannerCardModal .project-planner-card-panel,
body.design-beta #plannerTrashModal .project-planner-trash-panel {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.design-beta #plannerCardModal .planner-modal-grid {
    grid-template-columns: minmax(0, 1.68fr) minmax(320px, 0.96fr) !important;
    gap: 12px;
    align-items: start;
}

body.design-beta #plannerCardModal .planner-modal-col {
    gap: 8px;
}

body.design-beta #plannerCardModal .planner-modal-col > .card,
body.design-beta #plannerCardModal .planner-modal-full {
    margin: 0 !important;
    border-radius: 14px;
    background: var(--beta-surface);
}

body.design-beta #plannerCardModal .planner-modal-full {
    margin-top: 8px !important;
}

body.design-beta #plannerCardModal .planner-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 10px;
}

body.design-beta #plannerCardModal .planner-modal-col:first-child > .card:nth-child(2) .planner-form-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body.design-beta #plannerCardModal .planner-form-grid .form-group {
    margin-bottom: 0;
}

body.design-beta #plannerCardModal .planner-chip-select {
    min-height: 34px;
    padding: 4px 6px;
    gap: 4px;
    border-radius: 10px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta #plannerCardModal .planner-chip-list {
    gap: 4px;
}

body.design-beta #plannerCardModal .planner-chip-select .chip {
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta #plannerCardModal .planner-chip-input {
    min-width: 120px;
    padding: 4px 2px;
    font-size: 13px;
    line-height: 1.35;
}

body.design-beta #plannerCardModal .planner-chip-suggestions {
    border-radius: 12px;
    box-shadow: var(--beta-shadow-3);
}

body.design-beta #plannerCardModal .planner-chip-suggestion {
    padding: 8px 10px;
}

body.design-beta #plannerCardModal .planner-chip-empty,
body.design-beta #plannerCardModal .planner-chip-suggestion .muted {
    font-size: 11px;
}

body.design-beta #plannerCardModal .form-hint {
    display: none;
}

body.design-beta #plannerCardModal #plannerDescription {
    min-height: 76px;
}

body.design-beta #plannerCardModal .planner-attachments-list,
body.design-beta #plannerCardModal #plannerCommentsList,
body.design-beta #plannerTrashList {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 240px;
    overflow: auto;
    padding-right: 2px;
}

body.design-beta #plannerCardModal .planner-attachment-row,
body.design-beta #plannerTrashModal .planner-trash-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta #plannerCardModal .planner-attachment-preview {
    width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--beta-text-muted);
    font-size: 14px;
}

body.design-beta #plannerCardModal .planner-attachment-preview img {
    width: 72px !important;
    height: 52px !important;
}

body.design-beta #plannerCardModal .planner-attachment-meta,
body.design-beta #plannerTrashModal .planner-trash-meta {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

body.design-beta #plannerCardModal .planner-attachment-name,
body.design-beta #plannerTrashModal .planner-trash-meta strong {
    font-size: 13px;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.design-beta #plannerCardModal .planner-attachment-type,
body.design-beta #plannerTrashModal .planner-trash-meta span {
    font-size: 11px;
    color: var(--beta-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.design-beta #plannerCardModal .planner-attachment-actions,
body.design-beta #plannerTrashModal .planner-trash-actions,
body.design-beta #plannerCardModal .planner-comment-compose {
    display: flex;
    align-items: center;
    gap: 6px;
}

body.design-beta #plannerCardModal .planner-comment-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
    padding: 8px 0;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta #plannerCardModal .planner-comment-row:last-child {
    border-bottom: 0;
}

body.design-beta #plannerCardModal .planner-comment-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

body.design-beta #plannerCardModal .planner-comment-meta {
    font-size: 11px;
    color: var(--beta-text-muted);
}

body.design-beta #plannerCardModal .planner-comment-compose {
    margin-top: 8px;
}

body.design-beta #plannerCardModal .planner-comment-compose .form-input {
    min-width: 0;
    flex: 1;
}

body.design-beta #plannerCardModal #plannerCardGantt {
    max-height: 220px;
    overflow: auto;
}

body.design-beta #plannerCardModal .modal-footer .btn,
body.design-beta #plannerTrashModal .modal-footer .btn,
body.design-beta #plannerCardModal .planner-attachment-actions .btn,
body.design-beta #plannerTrashModal .planner-trash-actions .btn,
body.design-beta #plannerCardModal .planner-comment-row .btn {
    min-height: 30px;
    height: 30px;
    padding: 0 10px;
    font-size: 12px;
}

body.design-beta #plannerTrashModal .project-planner-trash-modal {
    width: min(760px, calc(100vw - 16px)) !important;
    max-width: 760px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px 16px 16px 20px;
}

body.design-beta #plannerTrashModal #plannerTrashList {
    max-height: min(46vh, 420px);
}

@media (max-width: 1100px) {
    body.design-beta #projectInfoModal #projectEditForm {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta #plannerCardModal .planner-modal-grid {
        grid-template-columns: 1fr !important;
    }

    body.design-beta #plannerCardModal .planner-modal-col:first-child > .card:nth-child(2) .planner-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    body.design-beta #projectInfoModal #projectEditForm {
        grid-template-columns: 1fr;
    }

    body.design-beta #projectInfoModal #projectEditForm > :nth-child(4) {
        grid-column: auto;
    }

    body.design-beta #plannerCardModal .planner-form-grid,
    body.design-beta #plannerCardModal .planner-modal-col:first-child > .card:nth-child(2) .planner-form-grid {
        grid-template-columns: 1fr !important;
    }

    body.design-beta #plannerCardModal .planner-attachment-row,
    body.design-beta #plannerTrashModal .planner-trash-row {
        grid-template-columns: minmax(0, 1fr);
    }

    body.design-beta #plannerCardModal .planner-attachment-actions,
    body.design-beta #plannerTrashModal .planner-trash-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

body.design-beta #createProjectModal .modal-body {
    background: transparent;
}

body.design-beta #createProjectModal .project-create-panel,
body.design-beta #createProjectModal #createProjectForm {
    gap: 10px;
}

body.design-beta #createProjectModal #createProjectForm {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    align-items: start;
}

body.design-beta #createProjectModal #createProjectForm > .form-group,
body.design-beta #createProjectModal #createProjectForm > .card,
body.design-beta #createProjectModal #createProjectForm > div {
    min-width: 0;
}

body.design-beta #createProjectModal #createProjectForm > .form-group:has(#projectClientAutocomplete),
body.design-beta #createProjectModal #createProjectForm > .form-group:has(textarea[name="title"]),
body.design-beta #createProjectModal #createProjectForm > .form-group:has(textarea[name="description"]),
body.design-beta #createProjectModal #createProjectForm > .card,
body.design-beta #createProjectModal #createProjectForm > div[style*="grid-template-columns: 1fr 1fr"] {
    grid-column: 1 / -1;
}

body.design-beta #createProjectModal #createProjectForm > div[style*="grid-template-columns: 1fr 1fr"] {
    gap: 10px !important;
}

body.design-beta #createProjectModal textarea[name="title"],
body.design-beta #createProjectModal textarea[name="description"] {
    min-height: 64px;
}

body.design-beta #createProjectModal .project-create-modal .card {
    border-radius: 12px;
}

body.design-beta #createProjectModal .project-create-modal .card-header {
    padding: 10px 12px 8px;
    gap: 8px;
}

body.design-beta #createProjectModal .project-create-modal .card-body {
    padding: 8px 10px 10px;
}

body.design-beta #createProjectModal [data-role="phase-hint"] {
    display: none;
}

body.design-beta .page[data-page-id="reimbursements"] #reimbursement-modal #reimbursementForm,
body.design-beta .page[data-page-id="reimbursements"] #reimbursementExportModal .reimbursement-export-panel,
body.design-beta .page[data-page-id="reimbursements"] #reimbursement-receipts-modal .reimbursement-receipts-panel {
    gap: 10px;
}

body.design-beta #teamModal .project-team-modal {
    width: min(980px, calc(100vw - 16px)) !important;
    max-width: 980px !important;
}

body.design-beta #tasksModal .project-tasks-modal {
    width: min(1100px, calc(100vw - 16px)) !important;
    max-width: 1100px !important;
}

body.design-beta #timeEntriesModal .project-time-modal,
body.design-beta #costsModal .project-costs-modal,
body.design-beta #invoicesModal .project-invoices-modal {
    width: min(1000px, calc(100vw - 16px)) !important;
    max-width: 1000px !important;
}

body.design-beta #einvoiceDetailsModal .einvoice-modal {
    width: min(900px, calc(100vw - 16px)) !important;
    max-width: 900px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px 16px 16px 20px;
}

body.design-beta #createOfferModal .offer-create-modal {
    width: min(1120px, calc(100vw - 16px)) !important;
    max-width: 1120px !important;
}

body.design-beta #offerDocModal .offer-doc-modal {
    width: min(1120px, calc(100vw - 16px)) !important;
    max-width: 1120px !important;
}

body.design-beta #teamModal .modal-body,
body.design-beta #tasksModal .modal-body,
body.design-beta #timeEntriesModal .modal-body,
body.design-beta #costsModal .modal-body,
body.design-beta #invoicesModal .modal-body,
body.design-beta #einvoiceDetailsModal .modal-body,
body.design-beta #createOfferModal .modal-body,
body.design-beta #followUpModal .modal-body,
body.design-beta #createClientInlineModal .modal-body,
body.design-beta #offerClientViewModal .modal-body,
body.design-beta #offerDocModal .modal-body,
body.design-beta #viewOfferModal .modal-body {
    background: transparent;
}

body.design-beta #teamModal .modal-body,
body.design-beta #tasksModal .modal-body,
body.design-beta #timeEntriesModal .modal-body,
body.design-beta #costsModal .modal-body,
body.design-beta #invoicesModal .modal-body,
body.design-beta #einvoiceDetailsModal .modal-body {
    padding-top: 10px;
}

body.design-beta #createOfferModal .offer-create-card,
body.design-beta #followUpModal .offer-form-card,
body.design-beta #createClientInlineModal .offer-form-card,
body.design-beta #offerClientViewModal .offer-form-card,
body.design-beta #offerDocModal .offer-form-card {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.design-beta #createOfferModal #createOfferForm {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 10px;
    align-items: start;
}

body.design-beta #createOfferModal #createOfferForm > .form-group,
body.design-beta #createOfferModal #createOfferForm > .card,
body.design-beta #createOfferModal #createOfferForm > div {
    min-width: 0;
}

body.design-beta #createOfferModal #createOfferForm > :nth-child(1),
body.design-beta #createOfferModal #createOfferForm > :nth-child(2),
body.design-beta #createOfferModal #createOfferForm > :nth-child(3),
body.design-beta #createOfferModal #createOfferForm > :nth-child(7),
body.design-beta #createOfferModal #createOfferForm > :nth-child(13),
body.design-beta #createOfferModal #createOfferForm > :nth-child(14),
body.design-beta #createOfferModal #createOfferForm > :nth-child(15),
body.design-beta #createOfferModal #createOfferForm > :nth-child(16),
body.design-beta #createOfferModal #createOfferForm > :nth-child(17),
body.design-beta #createOfferModal #createOfferForm > :nth-child(19) {
    grid-column: span 2;
}

body.design-beta #createOfferModal #createOfferForm > #phasesSection,
body.design-beta #createOfferModal #createOfferForm > #hoursSection {
    grid-column: 1 / -1;
}

body.design-beta #createOfferModal #createOfferForm textarea {
    min-height: 56px;
}

body.design-beta #createOfferModal #createOfferForm > :nth-child(7) textarea,
body.design-beta #createOfferModal #createOfferForm > :nth-child(17) textarea {
    min-height: 72px;
}

body.design-beta #createOfferModal #createOfferForm .form-label {
    margin-bottom: 3px;
}

body.design-beta #createOfferModal #createOfferForm .form-hint {
    margin-top: 3px;
    font-size: 11px;
    line-height: 1.35;
}

body.design-beta #createOfferModal #createOfferForm .checkbox {
    min-height: 32px;
    font-size: 12px;
}

body.design-beta #createOfferModal #createOfferForm .checkbox span + .form-hint,
body.design-beta #createOfferModal #createOfferForm #phasesSection > .form-hint,
body.design-beta #createOfferModal #createOfferForm [data-i18n="offersPage.attachmentsHint"] {
    display: none;
}

body.design-beta #createOfferModal #createOfferForm #offerAdditionalCostsSection > div[style*="grid-template-columns"],
body.design-beta #createOfferModal #createOfferForm #hoursSection > div[style*="grid-template-columns"],
body.design-beta #createOfferModal #createOfferForm > :nth-child(1) > div[style*="grid-template-columns"],
body.design-beta #createOfferModal #createOfferForm > :nth-child(13),
body.design-beta #createOfferModal #createOfferForm > :nth-child(14) {
    gap: 8px !important;
}

body.design-beta #createOfferModal #createOfferForm #offerPaymentTermsCustomWrap {
    margin-top: 6px !important;
}

body.design-beta #createOfferModal #createOfferForm #offerTotalsCard {
    align-self: start;
}

body.design-beta #createOfferModal #createOfferForm #phasesList {
    padding: 6px !important;
}

body.design-beta #createOfferModal #offerTotalsCard .card-body {
    padding: 8px 10px;
    gap: 6px !important;
}

body.design-beta #createOfferModal #offerTotalsCard [style*="font-size:1.1rem"] {
    font-size: var(--beta-font-lg) !important;
}

body.design-beta #offerDocModal .modal-header {
    padding-bottom: 10px;
}

body.design-beta #offerDocModal .modal-body {
    padding-top: 10px;
}

body.design-beta #offerDocModal .offer-doc-panel,
body.design-beta #offerDocModal .offer-doc-grid > div {
    min-width: 0;
}

body.design-beta #viewOfferModal {
    justify-content: flex-end;
    align-items: stretch;
    padding: 10px 12px 10px 24px;
}

body.design-beta #viewOfferModal .offer-detail-modal {
    width: min(1120px, calc(100vw - 16px)) !important;
    max-width: 1120px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    margin-left: auto;
    border-radius: 20px 16px 16px 20px;
    transform: translateX(20px);
}

body.design-beta .modal.active #viewOfferModal .offer-detail-modal,
body.design-beta #viewOfferModal.active .offer-detail-modal {
    transform: translateX(0);
}

body.design-beta #viewOfferModal .modal-header {
    padding-bottom: 10px;
}

body.design-beta #viewOfferModal .modal-body {
    padding-top: 10px;
}

body.design-beta #viewOfferModal #offerDetails {
    gap: 10px;
}

body.design-beta #viewOfferModal .offer-detail-card {
    min-width: 0;
}

body.design-beta #viewOfferModal .offer-detail-modal-body {
    display: grid;
    grid-template-columns: minmax(0, 1.48fr) minmax(300px, 0.92fr);
    gap: 12px;
    align-items: start;
}

body.design-beta #viewOfferModal .offer-detail-main,
body.design-beta #viewOfferModal .offer-detail-sidebar,
body.design-beta #viewOfferModal #offerFinancial {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

body.design-beta #viewOfferModal #offerFollowUps {
    margin: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.design-beta #viewOfferModal .offer-detail-summary,
body.design-beta #viewOfferModal .offer-detail-section,
body.design-beta #viewOfferModal .offer-followups-card {
    margin: 0;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta #viewOfferModal .offer-detail-summary {
    padding: 12px 14px;
    background: var(--beta-surface-subtle);
}

body.design-beta #viewOfferModal .offer-detail-summary-main {
    align-items: flex-start;
    gap: 12px;
}

body.design-beta #viewOfferModal .offer-detail-summary-copy {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

body.design-beta #viewOfferModal .offer-detail-number {
    font-size: 11px;
    letter-spacing: 0.1em;
}

body.design-beta #viewOfferModal .offer-detail-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    line-height: 1.2;
    letter-spacing: -0.03em;
    font-weight: 600;
    color: var(--beta-text-strong);
}

body.design-beta #viewOfferModal .offer-detail-summary-secondary {
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta #viewOfferModal .offer-detail-summary-amount {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-end;
}

body.design-beta #viewOfferModal .offer-detail-summary-amount label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--beta-text-muted);
}

body.design-beta #viewOfferModal .offer-detail-amount {
    font-size: 24px;
    line-height: 1.1;
    color: var(--beta-text-strong);
}

body.design-beta #viewOfferModal .offer-detail-badges {
    margin-top: 8px;
    gap: 6px;
}

body.design-beta #viewOfferModal .offer-detail-summary-meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 12px;
    margin-top: 12px;
}

body.design-beta #viewOfferModal .offer-detail-meta-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

body.design-beta #viewOfferModal .offer-detail-summary-meta label {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--beta-text-muted);
}

body.design-beta #viewOfferModal .offer-detail-summary-meta span {
    font-size: 13px;
    line-height: 1.35;
    color: var(--beta-text-strong);
}

body.design-beta #viewOfferModal .offer-detail-section-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta #viewOfferModal .offer-detail-section {
    padding: 12px 14px;
}

body.design-beta #viewOfferModal .offer-detail-section h4 {
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.01em;
}

body.design-beta #viewOfferModal .offer-detail-grid {
    gap: 10px 12px;
}

body.design-beta #viewOfferModal .offer-detail-item {
    gap: 3px;
}

body.design-beta #viewOfferModal .offer-detail-item label {
    font-size: 11px;
    letter-spacing: 0.05em;
}

body.design-beta #viewOfferModal .offer-detail-item span,
body.design-beta #viewOfferModal .offer-detail-description {
    font-size: 13px;
    line-height: 1.45;
}

body.design-beta #viewOfferModal .offer-detail-total {
    font-size: 15px;
    color: var(--beta-text-strong);
}

body.design-beta #viewOfferModal .table-container {
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    overflow: hidden;
}

body.design-beta #viewOfferModal .table th,
body.design-beta #viewOfferModal .table td {
    padding: 8px 10px;
    font-size: 12px;
}

body.design-beta #viewOfferModal .offer-followups-card .card-header,
body.design-beta #viewOfferModal .offer-followups-card .card-body {
    padding: 12px 14px;
}

body.design-beta #viewOfferModal .offer-followups-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta #viewOfferModal .offer-followups-header .card-title {
    font-size: 13px;
    font-weight: 600;
}

body.design-beta #viewOfferModal .offer-followups-body {
    gap: 8px;
}

body.design-beta #viewOfferModal .offer-followup-row {
    padding: 10px 12px;
    border-radius: 12px;
    gap: 10px;
    background: var(--beta-surface-subtle);
    border-color: var(--beta-border);
}

body.design-beta #viewOfferModal .offer-followup-note {
    font-size: 13px;
    font-weight: 600;
}

body.design-beta #viewOfferModal .offer-followup-meta {
    font-size: 12px;
    line-height: 1.4;
}

body.design-beta #viewOfferModal .offer-followup-actions {
    gap: 6px;
}

body.design-beta #viewOfferModal .offer-followup-actions .btn,
body.design-beta #viewOfferModal .offer-followups-header .btn,
body.design-beta #offerActions .btn {
    min-height: 32px;
    height: 32px;
    padding: 0 12px;
    font-size: 12px;
}

body.design-beta #viewOfferModal .modal-footer {
    padding-top: 10px;
}

body.design-beta #offerActions {
    justify-content: flex-end;
    gap: 8px;
}

body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-panel,
body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-grid > div > .card {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-intro-card {
    background:
        radial-gradient(circle at top right, rgba(10, 184, 166, 0.1), transparent 44%),
        linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,250,252,0.98));
}

body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-context-kicker {
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--beta-text-muted);
    font-weight: 700;
}

body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-context-line {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    line-height: 1.25;
    letter-spacing: -0.03em;
    font-weight: 600;
    color: var(--beta-text-strong);
}

body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-actions {
    width: 100%;
}

body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-actions-status {
    flex: 1 1 360px;
}

body.design-beta #viewOfferModal.offer-detail-modal--doc-mode #offerDocStorageNote,
body.design-beta #viewOfferModal.offer-detail-modal--doc-mode #offerDocTeamsStatus {
    line-height: 1.45;
    color: var(--beta-text-muted) !important;
}

@media (max-width: 1100px) {
    body.design-beta #viewOfferModal .offer-detail-modal-body,
    body.design-beta #viewOfferModal .offer-detail-section-group,
    body.design-beta #viewOfferModal .offer-detail-summary-meta {
        grid-template-columns: 1fr;
    }

    body.design-beta #viewOfferModal #offerFollowUps {
        position: static;
    }

    body.design-beta #viewOfferModal.offer-detail-modal--doc-mode .offer-doc-actions-status {
        min-width: 100%;
    }
}

body.design-beta #timeEntryModal {
    justify-content: center;
    align-items: center;
    padding: 8px;
}

body.design-beta #timeEntryModal .time-entry-modal {
    width: min(760px, calc(100vw - 16px)) !important;
    max-width: 760px !important;
    height: auto;
    max-height: calc(100vh - 16px) !important;
    margin: 0;
    border-radius: 16px;
    transform: translateY(14px);
}

body.design-beta .modal.active #timeEntryModal .time-entry-modal,
body.design-beta #timeEntryModal.active .time-entry-modal {
    transform: translateY(0);
}

body.design-beta #timeEntryModal .modal-body {
    max-height: calc(100vh - 148px);
}

body.design-beta #reimbursement-modal .modal-body,
body.design-beta #reimbursementExportModal .modal-body,
body.design-beta #reimbursement-receipts-modal .modal-body,
body.design-beta #vehicle-modal .modal-body,
body.design-beta #receipt-cropper-modal .modal-body {
    background: transparent;
}

body.design-beta #reimbursement-modal .reimbursement-modal,
body.design-beta #reimbursement-receipts-modal .reimbursement-receipts-modal {
    width: min(1120px, calc(100vw - 16px)) !important;
    max-width: 1120px !important;
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px) !important;
    border-radius: 20px 16px 16px 20px;
}

body.design-beta #reimbursement-modal .modal-body,
body.design-beta #reimbursement-receipts-modal .modal-body {
    padding-top: 10px;
}

body.design-beta #reimbursement-modal #reimbursementForm {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    align-items: start;
}

body.design-beta #reimbursement-modal #reimbursementForm > .form-group,
body.design-beta #reimbursement-modal #reimbursementForm > .card {
    min-width: 0;
}

body.design-beta #reimbursement-modal #reimbursementForm > .form-group:has(#reimbProjectPickerWrap),
body.design-beta #reimbursement-modal #reimbursementForm > .form-group:has(#reimbAmountBlock),
body.design-beta #reimbursement-modal #reimbursementForm > .form-group:has(textarea),
body.design-beta #reimbursement-modal #reimbursementForm > .form-group:has(input[type="file"]),
body.design-beta #reimbursement-modal #reimbursementForm > #mileageCard,
body.design-beta #reimbursement-modal #reimbursementForm > #reimbAiSuggestions {
    grid-column: 1 / -1;
}

body.design-beta #reimbursement-modal .reimbursement-form-panel,
body.design-beta #reimbursementExportModal .reimbursement-export-panel,
body.design-beta #reimbursement-receipts-modal .reimbursement-receipts-panel,
body.design-beta #vehicle-modal .vehicle-panel {
    gap: 8px;
}

body.design-beta #reimbursement-modal #reimbScanBtn {
    min-height: 34px;
}

body.design-beta #reimbursement-modal #mileageCard .card-body,
body.design-beta #reimbursement-modal #reimbAiSuggestions .card-body {
    padding: 8px 10px;
}

body.design-beta #reimbursement-modal #mileageMap {
    height: 220px !important;
}

body.design-beta #reimbursementExportModal #reimbursementExportForm,
body.design-beta #timeEntryModal #timeEntryForm,
body.design-beta #timesheetExportModal #timesheetExportForm,
body.design-beta #contactModal #contactForm {
    gap: 10px 12px;
}

body.design-beta #contactModal #contactForm,
body.design-beta #createClientInlineModal #createClientInlineForm,
body.design-beta #followUpModal #followUpForm {
    gap: 8px;
}

body.design-beta #contactModal .modal-body,
body.design-beta #contactActivityModal .modal-body,
body.design-beta #createClientModal .modal-body,
body.design-beta #manageProductsModal .modal-body,
body.design-beta #clientProductModal .modal-body,
body.design-beta #outlookLinkClientModal .modal-body,
body.design-beta #clientReportModal .modal-body,
body.design-beta #projectCreateClientModal .modal-body,
body.design-beta #projectClientViewModal .modal-body,
body.design-beta #projectEvaluationExportModal .modal-body,
body.design-beta #phaseModal .modal-body,
body.design-beta #phaseBulkModal .modal-body,
body.design-beta #arCreateModal .modal-body,
body.design-beta #arEditModal .modal-body,
body.design-beta #mtTypesModal .modal-body,
body.design-beta #mtProtocolModal .modal-body,
body.design-beta #mtProtocolItemsModal .modal-body,
body.design-beta #mtProtocolCarryoverModal .modal-body,
body.design-beta #mtProtocolLineageModal .modal-body,
body.design-beta #uploadModal .modal-body,
body.design-beta #teamsFilesModal .modal-body,
body.design-beta #teamsLinkModal .modal-body,
body.design-beta #teamsSyncMembersModal .modal-body,
body.design-beta #teamsCreateModal .modal-body,
body.design-beta #metadataModal .modal-body,
body.design-beta #outlookLinkProjectModal .modal-body,
body.design-beta #projectPartnerDetailsModal .modal-body,
body.design-beta #timesheetExportModal .modal-body,
body.design-beta #dayEntriesModal .modal-body,
body.design-beta #reportsTimesheetExportModal .modal-body,
body.design-beta #reportsReimbursementsExportModal .modal-body,
body.design-beta #reportsDashboardExportModal .modal-body,
body.design-beta #invoiceDocModal .modal-body {
    background: transparent;
}

body.design-beta #contactModal .crm-contact-panel,
body.design-beta #contactActivityModal .crm-contact-activity-panel,
body.design-beta #createClientModal .crm-create-client-panel,
body.design-beta #manageProductsModal .crm-manage-products-panel,
body.design-beta #clientProductModal .crm-client-product-panel,
body.design-beta #outlookLinkClientModal .crm-outlook-link-panel,
body.design-beta #clientReportModal .crm-client-report-panel,
body.design-beta #projectCreateClientModal .project-create-client-panel,
body.design-beta #projectClientViewModal .modal-panel,
body.design-beta #projectEvaluationExportModal .reports-export-panel,
body.design-beta #phaseModal .project-phase-panel,
body.design-beta #phaseBulkModal .project-phase-bulk-panel,
body.design-beta #arCreateModal .project-ar-create-panel,
body.design-beta #arEditModal .project-ar-edit-panel,
body.design-beta #mtTypesModal .project-mt-types-panel,
body.design-beta #mtProtocolModal .project-mt-protocol-panel,
body.design-beta #mtProtocolItemsModal .project-mt-open-items-panel,
body.design-beta #mtProtocolCarryoverModal .modal-panel,
body.design-beta #mtProtocolLineageModal .modal-panel,
body.design-beta #uploadModal .project-upload-panel,
body.design-beta #teamsFilesModal .project-teams-files-panel,
body.design-beta #teamsLinkModal .project-teams-link-panel,
body.design-beta #teamsSyncMembersModal .project-teams-sync-panel,
body.design-beta #teamsCreateModal .project-teams-create-panel,
body.design-beta #metadataModal .project-metadata-panel,
body.design-beta #outlookLinkProjectModal .project-outlook-link-panel,
body.design-beta #projectPartnerDetailsModal .modal-panel,
body.design-beta #timesheetExportModal .timesheet-export-panel,
body.design-beta #dayEntriesModal .day-entries-panel,
body.design-beta #reportsTimesheetExportModal .reports-export-panel,
body.design-beta #reportsReimbursementsExportModal .reports-export-panel,
body.design-beta #reportsDashboardExportModal .reports-export-panel,
body.design-beta #invoiceDocModal .invoice-doc-panel {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.design-beta #invoiceDocModal .invoice-doc-grid > div {
    min-width: 0;
}

body.design-beta .newsletter-modal .modal-body,
body.design-beta .settings-template-modal .modal-body,
body.design-beta .settings-template-panel {
    gap: 8px;
}

body.design-beta .newsletter-modal .modal-body .card,
body.design-beta .settings-template-modal .modal-body .card {
    border-radius: 12px;
}

body.design-beta .page[data-page-id="reimbursements"] #reimbursement-modal #mileageCard,
body.design-beta .page[data-page-id="reimbursements"] #reimbursement-modal #reimbAiSuggestions {
    border-color: var(--beta-border);
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="reimbursements"] #reimbursement-modal #mileageMap {
    height: 240px !important;
    border-color: var(--beta-border) !important;
    border-radius: 12px !important;
}

body.design-beta .page[data-page-id="reimbursements"] #reimbursement-modal #mileageAutocomplete {
    border-color: var(--beta-border);
    border-radius: 12px;
    box-shadow: none;
}

body.design-beta .page[data-page-id="reimbursements"] #reimbursement-modal #mileageWaypoints,
body.design-beta .page[data-page-id="reimbursements"] #reimbursement-receipts-modal .receipt-edit-grid {
    gap: 10px;
}

body.design-beta .offer-doc-modal .offer-doc-grid {
    gap: 10px !important;
}

body.design-beta .offer-doc-modal .offer-doc-grid > div,
body.design-beta .offer-doc-modal .offer-doc-panel {
    gap: 10px !important;
}

body.design-beta #assistantPanelV3 {
    --assistant-surface: var(--beta-surface);
    --assistant-ink: var(--beta-text);
    --assistant-muted: var(--beta-text-muted);
    --assistant-stroke: rgba(229, 231, 235, 0.96);
    --assistant-accent: var(--beta-cyan);
    --assistant-accent-strong: var(--beta-navy);
    --assistant-accent-soft: rgba(0, 178, 204, 0.1);
    --assistant-teal: var(--beta-cyan);
    --assistant-orange: var(--beta-orange);
    --assistant-panel-shadow: var(--beta-shadow-3);
    top: var(--assistant-shell-top, 72px);
    right: 12px;
    bottom: 12px;
    width: min(var(--assistant-shell-width), calc(100vw - 28px));
    height: auto;
    max-height: calc(100vh - var(--assistant-shell-top, 72px) - 24px);
    border-radius: 20px;
    border: 1px solid rgba(229, 231, 235, 0.96);
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-3);
}

body.design-beta #assistantFabV3 {
    position: fixed;
    top: auto;
    right: 12px;
    bottom: 12px;
    width: 54px;
    height: 54px;
    padding: 0;
    border-radius: 16px;
    border: 1px solid rgba(229, 231, 235, 0.96);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 14px 24px rgba(15, 23, 42, 0.1);
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0;
    backdrop-filter: blur(16px);
}

body.design-beta #assistantFabV3:hover,
body.design-beta #assistantFabV3:focus-visible {
    transform: none;
    box-shadow: 0 18px 30px rgba(15, 23, 42, 0.12);
    background: rgba(255, 255, 255, 0.98);
}

body.design-beta #assistantFabV3 .assistant-v3-mark-fab {
    width: 30px;
    height: 30px;
}

body.design-beta #assistantFabV3 .assistant-v3-mark-fab,
body.design-beta #assistantPanelV3 .assistant-v3-mark-panel {
    border-color: rgba(17, 24, 39, 0.08);
    background:
        center / 66% 66% no-repeat url('/icons/kionov-logo-square.svg'),
        var(--beta-surface-subtle);
}

body.design-beta #assistantFabV3 .assistant-v3-launcher-label {
    display: none;
}

body.design-beta #assistantFabV3[data-badge]:not([data-badge=""])::after {
    top: -5px;
    right: -5px;
    left: auto;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border: 2px solid var(--beta-surface);
    background: var(--beta-navy);
    font-size: 9px;
    line-height: 12px;
}

body.design-beta #assistantPanelV3 .assistant-v3-header {
    padding: 10px 12px 8px;
    gap: 8px;
    background: var(--beta-surface);
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta #assistantPanelV3 .assistant-v3-brand {
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
}

body.design-beta #assistantPanelV3 .assistant-v3-mark-panel {
    width: 28px;
    height: 28px;
}

body.design-beta #assistantPanelV3 .assistant-title {
    font-size: var(--beta-font-md);
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-v3-subtitle,
body.design-beta #assistantPanelV3 .assistant-v3-empty-art,
body.design-beta #assistantPanelV3 .assistant-v3-memory-kicker {
    display: none;
}

body.design-beta #assistantPanelV3 .assistant-header-actions {
    order: 3;
    flex: 0 0 100%;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: flex-start;
}

body.design-beta #assistantPanelV3 .assistant-v3-runlog-btn,
body.design-beta #assistantPanelV3 .assistant-v3-approval-btn,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn,
body.design-beta #assistantPanelV3 .assistant-v3-skill-btn,
body.design-beta #assistantPanelV3 .assistant-v3-memory-btn,
body.design-beta #assistantPanelV3 .assistant-v3-connector-btn {
    min-height: 28px;
    padding: 0 8px;
    border-radius: 8px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-size: var(--beta-font-meta);
    font-weight: 600;
    letter-spacing: 0;
    box-shadow: none;
    backdrop-filter: none;
    transform: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-runlog-btn::before,
body.design-beta #assistantPanelV3 .assistant-v3-approval-btn::before,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn::before,
body.design-beta #assistantPanelV3 .assistant-v3-skill-btn::before,
body.design-beta #assistantPanelV3 .assistant-v3-memory-btn::before,
body.design-beta #assistantPanelV3 .assistant-v3-connector-btn::before {
    display: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-runlog-btn:hover,
body.design-beta #assistantPanelV3 .assistant-v3-approval-btn:hover,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn:hover,
body.design-beta #assistantPanelV3 .assistant-v3-skill-btn:hover,
body.design-beta #assistantPanelV3 .assistant-v3-memory-btn:hover,
body.design-beta #assistantPanelV3 .assistant-v3-connector-btn:hover,
body.design-beta #assistantPanelV3 .assistant-v3-runlog-btn:focus-visible,
body.design-beta #assistantPanelV3 .assistant-v3-approval-btn:focus-visible,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn:focus-visible,
body.design-beta #assistantPanelV3 .assistant-v3-skill-btn:focus-visible,
body.design-beta #assistantPanelV3 .assistant-v3-memory-btn:focus-visible,
body.design-beta #assistantPanelV3 .assistant-v3-connector-btn:focus-visible {
    background: #eef2f6;
    border-color: var(--beta-border-strong);
    color: var(--beta-text);
    box-shadow: none;
    transform: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-runlog-btn.active {
    background: rgba(17, 32, 51, 0.08);
    border-color: rgba(17, 32, 51, 0.16);
    color: var(--beta-navy);
    box-shadow: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-approval-btn[data-badge]:not([data-badge=""])::after,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn[data-badge]:not([data-badge=""])::after,
body.design-beta #assistantPanelV3 .assistant-v3-skill-btn[data-badge]:not([data-badge=""])::after,
body.design-beta #assistantPanelV3 .assistant-v3-memory-btn[data-badge]:not([data-badge=""])::after,
body.design-beta #assistantPanelV3 .assistant-v3-connector-btn[data-badge]:not([data-badge=""])::after {
    top: -4px;
    right: -4px;
    height: 14px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--beta-navy);
    box-shadow: none;
    font-size: 9px;
    line-height: 14px;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn[data-badge-tone="new"][data-badge]:not([data-badge=""])::after {
    background: #0f766e;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn[data-badge-tone="urgent"][data-badge]:not([data-badge=""])::after {
    background: var(--beta-danger);
}

body.design-beta #assistantPanelV3 .assistant-v3-close {
    margin-left: auto;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    box-shadow: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-close:hover,
body.design-beta #assistantPanelV3 .assistant-v3-close:focus-visible {
    background: #eef2f6;
    border-color: var(--beta-border-strong);
    color: var(--beta-text);
    box-shadow: none;
    transform: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-close-text {
    display: none;
}

body.design-beta #assistantPanelV3 .assistant-body {
    padding: 10px 12px 6px;
    background: var(--beta-surface);
}

body.design-beta #assistantPanelV3 .assistant-content-row {
    gap: 10px;
}

body.design-beta #assistantPanelV3 .assistant-messages {
    gap: 8px;
    padding: 0 2px 6px;
}

body.design-beta #assistantPanelV3 .assistant-msg,
body.design-beta #assistantPanelV3 .assistant-v3-confirm {
    max-width: 92%;
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid var(--beta-border);
    box-shadow: none;
    font-size: var(--beta-font-sm);
    line-height: 1.5;
}

body.design-beta #assistantPanelV3 .assistant-msg.user {
    background: rgba(0, 178, 204, 0.08);
    border-color: rgba(0, 178, 204, 0.16);
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-msg.bot,
body.design-beta #assistantPanelV3 .assistant-v3-confirm {
    background: var(--beta-surface-subtle);
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-msg.bot .assistant-v3-md-heading {
    margin: 4px 0 3px;
    color: var(--beta-navy);
}

body.design-beta #assistantPanelV3 .assistant-msg.bot .assistant-v3-md-list {
    margin: 4px 0 6px 16px;
}

body.design-beta #assistantPanelV3 .assistant-msg.bot code {
    background: rgba(17, 32, 51, 0.06);
    border-color: rgba(17, 32, 51, 0.08);
}

body.design-beta #assistantPanelV3 .assistant-v3-confirm-message,
body.design-beta #assistantPanelV3 .assistant-v3-empty-body,
body.design-beta #assistantPanelV3 .assistant-v3-skill-note,
body.design-beta #assistantPanelV3 .assistant-v3-skill-studio-note,
body.design-beta #assistantPanelV3 .assistant-v3-memory-card-note,
body.design-beta #assistantPanelV3 .assistant-v3-memory-summary-meta,
body.design-beta #assistantPanelV3 .assistant-v3-memory-summary-body {
    font-size: var(--beta-font-meta);
    color: var(--beta-text-muted);
}

body.design-beta #assistantPanelV3 .assistant-v3-next-actions {
    gap: 4px;
}

body.design-beta #assistantPanelV3 .assistant-v3-next-label,
body.design-beta #assistantPanelV3 .assistant-runlog-heading,
body.design-beta #assistantPanelV3 .assistant-v3-connector-title {
    font-size: 10px;
    letter-spacing: 0.04em;
    color: var(--beta-text-soft);
}

body.design-beta #assistantPanelV3 .assistant-v3-next-action,
body.design-beta #assistantPanelV3 .assistant-v3-suggestion,
body.design-beta #assistantPanelV3 .assistant-v3-confirm-btn {
    min-height: 28px;
    padding: 0 9px;
    border-radius: 8px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface);
    color: var(--beta-text);
    font-size: var(--beta-font-meta);
    box-shadow: none;
    transform: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-next-action:hover,
body.design-beta #assistantPanelV3 .assistant-v3-suggestion:hover,
body.design-beta #assistantPanelV3 .assistant-v3-confirm-btn:hover {
    border-color: var(--beta-border-strong);
    background: #f8fafc;
    box-shadow: none;
    transform: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-confirm-btn.confirm.danger {
    border-color: rgba(194, 65, 58, 0.24);
    background: rgba(194, 65, 58, 0.08);
    color: var(--beta-danger);
}

body.design-beta #assistantPanelV3 .assistant-v3-empty {
    gap: 6px;
    padding: 10px;
    border-radius: 14px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-empty-title {
    font-size: var(--beta-font-md);
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-v3-suggestions {
    gap: 4px;
}

body.design-beta #assistantPanelV3 .assistant-runcol {
    border-left: 1px solid transparent;
}

body.design-beta #assistantPanelV3.assistant-v3-runlog-open .assistant-runcol {
    flex-basis: 176px;
    width: 176px;
    max-width: 176px;
    padding-left: 10px;
    border-left-color: var(--beta-border);
}

body.design-beta #assistantPanelV3 .assistant-runlog-item,
body.design-beta #assistantPanelV3 .assistant-runlog-details {
    border-radius: 10px;
    border-color: var(--beta-border);
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta #assistantPanelV3 .assistant-runlog-item {
    padding: 6px;
    margin-bottom: 5px;
    font-size: var(--beta-font-meta);
}

body.design-beta #assistantPanelV3 .assistant-runlog-header {
    font-size: 10px;
}

body.design-beta #assistantPanelV3 .assistant-runlog-tag {
    padding: 1px 5px;
    font-size: 9px;
    backdrop-filter: none;
}

body.design-beta #assistantPanelV3 .assistant-footer {
    padding: 8px 12px 10px;
    border-top: 1px solid var(--beta-border);
    background: var(--beta-surface);
}

body.design-beta #assistantPanelV3 .assistant-v3-compose {
    gap: 8px;
    padding: 8px;
    border-radius: 14px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-modebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 6px 8px;
    align-items: center;
}

body.design-beta #assistantPanelV3 .assistant-v3-mode-summary {
    grid-column: 1 / 2;
    font-size: 10px;
    color: var(--beta-text-muted);
}

body.design-beta #assistantPanelV3 .assistant-v3-reasoning-wrap,
body.design-beta #assistantPanelV3 .assistant-v3-autonomy-wrap {
    gap: 3px;
    font-size: 10px;
    color: var(--beta-text-muted);
}

body.design-beta #assistantPanelV3 .assistant-v3-reasoning-select,
body.design-beta #assistantPanelV3 .assistant-v3-autonomy-select,
body.design-beta #assistantPanelV3 .assistant-v3-skill-input,
body.design-beta #assistantPanelV3 .assistant-v3-skill-select {
    min-height: 30px;
    padding: 0 8px;
    border-radius: 8px;
    border-color: var(--beta-border);
    background: var(--beta-surface);
    font-size: var(--beta-font-sm);
}

body.design-beta #assistantPanelV3 .assistant-v3-input {
    min-height: 44px;
    max-height: 120px;
    font-size: var(--beta-font-sm);
    line-height: 1.45;
}

body.design-beta #assistantPanelV3 .assistant-v3-actions {
    gap: 4px;
}

body.design-beta #assistantPanelV3 .assistant-v3-speak,
body.design-beta #assistantPanelV3 .assistant-v3-stop,
body.design-beta #assistantPanelV3 .assistant-v3-send,
body.design-beta #assistantPanelV3 .assistant-v3-refresh,
body.design-beta #assistantPanelV3 .assistant-v3-apply {
    min-height: 30px;
    padding: 0 10px;
    border-radius: 8px;
    font-size: var(--beta-font-meta);
    box-shadow: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-speak,
body.design-beta #assistantPanelV3 .assistant-v3-refresh {
    border-color: var(--beta-border);
    background: var(--beta-surface);
    color: var(--beta-text-muted);
}

body.design-beta #assistantPanelV3 .assistant-v3-speak:hover:not(:disabled),
body.design-beta #assistantPanelV3 .assistant-v3-refresh:hover,
body.design-beta #assistantPanelV3 .assistant-v3-apply:hover {
    border-color: var(--beta-border-strong);
    background: #f8fafc;
    color: var(--beta-text);
    box-shadow: none;
    transform: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-speak.active {
    border-color: rgba(0, 178, 204, 0.24);
    background: rgba(0, 178, 204, 0.1);
    color: var(--beta-navy);
}

body.design-beta #assistantPanelV3 .assistant-v3-stop {
    border-color: rgba(194, 65, 58, 0.22);
    background: rgba(194, 65, 58, 0.08);
    color: var(--beta-danger);
}

body.design-beta #assistantPanelV3 .assistant-v3-send,
body.design-beta #assistantPanelV3 .assistant-v3-apply,
body.design-beta #assistantPanelV3 .assistant-v3-skill-save {
    border-color: var(--beta-navy);
    background: var(--beta-navy);
    color: #fff;
}

body.design-beta #assistantPanelV3 .assistant-v3-send:hover,
body.design-beta #assistantPanelV3 .assistant-v3-skill-save:hover {
    background: var(--beta-navy-soft);
    border-color: var(--beta-navy-soft);
    color: #fff;
}

body.design-beta #assistantPanelV3 .assistant-v3-connector-tray {
    left: 12px;
    right: 12px;
    padding: 10px;
    gap: 8px;
    background: var(--beta-surface);
    backdrop-filter: none;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    box-shadow: var(--beta-shadow-2);
    max-height: min(320px, calc(100% - var(--assistant-tray-top, 88px) - 168px));
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-tray {
    max-height: min(420px, calc(100% - var(--assistant-tray-top, 88px) - 132px));
}

body.design-beta #assistantPanelV3 .assistant-v3-connector-header,
body.design-beta #assistantPanelV3 .assistant-v3-skill-card-head,
body.design-beta #assistantPanelV3 .assistant-v3-memory-card-head,
body.design-beta #assistantPanelV3 .assistant-v3-skill-check-header {
    gap: 8px;
}

body.design-beta #assistantPanelV3 .assistant-v3-connector-list,
body.design-beta #assistantPanelV3 .assistant-v3-skill-studio-list,
body.design-beta #assistantPanelV3 .assistant-v3-memory-list {
    gap: 6px;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-list {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding-right: 2px;
}

body.design-beta #assistantPanelV3 .assistant-v3-connector-item,
body.design-beta #assistantPanelV3 .assistant-v3-skill-card,
body.design-beta #assistantPanelV3 .assistant-v3-skill-form,
body.design-beta #assistantPanelV3 .assistant-v3-skill-chip,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-card,
body.design-beta #assistantPanelV3 .assistant-v3-memory-summary,
body.design-beta #assistantPanelV3 .assistant-v3-memory-card,
body.design-beta #assistantPanelV3 .assistant-v3-memory-item {
    padding: 8px 9px;
    border-radius: 12px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-card.is-new {
    border-color: rgba(15, 118, 110, 0.2);
    background: rgba(236, 253, 245, 0.7);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-card.urgent {
    border-color: rgba(194, 65, 58, 0.2);
    background: rgba(254, 242, 242, 0.92);
}

body.design-beta #assistantPanelV3 .assistant-v3-skill-card-title,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-kind,
body.design-beta #assistantPanelV3 .assistant-v3-memory-card-title,
body.design-beta #assistantPanelV3 .assistant-v3-memory-item-title {
    font-size: var(--beta-font-sm);
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-policy {
    gap: 8px;
    padding: 8px 9px;
    border-radius: 12px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-policy-title,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-why {
    font-size: var(--beta-font-meta);
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-policy-note,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-policy-summary,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-policy-notice {
    font-size: 10px;
    color: var(--beta-text-muted);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-policy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-checkbox-row {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-policy-actions {
    display: flex;
    justify-content: flex-end;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-band {
    font-size: 9px;
    padding: 2px 6px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.14);
    color: var(--beta-text-muted);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-band.band-critical {
    background: rgba(194, 65, 58, 0.12);
    color: var(--beta-danger);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-band.band-high {
    background: rgba(180, 83, 9, 0.12);
    color: #b45309;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-band.band-medium {
    background: rgba(15, 118, 110, 0.12);
    color: #0f766e;
}

body.design-beta #assistantPanelV3 .assistant-v3-skill-card-subtitle,
body.design-beta #assistantPanelV3 .assistant-v3-skill-card-meta,
body.design-beta #assistantPanelV3 .assistant-v3-memory-item-body,
body.design-beta #assistantPanelV3 .assistant-v3-memory-chip,
body.design-beta #assistantPanelV3 .assistant-v3-skill-helper,
body.design-beta #assistantPanelV3 .assistant-v3-skill-chip-note {
    font-size: 10px;
}

body.design-beta #assistantPanelV3 .assistant-v3-skill-form-grid,
body.design-beta #assistantPanelV3 .assistant-v3-memory-grid,
body.design-beta #assistantPanelV3 .assistant-v3-memory-form-grid {
    gap: 8px;
}

body.design-beta #assistantPanelV3 .assistant-v3-skill-textarea {
    min-height: 60px;
    padding: 8px;
}

body.design-beta #assistantPanelV3 .assistant-v3-skill-textarea-lg {
    min-height: 108px;
}

body.design-beta #assistantPanelV3 .assistant-v3-skill-checklist {
    gap: 6px;
    max-height: 132px;
}

body.design-beta #assistantPanelV3 .assistant-v3-memory-actions,
body.design-beta #assistantPanelV3 .assistant-v3-skill-form-actions,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-actions,
body.design-beta #assistantPanelV3 .assistant-v3-connector-footer {
    gap: 6px;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-open,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-run {
    min-height: 30px;
    padding: 5px 10px;
    border-radius: 9px;
    font-size: 11px;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-open {
    border: 1px solid var(--beta-border-strong, rgba(148, 163, 184, 0.28));
    background: #ffffff;
    color: var(--beta-text);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-open:hover {
    background: var(--beta-surface);
    border-color: rgba(71, 85, 105, 0.22);
}

body.design-beta #assistantPanelV3 .assistant-v3-approval-action.approve-always {
    background: rgba(15, 23, 42, 0.04);
    color: var(--beta-text);
    border-color: rgba(148, 163, 184, 0.26);
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-inline-actions,
body.design-beta #assistantPanelV3 .assistant-v3-proactive-inline-list {
    display: grid;
    gap: 6px;
}

body.design-beta #assistantPanelV3 .assistant-v3-proactive-inline-open {
    justify-self: flex-start;
}

body.design-beta #assistantPanelV3 .assistant-v3-memory-tray {
    max-height: min(360px, calc(100% - var(--assistant-tray-top, 88px) - 132px));
}

@media (min-width: 1180px) {
    body.design-beta #headerCopilotBtn {
        display: none !important;
    }
}

@media (max-width: 1179px) {
    body.design-beta.assistant-v3-shell-open .main-content {
        margin-right: 0;
    }

    body.design-beta #assistantFabV3 {
        display: none !important;
    }

    body.design-beta #bugReportFab {
        bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
    }
}

@media (max-width: 760px) {
    body.design-beta #headerCopilotBtn {
        display: none !important;
    }

    body.design-beta #assistantFabV3 {
        display: inline-flex !important;
        right: 12px;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
        width: 52px;
        height: 52px;
        border-radius: 16px;
        border-color: rgba(15, 23, 42, 0.08);
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 16px 32px rgba(15, 23, 42, 0.2);
    }

    body.design-beta #assistantFabV3 .assistant-v3-mark-fab {
        width: 32px;
        height: 32px;
    }

    body.design-beta #bugReportFab {
        right: 12px;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 76px);
        width: 52px;
        height: 52px;
        border-radius: 16px;
    }

    body.design-beta #assistantPanelV3 {
        top: calc(env(safe-area-inset-top, 0px) + 74px);
        right: 8px;
        left: 8px;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 8px);
        width: auto;
        height: auto;
        max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 82px);
        border-radius: 20px;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-header {
        padding: 10px 12px 8px;
        gap: 8px;
        align-items: flex-start;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-brand {
        gap: 10px;
        flex: 1 1 auto;
        min-width: 0;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-titleblock {
        gap: 1px;
    }

    body.design-beta #assistantPanelV3 .assistant-title {
        font-size: 14px;
        letter-spacing: -0.01em;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-subtitle {
        font-size: 10px;
        line-height: 1.25;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-close {
        min-width: 32px;
        width: 32px;
        height: 32px;
        padding: 0;
        border-radius: 10px;
        justify-content: center;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-close-text {
        display: none;
    }

    body.design-beta #assistantPanelV3 .assistant-header-actions {
        flex: 1 1 100%;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
        padding-bottom: 2px;
        margin: 0 -2px;
    }

    body.design-beta #assistantPanelV3 .assistant-header-actions::-webkit-scrollbar {
        display: none;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-runlog-btn,
    body.design-beta #assistantPanelV3 .assistant-v3-approval-btn,
    body.design-beta #assistantPanelV3 .assistant-v3-proactive-btn,
    body.design-beta #assistantPanelV3 .assistant-v3-skill-btn,
    body.design-beta #assistantPanelV3 .assistant-v3-memory-btn,
    body.design-beta #assistantPanelV3 .assistant-v3-connector-btn {
        flex: 0 0 auto;
        padding: 0 10px;
        min-height: 28px;
        font-size: 10px;
        letter-spacing: 0.01em;
    }

    body.design-beta #assistantPanelV3 .assistant-body {
        padding: 10px 10px 6px;
    }

    body.design-beta #assistantPanelV3 .assistant-content-row {
        gap: 8px;
    }

    body.design-beta #assistantPanelV3.assistant-v3-runlog-open .assistant-content-row {
        flex-direction: column;
    }

    body.design-beta #assistantPanelV3.assistant-v3-runlog-open .assistant-runcol {
        order: -1;
        flex-basis: auto;
        width: 100%;
        max-width: none;
        max-height: 124px;
        padding-left: 0;
        padding-bottom: 2px;
        border-left: none;
        border-bottom: 1px solid var(--beta-border);
    }

    body.design-beta #assistantPanelV3 .assistant-runlog {
        padding-right: 0;
    }

    body.design-beta #assistantPanelV3 .assistant-msg,
    body.design-beta #assistantPanelV3 .assistant-v3-confirm,
    body.design-beta #assistantPanelV3 .assistant-v3-next-actions {
        max-width: 92%;
    }

    body.design-beta #assistantPanelV3 .assistant-msg {
        padding: 9px 10px;
        font-size: 12px;
        line-height: 1.45;
        border-radius: 12px;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-next-buttons,
    body.design-beta #assistantPanelV3 .assistant-v3-confirm-buttons {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-next-action,
    body.design-beta #assistantPanelV3 .assistant-v3-confirm-btn {
        width: 100%;
        justify-content: center;
    }

    body.design-beta #assistantPanelV3 .assistant-footer {
        padding: 8px 10px calc(env(safe-area-inset-bottom, 0px) + 10px);
    }

    body.design-beta #assistantPanelV3 .assistant-v3-compose {
        gap: 7px;
        padding: 8px;
        border-radius: 14px;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-modebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-mode-summary {
        grid-column: 1 / -1;
        white-space: normal;
        line-height: 1.3;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-input {
        min-height: 50px;
        max-height: 112px;
        font-size: 13px;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-stop {
        grid-column: 1 / -1;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-speak,
    body.design-beta #assistantPanelV3 .assistant-v3-send,
    body.design-beta #assistantPanelV3 .assistant-v3-stop {
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-connector-tray {
        left: 8px;
        right: 8px;
        top: var(--assistant-tray-top, 84px);
        bottom: calc(env(safe-area-inset-bottom, 0px) + 96px);
        max-height: none;
        padding: 8px;
        border-radius: 14px;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-connector-header {
        gap: 8px;
        align-items: center;
    }

    body.design-beta #assistantPanelV3 .assistant-v3-connector-title {
        font-size: 10px;
    }
}
}
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-workspace--beta,
body.design-beta .page[data-page-id="operations-hub"],
body.design-beta .page[data-page-id="calendar"],
body.design-beta .page[data-page-id="team"],
body.design-beta .page[data-page-id="departments"] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card,
body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card,
body.design-beta .page[data-page-id="team"] .team-beta-toolbar,
body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar {
    position: sticky;
    top: 10px;
    z-index: 5;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .form-input,
body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .form-select,
body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .form-input,
body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .form-select,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .form-input,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .form-select,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-inline-toolbar .form-input,
body.design-beta .page[data-page-id="team"] .team-beta-toolbar .form-input,
body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar .form-input,
body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar .form-select {
    min-height: var(--beta-control-height-compact);
    padding-inline: 9px;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .btn,
body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .btn,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .btn,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-inline-toolbar .btn,
body.design-beta .page[data-page-id="team"] .team-beta-toolbar .btn,
body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar .btn {
    min-height: 32px;
    border-radius: 8px;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-section-card--metrics-beta .card-body,
body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .card-body {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-beta-toolbar-top,
body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-actions--primary {
    margin-left: auto;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-filters-grid--beta {
    display: grid;
    grid-template-columns: minmax(124px, 0.9fr) minmax(156px, 1fr) minmax(260px, 1.6fr);
    gap: 8px;
    align-items: end;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-filters-grid--beta .reimbursements-filter-span-2 {
    grid-column: auto;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-section-card--metrics-beta .card-header {
    display: none;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-section-card--metrics-beta .reimbursements-metrics-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-results-card--beta .card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="reimbursements"] .reimbursements-results-card--beta .card-body {
    padding: 6px 0 0;
}

body.design-beta .page[data-page-id="calendar"] .calendar-beta-period {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 4px;
    font-size: 13px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .card-body,
body.design-beta .page[data-page-id="calendar"] .calendar-surface-card .card-body {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-row,
body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-cluster,
body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-filters,
body.design-beta .page[data-page-id="calendar"] .calendar-nav-group {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-filters {
    width: 100%;
}

body.design-beta .page[data-page-id="calendar"] .calendar-toggle-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: var(--beta-control-height-compact);
    padding: 0 9px;
    border: 1px solid var(--beta-border);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.78);
    color: #475467;
    font-size: 12px;
}

body.design-beta .page[data-page-id="calendar"] .calendar-surface-card {
    overflow: hidden;
}

body.design-beta .page[data-page-id="calendar"] #calendarLocaleBanner,
body.design-beta .page[data-page-id="calendar"] #calendarTodayDetails {
    margin-bottom: 8px !important;
}

body.design-beta .page[data-page-id="team"] .team-insights-grid--beta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="team"] .team-insight-card {
    min-height: 86px;
}

body.design-beta .page[data-page-id="team"] .team-insight-label {
    color: #475467;
    font-size: 12px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="team"] .team-insight-body {
    font-size: 13px;
}

body.design-beta .page[data-page-id="team"] .team-results-body--beta {
    padding: 0 12px 12px;
}

body.design-beta .page[data-page-id="team"] .team-beta-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .page[data-page-id="team"] .team-beta-toolbar-main,
body.design-beta .page[data-page-id="team"] .team-beta-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="team"] .team-beta-toolbar-main {
    flex: 1 1 520px;
}

body.design-beta .page[data-page-id="team"] .team-beta-toolbar-main #teamSearch {
    min-width: 220px;
    flex: 1 1 260px;
}

body.design-beta .page[data-page-id="team"] .team-beta-toolbar-actions {
    margin-left: auto;
}

body.design-beta .page[data-page-id="team"] .team-selected-count-beta,
body.design-beta .page[data-page-id="team"] .team-beta-toolbar-count {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="departments"] .departments-results-body--beta {
    padding: 0 12px 12px;
}

body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar-copy {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .card-body,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1.7fr) minmax(132px, 0.9fr) minmax(132px, 0.9fr) minmax(148px, 1fr) auto;
    gap: 8px;
    align-items: end;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-apply {
    display: flex;
    align-items: flex-end;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-footer,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-range-list,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-inline-toolbar,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-chip-row,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-view-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-footer {
    justify-content: flex-start;
    padding-top: 8px;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-selected-user {
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-card {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-label {
    color: #475467;
    font-size: var(--beta-font-meta);
    font-weight: 600;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-value {
    font-size: var(--beta-font-kpi);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.03em;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-workspace-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.38fr) minmax(340px, 0.92fr);
    gap: 10px;
    align-items: start;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-main-column,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-side-column {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-secondary-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: start;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-inline-toolbar input {
    min-width: 220px;
    flex: 1 1 260px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-inline-toolbar--secondary input {
    min-width: 0;
    flex: 1 1 auto;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card {
    overflow: hidden;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--actions {
    position: static;
    top: auto;
    z-index: auto;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card .card-header {
    padding: 10px 12px 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card .card-title {
    font-size: 14px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-chip-row {
    gap: 6px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-period-summary {
    margin-top: 2px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions .btn {
    width: 100%;
    justify-content: center;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-selected-user {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-height: 24px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-selected-user .badge {
    min-height: 22px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions-hint {
    color: var(--beta-text-muted);
    font-size: 11px;
    line-height: 1.35;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame {
    min-height: 0;
    overflow: auto;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--approvals,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems {
    max-height: min(52vh, 540px);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--time {
    max-height: min(62vh, 700px);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--secondary {
    max-height: min(30vh, 320px);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--tasks .operations-hub-table-frame--workitems {
    max-height: min(42vh, 470px);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .table-container {
    border: 0;
    border-radius: 0;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .table {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .table td,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .table th {
    padding: 7px 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .tabulator {
    border: 0;
    background: transparent;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .tabulator .tabulator-header {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .tabulator-row {
    min-height: 40px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .tabulator-row .tabulator-cell,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame .tabulator-col {
    padding-top: 7px;
    padding-bottom: 7px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--secondary .card-body {
    padding-top: 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--secondary .operations-hub-inline-toolbar {
    gap: 6px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--secondary .operations-hub-inline-toolbar .btn {
    min-width: 0;
    padding-inline: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--secondary .card-title {
    font-size: 13px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-list {
    display: none;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-item {
    display: grid;
    gap: 6px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(229, 231, 235, 0.9);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-item-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-item-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--beta-text);
    line-height: 1.35;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-item-meta {
    font-size: 12px;
    color: var(--beta-text);
    line-height: 1.35;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-item-meta--muted,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-empty {
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-mobile-item-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-projects-shell {
    display: grid;
    gap: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-inline-toolbar--projects {
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-focus-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-focus-card {
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: #f8fafc;
    padding: 10px 12px;
    text-align: left;
    display: grid;
    gap: 4px;
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-focus-card strong {
    font-size: 18px;
    line-height: 1;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-focus-card span {
    font-size: 13px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-focus-card small {
    font-size: 11px;
    line-height: 1.4;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-focus-card.is-active {
    border-color: var(--beta-primary, #2e6cf6);
    background: rgba(46, 108, 246, 0.08);
    box-shadow: inset 0 0 0 1px rgba(46, 108, 246, 0.12);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-list {
    display: grid;
    gap: 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-queue-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-queue-card {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: #fff;
    padding: 12px;
    display: grid;
    gap: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-queue-head,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-results-head,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-browser-head,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-queue-title,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-results-title,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-browser-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-queue-copy,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-results-copy,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-browser-copy {
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.45;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-summary {
    margin-top: 10px;
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-block {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: #fff;
    padding: 12px;
    display: grid;
    gap: 10px;
    min-width: 0;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-block--entries {
    grid-column: 1 / -1;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-table-frame {
    min-width: 0;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-table-frame .tabulator {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-fallback-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-fallback-table th,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-fallback-table td {
    padding: 8px 10px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    text-align: left;
    vertical-align: top;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-fallback-table th {
    font-size: 11px;
    font-weight: 600;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-fallback-table td.is-numeric {
    text-align: right;
    white-space: nowrap;
}

body.design-beta .page[data-page-id="operations-hub"] #operationsHubProjectInsightsEntriesTable .tabulator-cell[tabulator-field="id"] {
    white-space: nowrap;
}

body.design-beta .page[data-page-id="operations-hub"] #operationsHubProjectInsightsEntriesTable .tabulator-cell[tabulator-field="id"] .btn + .btn {
    margin-left: 6px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insight-list,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-list {
    display: grid;
    gap: 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insight-row,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-row {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #f8fafc;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insight-row {
    display: grid;
    gap: 3px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insight-row span,
body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insight-row small {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insight-row strong {
    color: var(--beta-text);
    font-size: 14px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: center;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-main {
    min-width: 0;
    display: grid;
    gap: 4px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--beta-text);
    line-height: 1.35;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-hours {
    font-size: 13px;
    font-weight: 600;
    color: var(--beta-text);
    white-space: nowrap;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-list--queue .operations-hub-project-row {
    padding: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    padding: 12px;
    background: #fff;
    display: grid;
    gap: 10px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row.is-selected {
    border-color: var(--beta-primary, #2e6cf6);
    box-shadow: 0 0 0 1px rgba(46, 108, 246, 0.12);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: flex-start;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--beta-text);
    line-height: 1.35;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    margin-top: 4px;
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row-copy {
    font-size: 12px;
    line-height: 1.45;
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-stat {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #f8fafc;
    padding: 8px 10px;
    display: grid;
    gap: 3px;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-stat span {
    font-size: 11px;
    font-weight: 600;
    color: var(--beta-text-muted);
    letter-spacing: 0.02em;
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-stat strong {
    font-size: 14px;
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-container--beta {
    max-width: none;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 12px;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-card .card-header,
body.design-beta .page[data-page-id="settings-profile"] .settings-profile-card .card-body {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-card .card-title {
    font-size: 15px;
}

body.design-beta .page[data-page-id="settings-profile"] #profileManagerCard {
    grid-column: span 4;
}

body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard {
    grid-column: span 8;
}

body.design-beta .page[data-page-id="settings-profile"] #profilePersonalInfoCard,
body.design-beta .page[data-page-id="settings-profile"] #profilePasswordCard,
body.design-beta .page[data-page-id="settings-profile"] #teamsPersonalCard {
    grid-column: span 7;
}

body.design-beta .page[data-page-id="settings-profile"] #aiAvatarCard,
body.design-beta .page[data-page-id="settings-profile"] #profilePreferencesCard,
body.design-beta .page[data-page-id="settings-profile"] #excelTenantSyncCard {
    grid-column: span 5;
}

body.design-beta .page[data-page-id="settings-profile"] #apiKeysCard {
    grid-column: span 8;
}

body.design-beta .page[data-page-id="settings-profile"] #officeAddinCard {
    grid-column: span 4;
}

body.design-beta .page[data-page-id="settings-profile"] #profileManagerCard .card-body {
    display: flex;
    align-items: center;
    min-height: 100%;
}

body.design-beta .page[data-page-id="settings-profile"] #profileManagerBox {
    color: var(--beta-text);
    font-size: var(--beta-font-md);
    line-height: 1.5;
}

body.design-beta .page[data-page-id="settings-profile"] #profileManagerBox strong {
    display: block;
    margin-bottom: 4px;
    color: var(--beta-text-muted);
    font-size: var(--beta-font-meta);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.design-beta .page[data-page-id="settings-profile"] .form-group {
    margin-bottom: 12px;
}

body.design-beta .page[data-page-id="settings-profile"] .form-footer {
    margin-top: 14px;
    padding-top: 12px;
}

body.design-beta .page[data-page-id="settings-profile"] .form-control,
body.design-beta .page[data-page-id="settings-profile"] .form-input,
body.design-beta .page[data-page-id="settings-profile"] .form-select {
    min-height: 34px;
}

body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard .stats-container.compact {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard .stats-card {
    min-height: 0;
    padding: 12px 14px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: #f8fafc;
    box-shadow: none;
}

body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard .stat-icon {
    display: none;
}

body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard .stat-number {
    font-size: var(--beta-font-xl);
    line-height: 1.1;
}

body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard .stat-label {
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="settings-profile"] #profileWeekdayPlan {
    gap: 8px !important;
}

body.design-beta .page[data-page-id="settings-profile"] #profileWeekdayPlan > div {
    border-color: var(--beta-border) !important;
    border-radius: 12px !important;
    background: #f8fafc;
    padding: 10px 8px !important;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-api-creator {
    display: grid;
    grid-template-columns: minmax(180px, 1.15fr) minmax(152px, 0.9fr) minmax(220px, 1.7fr) auto;
    gap: 8px;
    align-items: end;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-inline-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    align-items: end;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-inline-actions.settings-profile-inline-actions--excel {
    grid-template-columns: minmax(220px, 1.4fr) auto;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-inline-actions .form-group {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-api-creator .btn,
body.design-beta .page[data-page-id="settings-profile"] .settings-profile-inline-actions .btn {
    width: 100%;
    justify-content: center;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-inline-actions .form-hint {
    grid-column: 1 / -1;
    margin-top: 0;
}

body.design-beta .page[data-page-id="settings-profile"] .settings-profile-teams-recipient {
    max-width: none !important;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-beta-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.95fr);
    gap: 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-section-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-main-stack,
body.design-beta .page[data-page-id="admin-access"] .admin-access-side-stack {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 10px;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card .card-body {
    padding: 12px 0 0;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card .admin-access-section-head {
    padding-left: 14px;
    padding-right: 14px;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card .table-container {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    border-radius: 0;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-section-title {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-section-note {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.5;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-user-role-layout {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-role-checkboxes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-user-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-assignments-table {
    margin-top: 12px;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-delegation-row {
    margin-bottom: 8px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="admin-access"] .admin-access-delegation-row__body {
    padding: 12px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-toolbar-card .card-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-toolbar-main {
    flex: 1 1 320px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-toolbar-main .form-input {
    max-width: 420px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-beta-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
    gap: 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-table-card,
body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-table-card .card-body {
    padding: 0;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-table-card .table-container {
    border: 0;
    border-radius: 16px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-card {
    position: sticky;
    top: calc(var(--beta-header-height) + 18px);
    min-height: 280px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-card .card-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-head {
    padding-bottom: 10px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-title {
    margin: 0;
    font-size: 16px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-empty {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 6px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-empty-title {
    color: var(--beta-text);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-empty-copy {
    color: var(--beta-text-muted);
    font-size: 13px;
}

body.design-beta .page[data-page-id="admin-companies"] .admin-companies-row-actions {
    display: flex;
    justify-content: flex-end;
}

body.design-beta .page[data-page-id="admin-companies"] .table tbody tr.is-selected {
    background: rgba(17, 32, 51, 0.05);
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-overview-card,
body.design-beta .page[data-page-id="admin-billing"] .admin-billing-modules-card,
body.design-beta .page[data-page-id="admin-billing"] .admin-billing-invoices-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-overview-card .card-body,
body.design-beta .page[data-page-id="admin-billing"] .admin-billing-modules-card .card-body,
body.design-beta .page[data-page-id="admin-billing"] .admin-billing-invoices-card .card-body {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-metric {
    padding: 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-metric-label {
    color: #475467;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-metric-value {
    margin-top: 6px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.03em;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-metric-note {
    margin-top: 4px;
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-beta-grid {
    display: grid;
    grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
    gap: 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-section-head {
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-section-title {
    margin: 0;
    font-size: 16px;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-warning {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 12px;
    border: 1px solid rgba(201, 110, 27, 0.24);
    border-radius: 12px;
    background: rgba(201, 110, 27, 0.08);
    color: #8a4d12;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-modules-list {
    display: grid;
    gap: 8px;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-module-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-module-name {
    font-size: 14px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-module-note {
    margin-top: 4px;
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-module-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-module-status--active {
    background: rgba(15, 139, 95, 0.12);
    color: var(--beta-success);
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-module-status--trial {
    background: rgba(201, 110, 27, 0.12);
    color: #9a5a1c;
}

body.design-beta .page[data-page-id="admin-billing"] .admin-billing-module-status--inactive {
    background: rgba(107, 114, 128, 0.12);
    color: #475467;
}

body.design-beta .page[data-page-id="settings-templates"] .page-header {
    align-items: center;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-guide-link {
    min-height: var(--beta-control-height-compact);
    padding: 0 12px;
    font-size: 12px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-tab-shell--beta {
    position: sticky;
    top: calc(var(--beta-header-height) + 12px);
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 6px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-tab-shell--beta .btn {
    min-height: var(--beta-control-height-compact);
    padding: 0 12px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-tab-content--beta {
    display: grid;
    gap: 12px;
    margin-top: 12px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-card--beta {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-card--beta .card-header {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-card--beta .card-body {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-card-header--beta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-inline-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-inline-tools .form-select,
body.design-beta .page[data-page-id="settings-templates"] .settings-templates-inline-tools .btn,
body.design-beta .page[data-page-id="settings-templates"] .form-input,
body.design-beta .page[data-page-id="settings-templates"] .form-select,
body.design-beta .page[data-page-id="settings-templates"] .btn:not(.modal-close) {
    min-height: var(--beta-control-height-compact);
}

body.design-beta .page[data-page-id="settings-templates"] .form-input,
body.design-beta .page[data-page-id="settings-templates"] .form-select {
    padding-top: 6px;
    padding-bottom: 6px;
}

body.design-beta .page[data-page-id="settings-templates"] .form-textarea {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-register-card--beta .table-container {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    border-radius: 0;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-branding-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
    gap: 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-preview-card {
    margin-top: 0 !important;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-partials-card {
    grid-column: 1 / -1;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-report-layout--beta {
    display: grid;
    grid-template-columns: minmax(320px, 0.85fr) minmax(0, 1.15fr);
    gap: 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-report-upload-card {
    position: sticky;
    top: calc(var(--beta-header-height) + 72px);
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-report-stack {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="settings-templates"] .settings-templates-report-stack > .settings-templates-register-card {
    margin-top: 0 !important;
}

body.design-beta .page[data-page-id="settings-templates"] #documentsTab > .card + .card {
    border-style: dashed;
    background: #fbfcfd;
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-results-card--beta {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-results-card--beta .card-body {
    padding: 12px 14px 0;
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-toolbar--beta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    padding-bottom: 10px;
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-toolbar-main {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 1 1 320px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-toolbar-main #hrSearch,
body.design-beta .page[data-page-id="hr-management"] .hr-management-toolbar-filters .btn,
body.design-beta .page[data-page-id="hr-management"] .table .btn {
    min-height: var(--beta-control-height-compact);
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-toolbar-main #hrSearch {
    width: min(320px, 100%);
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-toolbar-count {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-table-container {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    border-radius: 0;
    margin: 0 -14px;
}

body.design-beta .page[data-page-id="hr-management"] .hr-management-table-container .table td {
    vertical-align: middle;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-card--beta,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-plans-card,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-features-card,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-card {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-card--beta .card-body,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-plans-card .card-body,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-features-card .card-body,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-card .card-body {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-items: end;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-grid > :first-child {
    grid-column: span 2;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-grid > :last-child {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-company-plan-info {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-preview-card {
    padding: 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-preview-head {
    margin-bottom: 8px;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-beta-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(360px, 0.9fr);
    gap: 12px;
    align-items: start;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-side-stack {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-plan-card {
    border-color: var(--beta-border) !important;
    border-radius: 14px !important;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-plan-form {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    align-items: end;
    width: min(100%, 720px);
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-plan-form .form-input,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-grid .form-input,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-grid .form-input,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-feature-form .form-input,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-plan-form .btn,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-grid .btn,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-grid .btn,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-filters .form-input,
body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-filters .form-select {
    min-height: var(--beta-control-height-compact);
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-feature-stack {
    gap: 12px !important;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-feature-item {
    gap: 10px;
    border: 1px solid var(--beta-border) !important;
    background: #f8fafc;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-feature-form {
    gap: 10px !important;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-grid {
    gap: 10px !important;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-filters {
    gap: 8px;
}

body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-stripe-table {
    table-layout: fixed;
}

body.design-beta .page[data-page-id="settings-company"] .page-header {
    margin-bottom: 4px;
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-toolbar--beta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-toolbar-main,
body.design-beta .page[data-page-id="settings-company"] .settings-company-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-mode-tabs {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    padding: 4px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-1);
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-mode-tabs .btn,
body.design-beta .page[data-page-id="settings-company"] .settings-company-toolbar-actions .btn {
    min-height: var(--beta-control-height-compact);
    padding: 0 12px;
    border-radius: 10px;
}

body.design-beta .page[data-page-id="settings-company"][data-active-tab="general"] .settings-company-toolbar-action--configuration,
body.design-beta .page[data-page-id="settings-company"][data-active-tab="configuration"] .settings-company-toolbar-action--general {
    display: none !important;
}

body.design-beta .page[data-page-id="settings-company"] .settings-layout--beta {
    grid-template-columns: 218px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta {
    top: 8px;
    padding: 8px;
    border-radius: 12px;
    border-color: var(--beta-border);
    box-shadow: none;
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(10px);
    max-height: calc(100vh - 104px);
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-title {
    margin-bottom: 6px;
    color: var(--beta-text-soft);
    font-size: 11px;
    letter-spacing: 0.08em;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-search {
    margin-bottom: 8px;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-search-label,
body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-status {
    display: none;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-search-row {
    gap: 6px;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-search-input,
body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-search-clear {
    min-height: var(--beta-control-height-compact);
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta .settings-subnav-empty {
    margin-bottom: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    border-color: var(--beta-border);
    background: var(--beta-surface-subtle);
    font-size: 12px;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta a.settings-subnav-link {
    margin: 0;
    padding: 7px 8px;
    border: 0;
    border-radius: 10px;
    color: var(--beta-text-muted);
    font-size: 13px;
    line-height: 1.35;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta a.settings-subnav-link.sub {
    padding-left: 16px;
    font-size: 12px;
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta a.settings-subnav-link:hover {
    background: rgba(17, 32, 51, 0.06);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta a.settings-subnav-link.active {
    background: rgba(17, 32, 51, 0.08);
    color: var(--beta-navy);
    box-shadow: inset 0 0 0 1px rgba(17, 32, 51, 0.08);
}

body.design-beta .page[data-page-id="settings-company"] .settings-content--beta {
    display: grid;
    gap: 10px;
    align-content: start;
}

body.design-beta .page[data-page-id="settings-company"] .settings-content--beta > .card,
body.design-beta .page[data-page-id="settings-company"] > .card {
    margin: 0;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
    overflow: hidden;
}

body.design-beta .page[data-page-id="settings-company"] .settings-content--beta > .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] > .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta > .card-body > .card > .card-header {
    min-height: 0;
    padding: 10px 12px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="settings-company"] .settings-content--beta > .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] > .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta > .card-body > .card > .card-body {
    padding: 12px;
}

body.design-beta .page[data-page-id="settings-company"] .settings-content--beta > .card > .card-header .card-title,
body.design-beta .page[data-page-id="settings-company"] > .card > .card-header .card-title,
body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta > .card-body > .card > .card-header .card-title {
    font-size: 16px;
    letter-spacing: -0.01em;
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta > .card-header {
    display: none;
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta > .card-body {
    display: grid;
    gap: 12px;
    padding: 0;
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta > .card-body > .card {
    margin: 0 !important;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
    overflow: hidden;
}

body.design-beta .page[data-page-id="settings-company"] .form-label {
    margin-bottom: 6px;
    color: var(--beta-text);
    font-size: 12px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="settings-company"] .form-hint {
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="settings-company"] .form-input,
body.design-beta .page[data-page-id="settings-company"] .form-select,
body.design-beta .page[data-page-id="settings-company"] .form-textarea,
body.design-beta .page[data-page-id="settings-company"] .btn {
    min-height: 32px;
    height: 32px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="settings-company"] .form-textarea {
    min-height: 76px;
    height: auto;
    padding-top: 8px;
    padding-bottom: 8px;
}

body.design-beta .page[data-page-id="settings-company"] .table th,
body.design-beta .page[data-page-id="settings-company"] .table td {
    padding-top: 10px;
    padding-bottom: 10px;
}

body.design-beta .page[data-page-id="settings-company"] .table .btn {
    min-height: 30px;
}

body.design-beta .page[data-page-id="settings-company"] .logo-upload-section {
    gap: 12px;
    padding: 12px 14px;
    border-color: var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="settings-company"] .logo-placeholder {
    width: 176px;
    height: 84px;
    border-radius: 12px;
    border-color: var(--beta-border-strong);
}

body.design-beta .page[data-page-id="settings-company"] .logo-placeholder .logo-icon {
    display: none;
}

body.design-beta .page[data-page-id="settings-company"] .logo-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

body.design-beta .page[data-page-id="settings-company"] .section-header,
body.design-beta .page[data-page-id="settings-company"] .form-actions {
    gap: 8px;
}

body.design-beta .page[data-page-id="settings-company"] .settings-company-section-note,
body.design-beta .page[data-page-id="settings-company"] #section-function-visibility > .card-body > .form-hint {
    display: none;
}

body.design-beta .page[data-page-id="settings-company"] .card-header-actions .btn,
body.design-beta .page[data-page-id="settings-company"] .logo-actions .btn,
body.design-beta .page[data-page-id="settings-company"] .form-actions .btn {
    min-height: 30px;
    height: 30px;
    padding: 0 10px;
}

body.design-beta .page[data-page-id="settings-company"] #section-platform-access .card,
body.design-beta .page[data-page-id="settings-company"] #section-newsletter .card,
body.design-beta .page[data-page-id="settings-company"] #section-azure .card,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .card,
body.design-beta .page[data-page-id="settings-company"] #localSyncCard .card,
body.design-beta .page[data-page-id="settings-company"] #section-superbill .card,
body.design-beta .page[data-page-id="settings-company"] #section-locale .card,
body.design-beta .page[data-page-id="settings-company"] #companyAuditCard {
    margin-top: 10px !important;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
    box-shadow: none;
    overflow: hidden;
}

body.design-beta .page[data-page-id="settings-company"] #section-platform-access .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] #section-newsletter .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] #section-azure .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] #localSyncCard .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] #section-superbill .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] #section-locale .card > .card-header,
body.design-beta .page[data-page-id="settings-company"] #companyAuditCard > .card-header {
    padding: 9px 12px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="settings-company"] #section-platform-access .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] #section-newsletter .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] #section-azure .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] #localSyncCard .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] #section-superbill .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] #section-locale .card > .card-body,
body.design-beta .page[data-page-id="settings-company"] #companyAuditCard > .card-body {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-inline-card {
    margin-top: 10px !important;
    border-color: var(--beta-border);
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-newsletter-form {
    display: grid;
    gap: 10px;
    margin-top: 0 !important;
}

body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-newsletter-form .form-grid,
body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-webhook-form {
    gap: 10px !important;
}

body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-webhook-table {
    margin-top: 10px !important;
}

body.design-beta .page[data-page-id="settings-company"] #section-email .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #section-azure .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #localSyncCard .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #section-superbill .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #section-locale .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #section-platform-access .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #section-newsletter .card-header-actions,
body.design-beta .page[data-page-id="settings-company"] #companyAuditCard .form-actions,
body.design-beta .page[data-page-id="settings-company"] #companyAuditCard #coAuditPagination,
body.design-beta .page[data-page-id="settings-company"] .azure-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .integration-setup,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .integration-setup {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .integration-icon,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .integration-icon,
body.design-beta .page[data-page-id="settings-company"] #section-azure .integration-benefits,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .integration-benefits {
    display: none;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .integration-content,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .integration-content {
    display: grid;
    gap: 8px;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .integration-content h4,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .integration-content h4 {
    margin: 0;
    color: var(--beta-text);
    font-size: 15px;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .integration-content p,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .integration-content p {
    display: none;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .benefit-item,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .benefit-item {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .card-subsection,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .card-subsection {
    margin-top: 10px !important;
    padding-top: 10px !important;
    border-top: 1px solid var(--beta-border) !important;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .card-subsection h4,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .card-subsection h4 {
    margin: 0;
    color: var(--beta-text);
    font-size: 14px;
}

body.design-beta .page[data-page-id="settings-company"] #section-azure .card-subsection .form-hint,
body.design-beta .page[data-page-id="settings-company"] #teamsCard .card-subsection .form-hint {
    margin-top: 0;
}

body.design-beta .page[data-page-id="settings-company"] #section-branding .color-picker-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="settings-company"] #section-branding .color-picker-item {
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="settings-company"] #section-branding .form-help {
    margin-top: 6px;
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="settings-company"] #section-branding .color-input-group {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px;
    align-items: center;
}

body.design-beta .page[data-page-id="settings-company"] #section-branding .color-picker {
    width: 36px;
    min-width: 36px;
    height: 32px;
    border-radius: 10px;
}

body.design-beta .page[data-page-id="settings-company"] #section-security .security-toggles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="settings-company"] #section-security .security-toggle {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="settings-company"] #section-security .toggle-info h5 {
    margin: 0;
    color: var(--beta-text);
    font-size: 13px;
}

body.design-beta .page[data-page-id="settings-company"] #section-security .toggle-info p {
    display: none;
}

body.design-beta .page[data-page-id="settings-company"] #section-security .disabled-hint {
    margin-top: 6px;
    font-size: 11px;
}

body.design-beta .page[data-page-id="settings-company"] #section-locale .section-header {
    align-items: center;
}

body.design-beta .page[data-page-id="settings-company"] #companyAuditCard #coAuditFilterForm {
    display: grid;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="settings-company"] #companyAuditCard #coAuditFilterForm .form-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

body.design-beta .page[data-page-id="project-planner"] {
    gap: 14px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-header {
    align-items: flex-end;
    gap: 12px;
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-header-copy {
    gap: 2px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-header-copy .page-title {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-header-actions,
body.design-beta .page[data-page-id="project-planner"] .project-planner-header-meta,
body.design-beta .page[data-page-id="project-planner"] .project-planner-view-switch,
body.design-beta .page[data-page-id="project-planner"] .project-planner-primary-actions,
body.design-beta .page[data-page-id="project-planner"] .project-planner-row-actions,
body.design-beta .page[data-page-id="project-planner"] .project-planner-comment-actions,
body.design-beta .page[data-page-id="project-planner"] .project-planner-sidebar-head-actions,
body.design-beta .page[data-page-id="project-planner"] .project-planner-sidebar-meta,
body.design-beta .page[data-page-id="project-planner"] .project-planner-board-card-actions {
    gap: 8px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-card {
    border-color: var(--beta-border);
    border-radius: 16px;
    box-shadow: none;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-card,
body.design-beta .page[data-page-id="project-planner"] .project-planner-sidebar-card,
body.design-beta .page[data-page-id="project-planner"] .project-planner-column,
body.design-beta .page[data-page-id="project-planner"] .project-planner-comment-item,
body.design-beta .page[data-page-id="project-planner"] .project-planner-task-item,
body.design-beta .page[data-page-id="project-planner"] .project-planner-board-card {
    border-radius: 14px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-card {
    padding: 14px 16px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-primary-controls {
    align-items: flex-end;
    gap: 12px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-search .form-label {
    display: none;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-search {
    min-width: min(420px, 42vw);
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-summary-bar,
body.design-beta .page[data-page-id="project-planner"] .project-planner-advanced-filters {
    padding-top: 10px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-pill {
    padding: 5px 10px;
    border-color: var(--beta-border);
    border-radius: 999px;
    font-size: 12px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-status-toggle {
    min-height: 32px;
    padding: 0 12px;
    border-color: var(--beta-border);
    border-radius: 999px;
    font-size: 12px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-shell {
    gap: 16px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-shell.is-sidebar-open {
    grid-template-columns: minmax(0, 1fr) 340px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-table th,
body.design-beta .page[data-page-id="project-planner"] .project-planner-table td {
    padding-top: 11px;
    padding-bottom: 11px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-board {
    gap: 12px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-column-head {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-column-body {
    padding: 10px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-task-modal .form-input,
body.design-beta .page[data-page-id="project-planner"] .project-planner-task-modal .form-select,
body.design-beta .page[data-page-id="project-planner"] .project-planner-task-modal .form-textarea,
body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-card .form-input,
body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-card .form-select,
body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-card .btn,
body.design-beta .page[data-page-id="project-planner"] .project-planner-header .btn,
body.design-beta .page[data-page-id="project-planner"] .project-planner-sidebar .btn,
body.design-beta .page[data-page-id="project-planner"] .project-planner-main .btn {
    min-height: 34px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="project-planner"] .project-planner-task-modal .form-textarea,
body.design-beta .page[data-page-id="project-planner"] .project-planner-sidebar .form-textarea {
    min-height: 88px;
}

body.design-beta .page[data-page-id="utilization-v3"] {
    gap: 12px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-page-header {
    align-items: center;
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-page-header .page-title {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-page-header-actions .btn {
    min-width: 34px;
    min-height: 34px;
    padding: 0;
    font-size: 15px;
    line-height: 1;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-workspace-shell {
    background: var(--beta-surface);
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    box-shadow: none;
    overflow: hidden;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-workspace-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px 16px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-agg,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-grid-wrap,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-user-chart {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    box-shadow: none;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-agg {
    background: var(--beta-surface-subtle);
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-agg-head {
    gap: 10px;
    align-items: center;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-agg-head strong {
    font-size: 13px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-agg-head small,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-agg-help {
    display: none;
}

body.design-beta .page[data-page-id="utilization-v3"] #utilV3FiltersBlock {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-toolbar {
    gap: 8px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-filter-group {
    gap: 8px;
    min-width: 0;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-input-wrap {
    min-height: 34px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-input-wrap .form-input,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-toolbar .form-select,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-toolbar .btn,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-week-menu .btn {
    min-height: 34px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-input-wrap .form-input {
    padding-right: 34px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-clear {
    width: 28px;
    height: 28px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-view-mode {
    border-color: var(--beta-border);
    border-radius: 10px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-toolbar .form-checkbox {
    min-height: 32px;
    font-size: 12px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-grid-wrap {
    background: var(--beta-surface);
    margin-top: 0 !important;
    padding: 10px 10px 12px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-user-chart {
    background: var(--beta-surface);
    margin-top: 0;
    padding: 12px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-table th,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-table td,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-table.util-v3-table-compact th,
body.design-beta .page[data-page-id="utilization-v3"] .util-v3-table.util-v3-table-compact td {
    padding: 2px 3px;
}

body.design-beta .page[data-page-id="utilization-v3"] .util-v3-filters-inline {
    top: var(--beta-header-height);
    background: var(--beta-bg);
    border-bottom: 0;
    box-shadow: none;
    padding: 8px 0 10px;
}

body.design-beta .page[data-page-id="insights-studio"] {
    gap: 14px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-studio-header {
    align-items: center;
    gap: 12px;
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-studio-header-copy .page-title {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-studio-actions .btn,
body.design-beta .page[data-page-id="insights-studio"] .insights-directory-toolbar .form-input,
body.design-beta .page[data-page-id="insights-studio"] .insights-catalog-toolbar .form-input,
body.design-beta .page[data-page-id="insights-studio"] .form-input,
body.design-beta .page[data-page-id="insights-studio"] .form-select,
body.design-beta .page[data-page-id="insights-studio"] .form-textarea,
body.design-beta .page[data-page-id="insights-studio"] .btn {
    min-height: 34px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="insights-studio"] .form-textarea {
    min-height: 88px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-studio-shell {
    gap: 12px;
    grid-template-columns: 248px minmax(0, 1fr) 288px;
    min-height: calc(100vh - 196px);
}

body.design-beta .page[data-page-id="insights-studio"] .insights-panel {
    background: var(--beta-surface) !important;
    border: 1px solid var(--beta-border) !important;
    border-radius: 16px;
    box-shadow: none !important;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-panel-head {
    gap: 10px;
    padding: 14px 16px 12px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-panel-head h2,
body.design-beta .page[data-page-id="insights-studio"] .insights-section-head h3,
body.design-beta .page[data-page-id="insights-studio"] .insights-board-card-head h3,
body.design-beta .page[data-page-id="insights-studio"] .insights-drilldown-head h3 {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-panel-kicker,
body.design-beta .page[data-page-id="insights-studio"] .insights-panel-head p,
body.design-beta .page[data-page-id="insights-studio"] .insights-section-note {
    display: none !important;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-metric-chip {
    gap: 6px;
    padding: 5px 9px;
    border-color: var(--beta-border);
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="insights-studio"] .insights-directory-toolbar,
body.design-beta .page[data-page-id="insights-studio"] .insights-catalog-toolbar {
    padding: 0 16px 12px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-directory-templates {
    gap: 6px;
    padding: 0 16px 10px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-template-chip,
body.design-beta .page[data-page-id="insights-studio"] .insights-path-chip {
    padding: 7px 10px;
    border-color: var(--beta-border);
}

body.design-beta .page[data-page-id="insights-studio"] .insights-template-card {
    background: linear-gradient(180deg, var(--beta-surface), var(--beta-surface-subtle));
    border-radius: 14px;
    gap: 6px;
    max-width: 240px;
    min-height: 112px;
    min-width: 170px;
    padding: 11px 12px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-template-card small {
    display: block !important;
    font-size: 12px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-template-card span {
    color: var(--beta-text-2);
    display: inline-flex;
    font-size: 10px;
    letter-spacing: 0.06em;
    margin-top: auto;
    text-transform: uppercase;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-template-card::before {
    opacity: 0.95;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-directory-list {
    gap: 8px;
    padding: 0 12px 12px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-directory-item {
    border-radius: 12px;
    border-color: var(--beta-border);
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-directory-item p,
body.design-beta .page[data-page-id="insights-studio"] .insights-source-row p,
body.design-beta .page[data-page-id="insights-studio"] .insights-function-row p {
    display: none;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-workspace-stack {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 16px 16px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-section {
    background: var(--beta-surface);
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    box-shadow: none;
    padding: 14px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-board-shell {
    border-color: var(--beta-border);
    border-radius: 14px;
    box-shadow: none;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-widgets-list {
    gap: 10px;
}

body.design-beta .page[data-page-id="insights-studio"] .insights-widget-card,
body.design-beta .page[data-page-id="insights-studio"] .insights-board-card,
body.design-beta .page[data-page-id="insights-studio"] .insights-drilldown-drawer {
    border-radius: 14px;
    box-shadow: none;
}

body.design-beta .page[data-page-id="automations"] {
    gap: 12px;
}

body.design-beta .page[data-page-id="automations"] .automations-header {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="automations"] .automations-header .page-header-content h1 {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="automations"] .automations-workspace-context {
    display: none;
}

body.design-beta .page[data-page-id="automations"] .automations-workspace-tabs-shell,
body.design-beta .page[data-page-id="automations"] .automations-sidebar,
body.design-beta .page[data-page-id="automations"] .automations-builder,
body.design-beta .page[data-page-id="automations"] .automations-palette,
body.design-beta .page[data-page-id="automations"] .automations-inspector,
body.design-beta .page[data-page-id="automations"] .automations-executions,
body.design-beta .page[data-page-id="automations"] .automations-overview-hero,
body.design-beta .page[data-page-id="automations"] .automations-overview-detail {
    background: var(--beta-surface) !important;
    border: 1px solid var(--beta-border) !important;
    border-radius: 16px;
    box-shadow: none !important;
}

body.design-beta .page[data-page-id="automations"] .automations-workspace-tabs-body {
    gap: 8px;
    padding: 10px 14px;
}

body.design-beta .page[data-page-id="automations"] .automations-workspace-tab-button,
body.design-beta .page[data-page-id="automations"] .automations-overview-hero .btn,
body.design-beta .page[data-page-id="automations"] .automations-sidebar .btn,
body.design-beta .page[data-page-id="automations"] .automations-builder .btn,
body.design-beta .page[data-page-id="automations"] .automations-inspector .btn,
body.design-beta .page[data-page-id="automations"] .automations-executions .btn,
body.design-beta .page[data-page-id="automations"] .automations-page .form-input,
body.design-beta .page[data-page-id="automations"] .automations-page .form-select,
body.design-beta .page[data-page-id="automations"] .automations-page .form-textarea {
    min-height: 34px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="automations"] .automations-page .form-textarea {
    min-height: 88px;
}

body.design-beta .page[data-page-id="automations"] .automations-overview-hero {
    gap: 10px 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 12px 16px;
}

body.design-beta .page[data-page-id="automations"] .automations-panel-kicker,
body.design-beta .page[data-page-id="automations"] .automations-section-copy,
body.design-beta .page[data-page-id="automations"] .automations-overview-hero-copy p,
body.design-beta .page[data-page-id="automations"] .automations-panel-intro p,
body.design-beta .page[data-page-id="automations"] .automations-workspace-tab-copy {
    display: none !important;
}

body.design-beta .page[data-page-id="automations"] .automations-overview-meta,
body.design-beta .page[data-page-id="automations"] .automations-panel-meta {
    gap: 6px;
}

body.design-beta .page[data-page-id="automations"] .automations-overview-shell {
    gap: 12px;
}

body.design-beta .page[data-page-id="automations"] .automations-sidebar-section {
    padding: 12px;
}

body.design-beta .page[data-page-id="automations"] .automations-sidebar-section + .automations-sidebar-section {
    margin-top: 8px;
}

body.design-beta .page[data-page-id="automations"] .automations-panel-intro {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="automations"] .automations-builder-grid {
    gap: 12px;
}

body.design-beta .page[data-page-id="meeting-protocols"],
body.design-beta .page[data-page-id="admin-core"],
body.design-beta .page[data-page-id="admin-bug-reports"],
body.design-beta .page[data-page-id="admin-whats-new"],
body.design-beta .page[data-page-id="news"] {
    gap: 12px;
}

body.design-beta .page[data-page-id="meeting-protocols"] .page-header,
body.design-beta .page[data-page-id="admin-core"] .page-header,
body.design-beta .page[data-page-id="admin-bug-reports"] .page-header,
body.design-beta .page[data-page-id="admin-whats-new"] .page-header,
body.design-beta .page[data-page-id="news"] .page-header {
    margin-bottom: 2px;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.9fr);
    gap: 16px;
    align-items: start;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-workspace-card,
body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-docs-card,
body.design-beta .page[data-page-id="admin-core"] .admin-core-card,
body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-card,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-card,
body.design-beta .page[data-page-id="news"] .news-toolbar-card,
body.design-beta .page[data-page-id="news"] .news-list-card {
    border: 1px solid var(--beta-border);
    border-radius: var(--beta-radius-lg);
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-workspace-body,
body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-docs-body,
body.design-beta .page[data-page-id="admin-core"] .admin-core-card > .card-body,
body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-card > .card-body,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-card > .card-body,
body.design-beta .page[data-page-id="news"] .news-toolbar-card > .card-body,
body.design-beta .page[data-page-id="news"] .news-list-card > .card-body {
    padding: 16px 18px;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-card > .card-header,
body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-card > .card-header,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-card > .card-header {
    padding: 12px 16px;
    border-bottom: 1px solid var(--beta-border);
    background: transparent;
}

body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-list-card > .card-header {
    display: none;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-card > .card-header .card-title,
body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-card > .card-header .card-title,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-card > .card-header .card-title {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0;
}

body.design-beta .page[data-page-id="meeting-protocols"] label,
body.design-beta .page[data-page-id="admin-core"] .form-label,
body.design-beta .page[data-page-id="admin-bug-reports"] .form-label,
body.design-beta .page[data-page-id="admin-whats-new"] .form-label {
    margin-bottom: 6px;
    color: var(--beta-text-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
}

body.design-beta .page[data-page-id="meeting-protocols"] input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.design-beta .page[data-page-id="meeting-protocols"] select,
body.design-beta .page[data-page-id="meeting-protocols"] .btn,
body.design-beta .page[data-page-id="admin-core"] .form-input,
body.design-beta .page[data-page-id="admin-core"] .btn,
body.design-beta .page[data-page-id="admin-bug-reports"] .form-input,
body.design-beta .page[data-page-id="admin-bug-reports"] .btn,
body.design-beta .page[data-page-id="admin-whats-new"] .form-input,
body.design-beta .page[data-page-id="admin-whats-new"] .btn,
body.design-beta .page[data-page-id="news"] .btn {
    min-height: var(--beta-control-height-compact);
    height: var(--beta-control-height-compact);
}

body.design-beta .page[data-page-id="meeting-protocols"] textarea,
body.design-beta .page[data-page-id="admin-core"] .form-textarea,
body.design-beta .page[data-page-id="admin-bug-reports"] .form-textarea,
body.design-beta .page[data-page-id="admin-whats-new"] .form-textarea,
body.design-beta .page[data-page-id="news"] .form-textarea {
    border-radius: 12px;
    border-color: var(--beta-border);
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-config-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-workspace-body,
body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-docs-body {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-toolbar-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 1.1fr) minmax(220px, 1fr) auto;
    gap: 12px;
    align-items: end;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-date-range {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-search-field {
    min-width: 0;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-action-group,
body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-docs-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-docs-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-table-frame {
    margin-top: 0;
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    overflow: hidden;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-feedback {
    display: grid;
    gap: 8px;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-status:empty,
body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-result:empty {
    display: none;
}

body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-section-title {
    margin: 0;
    color: var(--beta-text);
    font-size: 14px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="meeting-protocols"] #jbDocInfoBottom {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-smtp-card,
body.design-beta .page[data-page-id="admin-core"] .admin-core-audit-card {
    overflow: hidden;
}

body.design-beta .page[data-page-id="admin-core"] #coreSmtpForm,
body.design-beta .page[data-page-id="admin-core"] #auditFilterForm {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-core"] #coreSmtpForm .form-input,
body.design-beta .page[data-page-id="admin-core"] #coreSmtpForm .btn,
body.design-beta .page[data-page-id="admin-core"] #auditFilterForm .form-input,
body.design-beta .page[data-page-id="admin-core"] #auditFilterForm .btn {
    min-height: 32px;
    height: 32px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="admin-core"] #coreSmtpForm .form-textarea,
body.design-beta .page[data-page-id="admin-core"] #auditFilterForm .form-textarea {
    min-height: 76px;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-smtp-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-smtp-grid .switch {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-audit-form {
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="admin-core"] #auditFilterForm .form-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-table-container .table thead th {
    font-size: 12px;
}

body.design-beta .page[data-page-id="admin-core"] .admin-core-table-container .table tbody td {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="admin-core"] .form-actions,
body.design-beta .page[data-page-id="admin-core"] #auditPagination,
body.design-beta .page[data-page-id="admin-bug-reports"] .form-actions,
body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor .form-group:last-child,
body.design-beta .page[data-page-id="news"] .news-toolbar-pagination,
body.design-beta .page[data-page-id="news"] .news-item-controls {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="admin-core"] #auditTableContainer,
body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportList {
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    overflow: hidden;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="admin-core"] #auditTableContainer {
    margin-top: 2px;
}

body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-grid {
    grid-template-columns: minmax(0, 1.3fr) minmax(360px, 0.95fr);
    gap: 16px;
}

body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-sidebar {
    display: grid !important;
    gap: 12px !important;
}

body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-editor-card {
    order: 1;
}

body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-codex-card {
    order: 2;
}

body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-deploy-card {
    order: 3;
}

body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-token-card {
    order: 4;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportFilters {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportFilters .form-grid-4 {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px;
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportPagination,
body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportTokenResult > .form-group > div {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportForm,
body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportCodexForm {
    display: grid;
    gap: 10px;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportForm .form-row,
body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportCodexForm .form-row {
    gap: 12px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportForm img {
    border-radius: 14px;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #deployProdBtn,
body.design-beta .page[data-page-id="admin-bug-reports"] #deployLogsLatestProdBtn {
    display: none;
}

body.design-beta .page[data-page-id="admin-bug-reports"] #deployLogOutput {
    border-radius: 14px;
    background: #0f172a;
    color: #e2e8f0;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-grid {
    grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
    gap: 14px;
}

body.design-beta .page[data-page-id="admin-whats-new"] #wnList > table,
body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor form {
    width: 100%;
}

body.design-beta .page[data-page-id="admin-whats-new"] #wnList > .loading-placeholder,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-editor-placeholder {
    margin: 0;
    color: var(--beta-text-muted);
    font-size: 13px;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-table thead th {
    font-size: 12px;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-table tbody td {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-edit-btn {
    min-height: 28px;
    height: 28px;
    padding: 0 10px;
}

body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor form,
body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor #wnBlockForm {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor .form-input,
body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor .btn {
    min-height: 32px;
    height: 32px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor .form-textarea {
    min-height: 88px;
    padding-top: 8px;
    padding-bottom: 8px;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-editor-form--campaign {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--title,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--intro,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--block-title,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--block-image,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--block-body,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--block-roles {
    grid-column: 1 / -1;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--actions,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-field--block-actions {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-divider {
    height: 1px;
    margin: 2px 0;
    background: var(--beta-border);
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-blocks-shell,
body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-blocks-list {
    display: grid;
    gap: 12px;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-blocks-title {
    margin: 0 !important;
    color: var(--beta-text);
    font-size: 14px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-editor-form--block {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-upload-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px !important;
    align-items: end !important;
}

body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-role-grid {
    gap: 10px !important;
}

body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor hr {
    margin: 18px 0 4px;
    border: 0;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="admin-whats-new"] #wnEditor .item {
    margin: 0;
    padding: 12px 14px !important;
    border: 1px solid var(--beta-border) !important;
    border-radius: 14px !important;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="news"] .news-toolbar-card,
body.design-beta .page[data-page-id="news"] .news-list-card {
    overflow: hidden;
}

body.design-beta .page[data-page-id="news"] .news-toolbar-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="news"] .news-toolbar-filters {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="news"] .news-toolbar-pagination {
    color: var(--beta-text-muted);
    font-size: 13px;
}

body.design-beta .page[data-page-id="news"] .news-item--beta + .news-item--beta {
    margin-top: 10px;
}

body.design-beta .page[data-page-id="news"] .news-item--beta {
    display: grid;
    gap: 8px;
    padding: 14px 16px;
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="news"] .news-item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

body.design-beta .page[data-page-id="news"] .news-item-title {
    color: var(--beta-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
}

body.design-beta .page[data-page-id="news"] .news-item-content {
    color: var(--beta-text-muted);
    font-size: 13px;
    line-height: 1.6;
    white-space: pre-wrap;
}

body.design-beta .page[data-page-id="news"] .news-item-meta {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="news"] .news-page-modal {
    width: min(760px, calc(100vw - 24px));
    border-radius: 20px;
}

body.design-beta .page[data-page-id="news"] .news-page-modal .modal-panel {
    padding: 0;
    border: 0;
    box-shadow: none;
}

body.design-beta .page[data-page-id="news"] .news-page-modal .form-group:last-child {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="news"] .news-page-modal .form-input,
body.design-beta .page[data-page-id="news"] .news-page-modal .btn {
    min-height: var(--beta-control-height-compact);
    height: var(--beta-control-height-compact);
}

@media (max-width: 1360px) {
    body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-config-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-toolbar-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-newsletter-form .form-grid,
    body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-webhook-form,
    body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-shell,
    body.design-beta .page[data-page-id="admin-bug-reports"] .admin-bug-reports-grid,
    body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-grid {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="admin-core"] .admin-core-smtp-grid,
    body.design-beta .page[data-page-id="admin-core"] #auditFilterForm .form-grid-4,
    body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportFilters .form-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportFilters {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="news"] .news-item-header {
        flex-direction: column;
    }
}

@media (max-width: 860px) {
    body.design-beta #timeEntryModal #timeEntryForm,
    body.design-beta #expenseModal #expenseForm,
    body.design-beta #createProjectModal #createProjectForm,
    body.design-beta .offer-doc-modal .offer-doc-grid {
        grid-template-columns: 1fr !important;
    }

    body.design-beta #createProjectModal #createProjectForm > div[style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }

    body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-config-grid,
    body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-toolbar-row,
    body.design-beta .page[data-page-id="admin-core"] .admin-core-smtp-grid,
    body.design-beta .page[data-page-id="admin-core"] #auditFilterForm .form-grid-4,
    body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-editor-form--campaign,
    body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-editor-form--block,
    body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-row,
    body.design-beta .page[data-page-id="admin-bug-reports"] #bugReportFilters .form-grid-4 {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="admin-whats-new"] .admin-whats-new-upload-row {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="meeting-protocols"] .meeting-protocols-docs-actions,
    body.design-beta .page[data-page-id="news"] .news-toolbar-row {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 1360px) {
    body.design-beta .page[data-page-id="project-planner"] .project-planner-shell.is-sidebar-open,
    body.design-beta .page[data-page-id="insights-studio"] .insights-studio-shell,
    body.design-beta .page[data-page-id="automations"] .automations-overview-shell {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="project-planner"] .project-planner-sidebar {
        position: static;
    }

    body.design-beta .page[data-page-id="insights-studio"] .insights-studio-directory,
    body.design-beta .page[data-page-id="insights-studio"] .insights-studio-catalog {
        order: 2;
    }
}

@media (max-width: 1180px) {
    body.design-beta .page[data-page-id="utilization-v3"] .util-v3-toolbar,
    body.design-beta .page[data-page-id="project-planner"] .project-planner-primary-controls,
    body.design-beta .page[data-page-id="project-planner"] .project-planner-advanced-filters-footer {
        flex-direction: column;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="utilization-v3"] .util-v3-filter-group,
    body.design-beta .page[data-page-id="project-planner"] .project-planner-toolbar-search {
        width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="insights-studio"] .insights-workspace-grid,
    body.design-beta .page[data-page-id="automations"] .automations-builder-grid,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-insights-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 860px) {
    body.design-beta .page[data-page-id="utilization-v3"] .util-v3-page-header,
    body.design-beta .page[data-page-id="project-planner"] .project-planner-header,
    body.design-beta .page[data-page-id="insights-studio"] .insights-studio-header,
    body.design-beta .page[data-page-id="automations"] .automations-overview-hero {
        align-items: stretch;
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="project-planner"] .project-planner-header-actions,
    body.design-beta .page[data-page-id="insights-studio"] .insights-studio-actions {
        width: 100%;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-row {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-project-entry-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 1200px) {
    body.design-beta .page[data-page-id="settings-templates"] .settings-templates-branding-grid,
    body.design-beta .page[data-page-id="settings-templates"] .settings-templates-report-layout--beta,
    body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-beta-grid,
    body.design-beta .page[data-page-id="settings-company"] .settings-layout--beta {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="settings-templates"] .settings-templates-report-upload-card {
        position: static;
    }

    body.design-beta .page[data-page-id="settings-company"] .settings-subnav--beta {
        position: static;
        max-height: min(360px, calc(100vh - 180px));
    }
}

@media (max-width: 1280px) {
    body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-grid,
    body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-plan-form {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-assignment-grid > :first-child,
    body.design-beta .page[data-page-id="admin-subscriptions"] .admin-subscriptions-company-plan-info {
        grid-column: auto;
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="settings-templates"] .settings-templates-inline-tools,
    body.design-beta .page[data-page-id="hr-management"] .hr-management-toolbar-main,
    body.design-beta .page[data-page-id="settings-company"] .settings-company-toolbar-main,
    body.design-beta .page[data-page-id="settings-company"] .settings-company-toolbar-actions {
        width: 100%;
        justify-content: flex-start;
    }

    body.design-beta .page[data-page-id="settings-company"] .settings-company-toolbar--beta {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 1440px) {
    body.design-beta .page[data-page-id="projects"] .project-list-filters-grid,
    body.design-beta .page[data-page-id="offers"] .offers-filters-grid,
    body.design-beta .page[data-page-id="invoices"] .billing-filters-grid--beta,
    body.design-beta .page[data-page-id="bills"] .billing-filters-grid--beta,
    body.design-beta .page[data-page-id="costs"] .costs-filter-grid--beta,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-filters-grid--beta {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="projects"] .project-list-filter--search,
    body.design-beta .page[data-page-id="projects"] .project-list-filter--sort,
    body.design-beta .page[data-page-id="invoices"] .billing-filter-span-2,
    body.design-beta .page[data-page-id="bills"] .billing-filter-span-2,
    body.design-beta .page[data-page-id="offers"] .offers-filter-span-2 {
        grid-column: span 2;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-top,
    body.design-beta .page[data-page-id="costs"] .costs-toolbar-top,
    body.design-beta .page[data-page-id="budget"] .budget-toolbar-top,
    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-top,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-top,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-beta-toolbar-top,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-footer {
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    body.design-beta .command-bar-shortcut {
        display: none;
    }
}

@media (max-width: 1280px) {
    body.design-beta .page[data-page-id="projects"] .project-list-filters-grid,
    body.design-beta .page[data-page-id="offers"] .offers-filters-grid,
    body.design-beta .page[data-page-id="invoices"] .billing-filters-grid--invoices,
    body.design-beta .page[data-page-id="bills"] .billing-filters-grid--bills {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="projects"] .project-list-filter--search,
    body.design-beta .page[data-page-id="projects"] .project-list-filter--sort,
    body.design-beta .page[data-page-id="offers"] .offers-filter-span-2,
    body.design-beta .page[data-page-id="invoices"] .billing-filters-grid--invoices .billing-filter-span-2,
    body.design-beta .page[data-page-id="bills"] .billing-filters-grid--bills .billing-filter-span-2 {
        grid-column: span 2;
    }

    body.design-beta .page[data-page-id="crm"] .crm-search-grid--beta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="settings-profile"] #profileManagerCard,
    body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard,
    body.design-beta .page[data-page-id="settings-profile"] #profilePersonalInfoCard,
    body.design-beta .page[data-page-id="settings-profile"] #profilePreferencesCard,
    body.design-beta .page[data-page-id="settings-profile"] #aiAvatarCard,
    body.design-beta .page[data-page-id="settings-profile"] #profilePasswordCard,
    body.design-beta .page[data-page-id="settings-profile"] #officeAddinCard,
    body.design-beta .page[data-page-id="settings-profile"] #excelTenantSyncCard {
        grid-column: span 6;
    }

    body.design-beta .page[data-page-id="settings-profile"] #apiKeysCard,
    body.design-beta .page[data-page-id="settings-profile"] #teamsPersonalCard {
        grid-column: span 12;
    }

    body.design-beta .page[data-page-id="admin-billing"] .admin-billing-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-workspace-grid {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-secondary-grid {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--actions {
        position: static;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="team"] .team-beta-toolbar-actions {
        margin-left: 0;
    }

    body.design-beta .page[data-page-id="budget"] .budget-toolbar-controls {
        margin-left: 0;
    }

    body.design-beta .header-company-cluster {
        max-width: 210px;
    }
}

@media (max-width: 1120px) {
    body.design-beta .page[data-page-id="costs"] .costs-filter-grid--beta,
    body.design-beta .page[data-page-id="budget"] .budget-filter-grid--beta-compact,
    body.design-beta .page[data-page-id="budget"] .budget-scope-pills--beta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    body.design-beta .command-bar {
        min-width: min(520px, 48vw);
    }

    body.design-beta .header-actions-cluster .btn:not(.design-toggle-btn):not(.header-btn) span:last-child,
    body.design-beta .header-company-cluster .company-label {
        display: none;
    }

    body.design-beta .page[data-page-id="crm"] .crm-workspace {
        grid-template-columns: minmax(0, 1fr);
    }

    body.design-beta .page[data-page-id="admin-access"] .admin-access-beta-grid,
    body.design-beta .page[data-page-id="admin-companies"] .admin-companies-beta-layout,
    body.design-beta .page[data-page-id="admin-billing"] .admin-billing-beta-grid {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid,
    body.design-beta .page[data-page-id="offers"] .offers-metrics-grid,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid:not([data-mode="hours"]),
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-section-card--metrics-beta .reimbursements-metrics-grid,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid,
    body.design-beta .page[data-page-id="team"] .team-insights-grid--beta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] .stat-card {
        padding: 9px 10px;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] .stat-title {
        font-size: 10px;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid[data-mode="hours"] .stat-value {
        font-size: 18px;
    }

    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-actions,
    body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions--primary,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions--primary,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions--primary,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-row--beta .crm-selection-indicator,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-actions--primary {
        margin-left: 0;
    }

    body.design-beta .page[data-page-id="admin-companies"] .admin-companies-detail-card {
        position: static;
    }
}

@media (max-width: 1024px) {
    body.design-beta .main-header {
        padding: 10px 16px;
    }

    body.design-beta .page-container {
        padding: 14px 16px 20px;
    }

    body.design-beta .command-bar {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .header-left {
        flex: 1 1 auto;
        min-width: 0;
    }

    body.design-beta .header-right {
        gap: 8px;
        flex-wrap: wrap;
    }

    body.design-beta .header-company-cluster,
    body.design-beta .header-actions-cluster {
        width: 100%;
    }

    body.design-beta .header-actions-cluster {
        padding-left: 0;
        margin-left: 0;
        border-left: 0;
    }

    body.design-beta .page[data-page-id="projects"] .project-workspace-view-body {
        flex-direction: column;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-filters,
    body.design-beta .page[data-page-id="team"] .team-beta-toolbar-main,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-range-list,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions {
        width: 100%;
    }

    body.design-beta .page[data-page-id="settings-profile"] .settings-container--beta {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="settings-profile"] #profileManagerCard,
    body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard,
    body.design-beta .page[data-page-id="settings-profile"] #profilePersonalInfoCard,
    body.design-beta .page[data-page-id="settings-profile"] #profilePreferencesCard,
    body.design-beta .page[data-page-id="settings-profile"] #aiAvatarCard,
    body.design-beta .page[data-page-id="settings-profile"] #profilePasswordCard,
    body.design-beta .page[data-page-id="settings-profile"] #apiKeysCard,
    body.design-beta .page[data-page-id="settings-profile"] #officeAddinCard,
    body.design-beta .page[data-page-id="settings-profile"] #teamsPersonalCard,
    body.design-beta .page[data-page-id="settings-profile"] #excelTenantSyncCard {
        grid-column: auto;
    }

    body.design-beta .page[data-page-id="settings-profile"] .settings-profile-api-creator,
    body.design-beta .page[data-page-id="settings-profile"] .settings-profile-inline-actions,
    body.design-beta .page[data-page-id="settings-profile"] .settings-profile-inline-actions.settings-profile-inline-actions--excel {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="admin-access"] .admin-access-role-checkboxes {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    body.design-beta .page[data-page-id="projects"] .project-list-filters-grid,
    body.design-beta .page[data-page-id="offers"] .offers-filters-grid,
    body.design-beta .page[data-page-id="invoices"] .billing-filters-grid--beta,
    body.design-beta .page[data-page-id="bills"] .billing-filters-grid--beta,
    body.design-beta .page[data-page-id="costs"] .costs-filter-grid--beta,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-filters-grid--beta,
    body.design-beta .page[data-page-id="dashboard"] .stats-grid,
    body.design-beta .page[data-page-id="offers"] .offers-metrics-grid,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid,
    body.design-beta .page[data-page-id="crm"] .crm-search-grid--beta,
    body.design-beta .page[data-page-id="admin-billing"] .admin-billing-summary-grid,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid,
    body.design-beta .page[data-page-id="team"] .team-insights-grid--beta,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-grid {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid,
    body.design-beta .page[data-page-id="offers"] .offers-metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="offers"] .offers-metrics-grid .stat-title {
        white-space: normal;
        overflow: visible;
        text-overflow: initial;
        min-height: 2.5em;
        line-height: 1.2;
    }

    body.design-beta .page[data-page-id="dashboard"] .widget-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.design-beta .main-header {
        flex-direction: column;
        align-items: stretch;
    }

    body.design-beta .header-right {
        justify-content: flex-start;
    }

    body.design-beta .company-context {
        max-width: none;
    }

    body.design-beta .page[data-page-id="admin-access"] .admin-access-user-actions,
    body.design-beta .page[data-page-id="admin-billing"] .admin-billing-actions,
    body.design-beta .page[data-page-id="admin-companies"] .admin-companies-toolbar-card .card-body {
        flex-direction: column;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="admin-billing"] .admin-billing-warning {
        flex-direction: column;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-filters-shell,
    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell,
    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-card {
        position: static;
    }

    body.design-beta .page[data-page-id="dashboard"] .stat-card,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics .stat-card,
    body.design-beta .page[data-page-id="offers"] .offers-metrics-grid .stat-card {
        min-height: 104px;
        padding: 12px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stat-value,
    body.design-beta .page[data-page-id="offers"] .offers-metrics-grid .stat-value {
        font-size: 24px;
    }

    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table {
        width: 100%;
        min-width: 0;
        table-layout: fixed;
    }

    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table th,
    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table td {
        padding: 8px 10px;
    }

    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table th:nth-child(2),
    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table th:nth-child(3),
    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table td:nth-child(2),
    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table td:nth-child(3) {
        width: 72px;
        text-align: right;
        white-space: nowrap;
    }

    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table th:first-child,
    body.design-beta .page[data-page-id="dashboard"] #myWorkPlanWidget .table td:first-child {
        width: auto;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-top,
    body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-views,
    body.design-beta .page[data-page-id="projects"] .project-list-results-actions,
    body.design-beta .page[data-page-id="offers"] .offers-results-actions,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions {
        width: 100%;
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        gap: 8px;
        padding-bottom: 2px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-views::-webkit-scrollbar,
    body.design-beta .page[data-page-id="projects"] .project-list-results-actions::-webkit-scrollbar,
    body.design-beta .page[data-page-id="offers"] .offers-results-actions::-webkit-scrollbar,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions::-webkit-scrollbar,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions::-webkit-scrollbar {
        display: none;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-views > *,
    body.design-beta .page[data-page-id="projects"] .project-list-results-actions > *,
    body.design-beta .page[data-page-id="offers"] .offers-results-actions > *,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions > *,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions > * {
        flex: 0 0 auto;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-actions,
    body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top .btn-primary,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions--primary,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions--primary {
        width: 100%;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-actions {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-left: 0;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-actions .btn-primary,
    body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top .btn-primary {
        width: 100%;
        justify-content: center;
    }

    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions--primary,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions--primary {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: stretch;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions--primary .form-select,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions--primary .form-select {
        width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="crm"] .crm-results-card--beta .crm-table-frame,
    body.design-beta .page[data-page-id="offers"] .offers-table-frame,
    body.design-beta .page[data-page-id="invoices"] .billing-results-card--beta .card-body,
    body.design-beta .page[data-page-id="bills"] .billing-results-card--beta .card-body {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator,
    body.design-beta .page[data-page-id="offers"] .tabulator,
    body.design-beta .page[data-page-id="invoices"] .tabulator,
    body.design-beta .page[data-page-id="bills"] .tabulator {
        min-width: 100%;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse {
        width: 100%;
        margin-top: 8px;
        padding-top: 8px;
        border-top: 1px solid var(--beta-border);
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse table {
        width: 100%;
        min-width: 0;
        table-layout: fixed;
        border-collapse: separate;
        border-spacing: 0 6px;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse tr {
        display: grid;
        grid-template-columns: minmax(88px, 116px) minmax(0, 1fr);
        gap: 8px;
        align-items: start;
        background: transparent;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse td {
        width: auto !important;
        min-width: 0;
        padding: 0;
        border: 0;
        font-size: var(--beta-font-sm);
        white-space: normal;
        word-break: break-word;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse td:first-child {
        color: var(--beta-text-muted);
        font-size: var(--beta-font-meta);
    }

    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions .btn,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions .btn {
        min-height: 30px;
        padding-inline: 8px;
        font-size: 11px;
    }

    body.design-beta .page[data-page-id="offers"] .tabulator-header,
    body.design-beta .page[data-page-id="invoices"] .tabulator-header {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    body.design-beta .project-detail-modal,
    body.design-beta .project-create-modal,
    body.design-beta .project-info-modal,
    body.design-beta .project-team-modal,
    body.design-beta .project-tasks-modal,
    body.design-beta .project-time-modal,
    body.design-beta .project-costs-modal,
    body.design-beta .project-invoices-modal,
    body.design-beta .project-planner-card-modal,
    body.design-beta .project-planner-trash-modal,
    body.design-beta .invoice-modal,
    body.design-beta .einvoice-modal,
    body.design-beta .bill-modal,
    body.design-beta .reimbursement-modal,
    body.design-beta .reimbursement-receipts-modal,
    body.design-beta .offer-detail-modal,
    body.design-beta .offer-create-modal,
    body.design-beta .offer-doc-modal,
    body.design-beta .crm-client-detail-modal,
    body.design-beta .time-entry-modal {
        width: calc(100vw - 12px) !important;
        border-radius: 18px;
    }
}

body.design-beta .page[data-page-id="mail"] {
    gap: 12px;
}

body.design-beta .page[data-page-id="mail"] .mail-page-header {
    align-items: flex-end;
    gap: 12px;
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="mail"] .mail-page-intro {
    gap: 6px;
}

body.design-beta .page[data-page-id="mail"] .mail-context-bar {
    margin-top: 0;
}

body.design-beta .page[data-page-id="mail"] .mail-context-bar .project-detail-context-chip--strong {
    display: none;
}

body.design-beta .page[data-page-id="mail"] .mail-context-bar .project-detail-context-chip {
    min-height: 24px;
    padding: 0 8px;
    border-color: var(--beta-border);
    background: var(--beta-surface);
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="mail"] .mail-page-actions {
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

body.design-beta .page[data-page-id="mail"] .mail-page-status {
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-size: var(--beta-font-meta);
    line-height: 1.35;
}

body.design-beta .page[data-page-id="mail"] .mail-page-action-row,
body.design-beta .page[data-page-id="mail"] .mail-list-actions,
body.design-beta .page[data-page-id="mail"] .mail-search-wrap,
body.design-beta .page[data-page-id="mail"] .mail-detail-categories,
body.design-beta .page[data-page-id="mail"] .mail-action-bar,
body.design-beta .page[data-page-id="mail"] .mail-compose-toolbar,
body.design-beta .page[data-page-id="mail"] .mail-compose-modes,
body.design-beta .page[data-page-id="mail"] .mail-compose-actions {
    gap: 8px;
}

body.design-beta .page[data-page-id="mail"] .mail-page-action-row .btn,
body.design-beta .page[data-page-id="mail"] .mail-list-actions .btn,
body.design-beta .page[data-page-id="mail"] .mail-detail-categories .btn,
body.design-beta .page[data-page-id="mail"] .mail-action-bar .btn,
body.design-beta .page[data-page-id="mail"] .mail-compose-modes .btn,
body.design-beta .page[data-page-id="mail"] .mail-compose-actions .btn,
body.design-beta .page[data-page-id="mail"] .mail-action-bar .form-select,
body.design-beta .page[data-page-id="mail"] .mail-search-wrap .form-input,
body.design-beta .page[data-page-id="mail"] .mail-detail-categories .form-input {
    min-height: 32px;
}

body.design-beta .page[data-page-id="mail"] .mail-grid {
    grid-template-columns: 208px 312px minmax(0, 1fr);
    gap: 10px;
}

body.design-beta .page[data-page-id="mail"] .mail-workspace {
    gap: 10px;
}

body.design-beta .page[data-page-id="mail"] .mail-grid .card {
    min-height: calc(100vh - 170px);
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="mail"] .mail-grid .card-header,
body.design-beta .page[data-page-id="mail"] .mail-grid .card-body {
    padding-left: 14px;
    padding-right: 14px;
}

body.design-beta .page[data-page-id="mail"] .mail-grid .card-header {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="mail"] .mail-grid .card-body {
    gap: 8px;
    padding-top: 10px;
    padding-bottom: 12px;
}

body.design-beta .page[data-page-id="mail"] .mail-list .card-footer,
body.design-beta .page[data-page-id="mail"] .mail-detail .card-footer {
    padding: 10px 12px 12px;
    background: transparent;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="mail"] .mail-detail .card-body {
    padding: 10px 12px 12px;
}

body.design-beta .page[data-page-id="mail"] .mail-detail .form-textarea {
    min-height: 84px;
    border-color: var(--beta-border-strong);
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="mail"] .mail-pane-title,
body.design-beta .page[data-page-id="mail"] .mail-detail-header {
    font-size: var(--beta-font-lg);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="mail"] .mail-pane-meta,
body.design-beta .page[data-page-id="mail"] .mail-detail-context,
body.design-beta .page[data-page-id="mail"] .mail-detail-meta,
body.design-beta .page[data-page-id="mail"] .mail-meta-line,
body.design-beta .page[data-page-id="mail"] .mail-attachment-size,
body.design-beta .page[data-page-id="mail"] .mail-empty-state-description {
    color: var(--beta-text-muted);
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="mail"] .mail-section-title {
    font-size: var(--beta-font-meta);
    color: var(--beta-text-soft);
}

body.design-beta .page[data-page-id="mail"] .mail-count-chip {
    min-width: 24px;
    min-height: 24px;
    padding: 0 7px;
    border: 1px solid var(--beta-border);
    background: var(--beta-surface-subtle);
    color: var(--beta-text);
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="mail"] .mail-folders,
body.design-beta .page[data-page-id="mail"] .mail-messages,
body.design-beta .page[data-page-id="mail"] .mail-thread,
body.design-beta .page[data-page-id="mail"] .mail-attachment-list {
    gap: 8px;
}

body.design-beta .page[data-page-id="mail"] .mail-folder,
body.design-beta .page[data-page-id="mail"] .mail-message,
body.design-beta .page[data-page-id="mail"] .mail-thread-item,
body.design-beta .page[data-page-id="mail"] .mail-attachment {
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="mail"] .mail-folder:hover,
body.design-beta .page[data-page-id="mail"] .mail-message:hover,
body.design-beta .page[data-page-id="mail"] .mail-thread-item:hover,
body.design-beta .page[data-page-id="mail"] .mail-attachment:hover {
    border-color: rgba(17, 32, 51, 0.16);
    background: #fbfcfd;
}

body.design-beta .page[data-page-id="mail"] .mail-folder.active,
body.design-beta .page[data-page-id="mail"] .mail-message.active,
body.design-beta .page[data-page-id="mail"] .mail-thread-item.active {
    border-color: rgba(17, 32, 51, 0.2);
    background: rgba(17, 32, 51, 0.04);
    box-shadow: inset 2px 0 0 var(--beta-cyan);
}

body.design-beta .page[data-page-id="mail"] .mail-message.unread {
    box-shadow: inset 2px 0 0 var(--beta-cyan);
}

body.design-beta .page[data-page-id="mail"] .mail-folder-glyph,
body.design-beta .page[data-page-id="mail"] .mail-message-avatar {
    background: var(--beta-surface-subtle);
    color: var(--beta-navy);
    box-shadow: none;
}

body.design-beta .page[data-page-id="mail"] .mail-folder.active .mail-folder-glyph,
body.design-beta .page[data-page-id="mail"] .mail-message.active .mail-message-avatar {
    background: rgba(17, 32, 51, 0.1);
    color: var(--beta-navy);
}

body.design-beta .page[data-page-id="mail"] .mail-unread {
    background: var(--beta-navy);
}

body.design-beta .page[data-page-id="mail"] .mail-empty-state {
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="mail"] .mail-empty-state-icon {
    display: none;
}

body.design-beta .page[data-page-id="mail"] .mail-empty-state-title {
    font-size: var(--beta-font-md);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="mail"] .mail-attachment-preview {
    border-color: var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="whatsapp"] {
    gap: 10px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-page-header {
    align-items: flex-end;
    gap: 10px;
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-page-actions {
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-page-actions .btn,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-page-actions .form-input,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-page-actions .form-select,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar .form-input,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar .form-select,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-thread-actions .btn,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-tabs .btn,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-composer .form-input,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-composer .btn,
body.design-beta .page[data-page-id="whatsapp"] #waDetails .btn,
body.design-beta .page[data-page-id="whatsapp"] #waDetails .form-select,
body.design-beta .page[data-page-id="whatsapp"] #waTemplates .btn,
body.design-beta .page[data-page-id="whatsapp"] #waTemplates .form-textarea {
    min-height: 32px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-workspace {
    grid-template-columns: 292px minmax(0, 1fr) !important;
    gap: 10px !important;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main {
    min-height: calc(100vh - 168px);
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar-body,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .card-header,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .card-body,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .card-footer,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar .card-footer {
    padding-left: 12px;
    padding-right: 12px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar-body,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .card-header,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .card-body,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .card-footer,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar .card-footer {
    padding-top: 10px;
    padding-bottom: 10px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar .divider,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .divider,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main .card-header {
    border-color: var(--beta-border);
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-thread-title {
    color: var(--beta-text);
    font-size: var(--beta-font-lg);
    font-weight: 600;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-tabs {
    padding: 0 12px 10px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-tabs-row {
    gap: 6px !important;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-tabs .btn {
    padding: 0 10px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main-body {
    gap: 0;
}

body.design-beta .page[data-page-id="whatsapp"] .wa-tab-messages,
body.design-beta .page[data-page-id="whatsapp"] .wa-tab-media {
    height: calc(100vh - 312px) !important;
    background: var(--beta-surface-subtle) !important;
}

body.design-beta .page[data-page-id="whatsapp"] .wa-tab-details,
body.design-beta .page[data-page-id="whatsapp"] .wa-tab-templates {
    background: transparent;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-list {
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-list .empty-state,
body.design-beta .page[data-page-id="whatsapp"] #waMessages .empty-state,
body.design-beta .page[data-page-id="whatsapp"] #waMediaList .empty-state {
    padding: 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 8px;
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
    transition: border-color 120ms ease, background-color 120ms ease;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation:hover {
    border-color: rgba(17, 32, 51, 0.16);
    background: #fbfcfd;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation.active {
    border-color: rgba(17, 32, 51, 0.18);
    background: rgba(17, 32, 51, 0.04);
    box-shadow: inset 2px 0 0 var(--beta-cyan);
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-head {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-phone {
    color: var(--beta-text);
    font-size: 13px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-time,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-meta,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-bubble-meta,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-media-meta,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-media-caption,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-compose-hint {
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-tags {
    display: flex;
    gap: 6px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-tags .badge {
    min-height: 22px;
    padding: 0 8px;
    border: 1px solid var(--beta-border);
    border-radius: 999px;
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-size: 11px;
    font-weight: 600;
}

body.design-beta .page[data-page-id="whatsapp"] #waMessages {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-message {
    display: flex;
    margin: 0;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-message--out {
    justify-content: flex-end;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-message--in {
    justify-content: flex-start;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-bubble {
    max-width: min(68%, 560px);
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-message--out .whatsapp-bubble {
    border-color: rgba(17, 32, 51, 0.14);
    background: rgba(17, 32, 51, 0.92);
    color: #f8fafc;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-bubble-text {
    font-size: 13px;
    line-height: 1.5;
    white-space: pre-wrap;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-message--out .whatsapp-bubble-meta {
    color: rgba(248, 250, 252, 0.72);
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-media-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-media-thumb {
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid var(--beta-border);
    border-radius: 10px;
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-detail-grid {
    gap: 10px !important;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-detail-inline,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-detail-actions,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-quick-links,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-template-list,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-template-actions,
body.design-beta .page[data-page-id="whatsapp"] .whatsapp-compose-form {
    gap: 8px !important;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-quick-links-hint {
    display: none;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-composer {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.design-beta .page[data-page-id="whatsapp"] .whatsapp-compose-form .form-input {
    flex: 1 1 auto;
}

body.design-beta .page[data-page-id="newsletter"] {
    gap: 8px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-page-header {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-page-subtitle {
    display: none;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-context-bar {
    margin-top: 2px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-shell-card,
body.design-beta .page[data-page-id="newsletter"] .newsletter-group-card {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-shell-card > .card-header,
body.design-beta .page[data-page-id="newsletter"] .newsletter-group-card > .card-header {
    min-height: 0;
    padding: 10px 12px;
    border-bottom: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-shell-card > .card-body,
body.design-beta .page[data-page-id="newsletter"] .newsletter-group-card > .card-body {
    gap: 10px;
    padding: 10px 12px 12px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-workspace-tabs-shell {
    margin-bottom: 4px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-workspace-tabs-shell .card-body {
    padding: 6px 8px;
}

body.design-beta .page[data-page-id="newsletter"] .project-tab-card-description {
    display: none;
}

body.design-beta .page[data-page-id="newsletter"] .project-tab-card-meta {
    margin-top: 4px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-panel-stack {
    gap: 12px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-group-header {
    align-items: center;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-group-card .card-subtitle {
    margin-top: 2px;
    font-size: 12px;
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions {
    gap: 8px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions .btn,
body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions .form-input,
body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions .form-select,
body.design-beta .page[data-page-id="newsletter"] .newsletter-settings-body .btn,
body.design-beta .page[data-page-id="newsletter"] .newsletter-settings-body .form-input,
body.design-beta .page[data-page-id="newsletter"] .newsletter-settings-body .form-select {
    min-height: 32px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions .form-input,
body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions .form-select {
    min-width: 160px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-stats-row {
    gap: 8px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-stats-row .badge {
    padding: 5px 9px;
    border: 1px solid var(--beta-border);
    border-radius: 999px;
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-weight: 600;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-table-frame {
    border-color: var(--beta-border);
    border-radius: 14px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-table-frame .table thead th {
    padding-top: 10px;
    padding-bottom: 10px;
    background: #f9fafb;
    color: var(--beta-text-muted);
    font-size: 11px;
    letter-spacing: 0.06em;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-table-frame .table tbody td {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 13px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-table-actions .btn {
    min-height: 32px;
    padding: 0 10px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-empty-state {
    min-height: 120px;
    padding: 18px 12px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-empty-state-icon {
    display: none;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-empty-state-title {
    font-size: var(--beta-font-md);
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-empty-state-description {
    max-width: 42ch;
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-settings-body {
    gap: 10px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-card {
    margin-bottom: 0;
    padding: 8px 10px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-description,
body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-code {
    display: none;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-header {
    align-items: center;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-title,
body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-meta,
body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-actions .btn {
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-actions .btn {
    min-height: 32px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-secondary-stack {
    margin-top: 8px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-secondary-stack .newsletter-setup-restore {
    display: flex;
    justify-content: flex-start;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-secondary-stack .newsletter-setup-header {
    align-items: center;
    gap: 8px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-secondary-stack .newsletter-setup-title-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-secondary-stack .newsletter-setup-actions {
    gap: 6px;
}

body.design-beta .page[data-page-id="newsletter"] .newsletter-secondary-stack .newsletter-setup-actions .btn {
    min-height: 30px;
    padding: 0 10px;
}

body.design-beta .page[data-page-id="documentation"] {
    gap: 12px;
}

body.design-beta .page[data-page-id="documentation"] .documentation-page-header {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="documentation"] .documentation-container {
    grid-template-columns: 220px minmax(0, 1fr) 210px;
    gap: 14px;
    margin-top: 8px;
    min-height: calc(100vh - 132px);
}

body.design-beta .page[data-page-id="documentation"] .doc-sidebar,
body.design-beta .page[data-page-id="documentation"] .doc-content,
body.design-beta .page[data-page-id="documentation"] .doc-toc {
    top: 8px;
    max-height: calc(100vh - 104px);
    padding: 14px 16px;
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="documentation"] .doc-search {
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="documentation"] .doc-search input {
    min-height: var(--beta-control-height-compact);
    padding: 0 10px;
    border: 1px solid var(--beta-border-strong);
    border-radius: 10px;
    background: var(--beta-surface);
    color: var(--beta-text);
    font-size: 13px;
}

body.design-beta .page[data-page-id="documentation"] .doc-nav {
    gap: 12px;
}

body.design-beta .page[data-page-id="documentation"] .doc-section h4,
body.design-beta .page[data-page-id="documentation"] .doc-toc h4 {
    margin-bottom: 6px;
    color: var(--beta-text-soft);
    font-size: var(--beta-font-meta);
    letter-spacing: 0.08em;
}

body.design-beta .page[data-page-id="documentation"] .doc-link {
    margin-bottom: 2px;
    padding: 7px 9px;
    border-radius: 10px;
    color: var(--beta-text-muted);
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="documentation"] .doc-link:hover {
    background: var(--beta-surface-subtle);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="documentation"] .doc-link.active {
    background: rgba(17, 32, 51, 0.08);
    color: var(--beta-navy);
}

body.design-beta .page[data-page-id="documentation"] .doc-content {
    padding: 18px 22px 20px;
}

body.design-beta .page[data-page-id="documentation"] .doc-context-hint {
    margin-bottom: 12px;
    padding: 8px 10px;
    border-color: var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="documentation"] .doc-article {
    max-width: none;
}

body.design-beta .page[data-page-id="documentation"] .doc-article h1 {
    margin-bottom: 14px;
    color: var(--beta-text);
    font-size: 28px;
    line-height: 1.15;
    letter-spacing: -0.03em;
}

body.design-beta .page[data-page-id="documentation"] .doc-article h2 {
    margin-bottom: 12px;
    color: var(--beta-text);
    font-size: 24px;
    letter-spacing: -0.02em;
}

body.design-beta .page[data-page-id="documentation"] .doc-article h3 {
    margin-top: 24px;
    margin-bottom: 10px;
    padding-top: 16px;
    border-top-color: var(--beta-border);
    color: var(--beta-text);
    font-size: 18px;
}

body.design-beta .page[data-page-id="documentation"] .feature-grid {
    gap: 12px;
    margin: 14px 0 18px;
}

body.design-beta .page[data-page-id="documentation"] .feature-card {
    padding: 14px 16px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface-subtle);
    text-align: left;
}

body.design-beta .page[data-page-id="documentation"] .feature-icon {
    display: none;
}

body.design-beta .page[data-page-id="documentation"] .feature-card h4 {
    margin-bottom: 4px;
    color: var(--beta-text);
    font-size: 14px;
}

body.design-beta .page[data-page-id="documentation"] .feature-card p {
    color: var(--beta-text-muted);
    font-size: 12px;
    line-height: 1.5;
}

body.design-beta .page[data-page-id="documentation"] .doc-article h4 {
    margin-top: 18px;
    margin-bottom: 8px;
    font-size: var(--beta-font-lg);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="documentation"] .doc-article p,
body.design-beta .page[data-page-id="documentation"] .doc-article li,
body.design-beta .page[data-page-id="documentation"] .doc-article dd {
    color: #374151;
    font-size: var(--beta-font-md);
    line-height: 1.65;
}

body.design-beta .page[data-page-id="documentation"] .doc-article p.lead {
    margin-bottom: 14px;
    font-size: var(--beta-font-md);
    color: var(--beta-text-muted);
}

body.design-beta .page[data-page-id="documentation"] .doc-article code {
    padding: 2px 5px;
    border-radius: 6px;
    background: var(--beta-surface-subtle);
    color: var(--beta-navy);
}

body.design-beta .page[data-page-id="documentation"] .doc-article pre {
    padding: 12px 14px;
    border-radius: 12px;
    background: #111827;
}

body.design-beta .page[data-page-id="documentation"] .toc-list a {
    padding: 4px 0;
    color: var(--beta-text-muted);
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="documentation"] .toc-list a:hover {
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="industry-workspace"] {
    gap: 12px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-header {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-header-content {
    align-items: flex-end;
    gap: 12px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-subtitle,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-panel-kicker,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-panel-head .industry-workspace-panel-copy,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-flow-highlight,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-focus-head,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-overview {
    display: none;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-context {
    margin-top: 4px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-context .project-detail-context-chip {
    min-height: 24px;
    padding: 0 8px;
    border-color: var(--beta-border);
    background: var(--beta-surface);
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-header-actions,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-command-row,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-inline-actions,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-actions,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-drawer-actions,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-hero-actions {
    gap: 8px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-header-actions .btn,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-command-row .btn,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-inline-actions .btn,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-actions .btn,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-drawer-actions .btn,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-hero-actions .btn,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-filters .form-input,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-filters .form-select,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-inline-field .form-input,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-inline-field .form-select {
    min-height: var(--beta-control-height-compact);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-shell,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-flow,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project {
    gap: 12px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-view-switch {
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-view-button {
    min-height: 32px;
    padding: 0 12px;
    border-radius: 9px;
    color: #475467;
    font-size: var(--beta-font-sm);
    font-weight: 500;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-view-button:hover {
    background: var(--beta-surface-subtle);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-view-button.is-active {
    background: rgba(17, 32, 51, 0.08);
    color: var(--beta-navy);
    box-shadow: none;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-metrics,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-metrics {
    gap: 10px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-metric,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-metric,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-focus-card,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-snapshot-card {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-metric,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-metric {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-stat-label {
    color: var(--beta-text-soft);
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-stat-value {
    color: var(--beta-text);
    font-size: 18px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-flow-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.95fr);
    gap: 12px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-grid,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-snapshot-grid {
    gap: 12px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-panel,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-row {
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-panel {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-panel-head {
    gap: 8px;
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-panel-title {
    font-size: var(--beta-font-xl);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-title {
    font-size: var(--beta-font-hero);
    letter-spacing: -0.02em;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-list,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-list {
    gap: 8px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-row {
    border-color: var(--beta-border);
    border-radius: 12px;
    background: #fbfcfd;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-row:hover,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-focus-card:hover,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-snapshot-card:hover {
    border-color: rgba(17, 32, 51, 0.16);
    background: #f8fafc;
    box-shadow: none;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-focus-card.is-active {
    border-color: rgba(17, 32, 51, 0.18);
    background: rgba(17, 32, 51, 0.04);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-row-meta,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-meta,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-summary-copy,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-empty-copy {
    color: var(--beta-text-muted);
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-row-amount {
    font-size: var(--beta-font-lg);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-badge {
    min-height: 24px;
    padding: 0 8px;
    border-color: var(--beta-border);
    background: var(--beta-surface-subtle);
    color: var(--beta-text-muted);
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-filters {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(140px, 1fr));
    gap: 8px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-focus {
    padding-top: 2px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-focus-card,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-snapshot-card {
    min-height: 0;
    padding: 10px 12px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-focus-card small,
body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-snapshot-card small {
    display: none;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-summary {
    gap: 6px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-drawer {
    margin-top: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--beta-border);
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-edit {
    gap: 8px;
}

body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-inline-field span {
    margin-bottom: 4px;
    color: var(--beta-text-soft);
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="research-workspace"] {
    gap: 12px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-header {
    margin-bottom: 0;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-header-content {
    align-items: flex-end;
    gap: 12px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-subtitle,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-proposal-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-panel-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-lane-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-kicker,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-focus-head,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-overview {
    display: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-context {
    margin-top: 4px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-context .project-detail-context-chip {
    min-height: 24px;
    padding: 0 8px;
    border-color: var(--beta-border);
    background: var(--beta-surface);
    color: var(--beta-text-muted);
    font-size: 12px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-header-actions,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-proposal-headline,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-proposal-desk-top,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-focus-actions,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-actions {
    gap: 8px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-header-actions .btn,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-card .btn,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-panel .btn,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-lane .btn,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-actions .btn,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-edit .form-input,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-edit .form-select,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-toolbar .form-input,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-toolbar .form-select,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-toolbar .btn,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-form-grid .form-input,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-form-grid .form-select,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-form-grid .btn {
    min-height: var(--beta-control-height-compact);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-shell,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-flow,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning {
    gap: 12px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-view-switch {
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--beta-border);
    border-radius: 12px;
    background: var(--beta-surface);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-view-button {
    min-height: 32px;
    padding: 0 12px;
    border-radius: 9px;
    background: transparent;
    color: #475467;
    font-size: var(--beta-font-sm);
    font-weight: 500;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-view-button:hover {
    background: var(--beta-surface-subtle);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-view-button.is-active {
    background: rgba(17, 32, 51, 0.08);
    color: var(--beta-navy);
    box-shadow: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-shell {
    top: 72px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-launcher {
    min-width: 180px;
    max-width: 220px;
    padding: 8px 10px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-2);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-launcher-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(17, 32, 51, 0.08);
    color: var(--beta-navy);
    box-shadow: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-launcher-title {
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-launcher-meta {
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot {
    top: 72px;
    border: 1px solid var(--beta-border);
    border-radius: 20px;
    background: var(--beta-surface);
    box-shadow: var(--beta-shadow-3);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot::after {
    display: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-meta,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-card,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-workbench,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-workbench-preview,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-copilot-option {
    border-color: var(--beta-border);
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-deck {
    gap: 10px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-card {
    min-height: 0;
    padding: 12px 14px;
    border: 1px solid var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
    box-shadow: none;
    gap: 6px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-step {
    color: var(--beta-text-soft);
    font-size: var(--beta-font-meta);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-title {
    font-size: var(--beta-font-md);
    line-height: 1.35;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-status {
    padding-top: 0;
    color: var(--beta-text-muted);
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-flow-top,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-flow-lanes {
    gap: 12px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-proposal-desk,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-panel,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-lane,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-row,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-client-desk,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-summary,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-summary-state,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-budget-card,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-window-card,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-capacity-panel,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-reassign-summary,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-reassign-form,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-reassign-preview,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-recommendation-card,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-scenario-board-metric,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-scenario-column,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-scenario-item,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-lane,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-month-card,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-budget-mix-card {
    border-color: var(--beta-border);
    border-radius: 16px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-proposal-desk,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-panel,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-client-desk {
    padding: 12px 14px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-panel-head,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-lane-head {
    gap: 8px;
    margin-bottom: 10px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-panel-title,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-lane-title,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-proposal-title,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-focus-title {
    font-size: var(--beta-font-xl);
    color: var(--beta-text);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-title {
    font-size: var(--beta-font-hero);
    letter-spacing: -0.02em;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-client-desk-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-summary-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-summary-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-summary-copy--muted,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-focus-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-window-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-budget-mix-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-capacity-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-reassign-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-fast-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-recommendations-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-scenario-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-scenario-board-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-lane-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-lane-row-copy,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-empty-copy {
    color: var(--beta-text-muted);
    font-size: var(--beta-font-sm);
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-filters,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-toolbar,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-quickadd-grid,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-budget-strip,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-window-grid,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-summary-grid,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-planning-metrics,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-metrics,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-grid {
    gap: 10px;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-focus-card {
    min-height: 0;
    padding: 10px 12px;
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface);
    box-shadow: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-portfolio-focus-card small {
    display: none;
}

body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-metric,
body.design-beta .page[data-page-id="research-workspace"] .research-workspace-proposal-metric {
    border: 1px solid var(--beta-border);
    border-radius: 14px;
    background: var(--beta-surface-subtle);
    box-shadow: none;
}

body.design-beta .page[data-page-id="research-workspace"] #researchWorkspaceProjectQuickForms .research-workspace-panel-head {
    margin-bottom: 8px;
}

@media (max-width: 1380px) {
    body.design-beta .page[data-page-id="mail"] .mail-grid {
        grid-template-columns: 216px minmax(0, 1fr);
    }

    body.design-beta .page[data-page-id="mail"] .mail-detail {
        grid-column: 1 / -1;
    }

    body.design-beta .page[data-page-id="documentation"] .documentation-container {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    body.design-beta .page[data-page-id="documentation"] .doc-toc {
        display: none;
    }

    body.design-beta .page[data-page-id="whatsapp"] .whatsapp-workspace {
        grid-template-columns: 272px minmax(0, 1fr) !important;
    }

    body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-deck {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    body.design-beta .page[data-page-id="mail"] .mail-page-header,
    body.design-beta .page[data-page-id="mail"] .mail-page-actions,
    body.design-beta .page[data-page-id="whatsapp"] .whatsapp-page-header,
    body.design-beta .page[data-page-id="whatsapp"] .whatsapp-page-actions {
        align-items: stretch;
        flex-direction: column;
    }

    body.design-beta .page[data-page-id="mail"] .mail-grid,
    body.design-beta .page[data-page-id="whatsapp"] .whatsapp-workspace,
    body.design-beta .page[data-page-id="documentation"] .documentation-container,
    body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-flow-grid,
    body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-project-grid,
    body.design-beta .page[data-page-id="research-workspace"] .research-workspace-flow-top,
    body.design-beta .page[data-page-id="research-workspace"] .research-workspace-flow-lanes,
    body.design-beta .page[data-page-id="research-workspace"] .research-workspace-project-grid {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="documentation"] .doc-sidebar,
    body.design-beta .page[data-page-id="documentation"] .doc-content {
        position: static;
        max-height: none;
    }

    body.design-beta .page[data-page-id="whatsapp"] .whatsapp-sidebar,
    body.design-beta .page[data-page-id="whatsapp"] .whatsapp-main,
    body.design-beta .page[data-page-id="whatsapp"] .wa-tab-messages,
    body.design-beta .page[data-page-id="whatsapp"] .wa-tab-media {
        min-height: 0;
        height: auto !important;
    }

    body.design-beta .page[data-page-id="industry-workspace"] .industry-workspace-portfolio-filters,
    body.design-beta .page[data-page-id="research-workspace"] .research-workspace-command-deck {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions,
    body.design-beta .page[data-page-id="newsletter"] .newsletter-setup-actions {
        width: 100%;
        justify-content: flex-start;
    }

    body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions .form-input,
    body.design-beta .page[data-page-id="newsletter"] .newsletter-toolbar-actions .form-select {
        min-width: 0;
        width: 100%;
    }
}

@media (max-width: 1024px) {
    body.design-beta .mobile-menu-toggle span {
        width: auto;
        height: auto;
        margin: 0;
        position: static;
        background: transparent;
    }

    body.design-beta .mobile-menu-toggle {
        top: calc(env(safe-area-inset-top, 0px) + 10px);
        left: 10px;
        width: 40px;
        height: 40px;
        border: 1px solid rgba(17, 24, 39, 0.08);
        border-radius: 13px;
        background: rgba(17, 24, 39, 0.96);
        box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
        color: #fff;
        z-index: 41;
    }

    body.design-beta .mobile-menu-toggle .mobile-menu-toggle-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        height: 18px;
        line-height: 0;
    }

    body.design-beta .mobile-menu-toggle .mobile-menu-toggle-icon svg {
        width: 18px;
        height: 18px;
        stroke: currentColor;
        overflow: visible;
    }

    body.design-beta.login-overlay-open .mobile-menu-toggle,
    body.design-beta.login-overlay-open .mobile-overlay {
        display: none !important;
    }

    body.design-beta .app-container {
        position: relative;
        overflow: hidden;
    }

    body.design-beta .sidebar,
    body.design-beta .app-container.sidebar-collapsed .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 140;
        width: min(82vw, 304px);
        max-width: 304px;
        height: 100dvh;
        transform: translateX(-104%);
        transition: transform 0.22s ease, box-shadow 0.22s ease;
        box-shadow: none;
    }

    body.design-beta .app-container.sidebar-expanded .sidebar,
    body.design-beta .app-container:not(.sidebar-collapsed) .sidebar {
        transform: translateX(0);
        box-shadow: 0 24px 48px rgba(15, 23, 42, 0.26);
    }

    body.design-beta .app-container.sidebar-collapsed .sidebar-header {
        padding: 14px 14px 12px;
        gap: 0;
    }

    body.design-beta .app-container.sidebar-collapsed .logo-text-block,
    body.design-beta .app-container.sidebar-collapsed .logo-subtext,
    body.design-beta .app-container.sidebar-collapsed .nav-label,
    body.design-beta .app-container.sidebar-collapsed .nav-section-title {
        display: block !important;
        width: auto !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    body.design-beta .app-container.sidebar-collapsed .nav-item {
        justify-content: flex-start;
        padding: 8px 10px 8px 12px;
    }

    body.design-beta .app-container.sidebar-collapsed .nav-item::before {
        left: 5px;
    }

    body.design-beta .main-content,
    body.design-beta .app-container.sidebar-collapsed .main-content {
        width: 100%;
        margin-left: 0;
    }

    body.design-beta.assistant-v3-shell-open .main-content {
        margin-right: 0;
    }

    body.design-beta .main-header {
        padding: calc(env(safe-area-inset-top, 0px) + 10px) 12px 10px;
        padding-left: 64px;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    body.design-beta .header-left,
    body.design-beta .header-right,
    body.design-beta .header-company-cluster,
    body.design-beta .header-actions-cluster {
        width: 100%;
        min-width: 0;
        max-width: none;
    }

    body.design-beta .header-left {
        flex: 0 0 auto;
        align-items: stretch;
    }

    body.design-beta .header-right {
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 8px;
    }

    body.design-beta .header-company-cluster {
        order: 2;
        flex: 1 1 100%;
    }

    body.design-beta .header-actions-cluster {
        order: 1;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 6px;
    }

    body.design-beta #headerCopilotBtn,
    body.design-beta #quickLogTimeBtn {
        width: 36px;
        min-width: 36px;
        height: 36px;
        min-height: 36px;
        padding: 0;
        justify-content: center;
        border-radius: 11px;
    }

    body.design-beta #headerCopilotBtn {
        background: var(--beta-surface-subtle);
        border: 1px solid var(--beta-border);
        color: var(--beta-navy);
    }

    body.design-beta #quickLogTimeBtn {
        background: rgba(17, 24, 39, 0.96);
        border: 1px solid rgba(17, 24, 39, 0.96);
        color: #fff;
    }

    body.design-beta #headerCopilotBtn .btn-icon-shell,
    body.design-beta #quickLogTimeBtn .btn-icon-shell {
        width: 17px;
        height: 17px;
    }

    body.design-beta #quickLogTimeBtn .quick-log-btn-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        height: 18px;
        line-height: 0;
        color: currentColor;
    }

    body.design-beta #quickLogTimeBtn .quick-log-btn-icon svg {
        width: 18px;
        height: 18px;
        stroke: currentColor;
        overflow: visible;
    }

    body.design-beta .command-bar {
        width: 100%;
        min-width: 0;
    }

    body.design-beta .command-bar-shortcut {
        display: none;
    }

    body.design-beta .page-container {
        padding: 8px 10px calc(14px + env(safe-area-inset-bottom, 0px));
    }

    body.design-beta .page {
        min-width: 0;
    }

    body.design-beta .page-header,
    body.design-beta .dashboard-page-header {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    body.design-beta .page-header-actions,
    body.design-beta .dashboard-page-header-actions {
        width: 100%;
        justify-content: stretch;
    }

    body.design-beta .page-header-actions .btn,
    body.design-beta .dashboard-page-header-actions .btn {
        flex: 1 1 calc(50% - 4px);
        min-width: 0;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-page-title-row {
        justify-content: space-between;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .card,
    body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > .stats-grid,
    body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-card,
    body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-content {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-grid > [data-widget-id] {
        grid-column: 1 / -1 !important;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-card {
        align-items: flex-start;
    }

    body.design-beta .page[data-page-id="dashboard"] #timeEntryWidgetForm .form-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="dashboard"] #quickEntryIntervalFields {
        grid-column: auto;
        grid-template-columns: 1fr;
        margin-top: 0;
    }

    body.design-beta .page[data-page-id="dashboard"] .widget-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-card,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric {
        min-height: 76px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-field,
    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-submit,
    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-flags {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-flags {
        padding: 10px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-flags .form-label {
        margin-bottom: 0;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-flag-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px 10px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-submit .btn {
        width: 100%;
    }

    body.design-beta .page[data-page-id="dashboard"] .quick-action-card {
        min-height: 0;
        padding: 9px 10px;
        grid-template-columns: 28px minmax(0, 1fr);
        gap: 7px;
    }

    body.design-beta .page[data-page-id="dashboard"] .quick-action-label {
        font-size: 12px;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell {
        position: static;
        top: auto;
        z-index: auto;
    }

    body.design-beta .time-tracking-mode-switch {
        display: block;
        width: 100%;
    }

    body.design-beta .time-tracking-mode-select {
        width: 100%;
    }

    body.design-beta .page[data-page-id="time-tracking"] #timeTabs {
        display: none;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-period {
        grid-column: 1 / -1;
        justify-content: center;
        width: 100%;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-actions .btn {
        width: 100%;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-review-card-header,
    body.design-beta .page[data-page-id="time-tracking"] .time-review-actions {
        flex-direction: column;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-review-actions .btn {
        width: 100%;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-review-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .card-body,
    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-top,
    body.design-beta .page[data-page-id="crm"] .crm-filter-chip-row--beta,
    body.design-beta .page[data-page-id="crm"] .client-filters,
    body.design-beta .page[data-page-id="crm"] #clientTypeFilters {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .card-body,
    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-top,
    body.design-beta .page[data-page-id="crm"] .crm-filter-chip-row--beta {
        max-width: 100%;
        overflow: hidden;
    }

    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-top {
        display: block;
    }

    body.design-beta .page[data-page-id="crm"] .crm-filter-chip-row--beta {
        flex: none;
    }

    body.design-beta .page[data-page-id="crm"] .client-filters,
    body.design-beta .page[data-page-id="crm"] #clientTypeFilters {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        overflow: visible;
        padding-bottom: 0;
        scrollbar-width: none;
    }

    body.design-beta .page[data-page-id="crm"] .client-filters::-webkit-scrollbar,
    body.design-beta .page[data-page-id="crm"] #clientTypeFilters::-webkit-scrollbar {
        display: none;
    }

    body.design-beta .page[data-page-id="crm"] .filter-chip {
        min-width: 0;
        width: 100%;
        justify-content: center;
        text-align: center;
        white-space: normal;
        line-height: 1.25;
    }

    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-actions {
        width: 100%;
        margin-left: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-actions .btn {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .page[data-page-id="crm"] .crm-search-field--compact {
        display: none;
    }

    body.design-beta .page[data-page-id="crm"] .crm-search-grid--beta {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="crm"] .crm-form-grid--two,
    body.design-beta .page[data-page-id="crm"] .crm-form-grid--three {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="crm"] .crm-table-actions,
    body.design-beta .page[data-page-id="offers"] .col-actions,
    body.design-beta .page[data-page-id="invoices"] .btn-group.btn-group-sm,
    body.design-beta .page[data-page-id="bills"] .btn-group.btn-group-sm {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    body.design-beta .page[data-page-id="crm"] .crm-table-actions .btn,
    body.design-beta .page[data-page-id="offers"] .col-actions .btn,
    body.design-beta .page[data-page-id="invoices"] .btn-group.btn-group-sm .btn,
    body.design-beta .page[data-page-id="bills"] .btn-group.btn-group-sm .btn {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="dashboard"] .table-container,
    body.design-beta .page[data-page-id="projects"] .table-container,
    body.design-beta .page[data-page-id="offers"] .table-container,
    body.design-beta .page[data-page-id="invoices"] .table-container,
    body.design-beta .page[data-page-id="bills"] .table-container,
    body.design-beta .page[data-page-id="time-tracking"] .table-container {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-x: contain;
    }

    body.design-beta .page[data-page-id="offers"] .tabulator,
    body.design-beta .page[data-page-id="invoices"] .tabulator,
    body.design-beta .page[data-page-id="time-tracking"] .tabulator {
        max-width: 100%;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-entry-grid {
        grid-template-columns: 1fr;
        gap: 8px;
        overflow: visible;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-entry-grid > .day-card {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="time-tracking"] .day-card {
        padding: 12px;
        text-align: left;
    }

    body.design-beta .page[data-page-id="time-tracking"] .day-card > div {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="time-tracking"] .hours-display {
        font-size: 20px;
    }

    body.design-beta .page[data-page-id="time-tracking"] .day-card .btn {
        min-height: 32px;
    }

    body.design-beta #clientDetailModal,
    body.design-beta #contactModal,
    body.design-beta #contactActivityModal,
    body.design-beta #createClientModal {
        justify-content: stretch;
        align-items: stretch;
        padding: 0;
    }

    body.design-beta .crm-client-detail-modal,
    body.design-beta .crm-contact-modal,
    body.design-beta .crm-contact-activity-modal,
    body.design-beta .crm-create-client-modal {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        border-radius: 0 !important;
        margin: 0;
        transform: translateY(14px);
    }

    body.design-beta #clientDetailModal.active .crm-client-detail-modal,
    body.design-beta #contactModal.active .crm-contact-modal,
    body.design-beta #contactActivityModal.active .crm-contact-activity-modal,
    body.design-beta #createClientModal.active .crm-create-client-modal {
        transform: translateY(0);
    }

    body.design-beta .crm-client-detail-modal .modal-header,
    body.design-beta .crm-contact-modal .modal-header,
    body.design-beta .crm-contact-activity-modal .modal-header,
    body.design-beta .crm-create-client-modal .modal-header {
        padding-inline: 14px;
    }

    body.design-beta .crm-client-detail-modal .modal-body,
    body.design-beta .crm-contact-modal .modal-body,
    body.design-beta .crm-contact-activity-modal .modal-body,
    body.design-beta .crm-create-client-modal .modal-body {
        padding: 0 12px 12px;
    }

    body.design-beta .crm-client-detail-modal .modal-footer,
    body.design-beta .crm-contact-modal .modal-footer,
    body.design-beta .crm-contact-activity-modal .modal-footer,
    body.design-beta .crm-create-client-modal .modal-footer {
        padding: 10px 12px max(12px, env(safe-area-inset-bottom, 0px));
        gap: 8px;
        flex-direction: column-reverse;
        align-items: stretch;
    }

    body.design-beta .crm-client-detail-modal .modal-footer .btn,
    body.design-beta .crm-contact-modal .modal-footer .btn,
    body.design-beta .crm-contact-activity-modal .modal-footer .btn,
    body.design-beta .crm-create-client-modal .modal-footer .btn {
        width: 100%;
    }

    body.design-beta .crm-client-detail-panel,
    body.design-beta .crm-contact-panel,
    body.design-beta .crm-contact-activity-panel,
    body.design-beta .crm-create-client-panel {
        padding: 0;
        gap: 8px;
    }

    body.design-beta .crm-client-detail-layout {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    body.design-beta .crm-client-detail-main,
    body.design-beta .crm-client-detail-side,
    body.design-beta .crm-client-detail-wide {
        display: grid;
        gap: 10px;
    }

    body.design-beta .crm-client-detail-card {
        margin: 0 !important;
        border-radius: 12px;
    }

    body.design-beta .crm-client-detail-card .card-header {
        flex-direction: column;
        align-items: stretch !important;
        gap: 8px;
    }

    body.design-beta .crm-client-detail-header-actions,
    body.design-beta .crm-client-detail-card .card-header > div:last-child {
        width: 100%;
    }

    body.design-beta .crm-client-detail-header-actions .btn,
    body.design-beta .crm-client-detail-card .card-header > div:last-child .btn {
        width: 100%;
    }
}

@media (max-width: 480px) {
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics,
    body.design-beta .page[data-page-id="dashboard"] .dashboard-actions,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-snapshot-grid,
    body.design-beta .page[data-page-id="time-tracking"] .time-review-metrics {
        grid-template-columns: 1fr !important;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-flags {
        padding: 9px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-quick-entry-flag-list {
        grid-template-columns: 1fr;
    }

    body.design-beta .card-header {
        padding: 9px 9px 7px;
    }

    body.design-beta .card-title {
        font-size: 13px;
    }

    body.design-beta .card-body {
        padding: 9px;
    }

    body.design-beta .project-detail-tab-button,
    body.design-beta .reports-tab-button,
    body.design-beta .time-tracking-tab-button,
    body.design-beta .crm-products-tab-button {
        min-height: 28px;
        padding: 0 8px;
        font-size: 10px;
        border-radius: 8px;
    }

    body.design-beta .table th,
    body.design-beta .table td,
    body.design-beta .tabulator .tabulator-cell {
        padding: 7px 8px;
        font-size: 12px;
    }

    body.design-beta .tabulator .tabulator-header .tabulator-col {
        min-height: 32px;
        padding: 0 7px;
        font-size: 10px;
    }

    body.design-beta .offers-metrics-grid,
    body.design-beta .billing-metrics-grid,
    body.design-beta .time-tracking-snapshot-grid,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-metrics-grid,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px;
    }

    body.design-beta .offers-metrics-grid .stat-card,
    body.design-beta .billing-metrics-grid .stat-card,
    body.design-beta .time-tracking-snapshot-grid .stat-card,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-metrics-grid .stat-card,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid .stat-card {
        min-height: 70px;
        padding: 9px 10px;
        border-radius: 12px;
    }

    body.design-beta .offers-metrics-grid .stat-value,
    body.design-beta .billing-metrics-grid .stat-value,
    body.design-beta .time-tracking-snapshot-grid .stat-value,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-metrics-grid .stat-value,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid .stat-value {
        font-size: 20px;
    }

    body.design-beta .offers-metrics-grid .stat-title,
    body.design-beta .billing-metrics-grid .stat-title,
    body.design-beta .time-tracking-snapshot-grid .stat-title,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-metrics-grid .stat-title,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-summary-grid .stat-title {
        font-size: 10px;
        line-height: 1.25;
    }

    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-actions {
        grid-template-columns: 1fr;
    }

    body.design-beta .page-container {
        padding: 8px 8px calc(12px + env(safe-area-inset-bottom, 0px));
    }

    body.design-beta .page-title,
    body.design-beta .page-header h1 {
        font-size: 20px;
    }

    body.design-beta .main-header {
        gap: 6px;
    }

    body.design-beta .command-bar {
        min-height: 38px;
        padding: 0 4px 0 7px;
        border-radius: 11px;
    }

    body.design-beta .search-btn,
    body.design-beta .search-clear,
    body.design-beta .header-btn {
        width: 30px;
        height: 30px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-card,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric {
        min-height: 70px;
        padding: 9px 10px;
        border-radius: 12px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-icon,
    body.design-beta .page[data-page-id="dashboard"] .quick-action-icon {
        width: 28px;
        height: 28px;
        border-radius: 9px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stat-value,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric-value {
        font-size: 20px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stat-title,
    body.design-beta .page[data-page-id="dashboard"] .stat-label,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric-label {
        font-size: 10px;
        line-height: 1.25;
    }

    body.design-beta .page[data-page-id="dashboard"] .quick-action-card {
        padding: 8px 9px;
        border-radius: 12px;
    }

    body.design-beta .page[data-page-id="dashboard"] .quick-action-label {
        font-size: 11px;
        line-height: 1.25;
    }

    body.design-beta #pwa-install-cta {
        left: 8px !important;
        right: 8px !important;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
        border: 1px solid var(--beta-border) !important;
        border-radius: 16px !important;
        background: rgba(255, 255, 255, 0.96) !important;
        box-shadow: 0 16px 32px rgba(15, 23, 42, 0.18) !important;
        padding: 8px 9px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
        backdrop-filter: blur(12px);
    }

    body.design-beta #pwa-install-cta > div {
        max-width: none !important;
        gap: 8px !important;
        align-items: center !important;
    }

    body.design-beta #pwa-install-cta button.btn {
        min-height: 30px;
        border-radius: 9px;
        font-size: 11px;
    }

    body.design-beta #pwa-install-cta button.btn-outline {
        width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
    }

    body.design-beta #pwa-install-cta div:first-child {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }
}

@media (max-width: 768px) {
    body.design-beta .company-context {
        display: none;
    }

    body.design-beta .company-switcher-btn {
        min-width: 34px;
        padding: 0 9px;
    }

    body.design-beta .company-switcher-btn .company-label,
    body.design-beta #quickLogTimeBtn span:not(.btn-icon-shell):not(.quick-log-btn-icon) {
        display: none;
    }

    body.design-beta .page-title,
    body.design-beta .page-header h1 {
        font-size: 21px;
    }

    body.design-beta .project-detail-context-bar,
    body.design-beta .dashboard-context-bar,
    body.design-beta .offers-context-bar,
    body.design-beta .crm-context-bar,
    body.design-beta .reports-context-bar,
    body.design-beta .time-tracking-context-bar {
        gap: 4px;
        margin-top: 4px;
    }

    body.design-beta .project-detail-context-chip,
    body.design-beta .project-detail-context-bar .project-model-pill,
    body.design-beta .badge,
    body.design-beta .tag,
    body.design-beta .chip {
        min-height: 22px;
        padding: 0 7px;
        border-radius: 8px;
        font-size: 10px;
        line-height: 1.2;
        background: rgba(255, 255, 255, 0.88);
    }

    body.design-beta .project-detail-context-chip--strong {
        background: rgba(17, 32, 51, 0.05);
    }

    body.design-beta .page[data-page-id="dashboard"] .page-header,
    body.design-beta .page[data-page-id="projects"] .page-header,
    body.design-beta .page[data-page-id="offers"] .page-header,
    body.design-beta .page[data-page-id="crm"] .page-header,
    body.design-beta .page[data-page-id="time-tracking"] .page-header {
        gap: 8px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="dashboard"] .stats-grid .stat-card,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric {
        min-height: 74px;
        padding: 9px 10px;
    }

    body.design-beta .page[data-page-id="dashboard"] .stat-value,
    body.design-beta .page[data-page-id="dashboard"] .widget-metrics .metric-value {
        font-size: 20px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-layout-shell {
        display: none;
    }

    body.design-beta .page[data-page-id="dashboard"].customize-mode .dashboard-layout-shell {
        display: block;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-page-header-actions {
        display: none;
    }

    body.design-beta .card-header {
        padding: 10px 10px 8px;
        gap: 8px;
    }

    body.design-beta .card-title {
        font-size: 14px;
        line-height: 1.25;
    }

    body.design-beta .card-body {
        padding: 10px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-empty-state,
    body.design-beta .page[data-page-id="mail"] .mail-empty-state,
    body.design-beta .page[data-page-id="newsletter"] .newsletter-empty-state,
    body.design-beta .page[data-page-id="whatsapp"] .whatsapp-conversation-list .empty-state,
    body.design-beta .page[data-page-id="whatsapp"] #waMessages .empty-state,
    body.design-beta .page[data-page-id="whatsapp"] #waMediaList .empty-state {
        padding: 8px 9px;
        border-radius: 10px;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-empty-state-title,
    body.design-beta .page[data-page-id="mail"] .mail-empty-state-title,
    body.design-beta .page[data-page-id="newsletter"] .newsletter-empty-state-title {
        font-size: 12px;
        line-height: 1.25;
    }

    body.design-beta .page[data-page-id="dashboard"] .dashboard-empty-state-copy,
    body.design-beta .page[data-page-id="mail"] .mail-empty-state-description,
    body.design-beta .page[data-page-id="newsletter"] .newsletter-empty-state-description,
    body.design-beta .page[data-page-id="whatsapp"] .empty-state {
        font-size: 11px;
        line-height: 1.35;
    }

    body.design-beta .project-detail-tabs-shell .card-body,
    body.design-beta .reports-workspace-tabs-shell .card-body,
    body.design-beta .time-tracking-tabs-shell .card-body,
    body.design-beta .crm-products-tabs-shell .card-body,
    body.design-beta .costs-workspace-tabs-shell .card-body,
    body.design-beta .billing-workspace-tabs-shell .card-body,
    body.design-beta .newsletter-workspace-tabs-shell .card-body {
        padding: 8px 10px;
    }

    body.design-beta .project-detail-tabs-list,
    body.design-beta .reports-tabs,
    body.design-beta .time-tracking-tabs,
    body.design-beta .crm-products-tabs {
        gap: 4px;
    }

    body.design-beta .project-detail-tab-button,
    body.design-beta .reports-tab-button,
    body.design-beta .time-tracking-tab-button,
    body.design-beta .crm-products-tab-button {
        min-height: 30px;
        padding: 0 9px;
        font-size: 11px;
        border-radius: 9px;
    }

    body.design-beta .form-group {
        gap: 4px;
        margin-bottom: 0;
    }

    body.design-beta .form-label {
        font-size: 11px;
        line-height: 1.2;
    }

    body.design-beta .table-container,
    body.design-beta .table-responsive,
    body.design-beta .tabulator {
        border-radius: 12px;
    }

    body.design-beta .table th,
    body.design-beta .table td,
    body.design-beta .tabulator .tabulator-cell {
        padding: 8px 9px;
    }

    body.design-beta .tabulator .tabulator-header .tabulator-col {
        min-height: 34px;
        padding: 0 8px;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .card-body,
    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .card-body,
    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .card-body,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .card-body,
    body.design-beta .page[data-page-id="crm"] .crm-filters-card .card-body,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .card-body,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .card-body,
    body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .card-body,
    body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .card-body,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .card-body,
    body.design-beta .page[data-page-id="reports"] .reports-controls .card-body,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .card-body,
    body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .card-body,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .card-body,
    body.design-beta .page[data-page-id="team"] .team-beta-toolbar .card-body,
    body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar .card-body {
        padding: 8px 10px;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .btn,
    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .btn,
    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .btn,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .btn,
    body.design-beta .page[data-page-id="crm"] .crm-filters-card .btn,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .btn,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .btn,
    body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .btn,
    body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .btn,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .btn,
    body.design-beta .page[data-page-id="reports"] .reports-controls .btn,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .btn,
    body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .btn,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .btn,
    body.design-beta .page[data-page-id="team"] .team-beta-toolbar .btn,
    body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar .btn {
        min-height: 30px;
        border-radius: 8px;
        font-size: 11px;
    }

    body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .form-input,
    body.design-beta .page[data-page-id="projects"] .project-list-filters-shell .form-select,
    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .form-input,
    body.design-beta .page[data-page-id="projects"] .project-list-beta-toolbar-shell .form-select,
    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .form-input,
    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .form-select,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .form-input,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-card .form-select,
    body.design-beta .page[data-page-id="crm"] .crm-filters-card .form-input,
    body.design-beta .page[data-page-id="crm"] .crm-filters-card .form-select,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .form-input,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-card .form-select,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .form-input,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-card .form-select,
    body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .form-input,
    body.design-beta .page[data-page-id="costs"] .costs-project-toolbar-card .form-select,
    body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .form-input,
    body.design-beta .page[data-page-id="budget"] .budget-toolbar-card .form-select,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .form-input,
    body.design-beta .page[data-page-id="time-tracking"] .time-tracking-toolbar-shell .form-select,
    body.design-beta .page[data-page-id="reports"] .reports-controls .form-input,
    body.design-beta .page[data-page-id="reports"] .reports-controls .form-select,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .form-input,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-toolbar-card .form-select,
    body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .form-input,
    body.design-beta .page[data-page-id="calendar"] .calendar-toolbar-card .form-select,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .form-input,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-toolbar-card .form-select,
    body.design-beta .page[data-page-id="team"] .team-beta-toolbar .form-input,
    body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar .form-input,
    body.design-beta .page[data-page-id="departments"] .departments-beta-toolbar .form-select {
        min-height: 30px;
        padding-inline: 8px;
        font-size: 12px;
    }

    body.design-beta .tabulator .tabulator-footer {
        padding: 4px 6px;
        min-height: 34px;
    }

    body.design-beta .tabulator .tabulator-footer .tabulator-page,
    body.design-beta .tabulator .tabulator-footer .tabulator-footer-contents,
    body.design-beta .tabulator .tabulator-footer .tabulator-paginator {
        font-size: 11px;
        min-height: 28px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-page-header--beta {
        gap: 6px;
        margin-bottom: 6px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-breadcrumb {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-context-bar {
        display: flex;
        flex-wrap: wrap;
        overflow-x: visible;
        gap: 6px;
        margin-top: 4px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tabs-shell {
        position: static;
        top: auto;
        margin-bottom: 6px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tabs-body {
        padding: 8px 10px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tabs-mobile-switch {
        display: block;
        margin-bottom: 6px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tabs-mobile-select {
        width: 100%;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-context-chip,
    body.design-beta .page[data-page-id="projects"] .project-detail-context-bar .project-model-pill {
        min-height: 24px;
        padding: 0 8px;
        border-radius: 8px;
        font-size: 10px;
        line-height: 1.2;
        white-space: normal;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tabs-list {
        display: none;
    }

    body.design-beta .page[data-page-id="projects"] #plannerTab .kanban-toolbar {
        justify-content: flex-start !important;
        margin-bottom: 8px !important;
        padding-inline: 2px;
    }

    body.design-beta .page[data-page-id="projects"] #plannerTab .kanban-scroll {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 0 8px;
        background: transparent;
        border-radius: 0;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
    }

    body.design-beta .page[data-page-id="projects"] #plannerTab .kanban-grid {
        display: flex;
        width: max-content;
        min-width: 0;
        gap: 8px;
        grid-template-columns: none;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="projects"] #plannerTab .kanban-column {
        width: min(252px, 74vw);
        min-width: min(252px, 74vw);
        max-width: min(252px, 74vw);
        flex: 0 0 min(252px, 74vw);
        scroll-snap-align: start;
    }

    body.design-beta .page[data-page-id="projects"] #plannerTab .kanban-card {
        padding: 10px;
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-summary-item {
        padding: 8px 10px;
        border-radius: 10px;
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-summary-value {
        font-size: 14px;
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-section-head {
        padding: 9px 10px;
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-section-head .card-title {
        font-size: 16px;
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-section-card > .card-body {
        padding: 10px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tab-panel--beta {
        gap: 8px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tab-panel--beta > .card,
    body.design-beta .page[data-page-id="projects"] .project-detail-tab-panel--beta .card,
    body.design-beta .page[data-page-id="projects"] .project-overview-section-card {
        border-radius: 12px;
    }

    body.design-beta .page[data-page-id="projects"] .project-tab-card-header,
    body.design-beta .page[data-page-id="projects"] .project-overview-section-head {
        flex-direction: column;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="projects"] .project-tab-card-actions {
        width: 100%;
        margin-left: 0;
        gap: 6px;
    }

    body.design-beta .page[data-page-id="projects"] .project-tab-card-actions .btn,
    body.design-beta .page[data-page-id="projects"] .project-overview-section-head .btn {
        width: 100%;
        justify-content: center;
    }

    body.design-beta .page[data-page-id="projects"] .project-overview-beta-grid,
    body.design-beta .page[data-page-id="projects"] .project-overview-beta-main,
    body.design-beta .page[data-page-id="projects"] .project-overview-beta-side {
        gap: 8px;
    }

    body.design-beta .card-header,
    body.design-beta .card-body,
    body.design-beta .card-footer {
        padding-left: 12px;
        padding-right: 12px;
    }

    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions .btn,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions .btn {
        width: 100%;
        min-height: 30px;
        padding-inline: 8px;
        font-size: 11px;
    }

    body.design-beta .page[data-page-id="invoices"] #exportInvoicesPdf,
    body.design-beta .page[data-page-id="invoices"] #exportInvoicesExcel,
    body.design-beta .page[data-page-id="invoices"] #resetInvoicesColumns,
    body.design-beta .page[data-page-id="bills"] #exportBillsPdf,
    body.design-beta .page[data-page-id="bills"] #exportBillsExcel,
    body.design-beta .page[data-page-id="bills"] #resetBillsColumns {
        display: none;
    }

    body.design-beta .page[data-page-id="invoices"] .tabulator .tabulator-cell,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="bills"] .tabulator .tabulator-cell,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse td {
        white-space: normal;
        word-break: break-word;
        line-height: 1.35;
    }

    body.design-beta .page[data-page-id="invoices"] .tabulator-cell strong,
    body.design-beta .page[data-page-id="invoices"] .tabulator-cell a,
    body.design-beta .page[data-page-id="bills"] .tabulator-cell strong,
    body.design-beta .page[data-page-id="bills"] .tabulator-cell a {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse {
        margin-top: 6px;
        padding-top: 6px;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse table,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse table {
        border-spacing: 0 4px;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse tr,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse tr {
        grid-template-columns: minmax(74px, 96px) minmax(0, 1fr);
        gap: 6px;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse td,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse td {
        font-size: 12px;
        line-height: 1.3;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse td:first-child,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse td:first-child {
        font-size: 10px;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse .badge,
    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse .tag,
    body.design-beta .page[data-page-id="crm"] .tabulator-responsive-collapse .chip,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse .badge,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse .tag,
    body.design-beta .page[data-page-id="offers"] .tabulator-responsive-collapse .chip,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse .badge,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse .tag,
    body.design-beta .page[data-page-id="invoices"] .tabulator-responsive-collapse .chip,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse .badge,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse .tag,
    body.design-beta .page[data-page-id="bills"] .tabulator-responsive-collapse .chip,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse .badge,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse .tag,
    body.design-beta .page[data-page-id="costs"] .tabulator-responsive-collapse .chip,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse .badge,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse .tag,
    body.design-beta .page[data-page-id="budget"] .tabulator-responsive-collapse .chip {
        min-height: 20px;
        padding: 0 6px;
        border-radius: 7px;
        font-size: 10px;
    }

    body.design-beta .page[data-page-id="offers"] .offers-results-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
        gap: 8px;
        padding-bottom: 0;
    }

    body.design-beta .page[data-page-id="offers"] .offers-results-actions > * {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .page[data-page-id="offers"] #offersTableGroupBy,
    body.design-beta .page[data-page-id="offers"] button[data-action="export-offers"] {
        grid-column: 1 / -1;
    }

    body.design-beta .page[data-page-id="offers"] #offersItemsPerPage,
    body.design-beta .page[data-page-id="offers"] #offersTableGroupBy {
        display: none;
    }

    body.design-beta .page[data-page-id="offers"] #resetOffersColumns {
        display: none;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-range-list,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-range-list > *,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions > * {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions .btn:disabled {
        display: none;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table {
        table-layout: fixed;
        min-width: 100%;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table th:nth-child(1),
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table td:nth-child(1),
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table th:nth-child(3),
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table td:nth-child(3) {
        display: none;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table th:nth-child(2),
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table td:nth-child(2) {
        width: auto;
        white-space: normal;
        word-break: break-word;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table th:nth-child(4),
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table td:nth-child(4),
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table th:nth-child(5),
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-table-frame--workitems .table td:nth-child(5) {
        width: 88px;
        white-space: normal;
    }

    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-header-filter {
        display: none;
    }

    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-col-content {
        padding-bottom: 0;
    }

    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-col[tabulator-field="source"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-cell[tabulator-field="source"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-col[tabulator-field="decision_by_name"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-cell[tabulator-field="decision_by_name"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-col[tabulator-field="decision_at"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-cell[tabulator-field="decision_at"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-col[tabulator-field="bucket"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-cell[tabulator-field="bucket"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-col[tabulator-field="updated_at"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubApprovalsTable .tabulator-cell[tabulator-field="updated_at"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubTimeEntriesTable .tabulator-col[tabulator-field="phase_label"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubTimeEntriesTable .tabulator-cell[tabulator-field="phase_label"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubTimeEntriesTable .tabulator-col[tabulator-field="description"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubTimeEntriesTable .tabulator-cell[tabulator-field="description"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubAbsencesTable .tabulator-col[tabulator-field="type"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubAbsencesTable .tabulator-cell[tabulator-field="type"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubAbsencesTable .tabulator-col[tabulator-field="notes"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubAbsencesTable .tabulator-cell[tabulator-field="notes"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubHomeOfficeTable .tabulator-col[tabulator-field="notes"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubHomeOfficeTable .tabulator-cell[tabulator-field="notes"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubZeitkontoTable .tabulator-col[tabulator-field="start_time"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubZeitkontoTable .tabulator-cell[tabulator-field="start_time"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubZeitkontoTable .tabulator-col[tabulator-field="reason"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubZeitkontoTable .tabulator-cell[tabulator-field="reason"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubPayoutsTable .tabulator-col[tabulator-field="month_key"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubPayoutsTable .tabulator-cell[tabulator-field="month_key"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubPayoutsTable .tabulator-col[tabulator-field="reason"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubPayoutsTable .tabulator-cell[tabulator-field="reason"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubPayoutsTable .tabulator-col[tabulator-field="updated_at"],
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubPayoutsTable .tabulator-cell[tabulator-field="updated_at"] {
        display: none !important;
    }

    body.design-beta .page[data-page-id="crm"] .crm-toolbar-row--beta .crm-toolbar-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    body.design-beta .page[data-page-id="crm"] .crm-toolbar-row--beta .crm-toolbar-actions .btn {
        width: 100%;
    }

    body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions,
    body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions--primary {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions > *,
    body.design-beta .page[data-page-id="costs"] .costs-toolbar-actions--primary > * {
        min-width: 0;
        width: 100%;
    }

    body.design-beta .page[data-page-id="costs"] [data-action="reset-columns"] {
        display: none;
    }

    body.design-beta .page[data-page-id="costs"] .costs-filter-grid--beta,
    body.design-beta .page[data-page-id="budget"] .budget-filter-grid--beta-compact,
    body.design-beta .page[data-page-id="budget"] .budget-filter-grid--advanced {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="budget"] .budget-toolbar-controls,
    body.design-beta .page[data-page-id="budget"] .budget-inline-actions--toolbar,
    body.design-beta .page[data-page-id="budget"] .budget-inline-actions--primary {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="budget"] .budget-toolbar-controls > *,
    body.design-beta .page[data-page-id="budget"] .budget-inline-actions--toolbar > *,
    body.design-beta .page[data-page-id="budget"] .budget-inline-actions--primary > * {
        width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="budget"] .budget-multi-select {
        min-height: 6rem;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-legend-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px 10px;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-legend-item {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-people-day {
        --year-sticky-width: 92px;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-day-header .day-header-sticky,
    body.design-beta .page[data-page-id="calendar"] .calendar-day-row .day-row-sticky {
        padding-inline: 6px;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-day-row .day-row-sticky {
        gap: 4px;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-day-row .day-row-sticky .avatar,
    body.design-beta .page[data-page-id="calendar"] .calendar-day-row .day-row-notes {
        display: none;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-day-row .day-row-sticky .name,
    body.design-beta .page[data-page-id="calendar"] .calendar-day-header .day-label,
    body.design-beta .page[data-page-id="calendar"] .calendar-day-header .day-hour {
        font-size: 10px;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-day-block {
        top: 3px;
        height: 20px;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-day-block-code {
        min-width: 16px;
        padding: 0 3px;
        font-size: 9px;
    }

    body.design-beta .page[data-page-id="calendar"] .calendar-day-block-text {
        font-size: 10px;
    }

    body.design-beta .page[data-page-id="budget"] .budget-filter-grid--advanced .budget-inline-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="budget"] .budget-saved-view-row,
    body.design-beta .page[data-page-id="budget"] .budget-threshold-row {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    body.design-beta .page[data-page-id="costs"] .tabulator,
    body.design-beta .page[data-page-id="budget"] .tabulator {
        min-width: 100%;
    }

    body.design-beta .page[data-page-id="crm"] .crm-results-card--beta .crm-table-frame {
        overflow-x: hidden;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator {
        width: 100% !important;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-col.tabulator-responsive-collapse-toggle {
        width: 34px !important;
        min-width: 34px !important;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-col[data-field="name"],
    body.design-beta .page[data-page-id="crm"] .tabulator-cell[tabulator-field="name"] {
        min-width: 0 !important;
        width: auto !important;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator-col[data-field="status"],
    body.design-beta .page[data-page-id="crm"] .tabulator-cell[tabulator-field="status"] {
        width: 104px !important;
        min-width: 104px !important;
    }

    body.design-beta .page[data-page-id="crm"] .tabulator .tabulator-cell {
        padding-inline: 8px;
    }

    body.design-beta .project-detail-tabs-list,
    body.design-beta .project-workspace-view-list,
    body.design-beta .reports-tabs,
    body.design-beta .time-tracking-tabs,
    body.design-beta .crm-products-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
    }

    body.design-beta.pwa-standalone .main-header {
        padding-top: calc(env(safe-area-inset-top, 0px) + 12px);
    }

    body.design-beta.pwa-standalone .page-container {
        padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 480px) {
    body.design-beta .page[data-page-id="projects"] .project-detail-page-header--beta {
        gap: 4px;
        margin-bottom: 4px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-breadcrumb {
        font-size: 12px;
        margin-bottom: 2px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tabs-list {
        gap: 2px;
    }

    body.design-beta .page[data-page-id="projects"] .project-detail-tab-button {
        min-height: 28px;
        padding: 0 7px;
        font-size: 11px;
    }

    body.design-beta .page[data-page-id="projects"] #plannerTab .kanban-toolbar label {
        font-size: 12px !important;
    }

    body.design-beta .page[data-page-id="projects"] #plannerTab .kanban-column {
        width: min(238px, 72vw);
        min-width: min(238px, 72vw);
        max-width: min(238px, 72vw);
        flex-basis: min(238px, 72vw);
    }

    body.design-beta .page[data-page-id="budget"] .budget-toolbar-controls {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="crm"] #clientTypeFilters {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="crm"] .crm-beta-toolbar-actions,
    body.design-beta .page[data-page-id="crm"] .crm-toolbar-row--beta .crm-toolbar-actions,
    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="invoices"] .billing-toolbar-actions--primary,
    body.design-beta .page[data-page-id="bills"] .billing-toolbar-actions--primary {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-range-list,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-quick-actions,
    body.design-beta .page[data-page-id="calendar"] .calendar-legend-list {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="operations-hub"] #operationsHubWorkItemsMobileList,
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubAbsencesMobileList,
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubHomeOfficeMobileList,
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubZeitkontoMobileList,
    body.design-beta .page[data-page-id="operations-hub"] #operationsHubPayoutsMobileList {
        display: grid;
        margin-top: 4px;
    }

    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--tasks .operations-hub-table-frame--workitems,
    body.design-beta .page[data-page-id="operations-hub"] .operations-hub-section-card--secondary .operations-hub-table-frame--secondary {
        display: none;
    }

    body.design-beta .page[data-page-id="budget"] .budget-inline-actions--toolbar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.design-beta .page[data-page-id="budget"] .budget-inline-actions--primary {
        grid-template-columns: 1fr 1fr;
    }

    body.design-beta .page[data-page-id="budget"] .budget-inline-actions--primary > :last-child {
        grid-column: 1 / -1;
    }

    body.design-beta .page[data-page-id="budget"] .budget-filter-grid--advanced .budget-inline-actions {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="budget"] .budget-multi-select {
        min-height: 4.75rem;
    }

    body.design-beta .page[data-page-id="time-tracking"] .tabulator .tabulator-footer,
    body.design-beta .page[data-page-id="costs"] .tabulator .tabulator-footer,
    body.design-beta .page[data-page-id="budget"] .tabulator .tabulator-footer,
    body.design-beta .page[data-page-id="invoices"] .tabulator .tabulator-footer,
    body.design-beta .page[data-page-id="bills"] .tabulator .tabulator-footer,
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-footer {
        padding: 8px 10px;
    }

    body.design-beta .page[data-page-id="time-tracking"] .tabulator .tabulator-footer-contents,
    body.design-beta .page[data-page-id="costs"] .tabulator .tabulator-footer-contents,
    body.design-beta .page[data-page-id="budget"] .tabulator .tabulator-footer-contents,
    body.design-beta .page[data-page-id="invoices"] .tabulator .tabulator-footer-contents,
    body.design-beta .page[data-page-id="bills"] .tabulator .tabulator-footer-contents,
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-footer-contents {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
    }

    body.design-beta .page[data-page-id="time-tracking"] .tabulator .tabulator-footer-contents > *,
    body.design-beta .page[data-page-id="costs"] .tabulator .tabulator-footer-contents > *,
    body.design-beta .page[data-page-id="budget"] .tabulator .tabulator-footer-contents > *,
    body.design-beta .page[data-page-id="invoices"] .tabulator .tabulator-footer-contents > *,
    body.design-beta .page[data-page-id="bills"] .tabulator .tabulator-footer-contents > *,
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-footer-contents > * {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="time-tracking"] .tabulator .tabulator-paginator,
    body.design-beta .page[data-page-id="costs"] .tabulator .tabulator-paginator,
    body.design-beta .page[data-page-id="budget"] .tabulator .tabulator-paginator,
    body.design-beta .page[data-page-id="invoices"] .tabulator .tabulator-paginator,
    body.design-beta .page[data-page-id="bills"] .tabulator .tabulator-paginator,
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-paginator {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 4px;
        margin-left: auto;
    }

    body.design-beta .page[data-page-id="time-tracking"] .tabulator .tabulator-page,
    body.design-beta .page[data-page-id="costs"] .tabulator .tabulator-page,
    body.design-beta .page[data-page-id="budget"] .tabulator .tabulator-page,
    body.design-beta .page[data-page-id="invoices"] .tabulator .tabulator-page,
    body.design-beta .page[data-page-id="bills"] .tabulator .tabulator-page,
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-page {
        min-width: 28px;
        height: 28px;
        line-height: 26px;
        padding: 0 6px;
    }

    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-paginator label,
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-page-size,
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-page[data-page="first"],
    body.design-beta .page[data-page-id="operations-hub"] .tabulator .tabulator-page[data-page="last"] {
        display: none;
    }
}

/* Offers beta toolbar refinements */
body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
}

body.design-beta .page[data-page-id="offers"] .offers-results-actions {
    justify-content: flex-start;
    width: 100%;
}

body.design-beta .page[data-page-id="offers"] .offers-results-actions > * {
    flex: 0 0 auto;
}

body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .offers-filters-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .offers-filters-grid > * {
    min-width: 0;
}

body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .offers-filter-span-2 {
    grid-column: span 2;
}

body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top .btn-primary {
    min-width: 160px;
}

@media (max-width: 900px) {
    body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="offers"] .offers-beta-toolbar-top .btn-primary {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    body.design-beta .page[data-page-id="offers"] .offers-results-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        overflow: visible;
    }

    body.design-beta .page[data-page-id="offers"] .offers-results-actions > * {
        width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="offers"] button[data-action="export-offers"] {
        grid-column: auto;
    }

    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .offers-filters-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    body.design-beta .page[data-page-id="offers"] .offers-results-actions,
    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .offers-filters-grid {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="offers"] .offers-section-card--toolbar .offers-filter-span-2 {
        grid-column: span 1;
    }
}

@media (max-width: 1024px) {
    body.design-beta .mobile-menu-toggle {
        z-index: 181;
    }
}

@media (max-width: 768px) {
    body.design-beta .mobile-card-table {
        display: block;
        width: 100%;
        min-width: 0;
        border-collapse: separate;
        border-spacing: 0;
        table-layout: auto;
    }

    body.design-beta .mobile-card-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    body.design-beta .mobile-card-table tbody {
        display: block;
    }

    body.design-beta .mobile-card-table tbody tr {
        display: grid;
        gap: 8px;
        padding: 12px;
        border-bottom: 1px solid var(--beta-border);
        background: #fff;
    }

    body.design-beta .mobile-card-table tbody tr:last-child {
        border-bottom: 0;
    }

    body.design-beta .mobile-card-table tbody td {
        display: grid;
        gap: 4px;
        width: 100%;
        min-width: 0;
        padding: 0;
        border: 0;
        white-space: normal;
        text-align: left !important;
    }

    body.design-beta .mobile-card-table tbody td::before {
        content: attr(data-label);
        color: var(--beta-text-muted);
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    body.design-beta .mobile-card-table tbody td > * {
        min-width: 0;
    }

    body.design-beta .mobile-card-table tbody td[colspan] {
        display: block;
    }

    body.design-beta .mobile-card-table tbody td[colspan]::before,
    body.design-beta .mobile-card-table tbody td.mobile-card-wide::before {
        display: none;
    }

    body.design-beta .mobile-card-table tbody td.mobile-card-wide {
        display: block;
        padding-top: 2px;
    }

    body.design-beta .mobile-card-table tbody td.mobile-card-bool {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    body.design-beta .mobile-card-table tbody td.mobile-card-actions {
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 6px;
    }

    body.design-beta .mobile-card-table tbody td.mobile-card-actions::before {
        width: 100%;
        max-width: none;
        flex: 0 0 100%;
    }

    body.design-beta .page[data-page-id="newsletter"] .newsletter-tabs {
        display: flex;
        flex-wrap: nowrap;
        gap: 6px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    body.design-beta .page[data-page-id="newsletter"] .newsletter-tabs::-webkit-scrollbar {
        display: none;
    }

    body.design-beta .page[data-page-id="newsletter"] .newsletter-tab-button {
        white-space: nowrap;
    }

    body.design-beta .page[data-page-id="newsletter"] .newsletter-table-frame {
        overflow: visible;
    }

    body.design-beta .page[data-page-id="newsletter"] .newsletter-table-actions,
    body.design-beta .page[data-page-id="project-planner"] .project-planner-row-actions {
        width: 100%;
        justify-content: flex-start;
    }

    body.design-beta .page[data-page-id="admin-access"] .admin-access-beta-grid,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-main-stack,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-side-stack,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card .card-body,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card .table-container {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card .card-body {
        padding: 12px;
    }

    body.design-beta .page[data-page-id="admin-access"] .admin-access-matrix-card .table-container {
        margin: 0;
        overflow: visible;
        border: 0;
    }

    body.design-beta .page[data-page-id="admin-access"] .admin-access-assignments-card,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-assignments-card .card-body,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-user-role-layout,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-user-role-layout .form-group,
    body.design-beta .page[data-page-id="admin-access"] #acUserSelect,
    body.design-beta .page[data-page-id="admin-access"] #acRoleCheckboxes,
    body.design-beta .page[data-page-id="admin-access"] .admin-access-user-actions {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="settings-profile"] .settings-container--beta,
    body.design-beta .page[data-page-id="settings-profile"] .settings-container--beta > .card,
    body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard,
    body.design-beta .page[data-page-id="settings-profile"] #profileWeekdayPlan,
    body.design-beta .page[data-page-id="settings-profile"] #profileWeekdayPlan > div {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="settings-profile"] #profileWorkTimeCard .stats-container.compact {
        grid-template-columns: 1fr;
    }

    body.design-beta .page[data-page-id="settings-profile"] #profileWeekdayPlan {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.design-beta .page[data-page-id="settings-profile"] #profileWeekdayPlan input,
    body.design-beta .page[data-page-id="settings-profile"] #profileWeekdayPlan select {
        width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="settings-profile"] .settings-profile-teams-recipient,
    body.design-beta .page[data-page-id="settings-profile"] .settings-profile-teams-recipient .form-control,
    body.design-beta .page[data-page-id="settings-profile"] .settings-profile-teams-recipient .form-select,
    body.design-beta .page[data-page-id="settings-profile"] #teamsDelegatedTestRecipient {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    body.design-beta .page[data-page-id="settings-company"] .settings-content--beta,
    body.design-beta .page[data-page-id="settings-company"] .settings-content--beta > .card,
    body.design-beta .page[data-page-id="settings-company"] .settings-company-config-card--beta,
    body.design-beta .page[data-page-id="settings-company"] #companyAuditCard,
    body.design-beta .page[data-page-id="settings-company"] #companyAuditCard #coAuditFilterForm,
    body.design-beta .page[data-page-id="settings-company"] #companyAuditCard #coAuditFilterForm .form-grid-4 {
        min-width: 0;
    }

    body.design-beta .page[data-page-id="settings-company"] #companyAuditCard #coAuditFilterForm .form-grid-4,
    body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-newsletter-form .form-grid,
    body.design-beta .page[data-page-id="settings-company"] #section-newsletter .settings-company-webhook-form {
        grid-template-columns: 1fr !important;
    }

    body.design-beta .page[data-page-id="settings-company"] .section-header,
    body.design-beta .page[data-page-id="settings-company"] .card-header-actions,
    body.design-beta .page[data-page-id="settings-company"] .logo-actions,
    body.design-beta .page[data-page-id="settings-company"] .form-actions {
        flex-direction: column;
        align-items: stretch;
    }

    body.design-beta .page[data-page-id="projects"] .projects-table-container,
    body.design-beta .page[data-page-id="team"] .team-table-container,
    body.design-beta .page[data-page-id="reimbursements"] .reimbursements-register-frame,
    body.design-beta .page[data-page-id="departments"] .table-container,
    body.design-beta .page[data-page-id="hr-management"] .hr-management-table-container,
    body.design-beta .page[data-page-id="project-planner"] .project-planner-table-wrap {
        overflow: visible;
    }

    body.design-beta .page[data-page-id="projects"] .project-quality-cell::before {
        align-self: center;
    }
}