:root{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f1f3e5;background:#101e1b;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:1px solid #ffffff24;background:#20332e;border-radius:12px;padding:12px 18px;transition:background .2s,transform .2s}button:hover{background:#314c3d}button:active{transform:scale(.97)}button:focus-visible,a:focus-visible{outline:3px solid #d3ed87;outline-offset:4px}button:disabled{opacity:.5;cursor:wait}button[hidden],[hidden]{display:none!important}#app{height:100svh;min-height:600px;display:flex;flex-direction:column}header{height:86px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid #ffffff12;gap:20px}.brand{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:800;letter-spacing:2px;color:inherit;text-decoration:none}.brand-bottom{display:block;font-size:20px;letter-spacing:6px;margin-top:3px}.mark{font-size:46px;color:#d3ed87;font-weight:400}#habitat-label{font-size:12px;letter-spacing:2px;color:#a8b6a8}nav{display:flex;gap:8px}nav button{font-size:14px}#stage{position:relative;flex:1;min-height:340px;overflow:hidden;background:radial-gradient(ellipse at 50% 60%,#53785a,#1c3c35)}#world{position:absolute;inset:0;width:100%;height:100%;display:block}.vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 90px #0a1f3030}.overlay{position:absolute;inset:0;z-index:3;background:linear-gradient(110deg,#102a24f7,#102a24e8);padding:clamp(22px,4vw,64px);display:grid;grid-template-columns:.85fr 1.3fr;align-content:center;gap:28px 54px;overflow:auto}.intro{align-self:center;max-width:410px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:700;color:#ccdfb3}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(48px,5.4vw,82px);line-height:1.03;margin:22px 0}p{font-size:17px;line-height:1.65;color:#b9cbbd}.choices{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-self:center}.habitat-card{height:345px;position:relative;text-align:left;padding:0;overflow:hidden;border-radius:20px;border:1px solid #aac18b50;background:#244532;box-shadow:0 22px 60px #0003}.habitat-card:hover{transform:translateY(-5px)}.habitat-card img{width:100%;height:100%;object-fit:cover;object-position:40%;opacity:.8}.habitat-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 20%,#0d2319ef)}.card-text{position:absolute;bottom:28px;left:24px;right:20px;z-index:1;display:grid;gap:10px}.card-text small{font-size:12px;letter-spacing:2px;color:#d3ed87}.card-text strong{font-family:Georgia,serif;font-size:30px;font-weight:400}.card-text span{font-size:14px;color:#c3d4c7}.card-number{position:absolute;z-index:1;top:20px;left:24px;font-size:14px;letter-spacing:2px}.reef img{filter:hue-rotate(25deg)}#loading,.instructions{grid-column:1/-1;text-align:center;margin:0;font-size:14px}.instructions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px}.instructions>span{margin:0 12px}kbd{font-family:inherit;font-size:12px;border:1px solid #ffffff30;border-radius:5px;padding:3px 7px;color:inherit;background:#ffffff0b}.primary{background:#d3ed87;color:#182820;border-color:#d3ed87;font-weight:700}.primary:hover{background:#e2faa4}#guidance{position:absolute;left:28px;top:25px;padding:15px 20px;background:#102a24d9;border:1px solid #d3ed8730;border-radius:12px;display:grid;gap:8px}#hint{font-size:18px;font-weight:500}#notice{position:absolute;top:28px;left:50%;transform:translateX(-50%);max-width:70%;background:#102a24ed;border-radius:30px;padding:12px 24px;text-align:center;opacity:0;pointer-events:none;transition:opacity .2s}#notice.show{opacity:1}#controls{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:10px;align-items:center}#left,#right{font-size:26px;width:60px;height:52px;touch-action:none;line-height:1;background:#102a24e8}#find{white-space:nowrap;height:52px}#find kbd{margin-left:10px;border-color:#18301a44}#reticle{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);pointer-events:none;text-align:center;color:#fff9}#reticle span{display:block;width:42px;height:42px;border:1px solid #ffffff50;border-radius:50%;margin:auto}#reticle small{font-size:10px;letter-spacing:2px;display:block;margin-top:10px}footer{display:flex;align-items:center;gap:28px;padding:20px 32px;background:#101e1b;border-top:1px solid #ffffff15;flex-shrink:0}.collection-label{min-width:162px;display:grid;gap:7px}.collection-label strong{font-size:28px;font-weight:500}.collection-label small{font-size:12px;color:#a0b4a5}.muted{color:#829887}#animals{flex:1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.animal{position:relative;text-align:center;background:#263b30;border:1px solid #b5cfaa1a;border-radius:12px;padding:5px 4px 10px;min-width:0;transition:background .35s,border-color .35s}.animal img{display:block;width:100%;height:65px;object-fit:contain;filter:brightness(0);opacity:.65}.animal span{font-size:12px;color:#9bb19b}.animal.found{background:#384931;border-color:#d3ed8770}.animal.found img{filter:none;opacity:1}.animal.found span{color:#e1edae}.animal.found:after{content:'✓';position:absolute;right:8px;top:6px;color:#d3ed87;font-size:14px}.dialog{position:absolute;z-index:4;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;padding:38px;background:#102a24f5;border:1px solid #d3ed8750;border-radius:22px;width:min(450px,90%);box-shadow:0 20px 100px #0006}.dialog h2{font:40px/1.15 Georgia,serif;margin:20px 0}.dialog p{font-size:16px}.dialog button{margin-top:12px}@media(max-width:850px){header{height:70px;padding:0 18px}#habitat-label{display:none}.overlay{grid-template-columns:1fr;padding:28px;gap:18px}.intro{max-width:none}.intro h1{font-size:45px;margin:12px 0}.intro h1 br{display:none}.intro p{font-size:15px;margin:0}.habitat-card{height:230px}.card-text{bottom:20px;left:20px}.instructions>span{margin:0 3px}footer{padding:12px;gap:12px}.collection-label{min-width:105px}.collection-label .eyebrow{font-size:10px;letter-spacing:1px}.collection-label small{max-width:100px}#animals{gap:5px}.animal img{height:52px}.animal span{font-size:10px}#guidance{top:15px;left:15px;padding:10px 14px}.eyebrow{font-size:11px}#notice{top:auto;bottom:87px;width:85%;max-width:85%;font-size:14px}}@media(max-width:520px){#app{min-height:620px}nav button{padding:10px}.brand{font-size:10px}.brand-bottom{font-size:16px}.mark{font-size:34px}.choices{gap:10px}.habitat-card{height:210px}.card-text strong{font-size:25px}.card-text span{font-size:12px}.overlay{padding:20px}.intro h1{font-size:40px}footer{display:block}.collection-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.collection-label strong{font-size:22px}.collection-label small{max-width:none}.animal img{height:46px}#find kbd{display:none}#controls{bottom:16px}#guidance .eyebrow{display:none}#hint{font-size:14px}}
/* Wildlife edition: give all twelve discoveries room without shrinking their labels. */
#animals{grid-template-columns:repeat(12,minmax(64px,1fr));overflow-x:auto;padding-bottom:4px}.animal img{height:52px}.animal span{font-size:11px}.collection-label{min-width:142px}#hint-button{font-size:12px;padding:7px 10px;justify-self:start;background:#183228}#guidance{max-width:280px}#guidance .eyebrow{font-size:10px}#hint{font-size:14px}#reticle span{width:27px;height:27px;border-color:#fffc;box-shadow:0 0 4px #0009}#reticle small{font-size:9px;letter-spacing:1px;text-shadow:0 1px 3px #000}#world{touch-action:none}.reef img{filter:none}@media(max-width:850px){#animals{grid-template-columns:repeat(6,minmax(0,1fr));overflow:visible}.animal img{height:36px}.animal{padding:3px 3px 6px}.animal span{font-size:10px}footer{gap:12px}#guidance{padding:9px;top:10px;left:10px}#guidance .eyebrow{display:none}#hint{font-size:12px}}@media(max-width:520px){#app{min-height:700px}.animal img{height:30px}#guidance{max-width:200px}#hint-button{padding:5px 8px}.instructions{font-size:12px}#reticle small{display:none}}

#app:fullscreen{height:100vh;width:100vw;background:#101e1b}#app:fullscreen #stage{min-height:0}@media(max-width:520px){nav{gap:4px}nav button{font-size:12px;padding:8px}header{gap:8px;padding:0 10px}#fullscreen{max-width:80px}}
