.catch-page{max-width:1260px;margin:20px auto;padding:0 12px;font-family:"Zen Maru Gothic",sans-serif;color:#442714}.catch-page>h1,.catch-page>p{text-align:center}.catch-page>h1{font-size:24px;margin:6px}.catch-page>p{margin:8px}.catch{position:relative;container-type:inline-size;isolation:isolate;aspect-ratio:16/9;width:100%;overflow:hidden;border:3px solid #6b4223;border-radius:22px;background:#d8df8d url(assets/forest.webp) center/cover;color:#40240f;font-weight:900}.catch *{box-sizing:border-box}.catch [hidden]{display:none!important}.catch button{font:inherit;color:#40240f;background:#fff6df;border:2px solid #81502b;border-radius:16px;min-height:36px;padding:.5em .8em;cursor:pointer;line-height:1.2;box-shadow:0 3px 0 #6a432a;font-size:clamp(12px,1.5cqw,22px)}.catch button:active{transform:translateY(2px);box-shadow:0 1px 0 #6a432a}.catch button:focus-visible,.catch canvas:focus-visible{outline:4px solid #00796f;outline-offset:3px}.catch button:disabled{opacity:.65;cursor:wait}.catch .primary{color:#fffbe8;background:#007d75;border-color:#034b45;box-shadow:0 4px 0 #034b45}.catch .big{font-size:clamp(22px,3.3cqw,45px);width:100%;border-radius:24px}.catch .utility{position:absolute;right:1%;top:1.5%;display:flex;gap:6px;z-index:5}.catch .utility button{font-size:clamp(11px,1.2cqw,18px);min-height:34px;padding:.45em .7em}.catch .scene{height:100%;width:100%}.catch .intro{display:grid;grid-template-columns:44% 56%;padding:4% 3% 2%;gap:0}.catch .hero{display:flex;align-items:flex-end;justify-content:center;padding:4% 2% 5%}.catch .hero img{width:95%;max-height:98%;object-fit:contain;filter:drop-shadow(0 6px 2px #3f562633)}.catch .welcome{text-align:center;align-self:center;display:flex;flex-direction:column;gap:1cqw;align-items:center;padding:1% 5%;background:#fff5deed;border:3px solid #9a6635;border-radius:28px}.catch .eyebrow{margin:0;font-size:clamp(12px,1.5cqw,22px)}.catch .welcome h2{font-size:clamp(27px,4.5cqw,62px);line-height:1.02;color:#ad390a;margin:0;text-shadow:2px 2px #fff}.catch .welcome h2 br{display:none}.catch .subtitle{font-size:clamp(14px,2cqw,29px);margin:0}.catch .subtitle b{color:#00776d;font-size:1.4em}.catch .legend{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;width:100%}.catch .legend>div{display:flex;flex-direction:column;align-items:center;background:#fff9e9;border:1px solid #cba777;border-radius:12px;padding:4px;font-size:clamp(10px,1.25cqw,18px)}.catch .legend img{width:3.5cqw;height:3.5cqw;object-fit:contain}.catch .legend b{font-size:1.5em}.catch .best,.catch .hint{margin:0;font-size:clamp(11px,1.5cqw,21px)}.catch .best b{font-size:1.4em}.catch #load-status:empty{display:none}.catch #load-status{margin:0;font-size:13px}.catch .play{display:grid;grid-template-columns:78% 22%;background:#f8ebc9}.catch .field-wrap{display:flex;flex-direction:column;justify-content:center;min-width:0;background:#e0d788}.catch .field{position:relative;width:100%;aspect-ratio:8/5;overflow:hidden}.catch canvas{display:block;width:100%;height:100%;touch-action:none;cursor:ew-resize}.catch .countdown{position:absolute;inset:0;display:grid;place-content:center;pointer-events:none;font-size:clamp(30px,8cqw,110px);color:#fff8df;text-shadow:3px 3px #523117,-2px -2px #523117}.catch .countdown:empty{display:none}.catch .move-controls{display:flex;align-items:center;justify-content:center;gap:2%;padding:3px;font-size:clamp(11px,1.3cqw,18px);min-height:38px}.catch .move-controls button{width:16%;padding:0;touch-action:none}.catch .hud{display:flex;flex-direction:column;gap:.6cqw;padding:4.5cqw 5% 3%;min-height:0;overflow:hidden;border-left:3px solid #86532c;text-align:center}.catch .hud h2{font-size:clamp(15px,2cqw,30px);line-height:1.1;margin:0;color:#ad390a}.catch .clock{background:#ffebc4;border-radius:13px;padding:4px;font-size:clamp(12px,1.35cqw,22px)}.catch .clock b{font-size:1.8em;color:#b13d0c}.catch .clock.low{background:#ffcfb9}.catch .points{background:#fff6c0;border:2px solid #d8a130;border-radius:15px;font-size:clamp(14px,2cqw,30px);line-height:1.05;padding:8px 0}.catch .points b{font-size:2.6em}.catch .combo{font-size:clamp(11px,1.45cqw,22px);padding:3px;background:#ffe1ca;border-radius:10px}.catch .hud .legend{grid-template-columns:1fr;gap:2px;flex:1;min-height:0}.catch .hud .legend>div{flex-direction:row;justify-content:space-around;min-height:0;padding:1px;font-size:clamp(10px,1.2cqw,18px)}.catch .hud .legend img{width:2.8cqw;height:2.8cqw}.catch .hud-buttons{display:grid;grid-template-columns:1fr;gap:5px}.catch .hud-buttons button{font-size:clamp(11px,1.2cqw,18px);padding:.3em;min-height:32px}.catch .result{display:grid;grid-template-columns:40% 60%;padding:6% 3% 3%;gap:1%}.catch .harvest{text-align:center;display:flex;flex-direction:column;justify-content:flex-end;min-height:0}.catch .harvest h2{font-size:clamp(22px,3.4cqw,48px);line-height:1.15;color:#8e2d05;text-shadow:2px 2px #fff;margin:0}.catch .harvest img{height:80%;width:100%;object-fit:contain;min-height:0}.catch .certificate{background:#fff9e5f5;border:3px solid #89542b;border-radius:26px;padding:2% 4%;display:flex;flex-direction:column;align-items:center;justify-content:space-around;min-height:0;text-align:center}.catch .certificate p,.catch .certificate h3{margin:0}.catch .result-score{font-size:clamp(24px,4cqw,55px);line-height:1}.catch .result-score b{font-size:2em;color:#bf420b}.catch .stars{display:flex;justify-content:center;gap:5px}.catch .stars img{width:4cqw;height:4cqw;object-fit:contain}.catch .stars img.dim{opacity:.2;filter:grayscale(1)}.catch .certificate h3{font-size:clamp(16px,2.1cqw,30px)}.catch .certificate>p:not(.result-score){font-size:clamp(12px,1.5cqw,23px)}.catch .tallies{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;width:100%}.catch .tallies>div{display:flex;align-items:center;justify-content:center;gap:3px;border:1px solid #b28a55;border-radius:12px;padding:4px;font-size:clamp(11px,1.5cqw,22px)}.catch .tallies img{width:3cqw;height:3cqw;object-fit:contain}.catch .result-buttons{display:flex;width:100%;gap:8px}.catch .result-buttons button{flex:1;font-size:clamp(15px,2cqw,28px)}.catch .veil{position:absolute;inset:0;background:#2a271bcc;display:grid;place-items:center;z-index:10;padding:2%}.catch .dialog{background:#fff7e3;border:3px solid #925d31;border-radius:22px;padding:2% 4%;width:78%;max-height:98%;overflow:auto;text-align:center;box-shadow:0 9px 0 #442714;font-size:clamp(13px,1.7cqw,24px)}.catch .dialog h2{margin:0 0 12px;font-size:1.6em}.catch .dialog p{margin:9px 0}.catch #dialog-actions{display:flex;justify-content:center;gap:10px;margin-top:14px}.catch #dialog-actions button{min-width:28%;font-size:1.1em}.catch .sound-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0}.catch .sound-row button{min-width:40%;font-size:1em}.catch input[type=range]{width:65%;accent-color:#007d75;min-height:36px}.catch .sr-only{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.catch:fullscreen{width:100vw;height:100dvh;aspect-ratio:auto;border:0;border-radius:0}.parent-note{font-size:14px;line-height:1.8}.catch .dialog .legend img{width:5cqw;height:5cqw}
@media(max-width:600px) and (orientation:portrait){.catch{height:740px;aspect-ratio:auto}.catch .utility{top:8px;right:8px}.catch .utility button{font-size:13px}.catch .intro{display:flex;flex-direction:column;padding:46px 14px 12px}.catch .hero{height:32%;padding:0}.catch .hero img{height:100%;width:auto}.catch .welcome{flex:1;width:100%;padding:10px;gap:10px}.catch .welcome h2{font-size:34px}.catch .subtitle{font-size:17px}.catch .legend>div{font-size:12px}.catch .legend img{width:36px;height:36px}.catch .best,.catch .hint{font-size:14px}.catch .big{font-size:25px}.catch .welcome>button{font-size:17px}.catch .play{display:flex;flex-direction:column;padding-top:48px}.catch .field-wrap{flex:none}.catch .move-controls{font-size:12px;min-height:44px}.catch .move-controls button{font-size:22px;min-height:38px}.catch .hud{padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:9px;border-left:0;border-top:2px solid #86532c;flex:1;align-content:space-evenly}.catch .hud h2{font-size:20px;grid-column:1/-1}.catch .hud h2 br{display:none}.catch .clock{font-size:15px}.catch .points{font-size:17px}.catch .combo{font-size:15px;grid-column:1/-1}.catch .hud .legend{grid-column:1/-1;grid-template-columns:repeat(4,1fr)}.catch .hud .legend>div{flex-direction:column;font-size:12px}.catch .hud .legend img{width:30px;height:30px}.catch .hud-buttons{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.catch .hud-buttons button{font-size:13px;min-height:38px}.catch .result{display:flex;flex-direction:column;padding:48px 12px 15px;gap:10px}.catch .harvest{height:32%}.catch .harvest h2{font-size:26px}.catch .harvest img{height:calc(100% - 32px)}.catch .certificate{flex:1;padding:12px;gap:8px}.catch .result-score{font-size:32px}.catch .stars img{width:34px;height:34px}.catch .certificate h3{font-size:20px}.catch .certificate>p:not(.result-score){font-size:15px}.catch .tallies img{width:30px;height:30px}.catch .tallies>div{flex-direction:column;font-size:14px}.catch .result-buttons button{font-size:17px;min-height:46px}.catch .dialog{width:96%;padding:18px 12px;font-size:15px}.catch .dialog .legend img{width:34px;height:34px}.catch .countdown{font-size:52px}}
@media(max-height:450px) and (orientation:landscape){.catch .hud{gap:3px;padding-top:42px}.catch .hud h2{font-size:14px}.catch .hud .legend span{display:none}.catch .hud .legend{grid-template-columns:repeat(2,1fr);flex:1}.catch .hud .legend img{width:23px;height:23px}.catch .hud .legend b{font-size:14px}.catch .hud-buttons{grid-template-columns:1fr 1fr;gap:3px}.catch .hud-buttons button{font-size:11px;min-height:32px}.catch .hud-buttons button:last-child{grid-column:1/-1}.catch .clock{padding:1px}.catch .points{padding:3px}.catch .move-controls{min-height:36px}.catch .intro{padding-top:4%}.catch .welcome{gap:5px}.catch .welcome h2{font-size:30px}.catch .welcome .legend>div{font-size:11px}.catch .welcome .legend img{width:26px;height:26px}.catch .welcome .big{font-size:23px}.catch .dialog{font-size:14px}.catch .dialog h2{margin-bottom:6px}.catch .dialog p{margin:5px 0}}
@media(prefers-reduced-motion:reduce){.catch *{scroll-behavior:auto}}

.catch .field-wrap{container-type:size;align-items:center}.catch .field{flex:none;width:min(100%,calc((100cqh - 44px)*1.6))}.catch .move-controls{width:100%;flex:none}
@media(max-width:600px) and (orientation:portrait){.catch .field-wrap{container-type:inline-size}.catch .field{width:100%}}

@media(max-width:600px) and (orientation:portrait){.catch .welcome{justify-content:space-evenly}}

@media(max-width:600px) and (orientation:portrait){.catch .hud .points{font-size:22px}.catch .hud .clock{font-size:18px}.catch .hud .combo{font-size:17px}.catch .hud .legend img{width:42px;height:42px}.catch .hud-buttons button{min-height:44px}}

.catch{line-height:1.35}.catch .intro{grid-template-rows:minmax(0,1fr)}.catch .hero{min-height:0}.catch .hero img{height:100%;width:100%;object-fit:contain}.catch .welcome{max-height:100%}
@media(max-height:450px) and (orientation:landscape){.catch .intro{padding:40px 3% 8px}.catch .welcome{padding:7px 5%;gap:4px}.catch .welcome h2{font-size:28px}.catch .welcome .subtitle{font-size:16px}.catch .welcome .best,.catch .welcome .hint{font-size:12px}.catch .welcome .big{padding:.35em}.catch .welcome>button:not(.big){min-height:32px;padding:.3em .7em}}

@media(min-width:1000px) and (min-height:700px){.catch:fullscreen .result-score{font-size:5cqw}.catch:fullscreen .certificate h3{font-size:2.2cqw}.catch:fullscreen .certificate>p:not(.result-score){font-size:1.7cqw}.catch:fullscreen .result-buttons button{font-size:2cqw}.catch:fullscreen .tallies>div{font-size:1.8cqw}}