/* OATR · responsive.css
   
   Extracted verbatim from OTA.html. Loaded in cascade order. */

/* ===== RESPONSIVE MEDIA (rebuild — placed last to win the cascade) ===== */
.bottom-nav{display:none}
@media(max-width:1023px){
  #fxSwitch{display:none}
  .nav-burger{display:flex}
  .lp{position:fixed;top:54px;left:0;bottom:0;z-index:150;width:284px;flex:0 0 284px;transform:translateX(-100%);transition:transform var(--dur-base,.24s) var(--ease-enter,ease)}
  .lp.open{transform:none;box-shadow:0 24px 70px rgba(0,0,0,.55)}
  /* mobile bottom-nav: a flex row at the end of the frame column (no fixed overlap with risk-bar) */
  .bottom-nav{display:flex;flex:0 0 auto;border-top:1px solid var(--border);background:var(--surface)}
  .bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:7px 0 8px;font-size:10.5px;font-weight:700;color:var(--text-2);min-height:54px}
  .bottom-nav button.active{color:var(--accent)}
  .bottom-nav button i[data-ic]{font-size:20px}
  .fx-palette{bottom:70px}  /* lift FX button above the bottom-nav */
}
@media(max-width:599px){
  .strip{flex-wrap:wrap;gap:8px;padding:8px 12px}
  .ad{display:none}
  .strip-ctrl{margin-left:auto}
  .board-head{flex-wrap:wrap;gap:10px;padding:12px 12px 4px}
  .bh-right{width:100%;flex-wrap:wrap}
  .board-search{width:100%}
  .board{padding:10px 12px 24px}
  .proto-brand span{display:none}
  .proto-center{gap:6px}
  .drawer{width:100%;max-width:100%}  /* full-screen sheets on phones */
}