/* Product scaling participates in layout; browser zoom and pinch remain available. */
html{zoom:var(--interface-scale,1)}
html[data-interface-scale] dialog{max-width:calc(var(--interface-width) - 24px)!important;max-height:calc(var(--interface-height) - 24px)!important;overflow:auto}
html[data-interface-scale] #source-dialog,html[data-interface-scale] #assistant-source-dialog,html[data-interface-scale] #provenance-dialog{width:min(680px,calc(var(--interface-width) - 24px));height:calc(var(--interface-height) - 24px)}
.interface-scale-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.interface-scale-heading label{font-weight:600;font-size:14px}.interface-scale-heading output{font-size:18px;font-weight:650;white-space:nowrap}
.interface-scale-controls{display:flex;align-items:center;gap:14px;min-width:0}.interface-scale-controls input[type=range]{width:100%;min-width:0;min-height:44px;accent-color:var(--primary,var(--ink));padding:0;cursor:pointer;flex:1}
.interface-scale-controls button{flex-shrink:0;min-height:44px;white-space:nowrap;font-size:13px}.interface-scale-bounds{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-right:120px}
html[data-interface-small=true] .interface-scale-controls{flex-wrap:wrap;gap:4px}
html[data-interface-small=true] .interface-scale-controls input[type=range]{flex-basis:100%}
html[data-interface-small=true] .interface-scale-controls button{width:100%;white-space:normal}
html[data-interface-small=true] .interface-scale-bounds{margin-right:0}
html[data-interface-small=true] .stat,html[data-interface-small=true] .overview-stats .panel{min-width:0;overflow-wrap:anywhere}
html[data-interface-small=true] .overview-stats{grid-template-columns:1fr}
/* CSS media queries use browser width, so scaled desktop views also reflow. */
html[data-interface-medium=true] .overview-desktop,html[data-interface-medium=true] .overview-grid,html[data-interface-medium=true] .ocr-review{grid-template-columns:1fr}
html[data-interface-narrow=true] .sidebar{position:relative;width:auto;padding:16px 20px;border-right:0;border-bottom:1px solid var(--line)}
html[data-interface-narrow=true] .brand{font-size:20px}
html[data-interface-narrow=true] .global-nav{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}
html[data-interface-narrow=true] .global-nav button{width:auto!important;font-size:12px;padding:8px 12px;min-height:44px}
html[data-interface-narrow=true] .side-heading,html[data-interface-narrow=true] #projects,html[data-interface-narrow=true] .sidebar-bottom{display:none}
html[data-interface-narrow=true] body:not(.account-page)>main{margin-left:0;padding:0 20px 36px}
html[data-interface-narrow=true] .project-header{padding:24px 0 18px;align-items:flex-start;flex-wrap:wrap}
html[data-interface-narrow=true] h1{font-size:25px;overflow-wrap:anywhere}
html[data-interface-narrow=true] .tabs{width:100%;flex-wrap:wrap;white-space:normal;overflow:visible;gap:8px}
html[data-interface-narrow=true] .tabs .tab{padding:9px 10px;white-space:normal}
html[data-interface-narrow=true] .project-extra[open]{flex-basis:100%}
html[data-interface-narrow=true] .project-extra>div{flex-direction:column;white-space:normal}
html[data-interface-narrow=true] .settings-choices,html[data-interface-narrow=true] .theme-choices,html[data-interface-narrow=true] .documents,html[data-interface-narrow=true] .incoming-list,html[data-interface-narrow=true] .kb-list,html[data-interface-narrow=true] .mapping,html[data-interface-narrow=true] .procurement-grid,html[data-interface-narrow=true] .field-tiles,html[data-interface-narrow=true] .classification-tiles,html[data-interface-narrow=true] .wizard-grid,html[data-interface-narrow=true] .choice-group,html[data-interface-narrow=true] .project-filters,html[data-interface-narrow=true] .stats,html[data-interface-narrow=true] .account-grid,html[data-interface-narrow=true] .account-user-fields,html[data-interface-narrow=true] .login-layout{grid-template-columns:1fr}
html[data-interface-narrow=true] #document-view .preparation-controls{grid-template-columns:1fr}
html[data-interface-narrow=true] .settings-tabs{flex-wrap:wrap}
html[data-interface-narrow=true] .settings-heading-actions{flex-wrap:wrap;gap:4px}
html[data-interface-narrow=true] #settings-dialog>.dialog-title{flex-wrap:wrap;gap:8px}
html[data-interface-narrow=true] .settings-dialog,html[data-interface-narrow=true] .wizard-dialog{padding:20px}
html[data-interface-narrow=true] #settings-dialog>.dialog-title{top:-20px}
html[data-interface-narrow=true] .wizard-footer{position:sticky;bottom:-20px;background:var(--paper);padding-bottom:16px;flex-wrap:wrap}
html[data-interface-narrow=true] .wizard-footer button{flex:1;min-width:0}
html[data-interface-narrow=true] .checkbar{position:static;flex-wrap:wrap}
html[data-interface-narrow=true] .account-top{padding:16px;align-items:flex-start;flex-direction:column}
html[data-interface-narrow=true] .account-main{padding:16px}
html[data-interface-narrow=true] .login-layout{gap:16px;margin-top:16px}
html[data-interface-narrow=true] .login-intro h1{font-size:32px}
html[data-interface-narrow=true] .table-wrap{max-width:100%;overflow:auto}
html[data-interface-narrow=true] .onboarding-dialog{width:calc(var(--interface-width) - 24px)}
@media print{html{zoom:1}}
/* On small effective screens, project badges must not widen the underlying page. */
html[data-interface-small=true] .project-row{grid-template-columns:minmax(0,1fr);min-width:0}
html[data-interface-small=true] .project-row-action{flex-wrap:wrap;min-width:0}
html[data-interface-small=true] .project-row-action button{max-width:100%;white-space:normal;overflow-wrap:anywhere}