/* V6: a single spacing grid and model-first creative settings. */
:root{--ui-space:8px;--ui-gap:16px;--ui-gutter:24px;--ui-field-height:44px;--ui-control-height:40px;--ui-icon-size:18px;--ui-text-line:20px}
/* Both cards use the same content edges, inner padding and vertical rhythm. */
#parametersDialog{padding:var(--ui-gutter);border-radius:24px}
#parametersDialog[open]{display:flex;flex-direction:column;gap:var(--ui-gap)}
#parametersDialog>.parameter-shell-top{padding:0;min-height:32px;flex-shrink:0;align-items:center}
#parametersDialog>.model-settings,#parametersDialog>.ai-parameter-card{width:100%;margin:0;border-radius:16px;flex-shrink:0}
#imageModelCard{padding:20px;background:#eef3f7;border:1px solid #dbe5ed}
.image-model-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px}
.image-model-header h2{margin:0;font-size:17px;line-height:24px;letter-spacing:-.3px;font-weight:600;color:#344a5a}
.image-model-header>span{font-size:11px;line-height:20px;color:#7a8e9e}
#imageModelCard .form-stack{padding:0;display:grid;gap:12px}
#imageModelCard #modelSelect{width:100%;height:var(--ui-field-height);min-height:var(--ui-field-height);padding:0 12px;border:1px solid #d4e0e9;border-radius:10px;background:#fafdff;color:#304351;font-size:13px;line-height:20px}
#imageModelCard #modelDescription{margin:0;font-size:12px;line-height:20px;color:#728491}
#imageModelCard #saveParameters{display:none}
#parametersDialog>.ai-parameter-card{padding:20px 20px 0;background:#faf9f1;border-color:#ecebdc}
#parametersDialog .ai-parameter-header{margin:0 0 20px;min-height:40px;align-items:center}
#parametersDialog .ai-parameter-header>div:first-child{align-items:center;gap:12px}
#parametersDialog .ai-parameter-header strong{font-size:17px;line-height:24px;margin:0}
#parametersDialog .ai-parameter-header small{line-height:20px}
#parametersDialog>.ai-parameter-card.is-disabled{padding:20px}
#parametersDialog>.ai-parameter-card.is-disabled .ai-parameter-header{margin:0}
#parametersDialog .ai-parameter-grid{gap:var(--ui-gap)}
#parametersDialog .ai-parameter-grid>label,#parametersDialog .ai-category-field,#parametersDialog .ai-model-parameter-grid label{gap:8px;font-size:12px;line-height:20px}
#parametersDialog .ai-parameter-grid select,#parametersDialog .ai-category-trigger,#parametersDialog .ai-model-parameter-grid select,#parametersDialog .ai-tags-field input{height:var(--ui-field-height);min-height:var(--ui-field-height);padding:0 12px;line-height:20px;border-radius:10px}
#parametersDialog .ai-model-parameters{margin-top:20px;padding:16px}
#parametersDialog .ai-model-parameter-grid{gap:var(--ui-gap)}
#parametersDialog .ai-tags-field{gap:8px;margin-top:20px;line-height:20px}
#parametersDialog .ai-parameter-footer{margin:20px -20px 0;padding:16px 20px;min-height:72px}
#parametersDialog>.parameter-off-note{padding:0 4px;margin:0;font-size:12px;line-height:20px}
#parametersDialog>.parameter-status{margin:0;padding:12px 16px;font-size:12px;line-height:20px}
#parametersDialog>.parameter-dismiss{padding:0;margin:0;min-height:36px;align-items:center}
/* Controls share a border-box center, with no baseline-dependent icon positioning. */
.composer__toolbar{gap:8px}.toolbar-left{gap:8px;align-items:center}
#attachButton,#parameterButton,.mode-selector{height:var(--ui-control-height);min-height:var(--ui-control-height);box-sizing:border-box}
#attachButton{display:grid;grid-template-columns:var(--ui-icon-size) auto;align-items:center;justify-content:center;gap:8px;padding:0 12px;font-size:13px;line-height:var(--ui-text-line)}
#attachButton>svg{display:block;width:var(--ui-icon-size);height:var(--ui-icon-size);margin:0;align-self:center;justify-self:center;flex:none}
#attachButton>span{display:block;height:var(--ui-text-line);line-height:var(--ui-text-line);align-self:center;margin:0;padding:0}
#parameterButton{gap:8px;padding:0 12px;font-size:13px;line-height:var(--ui-text-line)}
#parameterButton>span:not([hidden]){height:var(--ui-text-line);line-height:var(--ui-text-line)}
#conversationMode{height:calc(var(--ui-control-height) - 2px);font-size:13px;line-height:var(--ui-text-line)}
.mode-selector>svg{top:50%;transform:translateY(-50%)}
/* Repeated rows and cards use common 16 px gaps; outer edges align to the composer. */
.quick-start{width:100%;max-width:none;margin:32px 0 0}
.feature-grid,.repository-grid,.pinned-grid,.upload-sample-grid,.mode-settings-fields{gap:var(--ui-gap)}
.reference-card .feature-card__copy{padding-left:12px;padding-right:12px}
.workflow-body,.workspace-dialog .workspace-grid{gap:var(--ui-gutter)}
.mode-settings-fields{padding:var(--ui-gutter)}
.mode-settings-dialog footer{padding:16px var(--ui-gutter)}
.project-sidebar .new-project,.project-sidebar .running-work{grid-template-columns:20px minmax(0,1fr) 20px;gap:12px;height:44px;min-height:44px;line-height:20px}
.project-account{gap:8px;align-items:center}.project-account .nav-account{align-items:center}
#utilityBody .theme-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ui-space)}
#utilityBody .theme-options>button{height:40px;margin:0;padding:0 12px;line-height:20px}
#utilityBody .profile-card{align-items:center;gap:16px}
#utilityBody .stat-row{display:flex;justify-content:space-between;align-items:center;min-height:40px;gap:16px;line-height:20px}
html[data-theme=dark] #imageModelCard{background:#26333c;border-color:#394e5d}
html[data-theme=dark] .image-model-header h2{color:#d4e3ef}
html[data-theme=dark] .image-model-header>span,html[data-theme=dark] #imageModelCard #modelDescription{color:#9eb4c5}
html[data-theme=dark] #imageModelCard #modelSelect{background:#202c35;border-color:#435e70;color:#dfebf4}
html[data-theme=dark] #parametersDialog>.ai-parameter-card{background:#2c3026;border-color:#414936}
@media(max-width:930px) and (min-width:761px){#attachButton{grid-template-columns:var(--ui-icon-size);width:40px;min-width:40px;padding:0}#attachButton>span{display:none}}
@media(max-width:760px){:root{--ui-gutter:16px;--ui-control-height:36px;--ui-icon-size:18px}.toolbar-left{gap:8px}#parametersDialog{padding:16px;gap:16px}#parametersDialog>.model-settings,#parametersDialog>.ai-parameter-card{border-radius:14px}#imageModelCard{padding:16px}.image-model-header{gap:8px;margin-bottom:16px;align-items:flex-start;flex-direction:column}.image-model-header h2{font-size:16px}.image-model-header>span{font-size:11px}#imageModelCard #modelSelect{font-size:12px}#parametersDialog>.ai-parameter-card{padding:16px 16px 0}#parametersDialog>.ai-parameter-card.is-disabled{padding:16px}#parametersDialog .ai-parameter-header{gap:8px}#parametersDialog .ai-parameter-header>div:first-child{gap:4px;align-items:flex-start}#parametersDialog .ai-parameter-header strong{font-size:16px}#parametersDialog .ai-parameter-header small{font-size:10px;line-height:16px}#parametersDialog .ai-parameter-footer{margin:16px -16px 0;padding:16px;gap:8px}#parametersDialog .ai-model-parameter-grid{gap:16px}#parametersDialog .ai-parameter-grid{gap:16px}#attachButton{grid-template-columns:18px;width:36px;min-width:36px;padding:0}#attachButton>span{display:none}#parameterButton{padding:0 8px;gap:4px;font-size:12px}#conversationMode{font-size:12px}.feature-grid{gap:16px}.quick-start{margin-top:32px}.mode-settings-fields{padding:16px}.mode-settings-dialog footer{padding:16px}.workflow-body,.workspace-dialog .workspace-grid{gap:16px}}
@media(max-width:390px){.toolbar-left{gap:4px}.composer__toolbar{gap:4px}.mode-selector{width:104px}#conversationMode{font-size:11px}#parameterButton{font-size:11px;padding:0 8px;gap:4px}.feature-grid{gap:16px}}