@font-face {
    font-family: "Cairo";
    src: url("/static/fonts/Cairo-Variable.ttf") format("truetype");
    font-weight: 300 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --rabuild-primary: #17352B;   /* unified with report_theme.py BRAND_DARK_GREEN -- was #1D2E28 */
    --rabuild-primary-2: #0F241D; /* darker shade of the same brand green -- was #18392B */
    --rabuild-secondary: #3A5A40;
    --rabuild-surface: #FFFFFF;
    --rabuild-soft: #F2FAE9;
    --rabuild-soft-2: #F8FCF4;
    --rabuild-soft-3: #EEF5E9;
    --rabuild-border: #DCE5D6;
    --rabuild-border-2: #E5E7EB;
    --rabuild-muted: #6B7280;
    --rabuild-radius-card: 1.5rem;
    --rabuild-radius-control: 0.95rem;
    --rabuild-page-pad: 1;
    --rabuild-density: 1;
    --rabuild-shadow-card: 0 18px 42px rgba(15, 23, 42, 0.08);
}

html[data-rabuild-theme="easy"] {
    --rabuild-radius-card: 1.75rem;
    --rabuild-radius-control: 1.25rem;
    --rabuild-page-pad: 1.16;
    --rabuild-density: 1.14;
    --rabuild-shadow-card: 0 22px 46px rgba(15, 23, 42, 0.09);
}

html[data-rabuild-theme="guided"] {
    --rabuild-radius-card: 1.5rem;
    --rabuild-radius-control: 0.95rem;
    --rabuild-page-pad: 1;
    --rabuild-density: 1;
}

html[data-rabuild-theme="professional"] {
    --rabuild-radius-card: 0.5rem;
    --rabuild-radius-control: 0.45rem;
    --rabuild-page-pad: 0.68;
    --rabuild-density: 0.7;
    --rabuild-shadow-card: none;
}

html[data-rabuild-theme] body {
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif !important;
    color: var(--rabuild-primary-2);
    text-rendering: optimizeLegibility;
}

html[data-rabuild-theme] .card,
html[data-rabuild-theme] .admin-card,
html[data-rabuild-theme] .admin-kpi,
html[data-rabuild-theme] .glass-shell,
html[data-rabuild-theme] .security-status-card,
html[data-rabuild-theme] .portal-card,
html[data-rabuild-theme] .report-preview-page,
html[data-rabuild-theme] .modal-content {
    border-radius: var(--rabuild-radius-card) !important;
}

html[data-rabuild-theme] .form-input,
html[data-rabuild-theme] .btn-primary,
html[data-rabuild-theme] .btn-secondary,
html[data-rabuild-theme] .header-menu-button,
html[data-rabuild-theme] .main-step-link,
html[data-rabuild-theme] .enterprise-main-link,
html[data-rabuild-theme] .enterprise-pill,
html[data-rabuild-theme] select,
html[data-rabuild-theme] input,
html[data-rabuild-theme] textarea,
html[data-rabuild-theme] button {
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif !important;
}

html[data-rabuild-theme="easy"] .enterprise-main-link .desc,
html[data-rabuild-theme="easy"] .step-link .desc,
html[data-rabuild-theme="easy"] .step-link-external .desc,
html[data-rabuild-theme="easy"] .subcopy,
html[data-rabuild-theme="easy"] .methodology-helper,
html[data-rabuild-theme="easy"] .report-studio-shell .text-gray-600:not(.rabuild-theme-panel-copy),
html[data-rabuild-theme="easy"] .text-\[11px\].uppercase,
html[data-rabuild-theme="easy"] .tracking-\[0\.22em\],
html[data-rabuild-theme="easy"] .tracking-\[0\.28em\] {
    display: none !important;
}

html[data-rabuild-theme="easy"] .enterprise-main-link,
html[data-rabuild-theme="easy"] .main-step-link,
html[data-rabuild-theme="easy"] .step-link,
html[data-rabuild-theme="easy"] .step-link-external {
    min-height: 58px;
    align-items: center;
    border-radius: var(--rabuild-radius-control) !important;
    font-size: 1.05rem !important;
    font-weight: 900 !important;
    padding: 0.95rem 1.2rem !important;
}

html[data-rabuild-theme="easy"] .content-section,
html[data-rabuild-theme="easy"] main {
    font-size: 1.04rem;
}

html[data-rabuild-theme="easy"] .card,
html[data-rabuild-theme="easy"] .admin-card,
html[data-rabuild-theme="easy"] .admin-kpi,
html[data-rabuild-theme="easy"] .glass-shell,
html[data-rabuild-theme="easy"] .rounded-\[2rem\],
html[data-rabuild-theme="easy"] .rounded-\[1\.7rem\],
html[data-rabuild-theme="easy"] .rounded-\[1\.6rem\],
html[data-rabuild-theme="easy"] .rounded-\[1\.5rem\],
html[data-rabuild-theme="easy"] .rounded-2xl {
    border-radius: var(--rabuild-radius-card) !important;
    box-shadow: var(--rabuild-shadow-card) !important;
}

html[data-rabuild-theme="easy"] .p-4 { padding: 1.25rem !important; }
html[data-rabuild-theme="easy"] .p-5 { padding: 1.55rem !important; }
html[data-rabuild-theme="easy"] .p-6 { padding: 1.85rem !important; }
html[data-rabuild-theme="easy"] .px-4 { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
html[data-rabuild-theme="easy"] .py-3 { padding-top: 0.95rem !important; padding-bottom: 0.95rem !important; }
html[data-rabuild-theme="easy"] .btn-primary,
html[data-rabuild-theme="easy"] .btn-secondary,
html[data-rabuild-theme="easy"] .form-input {
    min-height: 52px;
    border-radius: var(--rabuild-radius-control) !important;
    font-size: 1rem !important;
}

html[data-rabuild-theme="easy"] table th,
html[data-rabuild-theme="easy"] table td {
    padding: 0.85rem 0.95rem !important;
}

html[data-rabuild-theme="professional"] body {
    background: #F8FCF4 !important;
}

html[data-rabuild-theme="professional"] header {
    padding-top: 0.7rem !important;
    padding-bottom: 0.7rem !important;
}

html[data-rabuild-theme="professional"] main {
    padding-top: 0.8rem !important;
    padding-bottom: 0.8rem !important;
}

html[data-rabuild-theme="professional"] .card,
html[data-rabuild-theme="professional"] .admin-card,
html[data-rabuild-theme="professional"] .admin-kpi,
html[data-rabuild-theme="professional"] .glass-shell,
html[data-rabuild-theme="professional"] .security-status-card,
html[data-rabuild-theme="professional"] .rounded-\[2rem\],
html[data-rabuild-theme="professional"] .rounded-\[1\.7rem\],
html[data-rabuild-theme="professional"] .rounded-\[1\.6rem\],
html[data-rabuild-theme="professional"] .rounded-\[1\.5rem\],
html[data-rabuild-theme="professional"] .rounded-2xl {
    border-radius: var(--rabuild-radius-card) !important;
    box-shadow: var(--rabuild-shadow-card) !important;
}

html[data-rabuild-theme="professional"] .p-8 { padding: 1.35rem !important; }
html[data-rabuild-theme="professional"] .p-6 { padding: 0.8rem !important; }
html[data-rabuild-theme="professional"] .p-5 { padding: 0.7rem !important; }
html[data-rabuild-theme="professional"] .p-4 { padding: 0.65rem !important; }
html[data-rabuild-theme="professional"] .px-8 { padding-left: 0.9rem !important; padding-right: 0.9rem !important; }
html[data-rabuild-theme="professional"] .px-6 { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
html[data-rabuild-theme="professional"] .px-5 { padding-left: 0.7rem !important; padding-right: 0.7rem !important; }
html[data-rabuild-theme="professional"] .py-10 { padding-top: 0.9rem !important; padding-bottom: 0.9rem !important; }
html[data-rabuild-theme="professional"] .py-5 { padding-top: 0.65rem !important; padding-bottom: 0.65rem !important; }
html[data-rabuild-theme="professional"] .py-4 { padding-top: 0.55rem !important; padding-bottom: 0.55rem !important; }
html[data-rabuild-theme="professional"] .gap-8 { gap: 0.75rem !important; }
html[data-rabuild-theme="professional"] .gap-6 { gap: 0.65rem !important; }
html[data-rabuild-theme="professional"] .gap-5 { gap: 0.55rem !important; }
html[data-rabuild-theme="professional"] .gap-4 { gap: 0.5rem !important; }
html[data-rabuild-theme="professional"] .space-y-8 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.75rem !important; }
html[data-rabuild-theme="professional"] .space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.65rem !important; }
html[data-rabuild-theme="professional"] .space-y-5 > :not([hidden]) ~ :not([hidden]) { margin-top: 0.55rem !important; }

html[data-rabuild-theme="professional"] h1,
html[data-rabuild-theme="professional"] .text-5xl {
    font-size: 2rem !important;
    line-height: 1.12 !important;
}

html[data-rabuild-theme="professional"] h2,
html[data-rabuild-theme="professional"] .text-4xl {
    font-size: 1.55rem !important;
    line-height: 1.2 !important;
}

html[data-rabuild-theme="professional"] .text-3xl { font-size: 1.35rem !important; }
html[data-rabuild-theme="professional"] .text-2xl { font-size: 1.18rem !important; }
html[data-rabuild-theme="professional"] .enterprise-main-link .desc,
html[data-rabuild-theme="professional"] .step-link .desc,
html[data-rabuild-theme="professional"] .step-link-external .desc,
html[data-rabuild-theme="professional"] .subcopy,
html[data-rabuild-theme="professional"] .blurb,
html[data-rabuild-theme="professional"] .report-studio-shell p,
html[data-rabuild-theme="professional"] .text-sm.text-gray-600 {
    font-size: 0.82rem !important;
    line-height: 1.45 !important;
}

html[data-rabuild-theme="professional"] .enterprise-main-link .desc,
html[data-rabuild-theme="professional"] .step-link .desc,
html[data-rabuild-theme="professional"] .step-link-external .desc,
html[data-rabuild-theme="professional"] .blurb,
html[data-rabuild-theme="professional"] .subcopy {
    display: none !important;
}

html[data-rabuild-theme="professional"] .main-step-link,
html[data-rabuild-theme="professional"] .enterprise-main-link,
html[data-rabuild-theme="professional"] .step-link,
html[data-rabuild-theme="professional"] .step-link-external,
html[data-rabuild-theme="professional"] .btn-primary,
html[data-rabuild-theme="professional"] .btn-secondary,
html[data-rabuild-theme="professional"] .form-input {
    border-radius: var(--rabuild-radius-control) !important;
    min-height: 36px !important;
    padding-top: 0.45rem !important;
    padding-bottom: 0.45rem !important;
    font-size: 0.86rem !important;
}

html[data-rabuild-theme="professional"] .enterprise-main-link,
html[data-rabuild-theme="professional"] .main-step-link,
html[data-rabuild-theme="professional"] .step-link,
html[data-rabuild-theme="professional"] .step-link-external {
    min-height: 38px !important;
    padding: 0.45rem 0.65rem !important;
}

html[data-rabuild-theme="professional"] table th,
html[data-rabuild-theme="professional"] table td {
    padding: 0.38rem 0.5rem !important;
    font-size: 0.76rem !important;
}

html[data-rabuild-theme="professional"] .report-preview-page {
    aspect-ratio: auto !important;
    min-height: auto !important;
}

html[data-rabuild-theme="professional"] #report-preview-host {
    height: 680px !important;
}

html[data-rabuild-color-theme="dark"] {
    --rabuild-primary: #F6FBF2;
    --rabuild-primary-2: #FFFFFF;
    --rabuild-secondary: #8FB89B;
    --rabuild-surface: #17241F;
    --rabuild-soft: #20352D;
    --rabuild-soft-2: #1A2C25;
    --rabuild-soft-3: #243B32;
    --rabuild-border: rgba(217, 230, 211, 0.18);
    --rabuild-border-2: rgba(217, 230, 211, 0.14);
    --rabuild-muted: #AFC4B8;
    --rabuild-shadow-card: none;
}

html[data-rabuild-color-theme="dark"] body {
    background: #101C17 !important;
    color: #F6FBF2 !important;
}

html[data-rabuild-color-theme="dark"] header,
html[data-rabuild-color-theme="dark"] main,
html[data-rabuild-color-theme="dark"] .card,
html[data-rabuild-color-theme="dark"] .enterprise-nav-shell,
html[data-rabuild-color-theme="dark"] .subnav-card,
html[data-rabuild-color-theme="dark"] .context-note,
html[data-rabuild-color-theme="dark"] .workspace-panel,
html[data-rabuild-color-theme="dark"] .workspace-kpi,
html[data-rabuild-color-theme="dark"] .workspace-step-card,
html[data-rabuild-color-theme="dark"] .risk-kpi-card,
html[data-rabuild-color-theme="dark"] .workflow-panel,
html[data-rabuild-color-theme="dark"] .enterprise-form-shell,
html[data-rabuild-color-theme="dark"] .enterprise-form-panel,
html[data-rabuild-color-theme="dark"] .modal-content {
    background: #17241F !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
    color: #F6FBF2 !important;
}

html[data-rabuild-color-theme="dark"] .enterprise-nav-shell {
    background: linear-gradient(180deg, #17241F 0%, #13211B 100%) !important;
}

html[data-rabuild-color-theme="dark"] .project-cockpit-shell {
    background:
        radial-gradient(circle at top right, rgba(143, 184, 155, 0.18), transparent 34%),
        linear-gradient(135deg, #0F1B16 0%, #17241F 55%, #1F352C 100%) !important;
    border: 1px solid rgba(217, 230, 211, 0.12);
}

html[data-rabuild-color-theme="dark"] .project-cockpit-nav-card {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: #FFFFFF !important;
}

html[data-rabuild-color-theme="dark"] .project-cockpit-nav-card.active {
    background: #F6FBF2 !important;
    color: #15251E !important;
}

html[data-rabuild-color-theme="dark"] .project-cockpit-nav-card.active .desc {
    color: #44584D !important;
}

html[data-rabuild-color-theme="dark"] .text-gray-700,
html[data-rabuild-color-theme="dark"] .text-gray-600,
html[data-rabuild-color-theme="dark"] .text-gray-500,
html[data-rabuild-color-theme="dark"] .workspace-shell-toolbar .copy,
html[data-rabuild-color-theme="dark"] .workspace-guidance-card .copy,
html[data-rabuild-color-theme="dark"] .cockpit-product .desc,
html[data-rabuild-color-theme="dark"] .cockpit-workflow-item .copy {
    color: #AFC4B8 !important;
}

html[data-rabuild-color-theme="dark"] .workspace-shell-toolbar .title,
html[data-rabuild-color-theme="dark"] .subnav-title,
html[data-rabuild-color-theme="dark"] .workspace-panel-head h3,
html[data-rabuild-color-theme="dark"] h1,
html[data-rabuild-color-theme="dark"] .pd-appbar-name,
html[data-rabuild-color-theme="dark"] h2,
html[data-rabuild-color-theme="dark"] h3,
html[data-rabuild-color-theme="dark"] h4,
html[data-rabuild-color-theme="dark"] .font-bold,
html[data-rabuild-color-theme="dark"] .font-extrabold,
html[data-rabuild-color-theme="dark"] .font-black {
    color: #F6FBF2;
}

html[data-rabuild-color-theme="dark"] .form-input,
html[data-rabuild-color-theme="dark"] select,
html[data-rabuild-color-theme="dark"] input,
html[data-rabuild-color-theme="dark"] textarea {
    background: #101C17 !important;
    border-color: rgba(217, 230, 211, 0.18) !important;
    color: #F6FBF2 !important;
}

html[data-rabuild-color-theme="dark"] .form-input::placeholder,
html[data-rabuild-color-theme="dark"] input::placeholder,
html[data-rabuild-color-theme="dark"] textarea::placeholder {
    color: #7F9488 !important;
}

html[data-rabuild-color-theme="dark"] .btn-secondary,
html[data-rabuild-color-theme="dark"] .enterprise-pill,
html[data-rabuild-color-theme="dark"] .step-link,
html[data-rabuild-color-theme="dark"] .step-link-external,
html[data-rabuild-color-theme="dark"] .cockpit-workflow-item,
html[data-rabuild-color-theme="dark"] .cockpit-product,
html[data-rabuild-color-theme="dark"] .workspace-guidance-card,
html[data-rabuild-color-theme="dark"] .section-note {
    background: #20352D !important;
    border-color: rgba(217, 230, 211, 0.16) !important;
    color: #F6FBF2 !important;
}

html[data-rabuild-color-theme="dark"] table,
html[data-rabuild-color-theme="dark"] thead,
html[data-rabuild-color-theme="dark"] tbody,
html[data-rabuild-color-theme="dark"] tr,
html[data-rabuild-color-theme="dark"] td,
html[data-rabuild-color-theme="dark"] th {
    border-color: rgba(217, 230, 211, 0.14) !important;
}

html[data-rabuild-color-theme="dark"] table th,
html[data-rabuild-color-theme="dark"] .bg-gray-100,
html[data-rabuild-color-theme="dark"] .bg-gray-50,
html[data-rabuild-color-theme="dark"] .bg-white {
    background: #1A2C25 !important;
    color: #F6FBF2 !important;
}

html[data-rabuild-color-theme="dark"] .rabuild-theme-trigger,
html[data-rabuild-color-theme="dark"] .rabuild-theme-panel {
    background: rgba(23, 36, 31, 0.96) !important;
    border-color: rgba(217, 230, 211, 0.18) !important;
    color: #F6FBF2 !important;
}

html[data-rabuild-color-theme="dark"] .rabuild-theme-option {
    background: #20352D !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
    color: #F6FBF2 !important;
}

html[data-rabuild-color-theme="dark"] .rabuild-theme-option.is-active {
    background: #2B473B !important;
    border-color: #8FB89B !important;
}

html[data-rabuild-theme] .main-tabs-nav.project-cockpit-nav {
    display: grid !important;
    overflow: visible !important;
    padding-bottom: 0 !important;
}

.rabuild-theme-switcher {
    position: fixed;
    right: max(1rem, env(safe-area-inset-right));
    bottom: max(1rem, env(safe-area-inset-bottom));
    z-index: 990;
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif;
}

/* WAVE 50: docked variant -- rendered inline inside the Project Workspace header
   (.project-cockpit-top-actions, next to the "Workspace Ready" status pill) instead of
   floating fixed over the whole viewport. The dropdown panel opens downward from the
   header instead of upward from a bottom-right corner trigger. */
.project-cockpit-theme-dock {
    position: relative;
    font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif;
}
.rabuild-theme-switcher.is-docked {
    position: relative;
    right: auto;
    bottom: auto;
    z-index: 30;
}
.rabuild-theme-switcher.is-docked .rabuild-theme-trigger {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    color: #FFFFFF;
    box-shadow: none;
    backdrop-filter: none;
}
.rabuild-theme-switcher.is-docked .rabuild-theme-trigger-kicker {
    color: rgba(255, 255, 255, 0.72);
}
.rabuild-theme-switcher.is-docked .rabuild-theme-trigger-label {
    color: #FFFFFF;
}
.rabuild-theme-switcher.is-docked .rabuild-theme-dot {
    background: #8DE0A0;
    box-shadow: 0 0 0 6px rgba(141, 224, 160, 0.18);
}
.rabuild-theme-switcher.is-docked .rabuild-theme-panel {
    right: 0;
    bottom: auto;
    top: calc(100% + 0.75rem);
}

.rabuild-theme-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    border: 1px solid rgba(220, 229, 214, 0.95);
    background: rgba(255, 255, 255, 0.94);
    color: var(--rabuild-primary);
    border-radius: 999px;
    padding: 0.65rem 0.9rem;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
    backdrop-filter: blur(12px);
}

.rabuild-theme-dot {
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 999px;
    background: var(--rabuild-secondary);
    box-shadow: 0 0 0 6px rgba(58, 90, 64, 0.12);
}

.rabuild-theme-trigger-copy {
    display: grid;
    text-align: left;
    line-height: 1.05;
}

.rabuild-theme-trigger-kicker {
    color: var(--rabuild-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.rabuild-theme-trigger-label {
    margin-top: 0.15rem;
    color: var(--rabuild-primary-2);
    font-size: 0.9rem;
    font-weight: 900;
}

.rabuild-theme-panel {
    position: absolute;
    right: 0;
    bottom: calc(100% + 0.75rem);
    width: min(92vw, 360px);
    border: 1px solid var(--rabuild-border);
    border-radius: 1.25rem;
    background: #FFFFFF;
    color: var(--rabuild-primary-2);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.2);
    padding: 1rem;
}

.rabuild-theme-panel-title {
    font-size: 0.95rem;
    font-weight: 900;
}

.rabuild-theme-panel-copy {
    margin-top: 0.35rem;
    font-size: 0.78rem;
    line-height: 1.5;
    color: var(--rabuild-muted);
}

.rabuild-theme-options {
    display: grid;
    gap: 0.55rem;
    margin-top: 0.9rem;
}

.rabuild-theme-option {
    width: 100%;
    text-align: left;
    border: 1px solid var(--rabuild-border-2);
    background: var(--rabuild-soft-2);
    border-radius: 0.95rem;
    padding: 0.75rem 0.85rem;
    color: var(--rabuild-primary-2);
}

.rabuild-theme-option.is-active {
    border-color: var(--rabuild-secondary);
    background: var(--rabuild-soft);
    box-shadow: inset 0 0 0 1px rgba(58, 90, 64, 0.12);
}

.rabuild-theme-option-name,
.rabuild-theme-option-hint {
    display: block;
}

.rabuild-theme-option-name {
    font-size: 0.9rem;
    font-weight: 900;
}

.rabuild-theme-option-hint {
    margin-top: 0.12rem;
    font-size: 0.73rem;
    color: var(--rabuild-muted);
    font-weight: 700;
}

@media (max-width: 1024px) {
    html[data-rabuild-theme] main,
    html[data-rabuild-theme] .max-w-\[1600px\],
    html[data-rabuild-theme] .max-w-7xl {
        width: 100%;
        max-width: 100% !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    html[data-rabuild-theme] .main-tabs-nav,
    html[data-rabuild-theme] .nav-container {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        justify-content: flex-start !important;
        gap: 0.5rem !important;
        padding-bottom: 0.3rem;
        -webkit-overflow-scrolling: touch;
    }

    html[data-rabuild-theme] .main-step-link,
    html[data-rabuild-theme] .enterprise-main-link,
    html[data-rabuild-theme] .step-link,
    html[data-rabuild-theme] .step-link-external {
        flex: 0 0 auto;
        max-width: min(78vw, 360px);
    }

    html[data-rabuild-theme] .workspace-search-grid {
        grid-template-columns: 1fr !important;
    }

    html[data-rabuild-theme] .workspace-search-field-query {
        min-width: 0 !important;
    }

    html[data-rabuild-theme] .main-tabs-nav.project-cockpit-nav {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        overflow: visible !important;
        gap: 0.65rem !important;
        padding-bottom: 0 !important;
    }

    html[data-rabuild-theme] .project-cockpit-nav .main-step-link {
        max-width: none !important;
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    html[data-rabuild-theme] body {
        overflow-x: hidden;
    }

    html[data-rabuild-theme] .grid {
        min-width: 0;
    }

    html[data-rabuild-theme] table {
        font-size: 0.78rem;
    }

    html[data-rabuild-theme] .overflow-x-auto,
    html[data-rabuild-theme] .report-preview-host {
        -webkit-overflow-scrolling: touch;
    }

    html[data-rabuild-theme] .modal-content,
    html[data-rabuild-theme] .modal > div {
        width: min(96vw, 720px) !important;
        max-width: 96vw !important;
        max-height: 88vh;
        overflow-y: auto;
    }

    html[data-rabuild-theme] .header-menu-container {
        position: static !important;
    }

    html[data-rabuild-theme] .header-menu-dropdown {
        right: 0 !important;
        width: min(92vw, 320px) !important;
    }

    html[data-rabuild-theme] .rabuild-theme-switcher:not(.is-docked) {
        right: 0.75rem;
        bottom: 0.75rem;
    }

    html[data-rabuild-theme] .rabuild-theme-switcher.is-docked {
        right: auto;
        bottom: auto;
    }

    .rabuild-theme-trigger {
        padding: 0.55rem 0.7rem;
    }

    .rabuild-theme-trigger-kicker {
        display: none;
    }

    .rabuild-theme-panel {
        right: 0;
        width: min(92vw, 330px);
    }

    html[data-rabuild-theme] .main-tabs-nav.project-cockpit-nav {
        grid-template-columns: 1fr !important;
    }
}

@media print {
    .rabuild-theme-switcher {
        display: none !important;
    }
}

/* No-italic override (2026-07-24): see cynapse_ui_governance.css for full
   rationale. Forced off here too in case this page loads without the
   shared governance stylesheet. */
html, body, *, *::before, *::after { font-style: normal !important; }


/* Register tables, guidance tiles and panel heads in the dark theme. */
html[data-rabuild-color-theme="dark"] .workspace-kpi-card,
html[data-rabuild-color-theme="dark"] .workspace-action-card,
html[data-rabuild-color-theme="dark"] .workspace-guidance-card {
    background: #17241F !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] .workspace-kpi-card .value,
html[data-rabuild-color-theme="dark"] .workspace-guidance-card .title,
html[data-rabuild-color-theme="dark"] .workspace-action-card .title {
    color: #F6FBF2 !important;
}
/* Enterprise table shells (Filtered Risk Ledger and 3 more): white panel under a
   globally lightened h3 left the title invisible in the dark theme. */
html[data-rabuild-color-theme="dark"] .enterprise-table-shell {
    background: #17241F !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
}
html[data-rabuild-color-theme="dark"] .enterprise-table-head {
    background: #1B2B24 !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
}
html[data-rabuild-color-theme="dark"] .enterprise-table-head h3 { color: #F6FBF2 !important; }
html[data-rabuild-color-theme="dark"] .enterprise-table-head p { color: #C9D6CD !important; }
/* Workspace action cards (Unified Risk Ledger and 26 more): were white on dark. */
html[data-rabuild-color-theme="dark"] .workspace-action-card .copy {
    color: #C9D6CD !important;
}
html[data-rabuild-color-theme="dark"] .workspace-panel-head {
    background: #1B2B24 !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
}
html[data-rabuild-color-theme="dark"] .cy-row-action,
html[data-rabuild-color-theme="dark"] .content-section table td button.text-blue-500,
html[data-rabuild-color-theme="dark"] .content-section table td button.text-blue-600,
html[data-rabuild-color-theme="dark"] .content-section table td button.text-green-600 {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(217, 230, 211, 0.2) !important;
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] .cy-row-action--danger,
html[data-rabuild-color-theme="dark"] .content-section table td button.text-red-500,
html[data-rabuild-color-theme="dark"] .content-section table td button.text-red-600 {
    background: rgba(239, 68, 68, 0.12) !important;
    border-color: rgba(252, 165, 165, 0.35) !important;
    color: #FCA5A5 !important;
}
html[data-rabuild-color-theme="dark"] .enterprise-section-shell {
    background: linear-gradient(180deg, #17241F 0%, #13211B 100%) !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
}
html[data-rabuild-color-theme="dark"] .enterprise-section-shell .heading,
html[data-rabuild-color-theme="dark"] .enterprise-form-head .title {
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] .enterprise-section-shell .label,
html[data-rabuild-color-theme="dark"] .enterprise-form-head .eyebrow,
html[data-rabuild-color-theme="dark"] .enterprise-form-head .desc {
    color: #AFC4B8 !important;
}
html[data-rabuild-color-theme="dark"] .workspace-kpi-card .note,
html[data-rabuild-color-theme="dark"] .workspace-kpi-card .label {
    color: #AFC4B8 !important;
}

/* ---------------------------------------------------------------------------
   UI review 2026-10-19: dark theme completion. The first pass only darkened the
   named shells; module markup is Tailwind with arbitrary light colours
   (bg-[#F8FCF4], text-[#17352B] ...) which stayed light, leaving white islands
   and dark-on-dark text. Measured with the dark audit crawl (51 screens).
   Drawing canvases (Purdue board, architecture designer) stay light on purpose:
   they are exported as images, so ink inside them is restored instead.
   --------------------------------------------------------------------------- */
html[data-rabuild-color-theme="dark"] [class*="bg-[#F"]:not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] [class*="bg-[#E"]:not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] .bg-green-50,
html[data-rabuild-color-theme="dark"] .bg-emerald-50,
html[data-rabuild-color-theme="dark"] .cy-card,
html[data-rabuild-color-theme="dark"] .ops-banner,
html[data-rabuild-color-theme="dark"] details.cy-about-step,
html[data-rabuild-color-theme="dark"] .workspace-mode-toggle,
html[data-rabuild-color-theme="dark"] .header-menu-button,
html[data-rabuild-color-theme="dark"] .header-menu-dropdown,
html[data-rabuild-color-theme="dark"] .pd-appbar .logo-container {
    background: #1A2C25 !important;
    border-color: rgba(217, 230, 211, 0.16) !important;
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] .pd-appbar .logo-container { background: #F6FBF2 !important; }
html[data-rabuild-color-theme="dark"] .header-menu-button:hover,
html[data-rabuild-color-theme="dark"] .header-menu-dropdown a:hover,
html[data-rabuild-color-theme="dark"] .header-menu-dropdown button:hover { background: #243B32 !important; }
html[data-rabuild-color-theme="dark"] .header-menu-dropdown a,
html[data-rabuild-color-theme="dark"] .header-menu-dropdown button { color: #F6FBF2 !important; }
html[data-rabuild-color-theme="dark"] .pd-appbar-title { border-color: rgba(217, 230, 211, 0.16); }

/* Dark ink written as arbitrary Tailwind colours. */
html[data-rabuild-color-theme="dark"] [class*="text-[#1"]:not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] [class*="text-[#2"]:not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] .text-gray-800,
html[data-rabuild-color-theme="dark"] .text-gray-900,
html[data-rabuild-color-theme="dark"] .workspace-kpi .value,
html[data-rabuild-color-theme="dark"] .workflow-step .step-title,
html[data-rabuild-color-theme="dark"] .ops-banner .headline,
html[data-rabuild-color-theme="dark"] .pd-menu-user b,
html[data-rabuild-color-theme="dark"] details.cy-about-step > summary,
html[data-rabuild-color-theme="dark"] .rabuild-theme-trigger-label {
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] [class*="text-[#3"]:not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] [class*="text-[#4"]:not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] .text-green-700,
html[data-rabuild-color-theme="dark"] .text-green-800 { color: #A9D8B4 !important; }

/* Muted text: one readable tone (#AFC4B8 is 8:1 on #17241F). */
html[data-rabuild-color-theme="dark"] .text-gray-400,
html[data-rabuild-color-theme="dark"] .workspace-search-label,
html[data-rabuild-color-theme="dark"] .workspace-panel-head p,
html[data-rabuild-color-theme="dark"] .workspace-panel-head .copy,
html[data-rabuild-color-theme="dark"] .risk-kpi-card .label,
html[data-rabuild-color-theme="dark"] .risk-kpi-card .note,
html[data-rabuild-color-theme="dark"] .workspace-kpi .note,
html[data-rabuild-color-theme="dark"] .workflow-step .step-copy,
html[data-rabuild-color-theme="dark"] .ops-banner .kicker,
html[data-rabuild-color-theme="dark"] .ops-banner .subcopy,
html[data-rabuild-color-theme="dark"] .enterprise-field label,
html[data-rabuild-color-theme="dark"] .pd-appbar-eyebrow,
html[data-rabuild-color-theme="dark"] .pd-menu-user,
html[data-rabuild-color-theme="dark"] .cy-about-step__hint,
html[data-rabuild-color-theme="dark"] .rabuild-theme-trigger-kicker {
    color: #AFC4B8 !important;
}
html[data-rabuild-color-theme="dark"] details.cy-about-step > summary::before { color: #8FB89B; }

/* Outline secondary and danger buttons (project_details.html, review round). */
html[data-rabuild-color-theme="dark"] .btn-secondary:hover { background: #243B32 !important; }
html[data-rabuild-color-theme="dark"] .content-section button.bg-red-600,
html[data-rabuild-color-theme="dark"] .content-section button.bg-red-500,
html[data-rabuild-color-theme="dark"] #bulk-delete-btn {
    background: transparent !important;
    border-color: rgba(255, 155, 143, 0.55) !important;
    color: #FFB4AA !important;
}

/* Light drawing canvases keep light-theme ink. */
html[data-rabuild-color-theme="dark"] .purdue-board-shell,
html[data-rabuild-color-theme="dark"] .arch-designer-shell { color: #17352B; }
html[data-rabuild-color-theme="dark"] .purdue-board-shell :is(.font-bold, .font-extrabold, .font-black, h3, h4, [class*="text-[#"]),
html[data-rabuild-color-theme="dark"] .arch-designer-shell :is(.font-bold, .font-extrabold, .font-black, h3, h4, [class*="text-[#"]) {
    color: #17352B !important;
}
html[data-rabuild-color-theme="dark"] .purdue-board-shell :is(.text-gray-500, .text-gray-600, .text-gray-700),
html[data-rabuild-color-theme="dark"] .arch-designer-shell :is(.text-gray-500, .text-gray-600, .text-gray-700) {
    color: #4B5B53 !important;
}

/* Cards that set their own white or pastel background (classes and inline styles). */
html[data-rabuild-color-theme="dark"] .vtc-stage,
html[data-rabuild-color-theme="dark"] .residual-snapshot-item,
html[data-rabuild-color-theme="dark"] .enterprise-mini-card,
html[data-rabuild-color-theme="dark"] .insight-card,
html[data-rabuild-color-theme="dark"] .bg-blue-50,
html[data-rabuild-color-theme="dark"] .bg-amber-50,
html[data-rabuild-color-theme="dark"] .bg-yellow-50,
html[data-rabuild-color-theme="dark"] .bg-red-50,
html[data-rabuild-color-theme="dark"] :is([style*="background:#F"], [style*="background: #F"], [style*="background-color:#F"], [style*="background-color: #F"], [style*="background:#f"], [style*="background: #f"], [style*="background:#E"], [style*="background: #E"]):not(:is(.purdue-board-shell, .arch-designer-shell) *) {
    background: #1A2C25 !important;
    border-color: rgba(217, 230, 211, 0.16) !important;
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] :is([style*="color:#1"], [style*="color: #1"], [style*="color:#2"], [style*="color: #2"]):not([style*="background"]):not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] .risk-kpi-card .value,
html[data-rabuild-color-theme="dark"] .workspace-step-list,
html[data-rabuild-color-theme="dark"] .workspace-step-list li {
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] .workspace-guidance-card .eyebrow,
html[data-rabuild-color-theme="dark"] .cy-cs-empty { color: #AFC4B8 !important; }

/* Status pills keep their light tint; their ink stays dark so the colour still reads. */
html[data-rabuild-color-theme="dark"] :is(.bg-red-100, .bg-green-100, .bg-emerald-100, .bg-amber-100, .bg-yellow-100, .bg-orange-100, .bg-blue-100, .bg-sky-100, .bg-purple-100, .bg-indigo-100),
html[data-rabuild-color-theme="dark"] :is(.bg-red-100, .bg-green-100, .bg-emerald-100, .bg-amber-100, .bg-yellow-100, .bg-orange-100, .bg-blue-100, .bg-sky-100, .bg-purple-100, .bg-indigo-100) * {
    color: #1F2A24 !important;
}

html[data-rabuild-color-theme="dark"] .enterprise-mini-card .title,
html[data-rabuild-color-theme="dark"] .enterprise-field p,
html[data-rabuild-color-theme="dark"] .enterprise-field .hint,
html[data-rabuild-color-theme="dark"] :is(.cy-cs-loading, .cy-cs-empty, .cy-tree-empty) { color: #AFC4B8 !important; }
html[data-rabuild-color-theme="dark"] .enterprise-mini-card .text { color: #F6FBF2 !important; }
html[data-rabuild-color-theme="dark"] :is(.text-amber-700, .text-amber-800, .text-amber-900, .text-yellow-800, .text-orange-700):not(:is(.bg-amber-100, .bg-yellow-100, .bg-orange-100) *):not(.bg-amber-100, .bg-yellow-100, .bg-orange-100) { color: #F5C77E !important; }
html[data-rabuild-color-theme="dark"] :is(.text-red-700, .text-red-800):not(:is(.bg-red-100) *):not(.bg-red-100) { color: #FFB4AA !important; }
html[data-rabuild-color-theme="dark"] .cy-accordion-body [class*="bg-[#F"] .text-gray-500,
html[data-rabuild-color-theme="dark"] .cy-accordion-section,
html[data-rabuild-color-theme="dark"] .accordion-button,
html[data-rabuild-color-theme="dark"] .cy-tree,
html[data-rabuild-color-theme="dark"] [id^="overview-tree-"] { background-color: #1A2C25 !important; color: #F6FBF2; }
/* Suggestion severity text (inline amber/green) brightened for the dark card. */
html[data-rabuild-color-theme="dark"] .cy-accordion-section [style*="color:#B45309"],
html[data-rabuild-color-theme="dark"] .cy-accordion-section [style*="color: #B45309"] { color: #F5C77E !important; }
html[data-rabuild-color-theme="dark"] .cy-accordion-title { color: #F6FBF2 !important; }
html[data-rabuild-color-theme="dark"] [class*="text-[#6"]:not(:is(.purdue-board-shell, .arch-designer-shell) *),
html[data-rabuild-color-theme="dark"] .enterprise-field small,
html[data-rabuild-color-theme="dark"] .enterprise-field .text-gray-500 { color: #AFC4B8 !important; }
html[data-rabuild-color-theme="dark"] :is(.text-blue-600, .text-blue-700) { color: #93C5FD !important; }
/* Buttons forced white with !bg-white keep their dark ink. */
html[data-rabuild-color-theme="dark"] [class*="!bg-white"][class*="!bg-white"]:not(.x-specificity) { color: #1D2E28 !important; }
html[data-rabuild-color-theme="dark"] .cy-accordion-insight { color: #A9D8B4 !important; }
html[data-rabuild-color-theme="dark"] .cy-suggestions-title,
html[data-rabuild-color-theme="dark"] .cy-suggestions-insight { color: #F5C77E !important; }
html[data-rabuild-color-theme="dark"] .bg-slate-50 { background: #1A2C25 !important; }
/* White on Tailwind red-500 is 3.8:1 in both themes; use red-700 for severity chips. */
.bg-red-500.text-white:not(button) { background-color: #B91C1C !important; }
html[data-rabuild-color-theme="dark"] :is([class*="bg-white/"], .bg-gradient-to-br.from-white, .bg-gradient-to-r.from-white):not(:is(.purdue-board-shell, .arch-designer-shell) *) {
    background: #1A2C25 !important;
    border-color: rgba(217, 230, 211, 0.16) !important;
}
html[data-rabuild-color-theme="dark"] #zone-controls-select { color: #F6FBF2 !important; }

/* Project & Business Description workspace (project_details.html .pd-*) */
html[data-rabuild-color-theme="dark"] .pd-workspace {
    --pd-ink: #F6FBF2;
    --pd-ink-2: #D5E4DA;
    --pd-muted: #A5BBAE;
    --pd-line: rgba(217, 230, 211, 0.14);
    --pd-line-strong: rgba(217, 230, 211, 0.24);
    --pd-surface: #17241F;
    --pd-surface-2: #1B2B24;
    --pd-accent: #8FD3A6;
    --pd-accent-soft: rgba(143, 211, 166, 0.14);
    --pd-ok: #7BC995;
    --pd-ok-soft: rgba(123, 201, 149, 0.16);
    --pd-warn: #F2B866;
    --pd-warn-soft: rgba(242, 184, 102, 0.14);
    --pd-focus: rgba(143, 211, 166, 0.3);
}
html[data-rabuild-color-theme="dark"] .pd-actionbar {
    background: rgba(23, 36, 31, 0.94);
}
html[data-rabuild-color-theme="dark"] .pd-btn--primary {
    color: #0F241D;
}
html[data-rabuild-color-theme="dark"] .pd-btn--primary:hover:not(:disabled) {
    background: #A6DDB8;
}
html[data-rabuild-color-theme="dark"] .pd-kbd {
    background: rgba(15, 36, 29, 0.18);
    color: #0F241D;
}
html[data-rabuild-color-theme="dark"] .pd-input,
html[data-rabuild-color-theme="dark"] .pd-textarea--doc {
    background: #13201B !important;
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] .pd-draft-banner,
html[data-rabuild-color-theme="dark"] .pd-link-btn {
    color: #F2D3A4;
}
html[data-rabuild-color-theme="dark"] .pd-draft-banner {
    border-color: rgba(242, 184, 102, 0.35);
}
html[data-rabuild-color-theme="dark"] .pd-tol[aria-checked="true"] {
    background: rgba(255, 255, 255, 0.06);
}
/* UI review 2026-10-23: tolerance band text and the HLRA matrix labels were
   below 3:1 on the dark panels. */
html[data-rabuild-color-theme="dark"] .pd-tol[data-tone="minor"] { --pd-tone: #6EE7A0; }
html[data-rabuild-color-theme="dark"] .pd-tol[data-tone="low"] { --pd-tone: #9BD8A6; }
html[data-rabuild-color-theme="dark"] .pd-tol[data-tone="moderate"] { --pd-tone: #F5C451; }
html[data-rabuild-color-theme="dark"] .pd-tol[data-tone="high"] { --pd-tone: #FDA06B; }
html[data-rabuild-color-theme="dark"] .pd-tol[data-tone="critical"] { --pd-tone: #FCA5A5; }
html[data-rabuild-color-theme="dark"] .cy-risk-grid__corner,
html[data-rabuild-color-theme="dark"] .cy-risk-grid__axis span,
html[data-rabuild-color-theme="dark"] .cy-risk-grid__legend,
html[data-rabuild-color-theme="dark"] .hlra-matrix-size { color: #B9C7BF !important; }
html[data-rabuild-color-theme="dark"] .cy-risk-grid__axis { color: #E5EEE8 !important; }

/* Attack Scenario Visualizer (2026-10-22) */
html[data-rabuild-color-theme="dark"] .asv-item,
html[data-rabuild-color-theme="dark"] .asv-card {
    background: #17241F !important;
    border-color: rgba(217, 230, 211, 0.14) !important;
    color: #F6FBF2 !important;
}
html[data-rabuild-color-theme="dark"] .asv-item[class*="asv-level-"] { border-left-color: var(--asv-c) !important; }
html[data-rabuild-color-theme="dark"] .asv-item:hover,
html[data-rabuild-color-theme="dark"] .asv-item.is-active { background: #1F3129 !important; border-color: #B7D3A8 !important; }
html[data-rabuild-color-theme="dark"] .asv-item .asv-item-title,
html[data-rabuild-color-theme="dark"] .asv-head h3,
html[data-rabuild-color-theme="dark"] .asv-step b,
html[data-rabuild-color-theme="dark"] .asv-card .text-\[\#17352B\] { color: #F6FBF2 !important; }
html[data-rabuild-color-theme="dark"] .asv-item .asv-item-meta,
html[data-rabuild-color-theme="dark"] .asv-head p,
html[data-rabuild-color-theme="dark"] .asv-card dt,
html[data-rabuild-color-theme="dark"] .asv-step .asv-step-detail { color: #B9C7BF !important; }
html[data-rabuild-color-theme="dark"] .asv-card dd,
html[data-rabuild-color-theme="dark"] .asv-card ul,
html[data-rabuild-color-theme="dark"] .asv-card p { color: #E5EDE7 !important; }
html[data-rabuild-color-theme="dark"] .asv-graph { background: #13211B !important; border-color: rgba(217, 230, 211, 0.14) !important; }
html[data-rabuild-color-theme="dark"] .asv-step .asv-interrupt { color: #86EFAC !important; }
html[data-rabuild-color-theme="dark"] .asv-badge.asv-soft { background: #1F3129 !important; color: #D9E6D3 !important; border-color: rgba(217, 230, 211, 0.2) !important; }
html[data-rabuild-color-theme="dark"] .asv-step-zone { --asv-step: #2E6A50; }

/* Exposure Engine bridge badges (Assets > Exposure Engine Scans, P1.1) */
html[data-rabuild-color-theme="dark"] .cy-ee-pill { background: #1F3129 !important; color: #D9E6D3 !important; border-color: rgba(217, 230, 211, 0.25) !important; }
html[data-rabuild-color-theme="dark"] .cy-ee-pill.text-\[\#9B1C1C\] { background: #3A1717 !important; color: #FCA5A5 !important; border-color: rgba(252, 165, 165, 0.35) !important; }
html[data-rabuild-color-theme="dark"] .cy-ee-pill.text-\[\#8A5A00\] { background: #3A2E12 !important; color: #FCD34D !important; border-color: rgba(252, 211, 77, 0.35) !important; }
html[data-rabuild-color-theme="dark"] #asset-exposure-host .bg-\[\#F8FCF4\] { background: #17241E !important; }

/* Framework Crosswalk (P1.4) */
.cy-cw-bar { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: #E5ECE1; min-width: 160px; }
.cy-cw-bar-direct { background: #2F6B4F; }
.cy-cw-bar-derived { background: #9CCB86; }
.cy-cw-key { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.cy-cw-hub { display: inline-block; font-weight: 800; font-size: 11px; padding: 1px 7px; border-radius: 999px; border: 1px solid #CFE0C6; background: #F2F8EE; color: #17352B; }
html[data-rabuild-color-theme="dark"] .cy-cw-bar { background: #26352D; }
html[data-rabuild-color-theme="dark"] .cy-cw-bar-direct { background: #6FBF8E; }
html[data-rabuild-color-theme="dark"] .cy-cw-bar-derived { background: #3E6B50; }
html[data-rabuild-color-theme="dark"] .cy-cw-hub { background: #1F3129; color: #D9E6D3; border-color: rgba(217, 230, 211, 0.25); }

/* Roadmap P1.9: data-first module layouts (project_details_datafirst.js) */
.cy-df-stack.grid { grid-template-columns: minmax(0, 1fr) !important; }
.cy-df-addbar { display: flex; justify-content: flex-end; margin: 0 0 10px; }
.cy-df-add { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 14px; border-radius: 10px; border: 1px solid #1D3A2E; background: #1D3A2E; color: #fff; font-size: 13px; font-weight: 700; }
.cy-df-add:hover { background: #2A5040; }
.cy-df-add:focus-visible { outline: 2px solid #6BAF7F; outline-offset: 2px; }
.cy-guidance-fold { margin: 0 0 16px; border: 1px solid #DCE7D4; border-radius: 14px; background: #FBFDF9; }
.cy-guidance-fold > summary { display: flex; align-items: center; gap: 8px; padding: 10px 14px; cursor: pointer; list-style: none; color: #355447; font-size: 13px; font-weight: 700; }
.cy-guidance-fold > summary::-webkit-details-marker { display: none; }
.cy-guidance-fold > summary::after { content: '+'; margin-left: auto; font-weight: 800; }
.cy-guidance-fold[open] > summary::after { content: '\2212'; }
.cy-guidance-fold[open] > summary { border-bottom: 1px solid #E3EBDD; }
.cy-guidance-fold > :not(summary) { margin: 12px; }
html[data-rabuild-color-theme="dark"] .cy-guidance-fold { background: #17231D; border-color: rgba(217, 230, 211, 0.18); }
html[data-rabuild-color-theme="dark"] .cy-guidance-fold > summary { color: #D3E2CF; }
html[data-rabuild-color-theme="dark"] .cy-guidance-fold[open] > summary { border-color: rgba(217, 230, 211, 0.14); }
html[data-rabuild-color-theme="dark"] .cy-df-add { background: #3F7A57; border-color: #3F7A57; }
.workspace-panel-head:has(> .cy-df-addbar--head) { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 4px 16px; }
.workspace-panel-head:has(> .cy-df-addbar--head) > :first-child, .workspace-panel-head:has(> .cy-df-addbar--head) > p { flex: 1 1 60%; }
.cy-df-addbar--head { order: 2; margin: 0 0 0 auto; }
.cy-df-data > .cy-guidance-fold { margin-top: 16px; }

/* Roadmap P2.9: project home status page (project_details_status.js) */
.pd-status { margin: 24px 0; padding: 24px; border: 1px solid #DCE7D4; border-radius: 24px; background: #fff; }
.pd-status-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.pd-status-eyebrow { font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #5A6B62; }
.pd-status-title { margin: 4px 0 0; font-size: 1.5rem; font-weight: 800; color: #17352B; }
.pd-status-muted { color: #5A6B62; font-size: 13px; }
.pd-status-error { color: #B42318; font-size: 14px; }
.pd-status-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.pd-status-kpi { padding: 14px 16px; border: 1px solid #DCE7D4; border-radius: 16px; background: #FBFDF9; }
.pd-status-kpi.is-alert { border-color: #F3C4C4; background: #FFF7F6; }
.pd-status-kpi .label { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #5A6B62; }
.pd-status-kpi .value { margin-top: 4px; font-size: 28px; font-weight: 800; color: #17352B; }
.pd-status-kpi.is-alert .value { color: #B42318; }
.pd-status-kpi .note { font-size: 12px; color: #5A6B62; }
.pd-status-next { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 16px 0; padding: 16px 18px; border-radius: 18px; background: #1D3A2E; color: #fff; }
.pd-status-next .pd-status-eyebrow { color: #B9D7C8; }
.pd-status-next-title { margin-top: 2px; font-size: 1.05rem; font-weight: 800; }
.pd-status-next-copy { margin-top: 2px; font-size: 13px; color: #D3E2CF; }
.pd-status-next .btn-primary { background: #fff; color: #1D3A2E; border-color: #fff; }
.pd-status-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
@media (max-width: 1100px) { .pd-status-grid { grid-template-columns: minmax(0, 1fr); } }
.pd-status-side { display: grid; gap: 16px; align-content: start; }
.pd-status-card { padding: 16px; border: 1px solid #DCE7D4; border-radius: 18px; background: #fff; }
.pd-status-card h3 { margin: 0 0 10px; font-size: 1rem; font-weight: 800; color: #17352B; }
.pd-status-zcrs { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.pd-status-zcr { display: grid; grid-template-columns: minmax(0, 1fr) 110px 44px 64px; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: #FBFDF9; }
.pd-status-zcr-title { font-size: 13px; font-weight: 700; color: #17352B; }
.pd-status-zcr-id { display: inline-block; min-width: 54px; margin-right: 6px; font-weight: 800; color: #355447; }
.pd-status-zcr-open { margin-top: 2px; font-size: 12px; color: #5A6B62; }
.pd-status-bar { height: 8px; border-radius: 999px; background: #E3EBDD; overflow: hidden; }
.pd-status-bar span { display: block; height: 100%; border-radius: 999px; background: #B7791F; }
.pd-status-zcr--met .pd-status-bar span { background: #2F855A; }
.pd-status-zcr--open .pd-status-bar span { background: #C53030; }
.pd-status-zcr-score { font-size: 13px; font-weight: 800; color: #17352B; text-align: right; }
.pd-status-ok { font-size: 12px; font-weight: 700; color: #2F855A; }
.pd-status-table { width: 100%; font-size: 13px; border-collapse: collapse; }
.pd-status-table th { padding: 6px 8px; text-align: left; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #5A6B62; border-bottom: 1px solid #DCE7D4; }
.pd-status-table td { padding: 8px; vertical-align: top; border-bottom: 1px solid #EEF3EA; color: #2A3B33; }
.pd-status-late { font-size: 12px; font-weight: 700; color: #B42318; }
.pd-status-flag { display: inline-block; padding: 2px 8px; border-radius: 999px; background: #FDE8E8; color: #B42318; font-size: 12px; font-weight: 700; }
.pd-status-level { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; background: #EEF3EA; color: #2A3B33; }
.pd-status-level--minor { background: #E6F4EA; color: #276749; }
.pd-status-level--low { background: #E6F6F4; color: #23645C; }
.pd-status-level--moderate { background: #FEF3C7; color: #8A5A00; }
.pd-status-level--high { background: #FDE7D4; color: #9C4210; }
.pd-status-level--critical { background: #FDE8E8; color: #B42318; }
.pd-status-gaps { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; font-size: 13px; }
.pd-status-gaps li { display: flex; justify-content: space-between; gap: 12px; padding: 6px 10px; border-radius: 10px; background: #FBFDF9; color: #2A3B33; }
html[data-rabuild-color-theme="dark"] .pd-status, html[data-rabuild-color-theme="dark"] .pd-status-card { background: #13201A; border-color: rgba(217, 230, 211, 0.16); }
html[data-rabuild-color-theme="dark"] .pd-status-kpi, html[data-rabuild-color-theme="dark"] .pd-status-zcr, html[data-rabuild-color-theme="dark"] .pd-status-gaps li { background: #17231D; border-color: rgba(217, 230, 211, 0.16); }
html[data-rabuild-color-theme="dark"] .pd-status-kpi.is-alert { background: #2A1716; border-color: rgba(243, 196, 196, 0.3); }
html[data-rabuild-color-theme="dark"] .pd-status-title, html[data-rabuild-color-theme="dark"] .pd-status-card h3, html[data-rabuild-color-theme="dark"] .pd-status-kpi .value,
html[data-rabuild-color-theme="dark"] .pd-status-zcr-title, html[data-rabuild-color-theme="dark"] .pd-status-zcr-score { color: #E3EEDD; }
html[data-rabuild-color-theme="dark"] .pd-status-kpi.is-alert .value, html[data-rabuild-color-theme="dark"] .pd-status-late { color: #F4A9A0; }
html[data-rabuild-color-theme="dark"] .pd-status-eyebrow, html[data-rabuild-color-theme="dark"] .pd-status-muted, html[data-rabuild-color-theme="dark"] .pd-status-kpi .label,
html[data-rabuild-color-theme="dark"] .pd-status-kpi .note, html[data-rabuild-color-theme="dark"] .pd-status-zcr-open, html[data-rabuild-color-theme="dark"] .pd-status-table th { color: #AFC4B8; }
html[data-rabuild-color-theme="dark"] .pd-status-zcr-id { color: #8FB89B; }
html[data-rabuild-color-theme="dark"] .pd-status-table td, html[data-rabuild-color-theme="dark"] .pd-status-gaps li { color: #D3E2CF; border-color: rgba(217, 230, 211, 0.12); }
html[data-rabuild-color-theme="dark"] .pd-status-bar { background: rgba(217, 230, 211, 0.14); }
html[data-rabuild-color-theme="dark"] .pd-status-next { background: #244A39; }
.pd-status-flag, .pd-status-level, .pd-status-table td:nth-child(3) { white-space: nowrap; }

/* Roadmap P2.8: Controls Hub and Risk Overview tab strips (project_details_hubs.js) */
.cy-hub-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 16px; padding: 6px; border: 1px solid #DCE7D4; border-radius: 16px; background: #F6FAF3; }
.cy-hub-tabs-label { display: inline-flex; align-items: center; gap: 8px; padding: 0 10px 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #355447; }
.cy-hub-tab { min-height: 34px; padding: 0 14px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: #2A3B33; font-size: 13px; font-weight: 700; }
.cy-hub-tab:hover { background: #fff; border-color: #DCE7D4; }
.cy-hub-tab.is-active { background: #1D3A2E; border-color: #1D3A2E; color: #fff; }
.cy-hub-tab:focus-visible { outline: 2px solid #6BAF7F; outline-offset: 2px; }
.cy-hub-pill { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
html[data-rabuild-color-theme="dark"] .cy-hub-tabs { background: #17231D; border-color: rgba(217, 230, 211, 0.16); }
html[data-rabuild-color-theme="dark"] .cy-hub-tabs-label { color: #AFC4B8; }
html[data-rabuild-color-theme="dark"] .cy-hub-tab { color: #D3E2CF; }
html[data-rabuild-color-theme="dark"] .cy-hub-tab:hover { background: #13201A; border-color: rgba(217, 230, 211, 0.16); }
html[data-rabuild-color-theme="dark"] .cy-hub-tab.is-active { background: #3F7A57; border-color: #3F7A57; color: #fff; }

/* Project status fold (2026-10-25): sits under the sub-tab bar, folded by default */
.pd-status.is-folded { padding: 14px 20px; }
.pd-status.is-folded .pd-status-head { margin-bottom: 0; }
.pd-status-head { align-items: center; }
.pd-status-toggle { display: flex; align-items: center; gap: 14px; flex: 1 1 420px; min-width: 0; padding: 0; border: 0; background: none; text-align: left; cursor: pointer; color: inherit; }
.pd-status-toggle:focus-visible { outline: 2px solid #2C5F4B; outline-offset: 4px; border-radius: 10px; }
.pd-status-toggle-copy { display: grid; gap: 2px; min-width: 0; }
.pd-status.is-folded .pd-status-title { font-size: 1.1rem; }
.pd-status-summary { color: #3B4D44; font-size: 13.5px; font-weight: 600; }
.pd-status-chevron { margin-left: auto; color: #5A6B62; transition: transform .2s ease; }
.pd-status:not(.is-folded) .pd-status-chevron { transform: rotate(180deg); }
.pd-status-dot { position: relative; flex: none; width: 14px; height: 14px; border-radius: 999px; background: #9DB0A6; }
.pd-status-dot.is-ok { background: #2E9E5B; }
.pd-status-dot.is-attention { background: #F28B00; }
.pd-status-dot.is-ok::after, .pd-status-dot.is-attention::after { content: ""; position: absolute; inset: -5px; border-radius: 999px; border: 3px solid currentColor; opacity: 0; animation: pd-status-pulse 1.6s ease-out infinite; }
.pd-status-dot.is-ok::after { color: rgba(46, 158, 91, .55); }
.pd-status-dot.is-attention::after { color: rgba(242, 139, 0, .6); }
.pd-status:not(.is-folded) .pd-status-dot::after { animation: none; }
@keyframes pd-status-pulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(1.6); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pd-status-dot::after { animation: none !important; } }
html.ds-lite .pd-status-dot::after { animation: none; }
html[data-rabuild-color-theme="dark"] .pd-status-summary { color: #C5D3CB; }
html[data-rabuild-color-theme="dark"] .pd-status-chevron { color: #9DB0A6; }

/* Security/UX review 2026-10-27: pastel status pills (bg-[#D...]) are not caught
   by the bg-[#F/E...] dark rule while their dark ink is turned light, which left
   "Closed", "Verified", "Approved" unreadable (contrast 1.06). */
html[data-rabuild-color-theme="dark"] [class*="bg-[#D9FBE6]"],
html[data-rabuild-color-theme="dark"] [class*="bg-[#DCEFD0]"],
html[data-rabuild-color-theme="dark"] [class*="bg-[#DCEDCB]"],
html[data-rabuild-color-theme="dark"] [class*="bg-[#DCE7D4]"] { background: #1F4A33 !important; color: #BDF0CF !important; }
html[data-rabuild-color-theme="dark"] [class*="bg-[#DBEAFE]"] { background: #1E3354 !important; color: #BFDBFE !important; }

/* CS Procedures workspace (project_details_validation.css) kept white panels in
   the dark theme while its headings turned light: invisible card titles. */
html[data-rabuild-color-theme="dark"] :is(.cspx-toolbar, .cspx-block) { background: #1A2C25; border-color: rgba(217, 230, 211, 0.16); }
html[data-rabuild-color-theme="dark"] .cspx-card { background: #15241E; border-color: rgba(217, 230, 211, 0.14); }
html[data-rabuild-color-theme="dark"] :is(.cspx-block__head h3, .cspx-card__head h4, .cspx-signal strong) { color: #F6FBF2; }
html[data-rabuild-color-theme="dark"] :is(.cspx-signal span, .cspx-block__eyebrow, .cspx-save-status, .cspx-overwrite-toggle) { color: #AFC4B8; }
html[data-rabuild-color-theme="dark"] .cspx-standards-tag { background: #244A39; color: #CFE3D5; }
html[data-rabuild-color-theme="dark"] .cspx-block__body { border-top-color: rgba(217, 230, 211, 0.12); }