/* PIKA UI typography contract: 12px controls, 14px titles, 10px secondary text.
 * An important cascade layer prevents lazy route CSS / font shorthands from
 * restoring legacy sizes. SVG artwork and canvas content are not UI typography.
 */
@layer pika-typography {
  :root {
    --ui-text-size: 12px;
    --ui-title-size: 14px;
    --ui-secondary-size: 10px;
  }

  body { font-size: var(--ui-text-size) !important; }
  body :where(*):not(svg, svg *, canvas, [aria-hidden="true"], [aria-hidden="true"] *, [data-typography="artwork"], [data-typography="artwork"] *) {
    font-size: inherit !important;
  }

  body :is(h1, h2, h3, [role="heading"], .page-title, .section-title,
    [class$="-title"], [data-ui-text="title"],
    .design-project-copy > strong, .profile-billing-identity > strong, .monitor-ratio-label,
    .bill-stats strong, .bill-value, .bill-price) {
    font-size: var(--ui-title-size) !important;
  }

  body :is(h4, h5, h6, p, small, figcaption, dt, label,
    [class$="-subtitle"], [class$="-description"], [class$="-hint"],
    [class$="-note"], [class$="-meta"], [class$="-caption"],
    .muted, .hint, .eyebrow, .section-kicker, .member-role, .role-pill,
    .bill-badge, .bill-note, .bill-notice, .bill-empty, .bill-stats span,
    .profile-account-line, .profile-membership-badge, [data-ui-text="secondary"]) {
    font-size: var(--ui-secondary-size) !important;
  }

  /* Body copy and user-authored documents are not subtitles. */
  body :is(input, textarea, select, option, table, pre, code,
    [contenteditable="true"], .prose p, .markdown p,
    .design-message p, [data-ui-text="body"]) {
    font-size: var(--ui-text-size) !important;
  }
  body :is(input, textarea)::placeholder { font-size: var(--ui-secondary-size) !important; }

  /* Sketch generation requirements use body size for both input and prompt. */
  body textarea.sp-generation-input,
  body textarea.sp-generation-input::placeholder {
    font-size: var(--ui-text-size) !important;
  }

  /* Conversation copy, elapsed time and progress share the requested 12px.
     Keep this exception out of composers, global captions and user artwork. */
  body .ds-message.ds-conversation-message,
  body .ds-message.ds-conversation-message :where(*):not(svg, svg *, canvas, [aria-hidden="true"], [aria-hidden="true"] *, [data-typography="artwork"], [data-typography="artwork"] *) {
    font-size: var(--ui-text-size) !important;
  }

  /* All generation editors and inline reference names share the body size. */
  body .rp-editor,
  body .rp-editor span {
    font-size: var(--ui-text-size) !important;
  }

  /* Four creation modes share the approved design-plan placeholder treatment. */
  body .rp-editor::before,
  body .iw-workbench .iw-prompt-field textarea::placeholder,
  body .iw-workbench .is-placeholder {
    font-size: var(--ui-text-size) !important;
    color: #92968e !important;
    font-weight: 400 !important;
    opacity: 1 !important;
  }

  /* An inline title editor keeps the heading size while the name is edited. */
  body :is(input, textarea)[data-ui-text="title"] { font-size: var(--ui-title-size) !important; }
  /* Plan section headings are module titles, not secondary h4 captions. */
  body .ipm-dialog h4[data-ui-text="title"] { font-size: var(--ui-title-size) !important; }
  /* User-requested exception: the selected plan name is 18px, including its editor. */
  body .ipm-dialog .ipm-title-row > h3,
  body .ipm-dialog .ipm-title-row > input.ipm-inline-name { font-size: 18px !important; }
  /* User-requested workspace heading size, including its inline rename field. */
  body .my-projects .mp-scrolling-heading .mp-title-edit,
  body .my-projects .mp-scrolling-heading .mp-title-input { font-size: 18px !important; }

  body :is(button, [role="button"], [role="tab"], summary,
    a.primary, a.ghost, nav a, .tabs a),
  body :is(button, [role="button"], [role="tab"], summary,
    a.primary, a.ghost, nav a, .tabs a) :where(*):not(svg, svg *, [aria-hidden="true"], [aria-hidden="true"] *) {
    font-size: var(--ui-text-size) !important;
  }

  /* Plan module titles stay 14px even inside a disclosure/conversation. */
  /* Historical plan content in the library is body text, not a 10px p caption. */
  body .design-service-plan-manager .ds-round-prose,
  body .design-service-plan-manager .ds-current-group > header > h4 {
    font-size: var(--ui-text-size) !important;
  }
  body .ds-current-card > .ds-current-disclosure > summary > h3,
  body .ds-current-preview > h3[data-ui-text="title"],
  body .ds-current-card .sp-section > h4[data-ui-text="title"],
  body .ipm-support-section.sp-section > h4[data-ui-text="title"],
  body .ipm-support-section.sp-section > .ds-current-disclosure > summary > h4[data-ui-text="title"] {
    font-size: var(--ui-title-size) !important;
  }

  /* User-requested compact resource-category, approval-status and report-status options. */
  body .admin-library-page .al-filters .al-options > button { font-size: var(--ui-secondary-size) !important; }

  /* User-requested 10px angle labels and options in the image case picker. */
  body .iw-resource-popover .resource-filter-bar .resource-filter-label,
  body .iw-resource-popover .resource-filter-bar .resource-filter-options > button { font-size: var(--ui-secondary-size) !important; }
  /* Compact creation settings: text only, preserving icons and control hit areas. */
  body .ds-jewelry-menu > fieldset :is(legend, button, button span),
  body .ds-sketch-output-menu .iw-choices :is(legend, button, button span),
  body #iw-settings-popover.iw-popover-generation .iw-choices :is(legend, button, button span),
  body #iw-settings-popover.iw-popover-output .iw-choices :is(legend, button, button span),
  body .vw-settings[aria-label="输出规格"] .iw-choices :is(legend, button, button span),
  body .ds-sketch-case-popover[aria-label="设计稿案例"] .resource-filter-bar :is(legend, button, button span),
  body #iw-settings-popover.iw-popover-person .resource-filter-bar :is(legend, button, button span),
  body .vw-settings[aria-label="数字人"] .resource-filter-bar :is(legend, button, button span),
  body .vw-settings[aria-label="场景"] .resource-filter-bar :is(legend, button, button span) {
    font-size: var(--ui-secondary-size) !important;
  }
  /* Compact material-panel action, explicitly requested at secondary size. */
  /* Image/video material captions share the compact design-material name size. */
  body .iw-material-panel .iw-product-label,
  body .iw-material-panel .iw-product-label > .iw-product-name {
    font-size: var(--ui-secondary-size) !important;
  }
  /* First/last upload-card labels are secondary text, not button action copy. */
  body .vw-workbench .vw-endpoint-empty > small { font-size: var(--ui-secondary-size) !important; }
  body .vw-workbench .vw-keyframe-upload-hint { font-size: var(--ui-text-size) !important; }

  body .pa-editor-dialog > .pa-dialog-content > .pa-header h2 {
    font-size: var(--ui-secondary-size) !important;
    font-weight: 400 !important;
  }
  /* Product-library labels sit inside the image button, not in a text footer. */
  body .pa-library-page .library-cover .pa-library-name { font-size: var(--ui-text-size) !important; }
  body .pa-library-page .library-cover .pa-library-meta { font-size: var(--ui-secondary-size) !important; }
  /* Hint styling is unchanged except for the newly agreed small-text size. */
  body .vw-workbench .vw-settings[aria-label="输出规格"] .iw-choices > legend {
    font-size: var(--ui-secondary-size) !important;
  }
  body #iw-settings-popover.iw-popover-generation > .iw-choices > legend {
    font-size: var(--ui-secondary-size) !important;
  }
  body #iw-settings-popover.iw-popover-output > .iw-choices > legend {
    font-size: var(--ui-secondary-size) !important;
  }
  body .ds-jewelry-menu > fieldset > legend {
    font-size: var(--ui-secondary-size) !important;
  }
  body .vw-settings[aria-label="数字人"] .resource-filter-label {
    font-size: var(--ui-secondary-size) !important;
  }
  body #iw-settings-popover.iw-popover-person .resource-filter-label {
    font-size: var(--ui-secondary-size) !important;
  }
  /* Secondary labels in sketch controls and the annotated resource pickers. */
  body .ds-sketch-output-menu > .iw-choices > legend,
  body .ds-sketch-case-popover[aria-label="设计稿案例"] > .iw-dialog-inner > h2,
  body .iw-resource-popover[aria-label="资源案例"] > .iw-dialog-inner > h2,
  body .vw-settings[aria-label="场景"] .resource-filter-label {
    font-size: var(--ui-secondary-size) !important;
    color: var(--iw-muted, #60675f) !important;
    font-weight: 400 !important;
  }
  /* Resource upload/edit location choices use the requested compact 10px size. */
  body .rl-location-panel :is(legend, button, button span) { font-size: var(--ui-secondary-size) !important; }
  body .ds-mode-menu .ui-select-menu-title { font-size: var(--ui-secondary-size) !important; }
  body .model-picker-menu .ui-select-menu-title,
  body .model-picker-menu button [data-ui-text="secondary"] { font-size: var(--ui-secondary-size) !important; }
  body .ipm-dialog button .ipm-status { font-size: var(--ui-secondary-size) !important; }
  body .ipm-dialog button .ipm-plan-jewelry { font-size: var(--ui-secondary-size) !important; }
  body [role="tooltip"], body .ds-button-hint,
  body [data-tooltip]::before, body [data-tooltip]::after {
    font-size: var(--ui-secondary-size) !important;
  }
  /* Result metadata disclosure stays inline at the requested 10px. */
  body .ds-message.ds-conversation-message .ds-guidance-readable h3 { font-size: var(--ui-title-size) !important; }
  body .ds-message.ds-conversation-message .ds-guidance-readable summary { font-size: var(--ui-secondary-size) !important; }
  body .ds-message.ds-conversation-message .generation-result-meta,
  body .ds-message.ds-conversation-message .generation-result-meta span,
  body .ds-message.ds-conversation-message small,
  body .ds-message.ds-conversation-message .generation-result-status { font-size: var(--ui-secondary-size) !important; }
  /* Live result progress is body copy, including standalone and plan sketches.
     Other status badges, metadata and failure messages remain secondary text. */
  body .generation-result .generation-result-status > [role="status"] {
    font-size: var(--ui-text-size) !important;
  }
  body .generation-result button.generation-result-detail-trigger,
  body .generation-result .generation-failure,
  body .generation-result .generation-failure span,
  body .ds-message.ds-conversation-message .generation-failure span,
  body .generation-result button.generation-result-detail-trigger span,
  body .generation-reference-stack .generation-reference-count { font-size: var(--ui-secondary-size) !important; }
  body .generation-hover-prompt,
  body .generation-hover-prompt [data-ui-text="body"] { font-size: var(--ui-text-size) !important; }
  /* User-requested 10px thumbnail annotation label; viewer controls stay unchanged. */
  body .result-annotatable button.result-annotate-shortcut,
  body .result-annotatable button.result-annotate-shortcut > span { font-size: var(--ui-secondary-size) !important; }
  /* Cover text also appears in standalone service-result headers. Keep its
     hidden measuring copy at the same size so truncation matches the label. */
  body .generation-plan-cover .generation-plan-paper .generation-plan-title,
  body :is(.ds-message.ds-conversation-message, .design-service-plan-manager) .generation-plan-cover .generation-plan-title,
  body :is(.ds-message.ds-conversation-message, .design-service-plan-manager) .generation-plan-cover .generation-plan-count { font-size: 10px !important; }
  body .generation-plan-cover .generation-plan-paper .generation-plan-category,
  body :is(.ds-message.ds-conversation-message, .design-service-plan-manager) .generation-plan-cover .generation-plan-category { font-size: 6px !important; }
  /* A sketch's design explanation keeps the same hierarchy inside a plan,
     a standalone result, or its viewer; historical disclosure captions do not
     shrink this module title or its actual body copy. */
  body .professional-statement,
  body .professional-statement :where(p, dt, dd, summary, li, a, span),
  body .ds-message.ds-conversation-message .professional-statement :where(p, dt, dd, summary, li, a, span) {
    font-size: var(--ui-text-size) !important;
  }
  body .professional-statement [data-ui-text="title"],
  body .ds-message.ds-conversation-message .professional-statement [data-ui-text="title"] {
    font-size: var(--ui-title-size) !important;
  }
  body .professional-statement small,
  body .ds-message.ds-conversation-message .professional-statement small {
    font-size: var(--ui-secondary-size) !important;
  }

  /* Service plans share the original plan hierarchy in preview and conversation.
     Body decisions must not inherit the global p=secondary rule, and titles
     inside a native summary must not inherit the summary/button text size. */
  body .service-document h2,
  body .service-document .service-document-section > summary > h2,
  body .ds-message.ds-conversation-message .service-document h2 {
    font-size: var(--ui-title-size) !important;
  }
  body .service-document .service-document-entry > summary > :is(h3, h4),
body .service-document .service-document-design-group h3,
body .service-document .service-document-summary,
body .service-document .service-document-detail > div,
body .service-document :is(button, textarea),
body .ds-message.ds-conversation-message .service-document :is(h3, h4, .service-document-summary, .service-document-detail > div, .service-document-edit label, button, textarea) {
    font-size: var(--ui-text-size) !important;
  }
  body .service-document small,
  body .service-document .service-document-section > summary > small,
  body .service-document [data-ui-text="secondary"],
  body .ds-message.ds-conversation-message .service-document :is(small, [data-ui-text="secondary"]) {
    font-size: var(--ui-secondary-size) !important;
  }
}
