/* Compact desktop study desk: all card content and controls remain visible. */
@media (min-width:821px) and (min-height:620px){
  .study-modal-card{
    width:min(930px,calc(100vw - 40px));
    max-width:930px;
    max-height:calc(100vh - 34px);
    padding:22px 26px 20px;
    overflow:hidden;
  }
  #studyCardContent{
    display:grid;
    grid-template-columns:330px minmax(0,1fr);
    grid-template-areas:
      "navigation navigation"
      "identity examples"
      "definition examples"
      "feedback return";
    grid-template-rows:auto auto 1fr auto;
    gap:11px 22px;
    align-items:start;
  }
  #studyCardContent>.study-flash-nav{
    grid-area:navigation;
    width:auto;
    margin:-2px 34px 1px 0;
    padding-bottom:9px;
  }
  #studyCardContent>.study-hero{
    grid-area:identity;
    grid-template-columns:112px minmax(0,1fr);
    gap:15px;
  }
  #studyCardContent .study-photo{
    width:112px;
    height:112px;
    border-radius:16px;
  }
  #studyCardContent .study-hero h2{
    font-size:28px;
    margin:2px 0;
  }
  #studyCardContent .study-hero .eyebrow{
    font-size:8px;
    line-height:1.35;
    margin-bottom:4px;
  }
  #studyCardContent .study-pos{
    margin:0 0 8px;
    font-size:12px;
  }
  #studyCardContent>.definition-block{
    grid-area:definition;
    align-self:stretch;
    margin:0;
    padding:12px 14px;
  }
  #studyCardContent>.definition-block p{
    margin:5px 0;
    font-size:13px;
    line-height:1.4;
  }
  #studyCardContent>.definition-block small{
    font-size:10px;
    line-height:1.35;
  }
  #studyCardContent>.usage-list{
    grid-area:examples;
    min-width:0;
  }
  #studyCardContent>.usage-list h3{
    margin:0 0 5px;
    font-size:16px;
  }
  #studyCardContent>.usage-list>div{
    grid-template-columns:25px minmax(0,1fr);
    gap:9px;
    padding:8px 0;
  }
  #studyCardContent>.usage-list b{
    width:24px;
    height:24px;
    font-size:10px;
  }
  #studyCardContent>.usage-list p{
    margin:1px 0;
    font-size:12px;
    line-height:1.38;
  }
  #studyCardContent>.content-feedback-button{
    grid-area:feedback;
    align-self:stretch;
    height:40px;
    margin:0;
    padding:8px 10px;
    font-size:9px;
  }
  #studyCardContent>.primary-btn[data-close="cardDetailModal"]{
    grid-area:return;
    align-self:stretch;
    height:40px;
    margin:0;
    padding:8px 14px;
  }
}

/* Phones and unusually short windows retain the safe single-column fallback. */
@media (max-width:820px),(max-height:619px){
  .study-modal-card{overflow:auto}
}
