@import url("/components/image-model-controls/ImageEditControls.css?v=2");
@import url("/components/loading/workspace-readiness.css?copy=20261023-acceptance");
@import url("/components/reference-rail/reference-rail.css?v=20261022-v5b");
/* Full creator workspace styles. The public homepage has its own marketing stylesheet. */
.sc-home { overflow-x: clip; }
.home-hero { position: relative; display: grid; min-height: clamp(32rem, 72vh, 44rem); overflow: hidden; align-items: center; padding: var(--sc-space-16) 0; background: linear-gradient(180deg, var(--sc-color-surface) 0%, var(--sc-color-canvas) 100%); }
.home-hero::before { content: ""; position: absolute; inset: -16rem 20% auto auto; width: 38rem; height: 38rem; border-radius: 50%; background: rgba(244, 84, 35, .11); filter: blur(20px); pointer-events: none; }
.home-hero__content { position: relative; display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr); justify-items: center; gap: var(--sc-space-8); }
.home-hero__content > .sc-title-display { width: 100%; min-width: 0; max-width: 100%; font-size: clamp(1.25rem, 7vw, 5rem); text-align: center; }
.home-chat { position: relative; display: grid; width: min(100%, 46rem); grid-template-columns: minmax(0, 1fr) max-content; grid-template-areas: "attachments attachments" "privacy privacy" "prompt prompt" "options submit" "status status"; column-gap: var(--sc-space-2); overflow: visible; padding: var(--sc-space-2); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-xl); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-md); transition: border-color var(--sc-motion-base) var(--sc-ease), box-shadow var(--sc-motion-base) var(--sc-ease); }
.home-chat__reference-privacy { grid-area: privacy; margin: var(--sc-space-1) var(--sc-space-3); color: var(--sc-color-muted); font-size: .75rem; line-height: 1.25; }
.home-chat__mobile-field.home-chat__mobile-field--prompt { display: grid; min-width: 0; grid-area: prompt; gap: var(--sc-space-1); }
.sc-app [hidden] { display: none !important; }
.home-chat__mobile-field--prompt .home-chat__mobile-field-heading { display: flex; align-items: center; justify-content: flex-end; gap: var(--sc-space-2); margin-inline: var(--sc-space-2); }
.home-chat__audio-simple-description { color: var(--sc-color-ink); font: 800 .8125rem/1.35 var(--sc-font-sans); }
.home-chat__prompt-actions { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: var(--sc-space-2); }
.home-chat__prompt-action { display: inline-flex; min-height: 2.75rem; align-items: center; justify-content: center; gap: var(--sc-space-1); padding: 0 var(--sc-space-3); border: 1px solid var(--sc-color-brand-200); border-radius: var(--sc-radius-md); color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); font: 750 .75rem/1 var(--sc-font-sans); white-space: nowrap; cursor: pointer; transition: color var(--sc-motion-fast) var(--sc-ease), border-color var(--sc-motion-fast) var(--sc-ease), background var(--sc-motion-fast) var(--sc-ease), transform var(--sc-motion-fast) var(--sc-ease); }
.home-chat__prompt-action:hover { border-color: var(--sc-color-brand-500); background: var(--sc-color-brand-100); transform: translateY(-1px); }
.home-chat__prompt-action--enhance { border: 0; background: transparent; box-shadow: none; }
.home-chat__prompt-action--enhance:hover { border-color: transparent; background: var(--sc-color-brand-50); }
.home-chat__prompt-action--undo { color: var(--sc-color-muted); border-color: var(--sc-color-border); background: var(--sc-color-surface); }
.home-chat__prompt-action--undo:hover { color: var(--sc-color-brand-800); border-color: var(--sc-color-brand-200); background: var(--sc-color-surface-muted); }
.home-chat__prompt-action:focus-visible { outline: 3px solid var(--sc-color-brand-200); outline-offset: 3px; }
.home-chat__prompt-action:disabled { color: var(--sc-color-subtle); border-color: var(--sc-color-border); background: var(--sc-color-surface-muted); cursor: not-allowed; opacity: .72; transform: none; }
.home-chat__prompt-action--enhance:disabled { border: 0; background: transparent; }
.home-chat__prompt-action[hidden], .home-chat[data-mode="chat"] .home-chat__prompt-actions, .home-chat[data-mode="chat"] .home-chat__prompt-enhancement-hint, .home-chat[data-mode="audio"] .home-chat__prompt-enhancement-hint { display: none; }
.home-chat__prompt-enhancement-hint { margin: 0 var(--sc-space-3); color: var(--sc-color-subtle); font-size: .6875rem; line-height: 1.4; text-align: right; }
.home-chat__input { box-sizing: border-box; display: block; width: calc(100% - var(--sc-space-4)); min-height: 3.75rem; max-height: 8.875rem; margin-inline: var(--sc-space-2); padding: var(--sc-space-4); resize: none; overflow-y: auto; border: 0; border-radius: 0 0 var(--sc-radius-lg) var(--sc-radius-lg); outline: 0; color: var(--sc-color-ink); background: var(--sc-color-surface); box-shadow: none; font: 400 1rem/var(--sc-leading-copy) var(--sc-font-sans); }
.home-chat__input::placeholder { color: var(--sc-color-subtle); }
.home-chat .home-chat__input { background: var(--sc-color-surface) !important; }
.home-chat .home-chat__input:focus, .home-chat .home-chat__input:focus-visible { border-color: transparent !important; outline: none !important; box-shadow: none !important; }
.home-chat__attachments { position: relative; z-index: 2; display: flex; min-height: 4.5rem; grid-area: attachments; align-items: center; gap: var(--sc-space-2); isolation: isolate; overflow-x: auto; margin: var(--sc-space-2) var(--sc-space-2) 0; padding: var(--sc-space-2) var(--sc-space-3); border-radius: var(--sc-radius-lg) var(--sc-radius-lg) 0 0; background: var(--sc-color-surface); scrollbar-width: thin; }
.home-chat__attachments[hidden] { display: none; }
.home-chat__attachment-items { display: flex; flex: 0 0 auto; gap: var(--sc-space-2); }
.home-chat__attachment { box-sizing: border-box; position: relative; display: grid; width: 3.375rem; height: 4.5rem; flex: 0 0 3.375rem; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); overflow: visible; border: 1px solid var(--sc-color-brand-200); border-radius: var(--sc-radius-md); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-sm); }
.home-chat__attachment-preview { box-sizing: border-box; display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: calc(var(--sc-radius-md) - var(--sc-space-1)); background: var(--sc-color-surface-muted); }
.home-chat__attachment-remove { position: absolute; top: -.75rem; right: -.75rem; display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border: 0; border-radius: var(--sc-radius-pill); color: var(--sc-color-brand-800); background: radial-gradient(circle, var(--sc-color-brand-100) 0 .8rem, transparent .84rem); font-size: 1.1rem; line-height: 1; cursor: pointer; }
.home-chat__attachment-status { position: absolute; right: var(--sc-space-1); bottom: var(--sc-space-1); width: .65rem; height: .65rem; border: 2px solid var(--sc-color-surface); border-radius: var(--sc-radius-pill); background: var(--sc-color-brand-600); }
.home-chat__attachment--processing .home-chat__attachment-status { animation: home-chat-pulse 1s ease-in-out infinite alternate; }
.home-chat__attach { position: relative; z-index: 4; display: grid; width: 3.375rem; height: 4.5rem; flex: 0 0 3.375rem; place-items: center; padding: 0; border: 1px solid var(--sc-color-brand-200); border-radius: var(--sc-radius-md); color: var(--sc-color-brand-700); background: transparent; font: 500 2rem/1 var(--sc-font-sans); cursor: pointer; transition: color var(--sc-motion-fast) var(--sc-ease), background var(--sc-motion-fast) var(--sc-ease), border-color var(--sc-motion-fast) var(--sc-ease), box-shadow var(--sc-motion-fast) var(--sc-ease); }
.home-chat__attach:hover { color: var(--sc-color-brand-800); border-color: var(--sc-color-brand-500); background: var(--sc-color-brand-50); box-shadow: var(--sc-shadow-sm); }
.home-chat__attach[aria-disabled="true"], .home-chat__attach[aria-disabled="true"]:hover { opacity: .58; color: var(--sc-color-muted); border-color: var(--sc-color-border); background: transparent; cursor: not-allowed; box-shadow: none; }
.home-chat__toolbar { position: relative; z-index: 4; display: grid; min-width: 0; grid-area: options; grid-template-columns: repeat(3, max-content); align-self: center; align-items: center; justify-self: start; gap: var(--sc-space-2); overflow: visible; margin: var(--sc-space-2) 0 var(--sc-space-2) var(--sc-space-2); }
.home-chat__chip { display: inline-flex; min-height: 2.25rem; align-items: center; padding: 0 var(--sc-space-3); border: 1px solid rgba(16, 32, 25, .07); border-radius: .7rem; color: var(--sc-color-muted); background: var(--sc-color-surface); box-shadow: 0 2px 5px rgba(16, 32, 25, .04); font-size: .75rem; font-weight: 750; white-space: nowrap; }
.home-chat__chip--primary { color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
[data-app-mode-control] { min-height: 2.75rem; color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
.home-chat__mode-menu { min-width: 8rem; }
.home-chat__menu-control { position: relative; }
.home-chat__toolbar > .home-chat__menu-control { display: flex; min-height: 2.75rem; align-items: center; }
.home-chat__menu-button { display: inline-flex; min-height: 2.75rem; align-items: center; gap: var(--sc-space-2); padding: 0 var(--sc-space-3); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-md); color: var(--sc-color-muted); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-sm); font: 750 .75rem/1 var(--sc-font-sans); white-space: nowrap; cursor: pointer; }
.home-chat__menu-button:hover, .home-chat__menu-button[aria-expanded="true"] { color: var(--sc-color-brand-800); border-color: var(--sc-color-brand-200); background: var(--sc-color-brand-50); }
.home-chat__menu { position: absolute; z-index: 8; bottom: calc(100% + var(--sc-space-2)); left: 0; display: grid; min-width: 10rem; padding: var(--sc-space-2); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-md); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-md); }
.home-chat__menu[hidden] { display: none; }
.home-chat__menu--models { max-height: min(24rem, calc(100dvh - 8rem)); overflow-y: auto; overscroll-behavior: contain; }
.home-chat__menu-item { display: flex; min-height: 2.75rem; align-items: center; gap: var(--sc-space-3); padding: 0 var(--sc-space-3); border: 0; border-radius: var(--sc-radius-sm); color: var(--sc-color-text); background: transparent; font: 700 .8125rem/1 var(--sc-font-sans); text-align: left; cursor: pointer; }.home-chat__menu-item:hover, .home-chat__menu-item[aria-checked="true"] { color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
.home-chat__model-group { display: grid; gap: 1px; min-width: 0; }
.home-chat__model-group + .home-chat__model-group { margin-top: var(--sc-space-1); padding-top: var(--sc-space-1); border-top: 1px solid var(--sc-color-border); }
.home-chat__model-group-toggle { display: flex; width: 100%; min-height: 2.25rem; align-items: center; justify-content: space-between; padding: 0 var(--sc-space-3); border: 0; border-radius: var(--sc-radius-sm); color: var(--sc-color-muted); background: var(--sc-color-surface-muted); font: 800 .6875rem/1 var(--sc-font-sans); letter-spacing: .04em; text-align: left; cursor: pointer; }
.home-chat__model-group-toggle::after { width: .5rem; height: .5rem; flex: 0 0 .5rem; content: ""; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; color: var(--sc-color-brand-700); transform: rotate(45deg); transition: transform var(--sc-motion-fast) var(--sc-ease); }
.home-chat__model-group-toggle[aria-expanded="true"] { color: var(--sc-color-brand-800); }
.home-chat__model-group-toggle[aria-expanded="true"]::after { transform: rotate(225deg); }
.home-chat__model-options { display: grid; gap: 1px; }
.home-chat__model-options[hidden] { display: none; }
.home-chat__model-group-toggle:focus-visible { outline: 3px solid rgba(244, 84, 35, .28); outline-offset: 2px; }
.home-chat__menu-item--unavailable, .home-chat__menu-item[disabled] { color: var(--sc-color-subtle); cursor: not-allowed; opacity: .55; }.home-chat__menu-item--unavailable:hover, .home-chat__menu-item[disabled]:hover { color: var(--sc-color-subtle); background: transparent; }
.home-chat__ratio-icon { box-sizing: border-box; display: inline-block; width: var(--home-ratio-icon-width, 1rem); height: var(--home-ratio-icon-height, 1rem); flex: 0 0 auto; aspect-ratio: var(--home-ratio-width, 1) / var(--home-ratio-height, 1); border: 2px solid currentColor; border-radius: var(--sc-space-1); }
.home-chat__specification-button { min-width: 6.75rem; justify-content: center; }
.home-chat__specification-popover { position: absolute; z-index: 18; bottom: calc(100% + var(--sc-space-2)); left: 0; display: grid; width: min(32rem, calc(100vw - var(--sc-space-8))); max-height: min(32rem, calc(100dvh - 8rem)); gap: var(--sc-space-4); overflow-y: auto; overscroll-behavior: contain; padding: var(--sc-space-4); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-lg); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-lg); animation: home-chat-specification-in var(--sc-motion-fast) var(--sc-ease); }
.home-chat__specification-popover[hidden], .home-chat__specification-section[hidden] { display: none; }
.home-chat__specification-section { display: grid; gap: var(--sc-space-2); }
.home-chat__specification-section + .home-chat__specification-section { padding-top: var(--sc-space-3); border-top: 1px solid var(--sc-color-border); }
.home-chat__specification-section h2 { margin: 0; color: var(--sc-color-ink); font: 800 .8125rem/1.35 var(--sc-font-sans); }
.home-chat[data-mode="video"] .home-chat__specification-popover { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-chat[data-mode="video"] .home-chat__specification-section:first-child,
.home-chat[data-mode="video"] .home-chat__video-audio { grid-column: 1 / -1; }
.home-chat__specification-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--sc-space-3); }
.home-chat__specification-heading output { color: var(--sc-color-brand-800); font: 800 .8125rem/1 var(--sc-font-sans); font-variant-numeric: tabular-nums; }
.home-chat__duration-range { width: 100%; min-height: 2.75rem; margin: 0; accent-color: var(--sc-color-brand-600); cursor: pointer; }
.home-chat__switch-row { display: flex; min-height: 3.5rem; align-items: center; justify-content: space-between; gap: var(--sc-space-4); cursor: pointer; }
.home-chat__switch-row > span:first-child { display: grid; gap: var(--sc-space-1); }
.home-chat__switch-row strong { color: var(--sc-color-ink); font: 800 .8125rem/1.35 var(--sc-font-sans); }
.home-chat__switch-row small { color: var(--sc-color-muted); font: 600 .75rem/1.4 var(--sc-font-sans); }
.home-chat__switch-row input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.home-chat__switch { position: relative; width: 2.75rem; height: 1.5rem; flex: 0 0 2.75rem; border: 1px solid var(--sc-color-border-strong); border-radius: var(--sc-radius-pill); background: var(--sc-color-surface-muted); transition: background var(--sc-motion-fast) var(--sc-ease), border-color var(--sc-motion-fast) var(--sc-ease); }
.home-chat__switch::after { position: absolute; top: 2px; left: 2px; width: 1.125rem; height: 1.125rem; content: ""; border-radius: 50%; background: var(--sc-color-surface); box-shadow: var(--sc-shadow-sm); transition: transform var(--sc-motion-fast) var(--sc-ease); }
.home-chat__switch-row input:checked + .home-chat__switch { border-color: var(--sc-color-brand-600); background: var(--sc-color-brand-600); }
.home-chat__switch-row input:checked + .home-chat__switch::after { transform: translateX(1.25rem); }
.home-chat__switch-row input:focus-visible + .home-chat__switch { outline: 3px solid var(--sc-color-brand-200); outline-offset: 3px; }
.home-chat__audio-mode { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--sc-space-2) var(--sc-space-4); margin: 0; padding: var(--sc-space-3); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-lg); }
.home-chat__audio-mode legend { padding-inline: var(--sc-space-1); color: var(--sc-color-muted); font: 750 .75rem/1.3 var(--sc-font-sans); }
.home-chat__audio-mode label { display: inline-flex; min-height: 2.75rem; align-items: center; gap: var(--sc-space-2); color: var(--sc-color-ink); font: 700 .8125rem/1.2 var(--sc-font-sans); }
.home-chat__audio-mode input { inline-size: 1rem; block-size: 1rem; accent-color: var(--sc-color-brand-600); }
.home-chat__audio-custom-fields { display: grid; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sc-space-3); }
.home-chat__audio-custom-field { display: grid; min-width: 0; gap: var(--sc-space-1); }
.home-chat__audio-custom-field label { color: var(--sc-color-ink); font: 750 .75rem/1.35 var(--sc-font-sans); }
.home-chat__audio-custom-fields .home-chat__input { width: 100%; min-height: 2.75rem; max-height: none; margin: 0; padding: var(--sc-space-3); border: 1px solid var(--sc-color-border) !important; border-radius: var(--sc-radius-md); background: var(--sc-color-surface-muted) !important; resize: vertical; }
.home-chat__audio-custom-fields #homeChatAudioLyrics { grid-column: 1 / -1; min-height: 10rem; }
.home-chat__audio-custom-field--lyrics { grid-column: 1 / -1; }
.home-chat__audio-custom-field--negative-tags { grid-column: 1 / -1; }
.home-chat__specification-options { display: grid; gap: var(--sc-space-2); }
.home-chat__specification-options--ratios { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.home-chat__specification-options--qualities { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-chat__specification-options--counts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.home-chat__specification-option { display: grid; min-width: 0; min-height: 3.5rem; place-items: center; gap: var(--sc-space-2); padding: var(--sc-space-2); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-md); color: var(--sc-color-muted); background: var(--sc-color-surface); font: 750 .75rem/1 var(--sc-font-sans); cursor: pointer; transition: color var(--sc-motion-fast) var(--sc-ease), border-color var(--sc-motion-fast) var(--sc-ease), background var(--sc-motion-fast) var(--sc-ease), transform var(--sc-motion-fast) var(--sc-ease); }
.home-chat__specification-option--ratio { grid-template-columns: minmax(0, 1fr); grid-template-rows: 1.5rem auto; align-content: center; min-height: 4.75rem; text-align: center; }
.home-chat__specification-option--ratio .home-chat__ratio-icon { transform: scale(1.15); }
.home-chat__specification-option:hover { color: var(--sc-color-brand-800); border-color: var(--sc-color-brand-200); background: var(--sc-color-brand-50); transform: translateY(-1px); }
.home-chat__specification-option[aria-pressed="true"] { color: var(--sc-color-brand-800); border-color: var(--sc-color-brand-500); background: var(--sc-color-brand-50); box-shadow: inset 0 0 0 1px var(--sc-color-brand-200); }
.home-chat__submit { position: static; display: flex; max-width: none; grid-area: submit; align-self: center; align-items: center; justify-content: flex-end; gap: var(--sc-space-2); margin: var(--sc-space-2) var(--sc-space-2) var(--sc-space-2) 0; }
.home-chat__submit-summary { display: inline-flex; width: auto; min-width: 0; max-width: none; align-items: center; justify-content: flex-end; gap: var(--sc-space-1); color: var(--sc-color-muted); font-size: .75rem; font-weight: 650; line-height: 1; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.home-chat__submit-summary[hidden] { display: none; }
.home-chat__send { min-width: 5.25rem; min-height: 2.75rem; flex: 0 0 auto; padding: 0 var(--sc-space-4); border: 0; border-radius: var(--sc-radius-md); color: #fff; background: var(--sc-color-brand-600); box-shadow: 0 8px 16px rgba(244, 84, 35, .2); cursor: pointer; font: 800 .875rem/1 var(--sc-font-sans); transition: background var(--sc-motion-fast) var(--sc-ease), transform var(--sc-motion-fast) var(--sc-ease); }.home-chat__send:hover { background: #d14114; transform: translateY(-1px); }.home-chat__send:focus-visible, .home-chat__attach:focus-visible, .home-chat__attachment-remove:focus-visible, .home-chat__menu-button:focus-visible, .home-chat__menu-item:focus-visible, .home-chat__model-group-toggle:focus-visible, .home-chat__specification-option:focus-visible { outline: 3px solid rgba(244, 84, 35, .28); outline-offset: 3px; }
.home-chat__send:disabled, .home-chat__attach:disabled, .home-chat__menu-button:disabled { opacity: .58; cursor: wait; transform: none; }
.home-chat__status { grid-area: status; margin: var(--sc-space-3) 0 0; color: var(--sc-color-danger); font-size: .8125rem; line-height: 1.5; }
.home-chat__status--loading { color: var(--sc-color-muted); }
.home-chat__status--success { color: var(--sc-color-success); }
.home-hero__intro { display: grid; justify-items: center; gap: var(--sc-space-5); max-width: 49rem; margin: 0 auto; text-align: center; }
.home-hero__intro .sc-title-display { max-width: 15ch; }
.home-workspace { overflow: hidden; border: 1px solid var(--sc-color-border-strong); border-radius: var(--sc-radius-xl); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-lg); }
.home-workspace__tabs { display: flex; gap: var(--sc-space-1); padding: var(--sc-space-2); overflow-x: auto; border-bottom: 1px solid var(--sc-color-border); background: var(--sc-color-surface); }
.home-workspace__tab { flex: 0 0 auto; min-height: 36px; padding: .6rem .8rem; border-radius: var(--sc-radius-sm); color: var(--sc-color-muted); font-size: .8125rem; font-weight: 700; text-decoration: none; }
.home-workspace__tab:hover, .home-workspace__tab.is-active { color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); }
.home-workspace__body { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(250px, .8fr); }
.home-workspace__form { display: flex; flex-direction: column; min-height: 272px; padding: clamp(1rem, 3vw, 1.75rem); gap: var(--sc-space-4); }
.home-field-label { display: flex; justify-content: space-between; gap: var(--sc-space-3); color: var(--sc-color-text); font-size: .8125rem; font-weight: 750; }
.home-field-label span:last-child { color: var(--sc-color-subtle); font-size: .75rem; font-weight: 600; }
.home-prompt { flex: 1; padding: var(--sc-space-4); border: 1px solid var(--sc-color-border-strong); border-radius: var(--sc-radius-md); color: var(--sc-color-muted); background: var(--sc-color-canvas); font-size: .9375rem; line-height: 1.65; }
.home-workspace__controls { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sc-space-2); }
.home-model-chip { padding: .55rem .65rem; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-sm); color: var(--sc-color-text); background: var(--sc-color-surface); font-size: .75rem; font-weight: 700; }
.home-generate { margin-left: auto; }
.home-workspace__preview { position: relative; min-height: 272px; margin: 0; overflow: hidden; background: var(--sc-color-surface-muted); }
.home-workspace__preview img { width: 100%; height: 100%; object-fit: cover; }
.home-workspace__preview::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(16, 32, 25, .3)); }
.home-workspace__preview-label { position: absolute; z-index: 1; right: var(--sc-space-4); bottom: var(--sc-space-4); display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .7rem; border: 1px solid rgba(24, 24, 24, .5); border-radius: var(--sc-radius-pill); color: #fff; background: rgba(16, 32, 25, .5); backdrop-filter: blur(10px); font-size: .75rem; font-weight: 700; }
.home-preview-dot { width: .48rem; height: .48rem; border-radius: 50%; background: var(--sc-color-brand-600); box-shadow: 0 0 0 3px rgba(244, 84, 35,.18); }
.home-workspace__foot { display: flex; justify-content: space-between; gap: var(--sc-space-4); padding: .75rem 1.25rem; border-top: 1px solid var(--sc-color-border); color: var(--sc-color-subtle); background: var(--sc-color-surface); font-size: .75rem; line-height: 1.5; }
.home-workspace__foot a { flex: 0 0 auto; color: var(--sc-color-brand-700); font-weight: 750; }
.home-section-heading { display: grid; gap: var(--sc-space-4); max-width: 44rem; margin-bottom: var(--sc-space-10); }
.home-section-heading--center { justify-items: center; margin-inline: auto; text-align: center; }
.home-tool-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sc-space-4); }
.home-tool-card { display: flex; align-items: flex-start; gap: var(--sc-space-4); min-height: 168px; padding: var(--sc-space-5); text-decoration: none; }
.home-tool-card__icon { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: var(--sc-radius-md); color: var(--sc-color-brand-700); background: var(--sc-color-brand-50); font-size: 1.25rem; font-weight: 800; }
.home-tool-card__body { display: grid; gap: var(--sc-space-2); }
.home-tool-card strong { color: var(--sc-color-ink); font-size: 1rem; }
.home-tool-card small { color: var(--sc-color-muted); font-size: .8125rem; line-height: 1.55; }
.home-tool-card__arrow { margin: 2px 0 0 auto; color: var(--sc-color-brand-700); font-size: 1.1rem; }
.home-gallery__layout { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.1fr); align-items: center; gap: clamp(2rem, 7vw, 7rem); }
.home-gallery__copy { display: grid; justify-items: start; gap: var(--sc-space-5); }
.home-gallery__mosaic { display: grid; grid-template-columns: 1.25fr .8fr; grid-template-rows: 1fr 1fr; gap: var(--sc-space-3); height: min(40vw, 480px); }
.home-gallery__tile { min-height: 0; margin: 0; overflow: hidden; border-radius: var(--sc-radius-lg); background: var(--sc-color-border); }
.home-gallery__tile img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--sc-motion-base) var(--sc-ease); }
.home-gallery__tile:hover img { transform: scale(1.035); }
.home-gallery__tile--tall { grid-row: 1 / span 2; }
.home-gallery__tile--soft img { object-position: 20% center; filter: saturate(.85) brightness(1.05); }
.home-gallery__tile--detail img { object-position: 70% 65%; filter: saturate(1.15) contrast(1.03); }
.home-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--sc-color-border); }
.home-feature { padding: var(--sc-space-6); border-right: 1px solid var(--sc-color-border); }
.home-feature:last-child { border-right: 0; }
.home-feature__number { display: block; margin-bottom: var(--sc-space-8); color: var(--sc-color-brand-700); font-size: .75rem; font-weight: 800; letter-spacing: .08em; }
.home-feature h3 { margin: 0 0 var(--sc-space-3); color: var(--sc-color-ink); font-size: 1.05rem; letter-spacing: -.02em; }
.home-feature p { margin: 0; color: var(--sc-color-muted); font-size: .875rem; line-height: 1.65; }
.home-faq__inner { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1fr); gap: clamp(2rem, 7vw, 8rem); }
.home-faq__intro { display: grid; align-content: start; gap: var(--sc-space-4); }
.home-final { padding-top: var(--sc-space-16); }
.home-final__card { display: grid; justify-items: center; gap: var(--sc-space-5); padding: clamp(2rem, 6vw, 4.5rem); overflow: hidden; text-align: center; background: linear-gradient(135deg, var(--sc-color-surface), var(--sc-color-brand-50)); }
.home-final__card .sc-title-section { max-width: 18ch; }
.home-final__card .sc-lede { max-width: 57ch; }
.home-session { --home-session-composer-clearance: 15rem; display: none; min-height: calc(100vh - 5rem); padding: var(--sc-space-10) 0 0; padding-bottom: var(--home-session-composer-clearance); background: var(--sc-color-canvas); }
.home-session__container { display: grid; gap: var(--sc-space-8); }
.home-session--focused { padding-top: var(--sc-space-6); }
.home-session--focused .home-session__container { gap: var(--sc-space-5); }
.home-session--focused .home-session__empty { padding: var(--sc-space-6) var(--sc-space-4); border: 0; border-radius: 0; }
.home-session__topbar { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sc-space-6); }
.home-session__topbar .sc-eyebrow { margin-bottom: var(--sc-space-3); }
.home-session__top-actions { display: flex; align-items: center; gap: var(--sc-space-4); }
.home-session__credits { color: var(--sc-color-muted); font-size: .8125rem; font-weight: 700; }
.home-session__feed { display: grid; gap: var(--sc-space-5); max-width: 54rem; margin-inline: auto; width: 100%; }
.home-session__history-pagination { display: grid; justify-items: center; gap: var(--sc-space-2); max-width: 54rem; margin: var(--sc-space-5) auto 0; }
.home-session__history-pagination [hidden] { display: none !important; }
.home-session__history-sentinel { display: inline-flex; width: var(--sc-control-height); height: var(--sc-control-height); align-items: center; justify-content: center; border: 1px solid var(--sc-color-brand-200); border-radius: var(--sc-radius-pill); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-sm); }
.home-session__history-spinner { width: var(--sc-space-4); height: var(--sc-space-4); border: 2px solid var(--sc-color-brand-100); border-top-color: var(--sc-color-brand-600); border-radius: 50%; animation: home-history-spin .8s linear infinite; animation-play-state: paused; }
.home-session__history-sentinel--loading .home-session__history-spinner { animation-play-state: running; border-top-color: var(--sc-color-brand-700); }
@keyframes home-history-spin { to { transform: rotate(1turn); } }
@media (prefers-reduced-motion: reduce) { .home-session__history-spinner { animation: none; } }
.home-session__empty { max-width: 54rem; margin-inline: auto; width: 100%; padding: var(--sc-space-10); border: 1px dashed var(--sc-color-border-strong); border-radius: var(--sc-radius-xl); color: var(--sc-color-muted); text-align: center; }
.home-session__notice { max-width: 54rem; margin-inline: auto; width: 100%; padding: var(--sc-space-3) var(--sc-space-4); border-radius: var(--sc-radius-md); color: var(--sc-color-text); background: var(--sc-color-surface-muted); }
.home-session__notice--success { color: var(--sc-color-success); background: var(--sc-color-success-soft); }
.home-session__notice--warning { color: var(--sc-color-warning); background: var(--sc-color-warning-soft); }
.home-task { display: grid; gap: var(--sc-space-3); padding: var(--sc-space-5); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-xl); background: var(--sc-color-surface); box-shadow: var(--sc-shadow-sm); }
.home-task__content { display: grid; min-width: 0; gap: var(--sc-space-3); }
.home-task__prompt { min-width: 0; margin: 0; color: var(--sc-color-ink); font-size: 1.05rem; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.home-task__meta, .home-task__reference { color: var(--sc-color-muted); font-size: .75rem; }
.home-task__state { display: inline-flex; width: fit-content; align-items: center; padding: .45rem .7rem; border-radius: var(--sc-radius-pill); color: var(--sc-color-brand-800); background: var(--sc-color-brand-50); font-size: .75rem; font-weight: 750; }
.home-task--error .home-task__state { color: var(--sc-color-danger); background: var(--sc-color-danger-soft); }
.home-task__media-track { --home-task-visible-results: 2; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - var(--sc-space-3)) / 2); gap: var(--sc-space-3); overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--sc-color-brand-300) transparent; padding-block-end: var(--sc-space-2); }
.home-task__media-track--count-1 { --home-task-visible-results: 1; grid-auto-columns: min(100%, var(--home-task-media-max-width, 32rem)); overflow-x: hidden; }
.home-task__media-track--count-2 { --home-task-visible-results: 2; grid-auto-columns: calc((100% - var(--sc-space-3)) / 2); }
.home-task__media-item { min-width: 0; display: grid; align-content: start; gap: var(--sc-space-2); scroll-snap-align: start; }
.home-task__media { position: relative; width: 100%; max-width: var(--home-task-media-max-width, 32rem); max-height: min(24rem, 50vh); aspect-ratio: var(--home-task-ratio-width, 9) / var(--home-task-ratio-height, 16); overflow: hidden; border-radius: var(--sc-radius-lg); background: var(--sc-color-surface-muted); }
.home-task__media-button { position: absolute; inset: 0; display: block; width: 100%; height: 100%; padding: 0; overflow: hidden; border: 0; border-radius: inherit; background: transparent; cursor: zoom-in; }
.home-task__media-button[hidden] { display: none; }
.home-task__media-button:focus-visible { outline: 3px solid rgba(244, 84, 35, .32); outline-offset: -3px; }
.home-task__image, .home-task__skeleton { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.home-task__image { object-fit: contain; background: var(--sc-color-surface-muted); }
.home-task__video { display: block; width: 100%; height: 100%; object-fit: contain; background: var(--sc-color-canvas); }
.home-task__image[hidden] { display: none; }
.home-task__skeleton { z-index: 1; background: linear-gradient(90deg, var(--sc-color-surface-muted) 25%, var(--sc-color-surface) 45%, var(--sc-color-surface-muted) 65%); background-size: 220% 100%; animation: home-task-skeleton 1.4s ease-in-out infinite; }
.home-task__state[hidden] { display: none; }
.home-task__media:has(.home-task__skeleton-message) { display: grid; min-height: min-content; max-height: none; }
.home-task__skeleton:has(.home-task__skeleton-message) { position: relative; height: auto; display: flex; align-items: center; justify-content: center; padding: var(--sc-space-4); box-sizing: border-box; }
.home-task__skeleton-message { margin: 0; max-width: 28rem; text-align: center; color: var(--sc-color-text); font-size: var(--sc-font-size-sm); line-height: 1.6; overflow-wrap: anywhere; }
.home-task__skeleton--stopped { animation: none; }
.home-task__media-actions { display: flex; flex-wrap: wrap; gap: var(--sc-space-2); }
.home-task__media-actions .sc-button,
.home-task__media-download { width: auto; min-height: 2.75rem; }
.home-task__media-navigation { display: flex; align-items: center; justify-content: flex-end; gap: var(--sc-space-2); }
.home-task__media-navigation .sc-button { min-width: 2.75rem; min-height: 2.75rem; padding-inline: var(--sc-space-2); }
.home-task__media-position { min-width: 3.5rem; color: var(--sc-color-muted); font-size: .75rem; font-variant-numeric: tabular-nums; text-align: center; }
.home-task__actions { display: flex; flex-wrap: nowrap; align-items: center; gap: var(--sc-space-2); }
.home-task__actions--video { flex-wrap: wrap; }
.home-task__actions .sc-button { width: auto; }
.home-task__action-button { display: inline-flex; width: 3rem !important; min-width: 3rem; height: 3rem; min-height: 3rem; flex: 0 0 3rem; padding: 0; border-radius: var(--sc-radius-md); }
.home-task__action-button svg { width: 1.75rem; height: 1.75rem; flex: 0 0 auto; }
.home-task__action-button--download { border-color: var(--sc-color-brand-600); box-shadow: 0 8px 20px rgba(244, 84, 35, .24); }
.home-task__action-button--download:hover:not(:disabled) { border-color: var(--sc-color-brand-700); box-shadow: 0 10px 24px rgba(244, 84, 35, .3); }
.home-task__action-button--delete { border-color: color-mix(in srgb, var(--sc-color-danger) 32%, var(--sc-color-surface)); color: var(--sc-color-danger); background: var(--sc-color-surface); }
.home-task__action-button--delete:hover:not(:disabled) { border-color: var(--sc-color-danger); color: var(--sc-color-on-danger); background: var(--sc-color-danger); }
.home-task__action-button:focus-visible { outline: 3px solid rgba(244, 84, 35, .3); outline-offset: 3px; }
.home-task__error { margin: 0; color: var(--sc-color-danger); font-size: .8125rem; line-height: 1.5; }
.home-task--chat { border-color: var(--sc-color-brand-200); background: linear-gradient(180deg, var(--sc-color-surface), var(--sc-color-brand-50)); }
.home-task__chat-response { min-height: 3rem; padding: var(--sc-space-4); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-lg); color: var(--sc-color-text); background: var(--sc-color-surface); font-size: .9375rem; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.home-task__chat-response:empty::before { content: ""; display: inline-block; width: .75rem; height: .75rem; border-radius: var(--sc-radius-pill); background: var(--sc-color-brand-600); animation: home-chat-pulse 1s ease-in-out infinite alternate; }
.home-task--succeeded .home-task__chat-response:empty::before, .home-task--error .home-task__chat-response:empty::before { display: none; }
.home-task--chat .home-task__actions { justify-content: flex-start; }
.home-task--audio { min-width: 0; border-color: var(--sc-color-brand-200); background: var(--sc-color-surface); }
.home-task__audio-meta { min-width: 0; overflow-wrap: anywhere; }
.home-task__audio-tracks { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr); gap: var(--sc-space-4); margin: 0; padding: 0; list-style: none; }
.home-task__audio-track { display: grid; min-width: 0; grid-template-columns: var(--sc-space-16) minmax(0, 1fr); gap: var(--sc-space-3); padding: var(--sc-space-4); border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-lg); background: var(--sc-color-surface-muted); }
.home-task__audio-track--placeholder { min-height: 6rem; align-items: center; }
.home-task__audio-placeholder-body { display: grid; min-width: 0; gap: var(--sc-space-2); }
.home-task__audio-placeholder-title { width: min(12rem, 70%); height: .875rem; border-radius: var(--sc-radius-pill); background: linear-gradient(90deg, var(--sc-color-brand-100), var(--sc-color-surface), var(--sc-color-brand-100)); background-size: 220% 100%; animation: home-task-skeleton 1.2s ease-in-out infinite; }
.home-task__audio-placeholder-wave { width: 100%; height: 2rem; border-radius: var(--sc-radius-sm); background: linear-gradient(90deg, var(--sc-color-brand-50), var(--sc-color-surface), var(--sc-color-brand-50)); background-size: 220% 100%; animation: home-task-skeleton 1.2s ease-in-out infinite; }
.home-task__audio-art { width: var(--sc-space-16); height: var(--sc-space-16); overflow: hidden; border: 1px solid var(--sc-color-brand-200); border-radius: var(--sc-radius-md); background: var(--sc-color-brand-50); }
.home-task__audio-cover { display: block; width: 100%; height: 100%; object-fit: cover; }
.home-task__audio-waveform { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; gap: calc(var(--sc-space-1) / 2); color: var(--sc-color-brand-700); }
.home-task__audio-waveform-bar { width: 3px; height: 28%; border-radius: var(--sc-radius-pill); background: currentColor; }
.home-task__audio-waveform-bar:nth-child(2), .home-task__audio-waveform-bar:nth-child(4) { height: 52%; }
.home-task__audio-waveform-bar:nth-child(3) { height: 72%; }
.home-task__audio-body { display: grid; min-width: 0; align-content: start; gap: var(--sc-space-2); }
.home-task__audio-title { min-width: 0; margin: 0; color: var(--sc-color-ink); font-size: .9375rem; line-height: 1.4; overflow-wrap: anywhere; }
.home-task__audio-details { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--sc-space-1) var(--sc-space-2); color: var(--sc-color-muted); font-size: .75rem; line-height: 1.45; }
.home-task__audio-duration { flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.home-task__audio-tags { min-width: 0; overflow-wrap: anywhere; }
.home-task__audio-player { display: block; width: 100%; min-width: 0; max-width: 100%; }
.home-task__audio-track-actions, .home-task__audio-actions { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--sc-space-2); }
.home-task__audio-track-actions .sc-button, .home-task__audio-actions .sc-button { width: auto; min-width: 0; min-height: var(--sc-control-height); }
.home-task--audio :is(button, a, audio):focus-visible { outline: 3px solid var(--sc-color-brand-200); outline-offset: 2px; }
.home-task__audio-error, .home-task__audio-task-error { overflow-wrap: anywhere; }

@media (max-width: 899px) {
  .home-task__audio-tracks { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 900px) {
  .home-task__audio-tracks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-task__media-track--count-3,
  .home-task__media-track--count-4 { --home-task-visible-results: 3; grid-auto-columns: calc((100% - var(--sc-space-3) - var(--sc-space-3)) / 3); }
}

@media (min-width: 1200px) {
  .home-task__media-track--count-4 { --home-task-visible-results: 4; grid-auto-columns: calc((100% - var(--sc-space-3) - var(--sc-space-3) - var(--sc-space-3)) / 4); }
}
.home-session-active .home-hero { position: fixed; z-index: 10; right: 0; bottom: 0; left: 0; min-height: 0; overflow: visible; padding: var(--sc-space-3) 0; border: 0; background: transparent; box-shadow: none; backdrop-filter: none; pointer-events: none; }
.home-session-active .home-hero::before, .home-session-active .home-hero h1 { display: none; }
.home-session-active .home-hero__subtitle { display: none; }
.home-session-active .home-hero__content { display: block; }
.home-session-active .home-chat { width: min(100%, 54rem); margin-inline: auto; border-color: var(--sc-color-border-strong); box-shadow: var(--sc-shadow-lg); pointer-events: auto; }
.home-session-active .home-chat__input { min-height: 3.75rem; max-height: 8.875rem; padding: var(--sc-space-3) var(--sc-space-4); resize: none; }
.home-session-active .home-chat__attachments { min-height: 4rem; margin: var(--sc-space-1) var(--sc-space-2) 0; }
.home-session-active .home-chat__attachment { width: 3rem; height: 4rem; flex-basis: 3rem; }
.home-session-active .home-chat__attach { width: 3rem; height: 4rem; flex-basis: 3rem; font-size: 1.75rem; }
.home-session-active .home-chat__toolbar { margin-bottom: var(--sc-space-2); }
.home-session-active .home-chat__status { display: none; }
.home-session-active .home-session { display: block; }
.home-session-active #homeSession[hidden] { display: block; }
.home-session-active sugarcube-header { transition: transform var(--sc-motion-base) var(--sc-ease); }
.home-session-active sugarcube-header.home-header--hidden { transform: translateY(-100%); }
.home-session-active > sugarcube-footer, .home-session-active .home-tools, .home-session-active .home-gallery, .home-session-active .home-features, .home-session-active .home-faq, .home-session-active .home-final { display: none; }
@media (max-width: 640px) {
  .home-session { --home-session-composer-clearance: 15rem; padding-top: var(--sc-space-6); }
  .home-session__topbar { align-items: flex-start; flex-direction: column; }
  .home-session__top-actions { width: 100%; justify-content: space-between; }
  .home-session__top-actions .sc-button { width: auto; }
  .home-task { padding: var(--sc-space-4); }
  .home-task__actions { gap: var(--sc-space-1); }
  .home-task__actions > .sc-button:not(.home-task__action-button) { min-width: 0; padding-inline: var(--sc-space-2); white-space: nowrap; }
  .home-task__action-button { width: 2.75rem !important; min-width: 2.75rem; height: 2.75rem; min-height: 2.75rem; flex-basis: 2.75rem; }
  .home-task__action-button svg { width: 1.5rem; height: 1.5rem; }
}
@media (max-width: 820px) { .home-workspace__body, .home-gallery__layout, .home-faq__inner { grid-template-columns: 1fr; } .home-workspace__preview { min-height: 230px; } .home-tool-grid { grid-template-columns: 1fr; } .home-tool-card { min-height: auto; } .home-gallery__mosaic { height: 28rem; max-width: 42rem; } .home-feature-grid { grid-template-columns: 1fr; } .home-feature { border-right: 0; border-bottom: 1px solid var(--sc-color-border); } .home-feature:last-child { border-bottom: 0; } }
@media (max-width: 640px) { .home-hero { min-height: 34rem; padding-top: var(--sc-space-12); }.home-hero__content { justify-items: stretch; }.home-chat { column-gap: var(--sc-space-1); padding: var(--sc-space-2); }.home-chat__input { min-height: 3.25rem; max-height: 8.375rem; padding: var(--sc-space-2) var(--sc-space-4); }.home-chat__attachments { min-height: 4rem; margin: var(--sc-space-1) var(--sc-space-2) 0; }.home-chat__toolbar { max-width: none; }.home-chat__send { min-width: 2.75rem; }.home-workspace__tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; } .home-workspace__tab { min-width: 0; padding-inline: var(--sc-space-3); text-align: center; white-space: normal; } .home-workspace__tab:last-child { grid-column: 1 / -1; } .home-workspace__foot { display: grid; } .home-workspace__foot a { justify-self: start; } .home-workspace__controls { align-items: stretch; } .home-generate { width: 100%; margin-left: 0; } .home-gallery__mosaic { height: 24rem; grid-template-columns: 1.1fr .9fr; grid-template-rows: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 640px) {
  .home-chat__toolbar {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, max-content);
    right: auto;
    bottom: auto;
    left: auto;
    margin: var(--sc-space-1) 0 var(--sc-space-1) var(--sc-space-1);
    max-width: none;
    gap: var(--sc-space-1);
    overflow: visible;
    padding: 0;
  }
  .home-chat__chip { display: none; }
  .home-chat__mode-control {
    display: block;
    width: max-content;
  }
  [data-app-mode-control] {
    display: inline-flex;
    min-height: 2.75rem;
  }
  .home-chat__menu-control {
    width: max-content;
    min-width: 0;
  }
  .home-chat__mode-control,
  .home-chat__specification-control { width: max-content; }
  .home-chat__menu-button {
    max-width: none;
    gap: var(--sc-space-1);
    padding-inline: var(--sc-space-2);
    font-size: .6875rem;
  }
  #homeChatModelControl .home-chat__menu-button { width: auto; min-width: 0; }
  .home-chat__menu {
    z-index: 20;
    min-width: min(16rem, calc(100vw - 4rem));
    max-height: min(18rem, calc(100dvh - 7rem));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .home-chat__menu-control:not(:first-of-type) .home-chat__menu {
    right: 0;
    left: auto;
  }
  .home-chat__specification-button { min-width: 0; }
  .home-chat__specification-popover {
    right: 0;
    left: 0;
    width: auto;
    max-height: min(62dvh, 28rem);
    gap: var(--sc-space-3);
    padding: var(--sc-space-3);
  }
  .home-chat__specification-options--ratios { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .home-chat__specification-option--ratio { min-height: 4.5rem; }
  .home-chat__send {
    position: relative;
    display: block;
    width: 3.25rem;
    min-width: 3.25rem;
    height: 2.75rem;
    min-height: 2.75rem;
    padding: 0;
    line-height: 1;
    font-size: 0;
  }
  .home-chat__submit {
    position: static;
    max-width: none;
    justify-content: flex-end;
    gap: var(--sc-space-1);
    margin: var(--sc-space-1) var(--sc-space-1) var(--sc-space-1) 0;
  }
  .home-chat__submit-summary {
    width: auto;
    max-width: none;
    flex: none;
    font-size: .625rem;
  }
  .home-chat__send::before {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    content: "↑";
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1;
  }
  .home-session-active .home-chat__input {
    min-height: 3.25rem;
    max-height: 8.375rem;
    padding: var(--sc-space-2) var(--sc-space-4);
  }
  .home-session-active .home-chat__attachments {
    min-height: 0;
    margin: var(--sc-space-1) var(--sc-space-2) 0;
    padding: 0 var(--sc-space-2);
  }
  .home-session-active .home-chat__toolbar {
    right: auto;
    left: auto;
    margin-bottom: var(--sc-space-1);
  }
}

@media (max-width: 400px) {
  .home-hero__content.sc-container {
    width: min(var(--sc-container), calc(100% - var(--sc-space-4)));
  }
  .home-chat {
    column-gap: 0;
  }
  .home-chat__toolbar,
  .home-chat__submit {
    margin-inline: 0;
  }
}

@media (max-width: 375px) {
  .home-chat {
    column-gap: calc(var(--sc-space-1) / 2);
    padding-inline: var(--sc-space-1);
  }
  .home-chat__toolbar {
    grid-template-columns: var(--sc-space-12) max-content var(--sc-space-10);
    gap: calc(var(--sc-space-1) / 2);
    margin-inline: 0;
  }
  .home-chat__mode-control,
  .home-chat__mode-control .home-chat__menu-button {
    width: var(--sc-space-12);
  }
  .home-chat__specification-control,
  .home-chat__specification-button {
    width: var(--sc-space-10);
  }
  .home-chat__mode-control .home-chat__menu-button,
  .home-chat__specification-button {
    justify-content: center;
  }
  #homeChatModeLabel,
  #homeChatSpecificationLabel {
    display: block;
    width: 100%;
    line-height: 1;
    text-align: center;
    white-space: normal;
  }
  .home-chat__submit {
    gap: calc(var(--sc-space-1) / 2);
    margin-inline: 0;
  }
}

@media (max-width: 320px) {
  .home-hero__content.sc-container {
    width: min(var(--sc-container), calc(100% - var(--sc-space-2)));
  }
  .home-chat {
    column-gap: 0;
  }
  .home-chat__toolbar {
    gap: calc(var(--sc-space-1) / 4);
  }
  .home-chat__submit {
    gap: calc(var(--sc-space-1) / 4);
  }
}

@media (max-width: 640px) {
  #homeChatModelMenu.home-chat__menu--sheet,
  #homeChatModeMenu.home-chat__mode-menu {
    position: fixed;
    z-index: 1200;
    right: var(--sc-space-3);
    bottom: max(var(--sc-space-3), env(safe-area-inset-bottom));
    left: var(--sc-space-3);
    width: auto;
    min-width: 0;
    max-width: none;
    max-height: min(70dvh, 28rem);
    padding: var(--sc-space-2);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--sc-space-1);
    border: 1px solid var(--sc-color-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-color-surface);
    box-shadow: var(--sc-shadow-lg);
  }
  #homeChatModelMenu.home-chat__menu--sheet { grid-template-columns: 1fr; }
  #homeChatModeMenu.home-chat__mode-menu { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-chat__menu--sheet .home-chat__menu-item {
    min-height: 4.25rem;
    justify-content: center;
    padding: var(--sc-space-2);
    text-align: center;
  }
}

.app-mobile-tabs { display: none; }
.home-chat__mobile-field { display: contents; }
.home-chat__mobile-mode,
.home-chat__mobile-model-mount,
.home-chat__mobile-field-heading,
.home-chat__mobile-field-label,
.home-chat__mobile-prompt-count,
.app-mobile-history-state,
.app-mobile-only { display: none; }

@media (max-width: 767px) {
  .sc-app[data-app-mobile-panel="create"] {
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
  }
  .sc-app[data-app-mobile-panel="create"] > main {
    display: grid;
    height: calc(100dvh - var(--sc-header-height, 57px));
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
  }
  .home-task__media-track:not(.home-task__media-track--count-1) { grid-auto-columns: min(86%, 20rem); scroll-padding-inline: var(--sc-space-2); }
  .home-task__media-navigation { justify-content: center; }
  .sc-app .app-mobile-tabs {
    position: sticky;
    z-index: 900;
    top: calc(var(--sc-header-height, 57px) - 1px);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sc-space-1);
    padding: var(--sc-space-2) var(--sc-space-3);
    border-bottom: 1px solid var(--sc-color-border);
    background: color-mix(in srgb, var(--sc-color-canvas) 92%, transparent);
    backdrop-filter: blur(14px);
  }
  .sc-app[data-app-mobile-panel="create"] .app-mobile-tabs {
    position: static;
  }
  .sc-app .app-mobile-tabs__button {
    min-height: 2.75rem;
    padding: 0 var(--sc-space-3);
    border: 1px solid transparent;
    border-radius: var(--sc-radius-md);
    color: var(--sc-color-muted);
    background: transparent;
    font: 750 .875rem/1 var(--sc-font-sans);
    cursor: pointer;
  }
  .sc-app .app-mobile-tabs__button[aria-selected="true"] {
    color: var(--sc-color-brand-800);
    border-color: var(--sc-color-brand-200);
    background: var(--sc-color-surface);
    box-shadow: var(--sc-shadow-sm);
  }
  .sc-app .app-mobile-tabs__button:focus-visible,
  .home-chat--responsive .home-chat__mobile-mode-button:focus-visible {
    outline: 3px solid var(--sc-color-brand-200);
    outline-offset: 2px;
  }
  .sc-app[data-app-mobile-panel="history"] .home-hero,
  .sc-app[data-app-mobile-panel="create"] .home-session { display: none !important; }
  .sc-app .home-hero,
  .sc-app.home-session-active .home-hero {
    position: relative;
    z-index: auto;
    inset: auto;
    display: block;
    min-height: calc(100dvh - 7.5rem);
    overflow: visible;
    padding: var(--sc-space-4) 0 calc(var(--sc-space-8) + env(safe-area-inset-bottom));
    background: var(--sc-color-canvas);
    pointer-events: auto;
  }
  .sc-app[data-app-mobile-panel="create"] .home-hero,
  .sc-app[data-app-mobile-panel="create"].home-session-active .home-hero {
    height: 100%;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 0;
  }
  .sc-app .home-hero::before,
  .sc-app.home-session-active .home-hero::before { display: none; }
  .sc-app .home-hero__content,
  .sc-app.home-session-active .home-hero__content {
    display: block;
    width: 100%;
    padding-inline: var(--sc-space-3);
  }
  .sc-app[data-app-mobile-panel="create"] .home-hero__content,
  .sc-app[data-app-mobile-panel="create"].home-session-active .home-hero__content {
    height: 100%;
    min-height: 0;
  }
  .home-chat--responsive {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: none;
    grid-auto-rows: max-content;
    max-height: min(44rem, calc(100dvh - 12rem));
    gap: var(--sc-space-5);
    margin: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: var(--sc-space-4) var(--sc-space-4) 0;
    border-color: var(--sc-color-border);
    border-radius: var(--sc-radius-xl);
    background: var(--sc-color-surface);
    box-shadow: var(--sc-shadow-sm);
    scrollbar-gutter: stable;
    scroll-padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
    scrollbar-width: thin;
    scrollbar-color: var(--sc-color-border-strong) transparent;
  }
  .home-chat--responsive::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
  .home-chat--responsive::-webkit-scrollbar-track {
    background: transparent;
  }
  .home-chat--responsive::-webkit-scrollbar-thumb {
    background-color: var(--sc-color-border-strong);
    border-radius: var(--sc-radius-pill);
  }
  .home-chat--responsive::-webkit-scrollbar-thumb:hover {
    background-color: var(--sc-color-subtle);
  }
  .home-chat--responsive .home-chat__attachments,
  .home-chat--responsive .home-chat__reference-privacy,
  .home-chat--responsive .home-chat__input,
  .home-chat--responsive .home-chat__toolbar,
  .home-chat--responsive .home-chat__status,
  .home-chat--responsive .home-chat__submit { grid-area: auto; }
  .sc-app .home-chat--responsive { max-height: calc(100dvh - 10.75rem - env(safe-area-inset-bottom)); }
  .sc-app[data-app-mobile-panel="create"] .home-chat--responsive {
    height: 100%;
    min-height: 0;
    max-height: none;
    border: 0;
    border-radius: 0;
    padding-inline: 0;
    background: transparent;
    box-shadow: none;
    scrollbar-gutter: auto;
  }
  .sc-app[data-app-mobile-panel="create"] .home-chat--responsive .home-chat__submit {
    margin-inline: 0;
    padding-inline: var(--sc-space-2);
  }
  .home-chat--responsive .home-chat__mobile-mode {
    display: grid;
    position: relative;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }
  .home-chat--responsive .home-chat__mobile-model-mount { display: contents; }
  .home-chat--responsive .home-chat__mobile-mode legend {
    display: block;
    width: 100%;
    margin: 0 0 var(--sc-space-2) 0;
    padding: 0;
    color: var(--sc-color-ink);
    font: 800 .8125rem/1.35 var(--sc-font-sans);
  }
  .home-chat--responsive .home-chat__mobile-field-heading,
  .home-chat--responsive #homeChatModelControl > .home-chat__mobile-field-label {
    display: block;
    width: 100%;
    margin: 0 0 var(--sc-space-2) 0;
    padding: 0;
    color: var(--sc-color-ink);
    font: 800 .8125rem/1.35 var(--sc-font-sans);
  }
  .home-chat--responsive .home-chat__mobile-mode-trigger {
    display: flex;
    width: 100%;
    min-height: 3.75rem;
    align-items: center;
    justify-content: space-between;
    gap: var(--sc-space-2);
    padding: var(--sc-space-3) var(--sc-space-4);
    border: 1px solid var(--sc-color-border);
    border-radius: var(--sc-radius-lg);
    color: var(--sc-color-ink);
    background: var(--sc-color-surface-muted);
    font: 750 .875rem/1.2 var(--sc-font-sans);
    text-align: left;
    cursor: pointer;
  }
  .home-chat--responsive .home-chat__mobile-mode-trigger::after {
    content: "⌄";
    color: var(--sc-color-muted);
    font-size: 1rem;
    transition: transform var(--sc-motion-base) var(--sc-ease);
  }
  .home-chat--responsive .home-chat__mobile-mode-trigger[aria-expanded="true"]::after {
    transform: rotate(180deg);
  }
  .home-chat--responsive .home-chat__mobile-mode-trigger:focus-visible {
    outline: 3px solid var(--sc-color-brand-200);
    outline-offset: 2px;
  }
  .home-chat--responsive .home-chat__mobile-mode-options {
    position: fixed;
    z-index: 1200;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    width: 100%;
    max-height: min(70dvh, 32rem);
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sc-space-1);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: var(--sc-space-4) var(--sc-space-3) max(var(--sc-space-4), env(safe-area-inset-bottom));
    border: 1px solid var(--sc-color-border);
    border-radius: var(--sc-radius-xl) var(--sc-radius-xl) 0 0;
    background: var(--sc-color-surface);
    box-shadow: var(--sc-shadow-lg);
    animation: home-chat-mobile-sheet-in var(--sc-motion-base) var(--sc-ease);
  }
  .home-chat__mode-overlay {
    position: fixed;
    z-index: 1200;
    inset: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    padding: 0;
    border: 0;
    color: inherit;
    background: color-mix(in srgb, var(--sc-color-canvas) 62%, transparent);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    overscroll-behavior: contain;
    touch-action: none;
  }
  .home-chat__mode-overlay::backdrop { background: transparent; pointer-events: auto; }
  body.home-chat-mode-open { overflow: hidden; }
  .home-chat__mode-overlay .home-chat__mobile-mode-options { margin: 0; top: auto; touch-action: pan-y; }
  @keyframes home-chat-mobile-sheet-in {
    from { transform: translateY(1rem); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
  }
  .home-chat--responsive .home-chat__mobile-mode-button {
    display: flex;
    min-width: 0;
    min-height: 3.5rem;
    align-items: center;
    justify-content: flex-start;
    gap: var(--sc-space-3);
    padding: var(--sc-space-3) var(--sc-space-4);
    border: 1px solid var(--sc-color-border);
    border-radius: var(--sc-radius-md);
    color: var(--sc-color-muted);
    background: var(--sc-color-surface);
    font: 750 .875rem/1.2 var(--sc-font-sans);
    text-align: left;
    cursor: pointer;
  }
  .home-chat--responsive .home-chat__mobile-mode-button[aria-checked="true"] {
    color: var(--sc-color-brand-800);
    border-color: var(--sc-color-brand-500);
    background: var(--sc-color-brand-50);
    box-shadow: inset 0 0 0 1px var(--sc-color-brand-200);
  }
  .home-chat--responsive .home-chat__mobile-mode-button:disabled {
    color: var(--sc-color-subtle);
    background: var(--sc-color-surface-muted);
    cursor: not-allowed;
    opacity: 1;
  }
  .home-chat--responsive .home-chat__mobile-mode-button small {
    color: inherit;
    font-size: .625rem;
    font-weight: 650;
  }

  .home-chat--responsive .home-chat__mobile-field { display: grid; gap: var(--sc-space-2); min-width: 0; }
  .home-chat--responsive .home-chat__mobile-field--references { gap: var(--sc-space-1); }
  .home-chat--responsive .home-chat__reference-privacy { margin: 0 var(--sc-space-2); }
  .home-chat--responsive .home-chat__mobile-field-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sc-space-2);
  }
  .home-chat--responsive .home-chat__mobile-field--prompt { grid-area: auto; gap: var(--sc-space-2); }
  .home-chat--responsive .home-chat__mobile-field--prompt .home-chat__mobile-field-heading { margin: 0; }
  .home-chat--responsive .home-chat__prompt-actions { margin-left: auto; }
  .home-chat--responsive .home-chat__prompt-enhancement-hint { margin: 0; text-align: left; }
  .home-chat--responsive .home-chat__mobile-field-heading small {
    color: var(--sc-color-muted);
    font-size: .75rem;
    font-weight: 650;
  }
  .home-chat--responsive .home-chat__mobile-field-label.sc-sr-only {
    position: static !important;
    display: inline !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: normal !important;
  }
  .home-chat--responsive .home-chat__mobile-field-label.sc-sr-only[hidden],
  .home-chat--responsive .home-chat__mobile-prompt-count[hidden] {
    display: none !important;
  }
  .home-chat--responsive .home-chat__attachments {
    min-height: 5.5rem;
    margin: 0;
    padding: var(--sc-space-3);
    border: 1px dashed var(--sc-color-brand-200);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-color-brand-50);
  }
  .home-chat--responsive .home-chat__attachment,
  .home-chat--responsive .home-chat__attach {
    width: 4rem;
    height: 4rem;
    flex-basis: 4rem;
  }
  .home-chat--responsive .home-chat__attach { background: var(--sc-color-surface); }
  .home-chat--responsive .home-chat__input {
    width: 100%;
    min-height: 9rem;
    max-height: 14rem;
    margin: 0;
    padding: var(--sc-space-4);
    resize: vertical;
    overflow-y: auto;
    border: 1px solid var(--sc-color-border) !important;
    border-radius: var(--sc-radius-lg);
    background: var(--sc-color-surface-muted) !important;
  }
  .home-chat--responsive .home-chat__input:focus,
  .home-chat--responsive .home-chat__input:focus-visible {
    border-color: var(--sc-color-border) !important;
    outline: none !important;
    box-shadow: none !important;
  }
  .home-chat--responsive .home-chat__audio-custom-fields { grid-template-columns: minmax(0, 1fr); }
  .home-chat--responsive .home-chat__audio-custom-fields .home-chat__input { min-height: 3.25rem; }
  .home-chat--responsive .home-chat__audio-custom-fields #homeChatAudioLyrics { min-height: 12rem; }
  .home-chat--responsive .home-chat__mobile-prompt-count {
    display: block;
    color: var(--sc-color-muted);
    font-size: .75rem;
    font-variant-numeric: tabular-nums;
    text-align: right;
  }
  .home-chat--responsive .home-chat__toolbar {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sc-space-5);
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
  }
  .home-chat--responsive .home-chat__toolbar:has(#homeChatModelMenu:not([hidden])) {
    z-index: 13;
  }
  .home-chat--responsive .home-chat__mode-control,
  .home-chat--responsive .home-chat__specification-control { display: none; }
  .home-chat--responsive #homeChatModelControl {
    position: relative;
    display: grid;
    width: 100%;
    gap: var(--sc-space-2);
  }
  .home-chat--responsive #homeChatModelControl > .home-chat__mobile-field-label { display: block; }
  .home-chat--responsive #homeChatModelControl .home-chat__menu-button {
    width: 100%;
    min-height: 3.75rem;
    justify-content: space-between;
    padding-inline: var(--sc-space-4);
    color: var(--sc-color-ink);
    border-color: var(--sc-color-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-color-surface-muted);
    box-shadow: none;
    font-size: .875rem;
  }
  .home-chat--responsive #homeChatModelControl .home-chat__menu-button::after {
    content: "⌄";
    color: var(--sc-color-muted);
    font-size: 1rem;
  }
  .home-chat--responsive #homeChatModelMenu.home-chat__menu--sheet {
    position: fixed;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    min-width: 0;
    max-height: min(70dvh, 32rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 1200;
    grid-template-columns: 1fr;
    padding: var(--sc-space-4) var(--sc-space-3) max(var(--sc-space-4), env(safe-area-inset-bottom));
    border: 1px solid var(--sc-color-border-strong);
    border-radius: var(--sc-radius-xl) var(--sc-radius-xl) 0 0;
    background: var(--sc-color-popover);
    box-shadow: var(--sc-shadow-popover);
  }
  .home-chat--responsive #homeChatModelControl:has(#homeChatModelMenu:not([hidden]))::before {
    content: "";
    position: fixed;
    z-index: 1199;
    inset: 0;
    background: var(--sc-color-overlay);
  }
  @media (prefers-reduced-motion: reduce) {
    .home-chat--responsive .home-chat__mobile-mode-trigger::after { transition: none; }
    .home-chat--responsive .home-chat__mobile-mode-options { animation: none; }
  }
  .home-chat--responsive .home-chat__specification-popover {
    position: static;
    display: grid;
    width: 100%;
    max-height: none;
    gap: var(--sc-space-5);
    overflow: visible;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    animation: none;
  }
  .home-chat--responsive[data-mode="video"] .home-chat__specification-popover { grid-template-columns: minmax(0, 1fr); }
  .home-chat--responsive[data-mode="video"] .home-chat__specification-section { grid-column: 1; }
  .home-chat--responsive .home-chat__specification-section { gap: var(--sc-space-3); }
  .home-chat--responsive .home-chat__specification-section + .home-chat__specification-section {
    padding-top: var(--sc-space-5);
  }
  .home-chat--responsive .home-chat__specification-section h2 {
    font-size: .8125rem;
    text-transform: none;
  }
  .home-chat--responsive .home-chat__specification-options--ratios {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--sc-space-2);
    width: 100%;
  }
  @media (min-width: 440px) {
    .home-chat--responsive .home-chat__specification-options--ratios {
      grid-template-columns: repeat(7, minmax(0, 1fr));
      gap: 4px;
    }
    .home-chat--responsive .home-chat__specification-option--ratio {
      min-height: 3.75rem;
      padding: var(--sc-space-1);
    }
  }
  .home-chat--responsive .home-chat__specification-options--qualities {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sc-space-2);
    width: 100%;
  }
  .home-chat--responsive .home-chat__specification-options--counts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--sc-space-2);
    width: 100%;
  }
  .home-chat--responsive .home-chat__specification-option,
  .home-chat--responsive .home-chat__specification-option--ratio {
    min-height: 4rem;
    padding: var(--sc-space-2);
  }
  .home-chat--responsive .home-chat__submit {
    position: sticky;
    z-index: 12;
    right: auto;
    bottom: 0;
    display: flex;
    max-width: none;
    align-items: center;
    justify-content: flex-end;
    gap: var(--sc-space-2);
    margin: 0 calc(-1 * var(--sc-space-4));
    padding: var(--sc-space-3) var(--sc-space-4) calc(var(--sc-space-3) + env(safe-area-inset-bottom));
    border: 0;
    border-radius: 0;
    background: inherit;
    box-shadow: none;
    backdrop-filter: none;
  }
  .home-chat--responsive .home-chat__submit-summary {
    flex: 1 1 0;
    min-width: 0;
    min-height: 2.75rem;
    justify-content: flex-start;
    padding: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.4;
    text-align: left;
    border: 0;
    border-radius: 0;
    color: var(--sc-color-muted);
    background: transparent;
    font-size: .75rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
  }
  .home-chat--responsive .home-chat__send {
    position: relative;
    right: auto;
    bottom: auto;
    left: auto;
    display: inline-flex;
    width: auto;
    min-width: 7rem;
    min-height: 3.25rem;
    align-items: center;
    justify-content: center;
    padding: 0 var(--sc-space-5);
    font-size: .9375rem;
  }
  .home-chat--responsive .home-chat__send::before { display: none; }
  .sc-app.home-session-active .home-chat__status:not([hidden]) {
    display: block;
    margin: 0;
  }
  .sc-app[data-app-mobile-panel="history"] .home-session,
  .sc-app[data-app-mobile-panel="history"].home-session-active #homeSession[hidden] {
    display: block;
    min-height: calc(100dvh - 7.5rem);
    padding: var(--sc-space-4) 0 calc(var(--sc-space-8) + env(safe-area-inset-bottom));
    background: var(--sc-color-canvas);
  }
  .sc-app .home-session__container {
    width: 100%;
    gap: var(--sc-space-4);
    padding-inline: var(--sc-space-3);
  }
  .sc-app .home-session__topbar { display: none; }
  .sc-app .home-session__feed { gap: var(--sc-space-4); }
  .sc-app .home-task {
    gap: var(--sc-space-3);
    padding: var(--sc-space-4);
    border-radius: var(--sc-radius-lg);
  }
  .sc-app .home-task__prompt { font-size: .9375rem; }
  .sc-app .home-task__audio-track { grid-template-columns: 3.25rem minmax(0, 1fr); padding: var(--sc-space-3); }
  .sc-app .home-task__audio-art { width: 3.25rem; height: 3.25rem; }
  .sc-app .home-task__audio-track-actions .sc-button { min-height: var(--sc-control-height); flex: 1 1 7rem; }
  .sc-app .home-task__media { width: min(100%, 17.5rem); max-width: 100%; margin-inline: auto; }
  .sc-app .home-task__actions { flex-wrap: wrap; gap: var(--sc-space-2); }
  .sc-app .home-task__actions > .sc-button:not(.home-task__action-button) {
    min-width: 0;
    flex: 1 1 auto;
    padding-inline: var(--sc-space-3);
  }
  .sc-app .app-mobile-history-state {
    display: grid;
    justify-items: start;
    gap: var(--sc-space-4);
    padding: var(--sc-space-6) var(--sc-space-4);
    border: 1px solid var(--sc-color-border);
    border-radius: var(--sc-radius-lg);
    color: var(--sc-color-muted);
    background: var(--sc-color-surface);
  }
  .sc-app .app-mobile-history-state[hidden] { display: none; }
  .sc-app .app-mobile-history-state p { margin: 0; line-height: 1.65; }
  .sc-app .app-mobile-history-state .sc-button { width: auto; }
  .sc-app .home-session__empty {
    display: grid;
    justify-items: center;
    gap: var(--sc-space-4);
    padding: var(--sc-space-8) var(--sc-space-4);
    border: 1px solid var(--sc-color-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-color-surface);
  }
  .sc-app .app-desktop-only { display: none; }
  .sc-app p.app-mobile-only { display: block !important; margin: 0; }
  .sc-app button.app-mobile-only { display: inline-flex !important; width: auto; }
  .sc-app .home-session__feed[hidden],
  .sc-app .home-session__empty[hidden] { display: none !important; }
}

@keyframes home-chat-pulse { to { opacity: .45; transform: scale(.8); } }
@keyframes home-task-skeleton { to { background-position: -220% 0; } }
@keyframes home-chat-specification-in { from { opacity: 0; transform: translateY(var(--sc-space-2)); } to { opacity: 1; transform: translateY(0); } }

@media (prefers-reduced-motion: reduce) {
  .home-chat, .home-chat__attach, .home-chat__menu-button, .home-chat__prompt-action, .home-session-active sugarcube-header, .home-task__audio, .home-task__audio-track, .home-task__audio-waveform { transition: none; scroll-behavior: auto; }
  .home-chat__model-group-toggle::after { transition: none; }
  .home-chat__attachment--processing .home-chat__attachment-status, .home-task__skeleton, .home-task__audio-track--placeholder, .home-task__audio-placeholder-title, .home-task__audio-placeholder-wave, .home-chat__specification-popover { animation: none; }
}

/* Model and settings remain together in reading and tab order at every width. */
.home-chat--responsive .home-chat__toolbar.sc-parameter-row {
  display: flex; flex-wrap: nowrap; align-items: center; gap: var(--sc-space-2);
  width: auto; max-width: 100%; min-width: 0; justify-self: stretch;
  overflow-x: auto; overflow-y: hidden; padding: var(--sc-space-1);
}
.home-chat--responsive .home-chat__toolbar #homeChatModelControl {
  display: flex; width: auto; flex: 0 0 auto; min-width: 0;
}
.home-chat--responsive #homeChatModelControl > .home-chat__mobile-field-label { display: none; }
.home-chat--responsive #homeChatModelControl .home-chat__menu-button {
  width: auto; min-height: var(--sc-control-height); padding-inline: var(--sc-space-3);
  border-radius: var(--sc-radius-md); font-size: .8125rem; white-space: nowrap;
}
.home-chat--responsive .home-chat__specification-control:not([hidden]) { display: flex; }
.home-chat--responsive [data-parameter-popover]:not([hidden]) {
  position: fixed; z-index: 1200; left: var(--parameter-popover-left, var(--sc-space-2));
  top: var(--parameter-popover-top, var(--sc-space-2)); right: auto; bottom: auto;
  width: min(20rem, calc(100vw - var(--sc-space-4))); max-height: var(--parameter-popover-height, 65dvh); box-sizing: border-box;
  overflow-y: auto; margin: 0; padding: var(--sc-space-3); animation: none;
  border: 1px solid var(--sc-color-border-strong); border-radius: var(--sc-radius-lg);
  background: var(--sc-color-popover); box-shadow: var(--sc-shadow-popover);
}
.home-chat--responsive [data-parameter-popover][data-parameter-direction="up"]:not([hidden]) { transform: translateY(-100%); }
@media (max-width: 767px) {
  .home-chat--responsive .home-chat__toolbar.sc-parameter-row { width: 100%; margin: 0; gap: var(--sc-space-2); }
  .home-chat--responsive .home-chat__specification-control { flex: 0 0 auto; width: max-content; }
  .home-chat--responsive .home-chat__specification-button { width: auto; min-width: 6.75rem; white-space: nowrap; }
  .home-chat--responsive #homeChatSpecificationLabel { width: auto; white-space: nowrap; }
  .home-chat--responsive [data-parameter-popover]:not([hidden]) {
    top: auto; left: 0; right: 0; bottom: 0; width: 100%; max-height: 75dvh;
    transform: none !important;
    padding: var(--sc-space-5) var(--sc-space-4) max(var(--sc-space-5), env(safe-area-inset-bottom));
    border-radius: var(--sc-radius-xl) var(--sc-radius-xl) 0 0;
  }
  .home-chat--responsive:has([data-parameter-popover]:not([hidden]))::after {
    content: ''; position: fixed; inset: 0; z-index: 1199; background: var(--sc-color-overlay);
  }
  body:has(.home-chat--responsive [data-parameter-popover]:not([hidden])) { overflow: hidden; }
}
@media (max-width: 359px) {
  .home-chat--responsive .home-chat__toolbar.sc-parameter-row { flex-wrap: wrap; }
  .home-chat--responsive .home-chat__toolbar #homeChatModelControl { flex: 1 1 100%; }
  .home-chat--responsive #homeChatModelControl .home-chat__menu-button { width: 100%; }
}

/* Keep music settings together instead of flattening them into the composer grid. */
.home-chat[data-mode="audio"] .home-chat__audio-options {
  display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr);
  gap: var(--sc-space-4); padding: var(--sc-space-4); margin: 0;
}
.home-chat[data-mode="audio"] .home-chat__audio-mode {
  padding: var(--sc-space-2) var(--sc-space-3); border-radius: var(--sc-radius-md);
}
.home-chat[data-mode="audio"] .home-chat__switch-row { min-width: 0; margin: 0; }
.home-chat[data-mode="audio"] #homeChatAudioOutputDisclosure {
  margin: 0; color: var(--sc-color-muted); font-size: .75rem; line-height: 1.5;
}
.home-chat[data-mode="audio"] .home-chat__mobile-field--prompt .home-chat__mobile-field-heading {
  justify-content: flex-start; margin-inline: var(--sc-space-4);
}
.home-chat[data-mode="audio"] .home-chat__audio-simple-description { font-weight: 600; }
@media (min-width: 641px) {
  .home-chat[data-mode="audio"] {
    grid-template-areas: "audio audio" "prompt prompt" "options submit" "status status";
  }
  .home-chat[data-mode="audio"] .home-chat__audio-options { grid-area: audio; }
}
@media (max-width: 640px) {
  .home-chat[data-mode="audio"] .home-chat__audio-options { grid-area: auto; padding: 0; }
  .home-chat[data-mode="audio"] .home-chat__mobile-field--prompt .home-chat__mobile-field-heading { margin-inline: 0; }
}

/* An incoming image only interrupts when Studio already has inputs. */
.studio-draft-dialog { margin: auto; width: min(28rem, calc(100% - var(--sc-space-8))); padding: var(--sc-space-6); background: var(--sc-color-surface); color: var(--sc-color-text); border: 1px solid var(--sc-color-border-strong); border-radius: var(--sc-radius-lg); box-shadow: var(--sc-shadow-popover); }
.studio-draft-dialog::backdrop { background: var(--sc-color-overlay); }
.studio-draft-dialog h2 { margin: 0 0 var(--sc-space-3); font-size: var(--sc-font-size-xl); }
.studio-draft-dialog p { margin: 0 0 var(--sc-space-5); color: var(--sc-color-muted); }
.studio-draft-actions { display: flex; flex-wrap: wrap; gap: var(--sc-space-3); }
.studio-draft-actions button { flex: 1 1 10rem; white-space: normal; }
.studio-draft-backup { margin-top: var(--sc-space-3); }

/* The assistant is an opt-in view. Create keeps its established composer and
   task-feed layout; only the Agent view becomes a full-height conversation. */
.sc-app.sc-agent-workspace .studio-view-tabs {
  position: sticky;
  inset: auto;
  top: calc(var(--sc-header-height, 57px) + var(--sc-space-2));
  z-index: 900;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  width: min(calc(100% - var(--sc-space-6)), 36rem);
  gap: var(--sc-space-1);
  margin: var(--sc-space-4) auto var(--sc-space-2);
  padding: var(--sc-space-1);
  border: 1px solid var(--sc-color-border);
  border-radius: var(--sc-radius-pill);
  background: var(--sc-color-surface);
}
.sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button {
  min-width: 0;
  min-height: var(--sc-control-height);
  padding: var(--sc-space-2) var(--sc-space-3);
  border: 1px solid transparent;
  border-radius: var(--sc-radius-pill);
  color: var(--sc-color-muted);
  background: transparent;
  font: 650 var(--sc-font-size-sm)/1.3 var(--sc-font-sans);
  white-space: normal;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button:hover { color: var(--sc-color-ink); background: var(--sc-color-control-hover); }
.sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button[aria-selected="true"] {
  color: var(--sc-color-on-brand);
  border-color: var(--sc-color-brand-600);
  background: var(--sc-color-brand-600);
  box-shadow: var(--sc-shadow-control);
}
.sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button:focus-visible { outline: 2px solid var(--sc-color-focus); outline-offset: 2px; }
.sc-app.sc-agent-workspace[data-studio-view="agent"] { height: 100dvh; min-height: 0; overflow: hidden; }
.sc-app.sc-agent-workspace[data-studio-view="agent"] > main {
  display: grid;
  width: 100%;
  height: calc(100dvh - var(--sc-header-height, 57px));
  min-height: 0;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}
.sc-app.sc-agent-workspace[data-studio-view="agent"] sugarcube-footer { display: none; }
.sc-app.sc-agent-workspace[data-studio-view="agent"] .studio-view-tabs { position: relative; top: auto; }
.sc-agent-workspace[data-studio-view="agent"] .home-hero,
.sc-agent-workspace[data-studio-view="agent"].home-session-active .home-hero {
  position: relative;
  inset: auto;
  z-index: auto;
  display: block;
  height: 100%;
  min-height: 0;
  max-height: none;
  padding: 0 0 var(--sc-space-2);
  overflow: hidden;
  pointer-events: auto;
  background: var(--sc-color-canvas);
}
.sc-agent-workspace[data-studio-view="agent"] .home-hero__content,
.sc-agent-workspace[data-studio-view="agent"].home-session-active .home-hero__content {
  display: block;
  width: min(100%, 56rem);
  height: 100%;
  min-height: 0;
  padding-inline: var(--sc-space-4);
  margin-inline: auto;
  overflow: hidden;
}
.sc-agent-workspace[data-studio-view="agent"] .home-hero::before { display: none; }
.sc-agent-workspace .creative-agent__toggle { display: none; }
.sc-agent-workspace[data-studio-view="agent"] sugarcube-creative-agent { height: 100%; margin-block: 0; }
.sc-agent-workspace[data-studio-view="agent"] .creative-agent__body {
  height: 100%;
  min-height: 0;
  padding-block: 0 max(var(--sc-space-2), env(safe-area-inset-bottom, 0px));
}
.sc-agent-workspace[data-studio-view="agent"] .creative-agent__toolbar-actions > [data-i18n="creativeAgent.manualControls"] { display: none; }
.sc-agent-workspace[data-studio-view="agent"] #homeChatForm,
.sc-agent-workspace[data-studio-view="agent"] #homeSession,
.sc-agent-workspace[data-studio-view="create"] sugarcube-creative-agent,
.sc-agent-workspace[data-studio-view="history"] .home-hero { display: none !important; }
.sc-agent-workspace[data-studio-view="history"] .home-session {
  display: block;
  min-width: 0;
  min-height: 0;
  padding: var(--sc-space-5) 0 var(--sc-space-8);
}
.sc-agent-workspace[data-studio-view="history"] .home-session__container { width: min(100%, 72rem); padding-inline: var(--sc-space-4); margin-inline: auto; gap: var(--sc-space-5); }
.sc-agent-workspace[data-studio-view="history"] .home-session__topbar { flex-wrap: wrap; gap: var(--sc-space-3); }
.sc-agent-workspace[data-studio-view="history"] .app-mobile-history-state:not([hidden]) {
  display: grid;
  justify-items: start;
  gap: var(--sc-space-4);
  width: min(100%, 54rem);
  margin-inline: auto;
  padding: var(--sc-space-6) var(--sc-space-4);
  border: 1px solid var(--sc-color-border);
  border-radius: var(--sc-radius-lg);
  color: var(--sc-color-muted);
  background: var(--sc-color-surface);
}
.sc-agent-workspace[data-studio-view="history"] .app-mobile-history-state p { margin: 0; line-height: 1.65; }
.sc-agent-workspace[data-studio-view="history"] .app-mobile-history-state .sc-button { width: auto; }
.sc-agent-workspace[data-studio-view="history"] .home-session__empty { display: grid; justify-items: center; gap: var(--sc-space-4); }
.sc-agent-workspace[data-studio-view="history"] .home-session .app-desktop-only { display: none; }
.sc-agent-workspace[data-studio-view="history"] .home-session p.app-mobile-only:not([hidden]) { display: block; margin: 0; }
.sc-agent-workspace[data-studio-view="history"] .home-session button.app-mobile-only:not([hidden]) { display: inline-flex; width: auto; }
@media (max-width: 767px) {
  .sc-agent-workspace[data-studio-view="agent"] .home-hero__content { padding-inline: var(--sc-space-3); }
  .sc-app.sc-agent-workspace .studio-view-tabs { position: relative; top: auto; width: calc(100% - var(--sc-space-3)); gap: 0; }
  .sc-app.sc-agent-workspace[data-studio-view="agent"] .studio-view-tabs { position: relative; top: auto; }
}
@media (max-width: 600px) {
  .sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button { padding-inline: var(--sc-space-1); }
}
@media (max-width: 400px) {
  .sc-app.sc-agent-workspace[data-studio-view="agent"] .studio-view-tabs {
    display: flex;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  .sc-app.sc-agent-workspace[data-studio-view="agent"] .studio-view-tabs .app-mobile-tabs__button {
    flex: 1 0 auto;
    white-space: nowrap;
    overflow-wrap: normal;
  }
}
/* Short screens and large text need document scrolling once the composer can
   no longer share a fixed pane with a readable conversation. */
@media (max-height: 700px) {
  .sc-app.sc-agent-workspace[data-studio-view="agent"] { height: auto; min-height: 100dvh; overflow: visible; }
  .sc-app.sc-agent-workspace[data-studio-view="agent"] > main {
    height: auto;
    min-height: calc(100dvh - var(--sc-header-height, 57px));
    grid-template-rows: auto auto;
    overflow: visible;
  }
  .sc-agent-workspace[data-studio-view="agent"] .home-hero,
  .sc-agent-workspace[data-studio-view="agent"].home-session-active .home-hero,
  .sc-agent-workspace[data-studio-view="agent"] .home-hero__content,
  .sc-agent-workspace[data-studio-view="agent"].home-session-active .home-hero__content,
  .sc-agent-workspace[data-studio-view="agent"] sugarcube-creative-agent,
  .sc-agent-workspace[data-studio-view="agent"] .creative-agent__body {
    height: auto;
    overflow: visible;
  }
  .sc-agent-workspace[data-studio-view="agent"] .creative-agent__thread { min-height: 8rem; overflow: visible; }
  .sc-agent-workspace[data-studio-view="agent"] .creative-agent__composer { margin-top: var(--sc-space-5); }
}
.sc-app.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] { height: auto; min-height: 100dvh; overflow: visible; }
.sc-app.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] > main {
  height: auto;
  min-height: calc(100dvh - var(--sc-header-height, 57px));
  grid-template-rows: auto auto;
  overflow: visible;
}
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] .home-hero,
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"].home-session-active .home-hero,
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] .home-hero__content,
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"].home-session-active .home-hero__content,
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] sugarcube-creative-agent,
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] .creative-agent__body {
  height: auto;
  overflow: visible;
}
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] .creative-agent__thread { min-height: 8rem; overflow: visible; }
.sc-agent-workspace.sc-agent-flow[data-studio-view="agent"] .creative-agent__composer { margin-top: var(--sc-space-5); }
.home-chat__image-edit { padding: var(--sc-space-3); border-top: 1px solid var(--sc-color-border); }
.home-chat__image-edit[hidden] { display: none; }

/* Parameters scroll beneath the fixed action at narrow widths. */
.home-chat__action-row { display: contents; }
.home-session__history-sentinel[hidden] { display: none !important; }
@media (max-width: 767px) {
  .sc-app[data-app-mobile-panel="create"] .home-session { display: none !important; }
  .home-chat--responsive .home-chat__action-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--sc-space-2); min-width: 0; }
  .home-chat--responsive .home-chat__action-row .home-chat__toolbar.sc-parameter-row { flex-wrap: nowrap; width: 100%; min-width: 0; padding: var(--sc-space-1); }
  .home-chat--responsive .home-chat__action-row #homeChatModelControl { flex: 0 0 auto; }
  .home-chat--responsive .home-chat__action-row #homeChatModelControl .home-chat__menu-button { width: auto; }
  .sc-app .home-chat--responsive .home-chat__action-row .home-chat__submit { position: relative; grid-column: 2; grid-row: 1; flex-direction: column; gap: var(--sc-space-1); margin: 0; padding: var(--sc-space-1); background: var(--sc-color-canvas); box-shadow: calc(-1 * var(--sc-space-3)) 0 var(--sc-space-3) var(--sc-color-canvas); }
  .home-chat--responsive .home-chat__action-row .home-chat__submit-summary { display: inline-flex; flex: 0 0 auto; min-height: 0; font-size: .6875rem; white-space: nowrap; }
  .home-chat--responsive .home-chat__action-row:not(.sc-generation-action) .home-chat__send { min-width: 0; max-width: none; white-space: nowrap; padding-inline: var(--sc-space-3); }
  .home-chat--responsive .home-chat__action-row .home-chat__status:not([hidden]) { grid-column: 1 / -1; grid-row: 2; }
}

/* Desktop Studio always uses Create; history remains in the account surface. */
@media (min-width: 768px) {
  .sc-app.sc-agent-workspace .studio-view-tabs { display: none; }
  .sc-app .home-chat__action-row > .home-chat__submit-summary { grid-area: cost; justify-content: flex-start; margin: 0 var(--sc-space-3); }
  .sc-app .home-chat--responsive { grid-template-areas: "attachments attachments" "privacy privacy" "prompt prompt" "cost cost" "options submit" "status status"; }
  .sc-app .home-chat--responsive[data-mode="audio"] { grid-template-areas: "audio audio" "prompt prompt" "cost cost" "options submit" "status status"; }
}
@media (max-width: 767px) {
  .sc-app .home-chat--responsive .home-chat__action-row > .home-chat__submit-summary {
    grid-column: 1 / -1;
    grid-row: 1;
    min-height: 0;
    justify-content: flex-start;
    gap: var(--sc-space-2);
    padding: 0 var(--sc-space-1);
    font-size: .75rem;
    line-height: 1.4;
    text-align: left;
  }
  .sc-app .home-chat--responsive .home-chat__action-row .home-chat__toolbar { grid-column: 1; grid-row: 2; }
  .sc-app .home-chat--responsive .home-chat__action-row .home-chat__submit { grid-row: 2; flex-direction: row; }
  .sc-app .home-chat--responsive .home-chat__action-row .home-chat__status:not([hidden]) { grid-row: 3; }
}

/* Mobile Studio keeps model → reference → prompt → parameters above a persistent action
   rail. The shared controller moves the original nodes in this reading order. */
#homeChatMobileParameters { display: none; }
@media (max-width: 767px) {
  .sc-app.sc-agent-workspace .studio-view-tabs {
    width: calc(100% - var(--sc-space-8)); margin: 0 auto; padding: var(--sc-space-1);
    gap: var(--sc-space-1); grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-lg);
    background: var(--sc-color-surface-muted);
  }
  .sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button {
    min-height: 2.75rem; padding: var(--sc-space-2); border-radius: var(--sc-radius-md);
  }
  .sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button[aria-selected="true"] {
    color: var(--sc-color-ink); border-color: var(--sc-color-border);
    background: var(--sc-color-control-hover); box-shadow: var(--sc-shadow-sm);
  }
  .sc-app[data-app-mobile-panel="create"] .home-hero { padding-top: var(--sc-space-3); }
  .sc-app[data-app-mobile-panel="create"] .home-hero__content { padding-inline: var(--sc-space-4); }
  .sc-app[data-app-mobile-panel="create"] .home-chat--responsive {
    display: flex; flex-direction: column; gap: var(--sc-space-3); padding-top: 0;
    scroll-padding-block: var(--sc-space-3) calc(8rem + env(safe-area-inset-bottom, 0px));
  }
  .sc-app .home-chat--responsive > * { flex-shrink: 0; }
  .sc-app .home-chat--responsive .home-chat__mobile-mode { gap: var(--sc-space-1); }
  .sc-app .home-chat--responsive .home-chat__mobile-mode legend { margin-bottom: var(--sc-space-2); }
  .sc-app .home-chat--responsive .home-chat__mobile-mode-trigger { min-height: 2.75rem; padding-block: var(--sc-space-2); }
  .sc-app .home-chat--responsive .home-chat__mobile-model-mount { display: contents; }
  .sc-app .home-chat--responsive #homeChatModelControl { width: 100%; min-width: 0; }
  .sc-app .home-chat--responsive #homeChatModelButton {
    display: flex; width: 100%; min-height: 3.25rem; padding-inline: var(--sc-space-4);
    justify-content: space-between; border-radius: var(--sc-radius-lg); background: var(--sc-color-surface-muted);
  }
  .sc-app .home-chat--responsive #homeChatModelLabel { min-width: 0; flex: 1; }
  .sc-app .home-chat--responsive #homeChatModelLabel .sc-model-identity { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); width: 100%; min-width: 0; }
  .sc-app .home-chat--responsive #homeChatModelLabel .sc-model-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left; }
  .sc-app .home-chat--responsive #homeChatModelLabel .sc-model-name:only-child { grid-column: 1 / -1; }
  .sc-app .home-chat--responsive #homeChatModelButton::after { flex: 0 0 auto; margin-left: var(--sc-space-2); }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references {
    box-sizing: border-box; position: relative; min-height: 0; padding: 0;
    grid-template-columns: minmax(0, 1fr); gap: var(--sc-space-2);
    border: 0; border-radius: var(--sc-radius-lg); background: transparent;
  }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references .home-chat__mobile-field-heading {
    grid-column: 1; grid-row: 1; display: flex; justify-content: space-between; gap: var(--sc-space-2); margin: 0; font-size: .8125rem;
  }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references small { font-size: .6875rem; line-height: 1.4; overflow-wrap: anywhere; }
  .sc-app .home-chat--responsive .home-chat__attachments {
    grid-column: 1; grid-row: 2; min-height: 0; max-width: 100%; padding: 0;
    border: 0; border-radius: var(--sc-radius-md); background: transparent; overflow: visible;
  }
  .sc-app .home-chat.home-chat--responsive .home-chat__attach,
  .sc-app .home-chat.home-chat--responsive .home-chat__attachment {
    box-sizing: border-box; width: 4rem; min-width: 4rem; max-width: 4rem; height: 4rem; aspect-ratio: 1; flex-basis: 4rem;
  }
  .sc-app .home-chat--responsive .home-chat__attachment-items:empty { display: none; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:not(:has(.home-chat__attachment)) .home-chat__attach {
    width: 100%; max-width: none; height: 5.25rem; min-height: 5.25rem; flex-basis: 100%; aspect-ratio: auto;
    display: flex; flex-direction: column; justify-content: center; gap: var(--sc-space-1);
    border: 1px dashed var(--sc-color-border-strong); border-radius: var(--sc-radius-lg);
    color: var(--sc-color-muted); background: var(--sc-color-surface-muted);
  }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:not(:has(.home-chat__attachment)) .home-chat__attach .sc-sr-only {
    position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible;
    clip: auto; clip-path: none; white-space: normal; font: 650 .75rem/1.4 var(--sc-font-sans);
  }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:has(.home-chat__attachment) { grid-template-columns: minmax(0, 1fr); }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:has(.home-chat__attachment) .home-chat__mobile-field-heading { grid-column: 1; grid-row: 1; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:has(.home-chat__attachment) .home-chat__attachments { grid-column: 1; grid-row: 2; max-width: 100%; overflow-x: auto; overflow-y: hidden; padding-block: var(--sc-space-2); }
  .sc-app .home-chat--responsive .home-chat__mobile-field--prompt { gap: var(--sc-space-2); }
  .sc-app .home-chat--responsive #homeChatPrompt { min-height: 6rem; max-height: 10rem; padding: var(--sc-space-3); }
  .sc-app .home-chat--responsive .home-chat__action-row {
    position: sticky; z-index: 12; bottom: 0; flex-shrink: 0; margin-top: auto;
    display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sc-space-2); align-items: stretch;
    padding-block: var(--sc-space-3) max(var(--sc-space-3), env(safe-area-inset-bottom, 0px));
    background: var(--sc-color-canvas); box-shadow: 0 calc(-1 * var(--sc-space-2)) var(--sc-space-3) var(--sc-color-canvas);
  }
  .sc-app .home-chat--responsive > .home-chat__toolbar.sc-parameter-row {
    display: block; width: 100%; overflow: visible; padding: 0;
  }
  .sc-app .home-chat--responsive .home-chat__specification-control { width: 100%; }
  .sc-app .home-chat--responsive #homeChatSpecificationButton {
    display: flex; width: 100%; min-width: 0; min-height: 3rem; padding: var(--sc-space-2);
    border-radius: var(--sc-radius-lg); background: var(--sc-color-surface-muted);
  }
  .sc-app .home-chat--responsive #homeChatSpecificationIcon,
  .sc-app .home-chat--responsive #homeChatSpecificationLabel,
  .sc-app .home-chat--responsive #homeChatSpecificationButton::after { display: none; content: none; }
  .sc-app .home-chat--responsive #homeChatMobileParameters {
    display: grid; width: 100%; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); align-items: center;
  }
  .sc-app .home-chat--responsive .sc-parameter-summary__item { display: inline-flex; min-width: 0; align-items: center; justify-content: center; gap: var(--sc-space-2); font-size: .8125rem; line-height: 1.3; white-space: normal; }
  .sc-app .home-chat--responsive .sc-parameter-summary__icon { width: 18px; height: 18px; flex: 0 0 18px; }
  .sc-app .home-chat--responsive .home-chat__action-row > .home-chat__submit-summary { grid-column: 1; grid-row: 1; display: inline-flex; min-height: 1.25rem; padding: 0; white-space: normal; }
  .sc-app .home-chat--responsive .home-chat__action-row .home-chat__submit {
    position: static; grid-column: 1; grid-row: 2; width: 100%; margin: 0; padding: 0; background: transparent; box-shadow: none;
  }
  .sc-app .home-chat--responsive .home-chat__action-row:not(.sc-generation-action) .home-chat__send { display: flex; width: 100%; min-height: 3.25rem; padding-inline: var(--sc-space-4); }
  .sc-app .home-chat--responsive .home-chat__action-row .home-chat__status:not([hidden]) { grid-column: 1; grid-row: 3; }
  .sc-app .home-chat--responsive .home-chat__action-row > .sc-image-subscription-offer { grid-column: 1; grid-row: 4; width: 100%; justify-content: center; white-space: normal; }
  .sc-app .home-chat--responsive .home-chat__action-row.sc-generation-action {
    margin-top: auto; padding-bottom: max(var(--sc-space-3), env(safe-area-inset-bottom, 0px));
    background: var(--sc-color-canvas); box-shadow: none;
  }
  .sc-app .home-chat--responsive .home-chat__audio-options { grid-area: auto; padding: 0; }
  .sc-app .home-chat--responsive #homeChatSpecificationPopover:has(.home-chat__audio-options:not([hidden])) { grid-template-columns: minmax(0, 1fr); }
  .sc-app[data-app-mobile-panel="history"] .home-session__container:has(#homeSessionEmpty:not([hidden])),
  .sc-app[data-app-mobile-panel="history"] .home-session__container:has(#appMobileHistoryGuest:not([hidden])),
  .sc-app[data-app-mobile-panel="history"] .home-session__container:has(#appMobileHistoryLoading:not([hidden])) {
    min-height: calc(100dvh - var(--sc-header-height, 57px) - 5.5rem); align-content: center;
  }
  .sc-app[data-app-mobile-panel="history"] .home-session__empty,
  .sc-app[data-app-mobile-panel="history"] .app-mobile-history-state:not([hidden]) {
    justify-items: center; text-align: center; border: 0; background: transparent;
  }
  .sc-app[data-app-mobile-panel="history"] .home-session__feed:empty,
  .sc-app[data-app-mobile-panel="history"] .home-session__history-pagination:not(:has(#homeSessionHistoryError:not([hidden]), #homeSessionHistoryMore:not([hidden]))) { display: none; }
}

/* v5b 04–06. History content and input state continue to come from Studio's
   controller; these rules only reproduce the approved feed and composer. */
.sc-app .home-task { padding: 26px 26px 22px; gap: 6px; border-color: var(--sc-color-border); border-radius: 28px; background: var(--sc-color-surface); box-shadow: var(--sc-shadow-control); }
.sc-app .home-task__content { gap: 18px; margin-top: 12px; }
.sc-app .home-task__prompt { font: 600 18px/1.5 var(--sc-font-sans); letter-spacing: -.01em; }
.sc-app .home-task__meta { font-size: 13px; line-height: 1.55; }
.sc-app .home-task__media { border-radius: var(--sc-radius-lg); background: var(--sc-color-bg-2, var(--sc-color-canvas)); }
.sc-app .home-task__image { background: var(--sc-color-bg-2, var(--sc-color-canvas)); }
.sc-app .home-task__actions { gap: 10px; flex-wrap: wrap; }
.sc-app .home-task__actions .sc-button { border-radius: var(--sc-radius-pill); }
.sc-app .home-task__action-button--delete { margin-inline-start: auto; border-color: var(--sc-color-border); color: var(--sc-color-text); }
.sc-app .home-chat__menu-button { font-weight: 600; box-shadow: var(--sc-shadow-control); }
.sc-app .home-chat__send { color: var(--sc-color-on-brand); background: var(--sc-color-brand-600); box-shadow: none; font-weight: 600; }
.sc-app .home-chat__send:hover:not(:disabled) { background: var(--sc-color-brand-hover); }
.sc-app .home-chat__send:disabled { color: var(--sc-color-subtle); background: var(--sc-color-control-hover); opacity: 1; cursor: not-allowed; }
.sc-app .home-chat__specification-option { border-radius: var(--sc-radius-sm); font-weight: 500; }
.sc-app .home-chat__specification-option[aria-checked="true"],
.sc-app .home-chat__specification-option[aria-pressed="true"] { color: var(--sc-color-ink); border-color: var(--sc-color-brand-500); background: var(--sc-color-brand-50); }
.sc-app .home-chat--responsive [data-parameter-popover]:not([hidden]) { padding: 20px; border-color: var(--sc-color-border); border-radius: var(--sc-radius-xl); background: var(--sc-color-popover); box-shadow: var(--sc-shadow-popover); }
.sc-app .home-chat__specification-section h2 { font-size: 13px; font-weight: 600; }
.sc-app .home-chat__specification-section + .home-chat__specification-section { border: 0; padding-top: 4px; }
@media (min-width: 768px) {
  .sc-app .home-session { min-height: calc(100dvh - var(--sc-header-height)); padding: 24px var(--sc-page-gutter-end, 44px) max(300px, var(--home-session-composer-clearance, 300px)) calc(var(--sc-page-gutter-start, 124px) - var(--sc-sidebar-width, 80px)); }
  .sc-app .home-session__container { width: 100%; max-width: 900px; margin-inline: auto; padding: 0; }
  .sc-app .home-session__feed, .sc-app .home-session__empty, .sc-app .home-session__notice { max-width: 900px; }
  .sc-app.home-session-active .home-hero { left: var(--sc-page-gutter-start, 124px); right: var(--sc-page-gutter-end, 44px); bottom: 22px; padding: 0; }
  .sc-app.home-session-active .home-hero__content { width: 100%; max-width: 900px; margin-inline: auto; padding: 0; }
  .sc-app.home-session-active .home-chat { width: 100%; grid-template-columns: minmax(0, 1fr); grid-template-areas: "attachments" "privacy" "prompt" "edit" "actions"; padding: 10px 12px 12px; border: 1px solid var(--sc-color-border); border-radius: 30px; background: linear-gradient(180deg, var(--sc-color-surface-muted), var(--sc-color-surface)); box-shadow: var(--sc-shadow-md); }
  .sc-app.home-session-active .home-chat[data-mode="audio"] { grid-template-areas: "audio" "prompt" "actions"; }
  .sc-app.home-session-active .home-chat__image-edit { grid-area: edit; }
  .sc-app.home-session-active .home-chat .home-chat__input { min-height: 56px; margin-inline: 0; padding: 12px 14px 0; background: transparent !important; font-size: 17px; font-weight: 500; line-height: 1.4; }
  .sc-app.home-session-active .home-chat__mobile-field--prompt { gap: 0; }
  .sc-app.home-session-active .home-chat__mobile-field--prompt .home-chat__mobile-field-heading:has(:only-child.sc-sr-only) { display: none; }
  .sc-app.home-session-active .home-chat__attachments { min-height: 78px; margin: 10px 12px 0; padding: 0; background: transparent; border-radius: 0; }
  .sc-app.home-session-active .home-chat.home-chat--responsive .home-chat__attach,
  .sc-app.home-session-active .home-chat.home-chat--responsive .home-chat__attachment { width: 66px; min-width: 66px; max-width: 66px; height: 78px; min-height: 78px; flex-basis: 66px; border-radius: 16px; }
  .sc-app.home-session-active .home-chat.home-chat--responsive .home-chat__attach { border: 1px dashed var(--sc-color-border-strong); color: var(--sc-color-brand-500); font-weight: 400; background: transparent; }
  .sc-app.home-session-active .home-chat__action-row { display: grid; grid-area: actions; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "cost cost" "options submit" "status status"; align-items: end; column-gap: 8px; }
  .sc-app.home-session-active .home-chat__action-row > .home-chat__submit-summary { min-height: 32px; margin: 0 0 10px; padding: 0 8px 10px; border-bottom: 1px solid var(--sc-color-border); font-size: 12.5px; }
  .sc-app.home-session-active .home-chat__toolbar.sc-parameter-row { gap: 8px; margin: 0; padding: 0 8px; min-height: 52px; align-items: center; }
  .sc-app.home-session-active .home-chat__menu-button { min-height: 42px; padding: 0 12px; border-color: var(--sc-color-border); border-radius: var(--sc-radius-pill); color: var(--sc-color-text); background: var(--sc-color-well, var(--sc-color-control)); font-size: 13px; }
  .sc-app.home-session-active #homeChatModelControl .home-chat__menu-button { min-height: 42px; border-radius: var(--sc-radius-pill); font-size: 13px; }
  .sc-app.home-session-active .home-chat__submit { align-self: end; margin: 0 6px 0 0; }
  .sc-app.home-session-active .home-chat__send { min-height: 52px; min-width: 100px; border-radius: var(--sc-radius-pill); padding-inline: 24px; }
  .sc-app .home-task__media-track--count-1 { grid-auto-columns: 100%; }
  .sc-app .home-task__media-track--count-1 .home-task__media { width: 100%; max-width: none; height: 460px; max-height: 460px; aspect-ratio: auto; }
  .sc-app .home-task--image .home-task__content:has(> .home-task__media-track--count-1) { grid-template-columns: max-content minmax(0, 1fr); align-items: start; gap: 18px 10px; }
  .sc-app .home-task--image .home-task__media-track--count-1,
  .sc-app .home-task--image .home-task__media-track--count-1 .home-task__media-item { display: contents; }
  .sc-app .home-task--image .home-task__media-track--count-1 .home-task__media,
  .sc-app .home-task--image .home-task__media-track--count-1 .home-task__media-item > .home-task__error { grid-column: 1 / -1; }
  .sc-app .home-task--image .home-task__content:has(> .home-task__media-track--count-1) > .home-task__actions { grid-column: 2; min-height: 44px; }
  .sc-app .home-task--image .home-task__media-track--count-1 .home-task__media-actions { grid-column: 1; }
  .sc-app .home-task__media-actions .sc-button { border-radius: var(--sc-radius-pill); }
  .sc-app .home-chat--responsive [data-parameter-popover]:not([hidden]) { width: min(340px, calc(100vw - 32px)); }
}
@media (max-width: 767px) {
  /* The reference uses normal page flow; the shared bottom navigation stays
     outside the form and the primary action remains reachable when zoomed. */
  .sc-app[data-app-mobile-panel="create"] { height: auto; min-height: 100dvh; overflow: visible; }
  .sc-app[data-app-mobile-panel="create"] > main { display: block; height: auto; min-height: 0; overflow: visible; padding-top: 10px; }
  .sc-app.sc-agent-workspace .studio-view-tabs { position: relative; top: auto; width: calc(100% - 32px); padding: 4px; margin: 0 auto; gap: 4px; border-radius: var(--sc-radius-pill); background: var(--sc-color-well, var(--sc-color-control)); }
  .sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button { min-height: 38px; padding: 0 12px; border-radius: var(--sc-radius-pill); font-size: 13.5px; font-weight: 600; }
  .sc-app.sc-agent-workspace .studio-view-tabs .app-mobile-tabs__button[aria-selected="true"] { background: var(--sc-color-control-hover); box-shadow: var(--sc-shadow-sm); }
  .sc-app[data-app-mobile-panel="create"] .home-hero,
  .sc-app[data-app-mobile-panel="create"].home-session-active .home-hero { height: auto; min-height: 0; padding: 12px 0 110px; overflow: visible; }
  .sc-app[data-app-mobile-panel="create"] .home-hero__content,
  .sc-app[data-app-mobile-panel="create"].home-session-active .home-hero__content { height: auto; min-height: 0; padding-inline: 16px; }
  .sc-app[data-app-mobile-panel="create"] .home-chat--responsive { height: auto; max-height: none; gap: 12px; overflow: visible; padding: 0; }
  .sc-app .home-chat--responsive [data-scene-trigger] { height: 104px; min-height: 104px; border-radius: var(--sc-radius-lg); }
  .sc-app .home-chat--responsive [data-scene-trigger] .sc-scene-label { font: 600 19px/1.3 var(--sc-font-display); letter-spacing: -.02em; bottom: 14px; }
  .sc-app .home-chat--responsive [data-scene-trigger] :is(.sc-scene-label, .sc-scene-change) { color: var(--sc-color-ink); }
  .sc-app .home-chat--responsive #homeChatModelButton { min-height: 52px; border-radius: var(--sc-radius-md); color: var(--sc-color-text); background: var(--sc-color-well, var(--sc-color-control)); font-weight: 500; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references { gap: 12px; padding-top: 6px; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references .home-chat__mobile-field-heading { font-size: 13.5px; font-weight: 600; line-height: 1.5; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references small { font-size: 12px; font-weight: 400; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:not(:has(.home-chat__attachment)) .home-chat__attach { min-height: 96px; height: 96px; gap: 10px; border-color: var(--sc-color-border-strong); border-radius: var(--sc-radius-lg); background: transparent; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:not(:has(.home-chat__attachment)) .home-chat__attach > span:first-child { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--sc-color-brand-500); background: var(--sc-color-brand-50); font: 400 26px/1 var(--sc-font-sans); }
  .sc-app .home-chat--responsive .home-chat__mobile-field--references:not(:has(.home-chat__attachment)) .home-chat__attach .sc-sr-only { color: var(--sc-color-ink); font-weight: 600; }
  :root body.sc-app .sc-reference-rail[data-reference-rail][data-reference-filled="false"] { min-height: 96px; }
  :root body.sc-app .sc-reference-rail[data-reference-rail][data-reference-filled="false"] .sc-reference-rail__add { min-height: 96px; height: 96px; background: transparent; border-radius: var(--sc-radius-lg); }
  :root body.sc-app .sc-reference-rail[data-reference-rail] .sc-reference-rail__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--sc-color-brand-500); background: var(--sc-color-brand-50); font-size: 26px; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--prompt { padding-top: 6px; gap: 12px; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--prompt .home-chat__mobile-field-heading { margin: 0; }
  .sc-app .home-chat--responsive .home-chat__mobile-field--prompt .home-chat__mobile-field-label { font-size: 13.5px; font-weight: 600; }
  .sc-app .home-chat--responsive #homeChatPrompt { height: 114px; min-height: 114px; width: 100%; margin: 0; padding: 14px; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-md); background: var(--sc-color-well, var(--sc-color-control)) !important; font-size: 14px; line-height: 1.55; }
  .sc-app .home-chat--responsive #homeChatPromptCount { color: var(--sc-color-subtle); font-size: 12px; }
  .sc-app .home-chat--responsive .home-chat__action-row,
  .sc-app .home-chat--responsive .home-chat__action-row.sc-generation-action { position: static; bottom: auto; margin: 0; padding: 0; background: transparent; box-shadow: none; }
  .sc-app .home-chat--responsive .home-chat__action-row:not(.sc-generation-action) .home-chat__send { min-height: 52px; border-radius: var(--sc-radius-pill); }
  .sc-app .home-chat--responsive .sc-generation-action[data-generation-action][data-generation-kind] > .sc-generation-action__submit { min-height: 52px; border-radius: var(--sc-radius-pill); }
  .sc-app .home-chat--responsive .sc-generation-action[data-generation-action][data-generation-kind] > .sc-generation-action__submit:disabled { color: var(--sc-color-subtle); background: var(--sc-color-control-hover); opacity: 1; }
  .sc-app .home-chat--responsive #homeChatSpecificationButton { min-height: 42px; background: var(--sc-color-well, var(--sc-color-control)); border-radius: var(--sc-radius-pill); }
  .sc-app .home-chat--responsive [data-parameter-popover]:not([hidden]) { border-radius: var(--sc-radius-xl) var(--sc-radius-xl) 0 0; }
  .sc-app .home-session { padding: 16px 16px 110px; }
  .sc-app .home-session__container { width: 100%; padding: 0; }
  .sc-app .home-task { padding: 16px; border-radius: 22px; }
  .sc-app .home-task__media-track--count-1 { grid-auto-columns: 100%; }
  .sc-app .home-task__media-track--count-1 .home-task__media { max-width: none; max-height: none; aspect-ratio: var(--home-task-ratio-width, 3) / var(--home-task-ratio-height, 4); }
}

/* Supplemental v5b states. Progress is deliberately indeterminate: the task
   API supplies lifecycle state and estimated total time, not a percentage. */
.sc-app .home-task { position: relative; }
.sc-app .home-task:not(.home-task--chat):not(.home-task--audio) .home-task__state:not([hidden]) { display: inline-flex; align-items: center; gap: 7px; min-height: 28px; width: fit-content; padding: 0 12px; margin: 10px 0 0; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-pill); color: var(--sc-color-text); background: color-mix(in srgb, var(--sc-color-ink) 5%, transparent); font-size: 12px; font-weight: 600; }
.sc-app .home-task:not(.home-task--chat):not(.home-task--audio) .home-task__state::before { content: ''; flex: 0 0 7px; width: 7px; height: 7px; border-radius: 50%; background: var(--sc-color-brand-500); }
.sc-app .home-task.home-task--error:not(.home-task--chat):not(.home-task--audio) .home-task__state:not([hidden]) { color: var(--sc-color-danger-ink, var(--sc-color-danger)); border-color: color-mix(in srgb, var(--sc-color-danger) 40%, transparent); }
.sc-app .home-task.home-task--error:not(.home-task--chat):not(.home-task--audio) .home-task__state::before { background: var(--sc-color-danger); }
.sc-app .home-task--succeeded .home-task__state::before { background: var(--sc-color-success); }
.sc-app .home-task__skeleton:has(.home-task__skeleton-message), .sc-app .home-task__failure { box-sizing: border-box; min-height: 360px; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 30px; text-align: center; background: radial-gradient(70% 60% at 50% 45%, color-mix(in srgb, var(--sc-color-brand-500) 7%, transparent), transparent 70%), var(--sc-color-bg-2); }
.sc-app .home-task__skeleton:has(.home-task__skeleton-message) { height: auto; display: grid; align-content: center; justify-items: center; animation: none; }
.sc-app .home-task__media:has(.home-task__skeleton-message) { height: auto; max-height: none; aspect-ratio: auto; }
.sc-app .home-task__skeleton:has(.home-task__skeleton-message) > * { flex-shrink: 0; }
.sc-app .home-task__skeleton:has(.home-task__skeleton-message)::after { content: ''; order: 2; width: min(380px, 80%); height: 8px; border-radius: 4px; background: linear-gradient(90deg, transparent 20%, var(--sc-color-brand-500) 50%, transparent 80%), color-mix(in srgb, var(--sc-color-ink) 10%, transparent); background-size: 220% 100%; animation: home-task-skeleton 2s linear infinite; }
.sc-app .home-task__progress-icon, .sc-app .home-task__failure-icon { display: grid; place-items: center; flex: 0 0 58px; width: 58px; height: 58px; border: 1px solid var(--sc-color-border); border-radius: 50%; color: var(--sc-color-brand-500); background: var(--sc-color-surface); font: 400 28px/1 var(--sc-font-display); }
.sc-app .home-task__skeleton-message { max-width: 420px; font-size: 14px; color: var(--sc-color-muted); }
.sc-app .home-task__skeleton .sc-generation-timing { order: 3; color: var(--sc-color-muted); font-size: 12.5px; }
.sc-app .home-task__failure { min-height: 460px; border: 1px solid var(--sc-color-border); border-radius: 20px; }
.sc-app .home-task__failure-icon { color: var(--sc-color-danger-ink, var(--sc-color-danger)); border-color: color-mix(in srgb, var(--sc-color-danger) 40%, transparent); }
.sc-app .home-task__failure-title { margin: 0; font: 600 20px/1.3 var(--sc-font-display); letter-spacing: -.02em; }
.sc-app .home-task__failure .home-task__generation-error { max-width: 420px; margin: 0; border: 0; padding: 0; color: var(--sc-color-muted); font-size: 14px; line-height: 1.55; background: transparent; }
.sc-app .home-task__failure .home-task__actions { justify-content: center; margin-top: 6px; }
.sc-app .home-task__result-overlay { position: absolute; z-index: 3; top: 14px; right: 14px; display: flex; gap: 6px; opacity: 0; transform: translateY(-6px); transition: opacity .2s, transform .25s; }
.sc-app .home-task:hover .home-task__result-overlay, .sc-app .home-task__result-overlay:focus-within { opacity: 1; transform: none; }
.sc-app .home-task__result-overlay .home-task__overlay-button { display: grid; place-items: center; box-sizing: border-box; width: 38px; height: 38px; min-height: 38px; padding: 0; border: 1px solid var(--sc-color-border); border-radius: 12px; color: var(--sc-color-ink); background: color-mix(in srgb, var(--sc-color-canvas-deep) 70%, transparent); backdrop-filter: blur(8px); }
.sc-app .home-task__overlay-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sc-app .home-task__overlay-button:hover { background: var(--sc-color-surface-muted); }
.sc-app .home-task__overlay-button:focus-visible { outline: 2px solid var(--sc-color-focus); outline-offset: 3px; }
.sc-app #appMobileHistoryLoading:not([hidden]) { display: grid; gap: 22px; padding: 0; margin: 0; width: 100%; min-height: 0; border: 0; background: none; }
.app-history-skeleton { box-sizing: border-box; padding: 26px; border: 1px solid var(--sc-color-border); border-radius: 28px; background: var(--sc-color-surface); }
.app-history-skeleton > span, .app-history-skeleton__actions > span { display: block; background: linear-gradient(100deg, var(--sc-color-surface-muted) 30%, var(--sc-color-control-hover) 50%, var(--sc-color-surface-muted) 70%); background-size: 220% 100%; animation: home-task-skeleton 2s linear infinite; border-radius: 8px; }
.app-history-skeleton__title { height: 16px; width: 60%; }
.app-history-skeleton__meta { height: 11px; width: 34%; margin-top: 10px; }
.app-history-skeleton .app-history-skeleton__media { width: 100%; height: 460px; margin-top: 20px; border-radius: 20px; }
.app-history-skeleton__actions { display: flex; gap: 10px; margin-top: 18px; }
.app-history-skeleton__actions > span { width: 130px; height: 42px; border-radius: var(--sc-radius-pill); }
.app-history-skeleton__actions > span:first-child { width: 170px; }
.sc-app .home-session__empty { display: grid; place-content: center; justify-items: center; gap: 16px; min-height: 420px; border: 0; background: transparent; }
.sc-app .home-session__empty[hidden] { display: none !important; }
.sc-app .home-session__empty::before { content: '✦'; display: grid; place-items: center; width: 64px; height: 64px; border: 1px solid var(--sc-color-border); border-radius: 20px; color: var(--sc-color-brand-500); background: var(--sc-color-surface); font-size: 30px; }
.sc-app .home-session__empty p { max-width: 420px; margin: 0; color: var(--sc-color-muted); font-size: 14px; line-height: 1.6; }
.sc-app .home-session__history-sentinel--loading { gap: 10px; margin: 26px 0 0; font-size: 13px; color: var(--sc-color-muted); }
.sc-app .home-session__history-sentinel--loading > .sc-sr-only { position: static; width: auto; height: auto; clip: auto; clip-path: none; white-space: normal; }
.sc-app .home-task__result-overlay .home-task__action-button { width: 38px !important; min-width: 38px; flex: 0 0 38px; height: 38px; min-height: 38px; }
.sc-app .home-chat__attachment--processing .home-chat__attachment-preview { filter: brightness(.4) blur(1.5px); }
.sc-app .home-chat__attachment--processing .home-chat__attachment-status { top: 50%; left: 50%; right: auto; bottom: auto; width: 34px; height: 34px; box-sizing: border-box; margin: -17px 0 0 -17px; border: 3px solid color-mix(in srgb, var(--sc-color-ink) 20%, transparent); border-top-color: var(--sc-color-brand-500); border-radius: 50%; background: transparent; animation: v5b-reference-spin 1s linear infinite; }
.sc-app .home-chat__attachment:has([data-reference-preview-placeholder][role="img"]) { border-color: var(--sc-color-danger); background: var(--sc-color-danger-soft); }
.sc-app .home-chat__attachment [data-reference-preview-placeholder][role="img"] { color: var(--sc-color-danger-ink, var(--sc-color-danger)); }
.sc-app .home-chat__attach:hover:not(:disabled):not([aria-disabled="true"]) { border-color: var(--sc-color-brand-500); color: var(--sc-color-brand-500); background: var(--sc-color-brand-50); }
@keyframes v5b-reference-spin { to { transform: rotate(360deg); } }
@media (min-width: 768px) {
  .sc-app .home-task__media-track--count-1 .home-task__skeleton:has(.home-task__skeleton-message) { min-height: 460px; }
  .sc-app .home-task:not(.home-task--chat):not(.home-task--audio):has(.home-task__state:not([hidden])) > :is(.home-task__prompt, .home-task__meta) { padding-right: 35%; }
  .sc-app .home-task:not(.home-task--chat):not(.home-task--audio) .home-task__state:not([hidden]) { position: absolute; top: 26px; right: 26px; max-width: 32%; box-sizing: border-box; margin: 0; padding-block: 5px; }
}
@media (max-width: 767px) {
  .sc-app .home-task__failure { min-height: 360px; padding: 18px; }
  .sc-app .home-task__failure-title { font-size: 17px; }
  .sc-app .home-task__failure .home-task__generation-error { font-size: 13px; }
  .sc-app .home-task__skeleton:has(.home-task__skeleton-message) { min-height: 300px; padding: 18px; }
  .sc-app .home-task__result-overlay { top: 10px; right: 10px; gap: 5px; opacity: 1; transform: none; }
  .sc-app .home-task__result-overlay .home-task__overlay-button { width: 34px; height: 34px; min-height: 34px; border-radius: 11px; }
  .sc-app .home-task__result-overlay .home-task__action-button { width: 34px !important; min-width: 34px; flex-basis: 34px; }
  .app-history-skeleton { padding: 16px; border-radius: 22px; }
  .app-history-skeleton .app-history-skeleton__media { height: auto; aspect-ratio: 3/4; }
  .app-history-skeleton__actions { flex-wrap: wrap; }
  .app-history-skeleton__actions > span { flex: 1 1 40%; }
}
@media (prefers-reduced-motion: reduce) {
  .sc-app .home-task__skeleton:has(.home-task__skeleton-message)::after, .app-history-skeleton > span, .app-history-skeleton__actions > span { animation: none; }
  .sc-app .home-task__result-overlay { transition: none; }
  .sc-app .home-chat__attachment--processing .home-chat__attachment-status { animation: none; }
}
/* Supplement 25: music authoring stays in-flow on mobile. Audio remains the
   keyed native player; no synthetic waveform, composition phases or timings. */
.sc-app .home-chat[data-mode="audio"] { gap: 12px; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-options { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 10px 20px; padding: 0; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-options > .home-chat__mobile-field-heading { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; border: 0; border-radius: 0; margin: 0; padding: 0; background: transparent; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode legend { float: left; margin: 0 8px 0 0; padding: 0; color: var(--sc-color-muted); font-size: 12.5px; font-weight: 600; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode label { min-height: 44px; font-size: 13.5px; font-weight: 600; color: var(--sc-color-text); }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode input { appearance: none; flex: 0 0 20px; width: 20px; height: 20px; margin: 0; border: 0; border-radius: 50%; background: var(--sc-color-well); box-shadow: inset 0 0 0 1.5px var(--sc-color-border-strong); cursor: pointer; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode input:checked { background: radial-gradient(circle, var(--sc-color-on-brand) 0 3.5px, var(--sc-color-brand-600) 4px); box-shadow: none; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode input:focus-visible { outline: 2px solid var(--sc-color-focus); outline-offset: 2px; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode input:disabled { opacity: .4; cursor: not-allowed; }
.sc-app .home-chat[data-mode="audio"] .home-chat__switch-row { gap: 14px; padding: 0; border: 0; background: transparent; }
.sc-app .home-chat[data-mode="audio"] .home-chat__switch-row > span:first-child { text-align: right; }
.sc-app .home-chat[data-mode="audio"] .home-chat__switch-row strong { font-size: 13.5px; }
.sc-app .home-chat[data-mode="audio"] .home-chat__switch-row small { font-size: 12px; line-height: 1.5; }
.sc-app .home-chat[data-mode="audio"] #homeChatAudioOutputDisclosure { grid-column: 1 / -1; grid-row: 2; font-size: 12.5px; line-height: 1.5; }
.sc-app .home-chat[data-mode="audio"] #homeChatAudioCatalogStatus, .sc-app .home-chat[data-mode="audio"] #homeChatAudioCatalogRetry { grid-column: 1 / -1; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-fields { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px 12px; max-height: min(46vh, 420px); overflow-y: auto; padding: 0 6px 4px; margin: 2px -6px 0; scrollbar-width: thin; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-field { gap: 6px; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-field label, .sc-app .home-chat[data-mode="audio"] .home-chat__audio-simple-description { font-size: 12.5px; font-weight: 600; color: var(--sc-color-text); }
.sc-app .home-chat[data-mode="audio"] .home-chat__input { width: 100%; margin: 0; padding: 12px 15px; min-height: 92px; border: 1px solid var(--sc-color-border) !important; border-radius: 16px; background: var(--sc-color-well) !important; font-size: 14px; font-weight: 400; line-height: 1.6; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-fields input.home-chat__input { height: 42px; min-height: 42px; padding: 9px 14px; }
.sc-app .home-chat[data-mode="audio"] #homeChatAudioLyrics { min-height: 116px; }
.sc-app .home-chat[data-mode="audio"][data-audio-instrumental="true"] #homeChatAudioLyrics { opacity: .5; }
.sc-app .home-chat[data-mode="audio"] .home-chat__mobile-field--prompt { gap: 8px; }
.sc-app .home-chat[data-mode="audio"] .home-chat__mobile-field--prompt .home-chat__mobile-field-heading { display: flex; margin: 0; }
.sc-app .home-chat[data-mode="audio"][data-audio-authoring="custom"] .home-chat__mobile-field--prompt { display: none; }
.sc-app .home-chat[data-mode="audio"] .home-chat__mobile-prompt-count { display: block; text-align: right; padding: 4px 0 0; color: var(--sc-color-subtle); font: 500 11px/1.5 var(--sc-font-mono); }
.sc-app .home-chat__audio-starters:not([hidden]) { grid-area: starters; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; color: var(--sc-color-muted); font-size: 12.5px; }
.sc-app .home-chat__audio-starters button { min-height: 28px; padding: 4px 11px; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-pill); background: var(--sc-color-control-hover); color: var(--sc-color-text); font: 600 12px/1.5 var(--sc-font-sans); cursor: pointer; }
.sc-app .home-chat__audio-starters button:hover { color: var(--sc-color-ink); border-color: var(--sc-color-brand-500); }
.sc-app .home-chat__audio-starters button:focus-visible { outline: 2px solid var(--sc-color-focus); outline-offset: 3px; }
.sc-app .home-task--audio { gap: 6px; }
.sc-app .home-task__audio-tracks { grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 12px; }
.sc-app .home-task__audio-track { align-items: center; gap: 16px; padding: 12px; border: 0; border-radius: 20px; background: var(--sc-color-bg-2); }
.sc-app .home-task__audio-art { width: 64px; height: 64px; border: 0; border-radius: 16px; background: linear-gradient(145deg, var(--sc-color-brand-700), var(--sc-color-brand-600)); }
.sc-app .home-task__audio-waveform { color: var(--sc-color-on-brand); }
.sc-app .home-task__audio-body { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
.sc-app .home-task__audio-title { font-size: 14px; grid-column: 1; }
.sc-app .home-task__audio-details { grid-column: 1; color: var(--sc-color-subtle); font-size: 11px; }
.sc-app .home-task__audio-duration { font-family: var(--sc-font-mono); }
.sc-app .home-task__audio-player { grid-column: 1; height: 40px; color-scheme: dark; }
.sc-app .home-task__audio-track-actions { grid-column: 2; grid-row: 1 / 4; align-self: center; gap: 6px; }
.sc-app .home-task__audio-track-actions .sc-button { min-height: 38px; padding: 6px 10px; font-size: 12px; border-radius: var(--sc-radius-pill); }
.sc-app .home-task__audio-track-actions .home-task__audio-download { background: var(--sc-color-surface); color: var(--sc-color-text); box-shadow: var(--sc-shadow-control); border: 1px solid var(--sc-color-border); }
.sc-app .home-task__audio-error { grid-column: 1 / -1; margin: 0; font-size: 13px; }
.sc-app .home-task__audio-actions { margin-top: 12px; }
.sc-app .home-task__audio-delete { margin-left: auto; }
.sc-app .home-task__audio-task-error:not([hidden]) { padding: 22px; margin: 12px 0 0; border: 1px solid color-mix(in srgb, var(--sc-color-danger) 30%, transparent); border-radius: 20px; background: var(--sc-color-bg-2); font-size: 13.5px; color: var(--sc-color-muted); }
.sc-app .home-task__audio-state:not([hidden]) { display: inline-flex; align-items: center; gap: 7px; width: fit-content; min-height: 28px; margin: 8px 0 0; padding: 4px 12px; border: 1px solid var(--sc-color-border); border-radius: var(--sc-radius-pill); color: var(--sc-color-muted); font-size: 12px; font-weight: 600; line-height: 1.4; background: var(--sc-color-control-hover); }
.sc-app .home-task__audio-state::before { content: ''; flex: 0 0 7px; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.sc-app .home-task--succeeded .home-task__audio-state { color: var(--sc-color-success); }
.sc-app .home-task--error .home-task__audio-state { color: var(--sc-color-danger-ink); }
@media (min-width: 768px) {
  .sc-app .home-chat[data-mode="audio"], .sc-app.home-session-active .home-chat[data-mode="audio"] { grid-template-columns: minmax(0, 1fr); grid-template-areas: "audio" "prompt" "starters" "actions"; padding: 14px 16px 12px; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__action-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "cost options submit" "status status status"; align-items: center; column-gap: 8px; border-top: 1px solid var(--sc-color-border); padding-top: 10px; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__action-row > .home-chat__submit-summary { border: 0; padding: 0; margin: 0; min-height: 32px; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__toolbar.sc-parameter-row { padding: 0; }
  .sc-app .home-task--audio > :is(.home-task__prompt, .home-task__meta) { padding-right: 30%; }
  .sc-app .home-task__audio-state:not([hidden]) { position: absolute; top: 26px; right: 26px; max-width: 28%; margin: 0; }
}
@media (max-width: 767px) {
  .sc-app .home-chat[data-mode="audio"] .home-chat__audio-options { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode { justify-content: space-between; gap: 8px; padding: 6px 12px; border: 1px solid var(--sc-color-border); border-radius: 14px; background: var(--sc-color-well); }
  .sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode legend { float: none; display: contents; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode label { font-size: 12.5px; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__switch-row { padding: 10px 12px; border: 1px solid var(--sc-color-border); border-radius: 14px; background: var(--sc-color-well); }
  .sc-app .home-chat[data-mode="audio"] .home-chat__switch-row > span:first-child { text-align: left; }
  .sc-app .home-chat[data-mode="audio"] #homeChatAudioOutputDisclosure { grid-row: auto; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-fields { grid-template-columns: minmax(0, 1fr); max-height: none; overflow: visible; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__input { min-height: 110px; }
  .sc-app .home-chat[data-mode="audio"] .home-chat__audio-starters button { min-height: 36px; }
  .sc-app .home-task--audio { padding: 18px 14px 16px; border-radius: 24px; }
  .sc-app .home-task__audio-track { padding: 10px; gap: 10px 12px; }
  .sc-app .home-task__audio-art { width: 52px; height: 52px; border-radius: 14px; }
  .sc-app .home-task__audio-body { grid-template-columns: minmax(0, 1fr); }
  .sc-app .home-task__audio-track-actions { grid-column: 1; grid-row: auto; justify-content: flex-end; }
  .sc-app .home-task__audio-track-actions .sc-button { flex: 0 1 auto; min-height: 44px; }
  .sc-app .home-task__audio-player { min-width: 0; }
}
/* The same native media object remains beneath the custom player. */
.sc-app .home-task__audio-body > .sc-audio-player { grid-column: 1; grid-template-columns: minmax(0, 1fr); position: relative; }
.sc-app .home-task__audio-body > .sc-audio-player > .sc-audio-player__play { position: absolute; left: -66px; top: -6px; width: 36px; height: 36px; min-height: 36px; }
.sc-app .home-task__audio-track:has(.sc-audio-player--playing) { box-shadow: inset 0 0 0 1px var(--sc-color-brand-200); background: linear-gradient(90deg, var(--sc-color-brand-50), transparent 60%), var(--sc-color-bg-2); }
.sc-app .home-task__audio-track:has(.sc-audio-player) .home-task__audio-duration { display: none; }
.sc-app .home-task__audio-track:has(.sc-audio-player) .home-task__audio-reload { display: none; }
.sc-app .home-task__audio-track:has(.home-task__audio-error:not([hidden])) .home-task__audio-reload { display: inline-flex; }
@media (max-width: 767px) {
 .sc-app .home-chat[data-mode="audio"] { padding: 14px 16px 12px; border: 1px solid var(--sc-color-border); border-radius: 24px; background: linear-gradient(180deg, var(--sc-color-surface-muted), var(--sc-color-surface)); }
 .sc-app .home-chat[data-mode="audio"] .home-chat__mobile-mode, .sc-app .home-chat[data-mode="audio"] .home-chat__mobile-model-mount { display: none; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__mode-control { display: block; width: auto; flex: 0 0 auto; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__action-row { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "cost" "options" "submit" "status"; border-top: 1px solid var(--sc-color-border); padding-top: 10px; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__action-row .home-chat__toolbar { grid-area: options; display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__action-row .home-chat__submit { grid-area: submit; margin: 0; padding: 0; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__action-row .home-chat__status { grid-area: status; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__send { width: 100%; }
 .sc-app .home-chat[data-mode="audio"] #homeChatModelControl { width: auto; flex: 0 1 auto; }
 .sc-app .home-chat[data-mode="audio"] #homeChatModelButton, .sc-app .home-chat[data-mode="audio"] #homeChatModeButton { min-height: 42px; width: auto; padding: 0 12px; border-radius: var(--sc-radius-pill); font-size: 13px; background: var(--sc-color-well); }
 .sc-app .home-chat[data-mode="audio"] #homeChatModeLabel { white-space: nowrap; width: auto; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-fields { grid-row: 4; }
 .sc-app .home-chat[data-mode="audio"] #homeChatAudioOutputDisclosure { grid-row: 3; }
 .sc-app .home-task__audio-body > .sc-audio-player > .sc-audio-player__play { left: -56px; top: -22px; width: 36px; height: 36px; min-height: 36px; }
 .sc-app .home-task__audio-body { display: contents; }
 .sc-app .home-task__audio-title, .sc-app .home-task__audio-details, .sc-app .home-task__audio-body > .sc-audio-player { grid-column: 2; }
 .sc-app .home-task__audio-art { grid-column: 1; grid-row: 1 / 4; align-self: start; }
 .sc-app .home-task__audio-track-actions, .sc-app .home-task__audio-error { grid-column: 1 / -1; }
}
.sc-app .home-task__audio-track:has(.sc-audio-player) .home-task__audio-waveform { visibility: hidden; }
.sc-app .home-task__audio-track-actions .home-task__audio-download:has(svg), .sc-app .home-task__audio-extend { display: grid; place-items: center; width: 32px; height: 32px; min-height: 32px; padding: 0; border: 1px solid var(--sc-color-border); border-radius: 50%; background: var(--sc-color-surface); color: var(--sc-color-text); }
.sc-app .home-task__audio-extend { opacity: .5; cursor: not-allowed; }
.sc-app .home-task__audio-track-actions svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@media(max-width:767px) {
 .sc-app .home-task__audio-track-actions .home-task__audio-download:has(svg), .sc-app .home-task__audio-extend { width: 40px; height: 40px; min-height: 40px; }
 .sc-app .home-chat[data-mode="audio"] .home-chat__action-row > .home-chat__submit-summary { padding: 0; }
}

/* Revised 25: shared dropdown authoring mode and instrumental checkbox. */
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-options { align-items:end; gap:12px; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode { display:grid; gap:8px; padding:0; border:0; border-radius:0; background:none; }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode > span { font-size:12.5px; font-weight:600; color:var(--sc-color-text); }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode :is(select,.model-picker__trigger) { width:100%; height:42px; min-height:42px; background:var(--sc-color-well); border-radius:12px; }
.sc-app .home-chat[data-mode="audio"] .home-chat__switch-row { display:flex; justify-content:flex-start; align-items:center; gap:10px; height:42px; padding:0; border:0; border-radius:0; background:none; }
.sc-app .home-chat[data-mode="audio"] .home-chat__switch-row>span:first-child { text-align:left; }
.sc-app .home-chat[data-mode="audio"] .home-chat__switch-row small { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.sc-app .home-chat[data-mode="audio"] #homeChatAudioInstrumental { position:static; order:-1; opacity:1; width:18px; height:18px; margin:0; appearance:auto; accent-color:var(--sc-color-brand-500); }
.sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-fields { max-height:none; overflow:visible; }
@media(max-width:767px) { .sc-app .home-chat[data-mode="audio"] .home-chat__audio-mode { justify-content:stretch; } .sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-fields { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .sc-app .home-chat[data-mode="audio"] .home-chat__audio-custom-field--lyrics { grid-column:1/-1; } }

@media(max-width:767px) { .sc-app .home-chat[data-mode="audio"] .home-chat__audio-options { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } }