:root {
  --ink: #111827;
  --muted: #667085;
  --line: #e5e7eb;
  --panel: #ffffff;
  --paper: #f7f8fa;
  --teal: #0f8f82;
  --teal-dark: #0a635b;
  --mint: #dff8f3;
  --navy: #0a1020;
  --coral: #e76f51;
  --amber: #f4a261;
  --blue: #2f6fed;
  --shadow: 0 18px 55px rgba(15, 23, 42, 0.12);
}

/* 2026-06-15: 양방 처방 코드 가이드 dark navy board */
.prescription-guide-page {
  gap: 18px;
  color: #edf6ff;
}

.prescription-guide-page .pg-head {
  align-items: flex-start;
  border: 1px solid rgba(127, 154, 184, .28);
  border-radius: 8px;
  background:
    radial-gradient(circle at top right, rgba(20, 184, 173, .18), transparent 34%),
    linear-gradient(145deg, rgba(13, 31, 50, .96), rgba(6, 18, 31, .98));
  padding: 26px;
}

.prescription-guide-page .pg-head .page-title {
  width: 100%;
}

.pg-kicker {
  display: inline-flex;
  margin-bottom: 10px;
  color: #5eead4;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.prescription-guide-page .page-title h1 {
  margin: 0;
  color: #f8fbff;
  font-size: clamp(30px, 3vw, 42px);
  letter-spacing: 0;
}

.prescription-guide-page .page-title p {
  max-width: 900px;
  color: #b9cdea;
  line-height: 1.7;
}

.pg-api-card {
  min-width: 260px;
  border: 1px solid rgba(20, 184, 173, .42);
  border-radius: 8px;
  background: rgba(4, 22, 35, .78);
  padding: 18px;
  display: grid;
  align-content: center;
  gap: 6px;
}

.pg-api-card span,
.pg-panel-title span {
  color: #5eead4;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
}

.pg-api-card b {
  color: #ffffff;
  font-size: 18px;
}

.pg-api-card small {
  color: #adc2de;
  line-height: 1.5;
}

.pg-kpi-row,
.pg-workflow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.pg-kpi-row article,
.pg-workflow article,
.pg-tools,
.pg-card,
.pg-info-card,
.pg-main-panel,
.pg-side-panel {
  border: 1px solid rgba(72, 108, 148, .42);
  border-radius: 8px;
  background: rgba(7, 20, 34, .72);
}

.pg-kpi-row article {
  padding: 16px 18px;
}

.pg-kpi-row span,
.pg-result-line span,
.pg-workflow span {
  color: #adc2de;
}

.pg-kpi-row b {
  display: block;
  margin: 6px 0 3px;
  color: #f8d58c;
  font-size: 30px;
  line-height: 1;
}

.pg-kpi-row small {
  color: #89a4c2;
}

.pg-tools {
  display: grid;
  gap: 12px;
  padding: 14px;
  background: rgba(12, 27, 44, .72);
}

.pg-search {
  max-width: none;
}

.pg-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pg-filter button {
  min-height: 42px;
  border: 1px solid rgba(127, 154, 184, .34);
  border-radius: 8px;
  background: rgba(5, 16, 28, .88);
  color: #f4f9ff;
  padding: 0 14px;
  font-weight: 900;
  cursor: pointer;
}

.pg-filter button.active,
.pg-filter button:hover {
  border-color: rgba(20, 184, 173, .66);
  background: linear-gradient(135deg, rgba(20, 184, 173, .92), rgba(13, 116, 118, .96));
  color: #ffffff;
}

.pg-workflow article {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
}

.pg-workflow b {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: rgba(20, 184, 173, .18);
  color: #67f5e8;
  font-size: 14px;
}

.pg-result-line {
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: #edf6ff;
  font-weight: 900;
}

.pg-result-line b {
  color: #5eead4;
  font-size: 22px;
}

.pg-list {
  display: grid;
  gap: 14px;
}

.pg-card {
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(13, 31, 50, .96), rgba(6, 18, 31, .98)),
    #081827;
}

.pg-card[hidden] {
  display: none !important;
}

.pg-card > summary.pg-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 24px;
  cursor: pointer;
  list-style: none;
  border-bottom: 1px solid rgba(72, 108, 148, .32);
  background: linear-gradient(135deg, rgba(18, 44, 70, .82), rgba(7, 22, 38, .9));
}

.pg-card > summary.pg-card-head::-webkit-details-marker {
  display: none;
}

.pg-card > summary.pg-card-head::after {
  content: "열기";
  align-self: center;
  border: 1px solid rgba(20, 184, 173, .4);
  border-radius: 999px;
  background: rgba(4, 22, 35, .85);
  color: #5eead4;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.pg-card[open] > summary.pg-card-head::after {
  content: "접기";
  background: rgba(20, 184, 173, .18);
}

.pg-category {
  display: inline-flex;
  margin-bottom: 8px;
  color: #5eead4;
  font-size: 13px;
  font-weight: 900;
}

.pg-card-head h2 {
  margin: 0;
  color: #f8fbff;
  font-size: 24px;
  line-height: 1.25;
  letter-spacing: 0;
}

.pg-card-head p {
  margin: 8px 0 0;
  color: #b5c9e4;
  line-height: 1.6;
}

.pg-card-head strong {
  min-width: 104px;
  border: 1px solid rgba(20, 184, 173, .36);
  border-radius: 10px;
  background: rgba(6, 43, 58, .72);
  color: #f8d58c;
  padding: 12px 14px;
  text-align: center;
  font-size: 26px;
  line-height: 1;
}

.pg-card-head strong small {
  display: block;
  margin-top: 6px;
  color: #d8e8fb;
  font-size: 12px;
}

.pg-code-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.pg-code-chip,
.pg-code-more,
.pg-code {
  display: inline-flex;
  justify-content: center;
  border: 1px solid rgba(20, 184, 173, .35);
  border-radius: 999px;
  background: rgba(5, 31, 45, .9);
  color: #67f5e8;
  padding: 5px 10px;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.1;
}

.pg-code-more {
  color: #f8d58c;
  border-color: rgba(248, 213, 140, .35);
}

.pg-card-body {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 12px;
  padding: 18px 20px 20px;
}

.pg-main-panel,
.pg-side-panel {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 16px;
}

.pg-panel-title h3,
.pg-info-card h3 {
  margin: 4px 0 0;
  color: #f8fbff;
  font-size: 18px;
  letter-spacing: 0;
}

.pg-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(72, 108, 148, .38);
  border-radius: 8px;
}

.pg-code-table {
  width: 100%;
  min-width: 560px;
  border-collapse: separate;
  border-spacing: 0;
}

.pg-code-table th,
.pg-code-table td {
  border-bottom: 1px solid rgba(72, 108, 148, .28);
  padding: 12px 14px;
  text-align: left;
  color: #d9e8fb;
  line-height: 1.5;
}

.pg-code-table th {
  background: rgba(3, 13, 24, .96);
  color: #8fd7ff;
  font-size: 13px;
  font-weight: 900;
}

.pg-code-table tbody tr:last-child td {
  border-bottom: 0;
}

.pg-code-table td:nth-child(2) {
  color: #f8fbff;
  font-weight: 900;
}

.pg-code-table td:nth-child(3) {
  color: #f8d58c;
  font-weight: 900;
}

.pg-info-card {
  padding: 14px 16px;
}

.pg-info-card p,
.pg-info-card li {
  color: #d7e7f9;
  line-height: 1.65;
}

.pg-info-card p,
.pg-info-card ul {
  margin: 8px 0 0;
}

.pg-info-card ul {
  padding-left: 19px;
}

.pg-info-card.good {
  border-color: rgba(45, 221, 206, .42);
  background: rgba(20, 184, 173, .1);
}

.pg-info-card.warn {
  border-color: rgba(248, 213, 140, .44);
  background: rgba(126, 82, 17, .15);
}

.pg-info-card.danger {
  border-color: rgba(248, 113, 113, .42);
  background: rgba(127, 29, 29, .18);
}

.pg-info-card.tip {
  border-color: rgba(96, 165, 250, .38);
  background: rgba(30, 64, 175, .13);
}

.pg-no-result,
.pg-empty-inline {
  border: 1px dashed rgba(127, 154, 184, .42);
  border-radius: 8px;
  background: rgba(7, 20, 34, .72);
  color: #adc2de;
  padding: 24px;
  text-align: center;
}

.pg-no-result b {
  display: block;
  margin: 8px 0 4px;
  color: #f8fbff;
}

@media (max-width: 1100px) {
  .pg-kpi-row,
  .pg-workflow,
  .pg-card-body {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .prescription-guide-page .pg-head,
  .pg-card > summary.pg-card-head,
  .pg-card-body,
  .pg-kpi-row,
  .pg-workflow {
    grid-template-columns: 1fr;
  }

  .pg-card > summary.pg-card-head {
    display: grid;
  }

  .pg-card-head strong,
  .pg-api-card {
    min-width: 0;
  }
}

.hospital-hr-guide {
  --hr-navy: #07162f;
  --hr-navy-2: #0d2d55;
  --hr-blue: #1e6fa8;
  --hr-line: rgba(103, 151, 194, .34);
  color: #e8f2ff;
  display: grid;
  gap: 24px;
}

.hospital-hr-hero {
  align-items: center;
  background: linear-gradient(135deg, var(--hr-navy), var(--hr-blue));
  border: 1px solid rgba(124, 184, 236, .24);
  border-radius: 8px;
  box-shadow: 0 18px 38px rgba(0, 0, 0, .24);
  color: #fff;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 28px 32px;
}

.hospital-hr-hero span { color: #b9dcff; display: block; font-size: 12px; font-weight: 900; letter-spacing: 0; text-transform: uppercase; }
.hospital-hr-hero h1 { color: #fff; font-size: 30px; line-height: 1.25; margin: 7px 0 8px; }
.hospital-hr-hero p { color: #dcefff; font-size: 14px; line-height: 1.7; margin: 0; }
.hospital-hr-hero > b { border: 1px solid rgba(255,255,255,.38); border-radius: 6px; color: #f8fbff; font-size: 12px; padding: 10px 12px; white-space: nowrap; }

.hospital-hr-kpis { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.hospital-hr-kpis article { background: linear-gradient(180deg, rgba(14, 40, 71, .96), rgba(9, 24, 44, .96)); border: 1px solid var(--hr-line); border-left: 4px solid #2b8fd3; border-radius: 8px; box-shadow: 0 14px 30px rgba(0,0,0,.23); min-height: 118px; padding: 22px 20px; text-align: center; }
.hospital-hr-kpis span, .hospital-hr-kpis small { color: #a9c2db; display: block; font-size: 12px; font-weight: 800; }
.hospital-hr-kpis b { color: #ffffff; display: block; font-size: 22px; line-height: 1.2; margin: 8px 0; }

.hospital-hr-jump { background: rgba(7, 21, 39, .9); border: 1px solid rgba(83, 134, 180, .42); border-radius: 8px; display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); padding: 10px; box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 14px 28px rgba(0,0,0,.18); }
.hospital-hr-guide .hospital-hr-jump button { background: rgba(13, 37, 67, .92); border: 1px solid rgba(101, 151, 194, .34); border-radius: 6px; color: #dcecff; cursor: pointer; display: grid; font: inherit; gap: 4px; min-height: 64px; padding: 10px 12px; text-align: left; }
.hospital-hr-guide .hospital-hr-jump button:hover, .hospital-hr-guide .hospital-hr-jump button.active { background: linear-gradient(180deg, rgba(21, 76, 120, .98), rgba(13, 49, 86, .98)); border-color: #4fb3ff; box-shadow: inset 0 0 0 1px rgba(79, 179, 255, .48); }
.hospital-hr-guide .hospital-hr-jump button:not(.active):not(:hover) { background-color: rgba(13, 37, 67, .92) !important; background-image: none !important; }
.hospital-hr-guide .hospital-hr-jump button.active,
.hospital-hr-guide .hospital-hr-jump button:hover { background-color: rgba(21, 76, 120, .98) !important; background-image: linear-gradient(180deg, rgba(21, 76, 120, .98), rgba(13, 49, 86, .98)) !important; }
.hospital-hr-jump button.active b { color: #ffffff; }
.hospital-hr-jump b { font-size: 13px; }
.hospital-hr-jump span { color: #9eb9d4; font-size: 12px; line-height: 1.35; }

.hospital-hr-section { display: none; gap: 14px; }
.hospital-hr-section.active { display: grid; }
.hospital-hr-section h2 { color: #eaf5ff; font-size: 25px; line-height: 1.25; margin: 10px 0 2px; }
.hospital-hr-feature-grid, .hospital-hr-risk-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hospital-hr-card, .hospital-hr-feature-grid article, .hospital-hr-risk-grid article, .hospital-hr-faq details { background: rgba(10, 28, 52, .96); border: 1px solid var(--hr-line); border-left: 4px solid #2b8fd3; border-radius: 8px; box-shadow: 0 14px 30px rgba(0,0,0,.2); padding: 20px 22px; }
.hospital-hr-card h3, .hospital-hr-feature-grid h3, .hospital-hr-risk-grid h3 { color: #ffffff; font-size: 16px; margin: 0 0 12px; }
.hospital-hr-feature-grid ul { color: #c9d9e8; font-size: 14px; line-height: 1.85; margin: 0; padding-left: 20px; }

.hospital-hr-table-wrap { border: 1px solid var(--hr-line); border-radius: 8px; overflow: auto; }
.hospital-hr-table { border-collapse: collapse; min-width: 860px; width: 100%; }
.hospital-hr-table th { background: #123c67; color: #fff; font-size: 13px; padding: 11px 12px; text-align: left; white-space: nowrap; }
.hospital-hr-table td { background: rgba(15, 38, 68, .86); border-bottom: 1px solid rgba(123, 163, 198, .22); color: #d8e7f5; font-size: 13px; line-height: 1.65; padding: 10px 12px; vertical-align: top; }
.hospital-hr-table tr:nth-child(even) td { background: rgba(11, 31, 56, .96); }

.hospital-hr-timeline { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.hospital-hr-timeline article { background: rgba(10, 28, 52, .96); border: 1px solid var(--hr-line); border-radius: 8px; min-height: 124px; padding: 16px; }
.hospital-hr-timeline b { align-items: center; background: #1c6da8; border-radius: 999px; color: #fff; display: inline-flex; font-size: 13px; height: 30px; padding: 0 12px; }
.hospital-hr-timeline p { color: #c9d9e8; font-size: 13px; line-height: 1.7; margin: 12px 0 0; }

.hospital-hr-month-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hospital-hr-month-card {
  background: rgba(10, 28, 52, .96);
  border: 1px solid var(--hr-line);
  border-left: 4px solid #2b8fd3;
  border-radius: 8px;
  box-shadow: 0 14px 30px rgba(0,0,0,.18);
  min-height: 150px;
  padding: 18px 20px;
}

.hospital-hr-month-card.current {
  background: rgba(55, 20, 27, .72);
  border-color: rgba(255, 118, 118, .42);
  border-left-color: #ff5656;
}

.hospital-hr-month-card h3 {
  align-items: center;
  color: #ffffff;
  display: flex;
  font-size: 16px;
  gap: 8px;
  margin: 0 0 12px;
}

.hospital-hr-month-card h3 span {
  border: 1px solid rgba(255, 118, 118, .62);
  border-radius: 999px;
  color: #ffb3b3;
  font-size: 11px;
  padding: 3px 8px;
}

.hospital-hr-month-card ul {
  color: #c9d9e8;
  font-size: 13px;
  line-height: 1.8;
  margin: 0;
  padding-left: 18px;
}

.hospital-hr-risk-grid article b { color: #68bfff; display: block; font-size: 12px; margin-bottom: 7px; }
.hospital-hr-risk-grid article.high { border-left-color: #d83a3a; }
.hospital-hr-risk-grid p, .hospital-hr-faq p { color: #c9d9e8; font-size: 14px; line-height: 1.75; margin: 0; }
.hospital-hr-alert-note,
.hospital-hr-tip-note {
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.7;
  margin: 0;
  padding: 13px 15px;
}
.hospital-hr-alert-note {
  background: rgba(157, 40, 40, .18);
  border: 1px solid rgba(255, 114, 114, .54);
  color: #ffd5d5;
}
.hospital-hr-tip-note {
  background: rgba(35, 94, 145, .22);
  border: 1px solid rgba(99, 176, 241, .48);
  color: #dcefff;
}
.hospital-hr-alert-note b,
.hospital-hr-tip-note b {
  color: #ffffff;
}
.hospital-hr-penalty-block {
  display: grid;
  gap: 10px;
}
.hospital-hr-penalty-block h3 {
  color: #ffffff;
  font-size: 18px;
  margin: 8px 0 0;
}
.hospital-hr-penalty-table td:nth-child(3) b {
  color: #ff8b7e;
}
.hospital-hr-faq { display: grid; gap: 10px; }
.hospital-hr-faq summary { color: #ffffff; cursor: pointer; font-size: 15px; font-weight: 900; }
.hospital-hr-faq details p { margin-top: 12px; }
.hospital-hr-faq-answer { color: #c9d9e8; font-size: 14px; line-height: 1.8; margin-top: 12px; }
.hospital-hr-faq-answer b { color: #ffffff; }
.hospital-hr-faq-table { border: 1px solid rgba(123, 163, 198, .28); border-radius: 8px; overflow: auto; }
.hospital-hr-faq-table table { border-collapse: collapse; min-width: 720px; width: 100%; }
.hospital-hr-faq-table th { background: #123c67; color: #ffffff; font-size: 13px; padding: 10px 12px; text-align: left; }
.hospital-hr-faq-table td { background: rgba(15, 38, 68, .86); border-bottom: 1px solid rgba(123, 163, 198, .22); color: #d8e7f5; font-size: 13px; padding: 10px 12px; }
.hospital-hr-faq-table tr:nth-child(even) td { background: rgba(11, 31, 56, .96); }

.hospital-hr-source-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.hospital-hr-source-grid a { background: rgba(13, 37, 67, .92); border: 1px solid rgba(101, 151, 194, .34); border-radius: 8px; color: #ffffff; display: grid; gap: 5px; padding: 14px 16px; text-decoration: none; }
.hospital-hr-source-grid span { color: #9eb9d4; font-size: 12px; }
.hospital-hr-disclaimer { background: rgba(130, 101, 20, .18); border: 1px solid rgba(236, 197, 82, .42); border-radius: 8px; color: #ffe6a3; font-size: 13px; line-height: 1.7; margin: 0; padding: 14px 16px; }

@media (max-width: 980px) {
  .hospital-hr-hero { grid-template-columns: auto minmax(0, 1fr); }
  .hospital-hr-hero > b { grid-column: 1 / -1; width: max-content; }
  .hospital-hr-kpis, .hospital-hr-jump { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hospital-hr-timeline, .hospital-hr-month-grid, .hospital-hr-source-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .hospital-hr-guide { gap: 18px; }
  .hospital-hr-hero { grid-template-columns: 1fr; padding: 22px 20px; }
  .hospital-hr-hero h1 { font-size: 24px; }
  .hospital-hr-kpis, .hospital-hr-jump, .hospital-hr-feature-grid, .hospital-hr-risk-grid, .hospital-hr-timeline, .hospital-hr-month-grid, .hospital-hr-source-grid { grid-template-columns: 1fr; }
  .hospital-hr-section h2 { font-size: 22px; }
  .hospital-hr-card, .hospital-hr-feature-grid article, .hospital-hr-risk-grid article, .hospital-hr-faq details { padding: 16px; }
}

.workspace:has(.hr-app) {
  padding: 0;
}

.hr-app {
  display: grid;
  grid-template-columns: 238px minmax(0, 1fr);
  gap: 20px;
  min-height: calc(100vh - 61px);
  background: #f7fbfa;
}

.hr-controls {
  border-right: 1px solid #d6ebe8;
  background: linear-gradient(180deg, #f1fffc 0%, #ffffff 54%);
  padding: 18px 15px;
}

.hr-control-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  color: #08776f;
}

.hr-control-title svg {
  width: 17px;
  height: 17px;
}

.hr-control-title strong {
  display: block;
  color: #08263b;
  font-size: 16px;
}

.hr-control-title span {
  display: block;
  margin-top: 4px;
  color: #607483;
  font-size: 12px;
}

.hr-controls label {
  display: grid;
  gap: 7px;
  margin: 13px 0;
  color: #24384a;
  font-size: 13px;
  font-weight: 800;
}

.hr-controls select,
.hr-controls input[type="file"] {
  width: 100%;
  min-height: 39px;
  border: 1px solid #c9dfdc;
  border-radius: 7px;
  background: #ffffff;
  color: #132638;
  padding: 8px 10px;
  font: inherit;
}

.hr-file {
  border: 1px dashed #b9ded8;
  border-radius: 8px;
  background: #f6fffd;
  padding: 10px;
}

.hr-file.disabled {
  opacity: .55;
}

.hr-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 16px 0;
}

.hr-run {
  width: 100%;
  margin-top: 6px;
}

.hr-side-note {
  border-radius: 8px;
  background: #e9f8f5;
  color: #486777;
  font-size: 12px;
  line-height: 1.6;
  margin: 14px 0 0;
  padding: 12px;
}

.hr-stage {
  min-width: 0;
  padding: 18px 18px 40px 0;
}

.hr-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-radius: 8px;
  background: linear-gradient(120deg, #08746d, #0aa193);
  color: #ffffff;
  margin-bottom: 15px;
  padding: 24px 26px;
}

.hr-header span {
  color: #c9f5ed;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.hr-header h1 {
  margin: 7px 0;
  font-size: 25px;
  line-height: 1.25;
}

.hr-header p {
  margin: 0;
  color: #e9fffb;
  font-size: 13px;
  font-weight: 700;
}

.hr-header b {
  border: 1px solid rgba(255, 255, 255, .42);
  padding: 11px 14px;
  font-size: 12px;
}

.hr-success {
  border-left: 4px solid #099688;
  border-radius: 7px;
  background: #e9f8f5;
  color: #075e58;
  font-weight: 800;
  margin-bottom: 14px;
  padding: 11px 13px;
}

.hr-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 15px;
}

.hr-kpis article {
  border: 1px solid #d6e8e5;
  border-left: 4px solid #0f9a8c;
  border-radius: 8px;
  background: #ffffff;
  padding: 15px;
  box-shadow: 0 10px 26px rgba(8, 67, 71, .06);
}

.hr-kpis article.night {
  border-left-color: #5b5bd6;
}

.hr-kpis article.annual {
  border-left-color: #f59e0b;
}

.hr-kpis article.sick {
  border-left-color: #ef4444;
}

.hr-kpis span {
  display: block;
  color: #5f7584;
  font-size: 12px;
  font-weight: 800;
}

.hr-kpis b {
  display: block;
  margin: 8px 0 4px;
  color: #08263b;
  font-size: 25px;
  line-height: 1;
}

.hr-kpis small {
  color: #78909c;
  font-size: 12px;
}

.hr-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid #cfe5e2;
  margin-bottom: 17px;
  overflow-x: auto;
}

.hr-tabs button {
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #53697a;
  cursor: pointer;
  font-weight: 900;
  min-height: 42px;
  padding: 0 18px;
  white-space: nowrap;
}

.hr-tabs button.active {
  border-bottom-color: #078d83;
  color: #078d83;
}

.hr-panel {
  border: 1px solid #d2e7e4;
  border-radius: 8px;
  background: #ffffff;
  margin-bottom: 14px;
  padding: 18px;
  box-shadow: 0 10px 28px rgba(8, 67, 71, .05);
}

.hr-panel h2,
.hr-panel h3 {
  margin: 0 0 14px;
  color: #08263b;
}

.hr-panel h2 {
  font-size: 18px;
}

.hr-panel h3 {
  font-size: 15px;
}

.hr-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.hr-section-head h2 {
  margin: 0;
}

.hr-section-head span,
.hr-section-head select {
  border: 1px solid #cfe5e2;
  border-radius: 999px;
  background: #f6fffd;
  color: #08776f;
  font-weight: 900;
  padding: 8px 12px;
}

.hr-table-wrap {
  overflow-x: auto;
}

.hr-table,
.hr-schedule {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
  color: #172a3a;
  font-size: 12px;
}

.hr-schedule th,
.hr-schedule td,
.hr-table th,
.hr-table td {
  border: 1px solid #e1eeec;
  padding: 8px 7px;
  text-align: center;
  white-space: nowrap;
}

.hr-schedule th,
.hr-table thead th {
  background: #08746d;
  color: #ffffff;
  font-weight: 900;
}

.hr-schedule th small {
  display: block;
  color: rgba(255, 255, 255, .72);
  font-size: 10px;
}

.hr-schedule th.sat {
  color: #bbf7ff;
}

.hr-schedule th.sun {
  color: #ffe0e0;
}

.hr-schedule tbody tr:nth-child(even) td,
.hr-table tbody tr:nth-child(even) td,
.hr-table tbody tr:nth-child(even) th {
  background: #f8fcfb;
}

.hr-table tbody th {
  color: #08263b;
  text-align: left;
}

.hr-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 26px;
  border-radius: 999px;
  background: #0f9a8c;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  padding: 5px 8px;
}

.hr-badge.night {
  background: #5b5bd6;
}

.hr-badge.off,
.hr-badge.blank {
  background: #94a3b8;
}

.hr-badge.annual {
  background: #f59e0b;
}

.hr-badge.halfam,
.hr-badge.halfpm {
  background: #14b8a6;
}

.hr-badge.sick {
  background: #ef4444;
}

.hr-badge.holiday {
  background: #f97316;
}

.hr-daily {
  margin-top: 18px;
}

.hr-stack-chart {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(24px, 1fr));
  gap: 5px;
  min-height: 136px;
  align-items: end;
  border: 1px solid #e1eeec;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fcfb 100%);
  padding: 14px 10px 8px;
}

.hr-stack-day {
  display: grid;
  gap: 5px;
  justify-items: center;
}

.hr-stack-bars {
  display: flex;
  align-items: end;
  gap: 2px;
  height: 98px;
}

.hr-stack-bars i,
.hr-chart-legend i {
  display: block;
  width: 5px;
  border-radius: 5px 5px 0 0;
}

.hr-stack-day span {
  color: #6c8190;
  font-size: 10px;
  font-weight: 800;
}

.hr-stack-bars .work,
.hr-chart-legend .work {
  background: #0f9a8c;
}

.hr-stack-bars .night,
.hr-chart-legend .night {
  background: #5b5bd6;
}

.hr-stack-bars .leave,
.hr-chart-legend .leave {
  background: #f59e0b;
}

.hr-stack-bars .off,
.hr-chart-legend .off {
  background: #94a3b8;
}

.hr-stack-bars .sick,
.hr-chart-legend .sick {
  background: #ef4444;
}

.hr-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 13px;
  margin-top: 10px;
  color: #5f7584;
  font-size: 12px;
  font-weight: 800;
}

.hr-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.hr-chart-legend i {
  height: 11px;
  width: 11px;
  border-radius: 3px;
}

.hr-grid {
  display: grid;
  gap: 14px;
}

.hr-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hr-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hr-donut-row {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  align-items: center;
  gap: 20px;
}

.hr-donut {
  display: grid;
  place-items: center;
  width: 170px;
  aspect-ratio: 1;
  border-radius: 50%;
  position: relative;
}

.hr-donut::after {
  content: "";
  position: absolute;
  inset: 48px;
  border-radius: 50%;
  background: #ffffff;
}

.hr-donut b,
.hr-donut span {
  position: relative;
  z-index: 1;
}

.hr-donut b {
  color: #08263b;
  font-size: 24px;
}

.hr-donut span {
  color: #6a8090;
  font-size: 12px;
  font-weight: 800;
  margin-top: 34px;
}

.hr-donut-list {
  display: grid;
  gap: 10px;
}

.hr-donut-list div {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  align-items: center;
  gap: 9px;
  color: #42586b;
  font-size: 13px;
}

.hr-donut-list i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
}

.hr-dept-bars,
.hr-annual-bars,
.hr-night-bars {
  display: grid;
  gap: 12px;
}

.hr-dept-bars div,
.hr-annual-bars div,
.hr-night-bars div {
  display: grid;
  gap: 6px;
}

.hr-dept-bars strong,
.hr-annual-bars b,
.hr-night-bars b {
  color: #10293b;
  font-size: 13px;
}

.hr-dept-bars span {
  display: block;
  min-width: 42px;
  border-radius: 999px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  padding: 5px 9px;
}

.hr-dept-bars .work {
  background: #0f9a8c;
}

.hr-dept-bars .night,
.hr-night-bars i {
  background: #5b5bd6;
}

.hr-dept-bars .annual {
  background: #f59e0b;
}

.hr-annual-bars div {
  grid-template-columns: 86px 1fr 86px;
  align-items: center;
}

.hr-annual-bars span {
  display: flex;
  min-height: 14px;
  overflow: hidden;
  border-radius: 999px;
  background: #edf5f4;
}

.hr-annual-bars i {
  display: block;
}

.hr-annual-bars .used {
  background: #f59e0b;
}

.hr-annual-bars .remain {
  background: #fde68a;
}

.hr-annual-bars em {
  color: #5f7584;
  font-style: normal;
  font-size: 12px;
  text-align: right;
}

.hr-gauge {
  display: grid;
  place-items: center;
  width: min(250px, 100%);
  aspect-ratio: 1;
  border-radius: 50%;
  margin: 4px auto;
  background: conic-gradient(#0f9a8c calc(var(--rate) * 1%), #e4f1ef 0);
  position: relative;
}

.hr-gauge::after {
  content: "";
  position: absolute;
  inset: 40px;
  border-radius: 50%;
  background: #ffffff;
}

.hr-gauge b,
.hr-gauge span {
  position: relative;
  z-index: 1;
}

.hr-gauge b {
  color: #08263b;
  font-size: 34px;
}

.hr-gauge span {
  color: #657b8b;
  font-size: 12px;
  font-weight: 800;
  margin-top: 50px;
}

.hr-night-bars div {
  grid-template-columns: 86px 1fr 44px 80px;
  align-items: center;
}

.hr-night-bars i {
  display: block;
  min-height: 12px;
  border-radius: 999px;
}

.hr-night-bars span,
.hr-night-bars small {
  color: #637888;
  font-size: 12px;
}

.hr-employee-detail {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.hr-employee-detail article {
  border: 1px solid #d7e9e6;
  border-left: 4px solid #0f9a8c;
  border-radius: 8px;
  background: #fbfffe;
  padding: 14px;
}

.hr-employee-detail p {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 7px 0;
  color: #42586a;
}

.hr-employee-detail b {
  color: #0d2a3d;
}

.hr-table-wrap.compact .hr-schedule {
  min-width: 720px;
}

.hr-alerts {
  display: grid;
  gap: 10px;
}

.hr-alert {
  border-left: 4px solid #f59e0b;
  border-radius: 8px;
  background: #fff7ed;
  color: #7c4a03;
  font-weight: 800;
  padding: 12px 14px;
}

.hr-alert.info {
  border-left-color: #0f9a8c;
  background: #e9f8f5;
  color: #075e58;
}

.hr-alert.success {
  border-left-color: #22c55e;
  background: #ecfdf5;
  color: #166534;
}

.hr-mini-row {
  display: grid;
  grid-template-columns: 72px 1fr 44px;
  align-items: center;
  gap: 8px;
  margin: 9px 0;
  font-size: 12px;
}

.hr-mini-row i {
  display: block;
  min-height: 11px;
  border-radius: 999px;
  background: #0f9a8c;
}

.hr-scatter {
  height: 220px;
  border: 1px solid #e1eeec;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f5fbfa);
  position: relative;
}

.hr-scatter i {
  position: absolute;
  display: block;
  border-radius: 50%;
  background: rgba(15, 154, 140, .65);
  border: 2px solid #ffffff;
  box-shadow: 0 4px 12px rgba(8, 67, 71, .18);
}

.hr-heat {
  display: grid;
  gap: 8px;
}

.hr-heat div {
  display: grid;
  grid-template-columns: 70px repeat(4, 1fr);
  align-items: center;
  gap: 6px;
}

.hr-heat b {
  color: #24384a;
  font-size: 12px;
}

.hr-heat i {
  display: block;
  min-height: 18px;
  border-radius: 5px;
  background: #078d83;
}

.hr-report-preview {
  max-height: 330px;
  overflow: auto;
  border: 1px solid #d6e8e5;
  border-radius: 8px;
  background: #f8fcfb;
  color: #132638;
  font-family: "Malgun Gothic", Arial, sans-serif;
  font-size: 13px;
  line-height: 1.7;
  margin: 0;
  padding: 14px;
  white-space: pre-wrap;
}

.hr-empty {
  color: #647888;
  font-weight: 800;
}

.hm-board {
  display: grid;
  gap: 16px;
  color: #142838;
}

.hm-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-radius: 10px;
  background: linear-gradient(120deg, #08746d, #0aa193);
  color: #ffffff;
  padding: 26px 28px;
}

.hm-hero span {
  color: #c8f5ee;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
}

.hm-hero h1 {
  margin: 8px 0;
  font-size: 28px;
  line-height: 1.2;
}

.hm-hero p {
  max-width: 720px;
  margin: 0;
  color: #e7fffb;
  font-size: 14px;
  line-height: 1.6;
}

.hm-hero a {
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, .48);
  border-radius: 8px;
  color: #ffffff;
  font-weight: 900;
  padding: 12px 15px;
  text-decoration: none;
}

.hm-notice {
  display: flex;
  gap: 12px;
  border: 1px solid #cbe6e2;
  border-left: 4px solid #0f9a8c;
  border-radius: 8px;
  background: #effaf8;
  padding: 15px 16px;
}

.hm-notice svg {
  flex: 0 0 auto;
  color: #08776f;
  margin-top: 3px;
}

.hm-notice strong {
  color: #083044;
}

.hm-notice p {
  margin: 5px 0 0;
  color: #4f6876;
  font-size: 13px;
  line-height: 1.65;
}

.hm-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.hm-toolbar label {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 46px;
  border: 1px solid #cfe4e1;
  border-radius: 8px;
  background: #ffffff;
  color: #708493;
  padding: 0 14px;
}

.hm-toolbar input {
  width: 100%;
  border: 0;
  outline: 0;
  color: #10293b;
  font: inherit;
}

.hm-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}

.hm-filter button {
  border: 1px solid #b9dfd9;
  border-radius: 999px;
  background: #ffffff;
  color: #08776f;
  cursor: pointer;
  font-weight: 900;
  min-height: 36px;
  padding: 0 13px;
}

.hm-filter button.active {
  background: #078d83;
  color: #ffffff;
}

.hm-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.hm-summary article {
  border: 1px solid #d3e8e5;
  border-radius: 8px;
  background: #ffffff;
  padding: 17px 18px;
  box-shadow: 0 10px 26px rgba(8, 67, 71, .06);
}

.hm-summary b {
  display: block;
  color: #078d83;
  font-size: 28px;
  line-height: 1;
}

.hm-summary span {
  display: block;
  margin-top: 7px;
  color: #5f7584;
  font-size: 13px;
  font-weight: 900;
}

.hm-table-wrap {
  overflow-x: auto;
  border: 1px solid #d2e7e4;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(8, 67, 71, .05);
}

.hm-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
  font-size: 13px;
}

.hm-table th,
.hm-table td {
  border-bottom: 1px solid #e2eeec;
  padding: 13px 14px;
  text-align: left;
  vertical-align: top;
}

.hm-table thead th {
  background: #08746d;
  color: #ffffff;
  font-size: 12px;
  white-space: nowrap;
}

.hm-table tbody th {
  color: #08263b;
  font-size: 14px;
}

.hm-table tbody tr:nth-child(even) td,
.hm-table tbody tr:nth-child(even) th {
  background: #f8fcfb;
}

.hm-code {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  border-radius: 999px;
  background: #e8f8f5;
  color: #08776f;
  font-size: 12px;
  font-weight: 900;
  padding: 5px 10px;
  white-space: nowrap;
}

.hm-code.pending {
  background: #fff7ed;
  color: #9a4f05;
}

.hm-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.hm-cards article {
  border: 1px solid #d2e7e4;
  border-radius: 8px;
  background: #ffffff;
  padding: 17px;
}

.hm-cards span {
  display: inline-flex;
  border-radius: 999px;
  background: #e8f8f5;
  color: #08776f;
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 10px;
  padding: 5px 9px;
}

.hm-cards h3 {
  margin: 0 0 8px;
  color: #092a3d;
  font-size: 16px;
}

.hm-cards p {
  color: #496372;
  font-size: 13px;
  line-height: 1.6;
  margin: 0 0 10px;
}

.hm-cards small {
  color: #078d83;
  font-weight: 900;
}

@media (max-width: 980px) {
  .admin-hero,
  .admin-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-kpis,
  .admin-settings-grid,
  .admin-permission-grid,
  .admin-board-list,
  .admin-banner-grid,
  .admin-inline-form {
    grid-template-columns: 1fr;
  }

  .hr-app {
    grid-template-columns: 1fr;
  }

  .hr-controls {
    border-right: 0;
    border-bottom: 1px solid #d6ebe8;
  }

  .hr-stage {
    padding: 16px;
  }

  .hr-kpis,
  .hr-grid.two,
  .hr-grid.three,
  .hr-employee-detail {
    grid-template-columns: 1fr;
  }

  .hr-donut-row {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .hr-header {
    align-items: flex-start;
    flex-direction: column;
    padding: 20px;
  }

  .hr-night-bars div,
  .hr-annual-bars div {
    grid-template-columns: 1fr;
  }

  .hm-hero,
  .hm-toolbar {
    align-items: flex-start;
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .sc-hero {
    flex-direction: column;
  }

  .sc-hero dl,
  .sc-tabs {
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .hm-filter {
    justify-content: flex-start;
  }

  .hm-summary,
  .hm-cards {
    grid-template-columns: 1fr;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  color: var(--ink);
  font-family: "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", Arial, sans-serif;
  background: var(--paper);
  letter-spacing: 0;
  word-break: keep-all;
  overflow-wrap: break-word;
}

button,
input,
select,
textarea {
  font: inherit;
}

input,
select,
textarea {
  line-height: 1.45;
}

input[type="text"],
input[type="search"],
input:not([type]),
textarea {
  letter-spacing: 0;
  word-spacing: normal;
  text-transform: none;
}

button {
  cursor: pointer;
}

.icon {
  width: 18px;
  height: 18px;
  display: inline-block;
  flex: 0 0 18px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 900;
  letter-spacing: 0;
}

.brand-wordmark {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1;
  color: #111111;
  width: 146px;
}

.brand-wordmark b {
  display: block;
  width: 100%;
  font-family: "Arial Black", Arial, sans-serif;
  font-size: 31px;
  letter-spacing: -0.5px;
  border-bottom: 3px solid currentColor;
  padding-bottom: 2px;
  text-align: center;
}

.brand-wordmark small {
  display: block;
  width: 100%;
  margin-top: 5px;
  color: #6f6f6f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 9px;
  letter-spacing: 1.6px;
  text-align: center;
  white-space: nowrap;
}

.brand-mark {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: white;
  background: conic-gradient(from 210deg, var(--teal), #42c2b3, var(--blue), var(--teal));
  box-shadow: 0 10px 25px rgba(15, 143, 130, 0.28);
}

.brand span:last-child {
  font-size: 16px;
  white-space: nowrap;
}

.landing {
  min-height: 100vh;
  background:
    radial-gradient(circle at 10% 18%, rgba(111, 211, 194, 0.34), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(47, 111, 237, 0.12), transparent 28%),
    linear-gradient(145deg, #f8fffd 0%, #eef8ff 48%, #ffffff 100%);
  color: var(--ink);
  overflow: hidden;
}

.landing-header {
  height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 12px;
}

.nav-links a,
.ghost-button,
.primary-button,
.soft-button,
.icon-button {
  border: 0;
  text-decoration: none;
}

.nav-links a {
  color: #475467;
  font-size: 14px;
  padding: 8px 10px;
}

.hero {
  max-width: 1180px;
  margin: 0 auto;
  padding: 82px 24px 34px;
  min-height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.eyebrow {
  color: var(--teal);
  font-weight: 800;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.hero h1 {
  margin: 18px 0 20px;
  font-size: clamp(42px, 5.3vw, 70px);
  line-height: 1.12;
  letter-spacing: 0;
}

.hero h1 strong {
  color: var(--teal);
}

.hero-title-line {
  display: block;
  white-space: nowrap;
}

.hero p {
  color: #475467;
  font-size: 18px;
  line-height: 1.75;
  margin: 0 auto;
  max-width: 850px;
}

.hero-actions {
  display: flex;
  gap: 12px;
  margin-top: 32px;
  flex-wrap: wrap;
  justify-content: center;
}

.primary-button,
.ghost-button,
.soft-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 0 18px;
  border-radius: 8px;
  font-weight: 800;
}

.primary-button {
  color: white;
  background: var(--teal);
  box-shadow: 0 14px 36px rgba(15, 143, 130, 0.3);
}

.ghost-button {
  color: #344054;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.78);
}

.soft-button {
  color: var(--teal-dark);
  background: var(--mint);
}

.hero-visual {
  position: relative;
  height: 100%;
  min-height: 0;
}

.device {
  position: relative;
  width: min(100%, 640px);
  height: 100%;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.98);
  color: var(--ink);
  box-shadow: 0 26px 70px rgba(47, 111, 237, 0.16), 0 8px 24px rgba(15, 143, 130, 0.09);
  overflow: hidden;
  border: 1px solid rgba(15, 143, 130, 0.15);
}

.device-top {
  height: 44px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  background: #ffffff;
  border-bottom: 1px solid var(--line);
}

.dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--coral);
}

.dot:nth-child(2) {
  background: var(--amber);
}

.dot:nth-child(3) {
  background: var(--teal);
}

.device-body {
  display: grid;
  grid-template-columns: 174px 1fr;
  min-height: 0;
  height: calc(100% - 44px);
}

.mini-side {
  background: linear-gradient(180deg, #e7fbf7 0%, #f7fbff 100%);
  color: var(--teal-dark);
  padding: 18px 14px;
  border-right: 1px solid #cceee8;
}

.mini-side strong {
  display: block;
  margin-bottom: 18px;
}

.mini-side span {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #27665f;
  font-size: 13px;
  padding: 11px 8px;
  border-radius: 8px;
}

.mini-side span.active {
  background: white;
  color: var(--teal-dark);
  box-shadow: 0 8px 20px rgba(15, 143, 130, 0.1);
}

.mini-main {
  padding: 24px;
}

.searchbar {
  height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  color: #98a2b3;
  margin: 18px 0;
}

.feature-card {
  border: 1px solid #9de7dd;
  border-radius: 8px;
  overflow: hidden;
  background: white;
}

.feature-card .bar {
  background: var(--teal);
  color: white;
  padding: 10px 14px;
  font-weight: 800;
  font-size: 13px;
}

.feature-card .inside {
  padding: 18px;
  display: flex;
  gap: 14px;
}

.book-tile {
  width: 50px;
  height: 50px;
  border-radius: 8px;
  background: var(--mint);
  color: var(--teal-dark);
  display: grid;
  place-items: center;
}

.chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.chip {
  border: 1px solid #b8e9e3;
  color: var(--teal-dark);
  background: #f4fffd;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 700;
}

.proof-strip {
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-content: start;
  height: 100%;
}

.landing-overview {
  max-width: 1180px;
  margin: 0 auto;
  padding: 8px 24px 54px;
  display: grid;
  grid-template-columns: minmax(320px, 0.82fr) minmax(480px, 1.18fr);
  gap: 28px;
  align-items: stretch;
}

.proof {
  border-radius: 8px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(15, 143, 130, 0.14);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 86px;
}

.proof strong {
  display: block;
  color: var(--ink);
  margin-bottom: 6px;
}

.proof span {
  color: #667085;
  font-size: 13px;
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  background: #fbfcfe;
}

.rail {
  display: none;
}

.rail .brand-mark {
  width: 38px;
  height: 38px;
  box-shadow: none;
}

.rail-button {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 0;
  color: rgba(255, 255, 255, 0.72);
  background: transparent;
  display: grid;
  place-items: center;
}

.rail-button.active,
.rail-button:hover {
  background: rgba(255, 255, 255, 0.14);
  color: white;
}

.side {
  border-right: 1px solid #d8e7e4;
  background:
    linear-gradient(180deg, rgba(232, 250, 246, 0.92) 0%, rgba(255, 255, 255, 0.98) 42%),
    #ffffff;
  display: flex;
  flex-direction: column;
  min-width: 0;
  box-shadow: 12px 0 34px rgba(15, 23, 42, 0.04);
}

.side-head {
  min-height: 62px;
  padding: 18px;
  border-bottom: 1px solid var(--line);
  font-weight: 900;
}

.side-brand {
  min-height: 86px;
  padding: 18px 20px 14px;
  color: inherit;
  text-decoration: none;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(15, 143, 130, 0.16);
}

.side-brand .brand-wordmark b {
  font-size: 42px;
  border-bottom-width: 4px;
  padding-bottom: 3px;
}

.side-menu {
  padding: 16px 14px;
  display: grid;
  gap: 18px;
  overflow: auto;
}

.home-link,
.nav-leaf,
.nav-parent {
  width: 100%;
  border: 0;
  background: rgba(255, 255, 255, 0.64);
  color: #344054;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 13px;
  border-radius: 8px;
  text-align: left;
  font-weight: 800;
  border: 1px solid transparent;
}

.home-link.active,
.home-link:hover,
.nav-leaf.active,
.nav-leaf:hover,
.nav-parent.active,
.nav-parent:hover {
  background: white;
  color: var(--teal-dark);
  border-color: #b9e7df;
  box-shadow: 0 10px 24px rgba(15, 143, 130, 0.08);
}

.nav-section {
  display: grid;
  gap: 8px;
}

.nav-children {
  margin-left: 10px;
  padding-left: 12px;
  border-left: 1px solid #d3ece8;
  display: none;
  gap: 3px;
}

.nav-section.open .nav-children {
  display: grid;
}

.nav-child {
  width: 100%;
  min-height: 34px;
  border: 0;
  border-radius: 7px;
  padding: 0 8px;
  text-align: left;
  color: #475467;
  background: transparent;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.nav-child .icon {
  width: 15px;
  height: 15px;
  flex-basis: 15px;
  color: var(--teal-dark);
}

.nav-child.active,
.nav-child:hover {
  color: var(--teal-dark);
  background: #effbf8;
  font-weight: 800;
}

.nav-subsection {
  display: grid;
  gap: 3px;
}

.nav-subparent {
  font-weight: 700;
}

.nav-grandchildren {
  display: none;
  gap: 3px;
  margin: 2px 0 4px 19px;
  padding-left: 10px;
  border-left: 1px dashed #badfd9;
}

.nav-subsection.open .nav-grandchildren {
  display: grid;
}

.nav-grandchildren .nav-child {
  min-height: 32px;
  font-size: 13px;
}

.login-box {
  margin-top: auto;
  padding: 16px 14px;
  border-top: 1px solid rgba(15, 143, 130, 0.14);
}

.content {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.topbar {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 26px;
  background: white;
  border-bottom: 1px solid var(--line);
}

.topbar h2 {
  margin: 0;
  font-size: 18px;
}

.top-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-badge {
  padding: 7px 11px;
  border-radius: 18px;
  background: #e4f7f3;
  color: var(--teal-dark);
  font-size: 13px;
  font-weight: 800;
}

.icon-button {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: white;
  color: #475467;
  display: grid;
  place-items: center;
}

.workspace {
  padding: 28px;
  overflow: auto;
}

.workspace:has(.hub-dashboard) {
  padding: 18px 12px;
}

.workspace:has(.portal-dashboard) {
  padding: 18px 12px;
}

.portal-dashboard {
  --portal-teal: #078d83;
  --portal-dark: #086b65;
  --portal-mint: #edf9f7;
  --portal-line: #d9e8e6;
  --portal-ink: #14263b;
  --portal-muted: #64748b;
  color: var(--portal-ink);
  width: 100%;
}

.portal-search-zone {
  min-height: 154px;
  border: 1px solid var(--portal-line);
  border-radius: 8px;
  background: linear-gradient(100deg, #effaf8 0%, #fff 68%);
  display: grid;
  justify-items: center;
  align-content: center;
  padding: 22px;
  margin-bottom: 10px;
  text-align: center;
}

.portal-kicker {
  color: var(--portal-teal);
  font-size: 11px;
  font-weight: 900;
}

.portal-search-zone h1 {
  margin: 7px 0 4px;
  font-size: 25px;
  letter-spacing: 0;
}

.portal-search-zone p {
  color: var(--portal-muted);
  margin: 0 0 16px;
  font-size: 13px;
}

.portal-search {
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(720px, 100%);
  height: 48px;
  padding: 0 15px;
  border: 1px solid #cde4e0;
  border-radius: 8px;
  background: white;
  color: var(--portal-dark);
}

.portal-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  font: inherit;
}

.portal-search-results {
  width: min(720px, 100%);
  border: 1px solid var(--portal-line);
  border-radius: 8px;
  background: white;
  margin-top: 6px;
  overflow: hidden;
  text-align: left;
  box-shadow: 0 14px 30px rgba(20, 38, 59, .07);
}

.portal-search-results a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 42px;
  padding: 0 13px;
  border-bottom: 1px solid #edf3f2;
  color: var(--portal-ink);
  text-decoration: none;
  font-size: 13px;
}

.portal-search-results a:last-child {
  border-bottom: 0;
}

.portal-search-results a:hover {
  background: var(--portal-mint);
}

.portal-search-results b {
  font-size: 13px;
}

.portal-search-results span {
  color: var(--portal-muted);
}

.portal-search-empty {
  color: var(--portal-muted);
  padding: 13px;
  font-size: 13px;
}

.portal-columns {
  display: grid;
  grid-template-columns: minmax(510px, .92fr) minmax(540px, 1.08fr);
  gap: 10px;
}

.portal-left,
.portal-right {
  display: grid;
  align-content: start;
  gap: 10px;
}

.portal-panel,
.portal-feature-note,
.portal-feature-card,
.portal-ad {
  border: 1px solid var(--portal-line);
  border-radius: 8px;
  background: white;
}

.portal-panel-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--portal-line);
}

.portal-panel-head h2 {
  margin: 0;
  font-size: 17px;
}

.portal-panel-head p,
.portal-panel-head > span {
  color: var(--portal-muted);
  font-size: 12px;
  margin: 5px 0 0;
}

.portal-board-summary {
  min-height: 165px;
}

.portal-board-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 13px 18px 16px;
}

.portal-list-title {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 9px;
  color: var(--portal-dark);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.portal-list-title small {
  color: var(--portal-muted);
  font-weight: 500;
}

.portal-post-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid #edf3f2;
  color: var(--portal-ink);
  text-decoration: none;
  min-width: 0;
}

.portal-post-row b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 600;
}

.portal-post-row time {
  flex-shrink: 0;
  color: var(--portal-muted);
  font-size: 12px;
}

.portal-feature-note,
.portal-feature-card {
  position: relative;
  min-height: 112px;
  padding: 20px 56px 20px 20px;
  display: flex;
  align-items: center;
  gap: 18px;
  color: inherit;
  text-decoration: none;
}

.portal-feature-note:hover,
.portal-feature-card:hover {
  border-color: #a6dad3;
  background: #fbfefd;
}

.portal-feature-icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--portal-mint);
  color: var(--portal-dark);
}

.portal-feature-icon .icon {
  width: 20px;
  height: 20px;
}

.portal-feature-note h2,
.portal-feature-card h2 {
  margin: 0 0 6px;
  font-size: 18px;
}

.portal-feature-note p,
.portal-feature-card p {
  margin: 0 0 7px;
  color: var(--portal-muted);
  font-size: 13px;
  line-height: 1.5;
}

.portal-feature-note small {
  color: var(--portal-dark);
  font-size: 12px;
  font-weight: 700;
}

.portal-feature-note > .icon,
.portal-feature-card > .icon {
  position: absolute;
  right: 19px;
  width: 18px;
  height: 18px;
  color: #91aca8;
}

.portal-feature-card {
  min-height: 130px;
}

.portal-feature-card div > span {
  display: block;
  margin-bottom: 7px;
  color: var(--portal-teal);
  font-size: 11px;
  font-weight: 900;
}

.portal-feature-card.fee {
  background: linear-gradient(95deg, #fff, #f5fbfa);
}

.portal-feature-card.code {
  background: linear-gradient(95deg, #fff, #f8fbff);
}

.portal-tools {
  min-height: 542px;
}

.portal-tool-list {
  display: grid;
  padding: 7px 17px 14px;
}

.portal-tool-list a {
  min-height: 66px;
  display: grid;
  grid-template-columns: 32px 42px minmax(0, 1fr) 18px;
  gap: 12px;
  align-items: center;
  padding: 0 5px;
  border-bottom: 1px solid #edf3f2;
  color: inherit;
  text-decoration: none;
}

.portal-tool-list a:last-child {
  border-bottom: 0;
}

.portal-tool-list a:hover {
  background: #fafffe;
}

.portal-tool-number {
  color: #94a7a5;
  font-size: 12px;
  font-weight: 800;
}

.portal-tool-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.portal-tool-copy b {
  font-size: 14px;
}

.portal-tool-copy small {
  color: var(--portal-muted);
}

.portal-tool-list a > .icon {
  width: 16px;
  color: #91aca8;
}

.portal-ad {
  min-height: 170px;
  padding: 0;
  background: #f7fbfa;
  overflow: hidden;
}

.portal-banner-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  min-height: 170px;
  width: 100%;
}

.portal-banner-slot {
  position: relative;
  min-height: 170px;
  min-width: 0;
  overflow: hidden;
  border: 0;
  border-right: 1px solid var(--portal-line);
  border-radius: 0;
  background: #fff;
  display: grid;
  place-items: center;
  color: #6c8380;
}

.portal-banner-slot:last-child {
  border-right: 0;
}

.portal-banner-slot.filled {
  background: #f3f8f7;
}

.portal-banner-slot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.portal-banner-slot > div {
  display: grid;
  gap: 4px;
  text-align: center;
  font-size: 11px;
}

.portal-banner-slot b {
  color: var(--portal-dark);
  font-size: 18px;
}

.portal-banner-upload {
  position: absolute;
  inset: auto 12px 12px 12px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 6px;
  background: rgba(8, 107, 101, .9);
  color: white;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.portal-banner-upload input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}

.portal-banner-remove {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  background: rgba(15, 23, 42, .72);
  color: white;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.hub-dashboard {
  --hub-teal: #078d83;
  --hub-dark: #086b65;
  --hub-mint: #edf9f7;
  --hub-line: #d9e8e6;
  --hub-text: #14263b;
  --hub-muted: #64748b;
  width: 100%;
  color: var(--hub-text);
}

.hub-header {
  min-height: 128px;
  padding: 24px 28px;
  border: 1px solid #d1e8e4;
  border-radius: 8px;
  background: linear-gradient(110deg, #effaf8 0%, #ffffff 70%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.hub-overline {
  color: var(--hub-teal);
  font-size: 11px;
  font-weight: 900;
}

.hub-header h1 {
  margin: 8px 0 7px;
  font-size: 29px;
  letter-spacing: 0;
}

.hub-header p {
  margin: 0;
  color: var(--hub-muted);
  line-height: 1.55;
}

.hub-header-actions {
  flex-shrink: 0;
  display: flex;
  gap: 9px;
}

.hub-header-actions a {
  text-decoration: none;
}

.hub-counts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0 22px;
}

.hub-counts a {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  align-items: end;
  gap: 3px 12px;
  min-height: 76px;
  padding: 13px 16px;
  border: 1px solid var(--hub-line);
  border-radius: 8px;
  background: white;
  color: var(--hub-text);
  text-decoration: none;
}

.hub-counts a:hover {
  border-color: #a8dcd5;
  background: #fbfefd;
}

.hub-counts span {
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

.hub-counts b {
  grid-row: span 2;
  color: var(--hub-dark);
  font-size: 28px;
  line-height: 1;
}

.hub-counts small {
  color: var(--hub-muted);
}

.hub-layout {
  display: grid;
  grid-template-columns: minmax(520px, 1.62fr) minmax(296px, .88fr);
  gap: 20px;
}

.hub-primary,
.hub-secondary {
  display: grid;
  align-content: start;
  gap: 22px;
}

.hub-block {
  min-width: 0;
}

.hub-block-head {
  min-height: 47px;
  margin-bottom: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--hub-line);
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.hub-block-head h2 {
  margin: 0 0 4px;
  font-size: 18px;
}

.hub-block-head p {
  margin: 0;
  color: var(--hub-muted);
  font-size: 13px;
}

.hub-block-head.compact {
  min-height: 38px;
}

.hub-block-head.compact h2 {
  margin-bottom: 0;
}

.hub-more {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  flex-shrink: 0;
  color: var(--hub-dark);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.hub-more .icon {
  width: 14px;
  height: 14px;
}

.hub-tools {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.hub-tools a {
  position: relative;
  min-height: 108px;
  padding: 14px 39px 13px 14px;
  border: 1px solid var(--hub-line);
  border-radius: 8px;
  background: white;
  color: inherit;
  display: grid;
  align-content: start;
  gap: 9px;
  text-decoration: none;
}

.hub-tools a:hover {
  border-color: #a4dcd4;
  background: #fafffe;
}

.hub-tool-icon {
  width: 31px;
  height: 31px;
  border-radius: 7px;
  background: var(--hub-mint);
  color: var(--hub-dark);
  display: grid;
  place-items: center;
}

.hub-tool-icon .icon {
  width: 17px;
  height: 17px;
}

.hub-tools b {
  font-size: 14px;
}

.hub-tools small {
  color: var(--hub-muted);
  line-height: 1.45;
}

.hub-tools a > .icon {
  position: absolute;
  top: 16px;
  right: 13px;
  width: 15px;
  height: 15px;
  color: #8aa7a3;
}

.hub-feed {
  border-top: 1px solid var(--hub-line);
}

.hub-feed a {
  min-height: 59px;
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  gap: 13px;
  align-items: center;
  padding: 0 4px;
  border-bottom: 1px solid #e9f0ef;
  color: inherit;
  text-decoration: none;
}

.hub-feed b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
}

.hub-feed time {
  color: var(--hub-muted);
  font-size: 12px;
}

.hub-questions {
  border: 1px solid var(--hub-line);
  border-radius: 8px;
  overflow: hidden;
  background: white;
}

.hub-questions a {
  display: grid;
  gap: 7px;
  padding: 15px 16px;
  border-bottom: 1px solid #e8f0ef;
  color: inherit;
  text-decoration: none;
}

.hub-questions a:last-child {
  border-bottom: 0;
}

.hub-questions span {
  justify-self: start;
  color: var(--hub-dark);
  background: var(--hub-mint);
  border-radius: 18px;
  padding: 3px 9px;
  font-size: 12px;
  font-weight: 800;
}

.hub-questions b {
  font-size: 14px;
  line-height: 1.5;
}

.hub-questions small {
  color: var(--hub-muted);
}

.hub-links {
  border-top: 1px solid var(--hub-line);
}

.hub-links a {
  min-height: 49px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #e9f0ef;
  color: #334155;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

.hub-links .icon {
  width: 15px;
  height: 15px;
  color: var(--hub-dark);
}

.auth-gate {
  min-height: calc(100vh - 118px);
  display: grid;
  place-items: center;
}

.auth-card {
  max-width: 620px;
  text-align: center;
  background: white;
  border: 1px solid #d8e7e4;
  border-radius: 8px;
  padding: 34px;
  box-shadow: 0 18px 55px rgba(15, 23, 42, 0.08);
}

.auth-card .book-tile {
  margin: 0 auto 18px;
}

.auth-card h1 {
  margin: 0 0 12px;
}

.auth-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.login-surface {
  min-height: calc(100vh - 122px);
  display: grid;
  place-items: center;
}

.login-panel {
  width: min(430px, 100%);
  padding: 34px;
  border: 1px solid #d5e7e3;
  border-radius: 8px;
  background: white;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.07);
  display: grid;
  gap: 16px;
}

.login-panel h1 {
  margin: 0;
  font-size: 25px;
}

.login-panel p {
  margin: -5px 0 4px;
  color: var(--muted);
  line-height: 1.6;
}

.login-panel label,
.post-editor label {
  display: grid;
  gap: 7px;
  color: #344054;
  font-size: 14px;
  font-weight: 700;
}

.login-panel input,
.post-editor input,
.post-editor select,
.post-editor textarea {
  width: 100%;
  border: 1px solid #d1e2df;
  border-radius: 7px;
  background: #fff;
  padding: 11px 12px;
  color: var(--ink);
  font: inherit;
}

.post-editor textarea {
  min-height: 112px;
  resize: vertical;
}

.post-editor small {
  display: block;
  margin-top: 6px;
  color: #667085;
  font-size: 12px;
  line-height: 1.45;
}

.login-error {
  min-height: 20px;
  color: #c2414c;
  font-size: 13px;
}

.demo-account {
  display: grid;
  gap: 6px;
  padding: 13px 14px;
  border-radius: 7px;
  background: #f1fbf9;
  color: #3d5562;
  font-size: 13px;
}

.signup-surface {
  min-height: calc(100vh - 122px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 22px;
  align-items: start;
}

.signup-panel,
.signup-guide-panel {
  border: 1px solid #d5e7e3;
  border-radius: 8px;
  background: white;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.07);
}

.signup-panel {
  padding: 30px;
  display: grid;
  gap: 18px;
}

.signup-head {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.signup-head h1,
.signup-guide-panel h2 {
  margin: 0 0 8px;
}

.signup-head p,
.signup-guide-panel li,
.signup-status {
  color: var(--muted);
  line-height: 1.6;
}

.social-login-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.social-login {
  min-height: 52px;
  border: 1px solid #d1e2df;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.social-login b {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 28px;
  border-radius: 6px;
  background: #f2f5f7;
  font-size: 13px;
}

.social-login.kakao b {
  background: #fee500;
  color: #191600;
}

.social-login.google {
  background: #fff;
  border-color: #dadce0;
  color: #202124;
}

.social-login.google b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
}

.social-login.google svg {
  width: 20px;
  height: 20px;
  display: block;
}

.social-login.kakao {
  background: #fee500;
  border-color: #fee500;
  color: #000;
}

.social-login.active,
.social-login:hover {
  border-color: #14b8ad;
  box-shadow: 0 0 0 3px rgba(20, 184, 173, .12);
}

.signup-form {
  display: grid;
  gap: 16px;
}

.signup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.signup-grid label,
.marketing-check {
  display: grid;
  gap: 7px;
  color: #344054;
  font-size: 14px;
  font-weight: 700;
}

.signup-grid .wide {
  grid-column: 1 / -1;
}

.signup-grid input,
.signup-grid select {
  width: 100%;
  border: 1px solid #d1e2df;
  border-radius: 7px;
  background: #fff;
  padding: 11px 12px;
  color: var(--ink);
  font: inherit;
}

.signup-grid small,
.marketing-check small {
  color: #667085;
  font-weight: 600;
}

.marketing-check {
  display: flex;
  align-items: center;
  gap: 10px;
}

.marketing-check input {
  width: 18px;
  height: 18px;
}

.signup-submit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.signup-guide-panel {
  padding: 24px;
  position: sticky;
  top: 92px;
}

.signup-guide-panel ol {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 10px;
}

@media (max-width: 980px) {
  .signup-surface {
    grid-template-columns: 1fr;
  }
  .signup-guide-panel {
    position: static;
  }
}

@media (max-width: 620px) {
  .signup-panel {
    padding: 22px;
  }
  .signup-head,
  .social-login-row,
  .signup-grid {
    grid-template-columns: 1fr;
  }
  .signup-head {
    display: grid;
  }
}
.board-page {
  display: grid;
  gap: 20px;
}

.board-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
}

.board-head .primary-button {
  flex-shrink: 0;
}

.board-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.board-tab {
  min-height: 38px;
  padding: 0 18px;
  border: 1px solid #d2e7e3;
  border-radius: 20px;
  background: white;
  color: #475467;
  font-weight: 700;
}

.board-tab.active,
.board-tab:hover {
  border-color: var(--teal);
  background: #eaf9f6;
  color: var(--teal-dark);
}

.post-editor {
  padding: 20px;
  border: 1px solid #d5e7e3;
  border-radius: 8px;
  background: white;
  display: grid;
  gap: 14px;
}

.post-editor[hidden] {
  display: none;
}

.post-editor .primary-button {
  justify-self: start;
}

.post-list {
  display: grid;
  gap: 11px;
}

.post-item {
  display: grid;
  gap: 8px;
  padding: 18px 20px;
  border: 1px solid #dbe8e6;
  border-radius: 8px;
  background: white;
}

.sc-page {
  display: grid;
  gap: 16px;
  color: #132638;
}

.sc-hero {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  border: 1px solid rgba(15, 143, 130, .22);
  border-radius: 8px;
  background: linear-gradient(135deg, #f6fffd 0%, #eef8ff 100%);
  padding: 24px;
}

.sc-hero span {
  color: #0f8f82;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.sc-hero h1 {
  margin: 7px 0 9px;
  color: #0a1020;
  font-size: 30px;
}

.sc-hero p {
  max-width: 720px;
  margin: 0;
  color: #536978;
  font-size: 14px;
  line-height: 1.65;
}

.sc-hero dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(86px, 1fr));
  gap: 10px;
  min-width: 340px;
  margin: 0;
}

.sc-hero dl div {
  border: 1px solid #d3e8e5;
  border-radius: 8px;
  background: #ffffff;
  padding: 13px;
}

.sc-hero dt {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.sc-hero dd {
  margin: 6px 0 0;
  color: #0a635b;
  font-size: 22px;
  font-weight: 900;
}

.sc-search label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  border: 1px solid #cfdfdc;
  border-radius: 8px;
  background: #ffffff;
  color: #728392;
  padding: 0 14px;
}

.sc-search input {
  width: 100%;
  border: 0;
  outline: 0;
  color: #142838;
  font: inherit;
}

.sc-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.sc-tabs button {
  display: grid;
  gap: 6px;
  min-height: 68px;
  border: 1px solid #d6e5e3;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  padding: 12px 14px;
  text-align: left;
}

.sc-tabs button.active,
.sc-tabs button:hover {
  border-color: #0f8f82;
  background: #eaf9f6;
}

.sc-tabs strong {
  color: #0a1020;
  font-size: 14px;
}

.sc-tabs span {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.sc-table-wrap {
  overflow-x: auto;
  border: 1px solid #d7e5e3;
  border-radius: 8px;
  background: #ffffff;
}

.sc-table-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e4eeee;
  background: #f8fcfb;
  padding: 14px 16px;
}

.sc-table-head strong {
  color: #0a635b;
}

.sc-table-head span {
  color: #667085;
  font-size: 13px;
  font-weight: 800;
}

.sc-table {
  width: 100%;
  min-width: 1100px;
  border-collapse: collapse;
  font-size: 13px;
}

.sc-table th,
.sc-table td {
  border-bottom: 1px solid #edf2f2;
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}

.sc-table thead th {
  background: #0a635b;
  color: #ffffff;
  font-size: 12px;
  white-space: nowrap;
}

.sc-table tbody th {
  color: #0f172a;
  font-size: 14px;
}

.sc-table tbody tr:nth-child(even) th,
.sc-table tbody tr:nth-child(even) td {
  background: #fbfdfd;
}

.sc-code,
.sc-kcd {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  padding: 5px 10px;
  white-space: nowrap;
}

.sc-code {
  background: #e7f8f5;
  color: #08776f;
}

.sc-kcd {
  background: #eef4ff;
  color: #2f5cb8;
}

.sc-empty {
  color: #667085;
  font-weight: 800;
  text-align: center;
}

.aic-page {
  display: grid;
  gap: 18px;
  color: #132638;
}

.aic-hero {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  border: 1px solid rgba(15, 143, 130, .22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(8, 23, 36, .95), rgba(11, 83, 91, .91)),
    radial-gradient(circle at 86% 20%, rgba(209, 166, 72, .27), transparent 36%);
  color: #ffffff;
  padding: 25px;
  overflow: hidden;
}

.aic-hero span {
  color: #9de4da;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.aic-hero h1 {
  margin: 7px 0 9px;
  font-size: 31px;
  letter-spacing: 0;
}

.aic-hero p {
  max-width: 760px;
  margin: 0;
  color: #d7e7e7;
  font-size: 14px;
  line-height: 1.65;
}

.aic-hero dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(96px, 1fr));
  gap: 10px;
  min-width: 330px;
  margin: 0;
}

.aic-hero dl div {
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 8px;
  background: rgba(255, 255, 255, .1);
  padding: 13px;
  backdrop-filter: blur(12px);
}

.aic-hero dt {
  color: #b8d7d5;
  font-size: 12px;
  font-weight: 800;
}

.aic-hero dd {
  margin: 6px 0 0;
  color: #ffffff;
  font-size: 23px;
  font-weight: 900;
}

.aic-search-panel {
  display: grid;
  gap: 10px;
  border: 1px solid #d7e5e3;
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
  box-shadow: 0 18px 44px rgba(15, 43, 64, .07);
}

.aic-search-panel label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  border: 1px solid #cadfdb;
  border-radius: 8px;
  background: #f8fcfb;
  color: #728392;
  padding: 0 14px;
}

.aic-search-panel input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #142838;
  font: inherit;
}

.aic-filter-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.ns-filter-grid {
  grid-template-columns: 1fr;
}

.ns-page .aic-hero {
  background:
    linear-gradient(135deg, rgba(8, 23, 36, .95), rgba(9, 73, 82, .91)),
    radial-gradient(circle at 86% 20%, rgba(111, 191, 178, .28), transparent 36%);
}

.aic-filter-block {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.aic-filter-block > b {
  color: #465968;
  font-size: 12px;
}

.aic-filter-block > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.aic-filter-block button {
  min-height: 32px;
  border: 1px solid #d8e6e3;
  border-radius: 999px;
  background: #ffffff;
  color: #425466;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  padding: 0 12px;
}

.aic-filter-block button.active,
.aic-filter-block button:hover {
  border-color: #0f8f82;
  background: #eaf9f6;
  color: #0a635b;
}

.aic-workbench {
  display: grid;
  grid-template-columns: minmax(320px, .86fr) minmax(0, 1.52fr);
  gap: 14px;
  align-items: start;
}

.aic-result-list,
.aic-detail {
  border: 1px solid #d7e5e3;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(15, 43, 64, .06);
}

.aic-result-list {
  position: sticky;
  top: 16px;
  overflow: hidden;
}

.aic-result-list header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid #e3eeee;
  background: #f8fcfb;
  padding: 13px 14px;
}

.aic-result-list header strong {
  color: #0a635b;
}

.aic-result-list header span {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.aic-result-scroll {
  display: grid;
  max-height: 690px;
  overflow: auto;
}

.aic-result-card {
  display: grid;
  gap: 6px;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #edf2f2;
  background: #ffffff;
  color: #27384a;
  cursor: pointer;
  padding: 14px;
  text-align: left;
}

.aic-result-card.active,
.aic-result-card:hover {
  background: linear-gradient(90deg, #eaf9f6, #ffffff);
}

.aic-result-card span {
  color: #0f8f82;
  font-size: 12px;
  font-weight: 900;
}

.aic-result-card b {
  color: #0a1020;
  font-size: 14px;
  line-height: 1.45;
}

.aic-result-card small {
  display: -webkit-box;
  overflow: hidden;
  color: #667085;
  font-size: 12px;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.aic-detail {
  display: grid;
  gap: 18px;
  padding: 22px;
}

.aic-detail.empty {
  min-height: 300px;
  align-content: center;
  text-align: center;
}

.aic-detail-top,
.aic-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.aic-detail-top span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  background: #e7f8f5;
  color: #08776f;
  font-size: 12px;
  font-weight: 900;
  padding: 0 12px;
}

.aic-detail h2 {
  margin: 0;
  color: #0a1020;
  font-size: 25px;
  line-height: 1.35;
}

.aic-summary {
  margin: 0;
  color: #536978;
  font-size: 14px;
  line-height: 1.7;
}

.aic-tag-row span {
  border: 1px solid #d7e8e4;
  border-radius: 999px;
  background: #fbfdfd;
  color: #425466;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 10px;
}

.aic-ai-box {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 18px;
  border: 1px solid rgba(229, 185, 91, .42);
  border-radius: 8px;
  background: #fffaf0;
  padding: 16px;
}

.aic-ai-box span {
  color: #9b6a00;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.aic-ai-box h3,
.aic-case-stack h3,
.aic-body h3 {
  margin: 5px 0 0;
  color: #172033;
  font-size: 16px;
}

.aic-ai-box ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
  color: #4d5567;
  font-size: 13px;
  line-height: 1.65;
}

.aic-case-stack,
.aic-body {
  display: grid;
  gap: 10px;
}

.aic-case-stack.structured {
  gap: 12px;
}

.aic-structured-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
}

.aic-structured-grid article {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 138px;
  border: 1px solid #d9e9e6;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f8fcfb);
  padding: 14px;
}

.aic-structured-grid b {
  color: #0a635b;
  font-size: 12px;
  font-weight: 900;
}

.aic-structured-grid p {
  margin: 0;
  color: #27384a;
  font-size: 13px;
  line-height: 1.68;
}

.aic-case-stack p {
  margin: 0;
  border-left: 3px solid #0f8f82;
  border-radius: 6px;
  background: #f6fbfa;
  color: #27384a;
  font-size: 13px;
  line-height: 1.68;
  padding: 11px 13px;
}

.aic-body {
  border-top: 1px solid #e7eeee;
  padding-top: 16px;
}

.aic-body p {
  margin: 0;
  border-radius: 7px;
  background: #fbfdfd;
  color: #334155;
  font-size: 13px;
  line-height: 1.76;
  padding: 10px 12px;
}

.aic-empty {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 36px 18px;
  color: #667085;
  text-align: center;
}

.aic-empty .icon {
  color: #0f8f82;
}

.uc-page {
  display: grid;
  gap: 18px;
  color: #132638;
}

.uc-hero {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  border: 1px solid rgba(15, 143, 130, .22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(10, 16, 32, .94), rgba(10, 99, 91, .9)),
    radial-gradient(circle at 80% 18%, rgba(229, 185, 91, .28), transparent 34%);
  color: #ffffff;
  padding: 25px;
  overflow: hidden;
}

.uc-hero span {
  color: #9de4da;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.uc-hero h1 {
  margin: 7px 0 9px;
  font-size: 31px;
  letter-spacing: 0;
}

.uc-hero p {
  max-width: 720px;
  margin: 0;
  color: #d7e7e7;
  font-size: 14px;
  line-height: 1.65;
}

.uc-hero dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(96px, 1fr));
  gap: 10px;
  min-width: 380px;
  margin: 0;
}

.uc-hero dl div {
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 8px;
  background: rgba(255, 255, 255, .1);
  padding: 13px;
  backdrop-filter: blur(12px);
}

.uc-hero dt {
  color: #b8d7d5;
  font-size: 12px;
  font-weight: 800;
}

.uc-hero dd {
  margin: 6px 0 0;
  color: #ffffff;
  font-size: 23px;
  font-weight: 900;
}

.uc-search-panel {
  display: grid;
  gap: 12px;
  border: 1px solid #d7e5e3;
  border-radius: 8px;
  background: #ffffff;
  padding: 14px;
  box-shadow: 0 18px 44px rgba(15, 43, 64, .07);
}

.uc-search-panel label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  border: 1px solid #cadfdb;
  border-radius: 8px;
  background: #f8fcfb;
  color: #728392;
  padding: 0 14px;
}

.uc-search-panel input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #142838;
  font: inherit;
}

.uc-section-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.uc-section-tabs button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  border: 1px solid #d8e6e3;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  padding: 0 12px;
  text-align: left;
}

.uc-section-tabs button.active,
.uc-section-tabs button:hover {
  border-color: #0f8f82;
  background: #eaf9f6;
  color: #0a635b;
}

.uc-section-tabs b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}

.uc-section-tabs span {
  color: #667085;
  font-size: 12px;
  font-weight: 900;
}

.uc-workbench {
  display: grid;
  grid-template-columns: minmax(310px, .82fr) minmax(0, 1.55fr);
  gap: 14px;
  align-items: start;
}

.uc-result-list,
.uc-detail {
  border: 1px solid #d7e5e3;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(15, 43, 64, .06);
}

.uc-result-list {
  position: sticky;
  top: 16px;
  overflow: hidden;
}

.uc-result-list header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid #e3eeee;
  background: #f8fcfb;
  padding: 13px 14px;
}

.uc-result-list header strong {
  color: #0a635b;
}

.uc-result-list header span {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.uc-result-scroll {
  display: grid;
  max-height: 690px;
  overflow: auto;
}

.uc-result-card {
  display: grid;
  gap: 6px;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #edf2f2;
  background: #ffffff;
  color: #27384a;
  cursor: pointer;
  padding: 14px;
  text-align: left;
}

.uc-result-card.active,
.uc-result-card:hover {
  background: linear-gradient(90deg, #eaf9f6, #ffffff);
}

.uc-result-card span {
  color: #0f8f82;
  font-size: 12px;
  font-weight: 900;
}

.uc-result-card b {
  color: #0a1020;
  font-size: 14px;
  line-height: 1.45;
}

.uc-result-card small {
  display: -webkit-box;
  overflow: hidden;
  color: #667085;
  font-size: 12px;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.uc-detail {
  display: grid;
  gap: 18px;
  padding: 22px;
}

.uc-detail.empty {
  min-height: 300px;
  align-content: center;
  text-align: center;
}

.uc-detail-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.uc-detail-top span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  background: #e7f8f5;
  color: #08776f;
  font-size: 12px;
  font-weight: 900;
  padding: 0 12px;
}

.uc-detail-top span:nth-child(2) {
  background: #eef4ff;
  color: #2f5cb8;
}

.uc-detail-top span:nth-child(3) {
  background: #fff4dc;
  color: #8a5a00;
}

.uc-detail-top small {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.uc-detail h2 {
  margin: 0;
  color: #0a1020;
  font-size: 25px;
  line-height: 1.35;
}

.uc-summary {
  margin: 0;
  color: #536978;
  font-size: 14px;
  line-height: 1.7;
}

.uc-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.uc-tag-row span {
  border: 1px solid #d7e8e4;
  border-radius: 999px;
  background: #fbfdfd;
  color: #425466;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 10px;
}

.uc-ai-box {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 18px;
  border: 1px solid rgba(229, 185, 91, .42);
  border-radius: 8px;
  background: #fffaf0;
  padding: 16px;
}

.uc-ai-box span {
  color: #9b6a00;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.uc-ai-box h3,
.uc-case-stack h3,
.uc-body h3 {
  margin: 5px 0 0;
  color: #172033;
  font-size: 16px;
}

.uc-ai-box ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
  color: #4d5567;
  font-size: 13px;
  line-height: 1.65;
}

.uc-case-stack,
.uc-body {
  display: grid;
  gap: 10px;
}

.uc-case-stack.structured {
  gap: 12px;
}

.uc-structured-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.uc-structured-grid article {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 138px;
  border: 1px solid #d9e9e6;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f8fcfb);
  padding: 14px;
}

.uc-structured-grid b {
  color: #0a635b;
  font-size: 12px;
  font-weight: 900;
}

.uc-structured-grid p {
  margin: 0;
  color: #27384a;
  font-size: 13px;
  line-height: 1.68;
}

.uc-case-stack p {
  margin: 0;
  border-left: 3px solid #0f8f82;
  border-radius: 6px;
  background: #f6fbfa;
  color: #27384a;
  font-size: 13px;
  line-height: 1.68;
  padding: 11px 13px;
}

.uc-body {
  border-top: 1px solid #e7eeee;
  padding-top: 16px;
}

.uc-body p {
  margin: 0;
  border-radius: 7px;
  background: #fbfdfd;
  color: #334155;
  font-size: 13px;
  line-height: 1.76;
  padding: 10px 12px;
}

.uc-empty {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 36px 18px;
  color: #667085;
  text-align: center;
}

.uc-empty .icon {
  color: #0f8f82;
}

.tm-page {
  display: grid;
  gap: 18px;
}

.tm-hero {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 18px;
  border: 1px solid rgba(15, 143, 130, .2);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(10, 16, 32, .94), rgba(11, 67, 74, .92)),
    linear-gradient(90deg, rgba(255, 255, 255, .08), transparent);
  color: #fff;
  padding: 28px;
  box-shadow: 0 20px 50px rgba(15, 23, 42, .16);
}

.tm-kicker {
  display: inline-flex;
  margin-bottom: 10px;
  color: #9ee9df;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.tm-hero h1 {
  margin: 0 0 10px;
  font-size: 30px;
}

.tm-hero p {
  max-width: 720px;
  margin: 0;
  color: #d7eceb;
  line-height: 1.7;
}

.tm-hero-card {
  min-width: 210px;
  display: grid;
  align-content: center;
  gap: 6px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 8px;
  background: rgba(255, 255, 255, .08);
  padding: 18px;
}

.tm-hero-card span,
.tm-hero-card small {
  color: #bfe9e4;
  font-size: 12px;
  font-weight: 800;
}

.tm-hero-card b {
  font-size: 26px;
}

.tm-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.tm-summary article,
.tm-toolbar,
.tm-table-panel {
  border: 1px solid #d9e8e6;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .06);
}

.tm-summary article {
  display: grid;
  gap: 4px;
  padding: 16px;
}

.tm-summary span,
.tm-summary small {
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.tm-summary b {
  color: #0b2435;
  font-size: 24px;
}

.tm-toolbar {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.tm-search {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  border: 1px solid #cfe3df;
  border-radius: 8px;
  background: #f8fffd;
  padding: 0 14px;
}

.tm-search .icon {
  width: 18px;
  height: 18px;
  color: var(--teal);
}

.tm-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-weight: 700;
}

.tm-chip-row,
.tm-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tm-chip,
.tm-filter,
.tm-pager button {
  min-height: 38px;
  border: 1px solid #d3e5e2;
  border-radius: 8px;
  background: #fff;
  color: #344054;
  font: inherit;
  font-weight: 800;
}

.tm-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
}

.tm-chip b {
  color: var(--teal-dark);
}

.tm-chip.active,
.tm-filter.active,
.tm-chip:hover,
.tm-filter:hover {
  border-color: var(--teal);
  background: #eaf9f6;
  color: var(--teal-dark);
}

.tm-filter {
  padding: 0 14px;
}

.tm-table-panel {
  min-width: 0;
  overflow: hidden;
}

.tm-table-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid #e0ecea;
  padding: 14px 16px;
}

.tm-table-head div:first-child {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.tm-table-head b {
  color: #0b2435;
  font-size: 18px;
}

.tm-table-head span {
  color: #667085;
  font-size: 13px;
  font-weight: 700;
}

.tm-pager {
  display: flex;
  gap: 7px;
}

.tm-pager button {
  padding: 0 14px;
}

.tm-pager button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.tm-table-scroll {
  overflow: auto;
}

.tm-table {
  width: 100%;
  min-width: 1180px;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}

.tm-table th,
.tm-table td {
  border-bottom: 1px solid #edf2f1;
  padding: 12px 13px;
  text-align: left;
  vertical-align: top;
}

.tm-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f2fbf9;
  color: #294354;
  font-size: 12px;
  font-weight: 900;
}

.tm-table tbody tr:hover td {
  background: #fbfffe;
}

.tm-date,
.tm-table code {
  display: inline-flex;
  color: #0a635b;
  font-weight: 900;
}

.tm-table td small,
.tm-name span {
  display: block;
  margin-top: 5px;
  color: #667085;
  line-height: 1.45;
}

.tm-name {
  min-width: 260px;
}

.tm-name b {
  color: #101828;
}

.tm-copay {
  min-width: 130px;
}

.tm-copay span {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 25px;
  margin-right: 4px;
  border-radius: 6px;
  background: #eef8f6;
  color: #0a635b;
  font-weight: 900;
}

.tm-note {
  min-width: 210px;
  color: #475467;
  line-height: 1.55;
}

.tm-empty {
  height: 120px;
  text-align: center;
  color: #667085;
  font-weight: 800;
}

.post-item[hidden] {
  display: none;
}

.post-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.post-meta time {
  color: var(--muted);
  font-size: 13px;
}

.post-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.post-delete {
  border: 1px solid #f3c9c5;
  border-radius: 6px;
  background: #fff7f6;
  color: #b42318;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.post-delete:hover {
  border-color: #e9aaa3;
  background: #feecea;
}

.post-delete.confirming {
  border-color: #b42318;
  background: #b42318;
  color: #fff;
}

.post-item h3 {
  margin: 2px 0 0;
  font-size: 17px;
}

.post-item p {
  margin: 0;
  color: #475467;
  white-space: pre-wrap;
  line-height: 1.65;
}

.post-source-link {
  justify-self: start;
  color: var(--teal);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.post-source-link:hover {
  text-decoration: underline;
}

.guide-page {
  max-width: 1220px;
}

.guide-hero-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 14px;
  align-items: stretch;
}

.guide-source-note {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  border: 1px solid #b9e0da;
  border-radius: 8px;
  background: #eefaf8;
  color: var(--teal-dark);
  padding: 17px 19px;
  min-height: 100%;
}

.guide-source-note svg {
  flex-shrink: 0;
  margin-top: 2px;
}

.guide-source-note strong {
  display: block;
  margin-bottom: 5px;
  font-size: 15px;
}

.guide-source-note p {
  margin: 0;
  color: #456760;
  font-size: 13px;
  line-height: 1.65;
}

.guide-search-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 128px;
  gap: 12px;
  align-items: stretch;
  border: 1px solid #d8e8e5;
  border-radius: 8px;
  background: #fff;
  padding: 12px;
  box-shadow: 0 14px 32px rgba(27, 55, 50, 0.06);
}

.guide-search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  border: 1px solid #c9e1dd;
  border-radius: 8px;
  background: #f7fbfa;
  padding: 0 14px;
}

.guide-search-box svg {
  flex: 0 0 auto;
  color: var(--teal);
}

.guide-search-box input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #173b36;
  font-size: 14px;
  font-weight: 700;
}

.guide-search-box input::placeholder {
  color: #6d8580;
  font-weight: 600;
}

.guide-search-meta {
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: linear-gradient(135deg, #0b766c, #10a290);
  color: white;
  text-align: center;
}

.guide-search-meta b {
  display: block;
  font-size: 22px;
  line-height: 1;
}

.guide-search-meta span {
  font-size: 12px;
  font-weight: 800;
}

.guide-hero-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  border: 1px solid #dde7e4;
  border-radius: 8px;
  background: #fff;
  padding: 12px;
}

.guide-hero-stats span {
  display: grid;
  align-content: center;
  min-height: 74px;
  border-radius: 8px;
  background: #f7faf9;
  color: #5f746f;
  text-align: center;
  font-size: 12px;
  font-weight: 800;
}

.guide-hero-stats b {
  display: block;
  color: #163b36;
  font-size: 24px;
  line-height: 1.05;
}

.guide-category-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.guide-category-row span {
  border: 1px solid #c3e5df;
  border-radius: 18px;
  background: #fff;
  color: var(--teal-dark);
  padding: 7px 13px;
  font-size: 13px;
  font-weight: 700;
}

.guide-list {
  display: grid;
  gap: 10px;
}

.guide-article {
  overflow: hidden;
  border: 1px solid #dbe8e6;
  border-radius: 8px;
  background: white;
  box-shadow: 0 10px 28px rgba(27, 55, 50, 0.055);
}

.guide-article summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  cursor: pointer;
  list-style: none;
  padding: 17px 20px;
}

.guide-article summary::-webkit-details-marker {
  display: none;
}

.guide-article summary h3 {
  display: inline;
  margin: 0 0 0 10px;
  font-size: 16px;
  line-height: 1.45;
}

.guide-article-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  color: var(--muted);
  font-size: 12px;
}

.guide-open-label {
  border-radius: 14px;
  background: #eaf9f6;
  color: var(--teal-dark);
  padding: 5px 10px;
  font-weight: 700;
}

.guide-article[open] .guide-open-label {
  background: var(--teal);
  color: #fff;
}

.guide-article-body {
  border-top: 1px solid #e7efed;
  display: block;
  padding: 18px 20px 22px;
  background: linear-gradient(180deg, #fbfdfd, #fff);
}

.guide-analysis-copy {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.guide-analysis-copy > p,
.guide-report-block {
  margin: 0;
  border: 1px solid #e0ece8;
  border-radius: 8px;
  background: #fff;
  padding: 13px 15px;
  color: #294942;
  font-size: 14px;
  line-height: 1.72;
}

.guide-analysis-copy > p:first-child {
  grid-column: 1 / -1;
  border-color: #c8e4dd;
  background: #f2faf7;
  color: #123d36;
  font-size: 15px;
  font-weight: 700;
}

.guide-report-block strong,
.guide-report-block b {
  display: block;
  margin-bottom: 5px;
  color: #0d5d56;
  font-size: 13px;
}

.guide-report-block p,
.guide-report-block span {
  margin: 0;
  color: #314f48;
  line-height: 1.7;
}

.guide-report-block.key {
  border-color: #c5e5de;
  background: #f7fcfb;
}

.guide-report-block.point {
  border-color: #eadfc8;
  background: #fffaf0;
}

.guide-delete {
  border: 1px solid #f1c8c4;
  border-radius: 14px;
  background: #fff7f6;
  color: #b42318;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.guide-delete.confirming {
  background: #b42318;
  color: #fff;
}

.guide-copy {
  min-width: 0;
}

.guide-copy p {
  margin: 0 0 14px;
  color: #344c48;
  font-size: 14px;
  line-height: 1.78;
}

.guide-copy p:first-child {
  font-size: 15px;
  color: #203d39;
}

.guide-check-block {
  margin: 16px 0;
  border: 1px solid #d8e8e5;
  border-radius: 8px;
  background: #fbfdfd;
  padding: 15px 16px;
}

.guide-check-block h4 {
  margin: 0 0 10px;
  color: #0d5d56;
  font-size: 14px;
}

.guide-check-block ol {
  margin: 0;
  padding-left: 22px;
  color: #344c48;
  line-height: 1.72;
  font-size: 14px;
}

.guide-check-block li + li {
  margin-top: 6px;
}

.guide-source-line {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 14px;
  border-top: 1px solid #e3ecea;
  padding-top: 13px;
  color: #687d78;
  font-size: 13px;
  line-height: 1.55;
}

.guide-source-line b {
  flex: 0 0 auto;
  border-radius: 999px;
  background: #eef8f6;
  color: #0d5d56;
  padding: 3px 8px;
  font-size: 12px;
}

.guide-visual {
  position: relative;
  overflow: hidden;
  min-height: 210px;
  margin: 0;
  border: 1px solid #d7e4e1;
  border-radius: 8px;
  background:
    linear-gradient(140deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)),
    linear-gradient(135deg, #dff5f1, #f6fbfb 58%, #e8eef9);
}

.guide-visual.insurance {
  background:
    linear-gradient(140deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0)),
    linear-gradient(135deg, #e7f2ff, #f8fbff 56%, #e8f7ee);
}

.guide-visual.review {
  background:
    linear-gradient(140deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)),
    linear-gradient(135deg, #f4f0ff, #fbfbff 56%, #e8f6f2);
}

.guide-visual.check {
  background:
    linear-gradient(140deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0)),
    linear-gradient(135deg, #fff2d9, #fbfcfb 56%, #e2f5f1);
}

.guide-visual.uploaded img {
  width: 100%;
  height: 100%;
  min-height: 210px;
  object-fit: cover;
  display: block;
}

.guide-visual-window,
.guide-visual-screen,
.guide-visual-paper {
  position: absolute;
  border: 1px solid rgba(18, 70, 65, 0.13);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 16px 30px rgba(35, 69, 66, 0.12);
  backdrop-filter: blur(2px);
}

.guide-visual-window {
  left: 18px;
  top: 18px;
  width: 96px;
  height: 72px;
  border-radius: 8px;
  padding: 12px;
}

.guide-visual-window span,
.guide-visual-paper span {
  display: block;
  height: 8px;
  margin-bottom: 8px;
  border-radius: 999px;
  background: #bddad5;
}

.guide-visual-window span:nth-child(2) {
  width: 70%;
}

.guide-visual-window span:nth-child(3) {
  width: 48%;
}

.guide-visual-screen {
  left: 56px;
  right: 20px;
  bottom: 24px;
  min-height: 96px;
  border-radius: 8px;
  padding: 16px;
}

.guide-visual-screen b,
.guide-visual-screen small {
  display: block;
}

.guide-visual-screen b {
  color: #103f39;
  font-size: 16px;
}

.guide-visual-screen small {
  margin-top: 3px;
  color: #67807b;
  font-weight: 800;
}

.guide-visual-screen i {
  display: block;
  width: 100%;
  height: 8px;
  margin-top: 10px;
  border-radius: 999px;
  background: #d8e8e5;
}

.guide-visual-screen i:nth-child(5) {
  width: 66%;
}

.guide-visual-paper {
  right: 18px;
  top: 26px;
  width: 86px;
  height: 112px;
  border-radius: 8px;
  padding: 14px 12px;
  transform: rotate(3deg);
}

.board-empty {
  min-height: 190px;
  border: 1px dashed #c5ded9;
  border-radius: 8px;
  display: grid;
  gap: 9px;
  place-items: center;
  align-content: center;
  background: #fbfdfd;
  color: #475467;
  text-align: center;
}

.board-empty .icon {
  color: var(--teal-dark);
}

.board-empty span {
  color: var(--muted);
  font-size: 14px;
}

.board-empty.compact {
  min-height: 152px;
}

.admin-console {
  display: grid;
  gap: 18px;
}

.admin-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  border-radius: 8px;
  background: linear-gradient(120deg, #102a43, #0f766e);
  color: #fff;
  padding: 28px;
}

.admin-hero span {
  color: #a7f3d0;
  font-size: 12px;
  font-weight: 900;
}

.admin-hero h1 {
  margin: 8px 0;
  font-size: 30px;
  line-height: 1.2;
}

.admin-hero p {
  margin: 0;
  color: rgba(255, 255, 255, .84);
  line-height: 1.65;
}

.admin-kpis,
.admin-settings-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.admin-kpis article,
.admin-panel,
.admin-board-card,
.admin-permission-card,
.admin-banner-grid article {
  border: 1px solid #d8e7e4;
  border-radius: 8px;
  background: #fff;
}

.admin-kpis article {
  padding: 16px;
}

.admin-kpis span,
.admin-kpis small,
.admin-section-head p,
.admin-board-card span,
.admin-post-row small {
  color: #667085;
}

.admin-kpis b {
  display: block;
  margin: 8px 0 4px;
  color: #0f766e;
  font-size: 28px;
}

.admin-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  border-bottom: 1px solid #d8e7e4;
}

.admin-tabs button {
  min-height: 42px;
  border: 0;
  border-bottom: 3px solid transparent;
  background: transparent;
  color: #475467;
  font-weight: 900;
  padding: 0 16px;
  white-space: nowrap;
}

.admin-tabs button.active {
  border-bottom-color: var(--teal);
  color: var(--teal-dark);
}

.admin-panel {
  display: none;
  padding: 18px;
}

.admin-panel.active {
  display: grid;
  gap: 16px;
}

.admin-section-head,
.admin-board-card header,
.admin-permission-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.admin-section-head h2,
.admin-board-card h3,
.admin-permission-card h3 {
  margin: 0;
}

.admin-section-head p {
  margin: 6px 0 0;
}

.admin-inline-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: 10px;
}

.admin-inline-form input,
.admin-inline-form select,
.admin-table select,
.admin-settings-grid input {
  width: 100%;
  min-height: 40px;
  border: 1px solid #d1e2df;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  padding: 9px 11px;
}

.admin-table-wrap {
  overflow-x: auto;
}

.admin-table {
  width: 100%;
  min-width: 960px;
  border-collapse: collapse;
  font-size: 13px;
}

.admin-table th,
.admin-table td {
  border-bottom: 1px solid #e5efed;
  padding: 11px 10px;
  text-align: left;
}

.admin-table th {
  background: #f4faf8;
  color: #344054;
}

.admin-status {
  display: inline-flex;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  padding: 5px 9px;
}

.admin-status.ok {
  background: #e7f8ef;
  color: #087443;
}

.admin-status.wait {
  background: #fff7e6;
  color: #9a5b04;
}

.admin-status.blocked {
  background: #feeceb;
  color: #b42318;
}

.admin-row-actions,
.admin-post-row {
  display: flex;
  align-items: center;
  gap: 7px;
}

.admin-row-actions button,
.admin-board-card a,
.admin-permission-card a {
  border: 1px solid #cfe2df;
  border-radius: 6px;
  background: #fff;
  color: #0f766e;
  font-size: 12px;
  font-weight: 800;
  padding: 6px 9px;
  text-decoration: none;
}

.admin-permission-grid,
.admin-board-list,
.admin-banner-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-permission-card,
.admin-board-card,
.admin-banner-grid article {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.admin-permission-row {
  display: grid;
  gap: 8px;
  border-top: 1px solid #eef4f3;
  padding-top: 12px;
}

.admin-permission-row div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.admin-permission-row label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #344054;
  font-size: 13px;
}

.admin-post-row {
  justify-content: space-between;
  border-top: 1px solid #eef4f3;
  padding-top: 11px;
}

.admin-post-row div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-post-row b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-empty {
  margin: 0;
  color: #667085;
}

.admin-banner-grid .portal-banner-slot {
  min-height: 190px;
}

.admin-settings-grid label {
  display: grid;
  gap: 8px;
  color: #344054;
  font-weight: 800;
}

.admin-note {
  border-left: 4px solid var(--teal);
  border-radius: 8px;
  background: #f1fbf9;
  color: #355d57;
  line-height: 1.7;
  padding: 14px 16px;
}

.resource-layout {
  display: grid;
  grid-template-columns: minmax(360px, 1fr) 300px;
  gap: 18px;
}

.resource-layout .panel-body {
  display: grid;
  gap: 16px;
}

.ranking .panel-body {
  gap: 0;
}

.rank-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  min-height: 54px;
  border-bottom: 1px solid #edf2f1;
}

.rank-row:last-child {
  border-bottom: 0;
}

.rank-row b {
  color: var(--teal-dark);
}

.rank-row span {
  font-size: 14px;
}

.rank-row small {
  color: var(--muted);
}

.question-search {
  max-width: 620px;
}

.recent-questions .panel-body {
  padding: 18px;
}

.upload-guide {
  display: grid;
  gap: 12px;
}

.upload-guide p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.upload-box {
  border: 1px dashed #9ddbd3;
  border-radius: 8px;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f6fffd;
}

.upload-box small {
  display: block;
  color: var(--muted);
  margin-top: 4px;
}

.upload-box input {
  margin-left: auto;
  max-width: 210px;
}

.embed-frame {
  width: 100%;
  min-height: 620px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.diff-tool {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.form-grid label {
  display: grid;
  gap: 7px;
  color: #344054;
  font-weight: 800;
  font-size: 13px;
}

.form-grid input,
.form-grid select,
.nurse-row input,
.nurse-row select {
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: white;
  color: var(--ink);
}

.form-note {
  min-height: 42px;
  border-radius: 8px;
  background: #effbf8;
  color: var(--teal-dark);
  display: flex;
  align-items: center;
  padding: 0 12px;
  font-weight: 800;
}

.metric.compact {
  padding: 12px;
}

.nurse-table {
  display: grid;
  gap: 8px;
}

.nurse-row {
  display: grid;
  grid-template-columns: 120px 1fr 130px 110px 90px 42px;
  gap: 8px;
  align-items: center;
}

.ngWeight {
  color: var(--teal-dark);
  font-weight: 900;
  text-align: right;
}

.form-help {
  margin: 12px 0 0;
  color: var(--muted);
  line-height: 1.6;
  font-size: 13px;
}

.result-panel .panel-body {
  display: grid;
  gap: 16px;
}

.grade-result {
  justify-self: start;
  min-width: 132px;
  border-radius: 8px;
  padding: 14px 22px;
  color: white;
  background: #0d47a1;
  font-size: 30px;
  font-weight: 900;
  text-align: center;
}

.grade-result.grade-A {
  background: #5c1e91;
}

.grade-result.grade-1 {
  background: #0d47a1;
}

.grade-result.grade-2 {
  background: #1976d2;
}

.grade-result.grade-3 {
  background: #2e7d32;
}

.grade-result.grade-4 {
  background: #f57f17;
}

.grade-result.grade-5 {
  background: #e65100;
}

.grade-result.grade-6 {
  background: #b71c1c;
}

.grade-result.pending {
  background: #667085;
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.kpi-grid div {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fbfcfe;
}

.kpi-grid small {
  display: block;
  color: var(--muted);
  margin-bottom: 6px;
}

.kpi-grid b {
  font-size: 20px;
}

.workspace:has(.cl-app) {
  padding: 18px 12px;
  background: #f5f7f6;
}

.cl-app {
  --cl-teal: #0d7f75;
  --cl-dark: #0b3f3a;
  --cl-gold: #b5894b;
  --cl-mint: #edf8f6;
  --cl-line: #d6e4e1;
  --cl-ink: #18252f;
  --cl-muted: #65727f;
  --cl-paper: #ffffff;
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--cl-ink);
}

.cl-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  align-items: end;
  gap: 24px;
  border-radius: 8px;
  padding: 28px 30px 26px;
  background:
    linear-gradient(115deg, rgba(10, 55, 51, .96), rgba(13, 127, 117, .9)),
    linear-gradient(180deg, #123b39, #0b2f2d);
  color: #fff;
  margin-bottom: 16px;
  box-shadow: 0 14px 36px rgba(15, 45, 44, .14);
}

.cl-kicker {
  display: block;
  margin-bottom: 9px;
  color: #cde7df;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
}

.cl-hero h1 {
  color: #fff;
  font-size: 33px;
  margin: 0 0 10px;
  letter-spacing: 0;
}

.cl-hero p {
  color: #ddf3ef;
  line-height: 1.6;
  margin: 0;
  max-width: 790px;
}

.cl-hero aside {
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 8px;
  padding: 15px 16px;
  background: rgba(255, 255, 255, .08);
  color: #ecfffb;
}

.cl-hero aside b {
  display: block;
  font-size: 34px;
  line-height: 1;
}

.cl-hero aside span,
.cl-hero aside small {
  display: block;
  margin-top: 6px;
}

.cl-hero aside small {
  color: #c5e4df;
}

.cl-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 170px;
  gap: 14px;
  margin-bottom: 15px;
}

.cl-search label {
  display: flex;
  align-items: center;
  min-width: 0;
  height: 52px;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: var(--cl-paper);
  box-shadow: 0 8px 22px rgba(25, 44, 43, .05);
}

.cl-search svg {
  flex: 0 0 auto;
  margin-left: 16px;
  color: var(--cl-teal);
}

.cl-search input {
  min-width: 0;
  width: 100%;
  height: 50px;
  border: 0;
  background: transparent;
  padding: 0 16px 0 10px;
  font: inherit;
  outline: 0;
}

.cl-search .primary-button {
  justify-content: center;
  border-radius: 8px;
  background: var(--cl-teal);
}

.cl-sync-panel {
  margin: 0 0 24px;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: var(--cl-paper);
  padding: 18px;
  box-shadow: 0 8px 24px rgba(22, 39, 38, .05);
}

.cl-sync-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: start;
  margin-bottom: 15px;
}

.cl-sync-head h2 {
  margin: 0 0 7px;
  font-size: 21px;
  letter-spacing: 0;
}

.cl-sync-head p {
  margin: 0;
  color: var(--cl-muted);
  line-height: 1.62;
}

.cl-sync-panel code {
  color: var(--cl-dark);
  font-weight: 800;
}

.cl-sync-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.cl-sync-grid article {
  border: 1px solid #e4eeec;
  border-radius: 8px;
  background: #fbfdfc;
  padding: 13px;
}

.cl-sync-grid b,
.cl-sync-grid span,
.cl-sync-grid small {
  display: block;
}

.cl-sync-grid b {
  color: var(--cl-dark);
  margin-bottom: 5px;
}

.cl-sync-grid span,
.cl-sync-grid small {
  color: var(--cl-muted);
  font-size: 12px;
}

.cl-sync-grid p {
  min-height: 42px;
  margin: 9px 0;
  color: #42515c;
  font-size: 13px;
  line-height: 1.55;
}

.cl-sync-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 13px;
}

.cl-sync-foot span {
  border: 1px solid #e1ebe9;
  border-radius: 999px;
  padding: 6px 10px;
  color: #50606a;
  font-size: 12px;
}

.cl-api-board {
  margin: 0 0 24px;
  border: 1px solid #d8e3df;
  border-radius: 8px;
  background: #ffffff;
  padding: 18px;
  box-shadow: 0 10px 26px rgba(22, 39, 38, .055);
}

.cl-api-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 18px;
  margin-bottom: 16px;
}

.cl-api-head h2 {
  margin: 0 0 7px;
  font-size: 21px;
  letter-spacing: 0;
}

.cl-api-head p {
  margin: 0;
  color: var(--cl-muted);
  line-height: 1.62;
}

.cl-api-state {
  flex: 0 0 auto;
  border: 1px solid #efd6a9;
  border-radius: 999px;
  background: #fff8ec;
  color: #8b5800;
  padding: 7px 11px;
  font-size: 12px;
  font-weight: 900;
}

.cl-api-state.ok {
  border-color: #bfe2dc;
  background: #edf8f6;
  color: var(--cl-dark);
}

.cl-api-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.cl-api-form label {
  display: grid;
  gap: 7px;
  color: #344054;
  font-size: 13px;
  font-weight: 800;
}

.cl-api-form label.wide {
  grid-column: 1 / -1;
}

.cl-api-form input,
.cl-api-form select,
.cl-api-form textarea {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: #fbfdfc;
  color: var(--cl-ink);
  font: inherit;
  outline-color: var(--cl-teal);
}

.cl-api-form input,
.cl-api-form select {
  height: 43px;
  padding: 0 12px;
}

.cl-api-form textarea {
  min-height: 70px;
  resize: vertical;
  padding: 11px 12px;
}

.cl-api-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.cl-api-actions span {
  color: var(--cl-muted);
  font-size: 12px;
}

.cl-api-note {
  margin-top: 13px;
  border-left: 4px solid var(--cl-gold);
  border-radius: 8px;
  background: #fffaf0;
  color: #604c28;
  padding: 11px 13px;
  font-size: 13px;
  line-height: 1.6;
}

.cl-ranking h2 {
  font-size: 29px;
  margin: 0 0 11px;
}

.cl-ranking > p {
  color: var(--cl-muted);
  margin: 0 0 22px;
}

.cl-tabs {
  display: flex;
  gap: 22px;
  border-bottom: 1px solid var(--cl-line);
  margin-bottom: 27px;
}

.cl-tabs button {
  min-height: 43px;
  border: 0;
  background: none;
  color: #334155;
  font-weight: 700;
  padding: 0;
}

.cl-tabs button.active {
  color: var(--cl-teal);
  border-bottom: 2px solid var(--cl-teal);
}

.cl-ranking h3 {
  font-size: 23px;
  margin: 0 0 18px;
}

.cl-table {
  overflow-x: auto;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: var(--cl-paper);
  box-shadow: 0 8px 22px rgba(25, 44, 43, .04);
}

.cl-table table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  font-size: 14px;
}

.cl-table th,
.cl-table td {
  height: 43px;
  padding: 0 12px;
  border-bottom: 1px solid #edf3f2;
  text-align: left;
}

.cl-table th {
  background: #fafbfc;
  color: var(--cl-muted);
  font-weight: 500;
}

.cl-table td:first-child {
  width: 80px;
  text-align: right;
}

.cl-policy-note {
  margin-top: 22px;
  padding: 16px 18px;
  border-left: 4px solid var(--cl-teal);
  border-radius: 7px;
  background: var(--cl-mint);
  color: #315b56;
  font-size: 13px;
}

.cl-results {
  display: grid;
  gap: 10px;
  margin: 0 0 22px;
}

.cl-results > p {
  color: var(--cl-muted);
  margin: 0 0 4px;
}

.cl-results article {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: var(--cl-paper);
  padding: 13px 16px;
  box-shadow: 0 8px 22px rgba(25, 44, 43, .04);
}

.cl-results article b {
  display: inline-block;
  margin-bottom: 5px;
}

.cl-results article span,
.cl-results article small {
  color: var(--cl-muted);
}

.cl-results article small {
  display: block;
}

.cl-drug-header {
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: var(--cl-paper);
  padding: 24px 26px;
  margin-bottom: 12px;
  box-shadow: 0 10px 28px rgba(20, 38, 59, .06);
}

.cl-pill {
  display: inline-block;
  margin: 0 7px 8px 0;
  border-radius: 18px;
  background: #e4f7f3;
  color: var(--cl-dark);
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 800;
}

.cl-pill.review {
  background: #fff3dc;
  color: #8b5800;
}

.cl-pill.sync {
  background: #eef2f6;
  color: #475467;
}

.cl-drug-header h2 {
  font-size: 28px;
  margin: 7px 0 11px;
}

.cl-drug-header h2 small {
  color: var(--cl-muted);
  font-size: 17px;
  font-weight: 500;
}

.cl-drug-header p {
  color: var(--cl-muted);
  line-height: 1.65;
  margin: 6px 0;
}

.cl-drug-header > strong {
  display: block;
  margin-top: 12px;
  line-height: 1.55;
  font-weight: 500;
}

.cl-anchor-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.cl-anchor-nav button {
  border: 1px solid #cfe5e1;
  border-radius: 7px;
  background: var(--cl-paper);
  color: var(--cl-dark);
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 700;
}

.cl-warning,
.cl-notice {
  margin-bottom: 13px;
  border-left: 4px solid #d09a35;
  border-radius: 7px;
  background: #fff8ec;
  color: #664d18;
  padding: 13px 16px;
  font-size: 13px;
  line-height: 1.65;
}

.cl-notice {
  border-left-color: var(--cl-teal);
  background: var(--cl-mint);
  color: #315b56;
}

.cl-class-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 24px;
  margin: 14px 0;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: var(--cl-paper);
  padding: 15px 18px;
}

.cl-class-row b {
  color: var(--cl-dark);
}

.cl-class-row span {
  color: var(--cl-muted);
}

.cl-class-row strong {
  color: var(--cl-ink);
}

.cl-report {
  margin: 12px 0;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  background: var(--cl-paper);
  padding: 19px 21px;
  box-shadow: 0 7px 20px rgba(20, 38, 59, .035);
}

.cl-report > span {
  display: block;
  color: var(--cl-teal);
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 6px;
  letter-spacing: 0;
}

.cl-report h3 {
  margin: 0 0 15px;
  font-size: 18px;
}

.cl-report h4 {
  margin: 17px 0 9px;
  font-size: 14px;
}

.cl-report ul {
  margin: 0;
  padding-left: 20px;
  color: #475467;
  line-height: 1.75;
}

.cl-report label {
  display: grid;
  gap: 8px;
  margin: 14px 0 12px;
  color: #344054;
  font-size: 14px;
  font-weight: 700;
}

.cl-report textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 78px;
  resize: vertical;
  border: 1px solid var(--cl-line);
  border-radius: 7px;
  padding: 11px;
  font: inherit;
  outline-color: var(--cl-teal);
}

.cl-diagnoses {
  display: grid;
  gap: 9px;
  margin-top: 13px;
}

.cl-diagnoses article,
.cl-reference,
.cl-same {
  border: 1px solid var(--cl-line);
  border-radius: 7px;
  background: #f9fcfb;
  padding: 13px 15px;
}

.cl-diagnoses p,
.cl-reference p,
.cl-same p {
  margin: 7px 0 0;
  color: #475467;
  line-height: 1.6;
  font-size: 13px;
}

.cl-diagnoses small {
  display: block;
  margin-top: 7px;
  color: #a05a29;
}

.cl-reference em {
  display: inline-block;
  margin-left: 8px;
  border-radius: 16px;
  background: #fff3dc;
  color: #8b5800;
  padding: 3px 7px;
  font-style: normal;
  font-size: 11px;
}

.cl-same {
  display: grid;
  gap: 5px;
  margin-bottom: 8px;
}

.cl-same small,
.cl-source small {
  color: var(--cl-muted);
}

.cl-source {
  border-top: 1px solid #edf3f2;
  margin: 0;
  padding: 12px 0;
  color: #475467;
}

.cl-source a {
  color: var(--cl-dark);
  font-weight: 700;
}

.cl-ai-message,
.cl-empty {
  color: var(--cl-muted);
  font-size: 13px;
}

.cl-ai-message {
  margin-top: 12px;
  border-radius: 7px;
  background: var(--cl-mint);
  padding: 11px 13px;
}

.dc-app {
  --dc-ink: #172826;
  --dc-teal: #0f8f82;
  --dc-teal-dark: #08766d;
  --dc-mint: #e7f6f3;
  --dc-line: #d5e7e3;
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--dc-ink);
}

.dc-app h2 {
  margin: 0 0 12px;
  font-size: 23px;
  letter-spacing: 0;
}

.dc-app h3 {
  letter-spacing: 0;
}

.dc-hero {
  border-radius: 18px;
  background: var(--dc-teal-dark);
  color: #f5fffd;
  padding: 22px 25px 20px;
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 28px;
}

.dc-eyebrow {
  color: #9ee3db;
  letter-spacing: 0;
  font-size: 12px;
  font-weight: 800;
}

.dc-hero h1 {
  color: white;
  margin: 7px 0 7px;
  font-size: 32px;
  letter-spacing: 0;
}

.dc-hero p {
  max-width: 700px;
  margin: 0;
  color: #d8eeeb;
  line-height: 1.58;
}

.dc-stamp {
  flex: 0 0 220px;
  padding: 13px 14px;
  border: 1px solid rgba(208, 244, 238, 0.33);
  border-radius: 12px;
  color: #ebf9f7;
  font-size: 13px;
  line-height: 1.65;
}

.dc-warning {
  padding: 13px 16px;
  border: 1px solid #f0d9a9;
  border-radius: 8px;
  background: #fffaf0;
  color: #604c28;
  font-size: 14px;
  line-height: 1.6;
}

.dc-warning.compact {
  margin-top: 12px;
  padding: 10px 12px;
}

.dc-module {
  margin: 22px 0 11px;
  color: var(--dc-teal);
  letter-spacing: 0;
  font-size: 12px;
  font-weight: 900;
}

.dc-guide-note {
  border: 1px solid var(--dc-line);
  background: #f1fbf9;
  border-radius: 8px;
  color: #385451;
  padding: 12px 15px;
  font-size: 14px;
  margin-bottom: 15px;
}

.dc-matrix-wrap {
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  background: white;
  overflow-x: auto;
  margin-bottom: 20px;
}

.dc-matrix {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 13px;
  text-align: center;
}

.dc-matrix th,
.dc-matrix td {
  min-width: 66px;
  height: 38px;
  border: 1px solid #edf3f2;
}

.dc-matrix th {
  background: #f7faf9;
  color: #475467;
  font-weight: 800;
}

.dc-matrix td.ok {
  color: #256d62;
  background: #f2fbf9;
}

.dc-matrix td.no {
  color: #af5c55;
  background: #fff9f8;
}

.dc-matrix td.none {
  color: #98a2b3;
  background: #f8f8f6;
}

.dc-matrix td.selected {
  color: #594926;
  background: #f5eacc;
  font-weight: 900;
}

.dc-matrix td.active-ok {
  color: white;
  background: var(--dc-teal);
  font-weight: 900;
}

.dc-matrix td.active-no {
  color: white;
  background: #cc6056;
  font-weight: 900;
}

.dc-columns {
  display: grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 28px;
}

.dc-review-card {
  border: 1px solid var(--dc-line);
  border-left: 5px solid #bc9360;
  border-radius: 8px;
  padding: 15px 17px;
  margin-bottom: 15px;
  background: white;
}

.dc-review-card.ok {
  border-left-color: var(--dc-teal);
}

.dc-review-card.no {
  border-left-color: #cc6056;
}

.dc-state {
  font-weight: 900;
  font-size: 14px;
}

.dc-review-card h4 {
  font-size: 17px;
  margin: 7px 0;
}

.dc-review-card p {
  margin: 6px 0;
  color: #526762;
  font-size: 14px;
  line-height: 1.55;
}

.dc-form,
.dc-expander {
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  background: white;
  padding: 17px;
}

.dc-form h3 {
  font-size: 16px;
  margin: 0 0 15px;
}

.dc-input-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.dc-form label,
.dc-expander label,
.dc-search-label {
  display: grid;
  gap: 7px;
  color: #344054;
  font-size: 14px;
  font-weight: 700;
}

.dc-form input[type="number"],
.dc-form select,
.dc-search-label select,
.dc-expander input[type="file"],
.dc-multiselect input {
  min-height: 43px;
  padding: 9px 11px;
  border: 1px solid var(--dc-line);
  border-radius: 7px;
  font: inherit;
  background: white;
}

.dc-form select,
.dc-search-label select {
  width: 100%;
  appearance: auto;
}

.dc-check {
  display: flex !important;
  align-items: center;
  gap: 8px !important;
  margin: 16px 0;
  font-weight: 500 !important;
}

.dc-check input {
  width: 16px;
  height: 16px;
}

.dc-submit {
  width: 100%;
  justify-content: center;
}

.dc-notes {
  margin-top: 16px;
  padding: 15px 17px;
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  background: #f7fdfc;
}

.dc-notes h3 {
  margin: 0 0 10px;
  font-size: 16px;
}

.dc-notes ul,
.dc-footer-columns ul {
  padding-left: 20px;
  margin: 0;
  color: #526762;
  line-height: 1.7;
}

.dc-tabs {
  margin-top: 17px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  background: white;
  overflow: hidden;
}

.dc-tabs > div {
  padding: 15px;
}

.dc-tabs > div + div {
  border-left: 1px solid var(--dc-line);
}

.dc-tabs h3 {
  margin: 0 0 12px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--dc-teal);
  font-size: 15px;
}

.dc-tabs p {
  margin: 9px 0;
  font-size: 13px;
}

.dc-tabs small {
  color: #697c77;
}

.dc-badge {
  border-radius: 100px;
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 800;
  display: inline-block;
  margin-right: 6px;
}

.dc-badge.ok {
  color: var(--dc-teal-dark);
  background: #ddf5f0;
}

.dc-badge.no {
  color: #a74741;
  background: #f7e5e3;
}

.dc-caption,
.dc-smallprint {
  color: #657771;
  font-size: 13px;
  line-height: 1.6;
}

.dc-multiselect {
  margin-top: 7px;
  min-height: 47px;
  padding: 5px;
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  background: white;
}

.dc-multiselect:focus-within {
  border-color: var(--dc-teal);
  box-shadow: 0 0 0 2px rgba(15, 143, 130, .12);
}

.dc-selected-products {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 3px 4px 5px;
}

.dc-selected-products button {
  border: 0;
  border-radius: 6px;
  background: var(--dc-mint);
  color: var(--dc-teal-dark);
  padding: 6px 8px;
  font-size: 13px;
}

.dc-selected-products button span {
  padding-left: 5px;
  font-weight: 800;
}

.dc-multiselect input {
  width: 100%;
  border: 0;
  outline: 0;
}

.dc-product-select {
  margin-top: 4px;
  padding: 8px;
  max-height: 230px;
  overflow: auto;
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  background: white;
}

.dc-product-select label {
  display: flex;
  gap: 9px;
  align-items: center;
  min-height: 37px;
  padding: 4px 8px;
  font-size: 14px;
  border-radius: 6px;
}

.dc-product-select label:hover {
  background: #eefbf8;
}

.dc-detail-title {
  margin: 18px 0 10px;
  font-size: 16px;
}

.dc-drug-card {
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  padding: 13px 14px;
  margin: 9px 0;
  background: white;
}

.dc-drug-card strong {
  display: block;
  color: var(--dc-teal-dark);
  margin-bottom: 5px;
}

.dc-price {
  display: block;
  color: var(--dc-teal);
  font-size: 19px;
  font-weight: 800;
  margin-bottom: 5px;
}

.dc-drug-card small {
  color: #5d716b;
  line-height: 1.55;
}

.dc-info {
  margin-top: 14px;
  padding: 13px 14px;
  border-radius: 8px;
  background: #eaf8f6;
  color: #365955;
  font-size: 14px;
  line-height: 1.55;
}

.dc-metric {
  margin-top: 12px;
  padding: 13px 15px;
  background: white;
  border: 1px solid var(--dc-line);
  border-radius: 8px;
  display: grid;
  gap: 5px;
}

.dc-metric small {
  color: #60736d;
}

.dc-metric b {
  color: var(--dc-teal-dark);
  font-size: 25px;
}

.dc-expander {
  margin-top: 16px;
  padding: 0;
}

.dc-expander summary {
  cursor: pointer;
  padding: 15px 17px;
  font-weight: 800;
}

.dc-expander p,
.dc-expander label,
.dc-expander a {
  margin: 0 17px 13px;
}

.dc-expander .soft-button {
  display: inline-flex;
}

.dc-upload-message {
  color: var(--dc-teal-dark) !important;
  font-weight: 800;
}

.dc-divider {
  margin: 28px 0 21px;
  border: 0;
  border-top: 1px solid var(--dc-line);
}

.dc-injection-columns {
  margin-top: 12px;
}

.dc-footer-columns {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 28px;
}

.dc-footer-columns h3 {
  margin: 0 0 12px;
  font-size: 17px;
}

.dc-footer-columns p {
  color: #526762;
  line-height: 1.65;
}

.dc-copyright {
  margin-top: 22px;
  padding: 18px 20px;
  border-top: 1px solid var(--dc-line);
  color: #50635e;
  font-size: 13px;
  line-height: 1.75;
  text-align: center;
}

.dx-app {
  --dx-accent: #0f8f82;
  --dx-dark: #08766d;
  --dx-line: #d7e8e4;
  --dx-panel: #fff;
  width: 100%;
  max-width: none;
  margin: 0;
  color: #172826;
}

.dx-masthead {
  padding: 27px 31px 25px;
  margin-bottom: 16px;
  border-radius: 18px;
  color: #f4fffd;
  background: linear-gradient(108deg, #095c55 0%, #08766d 58%, #0f9c8d 100%);
}

.dx-overline {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  opacity: .83;
}

.dx-masthead h1 {
  margin: 12px 0 10px;
  color: white;
  font-size: 33px;
  letter-spacing: 0;
}

.dx-masthead p {
  max-width: 850px;
  margin: 0;
  color: #e0f4f0;
  line-height: 1.6;
}

.dx-info {
  margin-bottom: 25px;
  padding: 14px 17px;
  border-radius: 8px;
  border: 1px solid #c9e4e0;
  background: #edf9f7;
  color: #355e59;
  font-size: 14px;
  line-height: 1.6;
}

.dx-columns {
  display: grid;
  grid-template-columns: 1.04fr .96fr;
  gap: 28px;
}

.dx-section-label {
  margin: 4px 0 14px;
  color: var(--dx-accent);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.dx-app h2 {
  margin: 0 0 9px;
  font-size: 27px;
  letter-spacing: 0;
}

.dx-caption {
  margin: 0 0 18px;
  color: #657873;
  font-size: 13px;
  line-height: 1.55;
}

.dx-form {
  padding: 17px;
  border: 1px solid var(--dx-line);
  border-radius: 10px;
  background: var(--dx-panel);
  display: grid;
  gap: 14px;
}

.dx-form h3 {
  margin: 5px 0 -5px;
  font-size: 17px;
  letter-spacing: 0;
}

.dx-form label,
.dx-tab-panel label {
  display: grid;
  gap: 7px;
  color: #344d49;
  font-size: 14px;
  font-weight: 700;
}

.dx-form input[type="number"],
.dx-form input[type="date"],
.dx-form select,
.dx-tab-panel input[type="number"],
.dx-tab-panel input[type="date"],
.dx-tab-panel input:not([type="checkbox"]):not([type="radio"]),
.dx-tab-panel select {
  min-width: 0;
  min-height: 43px;
  padding: 9px 11px;
  border: 1px solid var(--dx-line);
  border-radius: 7px;
  background: #fafdfc;
  color: #172826;
  font: inherit;
}

.dx-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.dx-inline-options {
  min-width: 0;
  border: 0;
  padding: 0;
  margin: 0;
}

.dx-inline-options legend,
.dx-options legend,
.dx-category-filter legend {
  padding: 0 0 7px;
  color: #344d49;
  font-size: 14px;
  font-weight: 700;
}

.dx-inline-options label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 9px 12px 0 0;
  font-weight: 500;
}

.dx-spine-rows {
  display: grid;
  grid-template-columns: .42fr .58fr;
  gap: 10px 12px;
}

.dx-hip-rows {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}

.dx-checkbox {
  display: flex !important;
  align-items: center;
  gap: 8px !important;
  font-weight: 500 !important;
  margin: 2px 0;
}

.dx-checkbox input,
.dx-inline-options input,
.dx-review-kind input,
.dx-options input,
.dx-category-filter input {
  width: 16px;
  height: 16px;
}

.dx-submit {
  justify-content: center;
  width: 100%;
}

.dx-divider {
  margin: 21px 0;
  border: 0;
  border-top: 1px solid var(--dx-line);
}

.dx-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  margin-bottom: 12px;
}

.dx-metrics > div {
  padding: 12px;
  border: 1px solid var(--dx-line);
  border-radius: 8px;
  background: #f8fcfb;
}

.dx-metrics small {
  display: block;
  color: #61766f;
  margin-bottom: 7px;
}

.dx-metrics b {
  color: var(--dx-dark);
  font-size: 22px;
}

.dx-result-card {
  padding: 14px 16px;
  margin: 12px 0;
  border: 1px solid var(--dx-line);
  border-left: 5px solid var(--dx-accent);
  border-radius: 8px;
  background: white;
  font-size: 15px;
}

.dx-result-card strong {
  color: var(--dx-dark);
}

.dx-result-card p {
  margin: 9px 0 0;
  color: #526963;
  font-size: 13px;
  line-height: 1.6;
}

.dx-warning {
  margin: 9px 0;
  padding: 11px 13px;
  border: 1px solid #ecd8ac;
  border-radius: 8px;
  background: #fffaf0;
  color: #644f29;
  font-size: 13px;
}

.dx-subheading {
  margin: 19px 0 10px;
  font-size: 16px;
  letter-spacing: 0;
}

.dx-message-list {
  margin: 0;
  padding-left: 19px;
  color: #4e6761;
  font-size: 14px;
  line-height: 1.7;
}

.dx-tabs {
  display: flex;
  gap: 5px;
  border-bottom: 1px solid var(--dx-line);
  margin-bottom: 14px;
}

.dx-tabs button {
  min-height: 44px;
  padding: 0 13px;
  border: 0;
  border-bottom: 3px solid transparent;
  background: transparent;
  color: #526963;
  font-weight: 700;
}

.dx-tabs button.active,
.dx-tabs button:hover {
  border-bottom-color: var(--dx-accent);
  color: var(--dx-dark);
}

.dx-tab-panel {
  display: grid;
  gap: 12px;
}

.dx-review-kind {
  display: flex;
  align-items: center;
  gap: 19px;
  margin: 1px 0 8px;
}

.dx-review-kind label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-weight: 500;
}

.dx-options {
  display: grid;
  gap: 9px;
  border: 1px solid var(--dx-line);
  border-radius: 8px;
  padding: 13px;
  margin: 0;
}

.dx-options label,
.dx-category-filter label {
  display: flex;
  gap: 8px;
  align-items: center;
  font-weight: 500;
}

.dx-docs {
  border: 1px solid var(--dx-line);
  border-radius: 8px;
  background: white;
  margin-top: 4px;
}

.dx-docs summary {
  cursor: pointer;
  padding: 13px 15px;
  font-weight: 700;
}

.dx-docs ul {
  color: #526963;
  margin: 0 18px 16px;
  padding-left: 20px;
  line-height: 1.7;
}

.dx-category-filter {
  display: flex;
  gap: 14px;
  align-items: center;
  border: 0;
  padding: 2px 0;
  margin: 0;
}

.dx-category-filter legend {
  display: block;
  width: 100%;
}

.dx-policy-card {
  display: grid;
  gap: 9px;
  padding: 15px 16px;
  border: 1px solid var(--dx-line);
  border-radius: 8px;
  background: white;
}

.dx-policy-card > span {
  justify-self: start;
  padding: 4px 9px;
  border-radius: 18px;
  color: var(--dx-dark);
  background: #e4f7f3;
  font-size: 12px;
  font-weight: 800;
}

.dx-policy-card h4 {
  margin: 0;
  font-size: 16px;
}

.dx-policy-card p {
  margin: 0;
  color: #435c56;
  font-size: 14px;
  line-height: 1.62;
}

.dx-policy-card small {
  color: #637770;
}

.dx-policy-card a,
.dx-source a {
  justify-self: start;
}

.dx-source {
  display: grid;
  gap: 9px;
  padding: 15px;
  border: 1px solid var(--dx-line);
  border-radius: 8px;
  background: white;
}

.dx-source p {
  margin: 0;
  color: #526963;
  font-size: 14px;
}

.dx-table-scroll {
  overflow-x: auto;
  border: 1px solid var(--dx-line);
  border-radius: 8px;
  background: #ffffff;
  margin: 10px 0 9px;
}

.dx-data-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 13px;
}

.dx-data-table th,
.dx-data-table td {
  padding: 10px 11px;
  border-bottom: 1px solid #e6f0ee;
  text-align: left;
  vertical-align: top;
}

.dx-data-table th {
  background: #08766d;
  color: #ffffff;
  font-weight: 800;
}

.dx-data-table tbody tr:nth-child(even) td {
  background: #f7fbfa;
}

.dx-data-table td.basis {
  border-left: 4px solid var(--dx-accent);
  background: #e6f5f2;
  color: #064f48;
  font-weight: 800;
}

.dx-copyright {
  margin-top: 22px;
  padding: 18px 20px;
  border-top: 1px solid var(--dx-line);
  color: #58716c;
  font-size: 13px;
  line-height: 1.75;
  text-align: center;
}

.hg-app {
  --hg-ink: #11273a;
  --hg-muted: #617181;
  --hg-navy: #08766d;
  --hg-teal: #0f8f82;
  --hg-mist: #eef9f7;
  --hg-line: #d8e8e5;
  --hg-active: #def5ef;
  --hg-warm: #faf8f2;
  display: grid;
  grid-template-columns: 238px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  width: 100%;
  margin: 0;
  color: var(--hg-ink);
}

.hg-input-panel {
  position: sticky;
  top: 0;
  padding: 18px 16px;
  border-radius: 8px;
  background: #f3f7f7;
}

.hg-input-panel h2 {
  margin: 0 0 18px;
  font-size: 21px;
  letter-spacing: 0;
}

.hg-input-panel h3 {
  margin: 0 0 12px;
  font-size: 15px;
  letter-spacing: 0;
}

.hg-input-panel label {
  display: grid;
  gap: 7px;
  margin-bottom: 15px;
  color: #42595b;
  font-size: 14px;
}

.hg-input-panel input {
  min-height: 43px;
  width: 100%;
  padding: 9px 11px;
  border: 1px solid #e0e8e8;
  border-radius: 7px;
  background: white;
  color: var(--hg-ink);
  font: inherit;
}

.hg-input-panel p {
  margin: 3px 0 21px;
  color: var(--hg-muted);
  font-size: 13px;
  line-height: 1.65;
}

.hg-input-panel hr {
  margin: 0 0 21px;
  border: 0;
  border-top: 1px solid #d2dddd;
}

.hg-input-panel ul {
  padding-left: 19px;
  margin: 0;
  color: #4e6269;
  font-size: 13px;
  line-height: 1.8;
}

.hg-output {
  min-width: 0;
}

.hg-sheet {
  box-sizing: border-box;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 28px 40px;
  background: white;
  color: var(--hg-ink);
  box-shadow: 0 8px 32px rgba(17, 39, 58, .1);
  font-family: "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
}

.hg-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 2px solid var(--hg-navy);
  padding-bottom: 3mm;
}

.hg-eyebrow {
  color: var(--hg-teal);
  letter-spacing: 0;
  font-size: 8px;
  font-weight: 700;
  margin: 0 0 3px;
}

.hg-sheet h1 {
  color: var(--hg-navy);
  font-size: 21px;
  letter-spacing: 0;
  line-height: 1.15;
  margin: 0 0 3px;
}

.hg-subtitle {
  color: var(--hg-muted);
  font-size: 10px;
  margin: 0;
}

.hg-reference {
  min-width: 111px;
  padding: 7px 10px;
  border-radius: 8px;
  background: var(--hg-mist);
  text-align: right;
}

.hg-reference span,
.hg-reference small {
  display: block;
  color: var(--hg-muted);
  font-size: 9px;
}

.hg-reference strong {
  display: block;
  color: var(--hg-navy);
  font-size: 14px;
  margin: 2px 0;
}

.hg-patient-card {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  margin-top: 3.5mm;
  border: 1px solid var(--hg-line);
  border-radius: 8px;
}

.hg-patient-card div {
  padding: 7px 10px;
  border-right: 1px solid var(--hg-line);
}

.hg-patient-card div:last-child {
  border-right: 0;
}

.hg-patient-card span {
  display: block;
  color: var(--hg-muted);
  font-size: 9px;
  margin-bottom: 3px;
}

.hg-patient-card strong {
  display: block;
  overflow: hidden;
  color: var(--hg-ink);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hg-section-title {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin: 4mm 0 2mm;
}

.hg-section-title h2,
.hg-qa-section h2 {
  margin: 0;
  color: var(--hg-navy);
  font-size: 14px;
  letter-spacing: 0;
}

.hg-section-title p {
  color: var(--hg-muted);
  font-size: 9px;
  margin: 0;
}

.hg-status-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.hg-status-grid article {
  min-height: 48px;
  padding: 7px 10px;
  border-radius: 8px;
  color: white;
  background: var(--hg-navy);
}

.hg-status-grid label {
  display: block;
  color: #c3e5e0;
  font-size: 9px;
  margin-bottom: 3px;
}

.hg-status-grid strong {
  display: block;
  font-size: 13px;
}

.hg-status-grid small {
  color: #d0eee9;
  font-size: 8px;
}

.hg-rules-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-top: 7px;
}

.hg-rule-panel {
  border: 1px solid var(--hg-line);
  border-radius: 8px;
  padding: 7px 8px;
}

.hg-rule-panel h3 {
  margin: 0 0 5px;
  color: var(--hg-navy);
  font-size: 11px;
  letter-spacing: 0;
}

.hg-rule-panel h3 em {
  float: right;
  color: var(--hg-teal);
  font-size: 9px;
  font-style: normal;
}

.hg-rule-panel table {
  width: 100%;
  border-collapse: collapse;
  font-size: 9px;
}

.hg-rule-panel td {
  padding: 3px;
  border-top: 1px solid #e9efee;
}

.hg-rule-panel td:last-child {
  text-align: right;
  font-weight: 700;
  white-space: nowrap;
}

.hg-rule-panel tr.current {
  color: #075b55;
  background: var(--hg-active);
}

.hg-badge {
  margin-left: 4px;
  padding: 1px 4px;
  border-radius: 9px;
  color: white;
  background: var(--hg-teal);
  font-size: 7px;
}

.hg-ict-heading {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hg-ict-heading b {
  color: #075b55;
  font-size: 11px;
}

.hg-ict-heading em {
  margin-left: auto;
}

.hg-ict-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 3px;
  border-top: 1px solid #e9efee;
  font-size: 9px;
}

.hg-ict-row span {
  color: var(--hg-muted);
}

.hg-qa-section {
  margin-top: 9px;
}

.hg-qa-section h2 {
  margin-bottom: 6px;
  font-size: 12px;
}

.hg-qa-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 8px;
}

.hg-qa-grid article {
  min-height: 44px;
  padding: 7px 8px;
  border-radius: 6px;
  background: #f5f9f8;
}

.hg-qa-grid article.wide {
  grid-column: 1 / 3;
}

.hg-qa-grid h4 {
  margin: 0 0 5px;
  color: var(--hg-navy);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0;
}

.hg-qa-grid p {
  margin: 0;
  color: #4c5e69;
  font-size: 8px;
  line-height: 1.55;
}

.hg-qa-grid .alert {
  color: #c62828;
}

.hg-notice {
  display: flex;
  gap: 8px;
  margin-top: 7px;
  padding: 5px 7px;
  border-left: 2px solid #c79d42;
  border-radius: 6px;
  background: var(--hg-warm);
}

.hg-notice strong {
  flex-shrink: 0;
  color: #6e5116;
  font-size: 8px;
}

.hg-notice p {
  margin: 0;
  color: #5c5660;
  font-size: 7px;
  line-height: 1.35;
}

.hg-footer {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 6px;
  padding-top: 5px;
  border-top: 1px solid var(--hg-line);
  color: var(--hg-muted);
  font-size: 7px;
  line-height: 1.3;
}

.hg-error {
  display: grid;
  gap: 8px;
  padding: 20px;
  border-radius: 8px;
  border: 1px solid #efd5d2;
  color: #a53e38;
  background: #fff6f5;
}

.hg-error span {
  color: #6e5957;
}

.ng-app {
  width: 100%;
  max-width: none;
  margin: 0;
  color: #111827;
}

.ng-main-title {
  font-size: 24px;
  font-weight: 800;
  color: #086b65;
  border-bottom: 3px solid #078d83;
  padding-bottom: 10px;
  margin-bottom: 16px;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px;
}

.ng-creator {
  font-size: 13px;
  color: #888;
  font-weight: 500;
}

.ng-section-title {
  font-size: 15px;
  font-weight: 700;
  color: #086b65;
  background: #edf9f7;
  border-left: 5px solid #078d83;
  padding: 7px 12px;
  margin: 14px 0 8px;
  border-radius: 0 6px 6px 0;
}

.ng-upload {
  border: 1px solid #e3e8ef;
  border-radius: 8px;
  margin-bottom: 14px;
  background: white;
}

.ng-upload summary,
.ng-details summary {
  cursor: pointer;
  padding: 13px 16px;
  font-weight: 700;
}

.ng-upload-inside {
  padding: 0 16px 16px;
  display: grid;
  gap: 12px;
}

.ng-blue-note {
  background: #edf9f7;
  border: 1px solid #b7dfd9;
  border-radius: 8px;
  padding: 12px 16px;
  font-size: 13px;
  line-height: 1.7;
}

.ng-blue-note mark {
  background: #fff9c4;
  padding: 1px 4px;
  border-radius: 3px;
}

.ng-file-label {
  display: grid;
  gap: 7px;
  font-weight: 700;
  color: #344054;
}

.ng-file-label input {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}

.ng-upload-message,
.ng-report-message {
  color: #08745f;
  font-weight: 700;
}

.ng-columns {
  display: grid;
  gap: 12px;
}

.ng-columns.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ng-columns.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ng-columns label,
.ng-columns > div {
  display: grid;
  gap: 7px;
  font-size: 14px;
}

.ng-columns input,
.ng-columns select,
.ng-data-row input,
.ng-data-row select {
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 10px;
  background: white;
}

.ng-columns small {
  color: #777;
}

.ng-info {
  margin: 10px 0;
  border-radius: 6px;
  padding: 11px 14px;
  color: #086b65;
  background: #edf9f7;
}

.ng-yellow-note {
  background: #fffde7;
  border: 1px solid #f9a825;
  border-radius: 6px;
  padding: 7px 12px;
  font-size: 12px;
  color: #5d4037;
  margin-bottom: 8px;
}

.ng-kpi-value {
  font-size: 20px;
  font-weight: 700;
  color: #086b65;
}

.night-value {
  color: #078d83;
}

.ng-row-actions {
  display: flex;
  gap: 10px;
  margin: 8px 0;
}

.ng-row-actions button {
  border: 1px solid #d6dee9;
  border-radius: 8px;
  background: white;
  min-height: 40px;
  padding: 0 14px;
}

.ng-table-head,
.ng-data-row {
  display: grid;
  gap: 8px;
  align-items: center;
  margin-bottom: 7px;
}

.ng-table-head.daytime,
.ng-data-row.daytime {
  grid-template-columns: 42px repeat(5, minmax(0, 1fr));
}

.ng-table-head.night,
.ng-data-row.night {
  grid-template-columns: 42px repeat(6, minmax(0, 1fr));
}

.ng-data-row .d-days,
.ng-data-row .d-weight {
  color: #078d83;
  font-weight: 600;
}

.ng-data-row .n-days,
.ng-data-row .n-weight {
  color: #086b65;
  font-weight: 600;
}

.ng-result-card {
  background: #f3fbf9;
  border: 1.5px solid #b8dfd9;
  border-radius: 10px;
  padding: 14px 20px;
  margin: 8px 0;
}

.ng-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.ng-kpis .ng-result-card {
  display: grid;
  gap: 3px;
  text-align: center;
  padding: 12px 8px;
}

.ng-kpis small {
  font-size: 12px;
  color: #555;
}

.ng-kpis b {
  font-size: 20px;
  color: #086b65;
}

.ng-grade-wrap {
  display: grid;
  justify-items: center;
  gap: 8px;
  margin: 20px 0;
  border-top: 1px solid #e5e7eb;
  padding-top: 14px;
}

.grade-box {
  display: inline-block;
  font-size: 34px;
  font-weight: 900;
  padding: 12px 32px;
  border-radius: 12px;
  color: white;
  margin: 4px 0;
}

.grade-box.grade-A { background: #086b65; }
.grade-box.grade-1 { background: #078d83; }
.grade-box.grade-2 { background: #27a393; }
.grade-box.grade-3 { background: #39a66c; }
.grade-box.grade-4 { background: #f57f17; }
.grade-box.grade-5 { background: #e65100; }
.grade-box.grade-6 { background: #b71c1c; }

.ng-details {
  margin: 14px 0;
  border: 1px solid #e3e8ef;
  border-radius: 8px;
  background: white;
}

.ng-details > div {
  padding: 0 12px 12px;
}

.ng-ai-button {
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: 8px;
  color: white;
  background: #078d83;
  font-weight: 800;
  margin: 8px 0;
}

.ng-report-actions {
  display: flex;
  justify-content: center;
  margin: 12px 0 18px;
}

.ng-download-report {
  min-width: 260px;
  min-height: 46px;
  border: 1px solid rgba(7, 141, 131, .28);
  border-radius: 8px;
  background: linear-gradient(135deg, #078d83, #0fb2a2);
  color: #fff;
  box-shadow: 0 14px 28px rgba(7, 141, 131, .2);
  font-weight: 900;
  cursor: pointer;
}

.ng-download-report:hover {
  filter: brightness(1.05);
}

.ng-footer {
  text-align: center;
  color: #555;
  font-size: 13px;
  border-top: 1px solid #ddd;
  padding-top: 12px;
  margin-top: 30px;
}

.workspace:has(.md-app) {
  padding: 18px 12px;
}

.md-app {
  --md-teal: #078d83;
  --md-dark: #086b65;
  --md-mint: #edf9f7;
  --md-line: #d8e9e6;
  --md-ink: #11243b;
  --md-muted: #64748b;
  display: grid;
  grid-template-columns: 265px minmax(0, 1fr);
  gap: 22px;
  width: 100%;
  color: var(--md-ink);
}

.md-stage,
.md-panel,
.md-intro {
  min-width: 0;
}

.md-controls {
  height: fit-content;
  position: sticky;
  top: 20px;
  border: 1px solid var(--md-line);
  border-radius: 8px;
  background: #fff;
  padding: 18px 15px;
}

.md-control-title {
  display: flex;
  gap: 10px;
  border-bottom: 1px solid var(--md-line);
  color: var(--md-dark);
  padding-bottom: 15px;
  margin-bottom: 17px;
}

.md-control-title .icon {
  width: 25px;
  height: 25px;
}

.md-control-title strong,
.md-control-title span {
  display: block;
}

.md-control-title strong {
  font-size: 18px;
}

.md-control-title span {
  margin-top: 3px;
  color: var(--md-muted);
  font-size: 12px;
}

.md-controls > label {
  display: grid;
  gap: 8px;
  margin: 14px 0;
  color: #334155;
  font-size: 14px;
  font-weight: 700;
}

.md-controls input[type="text"],
.md-controls input[type="password"],
.md-controls input:not([type]),
.md-controls select {
  width: 100%;
  box-sizing: border-box;
  height: 42px;
  border: 1px solid var(--md-line);
  border-radius: 6px;
  padding: 0 10px;
  font: inherit;
}

.md-plan-card {
  display: grid;
  gap: 7px;
  border: 1px solid #bfe2dc;
  border-radius: 7px;
  background: var(--md-mint);
  padding: 12px;
  margin: -5px 0 14px;
}

.md-plan-card strong {
  justify-self: start;
  border-radius: 16px;
  background: var(--md-teal);
  color: #fff;
  padding: 3px 9px;
  font-size: 11px;
}

.md-plan-card span {
  color: #315b56;
  font-size: 12px;
}

.md-api {
  border-top: 1px solid var(--md-line);
  border-bottom: 1px solid var(--md-line);
  padding: 12px 0;
  margin: 15px 0;
}

.md-api summary {
  cursor: pointer;
  color: var(--md-dark);
  font-size: 13px;
  font-weight: 800;
}

.md-api label {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.md-api small {
  display: block;
  color: var(--md-muted);
  font-size: 11px;
  line-height: 1.5;
  margin-top: 10px;
}

.md-check {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 8px !important;
  margin-top: 20px !important;
}

.md-check input {
  accent-color: var(--md-teal);
}

.md-file input {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  border: 1px dashed #b7dbd6;
  border-radius: 7px;
  background: var(--md-mint);
  color: var(--md-muted);
  padding: 9px 7px;
  font-size: 12px;
  font-weight: 500;
}

.md-file input::file-selector-button {
  max-width: 98px;
  margin-right: 6px;
  border: 1px solid #c5ddd9;
  border-radius: 5px;
  background: #fff;
  color: #334155;
  padding: 6px 8px;
  font-size: 12px;
}

.md-file.disabled {
  opacity: .54;
}

.md-template,
.md-run {
  width: 100%;
  box-sizing: border-box;
  justify-content: center;
  margin-top: 12px;
}

.md-run .icon {
  width: 16px;
  height: 16px;
}

.md-side-note {
  margin: 18px 0 0;
  border-radius: 7px;
  background: var(--md-mint);
  color: var(--md-muted);
  padding: 12px;
  font-size: 12px;
  line-height: 1.55;
}

.md-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 16px;
  border-radius: 8px;
  background: linear-gradient(120deg, #057d76, #14a292);
  color: #fff;
  padding: 23px 28px;
}

.md-header span {
  display: block;
  margin-bottom: 6px;
  color: #ccf4ef;
  font-size: 11px;
  font-weight: 700;
}

.md-header h1 {
  margin: 0 0 7px;
  color: #fff;
  font-size: 25px;
}

.md-header p {
  margin: 0;
  opacity: .9;
  font-size: 13px;
}

.md-header > b {
  border: 1px solid rgba(255, 255, 255, .42);
  padding: 9px 13px;
  font-size: 12px;
}

.md-success,
.md-error {
  margin-bottom: 14px;
  border-radius: 7px;
  background: var(--md-mint);
  color: var(--md-dark);
  padding: 12px 15px;
  font-size: 14px;
}

.md-error {
  background: #fff1f2;
  color: #b42318;
}

.md-intro-banner {
  border-radius: 8px;
  background: linear-gradient(115deg, #0b514a, #087e76);
  color: #d7f5f0;
  padding: 27px 29px;
  margin-bottom: 24px;
}

.md-intro-banner p {
  margin: 0 0 8px;
  color: #8ee2d7;
  font-size: 11px;
  font-weight: 800;
}

.md-intro-banner h2 {
  margin: 0 0 9px;
  color: #fff;
  font-size: 24px;
}

.md-intro-banner span {
  line-height: 1.6;
}

.md-intro h3 {
  margin: 0 0 15px;
  font-size: 18px;
}

.md-guide-table,
.md-table {
  overflow-x: auto;
  border: 1px solid var(--md-line);
  border-radius: 8px;
  background: #fff;
}

.md-guide-table table,
.md-table table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  font-size: 13px;
}

.md-guide-table th,
.md-table th {
  background: var(--md-dark);
  color: #fff;
  padding: 11px 12px;
  text-align: left;
}

.md-guide-table td,
.md-table td {
  border-bottom: 1px solid #edf3f2;
  padding: 11px 12px;
}

.md-guide-table tr:nth-child(even),
.md-table tr:nth-child(even) {
  background: #f7fbfa;
}

.md-tip {
  margin-top: 15px;
  border-left: 4px solid var(--md-teal);
  border-radius: 6px;
  background: var(--md-mint);
  color: #315b56;
  padding: 14px 17px;
  font-size: 14px;
}

.md-tabs {
  display: flex;
  overflow-x: auto;
  gap: 2px;
  border-bottom: 1px solid var(--md-line);
  margin-bottom: 18px;
}

.md-tabs button {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: var(--md-muted);
  min-height: 45px;
  padding: 0 16px;
  font-weight: 700;
}

.md-tabs button.active {
  border-bottom: 3px solid var(--md-teal);
  color: var(--md-dark);
}

.md-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 20px;
}

.md-kpis article {
  display: grid;
  gap: 7px;
  border: 1px solid var(--md-line);
  border-left: 4px solid var(--md-teal);
  border-radius: 7px;
  background: #fff;
  padding: 14px;
}

.md-kpis article.score {
  background: var(--md-mint);
}

.md-kpis small,
.md-kpis span {
  color: var(--md-muted);
  font-size: 12px;
}

.md-kpis b {
  font-size: 22px;
}

.md-status {
  justify-self: start;
  border-radius: 16px;
  padding: 3px 9px;
  font-size: 11px !important;
  font-weight: 800;
}

.md-status.good {
  background: #e6f7f0;
  color: #16794d;
}

.md-status.warn {
  background: #fff3dc;
  color: #8b5800;
}

.md-status.bad {
  background: #feecea;
  color: #b42318;
}

.md-dashboard-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 14px;
  margin-bottom: 14px;
}

.md-panel {
  margin-bottom: 14px;
  border: 1px solid var(--md-line);
  border-radius: 8px;
  background: #fff;
  padding: 18px;
}

.md-panel h2,
.md-panel h3 {
  margin: 0 0 16px;
}

.md-section-header {
  border-left: 4px solid var(--md-teal);
  border-radius: 0 7px 7px 0;
  background: var(--md-mint);
  color: var(--md-dark);
  padding: 11px 14px;
  margin: 0 0 16px;
  font-size: 18px;
  font-weight: 800;
}

.md-analysis > .md-section-header:not(:first-child) {
  margin-top: 20px;
}

.md-summary-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 17px;
}

.md-summary-cards article {
  display: grid;
  gap: 8px;
  border: 1px solid var(--md-line);
  border-left: 4px solid var(--md-teal);
  border-radius: 7px;
  background: #fff;
  padding: 15px;
}

.md-summary-cards small,
.md-summary-cards span {
  color: var(--md-muted);
  font-size: 12px;
}

.md-summary-cards b {
  font-size: 20px;
}

.md-dual {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.md-dual .md-table table {
  min-width: 620px;
}

.md-structure {
  display: grid;
  gap: 11px;
  margin: 8px 0 20px;
}

.md-structure div {
  position: relative;
  display: flex;
  justify-content: space-between;
  overflow: hidden;
  border-radius: 6px;
  background: #eff6f5;
  padding: 12px 14px;
}

.md-structure div::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--ratio);
  background: #d3f0eb;
}

.md-structure .non::before {
  background: #e6f6f3;
}

.md-structure b,
.md-structure span {
  position: relative;
}

.md-advice {
  border-left: 3px solid var(--md-teal);
  color: #475467;
  padding-left: 13px;
  line-height: 1.7;
}

.md-gauge-track {
  position: relative;
  height: 18px;
  margin: 27px 0 13px;
  border-radius: 14px;
  background: linear-gradient(90deg, #c9ede2 0 56%, #f9edbd 56% 69%, #fad8b7 69% 82%, #f6c4c1 82%);
}

.md-gauge-track i {
  position: absolute;
  top: -7px;
  width: 3px;
  height: 32px;
  background: var(--md-dark);
}

.md-gauge-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  color: var(--md-muted);
  font-size: 11px;
  margin-bottom: 23px;
}

.md-gauge strong {
  display: block;
  color: var(--md-dark);
  font-size: 22px;
  margin-bottom: 10px;
}

.md-gauge p {
  color: var(--md-muted);
  font-size: 13px;
  line-height: 1.65;
}

.md-disease > div {
  position: relative;
  display: grid;
  gap: 6px;
  padding: 11px 0;
  border-bottom: 1px solid #edf3f2;
}

.md-disease span,
.md-disease p {
  color: var(--md-muted);
  font-size: 13px;
}

.md-disease i {
  display: block;
  height: 7px;
  border-radius: 6px;
  background: #57bdb2;
}

.md-executive {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.md-executive h3 {
  grid-column: 1 / -1;
}

.md-executive div {
  border-left: 3px solid #8fd8d0;
  padding-left: 13px;
}

.md-executive p {
  color: #475467;
  line-height: 1.6;
  font-size: 13px;
}

.md-caption {
  margin: -7px 0 17px;
  color: var(--md-muted);
  font-size: 13px;
}

.md-score-row {
  display: grid;
  grid-template-columns: 88px 1fr 32px;
  align-items: center;
  gap: 9px;
  margin: 14px 0;
  font-size: 13px;
}

.md-score-row div {
  height: 8px;
  border-radius: 10px;
  background: #edf3f2;
}

.md-score-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--md-teal);
}

.md-month-chart {
  display: flex;
  align-items: end;
  height: 158px;
  gap: 11px;
}

.md-month-chart div {
  display: grid;
  justify-items: center;
  gap: 6px;
  flex: 1;
}

.md-month-chart i {
  width: 100%;
  border-radius: 4px 4px 0 0;
  background: #39b8aa;
}

.md-month-chart small {
  color: var(--md-muted);
  font-size: 11px;
}

.md-dashboard-viz {
  grid-template-columns: .82fr 1.45fr;
}

.md-visual {
  width: 100%;
  min-width: 0;
}

.md-radar {
  display: grid;
  place-items: center;
  height: 270px;
}

.md-radar svg {
  width: min(100%, 290px);
  height: 100%;
  overflow: visible;
}

.md-radar .grid polygon,
.md-radar .grid line {
  fill: none;
  stroke: #d5e6e3;
  stroke-width: 1;
}

.md-radar .shape {
  fill: rgb(7 141 131 / 18%);
  stroke: var(--md-teal);
  stroke-width: 2.5;
}

.md-radar text {
  fill: #516579;
  font-size: 10px;
  font-weight: 700;
}

.md-sales svg {
  display: block;
  width: 100%;
  height: auto;
  min-height: 220px;
}

.md-chart-grid line {
  stroke: #e8efee;
  stroke-width: 1;
}

.md-chart-grid text {
  fill: #718096;
  font-size: 9px;
  text-anchor: end;
}

.md-sales .covered {
  fill: #086b65;
}

.md-sales .private {
  fill: #72c9b9;
}

.md-sales .total-line {
  fill: none;
  stroke: #e28435;
  stroke-width: 2.5;
}

.md-sales .covered-line {
  fill: none;
  stroke: #086b65;
  stroke-width: 2.3;
}

.md-sales .private-line {
  fill: none;
  stroke: #47b5a8;
  stroke-width: 2.3;
}

.md-sales .month {
  fill: #718096;
  font-size: 9px;
  text-anchor: middle;
}

.md-chart-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  margin-top: 8px;
  color: #526476;
  font-size: 12px;
}

.md-chart-legend span::before {
  content: "";
  display: inline-block;
  width: 11px;
  height: 8px;
  margin-right: 6px;
  border-radius: 2px;
  background: var(--legend, #078d83);
}

.md-chart-legend span.covered::before {
  background: #086b65;
}

.md-chart-legend span.private::before {
  background: #72c9b9;
}

.md-chart-legend span.total::before,
.md-chart-legend span.covered-line::before,
.md-chart-legend span.private-line::before {
  height: 2px;
  vertical-align: middle;
}

.md-chart-legend span.total::before {
  background: #e28435;
}

.md-chart-legend span.covered-line::before {
  background: #086b65;
}

.md-chart-legend span.private-line::before {
  background: #47b5a8;
}

.md-chart-legend span.visit::before {
  background: #0b8c82;
}

.md-chart-legend span.new::before {
  background: #87ddd3;
}

.md-donut-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
  min-height: 220px;
}

.md-donut {
  position: relative;
  display: grid;
  place-items: center;
  width: 172px;
  aspect-ratio: 1;
  border-radius: 50%;
}

.md-donut::after {
  content: "";
  position: absolute;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(8, 41, 50, .08);
}

.md-donut b,
.md-donut small {
  position: absolute;
  z-index: 1;
}

.md-donut b {
  margin-top: -16px;
  color: var(--md-ink);
  font-size: 18px;
  font-weight: 900;
}

.md-donut small {
  margin-top: 22px;
  color: #475467;
  font-weight: 800;
}

.md-donut-legend {
  display: grid;
  gap: 10px;
}

.md-donut-legend div {
  display: grid;
  grid-template-columns: 12px 90px auto;
  gap: 7px;
  align-items: center;
  color: var(--md-ink);
  font-size: 12px;
  font-weight: 800;
}

.md-donut-legend i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.md-donut-legend b {
  color: var(--md-ink);
  font-weight: 900;
}

.md-vertical-chart,
.md-stack-chart {
  display: flex;
  align-items: end;
  gap: 10px;
  height: 198px;
  padding: 18px 10px 6px;
  border-bottom: 1px solid var(--md-line);
}

.md-vertical-chart > div,
.md-stack-col {
  display: grid;
  flex: 1;
  align-items: end;
  justify-items: center;
  gap: 8px;
  height: 100%;
}

.md-vertical-chart .column {
  display: flex;
  align-self: end;
  align-items: end;
  width: 100%;
  max-width: 34px;
  overflow: hidden;
  border-radius: 3px 3px 0 0;
  background: #0b8c82;
}

.md-vertical-chart .column i {
  display: block;
  width: 100%;
  background: #87ddd3;
}

.md-vertical-chart small,
.md-stack-col small {
  min-height: 12px;
  color: var(--md-muted);
  font-size: 10px;
}

.md-stack-col > div {
  display: flex;
  flex-direction: column-reverse;
  align-self: end;
  width: 100%;
  max-width: 36px;
  overflow: hidden;
  border-radius: 3px 3px 0 0;
}

.md-stack-col i {
  display: block;
  width: 100%;
}

.md-cost > div {
  display: grid;
  grid-template-columns: 108px 140px 1fr;
  align-items: center;
  gap: 15px;
  margin: 13px 0;
  font-size: 13px;
}

.md-cost-summary > div {
  grid-template-columns: 108px 150px 1fr 52px;
}

.md-cost-summary strong {
  color: var(--md-dark);
  font-size: 13px;
  text-align: right;
}

.md-scenario-chart {
  display: grid;
  gap: 18px;
  padding: 12px 0;
}

.md-scenario-chart article {
  display: grid;
  grid-template-columns: 150px 1fr 90px 55px;
  gap: 10px;
  align-items: center;
  font-size: 13px;
}

.md-scenario-chart article div {
  height: 16px;
  overflow: hidden;
  border-radius: 10px;
  background: #eef3f2;
}

.md-scenario-chart article i {
  display: block;
  height: 100%;
  border-radius: 10px;
  background: #078d83;
}

.md-scenario-chart article div.negative i {
  background: #d65e58;
}

.md-scenario-chart strong.negative {
  color: #b42318;
}

.md-cost em {
  height: 10px;
  min-width: 2px;
  border-radius: 8px;
  background: #70cfc3;
}

.md-profit {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.md-profit div {
  display: grid;
  gap: 8px;
  border-radius: 7px;
  background: var(--md-mint);
  padding: 18px;
}

.md-profit small {
  color: var(--md-muted);
}

.md-ai article,
.md-report article {
  border-left: 4px solid var(--md-teal);
  border-radius: 6px;
  background: var(--md-mint);
  padding: 13px 16px;
  margin: 10px 0;
}

.md-ai article p,
.md-report article p {
  margin: 7px 0;
  color: #475467;
}

.md-ai article span,
.md-report article small {
  color: var(--md-dark);
}

.md-ai-engines {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  border: 1px solid #bfe2dc;
  border-radius: 7px;
  background: var(--md-mint);
  padding: 13px 15px;
  margin-bottom: 15px;
}

.md-ai-engines span {
  border-radius: 16px;
  background: #fff;
  color: var(--md-dark);
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
}

.md-engine {
  display: grid;
  gap: 10px;
  border-left-color: var(--md-teal) !important;
  background: #fff !important;
  border: 1px solid var(--md-line);
}

.md-engine header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.md-engine header span {
  border-radius: 13px;
  background: #fff3dc;
  color: #8b5800;
  padding: 3px 9px;
  font-size: 11px;
}

.md-engine button {
  justify-self: start;
}

.md-ai-note {
  color: var(--md-muted);
  font-size: 12px;
  margin-top: 16px;
}

.md-report {
  border: 1px solid var(--md-line);
  border-radius: 8px;
  background: #fff;
  padding: 24px;
}

.md-report-cover {
  border-radius: 8px;
  background: linear-gradient(115deg, #086b65, #11998e);
  color: #fff;
  padding: 23px 26px;
  margin: -24px -24px 23px;
}

.md-report-cover span {
  color: #bfeee8;
  font-size: 11px;
  font-weight: 800;
}

.md-report-cover h2 {
  color: #fff;
  text-align: left;
  margin: 8px 0 5px;
}

.md-report-cover p {
  color: #dcf7f3;
  text-align: left;
  margin: 0;
}

.md-report-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 18px;
}

.md-report-kpis article {
  display: grid;
  gap: 6px;
  border: 1px solid var(--md-line);
  border-radius: 8px;
  background: #f8fcfb;
  padding: 13px;
}

.md-report-kpis small,
.md-report-kpis span {
  color: var(--md-muted);
  font-size: 12px;
}

.md-report-kpis b {
  color: var(--md-ink);
  font-size: 19px;
}

.md-report-visuals {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 12px;
  margin: 0 0 20px;
}

.md-report-visuals article {
  border: 1px solid var(--md-line);
  border-left: 0;
  border-radius: 8px;
  background: #f8fcfb;
  padding: 14px;
}

.md-report-visuals h4 {
  margin: 0 0 11px;
  color: var(--md-dark);
}

.md-report-stack {
  display: flex;
  height: 24px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8f1f0;
}

.md-report-stack i {
  display: block;
}

.md-report-visuals p {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0 0;
  color: #526674;
  font-size: 12px;
  font-weight: 900;
}

.md-report-bars {
  display: grid;
  gap: 9px;
}

.md-report-bars div {
  display: grid;
  grid-template-columns: 86px 1fr 52px;
  align-items: center;
  gap: 8px;
}

.md-report-bars b {
  color: var(--md-ink);
  font-size: 12px;
}

.md-report-bars i {
  display: block;
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8f1f0;
}

.md-report-bars em {
  display: block;
  height: 100%;
  border-radius: inherit;
}

.md-report-bars span {
  color: #526674;
  font-size: 11px;
  font-weight: 900;
  text-align: right;
}

.md-report h2 {
  margin: 0 0 6px;
  text-align: center;
}

.md-report > p {
  margin: 0 0 20px;
  text-align: center;
  color: var(--md-muted);
}

.md-exec-text {
  text-align: left !important;
  color: #475467 !important;
  line-height: 1.8;
}

.md-report h3 {
  margin: 24px 0 13px;
}

.md-report-score {
  border-radius: 8px;
  background: var(--md-teal);
  color: #fff;
  text-align: center;
  padding: 16px;
  margin-bottom: 17px;
}

.md-report-score b {
  font-size: 34px;
}

.md-report table {
  width: 100%;
  border-collapse: collapse;
}

.md-report th,
.md-report td {
  border: 1px solid var(--md-line);
  padding: 11px;
  text-align: left;
}

.md-report th {
  background: var(--md-mint);
}

.md-report thead th {
  background: var(--md-dark);
  color: #fff;
}

.md-report article.urgent {
  border-left-color: #d64545;
  background: #fff3f2;
}

.md-report article.caution {
  border-left-color: #d79a2b;
  background: #fff8eb;
}

.md-roadmap {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 1px;
  border: 1px solid var(--md-line);
  border-radius: 7px;
  overflow: hidden;
  margin-bottom: 20px;
}

.md-roadmap b,
.md-roadmap span {
  padding: 12px;
}

.md-roadmap b {
  background: var(--md-dark);
  color: #fff;
}

.md-roadmap span {
  background: #f7fbfa;
}

.md-roadmap.detailed span {
  line-height: 1.65;
}

.md-roadmap.detailed strong {
  color: var(--md-dark);
}

.md-report-notes {
  color: #475467;
  line-height: 1.8;
}

.md-report-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.review-app {
  --review-teal: #078d83;
  --review-teal-dark: #086b65;
  --review-mint: #edf9f7;
  --review-line: #d8e9e6;
  --review-ink: #11243b;
  --review-muted: #64748b;
  display: grid;
  grid-template-columns: 252px minmax(0, 1fr);
  gap: 22px;
  color: var(--review-ink);
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0;
}

.workspace:has(.review-app) {
  padding: 18px 12px;
  min-width: 0;
}

.review-app > *,
.review-tab-content,
#reviewResults {
  min-width: 0;
}

.review-visual-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  margin: 16px 0;
}

.review-visual-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.review-visual-card,
.review-action-grid article {
  border: 1px solid #d3e8e5;
  border-radius: 8px;
  background: #ffffff;
  padding: 17px;
  box-shadow: 0 10px 28px rgba(8, 67, 71, .05);
}

.review-visual-card h3,
.review-action-grid h3 {
  margin: 0 0 14px;
  color: #08263b;
  font-size: 16px;
}

.review-donut-layout {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  align-items: center;
  gap: 15px;
}

.review-donut {
  display: grid;
  place-items: center;
  width: 142px;
  aspect-ratio: 1;
  border-radius: 50%;
  position: relative;
}

.review-donut::after {
  content: "";
  position: absolute;
  inset: 38px;
  border-radius: 50%;
  background: #ffffff;
}

.review-donut b,
.review-donut span {
  position: relative;
  z-index: 1;
}

.review-donut b {
  color: #08263b;
  font-size: 23px;
}

.review-donut span {
  color: #6a7f8e;
  font-size: 11px;
  font-weight: 900;
  margin-top: 34px;
}

.review-donut-list {
  display: grid;
  gap: 9px;
}

.review-donut-list div {
  display: grid;
  grid-template-columns: 10px 1fr auto;
  align-items: center;
  gap: 8px;
  color: #41586a;
  font-size: 12px;
}

.review-donut-list i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
}

.review-risk-bars {
  display: grid;
  gap: 11px;
}

.review-risk-bars header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: #172d3f;
  font-size: 12px;
}

.review-risk-bars i {
  display: block;
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #eaf3f2;
}

.review-risk-bars em {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0f9a8c, #ef4444);
}

.review-risk-bars small {
  color: #6a7f8d;
  font-size: 11px;
}

.review-bubble-map {
  height: 242px;
  border: 1px solid #e0eeeb;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #f5fbfa 100%);
  position: relative;
  overflow: hidden;
}

.review-bubble-map span {
  position: absolute;
  display: grid;
  place-items: center;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: rgba(15, 154, 140, .72);
  color: #ffffff;
  font-size: 10px;
  font-weight: 900;
  box-shadow: 0 8px 20px rgba(8, 67, 71, .2);
}

.review-bubble-map.warning span.danger {
  background: rgba(239, 68, 68, .82);
}

.review-bubble-map .x,
.review-bubble-map .y {
  position: absolute;
  color: #718795;
  font-size: 11px;
  font-weight: 800;
}

.review-bubble-map .x {
  right: 12px;
  bottom: 9px;
}

.review-bubble-map .y {
  left: 10px;
  top: 10px;
}

.review-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 14px 0 18px;
}

.review-action-grid span {
  display: inline-flex;
  border-radius: 999px;
  background: #e8f8f5;
  color: #08776f;
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 10px;
  padding: 5px 9px;
}

.review-action-grid article.urgent span {
  background: #fff1f2;
  color: #be123c;
}

.review-action-grid p {
  color: #546b7b;
  font-size: 13px;
  line-height: 1.65;
  margin: 0;
}

.review-insights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0 22px;
}

.review-insights .insight-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 15px 16px;
  border: 1px solid var(--review-line);
  border-left: 4px solid #078d83;
  border-radius: 7px;
  background: white;
}

.review-insights .insight-label {
  color: var(--review-muted);
  font-size: 12px;
  font-weight: 800;
}

.review-insights .insight-value {
  color: var(--review-ink);
  font-size: 17px;
  font-weight: 900;
  line-height: 1.35;
  overflow-wrap: anywhere;
  word-break: keep-all;
}

.review-insights .insight-note {
  color: #516271;
  font-size: 12px;
  line-height: 1.45;
}

.review-gauge {
  display: grid;
  place-items: center;
  height: 230px;
  position: relative;
}

.review-gauge-arc {
  width: 220px;
  height: 110px;
  border-radius: 220px 220px 0 0;
  background: conic-gradient(from 270deg, #078d83 0deg var(--deg), #fdecea var(--deg) 180deg, transparent 180deg 360deg);
  position: relative;
  overflow: hidden;
}

.review-gauge-arc::after {
  content: "";
  position: absolute;
  left: 33px;
  right: 33px;
  bottom: 0;
  height: 77px;
  border-radius: 160px 160px 0 0;
  background: #ffffff;
}

.review-gauge > i {
  position: absolute;
  top: 106px;
  width: 94px;
  height: 3px;
  border-radius: 999px;
  background: #c0392b;
  transform-origin: right center;
  transform: translateX(-47px) rotate(calc(var(--deg) - 90deg));
}

.review-gauge b {
  position: absolute;
  top: 118px;
  color: #08263b;
  font-size: 31px;
}

.review-gauge span {
  position: absolute;
  top: 161px;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.review-flow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: end;
  gap: 24px;
  min-height: 238px;
  padding: 6px 0 28px;
}

.review-flow-total,
.review-flow-stack {
  display: flex;
  align-items: end;
  justify-content: center;
  height: 210px;
  position: relative;
}

.review-flow-total b {
  display: block;
  width: 82px;
  border-radius: 8px 8px 0 0;
  background: #0f9a8c;
}

.review-flow-total span,
.review-flow-total strong {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
}

.review-flow-total span {
  bottom: -21px;
  color: #42586a;
  font-weight: 900;
}

.review-flow-total strong {
  top: 0;
  color: #08263b;
}

.review-flow-stack {
  flex-direction: column-reverse;
  gap: 2px;
}

.review-flow-stack i {
  display: grid;
  align-items: center;
  width: 118px;
  min-height: 12px;
  color: #ffffff;
  font-style: normal;
  font-weight: 900;
  padding: 2px 7px;
  position: relative;
  text-align: center;
}

.review-flow-stack i.decided {
  background: #078d83;
}

.review-flow-stack i.cut {
  background: #ef4444;
}

.review-flow-stack i.pending {
  background: #f59e0b;
}

.review-flow-stack i.etc {
  background: #94a3b8;
}

.review-flow-stack em {
  font-style: normal;
  font-size: 10px;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-flow-stack small {
  font-size: 10px;
  opacity: .88;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-flow-stack i.compact {
  min-height: 8px;
  padding: 0;
}

.review-flow-stack i.compact em,
.review-flow-stack i.compact small {
  display: none;
}

.review-card-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.review-card-title h3 {
  margin: 0;
}

.review-card-title span {
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  padding: 5px 10px;
}

.review-card-title .stable {
  background: #e8f8f4;
  color: #08776f;
}

.review-card-title .warning {
  background: #fff7df;
  color: #9a5a00;
}

.review-card-title .danger {
  background: #fff1f1;
  color: #b42318;
}

.review-gauge-card {
  min-height: 286px;
}

.review-gauge {
  height: 174px;
  margin-top: 6px;
}

.review-gauge-svg {
  width: min(100%, 270px);
  height: 168px;
  overflow: visible;
}

.review-gauge-svg path {
  fill: none;
  stroke-linecap: round;
  stroke-width: 20;
}

.review-gauge-svg .track {
  stroke: #e8f1f0;
}

.review-gauge-svg .safe {
  stroke: #0f9a8c;
  opacity: .28;
}

.review-gauge-svg .stable {
  stroke: #0f9a8c;
}

.review-gauge-svg .warning {
  stroke: #f59e0b;
}

.review-gauge-svg .danger {
  stroke: #ef4444;
}

.review-gauge-svg .threshold {
  stroke: #d97706;
  stroke-dasharray: 4 4;
  stroke-width: 2;
}

.review-gauge-svg .needle {
  stroke: #102a3a;
  stroke-width: 4;
  stroke-linecap: round;
  filter: drop-shadow(0 2px 4px rgba(8, 22, 33, .2));
}

.review-gauge-svg .hub {
  fill: #102a3a;
  stroke: #ffffff;
  stroke-width: 3;
}

.review-gauge-value {
  position: absolute;
  top: 78px;
  display: grid;
  justify-items: center;
  gap: 2px;
  min-width: 120px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 8px 24px rgba(8, 30, 43, .08);
}

.review-gauge .review-gauge-value b {
  position: static;
  color: #08263b;
  font-size: 32px;
  line-height: 1;
}

.review-gauge .review-gauge-value span {
  position: static;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.review-gauge-threshold {
  position: absolute;
  transform: translate(-50%, -100%);
  border: 1px solid #f2c36b;
  border-radius: 999px;
  background: #fff7df;
  color: #9a5a00;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  padding: 3px 7px;
  white-space: nowrap;
}

.review-gauge-scale {
  display: flex;
  justify-content: space-between;
  border-radius: 6px;
  background: rgba(232, 241, 240, .82);
  color: #274355;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  margin-top: 6px;
  padding: 7px 12px;
}

.review-chart-note {
  color: #5e7381;
  font-size: 12px;
  line-height: 1.5;
  margin: 8px 0 0;
}

.review-composition-total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid #e0eeeb;
  border-radius: 7px;
  background: #f8fcfb;
  padding: 12px 14px;
}

.review-composition-total span {
  color: #607684;
  font-size: 12px;
  font-weight: 800;
}

.review-composition-total b {
  color: #08263b;
  font-size: 20px;
}

.review-composition-bar {
  display: flex;
  height: 32px;
  overflow: hidden;
  border-radius: 7px;
  background: #eef6f4;
  margin: 18px 0 14px;
}

.review-composition-bar i {
  min-width: 0;
}

.review-composition-bar .decided,
.review-composition-legend .decided {
  background: #078d83;
}

.review-composition-bar .cut,
.review-composition-legend .cut {
  background: #ef4444;
}

.review-composition-bar .pending,
.review-composition-legend .pending {
  background: #f59e0b;
}

.review-composition-bar .etc,
.review-composition-legend .etc {
  background: #94a3b8;
}

.review-composition-legend {
  display: grid;
  gap: 9px;
}

.review-composition-legend div {
  display: grid;
  grid-template-columns: 10px minmax(80px, 1fr) auto 54px;
  align-items: center;
  gap: 8px;
  color: #42586a;
  font-size: 12px;
}

.review-composition-legend i {
  width: 10px;
  height: 10px;
  border-radius: 3px;
}

.review-composition-legend b {
  color: #0f2537;
}

.review-composition-legend em {
  color: #64748b;
  font-style: normal;
  text-align: right;
}

.review-donut-card .review-donut-layout {
  grid-template-columns: 170px minmax(0, 1fr);
  gap: 20px;
}

.review-donut-card .review-donut {
  width: 156px;
}

.review-donut-card .review-donut::after {
  inset: 42px;
}

.review-donut-card .review-donut b {
  font-size: 18px;
  text-align: center;
}

.review-donut-card .review-donut span {
  margin-top: 30px;
}

.review-donut-card .review-donut-list div {
  grid-template-columns: 10px minmax(80px, 1fr) auto 48px;
}

.review-donut-card .review-donut-list span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-donut-card .review-donut-list em {
  color: #64748b;
  font-style: normal;
  text-align: right;
}

.review-bubble-map.matrix,
.review-bubble-map.warning {
  height: 278px;
  background:
    linear-gradient(90deg, rgba(8, 141, 131, .08) 1px, transparent 1px) 0 0 / 25% 100%,
    linear-gradient(180deg, rgba(8, 141, 131, .08) 1px, transparent 1px) 0 0 / 100% 25%,
    linear-gradient(180deg, #ffffff 0%, #f5fbfa 100%);
}

.review-bubble-map .review-threshold-line {
  position: absolute;
  left: 9%;
  right: 8%;
  top: var(--threshold-y);
  border-top: 1px dashed #d97706;
  font-style: normal;
}

.review-bubble-map .review-threshold-line b {
  position: absolute;
  right: 0;
  top: -19px;
  color: #9a5a00;
  font-size: 10px;
  font-weight: 900;
}

.review-bubble-map span {
  line-height: 1.1;
  padding: 2px;
}

.review-bubble-map span b {
  font-size: 11px;
}

.review-bubble-map span em {
  display: block;
  font-size: 9px;
  font-style: normal;
  opacity: .9;
}

.review-bubble-map.warning span.danger {
  color: #fff;
}

.review-bubble-caption {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  margin-top: 10px;
}

.review-topcut {
  display: grid;
  gap: 12px;
}

.review-topcut div {
  display: grid;
  grid-template-columns: 104px 1fr 115px;
  align-items: center;
  gap: 8px;
  color: #31495a;
  font-size: 12px;
}

.review-topcut b {
  color: #08263b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-topcut i {
  display: block;
  min-height: 14px;
  border-radius: 999px;
  background: #0f9a8c;
}

.review-topcut i.danger {
  background: #ef4444;
}

.review-topcut span {
  color: #64748b;
  font-size: 11px;
}

.review-pie-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0;
}

.review-pareto {
  display: grid;
  gap: 12px;
}

.review-pareto div {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr) 92px 54px;
  align-items: center;
  gap: 9px;
  color: #31495a;
  font-size: 12px;
}

.review-pareto b {
  color: #08263b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-pareto i {
  display: block;
  min-height: 15px;
  border-radius: 999px;
  background: linear-gradient(90deg, #ef4444, #f59e0b);
}

.review-pareto span,
.review-pareto em {
  color: #64748b;
  font-size: 11px;
  font-style: normal;
  text-align: right;
}

.review-trend-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  margin: 16px 0;
}

.review-compare-brief {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 16px;
}

.review-compare-brief article {
  border: 1px solid var(--review-line);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f8fcfb);
  padding: 14px;
  min-width: 0;
}

.review-compare-brief small {
  display: block;
  color: var(--review-muted);
  font-size: 11px;
  font-weight: 900;
}

.review-compare-brief b {
  display: block;
  color: var(--review-ink);
  font-size: 18px;
  line-height: 1.25;
  margin: 5px 0;
  overflow-wrap: anywhere;
}

.review-compare-brief b.good {
  color: #08776f;
}

.review-compare-brief b.bad {
  color: #b42318;
}

.review-compare-brief b.up {
  color: #2354b8;
}

.review-compare-brief b.down {
  color: #6b7280;
}

.review-compare-brief span {
  color: #64748b;
  font-size: 11px;
  line-height: 1.35;
}

.review-compare-detail {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 14px 0 16px;
}

.review-delta-bars {
  display: grid;
  gap: 12px;
}

.review-delta-bars div {
  display: grid;
  grid-template-columns: minmax(90px, 150px) 1fr 90px;
  align-items: center;
  gap: 10px;
}

.review-delta-bars b {
  color: var(--review-ink);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.review-delta-bars i {
  display: block;
  height: 14px;
  border-radius: 999px;
}

.review-delta-bars i.good {
  background: linear-gradient(90deg, #0f9a8c, #7adbd1);
}

.review-delta-bars i.bad {
  background: linear-gradient(90deg, #ef4444, #f59e0b);
}

.review-delta-bars span {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
  text-align: right;
}

.review-commentary {
  display: grid;
  align-content: start;
  gap: 10px;
}

.review-commentary p {
  border-left: 3px solid #0f9a8c;
  color: #526674;
  font-size: 12px;
  line-height: 1.55;
  margin: 0;
  padding: 2px 0 2px 10px;
}

.review-commentary strong.good {
  color: #08776f;
}

.review-commentary strong.bad {
  color: #b42318;
}

.review-trend-bars {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 14px;
  min-height: 224px;
  overflow-x: auto;
  padding: 18px 6px 8px;
}

.review-trend-bars div {
  display: grid;
  grid-template-rows: 18px 160px 34px;
  justify-items: center;
  align-items: end;
  min-width: 72px;
  color: #42586a;
  font-size: 11px;
}

.review-trend-bars b {
  color: #08263b;
  font-size: 11px;
}

.review-trend-bars i {
  width: 38px;
  max-height: 160px;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(180deg, #16a394, #076f68);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35);
}

.review-trend-bars.review i {
  background: linear-gradient(180deg, #6d7cf7, #3648b8);
}

.review-trend-bars span {
  align-self: start;
  color: #64748b;
  font-size: 10px;
  line-height: 1.25;
  text-align: center;
}

.review-trend-line {
  height: 224px;
  border: 1px solid #e0eeeb;
  border-radius: 8px;
  background:
    linear-gradient(180deg, transparent 24%, #eef5f4 24% 25%, transparent 25% 49%, #eef5f4 49% 50%, transparent 50% 74%, #eef5f4 74% 75%, transparent 75%),
    linear-gradient(180deg, #ffffff, #f8fcfb);
  position: relative;
}

.review-trend-line span {
  position: absolute;
  display: block;
  width: 13px;
  height: 13px;
  border: 3px solid #ffffff;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 4px 12px rgba(239, 68, 68, .25);
  transform: translate(-50%, 50%);
}

.review-trend-line span b {
  position: absolute;
  left: 50%;
  top: -26px;
  color: #334155;
  font-size: 10px;
  transform: translateX(-50%);
  white-space: nowrap;
}

.review-trend-line i {
  position: absolute;
  left: 8px;
  right: 8px;
  border-top: 1px dashed #ef4444;
  opacity: .75;
}

.review-a4-report {
  max-width: 960px;
  min-height: 1180px;
  margin: 0 auto;
  border: 1px solid #d5e8e5;
  border-radius: 8px;
  background: #ffffff;
  color: #142638;
  padding: 28px;
  box-shadow: 0 18px 48px rgba(8, 67, 71, .08);
}

.review-report-cover {
  border-radius: 8px;
  background: linear-gradient(120deg, #057d76, #14a292);
  color: #ffffff;
  padding: 28px;
}

.review-report-cover span {
  color: #cdf8f1;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .1em;
}

.review-report-cover h2 {
  color: #ffffff;
  font-size: 28px;
  margin: 7px 0;
}

.review-report-cover p {
  color: #e5fffb;
  margin: 0;
}

.review-report-score {
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #078d83;
  color: #ffffff;
  margin: 18px 0;
  padding: 16px;
}

.review-report-score b {
  font-size: 35px;
}

.review-report-kpi-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}

.review-report-kpi-row article {
  border: 1px solid #d9e8e6;
  border-radius: 8px;
  background: #f8fcfb;
  padding: 12px;
}

.review-report-kpi-row article.danger {
  border-color: #f3b2b2;
  background: #fff8f8;
}

.review-report-kpi-row article.stable {
  border-color: #aee2da;
  background: #f2fbf9;
}

.review-report-kpi-row small {
  display: block;
  color: #58707c;
  font-size: 11px;
  font-weight: 900;
}

.review-report-kpi-row b {
  display: block;
  color: #09283b;
  font-size: 18px;
  margin: 4px 0;
}

.review-report-kpi-row span {
  color: #64748b;
  font-size: 11px;
}

.review-a4-report h3 {
  border-left: 4px solid #078d83;
  background: #edf9f7;
  color: #09283b;
  font-size: 17px;
  margin: 22px 0 12px;
  padding: 8px 12px;
}

.review-a4-report h4 {
  color: #09283b;
  font-size: 14px;
  margin: 0 0 10px;
}

.review-a4-report table {
  width: 100%;
  border-collapse: collapse;
}

.review-a4-report th,
.review-a4-report td {
  border: 1px solid #d9e8e6;
  padding: 9px;
  text-align: left;
  vertical-align: top;
}

.review-a4-report thead th,
.review-a4-report tbody th {
  background: #f3fbfa;
  color: #09283b;
}

.review-report-visuals {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 12px;
  margin: 16px 0;
}

.review-report-visuals article {
  border: 1px solid #d9e8e6;
  border-radius: 8px;
  background: #f8fcfb;
  padding: 14px;
}

.report-stack {
  display: flex;
  height: 26px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8f1f0;
}

.report-stack i {
  display: block;
}

.report-stack .decided {
  background: #0f9a8c;
}

.report-stack .cut {
  background: #ef4444;
}

.report-stack .pending {
  background: #f59e0b;
}

.review-report-visuals p {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  color: #526674;
  font-size: 11px;
  font-weight: 800;
  margin: 10px 0 0;
}

.report-risk-meter {
  position: relative;
  display: flex;
  justify-content: space-between;
  border-top: 14px solid #e8f1f0;
  color: #64748b;
  font-size: 10px;
  margin: 23px 4px 10px;
  padding-top: 8px;
}

.report-risk-meter::before {
  content: "";
  position: absolute;
  left: 0;
  top: -14px;
  width: 50%;
  height: 14px;
  border-radius: 999px 0 0 999px;
  background: #0f9a8c;
}

.report-risk-meter::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 0;
  top: -14px;
  height: 14px;
  border-radius: 0 999px 999px 0;
  background: linear-gradient(90deg, #f59e0b, #ef4444);
}

.report-risk-meter b {
  position: absolute;
  top: -22px;
  width: 4px;
  height: 30px;
  border-radius: 999px;
  background: #09283b;
  transform: translateX(-50%);
  z-index: 2;
}

.review-report-visuals strong {
  display: inline-block;
  border-radius: 999px;
  font-size: 12px;
  padding: 6px 10px;
}

.review-report-visuals strong.bad {
  background: #fff1f1;
  color: #b42318;
}

.review-report-visuals strong.good {
  background: #e8f8f4;
  color: #08776f;
}

.review-report-bars {
  display: grid;
  gap: 8px;
  margin: 10px 0 12px;
}

.review-report-bars div {
  display: grid;
  grid-template-columns: 110px 1fr 75px;
  align-items: center;
  gap: 10px;
}

.review-report-bars b {
  color: #09283b;
}

.review-report-bars i {
  display: block;
  height: 14px;
  border-radius: 999px;
  background: linear-gradient(90deg, #0f9a8c, #6bd5ca);
}

.review-report-bars.field i {
  background: linear-gradient(90deg, #ef4444, #f59e0b);
}

.review-report-bars span {
  color: #526674;
  font-size: 11px;
  font-weight: 900;
  text-align: right;
}

.review-report-roadmap {
  display: grid;
  grid-template-columns: 110px 1fr;
  border: 1px solid #d9e8e6;
}

.review-report-roadmap b,
.review-report-roadmap span {
  border-bottom: 1px solid #d9e8e6;
  padding: 10px;
}

.review-report-roadmap b {
  background: #086b65;
  color: #ffffff;
}

.workspace:has(.dc-app),
.workspace:has(.dx-app),
.workspace:has(.hg-app),
.workspace:has(.ng-app),
.workspace:has(.fee-book) {
  padding: 18px 12px;
}

.review-controls {
  border: 1px solid var(--review-line);
  border-radius: 8px;
  background: #fff;
  padding: 18px 15px;
  height: fit-content;
  position: sticky;
  top: 20px;
}

.review-control-title {
  display: flex;
  gap: 10px;
  color: var(--review-teal-dark);
  border-bottom: 1px solid var(--review-line);
  padding-bottom: 15px;
  margin-bottom: 18px;
}

.review-control-title .icon {
  width: 25px;
  height: 25px;
}

.review-control-title strong,
.review-control-title span {
  display: block;
}

.review-control-title strong {
  font-size: 18px;
}

.review-control-title span {
  font-size: 12px;
  color: var(--review-muted);
  margin-top: 3px;
}

.review-file-label,
.review-setting label {
  display: grid;
  gap: 8px;
  color: #334155;
  font-weight: 700;
  font-size: 14px;
  min-width: 0;
}

.review-file-label input {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: hidden;
  border: 1px dashed #b7dbd6;
  background: var(--review-mint);
  border-radius: 7px;
  padding: 11px 8px;
  color: var(--review-muted);
  font-weight: 500;
  font-size: 12px;
}

.review-file-label input::file-selector-button {
  max-width: 94px;
  margin-right: 7px;
  border: 1px solid #c5ddd9;
  border-radius: 5px;
  background: white;
  color: #334155;
  padding: 6px 8px;
  font-size: 12px;
}

.review-file-label small,
.review-side-note {
  line-height: 1.55;
  color: var(--review-muted);
  font-weight: 400;
  font-size: 12px;
}

.review-setting {
  border-top: 1px solid var(--review-line);
  margin-top: 20px;
  padding-top: 16px;
}

.review-setting h3 {
  margin: 0 0 15px;
  font-size: 14px;
}

.review-setting strong {
  justify-self: end;
  color: var(--review-teal-dark);
}

.review-setting input[type="range"] {
  accent-color: var(--review-teal);
}

.review-setting .review-check {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 16px;
  font-weight: 500;
}

.review-setting .review-check input {
  accent-color: var(--review-teal);
}

.review-side-note {
  background: var(--review-mint);
  border-radius: 7px;
  padding: 12px;
  margin: 18px 0 0;
}

.review-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 22px;
  background: linear-gradient(120deg, #057d76, #14a292);
  border-radius: 8px;
  color: white;
  padding: 23px 28px;
  margin-bottom: 16px;
}

.review-header h1 {
  font-size: 25px;
  letter-spacing: 0;
  margin: 0 0 8px;
}

.review-header p {
  margin: 0;
  font-size: 13px;
  opacity: .9;
}

.review-header > span {
  border: 1px solid rgba(255, 255, 255, .4);
  padding: 9px 13px;
  font-size: 12px;
  font-weight: 800;
}

.review-empty {
  min-height: 360px;
  border: 1px solid var(--review-line);
  border-radius: 8px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 13px;
  padding: 30px;
  background: white;
  text-align: center;
}

.review-empty .icon {
  width: 34px;
  height: 34px;
  color: var(--review-teal);
}

.review-empty h2 {
  margin: 0;
  font-size: 18px;
}

.review-empty p {
  margin: 0;
  color: var(--review-muted);
}

.review-empty details {
  width: min(580px, 100%);
  text-align: left;
  border: 1px solid var(--review-line);
  border-radius: 7px;
  padding: 12px 16px;
  margin-top: 10px;
}

.review-empty summary {
  font-weight: 700;
  cursor: pointer;
}

.review-empty ul {
  line-height: 1.7;
  color: var(--review-muted);
}

.review-empty.compact {
  min-height: 180px;
}

.review-loading,
.review-success,
.review-error {
  border-radius: 7px;
  padding: 12px 15px;
  margin-bottom: 14px;
  font-size: 14px;
}

.review-loading,
.review-success {
  background: var(--review-mint);
  color: var(--review-teal-dark);
}

.review-error {
  background: #fff1f2;
  color: #b42318;
}

.review-file-row {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}

.review-file-row label {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--review-muted);
  font-size: 13px;
}

.review-file-row select,
.review-filters select {
  height: 40px;
  border: 1px solid var(--review-line);
  border-radius: 6px;
  background: white;
  padding: 0 10px;
}

.review-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--review-line);
  margin-bottom: 18px;
}

.review-tabs button {
  border: 0;
  background: transparent;
  min-height: 45px;
  padding: 0 18px;
  color: var(--review-muted);
  font-weight: 700;
}

.review-tabs button.active {
  color: var(--review-teal-dark);
  border-bottom: 3px solid var(--review-teal);
}

.review-caption {
  margin: 0 0 16px;
  color: var(--review-muted);
  font-size: 13px;
}

.review-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 26px;
}

.review-kpis article {
  border: 1px solid var(--review-line);
  border-left: 4px solid var(--review-teal);
  border-radius: 7px;
  background: white;
  padding: 15px;
  display: grid;
  gap: 7px;
}

.review-kpis article.danger {
  border-left-color: #da554e;
}

.review-kpis article.warning {
  border-left-color: #e1a132;
}

.review-kpis article.success {
  border-left-color: #30a46c;
}

.review-kpis small,
.review-kpis span {
  color: var(--review-muted);
  font-size: 12px;
}

.review-kpis b {
  font-size: 19px;
  color: var(--review-ink);
}

.review-section-title {
  border-bottom: 2px solid var(--review-teal);
  color: var(--review-teal-dark);
  font-size: 16px;
  padding-bottom: 9px;
  margin: 24px 0 13px;
}

.review-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.review-summary {
  border: 1px solid var(--review-line);
  border-radius: 7px;
  background: white;
  padding: 13px;
  overflow-x: auto;
}

.review-summary h3 {
  font-size: 14px;
  margin: 0 0 11px;
}

.review-summary table,
.review-table {
  border-collapse: collapse;
  width: 100%;
  font-size: 12px;
  white-space: nowrap;
  table-layout: auto;
}

.review-summary th,
.review-summary td,
.review-table th,
.review-table td {
  padding: 10px 8px;
  border-bottom: 1px solid #eef3f2;
  text-align: right;
}

.review-summary th:first-child,
.review-summary td:first-child,
.review-table th:first-child,
.review-table td:first-child {
  text-align: left;
}

.review-summary th,
.review-table th {
  color: var(--review-muted);
  background: #f7faf9;
}

.review-summary .subtotal {
  font-weight: 700;
  background: var(--review-mint);
}

.review-chart {
  border: 1px solid var(--review-line);
  border-radius: 7px;
  background: white;
  margin-top: 22px;
  padding: 18px;
}

.review-chart h3 {
  font-size: 15px;
  margin: 0 0 17px;
}

.review-bar-row {
  display: grid;
  grid-template-columns: 95px 1fr 100px;
  align-items: center;
  gap: 12px;
  margin-bottom: 15px;
  font-size: 12px;
}

.review-bar-row > div {
  display: grid;
  gap: 3px;
}

.review-bar-row span {
  display: block;
  height: 7px;
  border-radius: 3px;
}

.review-chart .claim { background: #18a193; }
.review-chart .decided { background: #5cbb91; }
.review-chart .cut { background: #dc625a; }

.review-chart footer {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  color: var(--review-muted);
  font-size: 12px;
}

.review-chart footer i {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 8px;
}

.review-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.review-filters label {
  display: grid;
  gap: 7px;
  color: var(--review-muted);
  font-size: 13px;
}

.review-table-scroll {
  overflow-x: auto;
  border: 1px solid var(--review-line);
  border-radius: 7px;
  background: white;
}

.review-table td,
.review-table th {
  padding: 11px 12px;
  max-width: 260px;
  overflow-wrap: anywhere;
  word-break: keep-all;
}

.review-table td:first-child,
.review-table td:nth-child(2),
.review-table td:nth-child(3),
.review-table td:last-child {
  white-space: normal;
}

.review-table tr.alert td {
  background: #fff2f1;
}

.review-heading-row {
  display: flex;
  justify-content: space-between;
  align-items: end;
  margin-bottom: 13px;
}

.review-heading-row .review-section-title {
  flex: 1;
  margin: 0 12px 0 0;
}

.review-warning-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.review-warning-kpis article {
  display: grid;
  gap: 5px;
  border: 1px solid #f2d9d7;
  background: #fff8f7;
  border-radius: 7px;
  padding: 13px;
}

.review-warning-kpis b {
  font-size: 19px;
}

.review-warning-kpis span {
  font-size: 12px;
  color: var(--review-muted);
}

.fee-book {
  width: 100%;
  max-width: none;
  margin: 0;
}

.fee-header {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 20px;
  margin-bottom: 20px;
}

.fee-header h1 {
  margin: 6px 0 8px;
  font-size: 28px;
}

.fee-header p {
  margin: 0;
  color: var(--muted);
}

.fee-kicker {
  color: var(--teal) !important;
  font-size: 12px;
  font-weight: 800;
}

.fee-search {
  height: 54px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px;
  border: 1px solid #d8e7e4;
  border-radius: 8px;
  background: white;
  margin-bottom: 18px;
}

.fee-search input {
  flex: 1;
  border: 0;
  outline: 0;
}

.fee-layout {
  min-height: calc(100vh - 230px);
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 16px;
}

.fee-toc,
.fee-reading {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
}

.fee-toc {
  padding: 14px 10px;
}

.fee-toc > strong {
  display: block;
  padding: 4px 10px 12px;
}

.fee-section {
  width: 100%;
  display: grid;
  gap: 4px;
  padding: 11px 10px;
  border: 0;
  border-left: 3px solid transparent;
  background: transparent;
  text-align: left;
  color: #344054;
}

.fee-section small {
  color: var(--muted);
}

.fee-section.active,
.fee-section:hover {
  border-left-color: var(--teal);
  color: var(--teal-dark);
  background: #effbf8;
}

.fee-reading-head {
  padding: 24px 26px 20px;
  border-bottom: 1px solid var(--line);
}

.fee-reading-head span {
  color: var(--teal);
  font-size: 13px;
  font-weight: 800;
}

.fee-reading-head h2 {
  margin: 8px 0;
}

.fee-reading-head p {
  margin: 0;
  color: var(--muted);
}

.fee-reading-body {
  padding: 22px 26px;
}

.fee-reading-body > .fee-note:first-child {
  display: none;
}

.fee-note {
  padding: 16px;
  border-left: 4px solid var(--teal);
  border-radius: 0 8px 8px 0;
  background: #f5fffd;
}

.fee-note p {
  margin: 8px 0 0;
  color: #475467;
  line-height: 1.6;
}

.fee-subnav {
  display: flex;
  gap: 8px;
  margin: 20px 0;
}

.fee-empty {
  min-height: 210px;
  border: 1px dashed #b9dcd7;
  border-radius: 8px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 10px;
  color: var(--muted);
  text-align: center;
}

.fee-empty b {
  color: var(--ink);
}

@media (max-width: 980px) {
  .hg-app {
    grid-template-columns: 1fr;
  }

  .hg-input-panel {
    position: static;
  }

  .hg-output {
    min-width: 0;
  }

  .hg-sheet {
    width: 100%;
    min-height: unset;
    padding: 24px;
  }

  .hg-patient-card,
  .hg-status-grid,
  .hg-rules-grid,
  .hg-qa-grid {
    grid-template-columns: 1fr;
  }

  .hg-qa-grid article.wide {
    grid-column: auto;
  }

  .dx-columns,
  .dx-two,
  .dx-spine-rows,
  .dx-hip-rows {
    grid-template-columns: 1fr;
  }

  .dc-hero,
  .dc-columns,
  .dc-footer-columns {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }

  .dc-stamp {
    flex-basis: auto;
  }

  .dc-tabs,
  .dc-input-columns {
    grid-template-columns: 1fr;
  }

  .dc-tabs > div + div {
    border-top: 1px solid var(--dc-line);
    border-left: 0;
  }

  .fee-layout {
    grid-template-columns: 1fr;
  }

  .fee-toc {
    max-height: 300px;
    overflow: auto;
  }
}

@media print {
  .app-shell {
    display: block;
  }

  .rail,
  .side,
  .topbar,
  .hg-input-panel,
  .hg-print-button {
    display: none !important;
  }

  .workspace,
  .content,
  .hg-app,
  .hg-output {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 0;
    background: white !important;
  }

  .hg-sheet {
    width: 210mm;
    height: 297mm;
    min-height: 297mm;
    padding: 8mm 13mm;
    margin: 0;
    overflow: hidden;
    box-shadow: none;
    page-break-inside: avoid;
  }
}

.center-search {
  max-width: 880px;
  margin: 8px auto 28px;
  text-align: center;
}

.center-search h1 {
  margin: 0 0 8px;
  font-size: 28px;
  letter-spacing: 0;
}

.center-search p {
  margin: 0 0 18px;
  color: var(--muted);
}

.search-input {
  height: 52px;
  border: 1px solid var(--line);
  background: white;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
}

.search-input input {
  width: 100%;
  border: 0;
  outline: 0;
  color: var(--ink);
}

.grid {
  display: grid;
  gap: 16px;
}

.grid.two {
  grid-template-columns: 1.15fr 0.85fr;
}

.grid.three {
  grid-template-columns: repeat(3, 1fr);
}

.panel {
  background: white;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
}

.panel-head {
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.panel-head strong {
  font-size: 16px;
}

.panel-body {
  padding: 18px;
}

.notice-card {
  border: 1px solid #9de7dd;
  border-radius: 8px;
  overflow: hidden;
  background: white;
}

.notice-card header {
  background: var(--teal);
  color: white;
  padding: 11px 16px;
  font-size: 13px;
  font-weight: 900;
}

.notice-card main {
  display: flex;
  gap: 16px;
  padding: 18px;
}

.notice-card h3 {
  margin: 0 0 6px;
  font-size: 18px;
}

.notice-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tag {
  border: 1px solid var(--line);
  background: white;
  color: #475467;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 700;
}

.tag.teal {
  border-color: #a8e7df;
  color: var(--teal-dark);
  background: #f5fffd;
}

.module-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.module {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
  text-decoration: none;
}

.module b {
  display: block;
}

.module small {
  color: var(--muted);
}

.metric {
  padding: 18px;
}

.metric b {
  font-size: 30px;
}

.metric span {
  display: block;
  color: var(--muted);
  margin-top: 5px;
}

.table {
  width: 100%;
  border-collapse: collapse;
}

.table th,
.table td {
  padding: 13px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  font-size: 14px;
}

.table th {
  color: var(--muted);
  font-size: 12px;
  background: #f9fafb;
}

.status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 800;
}

.status.good {
  color: #08745f;
  background: #e8f8f3;
}

.status.warn {
  color: #9a5b00;
  background: #fff4dc;
}

.status.bad {
  color: #b42318;
  background: #fee4e2;
}

.page-title {
  margin-bottom: 20px;
}

.page-title h1 {
  margin: 0 0 8px;
  font-size: 28px;
}

.page-title p {
  margin: 0;
  color: var(--muted);
}

.workspace:has(.kcd-app) {
  padding: 22px 24px 34px;
}

.kcd-app {
  --kcd-teal: #078d83;
  --kcd-dark: #07544e;
  --kcd-mint: #edf9f7;
  --kcd-line: #d4e8e5;
  display: grid;
  gap: 15px;
  color: #162e35;
}

.kcd-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  border-radius: 8px;
  background: linear-gradient(112deg, #075d57 0%, #10988d 100%);
  padding: 24px 27px;
  color: #fff;
}

.kcd-header span {
  display: block;
  margin-bottom: 8px;
  color: #bcf0e9;
  font-size: 11px;
  font-weight: 800;
}

.kcd-header h1 {
  margin: 0 0 6px;
  font-size: 29px;
}

.kcd-header p {
  margin: 0;
  color: #ddf5f1;
  font-size: 14px;
}

.kcd-header strong {
  flex-shrink: 0;
  border: 1px solid rgb(255 255 255 / 34%);
  border-radius: 18px;
  padding: 9px 15px;
  font-size: 13px;
}

.kcd-source {
  display: flex;
  align-items: center;
  gap: 13px;
  border: 1px solid #b9e0da;
  border-radius: 8px;
  background: var(--kcd-mint);
  padding: 14px 16px;
}

.kcd-source svg {
  flex-shrink: 0;
  color: var(--kcd-teal);
}

.kcd-source div {
  flex: 1;
  min-width: 260px;
}

.kcd-source b {
  display: block;
  margin-bottom: 4px;
  color: var(--kcd-dark);
}

.kcd-source p {
  margin: 0;
  color: #466763;
  font-size: 13px;
  line-height: 1.55;
}

.kcd-source a {
  flex-shrink: 0;
  text-decoration: none;
}

.kcd-import {
  border: 1px solid var(--kcd-line);
  border-radius: 8px;
  background: #fff;
}

.kcd-import summary {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--kcd-dark);
  cursor: pointer;
  font-weight: 800;
  list-style: none;
  padding: 15px 18px;
}

.kcd-import summary::-webkit-details-marker {
  display: none;
}

.kcd-import > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  border-top: 1px solid #e6f0ee;
  padding: 14px 18px;
}

.kcd-import p {
  flex-basis: 100%;
  margin: 0 0 4px;
  color: #4c6561;
  font-size: 13px;
}

.kcd-import label {
  cursor: pointer;
}

.kcd-import input {
  display: none;
}

.kcd-import .danger {
  color: #b42318;
}

#kcdImportMessage {
  color: var(--kcd-dark);
  font-size: 13px;
  font-weight: 700;
}

.kcd-search {
  display: flex;
  align-items: center;
  gap: 11px;
  border: 1px solid var(--kcd-line);
  border-radius: 8px;
  background: #fff;
  color: #667b89;
  padding: 0 17px;
  height: 55px;
}

.kcd-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: #1d3540;
  font-size: 15px;
  outline: 0;
}

.kcd-groups {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.kcd-groups button {
  border: 1px solid var(--kcd-line);
  border-radius: 18px;
  background: #fff;
  color: #46605f;
  padding: 7px 13px;
  font-size: 13px;
  cursor: pointer;
}

.kcd-groups button.active {
  border-color: var(--kcd-teal);
  background: var(--kcd-teal);
  color: #fff;
  font-weight: 700;
}

.kcd-browser {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  gap: 14px;
  min-height: 475px;
}

.kcd-results,
.kcd-detail {
  overflow: hidden;
  border: 1px solid var(--kcd-line);
  border-radius: 8px;
  background: #fff;
}

.kcd-results header {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #e6f0ee;
  padding: 16px;
}

.kcd-results header span {
  color: var(--kcd-teal);
  font-size: 13px;
  font-weight: 700;
}

.kcd-results > button {
  display: grid;
  gap: 4px;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #edf3f2;
  background: #fff;
  padding: 14px 16px;
  text-align: left;
  cursor: pointer;
}

.kcd-results > button.active {
  border-left: 4px solid var(--kcd-teal);
  background: #eefaf8;
  padding-left: 12px;
}

.kcd-results > button b {
  color: var(--kcd-dark);
  font-size: 14px;
}

.kcd-results > button span {
  color: #172f3b;
  font-weight: 700;
}

.kcd-results > button small {
  color: #687d89;
}

.kcd-detail {
  padding: 24px 26px;
}

.kcd-detail-title span {
  color: var(--kcd-teal);
  font-size: 12px;
  font-weight: 800;
}

.kcd-detail-title h2 {
  margin: 9px 0;
  font-size: 26px;
}

.kcd-detail-title h2 small {
  margin-left: 9px;
  font-size: 20px;
  font-weight: 700;
}

.kcd-detail-title p {
  border-bottom: 1px solid #e5efed;
  margin: 0 0 20px;
  padding-bottom: 17px;
  color: #667b89;
}

.kcd-detail section {
  border-radius: 8px;
  background: #f2fbf9;
  padding: 18px 20px;
}

.kcd-detail h3 {
  margin: 0 0 10px;
  font-size: 16px;
}

.kcd-detail section p,
.kcd-detail li {
  color: #425e5b;
  font-size: 14px;
  line-height: 1.65;
}

.kcd-detail ul {
  margin: 12px 0 0;
  padding-left: 19px;
}

.kcd-definition {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-top: 14px;
}

.kcd-definition div {
  border: 1px solid #dceae8;
  border-radius: 8px;
  padding: 13px 15px;
}

.kcd-definition p {
  color: #526d69;
  font-size: 13px;
  line-height: 1.6;
}

.kcd-external {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 20px;
  text-decoration: none;
}

.kcd-empty {
  padding: 28px 18px;
  color: #637b78;
  font-size: 14px;
  line-height: 1.65;
}

.kcd-empty.detail {
  display: grid;
  place-items: center;
  height: 100%;
}

.workspace:has(.os-app) {
  padding: 22px 24px 34px;
}

.os-app {
  --os-teal: #0f8f82;
  --os-teal-dark: #09685f;
  --os-soft: #eefaf8;
  --os-line: #d5e9e5;
  display: grid;
  gap: 16px;
  color: #192d2c;
}

.os-header {
  background: linear-gradient(120deg, #08766d, #10a092);
  border-radius: 10px;
  padding: 25px 28px;
  color: white;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}

.os-eyebrow {
  display: block;
  color: #c8f2eb;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .13em;
  margin-bottom: 7px;
}

.os-header h1 {
  font-size: 29px;
  line-height: 1.25;
  margin: 0 0 7px;
}

.os-header p {
  color: #dbf5f0;
  margin: 0;
  font-size: 14px;
}

.os-brand {
  text-align: right;
  flex-shrink: 0;
}

.os-brand b {
  display: block;
  font-size: 19px;
  letter-spacing: .05em;
}

.os-brand span {
  display: block;
  color: #c8f2eb;
  font-size: 12px;
  margin-top: 3px;
}

.os-note {
  border: 1px solid #b6e0d9;
  background: var(--os-soft);
  border-radius: 8px;
  color: #365955;
  font-size: 14px;
  padding: 12px 16px;
}

.os-upload-panel,
.os-analysis-panel {
  border: 1px solid var(--os-line);
  border-radius: 9px;
  background: white;
  padding: 20px 22px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .035);
}

.os-upload-panel.compact {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px 14px;
}

.os-upload-heading {
  flex: 1 1 auto;
  min-width: 220px;
}

.os-upload-heading b {
  color: var(--os-teal-dark);
  font-size: 14px;
}

.os-upload-heading p {
  color: #69817e;
  font-size: 12px;
  margin: 4px 0 0;
}

.os-upload-heading p.selected {
  color: var(--os-teal-dark);
  font-weight: 700;
}

.os-upload-heading p.error {
  color: #b42318;
  font-weight: 700;
}

.os-section-title {
  border-left: 4px solid var(--os-teal);
  color: var(--os-teal-dark);
  font-size: 17px;
  font-weight: 800;
  padding-left: 11px;
  margin-bottom: 16px;
}

.os-upload-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  flex: 0 1 700px;
}

.os-file {
  border: 1px dashed #a4d8d0;
  background: #fbfffe;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 11px;
  color: #233d3a;
  font-size: 13px;
  font-weight: 750;
}

.os-file small {
  color: #69817e;
  font-size: 12px;
  font-weight: 500;
}

.os-file input {
  color: #536965;
  font-size: 12px;
  max-width: 182px;
}

.os-file.loaded {
  border-color: #65c9be;
  background: #f2fbf9;
}

.os-file strong {
  color: var(--os-teal-dark);
  font-size: 12px;
  white-space: nowrap;
}

.os-upload-status {
  color: #69817e;
  font-size: 13px;
  margin: 14px 0 0;
}

.os-upload-status.selected {
  color: var(--os-teal-dark);
  font-weight: 700;
}

.os-upload-status.error {
  color: #b42318;
  font-weight: 700;
}

.os-output {
  display: grid;
  gap: 14px;
}

.os-result-caption {
  background: #f2fbf9;
  border: 1px solid var(--os-line);
  border-radius: 8px;
  color: #526a67;
  font-size: 13px;
  padding: 11px 15px;
}

.os-result-caption b {
  color: var(--os-teal-dark);
}

.os-table-wrap {
  border: 1px solid var(--os-line);
  border-radius: 7px;
  overflow-x: auto;
}

.os-table {
  border-collapse: collapse;
  min-width: 600px;
  width: 100%;
  font-size: 14px;
}

.os-table thead th {
  background: #edf8f6;
  color: #253e3c;
  font-size: 13px;
  text-align: left;
}

.os-table th,
.os-table td {
  border-bottom: 1px solid #edf3f2;
  padding: 12px 15px;
}

.os-table tbody tr:last-child th,
.os-table tbody tr:last-child td {
  border-bottom: 0;
}

.os-table tbody th {
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
  width: 29%;
}

.os-table tbody td {
  color: #465f5b;
}

.os-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  border: 1px solid var(--os-line);
  border-radius: 9px;
  background: #fff;
  padding: 5px 10px;
  box-shadow: 0 4px 16px rgba(15, 23, 42, .035);
}

.os-tabs button {
  border: 0;
  background: transparent;
  border-bottom: 3px solid transparent;
  color: #526a67;
  padding: 10px 13px 11px;
  font-size: 13px;
  font-weight: 700;
}

.os-tabs button.active {
  border-color: var(--os-teal);
  color: var(--os-teal-dark);
}

.os-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.os-kpis.summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.os-kpis article {
  display: grid;
  gap: 8px;
  border: 1px solid var(--os-line);
  border-left: 4px solid var(--os-teal);
  border-radius: 8px;
  background: #fff;
  padding: 15px 14px;
}

.os-kpis small,
.os-kpis span {
  color: #637c79;
  font-size: 12px;
}

.os-kpis b {
  color: #153331;
  font-size: 25px;
  font-weight: 800;
}

.os-kpis span.good {
  justify-self: start;
  border-radius: 12px;
  background: #e3f7f0;
  color: #0b7951;
  padding: 3px 9px;
}

.os-kpis span.negative {
  justify-self: start;
  border-radius: 12px;
  background: #fff0ee;
  color: #b42318;
  padding: 3px 9px;
}

.os-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(420px, 1.3fr) minmax(300px, .75fr);
  gap: 14px;
}

.os-chart-panel {
  min-width: 0;
  border: 1px solid var(--os-line);
  border-radius: 8px;
  background: #fff;
  padding: 17px 19px;
}

.os-chart-panel.wide {
  grid-column: 1 / -1;
}

.os-two-charts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.os-chart-title {
  color: #213d3a;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 8px;
}

.os-table-panel {
  margin-top: 2px;
}

.os-chart {
  width: 100%;
  margin-top: 8px;
}

.os-chart svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 300px;
}

.os-chart svg rect {
  fill: #0e8d82;
}

.os-compare-chart rect.previous {
  fill: #a9bed9;
}

.os-compare-chart rect.current {
  fill: #138a9d;
}

.os-daily-chart rect.daily {
  fill: #23a99a;
}

.os-line-chart svg polyline {
  stroke: var(--os-teal);
  stroke-width: 3;
}

.os-line-chart circle {
  fill: #fff;
  stroke: var(--os-teal);
  stroke-width: 2.5;
}

.os-bar-value {
  fill: #566d70;
  font-size: 9px;
  text-anchor: middle;
}

.os-chart svg polyline {
  fill: none;
  stroke: #e28435;
  stroke-width: 2.5;
}

.os-chart-grid line {
  stroke: #e4efec;
  stroke-width: 1;
}

.os-chart-grid text {
  fill: #71817f;
  font-size: 9px;
  text-anchor: end;
}

.os-chart .month {
  fill: #71817f;
  font-size: 10px;
  text-anchor: middle;
}

.os-legend {
  display: flex;
  justify-content: center;
  gap: 18px;
  color: #536d69;
  font-size: 12px;
}

.os-legend span::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 8px;
  border-radius: 2px;
  margin-right: 6px;
  background: #0e8d82;
}

.os-legend span.new::before {
  height: 2px;
  vertical-align: middle;
  background: #e28435;
}

.os-legend.compare span.previous::before {
  background: #a9bed9;
}

.os-donut-layout {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 28px;
  min-height: 242px;
}

.os-donut {
  position: relative;
  display: grid;
  place-items: center;
  width: 156px;
  aspect-ratio: 1;
  border-radius: 50%;
}

.os-donut::after {
  content: "";
  position: absolute;
  width: 85px;
  height: 85px;
  border-radius: 50%;
  background: #fff;
}

.os-donut b,
.os-donut span {
  position: absolute;
  z-index: 1;
}

.os-donut b {
  margin-top: -14px;
  font-size: 17px;
}

.os-donut span {
  margin-top: 21px;
  color: #637c79;
  font-size: 11px;
}

.os-donut-list {
  display: grid;
  gap: 11px;
}

.os-donut-list div {
  display: grid;
  grid-template-columns: 11px 82px auto;
  align-items: center;
  gap: 7px;
  color: #445c58;
  font-size: 12px;
}

.os-donut-list i {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.os-rank {
  display: grid;
  gap: 17px;
  padding: 14px 4px 8px;
  min-height: 228px;
}

.os-rank header {
  display: flex;
  justify-content: space-between;
  color: #2a4440;
  font-size: 13px;
  margin-bottom: 7px;
}

.os-rank header span {
  color: #637c79;
}

.os-rank i {
  display: block;
  height: 10px;
  border-radius: 10px;
  background: #e8f2f0;
}

.os-rank em {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #08766d, #42b9ad);
}

.os-comparison-table td {
  text-align: right;
}

.os-comparison-table td:last-child {
  text-align: center;
}

.os-comparison-table .up {
  color: #07835e;
  font-weight: 700;
}

.os-comparison-table .down {
  color: #b42318;
  font-weight: 700;
}

.os-comparison-table .same {
  color: #667085;
}

.os-heatmap {
  display: grid;
  gap: 3px;
  margin-top: 12px;
}

.os-heatmap > div {
  display: grid;
  grid-template-columns: minmax(100px, 1.1fr) repeat(4, minmax(68px, 1fr));
  gap: 3px;
}

.os-heatmap b {
  align-items: center;
  background: #f4faf9;
  display: flex;
  padding: 9px;
  font-size: 12px;
}

.os-heatmap span {
  background: rgba(15, 143, 130, var(--intensity));
  border-radius: 3px;
  color: #24423e;
  display: grid;
  place-items: center;
  padding: 6px 3px;
  font-size: 11px;
}

.os-heatmap span strong {
  background: transparent;
  font-size: 13px;
  padding: 2px 0 0;
}

.os-empty {
  border: 1px dashed #b6dfd8;
  border-radius: 9px;
  background: #fbfffe;
  color: #526a67;
  padding: 38px 22px;
  text-align: center;
}

.os-empty h2 {
  color: var(--os-teal-dark);
  font-size: 18px;
  margin: 0 0 8px;
}

.os-empty p {
  margin: 0;
  font-size: 14px;
}

.os-raw-table td {
  max-width: 300px;
  font-size: 12px;
}

.os-raw-scroll {
  max-height: 480px;
  overflow: auto;
  margin-bottom: 20px;
}

.question-box {
  min-height: 180px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  outline: 0;
  line-height: 1.65;
  background: #fcfcfd;
}

.answer {
  display: grid;
  gap: 12px;
}

.answer-block {
  border-left: 4px solid var(--teal);
  padding: 12px 14px;
  background: #f5fffd;
  border-radius: 0 8px 8px 0;
  line-height: 1.65;
}

.checklist {
  display: grid;
  gap: 10px;
}

.check-item {
  display: grid;
  grid-template-columns: 24px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.check-item input {
  width: 18px;
  height: 18px;
}

.book-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.book-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  padding: 16px;
  min-height: 142px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.book-card h3 {
  margin: 0;
  font-size: 16px;
}

.book-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
  font-size: 14px;
}

.timeline {
  display: grid;
  gap: 12px;
}

.timeline-row {
  display: grid;
  grid-template-columns: 112px 1fr;
  gap: 16px;
}

.timeline-row time {
  color: var(--muted);
  font-size: 13px;
}

.timeline-row div {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.mobile-menu {
  display: none;
}

.vax-page {
  display: grid;
  gap: 18px;
  color: #172033;
}

.vax-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 22px;
  overflow: hidden;
  border: 1px solid rgba(11, 83, 91, .22);
  border-radius: 8px;
  background:
    radial-gradient(circle at 88% 18%, rgba(248, 214, 140, .28), transparent 30%),
    linear-gradient(135deg, #071827 0%, #0b535b 48%, #0f8f82 100%);
  color: #ffffff;
  padding: clamp(24px, 3vw, 36px);
  box-shadow: 0 24px 70px rgba(10, 28, 42, .22);
}

.vax-kicker {
  display: inline-flex;
  color: #f5d58a;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.vax-hero h1 {
  max-width: 760px;
  margin: 10px 0 12px;
  color: #ffffff;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.08;
}

.vax-hero p {
  max-width: 880px;
  margin: 0;
  color: rgba(255, 255, 255, .82);
  line-height: 1.75;
}

.vax-hero dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.vax-hero dl div {
  display: grid;
  align-content: center;
  min-height: 92px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 8px;
  background: rgba(255,255,255,.1);
  padding: 14px;
}

.vax-hero dt {
  color: rgba(255,255,255,.68);
  font-size: 12px;
  font-weight: 900;
}

.vax-hero dd {
  margin: 5px 0 0;
  color: #f8df9b;
  font-size: 28px;
  font-weight: 900;
}

.vax-alert-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.vax-alert-strip article {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  min-height: 92px;
  padding: 15px;
  border: 1px solid #e3e8ef;
  border-left: 4px solid #0f8f82;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .06);
}

.vax-alert-strip article.major {
  border-left-color: #b7791f;
  background: linear-gradient(180deg, #fff, #fffaf0);
}

.vax-alert-strip b {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: #0b535b;
  color: #f8df9b;
  font-size: 12px;
}

.vax-alert-strip p {
  margin: 0;
  color: #435267;
  font-size: 13px;
  line-height: 1.62;
}

.vax-toolbar {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #dde6ef;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}

.vax-search {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid #cfdce8;
  border-radius: 8px;
  background: #fbfdff;
  color: #0b535b;
}

.vax-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #172033;
  font-weight: 800;
}

.vax-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.vax-tabs button {
  min-height: 40px;
  border: 1px solid #d7e3ed;
  border-radius: 8px;
  background: #f8fafc;
  color: #475467;
  font-weight: 900;
  padding: 0 13px;
}

.vax-tabs button.active,
.vax-tabs button:hover {
  border-color: #0b535b;
  background: #0b535b;
  color: #ffffff;
}

.vax-section {
  display: none;
  border: 1px solid #dde6ef;
  border-radius: 8px;
  background: #ffffff;
  padding: clamp(18px, 2.5vw, 26px);
  box-shadow: 0 18px 46px rgba(15, 23, 42, .07);
}

.vax-section.active {
  display: grid;
  gap: 16px;
}

.vax-section-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e7edf3;
}

.vax-section-head > span {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  background: #e7f7f5;
  color: #0b535b;
  font-size: 21px;
}

.vax-section-head svg {
  width: 20px;
  height: 20px;
}

.vax-section-head h2 {
  margin: 0;
  color: #111827;
  font-size: 24px;
}

.vax-section-head p {
  margin: 6px 0 0;
  color: #667085;
  line-height: 1.6;
}

.vax-age-grid,
.vax-note-grid.premium,
.vax-calc-grid,
.vax-check-grid,
.vax-reaction-grid,
.vax-travel-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.vax-age-grid article,
.vax-note-grid article,
.vax-calc-card,
.vax-check-grid article,
.vax-reaction-grid article,
.vax-travel-grid article {
  border: 1px solid #e0e7ef;
  border-radius: 8px;
  background: #ffffff;
  padding: 17px;
}

.vax-age-grid h3,
.vax-travel-grid h3,
.vax-calc-card h3,
.vax-check-grid h3,
.vax-reaction-grid h3 {
  margin: 0 0 10px;
  color: #102334;
  font-size: 16px;
}

.vax-age-grid ul,
.vax-reaction-grid ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding-left: 18px;
  color: #526173;
  line-height: 1.55;
}

.vax-note-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.vax-note-grid article {
  border-left: 4px solid #0f8f82;
  background: #fbfefd;
}

.vax-note-grid article.danger {
  border-left-color: #d94848;
  background: #fff8f8;
}

.vax-note-grid article.success {
  border-left-color: #1f9d63;
  background: #f4fff8;
}

.vax-note-grid b {
  display: block;
  margin-bottom: 6px;
  color: #122638;
}

.vax-note-grid p,
.vax-travel-grid p,
.vax-reaction-grid p {
  margin: 0;
  color: #536577;
  line-height: 1.65;
}

.vax-card-list {
  display: grid;
  gap: 10px;
}

.vax-card {
  border: 1px solid #dce6ef;
  border-radius: 8px;
  background: #ffffff;
  overflow: hidden;
}

.vax-card summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  min-height: 92px;
  padding: 16px 18px;
  cursor: pointer;
  list-style: none;
}

.vax-card summary::-webkit-details-marker {
  display: none;
}

.vax-card summary h3 {
  margin: 6px 0 5px;
  color: #102334;
  font-size: 18px;
}

.vax-card summary p {
  margin: 0;
  color: #667085;
}

.vax-card[open] summary {
  background: linear-gradient(90deg, #fbfffe, #ffffff);
  border-bottom: 1px solid #e5edf3;
}

.vax-code {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  border-radius: 999px;
  background: #0b535b;
  color: #f8df9b;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 12px;
  font-weight: 900;
  padding: 4px 9px;
}

.vax-summary-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 430px;
}

.vax-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border-radius: 999px;
  background: #edf4ff;
  color: #315c9d;
  font-size: 12px;
  font-weight: 900;
  padding: 5px 10px;
}

.vax-badge.green { background: #e9f8f5; color: #0a6d63; }
.vax-badge.purple { background: #f3e8ff; color: #6d28d9; }
.vax-badge.amber { background: #fff7ed; color: #9a4f05; }
.vax-badge.blue { background: #edf4ff; color: #315c9d; }

.vax-card-body {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.vax-specs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.vax-specs div {
  min-height: 76px;
  border: 1px solid #e4ebf2;
  border-radius: 8px;
  background: #f8fafc;
  padding: 12px;
}

.vax-specs dt {
  color: #667085;
  font-size: 12px;
  font-weight: 900;
}

.vax-specs dd {
  margin: 6px 0 0;
  color: #122638;
  font-weight: 900;
  line-height: 1.45;
}

.vax-table-wrap {
  overflow-x: auto;
  border: 1px solid #dce6ef;
  border-radius: 8px;
}

.vax-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  background: #ffffff;
  font-size: 13px;
}

.vax-table.compact {
  min-width: 640px;
}

.vax-table th,
.vax-table td {
  border-bottom: 1px solid #e5edf3;
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
  color: #526173;
  line-height: 1.55;
}

.vax-table thead th {
  background: #0b535b;
  color: #ffffff;
  font-weight: 900;
}

.vax-table tbody th {
  color: #102334;
}

.vax-table tr:nth-child(even) th,
.vax-table tr:nth-child(even) td {
  background: #f8fafc;
}

.vax-travel-grid article {
  display: grid;
  align-content: start;
  gap: 9px;
}

.vax-travel-grid article > span {
  color: #0a6d63;
  font-weight: 900;
}

.vax-travel-grid div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.vax-calc-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.vax-calc-card {
  display: grid;
  gap: 12px;
}

.vax-calc-card label {
  display: grid;
  gap: 7px;
  color: #344054;
  font-weight: 900;
}

.vax-calc-card input,
.vax-calc-card select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #cfdce8;
  border-radius: 8px;
  background: #fff;
  color: #172033;
  padding: 0 12px;
}

.vax-result {
  min-height: 88px;
  border: 1px solid #dce6ef;
  border-radius: 8px;
  background: #f8fafc;
  color: #536577;
  line-height: 1.6;
  padding: 14px;
}

.vax-result strong {
  display: block;
  color: #0b535b;
  font-size: 17px;
}

.vax-result p {
  margin: 6px 0 0;
}

.vax-mini-table {
  display: grid;
  gap: 8px;
}

.vax-mini-table p {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
}

.vax-mini-table b {
  color: #122638;
}

.vax-mini-table span {
  color: #667085;
  text-align: right;
}

.vax-check-grid article {
  display: grid;
  align-content: start;
  gap: 9px;
}

.vax-check-grid label {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  color: #526173;
  line-height: 1.55;
}

.vax-check-grid input {
  width: 17px;
  height: 17px;
  accent-color: #0b535b;
}

.vax-reaction-grid {
  margin-top: 4px;
}

.vax-reaction-grid article {
  border-top: 4px solid #0f8f82;
}

.vax-reaction-grid article.danger { border-top-color: #d94848; }
.vax-reaction-grid article.warn { border-top-color: #b7791f; }
.vax-reaction-grid article.care { border-top-color: #315c9d; }
.vax-reaction-grid article.ok { border-top-color: #1f9d63; }

.vax-empty {
  padding: 16px;
  border: 1px solid #e7edf3;
  border-radius: 8px;
  background: #fffaf0;
  color: #8a6415;
  font-weight: 900;
}

.vax-muted {
  color: #667085;
}

.vax-footer {
  border-top: 1px solid #e5edf3;
  color: #667085;
  font-size: 12px;
  line-height: 1.7;
  padding: 14px 4px 0;
  text-align: center;
}

.ecg-page {
  display: grid;
  gap: 18px;
  color: #172033;
}

.ecg-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 22px;
  align-items: stretch;
  padding: 26px;
  border: 1px solid rgba(15, 143, 130, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(233, 250, 246, 0.92)),
    #ffffff;
  box-shadow: 0 18px 46px rgba(15, 23, 42, 0.08);
}

.ecg-kicker {
  display: inline-flex;
  margin-bottom: 10px;
  color: #0f8f82;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.ecg-hero h1 {
  margin: 0;
  color: #111827;
  font-size: 30px;
  line-height: 1.25;
}

.ecg-hero p {
  max-width: 860px;
  margin: 12px 0 0;
  color: #526173;
  line-height: 1.75;
}

.ecg-hero-stat {
  display: grid;
  place-items: center;
  padding: 18px;
  border: 1px solid rgba(15, 143, 130, 0.2);
  border-radius: 8px;
  background: #ffffff;
  text-align: center;
}

.ecg-hero-stat b {
  color: #0f8f82;
  font-size: 42px;
  line-height: 1;
}

.ecg-hero-stat span {
  color: #1f2937;
  font-weight: 900;
}

.ecg-hero-stat small {
  color: #667085;
}

.ecg-toolbar {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #ddebe8;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.ecg-search {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid #cfe5e2;
  border-radius: 8px;
  background: #fbfffe;
  color: #0f8f82;
}

.ecg-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #172033;
  font-weight: 700;
}

.ecg-section-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ecg-section-tabs button {
  min-height: 38px;
  border: 1px solid #d5e7e4;
  border-radius: 8px;
  padding: 0 12px;
  background: #f8fbfc;
  color: #475467;
  font-weight: 800;
}

.ecg-section-tabs button.active,
.ecg-section-tabs button:hover {
  border-color: #0f8f82;
  background: #0f8f82;
  color: #ffffff;
}

.ecg-section {
  display: none;
  border: 1px solid #ddebe8;
  border-radius: 8px;
  background: #ffffff;
  padding: 22px;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.ecg-section.active {
  display: block;
}

.ecg-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e5efed;
}

.ecg-section-head span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #e9faf6;
  color: #0f8f82;
  font-size: 21px;
}

.ecg-section-head h2 {
  margin: 0;
  color: #111827;
  font-size: 23px;
}

.ecg-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.ecg-metrics article {
  min-height: 112px;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 14px;
  border: 1px solid #dcebea;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #f6fbfb);
}

.ecg-metrics span,
.ecg-metrics small {
  color: #667085;
  font-weight: 700;
}

.ecg-metrics b {
  color: #0f8f82;
  font-size: 20px;
  line-height: 1.35;
}

.ecg-html {
  line-height: 1.75;
}

.ecg-page .sec-title {
  margin: 18px 0 14px;
  padding: 0 0 10px;
  border-bottom: 2px solid #b9e7df;
  color: #0f766e;
  font-size: 21px;
  font-weight: 900;
}

.ecg-page .sub-title,
.ecg-tab-title {
  margin: 18px 0 10px;
  color: #0f8f82;
  font-size: 17px;
  font-weight: 900;
}

.ecg-page .card,
.ecg-page .flow,
.ecg-page .box-info,
.ecg-page .box-warning,
.ecg-page .box-danger,
.ecg-page .box-success,
.ecg-page .box-purple {
  margin: 10px 0;
  border-radius: 8px;
  padding: 14px 16px;
}

.ecg-page .box-info {
  border-left: 4px solid #1976d2;
  background: #eef7ff;
  color: #16476f;
}

.ecg-page .box-warning {
  border-left: 4px solid #d99a00;
  background: #fff9e8;
  color: #684b00;
}

.ecg-page .box-danger {
  border-left: 4px solid #d92d20;
  background: #fff1f0;
  color: #8f1f17;
}

.ecg-page .box-success {
  border-left: 4px solid #2f9e44;
  background: #effaf1;
  color: #1f5f2d;
}

.ecg-page .box-purple {
  border: 1px solid #d8c2ea;
  background: #f8f2fd;
  color: #4b1f73;
}

.ecg-page .flow {
  border: 1px solid #d7e9e6;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}

.ecg-page .flow-n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin-right: 8px;
  border-radius: 999px;
  background: #0f8f82;
  color: #ffffff;
  font-weight: 900;
}

.ecg-page .flow-arr {
  text-align: center;
  color: #0f8f82;
  font-size: 22px;
}

.ecg-page .t {
  width: 100%;
  border-collapse: collapse;
  margin: 14px 0;
  overflow: hidden;
  border-radius: 8px;
  font-size: 14px;
}

.ecg-page .t th {
  padding: 11px 12px;
  border: 1px solid #168f85;
  background: #0f8f82;
  color: #ffffff;
  text-align: left;
}

.ecg-page .t td {
  padding: 10px 12px;
  border: 1px solid #dde8e6;
  background: #ffffff;
  vertical-align: top;
}

.ecg-page .t tr:nth-child(even) td {
  background: #f6fbfb;
}

.ecg-page .b {
  display: inline-block;
  margin: 2px 3px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.ecg-page .br { background: #ffebee; color: #c62828; border: 1px solid #ef9a9a; }
.ecg-page .bb { background: #e3f2fd; color: #1565c0; border: 1px solid #90caf9; }
.ecg-page .bg { background: #e8f5e9; color: #2e7d32; border: 1px solid #a5d6a7; }
.ecg-page .bo { background: #fff8e1; color: #a65f00; border: 1px solid #f0c24b; }
.ecg-page .bp { background: #f3e5f5; color: #6a1b9a; border: 1px solid #ce93d8; }
.ecg-page .red { color: #c62828; font-weight: 900; }
.ecg-page .yel { color: #c26a00; font-weight: 900; }
.ecg-page .grn { color: #2e7d32; font-weight: 900; }
.ecg-page .blu { color: #1565c0; font-weight: 900; }

.ecg-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 12px 0 18px;
}

.ecg-check-grid label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 11px 12px;
  border: 1px solid #dbe9e6;
  border-radius: 8px;
  background: #fbfffe;
  color: #334155;
  font-weight: 700;
}

.ecg-check-grid input {
  margin-top: 3px;
  accent-color: #0f8f82;
}

.ecg-footer {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border: 1px solid #dcebea;
  border-radius: 8px;
  background: #f8fbfc;
  color: #526173;
  line-height: 1.6;
}

.ecg-footer b {
  color: #0f8f82;
}

@media (max-width: 980px) {
  .vax-hero,
  .vax-alert-strip,
  .vax-age-grid,
  .vax-note-grid,
  .vax-note-grid.premium,
  .vax-calc-grid,
  .vax-check-grid,
  .vax-reaction-grid,
  .vax-travel-grid,
  .ecg-hero {
    grid-template-columns: 1fr;
  }

  .vax-hero,
  .ecg-hero {
    padding: 20px;
  }

  .vax-hero dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .vax-card summary,
  .vax-specs,
  .vax-mini-table p {
    grid-template-columns: 1fr;
  }

  .vax-summary-tags {
    justify-content: flex-start;
    max-width: none;
  }

  .vax-mini-table span {
    text-align: left;
  }

  .ecg-metrics,
  .ecg-check-grid {
    grid-template-columns: 1fr;
  }

  .ecg-section {
    padding: 16px;
  }

  .ecg-page .t {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }

  .ecg-section-tabs {
    flex-direction: column;
  }

  .ecg-section-tabs button {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 980px) {
  .hero {
    padding-top: 52px;
  }

  .landing-overview {
    grid-template-columns: 1fr;
  }

  .proof-strip {
    height: auto;
    grid-template-rows: none;
  }

  .hero-visual {
    height: auto;
    min-height: 0;
  }

  .device {
    height: auto;
    min-height: 388px;
  }

  .device-body {
    min-height: 0;
    height: auto;
  }

  .grid.two,
  .grid.three,
  .book-grid,
  .form-grid,
  .kpi-grid {
    grid-template-columns: 1fr;
  }

  .nurse-row {
    grid-template-columns: 1fr;
  }

  .ng-columns.three,
  .ng-columns.four,
  .ng-kpis,
  .ng-table-head.daytime,
  .ng-data-row.daytime,
  .ng-table-head.night,
  .ng-data-row.night {
    grid-template-columns: 1fr;
  }

  .ng-table-head {
    display: none;
  }

  .review-app {
    grid-template-columns: 1fr;
  }

  .review-visual-grid,
  .review-action-grid,
  .review-pie-row,
  .review-trend-grid,
  .review-compare-brief,
  .review-compare-detail,
  .review-report-kpi-row,
  .review-report-visuals {
    grid-template-columns: 1fr;
  }

  .review-donut-layout {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .review-a4-report {
    min-height: auto;
    padding: 18px;
  }

  .md-app {
    grid-template-columns: 1fr;
  }

  .md-controls {
    position: static;
  }

  .workspace:has(.md-app) {
    overflow-x: hidden;
  }

  .md-kpis,
  .md-dashboard-grid,
  .md-summary-cards,
  .md-dual,
  .md-executive {
    grid-template-columns: 1fr;
  }

  .md-donut-wrap {
    flex-direction: column;
    gap: 16px;
  }

  .md-cost-summary > div {
    grid-template-columns: 90px 1fr;
  }

  .md-cost-summary em {
    grid-column: 1 / -1;
  }

  .md-cost-summary strong {
    grid-column: 2;
    grid-row: 1;
  }

  .md-scenario-chart article {
    grid-template-columns: 1fr;
  }

  .os-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .os-upload-panel.compact {
    align-items: stretch;
    flex-direction: column;
  }

  .os-brand {
    text-align: left;
  }

  .os-upload-grid {
    grid-template-columns: 1fr;
  }

  .os-kpis,
  .os-dashboard-grid,
  .os-two-charts {
    grid-template-columns: 1fr;
  }

  .os-donut-layout {
    flex-direction: column;
    gap: 15px;
  }

  .review-controls {
    position: static;
  }

  .review-kpis,
  .review-summary-grid,
  .review-insights {
    grid-template-columns: 1fr;
  }

  .review-donut-card .review-donut-layout {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .review-composition-legend div {
    grid-template-columns: 10px minmax(70px, 1fr) auto;
  }

  .review-composition-legend em {
    grid-column: 2 / -1;
    text-align: left;
  }

  .hub-layout {
    grid-template-columns: 1fr;
  }

  .hub-tools {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .portal-tools {
    min-height: 0;
  }

  .guide-hero-panel,
  .guide-analysis-copy,
  .guide-search-panel {
    grid-template-columns: 1fr;
  }

  .guide-hero-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .guide-visual {
    min-height: 180px;
  }

  .guide-article summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .proof-strip {
    margin-top: 0;
  }

  .app-shell {
    grid-template-columns: 58px 1fr;
  }

  .side {
    display: none;
  }

  .app-shell.mobile-nav-open .side {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 40;
    width: min(300px, 88vw);
    display: flex;
    overflow-y: auto;
  }

  .workspace:has(.os-app) {
    padding: 18px 14px 28px;
  }

  .workspace:has(.kcd-app) {
    padding: 18px 14px 28px;
  }

  .kcd-header,
  .kcd-source {
    align-items: flex-start;
    flex-direction: column;
  }

  .kcd-source div {
    min-width: 0;
  }

  .kcd-browser,
  .kcd-definition {
    grid-template-columns: 1fr;
  }

  .kcd-browser {
    min-height: 0;
  }

  .mobile-menu {
    display: block;
  }
}

@media (max-width: 640px) {
  .landing-header {
    padding: 0 16px;
  }

  .nav-links a {
    display: none;
  }

  .hero {
    padding: 36px 16px 24px;
  }

  .hero h1 {
    font-size: 42px;
  }

  .hero-title-line {
    white-space: normal;
  }

  .device {
    position: relative;
  }

  .device-body {
    grid-template-columns: 1fr;
  }

  .mini-side {
    display: none;
  }

  .app-shell {
    grid-template-columns: 1fr;
  }

  .cl-hero {
    grid-template-columns: 1fr;
    padding: 20px 17px;
  }

  .cl-hero h1 {
    font-size: 24px;
  }

  .cl-hero aside {
    max-width: 240px;
  }

  .cl-search {
    grid-template-columns: 1fr;
    margin-bottom: 22px;
  }

  .cl-sync-head {
    flex-direction: column;
  }

  .cl-sync-grid {
    grid-template-columns: 1fr;
  }

  .cl-sync-foot {
    display: grid;
  }

  .cl-api-head {
    flex-direction: column;
  }

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

  .cl-api-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .cl-ranking h2 {
    font-size: 23px;
  }

  .cl-results article {
    flex-direction: column;
    align-items: stretch;
  }

  .cl-drug-header {
    padding: 17px;
  }

  .cl-drug-header h2 {
    font-size: 22px;
  }

  .cl-class-row {
    display: grid;
    gap: 8px;
  }

  .rail {
    display: none;
  }

  .guide-hero-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .guide-hero-stats span {
    min-height: 58px;
    font-size: 11px;
  }

  .guide-hero-stats b {
    font-size: 20px;
  }

  .guide-article summary {
    padding: 15px 16px;
  }

  .guide-article summary h3 {
    display: block;
    margin: 8px 0 0;
  }

  .guide-article-body {
    padding: 16px;
  }

  .guide-source-line {
    display: grid;
  }

  .review-header {
    align-items: start;
    flex-direction: column;
    padding: 20px;
  }

  .md-header {
    align-items: start;
    flex-direction: column;
    padding: 20px;
  }

  .md-header h1 {
    font-size: 21px;
  }

  .md-tabs button {
    padding: 0 12px;
  }

  .md-cost > div,
  .md-profit {
    grid-template-columns: 1fr;
  }

  .review-header h1 {
    font-size: 21px;
  }

  .review-tabs {
    overflow-x: auto;
  }

  .review-tabs button {
    white-space: nowrap;
    padding: 0 12px;
  }

  .review-filters,
  .review-warning-kpis {
    grid-template-columns: 1fr;
  }

  .review-bar-row {
    grid-template-columns: 75px 1fr;
  }

  .review-bar-row small {
    grid-column: 2;
  }

  .hub-header {
    align-items: start;
    flex-direction: column;
    padding: 20px 17px;
  }

  .hub-header h1 {
    font-size: 24px;
  }

  .hub-header-actions {
    width: 100%;
  }

  .hub-counts,
  .hub-tools {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hub-feed a {
    grid-template-columns: 72px minmax(0, 1fr);
    padding: 10px 0;
  }

  .hub-feed time {
    grid-column: 2;
  }

  .portal-search-zone {
    padding: 20px 16px;
  }

  .portal-search-zone h1 {
    font-size: 22px;
  }

  .portal-board-columns {
    grid-template-columns: 1fr;
  }

  .portal-feature-note,
  .portal-feature-card {
    min-height: 104px;
    padding: 16px 48px 16px 15px;
    gap: 12px;
  }

  .portal-ad {
    align-items: start;
    min-height: auto;
  }

  .portal-banner-grid {
    width: 100%;
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .portal-banner-slot {
    min-height: 132px;
    border-right: 0;
    border-bottom: 1px solid var(--portal-line);
  }

  .portal-banner-slot:last-child {
    border-bottom: 0;
  }

  .topbar {
    padding: 0 14px;
  }

  .workspace {
    padding: 18px 14px;
  }

  .dc-hero {
    padding: 18px 16px;
  }

  .dc-hero h1 {
    font-size: 26px;
  }

  .dx-masthead {
    padding: 20px 17px;
  }

  .dx-masthead h1 {
    font-size: 27px;
  }

  .dx-metrics {
    grid-template-columns: 1fr;
  }

  .board-head {
    align-items: stretch;
    flex-direction: column;
  }

  .resource-layout {
    grid-template-columns: 1fr;
  }

  .login-panel {
    padding: 22px 18px;
  }

  .module-list {
    grid-template-columns: 1fr;
  }

  .notice-card main {
    flex-direction: column;
  }

  .device .mini-main {
    padding: 16px;
  }

  .device .device-top {
    height: 40px;
  }

  .device .searchbar {
    height: 44px;
    margin: 12px 0;
  }

  .device .feature-card .inside {
    flex-direction: row;
    padding: 14px;
  }

  .device .chip-row {
    gap: 7px;
    margin-top: 14px;
  }

  .device .chip {
    padding: 7px 10px;
  }

  .device .mini-main > .chip-row {
    display: none;
  }
}
.hira-review-page {
  display: grid;
  gap: 22px;
}

.hira-hero {
  min-height: 260px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 28px;
  align-items: end;
  padding: 36px;
  border-radius: 8px;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(12, 32, 54, .92), rgba(15, 89, 93, .84)),
    url("https://images.unsplash.com/photo-1576091160399-112ba8d25d1d?auto=format&fit=crop&w=1800&q=80") center / cover;
  box-shadow: 0 24px 70px rgba(13, 36, 51, .22);
}

.hira-kicker {
  display: inline-flex;
  margin-bottom: 14px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  color: #9fe5d5;
}

.hira-hero h1 {
  margin: 0;
  font-size: 42px;
  line-height: 1.08;
  letter-spacing: 0;
}

.hira-hero p {
  max-width: 760px;
  margin: 14px 0 0;
  color: rgba(255, 255, 255, .86);
  font-size: 16px;
  line-height: 1.7;
}

.hira-hero aside {
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 8px;
  background: rgba(255, 255, 255, .12);
  backdrop-filter: blur(12px);
}

.hira-hero aside b {
  display: block;
  font-size: 44px;
  line-height: 1;
}

.hira-hero aside span,
.hira-hero aside small {
  display: block;
  margin-top: 8px;
  color: rgba(255, 255, 255, .86);
}

.hira-search-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid #d9e5ea;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 40px rgba(15, 46, 66, .08);
}

.hira-search-input {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px;
  border: 1px solid #c8d8df;
  border-radius: 8px;
  background: #f8fbfc;
}

.hira-search-input input {
  width: 100%;
  height: 54px;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 16px;
}

.hira-filter-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.hira-filter-row button {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid #d4e0e4;
  border-radius: 999px;
  background: #fff;
  color: #49636f;
  font-weight: 700;
  cursor: pointer;
}

.hira-filter-row button.active {
  border-color: #0f766e;
  background: #e5f6f2;
  color: #0f5f59;
}

.hira-screen-table {
  overflow: auto;
  border: 1px solid #b8c7d8;
  background: #f7f9fc;
}

.hira-screen-table table {
  width: 100%;
  min-width: 960px;
  border-collapse: collapse;
  font-size: 13px;
}

.hira-screen-table th {
  width: 72px;
  padding: 6px;
  border: 1px solid #c6d2df;
  background: #f1f4f8;
  color: #26343c;
  text-align: center;
  vertical-align: middle;
  line-height: 1.25;
}

.hira-screen-table td {
  padding: 3px;
  border: 1px solid #c6d2df;
  background: #fff;
}

.hira-screen-table td.wide {
  min-width: 280px;
}

.hira-screen-table input {
  width: 100%;
  height: 26px;
  padding: 0 8px;
  border: 1px solid #aebfd3;
  background: #fdfdfd;
  color: #26343c;
}

.hira-print-button {
  width: 100%;
  height: 28px;
  border: 1px solid #a6b8cc;
  background: linear-gradient(#f9fbff, #dfe7f2);
  color: #26343c;
  cursor: pointer;
}

.hira-content-row td {
  height: 260px;
  vertical-align: top;
}

.hira-content-preview {
  min-height: 250px;
  padding: 12px 10px;
  line-height: 1.75;
  white-space: normal;
}

.hira-content-preview p {
  margin: 0 0 12px;
}

.workspace:has(.irs-app) {
  padding: 22px 24px 34px;
}

.irs-app {
  display: grid;
  gap: 18px;
  color: #172636;
}

.irs-hero {
  min-height: 250px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  gap: 26px;
  align-items: end;
  padding: 34px 36px;
  border-radius: 8px;
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(9, 24, 41, .94), rgba(13, 94, 89, .84)),
    url("https://images.unsplash.com/photo-1586773860418-d37222d8fce3?auto=format&fit=crop&w=1800&q=82") center / cover;
  box-shadow: 0 24px 70px rgba(13, 36, 51, .2);
}

.irs-kicker {
  display: inline-flex;
  margin-bottom: 13px;
  color: #b8e6dc;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
}

.irs-hero h1 {
  margin: 0;
  font-size: 40px;
  line-height: 1.12;
  letter-spacing: 0;
}

.irs-hero p {
  max-width: 780px;
  margin: 14px 0 0;
  color: rgba(255, 255, 255, .88);
  font-size: 15px;
  line-height: 1.75;
  font-weight: 700;
}

.irs-hero aside {
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 8px;
  background: rgba(255, 255, 255, .13);
  backdrop-filter: blur(13px);
}

.irs-hero aside b {
  display: block;
  font-size: 46px;
  line-height: 1;
}

.irs-hero aside span,
.irs-hero aside small {
  display: block;
  margin-top: 8px;
  color: rgba(255, 255, 255, .88);
}

.irs-search-panel,
.irs-panel {
  border: 1px solid #d9e6e8;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 14px 44px rgba(17, 43, 61, .08);
}

.irs-search-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.irs-search {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 58px;
  padding: 0 17px;
  border: 1px solid #c8d9dd;
  border-radius: 8px;
  background: #f8fbfc;
}

.irs-search input {
  width: 100%;
  height: 54px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #172636;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
}

.irs-tabs,
.irs-calendar-tabs,
.irs-result-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.irs-tabs button,
.irs-calendar-tabs button,
.irs-result-grid button {
  min-height: 40px;
  border: 1px solid #d4e2e4;
  border-radius: 8px;
  background: #ffffff;
  color: #4a6170;
  font-weight: 800;
  cursor: pointer;
}

.irs-tabs button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 14px;
}

.irs-tabs button b,
.irs-result-grid button b {
  color: #0f8f82;
}

.irs-tabs button.active,
.irs-tabs button:hover,
.irs-calendar-tabs button.active,
.irs-calendar-tabs button:hover {
  border-color: rgba(15, 143, 130, .55);
  background: linear-gradient(135deg, rgba(15, 143, 130, .12), rgba(209, 166, 72, .12), #ffffff);
  color: #0b5f59;
}

.irs-panel {
  display: grid;
  gap: 16px;
  padding: 22px;
}

.irs-section-head span {
  display: block;
  color: #0f8f82;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.irs-section-head h2 {
  margin: 6px 0;
  color: #142333;
  font-size: 24px;
  line-height: 1.25;
}

.irs-section-head p,
.irs-muted {
  margin: 0;
  color: #667085;
  line-height: 1.65;
}

.irs-section-head.compact {
  margin-top: 8px;
}

.irs-law-box {
  display: grid;
  gap: 8px;
  padding: 16px 18px;
  border: 1px solid #d7e7e4;
  border-left: 4px solid #0f8f82;
  border-radius: 8px;
  background: #f7fcfb;
  color: #314654;
  line-height: 1.65;
}

.irs-law-box.danger {
  border-left-color: #d92d20;
  background: #fff5f4;
}

.irs-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.irs-select {
  display: grid;
  gap: 7px;
  color: #34495a;
  font-size: 13px;
  font-weight: 900;
}

.irs-select select {
  min-height: 42px;
  width: 100%;
  border: 1px solid #cbdde0;
  border-radius: 8px;
  background: #ffffff;
  color: #172636;
  padding: 0 12px;
  font: inherit;
}

.irs-count {
  color: #5a7180;
  font-weight: 800;
}

.irs-count b {
  color: #0f766e;
}

.irs-card-list {
  display: grid;
  gap: 10px;
}

.irs-detail-card {
  border: 1px solid #d8e6e8;
  border-radius: 8px;
  background: #ffffff;
  overflow: hidden;
}

.irs-detail-card summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 15px 17px;
  cursor: pointer;
  color: #172636;
  font-weight: 900;
}

.irs-detail-card summary small {
  color: #667085;
  font-size: 12px;
}

.irs-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0 17px 17px;
}

.irs-detail-grid p {
  margin: 0;
  padding: 13px;
  border: 1px solid #e2ecee;
  border-radius: 8px;
  background: #f8fbfc;
  color: #34495a;
  line-height: 1.6;
}

.irs-detail-grid p.wide {
  grid-column: 1 / -1;
}

.irs-detail-grid b {
  display: block;
  margin-bottom: 5px;
  color: #0b5f59;
}

.irs-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid #d9e3e6;
  background: #f6f8fa;
  color: #526371;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.irs-badge.danger { border-color: #efb1aa; background: #fff1f0; color: #b42318; }
.irs-badge.warning { border-color: #f0d18b; background: #fff8e6; color: #9a5b00; }
.irs-badge.ok { border-color: #b7dfc1; background: #effaf2; color: #247a3d; }
.irs-badge.info { border-color: #aacded; background: #eef7ff; color: #1565c0; }

.irs-table-wrap {
  overflow: auto;
  border: 1px solid #d4e2e5;
  border-radius: 8px;
}

.irs-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  font-size: 13px;
}

.irs-table th {
  padding: 12px;
  border-bottom: 1px solid #cbdde0;
  background: #0f766e;
  color: #ffffff;
  text-align: left;
  white-space: nowrap;
}

.irs-table td {
  padding: 12px;
  border-bottom: 1px solid #e3ecee;
  color: #263b4a;
  line-height: 1.55;
  vertical-align: top;
}

.irs-table tr:nth-child(even) td {
  background: #f8fbfb;
}

.irs-empty {
  min-height: 150px;
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 22px;
  border: 1px dashed #c4dcdf;
  border-radius: 8px;
  background: #f8fbfc;
  color: #667085;
  text-align: center;
}

.irs-empty b {
  color: #172636;
}

.irs-answer {
  margin: 0 17px 10px;
  padding: 15px;
  border: 1px solid #e1ecee;
  border-left: 4px solid #0f8f82;
  border-radius: 8px;
  background: #f8fbfc;
  color: #2e4351;
  line-height: 1.75;
}

.irs-detail-card.faq small {
  display: block;
  padding: 0 17px 17px;
  color: #667085;
}

.irs-tip-grid,
.irs-alert-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.irs-tip-grid article,
.irs-alert-grid article,
.irs-month-box {
  display: grid;
  gap: 7px;
  padding: 15px;
  border: 1px solid #d9e6e8;
  border-left: 4px solid #0f8f82;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(16, 43, 59, .06);
}

.irs-alert-grid article.danger {
  border-left-color: #d92d20;
}

.irs-tip-grid b,
.irs-alert-grid b,
.irs-month-box b {
  color: #152838;
}

.irs-tip-grid span,
.irs-alert-grid span,
.irs-month-box span {
  color: #5f7180;
  line-height: 1.6;
}

.irs-result-grid button {
  display: grid;
  gap: 3px;
  min-width: 118px;
  padding: 10px 12px;
  text-align: left;
}

.irs-result-grid button b {
  font-size: 22px;
  line-height: 1;
}

.irs-calendar-tabs button {
  padding: 0 14px;
}

.irs-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 16px 18px;
  border: 1px solid #d9e6e8;
  border-radius: 8px;
  background: #f8fbfc;
  color: #667085;
  font-size: 13px;
  line-height: 1.6;
}

.irs-footer span {
  flex-basis: 100%;
}

.irs-footer a {
  color: #0f766e;
  font-weight: 900;
  text-decoration: none;
}

@media (max-width: 920px) {
  .workspace:has(.irs-app) {
    padding: 18px 14px 28px;
  }

  .irs-hero {
    grid-template-columns: 1fr;
    min-height: auto;
    padding: 28px 22px;
  }

  .irs-hero h1 {
    font-size: 30px;
  }

  .irs-filter-grid,
  .irs-detail-grid,
  .irs-tip-grid,
  .irs-alert-grid {
    grid-template-columns: 1fr;
  }

  .irs-detail-card summary {
    grid-template-columns: 1fr;
  }

  .irs-tabs button {
    width: 100%;
  }
}

.hira-layout {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  gap: 20px;
}

.hira-result-list,
.hira-detail {
  border: 1px solid #d9e5ea;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 44px rgba(15, 46, 66, .08);
}

.hira-result-list {
  overflow: hidden;
  align-self: start;
}

.hira-list-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  border-bottom: 1px solid #e3edf0;
  background: #f7fbfc;
}

.hira-list-head span {
  color: #0f766e;
  font-weight: 800;
}

.hira-result-list button {
  display: grid;
  gap: 7px;
  width: 100%;
  padding: 16px;
  border: 0;
  border-bottom: 1px solid #edf3f5;
  background: #fff;
  color: #24343c;
  text-align: left;
  cursor: pointer;
}

.hira-result-list button.active {
  background: #edf8f5;
  box-shadow: inset 4px 0 0 #0f766e;
}

.hira-result-list button span {
  color: #0f766e;
  font-size: 12px;
  font-weight: 800;
}

.hira-result-list button b {
  line-height: 1.45;
}

.hira-result-list button small {
  color: #60737c;
  line-height: 1.35;
}

.hira-no-result {
  padding: 28px 16px;
  color: #60737c;
}

.hira-detail {
  padding: 28px;
}

.hira-detail-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.hira-detail-top span {
  padding: 6px 10px;
  border-radius: 999px;
  background: #e5f6f2;
  color: #0f5f59;
  font-size: 12px;
  font-weight: 800;
}

.hira-detail-top time {
  color: #758993;
  font-weight: 700;
}

.hira-detail h2 {
  margin: 16px 0 18px;
  font-size: 28px;
  line-height: 1.25;
  letter-spacing: 0;
  color: #152933;
}

.hira-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 24px;
}

.hira-meta-grid div {
  min-height: 82px;
  padding: 13px;
  border: 1px solid #e0eaed;
  border-radius: 8px;
  background: #f8fbfc;
}

.hira-meta-grid b,
.hira-meta-grid span {
  display: block;
}

.hira-meta-grid b {
  margin-bottom: 8px;
  color: #60737c;
  font-size: 12px;
}

.hira-meta-grid span {
  color: #21333c;
  line-height: 1.45;
  font-weight: 700;
}

.hira-detail section {
  margin-top: 22px;
}

.hira-detail h3 {
  margin: 0 0 12px;
  color: #152933;
}

.hira-detail p {
  margin: 0 0 10px;
  color: #334a55;
  line-height: 1.75;
}

.hira-ai-box {
  padding: 18px;
  border: 1px solid #b9ded7;
  border-radius: 8px;
  background: linear-gradient(135deg, #f2fbf8, #fbfefd);
}

.hira-ai-box > div {
  margin-bottom: 10px;
}

.hira-ai-box span {
  color: #0f766e;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
}

.hira-ai-box ul {
  margin: 0;
  padding-left: 18px;
  color: #253941;
  line-height: 1.7;
}

.hira-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0;
}

.hira-tags span {
  padding: 6px 10px;
  border-radius: 999px;
  background: #eef3f5;
  color: #526975;
  font-size: 12px;
  font-weight: 800;
}

.hira-source-link {
  width: fit-content;
}

.hira-source-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 10px 12px;
  border: 1px solid #d9e5ea;
  border-radius: 8px;
  background: #f7fafb;
  color: #526975;
  font-size: 13px;
  font-weight: 800;
}

.hira-detail-empty {
  padding: 32px;
  border: 1px solid #d9e5ea;
  border-radius: 8px;
  background: #fff;
}

@media (max-width: 980px) {
  .tm-hero,
  .hira-hero,
  .hira-layout,
  .aic-filter-grid,
  .aic-workbench,
  .aic-ai-box,
  .uc-section-tabs,
  .uc-workbench,
  .uc-ai-box {
    grid-template-columns: 1fr;
  }

  .aic-hero,
  .uc-hero,
  .uc-detail-top {
    align-items: stretch;
    flex-direction: column;
  }

  .aic-hero dl,
  .uc-hero dl {
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .uc-structured-grid {
    grid-template-columns: 1fr;
  }

  .aic-structured-grid {
    grid-template-columns: 1fr;
  }

  .aic-result-list,
  .uc-result-list {
    position: static;
  }

  .aic-result-scroll,
  .uc-result-scroll {
    max-height: 420px;
  }

  .tm-hero {
    display: grid;
  }

  .tm-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hira-hero {
    padding: 26px;
  }

  .hira-hero h1 {
    font-size: 34px;
  }

  .hira-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .aic-hero,
  .aic-detail,
  .aic-search-panel,
  .uc-hero,
  .uc-detail,
  .uc-search-panel {
    padding: 16px;
  }

  .aic-hero h1,
  .uc-hero h1 {
    font-size: 25px;
  }

  .aic-detail h2,
  .uc-detail h2 {
    font-size: 20px;
  }

  .tm-hero {
    padding: 22px;
  }

  .tm-hero h1 {
    font-size: 26px;
  }

  .tm-summary {
    grid-template-columns: 1fr;
  }

  .tm-table-head {
    align-items: stretch;
    flex-direction: column;
  }

  .hira-hero h1 {
    font-size: 30px;
  }

  .hira-meta-grid {
    grid-template-columns: 1fr;
  }

  .hira-detail {
    padding: 20px;
  }
}


.wonmu-roadmap {
  max-width: 1320px;
  margin: 0 auto;
  color: #172520;
}

.app-shell:has(.wonmu-roadmap) {
  grid-template-columns: 280px minmax(0, 1fr);
}

.app-shell:has(.wonmu-roadmap) .side {
  display: flex;
}

.app-shell:has(.wonmu-roadmap) .mobile-menu {
  display: none;
}

.wr-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 18px;
  padding: clamp(28px, 5vw, 56px);
  border: 1px solid rgba(38, 91, 79, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(13, 59, 52, 0.96), rgba(23, 106, 88, 0.92)),
    linear-gradient(45deg, #112d28, #1c5b4c);
  color: #fff;
  box-shadow: 0 24px 70px rgba(14, 45, 39, 0.22);
}

.wr-kicker,
.wr-section-head span {
  display: inline-block;
  color: #bfe7dd;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.wr-hero h1 {
  margin: 10px 0 16px;
  font-size: clamp(36px, 5vw, 62px);
  line-height: 1.05;
  letter-spacing: 0;
}

.wr-hero p {
  max-width: 780px;
  margin: 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 16px;
  line-height: 1.8;
}

.wr-hero-metrics {
  display: grid;
  gap: 10px;
}

.wr-hero-metrics article {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: 20px;
}

.wr-hero-metrics b {
  display: block;
  font-size: 36px;
  line-height: 1;
}

.wr-hero-metrics span {
  color: rgba(255, 255, 255, 0.74);
  font-weight: 800;
}

.wr-flow,
.wr-grid,
.wr-two-col,
.wr-timeline {
  margin-top: 18px;
}

.wr-flow {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px;
}

.wr-flow span {
  min-height: 56px;
  display: grid;
  place-items: center;
  border: 1px solid #d7e4df;
  border-radius: 8px;
  background: #fff;
  color: #25433c;
  font-size: 13px;
  font-weight: 900;
  text-align: center;
  box-shadow: 0 10px 26px rgba(32, 62, 55, 0.06);
}

.wr-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.wr-card,
.wr-term-grid article,
.wr-scripts article,
.wr-danger,
.wr-premium-panel,
.wr-step {
  border: 1px solid #dce8e4;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(32, 62, 55, 0.07);
}

.wr-card {
  position: relative;
  overflow: hidden;
  padding: 20px;
}

.wr-card small {
  display: inline-block;
  color: #0e7567;
  font-size: 26px;
  font-weight: 900;
}

.wr-card h3 {
  margin: 12px 0 8px;
  font-size: 16px;
}

.wr-card p,
.wr-term-grid p,
.wr-scripts p,
.wr-step-body p,
.wr-section-head p {
  margin: 0;
  color: #587069;
  line-height: 1.68;
}

.wr-card i {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background: linear-gradient(90deg, #0f766e, #b69258);
}

.wr-section-head {
  margin-top: 34px;
  margin-bottom: 14px;
}

.wr-section-head h2 {
  margin: 6px 0 8px;
  font-size: 25px;
  color: #162924;
}

.wr-section-head.compact {
  margin-top: 0;
}

.wr-timeline {
  display: grid;
  gap: 12px;
}

.wr-step {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  overflow: hidden;
}

.wr-step-side {
  display: grid;
  align-content: center;
  gap: 8px;
  padding: 24px;
  background: linear-gradient(180deg, #f5f8f7, #edf4f1);
  border-right: 1px solid #dce8e4;
}

.wr-step-side b {
  color: #0f766e;
  font-size: 16px;
}

.wr-step-side span {
  color: #7b6540;
  font-weight: 900;
}

.wr-step-body {
  padding: 24px;
}

.wr-step-body h3 {
  margin: 0 0 8px;
  font-size: 20px;
}

.wr-step-body ul,
.wr-danger ul,
.wr-premium-panel ol {
  margin: 16px 0 0;
  padding-left: 20px;
  color: #324943;
  line-height: 1.78;
}

.wr-check {
  display: grid;
  gap: 5px;
  margin-top: 16px;
  border: 1px solid #d6e5df;
  border-radius: 8px;
  background: #f7fbf9;
  padding: 14px 16px;
}

.wr-check strong {
  color: #0f766e;
  font-size: 13px;
}

.wr-check span {
  color: #2e4b44;
  line-height: 1.62;
}

.wr-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
  gap: 16px;
}

.wr-term-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.wr-term-grid article,
.wr-scripts article,
.wr-danger,
.wr-premium-panel {
  padding: 18px;
}

.wr-term-grid h3,
.wr-scripts h3 {
  margin: 0 0 8px;
  color: #153c35;
  font-size: 16px;
}

.wr-scripts {
  display: grid;
  gap: 10px;
}

.wr-danger {
  background: linear-gradient(180deg, #fff, #fff8f6);
  border-color: #ead1c8;
}

.wr-danger h2 {
  color: #8f3525;
}

@media (max-width: 1100px) {
  .wr-hero,
  .wr-two-col,
  .wr-step {
    grid-template-columns: 1fr;
  }

  .wr-grid,
  .wr-flow,
  .wr-term-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .wr-hero {
    padding: 24px;
  }

  .wr-grid,
  .wr-flow,
  .wr-term-grid {
    grid-template-columns: 1fr;
  }
}

.arh-page { display: grid; gap: 18px; color: #132638; }
.arh-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .68fr); gap: 24px; align-items: stretch;
  padding: 28px; border: 1px solid rgba(15, 143, 130, .22); border-radius: 8px;
  background: linear-gradient(135deg, rgba(8, 23, 36, .96), rgba(11, 83, 91, .92)), radial-gradient(circle at 84% 18%, rgba(209, 166, 72, .28), transparent 34%);
  color: #fff; box-shadow: 0 24px 60px rgba(18, 38, 56, .18);
}
.arh-hero.compact {
  grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
  gap: 18px;
  padding: 18px 22px;
  min-height: 0;
}
.arh-hero.compact:not(:has(dl)) {
  grid-template-columns: 1fr;
}
.arh-hero.fee-hero {
  grid-template-columns: 1fr;
}
.arh-hero > div > span {
  display: inline-flex; width: fit-content; padding: 4px 10px; border: 1px solid rgba(226, 184, 92, .55);
  border-radius: 999px; color: #f8df9b; font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase;
}
.arh-hero h1 { margin: 12px 0 10px; font-size: clamp(1.8rem, 3vw, 2.55rem); line-height: 1.14; }
.arh-hero p { max-width: 760px; margin: 0; color: rgba(255,255,255,.78); line-height: 1.75; }
.arh-hero dl, .arh-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.arh-hero dl div, .arh-stat-grid article, .arh-info-grid article, .arh-resource-grid article, .arh-info-card {
  padding: 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 8px; background: rgba(255,255,255,.09); backdrop-filter: blur(8px);
}
.arh-hero dt, .arh-stat-grid span { color: rgba(255,255,255,.68); font-size: .76rem; font-weight: 900; }
.arh-hero dd, .arh-stat-grid b { margin: 6px 0 0; color: #fff; font-size: 1.65rem; font-weight: 900; }
.arh-hero.compact h1 {
  margin: 8px 0 7px;
  font-size: clamp(1.45rem, 2.2vw, 2rem);
}
.arh-hero.compact p {
  max-width: 680px;
  font-size: .9rem;
  line-height: 1.6;
}
.arh-hero.compact dl {
  align-content: center;
  gap: 8px;
}
.arh-hero.compact dl div {
  padding: 11px 12px;
}
.arh-hero.compact dt {
  font-size: .68rem;
}
.arh-hero.compact dd {
  margin-top: 3px;
  font-size: 1.15rem;
}
.arh-tabs, .arh-subtabs, .arh-month-row { display: flex; gap: 8px; overflow-x: auto; padding: 4px; }
.arh-tabs button, .arh-subtabs button, .arh-month-row button, .arh-control-button {
  border: 1px solid rgba(15, 143, 130, .2); border-radius: 8px; background: rgba(255,255,255,.88);
  color: #294457; font-weight: 900; cursor: pointer; transition: border-color .2s ease, transform .2s ease, background .2s ease;
}
.arh-tabs button, .arh-subtabs button { min-height: 42px; padding: 0 16px; }
.arh-tabs button.active, .arh-subtabs button.active, .arh-month-row button.active, .arh-control-button:not(.ghost) {
  border-color: rgba(15, 143, 130, .55); background: linear-gradient(135deg, rgba(15, 143, 130, .14), rgba(209, 166, 72, .16)); color: #0a564f;
}
.arh-tabs button:hover, .arh-subtabs button:hover, .arh-month-row button:hover, .arh-control-button:hover { transform: translateY(-1px); border-color: rgba(209, 166, 72, .52); }
.arh-panel { padding: 22px; border: 1px solid rgba(15, 143, 130, .18); border-radius: 8px; background: rgba(255,255,255,.92); box-shadow: 0 16px 44px rgba(28, 55, 78, .08); }
.arh-section-head { margin-bottom: 18px; }
.arh-section-head h2, .arh-month-head h2 { margin: 8px 0; color: #122638; font-size: 1.42rem; }
.arh-section-head p, .arh-month-head p { margin: 0; color: #667085; line-height: 1.7; }
.arh-month-row { margin-bottom: 14px; }
.arh-month-row button { min-width: 88px; padding: 10px 12px; text-align: left; }
.arh-month-row b, .arh-month-row span { display: block; }
.arh-month-row span { margin-top: 4px; color: #667085; font-size: .78rem; }
.arh-month-head {
  display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 16px; align-items: stretch;
  padding: 18px; border: 1px solid rgba(15, 143, 130, .18); border-radius: 8px; background: linear-gradient(135deg, #f8fffd, #f8fafc);
}
.arh-month-head > div > span { color: #0f8f82; font-weight: 900; }
.arh-progress-card { display: grid; align-content: center; gap: 6px; }
.arh-progress-card strong { color: #0f8f82; font-size: 2rem; }
.arh-progress-card span { color: #667085; font-size: .82rem; }
.arh-progress-card i, .arh-mini-bar { display: block; overflow: hidden; height: 8px; border-radius: 999px; background: #e6edf2; }
.arh-progress-card em, .arh-mini-bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #0f8f82, #3f76c8, #d1a648); }
.arh-controls, .arh-search-line { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)) auto auto; gap: 10px; margin: 16px 0; align-items: end; }
.arh-search-line { grid-template-columns: minmax(240px, 1fr) 220px; }
.arh-select span { display: block; margin-bottom: 6px; color: #667085; font-size: .75rem; font-weight: 900; }
.arh-select select, .arh-search-line input {
  width: 100%; min-height: 42px; border: 1px solid rgba(15, 143, 130, .18); border-radius: 8px; background: #fff; color: #122638; padding: 0 12px; font: inherit;
}
.arh-search-line label:first-child {
  display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 0 12px; border: 1px solid rgba(15, 143, 130, .18); border-radius: 8px; background: #fff;
}
.arh-search-line label:first-child input { border: 0; background: transparent; padding: 0; }
.arh-control-button { min-height: 42px; padding: 0 14px; white-space: nowrap; }
.arh-control-button.ghost { background: rgba(255,255,255,.6); }
.arh-task-groups { display: grid; gap: 18px; }
.arh-task-groups h3, .arh-term-group h3, .arh-urgent h3, .arh-table-section h3 { margin: 18px 0 10px; color: #122638; }
.arh-task {
  display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 14px; margin-bottom: 10px; padding: 16px;
  border: 1px solid rgba(15, 143, 130, .14); border-left-width: 4px; border-radius: 8px; background: #fff;
}
.arh-task.compact { grid-template-columns: minmax(0, 1fr); }
.arh-task.high { border-left-color: #d94848; }
.arh-task.mid { border-left-color: #d1a648; }
.arh-task.low { border-left-color: #0f8f82; }
.arh-task.done { opacity: .62; }
.arh-task label { display: grid; place-items: start center; padding-top: 3px; }
.arh-task input { width: 18px; height: 18px; accent-color: #0f8f82; }
.arh-task header { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.arh-task h4 { margin: 0; color: #122638; font-size: .98rem; }
.arh-task p { margin: 8px 0 0; color: #536577; line-height: 1.65; }
.arh-task footer { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 10px; color: #667085; font-size: .8rem; }
.arh-task footer b { color: #9a741f; }
.arh-badge { display: inline-flex; align-items: center; min-height: 24px; margin-left: 6px; padding: 0 8px; border-radius: 999px; font-size: .72rem; font-weight: 900; }
.arh-badge.danger { color: #ad2635; border: 1px solid rgba(217,72,72,.32); background: rgba(217,72,72,.09); }
.arh-badge.warn { color: #8a6415; border: 1px solid rgba(209,166,72,.38); background: rgba(209,166,72,.12); }
.arh-badge.ok { color: #0a6d63; border: 1px solid rgba(15,143,130,.35); background: rgba(15,143,130,.1); }
.arh-badge.info { color: #315c9d; border: 1px solid rgba(63,118,200,.28); background: rgba(63,118,200,.08); }
.arh-result-note, .arh-empty, .arh-success, .arh-alert {
  padding: 14px 16px; border: 1px solid rgba(15, 143, 130, .16); border-radius: 8px; background: #f8fafc; color: #536577;
}
.arh-success { border-color: rgba(15,143,130,.35); color: #0a6d63; }
.arh-alert { margin: 14px 0; border-color: rgba(209,166,72,.38); color: #8a6415; background: #fffaf0; }
.arh-term-grid, .arh-info-grid, .arh-resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.arh-term, .arh-resource-grid article {
  padding: 18px; border: 1px solid rgba(15, 143, 130, .16); border-radius: 8px; background: #fff;
}
.arh-term strong { display: block; color: #0a6d63; font-family: "SFMono-Regular", Consolas, monospace; font-size: 1.05rem; }
.arh-term b, .arh-resource-grid h3, .arh-info-grid h3, .arh-info-card h3 { display: block; margin: 6px 0; color: #0f8f82; }
.arh-term p, .arh-resource-grid p, .arh-info-grid p, .arh-info-card p { margin: 0; color: #536577; line-height: 1.65; }
.arh-term small { display: block; margin-top: 10px; padding: 9px 10px; border-left: 3px solid #0f8f82; border-radius: 6px; background: rgba(15,143,130,.08); color: #0a6d63; }
.arh-table-wrap { overflow-x: auto; border: 1px solid rgba(15,143,130,.14); border-radius: 8px; }
.arh-table { width: 100%; min-width: 720px; border-collapse: collapse; background: #fff; }
.arh-table th, .arh-table td { padding: 12px 14px; border-bottom: 1px solid #e6edf2; color: #536577; text-align: left; vertical-align: top; }
.arh-table thead th { color: #0f8f82; background: #f8fffd; }
.arh-mini-bar { position: relative; min-width: 140px; }
.arh-mini-bar span { position: absolute; right: 8px; top: -1px; color: #122638; font-size: .72rem; font-weight: 900; }
.arh-flow { display: grid; gap: 10px; }
.arh-flow article { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; align-items: start; }
.arh-flow article > span { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(15,143,130,.45); border-radius: 999px; color: #0f8f82; background: rgba(15,143,130,.08); font-weight: 900; }
.arh-flow article > div { padding: 14px 16px; border: 1px solid rgba(15,143,130,.14); border-radius: 8px; background: #fff; }
.arh-flow h3 { margin: 0 0 5px; color: #122638; }
.arh-flow h3 small, .arh-resource-grid small { margin-left: 6px; color: #667085; font-size: .76rem; }
.arh-flow p { margin: 0; color: #536577; }
.arh-tip-list { display: grid; gap: 8px; margin-top: 14px; }
.arh-tip-list p { margin: 0; padding: 12px 14px; border: 1px solid rgba(15,143,130,.16); border-radius: 8px; background: rgba(15,143,130,.07); color: #0a6d63; }
.arh-resource-grid a { display: inline-flex; margin-top: 10px; color: #315c9d; font-weight: 900; }

@media (max-width: 980px) {
  .arh-hero, .arh-month-head, .arh-controls, .arh-search-line { grid-template-columns: 1fr; }
  .arh-term-grid, .arh-info-grid, .arh-resource-grid, .arh-hero dl, .arh-stat-grid { grid-template-columns: 1fr; }
}

@media (min-width: 981px) {
  .arh-hero.compact {
    grid-template-columns: minmax(0, 1fr) 360px;
    align-items: center;
  }

  .arh-hero.compact dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 360px;
  }
}

.arh-board-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.arh-board-switch button {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  grid-template-areas: "num title" "num desc";
  gap: 4px 14px;
  align-items: center;
  min-height: 92px;
  padding: 18px;
  border: 1px solid rgba(15, 143, 130, .18);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(248,255,253,.9));
  color: #122638;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 12px 32px rgba(28, 55, 78, .07);
}

.arh-board-switch button.active {
  border-color: rgba(15, 143, 130, .56);
  background: linear-gradient(135deg, rgba(15, 143, 130, .14), rgba(209, 166, 72, .14), rgba(255,255,255,.96));
}

.arh-board-switch span {
  grid-area: num;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: #0b535b;
  color: #f8df9b;
  font-weight: 900;
  font-family: "SFMono-Regular", Consolas, monospace;
}

.arh-board-switch b {
  grid-area: title;
  font-size: 1.02rem;
  font-weight: 900;
}

.arh-board-switch small {
  grid-area: desc;
  color: #667085;
  line-height: 1.45;
}

.arh-board-panel {
  display: grid;
  gap: 16px;
}

.arh-board-panel > .arh-board-title,
.fee-board > .arh-board-title {
  display: none;
}

.arh-board-title {
  padding: 18px 20px;
  border: 1px solid rgba(15, 143, 130, .16);
  border-radius: 8px;
  background: linear-gradient(135deg, #ffffff, #f8fffd);
}

.arh-board-title span {
  color: #0f8f82;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.arh-board-title h2 {
  margin: 6px 0;
  color: #122638;
  font-size: 1.38rem;
}

.arh-board-title p {
  margin: 0;
  color: #667085;
}

.fee-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.fee-summary-grid.small {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 12px;
}

.fee-summary-grid article {
  padding: 16px;
  border: 1px solid rgba(15, 143, 130, .16);
  border-radius: 8px;
  background: #fff;
}

.fee-summary-grid span {
  display: block;
  color: #667085;
  font-size: .76rem;
  font-weight: 900;
}

.fee-summary-grid b {
  display: block;
  margin-top: 5px;
  color: #0b535b;
  font-size: 1.45rem;
  font-weight: 900;
}

.fee-summary-grid small {
  display: block;
  margin-top: 5px;
  color: #7b8794;
}

.fee-tool-panel {
  display: grid;
  gap: 16px;
}

.fee-control-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.fee-control-grid.compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fee-field input {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(15, 143, 130, .18);
  border-radius: 8px;
  background: #fff;
  color: #122638;
  padding: 0 12px;
  font: inherit;
}

.fee-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 16px;
  align-items: start;
}

.fee-small-title {
  margin: 16px 0 8px;
  color: #122638;
  font-size: .98rem;
}

.fee-add-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.fee-add {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 2px 8px;
  padding: 12px;
  border: 1px solid rgba(15, 143, 130, .14);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
}

.fee-add.active {
  border-color: rgba(15, 143, 130, .44);
  background: rgba(15, 143, 130, .07);
}

.fee-add input {
  grid-row: span 2;
  margin-top: 2px;
  accent-color: #0f8f82;
}

.fee-add b {
  color: #122638;
  font-size: .86rem;
}

.fee-add span {
  color: #667085;
  font-size: .76rem;
  line-height: 1.45;
}

.fee-formula {
  margin: 14px 0;
  padding: 12px 14px;
  border: 1px solid rgba(63, 118, 200, .18);
  border-radius: 8px;
  background: #f3f8ff;
  color: #315c9d;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-weight: 800;
}

.fee-primary {
  width: 100%;
  justify-content: center;
}

.fee-result-box {
  padding: 22px;
  border-radius: 8px;
  background: linear-gradient(135deg, #0b2f4a, #0b535b);
  color: #fff;
  box-shadow: 0 18px 48px rgba(11, 47, 74, .2);
}

.fee-result-box > span {
  color: rgba(255,255,255,.68);
  font-size: .78rem;
  font-weight: 900;
}

.fee-result-box > strong {
  display: block;
  margin-top: 7px;
  color: #fff176;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: clamp(2rem, 4vw, 2.7rem);
  line-height: 1.1;
}

.fee-result-box > small {
  display: block;
  margin-top: 7px;
  color: rgba(255,255,255,.72);
}

.fee-result-box dl {
  margin: 18px 0 0;
}

.fee-result-box dl div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.14);
}

.fee-result-box dt {
  color: rgba(255,255,255,.72);
}

.fee-result-box dd {
  margin: 0;
  color: #fff;
  font-weight: 900;
  font-family: "SFMono-Regular", Consolas, monospace;
}

.fee-detail-card {
  padding: 18px;
  border: 1px solid rgba(15, 143, 130, .16);
  border-radius: 8px;
  background: #fff;
}

.fee-detail-card h3 {
  margin: 0 0 12px;
  color: #122638;
}

.fee-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.fee-upload-card {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(15, 143, 130, .16);
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff, #fbfefd);
  box-shadow: 0 12px 30px rgba(15, 42, 60, .06);
}

.fee-upload-card h3 {
  margin: 0;
  color: #122638;
}

.fee-upload-card p {
  margin: 0;
  color: #667085;
  line-height: 1.65;
}

.fee-upload-card.locked {
  background: #f8fafc;
}

.fee-file-drop {
  display: grid;
  gap: 8px;
  place-items: center;
  min-height: 150px;
  padding: 20px;
  border: 1px dashed rgba(15, 143, 130, .42);
  border-radius: 8px;
  background: #f5fffc;
  color: #526777;
  text-align: center;
  cursor: pointer;
}

.fee-file-drop input {
  width: 100%;
  color: #526777;
}

.fee-file-drop b {
  color: #0f766e;
  font-size: 1rem;
}

.fee-upload-message {
  min-height: 42px;
  padding: 12px 14px;
  border: 1px solid rgba(15, 143, 130, .16);
  border-radius: 8px;
  background: #f8fafc;
  color: #536577;
  font-weight: 800;
}

.fee-upload-summary {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.fee-upload-actions {
  display: flex;
  justify-content: flex-end;
}

.fee-search-line {
  margin: 0;
}

.fee-mode-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.fee-mode-row button {
  min-height: 40px;
  border: 1px solid rgba(15, 143, 130, .18);
  border-radius: 8px;
  background: #f8fafc;
  color: #294457;
  font-weight: 900;
  cursor: pointer;
}

.fee-mode-row button.active {
  border-color: rgba(15, 143, 130, .52);
  background: rgba(15, 143, 130, .1);
  color: #0a6d63;
}

.fee-cart-list {
  display: grid;
  gap: 8px;
}

.fee-cart-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 28px;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #e6edf2;
  border-radius: 8px;
  background: #f8fafc;
}

.fee-cart-list b,
.fee-cart-list span {
  display: block;
}

.fee-cart-list b {
  color: #122638;
}

.fee-cart-list span {
  margin-top: 2px;
  color: #667085;
  font-size: .78rem;
}

.fee-cart-list strong {
  color: #9a741f;
  font-family: "SFMono-Regular", Consolas, monospace;
}

.fee-cart-list button {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: rgba(217, 72, 72, .1);
  color: #ad2635;
  font-weight: 900;
  cursor: pointer;
}

.fee-cart-total {
  margin: 14px 0;
  padding: 16px;
  border-radius: 8px;
  background: #fffaf0;
  border: 1px solid rgba(209,166,72,.32);
  text-align: right;
}

.fee-cart-total span,
.fee-cart-total small {
  display: block;
  color: #8a6415;
}

.fee-cart-total b {
  display: block;
  color: #9a741f;
  font-size: 1.6rem;
  font-family: "SFMono-Regular", Consolas, monospace;
}

.fee-terms {
  margin-top: 8px;
}

@media (max-width: 980px) {
  .arh-board-switch,
  .fee-summary-grid,
  .fee-summary-grid.small,
  .fee-control-grid,
  .fee-control-grid.compact,
  .fee-two-col,
  .fee-add-grid,
  .fee-upload-grid,
  .fee-upload-summary {
    grid-template-columns: 1fr;
  }
}




.wonmu-premium-roadmap {
  max-width: 1360px;
  margin: 0 auto;
  color: #142620;
}

@media (min-width: 980px) {
  .app-shell:has(.wonmu-premium-roadmap) {
    grid-template-columns: 280px minmax(0, 1fr);
  }

  .app-shell:has(.wonmu-premium-roadmap) .side {
    display: flex;
  }

  .app-shell:has(.wonmu-premium-roadmap) .mobile-menu {
    display: none;
  }
}

.wpr-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 170px;
  gap: 14px;
  overflow: hidden;
  border: 1px solid rgba(22, 96, 78, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(9, 63, 52, 0.97), rgba(22, 119, 94, 0.94)),
    linear-gradient(45deg, #092c25, #1d6e57);
  color: white;
  padding: clamp(20px, 3vw, 32px);
  box-shadow: 0 20px 58px rgba(12, 52, 43, 0.2);
}

.wpr-kicker {
  display: inline-block;
  color: #c9efe5;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.wpr-hero h1 {
  margin: 8px 0 10px;
  font-size: clamp(30px, 3.3vw, 44px);
  line-height: 1.04;
  letter-spacing: 0;
}

.wpr-hero p {
  display: -webkit-box;
  max-width: 720px;
  overflow: hidden;
  margin: 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: 13px;
  line-height: 1.58;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.wpr-hero aside {
  display: grid;
  align-content: center;
  gap: 6px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: 14px;
}

.wpr-hero aside b {
  font-size: 30px;
  line-height: 1;
}

.wpr-hero aside span {
  margin-bottom: 6px;
  color: rgba(255, 255, 255, 0.78);
  font-weight: 800;
}

.wpr-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.wpr-tabs button {
  min-height: 62px;
  border: 1px solid #d7e8e2;
  border-radius: 8px;
  background: #fff;
  color: #25443c;
  text-align: left;
  padding: 10px 12px;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(24, 67, 56, 0.06);
}

.wpr-tabs button small,
.wpr-panel-head span,
.wpr-step-strip small {
  display: block;
  color: #0f766e;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.wpr-tabs button span {
  display: block;
  margin-top: 5px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.35;
}

.wpr-tabs button.active {
  border-color: #0f8f80;
  background: linear-gradient(135deg, #0d7568, #13a08f);
  color: white;
}

.wpr-tabs button.active small {
  color: #dffbf4;
}

.wpr-step-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.wpr-step-strip article {
  border: 1px solid #dcebe6;
  border-radius: 8px;
  background: linear-gradient(180deg, #fff, #f8fbfa);
  padding: 12px;
  min-height: 118px;
}

.wpr-step-strip b {
  display: block;
  margin: 6px 0 4px;
  color: #163c35;
  font-size: 12px;
  line-height: 1.35;
}

.wpr-step-strip span {
  display: inline-block;
  margin-bottom: 5px;
  color: #8a6d35;
  font-size: 12px;
  font-weight: 900;
}

.wpr-step-strip p {
  margin: 0;
  color: #587068;
  font-size: 11px;
  line-height: 1.45;
}

.wpr-panels {
  margin-top: 20px;
}

.wpr-panel {
  display: none;
  border: 1px solid #dcebe6;
  border-radius: 8px;
  background: #fff;
  padding: clamp(20px, 3vw, 34px);
  box-shadow: 0 18px 52px rgba(24, 67, 56, 0.08);
}

.wpr-panel.active {
  display: block;
}

.wpr-panel-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e2eee9;
  margin-bottom: 18px;
}

.wpr-panel-head h2 {
  margin: 5px 0 0;
  color: #102a25;
  font-size: 26px;
  line-height: 1.2;
}

.wpr-blocks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.wpr-hero-copy,
.wpr-flow,
.wpr-checklist {
  grid-column: 1 / -1;
}

.wpr-hero-copy {
  border: 1px solid #cce5de;
  border-radius: 8px;
  background: linear-gradient(135deg, #f3fbf8, #fff);
  padding: 22px;
}

.wpr-hero-copy h2 {
  margin: 0 0 10px;
  color: #0d5d56;
  font-size: 24px;
}

.wpr-hero-copy p,
.wpr-note p {
  margin: 0;
  color: #38554e;
  line-height: 1.72;
}

.wpr-flow {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wpr-flow span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  border: 1px solid #cae5de;
  border-radius: 8px;
  background: #f7fcfa;
  color: #173f38;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 800;
}

.wpr-flow b {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #0f766e;
  color: white;
  font-size: 11px;
}

.wpr-checklist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.wpr-checklist div,
.wpr-note {
  border: 1px solid #e0ece8;
  border-radius: 8px;
  background: #fff;
  padding: 15px;
}

.wpr-checklist div {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.wpr-checklist svg {
  flex: 0 0 auto;
  color: #0f766e;
}

.wpr-checklist span {
  color: #2d4d45;
  line-height: 1.65;
}

.wpr-note {
  position: relative;
  min-height: 92px;
}

.wpr-note > span {
  display: inline-block;
  margin-bottom: 9px;
  color: #0f766e;
  font-size: 12px;
  font-weight: 900;
}

.wpr-note.is-critical {
  border-color: #eadcc1;
  background: linear-gradient(180deg, #fff, #fffaf1);
}

@media (max-width: 1180px) {
  .wpr-hero,
  .wpr-blocks,
  .wpr-checklist {
    grid-template-columns: 1fr;
  }

  .wpr-hero aside {
    grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    padding: 12px 14px;
  }

  .wpr-hero aside b {
    font-size: 28px;
  }

  .wpr-hero aside span {
    margin: 0;
  }

  .wpr-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .wpr-step-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .wpr-tabs,
  .wpr-step-strip {
    grid-template-columns: 1fr;
  }

  .wpr-hero,
  .wpr-panel {
    padding: 20px;
  }
}

/* 2026-06-07: align the 원무 roadmap with the dark admin notice style. */
.app-shell:has(.wonmu-premium-roadmap) .workspace {
  background:
    radial-gradient(circle at 18% 0%, rgba(17, 145, 134, 0.18), transparent 34%),
    linear-gradient(180deg, #071625 0%, #081827 54%, #061321 100%);
}

.wonmu-premium-roadmap {
  max-width: none;
  margin: 0;
  color: #d8e9f2;
}

.wpr-hero {
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 18px;
  border: 1px solid rgba(44, 214, 203, 0.22);
  background:
    linear-gradient(135deg, rgba(12, 32, 51, 0.96), rgba(8, 62, 66, 0.94)),
    linear-gradient(180deg, #0b1b2d, #071521);
  color: #f7fbff;
  padding: 22px 26px;
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.26);
}

.wpr-kicker {
  color: #43e6d4;
  font-size: 11px;
}

.wpr-hero h1 {
  margin: 8px 0 8px;
  font-size: clamp(24px, 2.15vw, 34px);
  line-height: 1.14;
}

.wpr-hero p {
  max-width: 860px;
  color: #b9cde0;
  font-size: 13px;
  line-height: 1.62;
}

.wpr-hero aside {
  border-color: rgba(74, 223, 212, 0.28);
  background: rgba(17, 145, 134, 0.14);
}

.wpr-hero aside b {
  color: #ffffff;
  font-size: 28px;
}

.wpr-hero aside span {
  color: #b8eee8;
  font-size: 12px;
}

.wpr-tabs button,
.wpr-step-strip article,
.wpr-panel,
.wpr-hero-copy,
.wpr-flow span,
.wpr-checklist div,
.wpr-note {
  border-color: rgba(66, 118, 151, 0.48);
  background: rgba(10, 27, 44, 0.88);
  color: #e8f2f8;
  box-shadow: none;
}

.wpr-tabs button {
  min-height: 54px;
  padding: 10px 12px;
}

.wpr-tabs button:hover,
.wpr-tabs button.active {
  border-color: rgba(45, 221, 206, 0.7);
  background: linear-gradient(135deg, rgba(10, 126, 121, 0.92), rgba(13, 92, 112, 0.92));
}

.wpr-tabs button small,
.wpr-panel-head span,
.wpr-step-strip small,
.wpr-note > span {
  color: #45e1d2;
}

.wpr-tabs button span,
.wpr-step-strip b,
.wpr-panel-head h2,
.wpr-flow span,
.wpr-checklist span {
  color: #f4fbff;
}

.wpr-step-strip article {
  min-height: 108px;
}

.wpr-step-strip span {
  color: #f0c46b;
}

.wpr-step-strip p,
.wpr-hero-copy p,
.wpr-note p {
  color: #b7c9d7;
}

.wpr-panel {
  border-color: rgba(45, 221, 206, 0.25);
  background: rgba(8, 22, 36, 0.96);
}

.wpr-panel-head {
  border-bottom-color: rgba(72, 127, 162, 0.42);
}

.wpr-hero-copy {
  background: linear-gradient(135deg, rgba(12, 63, 65, 0.58), rgba(8, 22, 36, 0.92));
}

.wpr-hero-copy h2 {
  color: #77f2e8;
  font-size: 22px;
}

.wpr-flow b {
  background: #12a79a;
}

.wpr-note.is-critical {
  border-color: rgba(240, 196, 107, 0.46);
  background: rgba(61, 43, 18, 0.34);
}

@media (max-width: 1180px) {
  .wpr-hero {
    grid-template-columns: 1fr;
  }
}

/* Unified dark navy theme, dashboard and board surfaces */
:root {
  --ink: #e8eef7;
  --muted: #9fb0c4;
  --line: rgba(139, 164, 191, 0.22);
  --panel: #101d2d;
  --paper: #07111d;
  --teal: #14b8ad;
  --teal-dark: #28d3ca;
  --mint: rgba(20, 184, 173, 0.16);
  --navy: #06101b;
  --blue: #60a5fa;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
}

body {
  background:
    radial-gradient(circle at 18% -12%, rgba(20, 184, 173, .2), transparent 32%),
    radial-gradient(circle at 86% 4%, rgba(58, 104, 160, .2), transparent 30%),
    linear-gradient(135deg, #06101b 0%, #0a1726 48%, #07111d 100%);
  color: var(--ink);
}

.app-shell {
  background: transparent;
}

.side {
  border-right-color: rgba(139, 164, 191, .18);
  background:
    linear-gradient(180deg, rgba(14, 29, 45, .98) 0%, rgba(7, 17, 29, .98) 100%),
    #07111d;
  box-shadow: 16px 0 46px rgba(0, 0, 0, .28);
}

.side-brand,
.side-head,
.login-box {
  border-color: rgba(139, 164, 191, .17);
}

.brand-wordmark {
  color: #f4f8ff;
}

.brand-wordmark small {
  color: #8294aa;
}

.home-link,
.nav-leaf,
.nav-parent {
  background: transparent;
  color: #d5deea;
}

.home-link.active,
.home-link:hover,
.nav-leaf.active,
.nav-leaf:hover,
.nav-parent.active,
.nav-parent:hover {
  border-color: rgba(20, 184, 173, .42);
  background: linear-gradient(90deg, rgba(20, 184, 173, .68), rgba(20, 184, 173, .34));
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(3, 190, 181, .16);
}

.nav-children,
.nav-grandchildren {
  border-color: rgba(20, 184, 173, .34);
}

.nav-child {
  color: #b6c4d6;
}

.nav-child .icon,
.nav-child.active,
.nav-child:hover {
  color: #49d7d0;
}

.nav-child.active,
.nav-child:hover {
  background: rgba(20, 184, 173, .13);
}

.topbar {
  background: rgba(10, 23, 38, .86);
  border-bottom-color: rgba(139, 164, 191, .2);
  color: #f2f7ff;
}

.admin-badge,
.soft-button {
  background: rgba(20, 184, 173, .14);
  color: #5ee2dc;
}

.icon-button,
.ghost-button {
  border-color: rgba(139, 164, 191, .24);
  background: rgba(12, 26, 42, .76);
  color: #dbe7f6;
}

.workspace {
  background:
    radial-gradient(circle at 50% -10%, rgba(20, 184, 173, .12), transparent 36%),
    linear-gradient(145deg, rgba(9, 21, 35, .92), rgba(7, 17, 29, .96));
}

.portal-dashboard {
  --portal-teal: #35d6ce;
  --portal-dark: #6ee7e0;
  --portal-mint: rgba(20, 184, 173, .15);
  --portal-line: rgba(139, 164, 191, .24);
  --portal-ink: #eef5ff;
  --portal-muted: #9eb0c6;
}

.portal-search-zone,
.portal-panel,
.portal-feature-note,
.portal-feature-card,
.portal-ad,
.panel,
.notice-card,
.post-editor,
.post-item,
.admin-panel,
.admin-board-card,
.admin-permission-card,
.admin-kpis article,
.admin-banner-grid article,
.admin-ops-grid article,
.admin-command-card,
.admin-role-grid article,
.admin-api-card,
.admin-audit-list article,
.book-card,
.module,
.metric,
.auth-card,
.signup-panel,
.signup-guide-panel,
.fee-summary-grid article,
.fee-detail-card,
.fee-upload-card,
.arh-panel,
.arh-board-title,
.arh-board-switch button,
.board-empty {
  border-color: rgba(139, 164, 191, .22);
  background: linear-gradient(145deg, rgba(16, 31, 49, .94), rgba(10, 23, 38, .96));
  color: #e8eef7;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.portal-search-zone {
  background:
    linear-gradient(145deg, rgba(14, 29, 45, .96), rgba(9, 22, 37, .94)),
    #0a1726;
}

.portal-search,
.search-input,
.sc-search label,
.cl-search,
.guide-search-box,
.kcd-search,
.post-editor input,
.post-editor select,
.post-editor textarea,
.admin-inline-form input,
.admin-inline-form select,
.admin-table select,
.admin-settings-grid input,
.admin-policy-grid input,
.admin-api-fields input,
.admin-api-fields select,
.admin-api-fields textarea,
.form-grid input,
.form-grid select,
.fee-field input,
.fee-search input,
input,
select,
textarea {
  border-color: rgba(139, 164, 191, .25);
  background: rgba(8, 18, 31, .86);
  color: #edf5ff;
}

.portal-search input,
.search-input input,
.sc-search input,
.cl-search input,
.guide-search-box input,
.kcd-search input,
.fee-search input {
  background: transparent;
  color: #edf5ff;
}

input::placeholder,
textarea::placeholder {
  color: #7f91a8;
}

.portal-search-results {
  border-color: rgba(139, 164, 191, .24);
  background: #0c1a2a;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .3);
}

.portal-search-results a,
.portal-post-row,
.portal-tool-list a,
.admin-post-row,
.table th,
.table td,
.admin-table th,
.admin-table td {
  border-color: rgba(139, 164, 191, .16);
}

.portal-search-results a:hover,
.portal-feature-note:hover,
.portal-feature-card:hover,
.portal-tool-list a:hover,
.post-item:hover,
.module:hover {
  border-color: rgba(20, 184, 173, .45);
  background: rgba(20, 184, 173, .1);
}

.portal-panel-head,
.panel-head {
  min-height: 54px;
  align-items: center;
  border-bottom-color: rgba(139, 164, 191, .18);
  background: rgba(7, 17, 29, .38);
}

.portal-panel-head h2,
.panel-head strong,
.page-title h1,
.board-head h1,
.board-head h2,
.post-item h3,
.notice-card h3,
.admin-section-head h2,
.admin-board-card h3,
.admin-permission-card h3,
.admin-command-card h3,
.admin-role-grid h3,
.admin-api-card h3,
.arh-section-head h2,
.arh-board-title h2,
.fee-small-title,
.book-card h3,
.module b {
  color: #f3f8ff;
}

.portal-panel-head p,
.portal-panel-head > span,
.portal-list-title small,
.portal-post-row time,
.portal-tool-copy small,
.portal-feature-note p,
.portal-feature-card p,
.page-title p,
.notice-card p,
.post-item p,
.post-item small,
.admin-section-head p,
.admin-board-card span,
.admin-post-row small,
.arh-section-head p,
.arh-board-title p,
.arh-board-switch small,
.fee-summary-grid span,
.fee-summary-grid small,
.book-card p,
.module small,
.metric span,
.board-empty span {
  color: #9fb0c4;
}

.portal-feature-icon,
.book-tile {
  background: rgba(20, 184, 173, .14);
  color: #5ee2dc;
}

.portal-feature-card.fee,
.portal-feature-card.code,
.portal-banner-slot,
.portal-banner-slot.filled,
.tag,
.tag.teal,
.fee-add,
.admin-table th,
.table th {
  background: rgba(8, 18, 31, .62);
  color: #dbe7f6;
  border-color: rgba(139, 164, 191, .2);
}

.portal-list-title,
.portal-feature-card div > span,
.portal-kicker,
.tag.teal,
.admin-tabs button.active,
.board-tab.active,
.board-tab:hover,
.arh-board-title span,
.fee-summary-grid b {
  color: #4ddbd4;
}

.primary-button,
.notice-card header {
  background: linear-gradient(135deg, #0f8f82, #12b7ad);
  color: #ffffff;
  box-shadow: 0 16px 36px rgba(18, 183, 173, .22);
}

.board-page {
  gap: 16px;
}

.board-head,
.page-title {
  margin: 0 0 2px;
  min-height: 86px;
  padding: 20px 22px;
  border: 1px solid rgba(139, 164, 191, .22);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(16, 31, 49, .96), rgba(9, 22, 37, .96));
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.board-head > div,
.page-title {
  display: grid;
  gap: 6px;
}

.board-head > .page-title {
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.board-head h1,
.board-head h2,
.page-title h1 {
  margin: 0;
  font-size: 1.65rem;
  line-height: 1.25;
}

.board-head p,
.page-title p {
  margin: 0;
  line-height: 1.55;
}

.board-tabs,
.admin-tabs,
.uc-section-tabs,
.ecg-section-tabs {
  border-color: rgba(139, 164, 191, .2);
}

.board-tab,
.admin-tabs button,
.uc-section-tabs button,
.ecg-section-tabs button {
  border-color: rgba(139, 164, 191, .22);
  background: rgba(8, 18, 31, .62);
  color: #b9c7d8;
}

.board-tab.active,
.board-tab:hover,
.uc-section-tabs button.active,
.uc-section-tabs button:hover,
.ecg-section-tabs button.active,
.ecg-section-tabs button:hover {
  border-color: rgba(20, 184, 173, .5);
  background: rgba(20, 184, 173, .14);
}

.post-item,
.notice-card {
  overflow: hidden;
}

.workspace:has(.review-app) .review-compare-brief article,
.workspace:has(.review-app) .review-report-kpi-row article,
.workspace:has(.review-app) .review-report-visuals article {
  border-color: var(--dark-line);
  background: linear-gradient(145deg, rgba(16, 34, 54, .96), rgba(13, 27, 44, .96));
  color: var(--dark-ink);
}

.workspace:has(.review-app) .review-compare-brief b,
.workspace:has(.review-app) .review-delta-bars b,
.workspace:has(.review-app) .review-report-kpi-row b,
.workspace:has(.review-app) .review-a4-report h4,
.workspace:has(.review-app) .review-report-bars b {
  color: #f3f8ff;
}

.workspace:has(.review-app) .review-compare-brief small,
.workspace:has(.review-app) .review-compare-brief span,
.workspace:has(.review-app) .review-delta-bars span,
.workspace:has(.review-app) .review-commentary p,
.workspace:has(.review-app) .review-report-kpi-row small,
.workspace:has(.review-app) .review-report-kpi-row span,
.workspace:has(.review-app) .review-report-visuals p,
.workspace:has(.review-app) .review-report-bars span {
  color: #a7b7ca;
}

.workspace:has(.review-app) .review-gauge-svg .track,
.workspace:has(.review-app) .report-stack,
.workspace:has(.review-app) .report-risk-meter {
  border-color: rgba(139, 164, 191, .24);
  stroke: rgba(139, 164, 191, .28);
}

.workspace:has(.review-app) .review-gauge-value {
  background: rgba(7, 20, 34, .88);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
}

.workspace:has(.review-app) .review-gauge .review-gauge-value b {
  color: #ffffff;
}

.workspace:has(.review-app) .review-gauge .review-gauge-value span {
  color: #bdd7ee;
}

.workspace:has(.review-app) .review-gauge-scale {
  background: rgba(7, 20, 34, .86);
  color: #d9ecff;
  box-shadow: inset 0 0 0 1px rgba(139, 164, 191, .18);
}

.workspace:has(.review-app) .review-report-kpi-row article.danger {
  border-color: rgba(239, 68, 68, .48);
  background: linear-gradient(145deg, rgba(69, 24, 34, .96), rgba(38, 18, 30, .96));
}

.workspace:has(.review-app) .review-report-kpi-row article.stable {
  border-color: rgba(20, 184, 173, .45);
  background: linear-gradient(145deg, rgba(12, 55, 54, .96), rgba(13, 36, 48, .96));
}

.workspace:has(.md-app) .md-panel,
.workspace:has(.md-app) .md-report,
.workspace:has(.md-app) .md-report-kpis article,
.workspace:has(.md-app) .md-report-visuals article {
  border-color: var(--dark-line);
  background: linear-gradient(145deg, var(--dark-panel-2), var(--dark-panel));
  color: var(--dark-ink);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.workspace:has(.md-app) .md-donut::after {
  background: rgba(7, 20, 34, .94);
  box-shadow: inset 0 0 0 1px rgba(139, 164, 191, .18), 0 18px 36px rgba(0, 0, 0, .2);
}

.workspace:has(.md-app) .md-donut b,
.workspace:has(.md-app) .md-donut-legend div,
.workspace:has(.md-app) .md-donut-legend b,
.workspace:has(.md-app) .md-report-kpis b,
.workspace:has(.md-app) .md-report-visuals h4,
.workspace:has(.md-app) .md-report-bars b {
  color: #f3f8ff;
}

.workspace:has(.md-app) .md-donut small,
.workspace:has(.md-app) .md-chart-legend,
.workspace:has(.md-app) .md-report-kpis small,
.workspace:has(.md-app) .md-report-kpis span,
.workspace:has(.md-app) .md-report-visuals p,
.workspace:has(.md-app) .md-report-bars span,
.workspace:has(.md-app) .md-advice,
.workspace:has(.md-app) .md-exec-text,
.workspace:has(.md-app) .md-report-notes {
  color: #a7b7ca !important;
}

.workspace:has(.md-app) .md-report-stack,
.workspace:has(.md-app) .md-report-bars i,
.workspace:has(.md-app) .md-score-row div,
.workspace:has(.md-app) .md-scenario-chart article div {
  background: rgba(139, 164, 191, .16);
}

.workspace:has(.md-app) .md-chart-grid line {
  stroke: rgba(210, 226, 242, .4);
}

.workspace:has(.md-app) .md-chart-grid text,
.workspace:has(.md-app) .md-sales .month,
.workspace:has(.md-app) .md-radar text,
.workspace:has(.md-app) .md-month-chart small,
.workspace:has(.md-app) .md-vertical-chart small,
.workspace:has(.md-app) .md-stack-col small {
  fill: #bfd0e3;
  color: #bfd0e3;
}

.sc-page,
.kcd-app,
.os-app,
.fee-book,
.arh-page,
.review-page,
.md-app,
.hg-app,
.ng-app,
.ecg-page,
.vax-page {
  color: #e8eef7;
}

.sc-hero,
.kcd-header,
.os-header,
.fee-header,
.arh-hero,
.review-header,
.md-header,
.hg-title-row,
.ng-main-title,
.vax-section-head,
.ecg-section-head {
  border-color: rgba(139, 164, 191, .23);
  background: linear-gradient(145deg, rgba(16, 31, 49, .96), rgba(9, 22, 37, .96));
  color: #f3f8ff;
}

.sc-hero h1,
.kcd-header h1,
.os-header h1,
.fee-header h1,
.arh-hero h1,
.review-header h1,
.md-header h1,
.vax-section-head h2,
.ecg-section-head h2 {
  color: #f3f8ff;
}

.sc-hero p,
.kcd-header p,
.os-header p,
.fee-header p,
.arh-hero p,
.review-header p,
.md-header p,
.vax-section-head p,
.ecg-section-head p {
  color: #a7b7ca;
}

.board-empty {
  border-style: dashed;
}

/* Dark navy coverage for all secondary board groups */
.workspace:has(.ecg-page),
.workspace:has(.arh-page),
.workspace:has(.fee-book),
.workspace:has(.kcd-app),
.workspace:has(.sc-page),
.workspace:has(.cl-app),
.workspace:has(.hm-board),
.workspace:has(.tm-page),
.workspace:has(.aic-page),
.workspace:has(.uc-page),
.workspace:has(.ng-app),
.workspace:has(.hr-app),
.workspace:has(.review-app),
.workspace:has(.md-app),
.workspace:has(.os-app),
.workspace:has(.irs-app) {
  background:
    radial-gradient(circle at 12% -8%, rgba(20, 184, 173, .14), transparent 30%),
    linear-gradient(145deg, rgba(8, 20, 34, .98), rgba(5, 14, 25, .98));
  color: #e8eef7;
}

.ecg-page,
.arh-page,
.fee-book,
.kcd-app,
.sc-page,
.cl-app,
.hm-board,
.tm-page,
.aic-page,
.uc-page,
.ng-app,
.hr-app,
.review-app,
.md-app,
.os-app,
.irs-app {
  --dark-panel: rgba(13, 27, 44, .94);
  --dark-panel-2: rgba(16, 34, 54, .94);
  --dark-soft: rgba(20, 184, 173, .12);
  --dark-line: rgba(139, 164, 191, .22);
  --dark-ink: #edf5ff;
  --dark-muted: #9fb0c4;
  --dark-accent: #48d7d0;
  color: var(--dark-ink);
}

.ecg-hero,
.ecg-toolbar,
.ecg-section,
.ecg-section-head,
.ecg-page .card,
.ecg-page .box,
.ecg-page .flow,
.ecg-page .box-info,
.ecg-page .box-purple,
.ecg-page .box-warning,
.arh-task,
.arh-term,
.arh-info-grid article,
.arh-resource-grid article,
.arh-info-card,
.arh-urgent article,
.arh-month-card,
.arh-progress-card,
.fee-reading,
.fee-note,
.fee-formula,
.fee-section,
.fee-upload-card,
.fee-detail-card,
.fee-add,
.kcd-source,
.kcd-results,
.kcd-detail,
.kcd-detail section,
.kcd-empty,
.sc-hero dl div,
.sc-stat,
.sc-tabs button,
.sc-table-wrap,
.sc-table-head,
.sc-detail,
.sc-card,
.cl-sync-panel,
.cl-sync-panel article,
.cl-api-board,
.cl-api-note,
.cl-table,
.cl-policy-note,
.cl-drug-header,
.cl-notice,
.hm-summary article,
.hm-toolbar,
.hm-table-wrap,
.hm-notice,
.tm-summary article,
.tm-toolbar,
.tm-search,
.tm-table-wrap,
.tm-detail,
.tm-card,
.aic-search-panel,
.uc-search-panel,
.aic-result-list,
.uc-result-list,
.aic-result-card,
.uc-result-card,
.aic-body,
.uc-body,
.ng-blue-note,
.ng-yellow-note,
.ng-upload,
.ng-upload-inside,
.ng-file-label,
.ng-section-title,
.ng-info,
.ng-result-card,
.ng-columns,
.ng-data-row,
.hr-controls,
.hr-file,
.hr-side-note,
.hr-kpis article,
.hr-panel,
.hr-table-wrap,
.hr-schedule-wrap,
.review-controls,
.review-empty,
.review-visual-card,
.review-insights .insight-card,
.review-gauge-card,
.review-table-wrap,
.md-controls,
.md-plan-card,
.md-guide-table,
.md-tip,
.md-summary-cards article,
.md-dashboard-viz,
.md-engine,
.os-upload-panel,
.os-file,
.os-note,
.os-analysis-panel,
.os-rank,
.os-dashboard-card,
.irs-search-panel,
.irs-search,
.irs-panel,
.irs-law-box,
.irs-detail-card,
.irs-section-head {
  border-color: var(--dark-line);
  background: linear-gradient(145deg, var(--dark-panel-2), var(--dark-panel));
  color: var(--dark-ink);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.ng-upload summary {
  color: #f3f8ff;
}

.ng-upload-inside {
  border-top: 1px solid var(--dark-line);
}

.ng-upload-inside hr {
  width: 100%;
  border: 0;
  border-top: 1px solid rgba(139, 164, 191, .22);
  margin: 4px 0;
}

.ng-file-label {
  border: 1px solid rgba(139, 164, 191, .24);
  border-radius: 8px;
  padding: 12px;
  font-weight: 800;
}

.ng-file-label input[type="file"] {
  border: 1px solid rgba(139, 164, 191, .28);
  background: rgba(7, 17, 29, .86);
  color: #d7e2f0;
}

.ng-file-label input[type="file"]::file-selector-button {
  border: 1px solid rgba(45, 221, 206, .38);
  border-radius: 6px;
  background: rgba(20, 184, 173, .14);
  color: #62e0da;
  padding: 7px 10px;
  margin-right: 10px;
  font-weight: 800;
  cursor: pointer;
}

.ng-file-label input[type="file"]::-webkit-file-upload-button {
  border: 1px solid rgba(45, 221, 206, .38);
  border-radius: 6px;
  background: rgba(20, 184, 173, .14);
  color: #62e0da;
  padding: 7px 10px;
  margin-right: 10px;
  font-weight: 800;
  cursor: pointer;
}

.arh-board-switch button,
.arh-board-switch button.active,
.arh-month-tabs button,
.arh-tab,
.fee-tabs button,
.fee-section,
.fee-section.active,
.kcd-groups button,
.kcd-groups button.active,
.sc-tabs button,
.sc-tabs button.active,
.hm-filter button,
.hm-filter button.active,
.tm-filter button,
.tm-filter button.active,
.aic-filter button,
.uc-section-tabs button,
.uc-section-tabs button.active,
.uc-section-tabs button:hover,
.ng-app button,
.hr-tabs button,
.review-tabs button,
.md-tabs button,
.os-tabs button,
.irs-tabs button,
.irs-search-panel button,
.ecg-section-tabs button,
.ecg-section-tabs button.active,
.ecg-section-tabs button:hover {
  border-color: rgba(139, 164, 191, .24);
  background: rgba(8, 18, 31, .72);
  color: #d7e2f0;
}

.arh-board-switch button.active,
.arh-month-tabs button.active,
.arh-tab.active,
.fee-tabs button.active,
.fee-section.active,
.kcd-groups button.active,
.sc-tabs button.active,
.hm-filter button.active,
.tm-filter button.active,
.aic-filter button.active,
.uc-section-tabs button.active,
.ng-app button:hover,
.hr-tabs button.active,
.review-tabs button.active,
.md-tabs button.active,
.os-tabs button.active,
.irs-tabs button.active,
.irs-search-panel button.active,
.ecg-section-tabs button.active {
  border-color: rgba(20, 184, 173, .55);
  background: rgba(20, 184, 173, .16);
  color: var(--dark-accent);
}

.fee-search,
.kcd-search,
.sc-search label,
.cl-search,
.hm-toolbar input,
.tm-search input,
.aic-search-panel input,
.uc-search-panel input,
.ng-columns input,
.ng-columns select,
.ng-data-row input,
.ng-data-row select,
.hr-controls input,
.hr-controls select,
.review-controls input,
.review-controls select,
.md-controls input,
.md-controls select,
.os-file input,
.irs-search input,
.ecg-search,
.ecg-search input {
  border-color: rgba(139, 164, 191, .25);
  background: rgba(7, 17, 29, .78);
  color: #edf5ff;
}

.fee-book table,
.kcd-app table,
.sc-page table,
.cl-app table,
.hm-board table,
.tm-page table,
.ng-app table,
.hr-app table,
.review-app table,
.md-app table,
.os-app table,
.irs-app table,
.arh-table {
  background: rgba(9, 21, 35, .92);
  color: var(--dark-ink);
}

.fee-book th,
.fee-book td,
.kcd-app th,
.kcd-app td,
.sc-page th,
.sc-page td,
.cl-app th,
.cl-app td,
.hm-board th,
.hm-board td,
.tm-page th,
.tm-page td,
.ng-app th,
.ng-app td,
.hr-app th,
.hr-app td,
.review-app th,
.review-app td,
.md-app th,
.md-app td,
.os-app th,
.os-app td,
.irs-app th,
.irs-app td,
.arh-table th,
.arh-table td {
  border-color: rgba(139, 164, 191, .16);
  background: rgba(10, 23, 38, .82);
  color: #dce8f6;
}

.fee-book th,
.kcd-app th,
.sc-page th,
.cl-app th,
.hm-board th,
.tm-page th,
.ng-app th,
.hr-app th,
.review-app th,
.md-app th,
.os-app th,
.irs-app th,
.arh-table th {
  background: rgba(20, 184, 173, .1);
  color: #62e0da;
}

.fee-book tbody tr:nth-child(even) td,
.kcd-app tbody tr:nth-child(even) td,
.sc-page tbody tr:nth-child(even) td,
.cl-app tbody tr:nth-child(even) td,
.hm-board tbody tr:nth-child(even) td,
.tm-page tbody tr:nth-child(even) td,
.ng-app tbody tr:nth-child(even) td,
.hr-app tbody tr:nth-child(even) td,
.review-app tbody tr:nth-child(even) td,
.md-app tbody tr:nth-child(even) td,
.os-app tbody tr:nth-child(even) td,
.irs-app tbody tr:nth-child(even) td {
  background: rgba(13, 29, 47, .86);
}

.ecg-page h1,
.ecg-page h2,
.ecg-page h3,
.arh-page h1,
.arh-page h2,
.arh-page h3,
.fee-book h1,
.fee-book h2,
.fee-book h3,
.kcd-app h1,
.kcd-app h2,
.kcd-app h3,
.sc-page h1,
.sc-page h2,
.sc-page h3,
.cl-app h1,
.cl-app h2,
.cl-app h3,
.hm-board h1,
.hm-board h2,
.hm-board h3,
.tm-page h1,
.tm-page h2,
.tm-page h3,
.aic-page h1,
.aic-page h2,
.aic-page h3,
.uc-page h1,
.uc-page h2,
.uc-page h3,
.ng-app h1,
.ng-app h2,
.ng-app h3,
.hr-app h1,
.hr-app h2,
.hr-app h3,
.review-app h1,
.review-app h2,
.review-app h3,
.md-app h1,
.md-app h2,
.md-app h3,
.os-app h1,
.os-app h2,
.os-app h3,
.irs-app h1,
.irs-app h2,
.irs-app h3 {
  color: #f3f8ff;
}

.ecg-page p,
.ecg-page small,
.ecg-page li,
.arh-page p,
.arh-page small,
.fee-book p,
.fee-book small,
.kcd-app p,
.kcd-app small,
.sc-page p,
.sc-page small,
.cl-app p,
.cl-app small,
.hm-board p,
.hm-board small,
.tm-page p,
.tm-page small,
.aic-page p,
.aic-page small,
.uc-page p,
.uc-page small,
.ng-app p,
.ng-app small,
.hr-app p,
.hr-app small,
.review-app p,
.review-app small,
.md-app p,
.md-app small,
.os-app p,
.os-app small,
.irs-app p,
.irs-app small {
  color: var(--dark-muted);
}

.ecg-page .box-info,
.ecg-page .box-purple,
.ecg-page .box-warning,
.ng-blue-note,
.ng-yellow-note,
.md-tip,
.os-note,
.cl-api-note,
.cl-policy-note,
.hr-side-note,
.irs-law-box,
.fee-note,
.kcd-source {
  background: rgba(20, 184, 173, .1);
  color: #cceff0;
}

.aic-result-list header,
.uc-result-list header,
.sc-table-head,
.review-card-title,
.md-section-header,
.os-chart-title,
.irs-section-head,
.arh-section-head,
.fee-reading-head,
.hm-table thead,
.tm-table thead {
  border-color: rgba(139, 164, 191, .18);
  background: rgba(7, 17, 29, .42);
  color: #f3f8ff;
}

.aic-result-card.active,
.aic-result-card:hover,
.uc-result-card.active,
.uc-result-card:hover,
.irs-detail-card[open] summary,
.ecg-section.active {
  border-color: rgba(20, 184, 173, .52);
  background: rgba(20, 184, 173, .12);
}

.cl-app a,
.hm-board a,
.tm-page a,
.aic-page a,
.uc-page a,
.irs-app a,
.ecg-page a,
.kcd-app a,
.sc-page a {
  color: #56ddd6;
}

.status.good,
.admin-status.ok {
  background: rgba(20, 184, 173, .14);
  color: #62e0da;
}

.status.warn,
.admin-status.wait {
  background: rgba(245, 158, 11, .16);
  color: #f8c66a;
}

.status.bad,
.admin-status.blocked {
  background: rgba(239, 68, 68, .15);
  color: #ff9a9a;
}

/* Final high-priority dark pass for module-specific legacy boards */
.workspace:has(.hira-review-page),
.workspace:has(.wpr-page),
.workspace:has(.vax-page) {
  background:
    radial-gradient(circle at 12% -8%, rgba(20, 184, 173, .14), transparent 30%),
    linear-gradient(145deg, rgba(8, 20, 34, .98), rgba(5, 14, 25, .98)) !important;
}

.hr-app {
  background:
    radial-gradient(circle at 12% -8%, rgba(20, 184, 173, .14), transparent 30%),
    linear-gradient(145deg, rgba(8, 20, 34, .98), rgba(5, 14, 25, .98)) !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) {
  color: #e8eef7 !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) :is(section, article, aside, header, div, label, table) {
  border-color: rgba(139, 164, 191, .22) !important;
  background: linear-gradient(145deg, rgba(16, 34, 54, .94), rgba(10, 23, 38, .96)) !important;
  color: #e8eef7 !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) :is(button, .tag, .hm-code, .tm-chip, .arh-badge, .status) {
  border-color: rgba(139, 164, 191, .26) !important;
  background: rgba(8, 18, 31, .78) !important;
  color: #dbe7f6 !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) :is(button.active, .active, .primary-button, .tm-chip.active, .aic-result-card.active, .uc-result-card.active) {
  border-color: rgba(20, 184, 173, .58) !important;
  background: linear-gradient(135deg, rgba(15, 143, 130, .88), rgba(18, 183, 173, .55)) !important;
  color: #ffffff !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) :is(input, select, textarea) {
  border-color: rgba(139, 164, 191, .25) !important;
  background: rgba(7, 17, 29, .84) !important;
  color: #edf5ff !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) :is(th, td) {
  border-color: rgba(139, 164, 191, .16) !important;
  background: rgba(10, 23, 38, .82) !important;
  color: #dce8f6 !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) :is(h1, h2, h3, h4, b, strong) {
  color: #f4f8ff !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) :is(p, small, span, li, em) {
  color: #a7b7ca !important;
}

:is(
  .ecg-page,
  .arh-page,
  .fee-book,
  .kcd-app,
  .sc-page,
  .cl-app,
  .hm-board,
  .tm-page,
  .aic-page,
  .uc-page,
  .vax-page,
  .hira-review-page,
  .ng-app,
  .hr-app,
  .review-app,
  .md-app,
  .os-app,
  .irs-app,
  .wpr-page
) a {
  color: #56ddd6 !important;
}

.ecg-section.active {
  border-color: rgba(20, 184, 173, .46) !important;
  background: linear-gradient(145deg, rgba(16, 34, 54, .94), rgba(10, 23, 38, .96)) !important;
}

.vax-page .vax-hero dl div,
.vax-page .vax-section.active,
.vax-page .vax-alert-strip article.major,
.vax-page .vax-card[open] summary,
.vax-page .vax-note-grid article.danger,
.vax-page .vax-note-grid article.success {
  background: linear-gradient(145deg, rgba(17, 39, 61, .94), rgba(10, 23, 38, .98)) !important;
}

.vax-page .vax-code,
.vax-page .vax-hero dd,
.vax-page .vax-alert-strip b,
.vax-page .vax-result strong,
.vax-page .vax-travel-grid article > span {
  color: #62e0da !important;
}

.vax-page .vax-badge {
  border: 1px solid rgba(139, 164, 191, .22) !important;
  background: rgba(8, 18, 31, .78) !important;
  color: #dbe7f6 !important;
}

.vax-page .vax-badge.green,
.vax-page .vax-badge.blue {
  border-color: rgba(20, 184, 173, .42) !important;
  background: rgba(20, 184, 173, .13) !important;
  color: #62e0da !important;
}

.vax-page .vax-badge.purple {
  border-color: rgba(129, 140, 248, .42) !important;
  background: rgba(79, 70, 229, .17) !important;
  color: #c4b5fd !important;
}

.vax-page .vax-badge.amber,
.vax-page .vax-note-grid article.danger,
.vax-page .vax-reaction-grid article.warn {
  border-color: rgba(245, 158, 11, .38) !important;
  color: #f8c66a !important;
}

.vax-page .vax-note-grid article.success,
.vax-page .vax-reaction-grid article.ok {
  border-color: rgba(34, 197, 94, .38) !important;
}

.vax-page .vax-reaction-grid article.danger {
  border-color: rgba(239, 68, 68, .42) !important;
}

/* 2026-06-14: office statistics dark-navy readability and premium report pass. */
.workspace:has(.os-app) .os-tabs {
  width: 100%;
  border-color: rgba(139, 164, 191, .24) !important;
  background: linear-gradient(145deg, rgba(16, 34, 54, .96), rgba(9, 22, 37, .98)) !important;
  box-shadow: 0 16px 34px rgba(0, 0, 0, .18) !important;
}

.workspace:has(.os-app) .os-tabs button {
  border: 1px solid rgba(139, 164, 191, .24) !important;
  border-bottom: 3px solid rgba(139, 164, 191, .24) !important;
  background: rgba(8, 18, 31, .82) !important;
  color: #dbe7f6 !important;
}

.workspace:has(.os-app) .os-tabs button.active {
  border-color: rgba(20, 184, 173, .62) !important;
  background: linear-gradient(135deg, rgba(15, 143, 130, .95), rgba(18, 183, 173, .68)) !important;
  color: #ffffff !important;
}

.workspace:has(.os-app) .os-output {
  width: 100%;
}

.workspace:has(.os-app) .os-premium-report {
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
}

.workspace:has(.os-app) .os-premium-report .os-report-cover,
.workspace:has(.os-app) .os-premium-report .review-report-cover {
  width: 100%;
}

.workspace:has(.os-app) .os-kpis span.good,
.workspace:has(.os-app) .os-kpis span.negative,
.workspace:has(.os-app) .os-kpis article > span {
  border: 1px solid rgba(139, 164, 191, .22) !important;
  background: rgba(224, 242, 254, .12) !important;
  color: #d7f5ff !important;
  font-weight: 800;
}

.workspace:has(.os-app) .os-kpis span.good {
  border-color: rgba(45, 221, 206, .36) !important;
  background: rgba(20, 184, 173, .18) !important;
  color: #7df4ee !important;
}

.workspace:has(.os-app) .os-kpis span.negative {
  border-color: rgba(248, 113, 113, .38) !important;
  background: rgba(239, 68, 68, .16) !important;
  color: #ffb4b4 !important;
}

.workspace:has(.os-app) .os-chart-panel,
.workspace:has(.os-app) .os-table-panel,
.workspace:has(.os-app) .os-premium-report,
.workspace:has(.os-app) .os-report-visual,
.workspace:has(.os-app) .os-report-visuals article,
.workspace:has(.os-app) .os-report-kpis article {
  border-color: rgba(139, 164, 191, .24) !important;
  background: linear-gradient(145deg, rgba(16, 34, 54, .95), rgba(9, 22, 37, .98)) !important;
  color: #edf5ff !important;
}

.workspace:has(.os-app) .os-chart-title,
.workspace:has(.os-app) .os-section-title,
.workspace:has(.os-app) .os-rank header,
.workspace:has(.os-app) .os-rank header b,
.workspace:has(.os-app) .os-rank header span,
.workspace:has(.os-app) .os-donut b,
.workspace:has(.os-app) .os-donut span,
.workspace:has(.os-app) .os-donut-list div,
.workspace:has(.os-app) .os-donut-list b,
.workspace:has(.os-app) .os-donut-list span {
  color: #edf5ff !important;
}

.workspace:has(.os-app) .os-donut {
  box-shadow: 0 18px 42px rgba(0, 0, 0, .25);
}

.workspace:has(.os-app) .os-donut::after {
  width: 92px;
  height: 92px;
  border: 1px solid rgba(139, 164, 191, .26);
  background: rgba(7, 19, 33, .96) !important;
  box-shadow: inset 0 0 0 8px rgba(20, 184, 173, .05);
}

.workspace:has(.os-app) .os-donut b {
  font-size: 18px;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .45);
}

.workspace:has(.os-app) .os-donut span {
  color: #b8c8da !important;
  font-weight: 800;
}

.workspace:has(.os-app) .os-donut-list div {
  border: 1px solid rgba(139, 164, 191, .16);
  border-radius: 7px;
  background: rgba(7, 17, 29, .5) !important;
  padding: 6px 8px;
}

.workspace:has(.os-app) .os-rank i,
.workspace:has(.os-app) .os-report-bars i {
  background: rgba(139, 164, 191, .15) !important;
}

.workspace:has(.os-app) .os-rank em,
.workspace:has(.os-app) .os-report-bars em {
  background: linear-gradient(90deg, #14b8ad, #7dd3fc) !important;
}

.workspace:has(.os-app) .os-chart-grid line {
  stroke: rgba(201, 219, 238, .22);
}

.workspace:has(.os-app) .os-chart-grid text,
.workspace:has(.os-app) .os-chart .month,
.workspace:has(.os-app) .os-bar-value {
  fill: #c9d8ea;
  color: #c9d8ea;
  font-weight: 800;
}

.workspace:has(.os-app) .os-legend,
.workspace:has(.os-app) .os-legend span {
  color: #c9d8ea !important;
  font-weight: 800;
}

.workspace:has(.os-app) .os-heatmap b {
  border: 1px solid rgba(139, 164, 191, .18);
  border-radius: 4px;
  background: rgba(7, 17, 29, .72) !important;
  color: #edf5ff !important;
}

.workspace:has(.os-app) .os-heatmap span {
  border: 1px solid rgba(45, 221, 206, .22);
  background: linear-gradient(145deg, rgba(20, 184, 173, .28), rgba(14, 116, 144, .2)) !important;
  box-shadow: inset 0 0 0 999px rgba(20, 184, 173, var(--intensity));
  color: #f4fbff !important;
  font-weight: 900;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .55);
}

.workspace:has(.os-app) .os-heatmap span strong {
  color: #ffffff !important;
  font-size: 14px;
}

.os-report-actions {
  display: flex;
  justify-content: flex-end;
  margin: 14px 0 16px;
}

.os-report-actions button {
  min-height: 42px;
  border: 1px solid rgba(20, 184, 173, .42) !important;
  border-radius: 8px;
  background: linear-gradient(135deg, #078d83, #0fb2a2) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(7, 141, 131, .2);
  font-weight: 900;
  padding: 0 18px;
  cursor: pointer;
}

.os-report-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 18px;
}

.os-report-kpis article {
  border: 1px solid var(--os-line);
  border-radius: 8px;
  background: #fff;
  padding: 14px;
}

.os-report-kpis small,
.os-report-kpis span {
  display: block;
  color: #667085;
  font-size: 12px;
}

.os-report-kpis b {
  display: block;
  color: #09283b;
  font-size: 22px;
  margin: 5px 0;
}

.os-report-summary {
  border: 1px solid rgba(139, 164, 191, .2);
  border-radius: 8px;
  background: rgba(20, 184, 173, .08);
  padding: 14px 16px;
}

.os-report-visuals {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 20px;
}

.os-report-visual,
.os-report-visuals article {
  border: 1px solid var(--os-line);
  border-radius: 8px;
  background: #fff;
  padding: 15px;
}

.os-report-visual.wide {
  margin: 14px 0;
}

.os-report-visual h4,
.os-report-visuals h4 {
  margin: 0 0 12px;
}

.os-report-bars {
  display: grid;
  gap: 10px;
}

.os-report-bars div {
  display: grid;
  grid-template-columns: minmax(92px, 1fr) minmax(160px, 2fr) minmax(110px, auto);
  align-items: center;
  gap: 10px;
}

.os-report-bars b {
  overflow-wrap: anywhere;
  font-size: 12px;
}

.os-report-bars i {
  display: block;
  height: 14px;
  border-radius: 999px;
  background: #e8f2f0;
  overflow: hidden;
}

.os-report-bars em {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #08766d, #42b9ad);
}

.os-report-bars span {
  text-align: right;
  color: #667085;
  font-size: 12px;
  font-weight: 800;
}

.workspace:has(.os-app) .os-report-summary,
.workspace:has(.os-app) .os-report-roadmap,
.workspace:has(.os-app) .review-report-roadmap {
  border-color: rgba(139, 164, 191, .2) !important;
  background: rgba(20, 184, 173, .08) !important;
}

.workspace:has(.os-app) .os-a4-report h3 {
  border-left-color: #48d7d0 !important;
  background: rgba(20, 184, 173, .12) !important;
  color: #f3f8ff !important;
}

/* 2026-06-08: dark navy pass for guide boards without broad active-state bleed. */
.workspace:has(.guide-page) {
  background:
    radial-gradient(circle at 16% -10%, rgba(20, 184, 173, .14), transparent 32%),
    linear-gradient(145deg, #071625 0%, #081827 58%, #061321 100%) !important;
  color: #e8eef7 !important;
}

.guide-page {
  --guide-navy-panel: rgba(12, 27, 44, .96);
  --guide-navy-panel-2: rgba(16, 35, 56, .94);
  --guide-navy-line: rgba(139, 164, 191, .24);
  --guide-navy-line-strong: rgba(45, 221, 206, .42);
  --guide-navy-ink: #f3f8ff;
  --guide-navy-muted: #a8bad0;
  --guide-navy-accent: #62e0da;
  color: var(--guide-navy-ink) !important;
}

.guide-page .board-head,
.guide-page .guide-search-panel,
.guide-page .guide-search-box,
.guide-page .guide-hero-panel,
.guide-page .guide-source-note,
.guide-page .guide-hero-stats,
.guide-page .guide-hero-stats span,
.guide-page .guide-category-row span,
.guide-page .guide-article,
.guide-page .guide-article summary,
.guide-page .guide-article-body,
.guide-page .guide-analysis-copy > p,
.guide-page .guide-report-block,
.guide-page .guide-check-block,
.guide-page .guide-source-line,
.guide-page .guide-visual,
.guide-page .guide-visual-window,
.guide-page .guide-visual-screen,
.guide-page .guide-visual-paper,
.guide-page .board-empty {
  border-color: var(--guide-navy-line) !important;
  background: linear-gradient(145deg, var(--guide-navy-panel-2), var(--guide-navy-panel)) !important;
  color: var(--guide-navy-ink) !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .18) !important;
}

.guide-page .guide-article[open],
.guide-page .guide-article[open] summary,
.guide-page .guide-analysis-copy > p:first-child,
.guide-page .guide-report-block.key,
.guide-page .guide-report-block.point {
  border-color: var(--guide-navy-line) !important;
  background: linear-gradient(145deg, rgba(17, 39, 61, .94), rgba(10, 23, 38, .98)) !important;
  color: var(--guide-navy-ink) !important;
}

.guide-page h1,
.guide-page h2,
.guide-page h3,
.guide-page h4,
.guide-page b,
.guide-page strong,
.guide-page .guide-hero-stats b,
.guide-page .guide-visual-screen b {
  color: var(--guide-navy-ink) !important;
}

.guide-page p,
.guide-page span,
.guide-page small,
.guide-page li,
.guide-page time,
.guide-page .guide-source-note p,
.guide-page .guide-report-block p,
.guide-page .guide-report-block span,
.guide-page .guide-copy p,
.guide-page .guide-check-block ol,
.guide-page .guide-visual-screen small,
.guide-page .board-empty span {
  color: var(--guide-navy-muted) !important;
}

.guide-page .guide-search-box input {
  border-color: rgba(139, 164, 191, .28) !important;
  background: rgba(7, 17, 29, .82) !important;
  color: var(--guide-navy-ink) !important;
}

.guide-page .guide-search-box input::placeholder {
  color: #8ba3bb !important;
}

.guide-page .guide-search-meta,
.guide-page .guide-open-label,
.guide-page .tag,
.guide-page .guide-source-line b {
  border: 1px solid rgba(139, 164, 191, .26) !important;
  background: rgba(8, 18, 31, .78) !important;
  color: #dbe7f6 !important;
}

.guide-page .guide-search-meta b,
.guide-page .guide-report-block strong,
.guide-page .guide-report-block b,
.guide-page .guide-check-block h4,
.guide-page .guide-source-note svg,
.guide-page .guide-search-box svg {
  color: var(--guide-navy-accent) !important;
}

.guide-page .guide-article[open] .guide-open-label {
  border-color: var(--guide-navy-line-strong) !important;
  background: rgba(20, 184, 173, .13) !important;
  color: var(--guide-navy-accent) !important;
}

.guide-page .guide-visual-window span,
.guide-page .guide-visual-paper span,
.guide-page .guide-visual-screen i {
  background: rgba(139, 164, 191, .25) !important;
}

/* 2026-06-08: dark navy landing page. */
.landing {
  min-height: 100vh;
  background:
    radial-gradient(circle at 18% -12%, rgba(20, 184, 173, .16), transparent 32%),
    radial-gradient(circle at 86% 4%, rgba(58, 104, 160, .18), transparent 30%),
    linear-gradient(135deg, #06101b 0%, #0a1726 48%, #07111d 100%) !important;
  color: #e8eef7 !important;
  overflow-x: hidden;
  overflow-y: auto;
}

.landing .landing-header {
  border-bottom-color: rgba(139, 164, 191, .18) !important;
  background: rgba(7, 17, 29, .18);
}

.landing .brand-wordmark {
  color: #f4f8ff !important;
}

.landing .brand-wordmark small {
  color: #8294aa !important;
}

.landing .nav-links a {
  color: #c9d6e6 !important;
}

.landing .nav-links a:hover {
  color: #ffffff !important;
}

.landing .eyebrow,
.landing .hero h1 strong {
  color: #62e0da !important;
}

.landing .hero h1 {
  color: #f4f8ff !important;
}

.landing .hero p,
.landing .proof span,
.landing .feature-card p,
.landing .searchbar,
.landing .chip,
.landing .mini-side span {
  color: #a8bad0 !important;
}

.landing .primary-button {
  border: 1px solid rgba(45, 221, 206, .46) !important;
  background: linear-gradient(135deg, rgba(15, 143, 130, .86), rgba(18, 183, 173, .52)) !important;
  color: #ffffff !important;
  box-shadow: 0 16px 36px rgba(18, 183, 173, .2) !important;
}

.landing .ghost-button {
  border-color: rgba(139, 164, 191, .26) !important;
  background: rgba(8, 18, 31, .76) !important;
  color: #dbe7f6 !important;
}

.landing .proof,
.landing .device,
.landing .feature-card,
.landing .searchbar,
.landing .chip,
.landing .book-tile {
  border-color: rgba(139, 164, 191, .22) !important;
  background: linear-gradient(145deg, rgba(16, 35, 56, .94), rgba(10, 23, 38, .96)) !important;
  color: #e8eef7 !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18) !important;
}

.landing .device-top,
.landing .mini-side,
.landing .mini-main,
.landing .feature-card .inside {
  border-color: rgba(139, 164, 191, .18) !important;
  background: rgba(7, 17, 29, .42) !important;
  color: #e8eef7 !important;
}

.landing .mini-side span.active {
  border: 1px solid rgba(45, 221, 206, .38) !important;
  background: rgba(20, 184, 173, .12) !important;
  color: #62e0da !important;
  box-shadow: none !important;
}

.landing .feature-card .bar {
  border-bottom: 1px solid rgba(139, 164, 191, .18) !important;
  background: rgba(8, 18, 31, .78) !important;
  color: #62e0da !important;
}

.landing .proof strong,
.landing .feature-card b,
.landing .mini-side strong,
.landing .mini-main > b {
  color: #f3f8ff !important;
}

.landing .book-tile,
.landing .chip {
  color: #62e0da !important;
}

.landing .consulting-section {
  max-width: 1180px;
  margin: 18px auto 0;
  min-height: calc(100vh - 88px);
  padding: 78px 24px 92px;
  display: grid;
  grid-template-columns: minmax(320px, .82fr) minmax(520px, 1.18fr);
  gap: 28px;
  align-items: center;
}

.landing .consulting-copy,
.landing .consulting-grid article {
  border: 1px solid rgba(139, 164, 191, .22);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(16, 35, 56, .94), rgba(10, 23, 38, .96));
  color: #e8eef7;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.landing .consulting-copy {
  min-height: 480px;
  padding: clamp(28px, 4vw, 46px);
  display: grid;
  align-content: center;
}

.landing .consulting-kicker {
  color: #62e0da;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 1.8px;
}

.landing .consulting-copy h2 {
  margin: 14px 0 16px;
  color: #f4f8ff;
  font-size: clamp(30px, 3.2vw, 48px);
  line-height: 1.15;
}

.landing .consulting-copy p,
.landing .consulting-grid p {
  margin: 0;
  color: #a8bad0;
  line-height: 1.75;
}

.landing .consulting-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.landing .consulting-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.landing .consulting-grid article {
  min-height: 220px;
  padding: 24px;
  display: grid;
  align-content: start;
  gap: 10px;
}

.landing .consulting-grid b {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(45, 221, 206, .34);
  border-radius: 999px;
  background: rgba(20, 184, 173, .12);
  color: #62e0da;
  font-size: 12px;
}

.landing .consulting-grid h3 {
  margin: 8px 0 0;
  color: #f3f8ff;
  font-size: 20px;
}

@media (max-width: 980px) {
  .landing .consulting-section {
    grid-template-columns: 1fr;
    min-height: auto;
    padding-top: 56px;
  }

  .landing .consulting-copy {
    min-height: auto;
  }

  .landing .consulting-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .brand-wordmark {
    width: 132px;
  }

  .brand-wordmark b {
    font-size: 28px;
  }

  .brand-wordmark small {
    font-size: 8px;
    letter-spacing: 1.45px;
  }

  .landing .consulting-section {
    padding: 44px 18px 68px;
  }
}

/* 2026-06-08: premium consulting showcase redesign. */
.landing .consulting-showcase {
  max-width: 1260px;
  margin: 34px auto 0;
  min-height: calc(100vh - 64px);
  padding: 82px 24px 104px;
  display: grid;
  grid-template-columns: minmax(430px, .92fr) minmax(560px, 1.08fr);
  gap: 24px;
  align-items: stretch;
}

.landing .consulting-brand-panel {
  position: relative;
  overflow: hidden;
  min-height: 620px;
  border: 1px solid rgba(139, 164, 191, .24);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(17, 39, 61, .94), rgba(7, 17, 29, .98)),
    #07111d;
  color: #e8eef7;
  padding: clamp(32px, 4vw, 54px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .24);
}

.landing .consulting-brand-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(20, 184, 173, .18), transparent 42%),
    repeating-linear-gradient(90deg, rgba(139, 164, 191, .06) 0 1px, transparent 1px 86px);
  pointer-events: none;
}

.landing .consulting-kicker,
.landing .consulting-logo-lockup,
.landing .consulting-brand-panel h2,
.landing .consulting-brand-panel p,
.landing .consulting-actions {
  position: relative;
  z-index: 1;
}

.landing .consulting-logo-lockup {
  width: min(100%, 520px);
  margin: 34px 0 38px;
  color: #f8fbff;
}

.landing .consulting-logo-lockup strong {
  display: block;
  width: 100%;
  border-bottom: 7px solid currentColor;
  padding-bottom: 8px;
  font-family: "Arial Black", Arial, sans-serif;
  font-size: clamp(68px, 7.6vw, 118px);
  line-height: .82;
  letter-spacing: -2px;
  text-align: center;
}

.landing .consulting-logo-lockup small {
  display: block;
  margin-top: 13px;
  color: #94a9c2;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(12px, 1.2vw, 16px);
  letter-spacing: clamp(3px, .48vw, 7px);
  text-align: center;
  white-space: nowrap;
}

.landing .consulting-brand-panel h2 {
  max-width: 620px;
  margin: 0;
  color: #f4f8ff;
  font-size: clamp(34px, 3.8vw, 56px);
  line-height: 1.12;
}

.landing .consulting-brand-panel p {
  max-width: 610px;
  margin: 20px 0 0;
  color: #a8bad0;
  font-size: 16px;
  line-height: 1.8;
}

.landing .consulting-service-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-content: stretch;
}

.landing .consulting-service-card {
  position: relative;
  overflow: hidden;
  min-height: 190px;
  border: 1px solid rgba(139, 164, 191, .22);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(16, 35, 56, .94), rgba(10, 23, 38, .96));
  color: #e8eef7;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.landing .consulting-service-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(45, 221, 206, .68), transparent);
}

.landing .consulting-service-card.primary {
  min-height: 260px;
  grid-row: span 2;
  background:
    linear-gradient(145deg, rgba(18, 83, 89, .84), rgba(10, 23, 38, .96)),
    #0b1b2d;
}

.landing .consulting-service-card.wide {
  grid-column: 1 / -1;
  min-height: 170px;
  flex-direction: row;
  align-items: center;
  gap: 26px;
}

.landing .consulting-service-card span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(45, 221, 206, .38);
  border-radius: 999px;
  background: rgba(20, 184, 173, .12);
  color: #62e0da !important;
  font-size: 12px;
  font-weight: 900;
}

.landing .consulting-service-card h3 {
  margin: 18px 0 10px;
  color: #f4f8ff;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.18;
}

.landing .consulting-service-card p {
  margin: 0;
  color: #a8bad0;
  font-size: 14px;
  line-height: 1.7;
}

.landing .consulting-service-card.wide h3 {
  margin-top: 0;
}

@media (max-width: 1080px) {
  .landing .consulting-showcase {
    grid-template-columns: 1fr;
  }

  .landing .consulting-brand-panel {
    min-height: auto;
  }
}

@media (max-width: 680px) {
  .landing .consulting-showcase {
    padding: 54px 18px 78px;
  }

  .landing .consulting-service-board {
    grid-template-columns: 1fr;
  }

  .landing .consulting-service-card.primary,
  .landing .consulting-service-card.wide {
    grid-column: auto;
    grid-row: auto;
    min-height: 190px;
    flex-direction: column;
    align-items: flex-start;
  }

  .landing .consulting-logo-lockup strong {
    font-size: 58px;
  }
}

/* Dashboard: four-banner strip and balanced expert tool panel */
.portal-dashboard {
  display: grid;
  gap: 10px;
}

.portal-search-zone {
  margin-bottom: 0;
}

.portal-columns {
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  align-items: stretch;
  min-width: 0;
}

.portal-left,
.portal-right {
  height: 100%;
}

.portal-right {
  align-content: stretch;
}

.portal-tools {
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.portal-tool-list {
  flex: 1;
  grid-template-rows: repeat(10, minmax(0, 1fr));
  align-content: stretch;
  padding: 6px 17px 12px;
}

.portal-tool-list a {
  min-height: 0;
  padding: 0 5px;
}

.portal-tool-copy {
  gap: 2px;
}

.portal-tool-copy b {
  font-size: 13px;
}

.portal-tool-copy small {
  font-size: 11px;
}

.portal-ad {
  min-height: 170px;
  margin-top: 0;
  width: 100%;
  min-width: 0;
}

.portal-banner-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-height: 170px;
  width: 100%;
  min-width: 0;
}

.portal-banner-slot {
  border-right: 0;
  border-radius: 8px;
  min-width: 0;
}

@media (max-width: 1180px) {
  .portal-tool-list {
    grid-template-rows: none;
  }

  .portal-tool-list a {
    min-height: 56px;
  }

  .portal-banner-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1500px) {
  .portal-banner-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .portal-banner-grid {
    grid-template-columns: 1fr;
  }
}

/* 2026-06-08: dark navy alignment for requested clinical and guide workspaces. */
.workspace:has(.dc-app),
.workspace:has(.dx-app),
.workspace:has(.hg-app),
.workspace:has(.aic-page),
.workspace:has(.uc-page),
.workspace:has(.fee-book),
.workspace:has(.ecg-page),
.workspace:has(.vax-page) {
  background:
    radial-gradient(circle at 16% -10%, rgba(20, 184, 173, 0.17), transparent 32%),
    linear-gradient(145deg, #071625 0%, #081827 58%, #061321 100%);
  color: #e8eef7;
}

.dc-app,
.dx-app,
.hg-app,
.aic-page,
.uc-page,
.fee-book,
.ecg-page,
.vax-page {
  --navy-panel: rgba(12, 27, 44, 0.94);
  --navy-panel-2: rgba(16, 35, 56, 0.94);
  --navy-line: rgba(139, 164, 191, 0.24);
  --navy-line-strong: rgba(45, 221, 206, 0.48);
  --navy-ink: #f3f8ff;
  --navy-muted: #a8bad0;
  --navy-soft: rgba(20, 184, 173, 0.13);
  --navy-accent: #48d7d0;
  color: var(--navy-ink);
}

.dc-hero,
.dx-masthead,
.hg-title-row,
.aic-hero,
.uc-hero,
.fee-header,
.ecg-hero,
.vax-hero {
  border-color: var(--navy-line-strong);
  background:
    linear-gradient(135deg, rgba(13, 32, 52, 0.97), rgba(8, 65, 72, 0.93)),
    linear-gradient(180deg, #0b1b2d, #071521);
  color: var(--navy-ink);
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.24);
}

.dc-module,
.dc-guide-note,
.dc-warning,
.dc-matrix-wrap,
.dc-review-card,
.dc-form,
.dc-expander,
.dc-tabs,
.dc-multiselect,
.dc-product-select label,
.dc-drug-card,
.dc-info,
.dc-metric,
.dc-notes,
.dc-footer-columns,
.dx-info,
.dx-form,
.dx-metrics > div,
.dx-result-card,
.dx-warning,
.dx-tabs,
.dx-tab-panel,
.dx-review-kind,
.dx-options,
.dx-docs,
.dx-category-filter,
.dx-policy-card,
.dx-source,
.dx-table-scroll,
.hg-input-panel,
.hg-sheet,
.hg-reference,
.hg-patient-card,
.hg-status-grid article,
.hg-rule-panel,
.hg-qa-section,
.hg-qa-grid article,
.hg-notice,
.aic-search-panel,
.aic-result-list,
.aic-detail,
.aic-result-card,
.aic-ai-box,
.aic-structured-grid article,
.aic-case-stack p,
.aic-body p,
.uc-search-panel,
.uc-result-list,
.uc-detail,
.uc-result-card,
.uc-ai-box,
.uc-structured-grid article,
.uc-case-stack p,
.uc-body p,
.fee-section,
.fee-reading,
.fee-note,
.fee-formula,
.fee-detail-card,
.fee-upload-card,
.fee-add,
.ecg-toolbar,
.ecg-section,
.ecg-section-head,
.vax-toolbar,
.vax-section,
.vax-section-head,
.vax-alert-strip article,
.vax-age-grid article,
.vax-note-grid article,
.vax-card,
.vax-specs div,
.vax-table-wrap,
.vax-calc-card,
.vax-result,
.vax-check-grid article,
.vax-reaction-grid article,
.vax-travel-grid article,
.vax-empty,
.ecg-page .card,
.ecg-page .box,
.ecg-page .box-info,
.ecg-page .box-purple,
.ecg-page .box-warning,
.ecg-page .flow {
  border-color: var(--navy-line);
  background: linear-gradient(145deg, var(--navy-panel-2), var(--navy-panel));
  color: var(--navy-ink);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.18);
}

.dc-tabs button,
.dc-submit,
.dx-submit,
.dx-tabs button,
.dx-inline-options label,
.dx-options label,
.dx-category-filter label,
.aic-filter button,
.uc-section-tabs button,
.fee-tabs button,
.ecg-section-tabs button,
.vax-tabs button,
.dc-selected-products button,
.hg-input-panel button {
  border-color: rgba(139, 164, 191, 0.28);
  background: rgba(8, 18, 31, 0.74);
  color: #d7e2f0;
}

.dc-tabs button.active,
.dc-tabs button:hover,
.dx-tabs button.active,
.dx-tabs button:hover,
.aic-filter button.active,
.aic-filter button:hover,
.uc-section-tabs button.active,
.uc-section-tabs button:hover,
.fee-tabs button.active,
.fee-tabs button:hover,
.ecg-section-tabs button.active,
.ecg-section-tabs button:hover,
.vax-tabs button.active,
.vax-tabs button:hover,
.dc-product-select label:hover,
.dc-selected-products button,
.hg-input-panel button:hover {
  border-color: var(--navy-line-strong);
  background: var(--navy-soft);
  color: var(--navy-accent);
}

.dc-form input,
.dc-form select,
.dc-search-label select,
.dc-expander input[type="file"],
.dc-multiselect input,
.dx-form input,
.dx-form select,
.dx-tab-panel input,
.dx-tab-panel select,
.hg-input-panel input,
.aic-search-panel input,
.uc-search-panel input,
.fee-search,
.ecg-search,
.ecg-search input,
.vax-search,
.vax-search input,
.vax-calc-card input,
.vax-calc-card select {
  border-color: rgba(139, 164, 191, 0.28);
  background: rgba(7, 17, 29, 0.82);
  color: var(--navy-ink);
}

.dc-hero h1,
.dx-masthead h1,
.hg-sheet h1,
.aic-hero h1,
.uc-hero h1,
.fee-header h1,
.ecg-hero h1,
.vax-hero h1,
.dc-app h2,
.dc-app h3,
.dx-app h2,
.dx-app h3,
.hg-app h2,
.hg-app h3,
.aic-page h2,
.aic-page h3,
.uc-page h2,
.uc-page h3,
.fee-book h2,
.fee-book h3,
.ecg-page h2,
.ecg-page h3,
.vax-page h2,
.vax-page h3,
.dc-review-card h4,
.dc-drug-card strong,
.dx-result-card strong,
.dx-policy-card h4,
.aic-result-card b,
.uc-result-card b,
.hg-patient-card strong,
.hg-status-grid strong {
  color: var(--navy-ink);
}

.dc-hero p,
.dx-masthead p,
.hg-subtitle,
.hg-title-row p,
.aic-hero p,
.uc-hero p,
.fee-header p,
.ecg-hero p,
.vax-hero p,
.dc-form label,
.dc-expander label,
.dc-search-label,
.dx-form label,
.dx-tab-panel label,
.hg-input-panel label,
.aic-result-list header span,
.uc-result-list header span,
.aic-summary,
.uc-summary,
.hg-input-panel p,
.hg-notice p,
.dc-review-card p,
.dc-tabs p,
.dc-drug-card small,
.dc-smallprint,
.dx-caption,
.dx-result-card p,
.dx-policy-card p,
.dx-source p {
  color: var(--navy-muted);
}

.dc-eyebrow,
.dx-overline,
.hg-eyebrow,
.aic-kicker,
.uc-hero span,
.fee-kicker,
.ecg-kicker,
.vax-kicker,
.vax-code,
.dc-badge,
.aic-result-card span,
.uc-result-card span,
.aic-detail-top span,
.uc-detail-top span,
.hg-reference strong,
.hg-section-title h2,
.dx-policy-card > span {
  color: var(--navy-accent);
}

.dc-warning,
.dc-review-card.wait,
.dc-review-card.no,
.dx-warning,
.hg-notice,
.aic-ai-box,
.uc-ai-box,
.ecg-page .box-warning {
  border-color: rgba(240, 196, 107, 0.42);
  background: linear-gradient(145deg, rgba(63, 45, 18, 0.48), rgba(21, 30, 43, 0.9));
}

.dc-matrix,
.dx-data-table,
.fee-book table,
.hg-rule-panel table {
  background: rgba(9, 21, 35, 0.92);
  color: var(--navy-ink);
}

.dc-matrix th,
.dc-matrix td,
.dx-data-table th,
.dx-data-table td,
.fee-book th,
.fee-book td,
.hg-rule-panel td {
  border-color: rgba(139, 164, 191, 0.18);
  background: rgba(10, 23, 38, 0.82);
  color: #dce8f6;
}

.dc-matrix th,
.dx-data-table th,
.fee-book th {
  background: rgba(20, 184, 173, 0.11);
  color: #66e1db;
}

.dc-matrix td.ok,
.dc-review-card.ok {
  border-color: rgba(45, 221, 206, 0.42);
  background: rgba(20, 184, 173, 0.14);
}

.dc-matrix td.no,
.dc-matrix td.active-no {
  border-color: rgba(240, 110, 110, 0.38);
  background: rgba(127, 29, 29, 0.26);
}

.dc-matrix td.selected,
.dc-matrix td.active-ok,
.aic-result-card.active,
.aic-result-card:hover,
.uc-result-card.active,
.uc-result-card:hover,
.hg-rule-panel tr.current td,
.hg-qa-grid .alert {
  border-color: var(--navy-line-strong);
  background: linear-gradient(90deg, rgba(20, 184, 173, 0.18), rgba(8, 18, 31, 0.72));
  color: var(--navy-ink);
}

/* 2026-06-08: keep the external-care guide body aligned with the navy theme. */
.ecg-page .ecg-section.active {
  border-color: var(--navy-line) !important;
  background:
    linear-gradient(145deg, rgba(16, 35, 56, 0.96), rgba(10, 23, 38, 0.98)) !important;
  color: var(--navy-ink) !important;
}

/* 2026-06-08: improve on-screen readability inside the herbal guide preview only. */
@media screen {
  .hg-output .hg-sheet {
    padding: 32px 42px;
    font-size: 15px;
    line-height: 1.55;
  }

  .hg-output .hg-title-row {
    gap: 24px;
    padding: 18px 22px 16px;
    border: 1px solid var(--navy-line-strong);
    border-radius: 8px;
  }

  .hg-output .hg-eyebrow {
    font-size: 11px;
    margin-bottom: 6px;
  }

  .hg-output .hg-sheet h1 {
    font-size: 28px;
    line-height: 1.18;
    margin-bottom: 6px;
  }

  .hg-output .hg-subtitle {
    font-size: 14px;
    line-height: 1.45;
  }

  .hg-output .hg-reference {
    min-width: 156px;
    padding: 12px 14px;
  }

  .hg-output .hg-reference span,
  .hg-output .hg-reference small {
    font-size: 12px;
  }

  .hg-output .hg-reference strong {
    font-size: 17px;
    margin: 4px 0;
  }

  .hg-output .hg-patient-card {
    margin-top: 16px;
  }

  .hg-output .hg-patient-card div {
    padding: 13px 14px;
  }

  .hg-output .hg-patient-card span,
  .hg-output .hg-status-grid label,
  .hg-output .hg-status-grid small,
  .hg-output .hg-rule-panel h3 em,
  .hg-output .hg-section-title p {
    font-size: 12px;
  }

  .hg-output .hg-patient-card strong {
    font-size: 15px;
  }

  .hg-output .hg-section-title {
    margin: 22px 0 12px;
  }

  .hg-output .hg-section-title h2,
  .hg-output .hg-qa-section h2 {
    font-size: 18px;
  }

  .hg-output .hg-status-grid {
    gap: 12px;
  }

  .hg-output .hg-status-grid article {
    min-height: 72px;
    padding: 14px 16px;
  }

  .hg-output .hg-status-grid strong {
    font-size: 18px;
  }

  .hg-output .hg-rules-grid {
    gap: 12px;
    margin-top: 12px;
  }

  .hg-output .hg-rule-panel {
    padding: 12px 14px;
  }

  .hg-output .hg-rule-panel h3 {
    font-size: 15px;
    margin-bottom: 9px;
  }

  .hg-output .hg-rule-panel table,
  .hg-output .hg-ict-row {
    font-size: 13px;
  }

  .hg-output .hg-rule-panel td {
    padding: 7px 6px;
  }

  .hg-output .hg-badge {
    padding: 2px 7px;
    font-size: 10px;
  }

  .hg-output .hg-ict-heading b {
    font-size: 15px;
  }

  .hg-output .hg-qa-section {
    margin-top: 18px;
  }

  .hg-output .hg-qa-grid {
    gap: 10px 12px;
  }

  .hg-output .hg-qa-grid article {
    min-height: 78px;
    padding: 14px 16px;
  }

  .hg-output .hg-qa-grid h4 {
    font-size: 14px;
    margin-bottom: 7px;
  }

  .hg-output .hg-qa-grid p {
    font-size: 13px;
    line-height: 1.55;
  }

  .hg-output .hg-notice {
    gap: 12px;
    margin-top: 14px;
    padding: 12px 14px;
  }

  .hg-output .hg-notice strong,
  .hg-output .hg-notice p,
  .hg-output .hg-footer {
    font-size: 12px;
    line-height: 1.55;
  }

  .hg-output .hg-footer {
    gap: 4px;
    margin-top: 12px;
    padding-top: 10px;
  }
}

/* 2026-06-08: final contrast cleanup for dark navy screens. */
.side-brand .brand-wordmark {
  width: auto;
}

.side-brand .brand-wordmark b {
  width: auto;
  font-size: 42px;
  line-height: .82;
  letter-spacing: -1px;
  white-space: nowrap;
  text-align: left;
}

.side-brand .brand-wordmark small {
  width: auto;
  font-size: 8px;
  letter-spacing: 1.7px;
  white-space: nowrap;
  text-align: left;
}

.fee-book .fee-toc,
.fee-book .fee-reading,
.fee-book .fee-note,
.fee-book .fee-empty,
.fee-book .hm-table-wrap {
  border-color: rgba(139, 164, 191, .22) !important;
  background: linear-gradient(145deg, rgba(16, 35, 56, .94), rgba(10, 23, 38, .96)) !important;
  color: #e8eef7 !important;
}

.fee-book .fee-section {
  border-color: transparent !important;
  background: rgba(8, 18, 31, .52) !important;
  color: #dbe7f6 !important;
}

.fee-book .fee-section small {
  color: #8fa3ba !important;
}

.fee-book .fee-section b {
  color: #f4f8ff !important;
}

.fee-book .fee-section.active,
.fee-book .fee-section:hover {
  border-left-color: #62e0da !important;
  background: rgba(20, 184, 173, .16) !important;
  color: #62e0da !important;
}

.sc-page .sc-code,
.sc-page .sc-kcd {
  border: 1px solid rgba(139, 164, 191, .24) !important;
  background: rgba(8, 18, 31, .82) !important;
  color: #dbe7f6 !important;
}

.sc-page .sc-code {
  border-color: rgba(45, 221, 206, .36) !important;
  color: #62e0da !important;
}

.dc-app input,
.dc-app select,
.dc-app textarea,
.dc-app .dc-multiselect input,
.dc-app .dc-product-select,
.dc-app .dc-product-select label,
.dc-app .dc-matrix td.none,
.dx-app input,
.dx-app select,
.dx-app textarea,
.dx-app .dx-options,
.dx-app .dx-docs,
.dx-app .dx-policy-card,
.dx-app .dx-source,
.dx-app .dx-table-scroll {
  border-color: rgba(139, 164, 191, .25) !important;
  background: rgba(7, 17, 29, .84) !important;
  color: #edf5ff !important;
}

.dc-app input::placeholder,
.dx-app input::placeholder {
  color: #8ba3bb !important;
}

.dc-app .dc-matrix td.none {
  color: #8fa3ba !important;
}

.dx-app .dx-data-table tbody tr:nth-child(even) td,
.dx-app .dx-data-table td.basis,
.dx-app .dx-metrics > div,
.dx-app .dx-result-card {
  border-color: rgba(139, 164, 191, .22) !important;
  background: rgba(10, 23, 38, .86) !important;
  color: #dce8f6 !important;
}

.aic-page .aic-detail-top span,
.aic-page .aic-tag-row span,
.uc-page .aic-detail-top span,
.uc-page .aic-tag-row span,
.ns-page .aic-detail-top span,
.ns-page .aic-tag-row span {
  border: 1px solid rgba(139, 164, 191, .24) !important;
  background: rgba(8, 18, 31, .82) !important;
  color: #dbe7f6 !important;
}

.aic-page .aic-detail-top span,
.uc-page .aic-detail-top span,
.ns-page .aic-detail-top span {
  border-color: rgba(45, 221, 206, .36) !important;
  color: #62e0da !important;
}

/* 2026-06-08: institution rule search detail cards dark contrast. */
.irs-app .irs-detail-card,
.irs-app .irs-detail-card[open],
.irs-app .irs-detail-card summary,
.irs-app .irs-detail-grid,
.irs-app .irs-detail-grid p,
.irs-app .irs-answer,
.irs-app .irs-tip-grid article,
.irs-app .irs-alert-grid article,
.irs-app .irs-month-box,
.irs-app .irs-empty,
.irs-app .irs-table-wrap {
  border-color: rgba(139, 164, 191, .22) !important;
  background: linear-gradient(145deg, rgba(16, 35, 56, .94), rgba(10, 23, 38, .96)) !important;
  color: #e8eef7 !important;
}

.irs-app .irs-detail-grid p {
  box-shadow: none !important;
}

.irs-app .irs-detail-grid b,
.irs-app .irs-detail-card summary span,
.irs-app .irs-answer b,
.irs-app .irs-tip-grid b,
.irs-app .irs-alert-grid b,
.irs-app .irs-month-box b {
  color: #f3f8ff !important;
}

.irs-app .irs-detail-card summary small,
.irs-app .irs-detail-grid p,
.irs-app .irs-answer,
.irs-app .irs-tip-grid span,
.irs-app .irs-alert-grid span,
.irs-app .irs-month-box span {
  color: #a8bad0 !important;
}

.irs-app .irs-badge,
.irs-app .irs-badge.danger,
.irs-app .irs-badge.warning,
.irs-app .irs-badge.ok,
.irs-app .irs-badge.info {
  border-color: rgba(139, 164, 191, .26) !important;
  background: rgba(8, 18, 31, .78) !important;
  color: #dbe7f6 !important;
}

.irs-app .irs-badge.ok,
.irs-app .irs-badge.info {
  border-color: rgba(45, 221, 206, .38) !important;
  color: #62e0da !important;
}

.irs-app .irs-badge.warning {
  border-color: rgba(245, 158, 11, .38) !important;
  color: #f8c66a !important;
}

.irs-app .irs-badge.danger {
  border-color: rgba(239, 68, 68, .42) !important;
  color: #ff9a9a !important;
}

/* 2026-06-15: compact monochrome icons for institution-rule menus. */
.irs-tabs button,
.irs-calendar-tabs button,
.irs-result-grid button {
  display: inline-grid !important;
  align-items: center;
}

.irs-tabs button {
  grid-template-columns: 18px minmax(0, 1fr) auto;
}

.irs-calendar-tabs button {
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  padding: 0 12px;
}

.irs-result-grid button {
  grid-template-columns: 18px minmax(0, auto);
  gap: 4px 8px;
}

.irs-result-grid button .irs-tab-icon {
  grid-row: 1 / span 2;
}

.irs-result-grid button b,
.irs-result-grid button span {
  grid-column: 2;
}

.irs-tab-icon {
  position: relative;
  display: inline-block;
  width: 17px;
  height: 17px;
  color: currentColor;
  opacity: .9;
}

.irs-tab-icon::before,
.irs-tab-icon::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
}

.irs-tab-icon.doc::before {
  inset: 2px 4px 2px 3px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.irs-tab-icon.doc::after {
  left: 6px;
  top: 6px;
  width: 7px;
  height: 2px;
  background: currentColor;
  box-shadow: 0 4px 0 currentColor;
  border-radius: 999px;
}

.irs-tab-icon.facility::before {
  left: 2px;
  top: 5px;
  width: 13px;
  height: 10px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.irs-tab-icon.facility::after {
  left: 6px;
  top: 2px;
  width: 5px;
  height: 13px;
  border-left: 2px solid currentColor;
  border-right: 2px solid currentColor;
  box-shadow: -4px 5px 0 -2px currentColor, 4px 5px 0 -2px currentColor;
}

.irs-tab-icon.staff::before {
  left: 6px;
  top: 2px;
  width: 6px;
  height: 6px;
  border: 2px solid currentColor;
  border-radius: 999px;
  box-shadow: -6px 3px 0 -2px currentColor, 6px 3px 0 -2px currentColor;
}

.irs-tab-icon.staff::after {
  left: 3px;
  bottom: 2px;
  width: 12px;
  height: 6px;
  border: 2px solid currentColor;
  border-radius: 8px 8px 3px 3px;
}

.irs-tab-icon.qa::before {
  left: 2px;
  top: 2px;
  width: 13px;
  height: 13px;
  border: 2px solid currentColor;
  border-radius: 999px;
}

.irs-tab-icon.qa::after {
  left: 7px;
  top: 5px;
  width: 4px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-left: 2px solid currentColor;
  border-radius: 4px 0 0;
  box-shadow: 0 8px 0 -1px currentColor;
}

.irs-tab-icon.report::before {
  left: 3px;
  top: 2px;
  width: 11px;
  height: 13px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.irs-tab-icon.report::after {
  left: 6px;
  top: 6px;
  width: 7px;
  height: 2px;
  background: currentColor;
  box-shadow: 0 4px 0 currentColor;
  border-radius: 999px;
}

.irs-tab-icon.calendar::before,
.irs-tab-icon.quarter::before,
.irs-tab-icon.annual::before {
  inset: 3px 2px 2px;
  border: 2px solid currentColor;
  border-radius: 3px;
}

.irs-tab-icon.calendar::after {
  left: 5px;
  top: 1px;
  width: 8px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  box-shadow: 0 7px 0 -1px currentColor;
}

.irs-tab-icon.quarter::after {
  left: 5px;
  top: 7px;
  width: 8px;
  height: 2px;
  background: currentColor;
  box-shadow: 0 4px 0 currentColor;
}

.irs-tab-icon.annual::after {
  left: 4px;
  top: 6px;
  width: 10px;
  height: 7px;
  border: 2px solid currentColor;
  border-top: 0;
}

.irs-tab-icon.alert::before {
  left: 2px;
  top: 2px;
  width: 13px;
  height: 13px;
  border: 2px solid currentColor;
  transform: rotate(45deg);
  border-radius: 3px;
}

.irs-tab-icon.alert::after {
  left: 8px;
  top: 5px;
  width: 2px;
  height: 8px;
  background: currentColor;
  border-radius: 999px;
  box-shadow: 0 10px 0 -1px currentColor;
}

/* 2026-06-08: refine landing consulting brand balance. */
.landing .consulting-brand-panel {
  justify-content: center;
  gap: 0;
}

.landing .consulting-logo-lockup {
  width: min(100%, 440px);
  margin: 28px 0 32px;
}

.landing .consulting-logo-lockup strong {
  font-size: clamp(58px, 6.2vw, 88px);
  line-height: .9;
  letter-spacing: -1.4px;
  border-bottom-width: 5px;
  padding-bottom: 7px;
}

.landing .consulting-logo-lockup small {
  margin-top: 10px;
  font-size: clamp(10px, .95vw, 13px);
  letter-spacing: clamp(2.4px, .36vw, 5px);
}

.landing .consulting-brand-panel h2 {
  max-width: 520px;
  font-size: clamp(28px, 2.85vw, 42px);
  line-height: 1.18;
  letter-spacing: 0;
}

.landing .consulting-brand-panel p {
  max-width: 540px;
  margin-top: 18px;
  font-size: 15px;
  line-height: 1.72;
}

.landing .consulting-actions {
  margin-top: 26px;
}

/* 2026-06-08 requested section refinements */
.wpr-hero h1 {
  font-size: clamp(24px, 2.4vw, 34px);
}

.wpr-hero aside {
  grid-template-columns: auto 1fr;
  align-content: center;
  align-items: center;
  gap: 6px 8px;
  padding: 10px 12px;
}

.wpr-hero aside b {
  font-size: 22px;
}

.wpr-hero aside span {
  margin-bottom: 0;
  font-size: 12px;
}

.vax-hero h1 {
  font-size: clamp(24px, 2.6vw, 36px);
}

.fee-header h1,
.aic-hero h1 {
  font-size: clamp(24px, 2.3vw, 32px);
}

.aic-hero dd {
  font-size: 20px;
}

.aic-hero p {
  font-size: 13px;
}

.ng-upload {
  border-color: #0f8f82;
  background: #0b535b;
  color: #ffffff;
}

.ng-upload summary,
.ng-upload summary::marker {
  color: #ffffff;
}

.ng-upload[open] {
  background: #ffffff;
  color: #111827;
}

/* 2026-06-08 follow-up: compact guide headers without stat boxes */
.ecg-hero,
.wpr-hero,
.vax-hero,
.arh-hero.compact:not(.fee-hero) {
  grid-template-columns: minmax(0, 1fr);
  padding: clamp(16px, 2vw, 22px);
}

.ecg-hero h1,
.vax-hero h1,
.arh-hero.compact:not(.fee-hero) h1 {
  margin: 6px 0 8px;
  font-size: clamp(23px, 2.25vw, 32px);
  line-height: 1.16;
}

.ecg-hero p,
.vax-hero p,
.arh-hero.compact:not(.fee-hero) p {
  max-width: 760px;
  font-size: 13px;
  line-height: 1.55;
}

.wpr-hero h1 {
  margin: 6px 0 8px;
  font-size: clamp(23px, 2.2vw, 32px);
}

/* 2026-06-08 follow-up: remove summary boxes and improve guide details */
.guide-term-grid { display: grid; gap: 12px; }
.guide-term-card { display: grid; gap: 8px; }
.guide-term-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(139, 164, 191, .24);
  border-radius: 8px;
  padding: 12px 14px;
}
.guide-term-row b { font-size: 13px; font-weight: 900; }
.guide-term-row p { margin: 0 0 6px; }
.guide-term-row p:last-child { margin-bottom: 0; }
.guide-term-title { border-left: 4px solid #ef4444; background: rgba(127, 29, 29, .22); }
.guide-term-title b, .guide-term-title span { color: #ffb4b4; }
.guide-term-content { border-left: 4px solid #facc15; background: rgba(113, 83, 18, .2); }
.guide-term-content b, .guide-term-content p { color: #fde68a; }
.guide-term-source { border-left: 4px solid #3b82f6; background: rgba(30, 64, 175, .2); }
.guide-term-source b, .guide-term-source span { color: #bfdbfe; }
.hira-hero,
.cl-hero,
.tm-hero,
.sc-hero,
.aic-hero,
.uc-hero,
.irs-hero {
  grid-template-columns: minmax(0, 1fr);
  padding: clamp(16px, 2vw, 22px);
}
.aic-hero,
.uc-hero,
.tm-hero { display: grid; }
.hira-hero h1,
.cl-hero h1,
.tm-hero h1,
.sc-hero h1,
.aic-hero h1,
.uc-hero h1,
.irs-hero h1 {
  margin: 6px 0 8px;
  font-size: clamp(23px, 2.25vw, 32px);
  line-height: 1.16;
}
.hira-hero p,
.cl-hero p,
.tm-hero p,
.sc-hero p,
.aic-hero p,
.uc-hero p,
.irs-hero p {
  max-width: 780px;
  font-size: 13px;
  line-height: 1.55;
}
.sc-tabs {
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 8px;
}
.sc-tabs button {
  min-height: 58px;
  padding: 10px 12px;
}
.sc-tabs strong { font-size: 13px; }
.sc-tabs span { font-size: 12px; }
.tm-toolbar,
.fee-board > .arh-tabs { margin-top: 0; }





/* Expanded administrator console */
.admin-ops-grid,.admin-role-grid,.admin-policy-grid,.admin-command-grid,.admin-api-grid{display:grid;gap:12px}.admin-ops-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.admin-ops-grid article,.admin-command-card,.admin-role-grid article,.admin-api-card,.admin-audit-list article{border:1px solid #d8e7e4;border-radius:8px;background:#fff;padding:16px}.admin-ops-grid span,.admin-command-card small,.admin-role-grid small,.admin-api-card span,.admin-api-card footer,.admin-board-policy,.admin-log-row span,.admin-audit-list span,.admin-audit-list time,.admin-api-note{color:#667085}.admin-ops-grid b{display:block;margin:8px 0 4px;color:#0f766e;font-size:27px}.admin-command-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-command-card.wide{grid-column:1/-1}.admin-command-card{display:grid;gap:10px}.admin-command-card h3,.admin-role-grid h3,.admin-api-card h3{margin:0}.admin-command-card label,.admin-mini-row,.admin-log-row,.admin-api-card footer,.admin-audit-list article{display:flex;align-items:center;justify-content:space-between;gap:10px}.admin-mini-row,.admin-log-row{border-top:1px solid #eef4f3;padding-top:9px}.admin-log-row{display:grid;grid-template-columns:minmax(0,1fr) auto}.admin-log-row span{grid-column:1/-1}.admin-log-row em,.admin-audit-list em,.admin-api-status{border-radius:999px;background:#eef8f6;color:#0f766e;font-style:normal;font-size:12px;font-weight:900;padding:5px 9px}.admin-role-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-role-grid article{display:grid;gap:8px}.admin-policy-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-policy-grid label,.admin-api-fields label{display:grid;gap:7px;color:#344054;font-size:13px;font-weight:800}.admin-policy-grid input,.admin-api-fields input,.admin-api-fields select,.admin-api-fields textarea{width:100%;border:1px solid #d1e2df;border-radius:7px;background:#fff;color:var(--ink);padding:10px 11px;font:inherit}.admin-fit-button{width:fit-content}.admin-board-policy{margin:0;font-size:12px;line-height:1.5}.admin-api-note{border:1px solid #d8e7e4;border-radius:8px;background:#f4faf8;padding:13px 14px;line-height:1.55}.admin-api-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-api-card{display:grid;gap:14px}.admin-api-card header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.admin-api-status.wait{background:#fff7e6;color:#9a5b04}.admin-api-status.manual{background:#eef2f6;color:#475467}.admin-api-status.ok{background:#e7f8ef;color:#087443}.admin-api-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.admin-api-fields .wide{grid-column:1/-1}.admin-api-fields textarea{min-height:74px;resize:vertical}.admin-audit-list{display:grid;gap:10px}.admin-audit-list article{display:grid;grid-template-columns:minmax(0,1fr) auto auto}.admin-audit-list span{grid-column:1/-1}@media(max-width:1180px){.admin-ops-grid,.admin-role-grid,.admin-policy-grid,.admin-api-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.admin-ops-grid,.admin-command-grid,.admin-role-grid,.admin-policy-grid,.admin-api-grid,.admin-api-fields{grid-template-columns:1fr}.admin-audit-list article{grid-template-columns:1fr}}

/* 2026-06-08 signup/login contrast fix */
.signup-panel .signup-head h1,
.signup-guide-panel h2 {
  color: #f8fbff;
}

.signup-panel .signup-head p,
.signup-guide-panel li,
.signup-status {
  color: #b9d2ee;
}

.signup-grid label,
.marketing-check {
  color: #d7e7f8;
}

.signup-grid input,
.signup-grid select {
  background: #fff;
  border-color: #d7e2ea;
  color: #111827;
}

.signup-grid input::placeholder {
  color: #70829b;
}

.signup-grid small,
.marketing-check small {
  color: #a8bfd8;
}

.signup-panel .social-login.google {
  background: #fff;
  border-color: #dadce0;
  color: #202124;
  box-shadow: none;
}

.signup-panel .social-login.google b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
}

.signup-panel .social-login.google svg {
  width: 20px;
  height: 20px;
  display: block;
}

.signup-panel .social-login.kakao {
  background: #fee500;
  border-color: #fee500;
  color: #000;
  box-shadow: none;
}

.signup-panel .social-login.kakao b {
  background: #fee500;
  color: #000;
}

.signup-submit-row .primary-button {
  background: #0fb3a9;
  border-color: #0fb3a9;
  color: #fff;
  box-shadow: 0 12px 26px rgba(15, 179, 169, .22);
}

/* 2026-06-08 correction: neutral credential detail layout */
.guide-clean-detail {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
}

.guide-clean-summary,
.guide-clean-card,
.guide-clean-label,
.guide-clean-source {
  border: 1px solid rgba(139, 164, 191, .24);
  border-radius: 8px;
  background: rgba(8, 18, 31, .48);
  color: #dbe7f6;
  padding: 16px 18px;
  box-shadow: none;
}

.guide-clean-summary p {
  margin: 0;
  color: #f3f8ff;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.72;
}

.guide-clean-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

.guide-clean-card {
  min-height: 134px;
}

.guide-clean-label {
  display: flex;
  align-items: center;
  min-height: 58px;
}

.guide-clean-label b,
.guide-clean-card b,
.guide-clean-source b {
  color: #f3f8ff;
  font-size: 14px;
  font-weight: 900;
}

.guide-clean-card b {
  display: block;
  margin-bottom: 8px;
  color: #62e0da;
}

.guide-clean-card p,
.guide-clean-source p {
  margin: 0;
  color: #c6d5e6;
  font-size: 14px;
  line-height: 1.65;
}

.guide-clean-card p + p {
  margin-top: 6px;
}

.guide-clean-source {
  min-height: 52px;
}

.guide-clean-source b {
  display: block;
  margin-bottom: 10px;
  color: #62e0da;
}

@media (max-width: 820px) {
  .guide-clean-grid {
    grid-template-columns: 1fr;
  }
}

/* 2026-06-08 correction: neutralize previous colored credential classes */
.guide-term-title,
.guide-term-content,
.guide-term-source {
  border: 1px solid rgba(139, 164, 191, .24) !important;
  border-left-width: 1px !important;
  background: rgba(8, 18, 31, .56) !important;
  color: #dbe7f6 !important;
}

.guide-term-title b,
.guide-term-title span,
.guide-term-content b,
.guide-term-content p,
.guide-term-source b,
.guide-term-source span {
  color: #dbe7f6 !important;
}

/* 2026-06-08 admin login readability fix */

/* 2026-06-09: paid-grade dark navy finish for the hospital admin roadmap. */
.app-shell:has(.wonmu-premium-roadmap) .workspace {
  background:
    radial-gradient(circle at 18% -8%, rgba(35, 211, 196, .18), transparent 30%),
    radial-gradient(circle at 92% 8%, rgba(91, 140, 205, .16), transparent 30%),
    linear-gradient(180deg, #071321 0%, #081827 48%, #050e19 100%) !important;
}

.wonmu-premium-roadmap {
  --wpr-gold: #d8b96d;
  --wpr-teal: #38ddd1;
  --wpr-ink: #f5f9ff;
  --wpr-muted: #aebfd2;
  --wpr-line: rgba(152, 178, 207, .22);
  --wpr-line-strong: rgba(56, 221, 209, .42);
  color: var(--wpr-ink);
}

.wpr-hero {
  position: relative;
  border: 1px solid rgba(216, 185, 109, .26) !important;
  background:
    linear-gradient(135deg, rgba(13, 31, 52, .98), rgba(9, 48, 65, .96) 52%, rgba(7, 24, 40, .98)),
    linear-gradient(180deg, #102036, #071321) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.wpr-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(216, 185, 109, .18), transparent 22%, transparent 78%, rgba(56, 221, 209, .12));
}

.wpr-kicker,
.wpr-panel-head span,
.wpr-step-strip small,
.wpr-note > span {
  color: var(--wpr-gold) !important;
  letter-spacing: .08em;
}

.wpr-hero h1,
.wpr-panel-head h2,
.wpr-hero-copy h2,
.wpr-tabs button span,
.wpr-step-strip b {
  color: var(--wpr-ink) !important;
}

.wpr-hero p,
.wpr-hero-copy p,
.wpr-note p,
.wpr-step-strip p,
.wpr-checklist span {
  color: var(--wpr-muted) !important;
}

.wpr-tabs {
  gap: 10px;
}

.wpr-tabs button {
  border-color: var(--wpr-line) !important;
  background: linear-gradient(180deg, rgba(14, 31, 51, .94), rgba(9, 21, 36, .96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 16px 34px rgba(0, 0, 0, .18) !important;
}

.wpr-tabs button:hover,
.wpr-tabs button.active {
  border-color: rgba(216, 185, 109, .56) !important;
  background: linear-gradient(135deg, rgba(24, 95, 105, .94), rgba(17, 50, 78, .96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 18px 44px rgba(0, 0, 0, .26) !important;
}

.wpr-step-strip {
  gap: 10px;
}

.wpr-step-strip article,
.wpr-panel,
.wpr-hero-copy,
.wpr-flow span,
.wpr-checklist div,
.wpr-note {
  border-color: var(--wpr-line) !important;
  background: linear-gradient(145deg, rgba(14, 31, 51, .94), rgba(8, 19, 33, .97)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 18px 42px rgba(0, 0, 0, .18) !important;
}

.wpr-step-strip article {
  position: relative;
  overflow: hidden;
}

.wpr-step-strip article::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 3px;
  height: 100%;
  background: linear-gradient(180deg, var(--wpr-gold), var(--wpr-teal));
}

.wpr-step-strip span {
  color: #ecd08d !important;
}

.wpr-panel {
  border-color: rgba(216, 185, 109, .22) !important;
  background: linear-gradient(180deg, rgba(8, 22, 38, .98), rgba(6, 16, 28, .98)) !important;
}

.wpr-panel-head {
  border-bottom-color: var(--wpr-line) !important;
}

.wpr-hero-copy {
  padding: clamp(20px, 2.4vw, 30px);
}

.wpr-hero-copy h2 {
  font-size: clamp(22px, 2vw, 30px);
  letter-spacing: 0;
}

.wpr-flow span {
  min-height: 48px;
}

.wpr-flow b,
.wpr-checklist i {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border: 1px solid rgba(216, 185, 109, .38);
  border-radius: 999px;
  background: rgba(216, 185, 109, .1) !important;
  color: #f2d892 !important;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}

.wpr-checklist div {
  min-height: 70px;
}

.wpr-note {
  min-height: 108px;
}

.wpr-note.is-critical {
  border-color: rgba(216, 185, 109, .44) !important;
  background: linear-gradient(145deg, rgba(57, 39, 16, .36), rgba(13, 27, 44, .96)) !important;
}

@media (max-width: 680px) {
  .wpr-tabs button,
  .wpr-step-strip article,
  .wpr-checklist div,
  .wpr-note {
    min-height: auto;
  }
}

/* 2026-06-09 correction: match the referenced Streamlit roadmap layout, with dark navy page tone. */
.app-shell:has(.wonmu-streamlit-roadmap) .workspace {
  background:
    linear-gradient(135deg, rgba(9, 22, 37, .96) 0%, rgba(9, 35, 49, .94) 48%, rgba(6, 15, 28, .98) 100%) !important;
}

.app-shell:has(.wonmu-streamlit-board) .workspace {
  background:
    linear-gradient(135deg, rgba(8, 20, 34, .98) 0%, rgba(9, 31, 45, .96) 48%, rgba(5, 13, 25, .98) 100%) !important;
}

.wonmu-streamlit-board {
  display: grid;
  grid-template-columns: 292px minmax(0, 1fr);
  gap: 26px;
  max-width: 1500px;
  margin: 0 auto;
  color: #102b1b;
}

.wsb-sidebar {
  position: sticky;
  top: 18px;
  align-self: start;
  min-height: calc(100vh - 84px);
  border-radius: 8px;
  background: linear-gradient(180deg, #14591f 0%, #207832 62%, #2f8d43 100%);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .28);
  padding: 26px 20px;
  color: #eaf8e8;
}

.wsb-brand {
  display: grid;
  gap: 8px;
  text-align: center;
  padding: 6px 4px 22px;
  border-bottom: 1px solid rgba(255, 255, 255, .18);
}

.wsb-brand strong {
  color: #f5fff3;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 0;
}

.wsb-brand span,
.wsb-tip p {
  color: #c7e9c4;
  font-size: 13px;
  line-height: 1.7;
}

.wsb-menu-label {
  margin: 18px 0 10px;
  color: #eaf8e8;
  font-size: 13px;
  font-weight: 900;
}

.wsb-menu {
  display: grid;
  gap: 7px;
}

.wsb-menu button {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: #eaf8e8;
  padding: 10px 11px;
  text-align: left;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  cursor: pointer;
}

.wsb-menu button span {
  flex: 0 0 auto;
  color: #a7e9a2;
  font-size: 11px;
  font-weight: 900;
}

.wsb-menu button:hover,
.wsb-menu button.active {
  border-color: rgba(255, 255, 255, .2);
  background: rgba(255, 255, 255, .13);
}

.wsb-tip {
  margin-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .18);
  padding-top: 16px;
}

.wsb-tip b {
  color: #f5fff3;
  font-size: 13px;
}

.wsb-tip p {
  margin: 8px 0 0;
}

.wsb-main {
  min-width: 0;
}

.wsb-panel {
  display: none;
}

.wsb-panel.active {
  display: grid;
  gap: 20px;
}

.wsb-hero-card {
  border: 1px solid rgba(221, 232, 238, .9);
  border-radius: 18px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 22px 48px rgba(0, 0, 0, .22);
  padding: clamp(30px, 4vw, 48px) clamp(28px, 4vw, 42px);
}

.wsb-hero-card h2 {
  margin: 0 0 12px;
  color: #00562c;
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: 0;
}

.wsb-hero-card p {
  max-width: 900px;
  margin: 0;
  color: #37546e;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.75;
}

.wsb-section-title {
  margin: 10px 0 0;
  padding-bottom: 12px;
  border-bottom: 3px solid #2f8d4a;
  color: #f4fff9;
  font-size: clamp(22px, 2.1vw, 30px);
  font-weight: 900;
  letter-spacing: 0;
}

.wsb-info-box,
.wsb-text-box,
.wsb-check-card {
  border-radius: 14px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 18px 38px rgba(0, 0, 0, .18);
}

.wsb-info-box {
  border-left: 5px solid #00897b;
  padding: 18px 22px;
}

.wsb-info-box b {
  display: block;
  margin-bottom: 8px;
  color: #006452;
  font-size: 15px;
  font-weight: 900;
}

.wsb-info-box p,
.wsb-text-box p,
.wsb-check-card p {
  margin: 0;
  color: #36536c;
  font-size: 15px;
  line-height: 1.8;
}

.wsb-text-box {
  border-left: 5px solid #2f8d4a;
  padding: 20px 24px;
}

.wsb-text-box.critical {
  border-left-color: #d83d3d;
}

.wsb-check-card {
  display: grid;
  gap: 9px;
  border-left: 5px solid #2f8d4a;
  padding: 20px 24px;
}

.wsb-check-card p {
  display: flex;
  gap: 9px;
}

.wsb-check-card span {
  color: #238a43;
  font-weight: 900;
}

.wsb-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 18px 38px rgba(0, 0, 0, .18);
  padding: 18px;
}

.wsb-flow span {
  min-width: 88px;
  border-radius: 10px;
  background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
  color: #00562c;
  padding: 11px 15px;
  text-align: center;
  font-size: 13px;
  font-weight: 900;
}

.wsb-flow b {
  color: #5baa67;
  font-size: 17px;
  line-height: 1;
}

.wonmu-streamlit-board .wsr-list {
  display: grid;
  gap: 18px;
}

@media (max-width: 1100px) {
  .wonmu-streamlit-board {
    grid-template-columns: 1fr;
  }

  .wsb-sidebar {
    position: static;
    min-height: 0;
  }

  .wsb-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .wsb-menu {
    grid-template-columns: 1fr;
  }

  .wsb-hero-card,
  .wsb-text-box,
  .wsb-check-card,
  .wsb-info-box {
    padding: 20px;
  }
}

/* 2026-06-09: full dark navy application for the Streamlit-style 원무 guide. */
.wonmu-streamlit-board {
  --wsb-bg-1: rgba(8, 22, 38, .98);
  --wsb-bg-2: rgba(12, 31, 51, .96);
  --wsb-bg-3: rgba(6, 16, 29, .98);
  --wsb-line: rgba(130, 161, 194, .26);
  --wsb-line-strong: rgba(54, 216, 203, .44);
  --wsb-text: #f4f9ff;
  --wsb-muted: #afc2d7;
  --wsb-green: #41d071;
  --wsb-teal: #38ddd1;
  --wsb-gold: #e1c170;
  color: var(--wsb-text);
}

.wonmu-streamlit-board .wsb-sidebar {
  border: 1px solid rgba(65, 208, 113, .22);
  background:
    linear-gradient(180deg, rgba(15, 72, 40, .98) 0%, rgba(16, 89, 50, .96) 58%, rgba(10, 44, 35, .98) 100%) !important;
}

.wonmu-streamlit-board .wsb-hero-card,
.wonmu-streamlit-board .wsb-info-box,
.wonmu-streamlit-board .wsb-text-box,
.wonmu-streamlit-board .wsb-check-card,
.wonmu-streamlit-board .wsb-flow,
.wonmu-streamlit-board .wsr-step-card {
  border-color: var(--wsb-line) !important;
  background:
    linear-gradient(145deg, var(--wsb-bg-2), var(--wsb-bg-1) 56%, var(--wsb-bg-3)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .055),
    0 22px 48px rgba(0, 0, 0, .3) !important;
}

.wonmu-streamlit-board .wsb-hero-card,
.wonmu-streamlit-board .wsb-info-box,
.wonmu-streamlit-board .wsb-text-box,
.wonmu-streamlit-board .wsb-check-card,
.wonmu-streamlit-board .wsr-step-card {
  border-left-color: #2f9d55 !important;
}

.wonmu-streamlit-board .wsb-hero-card h2,
.wonmu-streamlit-board .wsr-step-card h2,
.wonmu-streamlit-board .wsb-section-title {
  color: var(--wsb-text) !important;
}

.wonmu-streamlit-board .wsb-hero-card p,
.wonmu-streamlit-board .wsb-info-box p,
.wonmu-streamlit-board .wsb-text-box p,
.wonmu-streamlit-board .wsb-check-card p,
.wonmu-streamlit-board .wsr-step-card p {
  color: var(--wsb-muted) !important;
}

.wonmu-streamlit-board .wsb-info-box b,
.wonmu-streamlit-board .wsb-check-card span {
  color: var(--wsb-teal) !important;
}

.wonmu-streamlit-board .wsb-section-title {
  border-bottom-color: rgba(65, 208, 113, .78) !important;
}

.wonmu-streamlit-board .wsr-step-badge {
  background: linear-gradient(135deg, #238a43, #36b864) !important;
  box-shadow: 0 10px 22px rgba(7, 89, 47, .34) !important;
}

.wonmu-streamlit-board .wsr-step-card::after,
.wonmu-streamlit-board .wsb-hero-card::after,
.wonmu-streamlit-board .wsb-text-box::after,
.wonmu-streamlit-board .wsb-check-card::after,
.wonmu-streamlit-board .wsb-info-box::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(65, 208, 113, .08), transparent 28%, rgba(56, 221, 209, .06));
}

.wonmu-streamlit-board .wsr-step-card,
.wonmu-streamlit-board .wsb-hero-card,
.wonmu-streamlit-board .wsb-text-box,
.wonmu-streamlit-board .wsb-check-card,
.wonmu-streamlit-board .wsb-info-box {
  position: relative;
  overflow: hidden;
}

.wonmu-streamlit-board .wsb-flow span {
  border: 1px solid rgba(65, 208, 113, .24);
  background: linear-gradient(135deg, rgba(27, 94, 52, .42), rgba(13, 52, 45, .5)) !important;
  color: #e8fff0 !important;
}

.wonmu-streamlit-board .wsb-flow b {
  color: var(--wsb-teal) !important;
}

.wonmu-streamlit-board .wsb-text-box.critical {
  border-left-color: #e86565 !important;
  background:
    linear-gradient(145deg, rgba(48, 25, 32, .96), rgba(10, 24, 40, .98)) !important;
}

.wonmu-streamlit-board .wsr-step-card p,
.wonmu-streamlit-board .wsb-hero-card p,
.wonmu-streamlit-board .wsb-info-box p,
.wonmu-streamlit-board .wsb-text-box p,
.wonmu-streamlit-board .wsb-check-card p,
.wonmu-streamlit-board .wsb-flow span {
  position: relative;
  z-index: 1;
}

.wonmu-streamlit-board .wsr-step-card h2,
.wonmu-streamlit-board .wsb-hero-card h2,
.wonmu-streamlit-board .wsb-info-box b,
.wonmu-streamlit-board .wsb-section-title,
.wonmu-streamlit-board .wsr-step-badge {
  position: relative;
  z-index: 1;
}

/* 2026-06-11: move roadmap section selector below search, matching the external-care guide pattern. */
.wonmu-streamlit-board {
  display: block !important;
  max-width: 1360px;
}

.wonmu-streamlit-board .wsb-main {
  display: grid;
  gap: 22px;
}

.wsb-toolbar {
  display: grid;
  gap: 14px;
  border: 1px solid rgba(130, 161, 194, .28);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(14, 31, 51, .96), rgba(8, 20, 35, .98));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 24px 54px rgba(0, 0, 0, .28);
  padding: clamp(18px, 2.3vw, 26px);
}

.wsb-toolbar-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 138px;
  gap: 16px;
  align-items: center;
}

.wsb-kicker {
  display: inline-flex;
  margin-bottom: 8px;
  color: var(--wsb-gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.wsb-toolbar h2 {
  margin: 0;
  color: #f8fbff;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.2;
  letter-spacing: 0;
}

.wsb-toolbar p {
  margin: 8px 0 0;
  color: #aec2d7;
  line-height: 1.65;
}

.wsb-toolbar-stat {
  display: grid;
  place-items: center;
  min-height: 104px;
  border: 1px solid rgba(56, 221, 209, .24);
  border-radius: 14px;
  background: rgba(56, 221, 209, .07);
  text-align: center;
}

.wsb-toolbar-stat b {
  color: #f1d68f;
  font-size: 42px;
  line-height: 1;
}

.wsb-toolbar-stat span {
  color: #dcecff;
  font-size: 13px;
  font-weight: 900;
}

.wsb-search {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(56, 221, 209, .32);
  border-radius: 12px;
  background: rgba(3, 12, 22, .68);
  color: #38ddd1;
  padding: 0 15px;
}

.wsb-search svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.wsb-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #ffffff;
  font-size: 15px;
  font-weight: 800;
}

.wsb-search input::placeholder {
  color: #8099b5;
}

.wonmu-streamlit-board .wsb-menu-label {
  margin: 2px 0 -4px;
  color: #f1d68f;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
}

.wonmu-streamlit-board .wsb-menu {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
}

.wonmu-streamlit-board .wsb-menu button {
  width: auto;
  min-height: 40px;
  border: 1px solid rgba(130, 161, 194, .28);
  border-radius: 999px;
  background: rgba(255, 255, 255, .055);
  color: #dcecff;
  padding: 0 14px;
  box-shadow: none;
}

.wonmu-streamlit-board .wsb-menu button span {
  color: #38ddd1;
  font-size: 10px;
}

.wonmu-streamlit-board .wsb-menu button:hover,
.wonmu-streamlit-board .wsb-menu button.active {
  border-color: rgba(216, 185, 109, .56);
  background: linear-gradient(135deg, rgba(35, 138, 67, .92), rgba(20, 90, 99, .94));
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .2);
}

.wonmu-streamlit-board .wsb-menu button.active span {
  color: #f1d68f;
}

.wonmu-streamlit-board .wsb-tip {
  margin-top: 0;
  border: 1px solid rgba(216, 185, 109, .18);
  border-radius: 12px;
  background: rgba(216, 185, 109, .065);
  padding: 12px 14px;
}

.wonmu-streamlit-board .wsb-tip b {
  color: #f1d68f;
}

.wonmu-streamlit-board .wsb-tip p {
  margin: 4px 0 0;
  color: #b9cbe0;
}

.wsb-empty {
  border: 1px dashed rgba(216, 185, 109, .42);
  border-radius: 12px;
  background: rgba(216, 185, 109, .07);
  color: #f1d68f !important;
  padding: 13px 14px;
  font-weight: 900;
}

.wsb-panels {
  min-width: 0;
}

@media (max-width: 720px) {
  .wsb-toolbar-head {
    grid-template-columns: 1fr;
  }

  .wsb-toolbar-stat {
    min-height: 84px;
    justify-items: start;
    padding: 16px;
  }
}

.wonmu-streamlit-roadmap {
  max-width: none;
  margin: 0;
  padding: 10px 0 28px;
  color: #f7fbff;
}

.wsr-head {
  margin: 0 0 20px;
  padding: 0 0 14px;
  border-bottom: 3px solid #2f8d4a;
}

.wsr-head h1 {
  margin: 0;
  color: #f4fff9;
  font-size: clamp(23px, 2.3vw, 32px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.25;
}

.wsr-list {
  display: grid;
  gap: 18px;
}

.wsr-step-card {
  position: relative;
  min-height: 120px;
  margin: 0;
  border: 1px solid rgba(215, 231, 239, .82);
  border-left: 5px solid #2f8d4a;
  border-radius: 15px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .99), rgba(250, 252, 255, .98));
  box-shadow: 0 18px 34px rgba(0, 0, 0, .2);
  padding: 33px 30px 24px;
}

.wsr-step-badge {
  position: absolute;
  top: -15px;
  left: 26px;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  background: linear-gradient(135deg, #238a43, #2f9d55);
  color: #ffffff;
  padding: 0 17px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .02em;
  box-shadow: 0 8px 18px rgba(20, 82, 43, .22);
}

.wsr-step-card h2 {
  margin: 0 0 13px;
  color: #00562c;
  font-size: clamp(18px, 1.55vw, 22px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.3;
}

.wsr-step-card p {
  margin: 0;
  color: #35536f;
  font-size: 15px;
  line-height: 1.75;
  font-weight: 500;
}

@media (max-width: 720px) {
  .wonmu-streamlit-roadmap {
    padding-top: 4px;
  }

  .wsr-list {
    gap: 17px;
  }

  .wsr-step-card {
    min-height: 112px;
    padding: 31px 20px 20px;
    border-radius: 14px;
  }

  .wsr-step-badge {
    left: 20px;
  }
}
.login-surface {
  background: transparent;
  padding: 32px 18px;
}

.login-panel {
  border-color: rgba(139, 164, 191, .28) !important;
  background: linear-gradient(145deg, rgba(16, 35, 56, .98), rgba(8, 18, 31, .98)) !important;
  color: #f3f8ff !important;
  box-shadow: 0 22px 58px rgba(0, 0, 0, .28) !important;
}

.login-panel h1 {
  color: #ffffff !important;
}

.login-panel p,
.login-panel .demo-account span {
  color: #b9cbe0 !important;
}

.login-panel label,
.login-panel .demo-account b {
  color: #e8f2ff !important;
}

.login-panel input {
  border-color: rgba(139, 164, 191, .38) !important;
  background: rgba(3, 10, 18, .92) !important;
  color: #ffffff !important;
}

.login-panel input::placeholder {
  color: #8ea3bb !important;
}

.login-panel .demo-account {
  border: 1px solid rgba(45, 221, 206, .24);
  border-radius: 8px;
  background: rgba(20, 184, 173, .08);
  padding: 12px 14px;
}

.login-panel .login-error {
  color: #ffb4b4 !important;
}

/* 2026-06-11: make the roadmap selector fit the available viewport more tightly. */
.wonmu-streamlit-board {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.app-shell:has(.wonmu-streamlit-board) .workspace {
  padding-left: clamp(12px, 1.2vw, 18px);
  padding-right: clamp(12px, 1.2vw, 18px);
}

.wonmu-streamlit-board .wsb-main {
  gap: 18px;
}

.wonmu-streamlit-board .wsb-toolbar {
  gap: 11px;
  padding: clamp(14px, 1.7vw, 20px);
}

.wonmu-streamlit-board .wsb-toolbar-head {
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 12px;
}

.wonmu-streamlit-board .wsb-kicker {
  margin-bottom: 5px;
  font-size: 10px;
}

.wonmu-streamlit-board .wsb-toolbar h2 {
  font-size: clamp(23px, 2vw, 30px);
}

.wonmu-streamlit-board .wsb-toolbar p {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.55;
}

.wonmu-streamlit-board .wsb-toolbar-stat {
  min-height: 86px;
}

.wonmu-streamlit-board .wsb-toolbar-stat b {
  font-size: 34px;
}

.wonmu-streamlit-board .wsb-search {
  min-height: 44px;
  border-radius: 10px;
}

.wonmu-streamlit-board .wsb-search input {
  font-size: 14px;
}

.wonmu-streamlit-board .wsb-menu {
  gap: 7px;
}

.wonmu-streamlit-board .wsb-menu button {
  min-height: 34px;
  padding: 0 12px;
  font-size: 12px;
}

.wonmu-streamlit-board .wsb-tip {
  padding: 9px 12px;
}

.wonmu-streamlit-board .wsb-tip p {
  font-size: 13px;
  line-height: 1.45;
}

.wonmu-streamlit-board .wsb-panel.active {
  gap: 16px;
}

.wonmu-streamlit-board .wsb-hero-card {
  padding: clamp(22px, 2.6vw, 34px);
}

.wonmu-streamlit-board .wsb-hero-card h2 {
  font-size: clamp(26px, 2.6vw, 38px);
}

.wsh-section {
  display: grid;
  gap: 16px;
}

.wsh-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wsh-title-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.wsh-title-inline span {
  border: 1px solid rgba(95, 210, 196, .34);
  border-radius: 999px;
  background: rgba(22, 99, 112, .28);
  color: #b8f3ec;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 900;
}

.wsh-roadmap-list {
  display: grid;
  gap: 12px;
}

.wsh-roadmap-list article {
  position: relative;
  border: 1px solid rgba(130, 161, 194, .24);
  border-left: 4px solid #41d071;
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  padding: 28px 24px 22px;
}

.wsh-roadmap-list article > span {
  position: absolute;
  top: -13px;
  left: 22px;
  border-radius: 999px;
  background: #1f8c42;
  color: #ffffff;
  padding: 5px 16px;
  font-size: 12px;
  font-weight: 950;
}

.wsh-roadmap-list h4,
.wsh-two-grid h4 {
  margin: 0 0 10px;
  color: #e8fff0;
  font-size: 17px;
  font-weight: 950;
  word-break: keep-all;
}

.wsh-roadmap-list p,
.wsh-two-grid p,
.wsh-info p {
  margin: 0;
  color: #c8d8e8;
  line-height: 1.65;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wsh-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.wsh-flow span {
  border-radius: 10px;
  background: rgba(65, 208, 113, .16);
  color: #dff9ee;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 900;
  word-break: keep-all;
}

.wsh-flow b {
  color: #41d071;
  font-size: 18px;
}

.wsh-flow-split {
  display: grid;
  gap: 10px;
}

.wsh-flow-row {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(95, 210, 196, .2);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(12, 37, 57, .9), rgba(7, 20, 34, .96));
  padding: 12px 14px;
}

.wsh-flow-row strong {
  display: grid;
  place-items: center;
  min-height: 34px;
  border-radius: 8px;
  background: rgba(56, 221, 209, .13);
  color: #c4fff6;
  font-weight: 950;
}

.wsh-flow-row div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.wsh-flow-row span {
  border-radius: 10px;
  background: rgba(65, 208, 113, .12);
  color: #e4fbf5;
  padding: 10px 13px;
  font-size: 13px;
  font-weight: 900;
  word-break: keep-all;
}

.wsh-flow-row b {
  color: #4de0b1;
  font-size: 18px;
}

.wsh-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
}

.wsh-table-wrap table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
}

.wsh-table-wrap th,
.wsh-table-wrap td {
  border: 1px solid rgba(130, 161, 194, .2);
  color: #d9e5f2;
  padding: 13px 14px;
  text-align: left;
  line-height: 1.55;
}

.wsh-table-wrap th {
  background: rgba(65, 208, 113, .2);
  color: #e8fff0;
  font-weight: 900;
}

.wsh-table-wrap td:first-child {
  color: #e8fff0;
  font-weight: 850;
}

.wsh-share-wrap {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  padding: 20px;
}

.wsh-share-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.wsh-share-grid article {
  border-radius: 12px;
  min-height: 120px;
  padding: 18px 16px;
  text-align: center;
}

.wsh-share-grid article.green { background: linear-gradient(145deg, rgba(65, 208, 113, .22), rgba(65, 208, 113, .11)); }
.wsh-share-grid article.blue { background: linear-gradient(145deg, rgba(56, 189, 248, .22), rgba(56, 189, 248, .11)); }
.wsh-share-grid article.orange { background: linear-gradient(145deg, rgba(24, 90, 104, .3), rgba(24, 90, 104, .12)); }
.wsh-share-grid article.purple { background: linear-gradient(145deg, rgba(48, 84, 126, .3), rgba(48, 84, 126, .12)); }

.wsh-share-grid b {
  display: block;
  color: #8ef0ac;
  font-size: 28px;
  font-weight: 950;
  line-height: 1;
}

.wsh-share-grid article.blue b { color: #72c6ff; }
.wsh-share-grid article.orange b { color: #8fe8df; }
.wsh-share-grid article.purple b { color: #9fc9ff; }

.wsh-share-grid strong {
  display: block;
  margin-top: 10px;
  color: #e8fff0;
  font-weight: 950;
}

.wsh-share-grid p {
  margin: 8px 0 0;
  color: #c8d8e8;
  line-height: 1.45;
  word-break: keep-all;
}

.wsh-two-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.wsh-two-grid article {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  padding: 20px;
}

.wsh-two-grid article.danger h4 {
  color: #bfe9ff;
}

.wsh-two-grid p {
  margin-bottom: 9px;
}

.wsh-info {
  border-left: 4px solid #38ddd1;
  border-radius: 12px;
  background: rgba(56, 221, 209, .08);
  padding: 16px 18px;
}

.wsh-info b {
  color: #d9efff;
}

.wsh-info p {
  margin-top: 7px;
}

.wsg-section {
  display: grid;
  gap: 16px;
}

.wsg-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wsg-part-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.wsg-part-grid article,
.wsg-coop-grid article,
.wsg-panels,
.wsg-timeline article {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
}

.wsg-part-grid article {
  min-height: 220px;
  padding: 20px;
}

.wsg-part-grid article.green { background: linear-gradient(145deg, rgba(22, 70, 48, .52), rgba(8, 20, 35, .96)); }
.wsg-part-grid article.blue { background: linear-gradient(145deg, rgba(18, 58, 94, .56), rgba(8, 20, 35, .96)); }
.wsg-part-grid article.orange { background: linear-gradient(145deg, rgba(24, 90, 104, .46), rgba(8, 20, 35, .96)); }
.wsg-part-grid article.purple { background: linear-gradient(145deg, rgba(48, 84, 126, .48), rgba(8, 20, 35, .96)); }

.wsg-part-grid article > div {
  font-size: 27px;
  text-align: center;
  margin-bottom: 10px;
}

.wsg-part-grid h4,
.wsg-coop-grid h4,
.wsg-timeline h4 {
  margin: 0 0 12px;
  color: #e8fff0;
  font-size: 16px;
  font-weight: 950;
  word-break: keep-all;
}

.wsg-part-grid article.orange h4 { color: #8fe8df; }
.wsg-part-grid article.purple h4 { color: #9fc9ff; }

.wsg-part-grid p,
.wsg-coop-grid p,
.wsg-timeline p {
  margin: 0 0 9px;
  color: #c8d8e8;
  line-height: 1.65;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wsg-info,
.wsg-warning {
  border-radius: 12px;
  padding: 16px 18px;
}

.wsg-info {
  border-left: 4px solid #38ddd1;
  background: rgba(56, 221, 209, .08);
}

.wsg-warning {
  border-left: 4px solid #38ddd1;
  background: rgba(56, 221, 209, .08);
}

.wsg-info b,
.wsg-warning b {
  color: #d9efff;
}

.wsg-warning b {
  color: #b8f3ec;
}

.wsg-info p,
.wsg-warning p {
  margin: 7px 0 0;
  color: #d9e5f2;
  line-height: 1.65;
}

.wsg-coop-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.wsg-coop-grid article {
  padding: 20px;
}

.wsg-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.wsg-flow span {
  border-radius: 10px;
  background: rgba(65, 208, 113, .16);
  color: #dff9ee;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 900;
  word-break: keep-all;
}

.wsg-flow b {
  color: #41d071;
  font-size: 18px;
}

.wsg-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-bottom: 1px solid rgba(130, 161, 194, .22);
}

.wsg-tabs button {
  min-height: 42px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #dbe8f7;
  padding: 0 10px;
  font-weight: 850;
  cursor: pointer;
}

.wsg-tabs button:hover,
.wsg-tabs button.active {
  border-bottom-color: #38ddd1;
  color: #b8f3ec;
}

.wsg-panels {
  overflow: hidden;
}

.wsg-panel {
  display: none;
  padding: 18px 20px;
}

.wsg-panel.active {
  display: grid;
}

.wsg-panel p {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 12px;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  color: #d4e1ef;
  padding: 12px 0;
  line-height: 1.65;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wsg-panel p:first-child {
  border-top: 0;
}

.wsg-panel span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  background: #22c55e;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
}

.wsg-timeline {
  display: grid;
  gap: 12px;
}

.wsg-timeline article {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding: 16px 18px;
}

.wsg-timeline time {
  color: #9ff0b5;
  font-size: 13px;
  font-weight: 950;
}

.wsg-timeline h4 {
  margin-bottom: 6px;
}

.wsi-section {
  display: grid;
  gap: 16px;
}

.wsi-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wsi-danger,
.wsi-warning {
  border-radius: 12px;
  padding: 16px 18px;
}

.wsi-danger {
  border-left: 4px solid #5ba7ff;
  background: rgba(91, 167, 255, .08);
}

.wsi-warning {
  border-left: 4px solid #38ddd1;
  background: rgba(56, 221, 209, .08);
}

.wsi-danger b,
.wsi-warning b {
  color: #b8f3ec;
}

.wsi-danger p,
.wsi-warning p {
  margin: 7px 0 0;
  color: #d9e5f2;
  line-height: 1.65;
}

.wsi-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
}

.wsi-table-wrap table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}

.wsi-table-wrap th,
.wsi-table-wrap td {
  border: 1px solid rgba(130, 161, 194, .2);
  color: #d9e5f2;
  padding: 13px 14px;
  text-align: left;
  line-height: 1.55;
}

.wsi-table-wrap th {
  background: rgba(65, 208, 113, .2);
  color: #e8fff0;
  font-weight: 900;
}

.wsi-table-wrap td:first-child {
  color: #e8fff0;
  font-weight: 850;
}

.wsi-table-wrap td.hot {
  color: #8fe8df;
  font-weight: 950;
}

.wsi-referral-grid,
.wsi-example-grid,
.wsi-special-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.wsi-referral-grid article,
.wsi-example-grid article,
.wsi-special-grid article,
.wsi-drg-card {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  padding: 20px;
}

.wsi-referral-grid h4,
.wsi-example-grid h4,
.wsi-special-grid h4 {
  margin: 0 0 14px;
  color: #e8fff0;
  font-size: 16px;
  font-weight: 950;
}

.wsi-referral-grid p,
.wsi-example-grid p,
.wsi-special-grid p {
  margin: 0 0 9px;
  color: #c8d8e8;
  line-height: 1.65;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wsi-example-grid h4 {
  display: flex;
  gap: 8px;
  align-items: center;
}

.wsi-example-grid h4 span {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, .12);
}

.wsi-example-grid article.blue h4 span { background: #0f77c8; box-shadow: 0 0 0 3px rgba(15, 119, 200, .14); }
.wsi-example-grid article.purple h4 span { background: #5ba7ff; box-shadow: 0 0 0 3px rgba(91, 167, 255, .14); }
.wsi-example-grid article.orange h4 span { background: #38ddd1; box-shadow: 0 0 0 3px rgba(56, 221, 209, .14); }

.wsi-example-grid strong {
  display: block;
  margin-top: 12px;
  color: #8ef0ac;
  font-weight: 950;
}

.wsi-example-grid article.blue strong { color: #72c6ff; }
.wsi-example-grid article.purple strong { color: #9fc9ff; }
.wsi-example-grid article.orange strong { color: #8fe8df; }

.wsi-drg-card {
  padding: 18px;
}

.wsi-drg-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: baseline;
  margin-bottom: 14px;
}

.wsi-drg-head b {
  color: #e8fff0;
  font-size: 17px;
}

.wsi-drg-head span {
  color: #9ff0b5;
  font-weight: 850;
}

.wsi-drg-layout {
  display: grid;
  grid-template-columns: minmax(220px, .34fr) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.wsi-drg-chips {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.wsi-drg-chips span {
  border-radius: 10px;
  background: rgba(65, 208, 113, .12);
  color: #e8fff0;
  padding: 9px 11px;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
  word-break: keep-all;
}

.wsi-drg-rules {
  display: grid;
  gap: 0;
}

.wsi-drg-rules p {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 10px;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  color: #d4e1ef;
  padding: 10px 0;
  line-height: 1.6;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wsi-drg-rules p:first-child {
  border-top: 0;
  padding-top: 0;
}

.wsi-special-grid article.green { background: linear-gradient(145deg, rgba(22, 70, 48, .52), rgba(8, 20, 35, .96)); }
.wsi-special-grid article.blue { background: linear-gradient(145deg, rgba(18, 58, 94, .56), rgba(8, 20, 35, .96)); }
.wsi-special-grid article.orange { background: linear-gradient(145deg, rgba(24, 90, 104, .46), rgba(8, 20, 35, .96)); }
.wsi-special-grid article.purple { background: linear-gradient(145deg, rgba(48, 84, 126, .48), rgba(8, 20, 35, .96)); }

.wso-section {
  display: grid;
  gap: 16px;
}

.wso-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wso-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.wso-flow span {
  border-radius: 10px;
  background: rgba(65, 208, 113, .16);
  color: #dff9ee;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 900;
  word-break: keep-all;
}

.wso-flow b {
  color: #41d071;
  font-size: 18px;
}

.wso-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-bottom: 1px solid rgba(130, 161, 194, .22);
}

.wso-tabs button {
  min-height: 42px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #dbe8f7;
  padding: 0 10px;
  font-weight: 850;
  cursor: pointer;
}

.wso-tabs button:hover,
.wso-tabs button.active {
  border-bottom-color: #38ddd1;
  color: #b8f3ec;
}

.wso-panels,
.wso-receipt-table,
.wso-faq-list article {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
}

.wso-panels {
  overflow: hidden;
}

.wso-panel {
  display: none;
  padding: 20px;
}

.wso-panel.active {
  display: grid;
  gap: 14px;
}

.wso-scenario {
  border-left: 4px solid #41d071;
  border-radius: 12px;
  background: rgba(65, 208, 113, .08);
  color: #eef7ff;
  padding: 16px 18px;
  line-height: 1.65;
  word-break: keep-all;
}

.wso-scenario b {
  color: #ffffff;
}

.wso-step-list {
  display: grid;
  gap: 0;
}

.wso-step-list p {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 12px;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  color: #d4e1ef;
  padding: 12px 0;
  line-height: 1.65;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wso-step-list p:first-child {
  border-top: 0;
}

.wso-step-list span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  background: #0f77c8;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
}

.wso-warning {
  border-left: 4px solid #38ddd1;
  border-radius: 12px;
  background: rgba(56, 221, 209, .08);
  padding: 16px 18px;
}

.wso-warning b {
  color: #b8f3ec;
}

.wso-warning p {
  margin: 7px 0 0;
  color: #d9e5f2;
  line-height: 1.65;
}

.wso-receipt-table {
  padding: 12px 20px;
}

.wso-receipt-table p {
  display: grid;
  grid-template-columns: minmax(150px, .28fr) minmax(0, 1fr);
  gap: 18px;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  padding: 12px 0;
  color: #c8d8e8;
  line-height: 1.6;
}

.wso-receipt-table p:first-child {
  border-top: 0;
}

.wso-receipt-table b {
  color: #9ff0b5;
  font-weight: 950;
  word-break: keep-all;
}

.wso-receipt-table span {
  min-width: 0;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wso-faq-list {
  display: grid;
  gap: 12px;
}

.wso-faq-list article {
  padding: 18px 20px;
}

.wso-faq-list h4 {
  margin: 0 0 10px;
  color: #e8fff0;
  font-size: 16px;
  font-weight: 950;
  word-break: keep-all;
}

.wso-faq-list p {
  margin: 0;
  color: #c8d8e8;
  line-height: 1.65;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wse-section {
  display: grid;
  gap: 16px;
}

.wse-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wse-accordion {
  display: grid;
  gap: 10px;
}

.wse-accordion details {
  border: 1px solid rgba(130, 161, 194, .3);
  border-radius: 10px;
  background: rgba(12, 27, 44, .72);
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045);
}

.wse-accordion summary {
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #eef7ff;
  padding: 0 15px;
  cursor: pointer;
  font-weight: 850;
  list-style: none;
}

.wse-accordion summary::-webkit-details-marker {
  display: none;
}

.wse-accordion summary::before {
  content: "›";
  color: #38ddd1;
  font-size: 22px;
  line-height: 1;
  transition: transform .18s ease;
}

.wse-accordion details[open] summary::before {
  transform: rotate(90deg);
}

.wse-accordion summary span {
  width: 24px;
  text-align: center;
}

.wse-accordion summary b {
  font-size: 14px;
}

.wse-accordion details > div {
  display: grid;
  gap: 7px;
  border-top: 1px solid rgba(130, 161, 194, .18);
  padding: 13px 18px 16px 52px;
}

.wse-accordion p {
  position: relative;
  margin: 0;
  color: #b9cbe0;
  font-size: 14px;
  line-height: 1.65;
}

.wse-accordion p::before {
  content: "";
  position: absolute;
  left: -14px;
  top: .72em;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #38ddd1;
}

.wse-contact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.wse-contact-grid article {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 104px;
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  padding: 18px 20px;
}

.wse-contact-grid i {
  width: 34px;
  flex: 0 0 auto;
  text-align: center;
  font-size: 25px;
  font-style: normal;
}

.wse-contact-grid b,
.wse-contact-grid strong,
.wse-contact-grid span {
  display: block;
}

.wse-contact-grid b {
  color: #dff9ee;
  font-size: 14px;
  font-weight: 900;
}

.wse-contact-grid strong {
  margin-top: 3px;
  color: #41d071;
  font-size: 18px;
  font-weight: 950;
}

.wse-contact-grid span {
  margin-top: 3px;
  color: #aebfd2;
  font-size: 13px;
}

.wse-tip {
  border-left: 4px solid #41d071;
  border-radius: 12px;
  background: rgba(65, 208, 113, .08);
  padding: 16px 18px;
}

.wse-tip b {
  color: #f1d68f;
}

.wse-tip p {
  margin: 8px 0 0;
  color: #d4e1ef;
  line-height: 1.65;
}

.wsc-section {
  display: grid;
  gap: 16px;
}

.wsc-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wsc-trait-grid,
.wsc-special-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.wsc-trait-grid {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 18px 40px rgba(0, 0, 0, .22);
  padding: 20px;
}

.wsc-trait-grid article,
.wsc-special-grid article {
  border: 1px solid rgba(130, 161, 194, .22);
  border-radius: 14px;
  background: rgba(255, 255, 255, .055);
  padding: 18px;
}

.wsc-trait-grid article {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 8px;
  min-height: 130px;
}

.wsc-trait-grid article:nth-child(1) {
  background: rgba(65, 208, 113, .09);
}

.wsc-trait-grid article:nth-child(2) {
  background: rgba(56, 221, 209, .09);
}

.wsc-trait-grid article:nth-child(3) {
  background: rgba(91, 167, 255, .1);
}

.wsc-trait-grid i {
  font-size: 26px;
  font-style: normal;
}

.wsc-trait-grid b {
  color: #dff9ee;
  font-weight: 950;
}

.wsc-trait-grid p,
.wsc-special-grid p,
.wsc-emotion-list p {
  margin: 0;
  color: #b9cbe0;
  font-size: 14px;
  line-height: 1.65;
}

.wsc-phone-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  border-bottom: 1px solid rgba(130, 161, 194, .22);
}

.wsc-phone-tabs button {
  min-height: 40px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #dbe8f7;
  padding: 0 10px;
  font-weight: 850;
  cursor: pointer;
}

.wsc-phone-tabs button:hover,
.wsc-phone-tabs button.active {
  border-bottom-color: #38ddd1;
  color: #b8f3ec;
}

.wsc-phone-panels {
  border: 1px solid rgba(130, 161, 194, .22);
  border-radius: 14px;
  background: rgba(8, 20, 35, .55);
  overflow: hidden;
}

.wsc-phone-panel {
  display: none;
  padding: 14px 18px 18px;
}

.wsc-phone-panel.active {
  display: grid;
  gap: 0;
}

.wsc-phone-panel h4 {
  margin: 0 0 10px;
  color: #f4fff9;
  font-size: 15px;
}

.wsc-phone-panel p {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  color: #d4e1ef;
  padding: 12px 0;
  line-height: 1.6;
}

.wsc-phone-panel p:first-of-type {
  border-top: 0;
}

.wsc-phone-panel span {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  border-radius: 4px;
  background: #22c55e;
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
}

.wsc-special-grid article {
  min-height: 230px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
}

.wsc-special-grid h4 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: #e6fff0;
  font-size: 16px;
}

.wsc-special-grid article:nth-child(3) h4 {
  color: #ffb4b4;
}

.wsc-emotion-list {
  display: grid;
  gap: 0;
}

.wsc-emotion-list article {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 12px;
  border-top: 1px solid rgba(130, 161, 194, .15);
  padding: 13px 0;
}

.wsc-emotion-list article:first-child {
  border-top: 0;
}

.wsc-emotion-list span {
  font-size: 20px;
}

.wsc-emotion-list b {
  color: #e8fff0;
}

.wsd-section {
  display: grid;
  gap: 16px;
}

.wsd-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wsd-doc-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.wsd-doc-grid article,
.wsd-claim-grid article,
.wsd-complaint-panels {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
}

.wsd-doc-grid article {
  min-height: 148px;
  padding: 18px 20px;
}

.wsd-doc-grid header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.wsd-doc-grid b,
.wsd-claim-grid h4 {
  color: #e8fff0;
  font-weight: 950;
}

.wsd-doc-grid header span {
  flex: 0 0 auto;
  border-radius: 8px;
  background: rgba(65, 208, 113, .12);
  color: #9ff0b5;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
}

.wsd-doc-grid p,
.wsd-claim-grid p,
.wsd-complaint-panel p {
  margin: 0;
  color: #b9cbe0;
  font-size: 14px;
  line-height: 1.65;
}

.wsd-warning {
  border-left: 4px solid #38ddd1;
  border-radius: 12px;
  background: rgba(56, 221, 209, .08);
  padding: 16px 18px;
}

.wsd-warning b {
  color: #b8f3ec;
}

.wsd-warning p {
  margin: 7px 0 0;
  color: #d9e5f2;
}

.wsd-claim-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.wsd-claim-grid article {
  padding: 20px;
}

.wsd-claim-grid h4 {
  margin: 0 0 18px;
  font-size: 17px;
}

.wsd-claim-grid p,
.wsd-complaint-panel p {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 12px;
  border-top: 1px solid rgba(130, 161, 194, .14);
  padding: 12px 0;
}

.wsd-claim-grid p:first-of-type,
.wsd-complaint-panel p:first-of-type {
  border-top: 0;
}

.wsd-claim-grid p span,
.wsd-complaint-panel p span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  background: #0f77c8;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
}

.wsd-complaint-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-bottom: 1px solid rgba(130, 161, 194, .22);
}

.wsd-complaint-tabs button {
  min-height: 40px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #dbe8f7;
  padding: 0 10px;
  font-weight: 850;
  cursor: pointer;
}

.wsd-complaint-tabs button:hover,
.wsd-complaint-tabs button.active {
  border-bottom-color: #38ddd1;
  color: #b8f3ec;
}

.wsd-complaint-panels {
  overflow: hidden;
}

.wsd-complaint-panel {
  display: none;
  padding: 18px 20px;
}

.wsd-complaint-panel.active {
  display: grid;
}

.wsd-scenario {
  border-left: 4px solid #41d071;
  border-radius: 12px;
  background: rgba(65, 208, 113, .08);
  color: #eef7ff;
  margin-bottom: 14px;
  padding: 16px 18px;
}

.wsd-complaint-panel aside {
  border-left: 4px solid #38ddd1;
  border-radius: 12px;
  background: rgba(56, 221, 209, .08);
  margin-top: 14px;
  padding: 14px 16px;
}

.wsd-complaint-panel aside b,
.wsd-complaint-panel aside small {
  display: block;
}

.wsd-complaint-panel aside b {
  color: #d9efff;
}

.wsd-complaint-panel aside small {
  margin-top: 6px;
  color: #bfd0e2;
  line-height: 1.55;
}

.wst-section {
  display: grid;
  gap: 16px;
}

.wst-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wst-warning {
  border-left: 4px solid #38ddd1;
  border-radius: 12px;
  background: rgba(56, 221, 209, .08);
  padding: 16px 18px;
}

.wst-warning b {
  color: #b8f3ec;
}

.wst-warning p {
  margin: 7px 0 0;
  color: #d9e5f2;
}

.wst-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.wst-flow span {
  border-radius: 10px;
  background: rgba(65, 208, 113, .16);
  color: #dff9ee;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 900;
}

.wst-flow b {
  color: #41d071;
  font-size: 18px;
}

.wst-er-grid,
.wst-transfer-grid,
.wst-icu-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.wst-er-grid article,
.wst-transfer-grid article,
.wst-icu-grid article {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  padding: 20px;
}

.wst-er-grid h4,
.wst-transfer-grid h4,
.wst-icu-grid h4 {
  margin: 0 0 16px;
  color: #e8fff0;
  font-size: 17px;
}

.wst-er-grid table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: 10px;
}

.wst-er-grid th,
.wst-er-grid td {
  border: 1px solid rgba(130, 161, 194, .2);
  color: #d9e5f2;
  padding: 12px;
  text-align: left;
}

.wst-er-grid th {
  background: rgba(65, 208, 113, .1);
  color: #e8fff0;
}

.wst-er-grid p,
.wst-icu-grid p {
  margin: 0 0 10px;
  color: #b9cbe0;
  line-height: 1.65;
}

.wst-er-grid p b {
  color: #e8fff0;
}

.wst-transfer-grid article > b {
  display: block;
  margin: -6px 0 18px;
  color: #dcecff;
}

.wst-transfer-grid p {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 12px;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  color: #d4e1ef;
  padding: 12px 0;
}

.wst-transfer-grid p span {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background: #22c55e;
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
}

.wst-night-list {
  display: grid;
  gap: 0;
}

.wst-night-list article {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  border-top: 1px solid rgba(130, 161, 194, .15);
  padding: 13px 0;
}

.wst-night-list article:first-child {
  border-top: 0;
}

.wst-night-list span {
  font-size: 21px;
}

.wst-night-list p {
  margin: 0;
  color: #b9cbe0;
  line-height: 1.65;
}

.wst-night-list b {
  color: #e8fff0;
}

.wsa-section {
  display: grid;
  gap: 16px;
}

.wsa-title {
  margin: 4px 0 0;
  padding-bottom: 13px;
  border-bottom: 3px solid rgba(65, 208, 113, .78);
  color: #f4fff9;
  font-size: clamp(21px, 1.9vw, 28px);
  font-weight: 900;
  letter-spacing: 0;
}

.wsa-flow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.wsa-flow span {
  border-radius: 10px;
  background: rgba(65, 208, 113, .16);
  color: #dff9ee;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 900;
}

.wsa-flow b {
  color: #41d071;
  font-size: 18px;
}

.wsa-check-grid,
.wsa-discharge-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.wsa-check-grid article,
.wsa-discharge-grid article,
.wsa-table-wrap {
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  padding: 20px;
}

.wsa-check-grid h4,
.wsa-discharge-grid h4 {
  margin: 0 0 16px;
  color: #e8fff0;
  font-size: 17px;
}

.wsa-check-grid p {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 12px;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  color: #d4e1ef;
  padding: 12px 0;
}

.wsa-check-grid p:first-of-type {
  border-top: 0;
}

.wsa-check-grid p span {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background: #22c55e;
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
}

.wsa-mid-grid p {
  display: block;
  grid-template-columns: none;
  gap: 0;
  margin: 0;
  border-top: 1px solid rgba(130, 161, 194, .14);
  color: #d4e1ef;
  padding: 12px 0;
  line-height: 1.7;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.wsa-danger,
.wsa-warning,
.wsa-tip,
.wsa-info {
  border-radius: 12px;
  padding: 16px 18px;
}

.wsa-danger {
  border-left: 4px solid #5ba7ff;
  background: rgba(91, 167, 255, .08);
}

.wsa-warning {
  border-left: 4px solid #38ddd1;
  background: rgba(56, 221, 209, .08);
}

.wsa-tip {
  border-left: 4px solid #41d071;
  background: rgba(65, 208, 113, .08);
}

.wsa-info {
  border-left: 4px solid #38ddd1;
  background: rgba(56, 221, 209, .08);
  margin-top: 14px;
}

.wsa-danger b,
.wsa-warning b,
.wsa-tip b,
.wsa-info b {
  color: #b8f3ec;
}

.wsa-danger p,
.wsa-warning p,
.wsa-tip p,
.wsa-info p {
  margin: 7px 0 0;
  color: #d9e5f2;
  line-height: 1.65;
}

.wsa-table-wrap {
  overflow-x: auto;
  padding: 0;
}

.wsa-table-wrap table {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
}

.wsa-table-wrap th,
.wsa-table-wrap td {
  border: 1px solid rgba(130, 161, 194, .2);
  color: #d9e5f2;
  padding: 13px 14px;
  text-align: left;
}

.wsa-table-wrap th {
  background: rgba(65, 208, 113, .2);
  color: #e8fff0;
  font-weight: 900;
}

.wsa-discharge-grid article p {
  margin: 0 0 10px;
  color: #d4e1ef;
  line-height: 1.65;
}

.wsa-discharge-grid article p.danger {
  color: #ff9a9a;
  font-weight: 900;
}

.wsa-doc-list {
  display: grid;
  gap: 0;
}

.wsa-doc-list article {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  border-top: 1px solid rgba(130, 161, 194, .15);
  padding: 13px 0;
}

.wsa-doc-list article:first-child {
  border-top: 0;
}

.wsa-doc-list span {
  font-size: 21px;
}

.wsa-doc-list p {
  margin: 0;
  color: #b9cbe0;
  line-height: 1.65;
}

.wsa-doc-list b {
  color: #e8fff0;
}

@media (max-width: 820px) {
  .wsh-share-grid,
  .wsh-two-grid {
    grid-template-columns: 1fr;
  }

  .wsg-part-grid,
  .wsg-coop-grid {
    grid-template-columns: 1fr;
  }

  .wsg-timeline article {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .wsh-flow-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .wsi-referral-grid,
  .wsi-example-grid,
  .wsi-special-grid,
  .wsi-drg-layout {
    grid-template-columns: 1fr;
  }

  .wsi-drg-chips {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wso-receipt-table p {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .wse-contact-grid,
  .wsc-trait-grid,
  .wsc-special-grid,
  .wsd-doc-grid,
  .wsd-claim-grid,
  .wst-er-grid,
  .wst-transfer-grid,
  .wst-icu-grid,
  .wsa-check-grid,
  .wsa-discharge-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .wonmu-streamlit-board .wsb-toolbar-head {
    grid-template-columns: 1fr;
  }

  .wonmu-streamlit-board .wsb-toolbar-stat {
    min-height: 70px;
    place-items: start;
    padding: 14px;
  }

  .wonmu-streamlit-board .wsb-menu button {
    flex: 1 1 220px;
  }
}

@media (max-width: 560px) {
  .wonmu-streamlit-board .wsb-menu {
    display: grid !important;
    grid-template-columns: 1fr;
  }

  .wonmu-streamlit-board .wsb-menu button {
    width: 100%;
  }
}

/* 2026-06-09 vaccination highlight cleanup */
.vax-page .vax-alert-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.vax-page .vax-alert-strip article,
.vax-page .vax-alert-strip article.major {
  display: block;
  min-height: 0;
  padding: 14px 16px;
  border: 1px solid rgba(127, 154, 184, .32);
  border-radius: 8px;
  background: rgba(7, 22, 38, .78);
  box-shadow: none;
}

.vax-page .vax-alert-title {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}

.vax-page .vax-alert-title b,
.vax-page .vax-alert-strip b {
  display: inline;
  width: auto;
  height: auto;
  min-width: 22px;
  border-radius: 0;
  background: transparent;
  color: #5be4dc;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 900;
}

.vax-page .vax-alert-title strong {
  min-width: 0;
  color: #f5f9ff;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 900;
  word-break: keep-all;
}

.vax-page .vax-alert-strip p {
  margin: 7px 0 0;
  padding-left: 30px;
  color: #c5d5e8;
  font-size: 13px;
  line-height: 1.7;
  word-break: keep-all;
}

@media (max-width: 900px) {
  .vax-page .vax-alert-strip {
    grid-template-columns: 1fr;
  }
}

/* 2026-06-09 vaccination detail readability fix */
.vax-page .vax-card-body {
  color: #e8f0fb;
}

.vax-page .vax-specs div {
  border-color: rgba(127, 154, 184, .34) !important;
  background: rgba(7, 20, 35, .86) !important;
  box-shadow: none !important;
}

.vax-page .vax-specs dt {
  color: #a9bfd8 !important;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.vax-page .vax-specs dd {
  color: #f7fbff !important;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.45;
}

.vax-page .vax-table-wrap {
  border-color: rgba(127, 154, 184, .34) !important;
  background: rgba(7, 20, 35, .86) !important;
}

.vax-page .vax-table {
  background: transparent !important;
}

.vax-page .vax-table th,
.vax-page .vax-table td {
  border-bottom-color: rgba(127, 154, 184, .24) !important;
  color: #d7e4f3 !important;
}

.vax-page .vax-table thead th {
  background: rgba(20, 184, 173, .16) !important;
  color: #f7fbff !important;
}

.vax-page .vax-table tbody th {
  color: #f7fbff !important;
}

.vax-page .vax-table tr:nth-child(even) th,
.vax-page .vax-table tr:nth-child(even) td {
  background: rgba(255, 255, 255, .035) !important;
}

.vax-page .vax-note-grid article {
  border-color: rgba(127, 154, 184, .32) !important;
  background: rgba(7, 20, 35, .82) !important;
}

.vax-page .vax-note-grid b {
  color: #f7fbff !important;
}

.vax-page .vax-note-grid p,
.vax-page .vax-muted {
  color: #c9d8ea !important;
}

/* 2026-06-09 qna dual board layout */
.qna-board-stack {
  display: grid;
  gap: 18px;
}

.qna-sub-board {
  display: grid;
  gap: 14px;
  border: 1px solid rgba(127, 154, 184, .28);
  border-radius: 8px;
  background: rgba(10, 25, 42, .78);
  padding: 16px;
}

.qna-sub-board .panel-head {
  padding: 0 0 12px;
  border-bottom: 1px solid rgba(127, 154, 184, .22);
}

.qna-sub-board .panel-head strong {
  color: #f7fbff;
  font-size: 18px;
}

.qna-sub-tools {
  display: grid;
  gap: 12px;
}

.public-qna-form {
  display: grid;
  grid-template-columns: minmax(140px, 220px) minmax(220px, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.public-qna-form label,
.public-qna-answer-form {
  display: grid;
  gap: 6px;
  color: #c9d8ea;
  font-weight: 800;
}

.public-qna-form textarea {
  min-height: 92px;
}

.public-qna-form label:nth-child(3) {
  grid-column: 1 / 3;
}

.public-qna-form input,
.public-qna-form textarea,
.public-qna-answer-form textarea {
  width: 100%;
  border: 1px solid rgba(127, 154, 184, .34);
  border-radius: 8px;
  background: rgba(5, 16, 28, .86);
  color: #f7fbff;
  padding: 11px 12px;
  font: inherit;
}

.public-qna-list {
  display: grid;
  gap: 12px;
  padding: 0;
}

.public-qna-item {
  display: grid;
  gap: 10px;
  border: 1px solid rgba(127, 154, 184, .28);
  border-radius: 8px;
  background: rgba(7, 20, 35, .76);
  padding: 15px;
}

.public-qna-item h3 {
  margin: 0;
  color: #f7fbff;
  font-size: 18px;
}

.public-qna-question,
.public-qna-answer p {
  margin: 0;
  color: #c9d8ea;
  line-height: 1.65;
}

.public-qna-question b,
.public-qna-answer b {
  display: inline-block;
  margin-right: 8px;
  color: #62e0da;
}

.public-qna-writer {
  color: #9fb3ca;
}

.public-qna-answer {
  border-radius: 8px;
  border: 1px solid rgba(127, 154, 184, .24);
  background: rgba(255, 255, 255, .035);
  padding: 12px;
}

.public-qna-answer.pending p {
  color: #f8c66a;
}

.public-qna-answer-form {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

@media (max-width: 900px) {
  .public-qna-form,
  .public-qna-answer-form {
    grid-template-columns: 1fr;
  }

  .public-qna-form label:nth-child(3) {
    grid-column: auto;
  }
}

.abx-board {
  display: grid;
  gap: 18px;
  color: #e5edf7;
}

.abx-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, .7fr);
  gap: 18px;
  align-items: stretch;
  border: 1px solid rgba(214, 181, 109, .3);
  border-radius: 8px;
  padding: 22px;
  background:
    radial-gradient(circle at 82% 16%, rgba(61, 214, 198, .16), transparent 28rem),
    linear-gradient(135deg, #14243c 0%, #07111f 100%);
  box-shadow: 0 22px 58px rgba(2, 8, 23, .36);
}

.abx-kicker,
.abx-section {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  color: #d6b56d;
  border: 1px solid rgba(214, 181, 109, .34);
  background: rgba(214, 181, 109, .08);
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

.abx-hero h1 {
  margin: 14px 0 10px;
  color: #fff;
  font-size: clamp(30px, 3.2vw, 46px);
  line-height: 1.12;
  letter-spacing: 0;
}

.abx-hero p,
.abx-card p,
.abx-hero-panel li {
  color: #aebbd0;
  line-height: 1.65;
}

.abx-hero-panel {
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 8px;
  background: rgba(7, 17, 31, .58);
  padding: 18px;
}

.abx-hero-panel strong {
  display: block;
  color: #fff;
  margin-bottom: 10px;
  font-size: 17px;
}

.abx-hero-panel ol {
  margin: 0;
  padding-left: 20px;
}

.abx-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.abx-metrics div,
.abx-card {
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 8px;
  background: #101c31;
  box-shadow: 0 14px 38px rgba(2, 8, 23, .25);
}

.abx-metrics div {
  padding: 16px;
}

.abx-metrics span {
  display: block;
  color: #95a4bc;
  font-size: 13px;
  font-weight: 800;
}

.abx-metrics strong {
  display: block;
  color: #fff;
  margin-top: 5px;
  font-size: 24px;
}

.abx-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px;
}

.abx-span-7 {
  grid-column: span 7;
}

.abx-span-5 {
  grid-column: span 5;
}

.abx-card {
  min-width: 0;
  padding: 18px;
}

.abx-card-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.abx-card h2 {
  color: #fff;
  margin: 10px 0 0;
  font-size: 21px;
  line-height: 1.28;
  letter-spacing: 0;
}

.abx-chip {
  display: inline-flex;
  white-space: nowrap;
  border-radius: 999px;
  border: 1px solid rgba(61, 214, 198, .32);
  color: #75efe1;
  background: rgba(61, 214, 198, .09);
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 900;
}

.abx-chip.gold {
  border-color: rgba(214, 181, 109, .38);
  color: #f1d796;
  background: rgba(214, 181, 109, .09);
}

.abx-rule-list {
  display: grid;
  gap: 10px;
}

.abx-rule {
  border: 1px solid rgba(148, 163, 184, .2);
  border-left-width: 4px;
  border-radius: 8px;
  background: rgba(7, 17, 31, .42);
  padding: 13px 14px;
}

.abx-rule b {
  color: #fff;
  font-size: 15px;
}

.abx-rule span {
  float: right;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 12px;
  font-weight: 900;
}

.abx-rule div span {
  float: none;
}

.abx-rule p {
  clear: both;
  margin: 8px 0 0;
  font-size: 14px;
}

.abx-rule.ok {
  border-left-color: #6ee7a8;
}

.abx-rule.ok span {
  color: #6ee7a8;
  background: rgba(34, 197, 94, .12);
}

.abx-rule.caution {
  border-left-color: #f6c36b;
}

.abx-rule.caution span {
  color: #f6c36b;
  background: rgba(246, 195, 107, .12);
}

.abx-rule.stop {
  border-left-color: #f97373;
}

.abx-rule.stop span {
  color: #f97373;
  background: rgba(249, 115, 115, .12);
}

.abx-checks {
  display: grid;
  gap: 10px;
  margin-top: 15px;
}

.abx-checks label {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
  color: #dce7f6;
  border: 1px solid rgba(148, 163, 184, .2);
  background: rgba(7, 17, 31, .36);
  border-radius: 8px;
  padding: 11px;
  line-height: 1.45;
}

.abx-checks input {
  margin-top: 2px;
  accent-color: #d6b56d;
}

.abx-search-row {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 12px;
  margin: 12px 0;
}

.abx-search-row label,
.abx-full-label {
  display: grid;
  gap: 7px;
  color: #dce7f6;
  font-size: 13px;
  font-weight: 900;
}

.abx-search-row input,
.abx-search-row select,
.abx-full-label select {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(148, 163, 184, .35);
  border-radius: 8px;
  background: #07111f;
  color: #fff;
  padding: 9px 11px;
  font: inherit;
}

.abx-caption {
  color: #9fb0c8;
  line-height: 1.6;
}

.abx-selected {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}

.abx-selected button {
  border: 1px solid rgba(214, 181, 109, .38);
  border-radius: 999px;
  background: rgba(214, 181, 109, .1);
  color: #f1d796;
  padding: 7px 11px;
  font-weight: 900;
  cursor: pointer;
}

.abx-selected span {
  color: #fff;
  margin-left: 4px;
}

.abx-product-select {
  display: grid;
  gap: 9px;
  max-height: 430px;
  overflow: auto;
  padding-right: 4px;
}

.abx-product-select label {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 8px;
  background: rgba(7, 17, 31, .42);
  padding: 11px;
  color: #dce7f6;
}

.abx-product-select input {
  margin-top: 3px;
  accent-color: #d6b56d;
}

.abx-product-select span {
  min-width: 0;
}

.abx-product-select small {
  grid-column: 2;
  color: #9fb0c8;
}

.abx-rule div {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: flex-start;
}

.abx-rule small {
  display: block;
  margin-top: 8px;
  color: #9fb0c8;
  line-height: 1.5;
}

.abx-ai-button {
  width: 100%;
  margin-top: 14px;
}

.abx-ai-notes {
  display: grid;
  gap: 9px;
  padding: 0;
  margin: 14px 0 0;
  list-style: none;
}

.abx-ai-notes li {
  border: 1px solid rgba(148, 163, 184, .22);
  border-left: 4px solid #d6b56d;
  border-radius: 8px;
  background: rgba(7, 17, 31, .36);
  color: #dce7f6;
  line-height: 1.55;
  padding: 11px 12px;
}

.abx-drug-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.abx-drug-card {
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 8px;
  background: rgba(7, 17, 31, .36);
  padding: 13px;
}

.abx-drug-card strong {
  display: block;
  color: #fff;
}

.abx-drug-card small {
  color: #f1d796;
}

.abx-drug-card p {
  margin: 7px 0 10px;
}

.abx-drug-card dl {
  display: grid;
  gap: 6px;
  margin: 0;
}

.abx-drug-card dt {
  color: #75efe1;
  font-weight: 900;
}

.abx-drug-card dd {
  color: #dce7f6;
  margin: -4px 0 4px;
  line-height: 1.45;
}

.abx-api-box {
  margin-top: 16px;
  border: 1px solid rgba(214, 181, 109, .28);
  border-radius: 8px;
  background: rgba(214, 181, 109, .08);
  padding: 14px;
}

.abx-api-box b {
  display: block;
  color: #fff;
  margin-bottom: 6px;
}

.abx-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 8px;
}

.abx-table {
  width: 100%;
  min-width: 1120px;
  border-collapse: collapse;
  color: #dce7f6;
}

.abx-table th {
  background: #07111f;
  color: #f1d796;
  text-align: left;
  padding: 12px;
  font-size: 13px;
  white-space: nowrap;
}

.abx-table td {
  border-top: 1px solid rgba(148, 163, 184, .18);
  padding: 12px;
  vertical-align: top;
  color: #d8e2f1;
  line-height: 1.5;
}

.abx-table tbody tr:nth-child(even) {
  background: rgba(7, 17, 31, .28);
}

.abx-flow-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

@media (max-width: 1100px) {
  .abx-hero,
  .abx-grid,
  .abx-flow-grid {
    grid-template-columns: 1fr;
  }

  .abx-span-7,
  .abx-span-5 {
    grid-column: span 1;
  }

  .abx-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .abx-drug-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .abx-hero,
  .abx-card {
    padding: 14px;
  }

  .abx-metrics {
    grid-template-columns: 1fr;
  }

  .abx-card-head {
    display: grid;
  }

  .abx-search-row {
    grid-template-columns: 1fr;
  }
}

/* 2026-06-12 admin roadmap cleanup */
.wonmu-streamlit-board .wsb-toolbar {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  gap: 10px !important;
}

.wonmu-streamlit-board .wsb-title-card,
.wonmu-streamlit-board .wsb-control-card {
  border: 1px solid rgba(130, 161, 194, .28);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(12, 28, 46, .96), rgba(7, 18, 32, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 18px 42px rgba(0, 0, 0, .22);
}

.wonmu-streamlit-board .wsb-title-card {
  padding: 20px 22px;
}

.wonmu-streamlit-board .wsb-control-card {
  display: grid;
  gap: 13px;
  padding: 16px 20px;
}

.wonmu-streamlit-board .wsb-toolbar-head,
.wonmu-streamlit-board .wsb-toolbar-stat,
.wonmu-streamlit-board .wsb-hero-card {
  display: none !important;
}

.wonmu-streamlit-board .wsb-kicker {
  color: #f0cf77 !important;
}

.wonmu-streamlit-board .wsb-title-card h2 {
  margin: 0;
  color: #f8fbff;
  font-size: clamp(24px, 2.2vw, 32px);
  line-height: 1.22;
}

.wonmu-streamlit-board .wsb-title-card p {
  margin: 8px 0 0;
  color: #b7c9dd;
}

.wonmu-streamlit-board .wsb-menu button:hover,
.wonmu-streamlit-board .wsb-menu button.active {
  border-color: rgba(64, 221, 204, .42) !important;
  background: linear-gradient(135deg, rgba(22, 112, 118, .86), rgba(14, 82, 98, .9)) !important;
  box-shadow: none !important;
}

.wonmu-streamlit-board .wsb-tip {
  border-color: rgba(130, 161, 194, .26) !important;
  background: rgba(255, 255, 255, .045) !important;
}

.wonmu-streamlit-roadmap .wsr-step-card,
.wonmu-streamlit-board .wsr-step-card {
  border-color: rgba(130, 161, 194, .26) !important;
  border-left-color: rgba(64, 221, 204, .46) !important;
  background: linear-gradient(145deg, rgba(11, 27, 45, .94), rgba(6, 18, 32, .97)) !important;
  box-shadow: none !important;
}

.wonmu-streamlit-roadmap .wsr-step-badge,
.wonmu-streamlit-board .wsr-step-badge {
  background: rgba(64, 221, 204, .12) !important;
  border: 1px solid rgba(64, 221, 204, .32);
  color: #69e6dc !important;
  box-shadow: none !important;
}

.wonmu-streamlit-roadmap .wsr-step-card h2,
.wonmu-streamlit-board .wsr-step-card h2 {
  color: #f7fbff !important;
}

.wonmu-streamlit-roadmap .wsr-step-card p,
.wonmu-streamlit-board .wsr-step-card p {
  color: #c5d6e8 !important;
}

/* 2026-06-12 herbal prescription board search/filter */
.herbal-prescription-page {
  gap: 20px;
}

.herbal-prescription-page .hpb-head {
  border: 1px solid rgba(127, 154, 184, .28);
  border-radius: 8px;
  background: rgba(12, 27, 44, .88);
  padding: 24px 26px;
}

.hpb-tools {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(127, 154, 184, .28);
  border-radius: 8px;
  background: rgba(12, 27, 44, .72);
  padding: 14px;
}

.hpb-search {
  max-width: none;
}

.hpb-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hpb-filter button {
  min-height: 44px;
  border: 1px solid rgba(127, 154, 184, .34);
  border-radius: 8px;
  background: rgba(5, 16, 28, .88);
  color: #f4f9ff;
  padding: 0 16px;
  font-weight: 900;
  cursor: pointer;
}

.hpb-filter button.active,
.hpb-filter button:hover {
  border-color: rgba(20, 184, 173, .66);
  background: linear-gradient(135deg, rgba(20, 184, 173, .92), rgba(13, 116, 118, .96));
  color: #ffffff;
}

.hpb-list {
  min-height: 52px;
}

.hpb-empty {
  border-style: dashed;
}

/* 2026-06-15 herbal guideline sheet layout */
.hpg-sheet {
  width: 100%;
  border: 1px solid rgba(72, 108, 148, .46);
  border-radius: 10px;
  background:
    linear-gradient(145deg, rgba(13, 31, 50, .96), rgba(6, 18, 31, .98)),
    #081827;
  overflow: hidden;
}

.hpg-section {
  border-bottom: 1px solid rgba(72, 108, 148, .32);
  background: transparent;
}

.hpg-section:last-child {
  border-bottom: 0;
}

.hpg-section-title {
  border-bottom: 1px solid rgba(72, 108, 148, .3);
  background: linear-gradient(135deg, rgba(18, 44, 70, .82), rgba(7, 22, 38, .9));
  color: #f8fbff;
  padding: 15px 22px;
  font-size: 19px;
  font-weight: 900;
  line-height: 1.3;
}

.hpg-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  background: transparent;
}

.hpg-table th,
.hpg-table td {
  border-bottom: 1px solid rgba(72, 108, 148, .38);
  color: #e7f2ff;
  vertical-align: middle;
  padding: 13px 14px;
  font-size: 16px;
  line-height: 1.45;
}

.hpg-table thead th {
  background: rgba(3, 13, 24, .96);
  color: #8fd7ff;
  font-size: 13px;
  font-weight: 900;
  text-align: left;
}

.hpg-table tbody tr:last-child td {
  border-bottom: 0;
}

.hpg-table tbody tr:hover td {
  background: rgba(15, 53, 74, .28);
}

.hpg-table th:nth-child(1),
.hpg-table td:nth-child(1) {
  width: 16%;
}

.hpg-table th:nth-child(2),
.hpg-table td:nth-child(2) {
  width: 43%;
}

.hpg-table td:nth-child(2) {
  color: #f8fbff;
  font-weight: 900;
}

.hpg-table th:nth-child(3),
.hpg-table td:nth-child(3) {
  width: 12%;
  color: #f8d58c;
  font-weight: 900;
  text-align: center;
}

.hpg-table th:nth-child(4),
.hpg-table td:nth-child(4) {
  width: 29%;
}

.hpg-code {
  display: inline-flex;
  min-width: 82px;
  justify-content: center;
  border: 1px solid rgba(20, 184, 173, .45);
  border-radius: 999px;
  background: rgba(5, 31, 45, .9);
  color: #67f5e8;
  padding: 5px 10px;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.1;
}

.hpg-notes {
  display: block;
  padding: 14px 18px 16px;
  background: rgba(3, 13, 24, .36);
}

.hpg-notes p {
  margin: 0 0 6px;
  color: #d7e7f9;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.55;
}

.hpg-notes p:last-child {
  margin-bottom: 0;
}

.hpg-notes em {
  color: #ff5d66;
  font-style: normal;
  font-weight: 900;
  text-decoration: underline;
}

/* 2026-06-12 herbal prescription workbook import */
.herbal-prescription-page .page-title h1 {
  font-size: clamp(30px, 3vw, 42px);
  letter-spacing: 0;
}

.herbal-prescription-page .page-title p {
  color: #b9cdea;
}

.hpb-list {
  display: grid;
  gap: 18px;
}

.hpb-record {
  border: 1px solid rgba(72, 108, 148, .46);
  border-radius: 10px;
  background:
    linear-gradient(145deg, rgba(13, 31, 50, .96), rgba(6, 18, 31, .98)),
    #081827;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  overflow: hidden;
}

.hpb-record[hidden] {
  display: none !important;
}

.hpb-record-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 24px;
  border-bottom: 1px solid rgba(72, 108, 148, .32);
  background: linear-gradient(135deg, rgba(18, 44, 70, .82), rgba(7, 22, 38, .9));
}

.hpb-scenario-card > summary.hpb-record-head {
  cursor: pointer;
  list-style: none;
}

.hpb-scenario-card > summary.hpb-record-head::-webkit-details-marker {
  display: none;
}

.hpb-scenario-card > summary.hpb-record-head::after {
  content: "열기";
  align-self: center;
  border: 1px solid rgba(20, 184, 173, .4);
  border-radius: 999px;
  background: rgba(4, 22, 35, .85);
  color: #5eead4;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.hpb-scenario-card[open] > summary.hpb-record-head::after {
  content: "접기";
  background: rgba(20, 184, 173, .18);
}

.hpb-scenario-card > summary.hpb-record-head:hover {
  background: linear-gradient(135deg, rgba(19, 57, 79, .94), rgba(8, 30, 48, .96));
}

.hpb-record-head.compact {
  padding: 18px 22px;
}

.hpb-record-head span {
  display: inline-flex;
  margin-bottom: 8px;
  color: #5eead4;
  font-size: 13px;
  font-weight: 900;
}

.hpb-record-head h2 {
  margin: 0;
  color: #f8fbff;
  font-size: 24px;
  line-height: 1.25;
  letter-spacing: 0;
}

.hpb-record-head p {
  margin: 8px 0 0;
  color: #b5c9e4;
  line-height: 1.7;
}

.hpb-record-head strong {
  min-width: 92px;
  border: 1px solid rgba(20, 184, 173, .36);
  border-radius: 10px;
  background: rgba(6, 43, 58, .72);
  color: #f8d58c;
  padding: 12px 14px;
  text-align: center;
  font-size: 32px;
  line-height: 1;
}

.hpb-record-head strong small {
  display: block;
  margin-top: 6px;
  color: #d8e8fb;
  font-size: 12px;
}

.hpb-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 16px 20px 0;
}

.hpb-summary-grid article {
  border: 1px solid rgba(72, 108, 148, .4);
  border-radius: 8px;
  background: rgba(7, 20, 34, .72);
  padding: 14px 16px;
}

.hpb-summary-grid b {
  display: block;
  color: #f8fbff;
  margin-bottom: 4px;
}

.hpb-summary-grid span {
  color: #adc2de;
  font-size: 14px;
}

.hpb-table-wrap {
  padding: 18px 20px 20px;
  overflow-x: auto;
}

.hpb-scenario-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 520px);
  gap: 12px;
  padding: 18px 20px 20px;
}

.hpb-scenario-body .hpb-table-wrap {
  padding: 0;
}

.hpb-fee-scenario {
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
}

.hpb-fee-sheet-wrap {
  overflow-x: auto;
  border: 1px solid rgba(72, 108, 148, .46);
  border-radius: 8px;
  background: rgba(7, 20, 34, .72);
}

.hpb-fee-sheet {
  width: 100%;
  min-width: 620px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

.hpb-fee-sheet th,
.hpb-fee-sheet td {
  border-bottom: 1px solid rgba(72, 108, 148, .38);
  color: #e7f2ff;
  padding: 12px 14px;
  line-height: 1.45;
  vertical-align: middle;
}

.hpb-fee-sheet th {
  background: rgba(3, 13, 24, .96);
  color: #8fd7ff;
  font-size: 13px;
  font-weight: 900;
  text-align: left;
}

.hpb-fee-sheet tbody tr:last-child td {
  border-bottom: 0;
}

.hpb-fee-sheet tbody tr:hover td {
  background: rgba(15, 53, 74, .28);
}

.hpb-fee-sheet td:nth-child(1),
.hpb-fee-sheet td:nth-child(3),
.hpb-fee-sheet td:nth-child(4),
.hpb-fee-sheet td:nth-child(5) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.hpb-fee-sheet td:nth-child(1) {
  text-align: left;
  font-weight: 900;
}

.hpb-fee-sheet td:nth-child(2) {
  color: #f8fbff;
  font-weight: 900;
  text-align: left;
}

.hpb-fee-sheet td:nth-child(3) {
  color: #f8d58c;
  font-weight: 900;
}

.hpb-fee-sheet th:nth-child(1) { width: 130px; }
.hpb-fee-sheet th:nth-child(2) { width: 210px; }
.hpb-fee-sheet th:nth-child(3) { width: 66px; }
.hpb-fee-sheet th:nth-child(4) { width: 98px; }
.hpb-fee-sheet th:nth-child(5) { width: 128px; }

.hpb-data-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 760px;
}

.hpb-data-table th,
.hpb-data-table td {
  border-bottom: 1px solid rgba(72, 108, 148, .28);
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}

.hpb-data-table th {
  background: rgba(3, 13, 24, .96);
  color: #8fd7ff;
  font-size: 13px;
  font-weight: 900;
}

.hpb-data-table th:first-child {
  border-top-left-radius: 8px;
}

.hpb-data-table th:last-child {
  border-top-right-radius: 8px;
}

.hpb-data-table td {
  color: #d9e8fb;
  line-height: 1.65;
}

.hpb-data-table td:nth-child(1) {
  width: 108px;
}

.hpb-data-table td:nth-child(3) {
  width: 72px;
  color: #f8d58c;
  font-weight: 900;
}

.hpb-data-table tr:hover td {
  background: rgba(15, 53, 74, .38);
}

.hpb-code {
  display: inline-flex;
  min-width: 82px;
  justify-content: center;
  border: 1px solid rgba(20, 184, 173, .35);
  border-radius: 999px;
  background: rgba(5, 31, 45, .9);
  color: #67f5e8;
  padding: 4px 9px;
  font-size: 13px;
  font-weight: 900;
}

.hpb-muted {
  color: #738aa8;
}

.hpb-ai-panel {
  border: 1px solid rgba(72, 108, 148, .4);
  border-radius: 8px;
  background: linear-gradient(160deg, rgba(6, 20, 34, .96), rgba(9, 30, 47, .88));
  min-height: 260px;
  padding: 15px;
}

.hpb-ai-panel.active {
  border-color: rgba(20, 184, 173, .48);
  box-shadow: inset 0 1px 0 rgba(94, 234, 212, .12);
}

.hpb-ai-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.hpb-ai-panel header span {
  color: #f8fbff;
  font-size: 18px;
  font-weight: 900;
}

.hpb-ai-panel button {
  border: 1px solid rgba(20, 184, 173, .46);
  border-radius: 8px;
  background: rgba(15, 136, 128, .86);
  color: #ffffff;
  padding: 8px 11px;
  font-weight: 900;
  cursor: pointer;
  white-space: nowrap;
}

.hpb-ai-panel button:hover {
  background: rgba(20, 184, 173, .95);
}

.hpb-ai-placeholder {
  border: 1px dashed rgba(72, 108, 148, .36);
  border-radius: 8px;
  color: #a9bed8;
  line-height: 1.7;
  padding: 14px;
}

.hpb-ai-result {
  display: grid;
  gap: 9px;
}

.hpb-ai-result[hidden] {
  display: none !important;
}

.hpb-ai-result p {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 9px;
  margin: 0;
  border: 1px solid rgba(72, 108, 148, .28);
  border-radius: 8px;
  background: rgba(3, 13, 24, .72);
  padding: 10px 11px;
}

.hpb-ai-result b {
  color: #5eead4;
  font-size: 12px;
}

.hpb-ai-result span {
  color: #d6e6f8;
  font-size: 14px;
  line-height: 1.6;
}

.hpb-note-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0 20px 22px;
}

.hpb-note-list p {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 10px;
  margin: 0;
  border: 1px solid rgba(72, 108, 148, .34);
  border-radius: 8px;
  background: rgba(5, 18, 31, .8);
  padding: 13px 14px;
}

.hpb-note-list b {
  color: #5eead4;
  font-size: 13px;
}

.hpb-note-list span {
  color: #c7d9ee;
  line-height: 1.65;
}

.hpb-empty-panel {
  padding: 34px 24px;
  text-align: center;
  border-style: dashed;
}

.hpb-empty-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  margin: 0 auto 14px;
  border-radius: 10px;
  background: rgba(20, 184, 173, .12);
  color: #5eead4;
}

.hpb-empty-panel h2 {
  margin: 0 0 8px;
  color: #f8fbff;
}

.hpb-empty-panel p {
  max-width: 620px;
  margin: 0 auto;
  color: #b5c9e4;
  line-height: 1.7;
}

.hpb-manual-posts {
  display: grid;
  gap: 12px;
  border: 1px dashed rgba(72, 108, 148, .44);
  border-radius: 10px;
  padding: 16px;
}

.hpb-manual-posts[hidden] {
  display: none !important;
}

.hpb-manual-posts > h2 {
  margin: 0;
  color: #f8fbff;
  font-size: 18px;
}

@media (max-width: 900px) {
  .hpb-record-head {
    flex-direction: column;
  }

  .hpb-scenario-card > summary.hpb-record-head::after {
    align-self: flex-start;
  }

  .hpb-record-head strong {
    min-width: 0;
  }

  .hpb-summary-grid,
  .hpb-note-list {
    grid-template-columns: 1fr;
  }

  .hpb-scenario-body {
    grid-template-columns: 1fr;
  }

  .hpb-fee-scenario {
    grid-template-columns: 1fr;
  }
}

/* 2026-06-14: hospital HR guide tone and admin contrast fixes */
.hospital-hr-guide {
  --hr-bg: #071422;
  --hr-panel: #0a1c30;
  --hr-panel-soft: #0d263a;
  --hr-line: rgba(130, 161, 194, .24);
  --hr-text: #f4fff9;
  --hr-muted: #c8d8e8;
  --hr-teal: #38ddd1;
  --hr-soft-teal: #8fe8df;
  --hr-blue: #9fc9ff;
  color: var(--hr-text);
}

.hospital-hr-guide .hospital-hr-hero,
.hospital-hr-guide .hospital-hr-section,
.hospital-hr-guide .hospital-hr-card,
.hospital-hr-guide .hospital-hr-penalty-block,
.hospital-hr-guide .hospital-hr-search,
.hospital-hr-guide .hospital-hr-empty,
.hospital-hr-guide .hospital-hr-source-grid a,
.hospital-hr-guide .hospital-hr-feature-grid article,
.hospital-hr-guide .hospital-hr-faq details,
.hospital-hr-guide .hospital-hr-schedule-card,
.hospital-hr-guide .hospital-hr-kpis article {
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  border: 1px solid var(--hr-line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .2);
  color: var(--hr-text);
}

.hospital-hr-guide .hospital-hr-hero {
  background:
    radial-gradient(circle at 100% 0%, rgba(56, 221, 209, .14), transparent 34%),
    linear-gradient(145deg, rgba(14, 31, 51, .96), rgba(8, 20, 35, .98));
  border-radius: 8px;
}

.hospital-hr-guide .hospital-hr-hero span,
.hospital-hr-guide .hospital-hr-kpis span,
.hospital-hr-guide .hospital-hr-source-grid span,
.hospital-hr-guide .hospital-hr-jump button span,
.hospital-hr-guide .hospital-hr-card td,
.hospital-hr-guide .hospital-hr-section p,
.hospital-hr-guide .hospital-hr-section li,
.hospital-hr-guide .hospital-hr-section small {
  color: var(--hr-muted);
}

.hospital-hr-guide .hospital-hr-hero h1,
.hospital-hr-guide .hospital-hr-section h2,
.hospital-hr-guide .hospital-hr-section h3,
.hospital-hr-guide .hospital-hr-kpis b,
.hospital-hr-guide .hospital-hr-jump button b {
  color: var(--hr-text);
}

.hospital-hr-guide .hospital-hr-hero b,
.hospital-hr-guide .hospital-hr-kpis article:nth-child(2) b,
.hospital-hr-guide .hospital-hr-kpis article:nth-child(4) b {
  color: var(--hr-teal);
}

.hospital-hr-guide .hospital-hr-kpis article:first-child b,
.hospital-hr-guide .hospital-hr-kpis article:nth-child(3) b {
  color: var(--hr-soft-teal);
}

.hospital-hr-search {
  display: flex;
  align-items: center;
  gap: 14px;
  justify-content: space-between;
  margin: 18px 0 14px;
  padding: 14px;
  border-radius: 8px;
}

.hospital-hr-search label {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 220px;
  padding: 0 12px;
  border: 1px solid rgba(130, 161, 194, .24);
  border-radius: 8px;
  background: rgba(7, 20, 34, .86);
  color: #dff9ee;
}

.hospital-hr-search input {
  width: 100%;
  min-height: 42px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #f8fbff;
  font: inherit;
}

.hospital-hr-search input::placeholder {
  color: #91a9be;
}

.hospital-hr-search div {
  display: flex;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
  color: var(--hr-muted);
}

.hospital-hr-search div b {
  color: var(--hr-teal);
  font-size: 22px;
}

.hospital-hr-jump {
  gap: 10px;
}

.hospital-hr-jump button {
  background-color: rgba(8, 20, 35, .74) !important;
  background-image: none !important;
  border: 1px solid rgba(130, 161, 194, .24);
  color: var(--hr-text);
}

.hospital-hr-jump button.active,
.hospital-hr-jump button:hover {
  background-color: rgba(24, 90, 104, .52) !important;
  background-image: linear-gradient(145deg, rgba(24, 90, 104, .52), rgba(8, 20, 35, .96)) !important;
  border-color: rgba(56, 221, 209, .44);
  color: #ffffff;
}

.hospital-hr-jump button {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 4px 9px !important;
  align-items: center;
}

.hospital-hr-jump button b,
.hospital-hr-jump button span {
  min-width: 0;
  grid-column: 2;
}

.hospital-hr-tab-icon {
  position: relative;
  display: inline-block;
  grid-row: 1 / span 2;
  width: 18px;
  height: 18px;
  color: currentColor;
  opacity: .92;
}

.hospital-hr-tab-icon::before,
.hospital-hr-tab-icon::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
}

.hospital-hr-tab-icon.home::before {
  inset: 7px 3px 2px;
  border: 2px solid currentColor;
  border-top: 0;
  border-radius: 2px;
}

.hospital-hr-tab-icon.home::after {
  left: 3px;
  top: 2px;
  width: 12px;
  height: 12px;
  border-left: 2px solid currentColor;
  border-top: 2px solid currentColor;
  transform: rotate(45deg);
  border-radius: 2px 0 0;
}

.hospital-hr-tab-icon.person::before {
  left: 6px;
  top: 2px;
  width: 7px;
  height: 7px;
  border: 2px solid currentColor;
  border-radius: 999px;
}

.hospital-hr-tab-icon.person::after {
  left: 3px;
  bottom: 2px;
  width: 12px;
  height: 7px;
  border: 2px solid currentColor;
  border-radius: 9px 9px 3px 3px;
}

.hospital-hr-tab-icon.education::before {
  left: 2px;
  top: 4px;
  width: 14px;
  height: 9px;
  border: 2px solid currentColor;
  border-radius: 2px;
  transform: skewY(-8deg);
}

.hospital-hr-tab-icon.education::after {
  left: 4px;
  top: 2px;
  width: 10px;
  height: 2px;
  background: currentColor;
  box-shadow: 0 12px 0 currentColor;
  border-radius: 999px;
}

.hospital-hr-tab-icon.badge::before {
  left: 4px;
  top: 2px;
  width: 10px;
  height: 10px;
  border: 2px solid currentColor;
  border-radius: 999px;
}

.hospital-hr-tab-icon.badge::after {
  left: 6px;
  bottom: 1px;
  width: 6px;
  height: 7px;
  border-left: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: skewX(-12deg);
}

.hospital-hr-tab-icon.calendar::before {
  inset: 3px 2px 2px;
  border: 2px solid currentColor;
  border-radius: 3px;
}

.hospital-hr-tab-icon.calendar::after {
  left: 5px;
  top: 1px;
  width: 8px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  box-shadow: 0 7px 0 -1px currentColor;
}

.hospital-hr-tab-icon.risk::before {
  left: 2px;
  top: 2px;
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  transform: rotate(45deg);
  border-radius: 3px;
}

.hospital-hr-tab-icon.risk::after {
  left: 8px;
  top: 5px;
  width: 2px;
  height: 8px;
  background: currentColor;
  border-radius: 999px;
  box-shadow: 0 10px 0 -1px currentColor;
}

.hospital-hr-tab-icon.qa::before {
  left: 3px;
  top: 2px;
  width: 12px;
  height: 12px;
  border: 2px solid currentColor;
  border-radius: 999px;
}

.hospital-hr-tab-icon.qa::after {
  left: 8px;
  top: 6px;
  width: 3px;
  height: 7px;
  border-top: 2px solid currentColor;
  border-left: 2px solid currentColor;
  border-radius: 4px 0 0;
  box-shadow: 0 8px 0 -1px currentColor;
}

.hospital-hr-tab-icon.law::before {
  left: 3px;
  top: 3px;
  width: 12px;
  height: 11px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.hospital-hr-tab-icon.law::after {
  left: 6px;
  top: 7px;
  width: 7px;
  height: 2px;
  background: currentColor;
  box-shadow: 0 4px 0 currentColor;
  border-radius: 999px;
}

.hospital-hr-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 140px;
  margin: 14px 0;
  border-radius: 8px;
  text-align: center;
}

.hospital-hr-empty[hidden],
.hospital-hr-jump button[hidden],
.hospital-hr-section[hidden] {
  display: none !important;
}

.hospital-hr-guide table {
  color: var(--hr-text);
}

.hospital-hr-guide th {
  background: rgba(65, 208, 113, .2);
  color: #e8fff0;
}

.hospital-hr-guide td {
  border-color: rgba(68, 110, 146, .35);
}

.hospital-hr-guide .hospital-hr-kpis article,
.hospital-hr-guide .hospital-hr-card,
.hospital-hr-guide .hospital-hr-feature-grid article,
.hospital-hr-guide .hospital-hr-risk-grid article,
.hospital-hr-guide .hospital-hr-faq details,
.hospital-hr-guide .hospital-hr-month-card {
  border-left-color: var(--hr-teal);
}

.hospital-hr-guide .hospital-hr-timeline article {
  background: linear-gradient(145deg, rgba(14, 31, 51, .92), rgba(8, 20, 35, .96));
  border-color: var(--hr-line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055), 0 16px 34px rgba(0, 0, 0, .18);
}

.hospital-hr-guide .hospital-hr-timeline b {
  background: rgba(56, 221, 209, .13);
  color: #c4fff6;
}

.hospital-hr-guide .hospital-hr-month-card.current {
  background: linear-gradient(145deg, rgba(24, 90, 104, .4), rgba(8, 20, 35, .96));
  border-color: rgba(56, 221, 209, .34);
  border-left-color: var(--hr-teal);
}

.hospital-hr-guide .hospital-hr-month-card h3 span {
  border-color: rgba(95, 210, 196, .34);
  background: rgba(22, 99, 112, .28);
  color: #b8f3ec;
}

.hospital-hr-guide .hospital-hr-risk-grid article.high {
  border-left-color: #5ba7ff;
}

.hospital-hr-guide .hospital-hr-risk-grid article b {
  color: var(--hr-soft-teal);
}

.hospital-hr-guide .hospital-hr-alert-note,
.hospital-hr-guide .hospital-hr-tip-note,
.hospital-hr-guide .hospital-hr-disclaimer {
  border-left: 4px solid var(--hr-teal);
  border-radius: 12px;
  border-color: rgba(56, 221, 209, .24);
  background: rgba(56, 221, 209, .08);
  color: #d9e5f2;
}

.hospital-hr-guide .hospital-hr-alert-note b,
.hospital-hr-guide .hospital-hr-tip-note b {
  color: #b8f3ec;
}

.hospital-hr-guide .hospital-hr-penalty-table td:nth-child(3) b {
  color: var(--hr-blue);
}

.hospital-hr-guide .hospital-hr-source-grid a:hover {
  border-color: rgba(56, 221, 209, .44);
  background: rgba(24, 90, 104, .22);
}

.login-form {
  display: grid;
  gap: 12px;
  margin: 18px 0 14px;
}

.login-form label {
  display: grid;
  gap: 7px;
  color: #dbeafe;
  font-weight: 850;
}

.login-form input,
.login-panel > label input {
  width: 100%;
  min-height: 44px;
  border: 1px solid rgba(139, 164, 191, .3);
  border-radius: 8px;
  background: rgba(7, 17, 29, .86);
  color: #f8fbff;
  padding: 0 12px;
  font: inherit;
}

.login-form input::placeholder,
.login-panel > label input::placeholder {
  color: #8fa5bc;
}

.login-form .primary-button {
  width: 100%;
  min-height: 46px;
}

.login-panel .demo-account {
  display: grid;
  gap: 5px;
  margin-top: 14px;
  border: 1px solid rgba(56, 221, 209, .22);
  border-radius: 8px;
  background: rgba(56, 221, 209, .07);
  color: #b9cce3;
  padding: 12px 13px;
  font-size: 12px;
  line-height: 1.45;
}

.login-panel .demo-account b {
  color: #b8f3ec;
}

/* 2026-06-15: compact monochrome icons for external-care section tabs. */
.ecg-section-tabs button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.ecg-section-tabs button > span:last-child {
  min-width: 0;
}

.ecg-tab-icon {
  position: relative;
  display: inline-block;
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  color: currentColor;
  opacity: .9;
}

.ecg-tab-icon::before,
.ecg-tab-icon::after {
  content: "";
  position: absolute;
  box-sizing: border-box;
}

.ecg-tab-icon.home::before {
  inset: 6px 3px 2px;
  border: 2px solid currentColor;
  border-top: 0;
  border-radius: 2px;
}

.ecg-tab-icon.home::after {
  left: 3px;
  top: 1px;
  width: 11px;
  height: 11px;
  border-left: 2px solid currentColor;
  border-top: 2px solid currentColor;
  transform: rotate(45deg);
  border-radius: 2px 0 0;
}

.ecg-tab-icon.money::before {
  inset: 2px 3px;
  border: 2px solid currentColor;
  border-radius: 999px;
}

.ecg-tab-icon.money::after {
  left: 7px;
  top: 4px;
  width: 3px;
  height: 9px;
  border-left: 2px solid currentColor;
  box-shadow: -3px 2px 0 -1px currentColor, 3px -2px 0 -1px currentColor;
}

.ecg-tab-icon.pill::before {
  left: 3px;
  top: 4px;
  width: 12px;
  height: 9px;
  border: 2px solid currentColor;
  border-radius: 999px;
  transform: rotate(-32deg);
}

.ecg-tab-icon.pill::after {
  left: 8px;
  top: 3px;
  width: 2px;
  height: 11px;
  background: currentColor;
  transform: rotate(-32deg);
  border-radius: 999px;
}

.ecg-tab-icon.block::before {
  inset: 2px;
  border: 2px solid currentColor;
  border-radius: 999px;
}

.ecg-tab-icon.block::after {
  left: 3px;
  top: 7px;
  width: 11px;
  height: 2px;
  background: currentColor;
  transform: rotate(-38deg);
  border-radius: 999px;
}

.ecg-tab-icon.claim::before,
.ecg-tab-icon.doc::before {
  inset: 2px 4px 2px 3px;
  border: 2px solid currentColor;
  border-radius: 2px;
}

.ecg-tab-icon.claim::after {
  left: 6px;
  top: 6px;
  width: 7px;
  height: 2px;
  background: currentColor;
  box-shadow: 0 4px 0 currentColor;
  border-radius: 999px;
}

.ecg-tab-icon.review::before {
  left: 2px;
  top: 2px;
  width: 10px;
  height: 10px;
  border: 2px solid currentColor;
  border-radius: 999px;
}

.ecg-tab-icon.review::after {
  left: 11px;
  top: 11px;
  width: 6px;
  height: 2px;
  background: currentColor;
  transform: rotate(45deg);
  border-radius: 999px;
}

.ecg-tab-icon.doc::after {
  right: 4px;
  top: 2px;
  width: 5px;
  height: 5px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  background: rgba(8, 20, 35, .96);
}

.ecg-tab-icon.qa::before {
  inset: 1px 5px 7px;
  background: currentColor;
  clip-path: polygon(48% 0, 100% 0, 62% 48%, 100% 48%, 30% 100%, 47% 57%, 0 57%);
}

.ecg-tab-icon.qa::after {
  left: 7px;
  bottom: 2px;
  width: 3px;
  height: 3px;
  background: currentColor;
  border-radius: 999px;
}

.ecg-tab-icon.check::before {
  left: 2px;
  top: 3px;
  width: 13px;
  height: 13px;
  border: 2px solid currentColor;
  border-radius: 4px;
}

.ecg-tab-icon.check::after {
  left: 5px;
  top: 7px;
  width: 8px;
  height: 5px;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
}

.admin-console .admin-kpis article,
.admin-console .admin-ops-grid article,
.admin-console .admin-command-card,
.admin-console .admin-role-grid article,
.admin-console .admin-policy-grid label,
.admin-console .admin-api-card,
.admin-console .admin-audit-list article,
.admin-console .admin-api-note,
.admin-console .admin-section,
.admin-console .admin-panel,
.admin-console .admin-card {
  background: linear-gradient(180deg, rgba(14, 33, 52, .98), rgba(9, 23, 38, .98)) !important;
  border-color: rgba(77, 122, 160, .48) !important;
  color: #eaf6ff !important;
}

.admin-console h2,
.admin-console h3,
.admin-console h4,
.admin-console b,
.admin-console strong,
.admin-console label {
  color: #f8fbff !important;
}

.admin-console p,
.admin-console span,
.admin-console small,
.admin-console li,
.admin-console time,
.admin-console td,
.admin-console th {
  color: #b9cce3 !important;
}

.admin-console input,
.admin-console select,
.admin-console textarea {
  background: #071726 !important;
  border-color: rgba(86, 136, 174, .56) !important;
  color: #f8fbff !important;
}

.admin-console input::placeholder,
.admin-console textarea::placeholder {
  color: #7f9bb8 !important;
}

.admin-console .admin-api-status,
.admin-console .status-pill,
.admin-console .badge,
.admin-console .role-badge {
  color: #002f34 !important;
}

.admin-api-card.simple .admin-api-fields {
  grid-template-columns: minmax(140px, .38fr) minmax(0, 1fr);
}

.admin-api-card.simple .admin-api-fields .wide {
  grid-column: 1 / -1;
}

@media(max-width:720px) {
  .admin-api-card.simple .admin-api-fields {
    grid-template-columns: 1fr;
  }
}

/* 2026-06-15: hard override for the opened nursing-grade Excel upload panel. */
.ng-app details.ng-upload,
.ng-app details.ng-upload[open],
.ng-app details.ng-upload > summary,
.ng-app details.ng-upload[open] > summary,
.ng-app .ng-upload-inside,
.ng-app .ng-file-label {
  border-color: rgba(139, 164, 191, .24) !important;
  background: linear-gradient(145deg, rgba(16, 34, 54, .96), rgba(8, 20, 35, .98)) !important;
  color: #edf5ff !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18) !important;
}

.ng-app details.ng-upload > summary,
.ng-app details.ng-upload[open] > summary {
  min-height: 54px;
  border-bottom: 1px solid rgba(139, 164, 191, .24) !important;
  border-radius: 8px 8px 0 0;
}

.ng-app details.ng-upload > summary::marker {
  color: #62e0da;
}

.ng-app .ng-upload-inside {
  border-top: 0 !important;
  border-radius: 0 0 8px 8px;
  padding-top: 16px;
}

.ng-app .ng-file-label input[type="file"] {
  border-color: rgba(139, 164, 191, .28) !important;
  background: rgba(7, 17, 29, .9) !important;
  color: #d7e2f0 !important;
}

.ng-app .ng-file-label input[type="file"]::file-selector-button {
  border: 1px solid rgba(45, 221, 206, .42) !important;
  background: rgba(20, 184, 173, .16) !important;
  color: #62e0da !important;
}

.ng-app .ng-file-label input[type="file"]::-webkit-file-upload-button {
  border: 1px solid rgba(45, 221, 206, .42) !important;
  background: rgba(20, 184, 173, .16) !important;
  color: #62e0da !important;
}

@media (max-width: 760px) {
  .hospital-hr-search {
    align-items: stretch;
    flex-direction: column;
  }
}

/* 2026-06-15: final priority pass for 양방 처방 코드 가이드 */
.prescription-guide-page {
  gap: 18px;
  color: #edf6ff !important;
}

.prescription-guide-page .pg-head,
.prescription-guide-page .pg-card {
  border-color: rgba(127, 154, 184, .28) !important;
  background:
    radial-gradient(circle at top right, rgba(20, 184, 173, .18), transparent 34%),
    linear-gradient(145deg, rgba(13, 31, 50, .96), rgba(6, 18, 31, .98)) !important;
}

.prescription-guide-page .page-title h1,
.prescription-guide-page .pg-card-head h2,
.prescription-guide-page .pg-info-card h3,
.prescription-guide-page .pg-panel-title h3 {
  color: #f8fbff !important;
  letter-spacing: 0;
}

.prescription-guide-page .page-title p,
.prescription-guide-page .pg-card-head p,
.prescription-guide-page .pg-info-card p,
.prescription-guide-page .pg-info-card li {
  color: #d7e7f9 !important;
}

.prescription-guide-page .pg-kicker,
.prescription-guide-page .pg-category,
.prescription-guide-page .pg-api-card span,
.prescription-guide-page .pg-panel-title span,
.prescription-guide-page .pg-result-line b,
.prescription-guide-page .pg-code,
.prescription-guide-page .pg-code-chip {
  color: #5eead4 !important;
}

.prescription-guide-page .pg-filter button.active,
.prescription-guide-page .pg-filter button:hover {
  border-color: rgba(20, 184, 173, .66) !important;
  background: linear-gradient(135deg, rgba(20, 184, 173, .92), rgba(13, 116, 118, .96)) !important;
  color: #ffffff !important;
}

/* 2026-06-17: HR readability fix without changing report form */
.hr-app .hr-donut::after,
.hr-app .hr-report-donut::after {
  background: #ffffff !important;
}

.hr-app .hr-donut b,
.hr-app .hr-report-donut b {
  color: #08263b !important;
  text-shadow: none !important;
}

.hr-app .hr-donut span,
.hr-app .hr-report-donut small {
  color: #18364d !important;
  text-shadow: none !important;
}

.hr-app .hr-report-alerts p {
  background: #fff7ed !important;
  color: #7c4a03 !important;
  border: 1px solid #f5d6a7 !important;
  border-left: 4px solid #f59e0b !important;
  text-shadow: none !important;
}

.hr-app .hr-report-alerts p.info {
  background: #eaf8f5 !important;
  color: #075e58 !important;
  border-color: #b9e5de !important;
  border-left-color: #0f766e !important;
}

.hr-app .hr-report-alerts p.success {
  background: #ecfdf5 !important;
  color: #166534 !important;
  border-color: #bbf7d0 !important;
  border-left-color: #22c55e !important;
}

/* 2026-06-17: HR report layout restore and scoped chart fixes */
.hr-app .hr-executive-report {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border: 1px solid #d9e5e8 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #172638 !important;
  padding: 24px !important;
  font-family: Arial, "Malgun Gothic", sans-serif !important;
  font-size: 12px !important;
  line-height: 1.58 !important;
  box-shadow: 0 18px 48px rgba(8, 67, 71, .08) !important;
}

.hr-app .hr-executive-report .hr-report-cover {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  gap: 24px !important;
  border-radius: 8px !important;
  background: linear-gradient(118deg, #10263a 0%, #0f766e 68%, #f59e0b 160%) !important;
  color: #ffffff !important;
  padding: 26px 28px !important;
}

.hr-app .hr-executive-report .hr-report-cover span {
  color: #bfeee8 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

.hr-app .hr-executive-report .hr-report-cover h2 {
  margin: 9px 0 6px !important;
  color: #ffffff !important;
  font-size: 27px !important;
  line-height: 1.25 !important;
}

.hr-app .hr-executive-report .hr-report-cover p {
  margin: 0 !important;
  color: #d8f8f4 !important;
}

.hr-app .hr-executive-report .hr-report-cover aside {
  min-width: 92px !important;
  text-align: right !important;
}

.hr-app .hr-executive-report .hr-report-cover aside b {
  display: block !important;
  color: #ffffff !important;
  font-size: 54px !important;
  line-height: .9 !important;
}

.hr-app .hr-executive-report .hr-report-cover aside small {
  color: #f6e7b2 !important;
  font-weight: 900 !important;
}

.hr-app .hr-executive-report .hr-report-summary {
  display: grid !important;
  grid-template-columns: 118px 1fr !important;
  gap: 14px !important;
  align-items: center !important;
  border: 1px solid #d9e5e8 !important;
  border-radius: 8px !important;
  background: #f8fbfb !important;
  padding: 14px 16px !important;
  margin: 16px 0 !important;
}

.hr-app .hr-executive-report .hr-report-summary strong {
  color: #10263a !important;
  font-size: 15px !important;
}

.hr-app .hr-executive-report .hr-report-summary p {
  margin: 0 !important;
  color: #475467 !important;
}

.hr-app .hr-executive-report .hr-report-kpis {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 0 16px !important;
}

.hr-app .hr-executive-report .hr-report-kpis article {
  border: 1px solid #d9e5e8 !important;
  border-top: 3px solid #0f766e !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #172638 !important;
  padding: 12px !important;
}

.hr-app .hr-executive-report .hr-report-kpis small,
.hr-app .hr-executive-report .hr-report-kpis span {
  display: block !important;
  color: #667085 !important;
  font-size: 11px !important;
}

.hr-app .hr-executive-report .hr-report-kpis b {
  display: block !important;
  color: #10263a !important;
  font-size: 19px !important;
  margin: 4px 0 !important;
}

.hr-app .hr-executive-report .hr-report-grid {
  display: grid !important;
  grid-template-columns: minmax(360px, .95fr) minmax(520px, 1.35fr) !important;
  gap: 12px !important;
  margin: 14px 0 20px !important;
}

.hr-app .hr-executive-report .hr-report-card {
  border: 1px solid #d9e5e8 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #172638 !important;
  padding: 15px !important;
  box-shadow: none !important;
}

.hr-app .hr-executive-report .hr-report-card.wide {
  min-width: 0 !important;
}

.hr-app .hr-executive-report .hr-report-card header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin: 0 0 12px !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 !important;
}

.hr-app .hr-executive-report .hr-report-card header h3,
.hr-app .hr-executive-report > h3 {
  margin: 0 0 10px !important;
  border: 0 !important;
  background: transparent !important;
  color: #10263a !important;
  padding: 0 !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  text-align: left !important;
  text-shadow: none !important;
}

.hr-app .hr-executive-report > h3 {
  margin-top: 20px !important;
  border-left: 4px solid #0f766e !important;
  background: #eef8f6 !important;
  padding: 9px 12px !important;
  font-size: 16px !important;
}

.hr-app .hr-executive-report .hr-report-card header span {
  color: #667085 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

.hr-app .hr-executive-report .hr-report-donut {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 150px !important;
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  margin: 4px auto 12px !important;
  box-shadow: none !important;
}

.hr-app .hr-executive-report .hr-report-donut::after {
  content: "" !important;
  position: absolute !important;
  width: 84px !important;
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.hr-app .hr-executive-report .hr-report-donut b,
.hr-app .hr-executive-report .hr-report-donut small {
  position: relative !important;
  z-index: 1 !important;
  text-shadow: none !important;
}

.hr-app .hr-executive-report .hr-report-donut b {
  color: #10263a !important;
  font-size: 22px !important;
}

.hr-app .hr-executive-report .hr-report-donut small {
  margin-top: 40px !important;
  color: #667085 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

.hr-app .hr-executive-report .hr-report-legend {
  display: grid !important;
  gap: 7px !important;
}

.hr-app .hr-executive-report .hr-report-legend.row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 9px !important;
}

.hr-app .hr-executive-report .hr-report-legend p {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin: 0 !important;
  color: #475467 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.hr-app .hr-executive-report .hr-report-legend i {
  width: 10px !important;
  height: 10px !important;
  border-radius: 2px !important;
}

.hr-app .hr-executive-report .hr-report-legend b {
  margin-left: auto !important;
  color: #10263a !important;
}

.hr-app .hr-executive-report .hr-report-weekly {
  display: grid !important;
  gap: 12px !important;
  min-height: 172px !important;
}

.hr-app .hr-executive-report .hr-report-weekly div {
  display: grid !important;
  grid-template-columns: 58px 52px minmax(120px, 1fr) 48px !important;
  align-items: center !important;
  gap: 8px !important;
}

.hr-app .hr-executive-report .hr-report-weekly b {
  color: #10263a !important;
  font-size: 12px !important;
}

.hr-app .hr-executive-report .hr-report-weekly small,
.hr-app .hr-executive-report .hr-report-weekly em {
  color: #667085 !important;
  font-size: 10px !important;
}

.hr-app .hr-executive-report .hr-report-weekly .track {
  display: block !important;
  height: 10px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: #edf2f4 !important;
}

.hr-app .hr-executive-report .hr-report-weekly .track i {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
}

.hr-app .hr-executive-report .hr-report-dept,
.hr-app .hr-executive-report .hr-report-risk {
  display: grid !important;
  gap: 8px !important;
}

.hr-app .hr-executive-report .hr-report-dept div {
  display: grid !important;
  grid-template-columns: 76px 1fr 48px !important;
  gap: 7px !important;
  align-items: center !important;
}

.hr-app .hr-executive-report .hr-report-dept b,
.hr-app .hr-executive-report .hr-report-risk b {
  color: #10263a !important;
}

.hr-app .hr-executive-report .hr-report-dept i,
.hr-app .hr-executive-report .hr-report-risk em {
  display: block !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: #eef2f4 !important;
  overflow: hidden !important;
}

.hr-app .hr-executive-report .hr-report-dept em {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
}

.hr-app .hr-executive-report .hr-report-dept span,
.hr-app .hr-executive-report .hr-report-risk span,
.hr-app .hr-executive-report .hr-report-risk small {
  color: #667085 !important;
}

.hr-app .hr-executive-report table {
  width: 100% !important;
  border-collapse: collapse !important;
}

.hr-app .hr-executive-report th,
.hr-app .hr-executive-report td {
  border: 1px solid #d9e5e8 !important;
  padding: 9px !important;
  color: #172638 !important;
  text-align: left !important;
}

.hr-app .hr-executive-report th {
  background: #f0f7f6 !important;
  color: #10263a !important;
}

.hr-app .hr-executive-report .review-report-roadmap {
  display: grid !important;
  grid-template-columns: 92px 1fr !important;
  border: 1px solid #d9e5e8 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.hr-app .hr-executive-report .review-report-roadmap b,
.hr-app .hr-executive-report .review-report-roadmap span {
  padding: 10px !important;
  border-bottom: 1px solid #d9e5e8 !important;
}

.hr-app .hr-executive-report .review-report-roadmap b {
  background: #10263a !important;
  color: #ffffff !important;
}

.hr-app .hr-executive-report .review-report-roadmap span {
  background: #f8fbfb !important;
  color: #475467 !important;
}

.hr-app .hr-executive-report {
  border-color: rgba(130, 161, 194, .34) !important;
  background: linear-gradient(145deg, rgba(12, 29, 48, .98), rgba(7, 20, 34, .98)) !important;
  color: #eaf5ff !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .22) !important;
}

.hr-app .hr-executive-report .hr-report-cover {
  background:
    linear-gradient(118deg, rgba(8, 24, 40, .98) 0%, rgba(13, 116, 110, .98) 68%, rgba(60, 90, 55, .96) 160%) !important;
  border: 1px solid rgba(94, 234, 212, .18) !important;
}

.hr-app .hr-executive-report .hr-report-summary,
.hr-app .hr-executive-report .hr-report-kpis article,
.hr-app .hr-executive-report .hr-report-card {
  border-color: rgba(130, 161, 194, .32) !important;
  background: linear-gradient(145deg, rgba(13, 31, 50, .96), rgba(8, 22, 38, .98)) !important;
  color: #eaf5ff !important;
}

.hr-app .hr-executive-report .hr-report-summary strong,
.hr-app .hr-executive-report .hr-report-summary p,
.hr-app .hr-executive-report .hr-report-summary b,
.hr-app .hr-executive-report .hr-report-card header h3,
.hr-app .hr-executive-report > h3 {
  color: #f8fbff !important;
}

.hr-app .hr-executive-report > h3 {
  border-left-color: #38ddd1 !important;
  background: linear-gradient(90deg, rgba(20, 184, 173, .26), rgba(8, 22, 38, .98)) !important;
}

.hr-app .hr-executive-report .hr-report-kpis small,
.hr-app .hr-executive-report .hr-report-kpis span,
.hr-app .hr-executive-report .hr-report-card header span,
.hr-app .hr-executive-report .hr-report-legend p,
.hr-app .hr-executive-report .hr-report-weekly small,
.hr-app .hr-executive-report .hr-report-weekly em,
.hr-app .hr-executive-report .hr-report-dept span,
.hr-app .hr-executive-report .hr-report-risk span,
.hr-app .hr-executive-report .hr-report-risk small {
  color: #b8cce2 !important;
}

.hr-app .hr-executive-report .hr-report-kpis b,
.hr-app .hr-executive-report .hr-report-legend b,
.hr-app .hr-executive-report .hr-report-weekly b,
.hr-app .hr-executive-report .hr-report-dept b,
.hr-app .hr-executive-report .hr-report-risk b {
  color: #f8fbff !important;
}

.hr-app .hr-executive-report .hr-report-donut::after,
.hr-app .hr-panel .hr-donut::after,
.hr-app .hr-panel .hr-gauge::after {
  background: linear-gradient(145deg, #0d2338, #071827) !important;
  box-shadow: inset 0 0 0 1px rgba(94, 234, 212, .22), 0 0 0 9px rgba(9, 27, 45, .42) !important;
}

.hr-app .hr-executive-report .hr-report-donut b,
.hr-app .hr-panel .hr-donut b,
.hr-app .hr-panel .hr-gauge b {
  color: #f8fbff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45) !important;
}

.hr-app .hr-executive-report .hr-report-donut small,
.hr-app .hr-panel .hr-donut span,
.hr-app .hr-panel .hr-gauge span {
  color: #bfe8ff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45) !important;
}

.hr-app .hr-executive-report .hr-report-weekly .track,
.hr-app .hr-executive-report .hr-report-dept i {
  background: rgba(226, 242, 248, .16) !important;
}

.hr-app .hr-executive-report th {
  background: rgba(20, 184, 173, .2) !important;
  color: #f8fbff !important;
}

.hr-app .hr-executive-report td {
  background: rgba(7, 20, 34, .74) !important;
  color: #d9e8fb !important;
}

.hr-app .hr-executive-report .hr-report-alerts p {
  background: linear-gradient(135deg, rgba(61, 41, 13, .78), rgba(12, 29, 48, .96)) !important;
  color: #fff2cc !important;
  border-color: rgba(245, 158, 11, .38) !important;
  border-left-color: #f59e0b !important;
}

.hr-app .hr-executive-report .hr-report-alerts p.info {
  background: linear-gradient(135deg, rgba(10, 74, 77, .72), rgba(12, 29, 48, .96)) !important;
  color: #d9fffb !important;
  border-color: rgba(56, 221, 209, .4) !important;
  border-left-color: #38ddd1 !important;
}

.hr-app .hr-executive-report .review-report-roadmap b {
  background: rgba(20, 184, 173, .22) !important;
  color: #f8fbff !important;
}

.hr-app .hr-executive-report .review-report-roadmap span {
  background: rgba(7, 20, 34, .72) !important;
  color: #d9e8fb !important;
}

/* 2026-06-17: narrow HR final polish - chart centers and report cover only */
.hr-app .hr-panel .hr-donut::after,
.hr-app .hr-panel .hr-gauge::after {
  background: #0b2035 !important;
  box-shadow: inset 0 0 0 1px rgba(94, 234, 212, .26), 0 0 0 9px rgba(9, 27, 45, .34) !important;
}

.hr-app .hr-panel .hr-donut b,
.hr-app .hr-panel .hr-gauge b {
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  color: #f8fbff !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45) !important;
}

.hr-app .hr-panel .hr-donut span,
.hr-app .hr-panel .hr-gauge span {
  top: 50% !important;
  transform: translate(-50%, 58%) !important;
  color: #bfe8ff !important;
}

.hr-app .hr-executive-report .hr-report-cover {
  background: linear-gradient(118deg, #071827 0%, #0b2035 54%, #102b43 100%) !important;
  border: 1px solid rgba(94, 234, 212, .22) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

.hr-app .hr-executive-report .hr-report-cover > div,
.hr-app .hr-executive-report .hr-report-cover aside {
  background: transparent !important;
  box-shadow: none !important;
}

.hr-app .hr-panel .hr-donut,
.hr-app .hr-panel .hr-gauge {
  width: 176px !important;
  max-width: 100% !important;
  aspect-ratio: 1 !important;
  margin: 8px auto !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  position: relative !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, .22), inset 0 0 0 1px rgba(94, 234, 212, .16) !important;
}

.hr-app .hr-panel .hr-donut::after,
.hr-app .hr-panel .hr-gauge::after {
  content: "" !important;
  position: absolute !important;
  inset: 42px !important;
  border-radius: 50% !important;
  background: #0b2035 !important;
  box-shadow: inset 0 0 0 1px rgba(94, 234, 212, .26), 0 0 0 9px rgba(9, 27, 45, .34) !important;
}

.hr-app .hr-panel .hr-donut b,
.hr-app .hr-panel .hr-gauge b {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 1 !important;
  color: #f8fbff !important;
  font-size: 25px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45) !important;
}

.hr-app .hr-panel .hr-donut span,
.hr-app .hr-panel .hr-gauge span {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, 58%) !important;
  z-index: 1 !important;
  width: 86px !important;
  color: #bfe8ff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45) !important;
}

.hr-app .hr-panel .hr-gauge b {
  font-size: 24px !important;
}

@media (max-width: 1200px) {
  .hr-app .hr-executive-report .hr-report-kpis,
  .hr-app .hr-executive-report .hr-report-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .hr-app .hr-executive-report {
    padding: 16px !important;
  }

  .hr-app .hr-executive-report .hr-report-cover,
  .hr-app .hr-executive-report .hr-report-summary,
  .hr-app .hr-executive-report .hr-report-kpis,
  .hr-app .hr-executive-report .hr-report-grid {
    grid-template-columns: 1fr !important;
  }
}