/* Studio density is expressed in CSS pixels, never page zoom or transforms. */
@media (min-width: 701px) {
  .studio-shell { --sidebar-width: 160px; font-size: 13px; }
  .studio-shell .studio-content { max-width: none; padding: 18px 20px; }
  .studio-shell .studio-topbar { min-height: 48px; padding: 6px 16px; gap: 16px; }
  .studio-shell .brand { font-size: 17px; }
  .studio-shell .brand img { width: 26px; height: 26px; }
  .studio-sidebar-inner { min-height: calc(100dvh - 48px); padding: 10px 7px; gap: 8px; }
  .studio-shell [data-studio-nav] { min-height: 32px; padding: 7px 9px; gap: 8px; font-size: 12px; }
  .studio-shell [data-studio-nav] svg { width: 16px; height: 16px; flex-basis: 16px; }
  .studio-nav-group { padding-top: 12px; margin-top: 4px; }
  .studio-shell :is(button,.button), .studio-shell .header-actions #wallet { min-height: 30px; padding: 5px 10px; font-size: 12px; }
  .studio-shell :is(input,select,textarea) { font-size: 13px; padding: 6px 8px; }
  .studio-shell .skin-picker,.studio-shell .language-picker summary,.studio-shell .header-actions #wallet { height: 30px; min-height: 30px; }
  .studio-shell .workspace-welcome { margin-bottom: 12px; }
  .studio-shell .workspace-welcome h1,.studio-shell .small-heading,.studio-shell .creation-heading h1 { font-size: 22px; }
  .studio-shell .workspace-welcome p { font-size: 12px; }
  .workspace-launches,.workspace-preset-grid { gap: 10px; }
  .workspace-launches,.workspace-presets { margin-bottom: 18px; }
  .workspace-launch,.workspace-launch>div { min-height: 88px; }
  .workspace-launch>div,.workspace-preset { padding: 11px 12px; }
  .workspace-launch h2 { font-size: 15px; }
  .workspace-preset h3 { font-size: 14px; margin: 0; }
  .workspace-preset p { margin: 4px 0 8px; }
  .studio-shell .section-head h2 { font-size: 16px; }
  .studio-shell .workspace-gallery { margin: 18px 0; }
  .studio-shell .workspace-gallery .montage { gap: 10px; }
  .studio-shell .workspace-gallery .tile { aspect-ratio: 1.4; }
  .studio-shell .workspace-gallery .tile span { font-size: 12px; padding: 10px; }
  .studio-shell .prompt-card-copy { padding: 8px; }
  .studio-shell .prompt-text { font-size: 11px; line-height: 1.5; margin-bottom: 5px; }
  .studio-shell .prompt-masonry { column-gap: 10px; }
  .studio-shell .prompt-masonry.masonry-ready { gap: 10px; }
  .studio-shell .cards { grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap: 10px; }
  .studio-shell .workbench { grid-template-columns: 270px minmax(0,1fr) 140px; gap: 14px; }
  .studio-shell .workbench:has(.creation-history[hidden]) { grid-template-columns: 270px minmax(0,1fr); }
  .studio-shell .workbench #result-media :is(img,video) { max-height: min(54vh,560px); object-fit: contain; }
  .studio-shell .sw-workspace { font-size: 13px; }
  .studio-shell .sw-private .sw-assets { grid-template-columns: repeat(auto-fill,minmax(155px,1fr)); gap: 10px; margin-block: 12px; }
  .studio-shell .sw-asset,.studio-shell .sw-project { padding: 9px; border-radius: 9px; }
  .studio-shell .sw-assets .sw-asset :is(img,video) { height: 116px; }
  .studio-shell .sw-project-grid { grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: 10px; }
  .studio-shell .sw-project-visual,.studio-shell .sw-preset-visual { min-height: 88px; margin-bottom: 8px; }
  .studio-shell .sw-private h2 { font-size: 15px; }
  .studio-shell .sw-toolbar { gap: 6px; margin: 8px 0; }
  .studio-shell .sw-toolbar :is(button,.button,input,select) { min-height: 30px; padding: 5px 8px; font-size: 12px; }
  .studio-shell .sw-segments { margin: 8px 0 12px; }
  .studio-shell .sw-dialog { width: min(1040px,calc(100vw - 48px)); }
  .studio-shell .sw-dialog-heading { padding: 9px 12px; }
  .studio-shell .sw-dialog-heading h2 { font-size: 15px; }
  .studio-shell .sw-dialog-content { padding: 12px; }
  .studio-shell .sw-focus .sw-node { width: 200px; padding: 9px; border-radius: 8px; }
  .studio-shell .sw-node strong { font-size: 13px; }
  .studio-shell .sw-node p { font-size: 12px; line-height: 1.45; margin: 6px 0; -webkit-line-clamp: 3; }
  .studio-shell .sw-node small,.studio-shell .sw-node-status { font-size: 11px; }
  .studio-shell .sw-node :is(img,video) { max-height: 112px; margin-top: 7px; }
  .studio-shell .sw-focus .sw-projectbar { padding: 4px 7px; gap: 6px; }
  .studio-shell .sw-focus .sw-projectbar input { width: 160px; }
  .studio-shell .sw-dock { bottom: 12px; padding: 4px; }
  .studio-shell .sw-dock button { min-height: 40px; padding: 4px 8px; font-size: 10px; }
  .studio-shell .sw-focus-actions :is(button,.button) { min-height: 30px; padding: 5px 9px; }
  .studio-shell .sw-dialog:has(.sw-project-settings) { width: 380px; }
  .studio-shell .professional-tool-browser nav { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
  .studio-shell .professional-tool-browser nav button { padding: 8px; font-size: 12px; }
}
/* Wide galleries add columns as usable content width grows. */
@container (min-width: 1500px) {
  .studio-shell .workspace-gallery .montage { grid-template-columns: repeat(8,minmax(0,1fr)); }
  .prompt-masonry { columns: 6; }
  .prompt-masonry.masonry-ready { grid-template-columns: repeat(6,minmax(0,1fr)); }
}
@container (min-width: 1850px) {
  .prompt-masonry { columns: 7; }
  .prompt-masonry.masonry-ready { grid-template-columns: repeat(7,minmax(0,1fr)); }
}
@container (min-width: 2150px) {
  .prompt-masonry { columns: 8; }
  .prompt-masonry.masonry-ready { grid-template-columns: repeat(8,minmax(0,1fr)); }
}
@media (min-width: 701px) and (max-width: 1150px) {
  .studio-shell .workbench,.studio-shell .workbench:has(.creation-history[hidden]) { grid-template-columns: 250px minmax(0,1fr); }
}
.sw-project-settings { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
.sw-project-settings .sw-theme-toggle { width: auto; }
.sw-project-settings .sw-focus-wallet { display: inline-flex; }
.sw-advanced-fields { margin-block: 10px; border-top: 1px solid var(--line); padding-top: 8px; }
.sw-advanced-fields>summary { cursor: pointer; color: var(--muted); font-size: 12px; }
@media (max-width: 700px) {
  .sw-project-settings :is(button,.button) { min-height: 44px; }
}
.sw-project-settings .sw-theme-toggle { display: inline-flex; align-items: center; gap: 6px; }
.sw-project-settings .sw-theme-toggle svg { flex: 0 0 18px; }
@media (min-width: 701px) {
  .studio-shell .sw-timeline-studio { --sw-stage-height: clamp(160px,calc(100dvh - 520px),280px); }
}
/* Subtle editor chrome: only selected content carries a strong accent. */
.studio-shell .sw-workspace { --line: #d9e0da; --sw-node-border: #c2cec5; --sw-node-shadow: 0 2px 8px #15241b0a; }
:root[data-skin='deep-green'] .studio-shell .sw-workspace { --line: #344038; --sw-node-border: #46534a; --sw-node-shadow: 0 2px 10px #00000012; }
.studio-shell .sw-focus .sw-projectbar { border-color: color-mix(in srgb,var(--line) 60%,transparent); box-shadow: none; }
.studio-shell .sw-focus .sw-node { border-radius: 9px; }
.sw-node-heading { display: grid; grid-template-columns: 18px minmax(0,1fr); gap: 2px 6px; align-items: center; }
.sw-node-heading > svg { grid-row: 1/3; color: var(--muted); }
.sw-node-heading strong { grid-column: 2; }
.studio-shell .sw-node.selected { box-shadow: 0 0 0 1px var(--accent); }
.studio-shell .sw-inspector { border-color: var(--line); }
.studio-shell .sw-feedback > p { width: auto; font-size: 12px; padding: 7px 10px; }
.studio-shell .sw-feedback { width: fit-content; max-width: min(500px,100%); }