/* Hooshi responsive hardening — mobile, tablet, PWA and safe areas. */
:root{--mobile-nav-h:68px;--mobile-gap:max(12px,env(safe-area-inset-left));}
html{min-width:0;overflow-x:hidden;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{min-width:0;overflow-x:hidden;overscroll-behavior-y:none}
img,svg,video,canvas{max-width:100%}
button,input,select,textarea{font:inherit;max-width:100%}
.app-shell,.app-main,.app-content{min-width:0}
.app-content>*{min-width:0}
.context-guide-link{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:12px 14px;border:1px solid rgba(139,92,246,.2);border-radius:16px;background:rgba(139,92,246,.065);color:var(--suite-ink,#fff)}
.context-guide-link>span{flex:0 0 auto;color:#a78bfa}.context-guide-link div{min-width:0;flex:1}.context-guide-link b,.context-guide-link small{display:block}.context-guide-link b{font-size:12px}.context-guide-link small{margin-top:2px;color:var(--suite-muted,#98a2b5);font-size:10px;line-height:1.65}.context-guide-link a{flex:0 0 auto;padding:7px 10px;border-radius:10px;background:rgba(139,92,246,.14);color:#c4b5fd;font-size:10px;font-weight:800;white-space:nowrap}
.eco-modal-card,.suite-modal-card{max-width:calc(100vw - 28px)}
pre,code,.markdown-body pre{max-width:100%;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere}
table{max-width:100%}.table-wrap,.responsive-table{max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch}

@media(max-width:1100px){
  .app-topbar{padding-inline:16px}.app-content{padding-inline:16px}
  .app-store-grid,.site-grid,.help-module-grid,.mobile-install-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .team-live-main,.team-live-layout{grid-template-columns:1fr!important}
}

@media(max-width:820px){
  :root{--mobile-nav-h:70px}
  body{padding-bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom))}
  .app-shell{display:block;min-height:100dvh}
  .app-main{width:100%;min-height:100dvh;margin:0!important}
  .app-topbar{position:sticky;z-index:45;top:0;min-height:56px;padding:calc(7px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 7px max(12px,env(safe-area-inset-left));background:color-mix(in srgb,var(--suite-surface,#111522) 88%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--suite-line,rgba(255,255,255,.08))}
  .app-topbar h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px}
  .app-topbar .icon-btn{flex:0 0 38px;width:38px;height:38px}
  .alert-popover{position:fixed!important;z-index:80!important;top:calc(58px + env(safe-area-inset-top))!important;right:12px!important;left:12px!important;width:auto!important;max-height:min(68dvh,520px);overflow:auto}
  .app-sidebar{position:fixed!important;z-index:100!important;top:0!important;right:0!important;bottom:0!important;width:min(88vw,330px)!important;max-width:none!important;padding-top:max(18px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));transform:translateX(105%);transition:transform .22s ease;box-shadow:-24px 0 70px rgba(0,0,0,.35)}
  .app-sidebar.open,.app-sidebar.is-open{transform:none}
  .app-content{width:100%;padding:14px max(12px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  .eco-mobile-nav{position:fixed!important;z-index:70!important;right:0!important;bottom:0!important;left:0!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));min-height:var(--mobile-nav-h);padding:7px max(8px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));border-top:1px solid var(--suite-line,rgba(255,255,255,.08));background:color-mix(in srgb,var(--suite-surface,#111522) 92%,transparent);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
  .eco-mobile-nav a,.eco-mobile-nav button{min-width:0;min-height:49px;padding:5px 2px;border-radius:12px}.eco-mobile-nav small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px}
  .context-guide-link{align-items:flex-start;gap:9px;margin-bottom:12px}.context-guide-link small{font-size:9px}.context-guide-link a{align-self:center}
  .eco-hero,.apps-hero,.sites-hero,.help-hero,.team-live-hero{display:flex!important;align-items:flex-start!important;flex-direction:column!important;gap:16px!important;padding:20px!important}
  .eco-hero>*{max-width:100%}.eco-hero h1,.help-hero h1{font-size:clamp(22px,7vw,32px)!important}.eco-hero p,.help-hero p{font-size:12px!important;line-height:1.9!important}
  .app-store-grid,.site-grid,.help-module-grid,.mobile-install-grid,.help-trouble-grid,.template-grid,.doctor-check-grid{grid-template-columns:1fr!important}
  .app-store-filters,.help-app-toolbar>div,.connector-tabs,.team-tab-buttons{overflow-x:auto;flex-wrap:nowrap!important;scrollbar-width:none;-webkit-overflow-scrolling:touch}.app-store-filters::-webkit-scrollbar,.connector-tabs::-webkit-scrollbar{display:none}.app-store-filters button,.connector-tabs button{flex:0 0 auto;white-space:nowrap}
  .app-card footer,.site-card footer,.app-connect-actions,.help-app-actions{display:flex;flex-wrap:wrap;gap:8px}.app-card footer>*{flex:1 1 auto}.app-card footer .icon-btn{flex:0 0 38px}
  .eco-modal,.suite-modal{align-items:flex-end!important;padding:0!important}.eco-modal-card,.suite-modal-card{width:100%!important;max-width:100%!important;max-height:92dvh!important;margin:0!important;border-radius:24px 24px 0 0!important;padding-bottom:max(18px,env(safe-area-inset-bottom));overflow:auto!important}.eco-modal-card header{position:sticky;z-index:2;top:0;background:inherit}
  .eco-form-grid,.form-grid-2,.app-connect-form,.custom-connector-grid{grid-template-columns:1fr!important}
  .team-live-overview{grid-template-columns:repeat(2,minmax(0,1fr))!important}.team-room-sidebar{position:static!important}.team-room-sidebar nav{display:flex!important;overflow-x:auto}.team-room-btn{min-width:145px}.team-inline-form{grid-template-columns:1fr!important}.team-inline-form>*{grid-column:auto!important}
  .help-layout{display:block!important}.help-sidebar{position:static!important;width:auto!important;margin-bottom:14px}.help-sidebar nav{display:flex!important;overflow-x:auto;gap:6px}.help-sidebar nav a{flex:0 0 auto;white-space:nowrap}.help-hero-status,.help-progress{grid-template-columns:1fr!important}.help-progress>i{display:none}.help-app-columns,.help-detail-cols{grid-template-columns:1fr!important}
  .pwa-actions-row{display:grid!important;grid-template-columns:1fr!important}.pwa-install-status{align-items:flex-start!important}
}

/* Chat is treated as a full-height app surface on small screens. */
@media(max-width:820px){
  body.page-chat{height:100dvh;overflow:hidden;padding-bottom:0}
  .page-chat .app-shell,.page-chat .app-main{height:100dvh;min-height:0}
  .page-chat .app-main{display:flex;flex-direction:column}
  .page-chat .app-topbar{flex:0 0 auto}
  .page-chat .app-content{display:flex;min-height:0;flex:1;padding:0!important;padding-bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom))!important;overflow:hidden}
  .page-chat .context-guide-link{display:none}
  .chat-shell.v6{display:flex;min-width:0;min-height:0;flex:1;flex-direction:column;height:auto!important}
  .chat-workbar{position:relative!important;z-index:18!important;top:auto!important;right:auto!important;left:auto!important;display:flex!important;flex:0 0 auto;gap:7px;width:100%;padding:8px max(10px,env(safe-area-inset-right));overflow-x:auto;pointer-events:auto!important;background:color-mix(in srgb,var(--suite-surface,#111522) 80%,transparent);border-bottom:1px solid var(--suite-line,rgba(255,255,255,.08));scrollbar-width:none}.chat-workbar::-webkit-scrollbar{display:none}
  .mode-control,.model-quick,.model-budget-pill,.chat-credit{flex:0 0 auto;pointer-events:auto}.chat-workbar-spacer{display:none}.mode-trigger{min-height:40px;white-space:nowrap}.model-quick{display:flex;align-items:center;min-width:min(48vw,210px);max-width:230px}.model-quick select{width:100%;min-height:40px;padding-inline:10px;border-radius:12px}.model-quick-state{display:none}.chat-credit{display:flex!important;white-space:nowrap}
  .mode-menu{position:fixed!important;z-index:120!important;top:calc(112px + env(safe-area-inset-top))!important;right:12px!important;left:12px!important;width:auto!important;max-height:58dvh;overflow:auto}
  .chat-shell.v6 .chat-stream{min-height:0;flex:1;padding:12px 8px 8px!important;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .chat-inner{width:100%!important;max-width:100%!important;padding-inline:3px!important}
  .chat-welcome{padding:12px 8px 16px!important}.chat-welcome h2{font-size:22px!important}.suggestion-grid,.chat-suggestions{grid-template-columns:1fr!important}
  .msg,.chat-typing{max-width:100%;gap:7px}.msg .avatar,.chat-typing .avatar{display:none}.chat-shell.v6 .msg.bot>.bubble,.chat-shell.v6 .msg.user>.bubble{max-width:92vw!important;overflow-wrap:anywhere}.chat-shell.v6 .msg-body{font-size:14px;line-height:1.9}.chat-shell.v6 .msg-body table{display:block;overflow:auto}
  .chat-composer{position:relative!important;z-index:20;right:auto!important;bottom:auto!important;left:auto!important;flex:0 0 auto;width:100%;padding:7px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important;background:color-mix(in srgb,var(--suite-surface,#111522) 90%,transparent);border-top:1px solid var(--suite-line,rgba(255,255,255,.08));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
  .composer-inner{width:100%!important;max-width:none!important}.chat-context-bar{display:flex;align-items:center;gap:7px;overflow-x:auto;padding:0 2px 6px!important;scrollbar-width:none}.chat-context-bar>*{flex:0 0 auto}.context-picker{max-width:46vw}.composer-box{display:flex;align-items:flex-end;gap:6px;width:100%;padding:6px!important;border-radius:16px!important}.composer-box textarea{min-height:42px!important;max-height:120px!important;padding:10px!important;line-height:1.7}.composer-send{flex:0 0 42px;width:42px!important;height:42px!important}.composer-foot{display:none!important}
  .chat-history-drawer{position:fixed!important;z-index:110!important;top:0!important;right:0!important;bottom:0!important;width:min(88vw,350px)!important;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom));transform:translateX(105%)}.chat-history-drawer.open,.chat-history-drawer.is-open{transform:none}
}

@media(max-width:480px){
  .app-content{padding-inline:10px}.app-topbar{padding-inline:9px}.app-topbar h1{font-size:13px}
  .context-guide-link{display:grid;grid-template-columns:auto 1fr}.context-guide-link a{grid-column:2;justify-self:start}
  .eco-mobile-nav{padding-inline:4px}.eco-mobile-nav small{font-size:8px}
  .eco-hero,.apps-hero,.sites-hero,.help-hero{padding:17px!important;border-radius:18px!important}
  .app-card,.site-card,.premium-panel,.eco-panel{border-radius:17px!important}
  .team-live-overview{grid-template-columns:1fr 1fr!important}.team-live-overview article{padding:10px!important}
  .chat-credit{display:none!important}.model-quick{min-width:165px}.mode-trigger small{display:none}.mode-menu{top:calc(106px + env(safe-area-inset-top))!important}
}

@media(display-mode:standalone){
  body{padding-top:env(safe-area-inset-top)}
  .app-topbar{padding-top:max(7px,env(safe-area-inset-top))}
  .eco-mobile-nav{padding-bottom:max(7px,env(safe-area-inset-bottom))}
}
