/* Shared phone shell: retain each creation page while changing tools. */
.mobile-key-panel,.mobile-panel{display:none}
.login-tools{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 20px}.login-tools button{min-height:44px;padding:9px 22px;border:1px solid rgba(226,244,245,.24);border-radius:10px;background:rgba(3,19,29,.35);color:#e2f4f5;font:inherit;cursor:pointer}.login-tools button[aria-pressed=true]{border-color:var(--mint,#70e1cf);background:rgba(86,228,208,.12);color:var(--mint,#70e1cf)}.login-console{display:inline-flex;align-items:center;min-height:44px;color:rgba(226,244,245,.8);font-size:13px}.login-promise h1{max-width:20ch}.login-promise{padding:32px 0}.login-panel .login-card{width:100%}
#mobile-creation-stage[hidden],#mobile-frames iframe[hidden]{display:none!important}#mobile-creation-stage{position:fixed;inset:0 0 calc(62px + env(safe-area-inset-bottom));z-index:30;display:flex;flex-direction:column;background:var(--bg,#03131d);color:var(--text,#e2f4f5)}.mobile-creation-header{flex:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px max(16px,env(safe-area-inset-right)) 8px max(16px,env(safe-area-inset-left));padding-top:max(8px,env(safe-area-inset-top));border-bottom:1px solid var(--line, #23404b);min-height:60px}.mobile-creation-header>div{display:flex;gap:8px;align-items:center}.mobile-creation-header strong{font-size:16px}#mobile-tool-loading{padding:18px;color:var(--muted)}#mobile-tool-retry{margin:0 18px 12px}#mobile-frames{flex:1;min-height:0;position:relative}#mobile-frames iframe{display:block;width:100%;height:100%;border:0;color-scheme:dark}.mobile-bottom-nav{z-index:40}.mobile-bottom-nav button{position:relative}.mobile-bottom-nav button[data-task-pending=true]::after{content:"";position:absolute;top:8px;left:calc(50% + 13px);width:6px;height:6px;border-radius:50%;background:var(--mint,#70e1cf)}
html[data-hm-client-embedded=true] .client-top,html[data-hm-client-embedded=true] .intro{display:none}html[data-hm-client-embedded=true] main{max-width:100%;padding:12px 14px 24px}html[data-hm-client-embedded=true] .history-toolbar{top:0}html[data-hm-client-embedded=true]{scroll-padding-top:64px}html[data-hm-client-embedded=true] .studio{height:auto;min-height:0}
body[data-hm-client-app=login] #mobile-creation-stage,body[data-hm-client-app=login] .mobile-bottom-nav{display:none!important}
@media(max-width:900px){
  .login-screen{min-height:100svh;padding:24px max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));gap:16px;align-content:start}.login-story{padding:0}.login-story>.brand img{width:32px;height:32px}.login-promise{padding:22px 0 14px}.login-promise h1{font-size:clamp(26px,7vw,34px);line-height:1.25;margin-bottom:12px}.login-promise p{font-size:13px;line-height:1.7;max-width:36em}.login-panel{padding:0}.login-card{padding:22px;max-width:520px;margin:auto}.login-card h2{font-size:22px}.login-tools{margin-bottom:0;gap:8px}.login-tools button{padding-inline:20px}.login-console{margin-top:6px}.login-language-row{margin-bottom:12px}input,select,textarea{font-size:16px}
  body[data-hm-client-app=ready]{overflow:hidden}body[data-hm-client-app=ready] .app-shell{position:fixed;top:var(--hm-client-top,0px);right:0;left:0;height:var(--hm-client-height,100dvh);min-height:0}.chat-stage{height:100%;min-height:0}.chat-stage{grid-template-rows:auto minmax(0,1fr) auto}.messages{min-height:0;overscroll-behavior-y:contain}.composer-shell{padding-bottom:calc(72px + env(safe-area-inset-bottom))}.mobile-bottom-nav{top:calc(var(--hm-client-top,0px) + var(--hm-client-height,100dvh) - 62px - env(safe-area-inset-bottom));bottom:auto;height:calc(62px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);touch-action:manipulation}body[data-hm-keyboard-open=true] .mobile-bottom-nav{display:none}body[data-hm-keyboard-open=true] .composer-shell{padding-bottom:8px}body[data-hm-keyboard-open=true] #mobile-creation-stage{bottom:0;height:var(--hm-client-height,100dvh)}body[data-hm-keyboard-open=true] .composer-note{display:none}#mobile-creation-stage{top:var(--hm-client-top,0px);height:calc(var(--hm-client-height,100dvh) - 62px - env(safe-area-inset-bottom));bottom:auto}.mobile-sheet{max-height:calc(var(--hm-client-height,100dvh) - 24px)}
  html[data-hm-client-embedded=true] main{padding-top:0}html[data-hm-client-embedded=true] .history-toolbar{margin-bottom:12px}html[data-hm-client-embedded=true] .creation{padding:16px}html[data-hm-client-embedded=true] .canvas{scroll-margin-top:64px}html[data-hm-client-embedded=true] #media-result video{max-height:65svh}
}
@media(min-width:901px){body[data-hm-client-tool=image] .mobile-bottom-nav,body[data-hm-client-tool=video] .mobile-bottom-nav{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;inset:auto 0 0;height:62px;background:var(--bg);border-top:1px solid var(--line)} }
@media(max-width:900px){
  .composer-shell>.client-settings{display:none}
  .mobile-key-panel{display:block;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;touch-action:pan-y;padding:16px max(16px,env(safe-area-inset-right)) 16px max(16px,env(safe-area-inset-left))}
  .mobile-panel{position:fixed;z-index:35;top:var(--hm-client-top,0px);right:0;left:0;display:grid;grid-template-rows:auto minmax(0,1fr);height:calc(var(--hm-client-height,100dvh) - 62px - env(safe-area-inset-bottom));overflow:hidden;background:var(--ink);color:var(--body)}
  body[data-hm-keyboard-open=true] .mobile-panel{height:var(--hm-client-height,100dvh)}
  .mobile-panel .sheet-head{padding-top:max(14px,env(safe-area-inset-top))}
  .mobile-panel-content{min-height:0;overflow-y:auto;overscroll-behavior-y:contain;touch-action:pan-y;padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  .mobile-panel .client-settings{margin-top:16px}
  .composer textarea{max-height:min(144px,calc(var(--hm-client-height,100dvh) / 4))}
  body[data-hm-keyboard-open=true] .chat-header{min-height:48px;padding-top:max(2px,env(safe-area-inset-top));padding-bottom:2px}
  body[data-hm-keyboard-open=true] .mobile-session-title{display:none}
  body[data-hm-keyboard-open=true] .composer-shell{padding-top:4px;padding-bottom:4px}
  body[data-hm-keyboard-open=true] .messages{padding-block:0}
  body[data-hm-keyboard-open=true]:has(#client-key-panel[hidden]) #open-client-key{display:none}
  body[data-hm-keyboard-open=true] .mobile-creation-header{display:none}
  #open-client-key{display:flex;min-height:44px;margin:0 0 8px;padding:8px 12px;font-size:13px}
  .mobile-sheet[open]{display:flex;flex-direction:column;position:fixed;overflow:hidden;max-height:calc(var(--hm-client-height,100dvh) - 16px);top:calc(var(--hm-client-top,0px) + 8px);bottom:auto;margin:0 auto}
  .mobile-sheet.side-sheet[open]{top:var(--hm-client-top,0px);height:var(--hm-client-height,100dvh);max-height:var(--hm-client-height,100dvh);margin:0 auto 0 0}
  .conversation-dialog{position:fixed;top:calc(var(--hm-client-top,0px) + 8px);bottom:auto;max-height:calc(var(--hm-client-height,100dvh) - 16px);margin:0 auto;overflow-y:auto}
  .mobile-sheet .sheet-head{flex:none}
  .mobile-sheet .sheet-content,.mobile-sheet.side-sheet .sheet-content{flex:1;min-height:0;height:auto;max-height:none;overflow-y:auto;touch-action:pan-y}
  .mobile-sheet .client-settings{margin-top:16px}
  .client-settings .channel-tools{display:grid;grid-template-columns:auto minmax(0,1fr)}
  .client-settings .channel-tools select{width:100%;max-width:none!important;min-width:0}
  .client-settings .channel-tools #client-channel-status{position:static;grid-column:1/-1;width:auto;height:auto;clip:auto;clip-path:none;white-space:normal;overflow-wrap:anywhere}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-width:900px){
  html[data-hm-client-embedded=true]:has(body[data-hm-keyboard-open=true]){scroll-padding-top:0;scroll-padding-bottom:64px}
  html[data-hm-client-embedded=true] body[data-hm-keyboard-open=true] main{padding-bottom:76px}
  html[data-hm-client-embedded=true] body[data-hm-keyboard-open=true] .submit-row{position:fixed;left:0;right:0;bottom:0;padding:4px 8px}
  html[data-hm-client-embedded=true] body[data-hm-keyboard-open=true] .submit-row .billing-note{display:none}
  html[data-hm-client-embedded=true] body[data-hm-keyboard-open=true] .field textarea,html[data-hm-client-embedded=true] body[data-hm-keyboard-open=true] .native-editor textarea{height:64px;min-height:64px}
  html[data-hm-client-embedded=true] body[data-hm-keyboard-open=true] .history-toolbar,html[data-hm-client-embedded=true] body[data-hm-keyboard-open=true] .account{display:none}
}
/* Preserve the media client's existing manual theme control inside the shell. */
html[data-hm-client-embedded=true] .client-top{display:contents}html[data-hm-client-embedded=true] .client-top .client-heading,html[data-hm-client-embedded=true] .client-top nav,html[data-hm-client-embedded=true] .account #balance,html[data-hm-client-embedded=true] .account [data-hm-language]{display:none}html[data-hm-client-embedded=true] .account{position:fixed;top:10px;right:14px;z-index:26;display:flex}html[data-hm-client-embedded=true] .account [data-console-theme-toggle]{width:44px;min-height:44px}html[data-hm-client-embedded=true] .history-toolbar{padding-right:54px}html[data-hm-client-embedded=true] .history-toolbar>span{display:none}
