/*
 * Hybrid B1 shell reskin.
 * Deliberately scoped away from fixed plan content inside #emergency-plan-content
 * and #plan-container; those documents retain their own print/native styling.
 */
:root {
  --b1-navy: #102331;
  --b1-sidebar: #0B1A26;
  --b1-panel: #17252E;
  --b1-panel-raised: #243647;
  --b1-orange: #F28A40;
  --b1-white: #FFFFFF;
  --b1-bg: #EDF1F4;
  --b1-secondary: #F3F6F8;
  --b1-border: #D9E2E9;
  --b1-body: #102331;
  --b1-body-deep: #14232E;
  --b1-muted: #4A6172;
  --b1-teal: #2FBFA5;
  --b1-amber: #E8A33D;
  --b1-red: #DE6A58;
  --b1-font-body: "Manrope", sans-serif;
  --b1-font-heading: "Archivo", sans-serif;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) {
  --color-coal: var(--b1-navy);
  --color-white: var(--b1-white);
  --color-haze: var(--b1-border);
  --color-gold: var(--b1-amber);
  --color-sunset: var(--b1-orange);
  --color-olive: var(--b1-teal);
  --color-mist: var(--b1-border);
  --color-cloud: var(--b1-bg);
  --color-snow: var(--b1-secondary);
  --color-flame: var(--b1-red);
  --color-slate: var(--b1-muted);
  --font-family-primary: var(--b1-font-body);
  --font-family-secondary: var(--b1-font-body);
  --font-family-heading: var(--b1-font-heading);
  color: var(--b1-body);
  background-color: var(--b1-bg);
  font-family: var(--b1-font-body) !important;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) :is(button, input, select, textarea, p, span, div, a, label, form, li, td, th, .font-primary, .font-secondary, .font-family-primary, .text-sm) {
  font-family: var(--b1-font-body) !important;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) :is(h1, h2, h3, h4, h5, h6, .font-heading) {
  color: var(--b1-navy);
  font-family: var(--b1-font-heading) !important;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.text-coal, .text-brand-coal, .text-gray-600) {
  color: var(--b1-body);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.text-slate, .text-brand-slate, .text-gray-500, .text-gray-400) {
  color: var(--b1-muted);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) :is(.text-brand-slate, .text-slate, .text-gray-400, .text-gray-500, .text-gray-600):not(.bg-coal *):not(.bg-brand-coal *):not(#plan-container *):not(.page-wrapper *) {
  color: #4A6172 !important;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.bg-gray-100, .bg-brand-haze, .bg-cloud, .bg-haze, .bg-mist, .bg-snow) {
  background-color: var(--b1-bg);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.bg-gray-200, .bg-brand-mist) {
  background-color: var(--b1-secondary);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.border-gray-200, .border-gray-300, .border-brand-haze, .border-haze, .border-mist) {
  border-color: var(--b1-border);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .border-green-600 {
  border-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .border-yellow-600 {
  border-color: var(--b1-amber);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .border-red-600 {
  border-color: var(--b1-red);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.text-sunset, .text-brand-sunset, .text-gold, .text-brand-gold, .text-blue-500, .text-blue-600) {
  color: var(--b1-muted);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.text-gold, .text-brand-gold) {
  color: var(--b1-amber);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.text-olive, .text-brand-olive) {
  color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.text-flame, .text-brand-flame) {
  color: var(--b1-red);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.border-sunset, .border-brand-sunset, .border-gold, .border-brand-gold) {
  border-color: var(--b1-border);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.bg-olive, .bg-brand-olive) {
  background-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.bg-gold, .bg-brand-gold) {
  background-color: var(--b1-secondary);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.bg-sunset, .bg-brand-sunset, .bg-blue-500, .bg-blue-600) {
  background-color: var(--b1-secondary);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.bg-flame, .bg-brand-flame) {
  background-color: var(--b1-red);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .dashboard-container {
  background-color: var(--b1-bg);
  color: var(--b1-body);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.bg-coal, .bg-brand-coal, .bg-black) {
  color: var(--b1-white);
  background-color: var(--b1-panel);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) a:hover {
  color: var(--b1-muted);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :focus-visible {
  outline-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) :is(a, button, input, select, textarea, summary, [role="button"]):not(#plan-container *):not(.page-wrapper *):focus-visible {
  outline-color: #2FBFA5 !important;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :focus {
  --tw-ring-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) a[style*="color: var(--color-sunset)"]:not([style*="background"]):not(.bg-coal *):not(.bg-brand-coal *):not(#plan-container *):not(.page-wrapper *) {
  color: #4A6172 !important;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) a:not(#plan-container *):not(.page-wrapper *):hover {
  text-decoration-color: #4A6172 !important;
}

body.prepcompass-app .sidebar,
body.prepcompass-app .sidebar.mobile-header {
  background-color: var(--b1-sidebar);
  color: var(--b1-white);
}

body.prepcompass-app .sidebar a {
  color: var(--b1-white);
}

body.prepcompass-app .sidebar a:hover {
  color: var(--b1-white);
  background-color: rgba(255, 255, 255, .09);
}

body.prepcompass-app .sidebar a.active {
  color: var(--b1-white);
  background-color: rgba(242, 138, 64, .13);
  box-shadow: inset 3px 0 0 var(--b1-orange);
}

body.prepcompass-app .sidebar a.active svg {
  color: var(--b1-orange);
  stroke: var(--b1-orange);
}

body.prepcompass-app .sidebar a.active:hover {
  color: var(--b1-white);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .dashboard-content {
  background-color: var(--b1-bg);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.badge, [class*="-badge"], .count-pill) {
  color: var(--b1-muted);
  background-color: var(--b1-secondary);
  border-color: var(--b1-border);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .pc-connections {
  --pc-ink: #102331;
  --pc-muted: #4A6172;
  --pc-paper: #F3F6F8;
  --pc-line: #D9E2E9;
  --pc-olive: #2FBFA5;
  --pc-sun: #E8A33D;
  --pc-danger: #DE6A58;
  color: #102331;
  font-family: "Manrope", sans-serif;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .pc-connections :is(h1, h2, h3) {
  color: #102331;
  font-family: "Archivo", sans-serif;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .pc-connections :focus-visible {
  outline-color: #2FBFA5;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .pc-connections :is(.pc-connections__panel, .pc-connections__confirm) {
  background: #FFFFFF;
  border-color: #D9E2E9;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .pc-connections :is(.pc-connection__mark, .pc-connections__empty-mark) {
  background: #F3F6F8;
  border-color: #D9E2E9;
  color: #4A6172;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .pc-connections :is(.pc-connection__scopes li, .pc-connections__scope-summary li) {
  background: #F3F6F8;
  border-color: #D9E2E9;
  color: #4A6172;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .pc-connections__button--danger:hover {
  background: #DE6A58;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .dashboard-notifications-badge {
  color: var(--b1-muted);
  background-color: var(--b1-secondary);
  border-color: var(--b1-bg);
  font-family: "Manrope", sans-serif;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) #purchase-modal .bg-orange-50 {
  background-color: var(--b1-secondary);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) #purchase-modal svg[stroke="#F28A40"] {
  stroke: var(--b1-muted);
}

body.prepcompass-app .sidebar [class*="badge"],
body.prepcompass-app .sidebar .badge {
  color: var(--b1-muted);
  background-color: var(--b1-secondary);
}

body.prepcompass-app .sidebar a.active [class*="badge"],
body.prepcompass-app .sidebar a.active .badge {
  color: var(--b1-navy);
  background-color: var(--b1-orange);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.btn-login, .btn-signup, .hero-cta, button.bg-brand-sunset, a.bg-brand-sunset, button.bg-sunset, a.bg-sunset, button.bg-blue-500, a.bg-blue-500, button.bg-blue-600, a.bg-blue-600) {
  color: var(--b1-navy);
  background-color: var(--b1-orange);
  border-color: var(--b1-orange);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.btn-login, .btn-signup, .hero-cta, button.bg-brand-sunset, a.bg-brand-sunset, button.bg-sunset, a.bg-sunset, button.bg-blue-500, a.bg-blue-500, button.bg-blue-600, a.bg-blue-600):hover {
  color: var(--b1-navy);
  background-color: var(--b1-orange);
  border-color: var(--b1-orange);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .quest-navigation-cluster .text-brand-sunset:not(button):not(a) {
  color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .quest-navigation-cluster .bg-brand-sunset:not(button):not(a) {
  background-color: var(--b1-teal);
  color: var(--b1-navy);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) button[data-tab-btn].text-brand-sunset {
  color: var(--b1-navy);
  border-color: var(--b1-orange);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) main .space-y-2.rounded-xl.bg-brand-gold {
  background-color: var(--b1-orange);
  border-color: var(--b1-border);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) #selected-rally {
  border-color: var(--b1-orange);
  background-color: var(--b1-secondary);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) #selected-rally span.bg-brand-sunset {
  background-color: var(--b1-orange);
  color: var(--b1-navy);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) input,
body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) select,
body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) textarea {
  color: var(--b1-body);
  border-color: var(--b1-border);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.form-input, input, select, textarea):focus {
  outline-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.action-btn, .nba-btn) {
  color: var(--b1-navy);
  background-color: var(--b1-orange);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.action-btn.activate, .action-btn.done) {
  color: var(--b1-navy);
  background-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) :is(.dot-recommended, .dot-activated, .dot-completed) {
  background-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .dot-skipped {
  background-color: var(--b1-amber);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .upgrade-card :is(.plan-option.active .plan-option-price, .plan-option-bullets li::before) {
  color: var(--b1-muted);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .upgrade-card .spinner {
  border-color: var(--b1-border);
  border-top-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) .upgrade-card :focus-visible {
  outline-color: var(--b1-teal);
}

body.sn-public {
  --b1-navy: #102331;
  --b1-bg: #EDF1F4;
  --b1-secondary: #F3F6F8;
  --b1-border: #D9E2E9;
  --b1-body: #102331;
  --b1-muted: #4A6172;
  --b1-orange: #F28A40;
  --b1-teal: #2FBFA5;
  --b1-amber: #E8A33D;
  --b1-red: #DE6A58;
  background: var(--b1-bg);
  color: var(--b1-body);
  font-family: "Manrope", sans-serif;
}

body.sn-public .support-network-page {
  --sn-ink: #102331;
  --sn-muted: #4A6172;
  --sn-paper: #EDF1F4;
  --sn-card: #FFFFFF;
  --sn-line: #D9E2E9;
  --sn-teal: #2FBFA5;
  --sn-teal-dark: #102331;
  --sn-gold: #E8A33D;
  color: #102331;
  font-family: "Manrope", sans-serif;
}

body.sn-public .support-network-page :is(.sn-title, h1, h2, h3, h4, h5, h6) {
  color: #102331;
  font-family: "Archivo", sans-serif;
}

body.sn-public .support-network-page :is(.sn-card, .sn-panel, .sn-form, .sn-contact-card, .sn-invite-card) {
  color: #102331;
  background-color: #FFFFFF;
  border-color: #D9E2E9;
}

body.sn-public .support-network-page :is(.sn-button--primary, .sn-link-button--primary) {
  color: #102331;
  background-color: #F28A40;
  border-color: #F28A40;
}

body.sn-public .support-network-page :is(.sn-button--primary, .sn-link-button--primary):hover {
  color: #102331;
  background-color: #F28A40;
}

body.sn-public :is(.sn-button--primary, .sn-link-button--primary) {
  color: #102331;
  background-color: #F28A40;
  border-color: #F28A40;
}

body.sn-public :is(.sn-button--primary, .sn-link-button--primary):hover {
  color: #102331;
  background-color: #F28A40;
}

body.sn-public :is(h1, h2, h3, h4, h5, h6) { color: var(--b1-navy); font-family: "Archivo", sans-serif; }
body.sn-public :is(.sn-public-shell, .sn-public-main) { background-color: var(--b1-bg); color: var(--b1-body); }
body.sn-public :is(.sn-public-card, .sn-public-panel, .sn-public-content) { background-color: var(--b1-white, #FFFFFF); border-color: var(--b1-border); }
body.sn-public a { color: var(--b1-navy); }
body.sn-public :is(button, .sn-public-button) { color: var(--b1-navy); background-color: var(--b1-orange); border-color: var(--b1-orange); font-family: "Manrope", sans-serif; }
body.sn-public :is(button, .sn-public-button):hover { color: var(--b1-navy); background-color: #F28A40; }

body.pc-connect-shell {
  --pc-ink: #102331;
  --pc-muted: #4A6172;
  --pc-paper: #FFFFFF;
  --pc-line: #D9E2E9;
  --pc-olive: #2FBFA5;
  --pc-alert: #DE6A58;
  background: #EDF1F4;
  color: #102331;
  font-family: "Manrope", sans-serif;
}

body.pc-connect-shell :is(.pc-connect__panel, .pc-connections__panel, .pc-connections__confirm) { background-color: #FFFFFF; border-color: #D9E2E9; }
body.pc-connect-shell :is(.pc-connect h1, .pc-connect h2, .pc-connections h1, .pc-connections h2) { color: #102331; font-family: "Archivo", sans-serif; }
body.pc-connect-shell :is(.pc-connect__details, .pc-connect__permissions li, .pc-connect__scope-note, .pc-connect__button--quiet) { background-color: #F3F6F8; }
body.pc-connect-shell .pc-connect__notice { background-color: #F3F6F8; border-color: #DE6A58; color: #DE6A58; }
body.pc-connect-shell .pc-connect__notice--calm { border-color: #D9E2E9; color: #102331; }
body.pc-connect-shell .pc-connect__button--primary { color: #102331; background-color: #F28A40; border-color: #F28A40; }
body.pc-connect-shell .pc-connect__button--primary:hover:not(:disabled) { color: #102331; background-color: #F28A40; }
body.pc-connect-shell :is(.pc-connect__button, .pc-connections__button) { font-family: "Manrope", sans-serif; }

body.pc-setup-shell {
  background: #EDF1F4;
  color: #102331;
  font-family: "Manrope", sans-serif;
}
body.pc-setup-shell :is(h1, h2) { color: #102331; font-family: "Archivo", sans-serif; }
body.pc-setup-shell :is(header, section) { border-color: #D9E2E9; }
body.pc-setup-shell a { color: #102331; }
body.pc-setup-shell button { color: #102331; background-color: #F28A40; }
body.pc-setup-shell :is(.note, .url, textarea) { background-color: #F3F6F8; border-color: #D9E2E9; }
body.pc-setup-shell :focus-visible { outline-color: #2FBFA5; }

/* Theme only the screen surrounding the fixed plan, never its descendants. */
body.prepcompass-plan-host,
body.prepcompass-plan-host .dashboard-container {
  background-color: var(--b1-bg);
}

body.prepcompass-plan-host .sidebar,
body.prepcompass-plan-host .sidebar :is(a, span, div, button) {
  font-family: var(--b1-font-body) !important;
}

body.prepcompass-plan-host :is(h1, h2, h3, h4, h5, h6):not(#plan-container *) {
  color: var(--b1-navy);
  font-family: var(--b1-font-heading) !important;
}

body.prepcompass-plan-host :is(button, a, p, span, label, input, select, textarea):not(#plan-container *) {
  font-family: var(--b1-font-body) !important;
}

body.prepcompass-plan-host :is(button.bg-sunset, a.bg-sunset, button.bg-brand-sunset, a.bg-brand-sunset):not(#plan-container *) {
  background-color: var(--b1-orange);
  color: var(--b1-navy);
}

body.prepcompass-app :is(button.bg-sunset, a.bg-sunset, button.bg-brand-sunset, a.bg-brand-sunset, .btn-login, .btn-signup, .hero-cta) .text-white:not(#plan-container *) {
  color: var(--b1-navy);
}

body.prepcompass-app .sidebar nav > div > span {
  color: var(--b1-white) !important;
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)):not(:has(#plan-container)) :is(h1, h2, h3, h4, h5, h6, .font-heading) span {
  font-family: var(--b1-font-heading) !important;
}

body.prepcompass-app img[src*="/logos/"]:not(#plan-container *) {
  filter: grayscale(1);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--b1-navy);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is(.bg-green-500, .bg-green-600, .bg-emerald-500, .bg-emerald-600, .bg-teal-500, .bg-teal-600) {
  background-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is(.bg-yellow-500, .bg-yellow-600, .bg-amber-500, .bg-amber-600) {
  background-color: var(--b1-amber);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is(.bg-red-500, .bg-red-600) {
  background-color: var(--b1-red);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is(.text-green-600, .text-green-700, .text-teal-600, .text-teal-700) {
  color: var(--b1-navy);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is(.text-amber-600, .text-amber-700, .text-yellow-600, .text-red-600, .text-red-700) {
  color: var(--b1-navy);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is(.bg-green-50, .bg-green-100, .bg-yellow-50, .bg-yellow-100, .bg-red-50, .bg-red-100, .bg-orange-50, .bg-orange-100) {
  background-color: var(--b1-secondary);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is([role="progressbar"], [class*="progress"], [class*="maturity"]) :is(.bg-sunset, .bg-brand-sunset) {
  background-color: var(--b1-teal);
}

body.prepcompass-app:not(.prepcompass-plan-host) :is([role="progressbar"], [class*="progress"], [class*="maturity"]) :is(.bg-gold, .bg-brand-gold) {
  background-color: var(--b1-amber);
}

body.prepcompass-app:not(.prepcompass-plan-host):not(:has(#emergency-plan-content)) a.hidden.sm\:inline-flex.text-white {
  background-color: var(--b1-white);
  border-color: var(--b1-border);
  color: var(--b1-navy);
}