:root { color-scheme: light; font-family: system-ui, sans-serif; color: #1f1f1f; background: #f7f6f2; }
* { box-sizing: border-box; }
body { margin: 0; }
header { min-height: 4rem; padding: .75rem max(1rem, calc((100% - 52rem) / 2)); display: flex; gap: 1rem; align-items: center; justify-content: space-between; background: #003594; color: white; }
.brand { color: white; font-size: 1.25rem; font-weight: 700; text-decoration: none; }
nav { display: flex; gap: .5rem; }
main { width: min(52rem, 100%); margin: auto; padding: clamp(1rem, 4vw, 2rem); }
button, .button { border: 0; border-radius: .25rem; padding: .7rem 1rem; font: inherit; font-weight: 650; background: #ffb81c; color: #161616; cursor: pointer; text-decoration: none; }
button:focus-visible, a:focus-visible, textarea:focus-visible { outline: .2rem solid #ffb81c; outline-offset: .2rem; }
button:disabled { cursor: wait; opacity: .65; }
.button[aria-disabled="true"] { pointer-events: none; opacity: .65; }
.notice { padding: .75rem; border-left: .3rem solid #ffb81c; background: white; }
#messages { list-style: none; margin: 1.5rem 0; padding: 0; display: grid; gap: 1rem; }
#messages > li { padding: 1rem; border-radius: .4rem; background: white; box-shadow: 0 .1rem .35rem #0002; }
.question { font-weight: 700; }
.answer { white-space: pre-wrap; overflow-wrap: anywhere; }
.citations a { overflow-wrap: anywhere; }
form { display: grid; gap: .5rem; }
textarea { min-height: 7rem; resize: vertical; padding: .75rem; font: inherit; }
#send { justify-self: end; }
#status { min-height: 1.5rem; margin-top: 1rem; }
@media (max-width: 34rem) { header { align-items: flex-start; } nav { flex-direction: column; } nav button { width: 100%; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }