/* Platform layouts only. Generated app HTML and data are never rewritten here. */
.project-switch,.mobile-project-more,.project-mobile-status{display:none}
.cell-value{min-width:0}
@media(max-width:1024px){
 :root{--mobile-header:60px}
 body{overflow-wrap:anywhere}
 .sidebar,.breadcrumb{display:none}
 .app-shell{padding-left:0;min-height:100dvh}
 .topbar{min-height:var(--mobile-header);height:var(--mobile-header);padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));flex-wrap:nowrap;gap:8px;position:sticky;top:0;z-index:10;background:#faf9f6}
 .mobile-brand{display:flex;min-width:0;gap:8px;flex:1}
 .mobile-brand strong{font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#4b4057}
 .mobile-menu-toggle{min-width:44px;height:44px;background:white;border:1px solid var(--line);color:#67518c}
 .topbar .closed-badge{font-size:10px;white-space:nowrap;padding:8px;max-width:150px}
 .topbar .closed-badge svg{display:none}
 .main{width:100%;padding:20px max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));min-width:0}
 h1{font-size:26px;line-height:1.25}
 .heading{flex-wrap:wrap;gap:12px;min-width:0}
 .heading>div,.section-heading>div{min-width:0}
 .subtitle{font-size:14px;color:#766980}
 .eyebrow{font-size:10px;line-height:1.5}
 .button,.button.small,.heading .button,.project-actions .button{min-height:44px;font-size:14px;padding:10px 14px;white-space:normal;text-align:center}
 .icon-button{min-width:44px;min-height:44px}
 input:not([type=checkbox]):not([type=radio]),textarea,select,.form-group input,.form-group textarea,.form-group select,.catalog-toolbar select{font-size:16px;min-height:44px;max-width:100%;min-width:0}
 input[type=checkbox],input[type=radio]{flex-shrink:0}
 .check-row{min-height:44px}
 .form-group label{font-size:14px}
 .form-group small,.helper-text,.phone-note,.note-card,.resource-list,.resource-meter,.release-checks,.release-warnings{font-size:13px;line-height:1.65}
 .form-row,.settings-grid,.catalog-detail,.help-start,.phone-platforms{grid-template-columns:1fr}
 .resource-list>div{flex-wrap:wrap;gap:8px}
 .resource-list strong{text-align:left}
 .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 .project-card,.library-card,.executor-card,.stat{min-width:0;padding:18px}
 .project-card h3,.library-card h3{font-size:17px;line-height:1.4}
 .project-card p,.library-author,.library-origin,.library-address,.library-kind,.version-label,.card-footer{font-size:12px}
 .library-actions{flex-wrap:wrap}
 .library-secondary,.library-menu summary,.catalog-like,.catalog-more{min-height:44px;display:inline-flex;align-items:center;font-size:13px}
 .library-menu>div{max-width:calc(100vw - 40px)}
 .library-menu>div a,.library-menu>div button{min-height:44px;font-size:14px}
 .hero{padding:22px}
 .hero h2{font-size:22px}
 .hero p{font-size:14px}
 .hero-art{display:none}
 .idea-chip{min-height:44px;font-size:12px;padding:10px 14px}
 .section-heading{align-items:flex-start;gap:12px}
 .section-heading h2{font-size:17px}
 .toolbar,.search{width:100%}
 .catalog-toolbar{gap:12px}
 .catalog-toolbar>label{min-width:130px;flex:1;font-size:13px}
 .catalog-search{min-width:100%}
 .catalog-result-line{font-size:13px}
 .catalog-pagination{flex-wrap:wrap;gap:12px;font-size:13px}
 .table-wrap{border:0;border-radius:0;background:transparent;overflow:visible}
 .table-wrap table,.table-wrap tbody{display:block;width:100%;min-width:0}
 .table-wrap thead{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%)}
 .table-wrap tbody tr{display:block;border:1px solid var(--line);border-radius:14px;background:#fff;margin-bottom:14px;padding:6px 16px}
 .table-wrap td{display:grid;grid-template-columns:minmax(90px,.7fr) minmax(0,1.3fr);gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid #f0ecf4;width:auto;max-width:none;font-size:13px;white-space:normal}
 .table-wrap td:last-child{border-bottom:0}
 .table-wrap td::before{content:attr(data-label);font-size:12px;color:#84768d;line-height:1.5}
 .table-wrap td[colspan]{display:block;padding:20px 0}
 .table-wrap td[colspan]::before{display:none}
 .table-wrap td small{font-size:12px;line-height:1.6}
 .table-wrap .actions{flex-wrap:wrap;gap:8px}
 .diagnostic-help{min-width:0;max-width:none;font-size:12px}
 dialog,.onboarding,.phone-dialog{width:calc(100% - 24px);max-width:560px;max-height:calc(var(--visual-height,100dvh) - 24px);overflow-y:auto;padding:20px;border-radius:18px}
 .dialog-heading{gap:12px;margin-bottom:20px}
 .dialog-heading h2{font-size:21px;color:#645171}
 .dialog-actions{gap:10px;flex-wrap:wrap}
 .dialog-actions .button{flex:1;min-width:100px}
 .navigation-dialog{max-width:420px;padding-bottom:max(20px,env(safe-area-inset-bottom))}
 .navigation-dialog .dialog-actions,.navigation-dialog #dialog-error{display:none}
 .mobile-space-label{display:block;font-size:12px;color:#82718e;margin-bottom:6px}
 .navigation-dialog select{width:100%;padding:10px;border:1px solid var(--line);border-radius:9px;background:white}
 .mobile-nav-links{margin:16px 0}
 .navigation-dialog .nav-link{min-height:48px;font-size:15px;padding:12px}
 .mobile-admin-nav{padding:12px 0;border-top:1px solid var(--line)}
 .mobile-admin-nav>summary{padding:12px;font-size:14px;cursor:pointer;color:#776486}
 .mobile-menu-account{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
 .mobile-menu-account small{display:block;font-size:12px;color:#8a7b95;margin-top:4px}
 .navigation-dialog .platform-version{min-height:44px;font-size:12px}
 .login-page{min-height:100dvh;grid-template-columns:1fr}
 .login-story{min-height:0;padding:24px}
 .login-story .brand{font-size:19px}
 .story-content{padding:22px 0 0}
 .story-content h1{font-size:29px}
 .login-form-area{padding:24px;align-items:flex-start}
 .login-form{width:100%;max-width:400px}
 .login-form h2{font-size:25px}
 .login-form>p{font-size:14px;margin-bottom:24px}
 .login-footer{font-size:12px}
 .faq summary{font-size:15px;line-height:1.5;min-height:24px}
 .faq p,.phone-platforms ol,.onboarding>p,.tour-note{font-size:14px}
 .release-history-list ul{font-size:14px}
 #toast{max-width:calc(100vw - 32px);bottom:max(18px,env(safe-area-inset-bottom));font-size:14px}
 /* A project occupies the available viewport, including when a keyboard opens. */
 .app-shell:has(.project-main){height:var(--visual-height,100dvh);min-height:0;display:flex;flex-direction:column;overflow:hidden}
 .app-shell:has(.project-main) .topbar{flex-shrink:0;position:relative}
 .project-main{display:flex;flex-direction:column;flex:1;min-height:0;padding:12px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));overflow:hidden}
 .project-heading{flex-wrap:nowrap;align-items:center;margin:0 0 8px;gap:12px;flex-shrink:0}
 .project-heading>div:first-child{flex:1;overflow:hidden}
 .project-heading h1{font-size:21px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .project-heading .eyebrow,.project-heading .project-path,.project-heading #project-actions{display:none}
 .mobile-project-more{display:flex;background:#fff;border:1px solid var(--line);flex-shrink:0}
 #inheritance-note{flex-shrink:0;max-height:64px;overflow:auto}
 #inheritance-note:empty{display:none}
 #inheritance-note .note-card{margin:0 0 8px;padding:10px;font-size:12px}
 .project-mobile-status{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#7a648e;margin-bottom:8px;flex-shrink:0}
 .project-mobile-status:empty{display:none}
 .project-switch{display:flex;background:#eeebf4;padding:4px;border-radius:12px;margin-bottom:12px;flex-shrink:0;gap:4px}
 .project-switch button{flex:1;min-height:40px;border-radius:9px;background:transparent;color:#82718d;font-size:14px;font-weight:600}
 .project-switch button[aria-pressed=true]{background:white;color:#6544bb;box-shadow:0 2px 8px #3824520a}
 .project-layout{display:flex;flex:1;min-height:0;height:auto;gap:0;position:relative}
 .project-layout>.panel{min-height:0;height:100%;width:100%;position:absolute;inset:0;border-radius:12px}
 .project-layout[data-mobile-pane=chat] .app-panel,.project-layout[data-mobile-pane=app] .chat-panel{visibility:hidden;pointer-events:none}
 .panel-header{padding:10px 12px;font-size:12px;gap:10px}
 .panel-header .panel-title{font-size:12px}
 .badge{font-size:11px}
 .messages{min-height:0;max-height:none;padding:16px;gap:16px;overscroll-behavior:contain}
 .message{font-size:14px;line-height:1.65;overflow-wrap:anywhere}
 .message-label{font-size:11px;gap:8px;flex-wrap:wrap}
 .chat-welcome{padding:20px 8px}
 .chat-welcome h3{font-size:17px}
 .chat-welcome p{font-size:14px}
 .chat-form{padding:10px;flex-shrink:0;padding-bottom:12px}
 .chat-form textarea{font-size:16px;min-height:72px;max-height:128px;padding:12px;line-height:1.5}
 .composer-attach,.composer-send{min-width:44px;min-height:44px}
 .composer-send{width:44px;padding:10px}
 .composer-send span{display:none}
 .assistant-menu summary{font-size:12px;padding:12px 5px;min-height:44px}
 .assistant-menu summary span{max-width:140px;overflow:hidden;text-overflow:ellipsis}
 .assistant-menu summary svg:first-child{display:none}
 .assistant-options{width:min(280px,calc(100vw - 64px));left:-40px;max-height:min(350px,50dvh)}
 .assistant-options button{min-height:52px;padding:12px}
 .assistant-options strong{font-size:14px}
 .assistant-options small{font-size:12px}
 .composer-caption{font-size:10px;gap:6px;padding-top:6px}
 .composer-caption button{font-size:11px;min-height:32px}
 #attachment-drafts{max-height:85px;overflow:auto}
 .attachment-chips .icon-button{min-width:44px;min-height:44px}
 .job-progress{padding:10px;margin:8px 10px 0;max-height:110px;overflow:auto;gap:8px}
 .job-progress strong{font-size:12px}
 .job-progress p{font-size:12px}
 .job-progress .button{min-height:36px;font-size:11px;padding:8px}
 .job-progress.completed{display:none}
 .panel-tabs{padding:0 12px;gap:18px;overscroll-behavior-x:contain}
 .panel-tab{min-height:48px;font-size:13px;padding:14px 0}
 .preview-content{min-height:0;padding:14px}
 .preview-content:has(#app-preview){padding:0}
 .preview-content #app-preview{height:auto;min-height:0;flex:1;width:100%;display:block}
 .preview-stage-note{padding:8px 12px;font-size:11px;flex-shrink:0}
 .project-menu-actions{display:flex;flex-direction:column;gap:12px}
 .project-menu-actions .button{width:100%}
 .play-page{height:100dvh;padding:10px max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));display:flex;flex-direction:column}
 .play-tools{flex-shrink:0;gap:10px}
 .play-page #app-preview{flex:1;height:auto;min-height:0;width:100%;margin-top:10px}
}
@media(max-width:600px){.cards{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.stats .stat:last-child{grid-column:auto}.catalog-toolbar>label{min-width:calc(50% - 12px)}.table-wrap td{grid-template-columns:90px minmax(0,1fr)}}
@media(max-width:360px){.table-wrap td{grid-template-columns:1fr;gap:4px}.topbar .closed-badge{font-size:9px;padding:6px}.assistant-menu summary span{max-width:108px}}
@media(max-width:1024px) and (max-height:500px){.project-heading,.project-mobile-status,.composer-caption{display:none}.project-switch{margin-bottom:6px}.project-switch button{min-height:36px}.chat-form textarea{min-height:48px;max-height:80px}.job-progress{max-height:65px}.panel-header{padding:6px 10px}}
@media(prefers-reduced-motion:reduce){.project-card{transition:none}.project-card:hover{transform:none}}

/* Project workspace: one toolbar and one pane switch, the rest is conversation. */
@media(max-width:1024px){
 .app-shell:has(.project-main) .topbar{height:52px;min-height:52px;padding-top:4px;padding-bottom:4px}
 .app-shell:has(.project-main) .closed-badge{display:none}
 .app-shell:has(.project-main) .mobile-brand{width:100%}
 .project-shortcut{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:44px}
 .project-shortcut svg{flex-shrink:0}
 .project-main{padding:0 max(8px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}
 .project-main .project-heading,.project-main #inheritance-note,.project-main .chat-panel>.panel-header{display:none}
 .project-main .project-switch{border-radius:10px;margin:0 0 4px;padding:2px;gap:2px;order:0}
 .project-main .project-switch button{min-height:40px;padding:6px;font-size:14px}
 .project-main .project-mobile-status{order:1;margin:0;min-height:0;font-size:12px;align-items:center}
 .project-main .project-mobile-status:not(:empty){padding:0 4px 4px}
 .project-main .project-layout{order:2}
 .project-main .chat-panel{border:0;background:transparent}
 .project-main #job-progress{display:none}
 .project-main .messages{padding:12px 4px 8px;gap:16px;flex:1;min-height:0}
 .project-main .message{font-size:15px;line-height:1.55;border-radius:14px;padding:12px}
 .project-main .chat-form{padding:4px 0 0;background:transparent;border:0}
 .project-main .composer-caption{display:none}
 .project-main .composer-box{border-radius:16px;background:#fff}
 .project-main .chat-form textarea{min-height:48px;max-height:none;padding:12px;font-size:16px}
 .project-main .composer-toolbar{padding:0 6px 4px}
 .project-main .chat-welcome{padding:8px 12px;text-align:left}
 .project-main .chat-welcome .project-icon{display:none}
 .mobile-task-detail{appearance:none;-webkit-appearance:none;background:transparent;border:0;border-radius:6px;cursor:pointer;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;color:#655279;font-size:12px;flex:1;padding:6px 0}
 .mobile-task-detail svg{width:14px;height:14px}
 .mobile-task-detail.failed{color:#a54258}
 .project-mobile-status .icon-button{min-width:36px;min-height:36px;padding:8px}
}

@media(max-width:1024px){.compact-viewport .project-heading,.compact-viewport .project-mobile-status,.compact-viewport .composer-caption,.compact-viewport .chat-panel .panel-header,.compact-viewport .chat-panel #job-progress{display:none}.compact-viewport .app-shell:has(.project-main) .topbar{height:52px;min-height:52px;padding-top:4px;padding-bottom:4px}.compact-viewport .project-main{padding-top:4px;padding-bottom:4px}.compact-viewport .project-switch{margin-bottom:6px;padding:3px}.compact-viewport .project-switch button{min-height:32px}.compact-viewport .chat-form{padding:8px}.compact-viewport .chat-form textarea{min-height:48px;max-height:80px}}

@media(max-width:1024px){.project-shortcut{display:inline-flex;align-items:center;gap:6px;min-height:44px;background:transparent;color:#4b4057;font-size:15px;font-weight:600}.project-shortcut svg{width:14px;height:14px}}
@media(max-width:600px){.login-story .story-content{display:none}.login-story{padding:22px 24px}.login-form-area{padding-top:12px}}

@media(max-width:1024px){.chat-form textarea{overflow-x:hidden;overflow-wrap:break-word;white-space:pre-wrap}.chat-welcome{min-height:0;padding:18px 8px}.chat-welcome .project-icon{display:none}.chat-welcome p{line-height:1.6;margin-top:10px}}

@media(max-width:1024px){.topbar{height:calc(var(--mobile-header) + env(safe-area-inset-top));min-height:calc(var(--mobile-header) + env(safe-area-inset-top));padding-top:calc(8px + env(safe-area-inset-top))}.compact-viewport .app-shell:has(.project-main) .topbar{height:calc(52px + env(safe-area-inset-top));min-height:calc(52px + env(safe-area-inset-top));padding-top:calc(4px + env(safe-area-inset-top))}.play-page{padding-top:calc(10px + env(safe-area-inset-top))}dialog,.onboarding,.phone-dialog{max-height:calc(var(--visual-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px)}}

.project-dev-marker{font-size:10px;color:#7052ba;flex-shrink:0;letter-spacing:.04em}
