/* Shared geometry for user-facing pages. Keep fullscreen media viewers separate. */
:root{--layout-gutter:20px;--control-radius:16px;--dialog-radius:24px;--touch-target:44px}
@media(max-width:350px){:root{--layout-gutter:16px}}
@media(max-width:767px){
 body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea,select){font-size:max(16px,1rem)}
 body :is(dialog:not(.viewer):not(.media-viewer):not(.result-viewer),.chat-action-dialog){
  position:fixed;inset-inline:0;top:var(--app-viewport-top,0px);
  bottom:max(0px,calc(100dvh - var(--app-viewport-height,100dvh) - var(--app-viewport-top,0px)));
  margin:auto;width:min(560px,calc(100% - 24px));height:fit-content;
  max-height:calc(var(--app-viewport-height,100dvh) - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
  overflow:auto;overscroll-behavior:contain;border-radius:var(--dialog-radius);box-sizing:border-box;
 }
 body dialog :is(input,textarea,select){max-width:100%;min-width:0}
 body dialog :is(label,p,h2,h3){overflow-wrap:anywhere;min-width:0}
 body dialog :is(button,summary){min-height:var(--touch-target);white-space:normal;line-height:1.4}
 body dialog :is(.dialog-heading,.generation-quote-actions,.viewer-actions){flex-wrap:wrap}
 body dialog .dialog-heading h2{flex:1;min-width:140px}
 .mobile-destinations a{overflow-wrap:anywhere;text-align:center;padding-inline:3px}
}
@media(max-height:560px) and (max-width:767px){
 body dialog:not(.viewer):not(.media-viewer):not(.result-viewer){padding:16px}
 body dialog:not(.viewer):not(.media-viewer):not(.result-viewer) h2{font-size:1.125rem;margin-block:0 12px}
 body dialog:not(.viewer):not(.media-viewer):not(.result-viewer) .dialog-heading{margin-bottom:12px}
}
/* v117: content determines height; controls remain usable with large text. */
.scenario-shortcuts,.generation-start-tools{display:flex;gap:8px;flex-wrap:wrap;margin-block:12px}
.scenario-shortcuts button,.generation-start-tools button{min-height:44px;border-radius:var(--control-radius);padding:10px 14px;border:1px solid #ffffff20;background:var(--panel,#232329);color:inherit;font:inherit;line-height:1.35;white-space:normal}
.model-health{font-size:.875rem;color:var(--muted,#aaa);line-height:1.5;overflow-wrap:anywhere}
.generation-origin{display:block;margin-block:8px;overflow-wrap:anywhere}
@media(max-width:767px){
 .model-card,.model-card-actions,.generation-shell,.generation-input,.composer-area{min-width:0}
 .model-card-actions button,.generation-quote-actions button{min-height:44px;white-space:normal;overflow-wrap:anywhere}
 .generation-start-tools{padding-inline:var(--layout-gutter)}
 .generation-start-tools button{flex:1 1 130px;font-size:.875rem}
 .generation-composer-tools{flex-wrap:wrap;gap:6px}
 .generation-composer-tools small{min-width:0;overflow-wrap:anywhere}
 .result-targets a{display:block;padding:12px;min-height:44px;overflow-wrap:anywhere}
 .scenario-shortcuts{flex-wrap:nowrap;overflow-x:auto;scroll-padding-inline:4px;padding-bottom:6px}
 .scenario-shortcuts button{flex:0 0 auto;max-width:80%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media(max-width:767px){.generation-start-tools button{box-sizing:border-box;flex:1 1 calc(50% - 4px);min-width:0;padding-inline:8px}.generation-start-tools button[hidden]{display:none}}
/* v118: comparison and export controls stay reachable on small screens. */
.comparison-controls{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.comparison-controls h3,.comparison-controls p{flex-basis:100%;margin:0;overflow-wrap:anywhere}
.comparison-controls label{display:grid;gap:6px;flex:1 1 130px;min-width:0}
.comparison-controls select,.comparison-controls input{width:100%;min-width:0;box-sizing:border-box;font-size:16px;min-height:44px}
.export-select{display:flex;align-items:center;gap:8px;min-height:44px}
.export-select input{width:20px;height:20px}
@media(max-width:480px){#modelComparison{max-width:calc(100% - 24px)}.library-card .actions{flex-wrap:wrap}.library-card .actions a{min-height:44px;display:inline-flex;align-items:center}}
.has-mobile-nav .compare-tray{bottom:calc(var(--mobile-nav-space,0px) + 12px);box-sizing:border-box}
