/* E+ typography (Roboto, Tools scale) - same tokens as /sw and the wiki.
   The editor's chrome is laid out in px by EditorUi.js (menubar 30px,
   toolbar 34px, format panel 240px), so sizes are px x --eplus-scale.
   index.html sets --eplus-scale from the hosting page's root size (the
   /sw or wiki screen-size step), falling back to the same breakpoints. */
:root {
    --eplus-scale: 1;
    --eplus-font: "Roboto Variable", "Roboto", "Segoe UI", Arial, sans-serif;
    --eplus-body: calc(15px * var(--eplus-scale));
    --eplus-ui: calc(15px * var(--eplus-scale));
    --eplus-field: calc(16px * var(--eplus-scale));
    --eplus-meta: calc(14px * var(--eplus-scale));
    --eplus-h3: calc(18px * var(--eplus-scale));
    --eplus-message: 18px; /* user info messages: exactly 18px on every screen */
    --eplus-line: 1.5;
}

:root {
    --mantis-primary: var(--eplus-primary, #1677ff);
    --mantis-primary-dark: var(--eplus-primary, #0958d9);
    --mantis-primary-soft: var(--eplus-table-head-bg, #dcf6ff);
    --mantis-primary-selected: var(--eplus-table-chrome-bg, #dcf6ff);
    --mantis-primary-selected-text: var(--eplus-table-chrome-text, #014480);
    --mantis-text: var(--eplus-text, #262626);
    --mantis-text-secondary: var(--eplus-text-muted, #595959);
    --mantis-text-disabled: color-mix(in srgb, var(--mantis-text-secondary) 58%, transparent);
    --mantis-border: var(--eplus-border, #d9d9d9);
    --mantis-divider: var(--eplus-divider, #f0f0f0);
    --mantis-surface: var(--eplus-surface, #ffffff);
    --mantis-surface-elevated: var(--eplus-surface-muted, #f5f5f5);
    --mantis-background: var(--eplus-bg, #fafafb);
    --mantis-hover: var(--eplus-hover, #f5f5f5);
    --mantis-hover-text: var(--eplus-hover-text, var(--mantis-text));
    --mantis-error: #d32f2f;
    --mantis-font: var(--eplus-font);
    --mantis-shadow: rgba(20, 20, 20, 0.12);
    --mantis-input-background: var(--eplus-input-bg, #ffffff);
    --mantis-canvas-background: var(--eplus-bg-soft, #ffffff);
}

:root[data-eplus-theme="dark"] {
    --mantis-primary: var(--eplus-primary, #1677ff);
    --mantis-primary-dark: var(--eplus-primary, #0958d9);
    --mantis-primary-soft: color-mix(in srgb, var(--mantis-primary) 18%, transparent);
    --mantis-primary-selected: var(--eplus-table-chrome-bg, #014480);
    --mantis-primary-selected-text: var(--eplus-table-chrome-text, #48d0ff);
    --mantis-text: var(--eplus-text, rgba(255, 255, 255, 0.92));
    --mantis-text-secondary: var(--eplus-text-muted, rgba(255, 255, 255, 0.68));
    --mantis-text-disabled: color-mix(in srgb, var(--mantis-text-secondary) 58%, transparent);
    --mantis-border: var(--eplus-border, rgba(255, 255, 255, 0.16));
    --mantis-divider: var(--eplus-divider, rgba(255, 255, 255, 0.1));
    --mantis-surface: var(--eplus-surface, #111a2c);
    --mantis-surface-elevated: var(--eplus-surface-muted, #17233a);
    --mantis-background: var(--eplus-bg, #0b1220);
    --mantis-hover: var(--eplus-hover, #014480);
    --mantis-hover-text: var(--eplus-hover-text, rgba(255, 255, 255, 0.96));
    --mantis-error: #ff4d4f;
    --mantis-shadow: rgba(0, 0, 0, 0.38);
    --mantis-input-background: var(--eplus-input-bg, #0f172a);
    --mantis-canvas-background: var(--eplus-bg-soft, #0f172a);
}

body.geEditor {
    background: var(--mantis-background);
    color: var(--mantis-text);
    font-family: var(--mantis-font);
    font-size: var(--eplus-body);
    line-height: var(--eplus-line);
    letter-spacing: 0;
}

.geMenubarContainer,
.geToolbarContainer,
.geSidebarContainer,
.geFooterContainer {
    font-family: var(--mantis-font);
}

.geMenubarContainer {
    background: var(--mantis-surface);
    border-bottom: 1px solid var(--mantis-divider);
}

.geMenubarContainer .geItem,
.geToolbar .geItem {
    border-radius: 4px;
    color: var(--mantis-text-secondary);
    font-size: var(--eplus-ui);
    font-weight: 500;
}

.geMenubarContainer .geItem:hover,
.geToolbarContainer .geItem:hover {
    background: var(--mantis-hover);
    color: var(--mantis-text);
}

.geToolbarContainer {
    background: var(--mantis-surface);
    border-bottom: 1px solid var(--mantis-divider);
}

.geToolbar {
    background: var(--mantis-surface);
    border-top: 0;
    box-shadow: none;
}

.geToolbarContainer .geSeparator {
    background: var(--mantis-divider);
}

.geToolbarContainer .geButton,
.geToolbarContainer .geLabel {
    align-items: center;
    background: transparent;
    border-radius: 4px;
    border-color: transparent;
    display: inline-flex;
    justify-content: center;
    opacity: 0.86;
    transition:
        background-color 120ms ease,
        border-color 120ms ease,
        opacity 120ms ease,
        filter 120ms ease;
}

.geToolbarContainer .geButton:hover,
.geToolbarContainer .geLabel:hover {
    background: var(--mantis-hover);
    border-color: var(--mantis-border);
    opacity: 1;
}

.geToolbarContainer .geButton .geSprite,
.geToolbarContainer .geLabel .geSprite,
.geToolbarContainer .geButton img,
.geToolbarContainer .geLabel img {
    opacity: 0.9;
    transition: filter 120ms ease, opacity 120ms ease;
}

.geToolbarContainer .geButton:active,
.geToolbarContainer .geLabel:active {
    background: var(--mantis-primary-soft);
    border-color: var(--mantis-primary);
}

.geDiagramContainer,
.geDiagramBackdrop {
    background-color: var(--mantis-canvas-background);
    border-color: var(--mantis-divider);
}

.geBackgroundPage {
    box-shadow: 0 1px 4px var(--mantis-shadow);
}

.geSidebarContainer {
    background: var(--mantis-surface);
    border-color: var(--mantis-divider);
}

.geSidebar {
    background: var(--mantis-surface);
    border-bottom-color: var(--mantis-divider);
}

.geSidebarContainer .geTitle {
    background: var(--mantis-surface);
    border-bottom-color: var(--mantis-divider);
    color: var(--mantis-text);
    font-family: var(--mantis-font);
    font-size: var(--eplus-ui);
    font-weight: 500;
}

.geSidebarContainer .geTitle:hover {
    background: var(--mantis-hover);
}

.geSidebar .geItem {
    border-radius: 4px;
}

.geSidebar .geItem:hover {
    background: var(--mantis-primary-soft);
    border-color: var(--mantis-primary) !important;
}

.geHsplit,
.geVsplit {
    background-color: var(--mantis-divider);
}

.geFooterContainer {
    background: var(--mantis-surface);
    border-top-color: var(--mantis-divider);
}

.geFooterContainer a {
    color: var(--mantis-primary);
    font-family: var(--mantis-font);
    font-size: var(--eplus-meta);
    font-weight: 500;
}

.geFooterContainer td {
    border-color: var(--mantis-divider);
}

.geFooterContainer td:hover {
    background: var(--mantis-hover);
}

.geBtn {
    min-width: 72px;
    height: 32px;
    padding: 0 12px;
    background: var(--mantis-surface);
    border: 1px solid var(--mantis-border);
    border-radius: 4px;
    box-shadow: none;
    color: var(--mantis-text);
    font-family: var(--mantis-font);
    font-size: var(--eplus-ui);
    font-weight: 500;
    line-height: 30px;
    text-transform: none;
}

.geBtn:hover,
.geBlack:hover {
    background: var(--mantis-hover);
    border-color: #bfbfbf;
    box-shadow: none;
    color: var(--mantis-text);
}

.gePrimaryBtn,
.geBlueBtn {
    background: var(--mantis-primary);
    border-color: var(--mantis-primary);
    color: #ffffff !important;
}

.gePrimaryBtn:hover,
.geBlueBtn:hover {
    background: var(--mantis-primary-dark);
    border-color: var(--mantis-primary-dark);
    color: #ffffff !important;
}

.geDangerBtn {
    background: var(--mantis-error);
    border-color: var(--mantis-error);
    color: #ffffff;
}

.geBtn:focus-visible,
.geColorBtn:focus-visible {
    outline: 2px solid rgba(8, 125, 193, 0.25);
    outline-offset: 1px;
}

.geBtn:disabled,
.gePrimaryBtn:disabled,
.geDangerBtn:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.mxPopupMenu,
.geMenubarMenu,
.geToolbarMenu {
    background: var(--mantis-surface) !important;
    border: 1px solid var(--mantis-divider) !important;
    border-radius: 6px;
    box-shadow: 0 4px 16px var(--mantis-shadow) !important;
    color: var(--mantis-text);
    font-family: var(--mantis-font);
}

.mxPopupMenuItem {
    color: var(--mantis-text-secondary);
    font-size: var(--eplus-ui);
}

.mxPopupMenuItemHover {
    background: var(--mantis-hover) !important;
    color: var(--mantis-text) !important;
}

.mxWindow {
    background: var(--mantis-surface) !important;
    border: 1px solid var(--mantis-divider) !important;
    border-radius: 6px !important;
    box-shadow: 0 8px 24px var(--mantis-shadow) !important;
    color: var(--mantis-text);
    font-family: var(--mantis-font);
}

.mxWindowTitle {
    background: var(--mantis-surface) !important;
    border-bottom: 1px solid var(--mantis-divider) !important;
    color: var(--mantis-text) !important;
    font-family: var(--mantis-font);
    font-size: var(--eplus-ui);
    font-weight: 600;
}

.geDialog,
.geDialog table,
.geDialog input,
.geDialog select,
.geDialog textarea {
    font-family: var(--mantis-font);
}

.geDialog input[type="text"],
.geDialog input[type="number"],
.geDialog select,
.geDialog textarea,
.mxWindow input[type="text"],
.mxWindow select,
.mxWindow textarea {
    border: 1px solid var(--mantis-border);
    border-radius: 4px;
    background: var(--mantis-input-background);
    color: var(--mantis-text);
    font-size: var(--eplus-field);
    outline: 0;
}

.geDialog input:focus,
.geDialog select:focus,
.geDialog textarea:focus,
.mxWindow input:focus,
.mxWindow select:focus,
.mxWindow textarea:focus {
    border-color: var(--mantis-primary);
    box-shadow: 0 0 0 2px rgba(8, 125, 193, 0.16);
}

.geSidebarContainer,
.geDiagramContainer,
.mxWindowPane {
    scrollbar-color: var(--mantis-border) transparent;
    scrollbar-width: thin;
}

.geSidebarContainer::-webkit-scrollbar,
.geDiagramContainer::-webkit-scrollbar,
.mxWindowPane::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.geSidebarContainer::-webkit-scrollbar-thumb,
.geDiagramContainer::-webkit-scrollbar-thumb,
.mxWindowPane::-webkit-scrollbar-thumb {
    background: var(--mantis-border);
    border: 2px solid transparent;
    border-radius: 4px;
    background-clip: padding-box;
}

.geSidebarContainer input:not([type="checkbox"]):not([type="radio"]),
.geSidebarContainer select,
.geSidebarContainer textarea,
.geFormatContainer input:not([type="checkbox"]):not([type="radio"]),
.geFormatContainer select,
.geFormatContainer textarea {
    background-color: var(--mantis-input-background) !important;
    background-image: none !important;
    border: 1px solid var(--mantis-border) !important;
    box-shadow: none !important;
    color: var(--mantis-text) !important;
    color-scheme: light dark;
}

.geSidebarContainer input:not([type="checkbox"]):not([type="radio"])::placeholder,
.geSidebarContainer textarea::placeholder,
.geFormatContainer input:not([type="checkbox"]):not([type="radio"])::placeholder,
.geFormatContainer textarea::placeholder {
    color: var(--mantis-text-disabled) !important;
    opacity: 1;
}

.geSidebarContainer input[type="checkbox"],
.geSidebarContainer input[type="radio"],
.geFormatContainer input[type="checkbox"],
.geFormatContainer input[type="radio"] {
    accent-color: var(--mantis-primary);
}

.geSidebarContainer button:not(.eplus-shape-btn):not(.eplus-shape-tab):not(.eplus-shape-drawer-close):not(.eplus-palette-show-more),
.geFormatContainer button,
.geFormatContainer input[type="button"],
.geFormatContainer input[type="submit"],
.geFormatContainer .geBtn,
.geFormatContainer .geColorBtn {
    background-color: var(--mantis-input-background) !important;
    background-image: none !important;
    border: 1px solid var(--mantis-border) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    color: var(--mantis-text) !important;
}

.geSidebarContainer button:not(.eplus-shape-btn):not(.eplus-shape-tab):not(.eplus-shape-drawer-close):not(.eplus-palette-show-more):hover,
.geFormatContainer button:hover,
.geFormatContainer input[type="button"]:hover,
.geFormatContainer input[type="submit"]:hover,
.geFormatContainer .geBtn:hover,
.geFormatContainer .geColorBtn:hover {
    background-color: var(--mantis-hover) !important;
    border-color: var(--mantis-primary) !important;
    color: var(--mantis-hover-text) !important;
}

.geSidebarContainer .eplus-palette-show-more {
    background: transparent !important;
    border: 0 !important;
    color: var(--mantis-primary) !important;
}

.geSidebarContainer .eplus-palette-show-more:hover {
    color: var(--mantis-primary-dark) !important;
    text-decoration: underline;
}

.geSidebarContainer .eplus-local-palette-meta {
    color: var(--mantis-text-secondary) !important;
}

.geFormatContainer .geFormatMuted {
    color: var(--mantis-text-secondary) !important;
}

:root[data-eplus-theme="dark"] .geToolbarContainer img,
:root[data-eplus-theme="dark"] .geMenubarContainer img,
:root[data-eplus-theme="dark"] .geSidebarContainer img {
    opacity: 0.9;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geButton,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--mantis-text-secondary) !important;
    opacity: 0.92 !important;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geButton .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton img,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel img {
    filter: invert(1) brightness(1.55) contrast(0.92) saturate(0.72);
    opacity: 0.92 !important;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geButton .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel .geSprite {
    background-color: currentColor !important;
    background-image: none !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 18px 18px;
    mask-size: 18px 18px;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-formatpanel {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 4h18v16H3V4zm2 2v12h5V6H5zm7 0v5h7V6h-7zm0 7v5h7v-5h-7z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 4h18v16H3V4zm2 2v12h5V6H5zm7 0v5h7V6h-7zm0 7v5h7v-5h-7z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-zoomin {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M10 3a7 7 0 0 1 5.6 11.2l4.1 4.1-1.4 1.4-4.1-4.1A7 7 0 1 1 10 3zm0 2a5 5 0 1 0 0 10 5 5 0 0 0 0-10zm1 2v2h2v2h-2v2H9v-2H7V9h2V7h2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M10 3a7 7 0 0 1 5.6 11.2l4.1 4.1-1.4 1.4-4.1-4.1A7 7 0 1 1 10 3zm0 2a5 5 0 1 0 0 10 5 5 0 0 0 0-10zm1 2v2h2v2h-2v2H9v-2H7V9h2V7h2z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-zoomout {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M10 3a7 7 0 0 1 5.6 11.2l4.1 4.1-1.4 1.4-4.1-4.1A7 7 0 1 1 10 3zm0 2a5 5 0 1 0 0 10 5 5 0 0 0 0-10zM7 9h6v2H7V9z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M10 3a7 7 0 0 1 5.6 11.2l4.1 4.1-1.4 1.4-4.1-4.1A7 7 0 1 1 10 3zm0 2a5 5 0 1 0 0 10 5 5 0 0 0 0-10zM7 9h6v2H7V9z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-undo {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 7h8a5 5 0 1 1 0 10h-4v-2h4a3 3 0 1 0 0-6H7v4L2 8l5-5v4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 7h8a5 5 0 1 1 0 10h-4v-2h4a3 3 0 1 0 0-6H7v4L2 8l5-5v4z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-redo {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 7H9a5 5 0 1 0 0 10h4v-2H9a3 3 0 1 1 0-6h8v4l5-5-5-5v4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 7H9a5 5 0 1 0 0 10h4v-2H9a3 3 0 1 1 0-6h8v4l5-5-5-5v4z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-delete {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 3h6l1 2h4v2H4V5h4l1-2zm-3 6h12l-1 12H7L6 9zm3 2v8h2v-8H9zm4 0v8h2v-8h-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 3h6l1 2h4v2H4V5h4l1-2zm-3 6h12l-1 12H7L6 9zm3 2v8h2v-8H9zm4 0v8h2v-8h-2z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-tofront,
:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-toback,
:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-duplicate {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 7h10v10H7V7zm-4 4h2v8h8v2H3V11zm8-8h10v10h-2V5h-8V3z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7 7h10v10H7V7zm-4 4h2v8h8v2H3V11zm8-8h10v10h-2V5h-8V3z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-fillcolor {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M13 2 5 10a5 5 0 1 0 10 0l-2-2 3-3-3-3zm-1.4 3.4L13 6.8 8.1 11.7A3 3 0 1 0 13 14l2 2H9l2.6-10.6zM3 20h18v2H3v-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M13 2 5 10a5 5 0 1 0 10 0l-2-2 3-3-3-3zm-1.4 3.4L13 6.8 8.1 11.7A3 3 0 1 0 13 14l2 2H9l2.6-10.6zM3 20h18v2H3v-2z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-strokecolor {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m4 16 1 4 4-1 9.8-9.8-5-5L4 14v2zm11.2-13.2 5 5 1.4-1.4a2 2 0 0 0 0-2.8l-2.2-2.2a2 2 0 0 0-2.8 0l-1.4 1.4zM3 22h18v-2H3v2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='m4 16 1 4 4-1 9.8-9.8-5-5L4 14v2zm11.2-13.2 5 5 1.4-1.4a2 2 0 0 0 0-2.8l-2.2-2.2a2 2 0 0 0-2.8 0l-1.4 1.4zM3 22h18v-2H3v2z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-shadow {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M5 5h11v11H5V5zm3 13h10V8h2v12H8v-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M5 5h11v11H5V5zm3 13h10V8h2v12H8v-2z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-connection,
:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-straight {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 11h13.2l-3.6-3.6L15 6l6 6-6 6-1.4-1.4 3.6-3.6H4v-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4 11h13.2l-3.6-3.6L15 6l6 6-6 6-1.4-1.4 3.6-3.6H4v-2z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-orthogonal,
:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-horizontalelbow,
:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-verticalelbow {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M5 5h6v2H7v10h6v-3l6 4-6 4v-3H5V5zm10 0h4v8h-2V7h-2V5z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M5 5h6v2H7v10h6v-3l6 4-6 4v-3H5V5zm10 0h4v8h-2V7h-2V5z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-plus,
:root[data-eplus-theme="dark"] .geToolbarContainer .geSprite-insert {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M11 4h2v7h7v2h-7v7h-2v-7H4v-2h7V4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M11 4h2v7h7v2h-7v7h-2v-7H4v-2h7V4z'/%3E%3C/svg%3E");
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:hover img,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:hover img,
:root[data-eplus-theme="dark"] .geSidebar .geItem:hover img {
    opacity: 1;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:hover,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:hover,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:active,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:active {
    background: var(--mantis-hover) !important;
    border-color: var(--mantis-primary) !important;
    color: var(--mantis-hover-text) !important;
    opacity: 1 !important;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:hover .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:hover .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:active .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:active .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:hover img,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:hover img,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:active img,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:active img {
    filter: invert(63%) sepia(95%) saturate(1365%) hue-rotate(160deg) brightness(103%) contrast(102%);
    opacity: 1 !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer .geItem svg,
:root[data-eplus-theme="dark"] .geToolbarContainer svg {
    color: var(--mantis-text);
}

:root[data-eplus-theme="dark"] body,
body[data-eplus-theme="dark"],
body.eplus-theme-dark {
    background: var(--mantis-background) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geMenubarContainer,
:root[data-eplus-theme="dark"] .geToolbarContainer,
:root[data-eplus-theme="dark"] .geSidebarContainer,
:root[data-eplus-theme="dark"] .geFooterContainer,
:root[data-eplus-theme="dark"] .geMenubar,
:root[data-eplus-theme="dark"] .geToolbar,
:root[data-eplus-theme="dark"] .geSidebar,
:root[data-eplus-theme="dark"] .geHsplit,
:root[data-eplus-theme="dark"] .geVsplit {
    background: var(--mantis-surface) !important;
    color: var(--mantis-text) !important;
    border-color: var(--mantis-divider) !important;
    box-shadow: none !important;
}

:root[data-eplus-theme="dark"] .geDiagramBackdrop {
    background: var(--mantis-background) !important;
    border-color: var(--mantis-divider) !important;
}

:root[data-eplus-theme="dark"] .geDiagramContainer {
    background: var(--mantis-canvas-background) !important;
}

:root[data-eplus-theme="dark"] .geDiagramContainer > div,
:root[data-eplus-theme="dark"] .geDiagramContainer svg,
:root[data-eplus-theme="dark"] .geDiagramContainer canvas {
    background-color: var(--mantis-canvas-background) !important;
}

:root[data-eplus-theme="dark"] .geBackgroundPage {
    background: var(--mantis-canvas-background) !important;
    box-shadow: 0 2px 10px var(--mantis-shadow) !important;
}

:root[data-eplus-theme="dark"] .geBackgroundPage + div,
:root[data-eplus-theme="dark"] .geDiagramContainer .mxGraph,
:root[data-eplus-theme="dark"] .geDiagramContainer .mxGraphBackground,
:root[data-eplus-theme="dark"] .geDiagramContainer .mxWindowPane {
    background-color: var(--mantis-canvas-background) !important;
}

:root[data-eplus-theme="dark"] .geMenubarContainer a,
:root[data-eplus-theme="dark"] .geToolbar a,
:root[data-eplus-theme="dark"] .geSidebarContainer a,
:root[data-eplus-theme="dark"] .geMenubarContainer .geItem,
:root[data-eplus-theme="dark"] .geToolbar .geItem,
:root[data-eplus-theme="dark"] .geToolbar .geButton,
:root[data-eplus-theme="dark"] .geToolbar .geLabel,
:root[data-eplus-theme="dark"] .geFooterContainer a {
    color: var(--mantis-text-secondary) !important;
}

:root[data-eplus-theme="dark"] .geMenubarContainer .geItem:hover,
:root[data-eplus-theme="dark"] .geToolbarContainer .geItem:hover,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton:hover,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel:hover,
:root[data-eplus-theme="dark"] .geFooterContainer td:hover {
    background: var(--mantis-hover) !important;
    border-color: var(--mantis-border) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .mxDisabled,
:root[data-eplus-theme="dark"] .geToolbarContainer .mxDisabled:hover,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton.mxDisabled,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel.mxDisabled {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--mantis-text-disabled) !important;
    opacity: 0.58 !important;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .mxDisabled .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton.mxDisabled .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel.mxDisabled .geSprite,
:root[data-eplus-theme="dark"] .geToolbarContainer .mxDisabled img,
:root[data-eplus-theme="dark"] .geToolbarContainer .geButton.mxDisabled img,
:root[data-eplus-theme="dark"] .geToolbarContainer .geLabel.mxDisabled img {
    filter: invert(1) brightness(0.72) contrast(0.9) saturate(0);
    opacity: 0.62 !important;
}

:root[data-eplus-theme="dark"] .geToolbarContainer .geSeparator {
    background: var(--mantis-divider) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer .geTitle {
    background: var(--mantis-surface-elevated) !important;
    color: var(--mantis-text) !important;
    border-color: var(--mantis-divider) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer .geTitle:hover,
:root[data-eplus-theme="dark"] .geSidebar .geItem:hover {
    background: var(--mantis-primary-soft) !important;
    color: var(--mantis-text) !important;
    border-color: var(--mantis-primary) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer,
:root[data-eplus-theme="dark"] .geSidebarContainer > div,
:root[data-eplus-theme="dark"] .geSidebarContainer .geSidebar,
:root[data-eplus-theme="dark"] .geSidebarContainer .geSidebarFooter,
:root[data-eplus-theme="dark"] .geSidebarContainer .sidebar-bottom-space {
    background-color: var(--mantis-surface) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer input,
:root[data-eplus-theme="dark"] .geSidebarContainer .geSearchBox,
:root[data-eplus-theme="dark"] .geSidebarContainer .geSearchInput {
    background-color: var(--mantis-input-background) !important;
    border-color: var(--mantis-border) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer input:not([type="checkbox"]):not([type="radio"]),
:root[data-eplus-theme="dark"] .geSidebarContainer select,
:root[data-eplus-theme="dark"] .geSidebarContainer textarea,
:root[data-eplus-theme="dark"] .geFormatContainer input:not([type="checkbox"]):not([type="radio"]),
:root[data-eplus-theme="dark"] .geFormatContainer select,
:root[data-eplus-theme="dark"] .geFormatContainer textarea,
:root[data-eplus-theme="dark"] .mxWindow input:not([type="checkbox"]):not([type="radio"]),
:root[data-eplus-theme="dark"] .mxWindow select,
:root[data-eplus-theme="dark"] .mxWindow textarea,
:root[data-eplus-theme="dark"] .geDialog input:not([type="checkbox"]):not([type="radio"]),
:root[data-eplus-theme="dark"] .geDialog select,
:root[data-eplus-theme="dark"] .geDialog textarea {
    appearance: auto;
    background-color: var(--mantis-input-background) !important;
    background-image: none !important;
    border: 1px solid var(--mantis-border) !important;
    box-shadow: none !important;
    color: var(--mantis-text) !important;
    color-scheme: dark;
}

:root[data-eplus-theme="dark"] .geSidebarContainer input:not([type="checkbox"]):not([type="radio"])::placeholder,
:root[data-eplus-theme="dark"] .geFormatContainer input:not([type="checkbox"]):not([type="radio"])::placeholder,
:root[data-eplus-theme="dark"] .mxWindow input:not([type="checkbox"]):not([type="radio"])::placeholder,
:root[data-eplus-theme="dark"] .geDialog input:not([type="checkbox"]):not([type="radio"])::placeholder,
:root[data-eplus-theme="dark"] .geSidebarContainer textarea::placeholder,
:root[data-eplus-theme="dark"] .geFormatContainer textarea::placeholder,
:root[data-eplus-theme="dark"] .mxWindow textarea::placeholder,
:root[data-eplus-theme="dark"] .geDialog textarea::placeholder {
    color: var(--mantis-text-disabled) !important;
    opacity: 1;
}

:root[data-eplus-theme="dark"] .geSidebarContainer input[type="checkbox"],
:root[data-eplus-theme="dark"] .geSidebarContainer input[type="radio"],
:root[data-eplus-theme="dark"] .geFormatContainer input[type="checkbox"],
:root[data-eplus-theme="dark"] .geFormatContainer input[type="radio"],
:root[data-eplus-theme="dark"] .mxWindow input[type="checkbox"],
:root[data-eplus-theme="dark"] .mxWindow input[type="radio"],
:root[data-eplus-theme="dark"] .geDialog input[type="checkbox"],
:root[data-eplus-theme="dark"] .geDialog input[type="radio"] {
    accent-color: var(--mantis-primary);
    color-scheme: dark;
}

:root[data-eplus-theme="dark"] .geSidebarContainer button:not(.eplus-shape-btn):not(.eplus-shape-tab):not(.eplus-shape-drawer-close):not(.eplus-palette-show-more),
:root[data-eplus-theme="dark"] .geFormatContainer button,
:root[data-eplus-theme="dark"] .mxWindow button,
:root[data-eplus-theme="dark"] .geDialog button,
:root[data-eplus-theme="dark"] .geFormatContainer .geBtn,
:root[data-eplus-theme="dark"] .geFormatContainer .geColorBtn {
    background: var(--mantis-input-background) !important;
    background-image: none !important;
    border: 1px solid var(--mantis-border) !important;
    box-shadow: none !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer button:not(.eplus-shape-btn):not(.eplus-shape-tab):not(.eplus-shape-drawer-close):not(.eplus-palette-show-more):hover,
:root[data-eplus-theme="dark"] .geFormatContainer button:hover,
:root[data-eplus-theme="dark"] .mxWindow button:hover,
:root[data-eplus-theme="dark"] .geDialog button:hover,
:root[data-eplus-theme="dark"] .geFormatContainer .geBtn:hover,
:root[data-eplus-theme="dark"] .geFormatContainer .geColorBtn:hover {
    background: var(--mantis-hover) !important;
    border-color: var(--mantis-primary) !important;
    color: var(--mantis-hover-text) !important;
}

:root[data-eplus-theme="dark"] .geFormatContainer,
:root[data-eplus-theme="dark"] .geFormatContainer > div,
:root[data-eplus-theme="dark"] .geFormatContainer table,
:root[data-eplus-theme="dark"] .geFormatContainer td,
:root[data-eplus-theme="dark"] .geFormatContainer .geTitle,
:root[data-eplus-theme="dark"] .geFormatContainer .gePanel,
:root[data-eplus-theme="dark"] .geFormatContainer .geStylePanel {
    background-color: var(--mantis-surface) !important;
    border-color: var(--mantis-divider) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geFormatContainer div,
:root[data-eplus-theme="dark"] .geFormatContainer span,
:root[data-eplus-theme="dark"] .geFormatContainer label,
:root[data-eplus-theme="dark"] .geFormatContainer td,
:root[data-eplus-theme="dark"] .geFormatContainer font {
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geFormatContainer .geTitle,
:root[data-eplus-theme="dark"] .geFormatContainer .geLabel,
:root[data-eplus-theme="dark"] .geFormatContainer .geHint,
:root[data-eplus-theme="dark"] .geFormatContainer .geSectionTitle,
:root[data-eplus-theme="dark"] .geFormatContainer .geFormatMuted {
    color: var(--mantis-text-secondary) !important;
}

:root[data-eplus-theme="dark"] .geFormatContainer input,
:root[data-eplus-theme="dark"] .geFormatContainer select,
:root[data-eplus-theme="dark"] .geFormatContainer textarea,
:root[data-eplus-theme="dark"] .geFormatContainer button {
    background-color: var(--mantis-input-background) !important;
    border-color: var(--mantis-border) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer button:not(.eplus-shape-btn):not(.eplus-shape-tab):not(.eplus-shape-drawer-close):not(.eplus-palette-show-more),
:root[data-eplus-theme="dark"] .geFormatContainer button,
:root[data-eplus-theme="dark"] .geFormatContainer input[type="button"],
:root[data-eplus-theme="dark"] .geFormatContainer input[type="submit"],
:root[data-eplus-theme="dark"] .geFormatContainer .geBtn {
    appearance: none;
    background-color: var(--mantis-input-background) !important;
    background-image: none !important;
    border: 1px solid var(--mantis-border) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer button:not(.eplus-shape-btn):not(.eplus-shape-tab):not(.eplus-shape-drawer-close):not(.eplus-palette-show-more):hover,
:root[data-eplus-theme="dark"] .geFormatContainer button:hover,
:root[data-eplus-theme="dark"] .geFormatContainer input[type="button"]:hover,
:root[data-eplus-theme="dark"] .geFormatContainer input[type="submit"]:hover,
:root[data-eplus-theme="dark"] .geFormatContainer .geBtn:hover {
    background-color: var(--mantis-hover) !important;
    border-color: var(--mantis-primary) !important;
    color: var(--mantis-hover-text) !important;
}

:root[data-eplus-theme="dark"] .geSidebarTooltip,
:root[data-eplus-theme="dark"] .mxPopupMenu,
:root[data-eplus-theme="dark"] .geMenubarMenu,
:root[data-eplus-theme="dark"] .geToolbarMenu,
:root[data-eplus-theme="dark"] .mxWindow,
:root[data-eplus-theme="dark"] .mxWindowPane,
:root[data-eplus-theme="dark"] .geDialog {
    background: var(--mantis-surface) !important;
    border-color: var(--mantis-border) !important;
    color: var(--mantis-text) !important;
    box-shadow: 0 8px 24px var(--mantis-shadow) !important;
}

:root[data-eplus-theme="dark"] .mxWindowTitle,
:root[data-eplus-theme="dark"] .geDialogTitle,
:root[data-eplus-theme="dark"] .geDialog .geTitle {
    background: var(--mantis-surface-elevated) !important;
    border-color: var(--mantis-divider) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .mxPopupMenuItem,
:root[data-eplus-theme="dark"] .mxPopupMenuItem td,
:root[data-eplus-theme="dark"] .geDialog table,
:root[data-eplus-theme="dark"] .geDialog td,
:root[data-eplus-theme="dark"] .mxWindow table,
:root[data-eplus-theme="dark"] .mxWindow td,
:root[data-eplus-theme="dark"] .mxWindowPane div,
:root[data-eplus-theme="dark"] .geSidebarContainer div,
:root[data-eplus-theme="dark"] .geSidebarContainer span,
:root[data-eplus-theme="dark"] .geFooterContainer td {
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .mxPopupMenuItemHover,
:root[data-eplus-theme="dark"] .mxPopupMenuItem:hover {
    background: var(--mantis-hover) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] input,
:root[data-eplus-theme="dark"] select,
:root[data-eplus-theme="dark"] textarea,
:root[data-eplus-theme="dark"] button:not(.gePrimaryBtn):not(.geBlueBtn):not(.geDangerBtn),
:root[data-eplus-theme="dark"] .geColorBtn {
    background: var(--mantis-input-background) !important;
    border-color: var(--mantis-border) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] input::placeholder,
:root[data-eplus-theme="dark"] textarea::placeholder {
    color: var(--mantis-text-disabled) !important;
}

:root[data-eplus-theme="dark"] option {
    background: var(--mantis-input-background) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .geBtn,
:root[data-eplus-theme="dark"] .geBlack {
    background: var(--mantis-input-background) !important;
    border-color: var(--mantis-border) !important;
    color: var(--mantis-text) !important;
    box-shadow: none !important;
}

:root[data-eplus-theme="dark"] .geBtn:hover,
:root[data-eplus-theme="dark"] .geBlack:hover {
    background: var(--mantis-hover) !important;
    border-color: var(--mantis-primary) !important;
    color: var(--mantis-text) !important;
}

:root[data-eplus-theme="dark"] .gePrimaryBtn,
:root[data-eplus-theme="dark"] .geBlueBtn {
    background: var(--mantis-primary) !important;
    border-color: var(--mantis-primary) !important;
    color: #ffffff !important;
}

:root[data-eplus-theme="dark"] .gePrimaryBtn:hover,
:root[data-eplus-theme="dark"] .geBlueBtn:hover {
    background: var(--mantis-primary-dark) !important;
    border-color: var(--mantis-primary-dark) !important;
}

:root[data-eplus-theme="dark"] .geStatusMessage {
    background: rgba(31, 153, 45, 0.14) !important;
    border-color: rgba(31, 153, 45, 0.32) !important;
    color: #8be295 !important;
}

:root[data-eplus-theme="dark"] .geStatusAlert,
:root[data-eplus-theme="dark"] .geAlert {
    background: rgba(255, 77, 79, 0.14) !important;
    border-color: rgba(255, 77, 79, 0.34) !important;
    color: #ffb4b5 !important;
    box-shadow: 0 8px 24px var(--mantis-shadow) !important;
}

:root[data-eplus-theme="dark"] .geHint {
    background: var(--mantis-surface-elevated) !important;
    border-color: var(--mantis-border) !important;
    color: var(--mantis-text) !important;
    box-shadow: 0 6px 18px var(--mantis-shadow) !important;
}

:root[data-eplus-theme="dark"] .geSidebarContainer::-webkit-scrollbar,
:root[data-eplus-theme="dark"] .geDiagramContainer::-webkit-scrollbar,
:root[data-eplus-theme="dark"] .mxWindowPane::-webkit-scrollbar,
:root[data-eplus-theme="dark"] textarea::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

:root[data-eplus-theme="dark"] .geSidebarContainer::-webkit-scrollbar-thumb,
:root[data-eplus-theme="dark"] .geDiagramContainer::-webkit-scrollbar-thumb,
:root[data-eplus-theme="dark"] .mxWindowPane::-webkit-scrollbar-thumb,
:root[data-eplus-theme="dark"] textarea::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
    border: 2px solid transparent;
    border-radius: 4px;
    background-clip: padding-box;
}

/*
 * Tooltips.
 *
 * mxGraph's own common.css draws div.mxTooltip as a bright #FFFFCC note with a
 * black border - the last surface in the editor still using its 2006 styling.
 * It is legible in dark mode but glares, and it was the one pop-up the dark
 * theme had never been extended to. Matched here to the same surface the
 * dialogs and menus use.
 */
:root[data-eplus-theme="dark"] div.mxTooltip {
    background: var(--mantis-surface, #17223a);
    border-color: var(--mantis-border, rgba(255, 255, 255, 0.16));
    color: var(--mantis-text, #e6ebf1);
    box-shadow: 0 6px 18px var(--mantis-shadow);
}


/* User info messages: 18px (same as /sw and the wiki). jquery-confirm
   dialogs, the floating error box and angular-flash alerts. The save /
   error bubbles sit inside the 35px menubar (EditorUi.menubarHeight), so
   they keep a tighter line to stay inside it. Exactly 18px on every screen
   (Ulrik, 2026-10-20), not scaled with --eplus-scale. */
.jconfirm .jconfirm-box .jconfirm-content,
.jconfirm .jconfirm-box .jconfirm-content-pane,
.jconfirm .jconfirm-box .jconfirm-buttons button,
.geAlert,
.alert.formMessage {
    font-size: var(--eplus-message) !important;
    line-height: 1.5 !important;
}
.geStatusMessage,
.geStatusAlert {
    font-size: var(--eplus-message) !important;
    line-height: 1.2 !important;
    padding: 1px 6px !important;
}

/*
 * Menu bar and toolbar: equal space above and below (Oct 2026).
 *
 * Menu bar ("File  Edit  View  Arrange  Extras"): each item is pinned to
 * 23px line + 6px top/bottom padding = 35px, exactly the bar height set by
 * EditorUi.prototype.menubarHeight (35). With symmetric padding and an item
 * that fills the bar, the text sits in the middle: measured on dev 8.5px
 * above / 9px below (the half pixel is glyph rounding). Before, a 34.5px
 * item hung in a 30px bar: 8.5px above, 4px below, against the icon row.
 *
 * Toolbar (icon row, 34px): buttons are 26px. They had 3px above (1px
 * toolbar padding + 2px button margin) and 5px below, and the "100%" zoom
 * label was 30.5px tall (15px text on a 22.5px line), leaving 0.5px below.
 * Toolbar top padding 1 -> 2px, and the label's line-height 18px (26px
 * total), give every button and label 4px above and 4px below - measured.
 *
 * Deliberately NOT done: forcing height/box-sizing on .geButton. Tried in a
 * live preview - it shrank the icon sprites, cut off the dropdown arrows
 * (the "+" lost its arrow) and pushed the zoom arrow into "100%".
 *
 * Scoped to `.geEditor >`: there is exactly one main toolbar, and the
 * Format panel's small toolbars are left alone.
 */
.geEditor > .geMenubarContainer .geMenubar > .geItem {
    box-sizing: border-box;
    height: 35px;
    line-height: 23px;
    padding-top: 6px;
    padding-bottom: 6px;
}

.geEditor > .geToolbarContainer > .geToolbar {
    padding-top: 2px;
}

.geEditor > .geToolbarContainer .geLabel {
    line-height: 18px;
}


/* ------------------------------------------------------------------------
 * Editor text size and side-panel buttons (Oct 2026)
 *
 * - Menu bar, left sidebar and right format panel text: 18px, for
 *   readability on the large screens E+ users work on. Fixed px on purpose
 *   (an exact size was asked for), not the --eplus-* scale. Shape previews
 *   are SVG and keep their own size.
 * - Both side panels are wider to fit it (EditorUi.js: sidebar 204 -> 250,
 *   format panel 240 -> 320).
 * - Format.js lays its rows out with fixed inline heights and absolutely
 *   positioned number boxes sized for 11-12px text. At 18px those clipped,
 *   so: fixed-height rows grow with their text, number boxes are 56px wide,
 *   and the left box of a pair (Width/Height, Left/Top - right: 96px, its
 *   spinner and caption at right: 84px) moves 16px further left so the
 *   wider right-hand box does not cover them.
 * - Every text button in the two side panels (Enterprise Navigator, Create
 *   Objects, Edit Data, Clear Default Style, Edit Style, To Front, ...) uses
 *   the /sw Objects/Models page blue: #087dc1, hover #286090 with a #204d74
 *   border (Mantis primary / dark / darker), sized to its text. Colour
 *   swatches (.geColorBtn) are left alone. The html:root[data-eplus-theme]
 *   copy wins over the dark theme's !important grey for all other buttons.
 * ---------------------------------------------------------------------- */
.geMenubar a.geItem,
.geMenubar a {
    font-size: 18px !important;
}

.geSidebarContainer,
.geSidebarContainer *:not(svg):not(svg *) {
    font-size: 18px !important;
}

.geSidebarContainer div[style*="height: 18px"],
.geSidebarContainer div[style*="height: 24px"],
.geSidebarContainer div[style*="height: 25px"] {
    height: auto !important;
    min-height: 28px;
    overflow: visible !important;
}

.geSidebarContainer input[style*="position: absolute"] {
    width: 56px !important;
    height: auto !important;
}

.geSidebarContainer input[style*="right: 96px"] {
    right: 112px !important;
}

.geSidebarContainer div[style*="right: 84px"] {
    right: 100px !important;
}

.geSidebarContainer button:not(.geColorBtn) {
    width: auto !important;
    white-space: nowrap;
    background: #087dc1 !important;
    border: 1px solid #087dc1 !important;
    border-radius: 4px;
    color: #ffffff !important;
    cursor: pointer;
    line-height: 1.3;
    padding: 4px 12px;
    box-shadow: none !important;
}

/* Full-row buttons (Format.js gives them width 202px: Edit Data, Clear
 * Default Style, Paint/Set as Default Style, Remove from Group, ...) fill the
 * row so they line up with each other, label centred; the paired half-row
 * ones (100px: Edit Style | Edit Image, To Front | To Back, ...) take half
 * each. Everything else keeps the width of its text. */
.geSidebarContainer button[style*="width: 202px"]:not(.geColorBtn) {
    width: calc(100% - 18px) !important;
    text-align: center;
}

.geSidebarContainer button[style*="width: 100px"]:not(.geColorBtn) {
    width: calc(50% - 10px) !important;
    text-align: center;
}

.geSidebarContainer button:not(.geColorBtn):hover {
    background: #286090 !important;
    border-color: #204d74 !important;
    color: #ffffff !important;
}

.geSidebarContainer button:not(.geColorBtn):disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

html:root[data-eplus-theme] .geSidebarContainer button:not(.geColorBtn):not(.gePrimaryBtn):not(.geDangerBtn) {
    background: #087dc1 !important;
    border-color: #087dc1 !important;
    color: #ffffff !important;
}

html:root[data-eplus-theme] .geSidebarContainer button:not(.geColorBtn):not(.gePrimaryBtn):not(.geDangerBtn):hover {
    background: #286090 !important;
    border-color: #204d74 !important;
    color: #ffffff !important;
}