/* PLAY_CONTROLS_V7_20260914 */
.game-card{padding-top:18px}
.word-audio-row{gap:18px;align-items:center}
.task-prompt{font-size:23px;line-height:1.2}
.task-subprompt{font-size:12.5px;line-height:1.35;margin-top:5px}

/* Main word sound: intentionally the most obvious listening control on the page. */
.audio-orb.word-sound-button{
  width:92px;height:92px;min-width:92px;border-radius:30px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  border:3px solid #fff;
  background:linear-gradient(145deg,#ff9b78 0%,#f27c86 52%,#e96f8e 100%);
  color:#fff;
  box-shadow:0 13px 28px #cf6e7845,0 0 0 6px #f8c8bb45,inset 0 1px 0 #ffffff8a;
  position:relative;overflow:visible;
  transition:transform .14s ease,box-shadow .14s ease;
}
.audio-orb.word-sound-button:before{
  content:"LISTEN";position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:#fff;color:#c65f6d;border-radius:999px;padding:4px 9px;
  font-size:8px;font-weight:950;letter-spacing:.13em;box-shadow:0 5px 12px #573c4020;
}
.audio-orb.word-sound-button .speaker-glyph{font-size:35px;line-height:1;filter:drop-shadow(0 3px 5px #7f3c4630)}
.audio-orb.word-sound-button small{font-size:10px;font-weight:950;letter-spacing:.14em;line-height:1;color:#fff}
.audio-orb.word-sound-button:active{transform:scale(.96)}
.audio-orb.word-sound-button.playing{animation:wordPulse .72s ease infinite alternate;box-shadow:0 14px 30px #cf6e7855,0 0 0 9px #f8c8bb60}
@keyframes wordPulse{to{transform:scale(1.055)}}

.word-visual-cue.audio-clue-panel{
  width:min(870px,100%);margin:16px auto 11px;padding:13px;
  display:grid;grid-template-columns:124px minmax(0,1fr);gap:14px;align-items:stretch;
  border-radius:28px;background:linear-gradient(145deg,#fffdf8,#f7f2e9 58%,#eef5e9);
  box-shadow:inset 0 0 0 1px #ffffff,0 9px 25px #4e453615;
}
.cue-picture-tile{
  min-height:112px;border:0;border-radius:23px;padding:0;
  background:linear-gradient(155deg,#eaf5e2,#fff1df);
  display:grid;place-items:center;position:relative;overflow:hidden;
  box-shadow:inset 0 0 0 1px #ffffffd9,0 5px 13px #4a4b3511;
  transition:transform .14s ease,box-shadow .14s ease;
}
.cue-picture-tile:active{transform:scale(.97)}
.cue-picture-emoji{font-size:60px;line-height:1;filter:drop-shadow(0 7px 8px #4b403018)}
.cue-picture-sound{
  position:absolute;left:50%;bottom:8px;transform:translateX(-50%);white-space:nowrap;
  font-size:9px;font-weight:950;letter-spacing:.11em;color:#526b56;background:#ffffffd9;
  padding:5px 8px;border-radius:999px;box-shadow:0 4px 9px #4c4c3814;
}
.cue-listen-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.listen-card{
  appearance:none;-webkit-appearance:none;border:0;border-radius:20px;min-height:106px;padding:13px 12px;
  display:grid;grid-template-columns:42px 1fr;grid-template-rows:1fr auto;column-gap:9px;text-align:left;align-items:center;
  color:#4a4249;box-shadow:inset 0 0 0 1px #ffffffc8,0 7px 16px #493c3512;
  transition:transform .14s ease,box-shadow .14s ease,filter .14s ease;
}
.listen-card:active{transform:scale(.97)}
.listen-card.english{background:linear-gradient(145deg,#e9f2ff,#f4f8ff)}
.listen-card.japanese{background:linear-gradient(145deg,#f8edf7,#fff5fb)}
.listen-card.example{background:linear-gradient(145deg,#fff1df,#fff8ec)}
.listen-card .listen-icon{width:42px;height:42px;border-radius:14px;background:#ffffffc9;display:grid;place-items:center;font-size:22px;grid-row:1}
.listen-card .listen-copy{min-width:0;grid-row:1}.listen-card small{display:block;font-size:9px;line-height:1;font-weight:950;letter-spacing:.12em;color:#887e86;margin-bottom:6px}
.listen-card b{display:block;font-size:15px;line-height:1.13;font-weight:950;color:#423b43}
.listen-card .listen-action{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;margin-top:5px;font-size:10px;font-weight:900;color:#766b73}
.listen-card .sound-bars{letter-spacing:1px;font-size:13px;opacity:.72}
.listen-card.speaking{transform:translateY(-2px);box-shadow:0 10px 24px #52627622,inset 0 0 0 2px #ffffff;filter:saturate(1.08)}
.listen-card.speaking .listen-icon{animation:listenPulse .58s ease infinite alternate}.listen-card.speaking .sound-bars{animation:barsPulse .45s ease infinite alternate}
@keyframes listenPulse{to{transform:scale(1.1)}}@keyframes barsPulse{to{letter-spacing:4px;opacity:1}}

/* Hint + Peek are now large, self-explanatory secondary controls instead of tiny utility chips. */
.help-row.assist-dock{
  width:min(560px,100%);margin:10px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:12px;
}
.help-row.assist-dock .assist-btn{
  min-height:58px;border-radius:19px;padding:9px 14px;display:flex;align-items:center;justify-content:flex-start;gap:11px;text-align:left;
  box-shadow:0 7px 16px #4b3b4a14,inset 0 0 0 1px #ffffffc8;
}
.help-row.assist-dock .hint{background:linear-gradient(145deg,#eee3fb,#f7f0ff);color:#665078}
.help-row.assist-dock .peek{background:linear-gradient(145deg,#e6f1fb,#f3f8fd);color:#4d6679}
.assist-icon{width:38px;height:38px;min-width:38px;border-radius:13px;background:#ffffffb8;display:grid;place-items:center;font-size:20px}
.assist-btn span:last-child{display:flex;flex-direction:column;gap:1px}.assist-btn b{font-size:15px;line-height:1.1}.assist-btn small{font-size:9.5px;font-weight:800;opacity:.76}
.help-row.assist-dock .assist-btn:active{transform:scale(.975)}

@media(max-width:820px){
  .audio-orb.word-sound-button{width:82px;height:82px;min-width:82px;border-radius:26px}.audio-orb.word-sound-button .speaker-glyph{font-size:31px}
  .word-visual-cue.audio-clue-panel{grid-template-columns:100px 1fr;padding:10px;gap:10px}.cue-picture-tile{min-height:94px}.cue-picture-emoji{font-size:50px}
  .listen-card{min-height:94px;padding:10px 9px;grid-template-columns:35px 1fr;column-gap:7px}.listen-card .listen-icon{width:35px;height:35px;font-size:19px;border-radius:11px}.listen-card b{font-size:13px}.listen-card small{font-size:8px}.listen-card .listen-action{font-size:9px}
}
@media(max-width:620px){
  .word-audio-row{gap:12px}.audio-orb.word-sound-button{width:76px;height:76px;min-width:76px;border-radius:24px}
  .word-visual-cue.audio-clue-panel{grid-template-columns:82px 1fr}.cue-listen-grid{gap:6px}
  .listen-card{display:flex;flex-direction:column;justify-content:center;text-align:center;min-height:88px;gap:4px;padding:8px 5px}.listen-card .listen-copy{display:block}.listen-card small{margin-bottom:3px}.listen-card .listen-action{display:none}
  .help-row.assist-dock{gap:8px}.help-row.assist-dock .assist-btn{min-height:54px;padding:8px 10px}.assist-icon{width:34px;height:34px;min-width:34px}.assist-btn b{font-size:14px}.assist-btn small{display:none}
}