/* ByShare v9 - fixed accessible mobile headers and dropdown navigation. */
:root{--byshare-mobile-nav:70px}
@media(max-width:820px){
  html{scroll-padding-top:calc(var(--byshare-mobile-nav) + env(safe-area-inset-top, 0px) + 12px)}
  .public-body{padding-top:calc(var(--byshare-mobile-nav) + env(safe-area-inset-top, 0px));overflow-x:clip}
  .public-header{
    position:fixed!important;top:0;right:0;left:0;width:100%;max-width:none;
    height:calc(var(--byshare-mobile-nav) + env(safe-area-inset-top, 0px));
    min-height:0!important;margin:0!important;
    padding:calc(9px + env(safe-area-inset-top, 0px)) max(16px,env(safe-area-inset-right,0px)) 9px max(16px,env(safe-area-inset-left,0px))!important;
    z-index:400;isolation:isolate;background:#fffcff;
    border-bottom:1px solid #e8ddf5;box-shadow:0 8px 24px #46306314;
  }
  .public-header .public-nav-mobile{position:static!important;z-index:auto}
  .public-menu-summary{position:relative;z-index:3;touch-action:manipulation}
  .public-nav-mobile[open]::before{
    content:'';position:fixed;inset:calc(var(--byshare-mobile-nav) + env(safe-area-inset-top, 0px)) 0 0;
    background:rgba(26,16,48,.42);z-index:1;
  }
  .public-header .public-nav-mobile-links{
    position:fixed!important;z-index:2!important;
    top:calc(var(--byshare-mobile-nav) + env(safe-area-inset-top, 0px) + 10px)!important;
    left:max(12px,env(safe-area-inset-left,0px))!important;
    right:max(12px,env(safe-area-inset-right,0px))!important;
    bottom:auto!important;width:auto!important;max-width:none!important;
    max-height:calc(100vh - var(--byshare-mobile-nav) - 32px);
    max-height:calc(100dvh - var(--byshare-mobile-nav) - env(safe-area-inset-top,0px) - 32px);
    overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    border-radius:18px!important;box-shadow:0 28px 70px #30204c4c!important;
  }
  body.public-menu-open{overflow:hidden}
  .public-main [id],.public-main :target{scroll-margin-top:calc(var(--byshare-mobile-nav) + 20px)}
  .workspace .top-bar{position:sticky;top:0;z-index:20;background:#fdfaff;box-shadow:0 7px 20px #46306311}
  .sidebar{padding-top:calc(14px + env(safe-area-inset-top,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
  .sidebar-mobile-close{display:inline-flex;position:absolute;top:calc(12px + env(safe-area-inset-top,0px));right:13px;z-index:2;min-width:44px;min-height:44px;align-items:center;justify-content:center;border:1px solid #d9cae9;border-radius:12px;background:#fff;color:#57328b;cursor:pointer}
  .sidebar>.brand-name{max-width:calc(100% - 35px)}
  body.sidebar-open .mobile-tabbar{pointer-events:none}
}
@media(min-width:821px){.public-body{padding-top:0}.public-nav-mobile[open]::before{display:none}}
@media(min-width:851px){.sidebar-mobile-close{display:none!important}}
@media(max-width:850px){.sidebar-mobile-close{display:inline-flex}}
@media(prefers-reduced-motion:reduce){.public-nav-mobile-links,.public-header{transition:none!important}}
/* Demo Studio layout */
.demo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.6fr);gap:20px;align-items:center}
.demo-grid>*,.demo-action-form{min-width:0}
.demo-action-form{display:grid;gap:12px}
.demo-credentials-text{display:block;box-sizing:border-box;width:100%;max-width:100%;min-height:175px;padding:15px 17px;resize:vertical;border-radius:14px;background:#fff;border:1px solid #cbb3e4;color:#3b2a55;font:600 13px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre;overflow:auto}
.demo-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.demo-grid p{line-height:1.7}
.demo-danger .field{min-width:0}
.demo-danger .btn{margin-top:15px}
@media(max-width:650px){.demo-grid{grid-template-columns:minmax(0,1fr)}.demo-action-form .btn{width:100%}.demo-actions .btn{flex:1;min-width:140px}.demo-credentials-text{font-size:12px}}
/* Four admin dashboard shortcuts now fit naturally on wide screens. */
@media(min-width:1100px){.admin-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr))}}