.experience-card{overflow:hidden;transition:transform .25s,box-shadow .25s}.experience-card:hover,.experience-card:focus-within{transform:translateY(-6px);box-shadow:0 18px 40px #15203a16}.challenge-art{display:block;width:100%;height:160px;object-fit:contain;margin:18px 0 0;transition:transform .35s}.experience-card:hover .challenge-art{transform:rotate(-3deg) scale(1.04)}.experience-card h3{margin-top:18px}.hero-art{padding:0;background:#17377c;transform:rotate(2deg)}.hero-art .studio-image{width:100%;height:300px;object-fit:cover;display:block}.hero-art .studio-caption{padding:20px 24px;color:white;margin:0;display:flex;gap:15px;align-items:center;font-weight:700;font-size:16px}.studio-caption span{background:#ff9934;color:#172033;border-radius:50%;display:grid;place-items:center;width:40px;height:40px;font-size:25px;flex-shrink:0}.hero-art:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#ffffff30 50%,transparent 65%);transform:translateX(-150%);pointer-events:none;animation:studio-shine 4s ease-out 1}.answer{display:flex;align-items:center;gap:14px;transition:border-color .2s,background .2s,transform .2s}.answer:before{content:"→";display:grid;place-items:center;flex:0 0 28px;height:28px;border-radius:50%;background:#e6edff;color:#315ff4;font-weight:800}.answer.correct:before{content:"✓";background:#187644;color:white}.answer.incorrect:before{content:"×";background:#ab4c19;color:white}.answer.correct{animation:answer-pop .35s ease-out}.feedback:not(:empty){animation:feedback-in .3s ease-out}.result-medal{display:inline-grid;place-items:center;width:70px;height:70px;border-radius:50%;background:#fff0cd;color:#975500;font-size:40px;margin-top:20px;border:5px solid #ffb34d}.time-result{position:relative;overflow:hidden}.time-result:before{content:"◷";position:absolute;right:22px;top:20px;font-size:54px;color:#ffffff25;pointer-events:none}.time-result>span{display:block;padding-right:40px}.visual-meter{height:10px;border-radius:10px;background:#ffffff25;overflow:hidden;margin:20px 0}.visual-meter-fill{height:100%;width:50%;background:#ffad50;border-radius:10px;transition:width .3s}.visual-enter{animation:feedback-in .55s ease-out}.game-panel:has(#game-result:not([hidden])) .result-medal{animation:answer-pop .5s ease-out}@keyframes studio-shine{to{transform:translateX(150%)}}@keyframes answer-pop{0%{transform:scale(.98)}65%{transform:scale(1.015)}100%{transform:scale(1)}}@keyframes feedback-in{from{opacity:.5;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:550px){.hero-art{transform:none}.hero-art .studio-image{height:220px}.challenge-art{height:150px}}@media(prefers-reduced-motion:reduce){.hero-art:after,.answer.correct,.feedback:not(:empty),.visual-enter,.game-panel:has(#game-result:not([hidden])) .result-medal{animation:none}.experience-card,.challenge-art,.answer,.visual-meter-fill{transition:none}.experience-card:hover,.experience-card:focus-within,.experience-card:hover .challenge-art{transform:none}}
.sound-controls{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:24px}.sound-controls span{font-size:13px;color:#596171}.sound-controls button[aria-pressed="true"]{background:#234fc7}
.volume-control{display:flex;align-items:center;gap:10px;font-size:13px;color:#596171}.volume-control input{width:110px;min-height:32px;accent-color:#315ff4}
.experience-card,.challenge-art,.button{transition:transform .45s ease,box-shadow .45s ease}.experience-card:hover,.experience-card:focus-within{transform:translateY(-3px)}.experience-card:hover .challenge-art{transform:rotate(-1deg) scale(1.015)}.answer.correct{animation:none}.game-panel:has(#game-result:not([hidden])) .result-medal{animation:feedback-in .7s ease-out}.visual-meter-fill{transition:width .55s ease}.feedback:not(:empty){animation:feedback-in .45s ease-out}@media(prefers-reduced-motion:reduce){.experience-card,.challenge-art,.button,.visual-meter-fill{transition:none}.feedback:not(:empty),.game-panel:has(#game-result:not([hidden])) .result-medal{animation:none}.experience-card:hover,.experience-card:focus-within,.experience-card:hover .challenge-art{transform:none}}