:root{--ink:#173f47;--muted:#5d7778;--sea:#287c83;--paper:#f7f6f0;--line:#cedbd7;--warm:#b77f51}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 system-ui,-apple-system,sans-serif}h1,h2,h3,p,figure{margin:0}button,a,select,textarea{font:inherit}button,.primary{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:48px;padding:11px 22px;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:4px;text-decoration:none;cursor:pointer}button:hover,a.primary:hover{background:#e5efeb}.primary{background:var(--ink);color:white;border-color:var(--ink)}button.primary:hover,a.primary:hover{background:#2b6269;color:white}button:disabled{opacity:.5;cursor:default}a{color:inherit}a:focus-visible,button:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #b77f51;outline-offset:5px}[hidden]{display:none!important}.skip{position:absolute;top:-100px}.skip:focus{top:5px;z-index:10;background:white;padding:15px}.masthead{max-width:1500px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:25px 5vw;font-size:12px;letter-spacing:2px;border-bottom:1px solid var(--line)}.masthead>a{text-decoration:none}.masthead span i{font-style:normal;color:var(--warm);margin:0 15px}.masthead nav{display:flex;gap:20px}.masthead [aria-current]{font-weight:800;text-decoration-thickness:2px}main{max-width:1500px;margin:auto;padding:0 5vw}.welcome{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;min-height:75vh;gap:3vw;padding:65px 0}.eyebrow{text-transform:uppercase;letter-spacing:3px;font-size:11px;font-weight:700;color:var(--sea);margin-bottom:20px}h1{font:normal clamp(46px,5.5vw,86px)/1.08 Georgia,serif;letter-spacing:-2px;margin-bottom:25px}h2{font:normal clamp(28px,3vw,42px)/1.2 Georgia,serif;margin-bottom:18px}.lead{font-size:clamp(19px,1.7vw,25px);line-height:1.55;margin-bottom:20px}.welcome-copy>p:not(.eyebrow){max-width:510px}.welcome-art{position:relative;margin-right:-4vw}.welcome-art img{width:100%;mix-blend-mode:multiply;aspect-ratio:16/9;object-fit:contain}.welcome-art figcaption{text-align:right;padding-right:4vw;font-size:11px;letter-spacing:2px;color:var(--muted)}.settings{display:flex;gap:20px;margin:30px 0 25px}.settings label{flex:1;font-size:12px;color:var(--muted)}select{display:block;width:100%;padding:12px 4px;background:none;border:0;border-bottom:1px solid var(--ink);border-radius:0;color:var(--ink)}.start-actions{display:flex;gap:12px}.fine{font-size:12px;color:var(--muted);margin-top:18px}.preview-banner{padding:9px 14px;margin-top:12px;background:#ebe3cf;font-size:12px;color:#64522f}.journey-bar{display:flex;align-items:center;gap:20px;justify-content:space-between;margin:25px 0 12px;font-size:13px}.journey-bar button{font-size:13px;padding:5px 12px;min-height:44px}progress{height:3px;width:100%;appearance:none;border:0;background:var(--line)}progress::-webkit-progress-bar{background:var(--line)}progress::-webkit-progress-value{background:var(--sea)}#lesson{display:grid;grid-template-columns:1fr 1.15fr;gap:35px;padding:55px 0;align-items:center}#lesson h1{font-size:clamp(40px,4.4vw,66px)}#lesson-intro{font-size:21px}#traits{padding-left:25px;min-height:140px}#traits li{padding:7px 0 7px 10px;border-bottom:1px solid var(--line)}.lesson-art img{width:100%;aspect-ratio:16/9;object-fit:contain;mix-blend-mode:multiply}.lesson-art figcaption{font-size:13px;color:var(--muted);min-height:30px}.lesson-art button{font-size:12px;min-height:44px}.controls{display:flex;flex-wrap:wrap;gap:12px;margin:25px 0}.controls button{font-size:14px}.choices{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:30px 0}.choice{display:block;position:relative;border:0;border-bottom:2px solid var(--line);padding:0 0 18px;border-radius:0;text-align:left;min-height:200px}.choice img{width:100%;aspect-ratio:16/9;object-fit:contain;mix-blend-mode:multiply}.choice [data-marker]{display:block;font:22px Georgia,serif;margin:8px 14px}.choice[aria-pressed=true]{border-color:var(--sea);background:#e9efea}.choice[aria-pressed=true] [data-marker]::after{content:' ✓';color:var(--sea)}.choice.correct{border-color:#3d7962}.choice.incorrect{border-color:#a46e53}.correction{display:block;font-size:15px;line-height:1.6;margin:15px}#exercise{padding:40px 0}#exercise>p{max-width:820px}#none[aria-pressed=true]{background:var(--sea);color:white}#result{font-weight:650}.message,.final{padding:85px 0;max-width:950px;min-height:65vh}.message p{margin-bottom:30px}.video-frame{position:relative;margin:30px 0;width:100%;aspect-ratio:16/9;background:#102b32}.video-frame video{width:100%;height:100%;object-fit:contain}#regions{position:absolute;pointer-events:none}.region{position:absolute;border:3px solid #e9dfaa;border-radius:40%;box-shadow:0 0 0 1px #173f47}textarea{width:100%;padding:14px;border:1px solid var(--line);background:white;color:var(--ink)}footer{margin:45px 5vw 20px;border-top:1px solid var(--line);padding:20px 0;font-size:11px;letter-spacing:1px;color:var(--muted)}body.collective{font-size:21px}body.collective .controls button{font-size:18px}body.collective #lesson-intro{font-size:25px}@media(max-width:800px){.welcome,#lesson{grid-template-columns:1fr;padding:35px 0;gap:25px}.welcome-art{grid-row:1;margin:0}.welcome-art img{max-height:280px}.welcome h1{font-size:58px}.masthead{letter-spacing:1px}.masthead span{font-size:9px}.choices{grid-template-columns:1fr}.settings{flex-direction:column;gap:15px}.journey-bar{flex-wrap:wrap;gap:8px}.choice img{max-height:260px}#traits{min-height:0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Copyright is an interface annotation, kept outside the naturalist painting. */
.welcome-art,.lesson-art,.choice{position:relative;container-type:inline-size}.welcome-art img,.lesson-art img,.choice img{padding-left:0}
.view-label{display:block;margin:6px 14px;font-size:12px;color:var(--muted)}