@charset "UTF-8";

/* The visual layer belongs to the authenticated workspace. The login scene
   and its video keep their own layout, colors, and playback controls. */
#studio.signed-in,
body:has(#studio.signed-in) dialog {
  --bg:#111113;
  --panel:#1b1b1e;
  --sidebar:#161618;
  --hover:#262629;
  --text:#f2f2ee;
  --muted:#a5a5ad;
  --line:#303035;
  --mint:#d6ff62;
  --mint-ink:#20280c;
  --visual-accent:#d6ff62;
  --visual-soft:#d6ff6210;
  --shadow:0 22px 80px #00000038;
  color:var(--text);
}
:root[data-theme=light] #studio.signed-in,
:root[data-theme=light] body:has(#studio.signed-in) dialog {
  --bg:#f3f4ef;
  --panel:#fff;
  --sidebar:#e9ece4;
  --hover:#e9ede1;
  --text:#22251d;
  --muted:#62695b;
  --line:#d7ddcf;
  --visual-accent:#50671a;
  --visual-soft:#9ebc4c12;
  --shadow:0 22px 80px #33421b12;
}
#studio.signed-in {
  min-height:100dvh;
  background:var(--bg);
  font-family:Inter,"Segoe UI",Arial,sans-serif;
}
#studio.signed-in .app-shell {
  grid-template-columns:188px minmax(0,1fr);
}
#studio.signed-in .app-shell :is(button,a.secondary) {
  border-radius:8px;
}
#studio.signed-in .app-shell :is(button,input,select,textarea,a):focus-visible,
body:has(#studio.signed-in) dialog :is(button,input,select,textarea,a):focus-visible {
  outline-color:var(--visual-accent);
}
#studio.signed-in .app-shell .primary {
  background:var(--mint);
  color:var(--mint-ink);
  border-color:transparent;
  font-weight:650;
  box-shadow:0 2px 10px #00000010;
}
#studio.signed-in .app-shell .primary:hover:not(:disabled) {
  background:#e2ff8c;
}
#studio.signed-in .app-shell :is(.accent,.free-price,.library-project-badge),
#studio.signed-in .app-shell .prompt-enhance .icon {
  color:var(--visual-accent);
}
#studio.signed-in .app-shell :is(input:not([type=range]),select) {
  background:var(--bg);
  border-color:var(--line);
  border-radius:8px;
}
#studio.signed-in .app-shell :is(input,textarea)::placeholder,
body:has(#studio.signed-in) dialog :is(input,textarea)::placeholder {
  color:var(--muted);
  opacity:1;
}

/* A quiet, compact rail leaves the canvas to the work. */
#studio.signed-in .sidebar {
  padding:24px 12px 15px;
  min-height:0;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--line) transparent;
}
#studio.signed-in .sidebar>.brand {
  margin:0 10px 31px;
  font-size:17px;
  gap:9px;
  letter-spacing:1px;
}
#studio.signed-in .sidebar .brand-mark {
  width:29px;
  height:32px;
  border-radius:8px;
  font-size:21px;
}
#studio.signed-in .nav-label {
  font-size:8px;
  letter-spacing:1.4px;
  padding:0 11px;
  margin-bottom:10px;
}
#studio.signed-in .tabs {
  gap:4px;
}
#studio.signed-in :is(.tabs button,.owner-section button) {
  min-height:41px;
  padding:10px 11px;
  gap:10px;
  font-size:12px;
  letter-spacing:-.1px;
}
#studio.signed-in :is(.tabs button,.owner-section button)[aria-selected=true] {
  background:var(--hover);
  box-shadow:inset 2px 0 var(--mint);
  color:var(--text);
}
#studio.signed-in :is(.tabs button,.owner-section button)[aria-selected=true] .icon {
  color:var(--visual-accent);
}
#studio.signed-in .owner-section {
  margin-top:22px;
  padding-top:18px;
}
#studio.signed-in .sidebar-bottom {
  padding-top:28px;
  gap:2px;
}
#studio.signed-in .sidebar-bottom>button {
  min-height:37px;
  padding:9px 10px;
  gap:9px;
  font-size:11px;
}
#studio.signed-in .sidebar-bottom>button:hover:not(:disabled) {
  background:var(--hover);
  color:var(--text);
}
#studio.signed-in .sidebar-bottom>button .icon {
  width:16px;
  height:16px;
}
#studio.signed-in .account-row {
  gap:8px;
  margin-top:12px;
  padding-top:15px;
}
#studio.signed-in .account-row>div {
  min-width:0;
}
#studio.signed-in .account-name {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#studio.signed-in .avatar {
  flex:0 0 28px;
  width:28px;
  height:28px;
  border-radius:8px;
  color:var(--visual-accent);
}
#studio.signed-in .topbar {
  position:sticky;
  top:0;
  z-index:12;
  height:64px;
  padding:0 32px;
  background:var(--bg);
}
#studio.signed-in .breadcrumb {
  gap:10px;
  font-size:11px;
}
#studio.signed-in .topbar-actions {
  gap:8px;
}
#studio.signed-in :is(.balance-button,#openMobileSettings) {
  min-height:35px;
  border:1px solid var(--line);
  background:var(--panel);
  padding:8px 10px;
  font-size:11px;
}
#studio.signed-in #openMobileSettings {
  min-width:99px;
  color:var(--text);
}
#studio.signed-in .quick-command {
  padding:6px;
}
#studio.signed-in .quick-command .keycap {
  font-size:9px;
  padding:2px 5px;
}

/* Large photographs establish the direction; the composer stays within reach. */
#studio.signed-in .workspace {
  padding:29px 32px 38px;
  max-width:1590px;
}
#studio.signed-in .screen-intro {
  align-items:center;
  gap:20px;
  margin-bottom:29px;
}
#studio.signed-in .screen-intro .eyebrow {
  font-size:8px;
  letter-spacing:1.6px;
}
#studio.signed-in .screen-intro h2 {
  font-size:clamp(25px,2.15vw,33px);
  font-weight:550;
  letter-spacing:-1.1px;
  line-height:1.16;
  margin:9px 0;
}
#studio.signed-in .screen-intro p {
  font-size:12px;
}
#studio.signed-in .workspace-label {
  font-size:8px;
  letter-spacing:1.4px;
  padding-top:0;
}
#studio.signed-in .creation-grid {
  grid-template-columns:minmax(0,1fr) 256px;
  align-items:start;
  gap:25px;
}
#studio.signed-in .section-heading {
  margin-bottom:13px;
  gap:12px;
}
#studio.signed-in .section-heading h3 {
  font-size:13px;
  font-weight:550;
  letter-spacing:-.15px;
}
#studio.signed-in .section-heading .text-button {
  font-size:10px;
}
#studio.signed-in .starter-grid {
  grid-template-columns:1.1fr 1fr 1fr;
  gap:12px;
}
#studio.signed-in .idea-art {
  aspect-ratio:auto;
  height:clamp(215px,23vw,360px);
  max-height:none;
  min-height:0;
  border:1px solid #ffffff12;
  border-radius:12px;
  background-color:var(--panel);
}
#studio.signed-in .idea-art:after {
  content:"";
  position:absolute;
  inset:43% 0 0;
  background:linear-gradient(transparent,#00000094);
  z-index:1;
  pointer-events:none;
}
#studio.signed-in .idea-art:hover:not(:disabled) {
  transform:translateY(-2px);
  border-color:#ffffff40;
}
#studio.signed-in .idea-art-label {
  left:14px;
  right:14px;
  bottom:15px;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  backdrop-filter:none;
  font-size:12px;
  line-height:1.35;
  letter-spacing:-.15px;
  text-shadow:0 1px 10px #00000070;
}
#studio.signed-in .idea-art-label .icon {
  display:block;
  width:14px;
  height:14px;
}
#studio.signed-in .idea-art-meta {
  top:12px;
  left:12px;
  font-size:6px;
  letter-spacing:1px;
  padding:5px 6px;
  background:#11111380;
  border-color:#ffffff30;
  border-radius:4px;
  backdrop-filter:blur(8px);
}
#studio.signed-in .starter-example-note {
  margin-top:11px;
  max-width:670px;
  font-size:9px;
  line-height:1.7;
}
#studio.signed-in .composer {
  margin-top:22px;
  padding:17px 18px 15px;
  border-radius:13px;
  border-color:var(--line);
  box-shadow:0 5px 22px #0000000d;
}
#studio.signed-in .composer:focus-within {
  border-color:color-mix(in srgb,var(--visual-accent) 45%,var(--line));
}
#studio.signed-in .composer-heading {
  margin-bottom:8px;
}
#studio.signed-in .composer-heading label {
  font-size:10px;
  letter-spacing:.2px;
}
#studio.signed-in .composer textarea {
  min-height:74px;
  height:74px;
  font-size:13px;
  line-height:1.75;
}
#studio.signed-in .composer-tools {
  gap:8px 13px;
  margin:7px 0 12px;
}
#studio.signed-in .composer-tools>button {
  min-height:29px;
  font-size:10px;
  border-radius:6px;
}
#studio.signed-in .prompt-enhance {
  padding:6px 8px;
}
#studio.signed-in .prompt-enhance small {
  font-size:9px;
}
#studio.signed-in .composer-footer {
  border-top:1px solid var(--line);
  padding-top:12px;
  gap:10px;
}
#studio.signed-in .composer-footer .primary {
  min-height:39px;
  padding:10px 17px;
  font-size:11px;
}
#studio.signed-in .composer-footer .text-button {
  font-size:10px;
}
#studio.signed-in .prompt-count {
  font-size:9px;
}
#studio.signed-in .under-composer {
  margin-top:10px;
  font-size:10px;
  line-height:1.65;
}
#studio.signed-in .prompt-ideas {
  gap:7px;
  margin-top:16px;
}
#studio.signed-in .prompt-ideas button {
  background:var(--panel);
  border:1px solid var(--line);
  padding:6px 9px;
  font-size:10px;
  color:var(--muted);
  border-radius:6px;
}
#studio.signed-in .parameters {
  position:sticky;
  top:88px;
  padding:20px 17px 17px;
  gap:23px;
  border-radius:13px;
  background:var(--panel);
}
#studio.signed-in .parameters h3 {
  font-size:12px;
  font-weight:550;
  letter-spacing:-.1px;
}
#studio.signed-in .parameters label {
  font-size:10px;
}
#studio.signed-in .parameters select {
  min-height:41px;
  font-size:11px;
  padding:10px;
}
#studio.signed-in .field-heading {
  gap:10px;
}
#studio.signed-in .field-heading .text-button {
  font-size:9px;
}
#studio.signed-in .price-note {
  font-size:10px;
  line-height:1.7;
}
#studio.signed-in .ratio-options {
  gap:6px;
}
#studio.signed-in .ratio-options button {
  min-width:0;
  min-height:56px;
  padding:9px 3px;
  font-size:10px;
}
#studio.signed-in .ratio-options button[aria-pressed=true],
#studio.signed-in .style-options button[aria-pressed=true] {
  background:var(--visual-soft);
  border-color:var(--visual-accent);
  color:var(--visual-accent);
}
#studio.signed-in .style-options {
  gap:6px;
}
#studio.signed-in .style-options button {
  font-size:10px;
  padding:7px 9px;
}
#studio.signed-in .parameter-field>small {
  font-size:9px;
  line-height:1.7;
}
#studio.signed-in .parameter-note {
  padding-top:0;
  gap:8px;
}
#studio.signed-in .parameter-note>.icon {
  color:var(--visual-accent);
}
#studio.signed-in .parameter-note p {
  font-size:10px;
}
#studio.signed-in .parameter-cost {
  font-size:10px;
  padding-top:15px;
}
#studio.signed-in .parameter-cost strong {
  font-size:12px;
}

/* The remaining tools use the same material and spacing as the canvas. */
#studio.signed-in :is(.provider-card,.project-panel,.library-card,.library-empty,.result-frame,.dropzone,.generation-state) {
  border-radius:13px;
}
#studio.signed-in .dropzone {
  min-height:285px;
  background:var(--panel);
  border-color:var(--line);
}
#studio.signed-in .dropzone:hover,
#studio.signed-in .dropzone.dragging {
  background:var(--visual-soft);
  border-color:var(--visual-accent);
}
#studio.signed-in .dropzone>.icon {
  color:var(--visual-accent);
}
#studio.signed-in.has-upload .dropzone {
  min-height:0;
}
#studio.signed-in .result-frame {
  background:var(--sidebar);
}
#studio.signed-in .result-frame>img {
  max-height:70dvh;
}
#studio.signed-in .result-actions .secondary {
  min-height:36px;
  font-size:10px;
}
#studio.signed-in .result-project-row {
  margin-top:13px;
}
#studio.signed-in .chat-workspace {
  max-width:850px;
}
#studio.signed-in .chat-heading {
  margin-bottom:18px;
}
#studio.signed-in :is(.chat-avatar,.provider-logo) {
  border-radius:8px;
  color:var(--visual-accent);
}
#studio.signed-in .chat-empty {
  min-height:320px;
  gap:13px;
}
#studio.signed-in .chat-empty-mark {
  width:45px;
  height:49px;
  border-radius:12px;
  font-size:29px;
  color:var(--visual-accent);
}
#studio.signed-in .chat-empty h3 {
  font-size:25px;
  letter-spacing:-.7px;
}
#studio.signed-in .chat-suggestions button {
  background:var(--panel);
  border-color:var(--line);
  padding:10px 13px;
  font-size:11px;
}
#studio.signed-in .chat-composer {
  margin-top:0;
}
#studio.signed-in .chat-message.user {
  border-radius:13px 13px 4px 13px;
}
#studio.signed-in .project-panel {
  padding:18px;
  margin-bottom:23px;
}
#studio.signed-in .project-panel-heading h3 {
  font-size:15px;
}
#studio.signed-in .project-filter {
  min-width:145px;
  font-size:11px;
  padding:12px 13px;
}
#studio.signed-in .project-filter[aria-pressed=true] {
  background:var(--visual-soft);
  border-color:var(--visual-accent);
}
#studio.signed-in .library-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:17px;
}
#studio.signed-in .library-card {
  padding-bottom:13px;
}
#studio.signed-in .library-card>img {
  aspect-ratio:4/5;
}
#studio.signed-in .library-card>p {
  font-size:11px;
}
#studio.signed-in .library-card>small {
  font-size:9px;
}
#studio.signed-in .library-empty {
  background:var(--panel);
  border-style:solid;
}
#studio.signed-in .library-empty strong {
  font-size:22px;
}
#studio.signed-in .library-detail-shell {
  border-radius:15px;
}
#studio.signed-in .library-heart[aria-pressed=true] .icon {
  fill:var(--mint);
  stroke:var(--mint);
}
#studio.signed-in .app-footer {
  margin:0 32px;
  padding:15px 0 18px;
  font-size:8px;
  letter-spacing:1px;
}
body:has(#studio.signed-in) dialog.app-dialog {
  background:var(--panel);
  border-color:var(--line);
  border-radius:17px;
  box-shadow:var(--shadow);
}
body:has(#studio.signed-in) dialog::backdrop {
  background:#060608b8;
  backdrop-filter:blur(7px);
}
body:has(#studio.signed-in) dialog .dialog-heading h2 {
  font-size:23px;
  font-weight:550;
  letter-spacing:-.7px;
}
body:has(#studio.signed-in) dialog :is(input:not([type=range]),select,textarea) {
  border-radius:8px;
}
body:has(#studio.signed-in) dialog .primary {
  background:var(--mint);
  color:var(--mint-ink);
  border-color:transparent;
}
body:has(#studio.signed-in) dialog .primary:hover:not(:disabled) {
  background:#e2ff8c;
}
body:has(#studio.signed-in) dialog .model-choice[aria-pressed=true] {
  background:var(--visual-soft);
  border-color:var(--visual-accent);
}
body:has(#studio.signed-in) dialog .model-choice .free-tag {
  color:var(--visual-accent);
}
body:has(#studio.signed-in) #mobileSettingsDialog .account-menu-exit {
  background:#262629;
  color:#f2f2ee;
  border:1px solid #45454d;
}
:root[data-theme=light] body:has(#studio.signed-in) #mobileSettingsDialog .account-menu-exit {
  background:#e9ede1;
  color:#22251d;
  border-color:#b4bf9f;
}
body:has(#studio.signed-in) #mobileSettingsDialog .account-menu-exit:hover:not(:disabled) {
  border-color:var(--visual-accent);
}

@media(min-width:1600px) {
  #studio.signed-in .app-shell {grid-template-columns:200px minmax(0,1fr)}
  #studio.signed-in .workspace {padding:37px 44px 45px}
  #studio.signed-in .topbar {padding:0 44px}
  #studio.signed-in .creation-grid {grid-template-columns:minmax(0,1fr) 275px;gap:30px}
  #studio.signed-in .starter-grid {gap:16px}
  #studio.signed-in .idea-art {height:370px}
  #studio.signed-in .parameters {padding:22px 19px}
  #studio.signed-in .library-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1150px) {
  #studio.signed-in .app-shell {grid-template-columns:168px minmax(0,1fr)}
  #studio.signed-in .sidebar {padding:23px 9px 14px}
  #studio.signed-in .sidebar>.brand {font-size:15px;margin-left:9px;gap:8px}
  #studio.signed-in .sidebar .brand-mark {width:27px;height:30px;font-size:20px}
  #studio.signed-in :is(.tabs button,.owner-section button) {padding:10px;font-size:11px;gap:8px}
  #studio.signed-in .sidebar-bottom>button {font-size:10px;padding:9px 8px;gap:7px}
  #studio.signed-in .workspace {padding:26px 24px 34px}
  #studio.signed-in .topbar {padding:0 24px}
  #studio.signed-in .creation-grid {grid-template-columns:minmax(0,1fr) 224px;gap:19px}
  #studio.signed-in .screen-intro h2 {font-size:27px}
  #studio.signed-in .workspace-label {display:none}
  #studio.signed-in .idea-art {height:240px}
  #studio.signed-in .starter-grid {gap:9px}
  #studio.signed-in .idea-art-label {left:10px;right:10px;bottom:12px;font-size:11px}
  #studio.signed-in .idea-art-meta {left:9px;top:9px;font-size:5px;letter-spacing:.6px}
  #studio.signed-in .parameters {padding:19px 14px;gap:22px}
  #studio.signed-in .parameter-note {display:flex}
  #studio.signed-in .composer {padding:15px}
  #studio.signed-in .app-footer {margin:0 24px}
}
@media(min-width:861px) and (max-width:980px) {
  #studio.signed-in .creation-grid {grid-template-columns:minmax(0,1fr) 210px;gap:16px}
  #studio.signed-in .idea-art {height:208px}
  #studio.signed-in .idea-art-label {font-size:10px;left:8px;right:8px}
  #studio.signed-in .idea-art-label .icon {display:none}
  #studio.signed-in .idea-art-meta {font-size:4px;letter-spacing:.35px;padding:4px}
  #studio.signed-in .parameters {padding:17px 12px}
  #studio.signed-in .composer-footer .primary {padding:10px 13px}
}
@media(max-width:860px) {
  #studio.signed-in .creation-grid {grid-template-columns:minmax(0,1fr);gap:23px}
  #studio.signed-in .screen-intro {margin-bottom:25px}
  #studio.signed-in .idea-art {height:245px}
  #studio.signed-in .parameters {position:static;display:grid;grid-template-columns:1fr 1fr;padding:19px;gap:20px}
  #studio.signed-in .parameters>h3 {display:flex;grid-column:1/-1;padding-bottom:13px;margin-bottom:-3px;border-bottom:1px solid var(--line)}
  #studio.signed-in .parameters .parameter-field:has(.style-options) {display:block;grid-column:1/-1}
  #studio.signed-in .parameter-note {display:none}
  #studio.signed-in .parameter-cost {display:flex;grid-column:1/-1;margin-top:0;padding-top:14px}
  #studio.signed-in .mobile-generation-summary {border-radius:8px;padding:10px 11px;margin-bottom:12px;background:var(--bg)}
  #studio.signed-in .mobile-generation-summary strong {font-size:11px}
  #studio.signed-in .library-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px) {
  #studio.signed-in .app-shell {display:block;padding-bottom:calc(77px + env(safe-area-inset-bottom))}
  #studio.signed-in .topbar {height:59px;padding:0 16px;gap:9px;background:var(--bg)}
  #studio.signed-in .breadcrumb {font-size:10px;gap:6px}
  #studio.signed-in .breadcrumb>span:first-child,
  #studio.signed-in .breadcrumb>.icon {display:none}
  #studio.signed-in .topbar-actions {gap:6px}
  #studio.signed-in :is(.balance-button,#openMobileSettings) {min-height:35px;padding:7px 9px;font-size:10px;gap:6px}
  #studio.signed-in #openMobileSettings {min-width:87px}
  #studio.signed-in .balance-button .icon {width:13px;height:13px}
  #studio.signed-in .workspace {padding:22px 16px 30px}
  #studio.signed-in .screen-intro {margin-bottom:24px;gap:12px}
  #studio.signed-in .screen-intro .eyebrow {font-size:7px;letter-spacing:1.35px}
  #studio.signed-in .screen-intro h2 {font-size:23px;line-height:1.18;letter-spacing:-.65px;margin:9px 0;max-width:340px}
  #studio.signed-in .screen-intro p {font-size:11px;line-height:1.7}
  #studio.signed-in .section-heading {margin-bottom:12px}
  #studio.signed-in .section-heading h3 {font-size:13px}
  #studio.signed-in .section-heading .text-button {font-size:10px}
  #studio.signed-in .starter-grid {grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(150px,57%);gap:10px;overflow-x:auto;max-width:100%;padding:0 0 7px;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--line) transparent;overscroll-behavior-x:contain}
  #studio.signed-in .idea-art {height:218px;border-radius:10px;scroll-snap-align:start;scroll-snap-stop:normal}
  #studio.signed-in .idea-art-label {font-size:12px;left:12px;right:12px;bottom:14px;min-height:0;gap:8px}
  #studio.signed-in .idea-art-label .icon {display:block;width:13px;height:13px}
  #studio.signed-in .idea-art-meta {left:11px;top:11px;font-size:6px;letter-spacing:.7px;padding:5px 6px}
  #studio.signed-in .starter-example-note {font-size:9px;line-height:1.75;margin-top:9px}
  #studio.signed-in .starter-example-note a {white-space:normal}
  #studio.signed-in .composer {margin-top:18px;padding:14px;border-radius:12px}
  #studio.signed-in .composer-heading label {font-size:10px}
  #studio.signed-in .composer textarea {font-size:16px;height:85px;min-height:85px;line-height:1.65}
  #studio.signed-in .composer-tools {margin:7px 0 13px;gap:7px 10px}
  #studio.signed-in .composer-tools>button {min-height:32px;font-size:10px;padding:7px 8px}
  #studio.signed-in .composer-tools .text-button {padding:5px 0}
  #studio.signed-in .composer-footer {padding-top:12px;gap:8px}
  #studio.signed-in .composer-footer .text-button {font-size:10px}
  #studio.signed-in .composer-footer .primary {min-height:40px;padding:10px 13px;font-size:11px}
  #studio.signed-in .under-composer {font-size:10px;gap:9px;line-height:1.75}
  #studio.signed-in .prompt-ideas {gap:6px;margin-top:14px}
  #studio.signed-in .prompt-ideas button {font-size:10px;padding:7px 8px}
  #studio.signed-in .parameters {grid-template-columns:minmax(0,1fr);gap:20px;padding:17px 15px;border-radius:12px}
  #studio.signed-in .parameters>h3 {font-size:12px;padding-bottom:13px}
  #studio.signed-in .parameters .parameter-field {grid-column:1/-1}
  #studio.signed-in .parameters label {font-size:11px}
  #studio.signed-in .parameters select {min-height:44px;font-size:12px;padding:11px}
  #studio.signed-in .field-heading .text-button {font-size:10px}
  #studio.signed-in .price-note {font-size:11px}
  #studio.signed-in .ratio-options {gap:8px}
  #studio.signed-in .ratio-options button {min-height:58px;padding:10px 3px;font-size:10px}
  #studio.signed-in .style-options {gap:7px}
  #studio.signed-in .style-options button {min-height:35px;padding:8px 13px;font-size:11px}
  #studio.signed-in .parameter-field>small {font-size:10px}
  #studio.signed-in .parameter-cost {font-size:11px}
  #studio.signed-in .parameter-cost strong {font-size:13px}
  #studio.signed-in .mobile-nav {background:var(--sidebar);padding:7px 10px calc(7px + env(safe-area-inset-bottom));gap:5px;box-shadow:0 -5px 25px #00000013}
  #studio.signed-in .mobile-nav button {min-height:51px;font-size:9px;padding:7px 3px;gap:5px;border-radius:8px}
  #studio.signed-in .mobile-nav button[aria-current=page] {background:var(--hover)}
  #studio.signed-in .mobile-nav button[aria-current=page] .icon {color:var(--visual-accent)}
  #studio.signed-in .app-footer {margin:0 16px;font-size:7px;padding:14px 0 18px}
  #studio.signed-in .dropzone {min-height:235px;padding:30px 16px}
  #studio.signed-in .dropzone strong {font-size:15px}
  #studio.signed-in .dropzone span {font-size:11px;max-width:220px;line-height:1.7}
  #studio.signed-in .result-frame>img {max-height:60dvh}
  #studio.signed-in .result-actions {gap:7px}
  #studio.signed-in .result-actions .secondary {font-size:10px;min-height:37px;padding:8px 9px}
  #studio.signed-in .chat-heading {gap:12px}
  #studio.signed-in .chat-heading select {width:100%;min-height:42px}
  #studio.signed-in .chat-empty {min-height:290px;padding:24px 5px;gap:13px}
  #studio.signed-in .chat-empty h3 {font-size:22px;letter-spacing:-.5px}
  #studio.signed-in .chat-empty p {font-size:12px}
  #studio.signed-in .chat-suggestions {gap:8px}
  #studio.signed-in .chat-suggestions button {font-size:10px;padding:9px 11px;text-align:left;line-height:1.5}
  #studio.signed-in .chat-composer {margin-top:0}
  #studio.signed-in .project-panel {padding:16px 13px;margin-bottom:20px}
  #studio.signed-in .project-panel-heading h3 {font-size:14px}
  #studio.signed-in .project-panel-heading button {font-size:10px;padding:8px;white-space:normal;text-align:left}
  #studio.signed-in .project-filter {min-width:130px;font-size:11px;padding:11px 12px}
  #studio.signed-in .library-grid {gap:11px}
  #studio.signed-in .library-card {border-radius:10px}
  #studio.signed-in .library-card>p {font-size:11px;padding:12px 10px 4px}
  #studio.signed-in .library-card>small {font-size:9px;padding:0 10px}
  #studio.signed-in .library-card>button.secondary {font-size:10px;min-height:31px;margin:10px 10px 0}
  #studio.signed-in .library-empty strong {font-size:20px}
  #studio.signed-in .library-detail-shell {border-radius:12px}
  body:has(#studio.signed-in) dialog .dialog-heading h2 {font-size:21px;line-height:1.25}
}
@media(max-width:359px) {
  #studio.signed-in .topbar {padding:0 12px;gap:7px}
  #studio.signed-in .workspace {padding-left:12px;padding-right:12px}
  #studio.signed-in .screen-intro h2 {font-size:21px}
  #studio.signed-in .idea-art {height:198px}
  #studio.signed-in .starter-grid {grid-auto-columns:60%;gap:9px}
  #studio.signed-in .composer {padding:12px}
  #studio.signed-in .composer-footer .text-button {font-size:9px;gap:5px}
  #studio.signed-in .composer-footer .primary {padding:10px 11px;font-size:10px}
  #studio.signed-in .composer-tools>button {font-size:9px}
  #studio.signed-in .style-options button {padding:8px 11px;font-size:10px}
  #studio.signed-in .app-footer {margin:0 12px}
}
@media(prefers-reduced-motion:reduce) {
  #studio.signed-in .idea-art:hover:not(:disabled) {transform:none}
  #studio.signed-in .starter-grid {scroll-behavior:auto;scroll-snap-type:none}
}
