.treff-task-wheel{text-align:center;background:#edf6f3;border-radius:22px;min-height:380px;padding:18px}.treff-reel-prompt,.treff-reel-caption{color:#173e45;font-size:clamp(20px,2.2vw,28px);font-weight:800}.treff-task-wheel h2.treff-reel-window{isolation:isolate;background:#fff;border:2px solid #173e45;border-radius:18px;width:100%;max-width:640px;height:240px;margin:16px auto;font-size:clamp(19px,3vw,28px);line-height:1.2;display:block;position:relative;overflow:hidden}.treff-reel-window:before,.treff-reel-window:after{content:"";z-index:2;pointer-events:none;height:80px;position:absolute;left:0;right:0}.treff-reel-window:before{background:linear-gradient(#fff,#ffffff80);top:0}.treff-reel-window:after{background:linear-gradient(#ffffff80,#fff);bottom:0}.treff-reel-selection{z-index:-1;background:#d8eee7;border-block:2px solid #087f7a;height:80px;position:absolute;top:80px;left:0;right:0}.treff-reel-strip{animation:treff-reel-roll var(--reel-duration) cubic-bezier(.2,.35,.25,1) var(--reel-delay) forwards;display:block;position:absolute;top:80px;left:0;right:0}.treff-reel-name{color:#173e45;overflow-wrap:anywhere;justify-content:center;align-items:center;height:80px;padding:0 14px;font-weight:700;display:flex}.treff-reel-announcement{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.treff-reel-strip.reduced{transform:translateY(var(--reel-end));animation:none}@keyframes treff-reel-roll{0%{transform:translateY(0)}to{transform:translateY(var(--reel-end))}}@media (prefers-reduced-motion:reduce){.treff-reel-strip{transform:translateY(var(--reel-end));animation:none}}.fish-family-screen{min-width:0}.fish-family-screen progress{accent-color:#153f4c;width:100%}.fish-family-panel{background-color:#e0f7f6;background-image:linear-gradient(#dcf4f233, #ebf9f64d), var(--task-background-image,url(/assets/task-backgrounds/riff-1.webp));background-position:50%;background-size:cover;border:1px solid #8bbfc4;border-radius:20px;position:relative;overflow:hidden}.fish-family-panel h2{color:#163d4a;text-align:center;text-shadow:0 1px 5px #fff;margin:18px 12px 10px;font-size:clamp(1.05rem,2.2vw,1.65rem)}.fish-family-arena{width:100%;height:clamp(360px,55svh,760px);position:relative;overflow:hidden}.fish-family-fish{color:#183e49;cursor:pointer;touch-action:manipulation;background:0 0;border:0;width:28%;height:26%;padding:0;position:absolute;transform:translate(-50%,-50%)}.fish-family-count-7 .fish-family-fish{width:21%;height:23%}.fish-family-fish:disabled{opacity:1;cursor:default}.fish-family-fish>span{width:100%;height:100%;display:block}.fish-family-swim{width:100%;height:100%;transform:rotate(var(--fish-tilt,0deg)) scaleX(var(--fish-facing,1));display:block}.fish-family-fish.is-exiting{z-index:3;pointer-events:none}.fish-family-fish.is-exiting .fish-family-swim{transform:rotate(var(--family-exit-rotate,0deg)) scale(var(--family-exit-scale,1));opacity:var(--family-exit-opacity,1);filter:drop-shadow(0 6px 7px #11394347)}.fish-family-fish.fish-family-exit-retreat .fish-family-swim{transform:rotate(var(--family-exit-rotate,0deg)) scaleX(-1) scale(var(--family-exit-scale,1))}.fish-family-swim svg>g>path:first-child{transform-box:fill-box;transform-origin:100%;animation:.9s ease-in-out infinite alternate family-tail-beat}@keyframes family-tail-beat{0%{transform:scaleX(.96)}to{transform:scaleX(1.03)}}.fish-family-fish svg{width:100%;height:100%;display:block}.fish-family-fish:focus-visible{outline-offset:2px;border-radius:8px;outline:2px solid #153f4c}.fish-family-wiggle{animation:.12s ease-in-out 4 fish-family-wiggle}@keyframes fish-family-wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-9deg)}75%{transform:rotate(9deg)}}.fish-family-panel.is-explanation{background:#f7fbfa;border-color:#0000;place-items:center;min-height:clamp(360px,55svh,760px);display:grid}.fish-family-explanation{color:#163d4a;text-align:center;width:100%;padding:clamp(24px,6vw,72px);animation:1s ease-in-out both fish-family-explanation-fade}.fish-family-explanation h3{margin:0;font-size:clamp(1.45rem,4vw,2.5rem)}@keyframes fish-family-explanation-fade{0%{opacity:0}50%{opacity:1}to{opacity:0}}.fish-family-debug{margin-top:1rem}.fish-family-debug pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:400px;overflow:auto}.active-task-shell .fish-family-screen{grid-template-rows:auto minmax(0,1fr) auto;display:grid}.active-task-shell .fish-family-panel{grid-template-rows:auto minmax(0,1fr);min-height:0;display:grid}.active-task-shell .fish-family-panel.is-explanation{grid-template-rows:minmax(0,1fr)}.active-task-shell .fish-family-arena{height:100%;min-height:0}.fish-family-debug[open]{z-index:10;background:#fff;border:2px solid #183e49;padding:12px;position:absolute;inset:50px 12px 12px;overflow:auto}@media (max-height:500px) and (orientation:landscape){.fish-family-arena{height:300px}}@media (prefers-reduced-motion:reduce){.fish-family-swim{transform:scaleX(var(--fish-facing,1))}.fish-family-fish.is-exiting .fish-family-swim{transform:scale(var(--family-exit-scale,1))}.fish-family-swim svg>g>path:first-child,.fish-family-wiggle,.fish-family-explanation{animation:none}}.training-action-area.task-background .memory-comparison-scene[data-scene]{background-position:50%;background-size:cover;padding-top:24px;position:relative;background-image:linear-gradient(var(--memory-light-top), var(--memory-light-bottom)), var(--memory-scene-image)!important}.memory-comparison-scene[data-scene=day]{--memory-light-top:#fff4cd0f;--memory-light-bottom:#f5fbeb14}.memory-comparison-scene[data-scene=twilight]{--memory-light-top:#283a6461;--memory-light-bottom:#465e7747}.memory-comparison-scene[data-scene=neutral]{--memory-light-top:#dce9e8;--memory-light-bottom:#dce9e8}.memory-comparison-scene[data-scene=twilight] h2{color:#163d4a;text-shadow:0 1px 5px #ffffffb3}.change-detection-screen{min-width:0}.change-detection-screen progress{accent-color:#153f4c;max-width:45%}.change-detection-panel{background:linear-gradient(var(--memory-scene-tint,#e0f7f638), var(--memory-scene-tint,#e0f7f638)), var(--task-background-image,url(/assets/task-backgrounds/riff-5.webp)) center / cover;border:1px solid #8bbfc4;border-radius:20px;grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden}.change-detection-panel h2{text-align:center;color:#163d4a;text-shadow:0 1px 5px #fff;margin:12px;font-size:clamp(1rem,2.2vw,1.6rem)}.change-detection-arena{height:clamp(360px,58svh,760px);min-height:0;position:relative}.change-detection-fish{cursor:pointer;touch-action:manipulation;background:0 0;border:0;height:28%;padding:0;position:absolute;transform:translate(-50%,-50%)}.change-detection-fish:disabled{opacity:1;cursor:default}.change-detection-fish svg{width:100%;height:100%;display:block}.change-detection-fish:focus-visible{border-radius:12px;outline:3px solid #153f4c}.change-detection-fish.is-diving{animation:.65s ease-in forwards change-detection-escape}.active-task-shell .change-detection-screen{grid-template-rows:auto minmax(0,1fr);display:grid}.active-task-shell .change-detection-arena{height:100%}.change-detection-panel{position:relative}.change-detection-fish:disabled:focus{box-shadow:none;outline:none}@keyframes change-detection-escape{0%{transform:translate(-50%,-50%)}16%{transform:translate(-57%,-60%)rotate(-12deg)scale(1.08)}36%{transform:translate(-30%,-32%)rotate(18deg)}to{opacity:0;transform:translate(145%,290%)rotate(75deg)scale(.2)}}.change-detection-panel:after{content:"";z-index:4;opacity:0;pointer-events:none;background:#f3f3ef;position:absolute;inset:0}.change-detection-panel[data-phase=fade]:after{animation:.2s linear forwards change-scene-fade}.change-detection-panel[data-phase=blank]:after{opacity:1}@keyframes change-scene-fade{to{opacity:1}}.change-detection-screen[data-reduced-motion] .change-detection-fish.is-diving{opacity:0;animation:none}@media (prefers-reduced-motion:reduce){.change-detection-fish.is-diving{opacity:0;animation:none}}.change-detection-fish.is-correct-preview{outline-offset:3px;background:#e6fbf1cc;border-radius:18px;outline:4px solid #087f7a}.change-detection-panel[data-phase=correction] h2{color:#07564d}.school-switch-task{width:min(100%,1000px);color:var(--primary-dark,#163d4a);margin:auto;padding:8px 12px}.school-switch-task h2{text-align:center;margin:6px 0;font-size:24px}.school-switch-rule{text-align:center;max-width:650px;margin:4px auto 12px;font-size:18px;font-weight:700;line-height:1.35}.school-switch-layout{gap:12px;display:grid}.school-switch-arena{background:#e6f7f4c7;border-radius:18px;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:8px;display:grid}.school-switch-cell{border:1px solid #0000;place-items:center;min-height:108px;display:grid;position:relative}.school-switch-cell button{cursor:pointer;touch-action:manipulation;width:min(140px,100% - 10px);min-width:48px;height:90px;transform:translate(var(--fish-x), var(--fish-y));background:0 0;border:0;padding:0}.school-switch-cell svg{width:100%;height:100%;transform:scale(var(--fish-scale));display:block}.school-switch-cell button:focus-visible{border-radius:12px;outline:3px solid #e8b94f}.school-switch-cell.is-gathered{border:1px dashed #7faaa1;border-radius:14px}.school-switch-cell.is-gathered button{visibility:hidden}.school-switch-collection{background:#ffffffde;border-radius:14px;min-height:82px;padding:8px 12px}.school-switch-collection>span{font-size:14px}.school-switch-collection>div{justify-content:center;display:flex}.school-switch-collection>div>span{width:min(12%,66px);height:45px}.school-switch-collection svg{width:100%;height:100%;transform:scale(var(--fish-scale))}.school-switch-collection.is-complete>div{animation:.65s ease-in .4s both school-depart}.school-switch-feedback{text-align:center;min-height:24px;margin:8px 0;font-size:16px}.school-switch-flight{pointer-events:none;z-index:30;height:90px;animation:.42s ease-in-out both school-gather;position:fixed}.school-switch-flight svg{width:100%;height:100%;transform:scale(var(--fish-scale))}@keyframes school-gather{to{transform:translate(var(--flight-x), var(--flight-y)) scale(.45);opacity:.2}}@keyframes school-depart{to{opacity:0;transform:translate(110%)}}@media (max-width:600px){.school-switch-arena{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px}.school-switch-cell{min-height:90px}.school-switch-task{padding:4px 8px}.school-switch-rule{font-size:16px}.school-switch-cell button{height:80px}}@media (max-height:500px) and (min-width:500px){.school-switch-layout{grid-template-columns:1fr 100px}.school-switch-arena{grid-template-columns:repeat(4,minmax(0,1fr))}.school-switch-cell{min-height:78px}.school-switch-cell button{height:68px}.school-switch-collection>div{flex-wrap:wrap}.school-switch-collection>div>span{width:40px;height:30px}}@media (prefers-reduced-motion:reduce){.school-switch-flight{display:none}.school-switch-collection.is-complete>div{animation:none}}.school-static .school-switch-collection.is-complete>div{animation:none}.school-switch-task{grid-template-rows:auto auto auto auto minmax(0,1fr) auto;height:100%;min-height:0;display:grid}.school-switch-task>p[role=note]{text-align:center;margin:2px 0;font-size:12px;line-height:1.2}.school-switch-layout{grid-template-rows:minmax(0,1fr) 72px;min-height:0}.school-switch-arena{grid-auto-rows:minmax(54px,1fr);min-height:0}.school-switch-cell{min-height:0}.school-switch-cell button{height:min(90px,100% - 8px);min-height:48px}.school-switch-collection{min-height:0}@media (max-height:500px) and (min-width:500px){.school-switch-task{padding-block:0}.school-switch-task h2{margin:0;font-size:18px}.school-switch-rule{max-width:none;margin:2px 0 4px;font-size:14px;line-height:1.2}.school-switch-layout{grid-template-rows:minmax(0,1fr);gap:8px}.school-switch-arena{gap:4px;padding:4px}.school-switch-feedback{min-height:18px;margin:2px 0;font-size:13px;line-height:18px}}.school-switch-arena{background-image:linear-gradient(#dcf4f233, #ebf9f64d), var(--memory-scene-image);background-position:50%;background-size:cover;padding:0;display:block;position:relative;overflow:hidden}.school-switch-cell{will-change:transform;display:block;position:absolute;top:0;left:0}.school-switch-cell button{width:100%;height:100%;min-height:48px;transform:none}.school-switch-cell svg{transform:scale(var(--fish-scale)) scaleX(var(--swim-facing,1))}.school-switch-cell.is-gathered{visibility:hidden;pointer-events:none;border:0}