/* 按学习卡实际宽度排版；不缩放页面，不改用户浏览器缩放。 */
.learning-page-layer:has(.learning-word-card) {
  min-width:0; padding:clamp(8px,2vw,28px)!important; padding-bottom:72px!important;
}
.learning-main-canvas:has(.learning-word-card) {
  min-width:0; min-height:0!important; aspect-ratio:auto!important;
  max-height:100%; padding:16px 48px!important;
}
.learning-word-card {
  container:lesson-word / inline-size;
  min-width:0; width:100%; flex:1 0 auto; max-width:1200px!important;
  justify-content:center; padding-block:12px;
}
[data-lesson-scroll]:has(.learning-word-card) {
  min-width:0; min-height:0; flex:1 1 auto;
  justify-content:flex-start!important; overflow:auto; scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
.learning-word-card > [data-lesson-grid] {
  display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr);
  align-items:start; gap:clamp(20px,3cqi,40px)!important;
}
[data-lesson-main],[data-lesson-aside] {
  grid-column:auto!important; min-width:0; min-height:0!important; height:auto!important;
  gap:clamp(16px,2cqi,28px)!important;
}
[data-lesson-lines] {
  min-width:0; grid-template-columns:auto minmax(0,1fr)!important;
  column-gap:12px!important; row-gap:20px!important; align-items:center;
}
[data-lesson-lines]>span {font-size:clamp(18px,2.5cqi,26px)!important; line-height:1.4;}
[data-lesson-slot] {min-width:0; max-width:100%;}
[data-lesson-fit] {
  font-size:var(--lesson-fit-font)!important;
  width:max-content; max-width:none; min-width:0;
  flex-wrap:nowrap!important; white-space:nowrap!important;
  transform:none!important; transition:color .15s!important;
}
[data-lesson-fit="phonetic"] {line-height:1.35!important;}
[data-lesson-fit]>span {font-size:inherit!important;transition:color .15s!important;}
[data-lesson-fit="word"] {column-gap:0!important;}
[data-lesson-fit][data-lesson-wrap="true"] {width:100%; flex-wrap:wrap!important; white-space:normal!important; row-gap:.1em;}
[data-lesson-fit][data-lesson-wrap="true"] > span {
  min-width:0; max-width:100%; white-space:pre-wrap!important; overflow-wrap:anywhere;
}
.learning-word-card [aria-label="快速记忆"] {min-width:0; overflow-wrap:anywhere;}
.learning-word-card [aria-label="快速记忆"] :is(div,p) {font-size:clamp(16px,2.2cqi,20px)!important;}
.learning-word-card [data-learning-translation] {
  min-width:0; max-width:100%; 
  line-height:1.35; overflow-wrap:anywhere; text-wrap:pretty;
}
.learning-word-card [data-learning-translation]>span {max-width:100%; min-width:0;}
.learning-word-card [data-learning-translation]>span:first-child:not(:last-child) {font-size:.8em!important;}
.learning-word-card [title="点击图片听慢速英式英语朗读"] {
  min-width:0; width:100%; max-width:clamp(140px,30cqi,240px)!important;
}
.learning-word-card [title="点击图片听慢速英式英语朗读"]>img {object-fit:contain;}
.learning-word-card [title="点击图片听慢速英式英语朗读"]>div:first-child:has(>span) {
  min-width:0; padding:10px!important;
}
.learning-word-card [title="点击图片听慢速英式英语朗读"]>div:first-child>span:first-of-type {
  max-width:100%; min-width:0; font-size:clamp(16px,2.5cqi,26px)!important;
  line-height:1.2; overflow-wrap:anywhere; text-wrap:balance;
}
.learning-main-canvas:has(.learning-word-card) .learning-footer-controls {
  min-width:0; flex-shrink:0; flex-flow:row wrap!important;
  justify-content:center; gap:8px; margin-top:12px; padding:10px 0 0;
}
.learning-main-canvas:has(.learning-word-card) .learning-footer-controls>:is(:first-child,:last-child):not(:has(button)) {display:none!important;}
.learning-main-canvas:has(.learning-word-card) .learning-footer-controls>div {min-width:0!important; max-width:100%;}
.learning-main-canvas:has(.learning-word-card) .learning-footer-controls .scrollbar-none {
  flex-wrap:wrap; justify-content:center; white-space:normal;
}
@container lesson-word (max-width:760px) {
  .learning-word-card > [data-lesson-grid] {grid-template-columns:minmax(0,1fr); gap:24px!important;}
  [data-lesson-aside] {display:grid!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:20px!important;}
  [data-lesson-aside]>div:first-child {min-height:0!important;}
}
@container lesson-word (max-width:440px) {
  [data-lesson-lines] {grid-template-columns:minmax(0,1fr)!important; row-gap:8px!important;}
  [data-lesson-lines]>span:nth-of-type(2) {margin-top:10px;}
  [data-lesson-aside] {grid-template-columns:minmax(0,1fr);}
  [data-lesson-aside]>div:first-child {justify-content:flex-start!important;text-align:left;}
  .learning-word-card [data-learning-translation] {justify-content:flex-start;}
  .learning-word-card [title="点击图片听慢速英式英语朗读"] {max-width:220px!important;}
}
@media (max-height:800px) {
  .learning-word-card>[data-lesson-grid] {gap:16px!important;}
  [data-lesson-main],[data-lesson-aside] {gap:12px!important;}
  .learning-word-card [aria-label="快速记忆"] {gap:8px!important;padding-block:8px!important;}
}
/* 底部原反馈/老师入口有独立空间，短窗口中课程正文在其上方滚动。 */
.student-course-page {height:100dvh; min-height:0!important; overflow:hidden!important; display:flex; flex-direction:column; padding-bottom:64px;}
.student-course-page .student-course-header {flex-shrink:0;}
.student-course-page .student-course-shell {min-height:0; flex:1; overflow:auto; overscroll-behavior:contain;}
.student-directory-scrollbar {padding-bottom:72px!important; scroll-padding-block:16px 84px;}
/* 窄窗口的目录变成横向词条条带；保留全部词条和原点击行为。 */
@media (max-width:1023px) {
  .learning-stage-entry>header {flex-wrap:wrap; gap:8px; padding:8px 12px;}
  .learning-stage-entry>header>div {min-width:0; gap:8px;}
  .learning-stage-entry>header>div:nth-child(2):not(:has(button)) {display:none;}
  .learning-stage-entry>main>div:has(>.student-directory-scrollbar) {
    height:108px; max-height:108px; min-height:0; padding:6px 12px;
  }
  .student-directory-scrollbar {
    display:flex; gap:8px; height:70px; min-height:0; overflow:auto hidden;
    padding:0 0 6px!important; scroll-padding:8px;
  }
  .student-directory-scrollbar>div {flex:0 0 180px; min-width:0; margin-block:0!important;}
}
/* 高缩放/短窗口允许纵向滚动，不把内容夹成几像素高的窗口。 */
@media (max-height:600px) {
  .learning-stage-entry:has(.learning-word-card) {height:auto!important; min-height:100dvh; max-height:none!important; overflow:visible!important;}
  .learning-stage-entry:has(.learning-word-card)>main {flex:1 0 auto; min-height:540px; overflow:visible;}
  .learning-page-layer:has(.learning-word-card) {overflow:visible;}
  .learning-fullscreen-layer:has(.learning-word-card) {height:auto;}
  .learning-main-canvas:has(.learning-word-card) {min-height:440px!important;}
}
@media (max-width:1023px), (max-height:800px) {
  body:has(.learning-stage-entry .learning-word-card)::after {
    content:""; position:fixed; inset:auto 0 0; height:64px; z-index:90;
    background:var(--color-bg-canvas); border-top:1px solid var(--color-border-card); pointer-events:none;
  }
  html:has(.learning-stage-entry .learning-word-card) .st-walker-host .tutu-walking-lane {height:56px!important;bottom:4px!important;}
  html:has(.learning-stage-entry .learning-word-card) .st-walker-host .tutu-walking-actor {width:56px!important;height:56px!important;}
  html:has(.learning-stage-entry .learning-word-card) [data-lesson-idle-caption] {display:none!important;}
}
/* Framer's transformed stage is a fixed-position containing block; put the
   footer backdrop on body so it remains on the viewport while the page scrolls. */
@media (max-width:440px) {
  body:has(.learning-stage-entry .learning-word-card)::after {height:108px;}
  .learning-page-layer:has(.learning-word-card) {padding-bottom:116px!important;}
  html:has(.learning-stage-entry .learning-word-card) .st-walker-host .tutu-walking-lane {bottom:48px!important;}
}