@font-face{font-family:Roboto;src:url('assets/Roboto-Regular.ttf');font-weight:400;font-display:swap}@font-face{font-family:Roboto;src:url('assets/Roboto-Bold.ttf');font-weight:700;font-display:swap}
:root{font-family:Roboto,Arial,sans-serif;color:#253a2a;background:#eeeede;--paper:#faf7e9;--ink:#253a2a;--green:#2f5137;--lime:#d8e696;--accent:#a64c29;color-scheme:light}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:disabled{cursor:wait;opacity:.65}button:focus-visible{outline:3px solid #e49d38;outline-offset:5px}::selection{background:#d8e696;color:#253a2a}[hidden]{display:none!important}.masthead{height:84px;padding:16px 3.2%;display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--paper)}.identity{display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.2;font-weight:700}.mast-title{font-size:24px;font-weight:700;letter-spacing:-.02em}.subtle{border:0;background:transparent;color:var(--ink);display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 14px;border-radius:6px}.subtle:hover{background:#dfe5cf}.roundbar{height:74px;padding:12px 3.2%;display:flex;justify-content:space-between;align-items:center;background:var(--green);color:var(--paper);gap:16px}.roundbar>div{display:flex;align-items:center;gap:14px}h1{font-size:21px;margin:0;font-weight:400}.habitat-mark{width:10px;height:10px;background:var(--lime);border-radius:50%}.round-status{font-size:15px}.round-status .subtle{color:var(--paper);border:1px solid #859b7c}.round-status .subtle:hover{background:#42694a}.time{display:flex;gap:8px;align-items:center;padding-left:23px;border-left:1px solid #819473;font-variant-numeric:tabular-nums}.time span{font-size:29px;font-weight:700}.time small{font-size:14px}.time.urgent{color:#ffe0a4}.scene{position:relative;width:100%;aspect-ratio:1672/941;isolation:isolate;overflow:hidden;background:#28452e;touch-action:manipulation;container-type:inline-size}.forest{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none;pointer-events:none}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,31,19,.35),transparent 60%);pointer-events:none;transition:opacity .5s}.progress{position:absolute;inset:0 0 auto;height:5px;background:#162a1980;z-index:4}.progress>div{height:100%;background:var(--lime);width:100%;transform-origin:left}.scene-title{position:absolute;left:5.5%;top:9%;color:#fffbea;text-shadow:0 3px 18px #102412;line-height:1.12;pointer-events:none}.scene-title span{display:block;font-size:clamp(21px,2.8vw,44px);margin-bottom:6px}.scene-title strong{font-size:clamp(36px,5vw,74px);font-weight:700;letter-spacing:-.035em}.panel{position:absolute;right:3.8%;top:6.5%;width:32%;max-width:480px;padding:clamp(20px,2.8vw,44px);background:var(--paper);box-shadow:0 16px 45px #10261655;border-radius:4px;z-index:5}.panel-top{display:flex;align-items:center;gap:12px;font-size:14px;color:#52653d;margin-bottom:22px}h2{font-size:clamp(25px,2.8vw,42px);letter-spacing:-.025em;line-height:1.06;margin:0 0 18px}p{font-size:clamp(14px,1.3vw,19px);line-height:1.5;margin:0 0 20px;color:#4a5b40}.study{display:flex;align-items:center;gap:15px;border-top:1px solid #c9cfb3;padding:8px 0 16px;margin-top:23px}.study>img{width:40%;height:145px;object-fit:contain}.study strong{font-size:15px}.study p{font-size:14px;line-height:1.5;margin:8px 0}.primary{border:0;border-radius:4px;width:100%;min-height:56px;background:var(--green);color:#fffbea;font-weight:700;font-size:18px;padding:15px 12px;transition:background .15s}.primary:hover{background:#1d3927}.primary:active{background:#162d1c}.secondary{border:1px solid #9caa8c;border-radius:4px;background:transparent;color:var(--ink);width:100%;min-height:48px;margin-top:10px;padding:11px;font-size:15px}.secondary:hover{background:#e6e9d4}.minor{font-size:12px;text-align:center;margin:14px 0 0;color:#596a46}.specimen{position:absolute;left:26%;top:63%;width:13%;height:31%;padding:0;border:0;background:transparent;z-index:2;outline-offset:-6px;filter:drop-shadow(2px 6px 3px #12231970);-webkit-user-select:none;user-select:none}.specimen img{width:100%;height:100%;object-fit:contain;pointer-events:none}.specimen:hover:not(:disabled){filter:drop-shadow(2px 6px 3px #12231970) brightness(1.08)}.specimen:disabled{opacity:1;cursor:default}.playing .shade{opacity:0}.playing .specimen{cursor:crosshair}.seek-task{position:absolute;left:50%;bottom:4.2%;transform:translateX(-50%);background:var(--paper);color:var(--ink);display:flex;align-items:center;gap:12px;padding:13px 22px;border-radius:4px;box-shadow:0 8px 24px #12271955;font-size:18px;white-space:nowrap;pointer-events:none}.feedback{position:absolute;left:50%;top:7%;transform:translateX(-50%);background:#faf7e9;color:var(--ink);padding:13px 20px;box-shadow:0 5px 22px #12271950;border-radius:4px;z-index:4;max-width:80%;text-align:center;font-size:16px;pointer-events:none}.feedback:empty{display:none}.pause-panel{top:24%;width:32%}.paused .forest,.paused .specimen{filter:blur(10px) brightness(.7)}.result{top:7%;width:35%}.result-symbol{display:inline-block;width:38px;height:38px;margin-bottom:18px;border-radius:50%;background:#dce8b6;position:relative}.result-symbol.success:after{content:'';position:absolute;width:14px;height:8px;top:12px;left:12px;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}.result-symbol.timeout:after{content:'';position:absolute;inset:9px;border:2px solid var(--green);border-radius:50%}.result-symbol.timeout:before{content:'';position:absolute;top:12px;left:18px;width:2px;height:8px;background:var(--green)}.result h2{font-size:clamp(26px,2.6vw,40px)}.result-species{display:flex;align-items:center;gap:16px;border-block:1px solid #c9cfb3;padding:12px 0;margin-bottom:16px}.result-species img{width:35%;height:135px;object-fit:contain}.result-species h3{margin:0 0 8px;font-size:20px;line-height:1.15}.result-species p{font-size:14px;margin:0}.result p{font-size:15px;margin-bottom:15px}.result .care{font-size:15px;color:#364d31}.result .primary{min-height:50px}.result .secondary{min-height:44px}.about{margin:24px auto;max-width:820px;padding:30px;background:var(--paper);border-radius:4px}.about>div{display:flex;justify-content:space-between;gap:20px}.about h2{font-size:25px}.about h3{font-size:20px}.about p,.about li{font-size:16px;line-height:1.6}.about li{margin:12px 0}.about ol{padding-left:24px}.text-button{background:transparent;border:0;color:#3b5335;text-decoration:underline;text-underline-offset:4px;padding:8px;min-height:44px;font-size:13px}.text-button:hover{color:#152b19}footer{padding:8px 3.2%;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:#526145;background:var(--paper)}.keyboard-tip{color:#526145}body:fullscreen .scene{height:calc(100svh - 214px);aspect-ratio:auto}body:fullscreen .masthead{height:84px}@keyframes found{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@media(min-width:1600px){.panel{top:10%}.result{top:10%}.study>img{height:180px}.result-species img{height:170px}.result p{font-size:18px}.minor{font-size:14px}}
@media(max-width:900px) and (min-width:641px){.panel{width:35%;right:2%;padding:20px;top:5%}.panel-top{margin-bottom:10px;font-size:12px}.study{margin-top:12px;padding:5px 0 8px;gap:8px}.study>img{height:105px}.study strong,.study p{font-size:12px}.primary{min-height:46px;padding:11px;font-size:16px}.panel h2{margin-bottom:12px}.panel p{margin-bottom:10px}.minor{margin-top:10px!important}.result-species{padding:4px 0;margin:8px 0}.result-species img{height:83px}.result-species h3{font-size:17px}.result-species p{font-size:12px}.result .care{font-size:13px}.result-symbol{display:none}.result .primary,.result .secondary{min-height:40px;padding:9px}.scene-title{top:10%}.masthead{height:70px}.roundbar{height:62px}.keyboard-tip{display:none}}
@media(max-width:640px){.masthead{height:68px;padding:12px 16px;gap:10px}.identity{font-size:11px;gap:6px}.identity svg{width:28px}.mast-title{font-size:16px;max-width:135px}.masthead .subtle{padding:8px}.masthead .subtle span{display:none}.roundbar{padding:10px 16px;height:66px;gap:8px}.roundbar>div{gap:8px}h1{font-size:15px;max-width:140px}.round-status{gap:7px!important;font-size:11px}.time{padding-left:10px;gap:4px}.time svg{display:none}.time span{font-size:24px}.time small{font-size:11px}#pause{padding:6px;font-size:12px;min-height:40px}.scene{aspect-ratio:auto;min-height:650px}.forest{height:330px;object-fit:cover;object-position:50% 55%}.shade{height:330px}.scene-title{top:25px;left:20px}.scene-title span{font-size:22px}.scene-title strong{font-size:38px}.panel{top:300px;right:0;width:100%;max-width:none;padding:25px 24px;border-radius:0;box-shadow:none;min-height:350px}.panel-top{margin-bottom:14px}h2{font-size:31px;line-height:1.12}.welcome h2 br{display:none}.panel p{font-size:15px;margin-bottom:14px}.study{margin-top:8px;padding:3px 0 12px}.study>img{width:95px;height:100px}.study p{font-size:14px}.minor{font-size:12px!important}.primary{min-height:52px;font-size:17px}.specimen{top:150px;left:25%;width:22%;height:150px}.scene.playing,.scene.paused{min-height:calc(100svh - 185px)}.playing .forest,.paused .forest{height:100%;object-position:center}.playing .specimen,.paused .specimen{top:60%;height:27%;width:23%}.playing .seek-task{font-size:14px;bottom:22px;padding:12px 17px}.feedback{font-size:14px;top:20px;width:85%;max-width:none}.pause-panel{top:22%;right:6%;width:88%;padding:28px;min-height:0;border-radius:4px}.result{top:300px;min-height:420px}.scene.finished{min-height:760px}.result-symbol{display:none}.result-species img{height:110px}.result-species h3{font-size:22px}.result-species p{font-size:14px}.result p{font-size:15px}.seek-task{white-space:normal;text-align:center}.about{padding:24px;margin:0}.about h2{font-size:24px}.about>div{gap:12px}.keyboard-tip{display:none}footer{padding:6px 12px;font-size:10px;gap:4px;flex-wrap:wrap;justify-content:space-between}.text-button{font-size:11px;padding:6px}body:fullscreen .scene{height:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}:focus-visible{scroll-margin:20px}
/* Exhibition landscape: keep the complete round within one device viewport. */
.panel-top{display:none}
@media(min-width:641px){.masthead{height:68px}.roundbar{height:64px}.scene{height:calc(100svh - 184px);min-height:460px;aspect-ratio:auto}footer{min-height:52px;padding-top:4px;padding-bottom:4px}body:fullscreen .scene{height:calc(100svh - 184px)}body:fullscreen .masthead{height:68px}}
@media(min-width:901px) and (max-width:1400px){.panel{top:4%;padding:24px;width:32%}.panel h2{font-size:30px;margin-bottom:14px}.panel p{font-size:15px;margin-bottom:14px}.study{margin-top:12px;padding:6px 0 12px}.study>img{height:110px}.study p{font-size:14px}.primary{min-height:50px;padding:13px;font-size:17px}.minor{margin-top:12px!important;font-size:12px!important}.result{padding:20px}.result-symbol{display:none}.result-species{padding:8px 0;margin-bottom:12px}.result-species img{height:96px}.result-species h3{font-size:20px}.result-species p{font-size:14px;margin:0}.result .care{font-size:14px}.result .secondary{min-height:38px;padding:8px;margin-top:8px}}

@media(max-width:640px){.scene:not(.playing):not(.paused):not(.finished){min-height:810px}}
/* The landscape is now a depth-sorted canvas, not a flat backdrop. */
.artwork{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none;touch-action:manipulation}.shade{pointer-events:none}.specimen{opacity:0!important;filter:none!important;padding:0;border:0;min-height:0;outline:none}.specimen img,.seek-task{top:18px;bottom:auto;left:22px;transform:none;font-size:16px;padding:11px 16px}.feedback{top:18px;left:auto;right:22px;transform:none;max-width:55%;font-size:15px}.paused .artwork{filter:blur(8px) brightness(.72)}.panel h2{text-wrap:balance}.result-species img{object-fit:contain}.scene-title{z-index:1}.panel{z-index:5}.progress{z-index:4}#seek-task{z-index:3}
@media(max-width:640px){.artwork{height:300px}.playing .artwork,.paused .artwork{height:100%}.seek-task{top:14px;bottom:auto;left:50%;transform:translateX(-50%);max-width:90%;width:max-content;font-size:14px}.feedback{top:65px;left:8%;right:auto;transform:none;max-width:84%;width:84%}.result .secondary{white-space:normal}}

@media(max-width:640px){.playing .seek-task{top:14px;bottom:auto;padding:11px 16px}}