/* Browser-width responsive layout: no page scaling or transform-based zoom. */
:root{--app-viewport-height:100dvh;--app-header-height:calc(56px + env(safe-area-inset-top,0px));--page-gutter:clamp(12px,2vw,28px);--workspace-sidebar-offset:var(--chat-sidebar-width,224px);--workspace-max:1600px}
html,body{min-width:0;max-width:100%;overflow-x:clip}
:is(.app-shell,.chat-shell,.chat-main,.chat-workspace,.workspace,.creation-grid,.left-flow,.model-bar,.generation-panel,.prompt-panel,.preview-panel,.history-panel,.history-task){min-width:0}
html .chat-topbar{position:fixed;top:0;left:var(--workspace-sidebar-offset);right:0;min-width:0;height:var(--app-header-height);padding-top:env(safe-area-inset-top,0px);box-sizing:border-box}
html .chat-main{margin-left:var(--workspace-sidebar-offset)}
body[data-page="chat"] .chat-main{display:flex;flex-direction:column;height:var(--app-viewport-height);min-height:0;padding:calc(var(--app-header-height) + var(--page-gutter)) var(--page-gutter) calc(var(--page-gutter) + env(safe-area-inset-bottom,0px))!important;box-sizing:border-box}
.chat-main .chat-main-head{flex:0 0 auto;width:100%;max-width:var(--workspace-max);margin:0 auto 16px}
.chat-main .chat-workspace{flex:1 1 auto;min-height:0;width:100%;max-width:var(--workspace-max);grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:0}
.chat-main .chat-panel{height:auto;min-height:0;max-height:none;align-self:stretch}
.chat-main .chat-messages{flex:1 1 auto;min-height:0;overflow:auto}
.chat-main .chat-composer{flex:0 0 auto;min-width:0}
.chat-main .chat-input-bar{min-width:0}
.chat-main .chat-input-bar>button{flex-shrink:0}
.chat-main .chat-composer textarea{min-width:0;max-height:min(120px,25dvh)}
.chat-main .chat-ambient{flex:0 0 auto;min-height:58px;flex-wrap:wrap;gap:8px 14px}
.chat-main .chat-ambient-region{min-width:0;max-width:100%;overflow-wrap:anywhere}
.chat-main .chat-ambient-greeting{min-width:0;overflow:hidden;text-overflow:ellipsis}
.chat-message .chat-bubble{min-width:0;max-width:min(82%,900px);overflow-wrap:anywhere}
.chat-bubble :is(pre,table){max-width:100%;overflow-x:auto}
.chat-bubble :is(img,video){max-width:100%;height:auto}
html body:not([data-page="chat"])>.app-shell>.workspace{width:auto;max-width:none;min-height:var(--app-viewport-height);margin:0 0 0 var(--workspace-sidebar-offset);padding:calc(var(--app-header-height) + var(--page-gutter)) var(--page-gutter) 36px}
html body:not([data-page="chat"])>.app-shell>.workspace>:is(.studio-heading,.model-bar,.creation-grid,.details-panel,.bottom-branding){width:100%;max-width:var(--workspace-max);margin-left:auto;margin-right:auto}
.workspace .creation-grid{grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:20px}
.workspace :is(input,select,textarea){max-width:100%;min-width:0}
.model-bar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.model-bar :is(label,.route-field,.route-trigger){min-width:0;max-width:100%}
.prompt-actions{display:flex;flex-wrap:wrap}
.prompt-actions>button{flex:1 1 140px;min-width:0;height:auto;min-height:40px;padding-block:9px}
:is(.studio-heading,.preview-head,.duration-head,.wallet-ledger-head){flex-wrap:wrap;gap:10px}
:is(.reference-url,.custom-topup){min-width:0}
:is(.reference-url,.custom-topup)>input{width:100%;min-width:0}
.preview-frame :is(img,video){max-width:100%;max-height:100%;object-fit:contain}
.history-page-head,.history-toolbar,.history-filter,.history-bulkbar{flex-wrap:wrap;gap:8px}
.history-toolbar{width:auto}
.history-filter>label{flex:1 1 150px;min-width:0}
.history-filter :is(input,select){width:100%;min-width:0}
.history-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
.history-summary>div{min-width:0;white-space:normal}
.history-record{grid-template-columns:24px 64px minmax(0,1.3fr) minmax(130px,.8fr) max-content minmax(0,190px);grid-template-areas:"select preview task time state actions";gap:12px}
.history-record>time{white-space:normal;overflow-wrap:anywhere}
.history-record>.history-state{max-width:100%;white-space:normal;line-height:1.45;text-align:center}
.history-actions{max-width:100%;min-width:0;flex-wrap:wrap}
.history-actions>button{max-width:100%;white-space:normal;line-height:1.45;height:auto;min-height:30px;padding-block:6px}
:is(.auth-modal,.workbench-modal,.history-detail-modal,.history-details-modal,.action-confirm-overlay,.system-announcement-modal){max-height:var(--app-viewport-height)}
:is(.auth-card,.workbench-modal-card,.history-detail-card,.history-detail-panel,.history-details-panel,.action-confirm-panel,.system-announcement-card){max-width:100%;max-height:calc(var(--app-viewport-height) - 24px)}
.workbench-modal>.account-settings-modal{max-height:min(720px,calc(var(--app-viewport-height) - 24px))}
:is(.referral-card,.wallet-account-card,.auth-card) input{min-width:0;max-width:100%}
.chat-toolbar-popover,.chat-wallpaper-menu{max-width:calc(100vw - 24px);max-height:calc(var(--app-viewport-height) - var(--app-header-height) - 20px);overflow-y:auto}
.sidebar-toggle{flex:0 0 36px}
.sidebar-mobile-close,.mobile-nav-scrim{display:none}
.sidebar-resize-handle{position:fixed;z-index:12;top:0;bottom:0;left:calc(var(--chat-sidebar-width,224px) - 4px);width:8px;cursor:col-resize;touch-action:none;background:transparent;outline:0}
.sidebar-resize-handle::before{content:"";position:absolute;inset:0 3px;background:transparent;transition:background-color .15s}
.sidebar-resize-handle:hover::before,.sidebar-resize-handle:focus-visible::before,.is-sidebar-resizing .sidebar-resize-handle::before{background:#659ef0}
body.is-sidebar-resizing,body.is-sidebar-resizing *{cursor:col-resize!important;user-select:none!important}
body.sidebar-collapsed .sidebar-resize-handle{display:none}
body.sidebar-collapsed .chat-sidebar{width:72px;padding-inline:10px}
body.sidebar-collapsed .chat-sidebar :is(.chat-brand-name,.chat-nav-text,.service-nav-full,.service-nav-short,.chat-nav-external,.chat-sidebar-foot){display:none}
body.sidebar-collapsed .chat-sidebar .chat-brand{justify-content:center;padding-inline:0}
body.sidebar-collapsed .chat-sidebar .chat-nav-item{justify-content:center;gap:0;padding-inline:0}
body.sidebar-collapsed .chat-sidebar .chat-nav-label{font-size:0;min-height:12px;padding:0;margin-top:10px;border:0}
body.sidebar-collapsed .chat-sidebar :is(.recharge-zone-label,.after-sales-label,.chat-nav-label-spaced){border-top:1px solid var(--nav-divider);padding-top:10px}
.mobile-nav-scrim[hidden],.sidebar-resize-handle[hidden]{display:none!important}
@media(max-width:1280px){
 .history-record{grid-template-columns:24px 58px minmax(0,1fr) auto;grid-template-areas:"select preview task state" "select preview time actions";gap:10px}
 .history-record>.history-actions{justify-content:flex-end}
 .history-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
 .chat-main .chat-ambient-greeting{display:none}
}
@media(max-width:1200px){
 .workspace .creation-grid{grid-template-columns:minmax(0,1fr);gap:16px}
 .creation-grid>.left-flow{display:contents}
 .creation-grid .prompt-panel{grid-column:1;grid-row:1}
 .creation-grid .generation-panel{grid-column:1;grid-row:2}
 .creation-grid .preview-panel{grid-column:1;grid-row:3}
 .generation-panel .field-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
 :root{--workspace-sidebar-offset:0px;--page-gutter:14px}
 html .chat-topbar{left:0;height:var(--app-header-height);padding-inline:12px}
 html .chat-main,html body:not([data-page="chat"])>.app-shell>.workspace{margin-left:0}
 html .chat-sidebar{position:fixed;inset:0 auto 0 0;z-index:181;display:flex;flex-direction:column;width:min(280px,85vw);height:var(--app-viewport-height);max-height:var(--app-viewport-height);padding:env(safe-area-inset-top,0px) 12px max(14px,env(safe-area-inset-bottom,0px));overflow-x:hidden;overflow-y:auto;transform:translateX(-100%);visibility:hidden;transition:transform .2s ease,visibility .2s ease}
 body.nav-open .chat-sidebar{transform:translateX(0);visibility:visible}
 body.nav-open{overflow:hidden}
 .chat-sidebar .chat-brand{height:70px;flex:0 0 70px;margin-bottom:12px}
 .chat-sidebar .chat-brand-name{min-width:0}
 .chat-sidebar .chat-nav{display:grid;grid-template-columns:minmax(0,1fr);gap:4px}
 .chat-sidebar .chat-nav-item{width:100%;max-width:100%;flex:initial;justify-content:flex-start;min-height:42px;padding-inline:12px;font-size:13px}
 .chat-sidebar .chat-nav-item>.chat-nav-text,.chat-sidebar .service-nav-full{display:block;flex:1;min-width:0}
 .chat-sidebar .service-nav-short{display:none}
 .chat-sidebar .chat-nav-label{display:flex;padding-left:12px;font-size:11px}
 .chat-sidebar .secondary-nav{display:grid}
 .chat-sidebar .chat-sidebar-spacer{display:block;flex:1 0 18px}
 .chat-sidebar .chat-sidebar-foot{display:block}
 .chat-sidebar .chat-qr-popover{left:12px;bottom:12px;width:min(256px,calc(100vw - 24px));max-width:calc(100vw - 24px)}
 .chat-sidebar .chat-qr-popover img{width:100%;height:auto}
 .sidebar-mobile-close{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;margin-left:auto;padding:0;border:0;border-radius:6px;background:transparent;color:var(--nav-text);cursor:pointer}
 .sidebar-mobile-close svg{width:18px;height:18px}
 .sidebar-mobile-close:hover{background:var(--nav-hover)}
 .sidebar-resize-handle{display:none}
 .mobile-nav-scrim{position:fixed;inset:0;z-index:180;width:100%;height:var(--app-viewport-height);padding:0;border:0;background:#050a126b;backdrop-filter:blur(2px)}
 body.nav-open .mobile-nav-scrim{display:block}
 .chat-main .chat-main-head{margin-bottom:12px}
 .chat-main-head h2{font-size:21px}
 .chat-main-head p{font-size:11px}
}
@media(max-width:600px){
 :root{--page-gutter:10px;--app-header-height:calc(52px + env(safe-area-inset-top,0px))}
 .chat-topbar{gap:7px}
 .chat-profile-button>span:nth-child(2),.chat-profile-button>.chat-chevron{display:none}
 .chat-profile-button{width:36px;padding:0;justify-content:center}
 .chat-main .chat-ambient{padding:7px 11px;gap:6px 10px;min-height:48px}
 .chat-main .chat-ambient-time{font-size:20px}
 .chat-main .chat-ambient-date,.chat-main .chat-ambient-region small,.chat-main .chat-ambient-weather small{display:none}
 .chat-main .chat-messages{padding:14px 10px}
 .chat-main .chat-composer{padding:0 8px 9px}
 .chat-main .chat-input-bar{gap:7px;padding:8px;min-height:50px}
 .chat-input-bar>button{width:30px;height:32px}
 .chat-message .chat-bubble,.chat-message.user .chat-bubble{max-width:95%;padding:10px 11px}
 .chat-retention{font-size:9px;white-space:normal;text-align:right}
 .model-bar{grid-template-columns:minmax(0,1fr);padding:16px}
 :is(.prompt-panel,.generation-panel,.preview-panel,.history-panel){padding:16px}
 .history-page-head{align-items:flex-start}
 .history-toolbar{width:100%;justify-content:flex-start}
 .history-record{grid-template-columns:22px 48px minmax(0,1fr);grid-template-areas:"select preview task" "select preview time" "select preview state" "select preview actions";padding:12px 10px;gap:8px}
 .history-record>.history-state,.history-record>.history-actions{justify-self:start;justify-content:flex-start}
 .history-record :is(.history-preview,.history-swatch){width:48px;height:48px}
 .referral-summary,.wallet-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .referral-link-row{flex-wrap:wrap}
 .settings-form-row{grid-template-columns:minmax(0,1fr)}
 .wallet-ledger-row{grid-template-columns:minmax(0,1fr) auto}
 .wallet-ledger-row time{grid-column:1}
 .wallet-ledger-amount{grid-column:2;grid-row:1/3}
 :is(.auth-modal,.workbench-modal,.history-detail-modal,.history-details-modal,.system-announcement-modal){padding:10px}
}
@media(max-width:400px){
 .chat-wallpaper-btn{width:36px;padding:0;justify-content:center}
 .chat-wallpaper-btn>span,.chat-wallpaper-btn>.wallpaper-chevron{display:none}
 .chat-ambient-weather{gap:4px}
 .history-summary{grid-template-columns:minmax(0,1fr)}
 .profile-avatar-editor{flex-wrap:wrap}
}
@media(max-height:600px){
 .chat-main .chat-main-head{display:none}
 .chat-main .chat-ambient{min-height:38px;padding-block:5px}
 .chat-main .chat-ambient-date,.chat-main .chat-ambient-greeting{display:none}
 .chat-main .chat-ambient-time{font-size:19px}
 .chat-main .chat-composer{padding-bottom:6px}
 .chat-main .chat-composer textarea{max-height:min(80px,22dvh)}
 .chat-main .chat-attachments{min-height:0;max-height:50px;padding-block:4px}
 .chat-main .chat-attachment{width:40px;height:40px;flex-basis:40px}
}
@media(prefers-reduced-motion:reduce){.chat-sidebar,.sidebar-resize-handle::before{transition:none}}