.hymoteq-header-wordmark { display: none; }

/* Variante 1: feste Bereichsnavigation. Bestehende Fachansichten bleiben unverändert. */
@media screen {
  /* Die Seitenleiste gehoert erst zur angemeldeten App. Ohne diese Regel
     erscheinen ihr Emblem und die Navigationssymbole im Login als Rohinhalt. */
  html body:is([data-view="login"], [data-view="register"], [data-view="twofa"])
    :is(#wp-sidebar, #wp-sidebar-open, #wp-sidebar-scrim) {
    display: none !important;
  }

  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) {
    --wp-sidebar-width: 290px;
    --wp-sidebar-header-height: 84px;
    padding-left: var(--wp-sidebar-width) !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  html body.wp-sidebar-collapsed[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) {
    --wp-sidebar-width: 76px;
  }

  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar.wp-sidebar {
    display: flex !important;
    position: fixed !important;
    z-index: 900 !important;
    inset: 0 auto 0 0 !important;
    flex-direction: column !important;
    width: var(--wp-sidebar-width, 290px) !important;
    height: 100dvh !important;
    box-sizing: border-box !important;
    padding: 0 12px 18px !important;
    overflow: hidden !important;
    border-right: 1px solid #e1e7eb !important;
    background: #ffffff !important;
    box-shadow: 3px 0 16px rgba(64, 58, 64, .035) !important;
  }

  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .wp-sidebar-brand {
    display: flex;
    align-items: center;
    gap: 17px;
    flex: 0 0 112px;
    min-width: 0;
    padding: 8px 10px 11px;
    box-sizing: border-box;
    cursor: pointer;
  }

  #wp-sidebar .wp-sidebar-brand svg { flex: 0 0 75px; width: 75px; height: 75px; object-fit: contain; fill:none; stroke:#a40a1c; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
  #wp-sidebar .wp-sidebar-brand strong { color: #60101b; font-size: 27px; font-weight: 950; letter-spacing: -.05em; white-space: nowrap; }

  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav {
    display: flex !important;
    position: static !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 6px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 12px 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    scrollbar-width: thin;
  }

  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn,
  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn.active {
    position: relative !important;
    display: flex !important;
    flex: 0 0 56px !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 17px !important;
    gap: 21px !important;
    box-sizing: border-box !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #60101b !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-align: left !important;
    text-shadow: none !important;
    overflow: visible !important;
    cursor: pointer !important;
  }

  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn[hidden],
  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn[style*="display: none"] { display: none !important; }

  /* Die frühere Kopfzeile vergibt order-Werte. In der Seitenleiste ist die
     gewünschte Reihenfolge explizit, einschließlich der neuen Bereiche. */
  #wp-sidebar .wp-sidebar-nav [data-nav="start"] { order: 1 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="produktion"] { order: 2 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="logistik"] { order: 3 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="planung"] { order: 4 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="einkauf"] { order: 5 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="vertriebsinnendienst"] { order: 6 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="werkzeuge"] { order: 7 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="instandhaltung"] { order: 8 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="system-uploads"] { order: 9 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="messages"] { order: 10 !important; }
  #wp-sidebar .wp-sidebar-nav [data-nav="umsatz"] { order: 11 !important; }

  #wp-sidebar .wp-sidebar-nav .header-btn .nav-icon {
    display: block !important;
    visibility: visible !important;
    flex: 0 0 27px !important;
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    stroke: currentColor !important;
    color: inherit !important;
    fill: none !important;
    stroke-width: 1.9 !important;
  }
  #wp-sidebar .wp-sidebar-nav .header-btn > span:not(.messages-nav-badge) {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
    font-size: 16px !important;
    font-weight: inherit !important;
    line-height: 1.4 !important;
    text-align: left !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    color: inherit !important;
  }
  html body #wp-sidebar .wp-sidebar-nav .header-btn::after { content: none !important; display: none !important; }
  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn:hover { background: #fafafb !important; }
  /* Metallic-Rot: die aktuelle Seite erhält einen sichtbaren Fensterrand.
     Die Startseite wird zusätzlich über die aktive Ansicht markiert. */
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav [data-nav="start"],
  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn.active {
    border: 2px solid transparent !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg, #fafafb, #fafafb 48%, #f4f4f5) padding-box,
                linear-gradient(135deg, #e1e1e3, #a40a1c 55%, #dededf) border-box !important;
    color: #60101b !important;
    font-weight: 800 !important;
    box-shadow: inset 0 1px 0 #ffffff, 0 3px 14px rgba(164, 10, 28, .18) !important;
  }
  html body #wp-sidebar .wp-sidebar-nav .header-btn.active :is(span, svg),
  html body[data-view="start"] #wp-sidebar .wp-sidebar-nav [data-nav="start"] :is(span, svg) { color: #60101b !important; stroke: currentColor !important; }

  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar #wp-sidebar-admin {
    display: flex;
    flex: 0 0 56px;
    align-items: center;
    gap: 21px;
    width: 100%;
    min-width: 0;
    height: 56px;
    margin: 0;
    padding: 0 17px;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 9px;
    background: #ffffff;
    color: #60101b;
    font: inherit;
    font-size: 16px;
    line-height: 1.4;
    text-align: left;
    cursor: pointer;
  }
  html body #wp-sidebar #wp-sidebar-admin[style*="display: none"] { display: none !important; }
  #wp-sidebar #wp-sidebar-admin .nav-icon { flex: 0 0 27px; width: 27px; height: 27px; stroke: currentColor; fill: none; stroke-width: 1.9; }
  #wp-sidebar #wp-sidebar-admin:hover { background: #fafafb; }
  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar #wp-sidebar-admin.active {
    border: 2px solid transparent !important;
    background: linear-gradient(135deg, #fafafb, #f4f4f5) padding-box,
                linear-gradient(135deg, #e1e1e3, #a40a1c, #dededf) border-box !important;
    color: #60101b !important;
    font-weight: 800 !important;
    box-shadow: 0 3px 14px rgba(164, 10, 28, .18) !important;
  }

  #wp-sidebar .wp-sidebar-collapse {
    display: flex;
    flex: 0 0 66px;
    align-items: center;
    gap: 20px;
    width: 100%;
    padding: 0 17px;
    border: 0;
    border-top: 1px solid #eaeaeb;
    background: #ffffff;
    color: #62778a;
    font: inherit;
    font-size: 14px;
    cursor: pointer;
  }
  #wp-sidebar .wp-sidebar-collapse > span:first-child { font-size: 29px; line-height: 1; }
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-brand { justify-content: center; padding: 8px 0; }
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-brand svg { flex-basis: 50px; width: 50px; height: 50px; }
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-brand strong,
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-nav .header-btn > span:not(.messages-nav-badge),
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-collapse-label { display: none !important; }
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-nav .header-btn,
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-nav .header-btn.active { justify-content: center !important; padding: 0 !important; }
  body.wp-sidebar-collapsed #wp-sidebar #wp-sidebar-admin { justify-content: center !important; padding: 0 !important; }
  body.wp-sidebar-collapsed #wp-sidebar #wp-sidebar-admin span { display: none !important; }
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-collapse { justify-content: center; padding: 0; }
  body.wp-sidebar-collapsed #wp-sidebar .wp-sidebar-collapse > span:first-child { transform: rotate(180deg); }

  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header {
    position: relative !important;
    z-index: 880 !important;
    width: 100% !important;
    height: var(--wp-sidebar-header-height) !important;
    min-height: var(--wp-sidebar-header-height) !important;
    max-height: var(--wp-sidebar-header-height) !important;
    padding: 10px 22px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    border: 0 !important;
    border-bottom: 1px solid #eaeaeb !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: 0 3px 14px rgba(64, 58, 64, .055) !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header::before { content: none !important; display: none !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-header-top {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    gap: 0 !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-title-block { display: none !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-header-right {
    display: flex !important;
    flex-direction: row-reverse !important;
    justify-content: flex-start !important;
    align-items: center !important;
    width: auto !important;
    min-width: 0 !important;
    height: 100% !important;
    gap: 12px !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-header-utilities {
    display: flex !important;
    flex-direction: row !important;
    flex: none !important;
    align-items: center !important;
    width: auto !important;
    height: 100% !important;
    gap: 0 !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-period-group {
    display: flex !important;
    flex: none !important;
    align-items: center !important;
    width: auto !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    gap: 8px !important;
    overflow: visible !important;
    border: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #year-active-display,
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-period-group select {
    min-width: 75px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 11px !important;
    border-radius: 11px !important;
    background: #fafafb !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-today-btn { display: none !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-notification {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 44px !important;
    padding: 0 !important;
    margin: 0 0 0 4px !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 52px !important;
    border: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-notification svg {
    position: static !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    transform: none !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-user-group {
    position: relative !important;
    flex: 0 1 380px !important;
    min-width: 210px !important;
    max-width: 380px !important;
    height: 60px !important;
    margin-left: 0 !important;
    padding: 7px 13px !important;
    border-radius: 14px !important;
    background: #f4f6f7 !important;
    box-shadow: none !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-power-btn { display: none !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-user-avatar {
    flex: 0 0 38px !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    border: 1px solid #cdd6dc !important;
    background: #f9f9fa !important;
    box-shadow: none !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-user-avatar[data-user-status="online"] { border: 2px solid #ffffff !important; background: #22a65b !important; box-shadow: 0 0 0 1px #a7bec0 !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #auth-user-display { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  #wp-profile-toggle {
    flex: 0 0 24px;
    width: 24px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #a40a1c;
    font: inherit;
    font-size: 23px;
    cursor: pointer;
  }
  #wp-profile-menu:not([hidden]) {
    display: flex;
    position: absolute;
    z-index: 950;
    top: calc(100% + 8px);
    right: 0;
    flex-direction: column;
    gap: 3px;
    width: 200px;
    padding: 7px;
    border: 1px solid #eaeaeb;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(64, 58, 64, .14);
  }
  #wp-profile-menu[hidden] { display: none !important; }
  html body #wp-profile-menu button,
  html body #wp-profile-menu .modern-user-admin-action {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 38px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #60101b !important;
    font: inherit !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    cursor: pointer !important;
  }
  html body #wp-profile-menu button[style*="display: none"] { display: none !important; }
  html body #wp-profile-menu button:hover { background: #fafafb !important; }
  html body #wp-profile-menu button svg {
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin-right: 8px !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    fill: none !important;
  }

  html body[data-view="start"] #global-back-row #global-back-btn { display: none !important; }

  html body[data-view="start"] #main-view-container #start-view {
    min-height: calc(100dvh - 172px) !important;
    padding: var(--wp-category-top) var(--wp-category-gutter) 48px !important;
    background: #fafafb !important;
  }
  html body[data-view="start"] #main-view-container #start-view .start-page-heading { margin: 0 0 20px !important; }
  html body[data-view="start"] #main-view-container #start-view .start-container {
    width: 100% !important;
    max-width: min(1460px, calc(92vw - 326px)) !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 22px !important;
    margin: clamp(12px, 3dvh, 30px) auto 0 !important;
  }
  html body[data-view="start"] #main-view-container #start-view .start-kachel {
    height: clamp(210px, 11vw, 230px) !important;
    min-height: clamp(210px, 11vw, 230px) !important;
  }
  html body[data-view="start"] #main-view-container #start-view .start-kachel-icon { top: 22px !important; }
  html body[data-view="start"] #main-view-container #start-view .start-kachel h2,
  html body[data-view="start"] #main-view-container #start-view #planung-start-kachel h2,
  html body[data-view="start"] #main-view-container #start-view #werkzeuge-start-kachel h2,
  html body[data-view="start"] #main-view-container #start-view #vertriebsinnendienst-start-kachel h2 {
    position: absolute !important;
    top: 122px !important;
    left: 16px !important;
    right: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: none !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: clamp(18px, 1.32vw, 25px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
    white-space: nowrap !important;
    text-align: center !important;
  }
  html body[data-view="start"] #main-view-container #start-view #vertriebsinnendienst-start-kachel h2 {
    font-size: clamp(16px, 1.14vw, 21px) !important;
  }

  #wp-sidebar-open, #wp-sidebar-scrim { display: none; }
}

@media screen and (max-width: 800px) {
  html body .hymoteq-header-wordmark { display: none !important; }
}

@media screen and (max-width: 1450px) {
  html body[data-view="start"] #main-view-container #start-view .start-container { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; margin-top: 0 !important; }
}
@media screen and (max-width: 1160px) {
  html body[data-view="start"] #main-view-container #start-view .start-container {
    max-width: min(820px, 100%) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media screen and (max-width: 1100px) {
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) { --wp-sidebar-width: 76px; }
  html body #wp-sidebar .wp-sidebar-brand { justify-content: center !important; padding: 8px 0 !important; }
  html body #wp-sidebar .wp-sidebar-brand svg { flex-basis: 50px !important; width: 50px !important; height: 50px !important; }
  html body #wp-sidebar .wp-sidebar-brand strong,
  html body #wp-sidebar .wp-sidebar-nav .header-btn > span:not(.messages-nav-badge),
  html body #wp-sidebar .wp-sidebar-collapse-label { display: none !important; }
  html body #wp-sidebar .wp-sidebar-nav .header-btn,
  html body #wp-sidebar .wp-sidebar-nav .header-btn.active { justify-content: center !important; padding: 0 !important; }
  html body #wp-sidebar #wp-sidebar-admin { justify-content: center !important; padding: 0 !important; }
  html body #wp-sidebar #wp-sidebar-admin span { display: none !important; }
  html body #wp-sidebar .wp-sidebar-collapse { justify-content: center; padding: 0; }
  html body #wp-sidebar .wp-sidebar-collapse { display: none; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header { height: 72px !important; min-height: 72px !important; max-height: 72px !important; }
  html body[data-view="start"] #main-view-container #start-view .start-container { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media screen and (max-width: 700px) {
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) { padding-left: 0 !important; }
  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar.wp-sidebar { width: min(290px, calc(100vw - 48px)) !important; transform: translateX(-100%); transition: transform .2s ease; }
  html body.wp-sidebar-mobile-open #wp-sidebar.wp-sidebar { transform: translateX(0); }
  html body.wp-sidebar-mobile-open #wp-sidebar .wp-sidebar-brand strong,
  html body.wp-sidebar-mobile-open #wp-sidebar .wp-sidebar-nav .header-btn > span:not(.messages-nav-badge),
  html body.wp-sidebar-mobile-open #wp-sidebar .wp-sidebar-collapse-label { display: inline !important; }
  html body.wp-sidebar-mobile-open #wp-sidebar .wp-sidebar-nav .header-btn,
  html body.wp-sidebar-mobile-open #wp-sidebar .wp-sidebar-nav .header-btn.active { justify-content: flex-start !important; padding: 0 17px !important; }
  html body.wp-sidebar-mobile-open #wp-sidebar #wp-sidebar-admin { justify-content: flex-start !important; padding: 0 17px !important; }
  html body.wp-sidebar-mobile-open #wp-sidebar #wp-sidebar-admin span { display: inline !important; }
  html body.wp-sidebar-mobile-open #wp-sidebar .wp-sidebar-brand { justify-content: flex-start !important; }
  html body:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar-open {
    display: flex;
    position: absolute;
    z-index: 860;
    top: 14px;
    left: 12px;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 9px;
    border: 1px solid #eaeaeb;
    border-radius: 10px;
    background: #fff;
    color: #60101b;
  }
  #wp-sidebar-open .nav-icon { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 2; }
  html body.wp-sidebar-mobile-open #wp-sidebar-scrim { display: block; position: fixed; z-index: 895; inset: 0; background: rgba(31, 34, 40, .38); }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header { padding-left: 60px !important; padding-right: 10px !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-header-right { gap: 7px !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-period-group { gap: 4px !important; padding: 0 5px 0 0 !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-period-group #year-label,
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-period-group #kw-label { display: none !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-period-group #year-active-display,
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-period-group select { min-width: 48px !important; height: 36px !important; min-height: 36px !important; padding: 0 5px !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-notification { flex-basis: 38px !important; width: 38px !important; min-width: 38px !important; max-width: 38px !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-user-group {
    display: flex !important;
    flex: 0 0 57px !important;
    width: 57px !important;
    min-width: 57px !important;
    max-width: 57px !important;
    height: 44px !important;
    padding: 4px !important;
    gap: 0 !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-user-group .modern-user-copy { display: none !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-user-avatar { flex-basis: 27px !important; width: 27px !important; min-width: 27px !important; max-width: 27px !important; height: 27px !important; min-height: 27px !important; max-height: 27px !important; }
  #wp-profile-toggle { flex-basis: 20px; width: 20px; }
  html body[data-view="start"] #main-view-container #start-view { padding: var(--wp-category-top) var(--wp-category-gutter) 32px !important; }
  html body[data-view="start"] #main-view-container #start-view .start-container { grid-template-columns: minmax(0, 1fr) !important; max-width: none !important; gap: 16px !important; }
  html body[data-view="start"] #main-view-container #start-view .start-kachel { height: 205px !important; min-height: 205px !important; }
}

/* Kristallmotiv und Rotlicht ohne Wortmarke oder Emblem. */
@media screen {
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header {
    border-bottom: 2px solid #a40a1c !important;
    background: #fff !important;
    box-shadow: 0 2px 0 rgba(223, 89, 101, .30), 0 5px 20px rgba(197, 16, 36, .23) !important;
    isolation: isolate;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 auto 0 0 !important;
    width: min(720px, calc(100% - 520px)) !important;
    height: auto !important;
    pointer-events: none !important;
    background: url("../assets/assistant/werkpilot-header-variant3.png?v=1") left top / 900px 84px no-repeat !important;
    z-index: -1 !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header::after {
    content: none !important;
    display: none !important;
  }
  /* Neutrale Lichtlinien auf der permanenten Inhaltsflaeche. */
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container {
    background-color: #fafafb !important;
    background-image:
      url("../assets/assistant/crystal-lines-neutral.svg?v=2"),
      linear-gradient(133deg, transparent 0 61%, rgba(204, 204, 206, .07) 61% 70%, transparent 70%),
      radial-gradient(ellipse at 90% 90%, rgba(197, 16, 36, .12), transparent 47%),
      linear-gradient(150deg, #fafafb, #fafafb) !important;
    background-position: right bottom, center center, center center, center center !important;
    background-size: min(34vw, 496px, calc(131.2dvh - 126px)) auto, cover, cover, cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
  }
  /* Die Startseite hatte zuvor einen staerker gewichteten Sonderhintergrund. */
  html body[data-view="start"] #main-view-container #start-view {
    background-color: transparent !important;
    background-image: none !important;
    isolation: auto !important;
  }
  /* Nur die aeusseren Modul-Flaechen sind transparent. Karten, Tabellen,
     Dialoge und deren eigene Hintergruende bleiben unveraendert. */
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container > :not(.auth-view) {
    background-color: transparent !important;
    background-image: none !important;
  }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]):not([data-view="admin-users"]) #main-view-container ~ #global-app-footer {
    display: none !important;
  }
  html body.wp-sidebar-collapsed[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn,
  html body.wp-sidebar-collapsed[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn.active {
    justify-content: center !important;
    padding: 0 !important;
    gap: 0 !important;
  }
  html body.wp-sidebar-collapsed[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn > span:not(.messages-nav-badge) { display: none !important; }
  html body.wp-sidebar-collapsed[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn .nav-icon { margin: 0 !important; }
}

@media screen and (max-width: 1450px) {
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header::before { width: min(650px, calc(100% - 510px)) !important; }
}

@media screen and (min-width: 701px) and (max-width: 1100px) {
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn,
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn.active { justify-content: center !important; padding: 0 !important; gap: 0 !important; }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn > span:not(.messages-nav-badge) { display: none !important; }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn .nav-icon { margin: 0 !important; }
}

@media screen and (max-width: 700px) {
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header::before { width: 40% !important; }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-notification { margin-left: 0 !important; }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container { background-size: min(200px, 42vw) auto, cover, cover, cover !important; }
}

/* ========================================================================== 
   HYMOTEQ Globaldesign / Variante 1 (helles Silber, Schwarz, Rot)
   Einheitliche App-Shell fuer alle angemeldeten Fachmodule; Login unveraendert.
   Bestehende Kachel-, Navigations- und Rollenlogik bleibt unangetastet.
   ========================================================================== */
@media screen {

  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container {
    background-color: #f0f2f4 !important;
    background-image: url("../images/hymoteq/hymoteq-start-silver-background.svg") !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-attachment: fixed !important;
  }

  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar.wp-sidebar {
    border-right-color: #cbd0d6 !important;
    background: repeating-linear-gradient(160deg, rgba(70,74,83,.018) 0 1px, transparent 1px 5px),
      linear-gradient(128deg, #fafafb 0%, #eceef2 50%, #fafafb 100%) !important;
    box-shadow: 3px 0 17px rgba(25, 29, 36, .085) !important;
  }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-brand svg {
    color: #b70717 !important;
    stroke: #b70717 !important;
  }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-brand strong { color: #151619 !important; }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn {
    color: #222327 !important;
  }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn:hover {
    background: rgba(170, 29, 43, .065) !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav [data-nav="start"],
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn.active,
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar #wp-sidebar-admin.active {
    border: 1px solid #c60b1b !important;
    background: linear-gradient(105deg,#fafafb,#f1f2f5 55%,#e5e7eb) !important;
    color: #a80716 !important;
    box-shadow: inset 0 1px rgba(255,255,255,.9),0 4px 9px rgba(128,13,27,.13),0 0 0 1px rgba(214,6,20,.10) !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav [data-nav="start"] :is(span,svg),
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-nav .header-btn.active :is(span,svg) {
    color: #aa0a19 !important;
    stroke: currentColor !important;
  }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-sidebar .wp-sidebar-collapse {
    border-top-color: #c7cbd1 !important;
    background: transparent !important;
    color: #626770 !important;
  }

  /* Kopfleiste: eigenstaendige, beliebig skalierbare HYMOTEQ-Metallgrafik. */
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header {
    border-bottom: 2px solid #b30816 !important;
    background: linear-gradient(180deg,#ffffff 0%,#f5f6f8 100%) !important;
    box-shadow: 0 2px 3px rgba(44,13,19,.12),0 5px 14px rgba(128,13,27,.09) !important;
  }
  /* HYMOTEQ-Logo als skalierbares SVG direkt im dunklen Kopfband. */
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .hymoteq-header-wordmark {
    display: block;
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 28px;
    transform: translateY(-50%);
    pointer-events: none;
    user-select: none;
    width: min(225px, 25vw);
    max-width: 225px;
    line-height: 0;
    filter: drop-shadow(0 2px 2px rgba(0,0,0,.78));
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .hymoteq-header-wordmark-img {
    display: block;
    width: 100%;
    height: auto;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header::before {
    content: "" !important;
    display: block !important;
    width: min(930px, 66%) !important;
    background: url("../images/hymoteq/hymoteq-start-header-silver-red.svg") left center / 100% 100% no-repeat !important;
    z-index: -1 !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header .modern-period-group select,
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header #year-active-display {
    border: 1px solid #cbd0d6 !important;
    background: linear-gradient(180deg,#fafafb,#e7e9ed) !important;
    color: #15171a !important;
    box-shadow: inset 0 1px #fff,0 2px 4px rgba(0,0,0,.045) !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header .modern-user-group {
    border: 1px solid #d4d7dc !important;
    background: linear-gradient(145deg,#fafafb,#e9ebef) !important;
    box-shadow: inset 0 1px 0 #fff,0 3px 7px rgba(0,0,0,.055) !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header .modern-notification {
    background: transparent !important;
    color: #25262a !important;
  }

  /* Schmale Titelzeile mit silberner Metalloberflaeche wie im Referenzbild. */
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #global-back-row.global-back-row {
    border-top: 1px solid #fafafb !important;
    border-bottom: 1px solid #b9bec4 !important;
    background: linear-gradient(180deg,#edeff2 0%,#d6d9de 58%,#e5e7eb 100%) !important;
    box-shadow: inset 0 1px #fff,0 2px 8px rgba(64, 58, 64, .09) !important;
  }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #global-back-row #global-view-title {
    color: #111216 !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.7) !important;
  }
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-task-home-board .wp-task-home-head h2,
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #wp-task-home-board .wp-task-home-head small {
    color: #18191d !important;
  }

  /* Beibehaltung der vorhandenen 4x2-Aufteilung, Rollen und Kachel-Icons. */
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel {
    border: 1px solid #9ba0a7 !important;
    border-bottom: 2px solid #64676d !important;
    border-radius: 17px !important;
    background:
      linear-gradient(137deg, transparent 0 58%, rgba(255,255,255,.62) 58.15% 62%, transparent 62.15%),
      repeating-linear-gradient(153deg, rgba(35,38,43,.018) 0 1px, transparent 1px 7px),
      linear-gradient(149deg,#fafafb 0%,#f3f4f6 43%,#e2e4e8 81%,#f6f6f8 100%) !important;
    box-shadow: 0 2px 0 rgba(30,32,38,.28),0 13px 28px rgba(28,30,35,.18),inset 0 1px 0 #fff !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel::before {
    inset: 22px auto 22px 0 !important;
    width: 4px !important;
    background: linear-gradient(180deg,#f03e4a,#e40019 40%,#9d0012) !important;
    box-shadow: 0 0 9px rgba(224,0,31,.19) !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel::after {
    opacity: .32 !important;
    background: linear-gradient(138deg,transparent 0 58%,rgba(255,255,255,.5) 58.1% 62%,transparent 62.1%) !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel:hover {
    border-color: #b01b29 !important;
    box-shadow: 0 3px 0 rgba(80,18,25,.21),0 18px 35px rgba(40,20,27,.19),inset 0 1px #fff !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel-icon {
    border: 1px solid #abb0b7 !important;
    background: radial-gradient(circle at 34% 24%, #fff 0%,#fafafb 35%,#dde0e5 100%) !important;
    color: #202124 !important;
    box-shadow: inset 0 1px #fff,0 5px 11px rgba(0,0,0,.19) !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel-icon svg {
    color: #17181b !important;
    stroke: currentColor !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel-arrow {
    color: #be0a1b !important;
  }
  html body[data-view="start"]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container #start-view .start-kachel-arrow svg {
    color: #be0a1b !important;
    stroke: currentColor !important;
  }
}

@media screen and (max-width: 700px) {
  html body[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) #main-view-container {
    background-position: right center !important;
    background-size: cover !important;
  }
  html body.werkpilot-header-branding[data-view]:not([data-view="login"]):not([data-view="register"]):not([data-view="twofa"]) .modern-app-header::before {
    width: 42% !important;
    background-size: cover !important;
  }
}

@media print {
  #wp-sidebar, #wp-sidebar-open, #wp-sidebar-scrim { display: none !important; }
  html body { padding-left: 0 !important; }
}