/* Smart Shrimp Log — Global Mobile Dock v2
   iPhone corner-safe floating geometry shared by global and Pond navigation. */
@media (max-width:900px){
  :root{
    --ssl-mobile-dock-inline:16px;
    --ssl-mobile-dock-bottom:16px;
    --ssl-mobile-dock-height:76px;
    --ssl-mobile-dock-compact-height:64px;
    --ssl-mobile-dock-radius:26px;
    --ssl-mobile-dock-shadow:0 10px 28px rgba(10,68,50,.14),inset 0 1px 0 rgba(255,255,255,.84);
    --ssl-mobile-dock-shadow-compact:0 8px 22px rgba(10,68,50,.12),inset 0 1px 0 rgba(255,255,255,.76);
    --ssl-mobile-dock-motion:180ms cubic-bezier(.2,.8,.2,1);
  }

  /* Global app navigation: keep the physical iPhone corner curvature outside the dock silhouette. */
  #app .shell.farm-level-shell>.sidebar:not(.pond-context-sidebar),
  #app .shell.home-shell>.sidebar:not(.pond-context-sidebar),
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar){
    left:calc(var(--ssl-mobile-dock-inline) + env(safe-area-inset-left,0px))!important;
    right:calc(var(--ssl-mobile-dock-inline) + env(safe-area-inset-right,0px))!important;
    bottom:calc(var(--ssl-mobile-dock-bottom) + env(safe-area-inset-bottom,0px))!important;
    width:auto!important;
    max-width:none!important;
    height:var(--ssl-mobile-dock-height)!important;
    min-height:var(--ssl-mobile-dock-height)!important;
    max-height:var(--ssl-mobile-dock-height)!important;
    transform:none!important;
    border-radius:var(--ssl-mobile-dock-radius)!important;
    box-shadow:var(--ssl-mobile-dock-shadow)!important;
    transition:height var(--ssl-mobile-dock-motion),min-height var(--ssl-mobile-dock-motion),max-height var(--ssl-mobile-dock-motion),box-shadow var(--ssl-mobile-dock-motion),transform var(--ssl-mobile-dock-motion),background-color var(--ssl-mobile-dock-motion)!important;
    will-change:height,transform;
  }

  /* Shared dynamic state: compact on downward scroll, full on upward/idle. */
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar).ssl-dock-compact,
  #app .shell.pond-detail-shell .pond-module-island.ssl-dock-compact{
    height:var(--ssl-mobile-dock-compact-height)!important;
    min-height:var(--ssl-mobile-dock-compact-height)!important;
    max-height:var(--ssl-mobile-dock-compact-height)!important;
    box-shadow:var(--ssl-mobile-dock-shadow-compact)!important;
  }

  /* Active item becomes a restrained lifted island without changing layout metrics. */
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar) .nav-item.active,
  #app .shell.pond-detail-shell .pond-module-island :is(.pond-module-item.active,.pond-module-more.active>summary){
    transform:translateY(-2px);
    box-shadow:0 6px 16px rgba(12,98,67,.16),inset 0 1px 0 rgba(255,255,255,.64)!important;
  }
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar) .nav-item,
  #app .shell.pond-detail-shell .pond-module-island :is(.pond-module-item,.pond-module-more>summary){
    transition:transform var(--ssl-mobile-dock-motion),box-shadow var(--ssl-mobile-dock-motion),background-color var(--ssl-mobile-dock-motion),opacity var(--ssl-mobile-dock-motion)!important;
    transform-origin:center center;
  }
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar) .nav-item.ssl-dock-pressed,
  #app .shell.pond-detail-shell .pond-module-island :is(.pond-module-item.ssl-dock-pressed,.pond-module-more>summary.ssl-dock-pressed){
    transform:translateY(0) scale(.97)!important;
  }

  /* Compact mode reduces label prominence, never the touch target semantics. */
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar).ssl-dock-compact .nav-item>span:last-child,
  #app .shell.pond-detail-shell .pond-module-island.ssl-dock-compact :is(.pond-module-label,.pond-module-more>summary>span:last-child){
    opacity:.72!important;
    transform:translateY(1px) scale(.96);
  }
  #app .shell.pond-detail-shell .pond-module-island.ssl-dock-compact :is(.pond-module-icon,.pond-module-more-icon),
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar).ssl-dock-compact .nav-icon{
    transform:translateY(1px) scale(.96);
  }

  /* Pond module dock uses the same outer silhouette and safe-area contract. */
  #app .shell.pond-detail-shell .pond-module-island{
    left:calc(var(--ssl-mobile-dock-inline) + env(safe-area-inset-left,0px))!important;
    right:calc(var(--ssl-mobile-dock-inline) + env(safe-area-inset-right,0px))!important;
    bottom:calc(var(--ssl-mobile-dock-bottom) + env(safe-area-inset-bottom,0px))!important;
    height:var(--ssl-mobile-dock-height)!important;
    min-height:var(--ssl-mobile-dock-height)!important;
    max-height:var(--ssl-mobile-dock-height)!important;
    border-radius:var(--ssl-mobile-dock-radius)!important;
    box-shadow:var(--ssl-mobile-dock-shadow)!important;
    transition:height var(--ssl-mobile-dock-motion),min-height var(--ssl-mobile-dock-motion),max-height var(--ssl-mobile-dock-motion),box-shadow var(--ssl-mobile-dock-motion),transform var(--ssl-mobile-dock-motion),background-color var(--ssl-mobile-dock-motion)!important;
    will-change:height,transform;
  }

  /* Contextual primary action floats above navigation only after its hero action leaves view. */
  #app .shell.pond-detail-shell>.ssl-pond-floating-action{
    position:fixed;
    z-index:48;
    right:calc(var(--ssl-mobile-dock-inline) + 8px + env(safe-area-inset-right,0px));
    bottom:calc(var(--ssl-mobile-dock-bottom) + var(--ssl-mobile-dock-height) + 10px + env(safe-area-inset-bottom,0px));
    min-height:46px;
    max-width:min(260px,calc(100vw - 48px));
    padding:0 18px;
    border:1px solid rgba(255,255,255,.62);
    border-radius:999px;
    background:linear-gradient(105deg,#ed5a05,#f57912);
    color:#fff;
    box-shadow:0 10px 24px rgba(151,67,12,.22),inset 0 1px 0 rgba(255,255,255,.32);
    font:800 14px/1 'IBM Plex Sans Thai',sans-serif;
    opacity:0;
    pointer-events:none;
    transform:translateY(10px) scale(.96);
    transition:opacity var(--ssl-mobile-dock-motion),transform var(--ssl-mobile-dock-motion),box-shadow var(--ssl-mobile-dock-motion);
  }
  #app .shell.pond-detail-shell>.ssl-pond-floating-action.is-visible{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }
  #app .shell.pond-detail-shell>.ssl-pond-floating-action:active{transform:translateY(1px) scale(.97)}

  /* Fixed navigation must never cover the final actionable/content region. */
  #app .shell.pond-detail-shell .content{
    padding-bottom:calc(var(--ssl-mobile-dock-height) + var(--ssl-mobile-dock-bottom) + 38px + env(safe-area-inset-bottom,0px))!important;
    scroll-padding-bottom:calc(var(--ssl-mobile-dock-height) + var(--ssl-mobile-dock-bottom) + 38px + env(safe-area-inset-bottom,0px))!important;
  }
  #app .shell.farm-level-shell>.content,
  #app .shell.home-shell>.content,
  #app .shell:not(.pond-detail-shell)>.content{
    padding-bottom:calc(var(--ssl-mobile-dock-height) + var(--ssl-mobile-dock-bottom) + 38px + env(safe-area-inset-bottom,0px))!important;
    scroll-padding-bottom:calc(var(--ssl-mobile-dock-height) + var(--ssl-mobile-dock-bottom) + 38px + env(safe-area-inset-bottom,0px))!important;
  }
}

@media (prefers-reduced-motion:reduce){
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar),
  #app .shell.pond-detail-shell .pond-module-island,
  #app .shell:not(.pond-detail-shell)>.sidebar:not(.pond-context-sidebar) .nav-item,
  #app .shell.pond-detail-shell .pond-module-island :is(.pond-module-item,.pond-module-more>summary){
    transition:none!important;
    animation:none!important;
  }
}

@media (max-width:374px){
  :root{--ssl-mobile-dock-inline:13px;--ssl-mobile-dock-radius:24px}
}