/* NEURO workspace layout. Shared identity tokens live in neuro-theme.css. */
:root {
  --sidebar-width: clamp(268.4px, 16.83vw, 323.4px);
  --home-width: 858px;
  --composer-padding: 15.4px;
  --menu-shadow: 0 0 24px 4px #0005;
  --menu-radius: 12px;
  --menu-item-radius: 1098.9px;
  --menu-heading-color: var(--muted);
  --menu-accent-color: var(--accent);
  --menu-description-color: #a1a596;
}
:root[data-theme="light"] {
  --menu-shadow: 0 0 24px 2px #0003;
  --menu-accent-color: #50601f;
  --menu-description-color: #626956;
}
.sidebar-top { padding: 22px 19.8px 0; }
.sidebar-heading { gap: 2px; margin-bottom: 26.4px; }
.sidebar-heading .brand { padding: 0; min-height: 46.2px; flex: 1; justify-content: flex-start; }
.sidebar-heading .brand-wordmark { display: block; width: 152.9px; height: auto; }
.sidebar-heading .brand-mark { display: none; background: none; border-radius: 0; }
.is-compact .sidebar-heading .brand-mark { display: block; width: 33px; height: 33px; }
.is-compact .sidebar-heading .brand-wordmark { display: none; }
:root[data-theme="light"] .brand-wordmark { content: url("/assets/brand/neuro-wordmark-dark.svg"); }
.sidebar-heading .nav-search-toggle, .sidebar-fold { display: grid; place-items: center; min-width: 35.2px; width: 35.2px; height: 35.2px; padding: 4px; margin: 0; }
.sidebar-heading :is(.nav-search-toggle, .sidebar-fold) svg { display: block; flex: none; }
.nav-plus-icon { display: block; width: 20px; height: 20px; flex: none; }
.sidebar-section-heading #add-project, .project-heading .project-plus { display: grid; place-items: center; }
.workspace-sidebar .new-work, .workspace-sidebar .side-nav, .sidebar-section-heading .section-toggle {
  text-transform: uppercase; letter-spacing: .065em; font-size: 12.1px;
}
.workspace-sidebar .new-work, .workspace-sidebar .side-nav { padding: 8.8px; min-height: 44px; border: 0; gap: 10px; line-height: 1.5; }
.workspace-sidebar :is(.new-work, .side-nav) > svg { display: block; flex: none; width: 20px; height: 20px; }
.workspace-sidebar .new-work .nav-label { font-size: 12.1px; font-weight: 400; }
.sidebar-bottom > .theme-toggle { display: grid; place-items: center; width: 46px; min-height: 46px; padding: 10px; border-radius: 50%; color: var(--secondary); }
.sidebar-bottom > .theme-toggle svg { display: block; width: 26px; height: 26px; }
.sidebar-bottom > .theme-toggle:hover { background: var(--hover); color: var(--text); }
.is-compact .sidebar-bottom > .theme-toggle { margin-inline: auto; }
.neuro-media-toolbar#media-toolbar { align-items: center; gap: 8px; margin-bottom: 24px; min-height: 44px; }
.board-toolbar#media-toolbar { flex-wrap: nowrap; }
.board-toolbar .thread-heading { flex: 1; min-width: 0; gap: 10px; justify-content: flex-start; margin: 0; }
.board-toolbar .thread-heading > div:first-child { min-width: 0; }
.board-toolbar .thread-heading h1 { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 20px; font-weight: 400; text-transform: uppercase; letter-spacing: .04em; }
.board-toolbar .workspace-kind { display: none; }
.board-toolbar .thread-controls button { border-radius: 50%; width: 36px; height: 36px; padding: 0; }
.neuro-media-toolbar#media-toolbar #media-search { flex: 0 1 200px; width: 200px; min-width: 100px; min-height: 40px; padding: 8px 14px; border-radius: 999px; font-size: 11px; }
.neuro-media-toolbar :is(.board-sort-toggle, .board-filter-toggle) { display: grid; place-items: center; position: relative; flex: none; width: 40px; height: 40px; padding: 0; border-radius: 50%; }
.neuro-media-toolbar .filter-count { position: absolute; right: -3px; top: -3px; display: grid; place-items: center; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: var(--accent); color: var(--on-accent); font-size: 10px; }
.board-filter-dialog { width: min(520px,calc(100vw - 24px)); border-radius: 24px; padding: 24px; }
.board-filter-dialog h2 { font-size: 17px; text-transform: uppercase; letter-spacing: .04em; }
.board-filter-dialog .media-filter-fields { position: static; width: 100%; max-height: none; border: 0; box-shadow: none; padding: 16px 0; }
.board-filter-dialog .media-filter-fields :is(label,input,select) { min-width: 0; width: 100%; }
.board-filter-dialog :is(input,select,button) { min-height: 40px; border-radius: 16px; }
.board-filter-dialog > .primary { border-radius: 999px; width: 100%; }
.board-workspace > .thread-heading h1 { font-size: 20px; text-transform: uppercase; letter-spacing: .04em; }
.library-navigation { align-items: center; gap: 8px; }
.library-navigation button { min-height: 40px; border-radius: 999px; padding: 10px 16px; font-size: 11px; }
.library-tabs { display: inline-flex; align-items: center; gap: 2px; max-width: 100%; padding: 4px; border-radius: 999px; background: var(--inset); }
.library-tabs button { white-space: nowrap; background: transparent; color: var(--secondary); }
.library-tabs [aria-current="page"] { background: var(--surface); color: var(--text); box-shadow: 0 1px 4px var(--shadow); }
.library-navigation #media-upload { display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin-left: auto; background: var(--accent); color: var(--on-accent); }
.library-navigation #media-upload:hover:not(:disabled) { background: var(--accent-hover); }
.library-toolbar#media-toolbar { flex-wrap: wrap; }
.library-toolbar#media-toolbar #media-search { flex: 1 1 180px; width: auto; }
.library-toolbar .library-project-filter { min-width: 0; max-width: min(220px,45%); }
.library-toolbar .library-project-filter .project-picker { min-height: 40px; padding: 10px 16px; border-radius: 999px; font-weight: 400; background: var(--surface); color: var(--text); }
.library-toolbar .project-picker-label { min-width: 0; }
.library-toolbar .library-scale { display: flex; flex-direction: row; align-items: center; gap: 8px; margin: 0; }
.library-toolbar .library-scale input { width: 90px; margin: 0; padding: 0; accent-color: var(--accent); }
.library-toolbar #media-summary { flex-basis: 100%; margin: 4px 0 0; font-size: 10px; }
:is(.library-toolbar,.neuro-media-dialog,.floating-selection) .project-select-menu { border-radius: var(--menu-radius); padding: 12px; border: 1px solid var(--line); }
:is(.library-toolbar,.neuro-media-dialog,.floating-selection) .project-select-menu input { min-height: 44px; border: 1px solid var(--line-strong); border-radius: var(--menu-item-radius); padding: 10px 14px; }
:is(.library-toolbar,.neuro-media-dialog,.floating-selection) .project-select-menu button { min-height: 44px; border-radius: var(--menu-item-radius); }
/* Shared board/library selection remains an overlay above the composer. */
.floating-selection.media-selection { padding: 12px; gap: 8px; border: 1px solid var(--line); border-radius: 24px; background: var(--surface); color: var(--text); box-shadow: 0 12px 36px var(--shadow); font-size: 12px; }
.floating-selection .selection-count { display: inline-flex; align-items: center; gap: 10px; padding: 0 8px; min-height: 40px; white-space: nowrap; color: var(--secondary); }
.floating-selection .selection-count strong { display: grid; place-items: center; min-width: 28px; height: 28px; padding: 0 8px; border-radius: 999px; background: var(--accent); color: var(--on-accent); }
.floating-selection.media-selection button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 9px 16px; border: 0; border-radius: 999px; font-size: 12px; font-weight: 400; line-height: 1.5; background: var(--inset); color: var(--text); }
.floating-selection.media-selection button:hover:not(:disabled) { background: var(--hover); }
.floating-selection.media-selection button.primary { background: var(--accent); color: var(--on-accent); }
.floating-selection.media-selection button.primary:hover:not(:disabled) { background: var(--accent-hover); }
.floating-selection .selection-project { display: flex; align-items: center; gap: 6px; min-width: 0; max-width: 100%; }
.floating-selection .project-select { min-width: 0; max-width: 220px; }
.floating-selection .project-picker { max-width: 100%; }
.floating-selection .project-picker-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.floating-selection.media-selection .selection-clear { width: 40px; flex: none; padding: 0; margin-left: auto; color: var(--secondary); }
.floating-selection.media-selection .selection-trash { color: #ffb4ab; }
:root[data-theme="light"] .floating-selection.media-selection .selection-trash { color: #a32626; }
.floating-selection.media-selection .project-select-menu button { justify-content: flex-start; border-radius: var(--menu-item-radius); min-height: 44px; background: transparent; }
.floating-selection.media-selection .project-select-menu button[aria-pressed="true"] { background: var(--selected); color: var(--selected-text); }
@media (max-width: 700px) {
  .floating-selection.media-selection { padding: 10px; gap: 8px; }
  .floating-selection.media-selection > * { order: 2; }
  .floating-selection .selection-count { order: 0; flex: 1 1 calc(100% - 52px); }
  .floating-selection.media-selection .selection-clear { order: 1; width: 44px; min-height: 44px; }
  .floating-selection.media-selection button { min-height: 44px; padding-inline: 14px; }
  .floating-selection .selection-project { max-width: 100%; }
}
.neuro-media-dialog { border-radius: 24px; }
.neuro-media-dialog h2 { margin: 0; font-size: 17px; line-height: 1.5; text-transform: uppercase; letter-spacing: .04em; }
.neuro-media-dialog > header > button { display: grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; border-radius: 50%; background: var(--inset); color: var(--secondary); font-size: 20px; }
.neuro-media-dialog :is(input,select) { background: var(--inset); color: var(--text); border: 1px solid var(--line); border-radius: 16px; }
.neuro-media-dialog button { font-weight: 400; }
.neuro-media-dialog button:hover:not(:disabled) { background: var(--hover); }
.neuro-media-dialog button.primary:hover:not(:disabled) { background: var(--accent-hover); }
dialog#attachment-dialog { border-radius: 24px; }
#attachment-dialog > header { padding: 20px 24px 16px; }
#attachment-dialog :is(.attachment-toolbar,.attachment-filters) { padding-inline: 24px; gap: 8px; }
#attachment-dialog .attachment-tabs { padding: 4px; border-radius: 999px; background: var(--inset); gap: 2px; }
#attachment-dialog .attachment-tabs button { min-height: 36px; border-radius: 999px; padding: 8px 14px; background: transparent; color: var(--secondary); font-weight: 400; }
#attachment-dialog .attachment-tabs [aria-selected="true"] { background: var(--surface); color: var(--text); box-shadow: 0 1px 4px var(--shadow); font-weight: 400; }
#upload-new-image { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border-radius: 999px; padding: 10px 16px; }
#attachment-dialog :is(#refresh-files,#attachment-sort-toggle,#attachment-date-toggle,#attachment-reset) { display: grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; border-radius: 50%; background: var(--inset); }
#attachment-dialog #attachment-date-toggle.active { background: var(--selected); color: var(--selected-text); }
#attachment-dialog .attachment-search input { height: 40px; padding: 10px 14px; border-radius: 999px; }
#attachment-dialog .project-select { min-width: 0; max-width: 180px; }
#attachment-dialog .project-picker { min-height: 40px; padding: 10px 16px; border-radius: 999px; background: var(--inset); color: var(--text); font-weight: 400; }
#attachment-dialog .attachment-filter-popover { padding: 16px; border-radius: var(--menu-radius); background: var(--surface); border-color: var(--line); }
#attachment-dialog .attachment-date-range { gap: 12px; }
#attachment-dialog .attachment-date-range input { min-height: 40px; padding: 8px; }
#attachment-dialog .attachment-date-range small { grid-column: 1 / -1; color: var(--muted); font-size: 10px; line-height: 1.6; }
#attachment-dialog .catalog-popover { border-radius: var(--menu-radius); padding: 8px; background: var(--surface); border-color: var(--line); }
#attachment-dialog .catalog-popover button { min-height: 40px; border-radius: var(--menu-item-radius); }
#attachment-dialog :is(.attachment-hint,.attachment-status) { padding-inline: 24px; font-size: 11px; line-height: 1.6; }
#attachment-dialog #attachment-content { padding: 8px 24px 20px; }
#attachment-dialog .attachment-card { padding: 0; border: 0; border-radius: 18px; overflow: hidden; background: var(--inset); gap: 0; }
#attachment-dialog .attachment-card > img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; border-radius: 18px; }
#attachment-dialog .attachment-card > span:not(.feed-status) { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; padding: 8px 10px; font-size: 10px; line-height: 1.5; }
#attachment-dialog .attachment-footer { padding: 12px 24px; }
#attachment-dialog .attachment-footer .pages button { min-width: 40px; min-height: 40px; border-radius: 50%; padding: 0; background: var(--inset); }
#library-preview .actions button { min-height: 44px; padding: 10px 18px; border-radius: 999px; }
.image-upload-dialog { width: min(640px,calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 24px; overflow-y: auto; }
.image-upload-dialog > header { margin-bottom: 20px; }
.image-upload-dialog button { min-height: 40px; border-radius: 999px; padding: 10px 16px; }
.image-upload-dialog button.primary { background: var(--accent); color: var(--on-accent); }
.upload-dropzone { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 24px 16px; border: 1px dashed var(--line-strong); border-radius: 24px; background: var(--inset); text-align: center; transition: border-color .15s, background .15s; }
.upload-dropzone.dragging { border-color: var(--text); background: var(--selected); }
.upload-dropzone p { margin: 0; font-size: 13px; }
.upload-dropzone button { display: inline-flex; align-items: center; gap: 8px; }
.upload-dropzone small, .upload-hint, .upload-notice, .upload-summary { font-size: 11px; line-height: 1.7; color: var(--secondary); }
.upload-hint { margin: 14px 0; }
.upload-queue { margin: 0; padding: 0; list-style: none; max-height: min(320px,40dvh); overflow-y: auto; overscroll-behavior: contain; }
.upload-queue li { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); }
.upload-thumbnail { width: 56px; height: 56px; flex-shrink: 0; object-fit: contain; border-radius: 12px; background: var(--inset); }
.upload-placeholder { display: grid; place-items: center; color: var(--muted); font-size: 24px; }
.upload-file-description { flex: 1; min-width: 0; font-size: 11px; line-height: 1.6; }
.upload-filename { display: block; overflow-wrap: anywhere; }
.upload-file-description small { color: var(--muted); font-size: 10px; }
.upload-file-description p { margin: 2px 0 0; }
.upload-error { color: var(--danger); }
:root[data-theme="light"] .upload-error { color: #a32626; }
.upload-row-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; }
.upload-row-actions button { font-size: 11px; }
.image-upload-dialog .upload-remove { width: 40px; padding: 0; font-size: 20px; }
.upload-footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; padding-top: 16px; }
.upload-close-confirm { padding: 12px; margin-top: 12px; border-radius: 16px; background: var(--inset); font-size: 12px; }
.upload-close-confirm button { margin: 4px; }
@media (max-width: 700px) {
  .library-navigation button { min-height: 44px; }
  .library-tabs { width: 100%; }
  .library-tabs button { flex: 1; padding-inline: 8px; }
  .library-navigation #media-upload { margin-left: 0; }
  .image-upload-dialog { padding: 16px; }
  .image-upload-dialog button { min-height: 44px; }
  .image-upload-dialog .upload-remove { width: 44px; }
  .upload-queue li { flex-wrap: wrap; gap: 8px; }
  .upload-file-description { flex-basis: calc(100% - 72px); }
  .upload-row-actions { width: 100%; }
  .library-toolbar#media-toolbar #media-search { flex-basis: calc(100% - 104px); min-height: 44px; order: -3; }
  .library-toolbar .board-sort-toggle { order: -2; }
  .library-toolbar .board-filter-toggle { order: -1; }
  .library-toolbar .library-project-filter { max-width: 55%; }
  .library-toolbar .library-scale { margin-left: auto; }
  .library-toolbar .library-scale input { width: 72px; }
  .library-toolbar .library-project-filter .project-picker { min-height: 44px; }
  #attachment-dialog > header { padding: 16px; }
  #attachment-dialog :is(.attachment-toolbar,.attachment-filters,.attachment-hint,.attachment-status) { padding-inline: 16px; }
  #attachment-dialog .attachment-filters { flex-wrap: wrap; }
  #attachment-dialog .attachment-search { flex-basis: 100%; }
  #attachment-dialog :is(.attachment-search input,.project-picker,.attachment-tabs button,.project-select-menu button) { min-height: 44px; }
  #attachment-dialog .project-select { flex: 1; max-width: none; }
  #attachment-dialog .project-picker { max-width: 100%; }
  #attachment-dialog :is(#refresh-files,#attachment-sort-toggle,#attachment-date-toggle,#attachment-reset),.neuro-media-dialog > header > button { width: 44px; height: 44px; }
  #attachment-dialog #attachment-content { padding-inline: 16px; }
  #attachment-dialog .attachment-footer { padding: 12px 16px; }
  #attachment-dialog .attachment-footer .hint { display: none; }
  #attachment-dialog .attachment-footer .pages { margin-left: auto; }
  #attachment-dialog .attachment-footer .pages button { min-width: 44px; min-height: 44px; }
}
.workspace-settings-dialog { width: min(480px,calc(100vw - 24px)); padding: 24px; border-radius: 24px; }
.workspace-settings-dialog > header { margin-bottom: 24px; gap: 12px; }
.workspace-settings-dialog h2 { margin: 0; font-size: 17px; line-height: 1.5; text-transform: uppercase; letter-spacing: .04em; }
.workspace-settings-dialog > header > button { display: grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; border-radius: 50%; font-size: 20px; color: var(--secondary); background: var(--inset); }
.workspace-settings-dialog .settings-field { display: flex; flex-direction: column; gap: 8px; min-width: 0; margin: 0 0 20px; font-size: 12px; color: var(--secondary); }
.workspace-settings-dialog #settings-name { width: 100%; min-width: 0; min-height: 48px; padding: 12px 16px; border: 1px solid var(--line-strong); border-radius: 16px; background: var(--inset); color: var(--text); font-size: 14px; }
.workspace-settings-dialog #settings-name::placeholder { color: var(--muted); opacity: 1; }
.workspace-settings-dialog .project-picker { min-height: 44px; padding: 10px 18px; border-radius: 999px; background: var(--inset); color: var(--text); font-weight: 400; }
.workspace-settings-dialog .project-picker:hover, .workspace-settings-dialog > header > button:hover { background: var(--hover); }
.workspace-settings-dialog .project-select-menu { border: 1px solid var(--line); border-radius: var(--menu-radius); padding: 12px; }
.workspace-settings-dialog .project-select-menu input { min-height: 44px; border: 1px solid var(--line-strong); border-radius: var(--menu-item-radius); padding: 10px 14px; }
.workspace-settings-dialog .project-select-menu button { min-height: 44px; border-radius: var(--menu-item-radius); }
.workspace-settings-dialog .actions { justify-content: flex-end; gap: 8px; margin-top: 24px; }
.workspace-settings-dialog .actions button { min-height: 44px; padding: 10px 20px; border-radius: 999px; }
.workspace-settings-dialog .actions button:not(.primary) { background: var(--inset); color: var(--secondary); }
.workspace-settings-dialog .actions button:not(.primary):hover { background: var(--hover); color: var(--text); }
.workspace-settings-dialog .settings-error { color: var(--danger); font-size: 12px; line-height: 1.6; }
@media (max-width: 600px) {
  .workspace-settings-dialog { padding: 20px; }
  .workspace-settings-dialog > header > button { width: 44px; height: 44px; }
  .workspace-settings-dialog #settings-name { font-size: 16px; }
}
.board-workspace .feed-request { background: var(--surface); border-radius: 24px; padding: 8px; }
.board-workspace .feed-image { background: var(--inset); border-radius: 18px; }
.board-workspace :is(.feed-image-open, .feed-image-open img, .feed-result-clip) { border-radius: 18px; }
.board-workspace .feed-fade { background: linear-gradient(transparent,var(--surface)); }
.board-workspace .feed-tags > span:not(.model-logo) { background: var(--inset); color: var(--secondary); border-radius: 999px; padding: 3px 8px; }
.board-workspace .feed-prompt { line-height: 1.7; font-weight: 400; }
.board-workspace .feed-status[data-status="failed"], .board-workspace .feed-status[data-status="needs_review"] { color: var(--danger); }
.feed-navigation button { background: var(--surface); color: var(--text); border-color: var(--line); }
.feed-navigation button:hover { background: var(--hover); }
.board-workspace .feed-check input:checked::after { border-color: var(--on-accent); }
.feed-status.generation-progress { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 18px; width: 100%; min-height: 120px; color: var(--secondary); text-align: center; }
.generation-progress > span:last-child { max-width: 240px; font-size: 11px; line-height: 1.7; }
.generation-mark { display: block; flex: none; width: 48px; height: 48px; background: var(--accent); mask: url('/assets/brand/neuro-mark-lime.svg') center / contain no-repeat; }
:root[data-theme="light"] .generation-mark { background: var(--text); }
.composer #submit .generation-mark { width: 23px; height: 23px; background: currentColor; }
@media (prefers-reduced-motion: no-preference) {
  .generation-mark { animation: neuro-generation-impulse 1800ms cubic-bezier(.2,.75,.25,1) infinite; }
}
@keyframes neuro-generation-impulse {
  0% { transform: rotate(0) scale(1); }
  12.5% { transform: rotate(38deg) scale(.92); }
  25%,100% { transform: rotate(90deg) scale(1); }
}
@media (max-width: 700px) {
  .board-toolbar#media-toolbar { flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
  .board-toolbar .thread-heading { flex-basis: 100%; margin-bottom: 4px; }
  .board-toolbar .thread-heading h1 { font-size: 17px; }
  .board-toolbar#media-toolbar #media-search { flex: 1; min-height: 44px; }
  .neuro-media-toolbar :is(.board-sort-toggle, .board-filter-toggle) { width: 44px; height: 44px; }
}
.accepted-notice { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; padding: 10px 14px; margin: 0 0 20px; background: var(--message); border-radius: 14px; font-size: 12px; }
.accepted-notice a { text-decoration: underline; text-underline-offset: 3px; }
.accepted-notice button { margin-left: auto; min-width: 36px; min-height: 36px; padding: 0; font-size: 22px; background: transparent; }
.workspace-mobile-header .brand-wordmark { display: block; width: 127.6px; height: 35.2px; }
.sidebar-scroll { padding: 8.8px 19.8px; }
.workspace-row .work-link { font-size: 12.1px; line-height: 1.7; }
.project-row-toggle { font-size: 12.1px; }
.workspace-layout > .home-workspace { padding-top: clamp(59.4px, 22vh, 242px) !important; padding-bottom: 52.8px; }
.home-heading {
  margin: 0 0 52.8px; font-size: clamp(28.6px, 3.3vw, 57.2px); height: 1.3em;
  display: flex; flex-direction: column; justify-content: flex-end;
}
.home-heading h1 {
  font-size: inherit; line-height: 1.3; letter-spacing: .075em;
  text-transform: uppercase; font-weight: 400; margin: 0; flex: none; width: 100%;
}
.home-heading h1::after { content: ""; display: inline-block; height: 1.15em; border-right: 1px solid var(--text); margin-left: 9.9px; vertical-align: -.15em; }
.home-workspace .mode-switch {
  display: flex; flex-wrap: wrap; width: fit-content; max-width: 100%; justify-content: center;
  gap: 0; padding: 3px; margin: 0 auto 44px; border-radius: 1098.9px;
  background: var(--surface);
}
.mode-switch > button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6.6px;
  width: auto; min-height: 39.6px; border-radius: 1098.9px; padding: 7.7px 14.3px;
  font-size: 11px; font-weight: 400; text-transform: uppercase; letter-spacing: .025em;
}
.mode-switch > button[aria-pressed="true"] { background: var(--accent); color: var(--on-accent); }
.mode-switch > button:disabled { opacity: .6; }
.mode-switch .more-modes { flex: initial; width: auto; }
.mode-switch svg { width: 21px; height: 21px; flex: none; }
.home-workspace .composer-project {
  width: 100%; max-width: var(--home-width); margin: 0 auto 11px;
  padding: 0 var(--composer-padding); display: flex; justify-content: flex-end;
}
.composer-project .project-select { min-width: 0; max-width: 100%; }
.composer-project .project-picker {
  min-height: 37.4px; max-width: 100%; padding: 7.7px 14.3px; border-radius: 1098.9px;
  background: var(--inset); color: var(--secondary); font-size: 11px; letter-spacing: .04em;
}
.composer-project .project-picker-label { max-width: 286px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.home-workspace .composer { max-width: var(--home-width); margin: 0 auto; }
.composer { border-radius: 26.4px; padding: var(--composer-padding) var(--composer-padding) 11px; box-shadow: 0 13.2px 35.2px #0002; }
.composer .composer-resize { position: absolute; top: 0; left: 50%; width: 72px; margin: 0; transform: translateX(-50%); z-index: 1; }
.composer .prompt-entry { display: grid; grid-template-columns: minmax(0,1fr) auto; column-gap: 8.8px; align-items: start; margin-bottom: 8.8px; }
.composer .prompt-entry textarea { grid-row: 1; grid-column: 1; min-width: 0; padding: 11px 8.8px 8.8px; border-radius: 14px; font-size: 13.2px; margin: 0; min-height: 0; height: auto; }
.composer .prompt-entry textarea:focus { outline: none; box-shadow: none; border: 0; }
.composer .prompt-entry.has-attachment textarea { grid-column: 2; }
.composer .prompt-entry.has-attachment { grid-template-columns: auto minmax(0,1fr) auto; min-height: 60px; }
.composer .keep-prompt { position: static; grid-row: 1; grid-column: -2 / -1; margin-top: 1px; width: 30.8px; opacity: .6; }
.composer .keep-prompt:hover, .composer .keep-prompt:focus-visible, .composer .keep-prompt[aria-pressed="true"] { opacity: 1; }
.prompt-attachments { grid-row: 1; grid-column: 1; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; }
.composer .prompt-entry.has-source { grid-template-columns: minmax(0,1fr) auto; }
.composer .prompt-entry.has-source .prompt-attachments { grid-column: 1 / -1; margin-bottom: 10px; }
.composer .prompt-entry.has-source textarea { grid-row: 2; grid-column: 1; }
.composer .prompt-entry.has-source .keep-prompt { grid-row: 2; grid-column: 2; }
.prompt-attach { display: grid; place-items: center; border: 1px dashed var(--muted); background: transparent; border-radius: 7.7px; width: 41.8px; height: 41.8px; padding: 0; font-size: 22px; }
.composer .send-row { gap: 6.6px; min-height: 39.6px; }
.composer-tools { order: 2; }
.composer-size-controls { flex-wrap: wrap; min-width: 0; gap: 5.5px; }
.composer .send-action { order: 3; gap: 8.8px; }
.composer .workspace-model-trigger#pick-model,
.composer-size-controls .catalog-menu > button,
.composer-size-controls #show-generation-settings,
.send-action .catalog-menu > button {
  min-height: 35.2px; border: 0; box-shadow: none; border-radius: var(--menu-item-radius); background: var(--inset);
  padding: 6.6px 11px; font-size: 11px; font-weight: 400;
}
.composer-size-controls #show-generation-settings { min-width: 35.2px; }
.composer-size-controls .catalog-menu > button { max-width: 187px; }
.composer-size-controls .catalog-menu > button > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.composer .workspace-model-setting, .composer .workspace-model-trigger#pick-model { max-width: 231px; }
.composer .model-caption small { display: none; }
.composer .model-caption b { font-size: 11px; font-weight: 400; }
.composer .model-brand { width: 17.6px; height: 17.6px; min-width: 17.6px; background: none; }
.composer .model-brand .model-logo { width: 17.6px; height: 17.6px; }
.send-action .catalog-menu > button { display: flex; align-items: center; gap: 3px; width: auto; }
.composer #submit { width: 39.6px; height: 39.6px; min-width: 39.6px; min-height: 39.6px; background: var(--accent); color: var(--on-accent); }
.composer #submit:hover:not(:disabled) { background: var(--accent-hover); }
.composer #estimate { max-width: 143px; font-size: 11px; line-height: 1.4; }
.catalog-popover.viewport-menu {
  position: fixed; inset: auto; margin: 0; width: 240px;
  border-radius: var(--menu-radius); padding: 8px; color: var(--text);
  background: var(--surface); border: 1px solid var(--line);
  box-shadow: var(--menu-shadow); overflow-y: auto; overscroll-behavior: contain;
}
.catalog-popover.viewport-menu button { min-height: 44px; border-radius: var(--menu-item-radius); }
.menu-heading { padding: 8px 12px 12px; margin-bottom: 4px; border-bottom: 1px solid var(--line); color: var(--menu-heading-color); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.menu-heading, .model-picker-heading, [popover] :is(h1, h2, h3, h4, h5, h6) { text-transform: uppercase; letter-spacing: .065em; }
.composer-settings-dialog #model-parameters > .catalog-menu { grid-column: 1 / -1; }
.composer-settings-dialog .catalog-menu > button { width: 100%; height: auto; min-height: 44px; padding: 10px 14px; border-radius: 16px; background: var(--inset); font-size: 13px; white-space: normal; text-align: left; }
.model-picker-heading { margin: 0 0 6px; color: var(--menu-heading-color); font-size: 11px; }
.neuro-tooltip {
  position: fixed; inset: auto; margin: 0; width: max-content; max-width: 280px;
  padding: 10px 14px; border: 1px solid var(--line-strong); border-radius: 14px;
  background: var(--surface); color: var(--text); box-shadow: 0 8px 24px #0003;
  font: 400 11px/1.5 "JetBrains Mono", monospace; overflow-wrap: anywhere;
}
.neuro-tooltip::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 50%; background: var(--accent); vertical-align: 1px; }
/* Touch hints must not swallow the next tap on a control beneath them. */
@media (hover: none) { .neuro-tooltip { pointer-events: none; } }
.workspace-notices { position: fixed; top: 20px; right: 20px; z-index: 90; width: min(420px,calc(100vw - 24px)); display: grid; gap: 8px; max-height: 45dvh; overflow-y: auto; pointer-events: none; }
.workspace-notice { position: relative; padding: 14px 44px 14px 16px; border: 1px solid var(--line-strong); border-radius: 16px; background: var(--surface); color: var(--text); box-shadow: var(--menu-shadow); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; pointer-events: auto; }
.workspace-notice :is(p,#form-status,.enhance-notice) { margin: 0; padding: 0; color: inherit; font-size: inherit; }
.workspace-notice button { padding: 7px 10px; margin-top: 8px; border-radius: 12px; min-height: 36px; font-size: 11px; }
.workspace-notice .notice-close { position: absolute; right: 4px; top: 4px; margin: 0; width: 36px; font-size: 22px; border: 0; background: transparent; }
.workspace-notice .pending-actions { margin: 0; padding: 0; border: 0; background: none; display: flex; flex-wrap: wrap; gap: 4px; }
.submit-control { display: inline-flex; flex: none; border-radius: 50%; }
.submit-control:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.submit-control button:disabled { pointer-events: none; }
.composer #submit:disabled { opacity: .25; }
.composer { --composer-error: var(--accent); }
:root[data-theme="light"] .composer { --composer-error: #50601f; }
.composer [aria-invalid="true"] { outline: 2px solid var(--composer-error); outline-offset: 2px; }
.composer .prompt-entry textarea[aria-invalid="true"], .composer .prompt-entry textarea[aria-invalid="true"]:focus { outline: 2px solid var(--composer-error); outline-offset: -2px; }
.composer .composer-tools > button { min-width: 30.8px; min-height: 35.2px; }
.home-workspace > #page-status:empty { display: none; }
.home-templates { width: 100%; max-width: 990px; margin: 63.8px auto 0; }
.home-templates > header { text-align: center; margin-bottom: 24.2px; }
.home-templates h2 { display: inline-block; background: var(--surface); border-radius: 1098.9px; padding: 8.8px 17.6px; font-size: 12.1px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 9.9px; }
.home-template-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15.4px; }
.home-template { position: relative; padding: 0; border-radius: 26.4px; overflow: hidden; aspect-ratio: 1.25; background: var(--surface); text-align: left; }
.home-template > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.home-template > span { position: absolute; bottom: 0; left: 0; width: 100%; padding: 30.8px 15.4px 14.3px; color: #fff; background: linear-gradient(transparent,#000b); font-size: 11px; text-transform: uppercase; letter-spacing: .035em; }
.template-arrow { float: right; font-size: 15.4px; }
@media (prefers-reduced-motion: no-preference) {
  .home-template img { transition: transform 220ms ease; }
  .home-template:hover img { transform: scale(1.04); }
  .mode-switch > button, .composer button, .project-picker { transition: background-color 140ms ease, color 140ms ease; }
}
@container home (max-width: 600px) {
  .home-template-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 1100px) {
  .workspace-layout > .home-workspace { padding-top: 77px !important; }
  .home-heading { margin-bottom: 33px; }
  .home-workspace .mode-switch { margin-bottom: 33px; }
  .home-template-grid { gap: 11px; }
  .composer .send-action { flex: initial; width: auto; }
}
@media (max-width: 700px) {
  :root { --composer-padding: 13.2px; }
  .workspace-layout > .home-workspace { padding-top: 33px !important; }
  .navigation-dialog .sidebar-heading { display: flex; margin: 0 0 8.8px; justify-content: flex-end; }
  .navigation-dialog .sidebar-heading .brand, .navigation-dialog .sidebar-fold { display: none; }
  .navigation-dialog .nav-search-toggle { display: inline-flex; align-items: center; gap: 8.8px; width: auto; min-height: 48.4px; padding: 8.8px; }
  .navigation-dialog .nav-search-toggle::after { content: "Поиск"; font-size: 12.1px; }
  .home-heading h1 { letter-spacing: .03em; }
  .home-heading { margin-bottom: 26.4px; font-size: clamp(24.2px,7.15vw,37.4px); height: 2.6em; }
  .home-workspace .mode-switch { border-radius: 26.4px; margin-bottom: 24.2px; }
  .mode-switch > button { min-height: 48.4px; padding: 7.7px 13.2px; }
  .composer-project .project-picker { min-height: 48.4px; }
  .composer .send-row { gap: 8.8px; }
  .composer .send-action { gap: 8.8px; }
  .composer-size-controls { flex: 1 1 100%; }
  .composer .workspace-model-setting { max-width: min(253px,100%); }
  .composer .workspace-model-trigger#pick-model, .composer-size-controls .catalog-menu > button, .composer-size-controls #show-generation-settings, .send-action .catalog-menu > button, .composer .composer-tools > button { min-height: 48.4px; min-width: 48.4px; }
  .composer #submit { min-height: 48.4px; min-width: 48.4px; }
  .composer .prompt-entry.has-attachment { min-height: 67px; }
  .prompt-attach { width: 48.4px; height: 48.4px; }
  .composer .keep-prompt { width: 35.2px; min-height: 48.4px; }
  .home-templates { margin-top: 37.4px; }
  .home-template-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-template { border-radius: 22px; }
  .home-template > span { padding-inline: 11px; font-size: 9.9px; }
}
@media (max-height: 800px) and (min-width: 1101px) {
  .workspace-layout > .home-workspace { padding-top: 77px !important; }
  .home-heading { margin-bottom: 33px; }
  .home-workspace .mode-switch { margin-bottom: 28.6px; }
  .home-templates { margin-top: 39.6px; }
}

/* All editable parameters stay in the composer; mobile mounts the same fields in a dialog. */
.composer-parameter {
  display: flex; flex-direction: row; align-items: center; gap: 6px; margin: 0;
  min-height: 35px; max-width: 100%; border-radius: 999px; padding: 6px 11px;
  background: var(--inset); font-size: 11px;
}
.composer-parameter > span { color: var(--secondary); max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.composer-parameter input { width: 65px; min-width: 0; margin: 0; padding: 0 3px; min-height: 23px; background: transparent; border: 0; font-size: 11px; }
.composer-parameter input[type=text] { width: 120px; }
.composer-size-controls { flex: 1 1 auto; }
.composer .send-action { margin-left: auto; }
.composer-settings-dialog { position: fixed; inset: 0; margin: auto; width: min(440px,calc(100% - 24px)); height: fit-content; max-height: calc(100dvh - 24px); padding: 18px; }
.composer-settings-dialog #model-parameters { display: grid; gap: 12px; }
.composer-settings-dialog .parameter-field { display: grid; gap: 6px; margin: 0; }
.composer-settings-dialog :is(input,select,button) { min-height: 44px; }
.composer-settings-dialog .output-count-options span { min-height: 44px; display: grid; place-items: center; }

/* Remaining shared surfaces: existing handlers, focus and top-layer placement stay intact. */
.neuro-dialog { border-radius: 24px; background: var(--surface); border-color: var(--line); }
:is(.confirm-action,#model-dialog,#details-dialog,.composer-settings-dialog) > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
:is(.confirm-action,#model-dialog,#details-dialog,.composer-settings-dialog) > header h2 { margin: 0; font-size: 17px; letter-spacing: .04em; text-transform: uppercase; }
:is(.confirm-action,#model-dialog,#details-dialog,.composer-settings-dialog) > header > button { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 50%; padding: 0; background: var(--inset); font-size: 20px; }
:is(.confirm-action,#model-dialog,#details-dialog,.composer-settings-dialog) :is(input,select,textarea) { border-radius: 16px; min-height: 44px; padding: 10px 14px; background: var(--inset); }
:is(.confirm-action,#model-dialog,#details-dialog,.composer-settings-dialog) :is(.confirm-actions,.catalog-controls,.actions) button { min-height: 44px; border-radius: 999px; padding: 10px 18px; }
.confirm-action { padding: 24px; width: min(480px,calc(100% - 24px)); }
.confirm-action [role="alert"] { color: var(--danger); overflow-wrap: anywhere; }
.confirm-action .danger-action { background: var(--inset); color: var(--danger); border-color: var(--line-strong); }
.action-popover[popover] { padding: 8px; border-radius: var(--menu-radius); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--menu-shadow); }
.action-popover button { min-height: 40px; border-radius: var(--menu-item-radius); padding: 10px 12px; }
dialog#model-dialog { padding: 0; border-radius: 24px; }
#model-dialog > header { padding: 20px 20px 0; }
#model-dialog > .hint, #model-dialog > [role="alert"] { margin: 0; padding: 12px 20px; }
#model-dialog .model-types { gap: 4px; margin-inline: 20px; padding: 4px; border-radius: 24px; background: var(--inset); }
#model-dialog .model-types button { min-height: 44px; border-radius: 999px; font-weight: 400; }
#model-dialog .model-types [aria-selected="true"] { background: var(--accent); color: var(--on-accent); }
#model-dialog .catalog-toolbar { background: var(--surface); padding: 12px 20px; gap: 12px; }
#model-dialog .catalog-controls > button, #model-dialog .catalog-menu > button { width: 44px; height: 44px; padding: 0; }
#model-dialog .catalog-results { padding: 0 14px 12px 20px; }
#model-dialog .catalog-controls .catalog-menu { position: static; }
#model-dialog .catalog-popover { right: 20px; width: min(250px,calc(100% - 40px)); border-radius: var(--menu-radius); padding: 8px; background: var(--surface); }
#model-dialog .catalog-popover button { min-height: 44px; border-radius: var(--menu-item-radius); }
#model-dialog .model-card { border-radius: 20px; border-color: var(--line); background: var(--inset); }
#model-dialog .model-card:hover { border-color: var(--line-strong); }
#model-dialog .model-card.selected { background: var(--selected); border-color: var(--line-strong); }
#model-dialog :is(.model-card-title strong,.price,.model-select), #model-dialog .developer-group > h3 { font-weight: 400; }
#model-dialog .model-badge { border-radius: 999px; background: var(--hover); color: var(--secondary); }
#model-dialog .model-badge.experimental { background: var(--warning-bg); color: var(--warning); }
#details-dialog { padding: 24px; width: min(680px,calc(100% - 24px)); }
#details-dialog :is(dt,dd) { overflow-wrap: anywhere; }
.composer-settings-dialog { border-radius: 24px; padding: 24px; }
.composer-settings-dialog .output-count-options span { border-radius: 999px; }
:is(.pending-list,.pending-actions,.state-notice,.accepted-notice) { border-radius: 20px; border: 1px solid var(--line-strong); background: var(--inset); color: var(--text); padding: 16px 20px; overflow-wrap: anywhere; }
:is(.pending-list,.pending-actions,.state-notice,.accepted-notice) :is(button,a) { border-radius: 999px; min-height: 44px; }
.pending-list summary { min-height: 44px; padding: 8px 0; }
.empty-state { border-radius: 24px; color: var(--secondary); }
.project-overview > header button { min-height: 44px; border-radius: 999px; }
.project-work-grid > a { border-radius: 24px; border-color: var(--line); }
.project-work-grid > a:hover { border-color: var(--line-strong); background: var(--hover); }
@media (max-width: 700px) {
  :is(#model-dialog,#details-dialog,.confirm-action,.composer-settings-dialog) { padding: 20px; }
  .action-popover button { min-height: 44px; }
  #model-dialog .catalog-toolbar { flex-wrap: wrap; }
  #model-dialog .catalog-controls { flex-wrap: wrap; }
  #model-dialog .catalog-controls > * { min-width: 0; }
  #model-dialog .catalog-controls button { padding-inline: 12px; }
}
.workspace-model-picker.model-tree { max-height: calc(100dvh - 24px); overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; pointer-events: none; }
.model-tree:popover-open { display: flex; gap: 4px; align-items: flex-start; }
.model-tree[data-side="left"] { justify-content: flex-end; }
.model-tree[data-side="left"] .model-tree-series { order: 1; }
.model-tree[data-side="left"][data-compact="false"] .model-series-next { transform: rotate(180deg); }
.model-tree-pane { display: flex; flex-direction: column; min-height: 0; min-width: 0; border: 1px solid var(--line); border-radius: var(--menu-radius); overflow: hidden; background: var(--surface); box-shadow: var(--menu-shadow); pointer-events: auto; }
.model-tree-pane[hidden] { display: none; }
.model-tree-series { flex: 0 0 224px; }
.model-tree-versions { flex: 0 0 392px; }
.model-tree-pane > header { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; padding: 4px 12px; border-bottom: 1px solid var(--line); min-height: 41px; }
.model-tree-pane h3 { flex: 1; min-width: 0; margin: 0; color: var(--menu-heading-color); font-size: 11px; font-weight: 400; line-height: 1.5; letter-spacing: .065em; overflow-wrap: anywhere; }
.model-tree-pane header button { min-width: 32px; min-height: 32px; border-radius: 50%; }
.model-tree .model-picker-list { display: flex; flex-direction: column; gap: 4px; flex: 1; min-height: 0; max-height: none; padding: 6px; scrollbar-width: thin; }
.model-tree .model-picker-list > button { flex: 0 0 auto; gap: 8px; min-height: 36px; padding: 3px 10px; border-radius: var(--menu-item-radius); font-weight: 400; line-height: 1.2; }
.model-tree-series .model-picker-list > button { display: grid; grid-template-columns: 22px minmax(0,1fr) auto; }
.model-tree-series .model-tree-copy { grid-column: 2; }
.model-tree-series .model-series-next { grid-column: 3; }
.model-tree .model-picker-list > button[aria-expanded="true"] { background: var(--inset); }
.model-tree .model-picker-list > button:is([aria-current="true"], [aria-checked="true"]) { background: var(--selected); }
.model-tree .model-picker-list > button[aria-disabled="true"] { color: var(--menu-description-color); cursor: default; }
.model-tree .model-picker-list > button:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.model-tree .model-picker-list b { font-size: 12px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.model-tree .model-picker-list small { margin-top: 0; font-size: 11px; line-height: 1.2; color: var(--menu-description-color); }
.model-tree .model-picker-list > button:is([aria-current="true"], [aria-checked="true"]) :is(b,.model-tree-check) { color: var(--menu-accent-color); }
.model-tree .model-picker-list :is(.model-tree-warning,.model-tree-reason) { color: var(--menu-accent-color); }
.model-tree .model-series-next { color: var(--menu-description-color); }
.model-tree .model-tree-copy { flex: 1; min-width: 0; }
.model-tree .model-brand { flex: 0 0 22px; width: 22px; height: 22px; background: none; }
.model-tree .model-brand .model-logo { width: 22px; height: 22px; }
.model-tree .model-picker-list .model-series-next, .model-tree .model-picker-list .model-tree-check { flex: 0 0 auto; margin-left: auto; }
.model-tree-summary { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.model-tree-warning { padding-top: 6px; }
.model-tree-reason { padding-top: 4px; }
.model-tree[data-compact="true"] .model-tree-pane { flex: 1 1 100%; }
.model-tree[data-compact="true"] .model-picker-list > button { min-height: 44px; }
.model-tree[data-compact="true"] .model-tree-pane > header { min-height: 49px; }
.model-tree[data-compact="true"] .model-tree-pane header button { min-height: 40px; min-width: 40px; }
.model-tree[data-compact="true"] .model-tree-versions > header h3 { order: -1; }
:is(.catalog-popover,.attachment-filter-popover,.action-popover,.project-select-menu,.sidebar-flyout), .account-menu > div { border: 1px solid var(--line); border-radius: var(--menu-radius); box-shadow: var(--menu-shadow); }
.catalog-popover:not([popover]), .catalog-popover:popover-open, .action-popover:popover-open { display: flex; flex-direction: column; gap: 4px; }
:is(.project-select-menu .project-select-options,.attachment-filter-popover) > button + button { margin-top: 4px; }
:is(.catalog-popover,.project-select-menu,.attachment-filter-popover) > button, .project-select-options > button { border-radius: var(--menu-item-radius); }
.project-select-menu > input, .project-select-menu > button, .project-select-options > button { width: 100%; min-height: 44px; padding: 10px 14px; border-radius: var(--menu-item-radius); }
.project-select-menu > input { margin-bottom: 4px; }
.project-select-menu > .project-create-option { margin: 0 0 4px; border-top: 0; text-align: left; color: var(--menu-accent-color); }
.catalog-popover button[aria-checked="true"] { color: var(--menu-accent-color); }
@media (prefers-reduced-motion: no-preference) {
  .model-tree:popover-open .model-tree-pane { animation: menu-enter 140ms ease-out; }
}
@media (max-width: 700px) {
  .composer .composer-size-controls { flex: 1 1 auto; }
  .composer .send-action { flex-wrap: wrap; }
}

/* Shared viewer: bounded recently viewed originals, previews in the strip. */
dialog.media-viewer { position: fixed; inset: 16px; margin: 0; padding: 0; width: calc(100vw - 32px); height: calc(100dvh - 32px); max-width: none; max-height: none; border: 1px solid var(--line); border-radius: 24px; background: var(--bg); color: var(--text); overflow: hidden; }
.media-viewer[open] { display: grid; grid-template-rows: auto minmax(0,1fr) auto; }
.media-viewer::backdrop { background: #000b; }
.media-viewer button { font: inherit; }
.media-viewer .viewer-header { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 8px 16px; border-bottom: 1px solid var(--line); background: var(--surface); }
.viewer-header > span:first-child { text-transform: uppercase; letter-spacing: .04em; font-size: 12px; }
.viewer-progress { flex: 1; min-width: 0; text-align: right; color: var(--muted); font-size: 10px; }
.media-viewer :is(.viewer-header,.viewer-toolbar,.viewer-navigation) > button { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--inset); color: var(--secondary); }
.media-viewer :is(.viewer-header,.viewer-toolbar,.viewer-navigation) > button:hover:not(:disabled) { background: var(--hover); color: var(--text); }
.media-viewer .viewer-toolbar > button:is([aria-pressed="true"],[aria-expanded="true"]) { background: var(--selected); color: var(--menu-accent-color); }
.media-viewer button:disabled { opacity: .35; cursor: default; }
.viewer-body { display: grid; grid-template-columns: minmax(0,1fr); position: relative; min-height: 0; overflow: hidden; }
.viewer-body.with-info { grid-template-columns: minmax(0,1fr) min(340px,35%); }
.viewer-stage { display: grid; place-items: center; position: relative; min-height: 0; min-width: 0; padding: 16px; overflow: hidden; touch-action: pan-y pinch-zoom; }
.viewer-retained-layer { grid-area:1/1; display:grid; place-items:center; width:100%; height:100%; min-height:0; min-width:0; }
.viewer-retained-layer[hidden] { display:none; }
.viewer-stage .viewer-original { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; object-fit: contain; user-select: none; -webkit-user-drag: none; }
.viewer-image-loading { position: absolute; bottom: 18px; padding: 8px 12px; border-radius: 999px; background: var(--surface); color: var(--secondary); font-size: 11px; }
.viewer-image-error { text-align: center; padding: 20px; }
.viewer-info { min-height: 0; padding: 20px; overflow: auto; border-left: 1px solid var(--line); background: var(--surface); font-size: 12px; overflow-wrap: anywhere; }
.viewer-info h2 { margin: 0 0 16px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; font-size: 12px; }
.viewer-info .viewer-prompt { white-space: pre-wrap; margin-top: 0; line-height: 1.65; }
.viewer-info dl { display: block; margin: 20px 0; }
.viewer-info dl > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.3fr); gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.viewer-info dt { color: var(--muted); }
.viewer-info dd { margin: 0; white-space: pre-wrap; }
.viewer-info :is(a,button) { display: block; margin-top: 12px; max-width: 100%; }
.viewer-info button { min-height: 44px; border-radius: 999px; background: var(--inset); }
.viewer-footer { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 10px 16px 16px; background: var(--surface); border-top: 1px solid var(--line); }
.viewer-notice { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; font-size: 11px; text-align: center; overflow-wrap: anywhere; max-height: 100px; overflow: auto; }
.viewer-notice:empty { display: none; }
.viewer-notice button { min-height: 36px; padding: 6px 12px; border-radius: 999px; }
.viewer-navigation { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 0; }
.viewer-thumbnails { display: flex; flex: 0 1 auto; width: max-content; gap: 6px; min-width: 0; overflow-x: auto; padding: 4px; overscroll-behavior-inline: contain; scrollbar-width: thin; }
.viewer-thumbnails > button { position: relative; display: grid; grid-template: minmax(0,1fr) / minmax(0,1fr); place-items: center; flex: 0 0 64px; width: 64px; height: 64px; padding: 3px; border: 1px solid transparent; border-radius: 12px; overflow: hidden; background: var(--inset); color: var(--muted); }
.viewer-thumbnails > button:focus-visible { outline-offset: -2px; }
.viewer-thumbnails > button[aria-current="true"] { border-color: var(--menu-accent-color); background: var(--selected); box-shadow: inset 0 0 0 1px var(--menu-accent-color); }
.viewer-thumbnails img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 8px; }
.viewer-toolbar { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; }
.viewer-thumbnail-check { position: absolute; top: 3px; left: 3px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--accent); color: var(--on-accent); box-shadow: 0 0 0 1px var(--surface); }
.viewer-thumbnail-check svg { width: 18px; height: 18px; }
.media-viewer .viewer-toolbar .project-picker-icon,
.floating-selection.media-selection :is(.selection-action,.project-picker-icon) { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--inset); color: var(--secondary); }
.media-viewer .viewer-toolbar .project-picker-icon:hover:not(:disabled) { background: var(--hover); color: var(--text); }
.floating-selection.media-selection .selection-trash { color: #ffb4ab; }
:root[data-theme="light"] .floating-selection.media-selection .selection-trash { color: #a32626; }
.request-feed { padding-bottom: var(--media-selection-height,0px); }
.request-feed .feed-expand { scroll-margin-bottom: calc(var(--composer-height,180px) + var(--media-selection-height,0px) + 30px); }
.media-viewer .viewer-toolbar > button[aria-label="Удалить"] { color: #ffb4ab; }
:root[data-theme="light"] .media-viewer .viewer-toolbar > button[aria-label="Удалить"] { color: #a32626; }
@media (max-width: 700px) {
  dialog.media-viewer { inset: 8px; width: calc(100vw - 16px); height: calc(100dvh - 16px); border-radius: 24px; }
  .media-viewer .viewer-header { min-height: 52px; padding: 4px 8px 4px 12px; gap: 6px; }
  .viewer-header > span:first-child { font-size: 10px; }
  .viewer-progress { font-size: 9px; }
  .viewer-stage { padding: 8px; }
  .viewer-body.with-info { grid-template-columns: minmax(0,1fr); }
  .viewer-info { position: absolute; inset: 0; border: 0; padding: 16px; }
  .viewer-footer { padding: 8px; gap: 8px; }
  .viewer-navigation { gap: 4px; }
  .viewer-thumbnails > button { flex-basis: 52px; width: 52px; height: 52px; }
  .viewer-toolbar { gap: 4px; }
}

.floating-selection .selection-message { flex: 1 0 100%; order: 3; padding: 0 8px; font-size: 11px; color: var(--secondary); overflow-wrap: anywhere; }
@media (max-width: 360px) {
  .viewer-toolbar { max-width: 200px; align-self: center; gap: 6px; }
}

/* A modal can receive focus after an image click; only its controls need a ring. */
dialog.media-viewer:focus-visible { outline: none; }

/* Read-only compatibility for already accepted processing work. */
.processing-archive { min-width: 0; padding-bottom: 24px; }
.processing-archive :is(section,article) { margin-block: 20px; }
.processing-archive button { min-height: 44px; margin: 4px; }
.processing-archive li { padding: 10px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.processing-archive li > span { display: block; }
.processing-archive dl > div { display: contents; }

/* The material tile has one size in generation and enhancement. */
.prompt-attach { width: 60px; height: 60px; min-width: 60px; min-height: 60px; border-radius: 12px; font-size: 26px; }
.prompt-attachments .attached-image { width: 60px; height: 60px; flex: 0 0 60px; border-radius: 12px; border: 0; }
.prompt-attachments .attached-image :is(img,svg) { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.prompt-attachments .attached-image button { opacity: 0; pointer-events: none; }
.prompt-attachments .attached-image:hover button, .prompt-attachments .attached-image:focus-visible button,
.prompt-attachments .attached-image button:focus-visible { opacity: 1; pointer-events: auto; }
@media (hover: none) { .prompt-attachments .attached-image:focus-within button { opacity: 1; pointer-events: auto; } }
.enhance-composer { position: relative; overflow: visible; isolation: isolate; }
.enhance-composer::before { content: ""; position: absolute; inset: 12px; z-index: -1; pointer-events: none; border-radius: inherit;
  background-image: radial-gradient(circle, var(--muted) 1px, transparent 1.5px); background-size: 20px 20px; opacity: .23;
  mask-image: radial-gradient(ellipse at center, #000 10%, transparent 72%); }
.enhance-materials { min-height: 130px; }
.enhance-dimensions { margin-top: 10px; display: grid; gap: 5px; overflow-wrap: anywhere; color: var(--muted); font-size: 12px; }
.enhance-dimensions p { margin: 0; }
.enhance-dimensions button { justify-self: start; }
.upload-preparation { display: block; overflow-wrap: anywhere; }
.enhance-thumbnails { display: flex; flex-wrap: wrap; gap: 10px; width: 100%; align-content: flex-start; }
.enhance-thumbnail { position: relative; width: 60px; height: 60px; flex: 0 0 60px; border-radius: 12px; }
.enhance-thumbnail :is(img,svg) { width: 100%; height: 100%; object-fit: cover; border-radius: 12px; display: block; }
.enhance-thumbnail > button { position: absolute; top: -4px; right: -4px; width: 24px; height: 24px; min-height: 24px; padding: 0; border-radius: 50%; background: var(--surface); color: var(--text); border: 1px solid var(--line); opacity: 0; pointer-events: none; }
.enhance-thumbnail:hover > button, .enhance-thumbnail:focus-visible > button, .enhance-thumbnail > button:focus-visible { opacity: 1; pointer-events: auto; }
@media (hover: none) { .enhance-thumbnail:focus-within > button { opacity: 1; pointer-events: auto; } }
.enhance-file-error { position: absolute; left: 3px; bottom: 3px; background: #a32626; color: white; border-radius: 50%; width: 20px; text-align: center; }
.enhance-composer .send-row { display: flex; align-items: flex-end; justify-content: space-between; padding-top: 12px; }
.enhance-composer .composer-size-controls { display: flex; flex: 1; align-items: center; }
.enhance-composer .send-action { display: flex; flex: 0 0 auto; align-items: center; }
.enhance-composer .composer-parameter { max-width: 145px; }
.enhance-composer .composer-parameter input { min-width: 0; width: 100%; }
.enhance-composer #submit:disabled { opacity: .25; }
.enhance-notice { color: var(--secondary); font-size: 12px; padding: 12px 4px 0; line-height: 1.6; }
.enhance-notice button { border-radius: 999px; padding: 8px 12px; margin: 4px; background: var(--inset); min-height: 36px; }
.enhance-composer .enhance-prompt { display: flex; flex-direction: column; gap: 10px; margin: 10px 0 0; padding: 14px; border-radius: 14px; background: var(--inset); font-size: 11px; line-height: 1.5; color: var(--secondary); }
.enhance-prompt > span { display: block; }
.enhance-prompt small { font: inherit; color: var(--muted); }
.enhance-composer .enhance-prompt textarea { display: block; width: 100%; margin: 0; min-height: 60px; resize: vertical; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--text); font-size: 13.2px; line-height: 1.65; }
.attachment-card[aria-pressed="true"] { outline: 2px solid var(--accent); outline-offset: -2px; }
.attachment-card { position: relative; }
.attachment-selected { position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--accent); color: var(--on-accent); }
.upload-queue li { position: relative; }
.upload-queue li[data-state="uploading"] .upload-thumbnail,
.upload-queue li[data-state="queued"] .upload-thumbnail { opacity: .35; }
.upload-logo { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.upload-logo .generation-mark { width: 32px; height: 32px; }
.workspace-row .work-link { display: flex; align-items: center; gap: 10px; min-height: 36px; }
.work-cover { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--inset); overflow: hidden; }
.work-cover img { width: 100%; height: 100%; object-fit: cover; }
.work-cover.video { border-radius: 7px; position: relative; }
.work-cover.video::after { content: "▶"; position: absolute; color: white; font-size: 12px; text-shadow: 0 1px 4px #000; }
.work-cover.chat { background: none; }
.work-link > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 700px) {
  .workspace-notices { top: 60px; right: 12px; }
  .enhance-composer .send-row { flex-wrap: wrap; gap: 12px; }
  .enhance-composer .composer-size-controls { flex-basis: 100%; }
  .enhance-composer .send-action { margin-left: auto; }
  .enhance-thumbnail > button { width: 28px; height: 28px; }
}