/* RCWA framing and three-column proportions match RadPro. */
.rcwa-page { font-size:14px; background:#f3f4f6; color:#222; }
.rcwa-page .page-container { width:100%; max-width:1500px; margin:0 auto; padding:24px 32px; border:0; overflow:visible; }
.rcwa-page .site-header { padding:22px 16px; border-radius:3px; }
.rcwa-page .site-header h1 { margin:0; font-size:30px; line-height:1.25; }
.rcwa-page .header-caption { display:block; margin-top:6px; font-size:13px; color:#666; }
.rcwa-page .site-nav { margin-top:12px; padding:8px 12px; border-radius:3px; }
.rcwa-page .site-nav ul { flex-wrap:wrap; gap:8px 24px; }
.rcwa-page .site-nav a { display:block; padding:6px 10px; }
.rcwa-page .site-nav a:hover { text-decoration:underline; }
.rcwa-page .layout-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-areas:'settings layers preview'; grid-template-rows:auto; gap:24px; margin:12px 0 0; align-items:stretch; }
.rcwa-page .layout-grid > .main-section, .rcwa-page .parameters-form { display:contents; }
.rcwa-settings { grid-area:settings; }
.rcwa-layers { grid-area:layers; }
.rcwa-settings,.rcwa-layers,.rcwa-page .layout-grid > .structure-preview { min-width:0; padding:16px; border:2px solid #cfcfcf; background:white; box-sizing:border-box; }
.rcwa-page .section-title { background:#e6e6e6; border-bottom:2px solid #cfcfcf; padding:8px; margin:0 0 16px; font-size:16px; }
.rcwa-page .rcwa-settings > .form-row { flex-direction:column; align-items:stretch !important; gap:16px; margin-bottom:16px; }
.rcwa-page .form-group { min-width:0; width:100%; }
.rcwa-page input,.rcwa-page select { max-width:100%; box-sizing:border-box; font-family:inherit; }
.rcwa-page .rcwa-layers .panel > div > div[style*="display:flex"] { flex-wrap:wrap; gap:10px !important; }
.rcwa-page .rcwa-layers .structure-preview > div[style*="display:flex"] { flex-direction:column; gap:16px !important; }
.rcwa-page .rcwa-layers .structure-preview { min-height:0; }
.rcwa-page .rcwa-layers .structure-preview > div > .structure-preview > div:empty { display:none; }
.rcwa-page .rcwa-layers button { min-width:0; }
.rcwa-page .preview-header { display:flex; flex-wrap:wrap; gap:8px; }
.rcwa-page .preview-header > span { flex-wrap:wrap; }
.rcwa-page .plot-content { height:320px; min-height:260px; }
.rcwa-page .site-footer { text-align:center; padding:14px 20px; margin-top:12px; color:#666; font-size:14px; border-radius:3px; }
@media(min-width:1501px) {
 .rcwa-page { font-size:15px; }
 .rcwa-page .page-container { width:85%; max-width:2200px; padding:24px 0; }
}
@media(min-width:1050px) and (max-width:1500px) {
 .rcwa-page .page-container { padding:10px 14px; }
 .rcwa-page .site-header { padding:8px 12px; }
 .rcwa-page .site-header h1 { font-size:23px; }
 .rcwa-page .header-caption { margin-top:2px; font-size:11px; }
 .rcwa-page .site-nav { padding:2px 8px; margin-top:8px; }
 .rcwa-page .layout-grid { gap:12px; margin-top:8px; }
 .rcwa-settings,.rcwa-layers,.rcwa-page .layout-grid > .structure-preview { padding:10px; }
}
@media(min-width:1050px) and (min-height:600px) and (hover:hover) {
 .rcwa-page .page-container { height:100dvh; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; gap:12px; }
 .rcwa-page .site-nav,.rcwa-page .site-footer,.rcwa-page .layout-grid { margin:0; }
 .rcwa-page .layout-grid { min-height:0; grid-template-rows:minmax(0,1fr); }
 .rcwa-settings,.rcwa-layers,.rcwa-page .layout-grid > .structure-preview { min-height:0; overflow:auto; }
}
@media(max-width:1049px), (max-width:1500px) and (pointer:coarse) {
 .rcwa-page .page-container { padding:12px; }
 .rcwa-page .layout-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:'settings layers' 'preview preview'; gap:12px; }
}
@media(max-width:767px) {
 .rcwa-page .layout-grid { grid-template-columns:minmax(0,1fr); grid-template-areas:'settings' 'layers' 'preview'; }
}

/* Match RadPro's Load example subsection. */
.rcwa-page .example-picker { margin-top:18px; padding:12px; border:1px solid #cfcfcf; background:#f3f3f3; }
.rcwa-page .example-picker > label { display:block; font-weight:600; margin-bottom:8px; }
.rcwa-page .example-picker > select { display:block; width:100%; height:28px; min-height:28px; padding:3px 7px; font:inherit; border:1px solid #bbb; border-radius:3px; background:#fff9c4; color:#222; box-sizing:border-box; }
.rcwa-page .example-picker > button { margin-top:8px; padding:9px 14px; border:1px solid #ccc; border-radius:3px; background:white; color:#444; cursor:pointer; }
.rcwa-page .example-picker > p { margin:8px 0 0; color:#666; font-size:12px; line-height:1.5; }
@media(min-width:1501px) { .rcwa-page .example-picker > select { height:30px; min-height:30px; } }

/* Wavenumber sweep uses RadPro's compact three-field range layout. */
.rcwa-page .rcwa-range-panel { padding:10px; border:2px solid #cfcfcf; background:#f3f3f3; }
.rcwa-page .rcwa-range-panel .range-heading { background:#e6e6e6; border-bottom:2px solid #cfcfcf; padding:8px; margin-bottom:10px; font-weight:600; }
.rcwa-page .rcwa-range-panel .range-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.rcwa-page .range-fields > div { min-width:0; display:flex; flex-direction:column; gap:6px; }
.rcwa-page .range-fields label { margin:0; padding:0; width:auto; background:none; border:0; color:#666; font-size:12px; }
.rcwa-page .range-fields input { width:100%; min-width:0; min-height:32px; padding:4px 8px; border:1px solid #bbb; border-radius:3px; background:#fff9c4; color:#222; font:inherit; }

/* Material library uses the same native picker and shared chips as RadPro. */
.rcwa-page .material-selection-panel { margin:22px 0 18px; padding:10px; border:2px solid #cfcfcf; background:#f3f3f3; }
.rcwa-page .material-selection-title { background:#e6e6e6; border-bottom:2px solid #cfcfcf; padding:8px; margin-bottom:10px; color:#222; font-size:.9rem; font-weight:600; }
.rcwa-page #material-library-select { width:100%; height:28px; min-height:28px; padding:3px 7px; border:1px solid #bbb; border-radius:3px; background:#fff9c4; color:#222; font:inherit; }
.rcwa-page #material-library-select:disabled { background:#eee; color:#888; }
@media(min-width:1501px) { .rcwa-page #material-library-select { height:30px; min-height:30px; } }

.rcwa-page .layer-environment-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.rcwa-page .layer-environment-fields > div { min-width:0; display:flex; flex-direction:column; gap:6px; }
.rcwa-page .layer-environment-fields label { margin:0; padding:0; width:auto; background:none; border:0; color:#666; font-size:12px; }
.rcwa-page .layer-environment-fields input,
.rcwa-page .layer-environment-fields select { width:100%; min-width:0; height:32px; padding:4px 8px; border:1px solid #bbb; border-radius:3px; background:#fff9c4; color:#222; font:inherit; box-sizing:border-box; }

.rcwa-page .layer-count-control { display:flex; align-items:center; gap:8px; margin-left:auto; }
.rcwa-page .layer-count-control label { margin:0; font-size:12px; white-space:nowrap; }
.rcwa-page #num_layers { width:64px; min-width:64px; height:30px; padding:3px 7px; border:1px solid #bbb; border-radius:3px; background:#fff9c4; font:inherit; }

.rcwa-page .rcwa-optical-model-panel { margin-top:16px; padding:12px; border:1px solid #cfcfcf; background:#f3f3f3; }
.rcwa-page .rcwa-optical-model-content > p { margin:0 0 10px; color:#666; font-size:12px; line-height:1.5; }
.rcwa-page #rcwa-optical-model-fields { display:grid; gap:8px; }
.rcwa-page .rcwa-optical-model-field { display:grid; grid-template-columns:minmax(0,1fr); gap:4px; min-width:0; margin:0; color:#444; font-size:12px; }
.rcwa-page .rcwa-optical-model-field select { width:100%; min-width:0; min-height:32px; padding:4px 8px; border:1px solid #bbb; border-radius:3px; background:#fff9c4; color:#222; font:inherit; }
.rcwa-page #rcwa-optical-model-status { color:#b91c1c; }
.rcwa-page .editor-actions { display:flex; gap:8px; margin-top:12px; padding:12px 0 0; border-top:1px solid #cfcfcf; }
.rcwa-page .editor-actions .action-btn { flex:0 1 auto; padding:9px 14px; border:1px solid #ccc; border-radius:3px; background:white; color:#444; }
.rcwa-page .rcwa-run-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.rcwa-page .rcwa-run-actions .action-btn { flex:0 1 auto; }
.rcwa-page .rcwa-run-actions #status { flex:1 0 100%; box-sizing:border-box; }

/* The editor and live diagram share a single Layer stack panel. */
.rcwa-page .rcwa-layers > .form-row > .form-group > .panel { border:0; padding:0; background:white; }
.rcwa-page .integrated-stack-preview { margin-top:16px; padding-top:16px; border-top:1px solid #cfcfcf; }
.rcwa-page .integrated-stack-preview #rcwa-preview-root { height:auto; min-height:180px; }
.rcwa-page .integrated-stack-preview .layer-stack { width:100%; max-width:none; }
.rcwa-page .editable-stack { border:1px solid #cfcfcf; padding:10px; background:white; }
.rcwa-page .stack-medium { text-align:center; padding:14px 4px; color:#304b72; font-weight:600; }
.rcwa-page .stack-medium small { display:block; margin-top:4px; color:#666; font-size:12px; font-weight:400; }
.rcwa-page .editable-layer { display:grid; grid-template-columns:30px minmax(0,1fr); align-items:center; gap:10px; min-height:82px; padding:8px; border:1px solid #bbb; margin-top:-1px; color:#20344f; }
.rcwa-page .layer-number { padding:4px; background:#ffffff80; border:1px solid #0002; text-align:center; font-size:12px; }
.rcwa-page .layer-controls { min-width:0; display:grid; gap:10px; }
.rcwa-page .layer-controls select { width:100%; min-width:0; padding:4px; border:0; background:#ffffff70; font:inherit; color:inherit; }
.rcwa-page .band-thickness { display:flex; justify-content:center; align-items:center; gap:6px; margin:0; font-size:12px; }
.rcwa-page .layer-controls input { width:100%; min-width:0; height:30px; padding:3px 7px; border:1px solid #bbb; border-radius:3px; background:#fff9c4; color:#222; font:inherit; }
.rcwa-page .band-thickness input { width:90px; }
.rcwa-page .grating-materials,.rcwa-page .grating-dimensions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.rcwa-page .grating-materials label,.rcwa-page .grating-dimensions label { display:flex; flex-direction:column; min-width:0; gap:4px; margin:0; font-size:12px; }

/* Compact controls with a single shared grating header. */
.rcwa-page .grating-column-headings { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:8px 9px 8px 49px; color:#304b72; font-size:13px; font-weight:600; text-align:center; }
.rcwa-page .grating-materials label,.rcwa-page .grating-dimensions label { align-items:center; }
.rcwa-page .grating-materials select { width:100%; max-width:160px; }
.rcwa-page .grating-dimensions input { width:90px; max-width:100%; }
.rcwa-page .film-band .layer-controls > select { width:100%; max-width:220px; justify-self:center; }
.rcwa-page .band-thickness input { width:80px; }

/* Center controls on the colored halves; the layer badge takes no column width. */
.rcwa-page .grating-band { position:relative; display:block; padding:12px 0; }
.rcwa-page .grating-band .layer-number { position:absolute; left:6px; top:50%; transform:translateY(-50%); width:24px; box-sizing:border-box; }
.rcwa-page .grating-band .grating-materials,
.rcwa-page .grating-band .grating-dimensions { gap:0; }
.rcwa-page .grating-band .grating-materials label,
.rcwa-page .grating-band .grating-dimensions label { width:100%; box-sizing:border-box; padding:0 34px; text-align:center; }
.rcwa-page .grating-band .grating-materials select { width:100%; max-width:160px; min-width:0; box-sizing:border-box; text-align:center; text-overflow:ellipsis; }
.rcwa-page .grating-band .grating-dimensions input { width:90px; max-width:100%; min-width:0; box-sizing:border-box; text-align:center; }
.rcwa-page .grating-column-headings { gap:0; padding:0 0 8px; }
.rcwa-page .grating-band { padding:8px 0; }

/* Results column: independently sized sections cannot squeeze the summary. */
.rcwa-page .layout-grid > .structure-preview { gap:16px; justify-content:flex-start; }
.rcwa-page .layout-grid > .structure-preview > #config-summary,
.rcwa-page .layout-grid > .structure-preview > .preview,
.rcwa-page .layout-grid > .structure-preview > .material-selection {
 flex:0 0 auto; min-height:0; height:auto; max-height:none; padding:0; border:0; overflow:visible;
}
.rcwa-page #config-summary .summary-header,
.rcwa-page .layout-grid > .structure-preview .preview-header,
.rcwa-page .layout-grid > .structure-preview .ms-header {
 padding:8px; margin:0 0 12px; background:#e6e6e6; border:0; border-bottom:2px solid #cfcfcf; color:#222; font-size:14px; font-weight:600;
}
.rcwa-page #config-summary .summary-content { max-height:280px; overflow:auto; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; font-size:12px; }
.rcwa-page .layout-grid > .structure-preview .preview-header { align-items:center; justify-content:space-between; }
.rcwa-page .layout-grid > .structure-preview .preview-header > span { gap:6px; font-size:12px; }
.rcwa-page #plot-xunit { min-width:0 !important; width:160px; max-width:100%; height:30px; padding:3px 7px; font:inherit; }
.rcwa-page .layout-grid > .structure-preview .plot-content { position:relative; flex:0 0 auto; height:clamp(260px,32dvh,400px); min-height:0; }
.rcwa-page .layout-grid > .structure-preview #output { max-height:180px !important; white-space:pre-wrap; overflow-wrap:anywhere; }
@media(max-width:1049px), (max-width:1500px) and (pointer:coarse) {
 .rcwa-page #config-summary .summary-content { max-height:none; overflow:visible; }
 .rcwa-page .layout-grid > .structure-preview #output,
 .rcwa-page #recent-runs-list { max-height:none !important; }
}
@media(max-width:400px) { .rcwa-page #config-summary .summary-content { grid-template-columns:minmax(0,1fr); } }
.rcwa-page .rcwa-plot-tabs { display:flex; gap:6px; border-bottom:1px solid #ccc; margin-bottom:12px; }
.rcwa-page .rcwa-plot-tabs button { padding:8px 10px; border:0; background:transparent; color:#444; font:inherit; cursor:pointer; }
.rcwa-page .rcwa-plot-tabs button[aria-selected="true"] { border-bottom:2px solid #666; background:#f3f3f3; font-weight:600; }
.rcwa-page .rcwa-plot-controls { display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:12px; flex-wrap:wrap; font-size:12px; }
.rcwa-page #plot-material-select { width:260px; max-width:100%; height:30px; padding:3px 7px; border:1px solid #bbb; border-radius:3px; background:#fff9c4; font:inherit; }
.rcwa-page #material-chart-panel { border:0; padding:0; margin:0; }
.rcwa-page #material-chart-panel .material-chart-wrap { height:clamp(260px,32dvh,400px); }
.rcwa-page #material-chart-title { font-size:12px; }
.rcwa-page #rcwa-material-empty { text-align:center; padding:30px 10px; color:#666; font-size:13px; }
.rcwa-page [role="tabpanel"][hidden], .rcwa-page .rcwa-plot-tabs button[hidden] { display:none; }

/* Layer dimensions use in-field captions, with units beside the input. */
.rcwa-page .grating-band .grating-dimensions label {
 flex-direction:row; justify-content:center; gap:6px; padding:0 12px 0 34px;
}
.rcwa-page .grating-dimensions label span { flex:none; }
.rcwa-page .band-thickness input,
.rcwa-page .grating-band .grating-dimensions input {
 width:106px; min-width:0; text-align:center; box-sizing:border-box;
}
.rcwa-page .band-thickness input { width:160px; max-width:100%; flex:0 1 160px; }
.rcwa-page .layer-controls input::placeholder { color:#888; opacity:1; }

/* Compact the output choices and the structure mode/layer-count row. */
.rcwa-page .rcwa-settings > .section-title,
.rcwa-page .rcwa-layers > .section-title { margin-bottom:8px; }
.rcwa-page .rcwa-settings > .rcwa-output-choices { margin-bottom:8px; padding-top:0; padding-bottom:0; }
.rcwa-page .rcwa-layers .panel > div { padding-top:0 !important; }
.rcwa-page .rcwa-structure-choices { margin-bottom:2px; padding-bottom:0; }
.rcwa-page .rcwa-structure-choices + .layer-environment-fields { margin-top:0; padding-top:0; }

/* Remove the wrapper spacing around the structure-mode/count controls. */
.rcwa-page .rcwa-layers > .section-title { margin-bottom:4px; }
.rcwa-page .rcwa-structure-settings { padding:0 8px; }
.rcwa-page .rcwa-structure-settings > .rcwa-structure-choices {
 margin:0 0 4px; padding:0; min-height:0;
}
.rcwa-page .rcwa-structure-choices label,
.rcwa-page .rcwa-structure-choices .layer-count-control { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0; }

/* Keep the output toggles close to the material library below them. */
.rcwa-page .rcwa-settings > .rcwa-output-choices { margin-bottom:4px; }
.rcwa-page .rcwa-output-choices + .material-selection-panel { margin-top:4px; }

/* Equal 8px separation above and below the output choices. */
.rcwa-page .rcwa-settings > .section-title { margin-bottom:8px; }
.rcwa-page .rcwa-settings > .rcwa-output-choices { margin-top:0; margin-bottom:8px; }
.rcwa-page .rcwa-output-choices + .material-selection-panel { margin-top:0; }

/* Match the balanced spacing used for the output choices. */
.rcwa-page .rcwa-layers > .section-title { margin-bottom:8px; }
.rcwa-page .rcwa-structure-settings > .rcwa-structure-choices {
 margin-top:0; margin-bottom:8px; padding:0;
}