.sg-listen{max-width:1152px;margin:0 auto 28px;border:3px solid #b9e4df;border-radius:28px;padding:clamp(16px,3vw,28px);background:linear-gradient(130deg,#fff,#edfaf7);box-shadow:0 5px 0 #b9e4df;color:#173653}
.sg-listen h2{font-size:clamp(23px,4vw,32px);font-weight:950;margin:0 0 6px}.sg-listen p{font-weight:750;line-height:1.5}.sg-listen-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.sg-listen button{min-height:44px;border:2px solid #b9dedb;background:#fff;border-radius:14px;font:inherit;font-weight:850;color:#244660;cursor:pointer;padding:10px 16px}
.sg-listen button[aria-pressed="true"]{background:#dce9ff;border-color:#6366b8;color:#32286a}.sg-listen button:focus-visible{outline:3px solid #7c3aed;outline-offset:3px}
.sg-listen-stage{display:grid;grid-template-columns:1fr 2fr;gap:22px;align-items:start}.sg-listen-target{position:sticky;top:90px;text-align:center;background:white;border:2px solid #cfe7ec;border-radius:22px;padding:16px}
.sg-listen-glyph{display:block;font-family:Amiri,serif;font-size:90px;line-height:1.7;color:#075985}.sg-listen-name{font-size:20px;font-weight:900;overflow-wrap:anywhere}.sg-listen-repeat{margin:12px 0}
.sg-listen-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:10px}.sg-listen-grid button{display:flex;flex-direction:column;align-items:center;padding:4px 4px 9px;min-height:90px;box-shadow:0 3px 0 #d4e5e8}.sg-listen-grid [lang="ar"]{font:38px/1.7 Amiri,serif}.sg-listen-grid small{font-size:12px}
.sg-count-drops{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;font-size:24px;max-width:210px;margin:10px auto}.sg-count-drops[hidden]{display:none}.sg-count-drops span{width:30px}.sg-listen [role="status"]{font-size:14px;min-height:3em}.sg-listen-note{font-size:12px;margin-top:18px}
@media(max-width:550px){.sg-listen-stage{grid-template-columns:1fr}.sg-listen-target{position:static;display:grid;grid-template-columns:80px 1fr;column-gap:10px;align-items:center;padding:12px}.sg-listen-glyph{font-size:60px;grid-row:span 2}.sg-listen-target [role="status"],.sg-count-drops{grid-column:1/-1}.sg-listen-repeat{margin:6px 0}.sg-listen-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.sg-listen-grid button{min-width:0}.sg-listen-tabs button{flex:1}}