/* Shared Ocean Blue design system. Presentation only; never controls visibility,
   permissions, record selection or business calculations. Loaded after page CSS. */
:root {
  --np-canvas: #1e3a52;
  --np-panel: #25465f;
  --np-raised: #2c506a;
  --np-inset: #183247;
  --np-text: #f5f9fc;
  --np-muted: #c4d3df;
  --np-border: #52738d;
  --np-accent: #a6d8ff;
  --np-action: #66baff;
  --np-positive: #96e4bf;
  --np-warning: #ffcf72;
  --np-negative: #ffacb0;
  --np-radius: 14px;
  --np-elevation: 0 12px 32px rgb(10 28 42 / 12%);
}
html[data-theme="light"], body[data-theme="light"] {
  --np-canvas: #edf3f8; --np-panel: #ffffff; --np-raised: #e4eef6;
  --np-inset: #f4f8fb; --np-text: #183247; --np-muted: #476177;
  --np-border: #9ab0c2; --np-accent: #125c94; --np-action: #125c94;
  --np-positive: #17633f; --np-warning: #755000; --np-negative: #a3293a;
}
:is(a,button,input,select,textarea,summary):focus-visible {
  outline: 3px solid var(--np-accent); outline-offset: 4px;
}
button, input, select, textarea { font: inherit; }
button, a, summary { touch-action: manipulation; }
button:disabled { cursor: not-allowed; }
/* Admin: the working surface, not a promotional landing page. */
body.admin-page {
  --navy-1000: var(--np-inset); --navy-900: var(--np-panel);
  --navy-850: var(--np-raised); --navy-800: var(--np-raised);
  --surface-strong: var(--np-inset); --blue: var(--np-action);
  --green: var(--np-positive); --amber: var(--np-warning); --red: var(--np-negative);
  --navy-950: var(--np-canvas); --surface: var(--np-panel);
  --surface-2: var(--np-raised); --surface-3: var(--np-inset);
  --ink: var(--np-text); --text: var(--np-text); --muted: var(--np-muted);
  --muted-2: var(--np-muted); --line: var(--np-border); --line-strong: var(--np-accent);
  --blue-500: var(--np-action); --blue-400: var(--np-action); --blue-300: var(--np-accent);
  --blue-soft: var(--np-raised); --green-500: var(--np-positive);
  --amber-500: var(--np-warning); --red-500: var(--np-negative);
  --green-soft: #244c49; --amber-soft: #4e422c; --red-soft: #543746;
  --sidebar: 248px;
  background: var(--np-canvas); color: var(--np-text); line-height: 1.6;
}
html[data-theme="light"] body.admin-page { --green-soft: #e2f3e9; --amber-soft: #fff2ce; --red-soft: #fde8ec; }
.admin-page .status--grey { color: var(--np-muted); background: var(--np-inset); }
.admin-page .customer-directory-primary { box-shadow: none; }
.admin-page .customer-directory-primary__header { background: var(--np-panel); }
.admin-page .customer-directory-primary__filters { background: var(--np-inset); padding-top: 20px; }
.admin-page :is(.segmented,.customer-attention-segments) { background: transparent; border: 0; }
.admin-page .segmented button { background: var(--np-panel); font-weight: 550; }
.admin-page .segmented button.is-active { color: #183247; background: #a6d8ff; border-color: #a6d8ff; box-shadow: none; }
.admin-page :is(.customer-filter-label,.customer-search-primary > span) { text-transform: none; letter-spacing: 0; font-weight: 600; }
.admin-page :is(.product-crash-signature__body,.release-health-row__body,.version-cohort-card,.today-funnel-stage,.collection-strip > div,.filter-button,.customer-intelligence,.usage-story,.usage-device,.funnel-stage,.result-footer,.definition,.secondary-analytics,.download-metrics > div,.support-queue-heading,.ticket-details,.record,.subscription-record,.beta-access-row,.journey-step,.full-funnel-stage,.feature-adoption-row,.customer-feature-summary,.crash-breadcrumbs li,.crash-history-context span) { background: var(--np-panel); border-color: var(--np-border); }
.admin-page :is(.money-headlines a,.decision-overview__lead) { background: var(--np-panel); }
.admin-page .sidebar-brand img { box-shadow: none; }
.admin-page .customer-action-details { margin-top: 8px; max-width: 32ch; }
.admin-page .customer-action-details summary { min-height: 44px; display: list-item; padding-block: 10px; color: var(--np-accent); font-size: .875rem; }
.admin-page .customer-action-details p { color: var(--np-muted); font-size: .875rem; margin: 4px 0 0; line-height: 1.6; }
.admin-page .customer-directory-primary__header h2 { font-size: 1.6rem; letter-spacing: -.035em; }
.admin-page .sidebar { background: var(--np-inset); border-color: var(--np-border); padding: 28px 16px 20px; }
.admin-page .sidebar-brand img { background: transparent; border-radius: 0; object-fit: contain; }
.admin-page .sidebar-brand strong { color: var(--np-text); letter-spacing: -.02em; }
.admin-page :is(.sidebar-brand small,.sidebar-session,.sidebar-activity-link,.admin-nav a) { color: var(--np-muted); }
.admin-page .admin-nav a { min-height: 46px; font-weight: 550; }
.admin-page .admin-nav a:is(:hover,.is-active) { background: var(--np-raised); color: var(--np-text); box-shadow: none; }
.admin-page .admin-nav a.is-active { box-shadow: inset 3px 0 var(--np-action); }
.admin-page .nav-group-label { color: var(--np-muted); font-size: .75rem; letter-spacing: .12em; }
.admin-page .topbar { padding: 20px 32px; background: var(--np-canvas); border-color: var(--np-border); }
.admin-page .topbar h1 { font-size: 1.35rem; letter-spacing: -.025em; }
.admin-page .topbar-actions { gap: 16px; }
.admin-page .owner-global-search { width: clamp(240px,26vw,380px); }
.admin-page .owner-global-search > div { gap: 8px; }
.admin-page .owner-global-search input { border-radius: 10px; }
.admin-page .content { max-width: 1720px; padding: 32px 36px 80px; }
.admin-page :is(.panel,.brief-panel,.metric-card,.brief-metric,.command-panel) {
  background: var(--np-panel); border-color: var(--np-border); border-radius: var(--np-radius);
}
.admin-page :is(.button,.icon-button,.segmented button,.filter-button) { border-radius: 10px; min-height: 44px; }
.admin-page .button--primary { color: #183247; background: #66baff; border-color: #66baff; font-weight: 700; }
.admin-page .button--primary:hover { background: #a6d8ff; }
.admin-page :is(input,select,textarea) { color: var(--np-text); background: var(--np-inset); border-color: var(--np-border); }
.admin-page input::placeholder, .admin-page textarea::placeholder { color: var(--np-muted); opacity: 1; }
.admin-page .brief-heading h2 { font-size: clamp(1.65rem,2.5vw,2.3rem); }
.admin-page .brief-metrics { gap: 16px; }
.admin-page .brief-metrics > .brief-metric { min-height: 170px; padding: 24px; border-top: 3px solid var(--np-action); }
.admin-page .brief-metric > strong { font-size: clamp(1.75rem,2.4vw,2.5rem); letter-spacing: -.045em; }
.admin-page .brief-metric > small { font-size: .875rem; line-height: 1.55; }
.admin-page .brief-metric:hover { background: var(--np-raised); border-color: var(--np-accent); }
.admin-page .brief-main-grid { grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); }
.admin-page .brief-priorities { border-top: 3px solid var(--np-warning); }
.admin-page .brief-action { padding: 18px 0; border-color: var(--np-border); }
.admin-page .brief-action__count { background: var(--np-inset); color: var(--np-warning); border-radius: 10px; font-variant-numeric: tabular-nums; }
.admin-page .brief-service-list .brief-metric { background: transparent; border-radius: 0; box-shadow: none; }
.admin-page .brief-panel > header { gap: 16px; flex-wrap: wrap; }
.admin-page .brief-panel > header > a { min-height: 44px; display: inline-flex; align-items: center; }
.admin-page .owner-shortcuts { display: flex; flex-wrap: wrap; gap: 10px; }
.admin-page .owner-shortcuts a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 16px; color: var(--np-accent); border: 1px solid var(--np-border); border-radius: 10px; text-decoration: none; font-size: .875rem; }
.admin-page .owner-shortcuts a:hover { background: var(--np-raised); }
.admin-page .data-table { font-size: .9375rem; }
.admin-page .data-table th { background: var(--np-inset); color: var(--np-muted); padding: 16px 20px; }
.admin-page .data-table td { padding: 20px; line-height: 1.6; }
.admin-page .data-table tbody tr:hover td { background: var(--np-raised); }
.admin-page .table-wrap { scrollbar-color: var(--np-border) var(--np-inset); }
.admin-page :is(.status,.signal-badge,.cell-sub,.mono) { font-size: .875rem; }
.admin-page .customer-topbar { background: var(--np-inset); border-color: var(--np-border); }
.admin-page .customer-hero { background: var(--np-panel); border: 1px solid var(--np-border); border-radius: 16px; padding: 28px; }
.admin-page :is(.profile-tabs,.workspace-tabs) a.is-active { background: var(--np-raised); color: var(--np-text); }
.admin-page .login-screen { background: var(--np-canvas); }
.admin-page .login-card { background: var(--np-panel); border-color: var(--np-border); padding: 32px; border-radius: 18px; box-shadow: var(--np-elevation); }
.admin-page .login-brand { color: var(--np-accent); }
.admin-page .last-updated { max-width: 160px; font-size: .8125rem; }
/* Marketing keeps authentic app screenshots and its existing content hierarchy. */
body.public-page { background: var(--np-canvas); --line: var(--np-border); --muted: var(--np-muted); }
.public-page .site-header { background: var(--np-inset); }
.public-page .section { padding-block: clamp(48px,6vw,88px); }
.public-page .section-heading { margin-bottom: 32px; }
.public-page :is(.feature-card,.platform-card,.pricing-card,.support-card) { border-color: var(--np-border); border-radius: 16px; box-shadow: none; }
.public-page :is(.feature-card,.support-card) { background: var(--np-panel); padding: 28px; }
.public-page .button { border-radius: 10px; min-height: 46px; }
.public-page .drawer-wordmark > span:last-child { color: var(--np-action); }
.public-page .site-footer { background: var(--np-inset); }
/* Customer workspace: keep content roomy, with separate surfaces and clear focus. */
body.console-page.customer-portal { --shadow: var(--np-elevation); }
body.console-page.customer-portal[data-theme="dark"] { background: var(--np-canvas); --page: var(--np-canvas); --line: var(--np-border); }
.customer-portal :is(.setup-library-card,.portal-card,.console-card) { border-radius: 16px; }
.customer-portal .setup-library-card { padding: 26px; }
.customer-portal .setup-library-card h2 { font-size: 1.2rem; letter-spacing: -.02em; }
.customer-portal .setup-library-actions { gap: 10px; }
.customer-portal :is(button,input:not([type="checkbox"]):not([type="radio"]),select,textarea) { min-height: 44px; }
.customer-portal .portal-table-row { padding-block: 20px; }
.customer-portal .device-setup-cell strong { overflow-wrap: anywhere; line-height: 1.5; }
/* Authentication and legal pages previously retained the old teal styling. */
body.auth-page, body.legal-site { background: var(--np-canvas); color: var(--np-text); --ink: var(--np-text); --text: var(--np-text); --muted: var(--np-muted); --line: var(--np-border); --surface: var(--np-panel); }
body.auth-page { --auth-text: var(--np-text); --auth-muted: var(--np-muted); --auth-line: var(--np-border); --auth-blue: var(--np-action); }
.auth-page .auth-panel { width: min(100%,440px); }
:is(.auth-page,.legal-site) .site-header { background: var(--np-inset); border-color: var(--np-border); }
:is(.auth-page,.legal-site) .brand img { object-fit: contain; background: transparent; border-radius: 0; }
:is(.auth-page,.legal-site) .brand, :is(.auth-page,.legal-site) .ghost-link { color: var(--np-text); }
.auth-page .auth-shell { padding: 56px 24px; }
.auth-page .auth-card { background: var(--np-panel); border: 1px solid var(--np-border); border-radius: 18px; box-shadow: var(--np-elevation); padding: 32px; }
.auth-page :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) { min-height: 48px; font-size: 1rem; background: var(--np-inset); border-color: var(--np-border); color: var(--np-text); border-radius: 10px; }
.auth-page .auth-tabs { background: var(--np-inset); border-radius: 10px; }
.auth-page .auth-tabs button { color: var(--np-muted); min-height: 44px; }
.auth-page .auth-tabs button.is-active { background: var(--np-raised); color: var(--np-text); }
.auth-page .auth-form .button { min-height: 48px; color: #183247; background: #66baff; border-radius: 10px; }
.legal-site .legal-page { max-width: 920px; margin-inline: auto; padding: 48px 24px 80px; }
.legal-site .legal-document { background: var(--np-panel); color: var(--np-text); border: 1px solid var(--np-border); border-radius: 18px; padding: clamp(24px,5vw,56px); }
.legal-site .legal-document :is(p,li) { font-size: 1rem; line-height: 1.8; color: var(--np-muted); }
.legal-site .legal-document :is(h1,h2,h3,strong) { color: var(--np-text); }
.legal-site .legal-document a { color: var(--np-accent); }
/* Guides are a reading/search surface: less introduction, faster access. */
body.guide-site { background: var(--np-canvas); --bg: var(--np-canvas); --line: var(--np-border); }
.guide-site .help-intro { padding: 36px 0; max-width: 900px; }
.guide-site .help-intro h1 { font-size: clamp(2rem,3.5vw,2.8rem); }
.guide-site .help-guide { border-color: var(--np-border); }
.guide-site .help-guide[open] { border-color: var(--np-accent); box-shadow: none; }
.guide-site .help-intro label { margin-top: 20px; }
.guide-site .app-guide-scope { font-size: .9375rem; }
@media (max-width: 1200px) {
  .admin-page .brief-main-grid { grid-template-columns: minmax(0,1fr); }
  .admin-page .owner-global-search { width: auto; flex: 1; }
}
@media (max-width: 900px) {
  .admin-page .content { padding: 24px 20px 72px; }
  .admin-page .topbar { padding: 18px 20px; }
}
@media (max-width: 600px) {
  .admin-page .content { padding-inline: 16px; }
  .admin-page .brief-metrics { grid-template-columns: minmax(0,1fr); }
  .admin-page .brief-metrics > .brief-metric { min-height: auto; padding: 20px; }
  .admin-page .brief-panel { padding: 20px; }
  .admin-page .topbar-actions { gap: 12px; }
  .admin-page .owner-global-search { flex-basis: 100%; }
  .admin-page .owner-shortcuts a { flex: 1 1 150px; }
  .customer-portal .setup-library-card { padding: 20px; }
  .public-page :is(.feature-card,.support-card) { padding: 22px; }
  .auth-page .auth-shell { padding: 28px 16px; }
  .auth-page .auth-card { padding: 24px 20px; }
  .legal-site .legal-page { padding: 24px 16px 48px; }
}
@media (prefers-reduced-motion: reduce) {
  .admin-page *, .public-page *, .customer-portal *, .auth-page *, .guide-site * { scroll-behavior: auto; transition: none; }
}