/* TingDong AI integrated learning workspace · test branch */
#tdLearningModeCard{margin-top:16px;padding:15px 16px;border:1px solid #dce2e8;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(35,48,67,.055);color:#182235}
#tdLearningModeCard[hidden]{display:none!important}
.tdlwModeTitle{font-size:15px;font-weight:900;margin-bottom:10px}
.tdlwModeRow{display:flex;gap:9px;align-items:stretch;flex-wrap:wrap}
.tdlwModeBtn{min-width:190px;flex:1;border:1px solid #dce2e8;background:#fff;color:#263147;border-radius:12px;padding:11px 12px;text-align:left;cursor:pointer}
.tdlwModeBtn strong{display:block;font-size:14px}.tdlwModeBtn span{display:block;margin-top:4px;color:#7b8797;font-size:11px}
.tdlwModeBtn.active{border-color:#85d8b3;background:#f4fcf8;box-shadow:0 0 0 2px rgba(32,178,120,.08)}
.tdlwGuideStart{border:0;border-radius:11px;background:#20b278;color:#fff;font-weight:900;padding:10px 16px;cursor:pointer}
.tdlwGuideStart[hidden]{display:none!important}

/* Keep the material/result workspace two-column where 760px actually fits.
   On phones, stack only this workspace instead of widening the entire app viewport. */
#result.result.show{display:grid!important;grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr)!important;gap:14px!important;align-items:start!important}
#result.result>.card:first-child{grid-column:1!important;grid-row:1!important;min-width:0!important}
#result.result>.tdLearningSide{grid-column:2!important;grid-row:1!important;min-width:0!important;display:flex!important;flex-direction:column!important;gap:12px!important;align-self:start!important;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}
@media(max-width:759px){
  #result.result.show{grid-template-columns:minmax(0,1fr)!important}
  #result.result>.card:first-child{grid-column:1!important;grid-row:1!important}
  /* Phone UI uses transcript + compact tools + docked player, not the desktop side column. */
  #result.result>.tdLearningSide{display:none!important}
  body.tdlwMobileCompact #mediaWrap,
  body.tdlwMobileCompact #mediaWrap.show,
  body.tdlwMobileCompact #mediaBox{
    display:none!important;
  }
}

.tdlwToolCard,.tdlwAnalysisPanel,.tdlwGuidePanel{box-sizing:border-box;width:100%;border:1px solid #dce2e8;border-radius:16px;background:#fff;color:#182235;box-shadow:0 8px 24px rgba(35,48,67,.055)}
.tdlwToolCard{padding:14px}.tdlwToolCard h3{margin:0 0 10px;font-size:14px}
.tdlwToolButtons{display:flex;gap:8px;flex-wrap:wrap}
.tdlwToolButtons button,.tdlwAnalysisActions button,.tdlwGuideActions button{border:1px solid #dce2e8;background:#fff;color:#354258;border-radius:10px;padding:9px 11px;font-weight:800;cursor:pointer}
.tdlwToolButtons button:hover,.tdlwAnalysisActions button:hover,.tdlwGuideActions button:hover{background:#f8fafc;border-color:#c5ced8}
.tdlwAnalysisPanel,.tdlwGuidePanel{padding:15px;position:relative!important;top:auto!important;max-height:none!important;overflow:visible!important}
.tdlwAnalysisPanel[hidden],.tdlwGuidePanel[hidden]{display:none!important}
.tdlwPanelHead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.tdlwPanelHead h3{margin:4px 0 0;font-size:20px}.tdlwKicker{font-size:11px;font-weight:900;color:#16845c}
.tdlwEmpty{color:#7b8797;font-size:12px;line-height:1.65;padding:9px 0}
.tdlwBackGuide{margin-bottom:10px;border:0;background:transparent;color:#4d6fae;font-weight:850;cursor:pointer;padding:0}
.tdlwBackGuide[hidden]{display:none!important}
.tdlwChips{display:flex;gap:6px;flex-wrap:wrap;margin:11px 0}
.tdlwChips span{border:1px solid #dce2e8;background:#f8fafc;color:#657287;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:850}
.tdlwInfoGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tdlwInfoGrid>div{border:1px solid #e0e6eb;background:#f8fafc;border-radius:12px;padding:10px}
.tdlwInfoGrid small{display:block;color:#8792a1;font-size:10px}.tdlwInfoGrid b{display:block;margin-top:4px;font-size:13px}
.tdlwMeaning,.tdlwNote,.tdlwSelectedText,.tdlwSentenceHint{margin-top:10px;line-height:1.65;font-size:12px}
.tdlwMeaning{font-weight:750}.tdlwNote{color:#586678}.tdlwSelectedText{padding:10px;border:1px solid #dce2e8;background:#f8fafc;border-radius:11px;font-weight:800}
.tdlwSentenceHint{color:#7b8797}.tdlwLoading{color:#687588;padding:10px 0}.tdlwError{color:#b34242;padding:10px 0}
.tdlwAnalysisActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.tdlwAnalysisActions .primary,.tdlwGuideActions .primary{border-color:#20b278;background:#20b278;color:#fff}
.tdlwProgress{height:7px;border-radius:999px;background:#eef2f5;overflow:hidden;margin:12px 0}.tdlwProgress i{display:block;height:100%;background:#20b278}
.tdlwGuideZh{margin-top:8px;color:#556276;line-height:1.55}.tdlwGuideExplain{margin-top:10px;border-top:1px solid #e4e9ed;padding-top:10px;color:#687588;line-height:1.6;font-size:12px}
.tdlwGuideActions{display:flex;gap:8px;margin-top:13px}.seg.tdlwGuideTarget{border-color:#9ab7df!important;box-shadow:0 0 0 2px rgba(77,111,174,.09)!important}

/* Lexical click target = one word, not a whole phrase. */
span.tdlwWord{color:inherit;font:inherit;font-weight:inherit;line-height:inherit;padding:0;margin:0;user-select:text;-webkit-user-select:text;-webkit-touch-callout:default;cursor:pointer}
#segments .tdVocabHint{display:none!important}

#segments .seg .hu,#segments .seg .source{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}
.tdlwMobileSelectionBar{
  position:fixed;z-index:260;display:flex;align-items:center;gap:6px;transform:translateX(-50%);
  padding:6px;border:1px solid #d7e5df;border-radius:12px;background:rgba(255,255,255,.98);
  box-shadow:0 10px 32px rgba(24,34,53,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)
}
.tdlwMobileSelectionBar[hidden]{display:none!important}
.tdlwMobileSelectionBar button{
  min-height:38px;padding:8px 11px;border:1px solid #dce3e8;border-radius:9px;background:#fff;color:#354258;
  font-size:13px;font-weight:850;white-space:nowrap
}
.tdlwMobileSelectionBar button.primary{border-color:#20b278;background:#20b278;color:#fff}
.tdlwMobileSelectionBar button.icon{width:38px;min-width:38px;padding:0;font-size:20px;line-height:1}
.tdlwMobileAnalysisLayer{
  position:fixed!important;inset:0!important;z-index:320!important;display:flex!important;align-items:flex-end!important;justify-content:center!important;
  padding:14px!important;background:rgba(24,34,53,.28)!important;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)
}
.tdlwMobileAnalysisLayer[hidden]{display:none!important}
.tdlwMobileAnalysisSheet{
  box-sizing:border-box;width:min(680px,100%)!important;max-height:min(78vh,720px)!important;overflow:auto!important;
  border:1px solid #dce5e1!important;border-radius:20px!important;background:#fff!important;color:#182235!important;
  box-shadow:0 24px 70px rgba(24,34,53,.24)!important;padding:12px!important;-webkit-overflow-scrolling:touch
}
.tdlwMobileAnalysisTop{
  position:sticky;top:-12px;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:-12px -12px 8px;padding:13px 14px;border-bottom:1px solid #eef2f4;background:rgba(255,255,255,.98)
}
.tdlwMobileAnalysisTop strong{font-size:15px;color:#182235}
.tdlwMobileAnalysisTop button{
  width:40px;height:40px;border:1px solid #dce3e8;border-radius:11px;background:#fff;color:#354258;font-size:22px;font-weight:800
}
.tdlwMobileAnalysisLayer .tdlwAnalysisPanel{
  border:0!important;box-shadow:none!important;padding:6px 4px 4px!important;background:#fff!important;overflow:visible!important
}
@media(min-width:760px){
  .tdlwMobileAnalysisLayer{display:none!important}
}

body.tdlwMobileCompact #segments .hu,body.tdlwMobileCompact #segments .source{user-select:none!important;-webkit-user-select:none!important;-webkit-touch-callout:none!important}
body.tdlwMobileCompact .tdlwMobileSelectionBar{display:none!important}
body.tdlwMobileCompact span.tdlwWord{
  display:inline-block;
  padding:2px 3px!important;
  margin:0 -1px!important;
  border-radius:5px;
  cursor:pointer;
  touch-action:manipulation;
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-touch-callout:none!important;
}
body.tdlwMobileCompact span.tdlwWord:active{background:rgba(32,178,120,.16);color:#087a53}
body.tdlwMobileCompact span.tdlwWord.tdlwWordSelected{background:#dff5eb!important;color:#087a53!important;box-shadow:0 0 0 1px #78cba8 inset}
body.tdlwMobileCompact .tdlwMobileSentenceActions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 2px}
body.tdlwMobileCompact .tdlwMobileSentenceActions button,body.tdlwMobileCompact .tdlwMobilePhraseBar button{
  border:1px solid #d8e2e8;background:#fff;color:#354258;border-radius:9px;padding:8px 10px;font-size:12px;font-weight:850
}
body.tdlwMobileCompact .tdlwMobileSentenceActions button.active,body.tdlwMobileCompact .tdlwMobilePhraseBar button.primary{border-color:#20b278;background:#edf8f2;color:#087a53}
body.tdlwMobileCompact .tdlwMobilePhraseBar{
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:9px 0 0;padding:10px;border:1px solid #d9e9e1;border-radius:11px;background:#f6fbf8
}
body.tdlwMobileCompact .tdlwMobilePhraseBar[hidden]{display:none!important}
body.tdlwMobileCompact .tdlwMobilePhraseBar span{margin-right:auto;color:#5e6d7f;font-size:11px;font-weight:800}
body.tdlwMobileCompact .tdlwMobilePhraseBar button:disabled{opacity:.42}
.tdlwMobileTools{display:none}
@media(max-width:759px){
  .tdlwMobileTools{
    display:block!important;
    margin:12px 0 14px;
    border:1px solid #dce2e8;border-radius:14px;background:#fff;padding:12px;
    box-shadow:0 7px 20px rgba(35,48,67,.04)
  }
  .tdlwMobileToolsTitle{margin-bottom:9px;font-size:14px;font-weight:900;color:#182235}
  .tdlwMobileToolsRow{display:flex;gap:7px;flex-wrap:wrap}
  .tdlwMobileToolsRow button{
    border:1px solid #dce2e8;background:#fff;color:#354258;border-radius:9px;padding:8px 10px;font-size:12px;font-weight:850
  }
}



/* Player stays inside the left material column. */
.tdlwPlayer{position:sticky;bottom:10px;z-index:18;margin-top:12px;display:grid;grid-template-columns:minmax(150px,.7fr) minmax(0,2fr) auto;gap:10px;align-items:center;border:1px solid #dce2e8;border-radius:15px;background:rgba(255,255,255,.97);box-shadow:0 12px 32px rgba(35,48,67,.12);padding:10px 11px;backdrop-filter:blur(12px)}
.tdlwPlayerState strong{display:block;font-size:12px}.tdlwPlayerState span{display:block;margin-top:3px;color:#7b8797;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tdlwPlayerControls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.tdlwPlayerControls button,.tdlwPlayerHide{border:1px solid #dce2e8;background:#fff;color:#354258;border-radius:9px;padding:8px 9px;font-weight:800;cursor:pointer}
.tdlwPlayerControls button.primary{background:#20b278;border-color:#20b278;color:#fff}.tdlwPlayerControls button.active{background:#edf8f2;border-color:#bfe5d4;color:#16845c}
.tdlwPlayerHide{white-space:nowrap}.tdlwPlayer.collapsed{grid-template-columns:1fr auto}.tdlwPlayer.collapsed .tdlwPlayerControls{display:none}
#result .exportBtns #txtBtn,#result .exportBtns #srtBtn,#tdIntensiveListening{display:none!important}

/* Modal layers are viewport anchored at the TOP and never become bottom sheets. */
.tdlwLayer{position:fixed!important;inset:0!important;z-index:160!important;background:rgba(31,42,57,.24)!important;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex!important;align-items:flex-start!important;justify-content:center!important;padding:24px 16px!important;overflow:auto!important}
.tdlwLayer[hidden]{display:none!important}
.tdlwModal{width:min(920px,100%)!important;max-height:calc(100vh - 48px)!important;overflow:auto!important;margin:0 auto!important;border:1px solid #dce2e8!important;border-radius:20px!important;background:#fff!important;color:#182235!important;box-shadow:0 28px 80px rgba(35,48,67,.18)!important;padding:18px!important;box-sizing:border-box}
.tdlwModalHead{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;position:sticky;top:-18px;background:#fff;padding:18px 0 12px;z-index:2;border-bottom:1px solid #eef1f3}
.tdlwModalHead h2{margin:4px 0 0;font-size:23px}.tdlwModalClose{border:0;background:transparent;color:#8390a2;font-size:22px;cursor:pointer}
.tdlwLangBadge{display:inline-flex;margin-top:8px;border:1px solid #cfe4d9;background:#f3fbf7;color:#16845c;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:900}
.tdlwGrammarGroups,.tdlwGrammarTabs{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}
.tdlwGrammarGroups button,.tdlwGrammarTabs button{border:1px solid #dce2e8;background:#fff;color:#617083;border-radius:999px;padding:8px 11px;font-size:11px;font-weight:850;cursor:pointer}
.tdlwGrammarGroups button.active,.tdlwGrammarTabs button.active{border-color:#bfe5d4;background:#edf8f2;color:#16845c;box-shadow:0 0 0 2px rgba(32,178,120,.06)}
.tdlwGrammarContent{margin-top:14px;border:1px solid #dce2e8;border-radius:15px;background:#fbfcfd;padding:14px}.tdlwGrammarContent h3{margin:0 0 10px;font-size:17px}
.tdlwTableWrap{overflow:auto;border:1px solid #e1e6eb;border-radius:12px}.tdlwTableWrap table{width:100%;border-collapse:collapse;min-width:480px;font-size:12px}
.tdlwTableWrap th,.tdlwTableWrap td{padding:9px 11px;border-bottom:1px solid #e6eaee;text-align:left}.tdlwTableWrap th{background:#f4f6f8;color:#6c798c}.tdlwTableWrap td{font-weight:750}
.tdlwRules{display:flex;flex-direction:column;gap:8px}.tdlwRules>div{padding:9px 10px;border-radius:10px;background:#f5f8fa;color:#526073;font-size:12px;line-height:1.55}
.tdlwWordForm{margin-top:14px;border:1px solid #cfe4d9;border-radius:15px;background:#f7fcf9;padding:14px}.tdlwWordForm[hidden]{display:none!important}
.tdlwWordFormRow{display:flex;gap:8px;margin-top:9px}.tdlwWordFormRow input{flex:1;min-width:0;border:1px solid #d5dde5;border-radius:10px;padding:9px 10px}.tdlwWordFormRow button{border:0;border-radius:10px;background:#20b278;color:#fff;font-weight:900;padding:9px 13px;cursor:pointer}
.tdlwWordFormResult{margin-top:10px;color:#536175;font-size:12px;line-height:1.6}
.tdlwVocabBooks{display:grid;gap:8px;margin-top:14px}.tdlwVocabBooks>a{display:flex;justify-content:space-between;gap:12px;text-decoration:none;color:#243149;border:1px solid #dce2e8;border-radius:12px;padding:11px 12px;background:#fbfcfd}.tdlwVocabBooks>a:hover{border-color:#bfe5d4;background:#f4fbf7}.tdlwVocabBooks span{color:#7b8797}
.tdlwVocabFoot{margin-top:12px}.tdlwVocabFoot a{color:#16845c;font-weight:850;text-decoration:none}.tdlwRawText{white-space:pre-wrap;line-height:1.75;margin-top:14px;color:#354258}
#tdMaterialQa{display:none!important}
#tdLearningQaLayer{align-items:center!important;padding-top:20px!important;padding-bottom:20px!important}
#tdLearningQaLayer .tdlwModal{margin:auto!important}
#tdLearningQaLayer #tdMaterialQa{display:block!important;margin:0!important;box-shadow:none!important;border:0!important;padding:0!important;background:transparent!important}

/* Keep legacy right-panel scroll traps disabled. */
.tdLearningSide,.tdlwAnalysisPanel,.tdlwGuidePanel{overflow:visible!important;overscroll-behavior:auto!important}

/* Test workspace cleanup */
.segBtns button[data-tdlw-hidden-legacy]{display:none!important}

/* Transcript text is selectable; sentence cards themselves are not playback controls. */
#segments .seg{cursor:default!important}
#segments .hu,#segments .source{user-select:text!important;-webkit-user-select:text!important}

.tdlwSaveSentence{border:0!important;background:transparent!important;color:#203047!important;font-weight:850!important;padding:0 0 0 8px!important;cursor:pointer!important}
.tdlwSaveSentence:hover{color:#16845c!important;text-decoration:underline}

/* 2026-09-25 clean rebuild overrides */
.tdlwModeTitle{text-align:center!important;color:#137b57!important;font-size:16px!important}
.tdlwModeBtn{text-align:center!important;border-color:#cfe8dc!important;background:linear-gradient(180deg,#fff,#f5fbf8)!important}
.tdlwModeBtn strong{color:#137b57!important}
#result.result>.tdlwPlayer{grid-column:1 / -1!important;grid-row:2!important;position:relative!important;bottom:auto!important;width:100%!important;box-sizing:border-box!important;margin-top:0!important;background:#fff!important;backdrop-filter:none!important}
#mediaWrap.tdlwAudioSourceOnly{display:none!important}
.tdlwSentenceAnalysis{margin-top:10px;padding:12px;border:1px solid #d7e8df;background:#f7fcf9;border-radius:12px;color:#34495e;line-height:1.7;font-size:12px}
.tdlwSentenceReference{display:flex;gap:8px;margin-top:10px;padding:10px 11px;border-radius:11px;background:#f8fafc;color:#687588;font-size:12px;line-height:1.6}
.tdlwSentenceReference strong{white-space:nowrap;color:#16845c}

/* Fixed viewport player: always visible while the learner scrolls. */
body.tdlwPlayerDocked{padding-bottom:118px!important}
body.tdlwPlayerDocked.tdlwPlayerCollapsed{padding-bottom:62px!important}
#result.result>.tdlwPlayer{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:12px!important;
  transform:translateX(-50%)!important;
  width:min(1180px,calc(100vw - 28px))!important;
  max-width:calc(100vw - 28px)!important;
  z-index:145!important;
  grid-template-columns:minmax(145px,.68fr) minmax(0,2.5fr) auto!important;
  margin:0!important;
  border:1px solid #cfe4d9!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 14px 42px rgba(31,49,67,.18)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.tdlwPlayerCollapse{
  border:1px solid #d7e2dc!important;
  background:#f7fbf9!important;
  color:#16845c!important;
  border-radius:10px!important;
  padding:8px 11px!important;
  font-weight:900!important;
  cursor:pointer!important;
  white-space:nowrap!important;
}
#result.result>.tdlwPlayer.collapsed{
  width:min(640px,calc(100vw - 28px))!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  padding:8px 10px!important;
}
#result.result>.tdlwPlayer.collapsed .tdlwPlayerControls{display:none!important}
#result.result>.tdlwPlayer.collapsed .tdlwPlayerState{min-width:0!important}
#result.result>.tdlwPlayer.collapsed .tdlwPlayerState strong,
#result.result>.tdlwPlayer.collapsed .tdlwPlayerState span{
  display:inline!important;
  margin:0 8px 0 0!important;
}
@media(max-width:850px){
  #result.result>.tdlwPlayer{width:calc(100vw - 18px)!important;bottom:8px!important}
  body.tdlwPlayerDocked .tdlwAnalysisPanel{padding-bottom:146px!important}
  body.tdlwPlayerDocked.tdlwPlayerCollapsed .tdlwAnalysisPanel{padding-bottom:88px!important}
  body.tdlwPlayerDocked .tdlwAnalysisActions{
    position:sticky;
    bottom:128px;
    z-index:146;
    padding:10px 0 2px;
    background:#fff;
  }
  body.tdlwPlayerDocked.tdlwPlayerCollapsed .tdlwAnalysisActions{bottom:72px}
}

/* TD_GUIDED_LEARNING_V2_20260925 */
.tdlwGuideSteps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:10px 0 14px}
.tdlwGuideSteps span{display:flex;align-items:center;justify-content:center;min-height:32px;border:1px solid #dfe6eb;border-radius:10px;background:#f8fafc;color:#8792a1;font-size:10px;font-weight:850;text-align:center}
.tdlwGuideSteps span.done{border-color:#cfe8dc;background:#f2faf6;color:#49816c}
.tdlwGuideSteps span.active{border-color:#9fd4bd;background:#eaf8f1;color:#137b57;box-shadow:0 0 0 2px rgba(32,178,120,.07)}
.tdlwGuideInstruction{display:flex;flex-direction:column;gap:5px;margin:8px 0 12px}
.tdlwGuideInstruction b{font-size:15px;color:#1e2a3b}.tdlwGuideInstruction span{font-size:12px;line-height:1.65;color:#6d7989}
.tdlwGuideListenCard{border:1px solid #dbe4e9;border-radius:14px;background:#f8fafc;padding:13px}
.tdlwGuideListenCard>span{display:block;color:#7b8797;font-size:11px;font-weight:800;margin-bottom:10px}
.tdlwGuideListenCard small{display:block;margin-top:9px;color:#8a95a3;font-size:10px;line-height:1.5}
.tdlwGuideMiniActions,.tdlwGuideDictationActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tdlwGuideMiniActions button,.tdlwGuideDictationActions button{border:1px solid #cfd9e0;background:#fff;color:#354258;border-radius:10px;padding:9px 11px;font-weight:850;cursor:pointer}
.tdlwGuideMiniActions button:hover,.tdlwGuideDictationActions button:hover{border-color:#aed8c5;background:#f3faf7;color:#137b57}
.tdlwGuideSource{border:1px solid #dbe4e9;border-radius:13px;background:#fff;padding:13px 14px;color:#182235;font-size:15px;font-weight:800;line-height:1.72}
.tdlwGuideZh,.tdlwGuideExplain{display:flex;flex-direction:column;gap:6px;margin-top:10px;border:1px solid #e0e6eb;border-radius:12px;padding:11px 12px;background:#f8fafc;color:#526073;line-height:1.65;font-size:12px}
.tdlwGuideZh strong,.tdlwGuideExplain strong{color:#16845c;font-size:11px}.tdlwGuideZh span,.tdlwGuideExplain span{display:block}
.tdlwGuideDictation{box-sizing:border-box;width:100%;min-height:86px;margin-top:10px;border:1px solid #d4dde4;border-radius:12px;background:#fff;color:#182235;padding:11px 12px;font:inherit;line-height:1.6;resize:vertical;outline:none}
.tdlwGuideDictation:focus{border-color:#7ac9a8;box-shadow:0 0 0 3px rgba(32,178,120,.10)}
.tdlwGuideDictationResult{min-height:20px;margin-top:10px;border-radius:10px;padding:0;color:#687588;font-size:12px;line-height:1.6}
.tdlwGuideDictationResult.ok{padding:9px 10px;background:#eff9f4;color:#137b57}.tdlwGuideDictationResult.warn{padding:9px 10px;background:#fff9ed;color:#86621e}.tdlwGuideDictationResult.answer{padding:9px 10px;background:#f4f7fa;color:#344258}
#tdLearningVocabLayer{align-items:center!important;justify-content:center!important;padding-top:20px!important;padding-bottom:20px!important}
#tdLearningVocabLayer .tdlwModal{width:min(760px,100%)!important;margin:auto!important}
#tdLearningVocabLayer .tdlwModalHead{justify-content:center!important}
#tdLearningVocabLayer .tdlwModalHead>div{width:100%;text-align:center!important}
#tdLearningVocabLayer .tdlwModalHead .tdlwModalClose{position:absolute!important;right:0!important;top:18px!important}
#tdLearningVocabLayer .tdlwVocabBooks{width:min(620px,100%)!important;margin:18px auto 0!important}
#tdLearningVocabLayer .tdlwVocabFoot{text-align:center!important}
@media(max-width:680px){.tdlwGuideSteps{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* TD_GUIDED_REVIEW_UNIVERSAL_20260925 */
.tdlwGuideReveal,.tdlwGuideHint,.tdlwGuideRecall,.tdlwGuideTargetBadge{
  margin-top:10px;border:1px solid #e0e6eb;border-radius:12px;background:#f8fafc;padding:11px 12px;color:#526073;font-size:12px;line-height:1.65
}
.tdlwGuideReveal[hidden]{display:none!important}
.tdlwGuideReveal strong,.tdlwGuideHint strong,.tdlwGuideRecall strong{display:block;margin-bottom:4px;color:#16845c;font-size:11px}
.tdlwGuideReveal span,.tdlwGuideHint span,.tdlwGuideRecall span{display:block}
.tdlwGuideCloze{
  border:1px solid #dbe4e9;border-radius:13px;background:#fff;padding:14px;color:#182235;font-size:15px;font-weight:800;line-height:1.8;word-break:break-word
}
.tdlwGuideBlank{
  display:inline-block;background:#eaf8f1;color:#137b57;border-radius:7px;padding:0 6px;margin:0 2px;font-weight:900
}
.tdlwGuideAnswerInput{
  box-sizing:border-box;width:100%;margin-top:10px;border:1px solid #d4dde4;border-radius:12px;background:#fff;color:#182235;padding:11px 12px;font:inherit;line-height:1.4;outline:none
}
.tdlwGuideAnswerInput:focus{border-color:#7ac9a8;box-shadow:0 0 0 3px rgba(32,178,120,.10)}
.tdlwGuideTargetBadge{display:flex;align-items:center;gap:10px;background:#f4fbf7;border-color:#d3e9de}
.tdlwGuideTargetBadge span{color:#6d7989;font-size:11px;font-weight:800;white-space:nowrap}
.tdlwGuideTargetBadge strong{color:#137b57;font-size:13px;word-break:break-word}
@media(max-width:900px){.tdlwGuideSteps{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.tdlwGuideSteps{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* TD_PERSISTENT_LEARNING_SESSION_20260925 */
.tdEndLearningArea{
  width:min(1380px,calc(100% - 32px));margin:18px auto 96px;display:flex;justify-content:center;align-items:center
}
.tdEndLearningArea[hidden]{display:none!important}
.tdEndLearningBtn{
  min-width:150px;border:1px solid #d7dee5;border-radius:12px;background:#fff;color:#5d6877;
  padding:11px 22px;font-size:14px;font-weight:850;cursor:pointer;box-shadow:0 6px 18px rgba(25,39,56,.05)
}
.tdEndLearningBtn:hover{border-color:#efb1b1;color:#b94a4a;background:#fff8f8}
.tdEndLearningModal{
  position:fixed!important;inset:0!important;z-index:260!important;display:flex!important;align-items:center!important;justify-content:center!important;
  padding:20px!important;background:rgba(31,42,57,.28)!important;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)
}
.tdEndLearningModal[hidden]{display:none!important}
body.tdEndLearningModalOpen{overflow:hidden!important}
.tdEndLearningDialog{
  width:min(440px,calc(100vw - 40px));box-sizing:border-box;border:1px solid #e0e5ea;border-radius:18px;background:#fff;
  padding:24px;box-shadow:0 24px 70px rgba(28,39,54,.20);text-align:center;color:#182235
}
.tdEndLearningDialog h2{margin:0 0 12px;font-size:21px}
.tdEndLearningDialog p{margin:0;color:#5f6b7b;font-size:14px;line-height:1.75}
.tdEndLearningActions{display:flex;justify-content:center;gap:10px;margin-top:22px}
.tdEndLearningActions button{
  min-width:108px;border-radius:11px;padding:10px 16px;font-size:14px;font-weight:850;cursor:pointer
}
.tdEndLearningActions .secondary{border:1px solid #d7dee5;background:#fff;color:#465365}
.tdEndLearningActions .danger{border:1px solid #d9534f;background:#d9534f;color:#fff}
@media(max-width:560px){
  .tdEndLearningArea{width:calc(100% - 24px);margin-bottom:82px}
  .tdEndLearningDialog{padding:21px 18px}
  .tdEndLearningActions{flex-direction:column-reverse}
  .tdEndLearningActions button{width:100%}
}


/* TD_FIXED_VIEWPORT_PLAYER_V2
   One player surface on desktop and mobile. It stays pinned to the viewport
   while the document scrolls, including before AI processing has completed. */
.tdlwPlayer.tdlwPlayerViewport{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;
  transform:translateX(-50%)!important;
  width:min(1180px,calc(100vw - 28px))!important;
  max-width:calc(100vw - 28px)!important;
  z-index:10000!important;
  margin:0!important;
  box-sizing:border-box!important;
  grid-template-columns:auto minmax(150px,.7fr) minmax(0,2fr) auto!important;
  border:1px solid #cfe4d9!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 14px 42px rgba(31,49,67,.22)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.tdlwPlayer.tdlwPlayerViewport.collapsed{
  width:min(640px,calc(100vw - 28px))!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  padding:8px 10px!important;
}
.tdlwPlayer.tdlwPlayerViewport.collapsed .tdlwPlayerControls{display:none!important}
@media(max-width:850px){
  .tdlwPlayer.tdlwPlayerViewport{
    left:9px!important;
    right:9px!important;
    bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    border-radius:16px!important;
  }
  .tdlwPlayer.tdlwPlayerViewport.collapsed{
    left:9px!important;
    right:9px!important;
    width:auto!important;
    max-width:none!important;
  }
  body.tdlwPlayerDocked{padding-bottom:calc(124px + env(safe-area-inset-bottom,0px))!important}
  body.tdlwPlayerDocked.tdlwPlayerCollapsed{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))!important}
}


/* TD_FIXED_VIEWPORT_PLAYER_V3_SINGLE_ROW
   Phone expanded player stays on one horizontal row. Controls scroll sideways
   instead of wrapping into a tall multi-row panel. */
@media(max-width:850px){
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed){
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    grid-template-rows:1fr!important;
    align-items:center!important;
    gap:7px!important;
    padding:8px!important;
    min-height:58px!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerState{
    display:none!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerControls{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:6px!important;
    min-width:0!important;
    width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    padding:0 2px!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerControls::-webkit-scrollbar{
    display:none!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerControls button{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    min-width:auto!important;
    width:auto!important;
    margin:0!important;
    padding:9px 11px!important;
    border-radius:10px!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerCollapse{
    position:static!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:9px 11px!important;
    white-space:nowrap!important;
  }
  body.tdlwPlayerDocked:not(.tdlwPlayerCollapsed){
    padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))!important;
  }
}


/* TD_DRAGGABLE_VIEWPORT_PLAYER_20261003
   Drag from the grip without stealing taps from playback controls. */
.tdlwPlayerDrag{
  width:30px!important;height:38px!important;min-width:30px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  border:1px solid #dce2e8!important;border-radius:10px!important;
  background:#f7faf8!important;color:#708092!important;
  font-size:18px!important;font-weight:900!important;line-height:1!important;
  cursor:grab!important;touch-action:none!important;user-select:none!important;
  -webkit-user-select:none!important;-webkit-touch-callout:none!important;
}
.tdlwPlayer.tdlwPlayerViewport.tdlwPlayerDragging .tdlwPlayerDrag{cursor:grabbing!important;background:#edf8f2!important;color:#16845c!important;border-color:#bfe5d4!important}
@media(min-width:851px){
  .tdlwPlayerDrag[data-tdlw-tooltip]::after{
    content:attr(data-tdlw-tooltip);
    position:absolute;
    left:50%;
    bottom:calc(100% + 8px);
    transform:translateX(-50%);
    display:none;
    width:max-content;
    max-width:220px;
    padding:6px 9px;
    border-radius:8px;
    background:#1f2a39;
    color:#fff;
    font-size:12px;
    font-weight:700;
    line-height:1.25;
    white-space:nowrap;
    box-shadow:0 6px 20px rgba(31,42,57,.2);
    pointer-events:none;
    z-index:10001;
  }
  .tdlwPlayerDrag[data-tdlw-tooltip]:hover::after{
    display:block;
  }
}
.tdlwPlayer.tdlwPlayerViewport.tdlwPlayerMoved{
  left:var(--tdlw-player-left)!important;
  top:var(--tdlw-player-top)!important;
  right:auto!important;
  bottom:auto!important;
  transform:none!important;
}
@media(max-width:850px){
  .tdlwPlayerDrag{width:28px!important;min-width:28px!important;height:38px!important}
  .tdlwPlayer.tdlwPlayerViewport.tdlwPlayerMoved{
    left:var(--tdlw-player-left)!important;
    top:var(--tdlw-player-top)!important;
    right:auto!important;
    bottom:auto!important;
    transform:none!important;
    width:calc(100vw - 18px)!important;
    max-width:calc(100vw - 18px)!important;
  }
}


/* TD_DESKTOP_PREHYDRATE_RESULT_20261003
   Desktop only: hide the legacy raw-transcript card until the functional
   learning side replaces it. Phone layout remains unchanged. */
@media(min-width:901px){
  #result.result.show>.card:nth-child(2):not(.tdLearningSide){
    visibility:hidden!important;
    pointer-events:none!important;
  }
}


/* TD_DESKTOP_PLAYER_SINGLE_ROW_20261003
   Desktop/continued-learning player: keep every control on one horizontal row
   and preserve the draggable grip. */
@media(min-width:851px){
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed){
    display:grid!important;
    grid-template-columns:auto minmax(170px,220px) minmax(0,1fr) auto!important;
    grid-template-rows:1fr!important;
    align-items:center!important;
    gap:8px!important;
    width:min(1400px,calc(100vw - 120px))!important;
    max-width:calc(100vw - 120px)!important;
    padding:9px 11px!important;
    min-height:60px!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerState{
    min-width:0!important;
    overflow:hidden!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerState strong,
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerState span{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerControls{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:6px!important;
    min-width:0!important;
    width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
    padding:0!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerControls::-webkit-scrollbar{
    display:none!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerControls button{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    width:auto!important;
    min-width:auto!important;
    margin:0!important;
    padding:9px 10px!important;
  }
  .tdlwPlayer.tdlwPlayerViewport:not(.collapsed) .tdlwPlayerCollapse{
    position:static!important;
    grid-column:auto!important;
    grid-row:auto!important;
    align-self:center!important;
    justify-self:end!important;
    margin:0!important;
    white-space:nowrap!important;
  }
  .tdlwPlayer.tdlwPlayerViewport.tdlwPlayerMoved{
    width:min(1400px,calc(100vw - 120px))!important;
    max-width:calc(100vw - 120px)!important;
  }
  .tdlwPlayerDrag{
    position:relative!important;
    z-index:2!important;
    pointer-events:auto!important;
    cursor:grab!important;
  }
}