.sbsent-hidden{display:none!important}
.sbsent-source-hidden{display:none!important}
.sbsent-wrap,.sbsent-wrap *{box-sizing:border-box!important;font-family:"Times New Roman",Times,serif!important}
.sbsent-wrap{width:98%!important;max-width:780px!important;margin:14px auto!important;color:#111!important}
.sbsent-launch-screen{text-align:center!important}
.sbsent-btn{cursor:pointer!important;font-size:17px!important;line-height:1.15!important;white-space:nowrap!important}
.sbsent-open{width:100%!important;min-height:52px!important;background:#111!important;color:#fff!important;border:0!important;border-radius:8px!important;font-weight:800!important}

.sbsent-study-screen{width:100%!important;background:#fff!important;border:3px solid #2b2b2b!important;border-radius:14px!important;padding:10px!important}
.sbsent-study-title{text-align:center!important;font-size:25px!important;font-weight:800!important;margin:4px 0 12px!important}
.sbsent-select-label{display:block!important;font-size:21px!important;font-weight:800!important;margin:4px 0 6px!important}
.sbsent-part-select{width:100%!important;min-height:50px!important;font-size:20px!important;font-weight:700!important;padding:6px 10px!important;border:3px solid #333!important;border-radius:8px!important;background:#fff!important}
.sbsent-part-title{text-align:center!important;font-size:22px!important;font-weight:800!important;color:#2145e6!important;margin:12px 0 8px!important}
.sbsent-study-list{max-height:58vh!important;overflow:auto!important;border:1px solid #ddd!important;border-radius:10px!important}
.sbsent-study-table{width:100%!important;border-collapse:collapse!important;table-layout:fixed!important}
.sbsent-study-table td{width:50%!important;font-size:16px!important;line-height:1.22!important;padding:7px 8px!important;border:1px solid #ddd!important;vertical-align:top!important;overflow-wrap:anywhere!important}
.sbsent-start,.sbsent-back{display:block!important;width:100%!important;min-height:50px!important;margin-top:10px!important;border-radius:7px!important;font-weight:900!important}
.sbsent-start{background:#111!important;color:#fff!important;border:0!important}
.sbsent-back{background:#ed2024!important;color:#fff!important;border:3px solid #a30f12!important}

.sbsent-quiz-screen{width:100%!important;max-width:100%!important;background:var(--sbsent-quiz-color,#050505)!important;color:#fff!important;border-radius:12px!important;padding:10px!important;overflow:hidden!important}
.sbsent-top{display:flex!important;justify-content:space-between!important;align-items:center!important;gap:8px!important}
.sbsent-title,.sbsent-score{font-size:18px!important;font-weight:900!important}.sbsent-score{white-space:nowrap!important}
.sbsent-progress{height:5px!important;background:#555!important;margin:9px 0 14px!important}.sbsent-progress span{display:block!important;width:0;height:100%!important;background:#fff!important;transition:width .2s ease!important}
.sbsent-question-row,.sbsent-answer-row{display:flex!important;width:100%!important;align-items:center!important;gap:10px!important}.sbsent-question-row{margin-bottom:18px!important}.sbsent-answer-row{margin-bottom:10px!important}
.sbsent-question-bubble,.sbsent-answer-bubble{position:relative!important;flex:1 1 auto!important;min-width:0!important;min-height:108px!important;background:#fff!important;color:#111!important;border:3px solid #222!important;border-radius:24px!important;padding:15px 17px!important;display:flex!important;align-items:center!important}
.sbsent-question{font-size:20px!important;line-height:1.35!important;font-weight:800!important;width:100%!important}.sbsent-heard{font-size:18px!important;line-height:1.35!important;font-weight:700!important;width:100%!important}
.sbsent-question-bubble:before{content:"";position:absolute;right:-13px;top:36px;width:23px;height:23px;background:#fff;border-top:3px solid #222;border-right:3px solid #222;transform:rotate(45deg)}
.sbsent-answer-bubble:before{content:"";position:absolute;left:-13px;top:36px;width:23px;height:23px;background:#fff;border-left:3px solid #222;border-bottom:3px solid #222;transform:rotate(45deg)}
.sbsent-computer{position:relative;flex:0 0 62px;width:62px;height:58px}.sbsent-monitor-screen{position:absolute;left:4px;top:2px;width:54px;height:38px;background:linear-gradient(135deg,#aee7ff,#2388bd);border:5px solid #e9eef2;outline:3px solid #222;border-radius:5px}.sbsent-monitor-neck{position:absolute;left:28px;top:41px;width:7px;height:10px;background:#e9eef2;border-left:2px solid #222;border-right:2px solid #222}.sbsent-monitor-base{position:absolute;left:15px;top:51px;width:34px;height:6px;background:#e9eef2;border:2px solid #222;border-radius:4px}
.sbsent-person{position:relative;flex:0 0 58px;width:58px;height:70px}.sbsent-person-head{position:absolute;left:17px;top:2px;width:26px;height:26px;background:#fff;border:4px solid #111;border-radius:50%}.sbsent-person-body{position:absolute;left:6px;bottom:0;width:48px;height:38px;background:#fff;border:4px solid #111;border-radius:26px 26px 4px 4px}
.sbsent-result{min-height:26px!important;text-align:center!important;font-size:17px!important;font-weight:800!important;color:#f2cc60!important}.sbsent-result.ok{color:#7ee787!important}.sbsent-result.warn{color:#f2cc60!important}
.sbsent-nav-row{display:grid!important;grid-template-columns:60px minmax(0,1fr) minmax(90px,1.1fr) 68px!important;gap:6px!important;margin-top:8px!important}.sbsent-nav-row button{width:100%!important;min-width:0!important;height:50px!important;background:#fff!important;color:#111!important;border:3px solid #222!important;border-radius:5px!important;font-weight:800!important;padding:6px!important}.sbsent-mic.is-listening{outline:3px solid #f2cc60!important}
.sbsent-type{display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(86px,.8fr) minmax(86px,.9fr)!important;gap:6px!important;margin-top:8px!important}.sbsent-type input,.sbsent-type button{height:50px!important;min-width:0!important;font-size:17px!important}.sbsent-type input{width:100%!important;padding:6px 8px!important;border:3px solid #222!important;background:#fff!important;color:#111!important}.sbsent-submit{background:#252525!important;color:#fff!important;border:2px solid #555!important}.sbsent-exit{background:#ed2024!important;color:#fff!important;border:3px solid #9b1013!important;font-weight:900!important}

@media(max-width:820px){
  .sbsent-wrap{width:98vw!important;max-width:98vw!important;margin-left:calc(50% - 49vw)!important;margin-right:0!important}
  .sbsent-study-screen,.sbsent-quiz-screen,.sbsent-launch-screen{width:100%!important;max-width:100%!important}
}
@media(max-width:480px){
  .sbsent-wrap{width:98vw!important;max-width:98vw!important}
  .sbsent-study-screen{padding:7px!important}.sbsent-study-title{font-size:22px!important}.sbsent-select-label{font-size:19px!important}.sbsent-part-select{font-size:18px!important}.sbsent-study-table td{font-size:16px!important;padding:6px!important}
  .sbsent-quiz-screen{padding:8px!important;border-radius:10px!important}
  .sbsent-title,.sbsent-score{font-size:15px!important}
  .sbsent-question-bubble,.sbsent-answer-bubble{min-height:96px!important;padding:12px 13px!important;border-radius:20px!important}.sbsent-question{font-size:17px!important}.sbsent-heard{font-size:16px!important}
  .sbsent-computer{flex-basis:50px;width:50px;height:49px}.sbsent-monitor-screen{width:44px;height:31px;border-width:4px;outline-width:2px}.sbsent-monitor-neck{left:23px;top:34px;height:9px}.sbsent-monitor-base{left:12px;top:43px;width:29px}
  .sbsent-person{flex-basis:48px;width:48px;height:59px}.sbsent-person-head{left:13px;width:23px;height:23px}.sbsent-person-body{left:4px;width:42px;height:33px}
  .sbsent-nav-row{grid-template-columns:50px minmax(0,1fr) minmax(88px,1.12fr) 60px!important;gap:5px!important}.sbsent-nav-row button{font-size:17px!important;height:48px!important;padding:5px 3px!important}
  .sbsent-type{grid-template-columns:minmax(0,1.45fr) minmax(82px,.82fr) minmax(82px,.9fr)!important;gap:5px!important}.sbsent-type input,.sbsent-type button{height:48px!important;font-size:17px!important}.sbsent-type button{padding:4px!important}
}


/* v1.1.0 — silver buttons, full input visibility, true mobile full-screen */
.sbsent-btn{
  border-radius:9px!important;
  background:linear-gradient(135deg,#f7f7f7 0%,#cfcfcf 35%,#ffffff 50%,#b8b8b8 72%,#eeeeee 100%)!important;
  color:#111!important;
  border:1px solid #8f8f8f!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 3px rgba(0,0,0,.24)!important;
  background-size:220% 100%!important;
  animation:sbsentSilverShine 2.8s linear infinite!important;
  font-weight:800!important;
}
.sbsent-open,
.sbsent-start,
.sbsent-back,
.sbsent-exit{
  border-radius:9px!important;
}
.sbsent-back,
.sbsent-exit{
  color:#111!important;
}
@keyframes sbsentSilverShine{
  0%{background-position:110% 0}
  100%{background-position:-110% 0}
}
@media (prefers-reduced-motion:reduce){
  .sbsent-btn{animation:none!important}
}

/* The typing box always gets a complete row, so "Type English Answer" is fully visible. */
.sbsent-type{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:7px!important;
}
.sbsent-type input{
  grid-column:1 / -1!important;
  width:100%!important;
  min-width:0!important;
  font-size:17px!important;
  padding:8px 12px!important;
}
.sbsent-submit{grid-column:1!important}
.sbsent-exit{grid-column:2!important}
.sbsent-type button{
  width:100%!important;
  min-width:0!important;
  font-size:17px!important;
}

/* Lock the page while quiz is active. */
html.sbsent-page-locked,
body.sbsent-page-locked{
  overflow:hidden!important;
}

/* START QUIZ => occupy the entire mobile screen. */
@media(max-width:820px){
  .sbsent-wrap.sbsent-fullscreen-active{
    position:fixed!important;
    inset:0!important;
    z-index:2147483646!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100vh!important;
    height:100dvh!important;
    margin:0!important;
    padding:0!important;
    background:var(--sbsent-quiz-color,#050505)!important;
    overflow:hidden!important;
  }

  .sbsent-wrap.sbsent-fullscreen-active .sbsent-quiz-screen{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    max-height:none!important;
    margin:0!important;
    border-radius:0!important;
    padding:10px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    background:var(--sbsent-quiz-color,#050505)!important;
  }

  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-bubble,
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-bubble{
    min-height:96px!important;
  }
}

@media(max-width:480px){
  .sbsent-type{
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
  }
  .sbsent-type input{
    grid-column:1 / -1!important;
    font-size:17px!important;
    height:48px!important;
  }
  .sbsent-type button{
    font-size:17px!important;
    height:46px!important;
  }
}


/* v1.2.0 — compact full-height layout, inset mobile edges, rounder configurable buttons */
.sbsent-btn{
  border-radius:15px!important;
  background:
    linear-gradient(135deg,
      rgba(255,255,255,.92) 0%,
      rgba(255,255,255,.28) 25%,
      var(--sbsent-button-color,#d7d7d7) 48%,
      rgba(255,255,255,.95) 66%,
      var(--sbsent-button-color,#d7d7d7) 100%)!important;
  color:#111!important;
}
.sbsent-nav-row button,
.sbsent-submit{
  border-radius:15px!important;
  background:
    linear-gradient(135deg,
      rgba(255,255,255,.92) 0%,
      rgba(255,255,255,.25) 25%,
      var(--sbsent-button-color,#d7d7d7) 48%,
      rgba(255,255,255,.95) 66%,
      var(--sbsent-button-color,#d7d7d7) 100%)!important;
  color:#111!important;
}
.sbsent-exit{
  border-radius:15px!important;
  background:linear-gradient(135deg,#ff6a6a 0%,#d71920 48%,#ff7777 68%,#b80f14 100%)!important;
  color:#fff!important;
  border-color:#8f0d11!important;
}
.sbsent-start,.sbsent-back,.sbsent-open{border-radius:15px!important}

/* Use the available height instead of leaving a large empty block below the controls. */
@media(max-width:820px){
  .sbsent-wrap.sbsent-fullscreen-active{
    padding:8px!important;
    background:var(--sbsent-quiz-color,#050505)!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-quiz-screen{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100%!important;
    border-radius:16px!important;
    padding:10px!important;
    display:flex!important;
    flex-direction:column!important;
    overflow-y:auto!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-top{flex:0 0 auto!important}
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-progress{flex:0 0 auto!important}
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-row{flex:1 1 0!important;min-height:150px!important;margin-bottom:10px!important}
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-row{flex:1 1 0!important;min-height:150px!important;margin-bottom:6px!important}
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-bubble,
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-bubble{height:100%!important;min-height:120px!important}
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-result{flex:0 0 26px!important}
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-nav-row{flex:0 0 auto!important;margin-top:4px!important}
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-type{flex:0 0 auto!important;margin-top:7px!important}
}

@media(max-width:480px){
  .sbsent-wrap.sbsent-fullscreen-active{
    padding:7px!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-quiz-screen{
    border-radius:14px!important;
    padding:8px!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-row,
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-row{
    min-height:140px!important;
  }
  .sbsent-nav-row button,.sbsent-type button{
    border-radius:14px!important;
  }
}


/* v1.2.1 — center question and answer text inside speech boxes */
.sbsent-question-bubble,
.sbsent-answer-bubble{
  justify-content:center!important;
  text-align:center!important;
}
.sbsent-question,
.sbsent-heard{
  width:100%!important;
  text-align:center!important;
  margin:auto!important;
}


/* v1.2.2 — compact speech boxes + controls moved upward + safe mobile fullscreen */
@media(max-width:820px){
  .sbsent-wrap.sbsent-fullscreen-active{
    /* Small edge gap; extra bottom space protects Android/iOS navigation controls. */
    padding:
      max(7px, env(safe-area-inset-top))
      7px
      max(22px, calc(env(safe-area-inset-bottom) + 12px))
      7px!important;
  }

  .sbsent-wrap.sbsent-fullscreen-active .sbsent-quiz-screen{
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    overflow-y:auto!important;
    padding:8px!important;
  }

  /* Previous flex:1 made these boxes fill most of the screen.
     Give both rows a compact fixed height instead. */
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-row,
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-row{
    flex:0 0 auto!important;
    height:145px!important;
    min-height:145px!important;
    max-height:145px!important;
    margin-bottom:8px!important;
  }

  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-bubble,
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-bubble{
    height:145px!important;
    min-height:145px!important;
    max-height:145px!important;
    padding:10px 13px!important;
  }

  /* Pull the result and all controls upward directly below the answer box. */
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-result{
    flex:0 0 auto!important;
    min-height:22px!important;
    height:22px!important;
    line-height:22px!important;
    margin:0 0 3px!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-nav-row{
    flex:0 0 auto!important;
    margin-top:2px!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-type{
    flex:0 0 auto!important;
    margin-top:6px!important;
  }
}

@media(max-width:480px){
  .sbsent-wrap.sbsent-fullscreen-active{
    padding:
      max(6px, env(safe-area-inset-top))
      6px
      max(24px, calc(env(safe-area-inset-bottom) + 14px))
      6px!important;
  }

  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-row,
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-row{
    height:132px!important;
    min-height:132px!important;
    max-height:132px!important;
  }

  .sbsent-wrap.sbsent-fullscreen-active .sbsent-question-bubble,
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-bubble{
    height:132px!important;
    min-height:132px!important;
    max-height:132px!important;
  }
}


/* v1.3.0 — unified voice/type submit + large bottom MIC + Right/Wrong score */
.sbsent-score{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
.sbsent-score-right,.sbsent-score-wrong{white-space:nowrap!important}

.sbsent-nav-row{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
}
.sbsent-nav-row button{
  width:100%!important;
  min-width:0!important;
  height:50px!important;
  padding:5px!important;
  font-size:17px!important;
}

.sbsent-type{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
}
.sbsent-type input,
.sbsent-type .sbsent-exit{
  grid-column:1!important;
  width:100%!important;
  min-width:0!important;
  height:52px!important;
}
.sbsent-type .sbsent-exit{
  font-size:19px!important;
}

.sbsent-bottom-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
  margin-top:14px!important;
}
.sbsent-bottom-actions .sbsent-big-action{
  width:100%!important;
  min-width:0!important;
  height:72px!important;
  border-radius:18px!important;
  font-size:21px!important;
}
.sbsent-bottom-actions .sbsent-mic{
  font-size:22px!important;
}
.sbsent-bottom-actions .sbsent-submit{
  font-size:21px!important;
}

/* Make room for the large bottom action row without changing speech-box sizes. */
@media(max-width:820px){
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-nav-row{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-type{
    grid-template-columns:1fr!important;
    gap:6px!important;
    margin-top:6px!important;
  }
  .sbsent-wrap.sbsent-fullscreen-active .sbsent-bottom-actions{
    flex:0 0 auto!important;
    margin-top:14px!important;
    margin-bottom:max(8px,env(safe-area-inset-bottom))!important;
  }
}

@media(max-width:480px){
  .sbsent-top{
    gap:5px!important;
  }
  .sbsent-title{
    flex:1 1 44%!important;
  }
  .sbsent-score{
    flex:1 1 54%!important;
    gap:3px 8px!important;
    font-size:13px!important;
    line-height:1.15!important;
  }
  .sbsent-score-total{
    flex-basis:100%!important;
    text-align:right!important;
  }
  .sbsent-nav-row{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .sbsent-nav-row button{
    height:48px!important;
    font-size:16px!important;
  }
  .sbsent-type input,
  .sbsent-type .sbsent-exit{
    height:50px!important;
  }
  .sbsent-bottom-actions{
    gap:8px!important;
    margin-top:12px!important;
  }
  .sbsent-bottom-actions .sbsent-big-action{
    height:68px!important;
    font-size:20px!important;
  }
}


/* v1.3.1 — stronger score visibility + Times New Roman on every button */
.sbsent-score,
.sbsent-score *{
  color:#000!important;
  font-family:"Times New Roman", Times, serif!important;
  font-weight:700!important;
}
.sbsent-score{
  font-size:19px!important;
  line-height:1.2!important;
}
.sbsent-btn,
.sbsent-btn *,
.sbsent-wrap button,
.sbsent-wrap button *{
  font-family:"Times New Roman", Times, serif!important;
}

@media(max-width:480px){
  .sbsent-score{
    font-size:17px!important;
    line-height:1.18!important;
  }
  .sbsent-score-total,
  .sbsent-score-right,
  .sbsent-score-wrong{
    color:#000!important;
  }
}


/* v1.3.2 — fixed quiz screen, editable answer bubble, side-by-side MIC/SUBMIT */
.sbsent-title,
.sbsent-title *{
  color:#000!important;
  font-family:"Times New Roman", Times, serif!important;
  font-weight:700!important;
}
.sbsent-title{
  font-size:20px!important;
  line-height:1.15!important;
  letter-spacing:0!important;
  white-space:normal!important;
}

/* The answer speech bubble itself is now the typing field. */
.sbsent-answer-bubble{
  padding:8px 14px!important;
}
.sbsent-answer-editor{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  resize:none!important;
  overflow:hidden!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:#000!important;
  font-family:"Times New Roman", Times, serif!important;
  font-size:22px!important;
  font-weight:600!important;
  line-height:1.25!important;
  text-align:center!important;
  padding:0 4px!important;
  margin:0!important;
  align-self:stretch!important;
}
.sbsent-answer-editor::placeholder{
  color:#777!important;
  opacity:1!important;
  font-weight:400!important;
}

/* EXIT remains the only control immediately below the answer area. */
.sbsent-type{
  display:block!important;
  width:100%!important;
}
.sbsent-type .sbsent-exit{
  display:block!important;
  width:100%!important;
  height:50px!important;
  margin:0!important;
  grid-column:auto!important;
}

/* Force MIC left and SUBMIT right, even over older grid-column rules. */
.sbsent-bottom-actions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  grid-auto-flow:column!important;
  gap:8px!important;
  width:100%!important;
  align-items:stretch!important;
}
.sbsent-bottom-actions .sbsent-mic{
  grid-column:1!important;
  grid-row:1!important;
}
.sbsent-bottom-actions .sbsent-submit{
  grid-column:2!important;
  grid-row:1!important;
}
.sbsent-bottom-actions .sbsent-big-action{
  width:100%!important;
  min-width:0!important;
  height:64px!important;
  margin:0!important;
  padding:6px!important;
  border-radius:16px!important;
  white-space:nowrap!important;
}

/* Keep the quiz fixed in place: no vertical page/quiz scrolling while active. */
html.sbsent-page-locked,
body.sbsent-page-locked{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  touch-action:none!important;
}
.sbsent-wrap.sbsent-fullscreen-active{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  touch-action:none!important;
}
.sbsent-wrap.sbsent-fullscreen-active .sbsent-quiz-screen{
  overflow:hidden!important;
  overscroll-behavior:none!important;
  touch-action:none!important;
}

/* Re-enable touch interaction only on actual controls/editable answer. */
.sbsent-wrap.sbsent-fullscreen-active button,
.sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-editor{
  touch-action:manipulation!important;
}
.sbsent-wrap.sbsent-fullscreen-active .sbsent-answer-editor{
  touch-action:auto!important;
}

@media(max-width:480px){
  .sbsent-title{
    font-size:18px!important;
  }
  .sbsent-answer-editor{
    font-size:20px!important;
  }
  .sbsent-bottom-actions{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:7px!important;
    margin-top:10px!important;
  }
  .sbsent-bottom-actions .sbsent-big-action{
    height:60px!important;
    font-size:18px!important;
  }
}


/* v1.3.3 — centered editable answer + larger question/answer text */
.sbsent-question,
.sbsent-question-bubble{
  font-size:26px!important;
}
.sbsent-question{
  line-height:1.3!important;
  font-weight:700!important;
}

.sbsent-answer-bubble{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.sbsent-answer-editor{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  font-size:26px!important;
  line-height:1.3!important;
  font-weight:700!important;
  padding:calc((100% - 2.6em)/2) 18px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}
.sbsent-answer-editor::placeholder{
  text-align:center!important;
  font-size:18px!important;
  line-height:1.35!important;
  font-weight:400!important;
}

@media(max-width:480px){
  .sbsent-question,
  .sbsent-question-bubble{
    font-size:24px!important;
  }
  .sbsent-answer-editor{
    font-size:24px!important;
    padding:calc((100% - 2.6em)/2) 14px!important;
  }
  .sbsent-answer-editor::placeholder{
    font-size:16px!important;
    line-height:1.3!important;
  }
}


/* v1.3.4 — keep answer/placeholder fully inside and centered; remove overflow */
.sbsent-answer-bubble{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  padding:0!important;
}

/*
 * A textarea does not support flex alignment for its text content.
 * Use balanced fixed padding instead of percentage padding so both
 * recognized English text and placeholder stay visually centered.
 */
.sbsent-answer-editor{
  position:static!important;
  inset:auto!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  max-height:100%!important;
  box-sizing:border-box!important;
  resize:none!important;
  overflow:hidden!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:#000!important;
  font-family:"Times New Roman", Times, serif!important;
  font-size:26px!important;
  font-weight:700!important;
  line-height:1.25!important;
  text-align:center!important;
  padding:48px 18px 18px!important;
  margin:0!important;
}

.sbsent-answer-editor::placeholder{
  color:#777!important;
  opacity:1!important;
  text-align:center!important;
  font-family:"Times New Roman", Times, serif!important;
  font-size:16px!important;
  font-weight:400!important;
  line-height:1.28!important;
}

/* Hide an empty status/result line so it never pushes controls downward. */
.sbsent-result:empty{
  display:none!important;
  min-height:0!important;
  height:0!important;
  margin:0!important;
  padding:0!important;
}

@media(max-width:480px){
  .sbsent-answer-editor{
    font-size:24px!important;
    line-height:1.22!important;
    padding:45px 12px 16px!important;
  }
  .sbsent-answer-editor::placeholder{
    font-size:14px!important;
    line-height:1.25!important;
  }
}


/* v1.3.5 — improved answer-box centering and active-microphone animation */
.sbsent-answer-bubble{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  padding:0!important;
}

.sbsent-answer-editor{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  max-height:100%!important;
  box-sizing:border-box!important;
  resize:none!important;
  overflow:hidden!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:#000!important;
  font-family:"Times New Roman", Times, serif!important;
  font-size:26px!important;
  font-weight:700!important;
  line-height:1.25!important;
  text-align:center!important;
  padding:72px 18px 0!important;
  margin:0!important;
}

.sbsent-answer-editor::placeholder{
  color:#777!important;
  opacity:1!important;
  text-align:center!important;
  font-family:"Times New Roman", Times, serif!important;
  font-size:15px!important;
  font-weight:400!important;
  line-height:1.28!important;
}

/* Active MIC: pulsing ring around the button while speech recognition is listening. */
.sbsent-mic{
  position:relative!important;
  isolation:isolate!important;
}
.sbsent-mic.sbsent-mic-listening{
  border-color:#111!important;
  box-shadow:0 0 0 0 rgba(0,0,0,.35)!important;
  animation:sbsentMicPulse 1.05s ease-out infinite!important;
}
.sbsent-mic.sbsent-mic-listening::after{
  content:""!important;
  position:absolute!important;
  inset:-7px!important;
  border:3px solid rgba(0,0,0,.45)!important;
  border-radius:22px!important;
  pointer-events:none!important;
  animation:sbsentMicRing 1.05s ease-out infinite!important;
}
@keyframes sbsentMicPulse{
  0%{box-shadow:0 0 0 0 rgba(0,0,0,.35)}
  70%{box-shadow:0 0 0 12px rgba(0,0,0,0)}
  100%{box-shadow:0 0 0 0 rgba(0,0,0,0)}
}
@keyframes sbsentMicRing{
  0%{transform:scale(.96);opacity:.9}
  75%{transform:scale(1.08);opacity:.18}
  100%{transform:scale(1.1);opacity:0}
}

@media(max-width:480px){
  .sbsent-answer-editor{
    font-size:24px!important;
    line-height:1.22!important;
    padding:67px 12px 0!important;
  }
  .sbsent-answer-editor::placeholder{
    font-size:14px!important;
    line-height:1.24!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .sbsent-mic.sbsent-mic-listening,
  .sbsent-mic.sbsent-mic-listening::after{
    animation:none!important;
  }
}


/* v1.3.6 — remove "Speak English now..." status line */
.sbsent-result:empty{
  display:none!important;
  height:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
}


/* v1.3.7 — answer text slightly higher + true listening-only MIC animation */
.sbsent-answer-editor{
  padding:43px 18px 22px!important;
}
@media(max-width:480px){
  .sbsent-answer-editor{
    padding:39px 12px 20px!important;
  }
}

/* Neutral state: no pulse at all. */
.sbsent-mic:not(.is-listening),
.sbsent-mic:not(.is-listening)::after{
  animation:none!important;
  box-shadow:none!important;
}
.sbsent-mic.is-listening{
  position:relative!important;
  animation:sbsentMicPulse 1.05s ease-out infinite!important;
}
.sbsent-mic.is-listening::after{
  content:""!important;
  position:absolute!important;
  inset:-7px!important;
  border:3px solid rgba(0,0,0,.45)!important;
  border-radius:22px!important;
  pointer-events:none!important;
  animation:sbsentMicRing 1.05s ease-out infinite!important;
}


/* v1.3.8 FINAL OVERRIDES — true centered answer content + listening-only MIC pulse */
.sbsent-answer-bubble{
  position:relative!important;
  display:block!important;
  overflow:hidden!important;
  padding:0!important;
}

.sbsent-answer-placeholder{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  padding:12px 24px!important;
  box-sizing:border-box!important;
  z-index:1!important;
  pointer-events:none!important;
  color:#6f6f6f!important;
  font-family:"Times New Roman", Times, serif!important;
  font-size:18px!important;
  line-height:1.2!important;
}
.sbsent-answer-placeholder.sbsent-hidden{
  display:none!important;
}
.sbsent-answer-help{
  margin-top:7px!important;
  font-size:15px!important;
  line-height:1.25!important;
}

.sbsent-answer-editor{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  max-height:100%!important;
  margin:0!important;
  padding-left:18px!important;
  padding-right:18px!important;
  box-sizing:border-box!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  resize:none!important;
  overflow:hidden!important;
  background:transparent!important;
  z-index:2!important;
  color:#000!important;
  font-family:"Times New Roman", Times, serif!important;
  font-size:27px!important;
  font-weight:700!important;
  line-height:1.22!important;
  text-align:center!important;
}

/* Kill every legacy pulse class completely. */
.sbsent-mic.sbsent-mic-listening,
.sbsent-mic.sbsent-mic-listening::after{
  animation:none!important;
  box-shadow:none!important;
  content:none!important;
}

/* No animation when recognition is OFF. */
.sbsent-mic:not(.is-listening),
.sbsent-mic:not(.is-listening)::after{
  animation:none!important;
  box-shadow:none!important;
}

/* Pulse only after SpeechRecognition fires onstart. */
.sbsent-mic.is-listening{
  position:relative!important;
  animation:sbsentMicPulse138 1s ease-out infinite!important;
}
.sbsent-mic.is-listening::after{
  content:""!important;
  position:absolute!important;
  inset:-7px!important;
  border:3px solid rgba(0,0,0,.5)!important;
  border-radius:22px!important;
  pointer-events:none!important;
  animation:sbsentMicRing138 1s ease-out infinite!important;
}
@keyframes sbsentMicPulse138{
  0%{box-shadow:0 0 0 0 rgba(0,0,0,.35)}
  72%{box-shadow:0 0 0 13px rgba(0,0,0,0)}
  100%{box-shadow:0 0 0 0 rgba(0,0,0,0)}
}
@keyframes sbsentMicRing138{
  0%{transform:scale(.97);opacity:.95}
  75%{transform:scale(1.08);opacity:.18}
  100%{transform:scale(1.1);opacity:0}
}

@media(max-width:480px){
  .sbsent-answer-placeholder{
    padding:10px 18px!important;
    font-size:17px!important;
  }
  .sbsent-answer-help{
    font-size:14px!important;
  }
  .sbsent-answer-editor{
    font-size:25px!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }
}


/* v1.4.0 — Wrong answer message must be clearly red */
.sbsent-result.sbsent-wrong-answer,
.sbsent-result.warn.sbsent-wrong-answer{
  color:#ff0000!important;
  font-weight:700!important;
}


/* v1.5.0 — completion, wrong-answer review, retry and next-part flow */
.sbsent-complete-actions,
.sbsent-wrong-review{
  width:100%!important;
  box-sizing:border-box!important;
  margin-top:12px!important;
}
.sbsent-complete-actions > .sbsent-btn,
.sbsent-wrong-review > .sbsent-btn{
  width:100%!important;
  margin-top:9px!important;
}
.sbsent-final-row{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
  margin-top:10px!important;
}
.sbsent-final-row .sbsent-btn{
  width:100%!important;
}
.sbsent-wrong-title{
  text-align:center!important;
  font-family:"Times New Roman",Times,serif!important;
  font-size:22px!important;
  font-weight:700!important;
  color:#000!important;
  margin:6px 0 10px!important;
}
.sbsent-wrong-item{
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  gap:8px!important;
  align-items:center!important;
  background:#fff!important;
  color:#000!important;
  border-radius:12px!important;
  padding:10px!important;
  margin:8px 0!important;
}
.sbsent-wrong-num{
  font-weight:700!important;
}
.sbsent-wrong-te,
.sbsent-wrong-en{
  font-family:"Times New Roman",Times,serif!important;
  line-height:1.25!important;
}
.sbsent-wrong-te{
  font-size:18px!important;
}
.sbsent-wrong-en{
  font-size:19px!important;
  font-weight:700!important;
  margin-top:4px!important;
}
.sbsent-wrong-listen{
  min-width:74px!important;
  padding:8px 10px!important;
  font-size:15px!important;
}
@media(max-width:480px){
  .sbsent-wrong-item{
    grid-template-columns:auto 1fr!important;
  }
  .sbsent-wrong-listen{
    grid-column:2!important;
    width:100%!important;
  }
}

/* v1.5.1 filtered wrong-answer study */
.sbsent-wrong-intro{text-align:center!important;font-family:"Times New Roman",Times,serif!important;font-size:17px!important;font-weight:700!important;color:#000!important;margin:6px 0 12px!important}
.sbsent-wrong-item{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;align-items:center!important;background:#fff!important;color:#000!important;border-radius:10px!important;padding:10px!important;margin:7px 0!important}
.sbsent-wrong-en,.sbsent-wrong-te{font-family:"Times New Roman",Times,serif!important;font-size:18px!important;line-height:1.25!important}
.sbsent-wrong-en{font-weight:700!important}.sbsent-wrong-listen{grid-column:1/-1!important;width:100%!important;font-size:16px!important}
.sbsent-complete-actions button:disabled{opacity:.55!important;cursor:not-allowed!important}

/* v1.5.2 dedicated result screen + post-like wrong-answer study */
.sbsent-complete-actions{
  width:100%!important;
  max-width:620px!important;
  margin:18px auto!important;
}
.sbsent-complete-actions [data-wrong-review]{width:100%!important;margin-bottom:10px!important}
.sbsent-final-row{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
.sbsent-wrong-intro{text-align:center!important;font-family:"Times New Roman",Times,serif!important;font-size:18px!important;font-weight:700!important;color:#000!important;margin:8px 0 14px!important}
.sbsent-wrong-item{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;align-items:center!important;background:#fff!important;color:#000!important;border-radius:8px!important;padding:11px!important;margin:7px 0!important}
.sbsent-wrong-en,.sbsent-wrong-te{font-family:"Times New Roman",Times,serif!important;font-size:18px!important;line-height:1.3!important}
.sbsent-wrong-en{font-weight:700!important}
.sbsent-wrong-review>[data-retry-wrong]{width:100%!important;margin-top:14px!important}

/* v1.6.0 — true separate result screen */
.sbsent-result-screen,
.sbsent-wrong-study-screen{
  width:min(96%,760px)!important;
  margin:14px auto!important;
  box-sizing:border-box!important;
  padding:18px!important;
  background:var(--sbsent-quiz-color,#050505)!important;
  border-radius:16px!important;
}
.sbsent-final-title{
  text-align:center!important;
  font-family:"Times New Roman",Times,serif!important;
  font-size:26px!important;
  font-weight:700!important;
  color:#fff!important;
  margin:4px 0 18px!important;
}
.sbsent-final-score{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:10px!important;
  margin-bottom:18px!important;
}
.sbsent-final-score span{
  background:#fff!important;
  color:#000!important;
  text-align:center!important;
  border-radius:12px!important;
  padding:13px 6px!important;
  font-family:"Times New Roman",Times,serif!important;
  font-size:20px!important;
  font-weight:700!important;
}
.sbsent-final-full{
  width:100%!important;
  margin:8px 0!important;
  min-height:52px!important;
  font-size:19px!important;
}
.sbsent-wrong-study-note{
  text-align:center!important;
  color:#fff!important;
  font-family:"Times New Roman",Times,serif!important;
  font-size:18px!important;
  margin-bottom:14px!important;
}
.sbsent-wrong-study-screen .sbsent-study-table{
  width:100%!important;
  background:#fff!important;
}
.sbsent-wrong-study-screen .sbsent-start,
.sbsent-wrong-study-screen .sbsent-back,
.sbsent-wrong-study-screen .sbsent-exit{
  width:100%!important;
  margin-top:10px!important;
}
@media(max-width:480px){
  .sbsent-final-score{grid-template-columns:1fr!important}
  .sbsent-result-screen,.sbsent-wrong-study-screen{width:96%!important;padding:14px!important}
  .sbsent-final-title{font-size:23px!important}
}

/* v1.6.1 cache-bust: wrong-review TTS stop fix */


/* ===== v1.6.2: top-right SUBMIT + mobile bottom EXIT ===== */
.sbsent-answer-bubble{
  position:relative!important;
  padding-top:52px!important;
}
.sbsent-answer-submit-top{
  position:absolute!important;
  top:8px!important;
  right:10px!important;
  z-index:8!important;
  min-width:86px!important;
  min-height:38px!important;
  padding:5px 12px!important;
  border:2px solid #222!important;
  border-radius:10px!important;
  background:#f3f3f3!important;
  color:#111!important;
  font-family:"Times New Roman",Times,serif!important;
  font-size:16px!important;
  font-weight:800!important;
  line-height:1!important;
  box-sizing:border-box!important;
  cursor:pointer!important;
}
.sbsent-exit-mobile-bottom{
  width:100%!important;
  box-sizing:border-box!important;
}

@media (max-width:768px){
  .sbsent-quiz-screen{
    padding-bottom:84px!important;
  }
  .sbsent-exit-mobile-bottom{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:max(10px, env(safe-area-inset-bottom))!important;
    width:auto!important;
    height:58px!important;
    min-height:58px!important;
    margin:0!important;
    z-index:999999!important;
    box-shadow:0 3px 12px rgba(0,0,0,.28)!important;
  }
  .sbsent-answer-submit-top{
    top:7px!important;
    right:8px!important;
    min-width:82px!important;
    min-height:36px!important;
    font-size:15px!important;
  }
}

/* ===== v1.6.3: circular SUBMIT below computer + safer EXIT ===== */
.sbsent-answer-bubble{
  padding-top:15px!important;
}
.sbsent-answer-submit-top{display:none!important;}

.sbsent-computer-side{
  flex:0 0 105px!important;
  width:105px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  align-self:stretch!important;
}
.sbsent-computer-side .sbsent-computer{
  flex:0 0 auto!important;
}
.sbsent-circle-submit{
  width:72px!important;
  height:72px!important;
  min-width:72px!important;
  min-height:72px!important;
  padding:0!important;
  border:3px solid #222!important;
  border-radius:50%!important;
  background:#f3f3f3!important;
  color:#111!important;
  font-family:"Times New Roman",Times,serif!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  cursor:pointer!important;
  position:relative!important;
  z-index:10!important;
}

@media (max-width:768px){
  .sbsent-question-row{
    align-items:stretch!important;
  }
  .sbsent-computer-side{
    flex-basis:105px!important;
    width:105px!important;
    gap:8px!important;
  }
  .sbsent-circle-submit{
    width:68px!important;
    height:68px!important;
    min-width:68px!important;
    min-height:68px!important;
    font-size:13px!important;
  }
  .sbsent-quiz-screen{
    padding-bottom:105px!important;
  }
  .sbsent-exit-mobile-bottom{
    left:28px!important;
    right:28px!important;
    bottom:max(28px, calc(env(safe-area-inset-bottom) + 18px))!important;
    width:auto!important;
    height:56px!important;
    min-height:56px!important;
  }
}

/* ===== v1.6.4: mobile question reach + centered safer EXIT only ===== */
@media (max-width:768px){
  /* Keep the question box height unchanged. Extend only its horizontal reach
     closer to the computer by reducing unused side-column space and row gap. */
  .sbsent-question-row{
    gap:4px!important;
  }
  .sbsent-question-bubble{
    flex:1 1 auto!important;
    width:auto!important;
    max-width:none!important;
    margin-right:0!important;
  }
  .sbsent-computer-side{
    flex:0 0 76px!important;
    width:76px!important;
    min-width:76px!important;
    margin-left:0!important;
  }

  /* Keep EXIT height unchanged; shorten only horizontal length, center it,
     and lift it clear of Android/mobile navigation controls. */
  .sbsent-exit-mobile-bottom{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:78vw!important;
    max-width:520px!important;
    height:56px!important;
    min-height:56px!important;
    bottom:max(78px, calc(env(safe-area-inset-bottom) + 68px))!important;
    margin:0!important;
  }
  .sbsent-quiz-screen{
    padding-bottom:150px!important;
  }
}

/* ===== v1.6.5: slightly smaller mobile quiz EXIT only ===== */
@media (max-width:768px){
  .sbsent-exit-mobile-bottom{
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    width:68vw!important;
    max-width:440px!important;
    height:50px!important;
    min-height:50px!important;
    margin:0!important;
  }
}

/* ===== v1.6.6: never keep the fixed quiz EXIT on other screens ===== */
/* Some earlier mobile layout rules use !important display values. These
   combined selectors make the active-screen state definitive. */
.sbsent-quiz-screen.sbsent-hidden,
.sbsent-result-screen.sbsent-hidden,
.sbsent-wrong-study-screen.sbsent-hidden,
.sbsent-study-screen.sbsent-hidden{
  display:none!important;
}

/* The floating/fixed EXIT belongs only to the live quiz screen. */
.sbsent-wrap:not(.sbsent-quiz-mode) .sbsent-exit-mobile-bottom{
  display:none!important;
}


/* ===== v1.6.7: mobile study screen auto-fit ===== */
@media (max-width:768px){
  /* Keep the selected-Part study screen fully inside the phone viewport. */
  .sbsent-wrap:not(.sbsent-quiz-mode){
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    margin-left:calc(50% - 50vw + 10px)!important;
    margin-right:10px!important;
    overflow-x:hidden!important;
  }
  .sbsent-study-screen{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:8px!important;
    overflow-x:hidden!important;
  }
  .sbsent-study-screen .sbsent-part-select,
  .sbsent-study-screen .sbsent-study-list,
  .sbsent-study-screen .sbsent-study-table,
  .sbsent-study-screen .sbsent-start,
  .sbsent-study-screen .sbsent-back{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .sbsent-study-screen .sbsent-study-list{
    overflow-x:hidden!important;
  }
  .sbsent-study-screen .sbsent-study-table{
    table-layout:fixed!important;
  }
  .sbsent-study-screen .sbsent-study-table td{
    width:50%!important;
    max-width:50%!important;
    min-width:0!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    white-space:normal!important;
  }
}

/* ===== v1.6.10: slightly smaller quiz question + typed answer text ===== */
.sbsent-question{
  font-size:23px!important;
}
.sbsent-answer-editor{
  font-size:23px!important;
}
@media (max-width:480px){
  .sbsent-question{
    font-size:21px!important;
  }
  .sbsent-answer-editor{
    font-size:22px!important;
  }
}