:root { color-scheme: light; font: 16px/1.6 system-ui,sans-serif; color: #283c33; background: #edf2ee; }
* { box-sizing: border-box; }
main { max-width: 1080px; margin: auto; padding: 24px; }
nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
a { color: #30664f; text-underline-offset: 3px; overflow-wrap: anywhere; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid #57997c; outline-offset: 3px; }
input, button { font: inherit; border: 1px solid #bacbc0; border-radius: 12px; padding: 10px 14px; background: #fff; }
input { display: block; width: 100%; margin: 6px 0; }
button { cursor: pointer; min-height: 44px; }
h1 { font-size: clamp(1.8rem,6vw,2.6rem); }
#intro { max-width: 78ch; }
#credits { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,300px),1fr)); gap: 16px; }
.model-credit { background: #fffcf4; border: 1px solid #d5dfd5; border-radius: 18px; padding: 20px; scroll-margin: 20px; }
.model-credit:target { outline: 3px solid #57997c; }
.model-credit h2 { margin: 0 0 10px; font-size: 1.2rem; }
.model-credit p { margin: 8px 0; overflow-wrap: anywhere; }
.credit-meta { font-size: .85rem; color: #52685c; }
.credit-links { display: flex; gap: 16px; flex-wrap: wrap; }