/* Navynt design system — canonical tokens and product-wide visual rules.
   Load AFTER page-specific CSS so these tokens and overrides win. */

:root {
  --ny-font-sans: "IBM Plex Sans", "Segoe UI", sans-serif;
  --ny-font-serif: "IBM Plex Serif", Georgia, serif;
  --ny-navy-900: #0B1B36;
  --ny-navy-800: #122A4E;
  --ny-navy-700: #16345C;
  --ny-navy-600: #2E6198;
  --ny-navy-500: #3E6F9F;

  --ny-gold-600: #B8872F;
  --ny-gold-500: #C89B3C;
  --ny-gold-400: #E0B75C;

  --ny-bg: #F6F8FB;
  --ny-surface: #FFFFFF;
  --ny-surface-2: #F8FAFC;
  --ny-border: #E6EBF1;
  --ny-border-strong: #CBD5E1;

  --ny-text: #182943;
  --ny-text-secondary: #475569;
  --ny-text-muted: #607087;
  --ny-gold-ink: #946B19;
  --ny-text-disabled: #94A3B8;
  --ny-text-dark-surface: #E8ECF2;
  --ny-muted-dark-surface: #93A2B8;
  --ny-border-dark-surface: #2A3E58;
  --ny-space: 8px;

  --ny-success: #15803D;
  --ny-success-bg: #DCFCE7;
  --ny-warning: #B45309;
  --ny-warning-bg: #FEF3C7;
  --ny-danger: #B42318;
  --ny-danger-bg: #FEE4E2;
  --ny-info: #2563EB;
  --ny-info-bg: #EFF6FF;
  --ny-action: var(--ny-navy-700);
  --ny-action-hover: var(--ny-navy-800);
  --ny-action-text: var(--ny-surface);

  --ny-radius-sm: 8px;
  --ny-radius-md: 8px;
  --ny-radius-lg: 10px;
  --ny-radius-xl: 12px;

  --ny-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06);
  --ny-shadow-md: 0 6px 20px rgba(15, 23, 42, 0.08);
  --ny-shadow-lg: 0 20px 50px rgba(15, 23, 42, 0.14);

  --navynt-primary: var(--ny-navy-700);
  --navynt-primary-light: var(--ny-navy-600);
  --navynt-accent: var(--ny-gold-500);
  --navynt-accent-light: var(--ny-gold-400);
  --navynt-bg: var(--ny-bg);
  --navynt-surface: var(--ny-surface);
  --navynt-text: var(--ny-text);
  --navynt-muted: var(--ny-text-muted);
  --navynt-border: var(--ny-border);
  --navynt-success: var(--ny-success);
  --navynt-warning: var(--ny-warning);
  --navynt-danger: var(--ny-danger);
  --navynt-info: var(--ny-navy-600);
  --navynt-neutral: var(--ny-text-muted);
  --navynt-dark-bg: var(--ny-navy-900);
  --navynt-dark-panel: var(--ny-navy-800);

  --primary: var(--ny-navy-700);
  --primary-light: var(--ny-navy-600);
  --accent: var(--ny-gold-500);
  --accent-light: var(--ny-gold-400);
  --bg: var(--ny-bg);
  --card: var(--ny-surface);
  --text: var(--ny-text);
  --muted: var(--ny-text-muted);
  --border: var(--ny-border);
  --success: var(--ny-success);
  --danger: var(--ny-danger);
  --warning: var(--ny-warning);
  --commit: var(--ny-success);
  --commit-bg: var(--ny-success-bg);
  --won: var(--ny-success);
  --won-bg: var(--ny-success-bg);
  --upside: var(--ny-warning);
  --upside-bg: var(--ny-warning-bg);
  --pipeline: var(--ny-navy-600);
  --pipeline-bg: var(--ny-info-bg);
  --lost: var(--ny-danger);
  --lost-bg: var(--ny-danger-bg);
  --scrapped: var(--ny-text-muted);
  --scrapped-bg: var(--ny-surface-2);
  --success-light: var(--ny-success-bg);
  --warning-light: var(--ny-warning-bg);
  --danger-light: var(--ny-danger-bg);
  --gray-50: var(--ny-surface-2);
  --gray-100: var(--ny-bg);
  --gray-200: var(--ny-border);
  --gray-300: var(--ny-border-strong);
  --gray-400: var(--ny-text-disabled);
  --gray-500: var(--ny-text-muted);
  --gray-600: var(--ny-text-secondary);
  --gray-700: var(--ny-text);
  --gray-800: var(--ny-navy-800);
  --gray-900: var(--ny-navy-900);
  --shadow-sm: var(--ny-shadow-sm);
  --shadow-md: var(--ny-shadow-md);
  --radius: var(--ny-radius-lg);
  --radius-sm: var(--ny-radius-sm);
}

body {
  background: var(--ny-bg);
  color: var(--ny-text);
  font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
  font-size: 14px;
}
h1, h2, h3, .kpi-value, .logo, .brand-wordmark, button, input, select, textarea {
  font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
}

/* Sidebar — quiet navy operating system */
.app .sidebar {
  width: 256px;
  background: var(--ny-navy-900);
  color: var(--ny-border-strong);
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: none;
}
.app .main { margin-left: 256px; max-width: calc(100vw - 256px); }
.app .sidebar .logo { border-bottom-color: rgba(255, 255, 255, 0.08); }
.app .sidebar .logo span.version-tag,
.app .sidebar .user-badge #sidebar-user-name,
.app #sync-indicator { color: var(--ny-text-disabled) !important; }
.app .sidebar .logo .logo-chip { background: rgba(255, 255, 255, 0.08); }
.app .sidebar .user-badge {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}
.app .sidebar .user-badge .role-tag {
  background: rgba(200, 155, 60, 0.18);
  color: var(--ny-gold-400);
}
.app .sidebar .user-badge .role-tag.admin,
.app .sidebar .user-badge .role-tag.sales-head,
.app .sidebar .user-badge .role-tag.management,
.app .sidebar .user-badge .role-tag.sales,
.app .sidebar .user-badge .role-tag.presales {
  background: rgba(200, 155, 60, 0.16);
  color: var(--ny-gold-400);
}
.app .nav-primary { margin: 4px 0 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.app .nav-primary a {
  font-size: 0.92rem;
  font-weight: 600;
  color: #CBD5E1;
  padding: 10px 12px;
}
.app .sidebar nav a { color: var(--ny-muted-dark-surface); }
.app .sidebar nav a:hover { background: rgba(255, 255, 255, 0.05); color: var(--ny-text-dark-surface); }
.app .sidebar nav a.active {
  background: rgba(46, 97, 152, 0.28);
  color: var(--ny-text-dark-surface);
  font-weight: 650;
  box-shadow: inset 3px 0 0 var(--ny-gold-500);
}
.app .nav-shelf {
  background: transparent;
  border: 0;
  padding: 0 0 10px;
  margin-bottom: 8px;
}
.app .nav-shelf-label {
  color: #64748B;
  letter-spacing: 0.08em;
}
.app .nav-group-toggle .nav-caret { color: #64748B; }
.app .sidebar .logout-btn {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.1);
  color: #94A3B8;
}
.app .sidebar .logout-btn:hover { background: rgba(255, 255, 255, 0.06); color: #F8FAFC; }

/* Page headers */
.header-bar { margin-bottom: 20px; align-items: flex-end; }
.header-bar h1 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--ny-navy-800);
  letter-spacing: -0.025em;
}
.header-bar .date {
  display: block;
  margin-top: 4px;
  color: var(--ny-text-muted);
  font-size: 0.84rem;
  font-weight: 500;
}

/* Command / Today / Tomorrow operating layer */
#view-command .header-bar h1 { font-size: 1.7rem; }
#view-today .header-bar h1 { color: var(--ny-navy-700); }
#view-tomorrow {
  background: linear-gradient(180deg, #F8FAFC 0%, var(--ny-bg) 120px);
}
#view-tomorrow .header-bar h1 { color: var(--ny-text-secondary); font-weight: 650; }
.command-panel {
  border-radius: var(--ny-radius-lg);
  border-color: var(--ny-border);
  box-shadow: var(--ny-shadow-sm);
}
.command-metric {
  background: var(--ny-surface-2);
  border-color: var(--ny-border);
  box-shadow: none;
}
.command-metric strong { color: var(--ny-navy-800); }
.platform-empty {
  background: var(--ny-surface-2);
  border-color: var(--ny-border-strong);
  color: var(--ny-text-muted);
}

/* Cards / tables / inputs */
.card {
  border-radius: var(--ny-radius-lg);
  border: 1px solid var(--ny-border);
  background: var(--ny-surface);
  box-shadow: none;
}
.card h2 { color: var(--ny-navy-800); font-size: 1.05rem; font-weight: 650; }
th {
  background: var(--ny-surface-2) !important;
  color: var(--ny-text-secondary) !important;
  font-weight: 600;
  border-bottom: 1px solid var(--ny-border);
}
tr:hover td { background: var(--ny-surface-2); }
.form-group input,
.form-group select,
.form-group textarea,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
select,
textarea {
  min-height: 40px;
  border-radius: var(--ny-radius-sm);
  border-color: var(--ny-border-strong);
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--ny-navy-600);
  box-shadow: 0 0 0 3px rgba(46, 97, 152, 0.12);
  outline: none;
}

/* Amber is the one primary action. Success and danger stay separate. */
.btn {
  border-radius: var(--ny-radius-sm);
  min-height: 40px;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.btn-sm { min-height: 32px; }
.btn-primary {
  background: var(--ny-gold-500);
  color: var(--ny-navy-900);
  border: 1px solid var(--ny-gold-600);
}
.btn-primary:hover {
  background: var(--ny-gold-600);
  color: var(--ny-surface);
  border-color: var(--ny-gold-600);
}
.btn.btn-success {
  background: var(--ny-success);
  color: var(--ny-surface);
  border: 1px solid var(--ny-success);
}
.btn.btn-success:hover {
  background: #166534;
  border-color: #166534;
}
.btn-outline {
  background: #fff;
  color: var(--ny-navy-700);
  border: 1px solid var(--ny-navy-700);
}
.btn-outline:hover {
  background: var(--ny-info-bg);
  color: var(--ny-navy-700);
  border-color: var(--ny-navy-600);
}
.btn-danger,
.actions .del { background: var(--ny-danger); color: #fff; }
.actions .edit { background: var(--ny-navy-600); color: #fff; }

/* KPI — one navy signal, not a rainbow of top borders */
.kpi-card,
.kpi-card.commit,
.kpi-card.won,
.kpi-card.upside,
.kpi-card.pipeline,
.kpi-card.lost,
.kpi-card.scrapped {
  border-top: 3px solid var(--ny-navy-700);
  border-radius: var(--ny-radius-lg);
  box-shadow: var(--ny-shadow-sm);
}
.kpi-card .kpi-value,
.kpi-card.commit .kpi-value,
.kpi-card.won .kpi-value,
.kpi-card.upside .kpi-value,
.kpi-card.pipeline .kpi-value,
.kpi-card.lost .kpi-value,
.kpi-card.scrapped .kpi-value {
  color: var(--ny-navy-800);
  font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
}

.badge-Commit { background: var(--ny-success-bg); color: var(--ny-success); }
.badge-Won { background: var(--ny-success-bg); color: var(--ny-success); }
.badge-Upside { background: var(--ny-warning-bg); color: var(--ny-warning); }
.badge-Pipeline { background: var(--ny-info-bg); color: var(--ny-navy-600); }
.badge-Lost { background: var(--ny-danger-bg); color: var(--ny-danger); }
.badge-Admin { background: var(--ny-danger-bg); color: var(--ny-danger); }
.badge-Management { background: var(--ny-info-bg); color: var(--ny-navy-700); }
.ny-banner {
  border: 1px solid var(--ny-border);
  border-radius: var(--ny-radius-sm);
  padding: 10px 16px;
  font-size: 14px;
}
.ny-banner-warning {
  background: var(--ny-warning-bg);
  color: var(--ny-warning);
  border-color: #F5D089;
}
.toast { background: var(--ny-navy-800); }
.toast.success { background: var(--ny-success); }
.toast.error { background: var(--ny-danger); }
.workspace-trust-banner,
.workspace-health-banner { background: var(--ny-warning-bg); border-color: #F5D089; color: var(--ny-warning); }
.workspace-health-banner.critical { background: var(--ny-danger-bg); border-color: #FECACA; color: var(--ny-danger); }
.save-progress { background: var(--ny-navy-800); }
.save-progress .save-progress-bar > span { background: var(--ny-gold-500); }
.form-group label .req { color: var(--ny-danger); }
.alert-danger { background: var(--ny-danger-bg); border-left-color: var(--ny-danger); color: var(--ny-danger); }

.modal { border-radius: var(--ny-radius-xl); box-shadow: var(--ny-shadow-lg); }
.modal-header h3 { color: var(--ny-navy-800); }

.login-screen {
  background: var(--ny-navy-900);
}
.login-card {
  border-radius: 12px;
  box-shadow: 0 24px 48px -28px rgba(0, 0, 0, 0.55);
  border: 1px solid var(--ny-border-dark-surface);
}
.login-brand {
  background: var(--ny-navy-800);
}
.login-brand::before,
.login-brand::after { display: none; }
.login-brand .brand-logo-chip {
  background: var(--ny-surface);
  box-shadow: none;
  padding: 10px 14px;
  border-radius: 8px;
}
.login-brand .brand-logo-caption {
  font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
  letter-spacing: 0.16em;
  font-weight: 500;
  color: var(--ny-gold-400);
}
.login-brand .brand-mid h2 {
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.35;
}
.login-form-panel .form-head h1 {
  font-weight: 600;
  letter-spacing: -0.025em;
}

@media (max-width: 900px) {
  .app .sidebar { width: 60px; background: var(--ny-navy-900); }
  .app .main { margin-left: 60px; max-width: calc(100vw - 60px); }
}

@media (max-width: 720px) {
  .app .main { padding: 14px; }
  .header-bar { align-items: flex-start; flex-direction: column; gap: 10px; }
  .header-bar > button, .header-bar > .actions { width: 100%; }
  .header-bar > button { min-height: 44px; }
  .form-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .form-group.full { grid-column: 1 !important; }
  .modal-overlay { padding: 8px; align-items: flex-end; }
  .modal { width: 100%; max-width: 100% !important; max-height: 92vh; border-radius: 8px 8px 0 0; }
  .modal-body { overflow-y: auto; }
  .modal-footer { flex-wrap: wrap; }
  .modal-footer .btn { flex: 1 1 140px; min-height: 44px; }
  .filters { display: grid !important; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .filters input, .filters select, input, select, textarea { max-width: 100%; min-height: 44px; }
  .table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .command-metrics, .command-grid, .kpi-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .platform-item-main { align-items: flex-start; flex-direction: column; }
  .platform-item-aside { width: 100%; justify-content: space-between; }
  .actions { flex-wrap: wrap; }
}

/* Shared presentation for the homepage, public resources, and account flows.
   Body classes keep these rules separate from dense operational components. */
:focus-visible { outline: 2px solid var(--ny-gold-500); outline-offset: 3px; }
.ny-public, .ny-account, .ny-admin, .ny-customer {
  font-family: var(--ny-font-sans);
  color: var(--ny-text);
  background: var(--ny-bg);
  -webkit-font-smoothing: antialiased;
}
.ny-public { background: var(--ny-surface); font-size: 15px; line-height: 1.7; }
.ny-public h1, .ny-public h2, .ny-account h1, .ny-account .form-side h2,
.ny-account .pitch h1, .ny-admin .login-card h1, .ny-customer h1,
.ny-portal .top h1, .ny-portal .login-card h1, .app .header-bar h1,
.login-form-panel .form-head h1, .login-brand .brand-mid h2 {
  font-family: var(--ny-font-serif);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.25;
}
.ny-public h1 { color: var(--ny-navy-900); font-size: clamp(32px, 4vw, 46px); }
.ny-public h2 { color: var(--ny-navy-900); font-size: clamp(25px, 3vw, 32px); }
.ny-public h3 { font-family: var(--ny-font-sans); color: var(--ny-navy-900); font-weight: 600; }
.ny-public p, .ny-public .lead { color: var(--ny-text-muted); }
.ny-public .eyebrow { color: var(--ny-gold-ink); font-size: 11px; letter-spacing: .15em; font-weight: 600; }
.ny-public .nav, .ny-public .top {
  background: var(--ny-surface);
  color: var(--ny-navy-900);
  border-bottom: 1px solid var(--ny-border);
}
.ny-public .nav-inner { max-width: 1184px; padding: 18px 32px; }
.ny-public .top { padding: 18px 0; }
.ny-public .top .wrap { max-width: 1120px; }
.ny-public .wordmark { color: var(--ny-navy-900); font-size: 19px; font-weight: 700; font-family: var(--ny-font-sans); }
.ny-public .wordmark .dot, .ny-account .wordmark .mark, .ny-admin .wordmark .mark {
  width: 30px; height: 30px; flex: none; border-radius: 7px;
  background: var(--ny-navy-900) url('/assets/brand/navynt-icon-reversed.svg') no-repeat center / 24px;
}
.ny-public .top nav { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.ny-public .top nav a { color: var(--ny-text-muted); margin: 0; font-size: 13px; }
.ny-public .top nav a:hover { color: var(--ny-navy-900); }
.ny-public .hero { background: linear-gradient(120deg, #FBFCFD, #F3F6FA); padding: 76px 0; }
.ny-public .hero .lead { max-width: 700px; font-size: 16px; line-height: 1.8; }
.ny-public section { padding: 64px 0; }
.ny-public .section-alt { background: var(--ny-bg); border-color: var(--ny-border); }
.ny-public .panel, .ny-public .note, .ny-public .subprocessor-card {
  background: var(--ny-surface); border: 1px solid var(--ny-border); border-radius: 9px;
  box-shadow: 0 3px 8px rgba(22, 43, 72, .02); color: var(--ny-text-muted);
}
.ny-public .panel { padding: 26px; }
.ny-public .grid-2 { gap: 20px; }
.ny-public .compare { color: var(--ny-text-secondary); background: var(--ny-surface); border: 1px solid var(--ny-border); }
.ny-public .compare th, .ny-public .compare td { border-color: var(--ny-border); padding: 16px; }
.ny-public .compare td:first-child { color: var(--ny-navy-900); }
.ny-public .compare th { text-transform: none; font-size: 13px; }
.ny-public .compare-scroll { overflow-x: auto; border-radius: 9px; }
.ny-public .compare-scroll .compare { min-width: 620px; }
.ny-public .btn { border-radius: 6px; font-size: 13px; min-height: 44px; font-family: var(--ny-font-sans); }
.ny-public .btn-primary:hover, .ny-account button.submit:hover, .ny-account .link-btn:hover,
.ny-account .btn:not(.btn-ghost):not(.oauth-btn):hover, .ny-portal .primary:hover {
  background: var(--ny-gold-400); color: var(--ny-navy-900); border-color: var(--ny-gold-500);
}
.ny-public .btn-ghost { color: var(--ny-navy-900); border-color: var(--ny-border-strong); background: transparent; }
.ny-public .btn-ghost:hover { background: var(--ny-bg); }
.ny-public .cta-band { background: var(--ny-navy-900); color: var(--ny-text-dark-surface); padding: 68px 0; }
.ny-public .cta-band h2 { color: var(--ny-text-dark-surface); }
.ny-public .cta-band p { color: #A5B5CA; }
.ny-public .cta-band .btn-ghost { color: var(--ny-text-dark-surface); border-color: #405270; }
.ny-public .cta-band .btn-ghost:hover { background: var(--ny-navy-800); }
.ny-public footer { color: var(--ny-text-muted); border-color: var(--ny-border); }
.ny-public footer.wrap { max-width: none; padding: 30px 32px; text-align: center; }
.ny-public details { background: var(--ny-bg); border: 1px solid var(--ny-border); }
.ny-public details summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; font-weight: 600; }
.ny-public details summary::-webkit-details-marker { display: none; }
.ny-public details summary::after { content: '+'; color: var(--ny-text-muted); font-size: 20px; font-weight: 400; }
.ny-public details[open] summary::after { content: '−'; }
.ny-public .faq-a p { color: var(--ny-text-muted); }
.ny-resource main { padding-top: 60px; padding-bottom: 72px; }
.ny-legal main { padding: 64px 0 72px; }
.ny-legal .legal-section { padding: 0; margin-bottom: 30px; }
.ny-legal .legal-section h2, .ny-legal .subprocessor-card h2 { font-size: 21px; }
.ny-legal .legal-section p { color: var(--ny-text-secondary); }
.ny-legal .footer { background: #08162D; color: #9BAEC8; padding: 40px 0; }
.ny-legal .footer h4 { color: #DCE6F3; }
.ny-legal .footer a { color: #9BAEC8; }
.ny-legal .footer a:hover { color: white; }
.ny-partner-home { min-height: 100vh; background: linear-gradient(120deg, #FBFCFD, #F3F6FA); }
.ny-partner-home > .wrap { max-width: 1120px; padding: 32px; }
.ny-partner-home > .wrap > .wordmark { margin-bottom: 70px; }
.ny-partner-home h1 { max-width: 650px; font-size: clamp(36px, 5vw, 52px); }
.ny-partner-home .note { max-width: 620px; padding: 18px; }

/* Light account surfaces with one navy brand panel and restrained gold actions. */
.ny-account, .ny-admin {
  --cream: var(--ny-text); --slate: var(--ny-text-muted); --slate-dim: var(--ny-text-muted);
  --navy-panel: var(--ny-surface); --navy-panel-light: var(--ny-surface-2);
  --navy-line: var(--ny-border); --brass-bright: var(--ny-gold-ink);
  --danger: var(--ny-danger); --danger-bg: var(--ny-danger-bg);
  --active-green: var(--ny-success); --active-bg: var(--ny-success-bg);
}
.ny-account { background: linear-gradient(120deg, #FBFCFD, #F3F6FA); padding: 32px 20px; }
.ny-account .compass { display: none; }
.ny-account .card, .ny-account > .wrap, .ny-admin .login-card {
  background: var(--ny-surface); border: 1px solid var(--ny-border); border-radius: 12px;
  box-shadow: 0 16px 48px -16px rgba(21, 48, 82, .16);
}
.ny-account h1, .ny-admin .login-card h1 { font-size: 30px; }
.ny-account .brand-side { background: var(--ny-navy-900); border-right: 0; color: var(--ny-text-dark-surface); }
.ny-account .brand-side .wordmark, .ny-account .brand-side .pitch h1,
.ny-account .brand-side .bearing { color: var(--ny-text-dark-surface); }
.ny-account .brand-side .wordmark .mark { background-color: #19375D; }
.ny-account .brand-side .pitch p, .ny-account .brand-side .bearing span { color: #A5B5CA; }
.ny-account .brand-side .fine { color: #A5B5CA; }
.ny-account .brand-side .fine a { color: #DFB967 !important; }
.ny-account .brand-side .pitch h1 { font-size: 34px; }
.ny-account .form-side h2 { font-size: 28px; }
.ny-account input:not([type=checkbox]):not([type=radio]):not([type=file]),
.ny-account select, .ny-account textarea, .ny-admin input:not([type=checkbox]):not([type=radio]),
.ny-admin select, .ny-admin textarea {
  background-color: var(--ny-surface); color: var(--ny-text); border: 1px solid var(--ny-border-strong);
  border-radius: 7px; font-family: var(--ny-font-sans); min-height: 44px;
}
.ny-account input::placeholder, .ny-admin input::placeholder { color: #7B899E; }
.ny-account input:focus, .ny-account select:focus, .ny-admin input:focus, .ny-admin select:focus {
  border-color: var(--ny-gold-500); background-color: var(--ny-surface);
  box-shadow: 0 0 0 3px rgba(200, 155, 60, .14);
}
.ny-account select option, .ny-admin select option { background: white; color: var(--ny-text); }
.ny-account button, .ny-account input, .ny-account select, .ny-admin button { font-family: var(--ny-font-sans); }
.ny-account label { text-transform: none; letter-spacing: 0; color: var(--ny-text-secondary); }
.ny-account .banner.error, .ny-admin .error-msg, .ny-admin .badge-suspended,
.ny-admin .badge-cap-orange { color: var(--ny-danger); border-color: #FECACA; background: var(--ny-danger-bg); }
.ny-account .banner.info, .ny-account .banner.success { color: var(--ny-gold-ink); background: var(--ny-warning-bg); border-color: #E8D4A8; }
.ny-account .banner:empty { display: none; }
.ny-account .cred-box, .ny-account .logo-upload { border-color: var(--ny-border); background: var(--ny-surface-2); }
.ny-account button.submit, .ny-account .link-btn { border-radius: 6px; box-shadow: none; min-height: 44px; }
.ny-account .fine a, .ny-account .card a:not(.link-btn), .ny-account .legal-check a { color: var(--ny-navy-700) !important; }
.ny-account .err { color: var(--ny-danger); }
.ny-account .ok { color: var(--ny-success); }
.ny-account .tab { border-color: var(--ny-border-strong); color: var(--ny-text-muted); border-radius: 6px; }
.ny-account .tab.active { background: #FFF6E4; border-color: var(--ny-gold-500); color: var(--ny-gold-ink); }
.ny-account .field-row .field { min-width: 0; }
.ny-account .logo-upload { flex-wrap: wrap; }
.ny-account input[type=file] { min-width: 0; }

/* Employee login, partner login, and operating page headings. */
.login-screen, .ny-portal .login { background: linear-gradient(120deg, #FBFCFD, #F3F6FA); }
.login-card { border-color: var(--ny-border); box-shadow: 0 16px 48px -16px rgba(21, 48, 82, .16); }
.login-brand { background: var(--ny-navy-900); }
.login-brand .brand-mid h2 { font-size: 28px; }
.login-brand .brand-logo-caption { color: var(--ny-gold-400); }
.login-brand .brand-features .chk { background: rgba(200, 155, 60, .16); color: var(--ny-gold-400); }
.login-form-panel .form-head h1 { font-size: 32px; }
.login-form-panel a { color: var(--ny-navy-700); }
.login-form-panel .login-btn:not([style]) { background: var(--ny-gold-500); color: var(--ny-navy-900); border-radius: 6px; box-shadow: none; }
.login-form-panel .login-btn:not([style]):hover { background: var(--ny-gold-400); }
.app .header-bar h1 { font-size: 28px; }
#view-command .header-bar h1 { font-size: 32px; }
.ny-portal .top h1 { font-size: 28px; }
.ny-portal .login-card h1 { font-size: 28px; }
.ny-portal .login-card::before { content: ''; display: block; width: 34px; height: 34px; margin-bottom: 18px; border-radius: 7px; background: var(--ny-navy-900) url('/assets/brand/navynt-icon-reversed.svg') no-repeat center / 26px; }
.ny-portal .top { border-color: var(--ny-border); padding-bottom: 20px; }
.ny-portal .panel { border-radius: 9px; box-shadow: none; }
.ny-portal .primary { border-radius: 6px; }
.ny-portal .login-card .primary { width: 100%; }
.ny-portal .kpi-card { border-top-color: var(--ny-gold-500); }

/* Administration uses the same light forms and cards, with a navy command bar. */
.ny-admin .topbar { background: var(--ny-navy-900); color: var(--ny-text-dark-surface); border-color: #294160; }
.ny-admin .topbar .wordmark { color: var(--ny-text-dark-surface); }
.ny-admin .topbar .tag { color: var(--ny-gold-400); border-color: #405270; }
.ny-admin .topbar .btn-ghost { color: var(--ny-text-dark-surface); border-color: #405270; }
.ny-admin .wordmark { color: var(--ny-navy-900); }
.ny-admin .stat-card, .ny-admin .table-wrap, .ny-admin .modal { border-radius: 10px; box-shadow: none; background: white; border-color: var(--ny-border); }
.ny-admin .btn-ghost { color: var(--ny-navy-700); border-color: var(--ny-border-strong); }
.ny-admin .btn-ghost:hover { color: var(--ny-navy-900); background: var(--ny-bg); }
.ny-admin .btn-danger { background: var(--ny-danger-bg); color: var(--ny-danger); border-color: #FECACA; }
.ny-admin .btn-primary:hover { background: var(--ny-gold-400); color: var(--ny-navy-900); }
.ny-admin #tenants-table td { border-color: var(--ny-border); }
.ny-admin .badge-pending, .ny-admin .badge-restricted, .ny-admin .badge-review,
.ny-admin .badge-cap-yellow, .ny-admin .badge-tier-growing { color: var(--ny-gold-ink); background: var(--ny-warning-bg); }
.ny-customer .brand { display: flex; align-items: center; gap: 9px; font-family: var(--ny-font-sans); }
.ny-customer .brand::before { content: ''; width: 30px; height: 30px; border-radius: 7px; background: var(--ny-navy-900) url('/assets/brand/navynt-icon-reversed.svg') no-repeat center / 24px; }
.ny-customer .panel { border-color: var(--ny-border); border-radius: 9px; padding: 26px; }
.ny-customer h1 { font-size: 30px; }
.ny-customer input, .ny-customer textarea, .ny-customer button { font-family: var(--ny-font-sans); }
.ny-customer button { min-height: 44px; }
.ny-customer .actions { flex-wrap: wrap; }

@media (max-width: 820px) {
  .ny-account .brand-side { padding: 28px; }
  .ny-account .brand-side .pitch h1 { margin-top: 20px; font-size: 28px; }
  .ny-account .brand-side .bearings { display: none; }
  .ny-account .form-side { padding: 30px 28px; }
}
@media (max-width: 640px) {
  .ny-public .top .wrap { align-items: flex-start; flex-direction: column; gap: 14px; }
  .ny-public .top .wrap, .ny-public .nav-inner { padding-left: 24px; padding-right: 24px; }
  .ny-public .hero { padding: 50px 0; }
  .ny-public section { padding: 48px 0; }
  .ny-public .grid-2 { grid-template-columns: minmax(0, 1fr); }
  .ny-partner-home > .wrap { padding: 24px; }
  .ny-partner-home > .wrap > .wordmark { margin-bottom: 46px; }
  .ny-public .btn { white-space: normal; }
  .ny-account .card, .ny-admin .login-card { padding: 30px 24px; }
  .ny-account .field-row { flex-direction: column; gap: 0; }
  .ny-account .form-side { padding: 28px 22px; }
  .ny-account h1, .ny-admin .login-card h1 { font-size: 26px; }
  .ny-account .legal-check { align-items: flex-start; }
  .ny-portal .top h1, .app .header-bar h1 { font-size: 25px; }
  .login-brand .brand-mid h2 { font-size: 23px; }
  .ny-customer .panel { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .ny-public *, .ny-account *, .ny-admin *, .login-screen *, .ny-portal * { transition: none !important; }
  .ny-account button.submit:hover { transform: none; }
}
/* Permission review keeps the organization screen focused on structure. */
.permission-review-banner { display:flex; flex-wrap:wrap; gap:10px; padding:14px 18px; margin-bottom:16px; border:1px solid #d4e1ef; border-radius:10px; background:#f3f7fc; color:#29496c; }
.permission-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.permission-tabs button { padding:10px 16px; border:1px solid var(--border,#d8e0e8); border-radius:8px; background:white; color:inherit; cursor:pointer; }
.permission-tabs button[aria-selected="true"] { color:#fff; background:#244b74; border-color:#244b74; }
.permission-set-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:16px; }
.permission-set-grid .card { margin:0; }
.permission-set-grid h2 { font-size:1rem; }
.permission-set-status { display:block; font-size:.78rem; color:#5e6d7a; margin:14px 0; }
.permission-area { border:1px solid var(--border,#d8e0e8); border-radius:8px; margin:10px 0; padding:12px; }
.permission-area summary, .legacy-layer-access summary { cursor:pointer; font-weight:600; color:#335571; }
.permission-action-row { display:flex; flex-wrap:wrap; gap:12px; align-items:center; padding:12px 0; border-top:1px solid #edf0f4; }
.permission-action-row > label:first-child { min-width:240px; display:flex; gap:8px; align-items:center; }
.permission-editor-heading { display:flex; gap:16px; flex-wrap:wrap; margin:16px 0; }
.permission-editor label { display:inline-flex; align-items:center; gap:8px; }
.permission-editor input, .permission-editor select, #permission-set-content input, #permission-set-content select { border:1px solid var(--border,#d8e0e8); padding:8px; border-radius:6px; max-width:100%; }
.permission-editor-footer { display:flex; gap:12px; margin-top:20px; }
.legacy-layer-access { margin-top:12px; }
.org-position-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:8px; align-items:center; }
.org-position-fields input, .org-position-fields select { width:100%; min-width:0; box-sizing:border-box; }
.orglayer-row input[type="number"] { width:90px; min-width:80px; flex:none; }
.orglayer-btns { flex-shrink:0; }
#permission-set-notice[role="alert"] { color:#ad2929; }
#permission-set-content tr select[multiple] { min-width:220px; }

/* Customer experience: one palette and component treatment from website to sign-in.
   These scopes intentionally exclude authenticated workspace and operator controls. */
.ny-home, .ny-public, .ny-account, .ny-customer, .ny-portal .login, .login-screen {
  font-family:var(--ny-font-sans); color:var(--ny-text); -webkit-font-smoothing:antialiased;
}
.ny-account, .ny-portal .login, .login-screen { background:var(--ny-bg); }
.ny-account .card, .ny-account > .wrap, .ny-portal .login-card, .login-screen .login-card {
  background:var(--ny-surface); border:1px solid var(--ny-border); border-radius:var(--ny-radius-xl); box-shadow:var(--ny-shadow-md);
}
.ny-account .wordmark, .ny-public .wordmark, .ny-customer .brand { font:600 20px/1.4 var(--ny-font-sans); color:var(--ny-navy-900); }
.ny-account .wordmark { display:flex; align-items:center; gap:10px; margin-bottom:24px; }
.login-screen .login-brand, .ny-account .brand-side { background:var(--ny-navy-900); }
.login-screen .login-brand .brand-mid h2, .ny-account .brand-side .pitch h1 { color:var(--ny-text-dark-surface); }
.login-screen .login-form-panel h1, .ny-account h1, .ny-account .form-side h2, .ny-portal .login-card h1, .ny-customer h1 {
  font-family:var(--ny-font-serif); font-size:30px; font-weight:500; line-height:1.25; letter-spacing:-.025em; color:var(--ny-navy-900);
}
.login-screen .login-form-panel .login-btn:not(.oauth-btn), .ny-account button.submit,
.ny-account a.link-btn, .ny-public .btn-primary, .ny-customer .btn-primary, .ny-portal .login .primary {
  background:var(--ny-action); color:var(--ny-action-text); border:1px solid var(--ny-action); border-radius:var(--ny-radius-sm);
  box-shadow:none; min-height:44px; font:500 14px/1.4 var(--ny-font-sans); letter-spacing:0;
}
.login-screen .login-form-panel .login-btn:not(.oauth-btn):hover, .ny-account button.submit:hover,
.ny-account a.link-btn:hover, .ny-public .btn-primary:hover, .ny-customer .btn-primary:hover, .ny-portal .login .primary:hover {
  background:var(--ny-action-hover); color:var(--ny-action-text); border-color:var(--ny-action-hover); transform:none;
}
.ny-account a.link-btn { display:inline-flex; align-items:center; justify-content:center; padding:11px 18px; text-decoration:none; }
.ny-account .banner.success { color:var(--ny-success); background:var(--ny-success-bg); border-color:#86B79A; }
.ny-account .banner.info { color:var(--ny-navy-700); background:var(--ny-info-bg); border-color:var(--ny-border-strong); }
.login-screen input, .ny-portal .login input, .ny-customer input:not([type=checkbox]), .ny-customer textarea {
  background:var(--ny-surface); color:var(--ny-text); border:1px solid var(--ny-border-strong); border-radius:var(--ny-radius-sm); min-height:44px; font-family:var(--ny-font-sans);
}
.login-screen input:focus, .ny-account input:focus, .ny-account select:focus, .ny-account textarea:focus,
.ny-portal .login input:focus, .ny-customer input:focus, .ny-customer textarea:focus {
  border-color:var(--ny-navy-600); box-shadow:0 0 0 3px rgba(46,97,152,.12); outline:none;
}
.login-screen .oauth-btn { font-family:var(--ny-font-sans); }
.ny-portal .login-card { display:block; min-height:0; max-width:440px; padding:30px 28px; }
.ny-portal .login-card.hidden { display:none!important; }
.ny-portal .login-card .login-lead { color:var(--ny-text-muted); line-height:1.65; }
.ny-portal .login .outline { border-color:var(--ny-border-strong); color:var(--ny-navy-700); background:var(--ny-surface); }
.ny-lead .wrap { width:100%; max-width:560px; margin:32px auto; padding:0 20px; }
.ny-lead, .ny-lead * { box-sizing:border-box; }
.ny-lead [hidden] { display:none!important; }
.ny-lead .brand { text-decoration:none; margin-bottom:24px; }
.ny-lead .panel { background:var(--ny-surface); box-shadow:var(--ny-shadow-md); }
.ny-lead form { margin-top:20px; }
.ny-customer .brand { color:var(--ny-navy-900); }
.ny-home .hero .b:not(.o), .ny-home .cta2 .b:not(.o) { background:var(--ny-surface); color:var(--ny-action); border:1px solid var(--ny-surface); }
.ny-home .hero .b:not(.o):hover, .ny-home .cta2 .b:not(.o):hover { background:#EAF0F8; border-color:#EAF0F8; }
.ny-home .partner-entry { margin-top:22px; font-size:14px; color:#B9C6E0; }
.ny-home .partner-entry a { color:#fff; text-decoration:underline; text-underline-offset:4px; }
.ny-home #partners .channel-login { display:inline-flex; margin-top:24px; background:var(--ny-action); color:var(--ny-action-text); }
.ny-home .channel-login:hover { background:var(--ny-action-hover); }
.ny-home .channel-login-note { margin-top:10px; font-size:14px; }
@media(max-width:640px) {
  .ny-account h1, .ny-account .form-side h2, .login-screen .login-form-panel h1, .ny-portal .login-card h1, .ny-customer h1 { font-size:26px; }
  .ny-portal .login-card { padding:28px 22px; }
  .ny-lead .wrap { margin:20px auto; }
}