/* Zone roots are mutually assigned. Everything outside an explicit root is UI text. */
:root { --room-text-scale: 1; --agent-text-scale: 1; --menu-text-scale: 1; --ui-text-scale: 1; --reading-text-scale: 1; --font-scale: var(--ui-text-scale); }
html.settings-root { height: auto; min-height: 100%; overflow-y: auto; overflow-x: hidden; }
html.settings-root .settings-document { height: auto; min-height: 100dvh; overflow: visible; }
.font-zone-control input[type=range] { touch-action: pan-y; }
select,option { font: inherit; }
:where(.brand-mark,.user-avatar,.message-avatar) { --font-scale: 1; }
:where(.chat-room-messages,.chat-room-composer,[data-font-zone=room]) { --font-scale: var(--room-text-scale); font-size: calc(1rem * var(--font-scale)); }
:where(.messages,.composer,[data-font-zone=agent]) { --font-scale: var(--agent-text-scale); font-size: calc(1rem * var(--font-scale)); }
:where(#sidebar,.mobile-workspace-nav,.management-nav,.settings-sidebar nav,[data-font-zone=menu]) { --font-scale: var(--menu-text-scale); font-size: calc(1rem * var(--font-scale)); }
:where(dialog,.modal-backdrop,.notification-popover,.notice-toast,.toast,.settings-pane,.settings-header,.chat-header,.chat-room-header,.message-meta,.chat-room-message-actions,.room-attachment-panel,.chat-room-emoji-panel,#composerHint,[data-font-zone=ui]) { --font-scale: var(--ui-text-scale); font-size: calc(1rem * var(--font-scale)); }
:where(.reader-content,.source-reader-content,[data-font-zone=reading]) { --font-scale: var(--reading-text-scale); font-size: calc(1rem * var(--font-scale)); }
:where(.run-status-banner,.message-quality-status,.knowledge-answer-sources,.knowledge-answer-origin) { --font-scale: var(--ui-text-scale); font-size: calc(1rem * var(--font-scale)); }
.room-delivery { font-size: calc(.625rem * var(--font-scale)); }
#roomSettingsDialog .chat-room-members { grid-template-columns: repeat(auto-fit,minmax(min(100%,calc(90px * var(--ui-text-scale))),1fr)); }
.reader-content { font-size: calc(var(--reader-font-size, 18px) * var(--font-scale)); }
.typography-preview { font-size: calc(16px * var(--font-scale)); padding: 12px; border: 1px solid var(--line); border-radius: 8px; line-height: 1.6; overflow-wrap: anywhere; background: var(--surface-soft); }
.font-zone-controls { min-width: 0; margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 12px; display: grid; gap: 20px; }
.font-zone-control { min-width: 0; }
.font-zone-control > small,.font-zone-controls > p { font-size: .85em; color: var(--muted); }
.font-zone-control input { width: 100%; }
.font-zone-control output { float: right; }
.settings-pane,dialog,.compact-modal,.notification-popover { overflow-wrap: anywhere; }
.field, .settings-pane form, .home-card-copy { min-width: 0; }
.primary-button,.secondary-button,.management-nav-item,.workspace-nav-item,.sidebar-quick-link,.theme-card { height: auto; min-height: 40px; white-space: normal; overflow-wrap: anywhere; }
.settings-sidebar nav a { height: auto; flex-wrap: wrap; }
.settings-header { grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); }
.chat-room-composer textarea { max-height: min(160px,30dvh); }
.chat-room-header h2,.workspace-page-title { min-width: 0; }
.home-card-grid { grid-template-columns: repeat(auto-fit,minmax(min(100%,var(--home-card-width,220px)),1fr)); }
.home-card { min-height: var(--home-card-height,196px); padding: var(--home-card-padding,20px); gap: var(--home-card-gap,18px); height: auto; }
html[data-home-card-size=compact] { --home-card-width: 180px; --home-card-height: 150px; --home-card-padding: 16px; --home-card-gap: 10px; }
html[data-home-card-size=spacious] { --home-card-width: 280px; --home-card-height: 280px; --home-card-padding: 28px; --home-card-gap: 28px; }
.layout-preview { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.layout-preview .home-card { padding: var(--home-card-padding,20px); min-height: var(--home-card-height,196px); border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); display: flex; justify-content: center; overflow-wrap: anywhere; }
@media (max-width:820px) {
    .app-view { padding-bottom: env(safe-area-inset-bottom); }
    .mobile-keyboard-open .app-view { padding-bottom: 0; }
    .mobile-workspace-nav { display: none !important; }
    #notificationEntry { display: flex; width: 100%; height: auto; min-height: 40px; padding: 8px 12px; margin: 0 0 8px; gap: 8px; }
    #notificationEntry .notice-label { font-size: inherit; }
    #notificationEntry .notice-badge { position: static; margin-left: auto; }
    .mobile-workspace-nav button { white-space: normal; overflow-wrap: anywhere; }
    .chat-header .header-actions { flex-wrap: wrap; }
    .chat-header { min-height: 60px; height: auto; }
    .settings-header { gap: 6px; }
    .settings-header a { white-space: normal; }
    .settings-header #settingsAccount { display: none; }
    .settings-header { grid-template-columns: 1fr auto 1fr; }
    .font-zone-controls { padding: 10px; }
    .settings-pane { padding: 16px 12px; }
    .modal-backdrop { overflow-y: auto; }
    .compact-modal,.community-dialog { max-width: calc(100vw - 16px); max-height: calc(var(--mobile-visual-height,100dvh) - 16px); overflow-y: auto; }
    .home-card-grid { grid-template-columns: minmax(0,1fr); }
    html[data-home-card-size=standard] { --home-card-height: 78px; --home-card-padding: 14px 17px; --home-card-gap: 14px; }
    html[data-home-card-size=compact] { --home-card-height: 68px; --home-card-padding: 10px 14px; --home-card-gap: 10px; }
    html[data-home-card-size=spacious] { --home-card-height: 100px; --home-card-padding: 18px 20px; --home-card-gap: 18px; }
}