/* NJA edition: primitive, semantic, and component tokens. */
html body #firmWorkspace {
  --nja-ink: #182b2b;
  --nja-forest: #286454;
  --nja-forest-dark: #194739;
  --nja-coral: #a74d41;
  --nja-gold: #9a743e;
  --nja-paper: #f3f5f2;
  --nja-white: #fbfcfa;
  --nja-line: #d5ddd6;
  --nja-muted: #536763;
  --bg-main: var(--nja-paper) !important;
  --bg-secondary: #e8eee9 !important;
  --surface: #f7f9f6 !important;
  --surface-strong: var(--nja-white) !important;
  --panel: var(--nja-white) !important;
  --border: var(--nja-line) !important;
  --border-strong: #b7c6bb !important;
  --text: var(--nja-ink) !important;
  --text-soft: #3c5550 !important;
  --muted: var(--nja-muted) !important;
  --violet: var(--nja-forest) !important;
  --cyan: var(--nja-forest) !important;
  --gold: var(--nja-gold) !important;
  --success: #287557 !important;
  --warning: #946520 !important;
  --error: var(--nja-coral) !important;
  --shadow: none !important;
  --glow: none !important;
  --radius-xl: 0 !important;
  --radius-lg: 0 !important;
  --radius-md: 0 !important;
  --font: "DM Sans", Arial, sans-serif !important;
  color: var(--nja-ink) !important;
  color-scheme: light !important;
  background: var(--nja-paper) !important;
  font-family: "DM Sans", Arial, sans-serif !important;
  letter-spacing: 0 !important;
  overflow-x: clip !important;
}

html, body { margin: 0; min-width: 320px; background: #f3f5f2 !important; }
html body { color: #182b2b; font: 16px/1.5 "DM Sans", Arial, sans-serif; letter-spacing: 0 !important; }
html body::before, html body::after { display: none !important; }
html body #firmWorkspace *, html body #firmWorkspace *::before,
html body #firmWorkspace *::after { box-sizing: border-box; letter-spacing: 0 !important; }
html body #firmWorkspace :is(.card, .glass, .modal, .topbar, .sidebar, .right-panel,
  .bottom-activity, .timeline-board, .project-card, .row, .quick-action, .folder,
  .metric, .alert-card-v6, .command-hero, .role, .entry-panel, .entry-hero,
  .growth-card, .lead-card, .firm-os-hero, .invoice-preview-v32,
  .fcw-stable-skeleton-card-v78) {
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body #firmWorkspace [class*="card"] { border-radius: 0 !important; }
html body #firmWorkspace :is(.btn, .input, .select, .textarea, .pill,
  .brand-pill, .nav button, .mobile-nav button, .ai-command-form, .logo,
  .logo-mark, .role-icon, .search, .field input, .field select) {
  border-radius: 0 !important;
}
html body #firmWorkspace :is(.card, .glass, .modal, .topbar, .sidebar,
  .right-panel, .bottom-activity, .timeline-board, .project-card, .row,
  .quick-action, .folder, .metric, .alert-card-v6) {
  background: var(--nja-white) !important;
  border-color: var(--nja-line) !important;
}
html body #firmWorkspace :is(.card, .row, .project-card, .quick-action,
  .folder, .metric, .alert-card-v6, .btn):hover { transform: none !important; }
html body #firmWorkspace :is(.btn.primary, .btn.gold, .btn.green, .dark,
  .pill.black, .nav button.active) {
  background: var(--nja-forest) !important;
  border-color: var(--nja-forest) !important;
  color: #fff !important;
  box-shadow: none !important;
}
html body #firmWorkspace :is(.btn.primary, .btn.gold, .btn.green,
  .nav button.active):hover { background: var(--nja-forest-dark) !important; }
html body #firmWorkspace :is(.btn.light, .light, .pill, .brand-pill) {
  background: #eef3ee !important;
  border: 1px solid var(--nja-line) !important;
  color: var(--nja-ink) !important;
}
html body #firmWorkspace .btn.red { background: var(--nja-coral) !important; color: #fff !important; }
html body #firmWorkspace :is(.command-hero, .entry-hero, .firm-os-hero) {
  background: var(--nja-ink) !important;
  border: 1px solid var(--nja-ink) !important;
  color: #f6f8f5 !important;
}
html body #firmWorkspace :is(.command-hero, .entry-hero, .firm-os-hero) :is(h1,h2,h3,strong) { color: #f6f8f5 !important; }
html body #firmWorkspace :is(.command-hero, .entry-hero, .firm-os-hero) :is(p,.note) { color: #d4e2dc !important; }
html body #firmWorkspace :is(.command-hero, .entry-hero, .firm-os-hero)::before,
html body #firmWorkspace :is(.command-hero, .entry-hero, .firm-os-hero)::after { display: none !important; }
html body #firmWorkspace .logo { background: #e7eee8 !important; gap: 10px !important; }
html body #firmWorkspace .logo-mark { background: var(--nja-ink) !important; color: #fff !important; font: 800 15px/1 Manrope, Arial, sans-serif !important; flex: 0 0 46px; width: 46px !important; height: 46px !important; }
html body #firmWorkspace .logo-title { font: 800 14px/1.25 Manrope, Arial, sans-serif !important; overflow-wrap: anywhere !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }
html body #firmWorkspace .logo-sub { font-size: 11px !important; line-height: 1.35 !important; }
html body #firmWorkspace .page-title { font: 800 32px/1.14 Manrope, Arial, sans-serif !important; overflow-wrap: anywhere !important; }
html body #firmWorkspace .command-hero h2 { font: 800 36px/1.16 Manrope, Arial, sans-serif !important; max-width: 780px !important; overflow-wrap: anywhere !important; }
html body #firmWorkspace .card-title { font: 800 20px/1.3 Manrope, Arial, sans-serif !important; overflow-wrap: anywhere !important; }
html body #firmWorkspace .card-copy { font-size: 14px !important; line-height: 1.5 !important; }
html body #firmWorkspace :is(.metric-value, .money-metric .metric-value) { font-family: Manrope, Arial, sans-serif !important; line-height: 1.16 !important; overflow-wrap: anywhere !important; white-space: normal !important; text-overflow: clip !important; }
html body #firmWorkspace .finance-overview-v19 :is(.metric-value, .money-metric .metric-value) { font-size: 32px !important; }
html body #firmWorkspace :is(.row-title, .project-card strong, .quick-action strong,
  .alert-card-v6 strong, .finance-row strong) { overflow-wrap: anywhere !important; white-space: normal !important; line-height: 1.3 !important; }
html body #firmWorkspace :is(.row-sub, .quick-action span, .alert-card-v6 span,
  .page-copy, .note) { overflow-wrap: anywhere !important; white-space: normal !important; line-height: 1.5 !important; }
html body #firmWorkspace :is(.card, .row, .project-card, .quick-action, .metric,
  .finance-overview-v19, .notification-grid-v6, .command-strip, .grid) { min-width: 0 !important; max-width: 100% !important; }
html body #firmWorkspace :is(.btn, .nav button, .mobile-nav button) { min-height: 44px; font-size: 13px !important; line-height: 1.3 !important; }
html body #firmWorkspace :is(input, select, textarea) { min-width: 0; font-size: 16px !important; }
html body #firmWorkspace :is(button, input, select, textarea, a):focus-visible { outline: 2px solid var(--nja-forest) !important; outline-offset: 2px !important; }
html body #firmWorkspace .pill { white-space: normal !important; line-height: 1.3 !important; overflow-wrap: anywhere; }
html body #firmWorkspace .sidebar-foot { display: none !important; }
html body #firmWorkspace .nja-ai-wave-v75 { display: none !important; }
html body #firmWorkspace .role-ai-coach-orb-v71 { border-radius: 0 !important; }
html body #firmWorkspace .entry-hero h1 span { color: #9bcab5 !important; background: none !important; -webkit-text-fill-color: #9bcab5 !important; }
html body #firmWorkspace .entry-hero :is(.pill, .brand-pill) { color: #f2f7f3 !important; background: #286454 !important; border-color: #6c9d87 !important; }
html body #firmWorkspace .entry-hero :is(.tag-row, .page-pills) { min-width: 0 !important; }
html body #firmWorkspace .entry-hero :is(.tag-row > *, .page-pills > *) { max-width: 100% !important; overflow-wrap: anywhere !important; }
html body #firmWorkspace .role-ai-coach-orb-v71 { left: auto !important; right: 10px !important; top: auto !important; bottom: calc(77px + env(safe-area-inset-bottom)) !important; width: 48px !important; height: 48px !important; min-width: 48px !important; padding: 0 !important; display: grid !important; place-items: center !important; background: var(--nja-forest) !important; color: #fff !important; box-shadow: 0 4px 16px #182b2b25 !important; }
html body #firmWorkspace .role-ai-coach-orb-v71 :is(small,i) { display: none !important; }
html body #firmWorkspace .role-ai-coach-orb-v71 b { display: block !important; grid-column: auto !important; grid-row: auto !important; font-size: 11px !important; line-height: 1 !important; }
html body #firmWorkspace .role-ai-coach-v71 { border-radius: 0 !important; background: var(--nja-white) !important; color: var(--nja-ink) !important; box-shadow: 0 8px 28px #182b2b22 !important; }
html body #firmWorkspace .fcw-stable-skeleton-v78 { background: var(--nja-paper) !important; color: var(--nja-ink) !important; }
html body #firmWorkspace .fcw-stable-skeleton-card-v78 { background: var(--nja-white) !important; border-color: var(--nja-line) !important; }
html body #firmWorkspace .fcw-stable-skeleton-card-v78 span { color: var(--nja-muted) !important; }
html body #firmWorkspace .nja-loading { min-height: 100vh; display: grid; place-items: center; padding: 24px; text-align: center; color: var(--nja-ink); }

/* Phone is the baseline; the source app keeps its familiar sidebar and topbar at larger sizes. */
@media (max-width: 1199px) {
  html body #firmWorkspace .role-ai-coach-orb-v71 { display: none !important; }
}

@media (max-width: 767px) {
  html body #firmWorkspace .shell { display: block !important; width: 100% !important; padding: 10px 10px calc(100px + env(safe-area-inset-bottom)) !important; overflow: visible !important; }
  html body #firmWorkspace .sidebar, html body #firmWorkspace .right-panel { display: none !important; }
  html body #firmWorkspace .content { display: block !important; grid-column: auto !important; width: 100% !important; min-width: 0 !important; padding: 0 0 70px !important; }
  html body #firmWorkspace .topbar { position: relative !important; top: auto !important; margin: 0 0 12px !important; padding: 16px !important; }
  html body #firmWorkspace .topbar-inner { display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: 12px !important; }
  html body #firmWorkspace .page-title { font-size: 27px !important; margin: 9px 0 4px !important; }
  html body #firmWorkspace .page-pills { gap: 5px !important; }
  html body #firmWorkspace .page-pills .pill { padding: 5px 7px !important; font-size: 10px !important; }
  html body #firmWorkspace .ai-command-form { width: 100% !important; min-width: 0 !important; }
  html body #firmWorkspace .top-actions { display: flex !important; flex-wrap: wrap !important; justify-content: flex-start !important; gap: 7px !important; }
  html body #firmWorkspace .top-actions .btn { flex: 1 1 auto !important; padding: 8px 10px !important; }
  html body #firmWorkspace :is(.command-strip, .notification-grid-v6, .finance-overview-v19,
    .grid.g2, .grid.g3, .grid.g4, .overview-grid, .monthly-expense-module .grid.g2) { display: grid !important; grid-template-columns: minmax(0,1fr) !important; gap: 10px !important; }
  html body #firmWorkspace .command-hero { padding: 23px 19px !important; }
  html body #firmWorkspace .command-hero h2 { font-size: 29px !important; line-height: 1.15 !important; overflow-wrap: anywhere !important; }
  html body #firmWorkspace .card { padding: 16px !important; }
  html body #firmWorkspace .card-title { font-size: 18px !important; }
  html body #firmWorkspace .metric { min-height: 105px !important; padding: 15px !important; }
  html body #firmWorkspace :is(.metric-value, .money-metric .metric-value,
    .monthly-expense-module .metric .metric-value) { font-size: 27px !important; }
  html body #firmWorkspace .mobile-nav { display: block !important; position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; z-index: 100 !important; border-top: 1px solid var(--nja-line) !important; border-radius: 0 !important; background: var(--nja-white) !important; padding-bottom: env(safe-area-inset-bottom) !important; }
  html body #firmWorkspace .mobile-nav-inner { display: flex !important; gap: 2px !important; overflow-x: auto !important; overscroll-behavior-x: contain; scrollbar-width: none; }
  html body #firmWorkspace .mobile-nav-inner::-webkit-scrollbar { display: none; }
  html body #firmWorkspace .mobile-nav button { flex: 0 0 auto !important; min-width: 66px !important; padding: 8px 7px !important; font-size: 10px !important; }
  html body #firmWorkspace .role-ai-coach-v71 { left: 10px !important; right: 10px !important; top: auto !important; bottom: calc(92px + env(safe-area-inset-bottom)) !important; width: auto !important; max-width: none !important; max-height: min(60vh, 490px) !important; overflow-y: auto !important; }
  html body #firmWorkspace .entry { padding: 12px !important; }
  html body #firmWorkspace .entry-grid { display: grid !important; grid-template-columns: minmax(0,1fr) !important; }
  html body #firmWorkspace .entry-hero { min-height: 240px !important; padding: 24px !important; }
  html body #firmWorkspace .entry-hero h1 { font-size: 36px !important; line-height: 1.1 !important; overflow-wrap: anywhere !important; }
  html body #firmWorkspace .entry-panel { padding: 18px !important; }
}

@media (min-width: 768px) and (max-width: 1199px) {
  html body #firmWorkspace .shell { display: grid !important; grid-template-columns: 210px minmax(0,1fr) !important; gap: 12px !important; padding: 12px !important; }
  html body #firmWorkspace .sidebar { display: flex !important; grid-column: 1 !important; width: 210px !important; min-width: 0 !important; max-width: 210px !important; top: 12px !important; height: calc(100vh - 24px) !important; padding: 10px !important; }
  html body #firmWorkspace .content { grid-column: 2 !important; min-width: 0 !important; }
  html body #firmWorkspace .right-panel { display: none !important; }
  html body #firmWorkspace .topbar { top: 12px !important; padding: 13px !important; }
  html body #firmWorkspace .topbar-inner { grid-template-columns: minmax(0,1fr) !important; }
  html body #firmWorkspace .top-actions { justify-content: flex-start !important; }
  html body #firmWorkspace .command-strip { grid-template-columns: minmax(0,1fr) !important; }
  html body #firmWorkspace .command-side { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; }
  html body #firmWorkspace .quick-action { min-height: 88px !important; padding: 14px !important; }
  html body #firmWorkspace :is(.notification-grid-v6, .finance-overview-v19) { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  html body #firmWorkspace .logo { padding: 10px !important; }
  html body #firmWorkspace .logo-title { font-size: 12px !important; }
  html body #firmWorkspace .command-hero h2 { font-size: 34px !important; }
  html body #firmWorkspace .mobile-nav { display: none !important; }
}

@media (min-width: 1200px) {
  html body #firmWorkspace .shell { display: grid !important; grid-template-columns: 246px minmax(0,1fr) !important; gap: 16px !important; padding: 16px !important; max-width: 1760px !important; }
  html body #firmWorkspace .sidebar { display: flex !important; grid-column: 1 !important; width: 246px !important; min-width: 0 !important; max-width: 246px !important; top: 16px !important; height: calc(100vh - 32px) !important; }
  html body #firmWorkspace .content { grid-column: 2 !important; min-width: 0 !important; }
  html body #firmWorkspace .right-panel { display: none !important; }
  html body #firmWorkspace .topbar-inner { grid-template-columns: minmax(0,1fr) minmax(220px,360px) auto !important; gap: 13px !important; }
  html body #firmWorkspace .topbar { top: 16px !important; }
  html body #firmWorkspace .mobile-nav { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  html body #firmWorkspace *, html body #firmWorkspace *::before,
  html body #firmWorkspace *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}