:root { color-scheme: light; font: 16px/1.5 system-ui, sans-serif; color: #172b43; background: #f4f7fa; }
* { box-sizing: border-box; }
body { max-width: 1200px; margin: auto; padding: 1.5rem; }
a { color: #165e9b; }
h1,h2,h3 { line-height: 1.25; }
section, article { background: white; border: 1px solid #ccd5df; border-radius: .6rem; padding: 1rem; margin: 1rem 0; }
article { background: #fafbfd; }
button { background: #213b59; color: white; border: 1px solid #213b59; border-radius: .3rem; padding: .55rem .85rem; margin: .3rem .4rem .3rem 0; cursor: pointer; font: inherit; }
button:hover { background: #345775; }
button:disabled { opacity: .55; cursor: not-allowed; }
input,textarea,select { display: block; width: 100%; padding: .6rem; border: 1px solid #8a9bb0; border-radius: .25rem; font: inherit; margin: .3rem 0 .8rem; }
input[type=checkbox] { display: inline-block; width: auto; margin-left: .5rem; }
textarea { min-height: 7rem; resize: vertical; }
select[multiple] { min-height: 5rem; }
label { display: block; font-weight: 600; margin-top: .7rem; }
pre,.message { white-space: pre-wrap; overflow-wrap: anywhere; }
:focus-visible { outline: 3px solid #ca7400; outline-offset: 3px; }
#status { padding: 1rem; border-left: 4px solid #39729d; background: #e7eff7; overflow-wrap: anywhere; }
#threads button { display: block; text-align: left; }
#onboarding { font-size: .9rem; }
#secret:empty { display: none; }
#secret { background: #fff3cd; padding: 1rem; }
[hidden] { display: none !important; }
@media(max-width: 600px) { body { padding: .6rem; } button { max-width: 100%; overflow-wrap: anywhere; } }