/* SafariAnts destination page: authoritative layout overrides.
   Loaded after app.css, layout-destination.css and site-fixes.css. */
*,*::before,*::after{box-sizing:border-box}
@media (min-width:821px){
  html,body{height:100%!important;min-height:100%!important}
  body.layout-destination{overflow:hidden!important}
  .sa-place-layout.page{
    display:grid!important;
    grid-template-columns:minmax(160px,.82fr) minmax(280px,1.7fr) minmax(180px,.95fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    gap:12px!important;
    width:100%!important;
    max-width:1900px!important;
    height:calc(100vh - 70px)!important;
    height:calc(100dvh - 70px)!important;
    min-height:0!important;
    max-height:calc(100dvh - 70px)!important;
    margin:0 auto!important;
    padding:12px!important;
    overflow:hidden!important;
    align-items:stretch!important;
    position:relative!important;
  }
  .sa-place-layout.page>.left-pane,
  .sa-place-layout.page>.main-pane,
  .sa-place-layout.page>.right-pane{
    display:block!important;
    grid-row:1!important;
    grid-column:auto!important;
    float:none!important;
    position:relative;
    width:auto!important;
    min-width:0!important;
    min-height:0!important;
    height:100%!important;
    max-height:100%!important;
    margin:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:contain!important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-gutter:stable;
    align-self:stretch!important;
  }
  .sa-place-layout.page>.main-pane{position:relative!important;scroll-behavior:auto!important}
  /* Keep all three columns in the grid; never let the right pane wrap to a new row. */
  .sa-place-layout.page>.right-pane{grid-column:auto!important;display:block!important}
  /* The action bar overlays the top of the centre pane without changing layout. */
  .sa-place-layout .sa-floating-actions{
    display:flex!important;
    position:sticky!important;
    top:0!important;
    z-index:50!important;
    flex-wrap:wrap;
    align-items:center;
    margin:0 0 -48px!important;
    min-height:44px;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-8px)!important;
    transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s!important;
  }
  .sa-place-layout .sa-floating-actions.sa-floating-visible{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
    transition:opacity .22s ease,transform .22s ease,visibility 0s!important;
  }
}
@media (max-width:820px){
  html,body{height:auto!important;min-height:100%!important}
  body.layout-destination{overflow-x:hidden!important;overflow-y:auto!important}
  .sa-place-layout.page{
    display:flex!important;flex-direction:column!important;gap:10px!important;
    width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
    margin:0!important;padding:10px!important;overflow:visible!important;
  }
  .sa-place-layout.page>.left-pane,
  .sa-place-layout.page>.main-pane,
  .sa-place-layout.page>.right-pane{
    display:block!important;position:relative!important;float:none!important;
    width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
    overflow:visible!important;
  }
  .sa-place-layout.page>.main-pane{order:1!important}
  .sa-place-layout.page>.left-pane{order:2!important}
  .sa-place-layout.page>.right-pane{order:3!important}
  .sa-place-layout .sa-floating-actions{position:sticky!important;top:0!important;z-index:50!important}
}
@media(prefers-reduced-motion:reduce){
  .sa-place-layout .sa-floating-actions{transition:none!important}
}