/* LabExp look for Huly (st.nda.labexp.xyz): the colours, fields, buttons and popups of the UI kit (web/staff/components/lx, assets/lx.css).
   Huly draws everything from CSS variables of its two themes (.theme-dark / .theme-light), so the kit is applied by overriding them: no Huly code is
   changed. The doubled class gives the rules the weight to win over the styles Huly injects at run time. Served by the router of the pod (nginx.conf in
   manifests/88-huly.yaml) and linked into index.html by sub_filter; deploy: k3s/deploy-huly-theme.sh.
   What is not here yet (needs a look at the screens): the radii and paddings of single components, the fonts of the portal. */

html.theme-dark.theme-dark, html .theme-dark.theme-dark {
  /* the page, the rail, the status bar: the portal's violet-black */
  --theme-bg-color: #100e17;
  --theme-back-color: #0c0a12;
  --theme-drawing-bg-color: #17151e;
  --theme-statusbar-color: #17151e;
  --theme-navpanel-color: #17151e;
  --theme-navpanel-hovered: rgba(255, 255, 255, 0.06);
  --theme-navpanel-selected: rgba(139, 92, 246, 0.2);
  --theme-navpanel-divider: rgba(255, 255, 255, 0.06);
  --theme-navpanel-border: rgba(255, 255, 255, 0.06);
  --theme-navpanel-icons-color: #a1a1aa;
  --theme-panel-color: #17151e;
  --theme-comp-header-color: #17151e;
  --theme-table-header-color: #17151e;
  --theme-bg-accent-color: rgba(255, 255, 255, 0.04);
  --theme-bg-dark-color: rgba(255, 255, 255, 0.04);
  --theme-overlay-color: rgba(8, 6, 14, 0.62);
  --theme-divider-color: rgba(255, 255, 255, 0.07);
  --theme-bg-divider-color: rgba(255, 255, 255, 0.07);
  --theme-list-divider-color: rgba(255, 255, 255, 0.05);
  --theme-list-border-color: rgba(255, 255, 255, 0.07);

  /* text: the zinc scale of the site */
  --theme-text-primary-color: #f4f4f5;
  --theme-caption-color: #f4f4f5;
  --theme-content-color: #d4d4d8;
  --theme-halfcontent-color: #a1a1aa;
  --theme-dark-color: #71717a;
  --theme-darker-color: #52525b;
  --theme-text-placeholder-color: #71717a;
  --theme-trans-color: #a1a1aa;

  /* buttons: filled, no frames; hover and press are lighter fills */
  --theme-button-default: rgba(255, 255, 255, 0.07);
  --theme-button-hovered: rgba(255, 255, 255, 0.12);
  --theme-button-pressed: rgba(255, 255, 255, 0.17);
  --theme-button-focused: rgba(255, 255, 255, 0.12);
  --theme-button-focused-border: #8b5cf6;
  --theme-button-border: transparent;
  --theme-button-icon-hovered: rgba(255, 255, 255, 0.1);
  --theme-button-icon-pressed: rgba(255, 255, 255, 0.15);
  --theme-breadcrumb-hovered: rgba(255, 255, 255, 0.08);
  --theme-breadcrumb-pressed: rgba(255, 255, 255, 0.12);
  --theme-button-contrast-enabled: #7c3aed;
  --theme-button-contrast-hovered: #8b5cf6;
  --theme-button-contrast-pressed: #6d28d9;
  --theme-button-contrast-color: #fff;
  --theme-button-contrast-border: transparent;
  --theme-button-container-color: #1d1a27;
  --theme-button-attention-gradient: #7c3aed;
  --theme-button-attention-hover-gradient: #8b5cf6;
  --theme-button-attention-active-gradient: #6d28d9;
  --theme-button-attention-border: transparent;
  --theme-button-attention-hover-border: transparent;
  --theme-button-attention-hover-shadow: none;
  --theme-button-attention-active-shadow: none;
  --theme-button-attention-focus-shadow: 0 0 0 2px rgba(139, 92, 246, 0.55);
  --primary-button-default: #7c3aed;
  --primary-button-hovered: #8b5cf6;
  --primary-button-pressed: #6d28d9;
  --primary-button-focused: #7c3aed;
  --primary-button-outline: #a78bfa;
  --primary-button-transparent: rgba(124, 58, 237, 0.2);
  --primary-button-border: transparent;
  --primary-button-color: #fff;
  --primary-edit-border-color: #8b5cf6;
  --button-secondary-BackgroundColor: rgba(255, 255, 255, 0.07);
  --button-secondary-BorderColor: transparent;
  --button-secondary-hover-BackgroundColor: rgba(255, 255, 255, 0.12);
  --button-secondary-active-BackgroundColor: rgba(255, 255, 255, 0.17);
  --button-tertiary-hover-BackgroundColor: rgba(255, 255, 255, 0.08);
  --button-tertiary-active-BackgroundColor: rgba(255, 255, 255, 0.12);
  --button-disabled-BackgroundColor: rgba(255, 255, 255, 0.05);

  /* fields: filled, a violet ring on focus */
  --input-BackgroundColor: rgba(255, 255, 255, 0.07);
  --input-hover-BackgroundColor: rgba(255, 255, 255, 0.12);
  --input-BorderColor: transparent;
  --input-PlaceholderColor: #71717a;
  --input-hover-PlaceholderColor: #a1a1aa;
  --input-filled-LabelColor: #a1a1aa;
  --input-HelperColor: #a1a1aa;
  --theme-editbox-focus-border: #8b5cf6;
  --theme-refinput-border: transparent;
  --theme-refinput-divider: rgba(255, 255, 255, 0.07);
  --selector-BackgroundColor: rgba(255, 255, 255, 0.07);
  --selector-BorderColor: transparent;
  --selector-hover-overlay-BackgroundColor: rgba(255, 255, 255, 0.12);
  --theme-toggle-on-bg-color: #7c3aed;
  --theme-toggle-on-bg-hover: #8b5cf6;

  /* popups, menus, tooltips */
  --theme-popup-color: #1d1a27;
  --theme-popup-hover: rgba(255, 255, 255, 0.07);
  --theme-popup-header: #1d1a27;
  --theme-popup-divider: rgba(255, 255, 255, 0.07);
  --theme-popup-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 18px 48px -12px rgba(0, 0, 0, 0.6);
  --global-popover-BackgroundColor: #1d1a27;
  --global-popover-hover-BackgroundColor: rgba(255, 255, 255, 0.07);
  --global-popover-BorderColor: rgba(255, 255, 255, 0.08);

  /* surfaces, links, the accent */
  --global-surface-01-BackgroundColor: #17151e;
  --global-surface-01-BorderColor: rgba(255, 255, 255, 0.07);
  --global-surface-01-hover-BackgroundColor: #1d1a27;
  --global-surface-02-BackgroundColor: #17151e;
  --global-surface-02-BorderColor: rgba(255, 255, 255, 0.07);
  --global-surface-03-hover-BackgroundColor: #1d1a27;
  --global-ui-BorderColor: rgba(255, 255, 255, 0.07);
  --global-subtle-ui-BorderColor: rgba(255, 255, 255, 0.05);
  --global-primary-LinkColor: #a78bfa;
  --global-accent-TextColor: #a78bfa;
  --global-accent-BackgroundColor: #7c3aed;
  --global-focus-BorderColor: #8b5cf6;
  --global-primary-TextColor: #f4f4f5;
  --global-secondary-TextColor: #d4d4d8;
  --global-tertiary-TextColor: #a1a1aa;
  --global-disabled-TextColor: #52525b;
  --global-error-TextColor: #f87171;
  --theme-link-color: #a78bfa;
  --highlight-select: rgba(139, 92, 246, 0.18);
  --highlight-select-hover: rgba(139, 92, 246, 0.26);
  --highlight-select-border: transparent;
  --highlight-hover: rgba(255, 255, 255, 0.06);
  --theme-error-color: #f87171;
  --theme-warning-color: #fbbf24;
}

html.theme-light.theme-light, html .theme-light.theme-light {
  --theme-bg-color: #f6f5fa;
  --theme-back-color: #efedf6;
  --theme-drawing-bg-color: #ffffff;
  --theme-statusbar-color: #ffffff;
  --theme-navpanel-color: #ffffff;
  --theme-navpanel-hovered: rgba(16, 24, 40, 0.05);
  --theme-navpanel-selected: rgba(124, 58, 237, 0.12);
  --theme-navpanel-divider: rgba(16, 24, 40, 0.07);
  --theme-navpanel-border: rgba(16, 24, 40, 0.07);
  --theme-panel-color: #ffffff;
  --theme-comp-header-color: #ffffff;
  --theme-divider-color: rgba(16, 24, 40, 0.08);
  --theme-bg-divider-color: rgba(16, 24, 40, 0.08);
  --theme-list-divider-color: rgba(16, 24, 40, 0.06);
  --theme-list-border-color: rgba(16, 24, 40, 0.08);
  --theme-text-primary-color: #18181b;
  --theme-caption-color: #18181b;
  --theme-content-color: #3f3f46;
  --theme-halfcontent-color: #71717a;
  --theme-dark-color: #a1a1aa;
  --theme-button-default: rgba(216, 211, 230, 0.32);
  --theme-button-hovered: rgba(216, 211, 230, 0.55);
  --theme-button-pressed: rgba(216, 211, 230, 0.75);
  --theme-button-border: transparent;
  --theme-button-focused-border: #7c3aed;
  --theme-button-contrast-enabled: #7c3aed;
  --theme-button-contrast-hovered: #8b5cf6;
  --theme-button-contrast-pressed: #6d28d9;
  --theme-button-contrast-color: #fff;
  --theme-button-attention-gradient: #7c3aed;
  --theme-button-attention-hover-gradient: #8b5cf6;
  --theme-button-attention-active-gradient: #6d28d9;
  --theme-button-attention-border: transparent;
  --theme-button-attention-hover-border: transparent;
  --theme-button-attention-hover-shadow: none;
  --theme-button-attention-active-shadow: none;
  --primary-button-default: #7c3aed;
  --primary-button-hovered: #8b5cf6;
  --primary-button-pressed: #6d28d9;
  --primary-button-focused: #7c3aed;
  --primary-button-outline: #7c3aed;
  --primary-edit-border-color: #7c3aed;
  --input-BackgroundColor: rgba(216, 211, 230, 0.32);
  --input-hover-BackgroundColor: rgba(216, 211, 230, 0.55);
  --input-BorderColor: transparent;
  --theme-editbox-focus-border: #7c3aed;
  --theme-popup-color: #ffffff;
  --theme-popup-hover: rgba(16, 24, 40, 0.05);
  --theme-popup-divider: rgba(16, 24, 40, 0.08);
  --theme-popup-shadow: 0 0 0 1px rgba(16, 24, 40, 0.08), 0 18px 48px -12px rgba(16, 24, 40, 0.25);
  --global-popover-BackgroundColor: #ffffff;
  --global-popover-BorderColor: rgba(16, 24, 40, 0.08);
  --global-surface-01-BackgroundColor: #ffffff;
  --global-surface-01-BorderColor: rgba(16, 24, 40, 0.08);
  --global-surface-02-BackgroundColor: #ffffff;
  --global-surface-02-BorderColor: rgba(16, 24, 40, 0.08);
  --global-ui-BorderColor: rgba(16, 24, 40, 0.08);
  --global-primary-LinkColor: #7c3aed;
  --global-accent-TextColor: #7c3aed;
  --global-accent-BackgroundColor: #7c3aed;
  --global-focus-BorderColor: #7c3aed;
  --theme-link-color: #7c3aed;
  --theme-toggle-on-bg-color: #7c3aed;
  --highlight-select: rgba(124, 58, 237, 0.1);
  --highlight-select-hover: rgba(124, 58, 237, 0.16);
  --highlight-select-border: transparent;
}

/* the fonts of the portal (served by the router from the same ConfigMap) */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap; src: url(/_labexp/montserrat-cyrillic-400-normal.woff2) format("woff2"); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 500; font-display: swap; src: url(/_labexp/montserrat-cyrillic-500-normal.woff2) format("woff2"); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap; src: url(/_labexp/montserrat-cyrillic-600-normal.woff2) format("woff2"); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap; src: url(/_labexp/montserrat-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 500; font-display: swap; src: url(/_labexp/montserrat-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap; src: url(/_labexp/montserrat-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 400; font-display: swap; src: url(/_labexp/outfit-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 500; font-display: swap; src: url(/_labexp/outfit-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 600; font-display: swap; src: url(/_labexp/outfit-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 700; font-display: swap; src: url(/_labexp/outfit-latin-700-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

/* the font of the site everywhere in Huly */
html, html * { --font-family: Outfit, Montserrat, "Segoe UI", sans-serif; }
html body, html .theme-dark, html .theme-light { font-family: Outfit, Montserrat, "Segoe UI", sans-serif; }

/* the primary button: Huly sets its colours on every element (the rule *), so ours must be on every element too */
html * { --primary-button-default: #7c3aed; --primary-button-hovered: #8b5cf6; --primary-button-pressed: #6d28d9; --primary-button-focused: #7c3aed; --button-primary-BackgroundColor: #7c3aed; --button-primary-hover-BackgroundColor: #8b5cf6; --button-primary-active-BackgroundColor: #6d28d9; --button-primary-BorderColor: transparent; }

/* the frame of the portal: a floating rail, a floating bar on top, the blocks as rounded surfaces on the violet-black page */
html.theme-dark body { background: radial-gradient(52% 60% at 14% 0%, rgba(139, 92, 246, 0.26), transparent 70%), radial-gradient(40% 50% at 100% 100%, rgba(139, 92, 246, 0.1), transparent 70%), #100e17 !important; background-attachment: fixed; }
html.theme-light body { background: #f6f5fa !important; }
html .app { background: transparent !important; }
/* as in the portal: the rail goes the whole height on the left, the bar floats to the right of it, the content is below the bar */
html, html * { --status-bar-height: 0px !important; }
html .antiStatusBar { position: fixed !important; top: 12px !important; left: 92px !important; right: 12px !important; z-index: 30; height: 52px !important; min-height: 52px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html .antiStatusBar > div { height: 52px; border-radius: 18px; background: var(--theme-navpanel-color); box-shadow: inset 0 0 0 1px var(--theme-divider-color); }
html .workbench-container.apps-vertical::after, html .workbench-container::after { display: none !important; content: none !important; border: 0 !important; }
html .workbench-container.apps-vertical > .flex-row-center { padding-top: 64px; box-sizing: border-box; }
html .workbench-container.apps-vertical { gap: 12px; padding: 12px; box-sizing: border-box; background: transparent !important; box-shadow: none !important; }
html .workbench-container.inner { gap: 12px; background: transparent !important; box-shadow: none !important; }
html .workbench-container.apps-vertical > .antiPanel-application.vertical { border: 0 !important; border-radius: 20px !important; background: var(--theme-navpanel-color) !important; box-shadow: inset 0 0 0 1px var(--theme-divider-color); }
/* the content has no frame, as in the other services: the navigator, the page and the right column sit straight on the page */
html .antiPanel-navigator, html .hulyComponent, html .antiPanel-application.sidebar-container { overflow: visible; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html .hulyHeader-container, html .hulyNavPanel-container, html .hulyNavPanel-header, html .antiPanel-wrap__content { border: 0 !important; background: transparent !important; }
html .antiSeparator { display: none !important; }

/* the parts of the kit: buttons, fields, popups, menus, dialogs */
html .hulyButton, html .antiButton { border-radius: 10px !important; }
html .hulyButton.extra-small, html .hulyButton.small, html .antiButton.small, html .antiButton.extra-small { border-radius: 8px !important; }
html .antiButton.sh-rectangle-right { border-radius: 10px 0 0 10px !important; }
html .antiButton.sh-rectangle-left { border-radius: 0 10px 10px 0 !important; }
html .antiCard, html .antiCard.dialog { border: 0 !important; border-radius: 20px !important; box-shadow: var(--theme-popup-shadow) !important; }
html .antiEditBox, html .antiEditBoxInput { border-radius: 10px !important; }
html .selectPopup, html .antiPopup { border: 0 !important; border-radius: 14px !important; background: var(--theme-popup-color) !important; box-shadow: var(--theme-popup-shadow) !important; }
html .menu-item { width: calc(100% - 12px); margin: 1px 6px; padding: 7px 10px !important; border-radius: 9px !important; }
html .menu-item:hover, html .menu-item.selected, html .menu-item:focus-visible { background: var(--theme-popup-hover) !important; }
html .scroller-container .bar { border-radius: 999px; background: rgba(255, 255, 255, 0.2) !important; }
html .scroller-container .track { background: transparent !important; }

/* the rail and the navigator: the rows of the kit (a rounded hover, the selected one a violet fill with a ring) */
html button.app { border-radius: 12px !important; }
html button.app:hover { background: var(--theme-navpanel-hovered) !important; }
html button.app.selected { background: var(--theme-navpanel-selected) !important; box-shadow: inset 0 0 0 1px rgba(167, 139, 250, 0.28); }
html .hulyNavItem-container { border-radius: 12px !important; }
html .hulyNavItem-container:hover { background: var(--theme-navpanel-hovered) !important; }
html .hulyNavItem-container.selected { background: var(--theme-navpanel-selected) !important; box-shadow: inset 0 0 0 1px rgba(167, 139, 250, 0.28); }
html .hulyNavGroup-header__label, html .hulyNavGroup-header__label * { text-transform: none !important; letter-spacing: 0 !important; }
html .hulyNavGroup-header__label { padding: 0 !important; background: transparent !important; }
html .hulyHeader-container { border-bottom: 1px solid var(--theme-divider-color); }

/* the rail: its scroll area is as wide as the rail (a side strip for a scroll bar made the icons slide sideways), no bar and no arrows (the wheel works), icons centred */
html .hamburger-container { overflow-x: hidden; }
html .antiPanel-application .scroller-container, html .antiPanel-application .scroller-container .horizontalBox, html .antiPanel-application .scroller-container .scroll { width: 100% !important; max-width: 100%; overflow-x: hidden; }
html .antiPanel-application .updown-container, html .antiPanel-application .scroller-container .track, html .antiPanel-application .scroller-container .bar { display: none !important; }
html .hamburger-container * { scrollbar-width: none !important; }
html .hamburger-container ::-webkit-scrollbar { display: none; }
html .hamburger-container .box { display: flex !important; flex-direction: column !important; align-items: center !important; width: 100% !important; padding: 0 !important; }
/* the marks and the avatars of the kit: the workspace mark in the soft violet square (as the CR / ID mark of the services), people in tinted circles (a photo stays a photo) */
html .antiLogo { border-radius: 10px !important; background: rgba(139, 92, 246, 0.2) !important; color: #c4b5fd !important; font-weight: 500 !important; }
/* the mark of LabExp in place of the letters of the workspace, as LxMark in the sidebars of the sites */
html .antiLogo { position: relative; font-size: 0 !important; }
html .antiLogo::after { content: ""; position: absolute; inset: 22%; background-color: currentColor; -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMxNiAyMDUgMTI3IDE0NSIgZmlsbD0iIzAwMCI+PHBhdGggZD0iTTM2My44NTQgMjE5LjMwOFYyMzcuNzM5TDM3OS44MTYgMjI4LjUyM0wzNjMuODU0IDIxOS4zMDhaIi8+PHBhdGggZD0iTTM5NS42ODMgMzM1LjY0MVYzMTcuMjExTDM3OS43MjIgMzI2LjQyNkwzNjMuNzYxIDMxNy4yMTFWMzM1LjY0MUwzNzkuNzIyIDM0NC44NTZMMzk1LjY4MyAzMzUuNjQxWiIvPjxwYXRoIGQ9Ik0zNzkuNzIyIDI5NS40NzdMMzk1LjY4MyAyODYuMjYyVjI2Ny44MzJMMzc5LjcyMiAyNTguNjE3TDM2My43NjEgMjY3LjgzMlYyODYuMjYyTDM3OS43MjIgMjk1LjQ3N1oiLz48cGF0aCBkPSJNNDIxLjk3MSAyODMuNTEyVjMwMS45NDJMNDA2LjAxIDMxMS4xNThMNDIxLjk3MSAzMjAuMzczTDQzNy45MzIgMzExLjE1OFYyOTIuNzI3TDQyMS45NzEgMjgzLjUxMloiLz48cGF0aCBkPSJNNDA2LjAxIDI0My45M0w0MjEuOTcxIDI1My4xNDVWMjcxLjU3Nkw0MzcuOTMyIDI2Mi4zNjFWMjQzLjkzTDQyMS45NzEgMjM0LjcxNUw0MDYuMDEgMjQzLjkzWiIvPjxwYXRoIGQ9Ik0zNzkuODE2IDIxMC4wOTNMMzYzLjg1NCAyMTkuMzA4VjIzNy43MzlMMzc5LjgxNiAyMjguNTIzTDM5NS43NzcgMjM3LjczOVYyMTkuMzA4TDM3OS44MTYgMjEwLjA5M1oiLz48cGF0aCBkPSJNMzIxLjY5OCAyNDMuOTMxVjI2Mi4zNjFMMzM3LjY1OSAyNzEuNTc2VjI1My4xNDZMMzUzLjYyIDI0My45MzFMMzM3LjY1OSAyMzQuNzE2TDMyMS42OTggMjQzLjkzMVoiLz48cGF0aCBkPSJNMzM3LjQ3MyAyODMuNTEyTDMyMS41MTIgMjkyLjcyN1YzMTEuMTU4TDMzNy40NzMgMzIwLjM3M0wzNTMuNDM0IDMxMS4xNThMMzM3LjQ3MyAzMDEuOTQyVjI4My41MTJaIi8+PC9zdmc+") center / contain no-repeat; mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMxNiAyMDUgMTI3IDE0NSIgZmlsbD0iIzAwMCI+PHBhdGggZD0iTTM2My44NTQgMjE5LjMwOFYyMzcuNzM5TDM3OS44MTYgMjI4LjUyM0wzNjMuODU0IDIxOS4zMDhaIi8+PHBhdGggZD0iTTM5NS42ODMgMzM1LjY0MVYzMTcuMjExTDM3OS43MjIgMzI2LjQyNkwzNjMuNzYxIDMxNy4yMTFWMzM1LjY0MUwzNzkuNzIyIDM0NC44NTZMMzk1LjY4MyAzMzUuNjQxWiIvPjxwYXRoIGQ9Ik0zNzkuNzIyIDI5NS40NzdMMzk1LjY4MyAyODYuMjYyVjI2Ny44MzJMMzc5LjcyMiAyNTguNjE3TDM2My43NjEgMjY3LjgzMlYyODYuMjYyTDM3OS43MjIgMjk1LjQ3N1oiLz48cGF0aCBkPSJNNDIxLjk3MSAyODMuNTEyVjMwMS45NDJMNDA2LjAxIDMxMS4xNThMNDIxLjk3MSAzMjAuMzczTDQzNy45MzIgMzExLjE1OFYyOTIuNzI3TDQyMS45NzEgMjgzLjUxMloiLz48cGF0aCBkPSJNNDA2LjAxIDI0My45M0w0MjEuOTcxIDI1My4xNDVWMjcxLjU3Nkw0MzcuOTMyIDI2Mi4zNjFWMjQzLjkzTDQyMS45NzEgMjM0LjcxNUw0MDYuMDEgMjQzLjkzWiIvPjxwYXRoIGQ9Ik0zNzkuODE2IDIxMC4wOTNMMzYzLjg1NCAyMTkuMzA4VjIzNy43MzlMMzc5LjgxNiAyMjguNTIzTDM5NS43NzcgMjM3LjczOVYyMTkuMzA4TDM3OS44MTYgMjEwLjA5M1oiLz48cGF0aCBkPSJNMzIxLjY5OCAyNDMuOTMxVjI2Mi4zNjFMMzM3LjY1OSAyNzEuNTc2VjI1My4xNDZMMzUzLjYyIDI0My45MzFMMzM3LjY1OSAyMzQuNzE2TDMyMS42OTggMjQzLjkzMVoiLz48cGF0aCBkPSJNMzM3LjQ3MyAyODMuNTEyTDMyMS41MTIgMjkyLjcyN1YzMTEuMTU4TDMzNy40NzMgMzIwLjM3M0wzNTMuNDM0IDMxMS4xNThMMzM3LjQ3MyAzMDEuOTQyVjI4My41MTJaIi8+PC9zdmc+") center / contain no-repeat; }
html .hulyAvatar-container.roundedRect { border-radius: 50% !important; }
html .hulyAvatar-container:not(:has(img)) { background: rgba(139, 92, 246, 0.22) !important; color: #ddd6fe !important; }
html .hulyAvatar-container img { border-radius: 50%; }
html .hulyTaskNavLink-avatar { border-radius: 12px !important; background: rgba(139, 92, 246, 0.16) !important; }
html .hulyPanels-container, html .antiPanel-application.sidebar-container .root { border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }

/* the blue tints of Huly (hover and active fills, the today marker, the switchers) become the neutral and violet fills of the kit */
html .switcher-container { border-radius: 10px !important; background: var(--theme-button-default) !important; }
html .switcher-element { border-radius: 8px !important; }
html .switcher-element.subtle:not(.woTitle) { background: transparent !important; }
html .switcher-element.woTitle, html .switcher-element.subtle.selected { background: var(--theme-button-hovered) !important; }
html .searchInput-wrapper { border-radius: 10px !important; }
html .timeline-cell-today-marker { background: rgba(139, 92, 246, 0.12) !important; }
html.theme-dark.theme-dark, html .theme-dark.theme-dark { --global-ui-BackgroundColor: rgba(255, 255, 255, 0.05); --global-ui-hover-BackgroundColor: rgba(255, 255, 255, 0.09); --global-ui-active-BackgroundColor: rgba(255, 255, 255, 0.13); --global-ui-highlight-BackgroundColor: rgba(255, 255, 255, 0.04); --global-ui-hover-highlight-BackgroundColor: rgba(255, 255, 255, 0.09); --global-ui-BorderColor: rgba(255, 255, 255, 0.07); --calendar-event-handle-color: #8b5cf6; --global-accent-SkyText: #ddd6fe; --global-subtle-BackgroundColor: rgba(139, 92, 246, 0.2); }

/* lists and tables: a rounded surface, rows without fills, a violet hover and selection, headers in the normal case */
html .hulyComponent .scroller-container:has(> .horizontalBox table.antiTable) { overflow: hidden; border-radius: 16px; background: var(--theme-navpanel-color); box-shadow: inset 0 0 0 1px var(--theme-divider-color); }
html .antiTable-body__row { border-bottom: 1px solid var(--theme-divider-color) !important; background: transparent !important; }
html .antiTable-body__row:hover { background: var(--theme-popup-hover) !important; }
html .antiTable-body__row.selected { background: var(--theme-navpanel-selected) !important; }
html thead.scroller-thead, html thead.scroller-thead th { background: var(--theme-navpanel-color) !important; } /* opaque: the rows scroll under it */
html .antiTable .footer, html .footer { background: var(--theme-navpanel-color) !important; }
html th { text-transform: none !important; letter-spacing: 0 !important; font-weight: 600 !important; }
html .hulyHeader-row { border-bottom: 0 !important; }
html.theme-dark.theme-dark, html .theme-dark.theme-dark { --theme-table-row-color: transparent; --theme-table-header-color: #17151e; }

/* the panels of the pages (settings and others) are not frames either; their cards are the surfaces of the kit */
html .antiPanel-component, html .antiPanel-component.filledNav { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html .plugin-card { border-radius: 16px !important; background: var(--theme-navpanel-color) !important; box-shadow: none !important; }
html .plugin-card.enabled { box-shadow: inset 0 0 0 1px rgba(167, 139, 250, 0.28) !important; }

/* what the team does not use is cut out: the help and the community link of Huly, the apps that are not ours */
html .antiNav-footer, html a[href*="link.huly.io"], html .info-box a[href^="http"] { display: none !important; }
html a[href*="/workbench/"][href*="/recruit"], html a[href*="/workbench/"][href*="/lead"], html a[href*="/workbench/"][href*="/inventory"], html a[href*="/workbench/"][href*="/products"] { display: none !important; }

/* the planner: the schedule is one rounded card (the cells have its colour, the hatch under them is gone), the columns have a gap between them */
html .hulyPanels-container { gap: 12px; }
html .hulyComponent.modal { overflow: hidden; border-radius: 16px; background: var(--theme-navpanel-color) !important; box-shadow: inset 0 0 0 1px var(--theme-divider-color); }
html .timeline-grid-bg { background-image: none !important; }
html .empty-cell, html .allday-container, html .sticky-header { border-color: var(--theme-divider-color) !important; }

/* the rail as in the other services: the mark, the services, the avatar | the apps | the settings. The two wrappers of Huly are dissolved so that
   the items can be put in this order; the services button is made by labexp-shell.js */
html .workbench-container.apps-vertical > .antiPanel-application.vertical { display: flex !important; flex-direction: column; align-items: center; gap: 6px; padding: 12px 0 !important; }
html .workbench-container.apps-vertical > .antiPanel-application.vertical > .hamburger-container, html .workbench-container.apps-vertical > .antiPanel-application.vertical > .info-box { display: contents !important; }
html .logo-container { order: 1; margin: 0 !important; }
html .lx-services-btn { order: 2; }
html .info-box > div.flex-center { order: 3; margin: 0 !important; }
html .topmenu-container { order: 5; width: 36px; margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--theme-divider-color); }
html .hamburger-container > a.noBold { order: 6; }
html .hamburger-container > .apps-vertical { order: 7; flex: 1 1 0; min-height: 0; width: 100%; }
html .info-box > button.app { order: 9; }
html .info-box > a { order: 10; }
html .lx-services-btn { position: relative; display: grid; flex: none; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 12px; background: transparent; color: var(--theme-navpanel-icons-color, #a1a1aa); cursor: pointer; transition: background 0.15s, color 0.15s; }
html .lx-services-btn:hover { background: var(--theme-navpanel-hovered); color: var(--theme-caption-color); }
html .lx-services-tip { position: absolute; left: calc(100% + 14px); top: 50%; z-index: 70; padding: 7px 12px; border-radius: 8px; background: var(--theme-popup-color); color: var(--theme-caption-color); font-size: 13px; font-weight: 500; white-space: nowrap; box-shadow: var(--theme-popup-shadow); opacity: 0; pointer-events: none; transform: translate(-6px, -50%); transition: opacity 0.16s ease, transform 0.2s ease; }
html .lx-services-btn:hover .lx-services-tip { opacity: 1; transform: translate(0, -50%); }
html .lx-services-pop { position: fixed; z-index: 2000; width: 340px; padding: 10px; border-radius: 14px; background: var(--theme-popup-color); box-shadow: var(--theme-popup-shadow); color: var(--theme-content-color); animation: lx-pop-in 0.16s ease; }
html .lx-services-title { margin: 4px 8px 8px; color: var(--theme-dark-color); font-size: 12px; font-weight: 600; letter-spacing: 0.08em; }
html .lx-services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
html .lx-service { display: grid; justify-items: center; gap: 8px; padding: 12px 6px; border-radius: 12px; color: var(--theme-content-color); font-size: 12px; line-height: 1.3; text-align: center; text-decoration: none; transition: background 0.15s; }
html .lx-service:hover { background: var(--theme-popup-hover); }
html .lx-service-ico { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: color-mix(in srgb, var(--tone) 22%, transparent); color: var(--tone); font-weight: 700; }
@keyframes lx-pop-in { from { opacity: 0; transform: translateX(-6px) scale(0.98); } to { opacity: 1; transform: none; } }

/* the tooltips of Huly look as the tooltips of the portal: a small rounded plate, no frame, no nub */
html .tooltip { padding: 7px 12px !important; border: 0 !important; border-radius: 8px !important; background: var(--theme-popup-color) !important; color: var(--theme-caption-color) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.3 !important; box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.7), inset 0 0 0 1px rgba(255, 255, 255, 0.1) !important; }
html .tooltip::before, html .tooltip::after { display: none !important; }

/* the avatars are circles at every size, and the focus ring is the violet one of the kit (not the white default) */
html .hulyAvatar-container, html .hulyAvatar-container img, html img.ava-image { border-radius: 50% !important; }
html .antiButton:focus-visible, html .hulyButton:focus-visible { outline: 2px solid #8b5cf6 !important; outline-offset: 2px; }
/* a field has the ring of its wrapper (the search, the edit box): an outline on the input itself drew vertical lines inside it */
html input:focus-visible, html textarea:focus-visible, html input:focus, html textarea:focus { outline: 0 !important; }
/* rows of menus and lists are focused by Huly itself when a menu opens: the focus is the hover fill, not a frame */
html .hulyPopup-row:focus-visible, html .menu-item:focus-visible, html .hulyNavItem-container:focus-visible, html .antiTable-body__row:focus-visible { outline: 0 !important; background: var(--theme-popup-hover); }

/* the contacts of Huly are not used: a person is a profile of the portal (labexp-shell.js sends there) */
html a[href$="/contact"], html a[href*="/contact/"][class*="app"] { display: none !important; }

/* the second kind of popup of Huly (the menu of the three dots, the lists of actions): as wide as its rows, not 264 px with one short row */
html .hulyPopup-container { min-width: 0 !important; width: max-content; max-width: min(360px, 92vw); padding: 0 !important; border: 0 !important; border-radius: 14px !important; background: var(--theme-popup-color) !important; box-shadow: var(--theme-popup-shadow) !important; }
html .hulyPopup-container .scroller-container { min-width: 0 !important; }
html .hulyPopup-container .box { padding: 6px !important; gap: 2px; } /* one inset only: the container had 6 px and the box 4 px more, the hover looked like a frame in a frame */
html .hulyPopup-row { border-radius: 9px !important; } /* the padding and the height stay Huly's: a narrower row made the menu look cramped */
html .hulyPopup-row:hover, html .hulyPopup-row.selected { background: var(--theme-popup-hover) !important; }
html .hulyPopup-row__label { white-space: nowrap; }

/* menus: one plate without a ring; a row under the pointer is a violet tint (as the selected row of the navigator), not a second grey plate inside the first */
html .hulyPopup-container, html .selectPopup, html .antiPopup { box-shadow: 0 16px 40px -10px rgba(0, 0, 0, 0.7) !important; }
html .hulyPopup-row:hover, html .hulyPopup-row.selected, html .hulyPopup-row:focus-visible, html .menu-item:hover, html .menu-item.selected, html .menu-item:focus-visible { background: rgba(139, 92, 246, 0.2) !important; color: var(--theme-caption-color); }
html .hulyPopup-row { gap: 10px; }

/* what is not a variable: the thin scrollbar of the site, the violet selection and focus ring */
html * { scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.18) transparent; }
html.theme-light *, html .theme-light * { scrollbar-color: rgba(16, 24, 40, 0.22) transparent; }
::selection { background: rgba(139, 92, 246, 0.4); }

/* the sign-in page: the violet-black of the portal instead of the blue waves, the form on a surface of the kit */
html .backd .back-image { display: none !important; }
html .backd.backd { background: radial-gradient(52% 60% at 14% 0%, rgba(139, 92, 246, 0.26), transparent 70%), radial-gradient(40% 50% at 100% 100%, rgba(139, 92, 246, 0.12), transparent 70%), #100e17 !important; }
html .panel-base.panel { border-radius: 20px !important; background: #17151e !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.07) !important; backdrop-filter: none !important; }

/* the sign-in page: the mark and the name of LabExp in the corner instead of the ones of Huly */
/* under the floating top bar of the shell, not behind it */
html .bg-image > .flex-row-center { top: 84px !important; left: 28px !important; }
html .bg-image > .flex-row-center > svg { display: none !important; }
html .bg-image > .flex-row-center::before { content: ""; width: 22px; height: 24px; background-color: #c4b5fd; -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMxNiAyMDUgMTI3IDE0NSIgZmlsbD0iIzAwMCI+PHBhdGggZD0iTTM2My44NTQgMjE5LjMwOFYyMzcuNzM5TDM3OS44MTYgMjI4LjUyM0wzNjMuODU0IDIxOS4zMDhaIi8+PHBhdGggZD0iTTM5NS42ODMgMzM1LjY0MVYzMTcuMjExTDM3OS43MjIgMzI2LjQyNkwzNjMuNzYxIDMxNy4yMTFWMzM1LjY0MUwzNzkuNzIyIDM0NC44NTZMMzk1LjY4MyAzMzUuNjQxWiIvPjxwYXRoIGQ9Ik0zNzkuNzIyIDI5NS40NzdMMzk1LjY4MyAyODYuMjYyVjI2Ny44MzJMMzc5LjcyMiAyNTguNjE3TDM2My43NjEgMjY3LjgzMlYyODYuMjYyTDM3OS43MjIgMjk1LjQ3N1oiLz48cGF0aCBkPSJNNDIxLjk3MSAyODMuNTEyVjMwMS45NDJMNDA2LjAxIDMxMS4xNThMNDIxLjk3MSAzMjAuMzczTDQzNy45MzIgMzExLjE1OFYyOTIuNzI3TDQyMS45NzEgMjgzLjUxMloiLz48cGF0aCBkPSJNNDA2LjAxIDI0My45M0w0MjEuOTcxIDI1My4xNDVWMjcxLjU3Nkw0MzcuOTMyIDI2Mi4zNjFWMjQzLjkzTDQyMS45NzEgMjM0LjcxNUw0MDYuMDEgMjQzLjkzWiIvPjxwYXRoIGQ9Ik0zNzkuODE2IDIxMC4wOTNMMzYzLjg1NCAyMTkuMzA4VjIzNy43MzlMMzc5LjgxNiAyMjguNTIzTDM5NS43NzcgMjM3LjczOVYyMTkuMzA4TDM3OS44MTYgMjEwLjA5M1oiLz48cGF0aCBkPSJNMzIxLjY5OCAyNDMuOTMxVjI2Mi4zNjFMMzM3LjY1OSAyNzEuNTc2VjI1My4xNDZMMzUzLjYyIDI0My45MzFMMzM3LjY1OSAyMzQuNzE2TDMyMS42OTggMjQzLjkzMVoiLz48cGF0aCBkPSJNMzM3LjQ3MyAyODMuNTEyTDMyMS41MTIgMjkyLjcyN1YzMTEuMTU4TDMzNy40NzMgMzIwLjM3M0wzNTMuNDM0IDMxMS4xNThMMzM3LjQ3MyAzMDEuOTQyVjI4My41MTJaIi8+PC9zdmc+") center / contain no-repeat; mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMxNiAyMDUgMTI3IDE0NSIgZmlsbD0iIzAwMCI+PHBhdGggZD0iTTM2My44NTQgMjE5LjMwOFYyMzcuNzM5TDM3OS44MTYgMjI4LjUyM0wzNjMuODU0IDIxOS4zMDhaIi8+PHBhdGggZD0iTTM5NS42ODMgMzM1LjY0MVYzMTcuMjExTDM3OS43MjIgMzI2LjQyNkwzNjMuNzYxIDMxNy4yMTFWMzM1LjY0MUwzNzkuNzIyIDM0NC44NTZMMzk1LjY4MyAzMzUuNjQxWiIvPjxwYXRoIGQ9Ik0zNzkuNzIyIDI5NS40NzdMMzk1LjY4MyAyODYuMjYyVjI2Ny44MzJMMzc5LjcyMiAyNTguNjE3TDM2My43NjEgMjY3LjgzMlYyODYuMjYyTDM3OS43MjIgMjk1LjQ3N1oiLz48cGF0aCBkPSJNNDIxLjk3MSAyODMuNTEyVjMwMS45NDJMNDA2LjAxIDMxMS4xNThMNDIxLjk3MSAzMjAuMzczTDQzNy45MzIgMzExLjE1OFYyOTIuNzI3TDQyMS45NzEgMjgzLjUxMloiLz48cGF0aCBkPSJNNDA2LjAxIDI0My45M0w0MjEuOTcxIDI1My4xNDVWMjcxLjU3Nkw0MzcuOTMyIDI2Mi4zNjFWMjQzLjkzTDQyMS45NzEgMjM0LjcxNUw0MDYuMDEgMjQzLjkzWiIvPjxwYXRoIGQ9Ik0zNzkuODE2IDIxMC4wOTNMMzYzLjg1NCAyMTkuMzA4VjIzNy43MzlMMzc5LjgxNiAyMjguNTIzTDM5NS43NzcgMjM3LjczOVYyMTkuMzA4TDM3OS44MTYgMjEwLjA5M1oiLz48cGF0aCBkPSJNMzIxLjY5OCAyNDMuOTMxVjI2Mi4zNjFMMzM3LjY1OSAyNzEuNTc2VjI1My4xNDZMMzUzLjYyIDI0My45MzFMMzM3LjY1OSAyMzQuNzE2TDMyMS42OTggMjQzLjkzMVoiLz48cGF0aCBkPSJNMzM3LjQ3MyAyODMuNTEyTDMyMS41MTIgMjkyLjcyN1YzMTEuMTU4TDMzNy40NzMgMzIwLjM3M0wzNTMuNDM0IDMxMS4xNThMMzM3LjQ3MyAzMDEuOTQyVjI4My41MTJaIi8+PC9zdmc+") center / contain no-repeat; }
html .bg-image > .flex-row-center > .fs-title { font-size: 0 !important; }
html .bg-image > .flex-row-center > .fs-title::after { content: "LabExp"; font: 500 18px/1 Outfit, Montserrat, sans-serif; letter-spacing: -0.01em; color: #f4f4f5; }

/* accounts come from the game only (sign-up is off in the account service): no sign-up tab, no guest, no sign-in by an e-mail
   code — LabExp ID is the way in */
html .form-content .caption > a.title:first-child:not(.selected) { display: none !important; }
html .form-content .actions, html .login-as-guest { display: none !important; }
/* the button of LabExp ID: the mark of LabExp instead of the OpenID logo */
html a[href*="/_accounts/auth/openid"] svg { display: none !important; }
html a[href*="/_accounts/auth/openid"] .flex-row-center::before { content: ""; flex: none; width: 18px; height: 20px; background-color: currentColor; -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMxNiAyMDUgMTI3IDE0NSIgZmlsbD0iIzAwMCI+PHBhdGggZD0iTTM2My44NTQgMjE5LjMwOFYyMzcuNzM5TDM3OS44MTYgMjI4LjUyM0wzNjMuODU0IDIxOS4zMDhaIi8+PHBhdGggZD0iTTM5NS42ODMgMzM1LjY0MVYzMTcuMjExTDM3OS43MjIgMzI2LjQyNkwzNjMuNzYxIDMxNy4yMTFWMzM1LjY0MUwzNzkuNzIyIDM0NC44NTZMMzk1LjY4MyAzMzUuNjQxWiIvPjxwYXRoIGQ9Ik0zNzkuNzIyIDI5NS40NzdMMzk1LjY4MyAyODYuMjYyVjI2Ny44MzJMMzc5LjcyMiAyNTguNjE3TDM2My43NjEgMjY3LjgzMlYyODYuMjYyTDM3OS43MjIgMjk1LjQ3N1oiLz48cGF0aCBkPSJNNDIxLjk3MSAyODMuNTEyVjMwMS45NDJMNDA2LjAxIDMxMS4xNThMNDIxLjk3MSAzMjAuMzczTDQzNy45MzIgMzExLjE1OFYyOTIuNzI3TDQyMS45NzEgMjgzLjUxMloiLz48cGF0aCBkPSJNNDA2LjAxIDI0My45M0w0MjEuOTcxIDI1My4xNDVWMjcxLjU3Nkw0MzcuOTMyIDI2Mi4zNjFWMjQzLjkzTDQyMS45NzEgMjM0LjcxNUw0MDYuMDEgMjQzLjkzWiIvPjxwYXRoIGQ9Ik0zNzkuODE2IDIxMC4wOTNMMzYzLjg1NCAyMTkuMzA4VjIzNy43MzlMMzc5LjgxNiAyMjguNTIzTDM5NS43NzcgMjM3LjczOVYyMTkuMzA4TDM3OS44MTYgMjEwLjA5M1oiLz48cGF0aCBkPSJNMzIxLjY5OCAyNDMuOTMxVjI2Mi4zNjFMMzM3LjY1OSAyNzEuNTc2VjI1My4xNDZMMzUzLjYyIDI0My45MzFMMzM3LjY1OSAyMzQuNzE2TDMyMS42OTggMjQzLjkzMVoiLz48cGF0aCBkPSJNMzM3LjQ3MyAyODMuNTEyTDMyMS41MTIgMjkyLjcyN1YzMTEuMTU4TDMzNy40NzMgMzIwLjM3M0wzNTMuNDM0IDMxMS4xNThMMzM3LjQ3MyAzMDEuOTQyVjI4My41MTJaIi8+PC9zdmc+") center / contain no-repeat; mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjMxNiAyMDUgMTI3IDE0NSIgZmlsbD0iIzAwMCI+PHBhdGggZD0iTTM2My44NTQgMjE5LjMwOFYyMzcuNzM5TDM3OS44MTYgMjI4LjUyM0wzNjMuODU0IDIxOS4zMDhaIi8+PHBhdGggZD0iTTM5NS42ODMgMzM1LjY0MVYzMTcuMjExTDM3OS43MjIgMzI2LjQyNkwzNjMuNzYxIDMxNy4yMTFWMzM1LjY0MUwzNzkuNzIyIDM0NC44NTZMMzk1LjY4MyAzMzUuNjQxWiIvPjxwYXRoIGQ9Ik0zNzkuNzIyIDI5NS40NzdMMzk1LjY4MyAyODYuMjYyVjI2Ny44MzJMMzc5LjcyMiAyNTguNjE3TDM2My43NjEgMjY3LjgzMlYyODYuMjYyTDM3OS43MjIgMjk1LjQ3N1oiLz48cGF0aCBkPSJNNDIxLjk3MSAyODMuNTEyVjMwMS45NDJMNDA2LjAxIDMxMS4xNThMNDIxLjk3MSAzMjAuMzczTDQzNy45MzIgMzExLjE1OFYyOTIuNzI3TDQyMS45NzEgMjgzLjUxMloiLz48cGF0aCBkPSJNNDA2LjAxIDI0My45M0w0MjEuOTcxIDI1My4xNDVWMjcxLjU3Nkw0MzcuOTMyIDI2Mi4zNjFWMjQzLjkzTDQyMS45NzEgMjM0LjcxNUw0MDYuMDEgMjQzLjkzWiIvPjxwYXRoIGQ9Ik0zNzkuODE2IDIxMC4wOTNMMzYzLjg1NCAyMTkuMzA4VjIzNy43MzlMMzc5LjgxNiAyMjguNTIzTDM5NS43NzcgMjM3LjczOVYyMTkuMzA4TDM3OS44MTYgMjEwLjA5M1oiLz48cGF0aCBkPSJNMzIxLjY5OCAyNDMuOTMxVjI2Mi4zNjFMMzM3LjY1OSAyNzEuNTc2VjI1My4xNDZMMzUzLjYyIDI0My45MzFMMzM3LjY1OSAyMzQuNzE2TDMyMS42OTggMjQzLjkzMVoiLz48cGF0aCBkPSJNMzM3LjQ3MyAyODMuNTEyTDMyMS41MTIgMjkyLjcyN1YzMTEuMTU4TDMzNy40NzMgMzIwLjM3M0wzNTMuNDM0IDMxMS4xNThMMzM3LjQ3MyAzMDEuOTQyVjI4My41MTJaIi8+PC9zdmc+") center / contain no-repeat; }