/* Mobile layout: same portal, same pages; the sidebar becomes a slide-in menu on phones/tablets. */
.nav-toggle,.nav-backdrop{display:none}
@media(max-width:900px){
  html,body{overflow-x:hidden}
  .wrapper{display:block}
  .sidebar{position:fixed;inset:0 auto 0 0;width:min(82vw,290px);height:100vh;height:100dvh;overflow-y:auto;transform:translateX(-105%);transition:transform .2s ease;z-index:1200;box-shadow:none}
  body.nav-open .sidebar{transform:none;box-shadow:8px 0 30px #0006}
  .nav-backdrop{position:fixed;inset:0;z-index:1150;background:#0008}
  body.nav-open .nav-backdrop{display:block}
  body.nav-open{overflow:hidden}
  .nav-toggle{display:inline-grid;place-items:center;flex:none;width:42px;height:42px;margin-right:12px;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);font-size:22px;line-height:1}
  .sidebar nav a{min-height:46px;display:flex;align-items:center}
  .main-content{width:100%;margin:0;padding:14px 14px 90px}
  .topbar{position:sticky;top:0;z-index:1000;margin:-14px -14px 16px;padding:10px 14px;gap:8px;justify-content:flex-start;background:var(--canvas);border-bottom:1px solid var(--line)}
  .topbar>div{min-width:0;flex:1}
  .topbar h1{font-size:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .topbar small{display:none}
  .topbar form{display:flex;align-items:center;flex:none}
  .user-chip{display:none}
  .surface,.card,.metric{padding:14px}
  .table-responsive,.surface:has(>table),.card-body:has(>table){overflow-x:auto;-webkit-overflow-scrolling:touch}
  table{display:block;max-width:100%;overflow-x:auto;white-space:nowrap}
  .table>:not(caption)>*>*{padding:10px 9px}
  pre,code,textarea{max-width:100%}
  .btn{min-height:40px}
  .form-control,.form-select{font-size:16px}
  .row>[class*=col-]{flex:0 0 100%;max-width:100%}
  .section-head,.yaml-editor-heading{flex-wrap:wrap;gap:8px}
  img,svg,video{max-width:100%;height:auto}
}
@media(max-width:720px){
  .friday-panel{width:100vw!important;max-width:100vw!important}
  .friday-launcher{right:12px!important;bottom:12px!important}
  .testing-bot-fab{right:12px;bottom:12px;width:52px;height:52px}
  .bot-message{max-width:92%}
  .modal-dialog{margin:.5rem}
}