@media (max-width: 1080px){
  .bb-hero{ grid-template-columns:1fr; }
  .bb-hero-art{ order:-1; }
  .bb-hero-art img{ width:200px; height:200px; }
}

@media (max-width: 900px){
  .bb-shell{ grid-template-columns:1fr; }
  .bb-sidebar{
    position:relative; height:auto; border-right:none;
    border-bottom:1px solid var(--bb-line);
    display:none;
  }
  .bb-sidebar.is-open{ display:block; }
  .bb-mobile-bar{
    display:flex; align-items:center; justify-content:space-between;
    padding:16px 20px; border-bottom:1px solid var(--bb-line);
    background:var(--bb-card);
    position:sticky; top:0; z-index:60;
  }
  .bb-mobile-bar .bb-brand{ margin:0; }
  .bb-mobile-bar .bb-brand img{ width:38px; height:38px; }
  .bb-mobile-bar .bb-brand-name{ font-size:1.02rem; }
  .bb-menu-btn{
    background:var(--bb-blue-50); border:1px solid var(--bb-line);
    border-radius:10px; width:40px; height:40px;
    display:flex; align-items:center; justify-content:center;
  }
  .bb-main{ padding:24px 18px 60px; }
}

@media (max-width: 720px){
  .bb-grid{ grid-template-columns:1fr; }
  .bb-topbar{ justify-content:flex-start; }
  .bb-detail-section{ padding:22px 18px; }
}

@media (max-width: 480px){
  .bb-lang-btn span.bb-label, .bb-theme-btn span.bb-label{ display:none; }
  .bb-pdf-btn span.bb-label{ font-size:.8rem; }
}