/* LevyHealthAI shared visual layer. Page structure, data and guards remain owned
   by each feature. Load last; scope every rule to an opted-in page shell. */
.experience {
  --experience-ink: #123440;
  --experience-muted: #526f7b;
  --experience-teal: #087e83;
  --experience-teal-hover: #086a70;
  --experience-line: #d5e3e7;
  --experience-paper: #f3f7f8;
  --experience-soft: #edf5f6;
  --experience-radius: 12px;
  --experience-shadow: 0 4px 18px rgb(18 52 64 / 4%);
  background: var(--experience-paper);
  color: var(--experience-ink);
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  line-height: 1.7;
}

/* Shared header, including the navigation added by the existing auth client. */
.experience .topbar,
.experience .sitebar,
.experience-directory > header {
  background: #fff;
  color: var(--experience-ink);
  border-bottom: 1px solid var(--experience-line);
  box-shadow: none;
  backdrop-filter: none;
}
.experience .topbar,
.experience .sitebar-inner {
  min-height: 74px;
  height: auto;
  gap: 20px;
  padding: 10px max(24px, calc((100vw - 1360px) / 2));
}
.experience .topbar .brand,
.experience .sitebrand {
  color: var(--experience-ink);
  font-size: 15px;
  letter-spacing: 0;
  text-decoration: none;
}
.experience .topbar .brand > span:last-child,
.experience .sitebrand > span:last-child {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.4;
}
.experience .brand b,
.experience .sitebrand b {
  color: var(--experience-muted);
  font-size: 11px;
  font-weight: 500;
}
.experience :is(.brand-mark, .shield-mark, .sitebrand-mark) {
  color: var(--experience-teal);
  border-color: #b5d5d9;
  border-radius: 9px;
  background: var(--experience-soft);
  width: 34px;
  height: 34px;
}
.experience :is(.global-nav, .calculator-switch, .site-switcher, .platform-navigation) {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  gap: 5px !important;
  scrollbar-width: thin;
}
.experience :is(.global-nav, .calculator-switch, .site-switcher, .platform-navigation) > a {
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 7px;
  padding: 8px 10px !important;
  background: transparent;
  box-shadow: none;
  color: var(--experience-muted);
  font-size: 13px !important;
  font-weight: 600;
  text-decoration: none;
}
.experience :is(.global-nav, .calculator-switch, .site-switcher, .platform-navigation) > a:is(.active, [aria-current="page"], :hover) {
  background: var(--experience-soft);
  color: var(--experience-teal);
  border-color: transparent;
}
.experience :is(.global-nav, .calculator-switch, .site-switcher, .platform-navigation) > a[href^="https://workbench.levyhealthai.tech"] {
  margin-left: 7px;
  border: 1px solid #bfd8dd;
  color: var(--experience-teal);
  background: #fff;
}
.experience .auth-header-slot { color: var(--experience-ink); }
.experience :is(.auth-signin-link, .auth-account-trigger, .auth-back-home) {
  border: 1px solid #c7dce1;
  border-radius: 8px;
  background: #f6fafb;
  color: #285665;
  min-height: 40px;
}
.experience :is(.auth-signin-link, .auth-account-trigger, .auth-back-home):hover {
  background: var(--experience-soft);
  color: var(--experience-teal);
  border-color: var(--experience-teal);
}
.experience :is(.auth-signin-link, .auth-account-trigger) > span {
  background: #d7efed;
  color: #087078;
}
.experience :is(.platform-tool-subnav, .page-subnav) {
  background: #fff;
  box-shadow: none;
  border-color: var(--experience-line);
  backdrop-filter: none;
}
.experience .platform-tool-subnav { top: 74px; }
.experience.has-platform-tool-subnav .page-subnav { top: 124px !important; }
.experience .page-subnav {
  overflow-x: auto;
  justify-content: flex-start;
  gap: 24px;
  padding-inline: max(24px, calc((100vw - 1314px) / 2));
  scrollbar-width: thin;
}
.experience .page-subnav a { min-height: 32px; display: inline-flex; align-items: center; }

/* Keyboard and touch feedback is consistent without overriding disabled states. */
.experience :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid #179da5 !important;
  outline-offset: 3px;
}
.experience :is(button, .button, .primary-action, .auth-primary-button) { touch-action: manipulation; }
.experience :is(button, input, select, textarea) { font-family: inherit; }
.experience :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border-radius: 8px;
}
.experience :is(.primary-action, .auth-primary-button):not(:disabled) {
  background: var(--experience-teal);
  border-color: var(--experience-teal);
  color: #fff;
  box-shadow: none;
  border-radius: 8px;
}
.experience :is(.primary-action, .auth-primary-button):not(:disabled):hover {
  background: var(--experience-teal-hover);
  filter: none;
}
.experience :is(.tool-card, .method-card, .product-panel, .calculator-hub-grid > a,
  .parameter-panel, .result-panel, .auth-card, .account-profile-card, .account-work-card,
  .account-security-card, .account-state-panel) {
  border-color: var(--experience-line);
  border-radius: var(--experience-radius);
  box-shadow: var(--experience-shadow);
}

/* Public homepage and directory retain the approved 13-series composition. */
.experience-home .hero { border-bottom: 1px solid var(--experience-line); }
.experience-home .tool-card:hover,
.experience-directory .method-card:hover,
.experience-hub .calculator-hub-grid > a:hover {
  transform: none;
  border-color: #75afb7;
  box-shadow: 0 5px 18px rgb(18 52 64 / 6%);
}
.experience-home .tool-card h3 { line-height: 1.5; }
.experience-directory .workbench {
  color: var(--experience-teal);
  border: 1px solid #bfd8dd;
  background: #fff;
}
.experience-directory .workbench:hover { background: var(--experience-soft); }
.experience-directory .tags span { font-size: 11px; }
.experience-directory :is(.method-card p, .internal p:not(.eyebrow)) { font-size: 13px; }
.experience-directory .usage-path p { font-size: 12px; }

/* Study tools: compact context, then visible parameters and results. */
.experience-calculator :is(.hero, .safety-hero) {
  min-height: 0;
  padding: 0;
  color: var(--experience-ink);
  background: var(--experience-soft);
  border-bottom: 1px solid var(--experience-line);
}
.experience-calculator :is(.hero-grid, .hero-bars) { display: none; }
.experience-calculator :is(.hero-content, .header-inner) {
  max-width: 1370px;
  margin: 0 auto;
  padding: 30px 28px 32px;
  text-align: left;
}
.experience-calculator :is(.hero, .safety-hero) h1 {
  color: var(--experience-ink);
  font-size: clamp(26px, 2.8vw, 37px);
  font-weight: 750;
  line-height: 1.45;
  letter-spacing: -.02em;
  margin: 8px 0 10px;
}
.experience-calculator :is(.hero, .safety-hero) .eyebrow {
  font-size: 11px;
  letter-spacing: .09em;
  color: var(--experience-teal);
  margin: 0;
}
.experience-calculator :is(.hero, .safety-hero) .hero-lead {
  margin: 0;
  max-width: 1000px;
  color: var(--experience-muted);
  font-size: 15px;
  line-height: 1.85;
  letter-spacing: 0;
}
.experience-calculator .calculator-wrap { padding-top: 24px; }
.experience-calculator .module-tabs {
  padding: 5px;
  gap: 6px;
  border-color: var(--experience-line);
  border-radius: 12px;
  box-shadow: none;
  background: #e9f0f2;
}
.experience-calculator .module-tabs button {
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: var(--experience-muted);
}
.experience-calculator .module-tabs button.selected {
  background: #fff;
  border-color: #bcd9dd;
  color: var(--experience-teal);
  box-shadow: 0 1px 5px rgb(18 52 64 / 4%);
}
.experience-calculator .module-tabs b { font-size: 16px; }
.experience-calculator .module-tabs small { font-size: 12px; }
.experience-calculator .question-strip { border-radius: 8px; background: #edf6f6; border-color: #c8e1e4; }
.experience-calculator .parameter-panel { padding: 24px; }
.experience-calculator .panel-heading h2 { font-size: 21px; }
.experience-calculator .question {
  border-radius: 10px;
  box-shadow: none;
  border-color: var(--experience-line);
}
.experience-calculator .question.active {
  background: #eaf5f4;
  border-color: #7dbfc1;
}
.experience-calculator .card { border-radius: 12px; border-color: var(--experience-line); box-shadow: var(--experience-shadow); }

/* Evidence page: preserve data density, reduce the decorative hero. */
.experience-evidence .evidence-hero {
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr);
  gap: 36px;
  min-height: 0;
  padding: 34px max(28px, calc((100vw - 1360px) / 2));
  background: var(--experience-soft);
  color: var(--experience-ink);
  border-bottom: 1px solid var(--experience-line);
}
.experience-evidence .evidence-hero-grid { display: none; }
.experience-evidence .evidence-hero h1 { margin: 8px 0 12px; font-size: clamp(29px, 3vw, 41px); line-height: 1.4; letter-spacing: -.02em; }
.experience-evidence .evidence-hero .eyebrow { color: var(--experience-teal); font-size: 11px; }
.experience-evidence .evidence-hero-lead { color: var(--experience-muted); font-size: 15px; line-height: 1.85; }
.experience-evidence .evidence-hero-actions { margin-top: 20px; }
.experience-evidence :is(.nip-tender-entry, .pdf-workbench-entry) {
  background: #fff;
  border-color: #c4dce1;
  box-shadow: none;
  border-radius: 10px;
}
.experience-evidence :is(.nip-tender-entry, .pdf-workbench-entry):hover { background: #f6fbfb; border-color: var(--experience-teal); }
.experience-evidence :is(.nip-tender-entry, .pdf-workbench-entry) strong { color: #285665; font-size: 14px; }
.experience-evidence :is(.nip-tender-entry, .pdf-workbench-entry) small { color: var(--experience-muted); }
.experience-evidence .nip-tender-entry > span { color: var(--experience-teal); }
.experience-evidence .evidence-hero-stats { background: #fff; border-color: var(--experience-line); box-shadow: none; border-radius: 12px; backdrop-filter: none; }
.experience-evidence .evidence-hero-stats div { padding: 20px; border-color: #e1ebee; }
.experience-evidence .evidence-hero-stats strong { color: var(--experience-teal); font-size: 29px; }
.experience-evidence .evidence-hero-stats span { color: var(--experience-muted); font-size: 12px; }
.experience-evidence .evidence-shell { padding-top: 24px; }
.experience-evidence-workflow :is(.workbench-hero, .review-hero) {
  min-height: 0;
  padding: 30px max(28px, calc((100vw - 1360px) / 2));
  gap: 32px;
  background: var(--experience-soft);
  color: var(--experience-ink);
  border-bottom: 1px solid var(--experience-line);
}
.experience-evidence-workflow .review-hero-grid { display: none; }
.experience-evidence-workflow :is(.workbench-hero, .review-hero) h1 { font-size: clamp(28px, 3vw, 39px); line-height: 1.45; letter-spacing: -.02em; }
.experience-evidence-workflow :is(.workbench-hero, .review-hero) .eyebrow,
.experience-evidence-workflow .review-hero > div > p,
.experience-evidence-workflow :is(.workbench-hero, .review-hero) a { color: var(--experience-teal); }
.experience-evidence-workflow :is(.workbench-hero .hero-lead, .review-hero div > span) { color: var(--experience-muted); font-size: 15px; line-height: 1.85; }
.experience-evidence-workflow :is(.local-mode-card, .review-hero aside) { background: #fff; border-color: var(--experience-line); border-radius: 12px; backdrop-filter: none; box-shadow: none; }
.experience-evidence-workflow :is(.local-mode-card, .review-hero aside) strong { color: var(--experience-ink); }
.experience-evidence-workflow :is(.local-mode-card, .review-hero aside) p { color: var(--experience-muted); font-size: 13px; }
.experience-evidence-workflow .local-mode-card > span { color: var(--experience-teal); background: #e4f3f0; }

/* Tool directory, personal account, and account entry share the same scale. */
.experience-hub main { padding-top: 30px; }
.experience-hub .calculator-hub-hero { background: #fff; padding: 30px; border-radius: 14px; box-shadow: none; gap: 35px; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); }
.experience-hub .calculator-hub-hero h1 { font-size: clamp(29px, 3vw, 41px); line-height: 1.4; }
.experience-hub .calculator-hub-hero > div > p:last-child { font-size: 15px; line-height: 1.85; }
.experience-hub .calculator-hub-tools { padding-top: 32px; }
.experience-hub .calculator-hub-heading h2 { font-size: 25px; }
.experience-hub .calculator-hub-heading p { font-size: 14px; }
.experience-hub .calculator-hub-grid > a { min-height: 0; padding: 24px; }
.experience-hub .calculator-hub-grid h3 { font-size: 21px; }
.experience-hub .calculator-hub-grid p { font-size: 14px; line-height: 1.85; }
.experience-account .account-hero { min-height: 0; background: var(--experience-soft); padding-top: 32px; padding-bottom: 32px; border-bottom: 1px solid var(--experience-line); color: var(--experience-ink); }
.experience-account .account-hero-grid { display: none; }
.experience-account .account-hero h1 { font-size: clamp(30px, 3vw, 41px); line-height: 1.4; }
.experience-account .account-hero p { color: var(--experience-teal); }
.experience-account .account-hero > div > span { color: var(--experience-muted); }
.experience-account .account-status-card { background: #fff; border-color: #c4dce1; backdrop-filter: none; }
.experience-account .account-status-card strong { color: var(--experience-ink); }
.experience-account .account-status-card small { color: var(--experience-muted); }
.experience-auth .auth-layout { max-width: 1440px; margin-inline: auto; }
.experience-auth .auth-context { background: #123440; padding-top: 40px; }
.experience-auth .auth-context-grid { display: none; }
.experience-auth .auth-context h1 { font-size: clamp(29px, 2.8vw, 39px); line-height: 1.45; letter-spacing: -.02em; }
.experience-auth .auth-form-column { padding-top: 40px; }
.experience-auth .auth-card { padding: 28px; }
.experience-auth .auth-form-heading h2 { font-size: 26px; line-height: 1.5; }
.experience-auth .auth-primary-button { font-size: 14px; font-weight: 700; }
.experience-auth .auth-back-home { padding-inline: 16px; white-space: nowrap; }

/* Mid-size layouts have a full-width navigation row; avoid three sticky bars
   covering the form on narrow devices. Scrollable tables keep their own rules. */
@media (max-width: 1100px) {
  .experience .topbar, .experience .sitebar { position: relative; }
  .experience .topbar, .experience .sitebar-inner { flex-direction: row; flex-wrap: wrap; gap: 10px 16px; }
  .experience .topbar > .brand, .experience .sitebrand { width: auto; flex: 1; order: 0; }
  .experience .topbar > .auth-header-slot { order: 1; }
  .experience .topbar > .global-nav, .experience .topbar > .header-actions,
  .experience .sitebar-actions { width: 100%; flex: 1 0 100%; order: 2; }
  .experience :is(.global-nav, .calculator-switch, .site-switcher, .platform-navigation) { display: flex; overflow-x: auto; justify-content: flex-start; width: 100%; flex-wrap: nowrap; }
  .experience :is(.global-nav, .calculator-switch, .site-switcher, .platform-navigation) > a { flex: 0 0 auto; white-space: nowrap; }
  .experience .platform-tool-subnav { position: relative; top: auto; }
  .experience .page-subnav, .experience.has-platform-tool-subnav .page-subnav { top: 0 !important; }
  .experience-evidence .evidence-hero { grid-template-columns: 1fr; gap: 22px; }
  .experience-evidence .evidence-hero-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .experience-evidence .evidence-hero-stats div { border-bottom: 0; border-right: 1px solid #e1ebee; }
  .experience-evidence .evidence-hero-stats div:last-child { border-right: 0; }
  .experience-hub .calculator-hub-hero { grid-template-columns: 1fr; gap: 22px; }
  .experience-evidence-workflow :is(.workbench-hero, .review-hero) { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 760px) {
  .experience .topbar, .experience .sitebar-inner { padding: 12px 16px; }
  .experience :is(.global-nav, .calculator-switch, .site-switcher, .platform-navigation) > a { min-height: 40px; font-size: 12px !important; padding-inline: 8px !important; }
  .experience .page-subnav { padding-inline: 16px; gap: 20px; }
  .experience-calculator :is(.hero-content, .header-inner) { padding: 24px 18px; }
  .experience-calculator :is(.hero, .safety-hero) h1 { font-size: 26px; }
  .experience-calculator :is(.hero, .safety-hero) .hero-lead { font-size: 14px; }
  .experience-calculator .parameter-panel { padding: 20px 16px; }
  /* The original 360px horizontal flex basis otherwise becomes a 360px
     vertical spacer when the old mobile rule changes flex-direction. */
  .experience-calculator .question-strip { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 0; align-items: start; gap: 6px; }
  .experience-calculator .question-strip strong { flex: none; min-width: 0; }
  .experience-calculator .question-strip em { display: inline-flex; justify-self: start; max-width: 100%; white-space: normal; border-radius: 6px; }
  .experience-calculator .module-tabs b { font-size: 14px; }
  .experience-calculator .module-tabs small { font-size: 11px; }
  .experience-evidence .evidence-hero { padding: 25px 18px; }
  .experience-evidence-workflow :is(.workbench-hero, .review-hero) { padding: 24px 18px; }
  .experience-evidence .evidence-hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .experience-evidence .evidence-hero-stats div { padding: 16px; border-bottom: 1px solid #e1ebee; }
  .experience-evidence .evidence-hero-stats div:nth-child(2n) { border-right: 0; }
  .experience-evidence .evidence-hero-stats div:nth-last-child(-n+2) { border-bottom: 0; }
  .experience-hub .calculator-hub-hero { padding: 24px 21px; }
  .experience-account .account-hero { padding: 26px 18px; }
  .experience-auth .auth-context { padding-top: 26px; }
  .experience-auth .auth-form-column { padding: 24px 18px 36px; }
  .experience-auth .auth-card { padding: 23px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .experience *, .experience *::before, .experience *::after { scroll-behavior: auto !important; transition: none !important; }
}