@font-face {
  font-family: 'Work Sans';
  src: url('/public/fonts/work-sans-latin-wght-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: 'Fraunces';
  src: url('/public/fonts/fraunces-latin-wght-normal.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('/public/fonts/cormorant-garamond-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}
@font-face {
  font-family: 'Archivo Black';
  src: url('/public/fonts/archivo-black-regular.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --teal-50: #E1F5EE;
  --teal-100: #9FE1CB;
  --teal-200: #5DCAA5;
  --teal-400: #1D9E75;
  --teal-600: #0F6E56;
  --teal-800: #085041;
  --teal-900: #0A2E29;
  --gold: #C99A3D;
  --gold-light: #F5E8CC;
  --surface-0: #F4F6F5;
  --surface-1: #FFFFFF;
  --surface-2: #FFFFFF;
  --border: #E2E8E5;
  --border-strong: #CFC9BA;
  --text-primary: #16231F;
  --text-secondary: #5C6B65;
  --text-muted: #94A29C;
  --danger: #C0392B;
  --danger-bg: #FBECEA;
  --warning: #B8860B;
  --warning-bg: #FBF3DD;
  --success: #0F6E56;
  --success-bg: #E1F5EE;
  --radius: 12px;
  --font: 'Work Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: 'Fraunces', Georgia, serif;
  --theme-ui-font: 'Work Sans', 'Segoe UI', sans-serif;
  --theme-display-font: 'Fraunces', Georgia, serif;
  --theme-sidebar-font: 'Work Sans', 'Segoe UI', sans-serif;
  --theme-sidebar-art: url('/public/images/dashboard-sidebar-art.webp');
  --theme-quote-art: url('/public/images/dashboard-quote-bg.webp');
  --theme-watermark-art: url('/public/images/dashboard-watermark-bg.webp');
  --theme-sidebar-overlay-top: rgba(224,235,229,.82);
  --theme-sidebar-overlay-mid: rgba(216,230,223,.74);
  --theme-sidebar-overlay-bottom: rgba(200,218,209,.60);
  --theme-sidebar-text: #263e38;
  --theme-sidebar-muted: #5f756d;
  --theme-sidebar-icon: #4f6d64;
  --theme-sidebar-active-a: #657f76;
  --theme-sidebar-active-b: #506b62;
  --theme-canvas: #f7f6f2;
  --theme-canvas-wash: rgba(248,247,243,.76);
  --shadow-sm: 0 1px 2px rgba(20, 35, 30, 0.06), 0 1px 1px rgba(20, 35, 30, 0.04);
  --shadow-md: 0 4px 12px rgba(20, 35, 30, 0.08), 0 2px 4px rgba(20, 35, 30, 0.05);
  --shadow-lg: 0 12px 32px rgba(20, 35, 30, 0.14), 0 4px 10px rgba(20, 35, 30, 0.07);
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0; font-family: var(--font); background: var(--surface-0); color: var(--text-primary); font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--teal-600); text-decoration: none; }
a:hover { text-decoration: underline; }

.app-shell { display: flex; height: 100vh; overflow: hidden; }

/* Sidebar */
.sidebar { width: 232px; background: var(--teal-900); color: #EAF6F1; padding: 20px 0; flex-shrink: 0; display: flex; flex-direction: column; overflow-y: auto; min-height: 0; }
.sidebar-brand { padding: 16px 20px 20px; border-bottom: 1px solid rgba(255,255,255,0.1); margin-bottom: 12px; }
.sidebar-brand-inner { background: #fff; border-radius: 12px; padding: 10px 12px; }
.sidebar-brand img { width: 100%; max-width: 210px; height: auto; display: block; margin: 0 auto; }
.nav-section {
  padding: 10px 20px 6px; font-size: 12.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: #FFD37A; margin-top: 10px; cursor: pointer; font-family: var(--font-display);
  display: flex; align-items: center; gap: 6px; list-style: none;
}
.nav-section::-webkit-details-marker { display: none; }
.nav-section::before { content: '▶'; font-size: 8px; transition: transform 0.15s ease; }
details[open] > .nav-section::before { transform: rotate(90deg); }

.sidebar-search-input {
  width: 100%; padding: 10px 16px; border-radius: 999px; border: none;
  background: linear-gradient(135deg, var(--teal-400), var(--teal-600));
  color: #fff; font-size: 13px; font-weight: 500;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.15), 0 2px 8px rgba(0,0,0,0.15);
  transition: box-shadow 0.2s var(--ease), transform 0.15s var(--ease);
}
.sidebar-search-input::placeholder { color: rgba(255,255,255,0.85); }
.sidebar-search-input:focus { outline: none; box-shadow: 0 0 0 3px rgba(93, 202, 165, 0.4), 0 2px 8px rgba(0,0,0,0.2); transform: translateY(-1px); }
.nav-link {
  display: flex; align-items: center; gap: 10px; padding: 9px 20px; color: #D7ECE4; font-size: 13.5px;
  touch-action: manipulation; -webkit-tap-highlight-color: rgba(255,255,255,0.15);
  position: relative; margin: 0 8px 2px; border-radius: 8px; width: calc(100% - 16px);
  transition: color 0.18s var(--ease);
  overflow: hidden; white-space: nowrap; flex-wrap: nowrap; min-height: 20px;
}
.nav-link span:not(.badge) { overflow: hidden; text-overflow: ellipsis; }
/* A soft glow that follows the mouse cursor, faded in slowly on hover —
   position is set via --mx/--my custom properties updated on mousemove
   (see the script in footer.ejs). Pure CSS fallback (no JS/no hover
   support, e.g. touch devices) still gets a plain, centered highlight. */
.nav-link::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(140px circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,0.16), transparent 70%);
  opacity: 0; transition: opacity 0.5s ease;
}
.nav-link:hover::before { opacity: 1; }
.nav-link .nav-icon { flex-shrink: 0; opacity: 0.7; transition: opacity 0.18s var(--ease), transform 0.18s var(--ease); position: relative; }
.nav-link:hover .nav-icon { opacity: 1; transform: scale(1.08); }
.nav-link.active .nav-icon { opacity: 1; }
.nav-link > * { position: relative; }
.nav-link.active { background: var(--teal-600); color: #fff; font-weight: 500; box-shadow: 0 2px 8px rgba(0,0,0,0.2); }
.sidebar-footer { margin-top: auto; padding: 16px 20px 0; border-top: 1px solid rgba(255,255,255,0.1); }
.sidebar-footer form { margin: 0; }
.sidebar-footer button { background: none; border: none; color: var(--teal-100); font-size: 13px; cursor: pointer; padding: 0; }

/* Main content */
.main { flex: 1; padding: 28px 36px; max-width: 1200px; overflow-y: auto; min-height: 0; }
.main.wide { max-width: 1560px; }

.dashboard-layout { display: grid; grid-template-columns: 1fr 280px; gap: 20px; align-items: start; }
.dashboard-rail { display: flex; flex-direction: column; gap: 16px; }
.dashboard-rail .card { margin-bottom: 0; }
.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; flex-wrap: wrap; gap: 12px; }
.page-header h1 { font-family: var(--font-display); font-size: 24px; font-weight: 700; margin: 0; letter-spacing: -0.01em; }
.page-header p.subtitle { color: var(--text-secondary); margin: 4px 0 0; font-size: 13px; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: var(--radius);
  border: 1px solid var(--border-strong); background: #fff; color: var(--text-primary); font-size: 13.5px;
  font-weight: 500; cursor: pointer; transition: transform 0.12s var(--ease), box-shadow 0.15s var(--ease), background 0.15s var(--ease), border-color 0.15s var(--ease);
}
.btn:hover { background: var(--surface-0); text-decoration: none; transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--teal-600); border-color: var(--teal-600); color: #fff; }
.btn-primary:hover { background: var(--teal-800); box-shadow: 0 4px 14px rgba(15, 110, 86, 0.35); }
.btn-danger { color: var(--danger); border-color: var(--danger); background: #fff; }
.btn-sm { padding: 5px 12px; font-size: 12.5px; }

/* Cards */
.card { background: var(--surface-1); border: 1px solid var(--border); border-radius: 14px; padding: 18px 20px; margin-bottom: 16px; box-shadow: var(--shadow-sm); transition: box-shadow 0.2s var(--ease); }

/* Collapsible cards — used on pages like Case detail where many sections
   would otherwise be shown at once. Native <details>/<summary> needs no JS. */
details.card > summary { list-style: none; }
details.card > summary::-webkit-details-marker { display: none; }
details.card > summary::before { content: '▶'; display: inline-block; font-size: 10px; margin-right: 8px; transition: transform 0.15s ease; color: var(--text-secondary); }
details.card[open] > summary::before { transform: rotate(90deg); }
details.card > summary:hover { opacity: 0.75; }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap: 14px; margin-bottom: 24px; }
.stat-card {
  background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 16px 18px;
  box-shadow: var(--shadow-sm); transition: transform 0.18s var(--ease), box-shadow 0.18s var(--ease);
  position: relative; overflow: hidden;
}
.stat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.stat-card .stat-icon {
  position: absolute; top: 14px; right: 14px; opacity: 0.35; color: var(--teal-600);
  transition: opacity 0.2s var(--ease), transform 0.2s var(--ease);
}
.stat-card:hover .stat-icon { opacity: 0.55; transform: scale(1.1) rotate(-4deg); }
.stat-card.stat-card-gradient .stat-icon { color: #fff; opacity: 0.5; }
.stat-card.stat-card-gradient:hover .stat-icon { opacity: 0.75; }
.stat-card .label { font-size: 12px; color: var(--text-secondary); margin: 0 0 6px; font-weight: 500; padding-right: 24px; }
.stat-card .value { font-family: var(--font-display); font-size: 26px; font-weight: 700; margin: 0; color: var(--teal-800); }

/* Gradient stat cards — used for the first couple of highlighted dashboard
   stats when "Use gradient cards" is enabled in Settings > Appearance. */
body.gradient-cards .stat-card.stat-card-gradient {
  background: linear-gradient(135deg, var(--teal-400), var(--teal-800));
  border: none; color: #fff;
}
body.gradient-cards .stat-card.stat-card-gradient .label { color: rgba(255,255,255,0.85); }
body.gradient-cards .stat-card.stat-card-gradient .value { color: #fff; }

/* Vivid, distinct accent colors for dashboard highlight cards — each one a
   different saturated gradient so a row of stat cards reads at a glance,
   rather than every "important" number looking the same shade of teal. */
body.gradient-cards .stat-card.accent-1 { background: linear-gradient(135deg, #FF7A6E, #E8493C); }
body.gradient-cards .stat-card.accent-2 { background: linear-gradient(135deg, #2FBF8F, #0E8F68); }
body.gradient-cards .stat-card.accent-3 { background: linear-gradient(135deg, #FFB648, #F08A1F); }
body.gradient-cards .stat-card.accent-4 { background: linear-gradient(135deg, #A78BFA, #7C4DE0); }
body.gradient-cards .stat-card.accent-5 { background: linear-gradient(135deg, #4FC3E8, #1C8CC7); }

/* Tables */
table { width: 100%; border-collapse: collapse; }
th { text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--text-secondary); padding: 10px 12px; border-bottom: 1px solid var(--border); }
td { padding: 12px; border-bottom: 1px solid var(--border); font-size: 13.5px; transition: background 0.15s var(--ease); }
tr:hover td { background: var(--surface-0); }
.table-wrap { background: #fff; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }

/* Badges */
.badge { display: inline-block; padding: 3px 10px; border-radius: 6px; font-size: 11.5px; font-weight: 500; }
.badge-teal { background: var(--success-bg); color: var(--success); }
.badge-warning { background: var(--warning-bg); color: var(--warning); }
.badge-danger { background: var(--danger-bg); color: var(--danger); }
.badge-gray { background: #EEF1EF; color: var(--text-secondary); }

/* Forms */
label { display: block; font-size: 13px; font-weight: 500; margin: 14px 0 5px; }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=datetime-local],
input[type=number], select, textarea {
  width: 100%; padding: 9px 12px; border: 1px solid var(--border-strong); border-radius: var(--radius);
  font-size: 13.5px; font-family: var(--font); background: #fff; color: var(--text-primary);
}
textarea { min-height: 90px; resize: vertical; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.checkbox-group { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 6px; }
.checkbox-group label { display: flex; align-items: center; gap: 6px; font-weight: 400; margin: 0; font-size: 13px; }
.checkbox-group input { width: auto; }
.form-actions { margin-top: 24px; display: flex; gap: 10px; }

/* Login */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--teal-900); }
.login-card { background: #fff; border-radius: 16px; padding: 40px 36px; width: 480px; }
.login-card h1 { font-size: 20px; margin: 0 0 4px; color: var(--teal-800); }
.login-card p { color: var(--text-secondary); font-size: 13px; margin: 0 0 24px; }
.error-msg { background: var(--danger-bg); color: var(--danger); padding: 10px 14px; border-radius: var(--radius); font-size: 13px; margin-bottom: 16px; }
.success-msg { background: var(--success-bg); color: var(--success); padding: 10px 14px; border-radius: var(--radius); font-size: 13px; margin-bottom: 16px; }

/* Tabs */
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin-bottom: 20px; }
.tab { padding: 9px 16px; font-size: 13.5px; color: var(--text-secondary); border-bottom: 2px solid transparent; }
.tab.active { color: var(--teal-600); border-bottom-color: var(--teal-600); font-weight: 500; }

.filter-bar { display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; align-items: center; }
.filter-bar select, .filter-bar input { width: auto; }
.muted { color: var(--text-muted); }
.empty-state { text-align: center; padding: 50px 20px; color: var(--text-secondary); }

/* ==================== Mobile / responsive ==================== */

.mobile-topbar { display: none; }
.sidebar-backdrop { display: none; }
.mobile-menu-toggle-input { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }

.mobile-menu-btn {
  width: 40px; height: 40px; border: none; background: transparent; cursor: pointer;
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px;
  flex-shrink: 0;
}
.mobile-menu-btn span { display: block; width: 22px; height: 2px; background: #fff; border-radius: 2px; }

@media (max-width: 860px) {
  .mobile-topbar {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 16px; background: var(--teal-900); position: sticky; top: 0; z-index: 40;
  }
  .mobile-topbar-logo { width: 32px; height: 32px; }
.opd-logo-mark { display:block; width:42px; height:42px; flex:0 0 auto; background:url('/public/images/opd-logo.png') no-repeat 14.8% center/395% auto; }
.mobile-topbar-logo.opd-logo-mark { width:42px; height:42px; }
body.theme-opd .sidebar-brand { min-height:112px; }
body.theme-opd .sidebar-brand img { width:190px; max-width:100%; filter:none; }
body.theme-opd.mode-dark .sidebar-brand-inner { padding:8px 10px; border-radius:14px; background:rgba(255,255,255,.92); }
body.theme-opd.mode-dark .sidebar-brand img { filter:none; opacity:1; mix-blend-mode:normal; }

  .app-shell { display: block; height: auto; overflow: visible; }
  .sidebar { overflow-y: auto; } /* mobile sidebar is a fixed-position overlay handled separately below — this just avoids inheriting the desktop min-height:0 flex-scroll trick */
  .main { overflow-y: visible; height: auto; min-height: 0; } /* let the page scroll normally on mobile instead of an internal scroll pane */
  .main.wide { max-width: 100%; }
  .dashboard-layout { display: block; }
  .dashboard-rail { margin-top: 20px; }

  .sidebar {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 50;
    transform: translateX(-100%); transition: transform 0.2s ease;
    width: 260px; max-width: 82vw; box-shadow: 4px 0 24px rgba(0,0,0,0.25);
    isolation: isolate; pointer-events: auto; -webkit-overflow-scrolling: touch;
  }
  .sidebar.open, .mobile-menu-toggle-input:checked ~ .app-shell .sidebar { transform: translateX(0); }

  .sidebar-backdrop {
    display: block; position: fixed; inset: 0; background: rgba(0,0,0,0.4);
    z-index: 45; opacity: 0; pointer-events: none; transition: opacity 0.2s ease;
  }
  .sidebar-backdrop.open, .mobile-menu-toggle-input:checked ~ .sidebar-backdrop {
    opacity: 1;
    pointer-events: auto;
    touch-action: manipulation;
    cursor: pointer;
  }
  .main { padding: 18px 16px 40px; max-width: 100%; }

  .page-header { flex-direction: column; align-items: flex-start; }
  .page-header > div:last-child, .page-header > form { width: 100%; }
  .page-header > div:last-child { flex-wrap: wrap; }
  .page-header > div:last-child form { flex-wrap: wrap; }
  .page-header > div:last-child .btn, .page-header > div:last-child select,
  .page-header > div:last-child button { flex: 1 1 auto; min-width: fit-content; }

  .form-grid { grid-template-columns: 1fr; }

  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .table-wrap table { min-width: 560px; }

  .stat-grid { grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); }

  .login-card { width: 92vw; max-width: 480px; padding: 32px 24px; }

  /* Two-column layouts used on dashboard/reports/case detail collapse to one column */
  div[style*="grid-template-columns:1.3fr 1fr"],
  div[style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
}

@media (max-width: 480px) {
  .main { padding: 14px 12px 32px; }
  .page-header h1 { font-size: 17px; }
  .stat-card .value { font-size: 20px; }
  .card { padding: 14px 16px; }
  /* Portal pages use inline max-width on their wrapper div — this override
     keeps them from ever exceeding the viewport on very small phones. */
  div[style*="max-width:720px"], div[style*="max-width:560px"],
  div[style*="max-width:480px"], div[style*="max-width:520px"] { max-width: 100% !important; padding-left: 16px; padding-right: 16px; }
}

/* ==================== Print ==================== */
@media print {
  .sidebar, .mobile-topbar, .sidebar-backdrop, .btn, form button, .page-header form,
  .no-print { display: none !important; }
  .app-shell { display: block !important; }
  .main { padding: 0 !important; max-width: 100% !important; }
  body { background: #fff !important; }
  .card, .table-wrap, .stat-card { border: 1px solid #ccc !important; box-shadow: none !important; break-inside: avoid; }
  a { color: inherit !important; text-decoration: none !important; }
}

/* ==================== Accessibility ==================== */
/* Font size scaling uses CSS zoom rather than overriding font-size — most
   of this app's text is set with fixed pixel values in inline styles
   throughout the templates (not rem units), so a body-level font-size
   change wouldn't cascade to them. zoom scales the whole rendered layout
   (text, spacing, buttons) proportionally regardless of how each element's
   size was originally declared. Applied to .main only, NOT .app-shell or
   the sidebar — zoom creates a new containing block for any position:fixed
   descendants in some Chromium versions, which broke the mobile sidebar's
   fixed-position/full-height scrolling behavior when it was applied higher
   up the tree. Keeping the sidebar outside the zoomed element avoids that.
   (zoom isn't in the CSS spec but is supported in Chrome, Edge, and Safari,
   which covers the browsers this app is actually used in.) */
body.font-small .main { zoom: 0.9; }
body.font-medium .main { zoom: 1; }
body.font-large .main { zoom: 1.15; }
body.font-xlarge .main { zoom: 1.3; }

body.high-contrast {
  --border: #000; --border-strong: #000;
  --text-secondary: #1a1a1a; --text-muted: #333;
}
body.high-contrast .card, body.high-contrast .stat-card, body.high-contrast .table-wrap {
  border: 2px solid #000 !important;
}
body.high-contrast a { text-decoration: underline; }
body.high-contrast .btn { border-width: 2px; font-weight: 600; }
body.high-contrast .sidebar { background: #000; }
body.high-contrast input, body.high-contrast select, body.high-contrast textarea {
  border: 2px solid #000 !important;
}

/* ==================== Team carousel ==================== */
.team-carousel {
  display: flex; gap: 20px; overflow-x: auto; padding: 8px 4px 20px;
  scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch;
}
.team-card {
  flex: 0 0 240px; scroll-snap-align: start; background: var(--surface-1);
  border: 1px solid var(--border); border-radius: 16px; overflow: hidden;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.team-card:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,0.1); }
.team-card-photo {
  width: 100%; height: 200px; display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.team-card-photo img { width: 100%; height: 100%; object-fit: cover; }
.team-card-initials { font-size: 56px; font-weight: 700; color: rgba(255,255,255,0.9); text-shadow: 0 2px 8px rgba(0,0,0,0.15); }
.team-card-body { padding: 14px 16px 18px; }
.team-card-name { font-size: 15px; font-weight: 600; margin: 0 0 6px; }
.team-card-role-badge {
  display: inline-block; font-size: 11px; font-weight: 600; text-transform: capitalize;
  padding: 3px 10px; border-radius: 20px; margin-bottom: 10px;
}
.team-card-facts { font-size: 12.5px; color: var(--text-secondary); line-height: 1.5; margin: 0; white-space: pre-wrap; }
.team-card { cursor: pointer; }
.team-card:focus-visible { outline: 3px solid var(--teal-400); outline-offset: 2px; }

/* ==================== Staff profile modal (FLIP-animated) ==================== */
.staff-modal-backdrop {
  position: fixed; inset: 0; background: rgba(10, 20, 18, 0.5); z-index: 200;
  opacity: 0; pointer-events: none; transition: opacity 0.28s ease;
}
.staff-modal-backdrop.open { opacity: 1; pointer-events: auto; }
.staff-modal {
  position: fixed; z-index: 201; background: var(--surface-1); overflow: hidden;
  box-shadow: var(--shadow-lg); display: none;
}
.staff-modal.open { display: block; }
.staff-modal-photo {
  width: 100%; height: 42%; display: flex; align-items: center; justify-content: center; position: relative;
}
.staff-modal-photo img { width: 100%; height: 100%; object-fit: cover; }
.staff-modal-close {
  position: absolute; top: 14px; right: 14px; z-index: 5; width: 34px; height: 34px; border-radius: 50%;
  border: none; background: rgba(0,0,0,0.35); color: #fff; font-size: 20px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.2s ease, background 0.15s ease;
}
.staff-modal.expanded .staff-modal-close { opacity: 1; }
.staff-modal-close:hover { background: rgba(0,0,0,0.55); }
.staff-modal-body { padding: 22px 26px; opacity: 0; transition: opacity 0.25s ease 0.05s; overflow-y: auto; max-height: 58%; }
.staff-modal.expanded .staff-modal-body { opacity: 1; }
.staff-modal-body h2 { margin: 0 0 8px; font-family: var(--font-display); font-size: 22px; }

/* Simple centered popup for the Dashboard's "what's behind this number"
   stat card detail — reuses the staff-modal's look but with fixed
   positioning instead of the FLIP-from-card-position animation, since this
   one isn't tied to a specific on-screen card. */
.stat-detail-modal {
  top: 50% !important; left: 50% !important; transform: translate(-50%, -50%);
  width: min(480px, 90vw) !important; height: min(70vh, 560px) !important;
  border-radius: 16px !important; padding: 24px 26px;
}
.stat-detail-modal .staff-modal-body { padding: 0; }
.stat-card-clickable { cursor: pointer; }
.stat-card-clickable:focus-visible { outline: 3px solid rgba(255,255,255,0.7); outline-offset: 2px; }

/* Full-size announcement image viewer */
.image-lightbox {
  position: fixed; inset: 0; z-index: 300; background: rgba(10,20,18,0.9);
  display: none; align-items: center; justify-content: center; padding: 40px; cursor: zoom-out;
}
.image-lightbox.open { display: flex; }
.image-lightbox img { max-width: 100%; max-height: 100%; border-radius: 8px; box-shadow: var(--shadow-lg); }

.announcement-zoom-hint {
  position: absolute; bottom: 10px; right: 10px; background: rgba(0,0,0,0.6); color: #fff;
  font-size: 11.5px; padding: 5px 10px; border-radius: 20px; pointer-events: none;
  opacity: 0; transition: opacity 0.2s ease;
}
div:hover > .announcement-zoom-hint { opacity: 1; }
@media (hover: none) {
  .announcement-zoom-hint { opacity: 1; }
}
.staff-modal-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 16px 0; font-size: 13px; }
.staff-modal-facts-block { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.staff-modal-facts { font-size: 14px; line-height: 1.6; white-space: pre-wrap; margin: 0; font-style: italic; color: var(--text-primary); }

@media (max-width: 640px) {
  .staff-modal-meta { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .team-card { flex: 0 0 200px; }
  .team-card-photo { height: 170px; }
}

/* ==================== Knowledge Base category browsing ==================== */
.kb-category-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 18px; }
.kb-category-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px 16px;
  background: var(--surface-1); border: 1px solid var(--border); border-radius: 12px; color: var(--text-primary);
  transition: transform 0.15s var(--ease), box-shadow 0.15s var(--ease), border-color 0.15s var(--ease);
}
.kb-category-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); text-decoration: none; }
.kb-category-card.active { border-color: var(--teal-600); background: var(--teal-50); }
.kb-category-card .nav-icon { color: var(--teal-600); }
.kb-category-name { font-weight: 600; font-size: 13.5px; }
.kb-category-count { font-size: 11.5px; color: var(--text-muted); }

/* ==================== KPI Dashboard ==================== */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); gap: 18px; }
.kpi-widget-card {
  background: var(--surface-1); border: 1px solid var(--border); border-radius: 14px;
  padding: 16px 18px; box-shadow: var(--shadow-sm); transition: box-shadow 0.18s var(--ease);
}
.kpi-widget-card:hover { box-shadow: var(--shadow-md); }
.kpi-widget-header { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 12px; }
.kpi-widget-title { font-size: 13.5px; font-weight: 600; }
.kpi-widget-controls { display: flex; align-items: center; gap: 4px; }
.kpi-widget-controls select { font-size: 11.5px; padding: 4px 6px; width: auto; border-radius: 6px; }
.kpi-icon-btn {
  border: 1px solid var(--border); background: var(--surface-0); border-radius: 6px; width: 26px; height: 26px;
  cursor: pointer; font-size: 12px; display: flex; align-items: center; justify-content: center;
  transition: background 0.15s ease;
}
.kpi-icon-btn:hover { background: var(--teal-50); }
.kpi-widget-body { position: relative; height: 240px; }
.kpi-widget-body canvas { max-height: 240px; }
.kpi-big-number {
  height: 100%; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: 42px; font-weight: 700; color: var(--teal-700);
}
.kpi-metric-option {
  display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 1px solid var(--border);
  border-radius: 8px; margin-bottom: 6px; cursor: pointer; font-size: 13px; font-weight: 400;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.kpi-metric-option:hover { border-color: var(--teal-400); background: var(--teal-50); }

/* ==================== OPD Clinic UI refresh ==================== */
:root {
  --surface-0: #f4f7f5;
  --surface-1: #ffffff;
  --surface-2: #edf4f0;
  --border: #dfe9e4;
  --border-strong: #cbd9d2;
  --text-primary: #18312a;
  --text-secondary: #62736c;
  --text-muted: #8b9a94;
  --radius: 12px;
  --shadow-sm: 0 1px 2px rgba(10, 46, 41, 0.04), 0 8px 24px rgba(10, 46, 41, 0.045);
  --shadow-md: 0 16px 42px rgba(10, 46, 41, 0.1), 0 2px 8px rgba(10, 46, 41, 0.05);
  --shadow-lg: 0 28px 70px rgba(10, 46, 41, 0.2), 0 8px 20px rgba(10, 46, 41, 0.08);
}

body {
  background:
    radial-gradient(circle at 88% -10%, rgba(159, 225, 203, 0.22), transparent 30rem),
    linear-gradient(180deg, #f8faf9 0%, var(--surface-0) 28rem);
  font-size: 14px;
  line-height: 1.5;
}

button, input, select, textarea { font: inherit; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid rgba(29, 158, 117, 0.28); outline-offset: 2px; }

.app-shell { background: transparent; }
.sidebar {
  width: 252px;
  padding: 22px 10px 14px;
  background:
    radial-gradient(circle at 0 0, rgba(93, 202, 165, 0.16), transparent 18rem),
    linear-gradient(180deg, #0c3932 0%, #082b27 58%, #06231f 100%);
  border-right: 1px solid rgba(255,255,255,0.05);
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.18) transparent;
}
.sidebar::-webkit-scrollbar { width: 6px; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.16); border-radius: 99px; }
.sidebar-brand {
  padding: 2px 10px 20px;
  margin: 0 0 10px;
  border-bottom: 1px solid rgba(255,255,255,0.09);
}
.sidebar-brand-inner {
  padding: 12px 15px;
  border-radius: 16px;
  background: rgba(255,255,255,0.97);
  box-shadow: 0 14px 28px rgba(0,0,0,0.16);
}
.sidebar-search { padding: 0 8px; margin: 10px 0 6px; }
.sidebar-search-input {
  min-height: 40px;
  padding: 9px 14px 9px 36px;
  border: 1px solid rgba(255,255,255,0.13);
  border-radius: 12px;
  background-color: rgba(255,255,255,0.08);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23cde8df' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 12px center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}
.sidebar-search-input:focus {
  transform: none;
  background-color: rgba(255,255,255,0.12);
  border-color: rgba(159,225,203,0.55);
  box-shadow: 0 0 0 3px rgba(93,202,165,0.13);
}
.nav-section {
  padding: 14px 12px 7px;
  margin-top: 6px;
  color: rgba(255, 224, 164, 0.86);
  font-family: var(--font);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .12em;
}
.nav-link {
  width: 100%;
  min-height: 42px;
  margin: 1px 0;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: rgba(234,246,241,.78);
  font-size: 13.5px;
}
.nav-link:hover { color: #fff; text-decoration: none; background: rgba(255,255,255,0.06); }
.nav-link.active {
  background: linear-gradient(135deg, rgba(63, 175, 138, .92), rgba(15,110,86,.96));
  border-color: rgba(255,255,255,0.14);
  box-shadow: 0 8px 20px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,.13);
}
.nav-link .badge { margin-left: auto !important; }
.sidebar-footer { margin: 12px 0 0; padding: 17px 12px 4px; }
.sidebar-footer button { color: #dceee8; padding: 6px 0; font-weight: 600; }

.main {
  max-width: none;
  padding: 34px clamp(24px, 3vw, 52px) 56px;
  scroll-behavior: smooth;
}
.main.wide { max-width: none; }
.page-header { margin-bottom: 27px; }
.page-header h1 {
  color: #143a31;
  font-size: clamp(25px, 2vw, 32px);
  font-weight: 650;
  line-height: 1.15;
  letter-spacing: -.025em;
}
.page-header p.subtitle { margin-top: 6px; font-size: 13.5px; }
.page-actions { display: flex; gap: 9px; flex-wrap: wrap; }

.btn {
  min-height: 39px;
  padding: 8px 15px;
  border-color: var(--border);
  border-radius: 10px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 1px 2px rgba(10,46,41,.03);
}
.btn:hover { background: #fff; border-color: #b8cec4; box-shadow: 0 7px 18px rgba(10,46,41,.09); }
.btn-primary {
  background: linear-gradient(135deg, #18805f, #0f6e56);
  border-color: #0f6e56;
  box-shadow: 0 7px 18px rgba(15,110,86,.2);
}
.btn-primary:hover { background: linear-gradient(135deg, #126e53, #0a5745); }
.btn-sm { min-height: 34px; padding: 6px 12px; }

.card, .table-wrap, .kpi-widget-card {
  border-color: rgba(207, 220, 214, .88);
  border-radius: 18px;
  box-shadow: var(--shadow-sm);
}
.card { padding: 21px 22px; margin-bottom: 18px; }
.card:hover { box-shadow: 0 12px 32px rgba(10,46,41,.075); }
.card h2, .card h3, .card-title { color: #1a3d34; }
.card-title { margin: 0 0 16px; font-family: var(--font); font-size: 14px; font-weight: 700; letter-spacing: -.01em; }

.stat-grid { grid-template-columns: repeat(4, minmax(155px, 1fr)); gap: 16px; margin-bottom: 20px; }
.stat-card {
  min-height: 126px;
  padding: 22px;
  border-radius: 18px;
  border-color: rgba(207,220,214,.9);
  box-shadow: var(--shadow-sm);
}
.stat-card::after {
  content: '';
  position: absolute;
  inset: auto -28px -42px auto;
  width: 108px;
  height: 108px;
  border-radius: 50%;
  background: currentColor;
  opacity: .045;
}
.stat-card .stat-icon {
  top: 18px;
  right: 18px;
  width: 38px;
  height: 38px;
  padding: 8px;
  border-radius: 12px;
  background: var(--teal-50);
  color: var(--teal-600);
  opacity: 1;
}
.stat-card:hover .stat-icon { opacity: 1; transform: translateY(-2px); }
.stat-card .label { margin-bottom: 12px; font-size: 12.5px; font-weight: 600; }
.stat-card .value { font-family: var(--font); font-size: 31px; font-weight: 700; letter-spacing: -.035em; }
.stat-card-clickable:hover { transform: translateY(-4px); border-color: #bad6c9; }

body.gradient-cards .stat-card.stat-card-gradient {
  border: 1px solid rgba(255,255,255,.13);
  color: #fff;
  box-shadow: 0 15px 32px rgba(10,46,41,.16);
}
body.gradient-cards .stat-card.accent-1 { background: linear-gradient(145deg, #176f5a, #0b493e); }
body.gradient-cards .stat-card.accent-2 { background: linear-gradient(145deg, #527a5b, #2f5845); }
body.gradient-cards .stat-card.accent-3 { background: linear-gradient(145deg, #aa7b38, #765525); }
body.gradient-cards .stat-card.accent-4 { background: linear-gradient(145deg, #587576, #344f50); }
body.gradient-cards .stat-card.accent-5 { background: linear-gradient(145deg, #397985, #24535e); }
body.gradient-cards .stat-card.stat-card-gradient .stat-icon { background: rgba(255,255,255,.13); color: #fff; }

.dashboard-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 22px; }
.dashboard-content-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(260px, .8fr); gap: 18px; }
.dashboard-panel { min-width: 0; }
.dashboard-announcements { border-left: 4px solid var(--teal-600); }
.dashboard-rail { gap: 18px; }
.dashboard-rail .card { background: linear-gradient(150deg, #fff, #f5faf7); }
#clock-widget { overflow: hidden; position: relative; background: linear-gradient(145deg, #0f6e56, #0a4036); color: #fff; border-color: transparent; }
#clock-widget::after { content: ''; position: absolute; width: 140px; height: 140px; border-radius: 50%; right: -55px; bottom: -80px; border: 24px solid rgba(255,255,255,.06); }
#clock-widget .muted, #clock-widget p { color: inherit; }
#clock-time { font-family: var(--font-display); letter-spacing: -.02em; position: relative; z-index: 1; }

table { border-spacing: 0; }
th {
  padding: 12px 14px;
  background: #f6f9f7;
  color: #687b73;
  border-bottom-color: var(--border);
  font-size: 11px;
  letter-spacing: .075em;
}
td { padding: 13px 14px; border-bottom-color: #e7eeea; font-size: 13.5px; }
tbody tr:last-child td { border-bottom: 0; }
tr:hover td { background: #f5faf7; }
.table-wrap { overflow: hidden; }

.badge { padding: 4px 9px; border-radius: 999px; font-weight: 650; letter-spacing: .01em; }

label { margin-top: 16px; color: #304a42; font-weight: 600; }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=datetime-local],
input[type=number], input[type=tel], input[type=url], select, textarea {
  min-height: 43px;
  padding: 10px 13px;
  border-color: var(--border-strong);
  border-radius: 10px;
  background: rgba(255,255,255,.96);
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
textarea { min-height: 110px; }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--teal-400);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(29,158,117,.11);
}
.tabs { gap: 6px; padding: 5px; border: 1px solid var(--border); border-radius: 12px; background: #edf3f0; }
.tab { padding: 8px 13px; border: 0; border-radius: 8px; }
.tab.active { background: #fff; color: var(--teal-800); box-shadow: 0 2px 8px rgba(10,46,41,.07); }

.login-wrap {
  padding: 28px;
  background:
    radial-gradient(circle at 15% 15%, rgba(93,202,165,.2), transparent 25rem),
    radial-gradient(circle at 90% 85%, rgba(201,154,61,.14), transparent 24rem),
    linear-gradient(145deg, #0c3932, #061f1c);
}
.login-card { border: 1px solid rgba(255,255,255,.5); border-radius: 24px; padding: 44px 40px; box-shadow: 0 32px 90px rgba(0,0,0,.27); }
.login-card h1 { font-family: var(--font-display); font-size: 26px; }

@media (max-width: 1180px) {
  .dashboard-layout { grid-template-columns: 1fr; }
  .dashboard-rail { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-grid { grid-template-columns: repeat(2, minmax(155px, 1fr)); }
}

@media (max-width: 860px) {
  .mobile-topbar { padding: 9px 14px; background: linear-gradient(135deg, #0c3932, #082b27); box-shadow: 0 6px 20px rgba(8,43,39,.18); }
  .sidebar { width: 274px; padding: 18px 10px 14px; }
  .main { padding: 24px 17px 44px; }
  .dashboard-content-grid { grid-template-columns: 1fr; }
  .page-actions { width: 100%; }
  .page-actions .btn { flex: 1 1 auto; justify-content: center; }
}

@media (max-width: 560px) {
  .main { padding: 20px 13px 36px; }
  .page-header { margin-bottom: 20px; }
  .page-header h1 { font-size: 25px; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .stat-card { min-height: 116px; padding: 16px; }
  .stat-card .stat-icon { width: 34px; height: 34px; top: 14px; right: 14px; }
  .stat-card .label { max-width: calc(100% - 34px); font-size: 11.5px; }
  .stat-card .value { font-size: 27px; }
  .card { padding: 17px; border-radius: 15px; }
  .dashboard-rail { grid-template-columns: 1fr; }
  .form-actions { flex-direction: column; }
  .form-actions .btn { justify-content: center; }
}

/* Settings > Appearance theme gallery */
.appearance-settings-card { max-width: 860px; }
.appearance-font-field { margin-top:18px; }
.appearance-font-field > label { margin:0 0 7px; }
.appearance-font-field > select { display:block; margin:0; }
.appearance-field-help { margin:8px 0 18px; font-size:11.5px; line-height:1.55; }
.appearance-section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:10px; }
.appearance-section-heading label { margin:0; font-size:14px; }
.appearance-section-heading p { margin:4px 0 0; color:var(--text-secondary); font-size:12px; line-height:1.45; }
.appearance-theme-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:8px; }
.appearance-theme-card { position:relative; display:grid; grid-template-columns:116px minmax(0,1fr) 24px; align-items:center; gap:12px; min-height:92px; margin:0; padding:8px; overflow:hidden; border:1px solid var(--border-strong); border-radius:13px; background:#fff; cursor:pointer; font-weight:400; transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.appearance-theme-card:hover { transform:translateY(-1px); border-color:var(--teal-400); box-shadow:var(--shadow-sm); }
.appearance-theme-card.is-selected { border-color:var(--teal-600); box-shadow:0 0 0 2px color-mix(in srgb,var(--teal-600) 28%,transparent); }
.appearance-theme-card > input { position:absolute; opacity:0; pointer-events:none; }
.appearance-theme-preview { position:relative; display:block; width:116px; height:74px; overflow:hidden; border-radius:9px; background-size:cover; background-position:center; box-shadow:inset 0 0 0 1px rgba(27,48,43,.08); }
.appearance-theme-mini-sidebar { position:absolute; inset:0 auto 0 0; width:31px; background-size:cover; background-position:center bottom; border-right:1px solid rgba(25,47,43,.12); }
.appearance-theme-mini-title { position:absolute; top:15px; left:47px; color:#24343b; font-size:22px; font-weight:700; line-height:1; }
.appearance-theme-mini-title::after { content:''; position:absolute; top:29px; left:0; width:45px; height:4px; border-radius:4px; background:rgba(255,255,255,.82); box-shadow:0 9px 0 rgba(255,255,255,.72); }
.appearance-theme-swatch { position:absolute; right:7px; bottom:7px; width:17px; height:17px; border:2px solid rgba(255,255,255,.88); border-radius:50%; box-shadow:0 1px 4px rgba(25,45,42,.18); }
.appearance-theme-copy { display:flex; flex-direction:column; min-width:0; }
.appearance-theme-copy strong { color:var(--text-primary); font-size:14px; font-weight:750; line-height:1.2; }
.appearance-theme-copy small { margin-top:5px; color:var(--text-secondary); font-size:11.5px; line-height:1.38; }
.appearance-theme-check { display:grid; place-items:center; width:21px; height:21px; border:1px solid var(--border-strong); border-radius:50%; color:transparent; font-size:12px; font-weight:800; }
.appearance-theme-card.is-selected .appearance-theme-check { color:#fff; border-color:var(--teal-600); background:var(--teal-600); }
@media (max-width:720px) { .appearance-theme-grid { grid-template-columns:1fr; } .appearance-theme-card { grid-template-columns:104px minmax(0,1fr) 24px; } .appearance-theme-preview { width:104px; } }
.appearance-mode-heading { margin-top:22px; }
.appearance-mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.appearance-mode-card { display:grid; grid-template-columns:46px minmax(0,1fr) 22px; align-items:center; gap:11px; margin:0; padding:12px; border:1px solid var(--border-strong); border-radius:13px; background:var(--surface-1); cursor:pointer; font-weight:400; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.appearance-mode-card:hover { transform:translateY(-1px); border-color:var(--teal-400); box-shadow:var(--shadow-sm); }
.appearance-mode-card.is-selected { border-color:var(--teal-600); box-shadow:0 0 0 2px color-mix(in srgb,var(--teal-600) 28%,transparent); }
.appearance-mode-card > input { position:absolute; opacity:0; pointer-events:none; }
.appearance-mode-card > span:nth-of-type(2) { display:flex; flex-direction:column; }
.appearance-mode-card strong { color:var(--text-primary); font-size:13.5px; }
.appearance-mode-card small { margin-top:3px; color:var(--text-secondary); font-size:11.5px; }
.appearance-mode-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; color:#8b621d; background:linear-gradient(145deg,#fff9d9,#f5d67b); font-size:22px; }
.appearance-mode-icon.is-dark { color:#d7e5e2; background:linear-gradient(145deg,#243a36,#101b19); }
.appearance-mode-card.is-selected .appearance-theme-check { color:#fff; border-color:var(--teal-600); background:var(--teal-600); }
@media (max-width:620px) { .appearance-mode-grid { grid-template-columns:1fr; } }

/* Theme-aware staff authentication screens */
.auth-page { min-height:100%; font-family:var(--theme-ui-font,var(--font)); }
.themed-login-wrap {
  position:relative;
  display:grid;
  grid-template-columns:minmax(320px, .95fr) minmax(420px, 1.05fr);
  width:100%;
  min-height:100vh;
  padding:clamp(24px,4vw,64px);
  background-color:var(--theme-canvas);
  background-image:linear-gradient(var(--theme-canvas-wash),var(--theme-canvas-wash)),var(--theme-watermark-art);
  background-size:cover;
  background-position:center;
}
.themed-login-art {
  position:relative;
  z-index:1;
  min-height:560px;
  overflow:hidden;
  border-radius:28px 0 0 28px;
  background-image:linear-gradient(180deg,var(--theme-sidebar-overlay-top),var(--theme-sidebar-overlay-bottom)),var(--theme-sidebar-art);
  background-size:cover;
  background-position:center bottom;
  box-shadow:0 28px 80px rgba(31,53,48,.16);
}
.themed-login-art::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 48%,rgba(24,45,40,.20)); pointer-events:none; }
.themed-login-art-copy { position:absolute; z-index:1; left:clamp(26px,4vw,54px); right:28px; bottom:38px; color:var(--theme-sidebar-text); text-shadow:0 1px 0 rgba(255,255,255,.52); }
.themed-login-art-copy span { display:block; margin-bottom:7px; font-family:var(--theme-sidebar-font); font-size:12px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; }
.themed-login-art-copy strong { display:block; max-width:360px; font-family:var(--theme-display-font); font-size:clamp(30px,3.2vw,48px); line-height:1.02; font-weight:680; letter-spacing:-.025em; }
.themed-login-card {
  align-self:center;
  z-index:2;
  width:min(520px,100%);
  min-height:480px;
  margin-left:-18px;
  padding:48px 52px;
  border:1px solid rgba(255,255,255,.74);
  border-radius:0 28px 28px 0;
  background:rgba(255,255,255,.93);
  box-shadow:0 28px 80px rgba(31,53,48,.16);
  backdrop-filter:blur(15px);
}
.themed-login-card > img { max-width:300px !important; max-height:118px; object-fit:contain; }
.themed-login-heading { margin:4px 0 24px; text-align:center; }
.themed-login-heading > span { color:var(--teal-600); font-size:11px; font-weight:750; letter-spacing:.15em; text-transform:uppercase; }
.themed-login-heading h1 { margin:5px 0 5px; color:var(--text-primary); font-family:var(--theme-display-font); font-size:30px; }
.themed-login-heading p { margin:0; color:var(--text-secondary); font-size:13px; }
.themed-login-card label { font-family:var(--theme-sidebar-font); font-weight:650; }
.themed-login-card input { min-height:47px; }
.themed-login-card .btn-primary { min-height:46px; border-color:var(--teal-600); border-radius:10px; background:linear-gradient(135deg,var(--teal-400),var(--teal-600)); box-shadow:0 7px 18px color-mix(in srgb,var(--teal-600) 24%,transparent); font-family:var(--theme-sidebar-font); font-weight:750; }
.themed-login-card .btn-primary:hover { border-color:var(--teal-800); background:linear-gradient(135deg,var(--teal-600),var(--teal-800)); }
.themed-login-foot { margin-top:17px !important; text-align:center; font-size:12px !important; }
@media (max-width:800px) {
  .themed-login-wrap { grid-template-columns:1fr; align-content:center; padding:18px; }
  .themed-login-art { min-height:170px; border-radius:22px 22px 0 0; background-position:center 70%; }
  .themed-login-art-copy { left:24px; bottom:22px; }
  .themed-login-art-copy strong { font-size:29px; }
  .themed-login-card { width:100%; max-width:none; min-height:0; margin:-1px 0 0; padding:34px 25px; border-radius:0 0 22px 22px; }
  .themed-login-card > img { max-width:245px !important; max-height:90px; }
}

/* ==================== Reference-matched botanical dashboard ==================== */
body {
  background: #f6f5f0;
  color: #17252b;
}

.app-shell { background: #f6f5f0; }
.workspace-shell { flex: 1; min-width: 0; height: 100vh; overflow: hidden; display: flex; flex-direction: column; }
.desktop-topbar {
  height: 68px;
  flex: 0 0 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 28px;
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid #ebece8;
  box-shadow: 0 1px 0 rgba(30,48,43,.02);
  position: relative;
  z-index: 5;
}
.topbar-search { position: relative; width: min(480px, 48vw); margin: 0; }
.topbar-search-icon {
  position: absolute;
  left: 13px;
  top: 50%;
  width: 15px;
  height: 15px;
  transform: translateY(-50%);
  border: 1.8px solid #65736f;
  border-radius: 50%;
  pointer-events: none;
}
.topbar-search-icon::after {
  content: '';
  position: absolute;
  width: 6px;
  height: 1.8px;
  right: -5px;
  bottom: -2px;
  border-radius: 2px;
  background: #65736f;
  transform: rotate(45deg);
}
.topbar-search input[type=search] {
  width: 100%;
  min-height: 38px;
  padding: 8px 14px 8px 40px;
  border: 1px solid #e1e5e2;
  border-radius: 10px;
  background: #fbfcfb;
  color: #273832;
  font-size: 13px;
  box-shadow: inset 0 1px 2px rgba(20,40,34,.025);
}
.topbar-search input[type=search]:focus { background: #fff; border-color: #9ab8ad; box-shadow: 0 0 0 4px rgba(84,126,111,.1); }
.topbar-account { display: flex; align-items: center; gap: 20px; }
.topbar-notifications {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: #263a34;
  border-radius: 10px;
  position: relative;
}
.topbar-notifications:hover { background: #f0f4f2; text-decoration: none; }
.topbar-notification-dot {
  position: absolute;
  top: 7px;
  right: 7px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #d85947;
  border: 2px solid #fff;
}
.topbar-profile { display: flex; align-items: center; gap: 10px; color: #17252b; }
.topbar-profile:hover { text-decoration: none; }
.topbar-avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  border-radius: 50%;
  background: linear-gradient(145deg, #496e63, #7ea194);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 3px 9px rgba(31,65,56,.18);
}
.topbar-avatar.has-photo {
  padding: 2px;
  background: linear-gradient(145deg, #68b99f, #1b7059);
  box-shadow: 0 0 0 3px rgba(29,158,117,.08), 0 5px 14px rgba(31,65,56,.2);
}
.topbar-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  border: 2px solid #fff;
  border-radius: inherit;
  object-fit: cover;
  object-position: center;
  background: #e8f1ed;
}
.topbar-profile-copy { display: flex; flex-direction: column; line-height: 1.2; min-width: 130px; }
.topbar-profile-copy strong { font-size: 13px; font-weight: 650; }
.topbar-profile-copy small { margin-top: 3px; color: #77837f; font-size: 11px; text-transform: capitalize; }
.topbar-chevron { margin-left: 5px; color: #65736f; font-size: 18px; }

.sidebar {
  width: 248px;
  padding: 0 12px 14px;
  background-image:
    linear-gradient(180deg, var(--theme-sidebar-overlay-top) 0%, var(--theme-sidebar-overlay-mid) 46%, var(--theme-sidebar-overlay-bottom) 100%),
    var(--theme-sidebar-art);
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
  color: var(--theme-sidebar-text);
  border-right: 1px solid rgba(69,99,89,.13);
}
.sidebar-brand {
  min-height: 132px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 8px 12px;
  margin: 0 0 6px;
  border-bottom-color: rgba(65,91,83,.12);
  background: transparent;
}
.sidebar-brand-inner { background: transparent; border-radius: 0; padding: 0; box-shadow: none; }
.sidebar-brand img { width: 128px; max-width: 100%; height: auto; background: transparent; }
.sidebar-search { display: none; }
.nav-section {
  color: var(--theme-sidebar-muted);
  padding: 13px 10px 6px;
  font-size: 9.5px;
  letter-spacing: .14em;
  font-family: var(--theme-sidebar-font);
  font-weight: 750;
  text-shadow: 0 1px 0 rgba(255,255,255,.48);
}
.nav-link {
  min-height: 42px;
  padding: 10px 12px;
  color: var(--theme-sidebar-text);
  font-size: 13.5px;
  font-family: var(--theme-sidebar-font);
  font-weight: 650;
  letter-spacing: .005em;
  text-shadow: 0 1px 0 rgba(255,255,255,.48);
  border-radius: 9px;
}
.nav-link::before { background: radial-gradient(140px circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,.5), transparent 70%); }
.nav-link:hover { color: #17332d; background: rgba(255,255,255,.38); }
.nav-link .nav-icon { color: var(--theme-sidebar-icon); opacity: .95; }
.nav-link.active {
  color: #fff;
  background: linear-gradient(135deg, var(--theme-sidebar-active-a), var(--theme-sidebar-active-b));
  border-color: rgba(63,89,80,.16);
  box-shadow: 0 7px 18px rgba(45,75,65,.18), inset 0 1px 0 rgba(255,255,255,.16);
  text-shadow: none;
}
.nav-link.active .nav-icon { color: #fff; }
.sidebar-art {
  display: none;
}
.sidebar-footer {
  position: relative;
  z-index: 1;
  margin: 14px 0 0;
  padding: 15px 12px 4px;
  border-top-color: rgba(65,91,83,.15);
}
.sidebar-footer p { color: #29473f !important; }
.sidebar-footer button { color: #385b51; }

.main {
  flex: 1;
  width: 100%;
  max-width: none;
  min-height: 0;
  padding: 0 32px 46px;
  background:
    radial-gradient(circle at 65% -5%, rgba(255,255,255,.85), transparent 31rem),
    #f7f6f2;
}
.dashboard-page .main {
  background-image:
    linear-gradient(var(--theme-canvas-wash), var(--theme-canvas-wash)),
    var(--theme-watermark-art);
  background-color: var(--theme-canvas);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}
.dashboard-hero {
  min-height: 166px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  margin: 0 -32px 20px;
  border-bottom: 1px solid #ebe9e2;
  background: rgba(255,255,255,.66);
  overflow: hidden;
}
.dashboard-hero-copy { padding: 20px 32px 18px; align-self: center; }
.dashboard-date { margin: 0 0 7px; color: #4f5f5a; font-size: 12px; }
.dashboard-hero h1 {
  margin: 0;
  color: #121d22;
  font-family: var(--font-display);
  font-size: clamp(29px, 2.5vw, 39px);
  line-height: 1.08;
  font-weight: 650;
  letter-spacing: -.03em;
}
.dashboard-hero .subtitle { margin: 7px 0 0; color: #4f5f5a; font-size: 14px; }
.dashboard-hero-actions { margin-top: 13px; }
.dashboard-hero-actions .btn { background: rgba(255,255,255,.72); min-height: 32px; }
.dashboard-quote-panel {
  min-height: 166px;
  display: flex;
  align-items: center;
  background-image: linear-gradient(90deg, rgba(255,255,255,.1), rgba(255,255,255,.04)), var(--theme-quote-art);
  background-size: cover;
  background-position: center;
  border-left: 1px solid rgba(196,202,193,.55);
}
.dashboard-quote-inner { max-width: 275px; padding: 20px 28px; transition: opacity .35s ease, transform .35s ease; }
.dashboard-quote-inner.is-changing { opacity: 0; transform: translateY(4px); }
.dashboard-quote-mark { display: block; height: 22px; color: #48675c; font-family: Georgia, serif; font-size: 38px; line-height: 1; }
.dashboard-quote-panel blockquote {
  margin: 2px 0 9px;
  color: #26372f;
  font-family: var(--font-display);
  font-size: 17px;
  font-style: italic;
  line-height: 1.35;
}
.dashboard-quote-panel a { color: #50665e; font-size: 11px; font-weight: 650; }

.stat-grid { gap: 12px; margin-bottom: 16px; }
.stat-card,
body.gradient-cards .stat-card.stat-card-gradient,
body.gradient-cards .stat-card.accent-1,
body.gradient-cards .stat-card.accent-2,
body.gradient-cards .stat-card.accent-3,
body.gradient-cards .stat-card.accent-4,
body.gradient-cards .stat-card.accent-5 {
  min-height: 118px;
  display: flex;
  align-items: center;
  gap: 17px;
  padding: 18px;
  color: #17252b;
  background: rgba(255,255,255,.94);
  border: 1px solid #e2e5e1;
  border-radius: 11px;
  box-shadow: 0 5px 20px rgba(47,69,61,.055);
}
.stat-card::after { display: none; }
.stat-card .stat-icon,
body.gradient-cards .stat-card.stat-card-gradient .stat-icon {
  position: static;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  padding: 14px;
  border-radius: 50%;
  color: #478c7a;
  background: #e6f2ed;
  opacity: 1;
}
.stat-card.accent-3 .stat-icon { color: #bc7825; background: #fbefdc; }
.stat-card.accent-5 .stat-icon { color: #307fb1; background: #e5f1fb; }
.stat-card.accent-2 .stat-icon { color: #397c6f; background: #e5f0ed; }
.stat-card:hover .stat-icon { transform: none; }
.stat-card .stat-copy { min-width: 0; }
.stat-card .value,
body.gradient-cards .stat-card.stat-card-gradient .value {
  margin: 0 0 2px;
  color: #17252b;
  font-size: 28px;
  line-height: 1;
}
.stat-card .label,
body.gradient-cards .stat-card.stat-card-gradient .label {
  margin: 0;
  padding: 0;
  color: #4d5e59;
  font-size: 12px;
  font-weight: 500;
}
.dashboard-layout { grid-template-columns: minmax(0, 1fr) 288px; gap: 14px; }
.dashboard-content-grid { gap: 14px; }
.dashboard-layout .card { border-radius: 11px; box-shadow: 0 5px 20px rgba(47,69,61,.05); }
.dashboard-rail { gap: 12px; }
.dashboard-rail .card { background: rgba(255,255,255,.95); }
#clock-widget { background: linear-gradient(145deg, #718f84, #527168); }

@media (max-width: 1180px) {
  .dashboard-hero { grid-template-columns: minmax(0, 1fr) 300px; }
}

@media (max-width: 860px) {
  .workspace-shell { height: auto; min-height: 100vh; overflow: visible; }
  .desktop-topbar { display: none; }
  .sidebar {
    width: 274px;
    background-image:
      linear-gradient(180deg, var(--theme-sidebar-overlay-top), var(--theme-sidebar-overlay-bottom)),
      var(--theme-sidebar-art);
    background-size: cover;
    background-position: center bottom;
  }
  .sidebar-search { display: block; }
  .sidebar-search-input { color: #213b34; background-color: rgba(255,255,255,.45); border-color: rgba(67,95,85,.2); }
  .sidebar-search-input::placeholder { color: #5f746d; }
  .main { padding: 0 16px 40px; }
  .dashboard-hero { grid-template-columns: 1fr; margin: 0 -16px 18px; }
  .dashboard-hero-copy { padding: 22px 18px; }
  .dashboard-quote-panel { min-height: 145px; border-left: 0; border-top: 1px solid rgba(196,202,193,.55); }
  .dashboard-quote-inner { max-width: 440px; padding: 20px 22px; }
}

@media (max-width: 560px) {
  .main { padding: 0 12px 34px; }
  .dashboard-hero { margin: 0 -12px 15px; }
  .dashboard-hero h1 { font-size: 28px; }
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .stat-card,
  body.gradient-cards .stat-card.stat-card-gradient,
  body.gradient-cards .stat-card.accent-1,
  body.gradient-cards .stat-card.accent-2,
  body.gradient-cards .stat-card.accent-3,
  body.gradient-cards .stat-card.accent-4,
  body.gradient-cards .stat-card.accent-5 { min-height: 112px; gap: 11px; padding: 14px; }
  .stat-card .stat-icon,
  body.gradient-cards .stat-card.stat-card-gradient .stat-icon { width: 42px; height: 42px; flex-basis: 42px; padding: 10px; }
  .stat-card .value,
body.gradient-cards .stat-card.stat-card-gradient .value { font-size: 24px; }
}

/* KPI dashboard — themed executive chart presentation */
.kpi-dashboard-page {
  min-height:calc(100vh - 66px);
  margin:0 -32px -46px;
  padding:24px 32px 64px;
  background-color:var(--theme-canvas);
  background-image:linear-gradient(var(--theme-canvas-wash),var(--theme-canvas-wash)),var(--theme-watermark-art);
  background-size:cover;
  background-position:center top;
  background-attachment:local;
}
.kpi-hero-header {
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  min-height:178px;
  gap:28px;
  margin-bottom:20px;
  padding:28px 32px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.74);
  border-radius:20px;
  background-image:linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.84) 52%,rgba(255,255,255,.18) 100%),var(--theme-quote-art);
  background-size:cover;
  background-position:center;
  box-shadow:0 14px 38px rgba(38,62,55,.10);
}
.kpi-hero-header::after { content:''; position:absolute; inset:auto -50px -85px auto; width:250px; height:250px; border:1px solid color-mix(in srgb,var(--teal-600) 16%,transparent); border-radius:50%; box-shadow:0 0 0 32px color-mix(in srgb,var(--teal-600) 5%,transparent),0 0 0 66px color-mix(in srgb,var(--teal-600) 4%,transparent); pointer-events:none; }
.kpi-hero-copy { position:relative; z-index:1; max-width:720px; }
.kpi-hero-eyebrow { display:block; margin-bottom:8px; color:var(--teal-600); font-size:10.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.kpi-hero-header h1 { display:flex; align-items:center; gap:12px; margin:0; color:#182924; font-family:var(--font-display); font-size:clamp(30px,3vw,42px); line-height:1.05; letter-spacing:-.03em; }
.kpi-hero-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; color:#fff; background:linear-gradient(145deg,var(--teal-400),var(--teal-800)); box-shadow:0 9px 20px color-mix(in srgb,var(--teal-600) 26%,transparent); }
.kpi-hero-icon svg { width:21px; height:21px; }
.kpi-hero-header p { margin:10px 0 0; color:#53635e; font-size:13px; }
.kpi-hero-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.kpi-hero-meta span { display:flex; align-items:center; gap:6px; min-height:27px; padding:5px 10px; border:1px solid rgba(90,111,103,.12); border-radius:999px; color:#53645e; background:rgba(255,255,255,.64); font-size:10.5px; font-weight:650; backdrop-filter:blur(6px); }
.kpi-hero-meta strong { color:var(--teal-800); font-size:12px; }
.kpi-hero-meta i { width:6px; height:6px; border-radius:50%; background:#37a276; box-shadow:0 0 0 4px rgba(55,162,118,.12); }
.kpi-add-widget-btn { position:relative; z-index:2; flex:0 0 auto; min-height:43px; padding-inline:19px; border-color:var(--teal-600); background:linear-gradient(135deg,var(--teal-400),var(--teal-700,var(--teal-800))); box-shadow:0 9px 24px color-mix(in srgb,var(--teal-600) 25%,transparent); }

.kpi-dashboard-page .kpi-grid { grid-template-columns:repeat(auto-fit,minmax(390px,1fr)); gap:16px; }
.kpi-dashboard-page .kpi-widget-card {
  --kpi-accent:var(--chart-1,var(--teal-600));
  position:relative;
  min-height:355px;
  overflow:hidden;
  padding:18px 20px 13px;
  border:1px solid rgba(255,255,255,.76);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(255,255,255,.88));
  box-shadow:0 10px 30px rgba(42,65,58,.08),inset 0 1px 0 rgba(255,255,255,.75);
  backdrop-filter:blur(12px);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.kpi-dashboard-page .kpi-widget-card::before { content:''; position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,var(--kpi-accent),color-mix(in srgb,var(--kpi-accent) 34%,transparent)); }
.kpi-dashboard-page .kpi-widget-card::after { content:''; position:absolute; top:-72px; right:-68px; width:170px; height:170px; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--kpi-accent) 12%,transparent),transparent 70%); pointer-events:none; }
.kpi-dashboard-page .kpi-widget-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--kpi-accent) 28%,#fff); box-shadow:0 18px 42px rgba(42,65,58,.13); }
.kpi-widget-accent-1 { --kpi-accent:var(--chart-1) !important; }.kpi-widget-accent-2 { --kpi-accent:var(--chart-2) !important; }.kpi-widget-accent-3 { --kpi-accent:var(--chart-3) !important; }.kpi-widget-accent-4 { --kpi-accent:var(--chart-4) !important; }.kpi-widget-accent-5 { --kpi-accent:var(--chart-5) !important; }.kpi-widget-accent-6 { --kpi-accent:var(--chart-6) !important; }
.kpi-dashboard-page .kpi-widget-header { position:relative; z-index:1; align-items:flex-start; margin-bottom:10px; }
.kpi-widget-heading { display:flex; align-items:center; gap:10px; min-width:0; }
.kpi-widget-mark { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:11px; color:var(--kpi-accent); background:color-mix(in srgb,var(--kpi-accent) 12%,#fff); font-size:10px; font-weight:850; letter-spacing:.06em; }
.kpi-widget-heading > div { display:flex; flex-direction:column; min-width:0; }
.kpi-widget-kicker { color:var(--kpi-accent); font-size:8.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.kpi-dashboard-page .kpi-widget-title { margin-top:3px; overflow:hidden; color:#21322d; font-size:13px; font-weight:750; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.kpi-dashboard-page .kpi-widget-controls { position:relative; z-index:2; }
.kpi-dashboard-page .kpi-widget-controls select { min-height:31px; padding:5px 26px 5px 9px; border-color:rgba(83,105,97,.16); border-radius:8px; color:#52635d; background-color:rgba(248,251,250,.9); font-size:10.5px; font-weight:650; }
.kpi-dashboard-page .kpi-icon-btn { width:30px; height:30px; border-color:rgba(83,105,97,.14); border-radius:8px; color:#61716c; background:rgba(248,251,250,.88); }
.kpi-dashboard-page .kpi-icon-btn:hover { color:var(--kpi-accent); border-color:color-mix(in srgb,var(--kpi-accent) 28%,transparent); background:color-mix(in srgb,var(--kpi-accent) 8%,#fff); }
.kpi-dashboard-page .kpi-widget-body { height:246px; padding:2px 2px 0; }
.kpi-dashboard-page .kpi-widget-body canvas { max-height:246px; }
.kpi-widget-foot { display:flex; align-items:center; gap:6px; min-height:21px; margin-top:6px; padding-top:8px; border-top:1px solid rgba(86,107,99,.09); color:#93a09c; font-size:9.5px; font-weight:600; }
.kpi-widget-foot span { width:5px; height:5px; border-radius:50%; background:var(--kpi-accent); }
.kpi-dashboard-page .kpi-big-number { flex-direction:column; gap:3px; color:var(--kpi-accent); text-align:center; }
.kpi-big-number::before { content:''; position:absolute; width:130px; height:130px; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--kpi-accent) 17%,transparent),transparent 68%); }
.kpi-big-number > * { position:relative; z-index:1; }
.kpi-big-number strong { font-family:var(--font-display); font-size:52px; line-height:1; letter-spacing:-.04em; }
.kpi-number-label { max-width:90%; color:#52635d; font-size:10px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.kpi-big-number small { color:#96a39f; font-family:var(--font); font-size:10px; font-weight:650; }
.kpi-dashboard-page .kpi-metric-option { border-radius:10px; }
@media (max-width:860px) { .kpi-dashboard-page { margin:0 -16px -40px; padding:18px 16px 48px; }.kpi-hero-header { align-items:flex-start; min-height:0; padding:24px; }.kpi-dashboard-page .kpi-grid { grid-template-columns:1fr; } }
@media (max-width:600px) { .kpi-dashboard-page { margin:0 -12px -34px; padding:13px 12px 42px; }.kpi-hero-header { flex-direction:column; padding:21px 18px; border-radius:16px; }.kpi-add-widget-btn { width:100%; justify-content:center; }.kpi-hero-header h1 { font-size:30px; }.kpi-hero-meta { margin-top:14px; }.kpi-dashboard-page .kpi-grid { gap:12px; }.kpi-dashboard-page .kpi-widget-card { min-height:340px; padding:16px 13px 11px; }.kpi-dashboard-page .kpi-widget-title { max-width:190px; }.kpi-dashboard-page .kpi-widget-controls select { max-width:88px; }.kpi-dashboard-page .kpi-widget-body { height:238px; } }

/* Light / dark appearance mode. Theme colors and artwork stay intact while
   the working surfaces, typography, borders, charts, and forms change tone. */
body.mode-dark {
  color-scheme:dark;
  --surface-0:#0e1715;
  --surface-1:#15211e;
  --surface-2:#1b2925;
  --border:#2a3a35;
  --border-strong:#3b4d47;
  --text-primary:#edf5f2;
  --text-secondary:#a9bbb5;
  --text-muted:#788b85;
  --danger:#ff8f85;
  --danger-bg:#3a211f;
  --warning:#f1c86b;
  --warning-bg:#352d1d;
  --success:#75d9b5;
  --success-bg:#18362d;
  --theme-canvas:#0e1715;
  --theme-canvas-wash:rgba(9,17,15,.88);
  --theme-sidebar-overlay-top:rgba(12,29,27,.84);
  --theme-sidebar-overlay-mid:rgba(13,32,29,.79);
  --theme-sidebar-overlay-bottom:rgba(10,24,22,.72);
  --theme-sidebar-text:#f0f7f4;
  --theme-sidebar-muted:#b2c6c0;
  --theme-sidebar-icon:#b9d4cd;
  --shadow-sm:0 1px 2px rgba(0,0,0,.30),0 1px 1px rgba(0,0,0,.22);
  --shadow-md:0 8px 22px rgba(0,0,0,.34),0 2px 5px rgba(0,0,0,.25);
  --shadow-lg:0 20px 52px rgba(0,0,0,.45),0 5px 14px rgba(0,0,0,.30);
  background:var(--surface-0);
  color:var(--text-primary);
}
body.mode-dark.has-bg-image::after { background:var(--surface-0); }
body.mode-dark .app-shell,
body.mode-dark .workspace-shell,
body.mode-dark .main { background-color:var(--surface-0); }
body.mode-dark .desktop-topbar,
body.mode-dark .mobile-topbar { background:rgba(17,27,24,.94); border-color:var(--border); }
body.mode-dark .topbar-profile { color:var(--text-primary); }
body.mode-dark .topbar-profile-copy small,
body.mode-dark .topbar-chevron { color:var(--text-secondary); }
body.mode-dark .topbar-notifications { color:var(--text-secondary); }
body.mode-dark .topbar-notifications:hover { background:var(--surface-2); }
body.mode-dark .sidebar-brand-inner { padding:9px 12px; border-radius:14px; background:rgba(232,247,243,.88); box-shadow:0 10px 28px rgba(0,0,0,.2); }
body.mode-dark .nav-section,
body.mode-dark .nav-link { text-shadow:none; }
body.mode-dark .nav-link:hover { color:#fff; background:rgba(255,255,255,.11); }
body.mode-dark .sidebar-footer p,
body.mode-dark .sidebar-footer button { color:var(--theme-sidebar-text) !important; }
body.mode-dark .topbar-search input,
body.mode-dark input[type=text],
body.mode-dark input[type=email],
body.mode-dark input[type=password],
body.mode-dark input[type=date],
body.mode-dark input[type=datetime-local],
body.mode-dark input[type=number],
body.mode-dark input[type=tel],
body.mode-dark input[type=url],
body.mode-dark select,
body.mode-dark textarea { background:#111d1a; color:var(--text-primary); border-color:var(--border-strong); }
body.mode-dark input::placeholder,
body.mode-dark textarea::placeholder { color:#73857f; }
body.mode-dark .card,
body.mode-dark .stat-card,
body.mode-dark .table-wrap,
body.mode-dark .kpi-widget-card,
body.mode-dark .appearance-theme-card,
body.mode-dark .appearance-mode-card { background:var(--surface-1); border-color:var(--border); }
body.mode-dark .btn { background:var(--surface-2); color:var(--text-primary); border-color:var(--border-strong); }
body.mode-dark .btn:hover { background:#24332f; }
body.mode-dark .btn-primary { color:#fff; background:var(--teal-600); border-color:var(--teal-600); }
body.mode-dark .btn-danger { color:var(--danger); background:transparent; border-color:var(--danger); }
body.mode-dark label,
body.mode-dark .page-header h1,
body.mode-dark .card h2,
body.mode-dark .card h3,
body.mode-dark .card-title { color:var(--text-primary); }
body.mode-dark th { color:var(--text-secondary); background:#182520; border-color:var(--border); }
body.mode-dark td { border-color:var(--border); }
body.mode-dark tr:hover td { background:#1b2925; }
body.mode-dark .badge-gray { background:#26332f; }
body.mode-dark .tabs { background:#111d1a; border-color:var(--border); }
body.mode-dark .tab.active { color:var(--text-primary); background:var(--surface-2); }
body.mode-dark input:focus,
body.mode-dark select:focus,
body.mode-dark textarea:focus { background:#16241f; }
body.mode-dark .staff-modal,
body.mode-dark .stat-detail-modal { background:var(--surface-1); color:var(--text-primary); }
body.mode-dark .staff-modal-backdrop { background:rgba(3,8,7,.72); }
body.mode-dark .appearance-theme-mini-title { color:#ecf5f2; }
body.mode-dark .themed-login-wrap { background-color:var(--theme-canvas); }
body.mode-dark .themed-login-card { background:rgba(20,32,29,.96); border-color:rgba(151,185,175,.16); box-shadow:0 28px 80px rgba(0,0,0,.48); }
body.mode-dark .themed-login-card > img { padding:9px 14px; border-radius:14px; background:rgba(235,248,245,.9); filter:drop-shadow(0 5px 14px rgba(0,0,0,.22)); }
body.mode-dark .themed-login-heading h1,
body.mode-dark .themed-login-card label { color:var(--text-primary); }
body.mode-dark .dashboard-page-shell,
body.mode-dark .kpi-dashboard-page { background-color:var(--theme-canvas); }
body.mode-dark .dashboard-hero { border-color:var(--border); background:rgba(15,25,22,.78); }
body.mode-dark .dashboard-hero-copy,
body.mode-dark .dashboard-content-panel { color:var(--text-primary); }
body.mode-dark .dashboard-date,
body.mode-dark .dashboard-hero .subtitle { color:var(--text-secondary); }
body.mode-dark .dashboard-hero h1 { color:var(--text-primary); }
body.mode-dark .dashboard-hero-actions .btn { background:rgba(28,43,38,.86); }
body.mode-dark .dashboard-quote-panel { border-color:var(--border); background-image:linear-gradient(90deg,rgba(7,16,14,.56),rgba(7,16,14,.38)),var(--theme-quote-art); }
body.mode-dark .dashboard-quote-mark,
body.mode-dark .dashboard-quote-panel blockquote,
body.mode-dark .dashboard-quote-panel a { color:#eff8f5; text-shadow:0 1px 6px rgba(0,0,0,.45); }
body.mode-dark .dashboard-rail .card { background:linear-gradient(150deg,#182722,#111d1a); }
body.mode-dark .stat-card,
body.mode-dark.gradient-cards .stat-card.stat-card-gradient,
body.mode-dark.gradient-cards .stat-card.accent-1,
body.mode-dark.gradient-cards .stat-card.accent-2,
body.mode-dark.gradient-cards .stat-card.accent-3,
body.mode-dark.gradient-cards .stat-card.accent-4,
body.mode-dark.gradient-cards .stat-card.accent-5 { color:var(--text-primary); background:rgba(22,35,31,.95); border-color:var(--border); }
body.mode-dark .stat-card .value,
body.mode-dark.gradient-cards .stat-card.stat-card-gradient .value,
body.mode-dark .stat-card .label,
body.mode-dark.gradient-cards .stat-card.stat-card-gradient .label { color:var(--text-primary); }
body.mode-dark .stat-card .label,
body.mode-dark.gradient-cards .stat-card.stat-card-gradient .label { color:var(--text-secondary); }
body.mode-dark .stat-card .stat-icon,
body.mode-dark.gradient-cards .stat-card.stat-card-gradient .stat-icon { color:#77c9b0; background:#203d35; }
body.mode-dark .stat-card.accent-3 .stat-icon { color:#f0ba6c; background:#3b3020; }
body.mode-dark .stat-card.accent-5 .stat-icon { color:#77b9e4; background:#1c3240; }
body.mode-dark .kpi-hero-header { border-color:rgba(149,181,171,.17); box-shadow:0 20px 50px rgba(0,0,0,.32); }
body.mode-dark .kpi-hero-header { background-image:linear-gradient(90deg,rgba(14,26,22,.97) 0%,rgba(14,26,22,.89) 55%,rgba(14,26,22,.38) 100%),var(--theme-quote-art); }
body.mode-dark .kpi-hero-header h1 { color:var(--text-primary); }
body.mode-dark .kpi-hero-header p,
body.mode-dark .kpi-hero-meta span { color:var(--text-secondary); }
body.mode-dark .kpi-hero-meta span { background:rgba(17,30,26,.7); border-color:var(--border); }
body.mode-dark .kpi-hero-meta strong { color:var(--success); }
body.mode-dark .kpi-dashboard-page .kpi-widget-card { background:linear-gradient(145deg,rgba(24,38,34,.98),rgba(18,29,26,.94)); border-color:rgba(139,173,163,.16); box-shadow:0 12px 34px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.035); }
body.mode-dark .kpi-dashboard-page .kpi-widget-card:hover { border-color:color-mix(in srgb,var(--kpi-accent) 42%,var(--border)); box-shadow:0 18px 46px rgba(0,0,0,.36); }
body.mode-dark .kpi-widget-mark { background:color-mix(in srgb,var(--kpi-accent) 18%,#101a17); }
body.mode-dark .kpi-dashboard-page .kpi-widget-title,
body.mode-dark .kpi-number-label { color:var(--text-primary); }
body.mode-dark .kpi-dashboard-page .kpi-widget-controls select,
body.mode-dark .kpi-dashboard-page .kpi-icon-btn { color:var(--text-secondary); background:rgba(13,24,21,.88); border-color:var(--border); }
body.mode-dark .kpi-dashboard-page .kpi-icon-btn:hover { background:color-mix(in srgb,var(--kpi-accent) 15%,#101a17); }
body.mode-dark .kpi-widget-foot { border-color:rgba(151,185,175,.12); color:var(--text-muted); }
body.mode-dark .error-msg { background:var(--danger-bg); color:var(--danger); }
body.mode-dark hr { border-color:var(--border); }

/* Chat — calm, spacious team messaging */
.chat-page { max-width:1120px; margin:0 auto; }
.section-eyebrow { display:block; margin-bottom:7px; color:var(--teal-600); font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.chat-hero { position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:24px; min-height:190px; margin-bottom:18px; padding:28px 30px; overflow:hidden; border:1px solid rgba(255,255,255,.74); border-radius:22px; background-image:linear-gradient(90deg,rgba(255,255,255,.95),rgba(255,255,255,.82) 58%,rgba(255,255,255,.26)),var(--theme-quote-art); background-size:cover; background-position:center; box-shadow:0 15px 38px rgba(38,62,55,.10); }
.chat-hero::after { content:''; position:absolute; right:-70px; bottom:-120px; width:280px; height:280px; border:1px solid color-mix(in srgb,var(--teal-600) 18%,transparent); border-radius:50%; box-shadow:0 0 0 34px color-mix(in srgb,var(--teal-600) 6%,transparent); }
.chat-hero > * { position:relative; z-index:1; }
.chat-hero h1 { display:flex; align-items:center; gap:12px; margin:0; color:#182924; font-family:var(--font-display); font-size:40px; line-height:1; letter-spacing:-.035em; }
.chat-hero p { margin:11px 0 0; color:#586963; font-size:13.5px; }
.chat-hero-icon { display:grid; place-items:center; width:43px; height:43px; border-radius:14px; color:#fff; background:linear-gradient(145deg,var(--teal-400),var(--teal-800)); box-shadow:0 9px 20px color-mix(in srgb,var(--teal-600) 25%,transparent); }
.chat-hero-icon svg { width:21px; height:21px; }
.chat-hero-meta { display:flex; gap:8px; margin-top:17px; }
.chat-hero-meta span { display:flex; align-items:center; gap:6px; padding:6px 10px; border:1px solid rgba(80,105,96,.13); border-radius:999px; background:rgba(255,255,255,.62); color:#5f6e69; font-size:10.5px; font-weight:650; }
.chat-hero-meta i { width:7px; height:7px; border-radius:50%; background:var(--success); box-shadow:0 0 0 4px color-mix(in srgb,var(--success) 14%,transparent); }
.chat-new-btn { min-height:44px; padding-inline:19px; }
.chat-hero-actions { display:flex; align-items:center; gap:9px; }
.chat-alert-settings-btn,.chat-sound-preview,.chat-popout-btn { border:1px solid color-mix(in srgb,var(--teal-600) 24%,var(--border)); color:var(--teal-800); background:color-mix(in srgb,var(--surface-1) 84%,transparent); }
.chat-alert-panel { display:grid; grid-template-columns:minmax(190px,1.2fr) minmax(150px,.7fr) auto minmax(190px,1fr) minmax(170px,1fr) auto; align-items:center; gap:12px; margin:-4px 0 18px; padding:15px 17px; border:1px solid var(--border); border-radius:17px; background:var(--surface-1); box-shadow:var(--shadow-sm); }
.chat-alert-panel[hidden] { display:none; }.chat-alert-panel strong { color:var(--text-primary); font-size:13px; }.chat-alert-panel p { margin:3px 0 0; color:var(--text-muted); font-size:10.5px; }.chat-alert-panel label:not(.chat-alert-switch) { display:grid; gap:4px; color:var(--text-muted); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }.chat-alert-panel select { min-height:38px; padding:7px 32px 7px 10px; }
.chat-alert-switch { display:flex; align-items:center; gap:8px; color:var(--text-secondary); font-size:11px; line-height:1.3; cursor:pointer; }.chat-alert-switch input { width:17px; height:17px; accent-color:var(--teal-600); }.chat-alert-saved { min-width:38px; color:var(--success); font-size:10px; font-weight:800; }
.chat-popout-btn { flex:0 0 auto; min-height:36px; padding:7px 11px; font-size:11px; }
.chat-hero-compact { min-height:155px; }
.chat-conversation-list { display:grid; gap:10px; }
.chat-conversation-card { position:relative; display:flex; align-items:center; gap:12px; min-height:92px; overflow:hidden; border:1px solid var(--border); border-radius:17px; background:rgba(255,255,255,.92); box-shadow:var(--shadow-sm); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.chat-conversation-card::before { content:''; position:absolute; inset:0 auto 0 0; width:4px; background:transparent; }
.chat-conversation-card.has-unread::before { background:linear-gradient(var(--teal-400),var(--teal-600)); }
.chat-conversation-card:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--teal-600) 26%,var(--border)); box-shadow:var(--shadow-md); }
.chat-conversation-link { display:flex; align-items:center; gap:15px; flex:1; min-width:0; padding:16px 10px 16px 18px; color:inherit; text-decoration:none; }
.chat-conversation-link:hover { text-decoration:none; }
.chat-avatar-wrap { position:relative; flex:0 0 auto; }
.chat-avatar { width:54px; height:54px; object-fit:cover; border:1px solid color-mix(in srgb,var(--teal-600) 18%,var(--border)); border-radius:17px; }
.chat-avatar-fallback { display:grid; place-items:center; color:var(--teal-800); background:linear-gradient(145deg,var(--teal-50),var(--teal-100)); font-weight:800; letter-spacing:.02em; }
.chat-presence { position:absolute; right:-3px; bottom:-2px; width:13px; height:13px; border:3px solid var(--surface-1); border-radius:50%; background:#9ca9a5; }
.chat-presence.is-online { background:#35b778; box-shadow:0 0 0 3px rgba(53,183,120,.13); }
.chat-conversation-copy { flex:1; min-width:0; }
.chat-conversation-heading { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.chat-conversation-heading strong { overflow:hidden; color:var(--text-primary); font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.chat-conversation-heading time { flex:0 0 auto; color:var(--text-muted); font-size:10.5px; }
.chat-conversation-copy p { margin:4px 0 7px; overflow:hidden; color:var(--text-secondary); font-size:12.5px; text-overflow:ellipsis; white-space:nowrap; }
.chat-status-label { color:var(--text-muted); font-size:10px; font-weight:650; text-transform:uppercase; letter-spacing:.07em; }
.chat-conversation-actions { display:flex; align-items:center; gap:8px; padding-right:15px; }
.chat-unread { display:grid; place-items:center; min-width:24px; height:24px; padding:0 7px; border-radius:999px; color:#fff; background:var(--teal-600); font-size:10px; font-weight:800; }
.chat-delete-btn { display:grid; place-items:center; width:31px; height:31px; border:1px solid transparent; border-radius:9px; color:var(--text-muted); background:transparent; font-size:19px; cursor:pointer; }
.chat-delete-btn:hover { color:var(--danger); border-color:color-mix(in srgb,var(--danger) 28%,transparent); background:var(--danger-bg); }
.chat-empty { padding:52px 24px; text-align:center; }
.chat-empty-icon { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 15px; border-radius:18px; color:var(--teal-600); background:var(--teal-50); }
.chat-empty h2 { margin:0 0 7px; font-size:19px; }.chat-empty p { margin:0 auto 18px; color:var(--text-secondary); }
.chat-thread-topbar { display:flex; align-items:center; gap:12px; margin-bottom:12px; padding:12px 14px; border:1px solid var(--border); border-radius:17px; background:var(--surface-1); box-shadow:var(--shadow-sm); }
.chat-thread-topbar .chat-avatar { width:44px; height:44px; border-radius:14px; }
.chat-back { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; color:var(--text-primary); background:var(--surface-0); font-size:18px; }
.chat-back:hover { text-decoration:none; background:var(--teal-50); }
.chat-thread-person { flex:1; min-width:0; }.chat-thread-person h1 { margin:0; font-size:16px; }.chat-thread-person p { display:flex; align-items:center; gap:8px; margin:3px 0 0; color:var(--text-muted); font-size:11px; }.chat-thread-person .chat-presence { position:static; border-width:0; }
.chat-delete-conversation { border:0; color:var(--text-muted); background:transparent; font:inherit; font-size:11px; cursor:pointer; }.chat-delete-conversation:hover { color:var(--danger); }
.chat-thread-card { display:flex; flex-direction:column; height:calc(100vh - 190px); min-height:480px; overflow:hidden; border:1px solid var(--border); border-radius:21px; background:var(--surface-1); box-shadow:0 18px 45px rgba(38,62,55,.10); }
.chat-message-list { flex:1; display:flex; flex-direction:column; gap:11px; overflow-y:auto; padding:25px; background-image:linear-gradient(var(--theme-canvas-wash),var(--theme-canvas-wash)),var(--theme-watermark-art); background-size:cover; }
.chat-message { display:flex; flex-direction:column; max-width:min(72%,620px); }.chat-message.is-mine { align-self:flex-end; align-items:flex-end; }.chat-message.is-theirs { align-self:flex-start; align-items:flex-start; }
.chat-bubble { padding:10px 14px; border:1px solid var(--border); border-radius:16px 16px 16px 5px; color:var(--text-primary); background:rgba(255,255,255,.93); box-shadow:0 4px 15px rgba(30,55,47,.06); font-size:13.5px; line-height:1.48; }
.chat-message.is-mine .chat-bubble { color:#fff; border-color:transparent; border-radius:16px 16px 5px 16px; background:linear-gradient(145deg,var(--teal-400),var(--teal-600)); box-shadow:0 7px 18px color-mix(in srgb,var(--teal-600) 20%,transparent); }
.chat-bubble p { margin:0; white-space:pre-wrap; }.chat-file { display:block; margin-top:6px; color:inherit; font-size:12px; text-decoration:underline; }.chat-message time { margin:4px 5px 0; color:var(--text-muted); font-size:9.5px; }
.chat-image-preview { position:relative;display:block;width:min(360px,56vw);margin-top:8px;overflow:hidden;border:1px solid rgba(255,255,255,.22);border-radius:12px;color:#fff;background:#dce8e3;text-decoration:none; }
.chat-image-preview img { display:block;width:100%;max-height:300px;object-fit:cover;transition:transform .22s ease; }
.chat-image-preview span { position:absolute;right:8px;bottom:8px;padding:5px 8px;border-radius:8px;color:#fff;background:rgba(8,37,30,.72);box-shadow:0 3px 10px rgba(0,0,0,.16);font-size:9px;font-weight:700;backdrop-filter:blur(6px); }
.chat-image-preview:hover { text-decoration:none; }.chat-image-preview:hover img { transform:scale(1.018); }
.chat-audio-preview { display:grid;gap:7px;width:min(350px,60vw);margin-top:8px;padding:10px;border:1px solid rgba(36,77,65,.12);border-radius:12px;color:var(--text-primary);background:rgba(248,251,249,.94); }
.chat-audio-preview > span { overflow:hidden;font-size:10.5px;font-weight:700;text-overflow:ellipsis;white-space:nowrap; }
.chat-audio-preview audio { width:100%;height:34px; }
.chat-audio-preview > a { color:var(--teal-700);font-size:9.5px;font-weight:700;justify-self:end; }
.chat-message.is-mine .chat-audio-preview { color:var(--text-primary);background:rgba(255,255,255,.94); }
.chat-composer { position:relative; display:flex; align-items:center; gap:8px; padding:12px 13px; border-top:1px solid var(--border); background:var(--surface-1); }
.chat-tool-btn { display:grid; place-items:center; width:38px; height:38px; margin:0; padding:0; border:1px solid var(--border); border-radius:11px; color:var(--text-secondary); background:var(--surface-0); font-size:16px; cursor:pointer; }
.chat-input-wrap { position:relative; flex:1; }.chat-input-wrap input { min-height:44px; padding-right:16px; }.chat-input-wrap span { display:block; margin:4px 4px 0; color:var(--teal-600); font-size:10px; }
.chat-send-btn { min-height:43px; padding-inline:17px; }.chat-send-btn span { font-size:16px; }
.chat-emoji-picker { position:absolute; left:12px; bottom:65px; z-index:10; display:none; grid-template-columns:repeat(8,1fr); gap:3px; max-width:292px; padding:9px; border:1px solid var(--border); border-radius:13px; background:var(--surface-1); box-shadow:var(--shadow-lg); }.chat-emoji-picker.is-open { display:grid; }.chat-emoji-picker button { padding:5px; border:0; border-radius:7px; background:transparent; font-size:18px; cursor:pointer; }.chat-emoji-picker button:hover { background:var(--surface-0); }
.chat-people-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:12px; }.chat-person-card { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; padding:16px; border:1px solid var(--border); border-radius:17px; background:var(--surface-1); box-shadow:var(--shadow-sm); }.chat-person-copy { display:flex; flex-direction:column; min-width:0; }.chat-person-copy strong { color:var(--text-primary); font-size:13.5px; }.chat-person-copy span { margin-top:2px; color:var(--text-secondary); font-size:11.5px; text-transform:capitalize; }.chat-person-copy small { margin-top:6px; color:var(--text-muted); font-size:10px; }
.mb-alert-tray { position:fixed; top:76px; right:18px; z-index:9999; display:grid; gap:9px; width:min(350px,calc(100vw - 28px)); pointer-events:none; }.mb-live-alert { display:grid; gap:3px; padding:14px 16px; border:1px solid color-mix(in srgb,var(--teal-600) 25%,var(--border)); border-radius:15px; color:var(--text-primary); background:color-mix(in srgb,var(--surface-1) 96%,transparent); box-shadow:0 16px 42px rgba(15,58,47,.2); text-align:left; opacity:0; transform:translateY(-10px); transition:.2s ease; cursor:pointer; pointer-events:auto; }.mb-live-alert.is-visible { opacity:1; transform:translateY(0); }.mb-live-alert strong { color:var(--teal-700); font-size:12px; }.mb-live-alert span { color:var(--text-secondary); font-size:11.5px; }
.chat-popout-body { min-height:100vh; overflow:hidden; background-image:linear-gradient(var(--theme-canvas-wash),var(--theme-canvas-wash)),var(--theme-watermark-art); background-size:cover; }.chat-popout-shell { display:flex; flex-direction:column; width:100vw; height:100vh; padding:10px; }.chat-popout-header { display:flex; align-items:center; gap:11px; padding:10px 11px; border:1px solid var(--border); border-radius:16px 16px 0 0; background:color-mix(in srgb,var(--surface-1) 94%,transparent); box-shadow:var(--shadow-sm); }.chat-popout-header .chat-avatar { width:42px; height:42px; border-radius:13px; }.chat-popout-header .chat-presence { position:static; border:0; }.chat-popout-close { display:grid; place-items:center; width:34px; height:34px; border:0; border-radius:10px; color:var(--text-muted); background:var(--surface-0); font-size:21px; cursor:pointer; }.chat-popout-shell .chat-thread-card { flex:1; min-height:0; height:auto; border-radius:0 0 16px 16px; }.chat-popout-shell .chat-message-list { padding:17px; }.chat-popout-shell .chat-composer { padding:10px; }.chat-popout-shell .chat-send-btn { padding-inline:13px; }
.inquiry-card-focus { outline:3px solid color-mix(in srgb,var(--teal-500) 38%,transparent); box-shadow:0 14px 38px color-mix(in srgb,var(--teal-700) 18%,transparent); animation:inquiry-focus-pulse 1.2s ease 2; }@keyframes inquiry-focus-pulse { 50% { transform:translateY(-3px); } }
body.mode-dark .chat-hero { border-color:rgba(149,181,171,.17); background-image:linear-gradient(90deg,rgba(14,26,22,.97),rgba(14,26,22,.88) 58%,rgba(14,26,22,.4)),var(--theme-quote-art); }.mode-dark .chat-hero h1 { color:var(--text-primary); }.mode-dark .chat-hero p { color:var(--text-secondary); }.mode-dark .chat-hero-meta span { color:var(--text-secondary); border-color:var(--border); background:rgba(17,30,26,.72); }.mode-dark .chat-conversation-card { background:rgba(21,33,30,.96); }.mode-dark .chat-bubble { background:rgba(25,39,35,.96); }.mode-dark .chat-message-list { --theme-canvas-wash:rgba(9,17,15,.9); }
@media (max-width:900px) { .chat-alert-panel { grid-template-columns:1fr 1fr; }.chat-alert-panel > div { grid-column:1/-1; } }
@media (max-width:700px) { .chat-hero { align-items:flex-start; flex-direction:column; min-height:0; padding:22px 19px; }.chat-hero h1 { font-size:32px; }.chat-hero-actions { width:100%; }.chat-new-btn { flex:1; justify-content:center; }.chat-alert-panel { grid-template-columns:1fr; }.chat-alert-panel > div { grid-column:auto; }.chat-conversation-card { align-items:stretch; }.chat-conversation-actions { padding-right:9px; }.chat-message { max-width:86%; }.chat-thread-card { height:calc(100vh - 150px); border-radius:16px; }.chat-delete-conversation { display:none; }.chat-composer { flex-wrap:wrap; }.chat-input-wrap { order:-1; flex-basis:100%; }.chat-send-btn { flex:1; justify-content:center; }.chat-people-grid { grid-template-columns:1fr; }.chat-person-card { grid-template-columns:auto 1fr; }.chat-person-card .btn { grid-column:1/-1; justify-content:center; }.chat-thread-topbar .chat-popout-btn { font-size:0; }.chat-thread-topbar .chat-popout-btn::after { content:'↗'; font-size:16px; } }

/* Reports and Analytics — executive overview surfaces */
.reports-page,.analytics-page { max-width:1420px; margin:0 auto; }
.reports-hero { position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:28px; min-height:190px; margin-bottom:18px; padding:29px 32px; overflow:hidden; border:1px solid rgba(255,255,255,.74); border-radius:22px; background-image:linear-gradient(90deg,rgba(255,255,255,.95),rgba(255,255,255,.82) 56%,rgba(255,255,255,.2)),var(--theme-quote-art); background-size:cover; background-position:center; box-shadow:0 15px 38px rgba(38,62,55,.10); }
.reports-hero::after { content:''; position:absolute; right:-55px; bottom:-105px; width:260px; height:260px; border:1px solid color-mix(in srgb,var(--teal-600) 18%,transparent); border-radius:50%; box-shadow:0 0 0 34px color-mix(in srgb,var(--teal-600) 6%,transparent); }
.reports-hero > * { position:relative; z-index:1; }.reports-hero h1 { display:flex; align-items:center; gap:12px; margin:0; color:#182924; font-family:var(--font-display); font-size:clamp(32px,3vw,43px); line-height:1; letter-spacing:-.035em; }.reports-hero p { margin:11px 0 0; color:#586963; font-size:13.5px; }
.reports-hero-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; color:#fff; background:linear-gradient(145deg,var(--teal-400),var(--teal-800)); box-shadow:0 9px 20px color-mix(in srgb,var(--teal-600) 25%,transparent); }.reports-hero-icon svg { width:22px; height:22px; }
.reports-hero-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:17px; }.reports-hero-meta span { display:flex; align-items:center; gap:6px; padding:6px 10px; border:1px solid rgba(80,105,96,.13); border-radius:999px; color:#5f6e69; background:rgba(255,255,255,.62); font-size:10.5px; font-weight:650; }.reports-hero-meta i { width:7px; height:7px; border-radius:50%; background:var(--success); box-shadow:0 0 0 4px color-mix(in srgb,var(--success) 14%,transparent); }
.reports-hero-actions { display:flex; gap:8px; }.reports-hero-actions .btn { min-height:43px; }
.report-alerts { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:11px; margin-bottom:16px; }.report-alert { display:grid; grid-template-columns:40px 1fr; gap:12px; min-height:118px; padding:16px; border:1px solid var(--border); border-radius:16px; background:var(--surface-1); box-shadow:var(--shadow-sm); }.report-alert.is-danger { border-color:color-mix(in srgb,var(--danger) 34%,var(--border)); }.report-alert.is-warning { border-color:color-mix(in srgb,var(--warning) 38%,var(--border)); }.report-alert-icon { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:var(--danger); background:var(--danger-bg); font-size:17px; font-weight:800; }.report-alert.is-warning .report-alert-icon { color:var(--warning); background:var(--warning-bg); }.report-alert h3 { margin:1px 0 5px; color:var(--text-primary); font-size:13px; }.report-alert p { margin:0 0 7px; color:var(--text-secondary); font-size:11.5px; }.report-alert-links { display:flex; flex-direction:column; gap:4px; }.report-alert-links a,.report-alert-links span { overflow:hidden; color:var(--text-secondary); font-size:10.5px; text-overflow:ellipsis; white-space:nowrap; }
.report-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; margin-bottom:15px; }.report-chart-card,.report-data-card { position:relative; overflow:hidden; padding:20px; border:1px solid var(--border); border-radius:18px; background:var(--surface-1); box-shadow:var(--shadow-sm); }.report-chart-card::before { content:''; position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,var(--chart-1),var(--chart-2)); }.report-accent-2::before { background:linear-gradient(90deg,var(--chart-3),var(--chart-4)); }.report-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:19px; }.report-card-head span { color:var(--teal-600); font-size:9px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }.report-card-head h2 { margin:4px 0 0; color:var(--text-primary); font-size:15px; }.report-card-badge { padding:5px 8px; border-radius:999px; color:var(--text-secondary) !important; background:var(--surface-0); letter-spacing:0 !important; text-transform:none !important; }
.report-bars { display:flex; flex-direction:column; gap:13px; }.report-bar-row > div:first-child { display:flex; justify-content:space-between; gap:12px; margin-bottom:5px; color:var(--text-secondary); font-size:11px; }.report-bar-row strong { color:var(--text-primary); font-size:10.5px; }.report-bar-track { height:9px; overflow:hidden; border-radius:999px; background:var(--surface-0); }.report-bar-track i { display:block; height:100%; min-width:4px; border-radius:inherit; background:linear-gradient(90deg,var(--bar-color),color-mix(in srgb,var(--bar-color) 62%,white)); box-shadow:0 3px 10px color-mix(in srgb,var(--bar-color) 24%,transparent); }
.report-table-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(210px,.55fr); gap:15px; }.report-ranked-list { display:flex; flex-direction:column; }.report-ranked-list > div { display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:10px; min-height:45px; border-bottom:1px solid var(--border); }.report-ranked-list > div:last-child { border-bottom:0; }.report-rank { color:var(--text-muted); font-size:9px; font-weight:800; }.report-ranked-list strong { overflow:hidden; color:var(--text-primary); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.report-ranked-list b { color:var(--text-secondary); font-size:11px; font-weight:650; }.report-signal-card { position:relative; display:flex; flex-direction:column; justify-content:center; min-height:230px; overflow:hidden; padding:24px; border-radius:18px; color:#fff; background:linear-gradient(145deg,var(--teal-400),var(--teal-800)); box-shadow:0 15px 36px color-mix(in srgb,var(--teal-800) 23%,transparent); }.report-signal-card > span { font-size:9px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; opacity:.8; }.report-signal-card strong { margin:16px 0 2px; font-family:var(--font-display); font-size:48px; line-height:1; }.report-signal-card p { margin:0; font-size:12px; opacity:.82; }.report-signal-card i { position:absolute; right:-42px; bottom:-50px; width:150px; height:150px; border:24px solid rgba(255,255,255,.08); border-radius:50%; }
.analytics-hero { min-height:165px; }.analytics-filter-card { position:sticky; top:8px; z-index:4; padding:13px 15px; background:color-mix(in srgb,var(--surface-1) 94%,transparent); backdrop-filter:blur(14px); }.analytics-filter-card .filter-bar { gap:7px; }.analytics-section-title { display:flex; align-items:center; gap:10px; margin:25px 0 12px; color:var(--text-primary); font-size:14px; }.analytics-section-title span { display:grid; place-items:center; width:31px; height:31px; border-radius:10px; color:var(--teal-600); background:var(--teal-50); font-size:9px; font-weight:850; }.analytics-stat-grid { grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:11px; }.analytics-stat-grid .stat-card { min-height:116px; align-items:flex-start; justify-content:center; flex-direction:column; gap:7px; border-radius:16px; }.analytics-stat-grid .stat-card .label { padding:0; }.analytics-stat-grid .stat-card .value { max-width:100%; margin:0; font-size:27px; overflow-wrap:anywhere; }.analytics-detail-card { border-radius:18px; }.analytics-referral-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
body.mode-dark .reports-hero { border-color:rgba(149,181,171,.17); background-image:linear-gradient(90deg,rgba(14,26,22,.97),rgba(14,26,22,.88) 56%,rgba(14,26,22,.38)),var(--theme-quote-art); }.mode-dark .reports-hero h1 { color:var(--text-primary); }.mode-dark .reports-hero p { color:var(--text-secondary); }.mode-dark .reports-hero-meta span { color:var(--text-secondary); border-color:var(--border); background:rgba(17,30,26,.72); }.mode-dark .report-chart-card,.mode-dark .report-data-card,.mode-dark .report-alert { background:var(--surface-1); }.mode-dark .report-bar-track { background:#0f1b18; }
@media (max-width:980px) { .report-table-grid { grid-template-columns:1fr 1fr; }.report-signal-card { grid-column:1/-1; min-height:150px; }.analytics-filter-card { position:static; } }
@media (max-width:760px) { .reports-hero { align-items:flex-start; flex-direction:column; min-height:0; padding:22px 19px; }.reports-hero-actions { width:100%; }.reports-hero-actions .btn { flex:1; justify-content:center; }.report-feature-grid,.report-table-grid,.analytics-referral-grid { grid-template-columns:1fr; }.report-signal-card { grid-column:auto; }.analytics-filter-card .filter-bar { align-items:stretch; }.analytics-filter-card input,.analytics-filter-card select { width:100% !important; } }

/* ==================== 2026 calm-premium workspace system ==================== */
:root {
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px;
  --radius-sm:8px; --radius-md:12px; --radius-lg:18px; --radius-xl:24px;
  --focus-ring:0 0 0 3px color-mix(in srgb,var(--teal-400) 25%,transparent);
  --motion-fast:140ms; --motion-normal:220ms;
}
.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.skip-link { position:fixed; left:16px; top:10px; z-index:20000; padding:9px 13px; border-radius:9px; color:#fff; background:var(--teal-800); box-shadow:var(--shadow-md); transform:translateY(-150%); transition:transform var(--motion-fast) ease; }
.skip-link:focus { color:#fff; text-decoration:none; transform:translateY(0); }
:focus-visible { outline:2px solid var(--teal-400); outline-offset:2px; }
button,input,select,textarea,a { -webkit-tap-highlight-color:transparent; }
input[type=text],input[type=email],input[type=password],input[type=date],input[type=datetime-local],input[type=number],input[type=tel],input[type=url],input[type=search],select,textarea { transition:border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease,background var(--motion-fast) ease; }
input:focus,select:focus,textarea:focus { outline:0; border-color:var(--teal-400); box-shadow:var(--focus-ring); }
button:disabled,.btn:disabled { cursor:not-allowed; opacity:.58; transform:none !important; box-shadow:none !important; }
.btn.is-loading { position:relative; color:transparent !important; pointer-events:none; }
.btn.is-loading::after { content:''; position:absolute; left:50%; top:50%; width:14px; height:14px; margin:-8px 0 0 -8px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; color:var(--teal-600); animation:mb-spin .7s linear infinite; }
.btn-primary.is-loading::after { color:#fff; }
@keyframes mb-spin { to { transform:rotate(360deg); } }

.card,.table-wrap { border-radius:var(--radius-lg); }
.card { box-shadow:0 1px 2px rgba(18,44,36,.04),0 8px 28px rgba(18,44,36,.045); }
.card-title { letter-spacing:-.01em; }
.table-wrap { box-shadow:0 1px 2px rgba(18,44,36,.035); }
th { background:color-mix(in srgb,var(--surface-0) 76%,var(--surface-1)); }
tbody tr:last-child td { border-bottom:0; }
.badge { border:1px solid color-mix(in srgb,currentColor 13%,transparent); border-radius:999px; line-height:1.25; text-transform:capitalize; }
.empty-state { min-height:128px; padding:40px 22px !important; color:var(--text-secondary); }
.empty-state::before { content:'◇'; display:grid; place-items:center; width:38px; height:38px; margin:0 auto 10px; border:1px solid var(--border); border-radius:12px; color:var(--teal-600); background:var(--surface-0); font-size:18px; }

.topbar-search { position:relative; }
.topbar-search input { padding-right:76px; }
.search-shortcut { position:absolute; right:7px; top:50%; transform:translateY(-50%); padding:4px 7px; border:1px solid var(--border); border-radius:7px; color:var(--text-muted); background:var(--surface-1); font:inherit; font-size:9px; font-weight:700; letter-spacing:.04em; cursor:pointer; }
.topbar-tool { display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 10px; border:1px solid transparent; border-radius:10px; color:var(--text-secondary); background:transparent; font:inherit; font-size:11.5px; font-weight:650; cursor:pointer; }
.topbar-tool:hover,.topbar-tool[aria-pressed=true] { color:var(--teal-700); border-color:var(--border); background:var(--surface-0); }
.topbar-tool > span:first-child { font-size:16px; }

.command-backdrop { position:fixed; inset:0; z-index:10000; background:rgba(7,21,17,.42); backdrop-filter:blur(5px); }
.command-palette { position:fixed; left:50%; top:min(14vh,120px); z-index:10001; width:min(640px,calc(100vw - 28px)); overflow:hidden; border:1px solid color-mix(in srgb,var(--teal-600) 18%,var(--border)); border-radius:21px; color:var(--text-primary); background:color-mix(in srgb,var(--surface-1) 97%,transparent); box-shadow:0 28px 90px rgba(8,39,30,.28); transform:translateX(-50%); }
.command-palette[hidden],.command-backdrop[hidden] { display:none; }
.command-search-row { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; padding:13px 16px; border-bottom:1px solid var(--border); }
.command-search-mark { display:grid; place-items:center; width:35px; height:35px; border-radius:11px; color:var(--teal-700); background:var(--teal-50); font-size:22px; }
.command-search-row input { width:100%; padding:9px 0; border:0 !important; color:var(--text-primary); background:transparent !important; box-shadow:none !important; font-size:15px; }
.command-search-row kbd { padding:4px 7px; border:1px solid var(--border); border-bottom-width:2px; border-radius:7px; color:var(--text-muted); background:var(--surface-0); font:inherit; font-size:9px; }
.command-results { max-height:min(54vh,460px); overflow-y:auto; padding:9px; }
.command-group-label { margin:5px 9px 7px; color:var(--text-muted); font-size:9px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.command-results [data-command-item] { display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; min-height:46px; padding:9px 11px; border:0; border-radius:11px; color:var(--text-primary); background:transparent; font:inherit; text-align:left; cursor:pointer; }
.command-results [data-command-item]:hover,.command-results [data-command-item].is-active { text-decoration:none; background:var(--teal-50); }
.command-results [data-command-item] span { font-size:12.5px; font-weight:680; }
.command-results [data-command-item] small { overflow:hidden; color:var(--text-muted); font-size:10.5px; text-overflow:ellipsis; white-space:nowrap; }
.command-footer { display:flex; gap:18px; padding:9px 17px; border-top:1px solid var(--border); color:var(--text-muted); background:var(--surface-0); font-size:9.5px; }
body.command-open { overflow:hidden; }

.quick-actions { position:fixed; right:24px; bottom:22px; z-index:120; }
.quick-actions-trigger { display:flex; align-items:center; gap:8px; min-height:46px; padding:0 18px 0 13px; border:1px solid rgba(255,255,255,.22); border-radius:999px; color:#fff; background:linear-gradient(145deg,var(--teal-400),var(--teal-800)); box-shadow:0 12px 30px rgba(10,80,65,.28); font:inherit; font-size:12px; font-weight:750; cursor:pointer; transition:transform var(--motion-fast) ease,box-shadow var(--motion-fast) ease; }
.quick-actions-trigger:hover { transform:translateY(-2px); box-shadow:0 16px 38px rgba(10,80,65,.34); }
.quick-actions-trigger > span:first-child { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:rgba(255,255,255,.16); font-size:20px; font-weight:400; transition:transform var(--motion-normal) ease; }
.quick-actions.is-open .quick-actions-trigger > span:first-child { transform:rotate(45deg); }
.quick-actions-menu { position:absolute; right:0; bottom:56px; display:none; width:250px; padding:8px; border:1px solid var(--border); border-radius:17px; background:var(--surface-1); box-shadow:var(--shadow-lg); }
.quick-actions.is-open .quick-actions-menu { display:grid; animation:mb-menu-in var(--motion-normal) ease both; }
@keyframes mb-menu-in { from { opacity:0; transform:translateY(8px) scale(.98); } }
.quick-actions-menu a { display:flex; flex-direction:column; gap:2px; padding:11px 12px; border-radius:11px; color:var(--text-primary); }
.quick-actions-menu a:hover { text-decoration:none; background:var(--teal-50); }
.quick-actions-menu strong { font-size:12px; }.quick-actions-menu small { color:var(--text-muted); font-size:10px; }

body.focus-workspace [data-focus-toggle] { color:var(--teal-700); background:var(--teal-50); }
@media (min-width:861px) {
  body.focus-workspace .sidebar { display:none; }
  body.focus-workspace .main { max-width:1540px; margin-inline:auto; }
  body.focus-workspace .workspace-shell { width:100%; }
}

/* Derived workflow views */
.today-strip { display:grid; grid-template-columns:minmax(240px,1.2fr) repeat(4,minmax(100px,.55fr)); gap:10px; margin:0 0 18px; }
.today-intro,.today-metric { min-height:96px; padding:16px 17px; border:1px solid var(--border); border-radius:16px; background:color-mix(in srgb,var(--surface-1) 95%,transparent); box-shadow:var(--shadow-sm); }
.today-intro { position:relative; overflow:hidden; background:linear-gradient(135deg,color-mix(in srgb,var(--teal-50) 82%,var(--surface-1)),var(--surface-1)); }
.today-intro::after { content:''; position:absolute; right:-36px; bottom:-64px; width:130px; height:130px; border:18px solid color-mix(in srgb,var(--teal-400) 10%,transparent); border-radius:50%; }
.today-intro span { color:var(--teal-700); font-size:9px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }.today-intro h2 { margin:6px 0 3px; font-family:var(--font-display); font-size:20px; }.today-intro p { margin:0; color:var(--text-secondary); font-size:11px; }
.today-metric { display:flex; flex-direction:column; justify-content:center; color:inherit; transition:transform var(--motion-fast) ease,border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease; }.today-metric:hover { text-decoration:none; transform:translateY(-2px); border-color:color-mix(in srgb,var(--teal-600) 28%,var(--border)); box-shadow:var(--shadow-md); }.today-metric strong { color:var(--text-primary); font-family:var(--font-display); font-size:25px; }.today-metric span { margin-top:4px; color:var(--text-secondary); font-size:10.5px; }
.today-metric.is-warning strong { color:var(--warning); }.today-metric.is-success strong { color:var(--success); }.today-metric.is-muted strong { color:var(--text-muted); }

.client-snapshot { display:grid; grid-template-columns:minmax(210px,1.35fr) repeat(4,minmax(125px,.7fr)); gap:1px; padding:0; overflow:hidden; background:var(--border); }
.snapshot-primary,.snapshot-item { min-height:116px; padding:20px; background:var(--surface-1); }
.snapshot-primary { display:flex; align-items:center; gap:14px; background:linear-gradient(145deg,var(--teal-800),var(--teal-600)); color:#fff; }
.snapshot-avatar { display:grid; place-items:center; flex:0 0 auto; width:54px; height:54px; border:1px solid rgba(255,255,255,.25); border-radius:17px; background:rgba(255,255,255,.13); font-family:var(--font-display); font-size:20px; font-weight:750; }
.snapshot-primary h2 { margin:0; font-size:17px; }.snapshot-primary p { margin:4px 0 0; color:rgba(255,255,255,.72); font-size:11px; }
.snapshot-item { display:flex; flex-direction:column; justify-content:center; border-left:1px solid var(--border); }.snapshot-item span { color:var(--text-muted); font-size:9px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }.snapshot-item strong { margin-top:8px; color:var(--text-primary); font-size:13px; line-height:1.35; }.snapshot-item small { margin-top:3px; color:var(--text-secondary); font-size:10px; }
.client-workspace { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(300px,.7fr); gap:18px; align-items:start; }
.timeline-card { position:sticky; top:78px; }
.timeline-list { display:flex; flex-direction:column; margin-top:12px; }
.timeline-event { position:relative; display:grid; grid-template-columns:20px 1fr; gap:10px; padding:0 0 17px; }
.timeline-event:not(:last-child)::after { content:''; position:absolute; left:7px; top:15px; bottom:0; width:1px; background:var(--border); }
.timeline-dot { position:relative; z-index:1; width:15px; height:15px; margin-top:2px; border:4px solid var(--surface-1); border-radius:50%; background:var(--teal-400); box-shadow:0 0 0 1px var(--border); }
.timeline-event[data-type=invoice] .timeline-dot { background:var(--gold); }.timeline-event[data-type=appointment] .timeline-dot { background:#4e9cc7; }
.timeline-copy strong { display:block; color:var(--text-primary); font-size:11.5px; }.timeline-copy span { display:block; margin-top:2px; color:var(--text-secondary); font-size:10.5px; line-height:1.4; }.timeline-copy time { display:block; margin-top:3px; color:var(--text-muted); font-size:9.5px; }

.journey-card { padding:18px 20px; }
.journey-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:17px; }.journey-heading h2 { margin:0; font-size:14px; }.journey-heading p { margin:4px 0 0; color:var(--text-muted); font-size:10.5px; }.journey-progress { color:var(--teal-700); font-size:11px; font-weight:750; }
.case-journey { display:grid; grid-template-columns:repeat(10,minmax(76px,1fr)); overflow-x:auto; padding:2px 2px 8px; }
.journey-step { position:relative; min-width:76px; padding-right:8px; text-align:center; }
.journey-step::before { content:''; position:absolute; left:50%; right:-50%; top:11px; height:2px; background:var(--border); }.journey-step:last-child::before { display:none; }
.journey-step-marker { position:relative; z-index:1; display:grid; place-items:center; width:24px; height:24px; margin:0 auto 7px; border:2px solid var(--border-strong); border-radius:50%; color:var(--text-muted); background:var(--surface-1); font-size:9px; font-weight:800; }
.journey-step span:last-child { display:block; color:var(--text-muted); font-size:8.5px; line-height:1.25; }
.journey-step.is-complete::before,.journey-step.is-current::before { background:var(--teal-400); }.journey-step.is-complete .journey-step-marker { border-color:var(--teal-600); color:#fff; background:var(--teal-600); }.journey-step.is-current .journey-step-marker { border-color:var(--teal-600); color:var(--teal-700); background:var(--teal-50); box-shadow:0 0 0 4px color-mix(in srgb,var(--teal-400) 13%,transparent); }.journey-step.is-current span:last-child { color:var(--teal-700); font-weight:750; }
.assessment-overview { display:grid; grid-template-columns:minmax(170px,.55fr) 1fr; gap:15px; margin:13px 0 17px; padding:14px; border:1px solid var(--border); border-radius:14px; background:var(--surface-0); }
.assessment-overview-copy strong { display:block; font-family:var(--font-display); font-size:25px; }.assessment-overview-copy span { color:var(--text-secondary); font-size:10.5px; }
.assessment-bar { align-self:center; height:10px; overflow:hidden; border-radius:999px; background:var(--border); }.assessment-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--teal-400),var(--teal-600)); }

body.mode-dark .command-palette,body.mode-dark .quick-actions-menu { background:var(--surface-1); }.mode-dark .command-results [data-command-item]:hover,.mode-dark .command-results [data-command-item].is-active,.mode-dark .quick-actions-menu a:hover,.mode-dark body.focus-workspace [data-focus-toggle] { background:#20322d; }.mode-dark .today-intro { background:linear-gradient(135deg,#18352d,var(--surface-1)); }.mode-dark .snapshot-primary { background:linear-gradient(145deg,#0b4a3c,#13382f); }

@media (max-width:1100px) { .today-strip { grid-template-columns:repeat(4,1fr); }.today-intro { grid-column:1/-1; }.client-snapshot { grid-template-columns:repeat(2,1fr); }.snapshot-primary { grid-column:1/-1; }.snapshot-item { border-top:1px solid var(--border); }.client-workspace { grid-template-columns:1fr; }.timeline-card { position:static; } }
@media (max-width:700px) { .search-shortcut,.topbar-tool-label { display:none; }.topbar-tool { padding:0 8px; }.quick-actions { right:14px; bottom:14px; }.quick-actions-trigger { min-height:43px; padding-right:14px; }.today-strip { grid-template-columns:repeat(2,1fr); }.today-intro { grid-column:1/-1; }.client-snapshot { grid-template-columns:1fr; }.snapshot-primary { grid-column:auto; }.snapshot-item { border-left:0; }.command-footer { display:none; }.command-palette { top:8px; }.assessment-overview { grid-template-columns:1fr; }.case-journey { padding-bottom:13px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; } }

/* ==================== 2026 whole-app visual foundation ====================
   Shared presentation only: this layer gives every existing module the same
   calm, premium visual language without changing routes, data, or workflows. */
:root {
  --mb-canvas:#f5f6f2;
  --mb-paper:rgba(255,255,255,.94);
  --mb-ink:#17352d;
  --mb-sage:#dcebe4;
  --mb-hairline:rgba(37,78,66,.12);
  --mb-soft-shadow:0 1px 2px rgba(18,55,44,.035),0 12px 34px rgba(18,55,44,.055);
  --mb-lift-shadow:0 18px 42px rgba(18,55,44,.11),0 3px 8px rgba(18,55,44,.05);
}

.desktop-topbar {
  height:72px;
  flex-basis:72px;
  padding-inline:clamp(22px,3vw,42px);
  background:rgba(255,255,255,.88);
  border-bottom-color:rgba(30,67,56,.1);
  backdrop-filter:blur(18px) saturate(145%);
}
.topbar-profile {
  min-height:50px;
  margin-right:-8px;
  padding:5px 9px 5px 6px;
  border:1px solid transparent;
  border-radius:15px;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.topbar-profile:hover {
  background:rgba(244,249,246,.95);
  border-color:var(--mb-hairline);
  box-shadow:0 8px 24px rgba(20,64,51,.07);
  transform:translateY(-1px);
}
.topbar-avatar { width:42px;height:42px;flex-basis:42px; }
.topbar-profile-copy strong { color:var(--mb-ink);font-size:13.25px; }
.topbar-profile-copy small { color:#71827c;letter-spacing:.01em; }

body:not(.dashboard-page) .main {
  background:
    radial-gradient(circle at 96% 0,rgba(159,225,203,.13),transparent 25rem),
    linear-gradient(180deg,rgba(251,251,248,.82),rgba(245,246,242,.96));
}
body:not(.dashboard-page) .main > .page-header {
  position:relative;
  min-height:92px;
  margin:-4px 0 24px;
  padding:20px 22px 20px 25px;
  overflow:hidden;
  border:1px solid var(--mb-hairline);
  border-radius:20px;
  background:
    linear-gradient(102deg,rgba(255,255,255,.97),rgba(247,251,248,.91));
  box-shadow:var(--mb-soft-shadow);
}
body:not(.dashboard-page) .main > .page-header::before {
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:linear-gradient(180deg,#74c9aa,#16775c);
}
body:not(.dashboard-page) .main > .page-header::after {
  content:'';
  position:absolute;
  right:-42px;
  top:-76px;
  width:190px;
  height:190px;
  border:26px solid rgba(58,144,112,.055);
  border-radius:50%;
  pointer-events:none;
}
body:not(.dashboard-page) .main > .page-header > * { position:relative;z-index:1; }
body:not(.dashboard-page) .page-header h1 {
  color:var(--mb-ink);
  font-family:var(--font-display);
  font-size:clamp(26px,2.2vw,34px);
  font-weight:650;
  letter-spacing:-.035em;
}
body:not(.dashboard-page) .page-header .subtitle { max-width:720px;color:#687a73; }

.filter-bar {
  gap:10px;
  margin:0 0 18px;
  padding:13px;
  border:1px solid var(--mb-hairline);
  border-radius:16px;
  background:rgba(255,255,255,.78);
  box-shadow:0 8px 25px rgba(24,61,50,.035);
  backdrop-filter:blur(10px);
}
.filter-bar input[type=text],.filter-bar input[type=search],.filter-bar select {
  min-height:40px;
  border-color:rgba(34,78,65,.14);
  background:#fff;
}

.card,.table-wrap {
  background:var(--mb-paper);
  border-color:var(--mb-hairline);
  box-shadow:var(--mb-soft-shadow);
  backdrop-filter:blur(9px);
}
body:not(.dashboard-page) .card { border-radius:20px; }
body:not(.dashboard-page) .card:hover { border-color:rgba(30,112,84,.2);box-shadow:var(--mb-lift-shadow); }
.table-wrap { overflow:auto;border-radius:18px; }
.table-wrap table { min-width:680px; }
.table-wrap th {
  height:44px;
  padding:11px 15px;
  color:#687b74;
  background:linear-gradient(180deg,#fafcfb,#f5f8f6);
  border-bottom-color:rgba(38,78,66,.12);
  font-size:10px;
  font-weight:750;
  letter-spacing:.085em;
}
.table-wrap td { padding:14px 15px;border-bottom-color:rgba(38,78,66,.085); }
.table-wrap tr:last-child td { border-bottom:0; }
.table-wrap tbody tr { transition:transform .16s ease,box-shadow .16s ease; }
.table-wrap tbody tr:hover td { background:#f6faf7; }
.table-wrap td > a:not(.btn) { color:#155f4a;font-weight:680; }

.badge {
  padding:4px 9px;
  border:1px solid transparent;
  border-radius:999px;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.01em;
}
.badge-teal { border-color:rgba(15,110,86,.1); }
.badge-warning { border-color:rgba(184,134,11,.12); }
.badge-danger { border-color:rgba(192,57,43,.1); }
.badge-gray { border-color:rgba(74,91,84,.09); }

body:not(.dashboard-page) input[type=text],body:not(.dashboard-page) input[type=email],body:not(.dashboard-page) input[type=password],
body:not(.dashboard-page) input[type=date],body:not(.dashboard-page) input[type=datetime-local],body:not(.dashboard-page) input[type=number],
body:not(.dashboard-page) select,body:not(.dashboard-page) textarea {
  min-height:43px;
  padding:10px 12px;
  border-color:rgba(42,82,70,.17);
  border-radius:11px;
  background:rgba(255,255,255,.96);
  box-shadow:inset 0 1px 2px rgba(20,55,45,.025);
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
body:not(.dashboard-page) textarea { min-height:110px;line-height:1.55; }
body:not(.dashboard-page) input:focus,body:not(.dashboard-page) select:focus,body:not(.dashboard-page) textarea:focus {
  outline:0;
  border-color:#75ad99;
  background:#fff;
  box-shadow:0 0 0 4px rgba(30,130,96,.09);
}
body:not(.dashboard-page) label { color:#38554c;font-size:12.5px;font-weight:650; }
body:not(.dashboard-page) .form-actions {
  position:sticky;
  bottom:-1px;
  z-index:4;
  margin:26px -22px -21px;
  padding:14px 22px;
  border-top:1px solid var(--mb-hairline);
  border-radius:0 0 20px 20px;
  background:rgba(255,255,255,.91);
  backdrop-filter:blur(12px);
}

.alert { border-radius:14px;border-width:1px;box-shadow:0 8px 24px rgba(25,60,50,.04); }
.muted { color:#788880; }
.empty-state { min-height:180px!important;padding:52px 24px!important; }
.empty-state::before { width:44px;height:44px;border-radius:14px;background:#eef7f2; }

@media (max-width:860px) {
  body:not(.dashboard-page) .main > .page-header { min-height:0;padding:18px;border-radius:17px; }
  body:not(.dashboard-page) .page-header h1 { font-size:27px; }
  .filter-bar { align-items:stretch; }
  .filter-bar > * { flex:1 1 180px; }
  body:not(.dashboard-page) .form-grid { grid-template-columns:1fr;gap:0; }
}

@media (max-width:560px) {
  body:not(.dashboard-page) .main { padding:18px 13px 90px; }
  body:not(.dashboard-page) .main > .page-header { margin:0 0 16px;padding:17px 16px 18px 19px; }
  body:not(.dashboard-page) .page-header h1 { font-size:24px; }
  body:not(.dashboard-page) .card { padding:17px;border-radius:17px; }
  body:not(.dashboard-page) .form-actions { margin:22px -17px -17px;padding:12px 17px;border-radius:0 0 17px 17px; }
  .topbar-profile-copy { min-width:0; }
}

/* Website inquiries */
.inquiry-card { position:relative;padding:19px 21px 20px 24px;overflow:hidden; }
.inquiry-card::before { content:'';position:absolute;inset:0 auto 0 0;width:4px;background:var(--border-strong); }
.inquiry-card.inquiry-status-new::before { background:var(--teal-600); }
.inquiry-card.inquiry-status-contacted::before { background:#c99837; }
.inquiry-card-head { display:flex;align-items:flex-start;justify-content:space-between;gap:18px; }
.inquiry-sender { display:flex;align-items:center;gap:12px;min-width:0; }
.inquiry-avatar { display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:14px;color:#176249;background:linear-gradient(145deg,#e2f4eb,#cce8dc);font-size:11px;font-weight:800;letter-spacing:.04em; }
.inquiry-name { margin:0;color:var(--text-primary);font-size:14px;font-weight:700; }
.inquiry-meta { margin:4px 0 0;color:var(--text-muted);font-size:11.5px; }
.inquiry-meta a { color:var(--text-secondary);font-weight:550; }
.inquiry-actions { display:flex;align-items:center;gap:7px; }
.inquiry-actions form { margin:0; }
.inquiry-actions select.btn { min-width:112px;text-transform:capitalize; }
.inquiry-message { margin:15px 0 0 54px;padding:14px 16px;border:1px solid rgba(35,77,64,.09);border-radius:13px;color:#334b43;background:#f8faf8;font-size:13px;line-height:1.6;white-space:pre-wrap; }
@media (max-width:680px) { .inquiry-card-head { flex-direction:column; }.inquiry-actions { width:100%;padding-left:54px; }.inquiry-message { margin-left:0; }.inquiry-actions form:first-child { flex:1; }.inquiry-actions select.btn { width:100%; } }

/* Core operational modules: clients, cases, and scheduling */
.module-overview { display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:1px;margin:0 0 18px;overflow:hidden;border:1px solid var(--mb-hairline);border-radius:18px;background:var(--mb-hairline);box-shadow:var(--mb-soft-shadow); }
.module-overview > div { display:flex;flex-direction:column;justify-content:center;min-height:104px;padding:17px 19px;background:rgba(255,255,255,.94); }
.module-overview > div > span { color:var(--text-muted);font-size:9.5px;font-weight:780;letter-spacing:.09em;text-transform:uppercase; }
.module-overview > div > strong { margin-top:5px;color:var(--mb-ink);font-family:var(--font-display);font-size:25px;line-height:1.15; }
.module-overview > div > small { margin-top:4px;color:var(--text-secondary);font-size:10.5px; }
.module-overview .module-overview-intro { background:linear-gradient(145deg,#164f40,#0c392f); }
.module-overview .module-overview-intro > span,.module-overview .module-overview-intro > small { color:rgba(255,255,255,.68); }
.module-overview .module-overview-intro > strong { color:#fff; }
.module-overview .overview-attention > strong { color:#a16f21; }
.module-overview .schedule-next { grid-column:span 1; }
.module-overview .schedule-next > strong { font-family:var(--font);font-size:16px; }
.record-person { display:inline-flex;align-items:center;gap:10px;min-width:0;text-decoration:none; }
.record-person:hover { text-decoration:none; }.record-person:hover strong { text-decoration:underline; }
.record-person > span { display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border:1px solid rgba(20,101,75,.08);border-radius:11px;color:#176249;background:#e7f3ed;font-size:9.5px;font-weight:800;letter-spacing:.025em; }
.record-person > strong { color:#1c6a53;font-size:13.75px;font-weight:620;line-height:1.25;white-space:nowrap; }
.table-row-actions { display:flex;align-items:center;gap:5px; }.btn-quiet { color:var(--text-secondary);background:transparent; }
.row-open-hint { margin-top:3px;color:var(--teal-600);font-size:9px;font-weight:650;opacity:0;transition:opacity .16s ease; }
tr:hover .row-open-hint { opacity:1; }
.appointment-when strong,.appointment-session strong { display:block;color:var(--text-primary);font-size:12px;white-space:nowrap; }
.appointment-when small,.appointment-session small { display:block;margin-top:3px;color:var(--text-muted);font-size:10px; }
.appointment-row form select,.appointment-row form input { min-height:34px!important;padding-block:6px!important; }
@media (max-width:1000px) { .module-overview { grid-template-columns:repeat(2,1fr); }.module-overview .module-overview-intro { grid-column:span 2; } }
@media (max-width:560px) { .module-overview { grid-template-columns:1fr 1fr;border-radius:16px; }.module-overview > div { min-height:92px;padding:14px; }.module-overview .module-overview-intro { grid-column:span 2; }.module-overview > div > strong { font-size:22px; } }

/* People directory and attention center */
.staff-directory-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:15px; }
.staff-directory-card { padding:0!important;overflow:hidden;text-align:left; }
.staff-directory-photo { height:155px;overflow:hidden;background:linear-gradient(145deg,#e8f3ed,#cedfd7); }
.staff-directory-photo img { width:100%;height:100%;display:block;object-fit:cover;object-position:center;transition:transform .28s ease; }
.staff-directory-card:hover .staff-directory-photo img { transform:scale(1.025); }
.staff-directory-fallback { display:grid;place-items:center;width:100%;height:100%;color:#28644f;font-family:var(--font-display);font-size:34px;font-weight:700;background:radial-gradient(circle at 72% 22%,rgba(255,255,255,.8),transparent 38%),linear-gradient(145deg,#e5f3ec,#c8dfd5); }
.staff-directory-copy { padding:15px 16px 17px; }.staff-directory-copy p { margin:0;color:var(--text-primary);font-size:13.5px;font-weight:750; }.staff-directory-copy span { display:inline-block;margin-top:6px;padding:3px 8px;border-radius:999px;color:#176149;background:#e9f5ef;font-size:9.5px;font-weight:700;text-transform:capitalize; }.staff-directory-copy small { display:block;margin-top:7px;color:var(--text-muted);font-size:10.5px; }
.notification-link { display:block;color:inherit;text-decoration:none; }.notification-link:hover { text-decoration:none; }
.notification-card { position:relative;display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:12px;padding:16px 18px!important;overflow:hidden; }
.notification-card::before { content:'';position:absolute;inset:0 auto 0 0;width:4px;background:var(--teal-600); }.notification-card.notification-danger::before { background:var(--danger); }.notification-card.notification-warning::before { background:var(--warning); }
.notification-symbol { display:grid;place-items:center;width:34px;height:34px;border-radius:11px;color:var(--teal-700);background:var(--teal-50);font-size:14px;font-weight:800; }.notification-danger .notification-symbol { color:var(--danger);background:var(--danger-bg); }.notification-warning .notification-symbol { color:var(--warning);background:var(--warning-bg); }
.notification-card p { margin:0;color:var(--text-primary);font-size:13px;line-height:1.45; }.notification-arrow { color:var(--text-muted);font-size:18px;transition:transform .16s ease; }.notification-link:hover .notification-arrow { transform:translateX(3px); }
@media (max-width:560px) { .staff-directory-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }.staff-directory-photo { height:128px; }.notification-card { grid-template-columns:auto 1fr auto; }.notification-card .badge { display:none; } }

/* Dark-mode counterparts for the shared makeover */
body.mode-dark {
  --mb-canvas:#101a17;
  --mb-paper:rgba(22,35,31,.96);
  --mb-ink:#e7f1ed;
  --mb-sage:#253c34;
  --mb-hairline:rgba(180,211,200,.13);
  --mb-soft-shadow:0 1px 2px rgba(0,0,0,.16),0 12px 34px rgba(0,0,0,.13);
  --mb-lift-shadow:0 18px 42px rgba(0,0,0,.24),0 3px 8px rgba(0,0,0,.16);
}
body.mode-dark:not(.dashboard-page) .main { background:radial-gradient(circle at 96% 0,rgba(48,126,98,.12),transparent 25rem),linear-gradient(180deg,#111b18,#0f1815); }
body.mode-dark:not(.dashboard-page) .main > .page-header { background:linear-gradient(102deg,rgba(24,38,34,.98),rgba(18,32,28,.94)); }
body.mode-dark:not(.dashboard-page) .main > .page-header::after { border-color:rgba(91,185,150,.05); }
body.mode-dark .filter-bar,body.mode-dark .card,body.mode-dark .table-wrap { background:var(--mb-paper); }
body.mode-dark .table-wrap th { color:var(--text-secondary);background:linear-gradient(180deg,#1b2b26,#182520); }
body.mode-dark .table-wrap tbody tr:hover td { background:#1b2b26; }
body.mode-dark .module-overview > div { background:#17241f; }
body.mode-dark .module-overview .module-overview-intro { background:linear-gradient(145deg,#13513f,#0a382e); }
body.mode-dark .record-person > span,body.mode-dark .notification-symbol { color:#9edfc6;background:#213c33; }
body.mode-dark .inquiry-message { color:var(--text-primary);background:#17241f; }
body.mode-dark .staff-directory-photo,body.mode-dark .staff-directory-fallback { background:linear-gradient(145deg,#20372f,#172c25); }
body.mode-dark .staff-directory-fallback { color:#a7d8c6; }
body.mode-dark .chat-audio-preview { color:var(--text-primary);background:#16251f; }
body.mode-dark .chat-message.is-mine .chat-audio-preview { color:#17352d;background:#f2f7f4; }
body.mode-dark .sidebar-brand-inner {
  padding:6px 10px 10px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
body.mode-dark .sidebar-brand img {
  filter:brightness(0) invert(1);
  opacity:.94;
  mix-blend-mode:screen;
}

/* ==================== People of OPD Clinic ==================== */
.people-page { display: grid; gap: 24px; }
.people-hero {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 430px);
  min-height: 190px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--teal-600) 18%, var(--border));
  border-radius: 24px; background:
    radial-gradient(circle at 88% 15%, rgba(255,255,255,.78), transparent 24%),
    linear-gradient(125deg, color-mix(in srgb, var(--teal-50) 84%, var(--surface-1)), color-mix(in srgb, #e6f1ea 74%, var(--surface-1)) 58%, color-mix(in srgb, #dbeceb 70%, var(--surface-1)));
  box-shadow: 0 16px 42px rgba(26, 78, 69, .07);
}
.people-hero::before, .people-hero::after {
  content: ''; position: absolute; pointer-events: none; border-radius: 999px; transform: rotate(-32deg);
  background: color-mix(in srgb, var(--teal-400) 22%, transparent);
}
.people-hero::before { width: 34px; height: 120px; left: -11px; top: 64px; }
.people-hero::after { width: 26px; height: 92px; right: -8px; bottom: -18px; }
.people-hero-copy { padding: 30px 34px; align-self: center; position: relative; z-index: 1; }
.people-eyebrow { display: block; color: var(--teal-700); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.people-hero h1 { margin: 7px 0 10px; font-family: var(--font-display); font-size: clamp(30px, 3.2vw, 43px); line-height: 1.08; letter-spacing: -.035em; color: var(--text-primary); }
.people-hero-copy > p { max-width: 720px; margin: 0; color: var(--text-secondary); font-size: 14.5px; line-height: 1.6; }
.people-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 22px; color: var(--text-secondary); font-size: 12.5px; }
.people-summary strong { color: var(--text-primary); }
.people-summary-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--text-muted); }
.people-avatar-stack { display: flex; margin-right: 3px; }
.people-stack-avatar {
  width: 31px; height: 31px; display: grid; place-items: center; overflow: hidden; margin-left: -7px;
  border: 3px solid color-mix(in srgb, var(--teal-50) 80%, var(--surface-1)); border-radius: 50%;
  background: linear-gradient(145deg, var(--teal-400), var(--teal-700)); color: #fff; font-size: 9px; font-weight: 800;
  z-index: calc(5 - var(--stack-index));
}
.people-stack-avatar:first-child { margin-left: 0; }
.people-stack-avatar img { width: 100%; height: 100%; object-fit: cover; }
.people-hero-action {
  position: relative; z-index: 1; align-self: center; display: grid; grid-template-columns: auto 1fr; align-items: center;
  gap: 14px; margin: 22px 26px 22px 0; padding: 22px; border: 1px solid rgba(39, 109, 96, .13);
  border-radius: 19px; background: color-mix(in srgb, var(--surface-1) 78%, transparent); box-shadow: 0 9px 30px rgba(36, 88, 78, .07);
  backdrop-filter: blur(8px);
}
.people-hero-mark { grid-row: 1 / span 2; width: 58px; height: 58px; display: grid; place-items: center; border-radius: 18px; background: var(--surface-1); box-shadow: var(--shadow-sm); color: var(--teal-700); font-family: var(--font-display); font-size: 27px; font-weight: 700; }
.people-hero-action strong { display: block; margin-bottom: 4px; font-size: 13px; }
.people-hero-action div span { display: block; color: var(--text-secondary); font-size: 11.5px; line-height: 1.45; }
.people-hero-action .btn { grid-column: 2; justify-self: start; margin-top: 3px; }
.people-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: 0 3px; }
.people-section-heading h2 { margin: 5px 0 4px; font-family: var(--font-display); font-size: 25px; letter-spacing: -.02em; }
.people-section-heading p { max-width: 760px; margin: 0; color: var(--text-secondary); font-size: 12.5px; line-height: 1.55; }
.people-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.team-person-card {
  --person-accent: var(--teal-500); position: relative; display: flex; min-height: 242px; flex-direction: column;
  overflow: hidden; padding: 20px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface-1);
  color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; box-shadow: 0 7px 24px rgba(30, 73, 66, .055);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.team-person-card:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--person-accent) 36%, var(--border)); box-shadow: 0 16px 34px rgba(29, 75, 67, .1); }
.team-person-card:focus-visible { outline: 3px solid color-mix(in srgb, var(--person-accent) 50%, transparent); outline-offset: 3px; }
.team-person-accent { position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--person-accent); }
.team-accent-lagoon { --person-accent: #34988b; background: linear-gradient(145deg, #dff2ed, #78bcb0); }
.team-accent-sage { --person-accent: #7f9f79; background: linear-gradient(145deg, #e7f0de, #95b58a); }
.team-accent-sky { --person-accent: #668fac; background: linear-gradient(145deg, #e1edf5, #82a8c2); }
.team-accent-sand { --person-accent: #ad8868; background: linear-gradient(145deg, #f3e9dc, #c4a07f); }
.team-accent-lilac { --person-accent: #88789f; background: linear-gradient(145deg, #ece5f2, #9d8bb5); }
.team-person-top { display: flex; align-items: center; gap: 14px; }
.team-person-avatar { flex: 0 0 70px; width: 70px; height: 70px; display: grid; place-items: center; overflow: hidden; border-radius: 22px; color: #fff; font-size: 21px; font-weight: 800; box-shadow: 0 8px 20px color-mix(in srgb, var(--person-accent) 25%, transparent); }
.team-person-avatar img { width: 100%; height: 100%; object-fit: cover; }
.team-person-identity { min-width: 0; display: grid; gap: 4px; }
.team-person-identity strong { overflow: hidden; font-size: 15px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.team-person-identity > span { color: var(--text-secondary); font-size: 11.5px; line-height: 1.35; }
.team-person-details { display: flex; min-height: 26px; align-items: center; flex-wrap: wrap; gap: 7px; margin: 17px 0 12px; }
.team-person-credential { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 999px; background: color-mix(in srgb, var(--person-accent) 13%, var(--surface-1)); color: color-mix(in srgb, var(--person-accent) 85%, var(--text-primary)); font-size: 10.5px; font-weight: 700; }
.team-person-credential-muted { background: var(--surface-0); color: var(--text-secondary); }
.team-person-specialty { max-width: 100%; overflow: hidden; color: var(--text-secondary); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.team-person-note { display: -webkit-box; overflow: hidden; color: var(--text-secondary); font-size: 12px; font-style: italic; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.team-person-note.is-placeholder { color: var(--text-muted); }
.team-person-footer { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 13px; border-top: 1px solid var(--border); color: var(--teal-700); font-size: 11.5px; font-weight: 700; }
.team-person-arrow { font-size: 17px; transition: transform .2s var(--ease); }
.team-person-card:hover .team-person-arrow { transform: translateX(4px); }
.people-empty { padding: 54px 24px; border: 1px dashed var(--border-strong); border-radius: 18px; background: var(--surface-1); text-align: center; }
.people-empty-icon { width: 58px; height: 58px; display: grid; place-items: center; margin: 0 auto 14px; border-radius: 18px; background: var(--teal-50); color: var(--teal-700); font-weight: 800; }
.people-empty h2 { margin: 0 0 6px; font-family: var(--font-display); }
.people-empty p { margin: 0; color: var(--text-secondary); }
body.modal-open { overflow: hidden; }
.team-profile-backdrop { backdrop-filter: blur(5px); }
.team-profile-modal {
  top: 50%; left: 50%; width: min(620px, calc(100vw - 36px)); height: auto; max-height: min(720px, calc(100vh - 44px));
  border: 1px solid var(--border); border-radius: 22px; transform: translate(-50%, calc(-50% + 16px)) scale(.97);
  opacity: 0; background: var(--surface-1); box-shadow: 0 28px 80px rgba(10, 42, 37, .24);
  transition: opacity .22s var(--ease), transform .3s cubic-bezier(.2,.8,.2,1); overflow-y: auto;
}
.team-profile-modal.open { display: block; }
.team-profile-modal.expanded { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.team-profile-header { display: flex; align-items: center; gap: 20px; padding: 28px 30px 23px; background: linear-gradient(125deg, var(--teal-50), color-mix(in srgb, #edf3ea 75%, var(--surface-1))); border-bottom: 1px solid var(--border); }
.team-profile-photo { flex: 0 0 104px; width: 104px; height: 104px; display: grid; place-items: center; overflow: hidden; border: 5px solid rgba(255,255,255,.75); border-radius: 30px; color: #fff; font-size: 31px; font-weight: 800; box-shadow: 0 13px 28px rgba(28, 79, 70, .16); }
.team-profile-photo img { width: 100%; height: 100%; object-fit: cover; }
.team-profile-heading { min-width: 0; }
.team-profile-heading h2 { margin: 6px 0 7px; font-family: var(--font-display); font-size: 28px; line-height: 1.15; }
.team-profile-role { color: var(--text-secondary); font-size: 12.5px; }
.team-profile-close { top: 16px; right: 16px; opacity: 1; background: rgba(22, 70, 62, .72); }
.team-profile-body { padding: 25px 30px 30px; }
.team-profile-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 22px; }
.team-profile-meta:empty { display: none; }
.team-profile-meta div { padding: 13px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-0); }
.team-profile-meta dt { margin-bottom: 4px; color: var(--text-muted); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.team-profile-meta dd { margin: 0; color: var(--text-primary); font-size: 12.5px; line-height: 1.45; }
.team-profile-story { padding: 19px 20px; border-left: 3px solid var(--teal-500); border-radius: 0 14px 14px 0; background: color-mix(in srgb, var(--teal-50) 55%, var(--surface-1)); }
.team-profile-story p { margin: 8px 0 0; color: var(--text-primary); font-family: var(--font-display); font-size: 16px; font-style: italic; line-height: 1.65; white-space: pre-wrap; }

/* Session-note navigation safety */
.note-draft-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-0); }
.note-draft-status { display: inline-flex; align-items: center; gap: 7px; color: var(--text-secondary); font-size: 11.5px; }
.note-draft-status::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--text-muted); transition: background .18s var(--ease), box-shadow .18s var(--ease); }
.note-draft-status.is-saving::before { background: #c58b35; box-shadow: 0 0 0 4px rgba(197,139,53,.12); }
.note-draft-status.is-saved::before, .note-draft-status.is-restored::before { background: var(--teal-500); box-shadow: 0 0 0 4px rgba(39,151,135,.12); }
.note-draft-discard { padding: 3px 5px; border: 0; background: transparent; color: var(--text-muted); font: inherit; font-size: 11px; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.note-draft-discard:hover { color: var(--danger); }

@media (max-width: 1100px) {
  .people-hero { grid-template-columns: 1fr; }
  .people-hero-action { margin: 0 24px 24px; }
  .people-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .people-hero-copy { padding: 25px 22px; }
  .people-hero-action { grid-template-columns: auto 1fr; margin: 0 16px 16px; padding: 17px; }
  .people-hero-action .btn { grid-column: 1 / -1; width: 100%; justify-content: center; }
  .people-grid { grid-template-columns: 1fr; }
  .team-person-card { min-height: 225px; }
  .team-profile-modal { top: auto; bottom: 0; left: 0; width: 100%; max-height: 88vh; border-radius: 22px 22px 0 0; transform: translateY(24px); }
  .team-profile-modal.expanded { transform: translateY(0); }
  .team-profile-header { padding: 25px 20px 20px; }
  .team-profile-photo { flex-basis: 82px; width: 82px; height: 82px; border-radius: 24px; }
  .team-profile-heading h2 { font-size: 23px; }
  .team-profile-body { padding: 21px 20px 26px; }
  .team-profile-meta { grid-template-columns: 1fr; }
  .note-draft-bar { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  .team-person-card, .team-person-arrow, .team-profile-modal { transition: none; }
}

/* Knowledge Base — procedural library and AI-assisted editor */
.kb-ai-workbench { position:relative;overflow:hidden;margin-bottom:16px;padding:22px 24px!important;border-color:rgba(35,126,98,.2)!important;background:linear-gradient(135deg,color-mix(in srgb,var(--teal-50) 72%,var(--surface-1)),var(--surface-1))!important; }
.kb-ai-workbench::after { content:'';position:absolute;right:-65px;top:-75px;width:210px;height:210px;border:34px solid rgba(58,157,126,.07);border-radius:50%;pointer-events:none; }
.kb-ai-heading { position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:18px; }
.kb-ai-heading h2 { margin:4px 0 5px;font-family:var(--font-display);font-size:22px;letter-spacing:-.02em; }
.kb-ai-heading p { margin:0;color:var(--text-secondary);font-size:12.5px;line-height:1.55; }
.kb-ai-review-chip { flex:0 0 auto;padding:6px 10px;border:1px solid rgba(174,116,30,.18);border-radius:999px;color:#8b5e1e;background:rgba(247,224,181,.52);font-size:10px;font-weight:750; }
.kb-ai-controls { position:relative;z-index:1;display:grid;grid-template-columns:minmax(190px,.55fr) minmax(280px,1.45fr);gap:14px; }
.kb-ai-controls label { display:block;margin-bottom:6px; }
.kb-ai-controls select,.kb-ai-controls input { width:100%; }
.kb-ai-actions { position:relative;z-index:1;display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:14px; }
.kb-ai-status { flex:1;min-width:260px;margin-left:4px;color:var(--text-secondary);font-size:11.5px;line-height:1.45; }
.kb-ai-status.is-working { color:var(--teal-700);font-weight:650; }
.kb-editor-form { max-width:1050px;padding:24px!important; }
.kb-editor-form textarea { min-height:560px;line-height:1.65;resize:vertical; }
.kb-editor-meta { display:flex;justify-content:space-between;min-height:18px;margin:-7px 0 17px;color:var(--text-muted);font-size:10.5px; }
.kb-file-help { margin:7px 0 0;font-size:11.5px;line-height:1.5; }
.kb-article-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }
.kb-article-card { display:flex;min-height:245px;flex-direction:column;padding:20px 21px;border:1px solid var(--border);border-radius:17px;background:var(--surface-1);color:inherit;text-decoration:none;box-shadow:0 6px 24px rgba(29,75,67,.045);transition:transform .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease); }
.kb-article-card:hover { transform:translateY(-3px);border-color:rgba(36,128,98,.28);box-shadow:0 15px 34px rgba(29,75,67,.09);text-decoration:none; }
.kb-article-card-top { display:flex;align-items:center;justify-content:space-between;gap:9px; }
.kb-procedure-badge { color:var(--teal-700);font-size:9.5px;font-weight:750;text-transform:uppercase;letter-spacing:.06em; }
.kb-article-card h2 { margin:15px 0 8px;color:var(--text-primary);font-family:var(--font-display);font-size:19px;line-height:1.25;letter-spacing:-.015em; }
.kb-article-card > p { display:-webkit-box;overflow:hidden;margin:0;color:var(--text-secondary);font-size:12px;line-height:1.6;-webkit-box-orient:vertical;-webkit-line-clamp:3; }
.kb-article-card-meta { display:grid;gap:3px;margin-top:15px;color:var(--text-muted);font-size:10.5px; }
.kb-article-card-footer { display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:14px;border-top:1px solid var(--border);color:var(--text-muted);font-size:10.5px; }
.kb-article-card-footer strong { color:var(--teal-700);font-size:11.5px; }
.kb-reading-header { align-items:flex-start!important; }
.kb-reading-header > div:first-child { max-width:850px; }
.kb-reading-layout { display:grid;grid-template-columns:minmax(0,850px) minmax(220px,290px);align-items:start;gap:18px; }
.kb-reading-card { padding:clamp(24px,4vw,48px)!important; }
.kb-article-body { color:var(--text-primary);font-size:14px;line-height:1.78; }
.kb-article-body h2,.kb-article-body h3 { scroll-margin-top:100px;color:var(--text-primary);font-family:var(--font-display);letter-spacing:-.015em; }
.kb-article-body h2 { margin:35px 0 12px;padding-top:7px;border-top:1px solid var(--border);font-size:22px; }
.kb-article-body h2:first-child { margin-top:0;padding-top:0;border-top:0; }
.kb-article-body h3 { margin:25px 0 9px;font-size:17px; }
.kb-article-body p { margin:0 0 15px; }
.kb-article-body ul,.kb-article-body ol { margin:0 0 18px;padding-left:24px; }
.kb-article-body li { margin:7px 0;padding-left:4px; }
.kb-article-body code { padding:2px 5px;border-radius:5px;background:var(--surface-0);font-size:.92em; }
.kb-reading-aside { position:sticky;top:90px; }
.kb-reading-aside .card { padding:19px!important; }
.kb-reading-aside h3 { margin:6px 0 8px;font-family:var(--font-display);font-size:17px; }
.kb-reading-aside p { margin:0;color:var(--text-secondary);font-size:11.5px;line-height:1.6; }
body.mode-dark .kb-ai-workbench { background:linear-gradient(135deg,#173128,#17241f)!important; }
body.mode-dark .kb-ai-review-chip { color:#efc985;background:rgba(130,91,30,.25); }
@media (max-width:900px) { .kb-article-grid,.kb-reading-layout { grid-template-columns:1fr; }.kb-reading-aside { position:static; }.kb-ai-controls { grid-template-columns:1fr; } }
@media (max-width:620px) { .kb-ai-heading { flex-direction:column; }.kb-ai-workbench,.kb-editor-form { padding:18px!important; }.kb-ai-actions .btn { width:100%;justify-content:center; }.kb-ai-status { min-width:0;margin:4px 0 0; }.kb-article-card { min-height:220px; }.kb-reading-card { padding:22px 19px!important; }.kb-reading-header [style*="display:flex"] { flex-wrap:wrap; } }

/* Time Clock — digital bundy-clock treatment */
.timeclock-page-header,.wellbeing-page-header,.wellbeing-team-header { background-image:linear-gradient(100deg,rgba(255,255,255,.96),rgba(247,251,248,.88)),url('/public/images/dashboard-quote-bg.webp')!important;background-position:center,right center!important;background-repeat:no-repeat!important;background-size:auto,520px auto!important; }
.bundy-overview { display:grid;grid-template-columns:minmax(350px,480px) minmax(350px,520px);align-items:stretch;gap:17px;margin:0 0 24px; }
.bundy-clock { position:relative;overflow:hidden;padding:22px 24px;border:1px solid rgba(100,172,148,.25);border-radius:20px;background:radial-gradient(circle at 90% 5%,rgba(117,209,174,.17),transparent 35%),linear-gradient(145deg,#0d3028,#163f35 68%,#1c5444);color:#e9fff6;box-shadow:0 18px 45px rgba(16,66,53,.16); }
.bundy-clock::after { content:'';position:absolute;right:-52px;bottom:-63px;width:185px;height:185px;border:24px solid rgba(255,255,255,.045);border-radius:50%; }
.bundy-clock-top { display:flex;align-items:center;justify-content:space-between;color:rgba(233,255,246,.7);font-size:9.5px;font-weight:780;letter-spacing:.14em;text-transform:uppercase; }
.bundy-live-dot { display:inline-flex;align-items:center;gap:6px; }.bundy-live-dot::before { content:'';width:6px;height:6px;border-radius:50%;background:#65d9a6;box-shadow:0 0 0 5px rgba(101,217,166,.12); }
.bundy-clock > time { position:relative;z-index:1;display:block;margin:25px 0 4px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:clamp(34px,4.2vw,53px);font-weight:700;line-height:1;letter-spacing:-.055em;font-variant-numeric:tabular-nums;text-shadow:0 0 24px rgba(104,232,182,.2); }
.bundy-clock > time + span { color:rgba(233,255,246,.66);font-size:11px; }
.bundy-state { position:relative;z-index:1;display:flex;align-items:center;gap:11px;margin-top:25px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1); }
.bundy-state i { width:11px;height:11px;border:2px solid rgba(255,255,255,.55);border-radius:50%;background:#8ca69b; }.bundy-state.is-in i { border-color:#bfffe1;background:#51d798;box-shadow:0 0 0 6px rgba(81,215,152,.11); }
.bundy-state strong,.bundy-state small { display:block; }.bundy-state strong { font-size:12.5px; }.bundy-state small { margin-top:2px;color:rgba(233,255,246,.6);font-size:10.5px; }
.bundy-action-card { max-width:none!important;margin:0!important;padding:22px!important; }
.bundy-action-card > h3 { font-family:var(--font-display);font-size:18px!important; }.bundy-action-card #timer { font-family:ui-monospace,SFMono-Regular,Consolas,monospace!important;letter-spacing:-.04em; }
.bundy-log-heading { display:flex;align-items:end;justify-content:space-between;margin:0 2px 10px; }.bundy-log-heading h2 { margin:3px 0 0;font-family:var(--font-display);font-size:21px; }.bundy-log-heading > span { color:var(--text-muted);font-size:10.5px; }
.bundy-log-table { position:relative;min-height:215px;overflow:hidden; }.bundy-log-table::after { content:'';position:absolute;right:-95px;bottom:-105px;width:260px;height:260px;background:url('/public/images/dashboard-watermark-bg.webp') center/contain no-repeat;opacity:.045;pointer-events:none; }
.bundy-empty { display:grid;place-items:center;gap:5px;min-height:145px;color:var(--text-muted); }.bundy-empty > span { display:grid;place-items:center;width:45px;height:45px;border:1px solid rgba(39,151,135,.18);border-radius:14px;color:var(--teal-600);background:var(--teal-50);font-size:21px; }.bundy-empty strong { color:var(--text-secondary);font-size:12px; }.bundy-empty small { font-size:10.5px; }

/* Staff wellbeing — warm, engaging pulse cards */
.wellbeing-layout { display:grid;grid-template-columns:minmax(0,720px) minmax(260px,380px);align-items:start;gap:18px; }
.wellbeing-checkin-card { position:relative;overflow:hidden;max-width:none!important;padding:25px!important; }.wellbeing-checkin-card::after { content:'';position:absolute;right:-105px;bottom:-115px;width:310px;height:310px;background:url('/public/images/theme-aquatic-watermark.webp') center/contain no-repeat;opacity:.055;pointer-events:none; }
.wellbeing-intro { position:relative;z-index:1;margin-bottom:24px; }.wellbeing-intro > span { color:var(--teal-700);font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }.wellbeing-intro h2 { margin:5px 0 5px;font-family:var(--font-display);font-size:25px; }.wellbeing-intro p { margin:0;color:var(--text-secondary);font-size:12px; }
.wellbeing-checkin-card form { position:relative;z-index:1; }.wellbeing-fieldset { margin:0 0 21px;padding:0;border:0; }.wellbeing-fieldset legend { margin-bottom:9px;color:var(--text-primary);font-size:12px;font-weight:700; }
.wellbeing-choice-row { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px; }.wellbeing-choice-row label { cursor:pointer; }.wellbeing-choice-row input { position:absolute;opacity:0;pointer-events:none; }.wellbeing-choice-row label > span { display:grid;place-items:center;min-height:70px;padding:9px 5px;border:1px solid var(--border);border-radius:12px;background:var(--surface-0);transition:transform .15s var(--ease),border-color .15s var(--ease),background .15s var(--ease),box-shadow .15s var(--ease); }.wellbeing-choice-row label:hover > span { transform:translateY(-2px);border-color:rgba(39,151,135,.3); }.wellbeing-choice-row input:checked + span { border-color:var(--teal-500);background:var(--teal-50);box-shadow:0 0 0 3px rgba(39,151,135,.1); }.wellbeing-choice-row input:focus-visible + span { outline:3px solid rgba(39,151,135,.24);outline-offset:2px; }.wellbeing-choice-row strong { color:var(--teal-700);font-size:19px; }.wellbeing-choice-row small { margin-top:4px;color:var(--text-secondary);font-size:9.5px;text-align:center; }
.wellbeing-privacy { display:flex;align-items:flex-start;gap:10px;margin-top:10px;padding:11px 12px;border:1px solid rgba(39,151,135,.13);border-radius:11px;background:var(--teal-50); }.wellbeing-privacy > span { color:var(--teal-700);font-size:17px; }.wellbeing-privacy p { margin:0;color:var(--text-secondary);font-size:10.5px;line-height:1.45; }.wellbeing-submit { min-width:190px;justify-content:center; }
.wellbeing-history { max-width:none!important;margin:0!important; }.wellbeing-history h3 { margin:5px 0 11px!important;font-family:var(--font-display);font-size:18px!important; }
.wellbeing-stat-grid .stat-card { position:relative;overflow:hidden;min-height:128px;padding-right:60px; }.wellbeing-stat-grid .stat-card::after { content:'';position:absolute;right:-32px;bottom:-38px;width:115px;height:115px;border:16px solid rgba(39,151,135,.055);border-radius:50%; }.wellbeing-stat-icon { position:absolute;right:17px;top:17px;display:grid;place-items:center;width:34px;height:34px;border-radius:11px;color:var(--teal-700);background:var(--teal-50);font-size:15px;font-weight:800; }.wellbeing-stat-grid small { display:block;margin-top:4px;color:var(--text-muted);font-size:9.5px; }
body.mode-dark .timeclock-page-header,body.mode-dark .wellbeing-page-header,body.mode-dark .wellbeing-team-header { background-image:linear-gradient(100deg,rgba(24,38,34,.98),rgba(18,32,28,.87)),url('/public/images/dashboard-quote-bg.webp')!important; }.mode-dark .wellbeing-choice-row input:checked + span,.mode-dark .wellbeing-privacy { background:#203a31; }
@media (max-width:960px) { .bundy-overview,.wellbeing-layout { grid-template-columns:1fr; }.bundy-clock,.bundy-action-card { max-width:650px!important; } }
@media (max-width:600px) { .bundy-clock { padding:20px; }.wellbeing-choice-row { grid-template-columns:repeat(5,minmax(52px,1fr));overflow-x:auto;padding:3px; }.wellbeing-choice-row label > span { min-height:64px; }.wellbeing-checkin-card { padding:19px!important; }.timeclock-page-header,.wellbeing-page-header,.wellbeing-team-header { background-size:auto,360px auto!important; } }

/* Rotating OPD Clinic wellness artwork */
.wellbeing-companion { display:grid;gap:14px; }
.wellbeing-watermark-stage { position:relative;min-height:485px;overflow:hidden;border:1px solid rgba(78,135,116,.09);border-radius:22px;background:radial-gradient(circle at 72% 48%,rgba(160,218,197,.15),transparent 46%),linear-gradient(145deg,rgba(255,255,255,.48),rgba(238,246,241,.35)); }
.wellbeing-watermark-stage::after { content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,248,244,.72) 0%,rgba(247,248,244,.08) 52%,transparent 100%);pointer-events:none; }
.wellbeing-watermark-frame { position:absolute;z-index:1;right:-8%;bottom:14px;width:116%;height:auto;opacity:0;filter:saturate(.82) contrast(.96);animation:wellbeingWatermarkFade 24s ease-in-out infinite; }
.wellbeing-watermark-frame.frame-two { animation-delay:8s; }.wellbeing-watermark-frame.frame-three { animation-delay:16s; }
.wellbeing-watermark-caption { position:absolute;z-index:3;left:25px;bottom:24px;max-width:180px; }.wellbeing-watermark-caption span { color:var(--teal-700);font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase; }.wellbeing-watermark-caption p { margin:6px 0 0;color:#526e64;font-family:var(--font-display);font-size:18px;line-height:1.3; }
@keyframes wellbeingWatermarkFade { 0%,100% { opacity:0;transform:translateX(12px) scale(1.01); } 7%,28% { opacity:.34;transform:translateX(0) scale(1); } 35% { opacity:0;transform:translateX(-8px) scale(.995); } }
.wellness-graphic-header::after { right:-8px!important;top:-23px!important;width:330px!important;height:180px!important;border:0!important;border-radius:0!important;background:url('/public/images/wellness-meditation-yoga.webp') right center/contain no-repeat!important;opacity:.16;animation:wellnessHeaderCycle 24s steps(1,end) infinite; }
@keyframes wellnessHeaderCycle { 0%,32% { background-image:url('/public/images/wellness-meditation-yoga.webp'); } 33%,65% { background-image:url('/public/images/wellness-taichi-exercise.webp'); } 66%,100% { background-image:url('/public/images/wellness-reading-music.webp'); } }
body.mode-dark .wellbeing-watermark-stage { border-color:rgba(147,199,181,.1);background:radial-gradient(circle at 72% 48%,rgba(55,126,101,.2),transparent 48%),linear-gradient(145deg,rgba(23,38,33,.62),rgba(15,27,23,.48)); }
body.mode-dark .wellbeing-watermark-stage::after { background:linear-gradient(90deg,rgba(16,26,23,.74),rgba(16,26,23,.05) 58%,transparent); }.mode-dark .wellbeing-watermark-caption p { color:#c2d9d0; }

/* Personal browser-local sidebar ordering */
.sidebar-customize-wrap { position:relative;margin:12px 7px 0;padding-top:11px;border-top:1px solid rgba(56,88,77,.12); }
.sidebar-customize-button { display:flex;width:100%;align-items:center;gap:9px;padding:9px 10px;border:0;border-radius:9px;color:#42675c;background:rgba(255,255,255,.22);font:inherit;font-size:11.5px;font-weight:520;text-align:left;cursor:pointer; }.sidebar-customize-button:hover { color:#174c3e;background:rgba(255,255,255,.46); }.sidebar-customize-button svg { width:15px;height:15px; }
.sidebar-customize-panel { position:relative;z-index:5;margin-top:7px;padding:11px;border:1px solid rgba(48,99,81,.14);border-radius:11px;background:rgba(244,249,246,.95);box-shadow:0 10px 24px rgba(30,64,53,.12); }.sidebar-customize-panel strong { color:#244a3f;font-size:11px; }.sidebar-customize-panel p { margin:4px 0 9px;color:#60796f;font-size:9.5px;line-height:1.4; }.sidebar-customize-panel > div { display:flex;justify-content:flex-end;gap:6px; }.sidebar-customize-panel button { padding:5px 8px;border:1px solid rgba(48,99,81,.15);border-radius:7px;color:#315f51;background:#fff;font:inherit;font-size:9.5px;cursor:pointer; }.sidebar-customize-panel button:last-child { color:#fff;background:var(--teal-700); }
.sidebar.is-customizing details > .nav-link { cursor:grab;border:1px dashed rgba(30,105,82,.2); }.sidebar.is-customizing details > .nav-link::after { content:'⋮⋮';margin-left:auto;color:#62857a;font-size:11px;letter-spacing:-2px; }.sidebar.is-customizing .nav-link.is-dragging { opacity:.42;cursor:grabbing; }
body.mode-dark .sidebar-customize-button { color:#bdd8ce;background:rgba(255,255,255,.06); }.mode-dark .sidebar-customize-panel { border-color:rgba(157,202,186,.14);background:#1b3029; }.mode-dark .sidebar-customize-panel strong { color:#e4f1ec; }.mode-dark .sidebar-customize-panel p { color:#9bb5ac; }

/* Softer typography for navigation and wellbeing controls */
.nav-section { font-weight:650; }.nav-link { font-weight:520; }.nav-link.active { font-weight:600; }
.wellbeing-fieldset legend { color:#315248;font-weight:620; }.wellbeing-choice-row strong { font-weight:600; }.wellbeing-choice-row small { color:#5f746d;font-weight:520; }.wellbeing-intro h2 { font-weight:600; }
@media (max-width:960px) { .wellbeing-watermark-stage { min-height:340px; }.wellbeing-watermark-frame { right:-2%;bottom:-16%;width:96%; }.wellbeing-companion { grid-row:auto; } }
@media (max-width:600px) { .wellbeing-watermark-stage { min-height:285px; }.wellbeing-watermark-frame { right:-15%;bottom:-4%;width:125%; }.wellness-graphic-header::after { width:210px!important;opacity:.11; } }
@media (prefers-reduced-motion:reduce) { .wellbeing-watermark-frame,.wellness-graphic-header::after { animation:none; }.wellbeing-watermark-frame.frame-one { opacity:.3; }.wellbeing-watermark-frame.frame-two,.wellbeing-watermark-frame.frame-three { display:none; } }

/* OPD Clinic clinical innovation suite */
.morning-brief { margin:0 0 16px;padding:18px;border:1px solid color-mix(in srgb,var(--teal-600) 16%,var(--border));border-radius:20px;background:color-mix(in srgb,var(--surface-1) 91%,var(--teal-50));box-shadow:var(--shadow-sm); }
.morning-brief-heading { display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px; }.morning-brief-heading h2 { margin:0;font-size:16px; }.morning-brief-heading p { margin:0;color:var(--text-muted);font-size:11.5px; }.morning-brief-heading .section-eyebrow { flex-basis:100%; }
.morning-brief-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:9px; }.morning-brief-item { display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:9px;padding:11px;border:1px solid var(--border);border-radius:13px;color:inherit;background:color-mix(in srgb,var(--surface-1) 94%,transparent);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }.morning-brief-item:hover { transform:translateY(-2px);border-color:var(--teal-300);box-shadow:var(--shadow-md);text-decoration:none; }.morning-brief-icon { display:grid;place-items:center;width:35px;height:35px;border-radius:11px;color:var(--teal-700);background:var(--teal-50); }.morning-brief-item strong,.morning-brief-item small { display:block; }.morning-brief-item strong { color:var(--text-primary);font-size:12px; }.morning-brief-item small { margin-top:2px;color:var(--text-muted);font-size:9.5px;line-height:1.35; }.morning-brief-arrow { color:var(--text-muted); }.morning-brief-item.tone-coral .morning-brief-icon { color:#a34132;background:#fff0ec; }.morning-brief-item.tone-gold .morning-brief-icon { color:#805a12;background:#fff7df; }.morning-brief-item.tone-blue .morning-brief-icon { color:#315f95;background:#eef5ff; }.morning-brief-item.tone-violet .morning-brief-icon { color:#64419a;background:#f4efff; }

.waitlist-note { display:block;max-width:230px;margin-top:4px;color:var(--text-muted);font-size:10.5px;line-height:1.35; }.waitlist-matches { display:grid;gap:5px;min-width:260px; }.waitlist-match { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 9px;border:1px solid var(--border);border-radius:9px;color:inherit;background:var(--surface-1);text-decoration:none; }.waitlist-match:hover { border-color:var(--teal-300);text-decoration:none; }.waitlist-match.is-best { background:var(--teal-50);border-color:var(--teal-200); }.waitlist-match span,.waitlist-match strong,.waitlist-match small { display:block; }.waitlist-match strong { font-size:11px; }.waitlist-match small { margin-top:2px;color:var(--text-muted);font-size:8.5px; }.waitlist-match b { display:grid;place-items:center;min-width:29px;height:29px;border-radius:50%;color:#fff;background:var(--teal-700);font-size:9px; }

.reception-hero { display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 -32px 22px;padding:28px 34px;border-bottom:1px solid var(--border);background:linear-gradient(105deg,color-mix(in srgb,var(--surface-1) 96%,transparent),color-mix(in srgb,var(--teal-50) 78%,transparent)),var(--theme-quote-art) right center/cover; }.reception-hero h1 { margin:3px 0 5px;font-family:var(--font-display);font-size:35px; }.reception-hero p { margin:0;color:var(--text-secondary); }.reception-now { min-width:210px;padding:16px 19px;border-radius:17px;color:#fff;background:linear-gradient(135deg,var(--theme-sidebar-active-a),var(--theme-sidebar-active-b));box-shadow:var(--shadow-md); }.reception-now span,.reception-now strong { display:block; }.reception-now span { font-size:11px; }.reception-now strong { margin-top:5px;font-family:var(--font-display);font-size:30px;font-variant-numeric:tabular-nums; }.reception-board { display:grid;gap:10px; }.reception-row { display:grid;grid-template-columns:110px minmax(180px,1fr) minmax(160px,1fr) 120px;align-items:center;gap:14px;padding:17px 20px;border:1px solid var(--border);border-left:5px solid var(--teal-500);border-radius:16px;background:var(--surface-1);box-shadow:var(--shadow-sm); }.reception-row time { font-family:var(--font-display);font-size:22px;font-weight:700; }.reception-row strong,.reception-row small { display:block; }.reception-row small { margin-top:2px;color:var(--text-muted);font-size:10px;text-transform:capitalize; }.reception-client span { display:inline-grid;place-items:center;min-width:58px;height:34px;padding:0 10px;border-radius:999px;color:var(--teal-800);background:var(--teal-50);font-weight:750;letter-spacing:.08em; }.reception-status { justify-self:end;padding:6px 9px;border-radius:999px;color:var(--text-secondary);background:var(--surface-0);font-size:9px;font-weight:750;text-transform:uppercase; }.reception-row.status-completed { opacity:.62;border-left-color:#8aa39a; }.reception-row.status-cancelled,.reception-row.status-no_show { opacity:.48;border-left-color:#c4877d; }.reception-empty { padding:80px 20px;text-align:center; }.reception-empty span { font-size:45px;color:var(--teal-600); }.reception-empty h2 { margin:10px 0 6px;font-family:var(--font-display); }.reception-empty p,.reception-privacy { color:var(--text-muted); }.reception-privacy { margin:16px 0;text-align:center;font-size:10.5px; }

.clinical-toolbelt { display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:14px; }.clinical-toolbelt form { margin:0; }.clinical-toolbelt a,.clinical-toolbelt button { display:flex;width:100%;min-height:64px;align-items:center;gap:11px;padding:11px 13px;border:1px solid var(--border);border-radius:14px;color:inherit;background:linear-gradient(135deg,var(--surface-1),color-mix(in srgb,var(--teal-50) 48%,var(--surface-1)));font:inherit;text-align:left;text-decoration:none;cursor:pointer; }.clinical-toolbelt a:hover,.clinical-toolbelt button:hover { border-color:var(--teal-300);box-shadow:var(--shadow-sm);text-decoration:none; }.clinical-toolbelt svg { color:var(--teal-700); }.clinical-toolbelt span,.clinical-toolbelt strong,.clinical-toolbelt small { display:block; }.clinical-toolbelt strong { font-size:12px; }.clinical-toolbelt small { margin-top:2px;color:var(--text-muted);font-size:9px; }
.session-prep-panel { margin-bottom:15px;padding:20px;border:1px solid var(--teal-200);border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--surface-1) 94%,var(--teal-50)),var(--surface-1));box-shadow:var(--shadow-md); }.session-prep-head { display:flex;justify-content:space-between;gap:16px; }.session-prep-head h2 { margin:2px 0 3px;font-family:var(--font-display); }.session-prep-head p { margin:0;color:var(--text-muted);font-size:11px; }.session-prep-sources { display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 8px; }.session-prep-sources span { padding:4px 7px;border-radius:999px;color:var(--teal-800);background:var(--teal-50);font-size:9px; }.session-prep-panel pre { max-height:420px;margin:0 0 12px;padding:16px;overflow:auto;border:1px solid var(--border);border-radius:12px;color:var(--text-primary);background:var(--surface-0);font:12.5px/1.65 var(--font);white-space:pre-wrap; }
.outcome-center { margin:14px 0;padding:14px;border:1px solid color-mix(in srgb,var(--teal-600) 15%,var(--border));border-radius:15px;background:var(--surface-0); }.outcome-center-head { display:flex;justify-content:space-between;align-items:end;gap:12px;margin-bottom:10px; }.outcome-center-head h3 { margin:2px 0 0;font-size:13px; }.outcome-center-head small { color:var(--text-muted);font-size:9px; }.outcome-center-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px; }.outcome-center-grid article { padding:10px;border:1px solid var(--border);border-radius:11px;background:var(--surface-1); }.outcome-center-grid article>div:first-child { display:flex;justify-content:space-between;gap:8px; }.outcome-center-grid strong { font-size:10.5px; }.outcome-center-grid span { color:var(--text-muted);font-size:8.5px;text-transform:capitalize; }.outcome-center-grid p { margin:7px 0 0;color:var(--text-secondary);font-size:9.5px;line-height:1.4; }.outcome-meter { height:5px;margin-top:7px;overflow:hidden;border-radius:999px;background:var(--border); }.outcome-meter i { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--teal-400),var(--teal-700)); }

.relationship-layout { display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:16px; }.relationship-canvas-card { min-height:620px; }.relationship-map { position:relative;min-height:570px;overflow:hidden;border-radius:17px;background:radial-gradient(circle at center,var(--teal-50),transparent 24%),linear-gradient(var(--theme-canvas-wash),var(--theme-canvas-wash)),var(--theme-watermark-art) center/cover; }.relationship-center,.relationship-node { position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%); }.relationship-center { display:grid;place-items:center;width:145px;height:145px;padding:15px;border:8px solid color-mix(in srgb,var(--teal-100) 76%,transparent);border-radius:50%;color:#fff;background:linear-gradient(135deg,var(--teal-600),var(--teal-900));box-shadow:0 16px 40px rgba(15,110,86,.24);text-align:center; }.relationship-center strong,.relationship-center span { display:block; }.relationship-center span { font-size:9px;opacity:.75;text-transform:uppercase; }.relationship-node { width:120px;min-height:72px;padding:9px;border:2px solid var(--teal-300);border-radius:13px;color:var(--text-primary);background:var(--surface-1);box-shadow:var(--shadow-md);font:inherit;cursor:pointer; }.relationship-node strong,.relationship-node span,.relationship-node small { display:block; }.relationship-node strong { font-size:11px; }.relationship-node span { margin-top:2px;color:var(--text-secondary);font-size:9px; }.relationship-node small { margin-top:5px;color:var(--text-muted);font-size:7.5px; }.relationship-node.is-strained { border-color:#d88a80; }.relationship-node.is-professional { border-color:#789bd0; }.relationship-node.is-mixed { border-color:#d6aa55; }.relationship-controls h2 { margin:0 0 14px;font-size:15px; }.relationship-actions { display:flex;gap:5px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--border); }

.conference-layout { display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:16px; }.conference-empty { padding:70px 25px;text-align:center; }.conference-empty>span { font-size:50px;color:var(--teal-600); }.conference-empty h2 { margin:9px 0 5px;font-family:var(--font-display); }.conference-empty p { max-width:530px;margin:0 auto 18px;color:var(--text-muted); }.conference-room { padding:0;overflow:hidden; }.conference-room-head { display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--border); }.conference-room-head h2 { margin:2px 0 0;font-size:16px; }.conference-room-head>span { color:var(--text-muted);font-size:9px; }.conference-messages { display:flex;min-height:320px;max-height:520px;flex-direction:column;gap:10px;padding:20px;overflow:auto;background:linear-gradient(var(--theme-canvas-wash),var(--theme-canvas-wash)),var(--theme-watermark-art) center/cover; }.conference-message { max-width:82%;padding:11px 13px;border:1px solid var(--border);border-radius:13px 13px 13px 3px;background:var(--surface-1);box-shadow:var(--shadow-sm); }.conference-message.is-mine { align-self:flex-end;border-radius:13px 13px 3px 13px;background:var(--teal-50); }.conference-message>div { display:flex;justify-content:space-between;gap:12px; }.conference-message strong { font-size:10px; }.conference-message span { color:var(--text-muted);font-size:8px; }.conference-message p { margin:5px 0 0;font-size:12px;line-height:1.5;white-space:pre-wrap; }.conference-composer { padding:16px 20px;border-top:1px solid var(--border); }.conference-composer>div { display:flex;align-items:center;justify-content:space-between;gap:12px; }.conference-composer p { margin:0;color:var(--text-muted);font-size:9px; }.conference-participants h2 { margin:0 0 12px;font-size:14px; }.conference-participants>div { display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid var(--border); }.conference-participants>div>span { display:grid;place-items:center;width:32px;height:32px;border-radius:10px;color:var(--teal-800);background:var(--teal-50);font-size:9px;font-weight:750; }.conference-participants p,.conference-participants strong,.conference-participants small { display:block;margin:0; }.conference-participants strong { font-size:10.5px; }.conference-participants small { color:var(--text-muted);font-size:8.5px;text-transform:capitalize; }

/* Slow living artwork: gentle movement without turning the interface into a cartoon. */
.wellbeing-watermark-frame.frame-one { transform-origin:62% 78%; }.wellbeing-watermark-frame.frame-two { transform-origin:68% 72%; }.wellbeing-watermark-frame.frame-three { transform-origin:64% 74%; }
@keyframes wellbeingWatermarkFade { 0%,100% { opacity:0;transform:translateX(15px) translateY(5px) scale(1.025) rotate(.35deg); } 7%,18% { opacity:.34;transform:translateX(0) translateY(0) scale(1) rotate(0); } 27% { opacity:.32;transform:translateX(-4px) translateY(-3px) scale(1.018) rotate(-.25deg); } 35% { opacity:0;transform:translateX(-11px) translateY(-5px) scale(1.01) rotate(-.4deg); } }
.wellness-graphic-header::after { transform-origin:75% 78%;animation:wellnessHeaderCycle 24s ease-in-out infinite; }
@keyframes wellnessHeaderCycle { 0% { background-image:url('/public/images/wellness-meditation-yoga.webp');transform:translateY(2px) rotate(.3deg) scale(1); } 16% { transform:translateY(-3px) rotate(-.3deg) scale(1.018); } 32% { background-image:url('/public/images/wellness-meditation-yoga.webp');transform:translateY(1px) rotate(.2deg) scale(1.008); } 33% { background-image:url('/public/images/wellness-taichi-exercise.webp'); } 49% { transform:translateX(-4px) translateY(-2px) rotate(-.35deg) scale(1.02); } 65% { background-image:url('/public/images/wellness-taichi-exercise.webp');transform:translateX(2px) scale(1.008); } 66% { background-image:url('/public/images/wellness-reading-music.webp'); } 83% { transform:translateY(-3px) rotate(.25deg) scale(1.018); } 100% { background-image:url('/public/images/wellness-reading-music.webp');transform:translateY(2px) scale(1); } }

@media (max-width:900px) { .clinical-toolbelt,.relationship-layout,.conference-layout { grid-template-columns:1fr; }.reception-row { grid-template-columns:90px 1fr 1fr; }.reception-status { grid-column:3;justify-self:start; }.relationship-canvas-card { min-height:520px; }.relationship-map { min-height:470px; } }
@media (max-width:600px) { .morning-brief-grid { grid-template-columns:1fr; }.clinical-toolbelt { grid-template-columns:1fr; }.reception-hero { align-items:flex-start;flex-direction:column;margin-inline:0;padding:22px 18px; }.reception-now { width:100%; }.reception-row { grid-template-columns:80px 1fr;padding:13px; }.reception-row>div:nth-of-type(2),.reception-status { grid-column:2; }.relationship-node { width:98px;min-height:62px; }.relationship-center { width:118px;height:118px; }.conference-message { max-width:94%; } }
@media (prefers-reduced-motion:reduce) { .morning-brief-item,.wellbeing-watermark-frame,.wellness-graphic-header::after { animation:none!important;transition:none!important; }.wellbeing-watermark-frame.frame-one { opacity:.3;transform:none; } }

/* OPD Clinic blue system — replaces inherited MindBridge-green module accents. */
body.theme-opd {
  --mb-canvas:#f4f9fc;
  --mb-paper:rgba(255,255,255,.96);
  --mb-ink:#173b4a;
  --mb-sage:#dceff6;
  --mb-hairline:rgba(25,127,162,.14);
  --mb-soft-shadow:0 1px 2px rgba(21,90,116,.035),0 12px 34px rgba(21,90,116,.06);
  --mb-lift-shadow:0 18px 42px rgba(21,90,116,.12),0 3px 8px rgba(21,90,116,.05);
}
body.theme-opd:not(.dashboard-page) .main {
  background:radial-gradient(circle at 96% 0,rgba(34,183,232,.12),transparent 25rem),linear-gradient(180deg,rgba(251,253,254,.88),rgba(244,249,252,.97));
}
body.theme-opd:not(.dashboard-page) .main > .page-header {
  background:linear-gradient(102deg,rgba(255,255,255,.98),rgba(239,249,253,.94));
}
body.theme-opd:not(.dashboard-page) .main > .page-header::before {
  background:linear-gradient(180deg,#4cc9ee,#197fa2);
}
body.theme-opd:not(.dashboard-page) .main > .page-header::after {
  border-color:rgba(34,183,232,.07);
}
body.theme-opd:not(.dashboard-page) .page-header .subtitle { color:#607985; }
body.theme-opd .module-overview .module-overview-intro {
  background:linear-gradient(145deg,#197fa2,#125d78);
}
body.theme-opd .module-overview .module-overview-intro > span,
body.theme-opd .module-overview .module-overview-intro > small { color:rgba(255,255,255,.74); }
body.theme-opd .module-overview .module-overview-intro > strong { color:#fff; }
body.theme-opd .table-wrap th {
  color:#607985;
  background:linear-gradient(180deg,#fbfdfe,#f2f8fb);
  border-bottom-color:rgba(25,127,162,.14);
}
body.theme-opd .table-wrap td { border-bottom-color:rgba(25,127,162,.09); }
body.theme-opd .table-wrap tbody tr:hover td { background:#f1f9fc; }
body.theme-opd .table-wrap td > a:not(.btn),
body.theme-opd .record-person > strong { color:#176f91; }
body.theme-opd .record-person > span,
body.theme-opd .notification-symbol {
  border-color:rgba(25,127,162,.12);
  color:#176f91;
  background:#e6f6fb;
}
body.theme-opd .filter-bar { box-shadow:0 8px 25px rgba(21,90,116,.045); }
body.theme-opd .filter-bar input[type=text],
body.theme-opd .filter-bar input[type=search],
body.theme-opd .filter-bar select,
body.theme-opd:not(.dashboard-page) input[type=text],
body.theme-opd:not(.dashboard-page) input[type=email],
body.theme-opd:not(.dashboard-page) input[type=password],
body.theme-opd:not(.dashboard-page) input[type=date],
body.theme-opd:not(.dashboard-page) input[type=datetime-local],
body.theme-opd:not(.dashboard-page) input[type=number],
body.theme-opd:not(.dashboard-page) select,
body.theme-opd:not(.dashboard-page) textarea { border-color:rgba(25,127,162,.19); }
body.theme-opd:not(.dashboard-page) input:focus,
body.theme-opd:not(.dashboard-page) select:focus,
body.theme-opd:not(.dashboard-page) textarea:focus {
  border-color:#55bddd;
  box-shadow:0 0 0 4px rgba(34,183,232,.11);
}
body.theme-opd:not(.dashboard-page) label { color:#385f6f; }
body.theme-opd:not(.dashboard-page) .card:hover { border-color:rgba(25,127,162,.23); }
body.theme-opd .empty-state::before { color:#197fa2;background:#e8f7fc; }
body.theme-opd .inquiry-avatar { color:#176f91;background:linear-gradient(145deg,#e6f7fc,#ccecf6); }
body.theme-opd .inquiry-message { border-color:rgba(25,127,162,.1);color:#334f5b;background:#f7fbfd; }
body.theme-opd .staff-directory-photo,
body.theme-opd .staff-directory-fallback { background:linear-gradient(145deg,#e7f5fa,#cfe8f1); }
body.theme-opd .staff-directory-fallback { color:#197fa2; }
body.theme-opd .staff-directory-copy span { color:#176f91;background:#e7f6fb; }
body.theme-opd.mode-dark {
  --mb-canvas:#0f1d23;
  --mb-paper:rgba(18,34,41,.97);
  --mb-ink:#e9f7fc;
  --mb-sage:#203d49;
  --mb-hairline:rgba(134,217,241,.15);
}
body.theme-opd.mode-dark:not(.dashboard-page) .main > .page-header { background:linear-gradient(145deg,#173746,#102731); }
body.theme-opd.mode-dark .module-overview .module-overview-intro { background:linear-gradient(145deg,#197fa2,#0f5069); }
body.theme-opd.mode-dark .module-overview > div { background:#142a33; }
body.theme-opd.mode-dark .table-wrap th { color:#b9dce8;background:linear-gradient(180deg,#19333e,#142a33); }
body.theme-opd.mode-dark .table-wrap tbody tr:hover td { background:#193640; }

/* OPD Clinic brand lockup — transparent artwork with a larger, clearer sidebar presence. */
body.theme-opd .sidebar-brand {
  min-height:148px;
  padding:12px 4px 14px;
}
body.theme-opd .sidebar-brand-inner {
  width:100%;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
body.theme-opd .sidebar-brand img,
body.theme-opd.mode-dark .sidebar-brand img {
  width:214px;
  max-width:100%;
  max-height:118px;
  object-fit:contain;
  filter:none;
  opacity:1;
  mix-blend-mode:normal;
  background:transparent;
}
body.theme-opd.mode-dark .sidebar-brand-inner {
  padding:0;
  border-radius:0;
  background:transparent;
}
@media (max-width:860px) {
  body.theme-opd .sidebar-brand { min-height:132px; padding:10px 6px 12px; }
  body.theme-opd .sidebar-brand img { width:210px; max-height:105px; }
}

/* Noir Atelier — original black-ink theme with locally bundled typography. */
body.theme-noir_atelier {
  --surface-0:#f4f4f4;
  --surface-1:#ffffff;
  --surface-2:#ededed;
  --border:#d1d1d1;
  --border-strong:#999999;
  --text-primary:#080808;
  --text-secondary:#3c3c3c;
  --text-muted:#707070;
  --success:#202020;
  --success-bg:#e8e8e8;
  --warning:#4d4d4d;
  --warning-bg:#eeeeee;
  --mb-canvas:#f4f4f4;
  --mb-paper:rgba(255,255,255,.97);
  --mb-ink:#080808;
  --mb-sage:#e8e8e8;
  --mb-hairline:rgba(0,0,0,.17);
  --mb-soft-shadow:0 1px 2px rgba(0,0,0,.05),0 14px 36px rgba(0,0,0,.07);
  --mb-lift-shadow:0 20px 48px rgba(0,0,0,.13),0 3px 8px rgba(0,0,0,.07);
  background:radial-gradient(circle at 92% -4%,rgba(0,0,0,.06),transparent 30rem),linear-gradient(180deg,#fff,var(--surface-0));
}
body.theme-noir_atelier .sidebar {
  border-right-color:rgba(33,29,25,.16);
  box-shadow:8px 0 28px rgba(44,37,30,.06);
}
body.theme-noir_atelier .sidebar-brand img { filter:grayscale(1) contrast(1.15); }
body.theme-noir_atelier .nav-section { color:#111; font-family:var(--font); font-weight:750; letter-spacing:.14em; }
body.theme-noir_atelier .nav-link { color:#050505; background:rgba(255,255,255,.44); font-family:var(--theme-sidebar-font); font-size:16.5px; font-weight:650; letter-spacing:.005em; text-shadow:0 1px 0 #fff; }
body.theme-noir_atelier .nav-link .nav-icon { color:#080808; }
body.theme-noir_atelier .nav-link:hover { color:#000; background:rgba(255,255,255,.82); border-color:rgba(0,0,0,.22); }
body.theme-noir_atelier .nav-link.active { color:#fff; border-color:#111; background:linear-gradient(135deg,#37332f,#0d0d0d); box-shadow:0 9px 22px rgba(26,22,18,.19); }
body.theme-noir_atelier .nav-link.active .nav-icon { color:#fff; }
body.theme-noir_atelier .sidebar-search-input { color:#050505; border-color:rgba(0,0,0,.28); background-color:rgba(255,255,255,.82); filter:grayscale(1); }
body.theme-noir_atelier .sidebar-search-input::placeholder { color:#3f3f3f; }
body.theme-noir_atelier .page-header h1,
body.theme-noir_atelier .dashboard-hero h1,
body.theme-noir_atelier .kpi-hero-header h1,
body.theme-noir_atelier .chat-hero h1,
body.theme-noir_atelier .reports-hero h1 { font-family:var(--theme-display-font); font-weight:500; letter-spacing:-.025em; }
body.theme-noir_atelier:not(.dashboard-page) .main > .page-header { border-color:rgba(0,0,0,.15); background:linear-gradient(102deg,rgba(255,255,255,.98),rgba(236,236,236,.93)); box-shadow:var(--mb-soft-shadow); }
body.theme-noir_atelier:not(.dashboard-page) .main > .page-header::after { border-color:rgba(35,31,27,.07); }
body.theme-noir_atelier .card,
body.theme-noir_atelier .table-wrap,
body.theme-noir_atelier .stat-card,
body.theme-noir_atelier .kpi-widget-card { border-color:rgba(56,50,44,.16); box-shadow:var(--mb-soft-shadow); }
body.theme-noir_atelier .card h2,
body.theme-noir_atelier .card h3,
body.theme-noir_atelier .card-title { color:var(--text-primary); }
body.theme-noir_atelier .card h2,
body.theme-noir_atelier .card h3 { font-family:var(--theme-display-font); font-weight:550; }
body.theme-noir_atelier th { color:#303030; background:linear-gradient(180deg,#f2f2f2,#e5e5e5); }
body.theme-noir_atelier tr:hover td { background:#f1f1f1; }
body.theme-noir_atelier .btn-primary { color:#fff; border-color:#111; background:linear-gradient(135deg,#36322f,#0d0d0d); box-shadow:0 8px 19px rgba(20,18,16,.18); }
body.theme-noir_atelier .btn-primary:hover { background:#000; border-color:#000; }
body.theme-noir_atelier .stat-card .value { color:#080808; font-family:var(--theme-display-font); font-size:35px; font-weight:650; }
body.theme-noir_atelier .stat-card .stat-icon { color:#111; background:#eee; border:1px solid rgba(0,0,0,.14); border-radius:50%; }
body.theme-noir_atelier.gradient-cards .stat-card.stat-card-gradient { background:linear-gradient(145deg,#2c2c2c,#000)!important; }
body.theme-noir_atelier.gradient-cards .stat-card.stat-card-gradient .value,
body.theme-noir_atelier.gradient-cards .stat-card.stat-card-gradient .label { color:#fff!important; text-shadow:0 1px 2px #000; }
body.theme-noir_atelier.gradient-cards .stat-card.stat-card-gradient .stat-icon { color:#050505; background:#fff; border-color:#fff; }
body.theme-noir_atelier #clock-widget,
body.theme-noir_atelier .bundy-clock { background:radial-gradient(circle at 88% 4%,rgba(255,255,255,.08),transparent 35%),linear-gradient(145deg,#34312d,#0b0b0b); }
body.theme-noir_atelier .dashboard-announcements { border-left-color:#292624; }
body.theme-noir_atelier .dashboard-rail .card { background:linear-gradient(150deg,#fff,#ededed); }
body.theme-noir_atelier .record-person > span,
body.theme-noir_atelier .notification-symbol { color:#282522; background:#e9e3d9; }
body.theme-noir_atelier .badge:not(.badge-danger) { filter:grayscale(1); }
body.theme-noir_atelier .team-person-card,
body.theme-noir_atelier .kb-article-card { box-shadow:0 8px 25px rgba(38,32,27,.055); }
body.theme-noir_atelier .team-person-avatar { filter:grayscale(.88); }
body.theme-noir_atelier .team-person-credential { filter:grayscale(1); }
body.theme-noir_atelier .kb-ai-workbench { border-color:rgba(0,0,0,.16)!important; background:linear-gradient(135deg,#ededed,#fff)!important; }
body.theme-noir_atelier .timeclock-page-header,
body.theme-noir_atelier .wellbeing-page-header,
body.theme-noir_atelier .wellbeing-team-header { background-image:linear-gradient(100deg,rgba(255,255,255,.97),rgba(240,240,240,.86)),var(--theme-quote-art)!important; }
body.theme-noir_atelier .people-hero { border-color:rgba(0,0,0,.15); background:linear-gradient(125deg,rgba(255,255,255,.98),rgba(232,232,232,.9)); }
body.theme-noir_atelier .people-hero::before,
body.theme-noir_atelier .people-hero::after { background:rgba(43,38,33,.11); }
body.theme-noir_atelier .appearance-theme-card:has(input[value="noir_atelier"]) .appearance-theme-mini-title { color:#171615; font-weight:600; }

body.theme-noir_atelier.mode-dark {
  --surface-0:#0c0c0c;
  --surface-1:#181818;
  --surface-2:#262626;
  --border:#3a3a3a;
  --border-strong:#555;
  --text-primary:#fff;
  --text-secondary:#d0d0d0;
  --text-muted:#969696;
  --theme-canvas:#080808;
  --theme-canvas-wash:rgba(0,0,0,.9);
  --theme-sidebar-overlay-top:rgba(0,0,0,.9);
  --theme-sidebar-overlay-mid:rgba(8,8,8,.86);
  --theme-sidebar-overlay-bottom:rgba(0,0,0,.84);
  --theme-sidebar-text:#fff;
  --theme-sidebar-muted:#ddd;
  --theme-sidebar-icon:#fff;
  --mb-canvas:#0c0c0c;
  --mb-paper:rgba(24,24,24,.98);
  --mb-ink:#fff;
  --mb-sage:#282828;
  --mb-hairline:rgba(255,255,255,.14);
}
body.theme-noir_atelier.mode-dark:not(.dashboard-page) .main,
body.theme-noir_atelier.mode-dark:not(.dashboard-page) .main > .page-header { background:linear-gradient(145deg,#1b1917,#100f0e); }
body.theme-noir_atelier.mode-dark .sidebar-brand img { filter:brightness(0) invert(1); }
body.theme-noir_atelier.mode-dark .nav-section { color:#fff; }
body.theme-noir_atelier.mode-dark .nav-link { color:#fff; background:rgba(0,0,0,.46); text-shadow:0 1px 2px #000; }
body.theme-noir_atelier.mode-dark .nav-link .nav-icon { color:#fff; }
body.theme-noir_atelier.mode-dark .nav-link:hover { color:#fff; background:rgba(255,255,255,.13); }
body.theme-noir_atelier.mode-dark .card,
body.theme-noir_atelier.mode-dark .table-wrap,
body.theme-noir_atelier.mode-dark .stat-card,
body.theme-noir_atelier.mode-dark .kpi-widget-card { background:var(--surface-1); border-color:var(--border); }
body.theme-noir_atelier.mode-dark th { color:var(--text-secondary); background:#25221f; }
body.theme-noir_atelier.mode-dark tr:hover td { background:#24211e; }
body.theme-noir_atelier.mode-dark .stat-card .value { color:var(--text-primary); }
body.theme-noir_atelier.mode-dark .stat-card .stat-icon { color:#eee7dc; background:#302c28; }
body.theme-noir_atelier.mode-dark .dashboard-rail .card { background:linear-gradient(150deg,#201e1b,#151311); }
body.theme-noir_atelier.mode-dark .timeclock-page-header,
body.theme-noir_atelier.mode-dark .wellbeing-page-header,
body.theme-noir_atelier.mode-dark .wellbeing-team-header { background-image:linear-gradient(100deg,rgba(24,22,20,.97),rgba(18,16,15,.86)),var(--theme-quote-art)!important; }

/* Pop Atelier — vivid original screen-print art with protected text contrast. */
body.theme-pop_atelier {
  --surface-0:#fff6df;
  --surface-1:#fffdf6;
  --surface-2:#eaf2ff;
  --border:#172447;
  --border-strong:#101936;
  --text-primary:#11182d;
  --text-secondary:#4d5873;
  --text-muted:#788199;
  --success:#087f83;
  --success-bg:#dcf6f3;
  --warning:#9a6500;
  --warning-bg:#fff1b8;
  --mb-canvas:#fff6df;
  --mb-paper:rgba(255,253,246,.97);
  --mb-ink:#11182d;
  --mb-sage:#fff0bb;
  --mb-hairline:rgba(16,25,54,.22);
  --mb-soft-shadow:4px 5px 0 rgba(16,25,54,.12);
  --mb-lift-shadow:7px 9px 0 rgba(16,25,54,.16);
  background:linear-gradient(180deg,#fffaf0,var(--surface-0));
}
body.theme-pop_atelier .sidebar {
  border-right:2px solid #080d20;
  box-shadow:8px 0 0 rgba(237,30,121,.12);
}
body.theme-pop_atelier .sidebar-brand-inner { position:relative; padding:8px 10px 12px; border:0; border-radius:0; background:transparent; box-shadow:none; isolation:isolate; }
body.theme-pop_atelier .sidebar-brand-inner::after { content:''; position:absolute; z-index:-1; left:16%; right:16%; bottom:5px; height:9px; border-radius:50%; background:linear-gradient(90deg,#ed1e79,#ffca14,#04d7de,#6645e8,#ed1e79); filter:blur(8px); opacity:.72; }
body.theme-pop_atelier .sidebar-brand img {
  background:transparent;
  filter:brightness(0) invert(1) drop-shadow(-2px 0 #ff2e93) drop-shadow(2px 0 #00d9e8) drop-shadow(0 2px #ffe229);
  animation:popLogoPsychedelic 8s ease-in-out infinite;
}
@keyframes popLogoPsychedelic {
  0%,100% { filter:brightness(0) invert(1) drop-shadow(-2px 0 #ff2e93) drop-shadow(2px 0 #00d9e8) drop-shadow(0 2px #ffe229); }
  33% { filter:brightness(0) invert(1) drop-shadow(-2px 1px #00d9e8) drop-shadow(2px -1px #ffe229) drop-shadow(0 2px #8d4bff); }
  66% { filter:brightness(0) invert(1) drop-shadow(-2px -1px #ffe229) drop-shadow(2px 1px #8d4bff) drop-shadow(0 2px #ff2e93); }
}
body.theme-pop_atelier .nav-section { color:#ffdf31; font-weight:800; letter-spacing:.14em; text-shadow:0 2px 0 rgba(0,0,0,.7); }
body.theme-pop_atelier .nav-link {
  color:#fff;
  border-color:transparent;
  background:rgba(3,8,28,.42);
  font-family:var(--theme-sidebar-font);
  font-weight:650;
  text-shadow:0 1px 2px #000,0 0 4px rgba(0,0,0,.85);
  backdrop-filter:blur(2px);
}
body.theme-pop_atelier .nav-link .nav-icon { color:#ffdf31; filter:drop-shadow(0 1px 1px #000); }
body.theme-pop_atelier .nav-link:hover { color:#fff; border-color:rgba(255,255,255,.7); background:rgba(20,91,215,.88); }
body.theme-pop_atelier .nav-link.active { color:#fff; border:2px solid #fff; background:linear-gradient(135deg,#ed1e79,#ff5a1f); box-shadow:4px 4px 0 #ffca14; text-shadow:0 1px 2px rgba(75,0,25,.72); }
body.theme-pop_atelier .sidebar-search-input { color:#fff; border:2px solid rgba(255,255,255,.76); background-color:rgba(2,8,27,.78); box-shadow:3px 3px 0 #ed1e79; }
body.theme-pop_atelier .sidebar-search-input::placeholder { color:#fff; opacity:.9; }
body.theme-pop_atelier .sidebar-footer,
body.theme-pop_atelier .sidebar-footer button { color:#fff!important; text-shadow:0 1px 2px #000; }
body.theme-pop_atelier .sidebar-customize-button { color:#fff; border:1px solid rgba(255,255,255,.55); background:rgba(3,8,28,.7); font-weight:650; }
body.theme-pop_atelier .page-header h1,
body.theme-pop_atelier .dashboard-hero h1,
body.theme-pop_atelier .kpi-hero-header h1,
body.theme-pop_atelier .chat-hero h1,
body.theme-pop_atelier .reports-hero h1 { font-family:var(--theme-display-font); font-weight:400; letter-spacing:-.025em; text-transform:none; }
body.theme-pop_atelier:not(.dashboard-page) .main > .page-header { border:2px solid #111936; background-image:linear-gradient(95deg,rgba(255,253,246,.97),rgba(255,248,221,.91) 64%,rgba(255,255,255,.28)),var(--theme-quote-art); background-position:center; background-size:cover; box-shadow:6px 7px 0 rgba(20,91,215,.14); }
body.theme-pop_atelier:not(.dashboard-page) .main > .page-header::after { border-color:rgba(237,30,121,.12); }
body.theme-pop_atelier .card,
body.theme-pop_atelier .table-wrap,
body.theme-pop_atelier .stat-card,
body.theme-pop_atelier .kpi-widget-card { border:2px solid rgba(16,25,54,.86); border-radius:10px; box-shadow:var(--mb-soft-shadow); }
body.theme-pop_atelier .card:hover,
body.theme-pop_atelier .stat-card:hover { box-shadow:var(--mb-lift-shadow); }
body.theme-pop_atelier .card h2,
body.theme-pop_atelier .card h3,
body.theme-pop_atelier .card-title { color:var(--text-primary); }
body.theme-pop_atelier th { color:#101936; background:linear-gradient(180deg,#ffe66d,#ffd22a); border-bottom:2px solid #101936; font-weight:800; }
body.theme-pop_atelier tr:hover td { background:#eef4ff; }
body.theme-pop_atelier .btn { border:2px solid #101936; border-radius:7px; box-shadow:3px 3px 0 rgba(16,25,54,.16); }
body.theme-pop_atelier .btn-primary { color:#fff; border-color:#101936; background:#145bd7; box-shadow:4px 4px 0 #ffca14; }
body.theme-pop_atelier .btn-primary:hover { background:#ed1e79; box-shadow:5px 5px 0 #ffca14; }
body.theme-pop_atelier .stat-card .value { color:#101936; font-family:var(--theme-display-font); font-weight:400; }
body.theme-pop_atelier .stat-card .stat-icon { color:#101936; border:2px solid #101936; border-radius:50%; background:#ffca14; }
body.theme-pop_atelier.gradient-cards .stat-card.accent-1 { background:linear-gradient(145deg,#ed1e79,#b71567)!important; }
body.theme-pop_atelier.gradient-cards .stat-card.accent-2 { background:linear-gradient(145deg,#04aeb5,#087f83)!important; }
body.theme-pop_atelier.gradient-cards .stat-card.accent-3 { background:linear-gradient(145deg,#ffca14,#f18a00)!important; }
body.theme-pop_atelier.gradient-cards .stat-card.accent-4 { background:linear-gradient(145deg,#145bd7,#4b35b9)!important; }
body.theme-pop_atelier.gradient-cards .stat-card.accent-5 { background:linear-gradient(145deg,#ff5a1f,#ed1e79)!important; }
body.theme-pop_atelier #clock-widget,
body.theme-pop_atelier .bundy-clock { border:2px solid #101936; background:radial-gradient(circle at 88% 5%,rgba(255,202,20,.23),transparent 34%),linear-gradient(145deg,#145bd7,#101936); box-shadow:6px 7px 0 #ed1e79; }
body.theme-pop_atelier .dashboard-announcements { border-left-color:#ed1e79; }
body.theme-pop_atelier .dashboard-rail .card { background:linear-gradient(150deg,#fffdf6,#fff0b8); }
body.theme-pop_atelier .badge:not(.badge-danger) { border:1px solid #101936; }
body.theme-pop_atelier .timeclock-page-header,
body.theme-pop_atelier .wellbeing-page-header,
body.theme-pop_atelier .wellbeing-team-header { background-image:linear-gradient(100deg,rgba(255,253,246,.97),rgba(255,248,221,.86)),var(--theme-quote-art)!important; }
body.theme-pop_atelier .appearance-theme-card:has(input[value="pop_atelier"]) .appearance-theme-mini-title { color:#101936; font-weight:400; }

body.theme-pop_atelier.mode-dark {
  --surface-0:#090d1c;
  --surface-1:#111936;
  --surface-2:#1b2855;
  --border:#526aa2;
  --border-strong:#8198cf;
  --text-primary:#fff9e9;
  --text-secondary:#d4ddf5;
  --text-muted:#96a5cc;
  --theme-canvas:#080c1a;
  --theme-canvas-wash:rgba(6,10,23,.88);
  --mb-canvas:#090d1c;
  --mb-paper:rgba(17,25,54,.97);
  --mb-ink:#fff9e9;
  --mb-sage:#1b2855;
  --mb-hairline:rgba(160,180,230,.22);
}
body.theme-pop_atelier.mode-dark:not(.dashboard-page) .main { background:linear-gradient(180deg,#0b1024,#070a16); }
body.theme-pop_atelier.mode-dark:not(.dashboard-page) .main > .page-header { background-image:linear-gradient(95deg,rgba(12,18,40,.97),rgba(16,25,54,.91) 64%,rgba(8,12,26,.45)),var(--theme-quote-art); }
body.theme-pop_atelier.mode-dark .card,
body.theme-pop_atelier.mode-dark .table-wrap,
body.theme-pop_atelier.mode-dark .stat-card,
body.theme-pop_atelier.mode-dark .kpi-widget-card { background:var(--surface-1); border-color:#526aa2; }
body.theme-pop_atelier.mode-dark th { color:#101936; background:linear-gradient(180deg,#ffe66d,#ffca14); }
body.theme-pop_atelier.mode-dark tr:hover td { background:#1b2855; }
body.theme-pop_atelier.mode-dark .stat-card .value { color:var(--text-primary); }
body.theme-pop_atelier.mode-dark .dashboard-rail .card { background:linear-gradient(150deg,#151f43,#0e1530); }
body.theme-pop_atelier.mode-dark .timeclock-page-header,
body.theme-pop_atelier.mode-dark .wellbeing-page-header,
body.theme-pop_atelier.mode-dark .wellbeing-team-header { background-image:linear-gradient(100deg,rgba(12,18,40,.97),rgba(16,25,54,.88)),var(--theme-quote-art)!important; }

/* Client-thread media playback and emoji composer for clinicians. */
.case-msg-media { width:min(70%,480px); }
.case-msg-media-label { margin-bottom:7px;font-size:11.5px;font-weight:700; }
.case-msg-media video { display:block;width:100%;max-height:320px;border-radius:10px;background:#000; }
.case-msg-media audio { display:block;width:min(100%,360px); }
.case-message-composer { align-items:center; }
.message-emoji-wrap { position:relative;flex:0 0 auto; }
.message-emoji-toggle { width:36px;height:36px;border:1px solid var(--border);border-radius:50%;background:var(--surface-1);color:var(--text-primary);font-size:20px;cursor:pointer; }
.message-emoji-picker { position:absolute;z-index:30;left:0;bottom:44px;width:224px;padding:9px;grid-template-columns:repeat(4,1fr);gap:4px;border:1px solid var(--border);border-radius:13px;background:var(--surface-1);box-shadow:var(--shadow-lg); }
.message-emoji-picker:not([hidden]) { display:grid; }
.message-emoji-picker button { padding:6px;border:0;border-radius:7px;background:transparent;font-size:20px;cursor:pointer; }
.message-emoji-picker button:hover { background:var(--surface-2); }
@media (max-width:640px) { .case-msg-media { width:88%;max-width:88%!important; } }
@media (prefers-reduced-motion:reduce) {
  body.theme-pop_atelier .sidebar-brand img { animation:none; }
}

/* OPD Clinic Help Center — an interactive, role-aware procedure book. */
.topbar-help-link { text-decoration:none; }
.topbar-help-mark { display:grid;place-items:center;width:21px;height:21px;border:1px solid currentColor;border-radius:50%;font:700 12px/1 var(--font-sans); }
.guidebook-hero { position:relative;display:grid;grid-template-columns:250px minmax(0,1fr);gap:clamp(28px,5vw,70px);align-items:center;min-height:330px;padding:42px clamp(28px,5vw,76px);overflow:hidden;border:1px solid var(--border);border-radius:24px;background:radial-gradient(circle at 88% 12%,rgba(201,169,94,.18),transparent 25%),linear-gradient(125deg,color-mix(in srgb,var(--surface-2) 86%,#dcefe8),var(--surface-1));box-shadow:var(--shadow-md); }
.guidebook-hero::before { content:"";position:absolute;inset:0;pointer-events:none;opacity:.2;background-image:repeating-linear-gradient(92deg,transparent 0 3px,rgba(22,72,60,.13) 4px); }
.guidebook-cover { position:relative;z-index:1;aspect-ratio:.72;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:26px 22px;color:#f8f2dc;text-align:center;border:1px solid #315e52;border-radius:5px 13px 13px 5px;background:linear-gradient(90deg,#173f37 0 9%,#285f51 9% 11%,#194b40 11% 100%);box-shadow:-8px 11px 0 #d9d0ba,0 21px 38px rgba(18,48,41,.3);transform:rotate(-2deg); }
.guidebook-cover::before { content:"";position:absolute;inset:13px;border:1px solid rgba(224,195,119,.66);border-radius:2px 9px 9px 2px;box-shadow:inset 0 0 0 4px rgba(224,195,119,.08); }
.guidebook-cover::after { content:"";position:absolute;left:17px;top:0;bottom:0;width:1px;background:rgba(236,211,151,.35);box-shadow:4px 0 rgba(0,0,0,.18); }
.guidebook-cover span,.guidebook-cover strong,.guidebook-cover i,.guidebook-cover b { position:relative;z-index:1; }
.guidebook-cover span { margin-bottom:18px;font:600 11px/1.2 var(--font-sans);letter-spacing:.24em;text-transform:uppercase; }
.guidebook-cover strong { display:block;width:100%;max-width:100%;text-align:center;font:600 clamp(30px,2.5vw,36px)/1 var(--font-display);letter-spacing:-.03em; }
.guidebook-cover i { margin-top:18px;font:italic 13px/1.4 Georgia,serif;opacity:.8; }
.guidebook-cover b { margin-top:22px;color:#dfc27c;font-size:20px; }
.guidebook-intro { position:relative;z-index:1;max-width:760px; }
.guidebook-intro h1 { margin:5px 0 12px;font:600 clamp(38px,5vw,68px)/.98 var(--font-display);letter-spacing:-.045em;color:var(--text-primary); }
.guidebook-intro>p { max-width:680px;margin:0 0 24px;color:var(--text-secondary);font-size:16px;line-height:1.75; }
.guidebook-intro>small { display:block;margin-top:12px;color:var(--text-muted); }
.guidebook-search { display:flex;gap:8px;max-width:700px;padding:7px 7px 7px 16px;border:1px solid var(--border);border-radius:15px;background:var(--surface-1);box-shadow:var(--shadow-sm); }
.guidebook-search>span { align-self:center;color:var(--text-muted);font-size:22px; }
.guidebook-search input { flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--text-primary);font:inherit; }
.guidebook-bookmarks { display:flex;gap:7px;margin:24px 0 18px;padding:0 12px;overflow:auto;scrollbar-width:thin; }
.guidebook-bookmarks a { flex:0 0 auto;padding:9px 15px;color:var(--text-secondary);text-decoration:none;border:1px solid var(--border);border-bottom-width:3px;border-radius:9px 9px 4px 4px;background:var(--surface-1);font-size:12px;font-weight:700;transition:transform .18s ease,color .18s ease; }
.guidebook-bookmarks a:hover,.guidebook-bookmarks a.active { color:#fff;border-color:#255d50;background:#255d50;transform:translateY(-3px); }
.guidebook-shelf { padding:28px clamp(18px,3vw,36px) 40px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(180deg,var(--surface-1),color-mix(in srgb,var(--surface-2) 55%,var(--surface-1)));box-shadow:var(--shadow-sm); }
.guidebook-shelf-head { display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:22px; }
.guidebook-shelf-head h2 { margin:4px 0 0;font-size:28px; }.guidebook-shelf-head>span { color:var(--text-muted);font-size:12px; }
.guidebook-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:20px; }
.guidebook-chapter { position:relative;min-height:255px;padding:29px 26px 24px;color:var(--text-primary);text-decoration:none;border:1px solid color-mix(in srgb,var(--border) 78%,#c3ad78);border-radius:3px 14px 14px 3px;background:linear-gradient(98deg,rgba(125,99,52,.08),transparent 12%),linear-gradient(145deg,#fffefa,#f3efe5);box-shadow:-4px 6px 0 color-mix(in srgb,var(--border) 55%,#d5cbb5),0 13px 27px rgba(37,53,45,.09);transition:transform .22s ease,box-shadow .22s ease;overflow:hidden; }
.guidebook-chapter::after { content:"";position:absolute;inset:0;pointer-events:none;opacity:.32;background:repeating-linear-gradient(0deg,transparent 0 6px,rgba(71,61,39,.035) 7px); }
.guidebook-chapter:hover { transform:translateY(-7px) rotate(calc((var(--chapter-index) - 2) * .08deg));box-shadow:-4px 9px 0 color-mix(in srgb,var(--border) 55%,#d5cbb5),0 22px 34px rgba(37,53,45,.15); }
.guidebook-page-edge { position:absolute;left:8px;top:12px;bottom:12px;width:1px;background:#c8b98d;box-shadow:3px 0 rgba(131,106,53,.14),6px 0 rgba(131,106,53,.09); }
.guidebook-chapter small { position:relative;z-index:1;color:#7d6540;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }
.guidebook-chapter h3 { position:relative;z-index:1;margin:16px 0 10px;font:600 22px/1.16 var(--font-display);color:#1d3e35; }
.guidebook-chapter p { position:relative;z-index:1;margin:0;color:#53635e;font-size:13px;line-height:1.65; }
.guidebook-open { position:absolute;z-index:1;left:26px;right:24px;bottom:21px;display:flex;justify-content:space-between;color:#285f51;font-size:12px;font-weight:800; }
.guidebook-empty { padding:65px 24px;text-align:center; }.guidebook-empty>span { font-size:34px; }.guidebook-empty h3 { margin:12px 0 5px; }.guidebook-empty p { color:var(--text-muted); }
.guidebook-reader-top { display:flex;justify-content:space-between;gap:15px;margin:0 auto 16px;max-width:1160px;color:var(--text-muted);font-size:12px; }.guidebook-reader-top a { color:var(--primary);font-weight:750;text-decoration:none; }
.interactive-guidebook { position:relative;display:grid;grid-template-columns:1fr 1fr;max-width:1160px;min-height:650px;margin:0 auto 28px;perspective:1800px;filter:drop-shadow(0 22px 30px rgba(31,44,38,.19)); }
.interactive-guidebook::before { content:"";position:absolute;z-index:5;left:50%;top:2%;bottom:2%;width:24px;transform:translateX(-50%);pointer-events:none;background:linear-gradient(90deg,transparent,rgba(48,40,27,.12),rgba(255,255,255,.48),rgba(48,40,27,.1),transparent); }
.guidebook-left-page,.guidebook-right-page { position:relative;min-width:0;padding:clamp(30px,4vw,52px);color:#273b35;border:1px solid #d8d0be;background:radial-gradient(circle at 10% 10%,rgba(235,219,177,.14),transparent 30%),repeating-linear-gradient(0deg,transparent 0 8px,rgba(95,79,43,.018) 9px),#fffdf6;overflow:hidden; }
.guidebook-left-page { border-radius:18px 2px 2px 18px;box-shadow:inset -15px 0 22px rgba(58,45,27,.06); }
.guidebook-right-page { border-radius:2px 18px 18px 2px;box-shadow:inset 15px 0 22px rgba(58,45,27,.06);transform-style:preserve-3d; }
.guidebook-running-head { min-height:22px;padding-bottom:12px;color:#8a7c62;border-bottom:1px solid #ddd3bf;font:700 9px/1.2 var(--font-sans);letter-spacing:.12em;text-transform:uppercase; }
.guidebook-left-page h1 { margin:20px 0 10px;font:600 clamp(29px,3vw,42px)/1.02 var(--font-display);letter-spacing:-.035em;color:#214b40; }
.guidebook-dek { margin:0 0 18px;color:#566a63;font:15px/1.55 Georgia,serif; }
.guidebook-overview-screen { position:relative;margin:0;padding:8px;border:1px solid #d4cbb8;border-radius:12px;background:#fff;box-shadow:0 11px 23px rgba(48,42,29,.1);overflow:hidden; }.guidebook-overview-screen::before { content:"";position:absolute;z-index:1;top:13px;left:14px;width:5px;height:5px;border-radius:50%;background:#f07e72;box-shadow:9px 0 #e6bd61,18px 0 #65b889; }.guidebook-overview-screen img { display:block;width:100%;aspect-ratio:1.875;object-fit:cover;border-radius:7px;background:#eef4f1; }
.guidebook-chapter-mark { display:flex;align-items:center;gap:13px;margin:17px 0 0;padding:12px 0 0;border-top:1px solid #ddd3bf; }.guidebook-chapter-mark>span { color:#b2924e;font:600 31px/1 Georgia,serif; }.guidebook-chapter-mark p { margin:0;color:#24483f;font-size:12px;font-weight:800; }.guidebook-chapter-mark small { display:block;margin-top:2px;color:#7d877f;font-size:10px;font-weight:400; }
.guidebook-left-page blockquote { margin:0;padding:18px;border-left:3px solid #c1a45f;background:rgba(219,207,173,.18);font:italic 14px/1.65 Georgia,serif; }
.guidebook-step-stack { position:relative;min-height:430px;transform-style:preserve-3d; }
.guidebook-step-page { position:absolute;inset:0;display:none;flex-direction:column;justify-content:center;transform-origin:left center;backface-visibility:hidden; }.guidebook-step-page.active { display:flex;animation:bookPageSettle .42s ease both; }.guidebook-step-page.turn-forward { display:flex;z-index:4;animation:bookPageForward .34s cubic-bezier(.45,.05,.55,.95) both; }.guidebook-step-page.turn-back { display:flex;z-index:4;transform-origin:right center;animation:bookPageBack .34s cubic-bezier(.45,.05,.55,.95) both; }
.guidebook-step-number { display:grid;place-items:center;width:66px;height:66px;margin-bottom:24px;color:#f6eedb;border-radius:50%;background:#285f51;box-shadow:0 0 0 8px rgba(40,95,81,.1);font:600 23px/1 Georgia,serif; }
.guidebook-step-page h2 { margin:0 0 16px;color:#24483f;font:600 32px/1.08 var(--font-display); }.guidebook-step-page p,.guidebook-step-page li { color:#4d625b;font:17px/1.75 Georgia,serif; }.guidebook-step-page ul { padding-left:22px; }.guidebook-step-page li+li { margin-top:13px; }
.guidebook-step-instruction { max-width:430px;margin:0!important;color:#334f46!important;font:22px/1.65 Georgia,serif!important; }
.guidebook-step-tip { display:grid;gap:5px;margin-top:30px;padding:15px 17px;border-left:3px solid #c1a45f;background:rgba(219,207,173,.18); }.guidebook-step-tip strong { color:#8a7041;font:800 9px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase; }.guidebook-step-tip span { color:#64736d;font:italic 13px/1.55 Georgia,serif; }
.guidebook-reader-controls { position:absolute;left:clamp(28px,4vw,58px);right:clamp(28px,4vw,58px);bottom:49px;display:flex;align-items:center;justify-content:space-between;gap:12px; }.guidebook-dots { display:flex;justify-content:center;gap:5px; }.guidebook-dots button { width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#c8c0ae;cursor:pointer; }.guidebook-dots button.active { width:20px;border-radius:10px;background:#285f51; }
.guidebook-page-number { position:absolute;left:0;right:0;bottom:16px;color:#9a8f79;text-align:center;font:9px/1 var(--font-sans);letter-spacing:.1em;text-transform:uppercase; }
.guidebook-related { max-width:1160px;margin:0 auto;padding:28px;border:1px solid var(--border);border-radius:18px;background:var(--surface-1); }.guidebook-related>div { display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-top:12px; }.guidebook-related a { padding:17px;color:var(--text-primary);text-decoration:none;border:1px solid var(--border);border-radius:12px;background:var(--surface-2); }.guidebook-related small { display:block;margin-top:5px;color:var(--text-muted);line-height:1.4; }
@keyframes bookPageForward { 0%{transform:rotateY(0);filter:brightness(1)} 49%{opacity:1} 100%{transform:rotateY(-92deg) translateX(-5%);opacity:0;filter:brightness(.72)} }
@keyframes bookPageBack { 0%{transform:rotateY(0);filter:brightness(1)} 49%{opacity:1} 100%{transform:rotateY(92deg) translateX(5%);opacity:0;filter:brightness(.72)} }
@keyframes bookPageSettle { from{opacity:.25;transform:translateX(12px)} to{opacity:1;transform:none} }
body.mode-dark .guidebook-chapter,body.mode-dark .guidebook-left-page,body.mode-dark .guidebook-right-page { color:var(--text-primary);border-color:var(--border);background:linear-gradient(145deg,var(--surface-1),var(--surface-2)); }.mode-dark .guidebook-chapter h3,.mode-dark .guidebook-left-page h1,.mode-dark .guidebook-step-page h2,.mode-dark .guidebook-chapter-mark p { color:var(--text-primary); }.mode-dark .guidebook-chapter p,.mode-dark .guidebook-dek,.mode-dark .guidebook-step-page p,.mode-dark .guidebook-step-page li { color:var(--text-secondary); }.mode-dark .guidebook-overview-screen { border-color:var(--border);background:var(--surface-2); }.mode-dark .guidebook-step-tip { background:color-mix(in srgb,var(--surface-2) 80%,#9c8248); }.mode-dark .guidebook-step-tip span { color:var(--text-secondary); }
@media(max-width:1100px){.guidebook-hero{grid-template-columns:1fr;padding:28px}.guidebook-cover{width:170px;margin:auto}.guidebook-cover strong{font-size:24px;letter-spacing:-.02em}.guidebook-intro{text-align:center}.guidebook-intro h1{font-size:clamp(34px,7vw,52px)}.guidebook-search{margin:auto}.guidebook-bookmarks{flex-wrap:wrap;overflow:visible}.interactive-guidebook{display:block;min-height:720px;filter:drop-shadow(0 12px 20px rgba(31,44,38,.15))}.interactive-guidebook::before{display:none}.guidebook-left-page{min-height:auto;padding:28px;border-radius:15px 15px 3px 3px}.guidebook-left-page .guidebook-dek{margin-bottom:0}.guidebook-left-page .guidebook-chapter-mark,.guidebook-left-page blockquote,.guidebook-left-page>.guidebook-page-number{display:none}.guidebook-right-page{min-height:520px;padding:30px 26px 95px;border-radius:3px 3px 15px 15px}.guidebook-step-stack{min-height:330px}.guidebook-reader-controls{left:20px;right:20px}.guidebook-reader-controls .btn{padding:9px 11px;font-size:11px}.guidebook-dots{max-width:90px;flex-wrap:wrap}.guidebook-shelf-head{align-items:flex-start}.guidebook-search{flex-wrap:wrap}.guidebook-search button{width:100%}}
@media(prefers-reduced-motion:reduce){.guidebook-cover,.guidebook-bookmarks a,.guidebook-chapter{transition:none!important;transform:none!important}.guidebook-step-page.active,.guidebook-step-page.turn-forward,.guidebook-step-page.turn-back{animation:none!important}}
/* Financial statements and corporation-readiness hub */
.financial-report-hero{position:relative;overflow:hidden;display:flex;justify-content:space-between;gap:28px;padding:32px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(135deg,var(--primary-dark,#123d35),var(--primary,#1f8068));color:#fff;box-shadow:0 18px 48px rgba(26,70,59,.16)}
.financial-report-hero:after{content:"";position:absolute;right:-70px;bottom:-110px;width:300px;height:300px;border:45px solid rgba(255,255,255,.07);border-radius:50%;pointer-events:none}
.financial-report-hero__copy{position:relative;z-index:1;max-width:720px}.financial-report-hero h1{margin:4px 0 8px;color:#fff;font-size:clamp(30px,4vw,48px);line-height:1.05}.financial-report-hero p{margin:0;max-width:680px;color:rgba(255,255,255,.82)}
.financial-eyebrow{margin:0!important;font-size:11px!important;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.financial-report-badges{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.financial-report-badges span{padding:7px 10px;border:1px solid rgba(255,255,255,.22);border-radius:99px;background:rgba(255,255,255,.1);font-size:11px;font-weight:700;letter-spacing:.03em}
.financial-period-form{position:relative;z-index:1;align-self:center;display:grid;grid-template-columns:1fr 1fr;gap:10px;min-width:360px;padding:17px;border:1px solid rgba(255,255,255,.2);border-radius:18px;background:rgba(255,255,255,.1);backdrop-filter:blur(12px)}.financial-period-form label{color:rgba(255,255,255,.78);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.financial-period-form input{display:block;width:100%;margin-top:5px;background:rgba(255,255,255,.95)}.financial-period-form .btn{justify-content:center}
.financial-basis-note{display:flex;gap:13px;align-items:flex-start;margin:16px 0;padding:16px 18px;border:1px solid color-mix(in srgb,var(--primary) 22%,var(--border));border-radius:16px;background:color-mix(in srgb,var(--primary) 6%,var(--card));color:var(--text)}.financial-basis-note__icon{display:grid;flex:0 0 28px;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--primary);color:#fff;font-family:serif;font-weight:700}.financial-basis-note p{margin:3px 0 0;color:var(--muted);font-size:13px;line-height:1.55}
.financial-statement-nav{position:sticky;z-index:8;top:67px;display:flex;gap:6px;overflow-x:auto;margin:0 0 18px;padding:7px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--card) 94%,transparent);box-shadow:var(--shadow-sm);backdrop-filter:blur(14px)}.financial-statement-nav a{flex:0 0 auto;padding:9px 13px;border-radius:9px;color:var(--muted);font-size:12px;font-weight:700;text-decoration:none}.financial-statement-nav a:hover{background:var(--primary-light);color:var(--primary-dark)}
.financial-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.financial-summary-card{min-width:0;padding:20px;border:1px solid var(--border);border-radius:18px;background:var(--card);box-shadow:var(--shadow-sm)}.financial-summary-card span,.financial-summary-card small{display:block;color:var(--muted);font-size:11px;font-weight:650}.financial-summary-card strong{display:block;margin:9px 0 7px;color:var(--text);font-family:var(--font-display);font-size:clamp(22px,2.2vw,31px);line-height:1;overflow-wrap:anywhere}.financial-summary-card--result{background:linear-gradient(145deg,var(--card),color-mix(in srgb,var(--primary) 11%,var(--card)));border-color:color-mix(in srgb,var(--primary) 35%,var(--border))}.financial-summary-card strong.is-negative{color:var(--danger)}
.financial-sheet{scroll-margin-top:130px;margin-bottom:18px;padding:24px;border:1px solid var(--border);border-radius:20px;background:var(--card);box-shadow:var(--shadow-sm)}.financial-sheet__header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding-bottom:17px;border-bottom:1px solid var(--border)}.financial-sheet__header p{margin:0 0 5px;color:var(--primary);font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.financial-sheet__header h2{margin:0;color:var(--text);font-family:var(--font-display);font-size:clamp(21px,2.6vw,30px)}.financial-sheet__header span{display:block;margin-top:5px;color:var(--muted);font-size:12px}
.financial-table-wrap{overflow-x:auto}.financial-statement-table,.financial-detail-table{width:100%;border-collapse:collapse}.financial-statement-table th,.financial-statement-table td,.financial-detail-table th,.financial-detail-table td{padding:12px 10px;border-bottom:1px solid var(--border);text-align:right;font-variant-numeric:tabular-nums}.financial-statement-table th:first-child,.financial-statement-table td:first-child,.financial-detail-table th:not(:last-child),.financial-detail-table td:not(:last-child){text-align:left}.financial-statement-table th,.financial-detail-table th{color:var(--muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase}.financial-statement-table td small{display:block;color:var(--muted);font-size:10px}.financial-row-group td{padding-top:20px!important;background:transparent!important;color:var(--primary)!important;font-size:10px!important;font-weight:800!important;letter-spacing:.12em;text-transform:uppercase}.financial-row-total td{font-weight:750}.financial-row-result td{border-top:2px solid var(--text);border-bottom:3px double var(--text);font-weight:850;font-size:15px}.financial-variance{font-size:11px;white-space:nowrap}.financial-variance.up{color:var(--success)}.financial-variance.down{color:var(--danger)}.financial-footnote{margin:14px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
.financial-two-column,.financial-schedules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.financial-lines{margin:8px 0 0}.financial-lines>div{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid var(--border)}.financial-lines dt{color:var(--muted);font-size:12px}.financial-lines dd{margin:0;color:var(--text);font-weight:700;font-variant-numeric:tabular-nums;text-align:right}.financial-lines__total{border-top:2px solid var(--text);font-size:14px}.financial-lines__total dt,.financial-lines__total dd{color:var(--text);font-weight:850}.financial-lines__muted{opacity:.65}.financial-incomplete{margin-top:16px;padding:14px;border-left:3px solid var(--warning);background:var(--warning-bg);border-radius:4px 12px 12px 4px}.financial-incomplete p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.5}
.equity-bridge{display:grid;grid-template-columns:repeat(9,auto);gap:10px;align-items:stretch;margin-top:20px;overflow-x:auto}.equity-bridge>div{display:flex;min-width:150px;flex-direction:column;padding:15px;border:1px solid var(--border);border-radius:13px;background:var(--bg)}.equity-bridge>b{align-self:center;color:var(--primary);font-size:20px}.equity-bridge span{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}.equity-bridge strong{margin:7px 0;font-size:14px}.equity-bridge small{margin-top:auto;color:var(--muted);font-size:10px}.equity-bridge__ending{border-color:var(--primary)!important;background:var(--primary-light)!important}
.aging-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:16px 0}.aging-grid div{padding:12px;border-radius:12px;background:var(--bg)}.aging-grid span,.aging-grid strong{display:block}.aging-grid span{color:var(--muted);font-size:10px}.aging-grid strong{margin-top:5px;font-size:14px}
.financial-health{display:grid;grid-template-columns:minmax(230px,.75fr) 1.6fr;gap:24px;margin:0 0 18px;padding:26px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 9%,var(--card)),var(--card));box-shadow:var(--shadow-sm)}.financial-health__intro h2{margin:7px 0;font-family:var(--font-display);font-size:27px}.financial-health__intro>p:not(.financial-eyebrow){color:var(--muted);font-size:12px}.financial-health__intro>strong{display:inline-block;margin-top:10px;padding:7px 10px;border-radius:99px;background:var(--card);font-size:11px}.financial-check-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.financial-check{display:flex;gap:10px;align-items:center;padding:11px;border:1px solid var(--border);border-radius:12px;background:var(--card)}.financial-check>span{display:grid;flex:0 0 29px;place-items:center;width:29px;height:29px;border-radius:50%;background:var(--success-bg);color:var(--success);font-size:11px;font-weight:800}.financial-check.has-issue>span{background:var(--warning-bg);color:var(--warning)}.financial-check.severity-high>span{background:var(--danger-bg);color:var(--danger)}.financial-check strong,.financial-check small{display:block}.financial-check strong{font-size:11px}.financial-check small{margin-top:2px;color:var(--muted);font-size:9px}
.corporate-readiness{scroll-margin-top:130px;margin-bottom:18px;padding:30px;border:1px solid color-mix(in srgb,var(--primary) 28%,var(--border));border-radius:24px;background:linear-gradient(145deg,var(--primary-dark,#123d35),color-mix(in srgb,var(--primary-dark,#123d35) 80%,#000));color:#fff;box-shadow:0 20px 55px rgba(17,52,44,.16)}.corporate-readiness>header{max-width:780px}.corporate-readiness h2{margin:7px 0 10px;color:#fff;font-family:var(--font-display);font-size:clamp(25px,3vw,36px)}.corporate-readiness header>p:not(.financial-eyebrow){color:rgba(255,255,255,.72)}.readiness-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:22px}.readiness-columns article{padding:19px;border:1px solid rgba(255,255,255,.16);border-radius:15px;background:rgba(255,255,255,.08)}.readiness-step{font-size:9px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#aee7d7}.readiness-columns h3{margin:7px 0 10px;color:#fff}.readiness-columns ul{margin:0;padding-left:18px;color:rgba(255,255,255,.78);font-size:12px;line-height:1.8}.readiness-sources{margin-top:16px;padding-top:15px;border-top:1px solid rgba(255,255,255,.16);font-size:11px}.readiness-sources p{display:inline;margin-left:9px}.readiness-sources a{color:#d7fff2}.financial-page-actions{margin:20px 0}
@media(max-width:1050px){.financial-report-hero{flex-direction:column}.financial-period-form{align-self:stretch;min-width:0}.financial-summary-grid{grid-template-columns:repeat(2,1fr)}.financial-two-column,.financial-schedules{grid-template-columns:1fr}.readiness-columns{grid-template-columns:1fr}.equity-bridge{grid-template-columns:1fr}.equity-bridge>b{text-align:center;transform:rotate(90deg)}.financial-health{grid-template-columns:1fr}}
@media(max-width:640px){.financial-report-hero{padding:23px 18px;border-radius:18px}.financial-period-form{grid-template-columns:1fr}.financial-summary-grid{grid-template-columns:1fr}.financial-sheet{padding:18px 14px}.financial-sheet__header{flex-direction:column}.financial-check-list{grid-template-columns:1fr}.financial-health,.corporate-readiness{padding:21px 16px}.aging-grid{grid-template-columns:repeat(2,1fr)}.financial-statement-nav{top:58px}}
@media print{.sidebar,.topbar,.financial-period-form,.financial-statement-nav,.financial-page-actions,.financial-sheet .btn{display:none!important}.main-content{margin:0!important;padding:0!important}.financial-report-hero{background:#fff!important;color:#000!important;box-shadow:none;border:1px solid #aaa}.financial-report-hero h1,.financial-report-hero p{color:#000!important}.financial-report-badges span{border-color:#aaa;color:#000}.financial-sheet,.financial-health,.corporate-readiness{break-inside:avoid;box-shadow:none;color:#000;background:#fff!important}.corporate-readiness h2,.corporate-readiness h3,.corporate-readiness p,.corporate-readiness li,.corporate-readiness a{color:#000!important}}
.assessment-ai-advisor{margin:14px 0;padding:16px;border:1px solid color-mix(in srgb,var(--primary) 30%,var(--border));border-radius:var(--radius-lg);background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 8%,var(--surface-1)),var(--surface-1));box-shadow:var(--shadow-sm)}
.assessment-ai-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}.assessment-ai-head h3{margin:2px 0 3px;font-size:15px}.assessment-ai-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}.assessment-ai-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--surface-1));border:1px solid color-mix(in srgb,var(--primary) 20%,var(--border))}
.assessment-ai-status{margin-top:12px;padding-top:10px;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}.assessment-ai-safety{margin-top:10px;padding:10px 12px;border-radius:10px;background:var(--danger-bg);color:var(--danger);font-size:12px;font-weight:650}.assessment-ai-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.assessment-ai-meta span{font-size:10.5px;padding:5px 8px;border-radius:999px;background:var(--surface-0);border:1px solid var(--border);color:var(--text)}
.assessment-ai-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:12px}.assessment-ai-choice{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;margin:0;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-1);cursor:pointer;transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease}.assessment-ai-choice:hover{border-color:color-mix(in srgb,var(--primary) 45%,var(--border));transform:translateY(-1px);box-shadow:var(--shadow-sm)}.assessment-ai-choice input{width:auto;margin-top:3px;accent-color:var(--primary)}.assessment-ai-choice>span{display:grid;gap:5px}.assessment-ai-choice-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.assessment-ai-choice-title strong{font-size:13px}.assessment-ai-choice-title em{font-style:normal;font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;padding:3px 6px;border-radius:999px;color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--surface-1))}.assessment-ai-rationale{font-size:12px;line-height:1.48}.assessment-ai-choice small{font-size:10.5px;line-height:1.45;color:var(--muted)}
.assessment-ai-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;padding-top:11px;border-top:1px solid var(--border)}.assessment-ai-actions>span{font-size:10.5px;color:var(--muted);max-width:650px}
@media(max-width:760px){.assessment-ai-head{grid-template-columns:auto 1fr}.assessment-ai-head .btn{grid-column:1/-1;width:100%}.assessment-ai-list{grid-template-columns:1fr}.assessment-ai-actions{align-items:stretch;flex-direction:column}.assessment-ai-actions .btn{width:100%}}