/* Additional pages use the original WPF grid, group colors and aligned control columns. */
.workspace{grid-template-columns:minmax(0,1fr) 330px!important}
.sidebar{position:relative;display:block;padding:0!important;overflow:visible;min-width:0}
.side-panels{height:100%;padding:8px 58px 8px 8px;display:flex;flex-direction:column;gap:7px;overflow:hidden}
.right-pane{min-height:0;flex:1;overflow:auto}
.serial-pane{display:flex;flex-direction:column;gap:7px;overflow:hidden}
.serial-pane #log-output{flex:1;min-height:80px;max-height:none;margin:0;padding:5px;background:#faebd7;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font:11px/1.5 Consolas,monospace;color:#161616}
.serial-pane .serial-tip{flex:none}
.side-panels>.serial-status{flex:none;margin:0;min-height:24px}
.navigation-rail{position:absolute;right:0;top:0;bottom:0;width:50px;background:#2a333d;z-index:5;overflow:hidden;transition:width .2s;box-shadow:-1px 0 0 #c0c9ce}
.navigation-rail:hover,.navigation-rail:focus-within{width:140px}
.rail-item{width:140px;height:100px;border:0;border-radius:0;display:flex;align-items:center;gap:11px;padding:0 10px;background:transparent;color:#fff;text-align:left;font-size:15px;white-space:nowrap}
.rail-item img{width:30px;height:30px;object-fit:contain;flex:none}.rail-item.active,.rail-item:hover{background:#404d5b}
.right-pane h2{font-size:14px;font-weight:600;margin:8px 0 12px}
.about-pane{background:#fff;margin:-8px -0px 0 -8px;padding-top:8px}
.about-pane h2{padding-left:20px}
.about-pane>button,.about-pane>a{width:100%;height:50px;display:flex;align-items:center;background:#fff;border:0;padding:0 20px;color:#26313b;text-decoration:none;font-size:14px;text-align:left;border-radius:0}
.about-pane>button:hover,.about-pane>a:hover{background:#edf3f5}
.main-content{display:flex;flex-direction:column;gap:5px;padding:7px!important}
.model-toolbar{display:flex;align-items:center;gap:8px;height:29px;flex:none;color:#64727c;font-size:11px;min-width:0}
.model-toolbar select{height:26px;min-width:94px;padding:2px 5px;font-size:12px;color:#26313b}
#page-context{margin-left:4px;min-width:0}.model-toolbar button{height:26px;border:1px solid #bcc5cb;background:white;padding:2px 8px}
.model-tabs{display:flex;gap:4px;margin-left:auto}.model-tabs button.on{background:#a9d586}
.view{width:100%;margin:0 auto}
.wpf-view{flex:1;min-height:0;display:flex;flex-direction:column;max-width:none}
.wpf-root{display:flex;flex-direction:column;flex:1;min-height:500px;min-width:0;gap:4px}
.wpf-root>.wpf-grid{flex:1}
.wpf-grid{display:grid;gap:3px;min-width:0;min-height:min-content;align-items:stretch}
.wpf-group{border:1px solid #a8b5bd;border-radius:1px;padding:3px 5px 5px;margin:0;min-width:0;min-height:min-content;display:flex;flex-direction:column;gap:3px}
.wpf-group>legend{font-size:12px;color:#263b46;padding:0 4px;margin-left:2px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wpf-group>.wpf-grid,.wpf-group>.wpf-stack{flex:1}
.wpf-label{display:flex;align-items:center;min-width:0;padding:1px 3px;overflow:hidden;white-space:nowrap;font-size:11px;color:#2e3c44}
.wpf-readout{font:22px/1.15 Consolas,monospace;justify-content:flex-end;padding:2px 5px;color:#162e36}
.wpf-view[data-model="90001"] .wpf-textbox,.wpf-view[data-model="YM2153"] .wpf-textbox{height:22px;font-size:11px}.wpf-view[data-model="90001"] .wpf-button,.wpf-view[data-model="YM2153"] .wpf-button{min-height:22px;height:auto}.wpf-view[data-model="90001"] .wpf-grid,.wpf-view[data-model="YM2153"] .wpf-grid{gap:2px}
.wpf-textbox,.wpf-select{width:100%;height:26px;min-width:0;align-self:center;padding:2px 4px;border:1px solid #b4bfc7;border-radius:1px;color:#21313b;font:12px Consolas,monospace;text-align:left;background:#fff}
textarea.wpf-textbox{height:100%;resize:none;min-height:140px;align-self:stretch;font:12px/1.5 Consolas,monospace;white-space:pre-wrap}
.wpf-button{width:100%;height:auto;min-height:26px;max-height:80px;align-self:stretch;margin:1px 0;background:white;border:1px solid #b6c2c9;border-radius:1px;padding:2px 3px;font-size:11px;line-height:1.2;white-space:normal;color:#273d47}
.wpf-button:hover{background:#eaf2f5}.wpf-button.on{background:#9acd32;color:#1f351b;border-color:#8aaf32}
.wpf-button:disabled{opacity:.55}.inactive-group{opacity:.5}
.wpf-stack{display:flex;flex-direction:column;gap:4px;min-width:0;min-height:0}.wpf-stack.horizontal{flex-direction:row;flex-wrap:wrap}
.wpf-stack.horizontal>.wpf-button{width:auto;min-width:66px}
.wpf-progress{width:100%;height:20px;align-self:center;accent-color:#74a88e}
.wpf-check{display:flex;gap:3px;align-items:center;font-size:11px;padding:2px;min-width:0;white-space:nowrap;justify-content:center}
.wpf-check input{width:12px;height:12px;margin:0;accent-color:#658c79}
.wpf-image{max-width:100%;max-height:45px;object-fit:contain;align-self:center}
.wpf-scroll{overflow:auto;min-height:0;min-width:0}.wpf-border,.wpf-container{min-width:0;min-height:0}
.wpf-dialog{background:#f0f0f0;border:1px solid #98a9b4;border-radius:2px;padding:12px;max-width:90vw;max-height:90vh;width:650px;color:#293941;box-shadow:0 12px 50px #14263555}
.wpf-dialog::backdrop{background:#1a2a3a55}.wpf-dialog .wpf-root{min-height:260px}
.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:10px;font-size:14px}
.dialog-heading button{padding:4px 15px;background:white;border:1px solid #bac5ca}
.about-dialog{width:510px;padding:18px;font-size:13px}.about-dialog p{margin:12px 0}.about-brand{display:flex;align-items:center;gap:15px;margin:5px 0 16px}.about-brand img{width:80px;max-height:80px;object-fit:contain}.about-brand p{color:#637481;margin:4px 0;font-size:12px}
.chart-dialog{width:850px}.chart-dialog canvas{width:100%;background:white;display:block}.chart-dialog>p{font-size:12px}
.wavelength-map{display:flex;gap:4px;flex-wrap:wrap}.wavelength-map button{padding:5px 12px;border:1px solid #b1c1c6;background:#fff}
.alarm{background:#f3a4a4!important;color:#782c2c!important}
@media(max-width:1180px){.workspace{grid-template-columns:minmax(0,1fr) 300px!important}.wpf-label{font-size:10px;padding-left:1px}.wpf-label.wpf-readout{font-size:19px}.wpf-group{padding-left:3px;padding-right:3px}.wpf-grid{gap:2px}.wpf-button{font-size:10px;padding:2px 1px}.wpf-textbox{font-size:11px}}
@media(min-height:800px){.wpf-root{min-height:600px}.wpf-label{font-size:12px}.wpf-readout{font-size:27px}.wpf-textbox,.wpf-select{height:28px}.wpf-grid{gap:5px}.wpf-group{padding:5px 7px 7px}}
