.step-player{margin:24px 0;padding:24px;border:2px solid #d7e4f8;border-radius:20px;background:#f8fbff;text-align:center}.step-player p{font-size:clamp(20px,3vw,28px);line-height:1.5;min-height:84px}.step-player>div:last-child{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.step-player button{border:0;border-radius:14px;background:var(--blue);color:#fff;padding:14px 18px;font-size:16px;font-weight:800;cursor:pointer}.step-player button:last-child{background:#fff;color:var(--ink);border:1px solid #bbc7dc}.step-progress{display:flex;justify-content:center;gap:7px}.step-progress i{width:10px;height:10px;border-radius:50%;background:#ccd5e5}.step-progress i.active{background:var(--coral);transform:scale(1.3)}
.soundboard{margin:30px clamp(24px,7vw,110px) 50px;padding:clamp(26px,4vw,46px);border-radius:28px;background:linear-gradient(145deg,#35258a,#1264aa);color:#fff;box-shadow:0 18px 50px #17213d2b}.soundboard h2{font-size:clamp(34px,5vw,54px);margin:8px 0}.sound-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:28px 0}.sound-grid button{min-height:125px;border:3px solid #ffffff80;border-radius:22px;background:#ffffff18;color:#fff;font-size:18px;font-weight:900;cursor:pointer;box-shadow:0 6px 0 #11183d55}.sound-grid button:active{transform:translateY(5px);box-shadow:0 1px 0 #11183d55}.sound-grid span{display:block;font-size:42px;margin-bottom:8px}.sound-grid strong{display:block}.stop-sounds{border:2px solid #fff;border-radius:99px;background:#fff;color:#20265a;padding:13px 20px;font-weight:900;cursor:pointer}@media(max-width:850px){.sound-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:520px){.sound-grid{grid-template-columns:repeat(2,1fr)}.sound-grid button{min-height:110px}}