/* Grade 8 · Unit 1 vocabulary cards · scoped visual QA design.
   No global teacher, student progress, or other unit styles are modified. */
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]:not([data-mastery-study-hidden]){
 display:grid!important;
 grid-template-columns:repeat(3,minmax(0,1fr))!important;
 gap:16px!important;
 align-items:stretch;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]>.vocab-card{
 display:grid!important;
 grid-template-columns:96px minmax(0,1fr)!important;
 gap:15px!important;
 align-items:center!important;
 min-height:178px;
 min-width:0;
 padding:16px!important;
 border:1px solid #cbded8!important;
 border-radius:19px!important;
 background:#fff!important;
 box-shadow:0 4px 13px rgba(13,76,65,.055)!important;
 transform:none;
 transition:box-shadow .18s ease,border-color .18s ease;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]>.vocab-card:hover{
 border-color:#90c4b4!important;
 box-shadow:0 7px 20px rgba(13,76,65,.11)!important;
 transform:none!important;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .sgk-3d-visual.small{
 width:96px!important;
 height:96px!important;
 min-width:96px;
 align-self:center;
 border-radius:16px;
 box-shadow:0 4px 10px rgba(28,72,68,.10)!important;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .sgk-3d-visual.real>img{
 display:block!important;
 width:100%!important;
 height:100%!important;
 object-fit:contain!important;
 object-position:center!important;
 padding:3px!important;
 box-sizing:border-box!important;
 background:#f4faf7;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .sgk-3d-visual.image-fallback{
 border:1px dashed #89b6a7!important;
 background:linear-gradient(145deg,#eaf9f3,#e7f2ff)!important;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-copy{
 display:grid!important;
 gap:7px!important;
 min-width:0;
 overflow-wrap:break-word;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-term-audio-row,
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-example-audio-row{
 display:grid!important;
 grid-template-columns:minmax(0,1fr) 40px;
 column-gap:9px;
 align-items:start;
 min-width:0;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-en{
 display:grid!important;
 grid-template-columns:22px minmax(0,1fr);
 column-gap:8px;
 row-gap:2px;
 align-items:start;
 min-width:0;
 line-height:1.26;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-en::before{
 grid-column:1;grid-row:1;
 margin-top:5px;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-en>b{
 grid-column:2;grid-row:1;
 min-width:0;
 font-size:clamp(17px,1.15vw,21px)!important;
 line-height:1.23!important;
 overflow-wrap:break-word;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-en>em{
 grid-column:2;grid-row:2;
 font-size:13.5px!important;
 line-height:1.35!important;
 color:#286a5d!important;
 font-weight:650;
 white-space:normal;
 overflow-wrap:anywhere;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-vi{
 font-size:15.5px!important;
 line-height:1.42!important;
 min-width:0;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-example,
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-example-vi{
 font-size:14.5px!important;
 line-height:1.47!important;
 overflow-wrap:break-word;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-icon-listen{
 width:40px!important;
 height:40px!important;
 padding:0!important;
 min-width:40px;
 border-radius:12px;
 align-self:start;
}
#vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-icon-listen:focus-visible{
 outline:3px solid #5aa9a0!important;
 outline-offset:2px;
}
@media(max-width:1390px){
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
 }
}
@media(max-width:760px){
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]{
  grid-template-columns:1fr!important;gap:12px!important;
 }
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]>.vocab-card{
  grid-template-columns:76px minmax(0,1fr)!important;
  padding:12px!important;gap:12px!important;min-height:132px;
 }
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .sgk-3d-visual.small{
  width:76px!important;height:76px!important;min-width:76px;
 }
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-en>b{font-size:17px!important}
}
@media(max-width:390px){
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]>.vocab-card{
  grid-template-columns:62px minmax(0,1fr)!important;padding:10px!important;gap:9px!important;
 }
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .sgk-3d-visual.small{
  width:62px!important;height:62px!important;min-width:62px;
 }
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-term-audio-row,
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-example-audio-row{
  grid-template-columns:minmax(0,1fr) 34px;gap:6px;
 }
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"] .vocab-icon-listen{
  width:34px!important;height:34px!important;min-width:34px;
 }
}
@media(prefers-reduced-motion:reduce){
 #vocabGrid[data-vocab-grade="8"][data-vocab-unit="1"]>.vocab-card{transition:none!important}
}