
@media(max-width:780px){
  /* Channel sheet: compact, readable, one clear active state. */
  #channelDrawer{padding-bottom:env(safe-area-inset-bottom)}
  #channelDrawer .channel-section-head{min-height:30px;padding:4px 7px}
  #channelDrawer .channel-choice{min-height:46px;padding:6px 8px;border-radius:10px}
  #channelDrawer .channel-choice.cf-channel-active-v174{
    background:var(--surface-selected);box-shadow:inset 3px 0 0 var(--accent)
  }
  #channelDrawer .channel-choice.cf-channel-active-v174::after{
    content:'Ativo';margin-left:auto;font-size:8px;color:var(--accent);font-weight:700
  }
  #channelDrawer .channel-last{font-size:8px}
  /* Theme surfaces consume the semantic contract consistently. */
  .page,.drawer,.mobile-drawer,.mobile-sheet-v160{color:var(--text-primary)}
  .panel,.card,.cnt-card,.drawer,.mobile-drawer{border-color:var(--stroke-subtle)}
  input,select,textarea{background:var(--surface-input);color:var(--text-primary);border-color:var(--stroke-default)}
  /* Avoid wasting vertical space in app bars without changing routing. */
  .cf-mobile-appbar-v161{min-height:42px!important;padding-top:4px!important;padding-bottom:4px!important}
  .cf-mobile-appbar-v161 p,.cf-mobile-appbar-v161 small{display:none!important}
  /* Consistent compact contextual toolbars. */
  #studio .toolbar,#studio .cnt-toolbar{gap:4px}
  #studio .toolbar .btn.small,#studio .cnt-toolbar .btn.small{min-height:34px}
}
