/* 2026-10-16 — expanded-card layout correction + compact scroll reference.
   Important: no change to closed-card front, completed gold-star back,
   Quranic words, assessment keys, or lesson behavior. */
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-flip-scene,
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-flip-rotor{
  min-height:0!important;
  height:auto!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto;
  column-gap:clamp(8px,2vw,20px);
  row-gap:4px;
  align-items:center!important;
  min-height:0!important;
  width:100%!important;
  padding:13px clamp(14px,2.7vw,26px)!important;
  text-align:right!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .parent-top{
  grid-column:1/-1;display:flex!important;justify-content:flex-start!important;
  align-items:center!important;min-height:0!important;margin:0!important;
  gap:6px!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .item-title{
  grid-column:1;min-width:0!important;margin:0!important;padding:0!important;
  align-items:center!important;justify-content:flex-start!important;min-height:0!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .item-title strong{
  font-size:clamp(21px,2.3vw,29px)!important;line-height:1.75!important;
  text-align:right!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .item-icon{
  display:none!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .item-desc{
  grid-column:2;display:flex!important;justify-content:flex-end!important;align-items:center!important;
  gap:7px!important;flex-wrap:wrap!important;margin:0!important;padding:0!important;
}
/* Hiding a redundant open-card button saves height but doesn't affect
   the parent card's existing open/close handler. */
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .card-open-hint{
  display:none!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .tree{
  min-width:0!important;
}
body.juz-learning-page.card-detail-active #module-one-view #cards .hybrid-select-grid .branch{
  min-width:0!important;
}
/* Compact learning reference: fixed to viewport, not nested inside a scroll/
   transform container; never shifts the ayah grid or obscures the header. */
#mla-sticky-reference{
 position:fixed;top:8px;left:50%;transform:translate(-50%,-140%);
 z-index:1200;width:max-content;max-width:calc(100vw - 24px);
 padding:8px 18px;box-sizing:border-box;
 display:flex;align-items:center;justify-content:center;gap:12px;direction:rtl;
 color:#fff;background:#083866;border:1px solid #6fb3ed;
 border-radius:15px;box-shadow:0 6px 20px rgba(2,28,63,.28);
 pointer-events:none;opacity:0;visibility:hidden;
 transition:opacity .15s ease,transform .15s ease,visibility .15s ease;
}
#mla-sticky-reference.is-visible{opacity:1;visibility:visible;transform:translate(-50%,0);}
#mla-sticky-reference .mla-ref-label{flex-shrink:0;color:#b9e6e7;font-size:12px;font-weight:700;}
#mla-sticky-reference .mla-ref-phrase{font-family:inherit;font-size:clamp(16px,2vw,22px);font-weight:850;line-height:1.65;text-align:center;min-width:0;}
@media(max-width:650px){
 body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front{
  grid-template-columns:1fr!important;row-gap:5px!important;
 }
 body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .item-title,
 body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .item-desc{
  grid-column:1!important;
 }
 body.juz-learning-page.card-detail-active #module-one-view #cards .modern-card.open .card-face-front .item-desc{
  justify-content:flex-start!important;
 }
 #mla-sticky-reference{top:5px;gap:7px;padding:6px 12px;border-radius:12px;width:calc(100vw - 24px);}
 #mla-sticky-reference .mla-ref-phrase{font-size:17px;line-height:1.6;}
 #mla-sticky-reference .mla-ref-label{font-size:10px;}
}
@media(prefers-reduced-motion:reduce){#mla-sticky-reference{transition:none!important;}}
