/* Baskibu Designer 0.23.9 — Unified Adaptive Inspector
 * Phone + narrow tablet: one iOS-style bottom inspector with a stable geometry for every primary tool.
 * Wide tablet: the same inspector becomes a right-side sheet.
 * Desktop: the inspector lives on the right side of the workspace.
 */

.bbd-app.bbd-release-0239{
  --bbd-0239-sheet-height:min(72dvh,680px);
  --bbd-0239-sheet-expanded-height:min(91dvh,820px);
  --bbd-0239-sheet-radius:20px;
  --bbd-0239-sheet-gap:8px;
  --bbd-0239-dock-height:64px;
}

/* ----------------------------- PHONE ----------------------------------- */
@media (max-width:899px), (min-width:900px) and (max-width:1100px) and (orientation:portrait){
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel,
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel[hidden],
  .bbd-app.bbd-release-0239.bbd-0237-product-options-open > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel,
  .bbd-app.bbd-release-0239.bbd-0238-product-options-open > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel{
    position:absolute!important;
    top:auto!important;
    right:var(--bbd-0239-sheet-gap)!important;
    bottom:calc(var(--bbd-0239-dock-height) + var(--bbd-0239-sheet-gap))!important;
    left:var(--bbd-0239-sheet-gap)!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:var(--bbd-0239-active-sheet-height,var(--bbd-0239-sheet-height))!important;
    min-height:320px!important;
    max-height:calc(100dvh - 92px)!important;
    display:flex!important;
    flex-direction:column!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid rgba(148,163,184,.34)!important;
    border-radius:var(--bbd-0239-sheet-radius)!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 -18px 50px rgba(15,23,42,.16),0 3px 10px rgba(15,23,42,.05)!important;
    transform:translate3d(0,0,0)!important;
    transition:height 240ms cubic-bezier(.22,.8,.22,1),transform 220ms cubic-bezier(.22,.8,.22,1),opacity 180ms ease!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }

  .bbd-app.bbd-release-0239.bbd-0239-sheet-expanded > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel,
  .bbd-app.bbd-release-0239.bbd-0239-sheet-expanded > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel[hidden]{
    height:var(--bbd-0239-active-sheet-height,var(--bbd-0239-sheet-expanded-height))!important;
  }

  /* One shared header. It never changes size between Product/Text/Layers/etc. */
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel > .bbd-mobile-sheet-bar{
    position:relative!important;
    top:auto!important;
    z-index:20!important;
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr) 34px!important;
    align-items:center!important;
    gap:6px!important;
    width:100%!important;
    height:48px!important;
    min-height:48px!important;
    flex:0 0 48px!important;
    margin:0!important;
    padding:8px 9px 6px!important;
    border:0!important;
    border-bottom:1px solid rgba(226,232,240,.9)!important;
    background:rgba(255,255,255,.96)!important;
    backdrop-filter:blur(18px) saturate(1.16)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.16)!important;
  }

  .bbd-app.bbd-release-0239 #bbd-mobile-sheet-title{
    align-self:center!important;
    overflow:hidden!important;
    font-size:13px!important;
    font-weight:800!important;
    line-height:1.15!important;
    letter-spacing:-.01em!important;
    text-align:center!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  .bbd-app.bbd-release-0239 #bbd-mobile-sheet-back{
    visibility:hidden!important;
    pointer-events:none!important;
  }

  .bbd-app.bbd-release-0239 #bbd-mobile-sheet-close{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    min-height:30px!important;
    justify-self:end!important;
    border:0!important;
    border-radius:10px!important;
    background:#f1f5f9!important;
    color:#64748b!important;
    font-size:22px!important;
    line-height:1!important;
  }

  /* Real iOS-style grabber. JS turns it into a two-snap drag handle. */
  .bbd-app.bbd-release-0239 .bbd-mobile-sheet-grip{
    position:absolute!important;
    top:4px!important;
    left:50%!important;
    z-index:30!important;
    width:38px!important;
    height:4px!important;
    margin:0!important;
    border-radius:999px!important;
    background:#cbd5e1!important;
    transform:translateX(-50%)!important;
    cursor:ns-resize!important;
    touch-action:none!important;
    pointer-events:auto!important;
  }
  .bbd-app.bbd-release-0239 .bbd-mobile-sheet-grip::after{
    content:"";
    position:absolute;
    inset:-9px -14px;
  }

  /* The shell has one scroll owner: its visible panel section. Individual rich
     editors can still own a nested scroller when they explicitly need it. */
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel > .bbd-panel-section:not([hidden]){
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    gap:10px!important;
    margin:0!important;
    padding:10px 11px calc(22px + env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    scrollbar-gutter:stable!important;
    box-sizing:border-box!important;
  }

  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel > .bbd-panel-section[hidden],
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel > .bbd-panel-edge-toggle{
    display:none!important;
  }

  /* Product option focus keeps the option list itself as the scroll owner, but
     it no longer changes the outer sheet height. */
  .bbd-app.bbd-release-0239.bbd-0238-product-options-open #bbd-panel > .bbd-panel-section:not([hidden]){
    overflow:hidden!important;
  }
  .bbd-app.bbd-release-0239.bbd-0238-product-options-open #bbd-panel [data-bbd-v53-options]{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
  }
  .bbd-app.bbd-release-0239.bbd-0238-product-options-open #bbd-panel [data-bbd-v53-options-body]{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    padding-bottom:34px!important;
  }

  /* Stable shell means menu changes feel like one inspector changing content,
     not six unrelated drawers opening at different heights. */
  .bbd-app.bbd-release-0239 #bbd-panel .bbd-panel-section.bbd-0239-section-enter:not([hidden]){
    animation:bbd0239SectionIn 190ms cubic-bezier(.22,.8,.22,1) both!important;
  }

  /* Keep the custom six-item dock visually attached to the sheet system. */
  .bbd-app.bbd-release-0239 > .bbd-v72-mobile-dock{
    height:64px!important;
    min-height:64px!important;
    padding-top:4px!important;
    padding-bottom:calc(4px + env(safe-area-inset-bottom))!important;
  }
}

@media (max-width:390px) and (max-height:760px){
  .bbd-app.bbd-release-0239{
    --bbd-0239-sheet-height:min(70dvh,535px);
    --bbd-0239-sheet-expanded-height:min(89dvh,660px);
  }
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel,
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel[hidden]{
    min-height:290px!important;
  }
}

/* ----------------------------- TABLET ---------------------------------- */
@media (min-width:900px) and (max-width:1100px) and (orientation:landscape){
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel,
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel[hidden]{
    position:absolute!important;
    z-index:4!important;
    top:72px!important;
    right:12px!important;
    bottom:78px!important;
    left:auto!important;
    width:min(380px,44vw)!important;
    min-width:330px!important;
    max-width:400px!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid rgba(148,163,184,.34)!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:-18px 18px 48px rgba(15,23,42,.16)!important;
    transform:translate3d(0,0,0)!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel > .bbd-mobile-sheet-bar{
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr) 34px!important;
    align-items:center!important;
    height:48px!important;
    min-height:48px!important;
    flex:0 0 48px!important;
    padding:8px 10px!important;
    border-bottom:1px solid #e7ecf1!important;
    background:#fff!important;
  }
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel > .bbd-panel-section:not([hidden]){
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    min-height:0!important;
    padding:12px 13px 18px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .bbd-app.bbd-release-0239 #bbd-mobile-sheet-back,
  .bbd-app.bbd-release-0239 .bbd-mobile-sheet-grip{display:none!important}
}

/* Landscape tablet / small notebook: keep the canonical left tool rail, remove
   the now-empty legacy panel column, and let the right inspector float without
   wasting canvas width. */
@media (min-width:1025px) and (max-width:1100px){
  .bbd-app.bbd-release-0239.bbd-shell-v0161 .bbd-workspace,
  .bbd-app.bbd-release-0239.bbd-shell-v0161.is-panel-collapsed .bbd-workspace,
  .bbd-app.bbd-release-0239.bbd-shell-v0161.is-inspector-collapsed .bbd-workspace{
    grid-template-columns:var(--bbd-rail-width) minmax(0,1fr)!important;
  }
  .bbd-app.bbd-release-0239.bbd-shell-v0161 .bbd-stage-area{
    grid-column:2!important;
  }
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel,
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host.is-open > #bbd-panel[hidden]{
    bottom:12px!important;
  }
}

/* ----------------------------- DESKTOP --------------------------------- */
@media (min-width:1101px){
  .bbd-app.bbd-release-0239.bbd-shell-v0161 .bbd-workspace,
  .bbd-app.bbd-release-0239.bbd-shell-v0161:not(.is-panel-collapsed).is-inspector-collapsed .bbd-workspace{
    grid-template-columns:var(--bbd-rail-width) minmax(0,1fr) var(--bbd-panel-width)!important;
  }
  .bbd-app.bbd-release-0239.bbd-shell-v0161.is-panel-collapsed .bbd-workspace,
  .bbd-app.bbd-release-0239.bbd-shell-v0161.is-panel-collapsed.is-inspector-collapsed .bbd-workspace{
    grid-template-columns:var(--bbd-rail-width) minmax(0,1fr) 0!important;
  }
  .bbd-app.bbd-release-0239.bbd-shell-v0161 .bbd-stage-area{
    grid-column:2!important;
  }
  .bbd-app.bbd-release-0239.bbd-shell-v0161 .bbd-panel{
    grid-column:3!important;
    width:var(--bbd-panel-width)!important;
    border-right:0!important;
    border-left:1px solid var(--bbd-border-subtle)!important;
  }
  .bbd-app.bbd-release-0239.bbd-shell-v0161 .bbd-panel-edge-toggle{
    right:auto!important;
    left:-40px!important;
    border-right:0!important;
    border-left:1px solid var(--bbd-border-subtle)!important;
    border-radius:8px 0 0 8px!important;
    box-shadow:-8px 4px 18px rgba(15,23,42,.1)!important;
  }
  .bbd-app.bbd-release-0239.bbd-shell-v0161 .bbd-panel-edge-toggle > span:first-child{
    transform:rotate(180deg)!important;
  }
}

@keyframes bbd0239SectionIn{
  from{opacity:.72;transform:translate3d(10px,0,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

@media (prefers-reduced-motion:reduce){
  .bbd-app.bbd-release-0239 > #bbd-v60-mobile-sheet-host > #bbd-panel,
  .bbd-app.bbd-release-0239 #bbd-panel .bbd-panel-section{transition:none!important;animation:none!important}
}