/* Text metrics are independent of frame sizes and touch targets. */
body:has(.studio-shell.jc-studio) {
  --wc-small: 13.2px;
  --wc-label: 14.4px;
  --wc-body: 15.6px;
  --wc-input: 16.8px;
  --wc-control: 36px;
  --wc-icon: 17px;
  --wc-touch: 44px;
}

.studio-shell.jc-studio .creator-welcome > h1 { font-size: 28.8px; line-height: 1.45; }
.studio-shell.jc-studio .creator-welcome > p { font-size: var(--wc-body); }
.studio-shell.jc-studio .creator-navigation button,
.studio-shell.jc-studio .ch-sidebar .ch-nav-button { min-height: 42px; font-size: var(--wc-body); }
.studio-shell.jc-studio .creator-navigation button { min-height: 44px; }
.studio-shell.jc-studio :is(.creator-navigation,.creator-nav-footer) > button { padding: 8px 11px; gap: 10px; }
.studio-shell.jc-studio .creator-back { min-height: 38px; font-size: var(--wc-input); }
.studio-shell.jc-studio .creator-nav-footer button { min-height: 40px; font-size: var(--wc-label); }
.studio-shell.jc-studio :is(.creator-navigation,.creator-nav-footer,.creator-brand-row,.ch-sidebar) button > svg,
.studio-shell.jc-studio .creator-back > svg { width: var(--wc-icon); height: var(--wc-icon); }
.studio-shell.jc-studio .ch-list-heading { font-size: var(--wc-input); line-height: 24px; }
.studio-shell.jc-studio .ch-recent-open { min-height: var(--wc-control); font-size: var(--wc-label); }
.studio-shell.jc-studio .ch-sidebar .ch-more-chats { min-height: var(--wc-control); font-size: var(--wc-label); }
.studio-shell.jc-studio .ch-recent-cover { flex-basis: 26px; width: 26px; height: 26px; }
.studio-shell.jc-studio .ch-recent-more { flex-basis: 28px; width: 28px; height: 30px; }
.studio-shell.jc-studio .jc-workspace-label,
.studio-shell.jc-studio .studio-account :is(.studio-user,.studio-credits,.studio-login) { font-size: var(--wc-label); }
.studio-shell.jc-studio .studio-account button > svg { width: 19px; height: 19px; }
.studio-shell.jc-studio .cd-tools .cd-rail { height: 38px; }
.studio-shell.jc-studio .cd-rail .cd-icon { flex-basis: 32px; width: 32px; height: 31px; }
.studio-shell.jc-studio .cd-icon svg { width: var(--wc-icon); height: var(--wc-icon); }
.studio-shell.jc-studio .jc-mobile-toggle > svg { width: 19px; height: 19px; }

.studio-shell.jm-studio.jc-studio .jc-composer { padding: 14px 14px 10px; border-radius: 20px; }
.studio-shell.jm-studio.jc-studio .jc-composer .jc-prompt-row { min-height: 71px; height: 71px; }
.studio-shell.jm-studio.jc-studio .jc-writing textarea.jc-prompt,
.studio-shell.jm-studio.jc-studio .jc-rich-hint { font-size: var(--wc-input); line-height: 1.5; }
.studio-shell.jm-studio.jc-studio .jc-composer :is(.creation-kind-trigger,.native-open,.ui-select-trigger,.jm-control > summary) {
  min-height: var(--wc-control); height: auto; font-size: var(--wc-label); line-height: 1.4;
}
.studio-shell.jm-studio.jc-studio .jc-composer :is(.creation-kind-trigger,.native-open,.ui-select-trigger,.jm-control > summary) > svg:not(:last-child) {
  width: 15px; height: 15px;
}
.studio-shell.jm-studio.jc-studio .jc-composer .jc-icon-tool {
  width: var(--wc-control); height: var(--wc-control);
}
.studio-shell.jm-studio.jc-studio .jc-icon-tool > .ui-icon,
.studio-shell.jm-studio.jc-studio .jc-send > .ui-icon { width: 19px; height: 19px; }
.studio-shell.jm-studio.jc-studio .jc-send { flex-basis: 38px; width: 38px; height: 38px; }
.studio-shell.jm-studio.jc-studio .jc-cost { font-size: var(--wc-label); }
.studio-shell.jm-studio.jc-studio .jc-cost > svg { width: 16px; height: 16px; }
.studio-shell.jm-studio.jc-studio :is(.jc-composer-note,.jc-inline-message,.jc-batch-note small) { font-size: var(--wc-small); }
.studio-shell.jm-studio.jc-studio .jc-tool-tip :is(strong,span) { font-size: var(--wc-label); }
.studio-shell.jm-studio.jc-studio .jc-quick-tool > .jc-tool-tip {
  transition: opacity .17s, translate .2s, visibility .2s, display .2s allow-discrete;
}
.studio-shell.jm-studio.jc-studio .jc-quick-tool:not(:hover):not(:focus-within) > .jc-tool-tip { display: none; }
@starting-style {
  .studio-shell.jm-studio.jc-studio .jc-quick-tool:is(:hover,:focus-within) > .jc-tool-tip { opacity: 0; translate: -50% 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .studio-shell.jm-studio.jc-studio .jc-quick-tool > .jc-tool-tip { transition: none; }
}

.jm-studio.jc-studio .jc-popover :is(.jc-popover-title,.jc-model-section-label) { font-size: var(--wc-label); line-height: 1.4; }
.jm-studio.jc-studio .jc-model-options .jc-model-family { min-height: 38px; font-size: var(--wc-body); }
.jm-studio.jc-studio .jc-model-options .jc-model-versions .jc-model-option { min-height: 56px; }
.jm-studio.jc-studio .jc-model-options .jc-model-copy strong { font-size: var(--wc-body); }
.jm-studio.jc-studio .jc-model-options .jc-model-family > strong { font-size: var(--wc-label); }
.jm-studio.jc-studio .jc-model-options .jc-model-copy small,
.jm-studio.jc-studio .jc-model-options .jc-clip-duration { font-size: var(--wc-small); }
.jm-studio.jc-studio .jc-model-options .jc-model-check > svg { width: var(--wc-icon); height: var(--wc-icon); }
.jm-studio.jc-studio .jc-popover .jc-output-spec { font-size: var(--wc-small); }
.jc-overlay-root #jm-ratio-panel .jc-popover-title { font-size: var(--wc-label); line-height: 1.4; }
.jc-overlay-root #jm-ratio-panel .jc-ratio-grid > button {
  height: 57px; grid-template-rows: 21px auto; font-size: var(--wc-label); line-height: 1.3;
}
.jc-overlay-root #jm-ratio-panel .jc-ratio-shape { scale: 1; }
.jc-overlay-root #jm-ratio-panel .jc-resolution-options > button { min-height: 34px; font-size: var(--wc-body); }
.jc-overlay-root #jm-ratio-panel .jc-dimensions,
.jc-overlay-root #jm-ratio-panel .jc-dimensions input { font-size: var(--wc-label); }
.jc-overlay-root #jm-ratio-panel .jc-dimensions label { min-height: 38px; }
.jc-overlay-root #jm-ratio-panel :is(.vout,.vout legend,.vout-readout) { font-size: var(--wc-label); }
.jc-overlay-root #jm-ratio-panel .vout-ratios button { min-height: 50px; grid-template-rows: 19px auto; }
.jc-overlay-root #jm-ratio-panel .vout-ratios i { scale: 1.05; }
.jc-overlay-root #jm-ratio-panel .vout-options button { min-height: 33px; }
.jc-overlay-root #jm-ratio-panel .vout input[type="range"] { min-height: 23px; }
.jc-overlay-root #jm-ratio-panel .vout-note { font-size: var(--wc-small); }
.jc-overlay-root #jm-ratio-panel .vout-endpoints { font-size: 12px; line-height: 1.4; }
.jc-overlay-root #jm-ratio-panel .jc-size-lock { flex-basis: 33px; height: var(--wc-control); }
body:has(.studio-shell.jc-studio) :is(.ui-select-popover .ui-select-option,.creation-kind-popover button,.native-panel button,.pd-dialog .gf-button) {
  min-height: var(--wc-control); font-size: var(--wc-label);
}

.studio-shell.jc-studio .zr-overlay :is(.zr-top,.zr-tools) { --zr-action-size: 33px; }
.studio-shell.jc-studio .zr-overlay :is(.zr-top,.zr-tools) :is(.zr-icon,.zr-menu > summary) svg {
  width: 18px; height: 18px;
}
.studio-shell.jc-studio :is(.zr-footer .zr-button,.jc-record-actions > button,.zr-footer > .zr-menu > summary) {
  min-height: 33px; padding: 4px 8px; font-size: var(--wc-label);
}
.studio-shell.jc-studio .jc-record-actions { flex-wrap: wrap; }
.studio-shell.jc-studio .jc-record-actions > button { min-width: 33px; }
.studio-shell.jm-studio.jc-studio .cg-group :is(.zr-footer,.jc-record-actions) :is(button,summary) > svg { flex: 0 0 16px; width: 16px; height: 16px; }
body:has(.studio-shell.jc-studio) :is(.zr-menu-list .zr-button,.zr-tools .zr-overflow-list .zr-icon,.ch-row-option) {
  min-height: var(--wc-control); font-size: var(--wc-body);
}
body:has(.studio-shell.jc-studio) :is(.zr-menu-list,.ch-row-options) svg { width: var(--wc-icon); height: var(--wc-icon); }

.studio-shell.jc-studio .cd-filter-heading strong { font-size: 18px; }
.studio-shell.jc-studio .cd-tools .cd-filters { padding: 14px 14px 9px; }
.studio-shell.jc-studio .cd-tools :is(.cd-chip,.cd-group-head strong,.cr-trigger,.cd-query) { font-size: var(--wc-label); }
.studio-shell.jc-studio .cd-tools .cd-chip { min-height: 31px; }
.studio-shell.jc-studio .cd-group-head .cd-chip { min-height: 25px; font-size: var(--wc-small); }
body:has(.studio-shell.jc-studio) :is(.ch-dialog-head h2,.studio-popup h2,.pd-dialog h2,.native-panel h2,.zr-dialog h2,.ca-header h2) { font-size: 20.4px; }
body:has(.studio-shell.jc-studio) :is(.ch-dialog,.ca-drawer,.studio-popup,.zr-dialog,.pd-dialog) :is(.ch-action,.ch-day-all,.ch-pager button,.ca-scopes button,.ca-tabs button,.jch-tab,.zr-button,.pd-field) {
  min-height: var(--wc-control); font-size: var(--wc-label);
}
body:has(.studio-shell.jc-studio) :is(.ch-dialog,.ca-drawer,.studio-popup,.pd-dialog,.native-panel) :is(.ch-muted,.ch-meta,.ch-error,.ch-day-caption,.ca-name,.jch-name,.pd-status,.native-field) {
  font-size: var(--wc-label);
}
body:has(.studio-shell.jc-studio) .ch-day-heading h3 { font-size: var(--wc-input); }
body:has(.studio-shell.jc-studio) .ch-dialog :is(.ch-project-name,.ch-day-context) { font-size: var(--wc-small); }
body:has(.studio-shell.jc-studio) .ch-dialog .ch-month :is(select,button) { min-height: 33px; font-size: var(--wc-label); }
body:has(.studio-shell.jc-studio) :is(.cd-tools,.ca-drawer) .cr-range .cr-field { height: var(--wc-control); }
body:has(.studio-shell.jc-studio) :is(.cd-tools,.ca-drawer) .cr-range :is(input,.cr-cell,.cr-title) { font-size: var(--wc-label); }
body:has(.studio-shell.jc-studio) :is(.cd-tools,.ca-drawer) .cr-grid .cr-cell { min-height: 30px; }
body:has(.studio-shell.jc-studio) .ch-dialog .ch-close svg { width: var(--wc-icon); height: var(--wc-icon); }
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="calendar"] .ch-dialog-head {
  min-height: 51px; padding: 11px 18px 11px 21px; gap: 10px;
}
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="calendar"] .ch-dialog-body { padding: 5px 21px 19px; }
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] { --ch-confirm-pad: 23px; }
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] .ch-actions { margin-top: 19px; padding-block: 11px; }
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] h2 { font-size: 21.6px; }
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] .ch-confirm-name { font-size: 18px; }
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] .ch-confirm-description,
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] .ch-action { font-size: var(--wc-body); }
body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] .ch-close { width: 32px; height: 32px; }

@media (min-width: 761px) {
  .studio-shell.jm-studio.jc-studio .jc-main > .studio-header { flex-basis: 56px; height: 56px; }
  .studio-shell.jc-studio .studio-header .studio-account > :is(.za-notification-button,.studio-credits),
  .studio-shell.jc-studio .studio-account .studio-user { min-height: 44px; }
  .studio-shell.jc-studio .studio-header .studio-account > .za-notification-button { width: 44px; height: 44px; }
}
@media (max-width: 760px) {
  .studio-shell.jm-studio.jc-studio .jc-composer { padding: 12px 10px 9px; border-radius: 17px; }
  .studio-shell.jc-studio .creator-welcome > h1 { font-size: 24px; }
  .studio-shell.jm-studio.jc-studio .jc-model-menu > summary > span { max-width: min(43vw,170px); }
  .studio-shell.jc-studio .cd-rail .cd-icon { flex-basis: 32px; width: 32px; height: 36px; }
  .studio-shell.jm-studio.jc-studio .jc-toolbar > .jc-controls {
    display: flex; flex-wrap: wrap; align-items: center; gap: 2px;
    min-width: 0; max-width: 100%; overflow: visible;
  }
  .studio-shell.jm-studio.jc-studio .jc-toolbar .jc-model-mode-pair { min-width: 0; max-width: 100%; flex-wrap: wrap; }
  .studio-shell.jm-studio.jc-studio .jc-send-area { flex-direction: row; align-items: center; }
  .jc-overlay-root #jm-ratio-panel .jc-ratio-grid > button { height: 46px; }
  .studio-shell.jc-studio .cd-rail .cd-query { font-size: 16px; }
}
@media (max-width: 540px) {
  body:has(.studio-shell.jc-studio) .ch-dialog[data-view="calendar"] .ch-dialog-head { padding: 10px 11px 10px 14px; gap: 5px; }
  body:has(.studio-shell.jc-studio) .ch-dialog[data-view="calendar"] .ch-dialog-body { padding: 2px 13px 13px; }
  body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] { --ch-confirm-pad: clamp(15px,5vw,20px); }
  .studio-shell.jm-studio.jc-studio .jc-model-menu > summary { padding-inline: 4px; }
  .jm-studio.jc-studio .jc-model-options .jc-model-browser { grid-template-columns: minmax(0,.79fr) minmax(0,1.21fr); }
  .jm-studio.jc-studio .jc-model-options .jc-model-family > strong,
  .jm-studio.jc-studio .jc-model-options .jc-model-copy > strong {
    white-space: normal; overflow-wrap: anywhere; line-height: 1.35;
  }
  .jm-studio.jc-studio .jc-model-options .jc-model-versions .jc-model-option { padding-inline: 6px; }
}
@media (pointer: coarse) {
  .studio-shell.jm-studio.jc-studio .jc-composer :is(.jc-icon-tool,.jc-send) { min-width: var(--wc-touch); }
  .studio-shell.jc-studio .jc-resume-action { min-height: var(--wc-touch); }
  .studio-shell.jm-studio.jc-studio .jc-composer :is(.creation-kind-trigger,.native-open,.ui-select-trigger,.jm-control > summary,.jc-icon-tool,.jc-send),
  .studio-shell.jc-studio .ch-sidebar :is(.ch-nav-button,.ch-recent-open,.ch-recent-more),
  .studio-shell.jc-studio :is(.jc-record-actions > button,.zr-footer .zr-button,.zr-footer .zr-menu > summary),
  body:has(.studio-shell.jc-studio) :is(.ch-dialog .ch-action,.ch-dialog .ch-close,.cd-options .cd-chip,.ch-row-option,.zr-menu-list .zr-button) {
    min-height: var(--wc-touch);
  }
  .studio-shell.jc-studio .zr-overlay :is(.zr-top,.zr-tools) { --zr-action-size: var(--wc-touch); }
  body:has(.studio-shell.jc-studio) .ch-dialog[data-view="remove"] .ch-close { width: var(--wc-touch); height: var(--wc-touch); }
}