@font-face {
  font-family: 'Archivo Expanded'; src: url('/assets/archivo-expanded.woff2') format('woff2');
  font-weight: 700 800; font-display: swap;
}
.vhis-tool { background: #f4f9fd; border-bottom: 1px solid var(--line); }
.vhis-tool [hidden] { display: none; }
.vhis-hero {
  background: linear-gradient(90deg, #0c2039f5, #102d4bd6 55%, #102d4b66),
    #102d4b url('/assets/harbour-dusk.png') center 54% / cover no-repeat;
  color: white;
  padding: clamp(2.5rem, 7vw, 6rem) 0 clamp(2.25rem, 5vw, 4.5rem);
}
.vhis-hero h1 { color: white; font: 800 clamp(2.25rem, 6vw, 4.75rem)/1 'Archivo Expanded', sans-serif; max-width: 22ch; }
.vhis-hero h1 span, .vhis-hero .eyebrow { color: #9ee5f1; }
.vhis-hero .lead { color: white; max-width: 55ch; }
.vhis-hero #vhis-panel { margin: 1.3rem 0 0; color: #e5f6fc; font-size: .95rem; }
.vhis-starts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; max-width: 58rem; margin-top: 1.75rem; }
.vhis-starts button {
  display: grid; gap: .35rem; padding: .9rem 1rem; text-align: left;
  color: white; background: #193858; border: 1px solid #6184a3; border-radius: 9px;
}
.vhis-starts button:hover, .vhis-starts button[aria-pressed="true"] { background: #22547c; border-color: #a5e5ef; }
.vhis-starts strong { font: 700 1.1rem/1.25 'Archivo Expanded', sans-serif; }
.vhis-starts span { color: #d9eefa; font-size: .9rem; }
.vhis-starts span[aria-hidden] { color: #9ee5f1; font-size: 1.15rem; }
.vhis-tool .vhis-workspace { padding-block: clamp(1.5rem, 4vw, 3.5rem); background: #101e30; color: #e5f6fc; }
.vhis-results-area > p .text-link, .vhis-results-area h3 { color: #e5f6fc; }
.vhis-card, .vhis-table { color: var(--ink); }
.vhis-tool :is(#vhis-form-title, #vhis-results-title, #vhis-comparison-title) { scroll-margin-top: 1rem; }
.vhis-tool #vhis-form-title { margin-top: 0; }
.vhis-counts { display: flex; gap: clamp(1rem, 4vw, 3rem); flex-wrap: wrap; border-top: 1px solid #a5e5ef66; padding-top: 1rem; }
.vhis-counts div { display: flex; flex-direction: column-reverse; }
.vhis-counts dd { margin: 0; font: 800 1.65rem/1.2 'Archivo Expanded', sans-serif; }
.vhis-counts dt { color: #d9eefa; font-size: .88rem; }
.vhis-layout { display: grid; gap: 1.5rem; align-items: start; }
.vhis-results-area { min-width: 0; }
.vhis-layout:has(> #vhis-form:not([hidden])) { grid-template-columns: minmax(0, 1fr) minmax(300px, 340px); }
.vhis-layout form { grid-column: 2; grid-row: 1; position: sticky; top: 1rem; }
.vhis-layout .vhis-results-area { grid-column: 1; grid-row: 1; }
.vhis-tool .vhis-layout form { color: white; background: #152c48; border-color: #456680; }
.vhis-layout form h2, .vhis-layout form .eyebrow, .vhis-layout form .micro { color: #e5f6fc; }
.vhis-layout form h2 { font-size: 1.35rem; }
.vhis-layout form .eyebrow { margin-bottom: .5rem; }
.vhis-layout form .button:not(.secondary) { background: #9ee5f1; color: #102d4b; }
.vhis-chat-history { display: grid; gap: .5rem; padding: 0; list-style: none; }
.vhis-chat-history:empty, #vhis-chat-reply:empty { display: none; }
.vhis-chat-history li { justify-self: end; border-radius: 10px 10px 2px 10px; padding: .45rem .7rem; background: #9ee5f1; color: #102d4b; }
.vhis-question, #vhis-chat-reply { padding: .7rem; background: #254565; border-radius: 10px 10px 10px 2px; }
.vhis-layout:has(> #vhis-form:not([hidden])) #vhis-cards { grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
@media (max-width: 850px) {
  .vhis-layout:has(> #vhis-form:not([hidden])) { grid-template-columns: minmax(0, 1fr); }
  .vhis-layout form, .vhis-layout .vhis-results-area { grid-column: 1; grid-row: auto; position: static; }
}
.vhis-layout:has(#vhis-lilly:not([hidden])) { grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); }
#vhis-lilly { grid-column: 2; grid-row: 1; position: sticky; top: 1rem; background: #152c48; border: 1px solid #456680; border-radius: 10px; padding: 1rem; }
#vhis-lilly h2 { color: white; margin: 0; font-size: 1.4rem; }
#vhis-lilly form { display: grid; gap: .5rem; position: static; padding: 0; border: 0; }
#vhis-lilly textarea { width: 100%; resize: vertical; font: inherit; padding: .6rem; border-radius: 6px; }
#vhis-lilly .vhis-actions { margin-bottom: .4rem; }
#vhis-lilly .button, #vhis-ask { background: #9ee5f1; color: #102d4b; }
#vhis-chat-reset, #vhis-chips button { background: transparent; color: #e5f6fc; border: 1px solid #7296b2; padding: .35rem .6rem; border-radius: 6px; }
#vhis-chat-reset { margin-left: auto; }
#vhis-transcript { max-height: 38vh; overflow: auto; display: grid; gap: .5rem; margin-bottom: .6rem; }
#vhis-transcript:empty { display: none; }
.vhis-message { white-space: pre-wrap; overflow-wrap: anywhere; padding: .55rem .7rem; background: #254565; border-radius: 8px; }
.vhis-message.user { background: #9ee5f1; color: #102d4b; margin-left: 1rem; }
.vhis-message ul { padding-left: 1.2rem; }
#vhis-plan-details { border: 1px solid #456680; border-radius: 8px; padding: 1rem; margin-top: 1rem; }
@media (max-width: 850px) {
  .vhis-layout:has(#vhis-lilly:not([hidden])) { grid-template-columns: minmax(0, 1fr); }
  #vhis-lilly { grid-column: 1; grid-row: auto; position: static; }
}
@media (max-width: 640px) {
  .vhis-starts { grid-template-columns: 1fr; }
  .vhis-starts button { grid-template-columns: 1fr auto; gap: .15rem .5rem; }
  .vhis-starts span:not([aria-hidden]) { grid-row: 2; }
  .vhis-starts span[aria-hidden] { grid-column: 2; grid-row: 1 / 3; align-self: center; }
}
.vhis-tool form { padding: clamp(1rem, 3vw, 2rem); background: white; border: 1px solid var(--line); border-radius: 8px; }
.vhis-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1rem; }
.vhis-fields label { display: grid; align-content: end; gap: .35rem; font-weight: 600; }
.vhis-fields input, .vhis-fields select {
  width: 100%; min-height: 44px; padding: .5rem .7rem; color: var(--ink); background: white;
  border: 1px solid #88abc4; border-radius: 5px; font: inherit;
}
.vhis-tool button { cursor: pointer; }
.vhis-tool button:disabled { opacity: .65; cursor: default; }
.vhis-disclosure { max-width: 76ch; font-size: .9rem; }
.vhis-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.vhis-card { background: white; display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
.vhis-card h4 { font-size: 1.2rem; margin: 0; }
.vhis-card p { margin: .4rem 0; }
.vhis-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .6rem; }
.vhis-card dd { margin: 0; font-weight: 600; }
.vhis-pick { display: flex; align-items: center; gap: .4rem; padding-top: .75rem; margin-top: auto; cursor: pointer; }
.vhis-pick input { width: 1.2rem; height: 1.2rem; accent-color: var(--navy); }
.vhis-table { overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; background: white; margin-bottom: 1.5rem; }
.vhis-table table { border-collapse: collapse; min-width: 520px; width: 100%; }
.vhis-table th, .vhis-table td { padding: .65rem .8rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.vhis-table thead th { color: white; background: var(--navy); }
.vhis-table tbody th { min-width: 115px; }

