/* Global layout contract. Footer visuals live inside platform-footer's shadow root. */
@media(prefers-reduced-motion:no-preference){@view-transition{navigation:auto}}
::view-transition-group(root){animation-duration:140ms;animation-timing-function:ease-out}
::view-transition-old(root){animation:fairystack-page-out 100ms ease-in both}
::view-transition-new(root){animation:fairystack-page-in 140ms ease-out both}
@keyframes fairystack-page-out{to{opacity:.82}}
@keyframes fairystack-page-in{from{opacity:.82}}
html{height:100%}
body[data-fairystack-shell]{--platform-footer-height:49px;min-height:100%;margin:0;background-color:#dcecdf;background-position:center top;background-size:cover;background-attachment:fixed;color:#17372f}
body[data-fairystack-shell]:not([data-fairystack-shell="conversation"]){background-image:linear-gradient(180deg,rgba(238,248,241,.78),rgba(238,248,241,.92)),url('/assets/fairystack-treehouse-workshop-v3.webp')}
body[data-fairystack-shell]>fairystack-footer{position:fixed;inset:auto 0 0;z-index:30;display:block;width:100%;height:var(--platform-footer-height);margin:0;view-transition-name:fairystack-footer}
::view-transition-old(fairystack-footer),::view-transition-new(fairystack-footer){animation:none;mix-blend-mode:normal}
body[data-fairystack-shell="viewport"]{height:100vh;height:100dvh;overflow:hidden;padding-bottom:var(--platform-footer-height)}
body[data-fairystack-shell="viewport"]>main{height:100%;max-height:100%;overflow:auto;overscroll-behavior:contain}
body[data-fairystack-shell="document"],body[data-fairystack-shell="conversation"]{padding-bottom:var(--platform-footer-height)}
body[data-fairystack-shell="conversation"] #composer-dock{--footer-clearance:var(--platform-footer-height)}
@media(max-width:760px){body[data-fairystack-shell]{--platform-footer-height:45px}}
:where(html[data-theme="dark"]) body[data-fairystack-shell]{background-color:#10251f;color:#edf6ea}:where(html[data-theme="dark"]) body[data-fairystack-shell]:not([data-fairystack-shell="conversation"]){background-image:linear-gradient(180deg,rgba(11,28,23,.76),rgba(11,28,23,.94)),url('/assets/fairystack-treehouse-workshop-v3.webp')}

@media(max-width:620px){
  body[data-fairystack-shell]{--platform-footer-height:0px;--mobile-navigation-clearance:42px}
  body[data-fairystack-shell]>fairystack-footer{inset:4px 6px auto auto;width:36px;height:36px}
  body[data-fairystack-shell="conversation"] #composer-dock{--composer-gutter:max(12px,env(safe-area-inset-bottom))}
}

@media(max-width:620px){
  body[data-fairystack-shell="conversation"][data-composer-editing="true"] #composer-dock{--composer-gutter:4px}
  body[data-fairystack-shell="conversation"][data-composer-editing="true"]>fairystack-footer{inset:1px 6px auto auto;height:30px;transform:scale(.83);transform-origin:top right}
}