/* Polished visual system using the original + MGF palette. Clinical severity colours are preserved. */
:root {
  --teal: #087e80;
  --ui-accent: #087e80;
  --line: #dce7e8;
  --muted: #637487;
  --bg: #f4f7f9;
  --surface: #fff;
  --ink: #1a2b3b;
  --polish-accent: #087e80;
  color: var(--ink);
  background: var(--bg);
}
body {
  background:
    radial-gradient(ellipse at 90% 0, #cfeceb80, transparent 48%),
    radial-gradient(ellipse at 20% 70%, #d7f5f440, transparent 45%), #f4f7f9;
  background-attachment: fixed;
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: linear-gradient(115deg, transparent 30%, #ffffff70 47%, transparent 62%);
  pointer-events: none;
  z-index: -1;
}
.sidebar {
  background:
    radial-gradient(ellipse at 0 0, #1d4b50 0, transparent 60%), linear-gradient(170deg, #142938, #0e202d 80%);
  border-right: 1px solid #ffffff18;
  box-shadow: 12px 0 50px #12363b10;
  padding-top: 30px;
}
.brand {
  letter-spacing: -1.3px;
}
.brand-icon {
  background: linear-gradient(145deg, #7ed5cf, #26a6a4 52%, #087e80);
  box-shadow:
    inset 0 1px 0 #ffffffa0,
    0 5px 22px #087e8050;
  border: 1px solid #ffffff50;
  border-radius: 13px;
}
.polish-mark {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #b8d4d3;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  font-size: 11px;
  margin: 10px 0 22px 52px;
  font-weight: 600;
}
.polish-mark::before {
  content: '';
  width: 14px;
  height: 1px;
  background: #79bab5;
}
.sidebar .nav-group-toggle {
  color: #9fb9bf;
  letter-spacing: 0.12em;
  font-size: 11px;
}
.sidebar nav a {
  border: 1px solid transparent;
  border-radius: 12px;
  color: #c2ced7;
}
.sidebar nav a:hover {
  background: #ffffff0b;
  color: white;
  border-color: #ffffff16;
}
.sidebar nav a.active {
  color: white;
  background: linear-gradient(100deg, #26a6a43d, #087e8024);
  border: 1px solid #82c9c140;
  box-shadow:
    inset 3px 0 #a3ded0,
    0 4px 16px #00000015;
}
.sidebar .nav-search {
  border-radius: 12px;
  background: #ffffff08;
  border-color: #ffffff20;
}
main {
  padding-top: 30px;
}
main h1 {
  color: #1a2b3b;
  font-weight: 720;
  letter-spacing: -0.045em;
  line-height: 1.15;
}
main h2 {
  letter-spacing: -0.025em;
}
.eyebrow {
  color: #547875;
  letter-spacing: 0.14em;
}
main:has(#overview-search) h1 {
  font-size: clamp(36px, 4.2vw, 60px);
  margin: 16px 0 26px;
  background: linear-gradient(100deg, #1a2b3b 15%, #087e80 65%, #26a6a4);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
#overview-search {
  min-height: 68px;
  border-radius: 18px;
  border: 1px solid #c9dddd;
  background: linear-gradient(125deg, #fff, #ffffffa0);
  box-shadow:
    inset 0 1px 0 white,
    0 8px 32px #12363b10;
  color: #637487;
  padding: 18px 24px;
  font-size: 16px;
}
#overview-search:hover {
  border-color: #62aaa4;
  box-shadow: 0 12px 38px #087e8020;
}
.home-access {
  margin-top: 34px;
}
.home-access > h2,
.overview-section > h2 {
  font-size: 16px;
  font-weight: 650;
}
.home-access-grid {
  gap: 16px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
#main :is(a.si-card, a.card, a.pv-entry, a.atb-card, a.ref-specialty, .ph-bi-list a) {
  position: relative;
  border: 1px solid #dce7e8;
  border-radius: 18px;
  background: linear-gradient(135deg, #fff, #ffffffdc);
  box-shadow:
    inset 0 1px 0 white,
    0 5px 18px #12363b06;
  overflow: hidden;
}
#main .home-access-grid a.si-card {
  min-height: 172px;
  padding: 24px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 12px;
}
#main .home-access-grid a.si-card :is(h2, h3) {
  font-size: 17px;
  line-height: 1.25;
  margin: 0;
  color: #213944;
}
#main .home-access-grid a.si-card p {
  font-size: 14px;
  line-height: 1.5;
  margin: 6px 0 0;
  color: #637487;
}
#main .home-access-grid a.si-card svg {
  color: #087e80;
  width: 28px;
  height: 28px;
}
#main .home-access-grid .resource-favorite:nth-child(3n + 2) svg {
  color: #26a6a4;
}
#main .home-access-grid .resource-favorite:nth-child(3n) svg {
  color: #3c8e88;
}
#main :is(a.si-card, a.card, a.pv-entry, a.atb-card, a.ref-specialty)::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    260px circle at var(--shine-x, 50%) var(--shine-y, 0%),
    #48aaa322,
    transparent 75%
  );
  opacity: 0;
  pointer-events: none;
}
#main :is(.panel, .si-box, .ph-bi-card, .ref-section, .atb-output) {
  border-radius: 18px;
  box-shadow: 0 6px 22px #12363b08;
}
#main .ph-bi-card {
  border-radius: 18px;
}
#main .ph-bi-card[data-tone='neutral'] {
  background: linear-gradient(130deg, white, #f8fbfa);
}
#main .ph-bi-list a {
  padding: 14px 16px;
}
.btn {
  border-radius: 10px;
}
.btn:not(.secondary):not(.dm-danger):not(.urgent-btn) {
  background: linear-gradient(130deg, #169491, #087e80);
  border-color: #087e80;
  box-shadow:
    inset 0 1px 0 #ffffff38,
    0 3px 8px #087e8016;
}
.btn.secondary,
.history-navigation .btn {
  background: #ffffffb8;
  border-color: #dce7e8;
  color: #526b78;
}
input:not([type='range']):not([type='checkbox']):not([type='radio']),
select,
textarea {
  border-color: #d8e5e4;
  border-radius: 10px;
}
input:focus,
select:focus,
textarea:focus {
  border-color: #349a95;
}
:focus-visible {
  outline-color: #087e80;
}
.context-links {
  background: linear-gradient(110deg, #e8f4f280, #edf7f680);
  border: 1px solid #d5e7e2;
  border-radius: 14px;
}
.context-links > span {
  color: #4b6662;
}
.context-links > a {
  color: #125f57;
  border-color: #d5e7e2;
  background: #ffffffb0;
}
.catalog-toolbar {
  padding: 14px;
  background: #ffffff94;
  border: 1px solid #dce7e8;
  border-radius: 18px;
}
.catalog-area-group h2 {
  color: #27434b;
}
.overview-empty {
  border: 1px dashed #cbdcde;
  border-radius: 14px;
  background: #ffffff70;
}
#main .dm-frame {
  border-color: #d8e5e4;
  border-radius: 20px;
  box-shadow:
    0 12px 44px #12363b0a,
    inset 0 1px 0 white;
}
.dm-frame-controls {
  background: linear-gradient(115deg, #fbfdfd, #f7fbfa);
  border-color: #dce7e8;
}
.dm-frame .dm-viewport {
  background-color: #f8fbfa;
  background-image: radial-gradient(#82aaa43b 0.7px, transparent 0.7px);
  background-size: 20px 20px;
}
#main .dm-frame-controls .dm-rail .btn {
  background: #fff;
  color: #243943;
  border-color: #d8e5e4;
  box-shadow: inset 0 1px 0 white;
}
#main .dm-frame-controls .dm-rail .dm-primary {
  border-left-color: #65a39b;
}
#main .dm-frame-controls .dm-rail .dm-danger {
  border-left-color: #c9787f;
}
#main .dm-frame-controls .dm-map-selector .btn[aria-pressed='true'] {
  box-shadow: inset 0 -2px #438a81;
  border-color: #92b7b2;
  background: #f1f7f6;
}
.dm-frame .dm-scale-control input[type='range'] {
  accent-color: #15786e;
}
.dm-node {
  box-shadow:
    0 4px 12px #12363b0b,
    inset 0 1px 0 #ffffff70;
}
.dm-node.dm-active {
  outline-color: #15786e;
  box-shadow:
    0 0 0 5px #15786e29,
    0 12px 32px #12363b20;
}
.dm-edges > path:not(.dm-incoming) {
  stroke: #83a9a4;
}
.dm-context {
  border-radius: 20px;
  box-shadow: 0 24px 80px #102a3330;
}
footer {
  border-color: #dce7e8;
  color: #637487;
  background: transparent;
  font-size: 12px;
}
@media (hover: hover) and (pointer: fine) {
  #main :is(a.si-card, a.card, a.pv-entry, a.atb-card, a.ref-specialty):hover {
    transform: translateY(-4px);
    border-color: #a7c9c4;
    background: #fff;
    box-shadow:
      0 14px 32px #087e8014,
      inset 0 1px 0 white;
  }
  #main :is(a.si-card, a.card, a.pv-entry, a.atb-card, a.ref-specialty):hover::after {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: no-preference) {
  main > header,
  main > .page-heading,
  .home-access,
  .dm-frame,
  .ph-bi-grid,
  .catalog-toolbar {
    animation: prisma-enter 420ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
  }
  .home-access-grid > :nth-child(2) {
    animation-delay: 35ms;
  }
  .home-access-grid > :nth-child(3) {
    animation-delay: 70ms;
  }
  .home-access-grid > :nth-child(4) {
    animation-delay: 105ms;
  }
  .home-access-grid > * {
    animation: prisma-enter 480ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
  }
  #main :is(a.si-card, a.card, a.pv-entry, a.atb-card, a.ref-specialty),
  .sidebar nav a,
  .btn,
  #overview-search {
    transition:
      transform 200ms ease,
      box-shadow 200ms ease,
      border-color 200ms ease,
      background-color 200ms ease;
  }
  #main a::after {
    transition: opacity 220ms ease;
  }
}
@keyframes prisma-enter {
  from {
    opacity: 0;
    translate: 0 10px;
  }
  to {
    opacity: 1;
    translate: 0 0;
  }
}
@media (max-width: 1200px) {
  .home-access-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  .home-access-grid {
    gap: 10px;
  }
  #main .home-access-grid a.si-card {
    min-height: 164px;
    padding: 18px 14px;
  }
  #main .home-access-grid a.si-card :is(h2, h3) {
    font-size: 16px;
  }
  main:has(#overview-search) h1 {
    font-size: 36px;
  }
  .polish-mark {
    display: none;
  }
}
@media (max-width: 360px) {
  .home-access-grid {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  #main a {
    transform: none !important;
  }
}
#main .home-access-grid > :first-child.si-card,
#main .home-access-grid > :first-child a.si-card {
  background:
    radial-gradient(ellipse at 110% -20%, #62c7c070, transparent 65%),
    linear-gradient(135deg, #16454a, #12343a 85%);
  border-color: #468984;
  box-shadow:
    inset 0 1px 0 #d7f5f465,
    0 12px 28px #12363b25;
}
#main .home-access-grid > :first-child.si-card :is(h2, h3, svg),
#main .home-access-grid > :first-child a.si-card :is(h2, h3, svg) {
  color: #fff;
}
#main .home-access-grid > :first-child.si-card p,
#main .home-access-grid > :first-child a.si-card p {
  color: #d7e7e7;
}
#main .home-access-grid .si-icon {
  background: #e5f3f1;
  border-radius: 12px;
}
#main .home-access-grid > :first-child .si-icon {
  background: #ffffff16;
}
#main .home-access-grid a.si-card::before {
  content: '';
  position: absolute;
  height: 1px;
  inset: 0 18% auto 18%;
  background: linear-gradient(90deg, transparent, #fff, transparent);
  pointer-events: none;
}
#main .home-access-grid > :first-child.si-card h3,
#main .home-access-grid > :first-child.si-card svg,
#main .home-access-grid > :first-child a.si-card :is(h2, h3),
#main .home-access-grid > :first-child a.si-card svg {
  color: #fff;
}