.mhs-shell { position: relative; display: inline-block; width: 100%; min-width: 0; vertical-align: middle; }
select.mhs-native {
    position: absolute !important; width: 1px !important; height: 1px !important;
    min-width: 0 !important; min-height: 0 !important; padding: 0 !important;
    margin: 0 !important; opacity: 0 !important; clip-path: inset(50%); pointer-events: none;
}
.mhs-shell > .mhs-trigger {
    display: flex; align-items: center; gap: 9px; width: 100%; min-width: 0;
    border: 1px solid #dce2eb; border-radius: 9px; padding: 9px 11px;
    background: #fff; color: #1e293b; font: inherit; text-align: left; cursor: pointer;
}
.mhs-trigger:disabled { opacity: .6; cursor: not-allowed; }
.mhs-trigger:focus-visible { outline: 2px solid #818cf8; outline-offset: 2px; }
.mhs-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mhs-chevron { flex: 0 0 auto; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin: -4px 2px 0 4px; }
.mhs-trigger[aria-expanded="true"] .mhs-chevron { transform: rotate(225deg); margin-top: 4px; }
.mhs-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; }
.mhs-dot.is-stable { background: #10b981; box-shadow: 0 0 0 2px rgba(16,185,129,.14); }
.mhs-dot.is-fluctuating { background: #f59e0b; box-shadow: 0 0 0 2px rgba(245,158,11,.14); }
.mhs-dot.is-unhealthy { background: #ef4444; box-shadow: 0 0 0 2px rgba(239,68,68,.14); }
.mhs-menu {
    position: fixed; inset: auto; z-index: 100000; box-sizing: border-box; margin: 0; padding: 6px;
    border: 1px solid #dce2ed; border-radius: 12px; background: #fff; color: #1e293b;
    box-shadow: 0 16px 40px rgba(15,23,42,.18); overflow-y: auto; overscroll-behavior: contain;
}
.mhs-menu[hidden], .mhs-dot[hidden] { display: none !important; }
.mhs-menu > .mhs-option {
    display: flex; align-items: center; gap: 9px; width: 100%; min-width: 0; margin: 0;
    padding: 10px; border: 0; border-radius: 8px; background: transparent; color: inherit;
    font: inherit; text-align: left; cursor: pointer; box-shadow: none;
}
.mhs-option:hover, .mhs-option:focus-visible { background: #f1f5f9; outline: none; }
.mhs-option[aria-selected="true"] { background: #eef2ff; color: #4338ca; }
html[data-ui-theme="dark"] .mhs-shell > .mhs-trigger,
html[data-ui-theme="dark"] .mhs-menu,
html[data-workflow-theme="dark"] .mhs-shell > .mhs-trigger,
html[data-workflow-theme="dark"] .mhs-menu { background: #172033; color: #edf2f7; border-color: #334155; }
html[data-ui-theme="dark"] .mhs-option:hover,
html[data-ui-theme="dark"] .mhs-option:focus-visible,
html[data-workflow-theme="dark"] .mhs-option:hover,
html[data-workflow-theme="dark"] .mhs-option:focus-visible { background: #263248; }
html[data-ui-theme="dark"] .mhs-option[aria-selected="true"],
html[data-workflow-theme="dark"] .mhs-option[aria-selected="true"] { background: #30365c; color: #c7d2fe; }
