/* Windows 11 Desktop shell ? Fluent/Mica look */
:root {
  --w11-accent: #60cdff;
  --w11-desktop-bg: #0b1a33;
  --w11-desktop-bg2: #1a3a5c;
  --w11-taskbar: rgba(32, 32, 32, 0.85);
  --w11-window-bg: #202020;
  --w11-text: #fff;
  --w11-muted: rgba(255, 255, 255, 0.65);
  --w11-stroke: rgba(255, 255, 255, 0.12);
  --w11-titlebar: #1f1f1f;
  --w11-titlebar-focus: #2c2c2c;
  --w11-title-color: rgba(255, 255, 255, 0.92);
  --w11-win-body: #1a1a1a;
  --w11-win-border: rgba(255, 255, 255, 0.08);
  --w11-active-border: #60cdff;
  --w11-highlight: #1a4a6e;
  --w11-highlight-fg: #ffffff;
  --w11-ol-avatar: #c7e0f4;
  --w11-ol-avatar-fg: #004578;
  --w11-scrollbar: #6a7684;
  --w11-scrollbar-track: #141414;
  --w11-scrollbar-thumb-hover: color-mix(in srgb, var(--w11-scrollbar) 70%, #ffffff);
  --w11-radius: 8px;
  --w11-font: "Segoe UI Variable", "Segoe UI", var(--font, system-ui), sans-serif;
}

body.w11-desktop-mode {
  overflow: hidden;
  font-family: var(--w11-font);
}
body.w11-desktop-mode .bg-aurora,
body.w11-desktop-mode .bg-grid {
  display: none !important;
}
.legacy-hidden { display: none !important; }
body.w11-desktop-mode .legacy-chrome,
body.w11-desktop-mode #view-app {
  position: fixed !important;
  left: -10000px !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  display: block !important;
  visibility: hidden !important;
}
#app-host-pool {
  position: fixed;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

#view-desktop {
  position: fixed; inset: 0; z-index: 2;
  display: flex; flex-direction: column;
  color: var(--w11-text);
  background:
    radial-gradient(1200px 700px at 10% -10%, rgba(96, 205, 255, 0.18), transparent 55%),
    radial-gradient(900px 600px at 90% 20%, rgba(0, 103, 192, 0.35), transparent 50%),
    linear-gradient(160deg, var(--w11-desktop-bg), var(--w11-desktop-bg2));
}
#view-desktop[hidden] { display: none !important; }

#desktop-surface {
  position: relative; flex: 1; min-height: 0; overflow: hidden;
}

#desktop-icons { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.desk-icon {
  pointer-events: auto;
  position: absolute; width: 76px;
  border: 0; background: transparent; color: var(--w11-text);
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 8px 4px; border-radius: 4px; cursor: default;
  font-family: var(--w11-font); font-size: 0.72rem;
  z-index: 1;
  touch-action: none;
  user-select: none;
}
.desk-icon:hover, .desk-icon:focus-visible {
  background: rgba(255, 255, 255, 0.12);
  outline: 1px solid rgba(255, 255, 255, 0.25);
}
.desk-icon-img {
  width: 48px; height: 48px;
  display: block;
  object-fit: contain;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  pointer-events: none;
  image-rendering: -webkit-optimize-contrast;
}
.desk-icon-img.desk-icon-fallback {
  display: grid; place-items: center; font-size: 1.35rem;
  border-radius: 4px;
  background: linear-gradient(160deg, #3a7bd5, #00d2ff);
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
}
.desk-icon-label {
  text-align: center; text-shadow: 1px 1px 2px rgba(0,0,0,0.9);
  line-height: 1.2; word-break: break-word;
}

#desktop-widgets { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.desk-widget {
  pointer-events: auto;
  position: absolute;
  border-radius: 12px;
  background: rgba(32, 32, 32, 0.55);
  border: 0;
  backdrop-filter: blur(40px) saturate(160%);
  -webkit-backdrop-filter: blur(40px) saturate(160%);
  box-shadow: none;
  overflow: hidden;
  padding: 12px;
  cursor: grab;
  color: var(--w11-text);
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.desk-widget::-webkit-scrollbar { display: none; width: 0; height: 0; }
.desk-widget:active { cursor: grabbing; }
.desk-widget > [id^="dash-w-"] {
  width: 100%;
  height: 100%;
  overflow: hidden !important;
  max-width: 100%;
  max-height: 100%;
}
.desk-widget-resize {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
  z-index: 5;
  touch-action: none;
}
.desk-widget-resize::after {
  content: "";
  position: absolute;
  right: 3px;
  bottom: 3px;
  width: 8px;
  height: 8px;
  border-right: 2px solid rgba(255,255,255,0.45);
  border-bottom: 2px solid rgba(255,255,255,0.45);
  opacity: 0.7;
}
.desk-widget .card, .desk-widget .kpi, .desk-widget article {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
}
.desk-widget header, .desk-widget .card-h, .desk-widget h3,
.desk-widget .kpi-foot, .desk-widget em, .desk-widget small {
  color: var(--w11-muted) !important;
}
.desk-widget .kpi-value, .desk-widget strong, .desk-widget b {
  color: var(--w11-text) !important;
}

#desktop-windows {
  position: absolute; inset: 0; z-index: 5;
  pointer-events: none;
  isolation: isolate;
}

/* Authentic Win11 window chrome */
.w11-window {
  pointer-events: auto;
  position: absolute;
  display: flex; flex-direction: column;
  border-radius: var(--w11-radius);
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-win-border);
  box-shadow: 0 8px 32px rgba(0,0,0,0.55), 0 0 0 1px rgba(0,0,0,0.4);
  overflow: hidden;
  min-width: 420px; min-height: 280px;
  font-family: var(--w11-font);
  z-index: 1;
}
.w11-window[data-app-id="outlook"] {
  min-width: 680px;
  min-height: 460px;
}
.w11-window[data-app-id^="outlook-compose"] {
  min-width: 520px;
  min-height: 400px;
}
.w11-window.focused {
  border-color: var(--w11-active-border);
  box-shadow: 0 8px 32px rgba(0,0,0,0.55), 0 0 0 1px color-mix(in srgb, var(--w11-active-border) 55%, transparent);
}
.w11-window.minimized { display: none !important; }
.w11-window.maximized {
  border-radius: 0;
  border-color: transparent;
}

/* Bare-Chrome: keine zweite Titelleiste (z. B. RoboTask-Aktionsdialog) */
.w11-window.w11-bare-chrome > .w11-titlebar { display: none !important; }
.w11-window.w11-bare-chrome {
  display: flex; flex-direction: column; overflow: hidden;
}
.w11-window.w11-bare-chrome > .w11-win-body.w11-bare-body,
.w11-window.w11-bare-chrome > .w11-win-body {
  flex: 1; min-height: 0; height: 100%; padding: 0; overflow: hidden;
  display: flex; flex-direction: column;
}
.w11-window.w11-bare-chrome #acc-robotask-action,
.w11-window.w11-bare-chrome .rt-action-shell {
  flex: 1; min-height: 0; height: 100%; overflow: hidden;
}

.w11-titlebar {
  height: 32px; display: flex; align-items: center; gap: 8px;
  padding: 0 0 0 12px;
  background: var(--w11-titlebar);
  user-select: none; cursor: default;
  flex-shrink: 0;
}
.w11-window.focused .w11-titlebar { background: var(--w11-titlebar-focus); }
/* Chrome + Electron: Drag-/Titelbereich f?llt die Leiste (Buttons rechts) */
.w11-titlebar-drag {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  height: 100%;
}
.w11-title-ico { font-size: 0.85rem; opacity: 0.95; width: 16px; height: 16px; text-align: center; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.w11-title-ico img { width: 16px; height: 16px; object-fit: contain; display: block; }
.w11-title {
  flex: 1; font-size: 0.75rem; font-weight: 400;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: var(--w11-title-color);
  min-width: 0;
}
.w11-title-actions {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  margin-right: 2px;
}
.w11-title-act {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 24px;
  padding: 0 8px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-title-color);
  font-size: 0.72rem;
  cursor: pointer;
  max-width: 180px;
}
.w11-title-act:hover {
  background: color-mix(in srgb, var(--w11-title-color) 12%, transparent);
}
.w11-title-act svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.w11-title-act-icon {
  width: 28px;
  max-width: 28px;
  padding: 0;
  justify-content: center;
}
.w11-title-act span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.w11-title-act-warn {
  color: #ff6b6b;
  max-width: 260px;
  font-weight: 600;
}
.w11-title-act-warn:hover {
  background: color-mix(in srgb, #e81123 22%, transparent);
  color: #ff8a8a;
}
.w11-win-btns { display: flex; height: 100%; }
.w11-win-btns button {
  width: 46px; height: 100%; border: 0; background: transparent;
  color: var(--w11-title-color); cursor: pointer; border-radius: 0;
  display: grid; place-items: center;
}
.w11-win-btns button:hover { background: rgba(128,128,128,0.22); }
.w11-win-btns button.close:hover { background: #c42b1c; color: #fff; }

.w11-win-body {
  flex: 1; min-height: 0; overflow: auto;
  background: var(--w11-win-body);
  color: var(--text, var(--w11-text));
  display: flex;
  flex-direction: column;
}
.w11-win-body.w11-term-body { overflow: hidden; }
.w11-win-body .page,
.w11-win-body .acc-body,
.w11-win-body .w11-hosted {
  display: block !important;
  padding: 12px;
  min-height: 100%;
  box-sizing: border-box;
}
/* Terminal fills window like classic console */
.w11-win-body #page-terminal.w11-hosted {
  display: flex !important;
  flex-direction: column;
  flex: 1;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
}
.w11-win-body #page-terminal .terminal-card {
  flex: 1;
  min-height: 0 !important;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  border-radius: 0;
  background: #0c0c0c !important;
  border: 0 !important;
}
.w11-win-body #page-terminal .terminal-toolbar,
.terminal-toolbar,
.term-actions {
  display: none !important;
}
.w11-win-body #page-terminal .terminal-host {
  flex: 1;
  min-height: 0 !important;
  height: auto !important;
  border-radius: 0;
  border: 0;
  padding: 4px;
  background: #0c0c0c;
}
.w11-win-body .glass,
.w11-win-body .acc-card,
.w11-win-body .card {
  background: rgba(255,255,255,0.04) !important;
  border-radius: 8px;
}
.w11-resize {
  position: absolute; right: 0; bottom: 0; width: 14px; height: 14px;
  cursor: se-resize; z-index: 2;
}

.w11-app-pad { padding: 16px; }
.w11-cpanel {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px; padding: 16px;
}
.w11-cpanel-item {
  appearance: none; border: 1px solid transparent; background: transparent;
  color: var(--w11-text); border-radius: 8px; padding: 14px 8px;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  cursor: pointer; font: inherit; font-size: 0.78rem;
}
.w11-cpanel-item:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.1); }
.w11-cpanel-ico { font-size: 1.8rem; }

/* Windows Control Panel ? folgt Personalisierung */
.w11-win-body.w11-cpl-body {
  padding: 0 !important;
  background: var(--w11-win-body) !important;
  overflow: hidden;
  color: var(--w11-text);
}
.cpl {
  height: 100%; min-height: 0;
  display: flex; flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-family: "Segoe UI", var(--w11-font);
  font-size: 0.82rem;
  user-select: none;
}
.cpl-nav {
  display: flex; align-items: center; gap: 8px;
  flex-shrink: 0;
  padding: 6px 8px;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.cpl-nav-btns { display: flex; gap: 2px; flex-shrink: 0; }
.cpl-nav-btn {
  appearance: none; border: 0; background: transparent;
  width: 28px; height: 28px; border-radius: 4px;
  color: var(--w11-muted); display: grid; place-items: center; cursor: default;
}
.cpl-nav-btn:not(:disabled):hover {
  background: color-mix(in srgb, var(--w11-accent) 22%, transparent);
  color: var(--w11-text);
}
.cpl-nav-btn:disabled { opacity: 0.4; }
.cpl-addr {
  flex: 1; min-width: 0;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  height: 28px; padding: 0 10px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 2px;
  font-size: 0.78rem; color: var(--w11-text);
}
.cpl-crumb { white-space: nowrap; color: var(--w11-text); }
.cpl-crumb.current { font-weight: 600; }
.cpl-sep { color: var(--w11-muted); }
.cpl-search-wrap { flex-shrink: 0; width: min(220px, 32%); }
.cpl-search {
  box-sizing: border-box; width: 100%; height: 28px;
  border: 1px solid var(--w11-stroke); border-radius: 2px;
  padding: 0 10px; font: inherit; font-size: 0.78rem;
  background: var(--w11-window-bg); color: var(--w11-text);
  outline: none;
}
.cpl-search:focus { border-color: var(--w11-accent); box-shadow: 0 0 0 1px var(--w11-accent); }
.cpl-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
  padding: 14px 18px 8px;
  flex-shrink: 0;
}
.cpl-title {
  margin: 0; font-size: 1.15rem; font-weight: 400; color: var(--w11-text);
}
.cpl-view {
  display: flex; align-items: center; gap: 6px;
  font-size: 0.78rem; color: var(--w11-muted);
}
.cpl-view select {
  height: 24px; border: 1px solid var(--w11-stroke); border-radius: 2px;
  background: var(--w11-window-bg); color: var(--w11-text); font: inherit; font-size: 0.78rem;
  padding: 0 6px;
}
.cpl-grid {
  flex: 1; min-height: 0; overflow: auto;
  padding: 8px 16px 20px;
  align-content: start;
}
.cpl-grid.view-large {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 6px 10px;
}
.cpl-grid.view-small {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 2px 16px;
}
.cpl-item {
  appearance: none; border: 1px solid transparent; background: transparent;
  color: var(--w11-text); border-radius: 2px; cursor: pointer; font: inherit;
  text-align: center;
}
.cpl-grid.view-large .cpl-item {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 12px 8px 10px;
}
.cpl-grid.view-small .cpl-item {
  display: flex; flex-direction: row; align-items: center; gap: 10px;
  padding: 6px 8px; text-align: left;
}
.cpl-item:hover, .cpl-item:focus-visible {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-win-body));
  border-color: color-mix(in srgb, var(--w11-accent) 35%, var(--w11-stroke));
  outline: none;
}
.cpl-item:active {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-win-body));
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
}
.cpl-ico {
  width: 48px; height: 48px; border-radius: 6px;
  display: grid; place-items: center; font-size: 1.45rem;
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08);
}
.cpl-grid.view-small .cpl-ico {
  width: 28px; height: 28px; font-size: 0.95rem; border-radius: 4px;
}
.cpl-ico.tone-users { background: linear-gradient(160deg, #c9b6f2, #7b5bb8); }
.cpl-ico.tone-vpn { background: linear-gradient(160deg, #9ed0ff, #2f6fbf); }
.cpl-ico.tone-printers { background: linear-gradient(160deg, #d7e8f8, #6e9cc8); }
.cpl-ico.tone-security { background: linear-gradient(160deg, #b8e0c8, #3d8f5f); }
.cpl-ico.tone-cert { background: linear-gradient(160deg, #ffe8a8, #c9a227); }
.cpl-ico.tone-email { background: linear-gradient(160deg, #ffe0a8, #d18b2c); }
.cpl-ico.tone-ai { background: linear-gradient(160deg, #c8f0e8, #2a9d8f); }
.cpl-ico.tone-storage { background: linear-gradient(160deg, #d4c4f0, #6a4ca8); }
.cpl-ico.tone-backup { background: linear-gradient(160deg, #c5d4e8, #4a6d94); }
.cpl-ico.tone-dms { background: linear-gradient(160deg, #f0d4b8, #b87a3d); }
.cpl-ico.tone-pg { background: linear-gradient(160deg, #c8d8f0, #336791); }
.cpl-ico.tone-pgb { background: linear-gradient(160deg, #cfe8f5, #3a7ea8); }
.cpl-ico.tone-winsrv { background: linear-gradient(160deg, #9ec8f0, #0078d4); }
.cpl-ico.tone-api { background: linear-gradient(160deg, #d8e8f8, #3a6ea5); }
.cpl-ico.tone-system { background: linear-gradient(160deg, #d0e4f8, #4a6fa5); }
.cpl-ico.tone-robotask { background: linear-gradient(160deg, #c8e6c0, #3d7a4a); }
.cpl-ico.tone-theme { background: linear-gradient(160deg, #ffd0e0, #e07a9a); }
.cpl-ico.tone-tel { background: linear-gradient(160deg, #b8f0d8, #1a9a6a); }
.cpl-ico.tone-mssql { background: linear-gradient(160deg, #c5d4e8, #4a6d94); }
.cpl-ico.tone-web { background: linear-gradient(160deg, #b8e0ff, #2f6fbf); }
.cpl-ico.tone-wz { background: linear-gradient(160deg, #ffe0a0, #c9a227); }
.cpl-label {
  font-size: 0.78rem; line-height: 1.25; color: var(--w11-text);
  max-width: 100%; word-break: break-word;
}
.cpl-grid.view-small .cpl-label { font-size: 0.8rem; }

.w11-theme-form {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.w11-theme-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 16px 18px 12px;
}
.w11-theme-h {
  margin: 0 0 6px;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--w11-text);
}
.w11-theme-hint {
  margin: 0 0 12px;
  font-size: 0.78rem;
  color: var(--w11-muted);
  line-height: 1.4;
}
.w11-theme-presets {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
  margin: 0 0 20px;
}
.w11-theme-preset {
  appearance: none;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  background: var(--w11-window-bg);
  text-align: left;
  font: inherit;
  color: var(--w11-text);
}
.w11-theme-preset:hover { border-color: var(--w11-accent); }
.w11-theme-preset.selected {
  border-color: var(--w11-accent);
  box-shadow: 0 0 0 1px var(--w11-accent);
}
.w11-theme-swatch {
  display: block; height: 48px; width: 100%;
  background: linear-gradient(135deg, var(--sw1), var(--sw2));
}
.w11-theme-preset span {
  display: block; padding: 6px 8px; font-size: 0.78rem;
}
.w11-theme-colors {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 560px;
}
.w11-theme-row {
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 4px 6px 6px;
}
.w11-theme-row:hover {
  background: color-mix(in srgb, var(--w11-text) 6%, transparent);
}
.w11-theme-row-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 40px;
}
.w11-theme-row-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.w11-theme-row-title {
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--w11-text);
}
.w11-theme-row-hint {
  font-size: 0.72rem;
  color: var(--w11-muted);
}
.w11-theme-color-preview {
  width: 40px;
  height: 28px;
  border-radius: 4px;
  border: 1px solid var(--w11-stroke);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  appearance: none;
}
.w11-theme-color-preview:hover {
  outline: 2px solid var(--w11-accent);
  outline-offset: 1px;
}
.w11-theme-picker {
  margin: 8px 0 4px;
  padding: 10px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--w11-window-bg) 88%, var(--w11-text));
  border: 1px solid var(--w11-stroke);
}
.w11-theme-picker-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted);
  margin-bottom: 8px;
}
.w11-theme-std-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 4px;
}
.w11-theme-std-swatch {
  width: 100%;
  aspect-ratio: 1;
  min-height: 22px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  cursor: pointer;
  padding: 0;
  appearance: none;
}
.w11-theme-std-swatch:hover {
  outline: 2px solid var(--w11-accent);
  outline-offset: 0;
}
.w11-theme-more-btn {
  margin-top: 10px;
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--w11-accent);
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
  padding: 4px 0;
  text-align: left;
}
.w11-theme-more-btn:hover { text-decoration: underline; }
.w11-theme-full {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--w11-stroke);
}
.w11-theme-full-lab {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.8rem;
  color: var(--w11-text);
}
.w11-theme-full-lab input[type="color"] {
  width: 56px;
  height: 32px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  cursor: pointer;
  border-radius: 4px;
}
.w11-theme-footer {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 10px 16px;
  border-top: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.w11-btn {
  appearance: none; border: 1px solid var(--w11-stroke); background: color-mix(in srgb, var(--w11-window-bg) 90%, var(--w11-text));
  color: var(--w11-text); border-radius: 4px; padding: 8px 16px; cursor: pointer; font: inherit; font-size: 0.82rem;
}
.w11-btn:hover { filter: brightness(1.08); }
.w11-btn.primary { background: var(--w11-accent); color: #052033; border-color: transparent; font-weight: 600; }
.w11-btn.primary:hover { filter: brightness(1.05); }
.w11-check {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 4px; color: var(--w11-text); font-size: 0.88rem;
}

/* Taskbar ? centered like Win11 */
#taskbar {
  --tb-height: 48px;
  --tb-btn: 40px;
  height: var(--tb-height); flex-shrink: 0; z-index: 20;
  display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 10px;
  background: var(--w11-taskbar);
  backdrop-filter: blur(40px) saturate(180%);
  -webkit-backdrop-filter: blur(40px) saturate(180%);
  border-top: 1px solid rgba(255,255,255,0.08);
}
#taskbar.tb-align-left {
  grid-template-columns: auto 1fr auto;
}
#taskbar.tb-align-left .taskbar-center {
  justify-content: flex-start;
}
.taskbar-left { min-width: 0; }
.taskbar-center {
  display: flex; align-items: center; justify-content: center; gap: 4px;
}
.taskbar-right { display: flex; justify-content: flex-end; align-items: center; gap: 2px; }
.tb-tray-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.tb-tray-wrap[hidden] { display: none !important; }
.tb-tray-btn {
  position: relative;
  width: var(--tb-btn);
  height: var(--tb-btn);
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.tb-tray-btn:hover,
.tb-tray-wrap.open .tb-tray-btn { background: rgba(255,255,255,0.1); }
.tb-tray-ico { display: block; opacity: 0.92; }
.tb-tray-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 15px;
  height: 15px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--w11-accent, #0078d4);
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  line-height: 15px;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-taskbar, #202020) 70%, transparent);
}
.tb-tray-badge[hidden] { display: none !important; }
.tb-app-errors {
  display: flex;
  align-items: center;
  gap: 2px;
  min-height: 32px;
}
.tb-app-errors:empty { display: none; }
.tb-err-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #fff;
  cursor: pointer;
}
.tb-err-btn:hover { background: rgba(255,255,255,0.1); }
.tb-err-btn .tb-err-ico {
  width: 18px;
  height: 18px;
  display: block;
  object-fit: contain;
}
.tb-err-btn .tb-err-fallback {
  font-size: 14px;
  line-height: 1;
}
.tb-err-bang {
  position: absolute;
  right: 1px;
  bottom: 1px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #e81123;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 14px;
  text-align: center;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.35);
  animation: tb-err-blink 0.85s ease-in-out infinite;
  pointer-events: none;
}
@keyframes tb-err-blink {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(1.12); }
}
.tb-print-pop {
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  width: min(320px, calc(100vw - 24px));
  max-height: min(360px, 50vh);
  display: flex;
  flex-direction: column;
  z-index: 80;
  border-radius: 8px;
  background: color-mix(in srgb, var(--w11-window-bg) 94%, transparent);
  color: var(--w11-text);
  border: 1px solid var(--w11-win-border);
  box-shadow: 0 12px 40px rgba(0,0,0,0.35);
  backdrop-filter: blur(40px) saturate(160%);
  -webkit-backdrop-filter: blur(40px) saturate(160%);
  overflow: hidden;
}
.tb-print-pop[hidden] { display: none !important; }
.tb-print-pop-head {
  padding: 10px 12px 8px;
  font-size: 0.78rem;
  font-weight: 600;
  border-bottom: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
}
.tb-print-pop-list {
  list-style: none;
  margin: 0;
  padding: 4px 0;
  overflow: auto;
  flex: 1;
}
.tb-print-pop-list li {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 8px;
  align-items: start;
  padding: 8px 12px;
  font-size: 0.75rem;
  line-height: 1.25;
}
.tb-print-pop-list li:hover {
  background: color-mix(in srgb, var(--w11-accent) 14%, transparent);
}
.tb-print-pop-list .tb-print-ico {
  width: 16px;
  height: 16px;
  margin-top: 1px;
  opacity: 0.85;
}
.tb-print-pop-list .tb-print-name {
  font-weight: 600;
  word-break: break-word;
}
.tb-print-pop-list .tb-print-meta {
  color: var(--w11-muted);
  font-size: 0.68rem;
  margin-top: 2px;
}
.tb-print-pop-empty {
  padding: 16px 12px;
  text-align: center;
  color: var(--w11-muted);
  font-size: 0.75rem;
}
#btn-start {
  width: var(--tb-btn); height: var(--tb-btn); border-radius: 4px; border: 0;
  background: transparent; color: var(--w11-text); cursor: pointer;
  display: grid; place-items: center;
}
#btn-start:hover, #btn-start.open { background: rgba(255,255,255,0.08); }
#btn-start .win-logo { display: block; }
#taskbar-apps { display: flex; gap: 4px; align-items: center; }
.task-btn {
  width: var(--tb-btn); height: var(--tb-btn); border-radius: 4px;
  border: 0; background: transparent; color: var(--w11-text);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  position: relative; padding: 0 6px; max-width: 180px;
}
#taskbar.tb-labels .task-btn { width: auto; min-width: var(--tb-btn); padding: 0 10px; }
.task-btn:hover, .task-btn.active { background: rgba(255,255,255,0.1); }
.task-btn.active::after {
  content: "";
  position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%);
  width: 12px; height: 3px; border-radius: 2px;
  background: var(--w11-accent);
}
.task-btn.min { opacity: 0.75; }
.task-btn.attention {
  animation: tb-blink 1s ease-in-out infinite;
}
@keyframes tb-blink {
  0%, 100% { background: rgba(255,255,255,0.05); }
  50% { background: color-mix(in srgb, var(--w11-accent) 45%, transparent); }
}
.task-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--w11-accent, #0078d4);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-taskbar, #202020) 70%, transparent);
}
.task-ico { font-size: 1rem; flex-shrink: 0; width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; }
.task-ico img { width: 18px; height: 18px; object-fit: contain; display: block; }
.task-label {
  font-size: 0.72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 110px;
}
#taskbar-clock {
  text-align: right; padding: 4px 10px; border-radius: 4px;
  line-height: 1.15; font-size: 0.72rem; cursor: default;
}
#taskbar-clock:hover { background: rgba(255,255,255,0.08); }
#taskbar-clock span { display: block; font-weight: 500; }
#taskbar-clock small { color: var(--w11-muted); }

/* Start menu ? folgt Personalisierung */
#start-menu, .start-menu {
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  z-index: 30;
  width: min(640px, calc(100vw - 24px));
  max-height: min(720px, calc(100% - 24px));
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  background: color-mix(in srgb, var(--w11-window-bg) 92%, transparent);
  color: var(--w11-text);
  border: 1px solid var(--w11-win-border);
  backdrop-filter: blur(60px) saturate(180%);
  -webkit-backdrop-filter: blur(60px) saturate(180%);
  box-shadow: 0 25px 80px rgba(0,0,0,0.55);
  padding: 20px 20px 0;
  overflow: hidden;
}
#start-menu.start-align-left {
  left: 12px;
  transform: none;
}
#start-menu[hidden] { display: none !important; }

.start-search-wrap {
  position: relative;
  margin-bottom: 16px;
}
.start-search-ico {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  opacity: 0.55; pointer-events: none;
}
#start-search {
  width: 100%; box-sizing: border-box;
  height: 40px; border-radius: 20px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.35);
  color: var(--w11-text);
  padding: 0 16px 0 40px;
  font: inherit; font-size: 0.9rem;
  outline: none;
}
#start-search:focus {
  border-color: var(--w11-accent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-accent) 40%, transparent);
}

.start-section { margin-bottom: 8px; min-height: 0; }
.start-section-h {
  display: flex; justify-content: space-between; align-items: center;
  padding: 4px 8px 10px;
  font-size: 0.82rem; font-weight: 600;
}
.start-pinned {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
  max-height: 280px;
  overflow: auto;
  padding-bottom: 8px;
}
.start-tile {
  appearance: none; border: 0; background: transparent;
  color: var(--w11-text); border-radius: 8px;
  padding: 12px 6px; cursor: pointer; font: inherit; font-size: 0.72rem;
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  text-align: center;
}
.start-tile:hover { background: rgba(255,255,255,0.08); }
.start-tile-ico {
  width: 40px; height: 40px; border-radius: 4px;
  display: grid; place-items: center; font-size: 1.15rem;
  background: transparent;
  overflow: hidden;
}
.start-tile-ico img {
  width: 40px; height: 40px; object-fit: contain; display: block;
}
.start-tile-ico.start-tile-fallback {
  background: linear-gradient(145deg, #3a7bd5, #00a4ef);
  border-radius: 8px;
}

.start-recommended {
  display: flex; flex-direction: column; gap: 2px;
  max-height: 160px; overflow: auto;
  padding-bottom: 8px;
}
.start-rec {
  appearance: none; border: 0; background: transparent;
  color: var(--w11-text); border-radius: 8px;
  padding: 10px 12px; cursor: pointer; font: inherit;
  display: flex; align-items: center; gap: 12px; text-align: left;
}
.start-rec:hover { background: rgba(255,255,255,0.08); }
.start-rec strong { display: block; font-size: 0.85rem; font-weight: 500; }
.start-rec small { color: var(--w11-muted); font-size: 0.72rem; }

.start-powerbar {
  display: flex; align-items: center; justify-content: space-between;
  margin: 8px -20px 0;
  padding: 10px 20px;
  background: rgba(0,0,0,0.28);
  border-top: 1px solid rgba(255,255,255,0.08);
}
.start-user {
  display: flex; align-items: center; gap: 12px;
  padding: 0; border: 0; margin: 0;
}
.start-user .avatar {
  width: 36px; height: 36px; border-radius: 50%;
  display: grid; place-items: center; font-weight: 700; font-size: 0.9rem;
  background: linear-gradient(145deg, var(--w11-accent), #0078d4);
  color: #042033;
}
.start-user strong { display: block; font-size: 0.85rem; }
.start-user small { color: var(--w11-muted); font-size: 0.72rem; }
.start-power-actions {
  display: flex;
  align-items: center;
  gap: 4px;
}
.start-power {
  width: 40px; height: 40px; border: 0; border-radius: 8px;
  background: transparent; color: var(--w11-text);
  font-size: 1.1rem; cursor: pointer;
}
.start-power:hover { background: rgba(255,255,255,0.1); }
.start-power[hidden] { display: none !important; }
#btn-start-reboot:hover { background: color-mix(in srgb, #c42b1c 35%, transparent); }

/* Context menu ? folgt Personalisierung */
.w11-ctx,
.ctx-menu {
  position: fixed; z-index: 10050;
  min-width: 200px; max-width: 280px;
  padding: 4px;
  border-radius: 4px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-win-border);
  backdrop-filter: none;
  box-shadow: 0 8px 24px rgba(0,0,0,0.28);
  color: var(--w11-text);
  font-family: "Segoe UI", var(--w11-font);
  display: flex; flex-direction: column; gap: 0;
}
.ol-simple-ctx {
  max-width: min(420px, 92vw);
  max-height: min(70vh, 480px);
  overflow-x: hidden;
  overflow-y: auto;
}
.ol-zip-menu .ol-zip-entry {
  justify-content: space-between;
}
.ol-zip-menu .ol-zip-entry.is-open {
  background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)) !important;
}
.ol-zip-size {
  color: var(--w11-muted);
  font-weight: 400;
}
.ol-zip-flyout {
  position: fixed;
  z-index: 10060;
  min-width: 180px;
  max-width: 260px;
}
.w11-ctx[hidden],
.ctx-menu[hidden] { display: none !important; }
.ctx-menu .ctx-label,
.w11-ctx .ctx-label {
  padding: 6px 12px 2px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted);
  pointer-events: none;
}
.w11-ctx-item,
.w11-ctx button,
.ctx-menu button,
#bak-ctx button,
#stor-ctx button {
  width: 100%; display: flex; align-items: center; gap: 10px;
  border: 0 !important; background: transparent !important; color: inherit;
  padding: 7px 12px; border-radius: 3px;
  cursor: pointer; font: inherit; font-size: 0.8rem; text-align: left;
  appearance: none; box-shadow: none !important;
  min-width: 0 !important; height: auto !important;
  justify-content: flex-start;
}
.w11-ctx-item:hover:not(.disabled),
.w11-ctx button:hover:not(:disabled):not(.disabled),
.ctx-menu button:hover,
#bak-ctx button:hover,
#stor-ctx button:hover {
  background: color-mix(in srgb, var(--w11-accent) 28%, transparent) !important;
  color: var(--w11-text) !important;
}
.w11-ctx-item.disabled,
.w11-ctx button:disabled,
.w11-ctx button.disabled { opacity: 0.4; cursor: default; }

/* E-Mail-Adresse im Lesebereich: Aktionsmen? */
.ol-mail-addr-menu {
  min-width: 272px;
  max-width: min(360px, calc(100vw - 16px));
  padding: 6px;
  border-radius: 10px;
  z-index: 10060 !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--w11-accent) 18%, var(--w11-win-border)),
    0 12px 36px color-mix(in srgb, #000 28%, transparent),
    0 2px 8px color-mix(in srgb, #000 12%, transparent);
  animation: ol-mail-addr-pop 0.16s cubic-bezier(0.2, 0.9, 0.3, 1);
}
@keyframes ol-mail-addr-pop {
  from { opacity: 0; transform: translateY(-6px) scale(0.97); }
  to { opacity: 1; transform: none; }
}
.ol-mail-addr-menu-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  margin: 2px 2px 4px;
  border-radius: 8px;
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg)),
      color-mix(in srgb, var(--w11-accent) 6%, var(--w11-titlebar, var(--w11-window-bg)))
    );
  border: 1px solid color-mix(in srgb, var(--w11-accent) 22%, var(--w11-stroke));
}
.ol-mail-addr-menu-badge {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(160deg, var(--w11-accent), color-mix(in srgb, var(--w11-accent) 70%, #000));
  box-shadow: 0 4px 12px color-mix(in srgb, var(--w11-accent) 35%, transparent);
}
.ol-mail-addr-menu-badge svg { width: 16px; height: 16px; display: block; }
.ol-mail-addr-menu-email {
  min-width: 0;
  flex: 1;
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--w11-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}
.ol-mail-addr-menu .w11-ctx-sep {
  margin: 2px 6px 4px;
  border: 0;
  border-top: 1px solid var(--w11-stroke);
  height: 0;
}
.ol-mail-addr-act {
  align-items: center !important;
  gap: 10px !important;
  padding: 7px 10px !important;
  border-radius: 7px !important;
  white-space: nowrap;
}
.ol-mail-addr-act-ico {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.ol-mail-addr-act-ico svg { width: 14px; height: 14px; display: block; }
.ol-mail-addr-act em {
  font-style: normal;
  font-weight: 600;
  font-size: 0.84rem;
  color: var(--w11-text);
  white-space: nowrap;
}
.ol-mail-addr-act:hover .ol-mail-addr-act-ico,
.ol-mail-addr-act:focus-visible .ol-mail-addr-act-ico {
  color: #fff;
  background: var(--w11-accent);
}
.ol-mail-addr-act:hover,
.ol-mail-addr-act:focus-visible {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)) !important;
}
.w11-ctx-item em { flex: 1; font-style: normal; }
.w11-ctx-item > span { width: 18px; text-align: center; opacity: 0.85; }
.w11-ctx-check { width: 16px; text-align: center; color: var(--w11-accent); font-style: normal; }
.w11-ctx-item.danger,
.w11-ctx button.danger,
.ctx-menu button.danger,
#bak-ctx button.danger,
#stor-ctx button.danger { color: #c42b1c !important; }
.w11-ctx-item.danger:hover:not(.disabled),
.w11-ctx button.danger:hover,
.ctx-menu button.danger:hover,
#bak-ctx button.danger:hover,
#stor-ctx button.danger:hover { background: color-mix(in srgb, #c42b1c 18%, transparent) !important; color: #c42b1c !important; }
.w11-ctx-sep,
.w11-ctx hr,
.ctx-menu hr,
#bak-ctx hr,
#stor-ctx hr {
  display: block; width: auto;
  height: 1px; margin: 4px 8px;
  border: 0; border-top: 1px solid var(--w11-stroke); background: transparent;
}
.w11-ctx-subwrap {
  position: relative;
}
.w11-ctx-parent {
  width: 100%;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.w11-ctx-parent-label { flex: 1; text-align: left; }
.w11-ctx-chev {
  opacity: 0.7;
  font-size: 1rem;
  line-height: 1;
  margin-left: auto;
}
.w11-ctx-subwrap.open > .w11-ctx-parent,
.w11-ctx-parent:hover {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 26%, var(--w11-window-bg, #f2f2f2)) !important;
  color: var(--w11-text, #1a1a1a) !important;
}
.w11-ctx-flyout {
  position: fixed;
  z-index: 10060;
  min-width: 200px;
  max-width: 280px;
  max-height: min(420px, calc(100vh - 16px));
  overflow: auto;
  padding: 4px;
  border-radius: 4px;
  background: var(--w11-window-bg, #f2f2f2);
  border: 1px solid var(--w11-stroke, #c6c6c6);
  box-shadow: 0 8px 24px color-mix(in srgb, #000 28%, transparent);
  color: var(--w11-text, #1a1a1a);
  display: flex;
  flex-direction: column;
  gap: 0;
  font-family: "Segoe UI", var(--w11-font);
}
.ol-paste-flyout {
  min-width: 220px;
}
.ol-paste-flyout button {
  justify-content: space-between;
  gap: 20px;
}
.ol-paste-flyout kbd {
  margin-left: auto;
  font: inherit;
  font-size: 0.72rem;
  color: var(--w11-muted, #605e5c);
}
.ol-paste-sub > .w11-ctx-parent kbd {
  margin-left: 8px;
}
.w11-ctx-flyout.w11-ctx-sender-flyout {
  width: 320px;
  min-width: 300px;
  max-width: min(360px, calc(100vw - 24px));
  max-height: min(480px, calc(100vh - 16px));
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.w11-ctx-sender-search {
  flex: 0 0 auto;
  align-self: stretch;
  position: relative;
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 6px 6px 4px;
  border-bottom: 1px solid var(--w11-stroke, #c6c6c6);
  background: color-mix(in srgb, var(--w11-titlebar, #eee) 70%, var(--w11-window-bg, #f2f2f2));
}
.w11-ctx .w11-ctx-sender-search .w11-ctx-sender-q,
.w11-ctx-sender-q {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  height: 30px !important;
  margin: 0 !important;
  border: 1px solid var(--w11-stroke, #c6c6c6) !important;
  border-radius: 3px !important;
  padding: 0 34px 0 8px !important;
  font: inherit !important;
  font-size: 0.8rem !important;
  line-height: 30px !important;
  color: var(--w11-text, #1a1a1a) !important;
  background: var(--w11-win-body, #fff) !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.w11-ctx .w11-ctx-sender-search .w11-ctx-sender-q:focus,
.w11-ctx-sender-q:focus {
  outline: 2px solid color-mix(in srgb, var(--w11-accent, #0078d4) 55%, transparent);
  outline-offset: 0;
}
/* Muss .w11-ctx button { width:100% } schlagen – sonst wird das Suchfeld zerquetscht */
.w11-ctx .w11-ctx-sender-search .w11-ctx-sender-add,
.w11-ctx-sender-add {
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  left: auto !important;
  transform: translateY(-50%) !important;
  width: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 3px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  font: inherit !important;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  color: var(--w11-muted, #605e5c) !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.w11-ctx .w11-ctx-sender-search .w11-ctx-sender-add:hover,
.w11-ctx-sender-add:hover {
  color: var(--w11-accent, #0078d4) !important;
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 14%, transparent) !important;
}
.w11-ctx-sender-list {
  flex: 1 1 auto;
  overflow: auto;
  padding: 4px;
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-height: 80px;
}
.w11-ctx-sender-item {
  width: 100%;
  display: flex !important;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  border: 0 !important;
  background: transparent !important;
  color: inherit;
  padding: 7px 10px !important;
  border-radius: 3px;
  cursor: pointer;
  font: inherit;
  font-size: 0.8rem;
  text-align: left;
}
.w11-ctx-sender-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.w11-ctx-sender-main strong {
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.w11-ctx-sender-main small {
  color: var(--w11-muted, #666);
  font-size: 0.72rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.w11-ctx-sender-pct {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  font-size: 0.75rem;
  color: var(--w11-muted, #555);
  padding-top: 1px;
}
.ol-move-pct-zero {
  opacity: 0.45;
}
.w11-ctx-sender-item.ol-move-suggest-top {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 14%, transparent) !important;
}
.w11-ctx-sender-item.ol-move-suggest-top .w11-ctx-sender-main small {
  color: var(--w11-accent, #0078d4);
  font-size: 0.68rem;
  font-weight: 600;
}
.w11-ctx-sender-pct.is-top {
  color: var(--w11-accent, #0078d4);
  font-weight: 700;
}
.ol-move-smart-flyout {
  min-width: 280px;
  max-width: min(360px, calc(100vw - 24px));
}
.w11-ctx-sender-item:hover .w11-ctx-sender-main small,
.w11-ctx-sender-item:hover .w11-ctx-sender-pct,
.w11-ctx-sender-item.cat-on .w11-ctx-sender-main small,
.w11-ctx-sender-item.cat-on .w11-ctx-sender-pct {
  color: inherit;
  opacity: 0.9;
}
.w11-ctx-sender-empty {
  padding: 12px 10px;
  font-size: 0.78rem;
  color: var(--w11-muted, #666);
}
.w11-ctx-flyout[hidden] { display: none !important; }
.w11-ctx-flyout button {
  width: 100%; display: flex; align-items: center; gap: 10px;
  border: 0 !important; background: transparent !important; color: inherit;
  padding: 7px 12px; border-radius: 3px;
  cursor: pointer; font: inherit; font-size: 0.8rem; text-align: left;
}
.w11-ctx-flyout button:hover:not(:disabled) {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 26%, var(--w11-window-bg, #f2f2f2)) !important;
  color: var(--w11-text, #1a1a1a) !important;
}
.w11-ctx-flyout button.danger { color: #c42b1c !important; }
.w11-ctx-flyout button.cat-on {
  font-weight: 600;
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent, #0078d4)) 32%, var(--w11-window-bg, #f2f2f2)) !important;
  color: var(--w11-text, #1a1a1a) !important;
}
.w11-ctx-flyout button:disabled { opacity: 0.45; cursor: default; }
.ol-ctx-cat {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.ol-ctx-cat .ol-cat-dot { width: 10px; height: 10px; flex-shrink: 0; border-radius: 50%; }
.w11-ctx button .w11-ctx-check,
.w11-ctx-flyout .w11-ctx-check {
  margin-left: auto;
  color: #0078d4;
  font-style: normal;
  width: auto;
}

/* Outlook context menu ? dark mode */
.w11-ctx.w11-ctx-dark,
.w11-ctx-dark.w11-ctx-flyout,
.w11-ctx.w11-ctx-dark .w11-ctx-flyout {
  background: #2b2b2b;
  border-color: #3f3f46;
  color: #f3f2f1;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
}
.w11-ctx.w11-ctx-dark hr,
.w11-ctx.w11-ctx-dark .w11-ctx-flyout hr {
  border-top-color: #3f3f46;
}
.w11-ctx.w11-ctx-dark button:hover:not(:disabled),
.w11-ctx.w11-ctx-dark .w11-ctx-flyout button:hover:not(:disabled),
.w11-ctx.w11-ctx-dark .w11-ctx-subwrap.open > .w11-ctx-parent,
.w11-ctx.w11-ctx-dark .w11-ctx-parent:hover {
  background: #3a3a3c !important;
  color: #f3f2f1 !important;
}
.w11-ctx.w11-ctx-dark button.cat-on,
.w11-ctx.w11-ctx-dark .w11-ctx-flyout button.cat-on {
  background: #0c4a6e !important;
  color: #9dc3e6 !important;
}
.w11-ctx.w11-ctx-dark button.danger,
.w11-ctx.w11-ctx-dark .w11-ctx-flyout button.danger {
  color: #f1707b !important;
}
.w11-ctx.w11-ctx-dark button.danger:hover,
.w11-ctx.w11-ctx-dark .w11-ctx-flyout button.danger:hover {
  background: #4a1c1f !important;
  color: #f1707b !important;
}
.w11-ctx.w11-ctx-dark .w11-ctx-check,
.w11-ctx.w11-ctx-dark .w11-ctx-flyout .w11-ctx-check {
  color: #4cc2ff;
}
.w11-ctx.w11-ctx-dark .w11-ctx-chev {
  color: #a19f9d;
}

/* Outlook category dialogs (Windows style) */
.ol-cat-dlg-host {
  height: 100%;
  min-height: 0;
}
.ol-cat-dlg {
  height: 100%;
}
.ol-cat-dlg-pad {
  padding: 16px 18px 8px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: hidden !important;
  flex: 1;
  min-height: 0;
}
.ol-cat-dlg .dlg-form {
  overflow: hidden;
}
.ol-cat-dlg-host,
.ol-cat-dlg {
  height: 100%;
  overflow: hidden;
}
.ol-cat-dlg-hint {
  margin: 0;
  font-size: 0.82rem;
  color: #605e5c;
  line-height: 1.4;
}
.ol-cat-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.82rem;
}
.ol-cat-field > span {
  font-weight: 600;
  color: #323130;
}
.ol-cat-field input[type="text"] {
  height: 30px;
  border: 1px solid #8a8886;
  border-radius: 2px;
  padding: 4px 8px;
  font: inherit;
  background: #fff;
  color: #201f1e;
}
.ol-cat-field input[type="text"]:focus {
  outline: 1px solid #005a9e;
  border-color: #005a9e;
}
.ol-cat-swatch-grid {
  display: grid;
  grid-template-columns: repeat(5, 28px);
  gap: 8px;
  padding: 4px 0;
}
.ol-cat-swatch-btn {
  width: 28px;
  height: 28px;
  border-radius: 2px;
  border: 1px solid rgba(0, 0, 0, 0.25);
  background: var(--sw, #9a9a9a);
  cursor: pointer;
  padding: 0;
  appearance: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
  position: relative;
}
.ol-cat-swatch-btn:hover {
  outline: 1px solid #605e5c;
  outline-offset: 1px;
}
.ol-cat-swatch-btn.selected {
  outline: 2px solid #0078d4;
  outline-offset: 1px;
  box-shadow: 0 0 0 1px #fff, 0 0 0 3px #0078d4;
}
.ol-cat-swatch-btn.used::after {
  content: "";
  position: absolute;
  left: 2px;
  right: 2px;
  top: 50%;
  height: 2px;
  background: rgba(0, 0, 0, 0.72);
  transform: rotate(-45deg);
  pointer-events: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-swatch-btn.used::after {
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.45);
}
.ol-cat-color-name {
  font-size: 0.78rem;
  color: #605e5c;
  min-height: 1.1em;
}
.ol-cat-del-list {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: hidden;
  border: 1px solid #d2d0ce;
  border-radius: 2px;
  background: #fff;
}
.ol-cat-del-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  cursor: pointer;
  border-bottom: 1px solid #f3f2f1;
  margin: 0;
  font-size: 0.84rem;
}
.ol-cat-del-row:last-child { border-bottom: 0; }
.ol-cat-del-row:hover { background: #f3f2f1; }
.ol-cat-del-row.selected { background: #deecf9; }
.ol-cat-del-row input { margin: 0; }
.ol-cat-del-name { flex: 1; min-width: 0; }

.ol-cat-dlg.ol-dark,
.ol-cat-dlg-host.ol-dark .ol-cat-dlg,
.w11-window:has(.ol-cat-dlg.ol-dark) .w11-win-body {
  background: #1f1f1f;
  color: #f3f2f1;
}
.ol-cat-dlg.ol-dark .ol-cat-dlg-hint,
.ol-cat-dlg.ol-dark .ol-cat-color-name {
  color: #a19f9d;
}
.ol-cat-dlg.ol-dark .ol-cat-field > span {
  color: #f3f2f1;
}
.ol-cat-dlg.ol-dark .ol-cat-field input[type="text"] {
  background: #2b2b2b;
  border-color: #5a5a5a;
  color: #f3f2f1;
}
.ol-cat-dlg.ol-dark .ol-cat-field input[type="text"]:focus {
  outline-color: #4cc2ff;
  border-color: #4cc2ff;
}
.ol-cat-dlg.ol-dark .ol-cat-swatch-btn.selected {
  outline-color: #4cc2ff;
  box-shadow: 0 0 0 1px #1f1f1f, 0 0 0 3px #4cc2ff;
}
.ol-cat-dlg.ol-dark .ol-cat-del-list {
  background: #252526;
  border-color: #3f3f46;
}
.ol-cat-dlg.ol-dark .ol-cat-del-row {
  border-bottom-color: #3f3f46;
}
.ol-cat-dlg.ol-dark .ol-cat-del-row:hover { background: #2d2d30; }
.ol-cat-dlg.ol-dark .ol-cat-del-row.selected { background: #0c4a6e; }
.ol-cat-dlg.ol-dark .win-sheet-footer {
  background: #252526;
  border-top-color: #3f3f46;
}
.ol-cat-dlg.ol-dark .win-sheet-btn {
  background: #2b2b2b;
  border-color: #5a5a5a;
  color: #f3f2f1;
}
.ol-cat-dlg.ol-dark .win-sheet-btn:hover {
  background: #3a3a3c;
}
.ol-cat-dlg.ol-dark .win-sheet-btn.primary {
  background: #0078d4;
  border-color: #0078d4;
  color: #fff;
}
.ol-cat-dlg.ol-dark .win-sheet-btn.danger {
  background: #c42b1c;
  border-color: #c42b1c;
  color: #fff;
}
.ol-cat-dlg.ol-dark .form-error { color: #f1707b; }

/* Dark titlebar when category dialog is dark */
.w11-window:has(.ol-cat-dlg.ol-dark) .w11-titlebar {
  background: #2b2b2b !important;
  color: #f3f2f1 !important;
  border-bottom: 1px solid #3f3f46;
}
.w11-window:has(.ol-cat-dlg.ol-dark) .w11-title {
  color: #f3f2f1 !important;
}
.ol-host.ol-dark .ol-msg-cats-rail .ol-cat-dot {
  border-color: rgba(255, 255, 255, 0.25);
}

/* Desktop properties ? classic Windows sheet */
/* (legacy desk-props modal removed ? now desktop window) */
.desk-props-sheet { width: min(420px, 94vw); }
.desk-props-widgets {
  display: grid;
  gap: 2px;
  margin-top: 8px;
  overflow: visible;
  max-height: none;
}
#acc-desk-props .win-sheet-content {
  overflow: hidden;
}
#acc-desk-props .desk-props-widgets .w11-check {
  padding: 6px 8px;
  border-radius: 4px;
}
#acc-desk-props .desk-props-widgets .w11-check:hover {
  background: #f5f5f5;
}

/* Win11 login */
.login-view.w11-login {
  background:
    radial-gradient(1000px 600px at 20% 0%, rgba(96,205,255,0.2), transparent 55%),
    linear-gradient(160deg, #0a1628, #163a5f);
}
.login-view.w11-login .login-shell {
  background: rgba(32, 32, 32, 0.72);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 16px;
  backdrop-filter: blur(40px);
}
.login-view.w11-login .login-orbit { opacity: 0.5; }

/* Windows 11 sign-in screen */
body.w11-signin-mode {
  overflow: hidden;
  font-family: var(--w11-font);
}
body.w11-signin-mode .bg-aurora,
body.w11-signin-mode .bg-grid {
  display: none !important;
}
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.login-view.w11-signin {
  position: fixed; inset: 0; z-index: 40;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 0; margin: 0; overflow: hidden;
  background: #000;
  font-family: var(--w11-font);
  color: #fff;
  user-select: none;
}
.w11-signin-bg {
  position: absolute; inset: -40px;
  background:
    radial-gradient(ellipse 90% 70% at 18% 12%, #5b8def 0%, transparent 52%),
    radial-gradient(ellipse 70% 60% at 88% 18%, #c45a9a 0%, transparent 48%),
    radial-gradient(ellipse 80% 70% at 55% 90%, #2a6fb8 0%, transparent 55%),
    linear-gradient(145deg, #1a3a6e 0%, #0c1a35 45%, #1e2a4a 100%);
  filter: blur(28px) saturate(1.15);
  transform: scale(1.08);
  z-index: 0;
}
.w11-signin-blur {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
  z-index: 1;
}
.w11-signin-center {
  position: relative; z-index: 2;
  display: flex; flex-direction: column; align-items: center;
  width: min(320px, calc(100vw - 48px));
  animation: w11SignInIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes w11SignInIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.w11-signin-avatar {
  width: 120px; height: 120px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: 2.6rem; font-weight: 400;
  color: #fff;
  background: linear-gradient(160deg, #4a90d9, #2b5ea8);
  box-shadow: 0 0 0 2px rgba(255,255,255,0.18);
  margin-bottom: 18px;
}
.w11-signin-form {
  width: 100%;
  display: flex; flex-direction: column; align-items: stretch; gap: 10px;
}
.w11-signin-user input,
.w11-signin-pass {
  width: 100%;
}
.w11-signin-user input {
  box-sizing: border-box;
  width: 100%;
  height: 36px;
  padding: 0 12px;
  border: 0;
  border-radius: 4px;
  background: rgba(255,255,255,0.92);
  color: #1a1a1a;
  font: inherit; font-size: 0.92rem;
  outline: none;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.25);
}
.w11-signin-user input:focus {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0,120,212,0.85);
}
.w11-signin-user input::placeholder,
.w11-signin-pass input::placeholder { color: #666; }
.w11-signin-pass {
  display: flex; align-items: stretch;
  height: 36px;
  border-radius: 4px;
  overflow: hidden;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.25);
}
.w11-signin-pass:focus-within {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0,120,212,0.85);
}
.w11-signin-pass input {
  flex: 1; min-width: 0;
  height: 100%;
  border: 0; border-radius: 0;
  background: transparent;
  color: #1a1a1a;
  padding: 0 12px;
  font: inherit; font-size: 0.92rem;
  outline: none;
  box-shadow: none !important;
}
.w11-signin-go {
  appearance: none; border: 0;
  width: 40px; flex-shrink: 0;
  background: transparent;
  color: #333;
  cursor: pointer;
  display: grid; place-items: center;
  transition: background 0.15s, color 0.15s;
}
.w11-signin-go:hover { background: rgba(0,0,0,0.08); color: #000; }
.w11-signin-go:active { background: rgba(0,0,0,0.14); }
.w11-signin-error {
  margin: 4px 0 0;
  text-align: center;
  color: #ffb4b4;
  font-size: 0.82rem;
  text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}
.w11-signin-hint {
  margin: 18px 0 0;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.78);
  letter-spacing: 0.01em;
}
.w11-signin-footer {
  position: absolute; z-index: 2;
  left: 0; right: 0; bottom: 0;
  display: flex; justify-content: space-between; align-items: flex-end;
  padding: 18px 22px 22px;
  pointer-events: none;
}
.w11-signin-tray {
  display: flex; gap: 4px;
  pointer-events: auto;
}
.w11-signin-tray-btn {
  appearance: none; border: 0;
  width: 44px; height: 44px;
  border-radius: 4px;
  background: transparent;
  color: #fff;
  font-size: 1.15rem;
  cursor: default;
  display: grid; place-items: center;
}
.w11-signin-tray-btn:hover { background: rgba(255,255,255,0.12); }

/* PostgreSQL Browser ? Windows Object Explorer style */
.w11-win-body.w11-pgb-body {
  overflow: hidden !important;
  padding: 0 !important;
  background: var(--w11-win-body) !important;
  color: #1a1a1a;
}
.pgb-host, .pgb-app {
  height: 100%; min-height: 0;
  display: flex; flex-direction: column;
  background: #f3f3f3; color: #1a1a1a;
  font-family: "Segoe UI", var(--w11-font);
}
.pgb-toolbar {
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 10px;
  background: #f3f3f3;
  border-bottom: 1px solid #d4d4d4;
}
.pgb-toolbar-left, .pgb-toolbar-right {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.pgb-toolbar-sep {
  width: 1px; height: 22px; background: #d0d0d0; margin: 0 4px;
}
.pgb-db-label {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 0.78rem; color: #555;
}
.pgb-db-label select {
  min-width: 180px; height: 28px; padding: 0 8px;
  border: 1px solid #8a8a8a; border-radius: 2px;
  background: #fff; color: #1a1a1a; font: inherit;
}
.pgb-write-switch .switch-text { color: var(--w11-text) !important; font-size: 0.78rem; }
.pgb-body {
  flex: 1; min-height: 0;
  display: flex; flex-direction: row;
}
.pgb-tree-pane {
  width: 260px; min-width: 180px; max-width: 420px;
  display: flex; flex-direction: column; min-height: 0;
  background: #fafafa;
  border-right: 1px solid #e0e0e0;
}
.pgb-pane-title {
  flex-shrink: 0;
  padding: 6px 10px;
  font-size: 0.72rem; font-weight: 600;
  color: #555; letter-spacing: 0.02em;
  background: #f0f0f0;
  border-bottom: 1px solid #e5e5e5;
}
.pgb-tree {
  flex: 1; min-height: 0; overflow: auto;
  padding: 4px 0 8px;
}
.pgb-branch { margin: 0; }
.pgb-branch > summary {
  list-style: none; cursor: pointer;
}
.pgb-branch > summary::-webkit-details-marker { display: none; }
.pgb-node {
  display: flex; align-items: center; gap: 6px;
  width: 100%;
  border: 0; background: transparent;
  padding: 4px 10px 4px 8px;
  text-align: left; font: inherit; font-size: 0.8rem;
  color: #1a1a1a; cursor: pointer;
  border-radius: 0;
}
.pgb-node:hover { background: #e8f0f8; }
.pgb-node.selected { background: #cce8ff; outline: 1px solid #99c9ef; }
.pgb-children { padding-left: 14px; }
.pgb-branch.schema > summary { padding-left: 18px; }
.pgb-branch.db > .pgb-children { padding-left: 8px; }
.pgb-ico { width: 16px; text-align: center; flex-shrink: 0; opacity: 0.9; font-size: 0.85rem; }
.pgb-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pgb-meta { color: #888; font-size: 0.7rem; flex-shrink: 0; }
.pgb-empty, .pgb-empty-sm {
  padding: 16px 12px; color: #777; font-size: 0.8rem;
}
.pgb-empty-sm { padding: 4px 10px; font-size: 0.75rem; }
.pgb-splitter-v {
  width: 4px; flex-shrink: 0; cursor: col-resize;
  background: #e8e8e8;
}
.pgb-splitter-v:hover, .pgb-splitter-v:active { background: #0067c0; }
.pgb-splitter-h {
  height: 4px; flex-shrink: 0; cursor: row-resize;
  background: #e8e8e8;
}
.pgb-splitter-h:hover, .pgb-splitter-h:active { background: #0067c0; }
.pgb-work {
  flex: 1; min-width: 0; min-height: 0;
  display: flex; flex-direction: column;
  background: #fff;
}
.pgb-editor-wrap {
  height: 140px; min-height: 80px;
  display: flex; flex-direction: column;
  border-bottom: 1px solid #e5e5e5;
}
.pgb-editor-wrap textarea {
  flex: 1; min-height: 0; width: 100%;
  border: 0; resize: none; outline: none;
  padding: 10px 12px;
  font-family: "Cascadia Mono", "Consolas", "Courier New", monospace;
  font-size: 0.82rem; line-height: 1.45;
  background: #fcfcfc; color: #1a1a1a;
}
.pgb-output {
  flex: 1; min-height: 0;
  display: flex; flex-direction: column;
  background: #fff;
}
.pgb-out-tabs {
  flex-shrink: 0;
  display: flex; gap: 0;
  padding: 0 8px;
  background: #f3f3f3;
  border-bottom: 1px solid #d4d4d4;
}
.pgb-out-tab {
  appearance: none; border: 0; background: transparent;
  padding: 7px 14px; font: inherit; font-size: 0.78rem;
  color: #555; cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.pgb-out-tab:hover { color: #1a1a1a; background: rgba(0,0,0,0.03); }
.pgb-out-tab.active {
  color: #0067c0; font-weight: 600;
  border-bottom-color: #0067c0;
  background: #fff;
}
.pgb-out-body { flex: 1; min-height: 0; position: relative; }
.pgb-results, .pgb-messages, .pgb-props {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
}
.pgb-results[hidden], .pgb-messages[hidden], .pgb-props[hidden] { display: none !important; }
.pgb-grid-wrap {
  flex: 1; min-height: 0; overflow: auto;
  background:
    linear-gradient(#fff, #fff),
    linear-gradient(180deg, #f7f9fc 0%, #ffffff 48px);
}
.pgb-grid {
  width: max-content; min-width: 100%;
  border-collapse: separate; border-spacing: 0;
  font-size: 0.78rem;
}
.pgb-grid th, .pgb-grid td {
  padding: 5px 10px;
  border-right: 1px solid #ebebeb;
  border-bottom: 1px solid #ebebeb;
  white-space: nowrap;
  max-width: 320px;
  overflow: hidden; text-overflow: ellipsis;
  vertical-align: top;
}
.pgb-grid th {
  position: sticky; top: 0; z-index: 2;
  background: linear-gradient(180deg, #f8f8f8, #efefef);
  color: #333; font-weight: 600;
  text-align: left;
  box-shadow: 0 1px 0 #d8d8d8;
}
.pgb-grid tbody tr:nth-child(even) td { background: #f7fafc; }
.pgb-grid tbody tr:hover td { background: #e8f4ff; }
.pgb-rownum {
  position: sticky; left: 0; z-index: 1;
  background: var(--w11-win-body) !important;
  color: #888; text-align: right !important;
  min-width: 36px; font-variant-numeric: tabular-nums;
  border-right: 1px solid #d8d8d8 !important;
}
.pgb-grid thead .pgb-rownum { z-index: 3; background: #efefef !important; }
.pgb-null { color: #a0a0a0; font-style: italic; }
.pgb-results-empty {
  position: absolute; inset: 0;
  display: grid; place-items: center;
  color: #888; font-size: 0.85rem;
  pointer-events: none;
  background: radial-gradient(ellipse at center, #fafcff 0%, #f3f3f3 70%);
}
.pgb-results-empty[hidden] { display: none !important; }
.pgb-msg {
  margin: 0; padding: 10px 12px;
  flex: 1; overflow: auto;
  font-family: "Cascadia Mono", Consolas, monospace;
  font-size: 0.78rem; line-height: 1.5;
  background: #1e1e1e; color: #d4d4d4;
}
.pgb-msg-line { margin-bottom: 4px; }
.pgb-msg-line.ok { color: #6a9955; }
.pgb-msg-line.err { color: #f48771; }
.pgb-msg-ts { color: #808080; margin-right: 8px; }
.pgb-statusbar {
  flex-shrink: 0;
  display: flex; justify-content: space-between; gap: 12px;
  padding: 4px 10px;
  background: #f0f0f0;
  border-top: 1px solid #d4d4d4;
  font-size: 0.72rem; color: #555;
}
.pgb-props { overflow: auto; background: #f7f9fc; padding: 12px; }
.pgb-props-sheet {
  max-width: 720px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  overflow: hidden;
}
.pgb-props-hero {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(135deg, #e8f4ff, #f5f9fc);
  border-bottom: 1px solid #e0e8f0;
}
.pgb-props-ico { font-size: 1.6rem; }
.pgb-props-hero strong { display: block; font-size: 1rem; color: #1a1a1a; }
.pgb-props-hero span { font-size: 0.78rem; color: #666; }
.pgb-props-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px; background: #ebebeb;
  border-bottom: 1px solid #ebebeb;
}
.pgb-prop {
  background: #fff; padding: 10px 14px;
  display: flex; flex-direction: column; gap: 2px;
}
.pgb-prop em { font-style: normal; font-size: 0.72rem; color: #777; }
.pgb-prop strong { font-size: 0.9rem; color: #1a1a1a; font-weight: 600; }
.pgb-props-section { padding: 12px 14px 16px; }
.pgb-props-section h4 {
  margin: 0 0 8px; font-size: 0.8rem; font-weight: 600; color: #333;
}
.pgb-mini-grid-wrap {
  overflow: auto; max-height: 220px;
  border: 1px solid #e0e0e0; border-radius: 4px;
}
.pgb-mini-grid {
  width: 100%; border-collapse: collapse; font-size: 0.75rem;
}
.pgb-mini-grid th, .pgb-mini-grid td {
  padding: 5px 8px; border-bottom: 1px solid #eee; text-align: left;
}
.pgb-mini-grid th { background: #f5f5f5; font-weight: 600; }

/* PostgreSQL Admin / Einstellungen ? Personalisierung (--w11-*) */
.w11-win-body.w11-pga-body {
  overflow: hidden !important;
  padding: 0 !important;
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
}
.pga-host, .pga-app {
  height: 100%; min-height: 0;
  display: flex; flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-family: "Segoe UI", var(--w11-font);
}
.pga-toolbar {
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 12px;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
}
.pga-toolbar-left, .pga-toolbar-right {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.pga-toolbar .win-app-btn:disabled {
  opacity: 0.45; cursor: default;
}
.pga-body {
  flex: 1; min-height: 0;
  overflow: hidden;
  padding: 12px 14px 10px;
  display: flex; flex-direction: column; gap: 10px;
}
.pga-hero {
  display: flex; flex-direction: column; gap: 10px;
  flex-shrink: 0;
}
.pga-status-card {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 14px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
}
.pga-status-dot {
  width: 14px; height: 14px; border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--w11-text) 8%, transparent);
}
.pga-status-card.ok .pga-status-dot {
  background: #16a34a;
  box-shadow: 0 0 0 3px color-mix(in srgb, #16a34a 28%, transparent);
}
.pga-status-card.warn .pga-status-dot {
  background: #ca8a04;
  box-shadow: 0 0 0 3px color-mix(in srgb, #ca8a04 28%, transparent);
}
.pga-status-card.err .pga-status-dot {
  background: #dc2626;
  box-shadow: 0 0 0 3px color-mix(in srgb, #dc2626 24%, transparent);
}
.pga-status-text { flex: 1; min-width: 0; }
.pga-status-text strong {
  display: block; font-size: 0.95rem; color: var(--w11-text);
}
.pga-status-text span {
  font-size: 0.8rem; color: var(--w11-muted);
}
.pga-status-badge {
  flex-shrink: 0;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.75rem; font-weight: 600;
}
.pga-status-badge.ok {
  background: color-mix(in srgb, #107c10 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #107c10 70%, var(--w11-text));
  border: 1px solid color-mix(in srgb, #107c10 35%, var(--w11-stroke));
}
.pga-status-badge.warn {
  background: color-mix(in srgb, #ca8a04 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #ca8a04 75%, var(--w11-text));
  border: 1px solid color-mix(in srgb, #ca8a04 35%, var(--w11-stroke));
}
.pga-status-badge.err {
  background: color-mix(in srgb, #c42b1c 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #c42b1c 75%, var(--w11-text));
  border: 1px solid color-mix(in srgb, #c42b1c 35%, var(--w11-stroke));
}
.pga-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
@media (max-width: 720px) {
  .pga-metrics { grid-template-columns: 1fr 1fr; }
}
.pga-metric {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  padding: 9px 11px;
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0;
}
.pga-metric em {
  font-style: normal; font-size: 0.72rem; color: var(--w11-muted);
}
.pga-metric strong {
  font-size: 0.86rem; color: var(--w11-text); font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pga-metric strong.ok { color: color-mix(in srgb, #107c10 75%, var(--w11-text)); }
.pga-metric strong.err { color: color-mix(in srgb, #c42b1c 75%, var(--w11-text)); }
.pga-metric strong.muted { color: var(--w11-muted); font-weight: 500; }
.pga-section {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}
.pga-section.pga-dbs {
  display: flex; flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}
.pga-section.pga-svc-detail {
  flex-shrink: 0;
}
.pga-section-head {
  padding: 7px 12px;
  font-size: 0.78rem; font-weight: 600;
  color: var(--w11-text);
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  display: flex; align-items: center; gap: 8px;
}
.pga-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 18px; padding: 0 6px;
  border-radius: 9px;
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
  color: var(--w11-accent);
  font-size: 0.7rem; font-weight: 600;
}
.pga-info-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0;
}
.pga-info {
  padding: 9px 12px;
  border-bottom: 1px solid var(--w11-stroke);
  border-right: 1px solid var(--w11-stroke);
  display: flex; flex-direction: column; gap: 3px;
  min-width: 0;
}
.pga-info:nth-child(2n) { border-right: 0; }
.pga-info:nth-last-child(-n+2) { border-bottom: 0; }
.pga-info em {
  font-style: normal; font-size: 0.72rem; color: var(--w11-muted);
}
.pga-info code, .pga-info span {
  font-size: 0.84rem; color: var(--w11-text);
  font-family: "Cascadia Mono", Consolas, monospace;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pga-info span { font-family: inherit; }
.pga-table-wrap {
  flex: 1; min-height: 0;
  overflow: hidden;
}
.pga-table {
  width: 100%; border-collapse: collapse; font-size: 0.8rem;
}
.pga-table th, .pga-table td {
  padding: 7px 12px; text-align: left;
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pga-table th {
  background: color-mix(in srgb, var(--w11-titlebar) 80%, var(--w11-window-bg));
  font-weight: 600; color: var(--w11-muted);
  border-bottom: 1px solid var(--w11-stroke);
}
.pga-table tbody tr:last-child td { border-bottom: 0; }
.pga-table tbody tr:hover td {
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 14%, var(--w11-window-bg));
}
.pga-db-ico { margin-right: 6px; opacity: 0.85; }
.pga-empty {
  color: var(--w11-muted); text-align: center; padding: 18px 12px !important;
}
.pga-details { padding: 0; }
.pga-details summary {
  padding: 7px 12px;
  cursor: pointer;
  font-size: 0.78rem; font-weight: 600; color: var(--w11-muted);
  background: var(--w11-titlebar);
  list-style: none;
}
.pga-details summary::-webkit-details-marker { display: none; }
.pga-details[open] summary {
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.pga-log {
  margin: 0; padding: 10px 12px;
  max-height: 120px; overflow: auto;
  font-family: "Cascadia Mono", Consolas, monospace;
  font-size: 0.72rem; line-height: 1.45;
  background: color-mix(in srgb, var(--w11-win-body) 70%, #000);
  color: var(--w11-text);
  white-space: pre-wrap; word-break: break-word;
  border: 0;
}
.pga-statusbar {
  flex-shrink: 0;
  display: flex; justify-content: space-between; gap: 12px;
  padding: 5px 12px;
  background: var(--w11-titlebar);
  border-top: 1px solid var(--w11-stroke);
  font-size: 0.72rem; color: var(--w11-muted);
}
.pga-statusbar .ok { color: color-mix(in srgb, #107c10 70%, var(--w11-text)); }
.pga-statusbar .err { color: color-mix(in srgb, #c42b1c 70%, var(--w11-text)); }
.pga-error-body {
  display: grid; place-items: center;
  overflow: auto;
}
.pga-error-card {
  max-width: 420px;
  padding: 24px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  text-align: center;
  color: var(--w11-text);
}
.pga-error-card strong { display: block; margin-bottom: 8px; font-size: 1rem; }
.pga-error-card p { color: var(--w11-muted); font-size: 0.85rem; margin: 0 0 16px; }

/* Legacy admin lists still use compact pg helpers */
.pg-layout { display: grid; grid-template-columns: 240px 1fr; gap: 12px; min-height: 420px; }
.pg-side {
  border: 1px solid #d0d0d0; border-radius: 4px; padding: 10px;
  overflow: auto; background: #fff;
}
.pg-side button {
  display: block; width: 100%; text-align: left; border: 0; background: transparent;
  color: #1a1a1a; padding: 8px; border-radius: 4px; cursor: pointer; font: inherit; font-size: 0.8rem;
}
.pg-side button:hover, .pg-side button.active { background: #cce8ff; }
.pg-main { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.pg-main textarea {
  width: 100%; min-height: 90px; border-radius: 4px; border: 1px solid #8a8a8a;
  background: #fff; color: #1a1a1a; padding: 10px; font-family: var(--mono); font-size: 0.82rem;
}
.pg-table-wrap { overflow: auto; border: 1px solid #d0d0d0; border-radius: 4px; max-height: 360px; background: #fff; }
.pg-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.pg-table th, .pg-table td { border-bottom: 1px solid #eee; padding: 6px 8px; text-align: left; color: #1a1a1a; }
.pg-table th { position: sticky; top: 0; background: #f3f3f3; }

/* Custom themed scrollbars (no OS chrome) */
body.w11-desktop-mode,
body.w11-desktop-mode * {
  scrollbar-width: thin;
  scrollbar-color: var(--w11-scrollbar) var(--w11-scrollbar-track);
}
body.w11-desktop-mode *::-webkit-scrollbar {
  width: 11px;
  height: 11px;
}
body.w11-desktop-mode *::-webkit-scrollbar-track {
  background: var(--w11-scrollbar-track);
  border-radius: 999px;
  margin: 3px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--w11-stroke) 55%, transparent);
}
body.w11-desktop-mode *::-webkit-scrollbar-thumb {
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--w11-scrollbar) 88%, #ffffff) 0%,
      var(--w11-scrollbar) 45%,
      color-mix(in srgb, var(--w11-scrollbar) 75%, #000000) 100%);
  border-radius: 999px;
  border: 2px solid var(--w11-scrollbar-track);
  background-clip: padding-box;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #ffffff 28%, transparent),
    0 1px 2px color-mix(in srgb, #000000 35%, transparent);
  min-height: 36px;
}
body.w11-desktop-mode *::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--w11-scrollbar-thumb-hover, var(--w11-scrollbar)) 92%, #ffffff) 0%,
      var(--w11-scrollbar-thumb-hover, var(--w11-scrollbar)) 50%,
      color-mix(in srgb, var(--w11-scrollbar) 65%, #000000) 100%);
  border: 2px solid var(--w11-scrollbar-track);
  background-clip: padding-box;
}
body.w11-desktop-mode *::-webkit-scrollbar-thumb:active {
  background: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-scrollbar));
  border: 2px solid var(--w11-scrollbar-track);
  background-clip: padding-box;
}
body.w11-desktop-mode *::-webkit-scrollbar-corner {
  background: var(--w11-scrollbar-track);
}
body.w11-desktop-mode *::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

/* Shared Win app chrome (Explorer / Pakete / Logs / Settings) */
.win-app-shell,
.dlg-shell,
.vpn-wizard-shell,
.prn-wizard-shell {
  display: flex; flex-direction: column;
  height: 100%; min-height: 0;
  background: var(--w11-win-body); color: var(--w11-text);
  font-family: "Segoe UI", var(--w11-font);
  font-size: 0.82rem;
}
.win-app-toolbar {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
  color: var(--w11-text);
}
.win-app-toolbar-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.win-app-toolbar-text strong { font-size: 0.9rem; font-weight: 600; color: var(--w11-text); }
.win-app-toolbar-text .muted,
.win-app-shell .muted { color: var(--w11-muted) !important; }
.win-app-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.win-app-toolbar-actions { display: flex; gap: 6px; align-items: center; }
.win-toolbar-btn {
  height: 26px; padding: 0 10px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text);
  font: inherit; font-size: 0.78rem; cursor: pointer; white-space: nowrap;
}
.win-toolbar-btn:hover:not(:disabled) { background: var(--w11-highlight); border-color: var(--w11-accent); }
.win-toolbar-btn:disabled { opacity: 0.45; cursor: default; }
.win-toolbar-btn.danger:hover:not(:disabled) {
  background: color-mix(in srgb, #c42b1c 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 55%, var(--w11-stroke));
  color: color-mix(in srgb, #c42b1c 75%, var(--w11-text));
}
/* Classic Windows buttons (shared) */
.win-app-btn,
.win-sheet-btn,
.fe-toolbar button,
.fe-upload,
.cpl-nav-btn:not(:disabled),
.w11-win-body .w11-hosted .btn,
.w11-win-body .w11-hosted .btn-primary,
.w11-win-body .w11-hosted .btn-ghost {
  appearance: none;
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 88px; height: 28px; padding: 0 14px;
  border: 1px solid #adadad;
  border-radius: 3px;
  background: linear-gradient(180deg, #fafafa, #e6e6e6);
  color: #1a1a1a;
  font: inherit; font-size: 0.82rem; font-weight: 400;
  cursor: pointer;
  box-shadow: none; text-shadow: none;
  text-decoration: none;
  line-height: 1;
}
.win-app-btn:hover,
.win-sheet-btn:hover,
.fe-toolbar button:hover,
.fe-upload:hover,
.w11-win-body .w11-hosted .btn:hover,
.w11-win-body .w11-hosted .btn-ghost:hover {
  background: linear-gradient(180deg, #fff, #ececec);
  border-color: #7a7a7a;
  color: #1a1a1a;
}
.win-app-btn:active,
.win-sheet-btn:active,
.fe-toolbar button:active,
.w11-win-body .w11-hosted .btn:active {
  background: #ddd;
  border-color: #7a7a7a;
}
.win-app-btn:focus-visible,
.win-sheet-btn:focus-visible,
.fe-toolbar button:focus-visible,
.w11-win-body .w11-hosted .btn:focus-visible {
  outline: 1px solid #1670c5;
  outline-offset: 1px;
}
.win-app-btn.primary,
.win-sheet-btn.primary,
.w11-win-body .w11-hosted .btn-primary {
  border-color: #1670c5 !important;
  background: linear-gradient(180deg, #4ea0ec, #2b7fd4) !important;
  color: #fff !important;
  font-weight: 600;
}
.win-app-btn.primary:hover,
.win-sheet-btn.primary:hover,
.w11-win-body .w11-hosted .btn-primary:hover {
  background: linear-gradient(180deg, #5aabf5, #3388dc) !important;
  border-color: #1670c5 !important;
  color: #fff !important;
}
.win-app-btn.primary:active,
.win-sheet-btn.primary:active,
.w11-win-body .w11-hosted .btn-primary:active {
  background: linear-gradient(180deg, #2b7fd4, #1f6bb8) !important;
}
.win-sheet-btn.danger {
  border-color: #c42b1c !important;
  background: linear-gradient(180deg, #e04b3c, #c42b1c) !important;
  color: #fff !important;
  font-weight: 600;
}
.win-sheet-btn.danger:hover {
  background: linear-gradient(180deg, #e85a4c, #d03527) !important;
  border-color: #c42b1c !important;
  color: #fff !important;
}
.win-app-btn.danger:hover,
.fe-toolbar button.danger:hover {
  background: #fde7e9; border-color: #c42b1c; color: #c42b1c;
}
.win-app-toolbar input[type="search"],
.win-app-toolbar input[type="text"],
.win-app-toolbar select,
.fe-addr input {
  height: 28px; border: 1px solid #7a7a7a; border-radius: 2px;
  padding: 0 8px; font: inherit; background: #fff; color: #1a1a1a;
}
.win-app-toolbar.pkg-tools { justify-content: flex-start; }
.win-app-toolbar.pkg-tools input { flex: 1; min-width: 180px; }
.win-app-list, .pkg-list.win-app-list {
  flex: 1; min-height: 0; overflow: auto;
  max-height: none !important;
  gap: 0 !important;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.win-app-shell .pkg-row {
  display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center;
  padding: 8px 12px; margin: 0;
  border: 0; border-bottom: 1px solid var(--w11-stroke);
  border-radius: 0; background: transparent; box-shadow: none;
}
.win-app-shell .pkg-row:hover { background: color-mix(in srgb, var(--w11-highlight) 22%, var(--w11-win-body)); }
.win-app-shell .pkg-row strong { color: var(--w11-text); }
.win-app-shell .pkg-row small { color: var(--w11-muted); }
.win-app-shell .tag {
  display: inline-block; margin-left: 8px; padding: 1px 8px;
  border-radius: 3px; font-size: 0.72rem; font-weight: 500;
  border: 1px solid #ccc; background: #f7f7f7; color: #444;
}
.win-app-shell .tag.ok { color: #0b6a0b; border-color: #9fd89f; background: #eaf6ea; }
.win-app-shell .tag.avail { color: #005a9e; border-color: #9dc3e6; background: #e8f4fc; }
.win-app-status, .fe-status {
  padding: 4px 10px; background: var(--w11-titlebar); border-top: 1px solid var(--w11-stroke);
  color: var(--w11-muted); font-size: 0.75rem; flex-shrink: 0;
}
.ol-status-bar {
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 22px;
  padding: 3px 10px;
  overflow: hidden;
}
.ol-status-count {
  flex-shrink: 0;
  color: var(--w11-text);
  white-space: nowrap;
}
.ol-status-sep {
  width: 1px;
  align-self: stretch;
  margin: 2px 10px;
  background: var(--w11-stroke);
  flex-shrink: 0;
}
.ol-status-pipeline {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--w11-muted);
}
.ol-status-pipeline.busy {
  color: var(--w11-accent);
}
.ol-status-pipeline.err {
  color: #a4262c;
}
.win-app-shell .update-banner {
  margin: 0; border-radius: 0; border: 0; border-bottom: 1px solid #d0d0d0;
  background: #fff8e1; color: #5c4b00;
}
.win-app-shell .logs-list {
  flex: 1; min-height: 0; overflow: auto; max-height: none;
  background: var(--w11-win-body); color: var(--w11-text);
}
.win-app-shell .log-row { border-color: var(--w11-stroke); }
.win-app-shell .log-row .ts { color: var(--w11-muted); }
.win-app-shell .log-row .unit { color: var(--w11-accent); }
.win-app-shell .log-row .msg { color: var(--w11-text); }
.win-app-shell .logs-auto .switch-text { color: var(--w11-text) !important; }

/* Hosted pages inside windows ? follow Personalisierung */
.w11-win-body #page-packages.w11-hosted,
.w11-win-body #page-logs.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: var(--w11-win-body); color: var(--w11-text);
}
.w11-win-body #page-packages .win-app-shell,
.w11-win-body #page-logs .win-app-shell { flex: 1; }

.w11-win-body .acc-body.w11-hosted,
.w11-win-body .w11-hosted.acc-body {
  background: var(--w11-win-body) !important; color: var(--w11-text);
  padding: 12px !important;
}
.w11-win-body .acc-card,
.w11-win-body .w11-hosted .glass,
.w11-win-body .w11-hosted .card {
  background: var(--w11-window-bg) !important;
  border: 1px solid var(--w11-stroke) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  color: var(--w11-text) !important;
}
.w11-win-body .w11-hosted h3,
.w11-win-body .w11-hosted .card-h,
.w11-win-body .w11-hosted strong { color: var(--w11-text) !important; }
.w11-win-body .w11-hosted .muted { color: var(--w11-muted) !important; }
.w11-win-body .w11-hosted input,
.w11-win-body .w11-hosted select,
.w11-win-body .w11-hosted textarea {
  background: var(--w11-window-bg) !important; color: var(--w11-text) !important;
  border: 1px solid var(--w11-stroke) !important; border-radius: 2px !important;
}
.w11-win-body .w11-hosted .table th {
  background: color-mix(in srgb, var(--w11-win-body) 88%, var(--w11-text)) !important;
  color: var(--w11-text) !important; border-color: var(--w11-stroke) !important;
}
.w11-win-body .w11-hosted .table td {
  color: var(--w11-text) !important; border-color: var(--w11-stroke) !important;
}
.w11-win-body .w11-hosted .switch-text { color: var(--w11-text) !important; }

.fe-name { display: flex; align-items: center; gap: 6px; min-width: 0; }
.fe-name-text { overflow: hidden; text-overflow: ellipsis; }
.fe-rename-input {
  flex: 1; min-width: 80px; height: 24px;
  border: 1px solid #0078d4; border-radius: 2px;
  padding: 0 6px; font: inherit; outline: none;
  box-shadow: 0 0 0 1px #0078d4;
  background: #fff; color: #1a1a1a;
}
.fe-row.fe-creating { background: #fff8e1; }

/* Devices and Printers */
.w11-win-body #acc-printers.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: #fff;
}
.w11-win-body #acc-printers .prn-shell { flex: 1; min-height: 0; }

.w11-win-body #acc-vpn.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: #fff;
}
.w11-win-body #acc-vpn .vpn-shell { flex: 1; min-height: 0; }

.w11-win-body #acc-backup.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: #fff;
}
.w11-win-body #acc-backup .bak-shell { flex: 1; min-height: 0; }

.w11-win-body #acc-dms.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: #f0f0f0;
}
.w11-win-body #acc-stamps.w11-hosted,
.w11-win-body #acc-signatures.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: #fff;
}
.w11-win-body #acc-stamps .stamps-host,
.w11-win-body #acc-signatures .signatures-host {
  flex: 1; min-height: 0; height: 100%;
  display: flex; flex-direction: column;
}
.dms-settings-shell {
  flex: 1; min-height: 0; display: flex; flex-direction: column;
  background: var(--w11-win-body) !important; color: var(--w11-text);
}
.dms-settings-tabs.win-sheet-tabs {
  flex-shrink: 0; padding: 6px 10px 0; background: #f0f0f0;
  border-bottom: 1px solid #d0d0d0;
}
.dms-settings-body {
  flex: 1; min-height: 0; overflow: hidden;
  padding: 10px 12px; margin: 0 10px 0;
  background: #fff; border: 1px solid #d0d0d0;
}
.dms-pane { height: 100%; overflow: hidden; }
.dms-pane[data-dms-pane="companies"],
.dms-pane[data-dms-pane="senders"],
.dms-pane[data-dms-pane="recipients"] { overflow: auto; }
.dms-cfg-grid {
  gap: 6px 12px; max-width: 640px; margin: 0;
}
.dms-cfg-grid > label {
  margin-bottom: 0; gap: 3px;
}
.dms-cfg-grid label > span {
  font-size: 0.75rem; color: #555; margin-bottom: 0;
}
.dms-cfg-grid input,
.dms-cfg-grid select,
.dms-cfg-grid textarea {
  height: 28px; padding: 0 8px; font-size: 0.82rem;
  border: 1px solid #7a7a7a !important; border-radius: 2px !important;
  background: var(--w11-window-bg) !important; color: var(--w11-text) !important; box-shadow: none !important;
}
.dms-cfg-grid textarea { height: auto; min-height: 64px; padding: 6px 8px; resize: vertical; }
.dms-cfg-grid input.dms-path-ro {
  background: var(--w11-win-body) !important; color: #555 !important;
  border-color: #c0c0c0 !important; cursor: default;
}
.dms-meta-line { margin: 2px 0 0; font-size: 0.72rem; line-height: 1.35; }
.dms-danger-zone {
  margin-top: 6px; padding: 8px 10px;
  border: 1px solid color-mix(in srgb, #c42b1c 55%, var(--w11-stroke));
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-win-body));
  color: var(--w11-text);
}
.dms-danger-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
}
.dms-danger-text {
  min-width: 0; display: flex; flex-direction: column; gap: 2px;
}
.dms-danger-text strong { color: #c42b1c; font-size: 0.8rem; }
.dms-danger-text .muted { font-size: 0.72rem; line-height: 1.3; }
#acc-dms .win-app-btn.danger {
  flex-shrink: 0;
  background: #c42b1c; color: #fff; border-color: #a52316;
  height: 28px; padding: 0 12px; font-size: 0.78rem;
}
#acc-dms .win-app-btn.danger:hover { background: #a52316; }
.dms-pane[data-dms-pane="general"] { overflow: auto; }
#acc-dms .dms-win-switch {
  display: flex; align-items: center; gap: 10px; margin: 2px 0 4px;
}
#acc-dms .dms-win-switch .switch-text {
  color: var(--w11-text) !important; font-size: 0.8rem; line-height: 1.25;
}
#acc-dms .dms-win-switch .switch-track {
  width: 40px; height: 20px; border-radius: 10px;
  background: #929292; box-shadow: none; flex-shrink: 0;
}
#acc-dms .dms-win-switch .switch-track::after {
  top: 4px; left: 4px; width: 12px; height: 12px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.25);
}
#acc-dms .dms-win-switch input:checked + .switch-track {
  background: #005fb8; box-shadow: none;
}
#acc-dms .dms-win-switch input:checked + .switch-track::after {
  transform: translateX(20px);
}
.dms-master-bar {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; align-items: center;
}
.dms-master-bar input { flex: 1; min-width: 140px; height: 28px; padding: 0 8px; }
.dms-master-list { border: 1px solid #e0e0e0; background: #fff; max-height: 280px; overflow: auto; }
.dms-master-row {
  display: flex; justify-content: space-between; gap: 10px; align-items: center;
  padding: 8px 10px; border-bottom: 1px solid #f0f0f0; font-size: 0.8rem;
}
.dms-master-row small { display: block; color: #666; }

.dms-host { height: 100%; min-height: 0; display: flex; flex-direction: column; }
.dms-app {
  flex: 1; min-height: 0; display: flex; flex-direction: column;
  background: var(--w11-win-body, #fff); color: var(--w11-text, #1a1a1a);
  font-family: "Segoe UI", var(--w11-font);
}
.dms-toolbar {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 8px 10px;
  background: var(--w11-titlebar, #f3f3f3);
  border-bottom: 1px solid var(--w11-stroke, #d0d0d0);
  color: var(--w11-text, #1a1a1a);
  flex-shrink: 0;
}
.dms-tb-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
  flex: 0 0 auto;
}
.dms-tb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--w11-stroke, #7a7a7a);
  border-radius: 2px;
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  cursor: pointer;
}
.dms-tb-btn:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 16%, var(--w11-window-bg, #fff));
  border-color: var(--w11-accent, #1670c5);
}
.dms-tb-btn:active {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 28%, var(--w11-window-bg, #fff));
}
.dms-tb-btn svg { display: block; }
.dms-dl-wrap {
  position: relative;
  display: inline-flex;
}
.dms-dl-menu {
  position: absolute;
  top: calc(100% + 2px);
  right: 0;
  z-index: 50;
  min-width: 150px;
  padding: 4px 0;
  margin: 0;
  border: 1px solid var(--w11-stroke, #a0a0a0);
  border-radius: 2px;
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}
.dms-dl-menu[hidden] { display: none !important; }
.dms-dl-menu button {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  font-size: 0.8rem;
  padding: 7px 12px;
  cursor: pointer;
}
.dms-dl-menu button:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 18%, var(--w11-window-bg, #fff));
}
.dms-search-wrap {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 160px;
}
.dms-toolbar .dms-search-wrap input[type="search"],
.dms-toolbar input[type="search"],
.dms-toolbar select {
  height: 28px; padding: 0 8px;
  border: 1px solid var(--w11-stroke, #7a7a7a); border-radius: 2px;
  background: var(--w11-window-bg, #fff);
  font: inherit; font-size: 0.8rem; min-width: 120px;
  color: var(--w11-text, #1a1a1a);
}
.dms-toolbar .dms-search-wrap input[type="search"] {
  width: 100%;
  min-width: 160px;
  padding-right: 28px;
  flex: 1;
}
.dms-toolbar .dms-search-wrap input[type="search"]::-webkit-search-cancel-button,
.dms-toolbar .dms-search-wrap input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
}
.dms-search-clear {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border: none;
  border-radius: 2px;
  padding: 0;
  background: transparent;
  color: var(--w11-muted, #666);
  font: inherit;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dms-search-clear:hover {
  color: var(--w11-text, #1a1a1a);
  background: color-mix(in srgb, var(--w11-text) 10%, transparent);
}
.dms-search-clear[hidden] { display: none !important; }
.dms-toolbar input[type="search"] { flex: 1; min-width: 160px; }
.dms-toolbar select option {
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
}

.dms-combo {
  position: relative;
  min-width: 150px;
  flex: 0 1 180px;
}
.dms-combo-field {
  display: flex;
  align-items: stretch;
  height: 28px;
  border: 1px solid var(--w11-stroke, #7a7a7a);
  border-radius: 2px;
  background: var(--w11-window-bg, #fff);
  overflow: hidden;
}
.dms-combo.open .dms-combo-field,
.dms-combo-field:focus-within {
  border-color: var(--w11-accent, #1670c5);
  box-shadow: 0 0 0 1px var(--w11-accent, #1670c5);
}
.dms-combo-input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  outline: none;
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  font: inherit;
  font-size: 0.8rem;
  padding: 0 8px;
}
.dms-combo-input::placeholder { color: var(--w11-muted, #666); }
.dms-combo-toggle {
  flex: 0 0 24px;
  border: 0;
  border-left: 1px solid var(--w11-stroke, #d0d0d0);
  background: var(--w11-titlebar, #f7f7f7);
  color: var(--w11-text, #333);
  cursor: pointer;
  font-size: 0.65rem;
  line-height: 1;
  padding: 0;
}
.dms-combo-toggle:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 18%, var(--w11-window-bg, #fff));
  color: var(--w11-text, #1a1a1a);
}
.dms-combo-list {
  position: absolute;
  z-index: 40;
  top: calc(100% + 2px);
  left: 0;
  right: 0;
  max-height: 220px;
  overflow: auto;
  margin: 0;
  padding: 2px 0;
  list-style: none;
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  border: 1px solid var(--w11-stroke, #a0a0a0);
  border-radius: 2px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
  /* undurchsichtig ? sonst scheint die Vorschau durch */
  opacity: 1;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.dms-combo-list[hidden] { display: none !important; }
.dms-combo-option {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--w11-text, #1a1a1a);
  text-align: left;
  font: inherit;
  font-size: 0.8rem;
  padding: 6px 10px;
  cursor: pointer;
}
.dms-combo-option:hover,
.dms-combo-option.active {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 18%, var(--w11-window-bg, #fff));
  color: var(--w11-text, #1a1a1a);
}
.dms-combo-option.selected {
  background: var(--w11-accent, #1670c5);
  color: #fff;
}
.dms-combo-option.selected:hover,
.dms-combo-option.selected.active {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 85%, #000);
  color: #fff;
}
.dms-combo-empty {
  padding: 8px 10px;
  font-size: 0.78rem;
  color: var(--w11-muted, #666);
}

/* DMS date period filter + dual calendar */
.dms-date-filter {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 1 auto;
  min-width: 0;
}
.dms-date-pills {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 3px;
  padding: 2px;
  border: 1px solid var(--w11-stroke, #a0a0a0);
  border-radius: 6px;
  background: color-mix(in srgb, var(--w11-window-bg, #fff) 88%, var(--w11-titlebar, #f3f3f3));
}
.dms-date-pill-wrap {
  position: relative;
  display: inline-flex;
}
.dms-date-pill {
  appearance: none;
  border: 0;
  margin: 0;
  padding: 5px 9px;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-text, #1a1a1a);
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.2;
  transition: background 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}
.dms-date-pill:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 14%, var(--w11-window-bg, #fff));
}
.dms-date-pill.active {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 88%, var(--w11-window-bg, #fff));
  color: #fff;
  box-shadow: 0 1px 0 color-mix(in srgb, #000 22%, transparent);
}
.dms-date-sub {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 90;
  min-width: max(100%, 168px);
  max-width: min(320px, 70vw);
  max-height: min(320px, 50vh);
  overflow: auto;
  padding: 6px 4px 4px;
  border: 1px solid var(--w11-win-border, var(--w11-stroke, #a0a0a0));
  border-radius: 8px;
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  box-shadow:
    0 12px 28px color-mix(in srgb, #000 28%, transparent),
    0 0 0 1px color-mix(in srgb, var(--w11-accent, #1670c5) 14%, transparent);
}
.dms-date-sub[hidden] { display: none !important; }
.dms-date-sub-item {
  appearance: none;
  display: block;
  width: 100%;
  margin: 0;
  padding: 7px 10px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.78rem;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
}
.dms-date-sub-item:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 16%, var(--w11-window-bg, #fff));
}
.dms-date-sub-item strong { font-weight: 700; }
.dms-date-range-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 220px;
}
.dms-date-range-btn .dms-date-range-ico {
  display: inline-flex;
  opacity: 0.9;
}
.dms-date-range-btn .dms-date-range-label {
  overflow: hidden;
  text-overflow: ellipsis;
}
.dms-date-pop {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 80;
  width: min(560px, calc(100vw - 24px));
  padding: 12px;
  border: 1px solid var(--w11-win-border, var(--w11-stroke, #a0a0a0));
  border-radius: 10px;
  background:
    linear-gradient(
      165deg,
      color-mix(in srgb, var(--w11-accent, #1670c5) 10%, var(--w11-window-bg, #fff)) 0%,
      var(--w11-window-bg, #fff) 42%,
      var(--w11-window-bg, #fff) 100%
    );
  color: var(--w11-text, #1a1a1a);
  box-shadow:
    0 18px 40px color-mix(in srgb, #000 28%, transparent),
    0 0 0 1px color-mix(in srgb, var(--w11-accent, #1670c5) 18%, transparent);
}
.dms-date-pop[hidden] { display: none !important; }
.dms-date-pop-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--w11-stroke, #d0d0d0);
}
.dms-date-pop-head strong {
  font-size: 0.92rem;
  font-weight: 700;
}
.dms-date-pop-summary {
  font-size: 0.78rem;
  color: var(--w11-muted, #666);
  font-variant-numeric: tabular-nums;
}
.dms-date-cals {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.dms-cal-month-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-bottom: 8px;
}
.dms-cal-month-head strong {
  font-size: 0.82rem;
  font-weight: 700;
}
.dms-cal-nav {
  width: 28px;
  height: 28px;
  border: 1px solid var(--w11-stroke, #a0a0a0);
  border-radius: 6px;
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
}
.dms-cal-nav:hover:not(:disabled) {
  border-color: var(--w11-accent, #1670c5);
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 12%, var(--w11-window-bg, #fff));
}
.dms-cal-nav.ghost,
.dms-cal-nav:disabled {
  opacity: 0;
  pointer-events: none;
}
.dms-cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 4px;
}
.dms-cal-weekdays span {
  text-align: center;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--w11-muted, #666);
  padding: 2px 0;
}
.dms-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}
.dms-cal-cell {
  appearance: none;
  border: 0;
  margin: 0;
  min-height: 30px;
  padding: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--w11-text, #1a1a1a);
  font: inherit;
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  position: relative;
}
.dms-cal-cell.empty {
  pointer-events: none;
  cursor: default;
}
.dms-cal-cell span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  margin: 0 auto;
}
.dms-cal-cell:hover:not(.empty) span {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 16%, var(--w11-window-bg, #fff));
}
.dms-cal-cell.today span {
  box-shadow: inset 0 0 0 1.5px var(--w11-accent, #1670c5);
  font-weight: 700;
}
.dms-cal-cell.in-range {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 14%, transparent);
  border-radius: 0;
}
.dms-cal-cell.range-start {
  background: linear-gradient(
    90deg,
    transparent 0 50%,
    color-mix(in srgb, var(--w11-accent, #1670c5) 14%, transparent) 50% 100%
  );
  border-radius: 0;
}
.dms-cal-cell.range-end {
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--w11-accent, #1670c5) 14%, transparent) 0 50%,
    transparent 50% 100%
  );
  border-radius: 0;
}
.dms-cal-cell.selected span,
.dms-cal-cell.range-start span,
.dms-cal-cell.range-end span {
  background: var(--w11-accent, #1670c5);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--w11-accent, #1670c5) 45%, transparent);
}
.dms-date-pop-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--w11-stroke, #d0d0d0);
}
.dms-date-pop-foot .win-app-btn.primary {
  background: var(--w11-accent, #1670c5);
  border-color: var(--w11-accent, #1670c5);
  color: #fff;
}
.dms-limit-wrap {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}
.dms-limit-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted, #666);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.dms-limit-wrap select {
  min-width: 72px;
  height: 28px;
  padding: 2px 8px;
  border: 1px solid var(--w11-stroke, #7a7a7a);
  border-radius: 4px;
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  font: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
}
.dms-limit-wrap select:focus {
  outline: none;
  border-color: var(--w11-accent, #1670c5);
  box-shadow: 0 0 0 1px var(--w11-accent, #1670c5);
}

@media (max-width: 1100px) {
  .dms-date-cals { grid-template-columns: 1fr; }
  .dms-date-pop { width: min(300px, calc(100vw - 24px)); }
}

.dms-body {
  flex: 1; min-height: 0;
  display: flex; flex-direction: row;
}
.dms-list-pane {
  flex: 0 0 auto;
  width: var(--dms-list-w, 52%);
  min-width: 220px;
  max-width: calc(100% - 240px);
  overflow: auto;
  outline: none;
}
.dms-list-pane:focus-visible {
  outline: none;
}
.dms-splitter {
  flex: 0 0 5px;
  width: 5px;
  cursor: col-resize;
  background: #d8d8d8;
  border-left: 1px solid #c0c0c0;
  border-right: 1px solid #c0c0c0;
  position: relative;
  z-index: 2;
}
.dms-splitter:hover,
.dms-splitter.dragging {
  background: #1670c5;
  border-color: #1670c5;
}
.dms-viewer-pane {
  flex: 1 1 auto;
  min-width: 220px;
  display: flex; flex-direction: column; min-height: 0;
  background: var(--w11-win-body, #fafafa);
}
.dms-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.78rem;
}
.dms-table thead th {
  text-align: left;
  padding: 0;
  background: var(--w11-titlebar, #fafafa);
  color: var(--w11-text, #1a1a1a);
  border-bottom: 1px solid var(--w11-stroke, #e0e0e0);
  position: sticky;
  top: 0;
  z-index: 4;
  box-shadow: 0 1px 0 var(--w11-stroke, #e0e0e0);
}
.dms-th-status {
  width: 4.4rem;
}
.dms-th-invoice { width: 15%; }
.dms-th-company { width: 16%; }
.dms-th-sender { width: 28%; }
.dms-th-date {
  width: 6.2rem;
}
.dms-th-amount { width: 6.8rem; }
.dms-th-source {
  width: 3.6rem;
}
.dms-sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 8px 8px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
}
.dms-sort-btn-status {
  justify-content: center;
  padding-left: 4px;
  padding-right: 4px;
  gap: 4px;
}
.dms-sort-btn-status > span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
}
.dms-th-date .dms-sort-btn,
.dms-th-source .dms-sort-btn {
  padding-left: 4px;
  padding-right: 4px;
  gap: 2px;
}
.dms-th-date .dms-sort-btn > span:first-child,
.dms-th-source .dms-sort-btn > span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
}
.dms-sort-btn:hover {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 10%, transparent);
}
.dms-sort-btn:focus-visible {
  outline: 2px solid var(--w11-accent, #0078d4);
  outline-offset: -2px;
}
.dms-sort-ico {
  flex: 0 0 auto;
  font-size: 0.65rem;
  line-height: 1;
  opacity: 0.35;
  min-width: 0.75em;
}
.dms-sort-btn.active .dms-sort-ico {
  opacity: 1;
  color: var(--w11-accent, #0078d4);
}
.dms-table td {
  padding: 7px 8px;
  border-bottom: 1px solid var(--w11-stroke, #f0f0f0);
  vertical-align: top;
  color: var(--w11-text, #1a1a1a);
  background: var(--w11-window-bg, #fff);
  overflow: hidden;
}
.dms-row {
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
}
.dms-row:focus {
  outline: none;
}
.dms-row:focus-visible {
  outline: 2px solid var(--w11-accent, #0078d4);
  outline-offset: -2px;
}
.dms-row:hover td { background: color-mix(in srgb, var(--w11-accent, #0078d4) 8%, var(--w11-window-bg, #fff)); }
.dms-row.selected td { background: color-mix(in srgb, var(--w11-highlight, #cce8ff) 85%, var(--w11-window-bg, #fff)); }
.dms-row.ocr-busy td,
.dms-row.dms-row-busy td {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 10%, var(--w11-window-bg, #fff));
}
.dms-row.ocr-busy.selected td,
.dms-row.dms-row-busy.selected td {
  background: color-mix(in srgb, var(--w11-highlight, #cce8ff) 78%, var(--w11-window-bg, #fff));
}
.dms-row.ocr-busy > td.dms-td-invoice,
.dms-row.dms-row-busy > td.dms-td-status {
  position: relative;
  overflow: visible;
}
.dms-td-status {
  width: 4.4rem;
  text-align: center;
  vertical-align: middle;
  padding-left: 4px;
  padding-right: 4px;
}
.dms-td-status .dms-match-dot {
  margin: 2px auto 0;
  display: inline-block;
}
.dms-td-invoice { position: relative; width: 15%; }
.dms-inv-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
}
.dms-inv-wrap .dms-marquee { flex: 1 1 auto; min-width: 0; }
.dms-einvoice-ico {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: -3px;
  border-radius: 2px;
  image-rendering: auto;
}
.dms-td-company { width: 16%; }
.dms-td-sender { width: 28%; }
.dms-td-date {
  width: 6.2rem;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  padding-left: 4px;
  padding-right: 4px;
}
.dms-td-amount {
  width: 6.8rem;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.dms-td-source {
  width: 3.6rem;
  padding-left: 4px;
  padding-right: 4px;
}
.dms-title-cell {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.dms-match-dot {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  margin-top: 4px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.18);
}
.dms-match-dot.green { background: #16a34a; }
.dms-match-dot.yellow { background: #eab308; }
.dms-match-dot.red { background: #dc2626; cursor: pointer; }
.dms-match-dot.red:hover { box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.25); }
.dms-title-text { min-width: 0; flex: 1; }
.dms-marquee {
  display: block;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  scrollbar-width: none;
}
.dms-marquee::-webkit-scrollbar { display: none; width: 0; height: 0; }
.dms-marquee-run {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
  will-change: transform;
}
.dms-marquee.is-overflow .dms-marquee-run {
  max-width: 100%;
  text-overflow: ellipsis;
  animation: dms-cell-marquee var(--dms-marquee-dur, 8s) linear infinite;
  animation-play-state: paused;
}
.dms-row:hover .dms-marquee.is-overflow .dms-marquee-run,
.dms-row:focus-visible .dms-marquee.is-overflow .dms-marquee-run {
  max-width: none;
  text-overflow: clip;
  padding-right: 1.25em;
  animation-play-state: running;
}
@keyframes dms-cell-marquee {
  0%,
  12% {
    transform: translateX(0);
  }
  88%,
  100% {
    transform: translateX(calc(-1 * var(--dms-marquee-shift, 0px)));
  }
}
.dms-row-progress {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
  border-radius: 2px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--w11-accent, #0078d4) 6%, transparent) 0%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 14%, transparent) 50%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 6%, transparent) 100%
  );
}
.dms-row-progress-glow {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 18%, transparent) 50%,
    transparent 100%
  );
  opacity: 0.55;
  filter: blur(6px);
  animation: dms-row-progress-pulse 2.2s ease-in-out infinite;
}
.dms-row-progress-sheen {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: 0;
  width: 42%;
  background: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 8%, transparent) 18%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 42%, transparent) 42%,
    color-mix(in srgb, #ffffff 55%, var(--w11-accent, #0078d4)) 50%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 42%, transparent) 58%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 8%, transparent) 82%,
    transparent 100%
  );
  filter: blur(0.4px);
  mix-blend-mode: screen;
  opacity: 0.9;
  animation: dms-row-progress-flow 1.55s cubic-bezier(0.4, 0.0, 0.2, 1) infinite;
  will-change: transform;
}
.dms-row.dms-row-busy > td > *:not(.dms-row-progress) {
  position: relative;
  z-index: 1;
}
.dms-ocr-track {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}
.dms-ocr-fill {
  display: block;
  height: 100%;
  width: 38%;
  background: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 20%, transparent) 30%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 48%, transparent) 50%,
    color-mix(in srgb, var(--w11-accent, #0078d4) 20%, transparent) 70%,
    transparent 100%
  );
  animation: dms-ocr-sweep 1.35s linear infinite;
}
.dms-row .dms-cell { position: relative; z-index: 1; }
.dms-match-dot { pointer-events: auto; }
@keyframes dms-ocr-sweep {
  0% { transform: translateX(-130%); }
  100% { transform: translateX(320%); }
}
@keyframes dms-row-progress-flow {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(280%); }
}
@keyframes dms-row-progress-pulse {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 0.7; }
}
.dms-suggest-list {
  display: flex; flex-direction: column; gap: 6px;
  margin: 8px 0 0;
  max-height: 160px; overflow: auto;
}
.dms-suggest-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--w11-stroke, #d0d0d0);
  background: var(--w11-window-bg, #fff);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: var(--w11-text, #1a1a1a);
}
.dms-suggest-item:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 12%, var(--w11-window-bg, #fff));
  border-color: var(--w11-accent, #1670c5);
}
.dms-suggest-item.selected {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 22%, var(--w11-window-bg, #fff));
  border-color: var(--w11-accent, #1670c5);
}
.dms-suggest-item.dms-suggest-jtl {
  background: color-mix(in srgb, #107c10 10%, var(--w11-window-bg, #fff));
  border-color: color-mix(in srgb, #107c10 35%, var(--w11-stroke, #ddd));
}
.dms-suggest-item.dms-suggest-jtl:hover {
  background: color-mix(in srgb, #107c10 16%, var(--w11-window-bg, #fff));
}
.dms-suggest-item strong { display: block; font-size: 0.82rem; }
.dms-suggest-item small { color: var(--w11-muted, #666); font-size: 0.72rem; }
.dms-suggest-badge {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 1px 5px;
  border-radius: 3px;
  background: color-mix(in srgb, #107c10 22%, var(--w11-window-bg, #fff));
  color: color-mix(in srgb, #0b5a0b 70%, var(--w11-text, #111));
  vertical-align: middle;
}
.w11-ctx-sender-item.w11-ctx-sender-jtl {
  background: color-mix(in srgb, #107c10 8%, var(--w11-window-bg, #fff));
}
.dms-viewer-bar {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  padding: 6px 8px;
  border-bottom: 1px solid var(--w11-stroke, #e0e0e0);
  background: var(--w11-titlebar, #f3f3f3);
  color: var(--w11-text, #1a1a1a);
  flex-shrink: 0;
}
.dms-viewer-bar button {
  appearance: none;
  border: 1px solid var(--w11-stroke, #adadad);
  background: color-mix(in srgb, var(--w11-window-bg, #fafafa) 82%, var(--w11-text, #000));
  color: var(--w11-text, #1a1a1a);
  height: 26px; min-width: 28px; padding: 0 8px; border-radius: 3px; cursor: pointer; font: inherit;
  display: inline-flex; align-items: center; justify-content: center;
}
.dms-viewer-bar button.dms-v-ico {
  padding: 0 6px;
}
.dms-viewer-bar button.dms-v-ico svg {
  width: 16px;
  height: 16px;
  display: block;
}
.dms-viewer-bar button:disabled {
  opacity: 0.45;
  cursor: default;
}
.dms-viewer-bar button:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 20%, var(--w11-window-bg, #fff));
  border-color: var(--w11-accent, #1670c5);
}
.dms-viewer-title {
  margin-left: 8px; font-size: 0.8rem;
  color: var(--w11-muted, inherit);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dms-canvas-wrap {
  flex: 1; min-height: 0; overflow: auto; background: #525659; cursor: grab;
  /* block statt flex-center: sonst blockiert justify-content das horizontale Scrollen/Pannen */
  display: block;
  padding: 12px;
  touch-action: none;
  user-select: none;
  position: relative;
}
.dms-canvas-wrap:active,
.dms-canvas-wrap.is-panning { cursor: grabbing; }
.dms-pages {
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  width: max-content;
  min-width: 0;
  margin: 0 auto;
  transform-origin: center top;
  will-change: transform;
}
.dms-canvas-wrap.dms-viewer-loading .dms-pages {
  filter: blur(5px);
  opacity: 0.55;
  transition: filter 0.08s ease, opacity 0.08s ease;
  pointer-events: none;
}
.dms-viewer-load {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: none;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  background: color-mix(in srgb, #000 28%, transparent);
}
.dms-canvas-wrap.dms-viewer-loading .dms-viewer-load {
  display: flex !important;
}
.dms-viewer-spinner {
  width: 42px;
  height: 42px;
  border: 3px solid color-mix(in srgb, #fff 28%, transparent);
  border-top-color: #fff;
  border-radius: 50%;
  animation: dms-viewer-spin 0.7s linear infinite;
  box-shadow: 0 0 0 1px color-mix(in srgb, #000 20%, transparent);
}
@keyframes dms-viewer-spin {
  to { transform: rotate(360deg); }
}
.dms-page-canvas {
  display: block;
  box-shadow: 0 2px 12px rgba(0,0,0,0.35);
  background: #fff;
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  opacity: 1 !important;
  pointer-events: none; /* Drag geht an Wrap (Hand-Werkzeug) */
}
.dms-page-preview {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  box-shadow: 0 2px 12px rgba(0,0,0,0.35);
  background: #fff;
  pointer-events: none;
}
.dms-pdf-loading {
  color: var(--w11-muted, #a0a0a0);
  font-size: 0.9rem;
  padding: 48px 24px;
  text-align: center;
  opacity: 0.9;
}
.dms-canvas-wrap canvas { box-shadow: 0 2px 12px rgba(0,0,0,0.35); background: #fff; max-width: none !important; width: auto !important; opacity: 1 !important; }
.dms-meta {
  flex-shrink: 0; max-height: 110px; overflow: auto;
  padding: 8px 10px;
  border-top: 1px solid var(--w11-stroke, #e0e0e0);
  background: var(--w11-window-bg, #fff);
  color: var(--w11-text, #1a1a1a);
  font-size: 0.75rem; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px;
}
.dms-meta-actions {
  grid-column: 1 / -1;
  display: flex; gap: 8px; margin-top: 4px;
}
.dms-meta-actions .win-app-btn { height: 26px; font-size: 0.75rem; }
@media (max-width: 900px) {
  .dms-body { grid-template-columns: 1fr; }
}
.bak-shell { background: var(--w11-win-body) !important; color: var(--w11-text); }
.bak-layout {
  flex: 1; min-height: 0;
  display: grid; grid-template-columns: 1.4fr 1fr;
}
.bak-list-pane {
  overflow: auto;
  border-right: 1px solid var(--w11-stroke, var(--w11-win-border));
  background: var(--w11-window-bg);
}
.bak-table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.bak-table th {
  text-align: left; padding: 7px 10px; font-weight: 600;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke, var(--w11-win-border));
  color: var(--w11-text);
  position: sticky; top: 0; z-index: 1;
}
.bak-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--w11-stroke, var(--w11-win-border));
  vertical-align: top;
  color: var(--w11-text);
}
.bak-row { cursor: default; }
.bak-row:hover { background: color-mix(in srgb, var(--w11-accent, #0078d4) 10%, var(--w11-window-bg)); }
.bak-row.selected {
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 28%, var(--w11-window-bg));
}
.bak-row .bak-name { font-weight: 600; display: flex; align-items: center; gap: 8px; color: var(--w11-text); }
.bak-row .bak-ico {
  width: 22px; height: 22px; border-radius: 4px; flex-shrink: 0;
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 55%, var(--w11-window-bg));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 25%, transparent);
}
.bak-row small { display: block; color: var(--w11-muted); font-weight: 400; margin-top: 2px; }
.bak-pill {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto; max-width: 100%;
  font-size: 0.68rem; font-weight: 600; line-height: 1.2;
  padding: 2px 8px; border-radius: 3px; white-space: nowrap;
  border: 1px solid var(--w11-stroke, var(--w11-win-border));
  background: color-mix(in srgb, var(--w11-muted) 12%, var(--w11-window-bg));
  color: var(--w11-text);
}
.bak-pill.on {
  color: #0b6a0b;
  border-color: color-mix(in srgb, #107c10 35%, var(--w11-stroke, #ccc));
  background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg));
}
.bak-pill.off { color: var(--w11-muted); }
.bak-pill.run {
  color: color-mix(in srgb, var(--w11-accent, #0078d4) 80%, #000);
  border-color: color-mix(in srgb, var(--w11-accent, #0078d4) 40%, var(--w11-stroke, #ccc));
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 14%, var(--w11-window-bg));
}
.bak-pill.err {
  color: #c42b1c;
  border-color: color-mix(in srgb, #c42b1c 35%, var(--w11-stroke, #ccc));
  background: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg));
}
.bak-detail {
  display: flex; flex-direction: column; min-height: 0; overflow: hidden;
  background: var(--w11-win-body); padding: 10px 12px;
  color: var(--w11-text);
}
.bak-detail-h { margin-bottom: 10px; flex: 0 0 auto; }
.bak-detail-h strong { display: block; font-size: 0.92rem; color: var(--w11-text); }
.bak-detail-h .muted,
#bak-detail-sub {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  overflow: hidden; color: var(--w11-muted); font-size: 0.78rem; line-height: 1.35;
}
.bak-error {
  flex: 0 0 auto;
  margin: 0 0 8px;
  padding: 8px 10px;
  border-radius: 4px;
  border: 1px solid color-mix(in srgb, #c42b1c 35%, var(--w11-stroke, #ccc));
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-window-bg));
  color: var(--w11-text);
  font-size: 0.78rem;
  line-height: 1.35;
  max-height: 7.5rem;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.bak-error[hidden] { display: none !important; }
.bak-snaps-h {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 6px; font-size: 0.8rem; flex: 0 0 auto; color: var(--w11-text);
}
.bak-snaps {
  flex: 1; min-height: 0; overflow: auto;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke, var(--w11-win-border));
  border-radius: 2px;
}
.bak-snap {
  display: flex; justify-content: space-between; gap: 8px; align-items: center;
  padding: 8px 10px;
  border-bottom: 1px solid var(--w11-stroke, var(--w11-win-border));
  font-size: 0.78rem;
  color: var(--w11-text);
}
.bak-snap:hover { background: color-mix(in srgb, var(--w11-accent, #0078d4) 10%, var(--w11-window-bg)); }
.bak-snap strong {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  color: var(--w11-text);
}
.bak-snap small { display: block; width: 100%; color: var(--w11-muted); font-weight: 400; }
.bak-job {
  margin-top: 8px;
  font-size: 0.75rem;
  color: var(--w11-muted);
  flex: 0 0 auto;
  max-height: 2.6rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bak-job[hidden] { display: none !important; }

/* Compact backup task wizard ? fits without clipping */
#acc-bak-wizard .bak-wizard-form { overflow: hidden; }
#acc-bak-wizard .bak-wizard-body {
  flex: 1; min-height: 0; overflow: auto;
  padding: 10px 12px; margin: 0 10px;
  border: 1px solid #d0d0d0; background: #fff;
}
#acc-bak-wizard .bak-wizard-grid {
  gap: 6px 12px;
}
#acc-bak-wizard .bak-wizard-grid > label {
  margin-bottom: 0;
  gap: 3px;
}
#acc-bak-wizard .bak-wizard-grid label.switch {
  margin: 2px 0 4px;
  gap: 10px;
}
#acc-bak-wizard .bak-wizard-grid label span {
  font-size: 0.75rem; margin-bottom: 0;
}
#acc-bak-wizard .bak-wizard-grid input,
#acc-bak-wizard .bak-wizard-grid select {
  height: 28px; padding: 0 8px; font-size: 0.82rem;
  border-radius: 2px !important;
}
#acc-bak-wizard .bak-wizard-hint {
  margin: 2px 0 0; font-size: 0.72rem; line-height: 1.35;
}
#acc-bak-wizard .win-sheet-footer {
  padding: 10px 12px; flex-shrink: 0;
}
#acc-bak-wizard .form-error { margin: 4px 12px 0; font-size: 0.75rem; }

/* Compact storage connect wizard ? footer always visible, Win11 controls */
#acc-stor-wizard .stor-wizard-form { overflow: hidden; }
#acc-stor-wizard .stor-wizard-body {
  flex: 1; min-height: 0; overflow: auto;
  padding: 14px 20px; margin: 0;
  border: 0; background: #ffffff;
}
#acc-stor-wizard .stor-wizard-grid {
  gap: 6px 12px;
}
#acc-stor-wizard .stor-wizard-grid > label,
#acc-stor-wizard .stor-wizard-nested > label {
  margin-bottom: 0;
  gap: 3px;
}
#acc-stor-wizard .stor-wizard-grid label > span,
#acc-stor-wizard .stor-wizard-nested label > span {
  font-size: 0.75rem; margin-bottom: 0; color: #555;
}
#acc-stor-wizard .stor-wizard-grid input,
#acc-stor-wizard .stor-wizard-grid select,
#acc-stor-wizard .stor-wizard-nested input,
#acc-stor-wizard .stor-wizard-nested select {
  height: 28px; padding: 0 8px; font-size: 0.82rem;
  border-radius: 2px !important;
}
#acc-stor-wizard .stor-wizard-nested {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 12px;
  margin: 0; padding: 0; border: 0; background: transparent;
}
#acc-stor-wizard .stor-sp-site-row {
  display: flex; gap: 6px; align-items: center;
}
#acc-stor-wizard .stor-sp-site-row select { flex: 1; min-width: 0; }
#acc-stor-wizard .stor-sp-site-row .win-app-btn {
  flex-shrink: 0; min-width: 0; height: 28px; padding: 0 10px;
}
#acc-stor-wizard .stor-wizard-hint {
  margin: 2px 0 0; font-size: 0.72rem; line-height: 1.35;
}
#acc-stor-wizard #stor-dms-paths {
  margin-top: 2px; padding-top: 6px; border-top: 1px solid #eee;
}
#acc-stor-wizard .win-sheet-footer {
  padding: 10px 12px; flex-shrink: 0;
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end;
}
#acc-stor-wizard .win-sheet-footer #btn-stor-test { margin-right: auto; }
#acc-stor-wizard .form-error { margin: 4px 12px 0; font-size: 0.75rem; }

#acc-stor-dup .stor-dup-form { overflow: hidden; }
#acc-stor-dup .stor-dup-body {
  flex: 1; min-height: 0; padding: 12px 14px; margin: 0 10px;
  border: 1px solid #d0d0d0; background: #fff;
}
#acc-stor-dup .stor-dup-hint {
  margin: 0 0 10px; font-size: 0.78rem; color: #555; line-height: 1.35;
}
#acc-stor-dup .stor-dup-field {
  display: flex; flex-direction: column; gap: 4px;
}
#acc-stor-dup .stor-dup-field span { font-size: 0.75rem; color: #555; }
#acc-stor-dup .stor-dup-field input {
  height: 28px; padding: 0 8px; font-size: 0.82rem;
  border: 1px solid #7a7a7a !important; border-radius: 2px !important; background: #fff;
}
#acc-stor-dup .win-sheet-footer {
  padding: 10px 12px; flex-shrink: 0;
  display: flex; gap: 8px; justify-content: flex-end;
}
#acc-stor-dup .form-error { margin: 4px 12px 0; font-size: 0.75rem; }
#acc-stor-props #stor-props-dms-paths {
  display: flex; flex-direction: column; gap: 8px; margin-top: 8px;
}
#acc-stor-props #stor-props-dms-paths .win-sheet-field span { font-size: 0.75rem; }

.stor-path-row {
  display: flex; gap: 6px; align-items: center;
}
.stor-path-row input {
  flex: 1; min-width: 0; height: 28px; padding: 0 8px;
  font-size: 0.82rem; border-radius: 2px !important;
}
.stor-path-row .win-app-btn {
  flex-shrink: 0; min-width: 0; height: 28px; padding: 0 10px; white-space: nowrap;
}

#acc-stor-folder .stor-folder-form { overflow: hidden; height: 100%; }
#acc-stor-folder .stor-folder-bar {
  display: flex; gap: 8px; align-items: center;
  padding: 8px 10px; background: #f3f3f3; border-bottom: 1px solid #d0d0d0; flex-shrink: 0;
}
#acc-stor-folder .stor-folder-path {
  flex: 1; min-width: 0; font-size: 0.8rem; color: #1a1a1a;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding: 4px 8px; background: #fff; border: 1px solid #d0d0d0;
}
#acc-stor-folder .stor-folder-body {
  flex: 1; min-height: 0; overflow: auto;
  padding: 0; margin: 0 10px; border: 1px solid #d0d0d0; background: #fff;
}
#acc-stor-folder .stor-folder-list { display: flex; flex-direction: column; }
#acc-stor-folder .stor-folder-item {
  appearance: none; border: 0; border-bottom: 1px solid #f0f0f0;
  background: #fff; color: #1a1a1a; text-align: left;
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; font: inherit; font-size: 0.82rem; cursor: pointer;
}
#acc-stor-folder .stor-folder-item:hover { background: #f5f9fc; }
#acc-stor-folder .stor-folder-item.selected { background: #cce8ff; }
#acc-stor-folder .stor-folder-ico {
  width: 18px; height: 18px; flex-shrink: 0; border-radius: 2px;
  background: linear-gradient(160deg, #ffe9a8, #e8b84a);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
}
#acc-stor-folder .stor-folder-empty { padding: 16px 12px; font-size: 0.8rem; }
#acc-stor-folder .win-sheet-footer {
  padding: 10px 12px; flex-shrink: 0;
  display: flex; gap: 8px; justify-content: flex-end;
}
#acc-stor-folder .form-error { margin: 4px 12px 0; font-size: 0.75rem; }

@media (max-width: 900px) {
  .bak-layout { grid-template-columns: 1fr; }
  .bak-list-pane { border-right: 0; border-bottom: 1px solid #d0d0d0; max-height: 45%; }
}

.w11-win-body #acc-storage.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: #fff;
}
.w11-win-body #acc-storage .stor-shell { flex: 1; min-height: 0; }
.stor-shell {
  background: var(--w11-win-body) !important; color: var(--w11-text);
  font-family: "Segoe UI", var(--w11-font);
}
.stor-nav {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px;
  background: #f3f3f3;
  border-bottom: 1px solid #d0d0d0;
  flex-shrink: 0;
}
.stor-up { min-width: 32px !important; width: 32px; padding: 0 !important; }
.stor-up:disabled { opacity: 0.4; cursor: default; }
.stor-crumbs {
  display: flex; flex-wrap: wrap; gap: 2px; align-items: center;
  flex: 1; min-width: 0;
}
.stor-crumb {
  appearance: none; border: 0; background: transparent; color: #555;
  padding: 4px 8px; border-radius: 3px; cursor: pointer; font: inherit; font-size: 0.8rem;
}
.stor-crumb:hover { background: #e5f1fb; color: #1a1a1a; }
.stor-crumb.current { color: #1a1a1a; font-weight: 600; }
.stor-crumb-sep { color: #999; font-size: 0.75rem; padding: 0 2px; }
.stor-address {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px;
  background: #fafafa;
  border-bottom: 1px solid #e5e5e5;
  flex-shrink: 0;
}
.stor-addr-label {
  color: #666; font-size: 0.72rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.04em;
}
.stor-address code {
  flex: 1; min-width: 0;
  height: 26px; display: flex; align-items: center;
  padding: 0 8px;
  border: 1px solid #7a7a7a; border-radius: 2px;
  background: #fff; color: #1a1a1a;
  font-family: "Cascadia Mono", "Consolas", monospace; font-size: 0.78rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.stor-view {
  flex: 1; min-height: 0; overflow: auto;
  padding: 12px 14px 16px;
  background: #fff;
  outline: none;
  user-select: none;
}
.stor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 6px 8px;
  align-content: start;
}
.stor-item {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 10px 6px 8px;
  border-radius: 2px; border: 1px solid transparent;
  cursor: default;
}
.stor-item:hover { background: #e5f1fb; border-color: #cce4f7; }
.stor-item.selected {
  background: #cce8ff;
  border-color: #99d1ff;
}
.stor-icon {
  width: 48px; height: 40px; position: relative;
  flex-shrink: 0;
}
.stor-icon.folder {
  background: linear-gradient(180deg, #ffe9a8 0%, #f0c14a 40%, #d4a017 100%);
  border-radius: 2px 8px 4px 4px;
  clip-path: polygon(0 14%, 30% 14%, 38% 0, 100% 0, 100% 100%, 0 100%);
  box-shadow: 0 1px 2px rgba(0,0,0,0.12);
}
.stor-icon.drive {
  background: linear-gradient(160deg, #c5dcff 0%, #5b9cff 50%, #2f6fbf 100%);
  border-radius: 6px;
  border: 1px solid #6e9cc8;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45);
}
.stor-icon.drive::after {
  content: "";
  position: absolute; left: 10px; right: 10px; bottom: 8px; height: 3px;
  border-radius: 2px; background: rgba(255,255,255,0.65);
}
.stor-icon.file {
  background: linear-gradient(180deg, #f4f6f8, #c8d0dc);
  border-radius: 2px 10px 2px 2px;
  border: 1px solid #b0b8c4;
}
.stor-icon .mount-badge {
  position: absolute; right: -3px; bottom: -3px;
  width: 12px; height: 12px; border-radius: 50%;
  background: #0f7b0f; border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.15);
}
.stor-icon .mount-badge.off { background: #c42b1c; }
.stor-label {
  text-align: center; font-size: 0.78rem; line-height: 1.25;
  word-break: break-word; color: #1a1a1a; max-width: 100%;
}
.stor-badges {
  display: flex; flex-wrap: wrap; gap: 3px; justify-content: center; min-height: 14px;
}
.stor-badge {
  font-size: 0.62rem; font-weight: 600;
  padding: 1px 6px; border-radius: 3px;
  border: 1px solid transparent; color: #fff;
}
.stor-badge.bak {
  color: #fff !important;
  border-color: color-mix(in srgb, #0b6a0b 70%, #000);
  background: #107c10;
}
.stor-badge.dms {
  color: #fff !important;
  border-color: color-mix(in srgb, #005a9e 70%, #000);
  background: #0078d4;
}
.stor-badge.sp {
  color: #fff !important;
  border-color: color-mix(in srgb, #5c2d91 70%, #000);
  background: #5c2d91;
}
.stor-empty {
  grid-column: 1 / -1; text-align: center; padding: 40px 16px; color: #666;
}
.stor-empty .muted { color: #888 !important; }
#stor-ctx {
  z-index: 10070;
}
#stor-ctx button {
  display: flex; width: 100%; text-align: left;
  appearance: none; border: 0; background: transparent;
  color: #1a1a1a; padding: 7px 12px; border-radius: 3px;
  cursor: pointer; font: inherit; font-size: 0.8rem;
}
#stor-ctx button:hover { background: #cce8ff; }
#stor-ctx button.danger { color: #c42b1c; }
#stor-ctx button.danger:hover { background: #fde7e9; }
#stor-ctx hr {
  border: 0; border-top: 1px solid #ddd; margin: 4px 8px;
}

.w11-win-body #acc-security.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
}
.w11-win-body #acc-security .sec-shell {
  flex: 1; min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.w11-win-body #acc-certificate.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0 !important; padding: 0 !important; margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.w11-win-body #acc-certificate .cert-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
}

/* ?? Dropshipment ?? */
.w11-win-body #acc-dropshipment.w11-hosted,
.w11-win-body #acc-dropshipment-settings.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.dropship-shell,
.dropship-settings-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}

.dropship-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 12px 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background:
    radial-gradient(820px 320px at 0% -10%, color-mix(in srgb, #ca5010 14%, transparent), transparent 55%),
    radial-gradient(640px 280px at 100% 0%, color-mix(in srgb, var(--w11-accent) 12%, transparent), transparent 50%),
    var(--w11-win-body);
}
.dropship-sup-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-content: flex-start;
  flex-shrink: 0;
  max-height: 42%;
  overflow: auto;
  padding: 2px;
}
.dropship-empty-card {
  flex: 1 1 100%;
  padding: 28px 16px;
  text-align: center;
  color: var(--w11-muted);
  border: 1px dashed var(--w11-stroke);
  border-radius: 14px;
  background: color-mix(in srgb, var(--w11-window-bg) 80%, transparent);
  line-height: 1.45;
}
.dropship-chip {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 148px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  cursor: pointer;
  text-align: left;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
  box-shadow: 0 6px 16px color-mix(in srgb, #000 10%, transparent);
}
.dropship-chip:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.dropship-chip.selected {
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 55%, transparent);
  border-color: color-mix(in srgb, var(--w11-accent) 50%, var(--w11-stroke));
}
.dropship-chip-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--w11-muted);
}
.dropship-chip-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.dropship-chip-text strong {
  font-size: 0.92rem;
  font-weight: 650;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dropship-chip-text em {
  font-style: normal;
  font-size: 0.72rem;
  color: var(--w11-muted);
}
.dropship-chip.ok {
  background: color-mix(in srgb, #107c10 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 40%, var(--w11-stroke));
}
.dropship-chip.ok .dropship-chip-dot {
  background: #107c10;
  box-shadow: 0 0 0 3px color-mix(in srgb, #107c10 28%, transparent);
}
.dropship-chip.ok .dropship-chip-text em { color: color-mix(in srgb, #107c10 70%, var(--w11-text)); }
.dropship-chip.checking {
  background: color-mix(in srgb, #ffb900 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #ffb900 45%, var(--w11-stroke));
}
.dropship-chip.checking .dropship-chip-dot {
  background: #ffb900;
  box-shadow: 0 0 0 3px color-mix(in srgb, #ffb900 30%, transparent);
  animation: dropship-pulse 1.1s ease-in-out infinite;
}
.dropship-chip.checking .dropship-chip-text em { color: color-mix(in srgb, #9a7600 55%, var(--w11-text)); }
.dropship-chip.err,
.dropship-chip.off {
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 40%, var(--w11-stroke));
}
.dropship-chip.err .dropship-chip-dot,
.dropship-chip.off .dropship-chip-dot {
  background: #c42b1c;
  box-shadow: 0 0 0 3px color-mix(in srgb, #c42b1c 25%, transparent);
}
.dropship-chip.err .dropship-chip-text em,
.dropship-chip.off .dropship-chip-text em { color: color-mix(in srgb, #c42b1c 65%, var(--w11-text)); }
.dropship-chip.off { opacity: 0.78; }
@keyframes dropship-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(0.85); opacity: 0.65; }
}
.dropship-pick-hint {
  flex: 1;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--w11-muted);
  border: 1px dashed var(--w11-stroke);
  border-radius: 16px;
  background: color-mix(in srgb, var(--w11-window-bg) 70%, transparent);
  padding: 24px;
}
.dropship-detail {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--w11-stroke);
  border-radius: 16px;
  background: color-mix(in srgb, var(--w11-window-bg) 92%, transparent);
  overflow: hidden;
  box-shadow: 0 12px 28px color-mix(in srgb, #000 12%, transparent);
}
.dropship-detail-h {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 16px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.dropship-detail-h strong {
  display: block;
  color: var(--w11-text);
  font-size: 1rem;
}
.dropship-detail-h .muted {
  color: var(--w11-muted);
  font-size: 0.78rem;
}
.dropship-detail-h small {
  color: var(--w11-muted);
  font-size: 0.75rem;
}
.dropship-jtl-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.dropship-jtl-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.86rem;
}
.dropship-jtl-table th {
  text-align: left;
  padding: 10px 14px;
  position: sticky;
  top: 0;
  background: color-mix(in srgb, var(--w11-titlebar) 88%, var(--w11-window-bg));
  color: var(--w11-muted);
  font-weight: 600;
  border-bottom: 1px solid var(--w11-stroke);
  z-index: 1;
}
.dropship-jtl-table td {
  padding: 11px 14px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  color: var(--w11-text);
  vertical-align: top;
}
.dropship-jtl-table tbody tr:hover {
  background: color-mix(in srgb, var(--w11-accent) 8%, transparent);
}
.dropship-jtl-badge {
  display: inline-flex;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 650;
  background: color-mix(in srgb, #107c10 16%, var(--w11-win-body));
  border: 1px solid color-mix(in srgb, #107c10 35%, var(--w11-stroke));
  color: var(--w11-text);
}
.dropship-jtl-raw {
  color: var(--w11-muted);
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.78rem;
}
.dropship-jtl-val {
  font-weight: 600;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  color: color-mix(in srgb, var(--w11-accent) 35%, var(--w11-text));
}
.dropship-jtl-empty {
  text-align: center;
  color: var(--w11-muted);
  padding: 36px 16px !important;
  line-height: 1.45;
}
.dropship-detail-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
}
.dropship-tabs {
  display: flex;
  gap: 4px;
  padding: 0 2px;
  border-bottom: 1px solid var(--w11-stroke);
}
.dropship-tab {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 8px 12px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  font: inherit;
}
.dropship-tab:hover { color: var(--w11-text); }
.dropship-tab.active {
  color: var(--w11-text);
  border-bottom-color: var(--w11-accent);
  font-weight: 600;
}
.dropship-pane-bar {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.dropship-search-wrap {
  position: relative;
  flex: 1;
  min-width: 200px;
  max-width: 420px;
}
.dropship-search-wrap input[type="search"] {
  width: 100%;
  box-sizing: border-box;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  padding: 6px 32px 6px 10px;
}
.dropship-search-wrap input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}
.dropship-search-clear {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--w11-muted);
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
}
.dropship-search-clear:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-muted) 16%, var(--w11-window-bg));
}
.dropship-art-filters {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.dropship-filter-chip {
  appearance: none;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-muted);
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 0.78rem;
  cursor: pointer;
  line-height: 1.2;
}
.dropship-filter-chip:hover {
  color: var(--w11-text);
  border-color: color-mix(in srgb, var(--w11-accent) 35%, var(--w11-stroke));
}
.dropship-filter-chip.is-on {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  font-weight: 600;
}
.dropship-pane-bar input[type="search"] {
  flex: 1;
  min-width: 180px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  padding: 6px 10px;
}
.dropship-table-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
}
.dropship-data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
}
.dropship-data-table th,
.dropship-data-table td {
  padding: 8px 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  text-align: left;
  color: var(--w11-text);
}
.dropship-data-table th {
  position: sticky;
  top: 0;
  background: color-mix(in srgb, var(--w11-titlebar) 80%, var(--w11-window-bg));
  color: var(--w11-muted);
  font-weight: 600;
  z-index: 1;
}
.dropship-art-table,
.dropship-art-table th,
.dropship-art-table td {
  user-select: none;
  -webkit-user-select: none;
}
.dropship-art-row {
  cursor: default;
}
.dropship-art-row.is-changed td {
  background: color-mix(in srgb, #ffb900 12%, var(--w11-window-bg));
}
.dropship-art-row.status-ok td {
  background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg));
}
.dropship-art-row.status-warn td {
  background: color-mix(in srgb, #ffb900 18%, var(--w11-window-bg));
}
.dropship-art-row.status-err td {
  background: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg));
}
.dropship-art-row.status-ok.is-changed td {
  background: color-mix(in srgb, #107c10 18%, var(--w11-window-bg));
}
.dropship-art-row.status-warn.is-changed td {
  background: color-mix(in srgb, #ffb900 24%, var(--w11-window-bg));
}
.dropship-art-row.status-err.is-changed td {
  background: color-mix(in srgb, #c42b1c 18%, var(--w11-window-bg));
}
.dropship-art-row:hover td {
  filter: brightness(0.985);
}
.dropship-art-row.is-selected td {
  background: color-mix(in srgb, var(--w11-muted) 9%, var(--w11-window-bg)) !important;
  border-top: 1px solid color-mix(in srgb, var(--w11-muted) 45%, var(--w11-stroke));
  border-bottom: 1px solid color-mix(in srgb, var(--w11-muted) 45%, var(--w11-stroke));
  box-shadow: none;
  filter: none;
}
.dropship-art-row.is-selected td:first-child {
  border-left: 2px solid color-mix(in srgb, var(--w11-muted) 55%, var(--w11-stroke));
}
.dropship-art-row.is-selected td:last-child {
  border-right: 2px solid color-mix(in srgb, var(--w11-muted) 55%, var(--w11-stroke));
}
.dropship-art-row.is-selected:hover td {
  filter: none;
}
.dropship-th-aktiv,
.dropship-td-aktiv {
  width: 64px;
  text-align: center;
  vertical-align: middle;
}
.dropship-td-sku,
.dropship-td-ean {
  white-space: nowrap;
  vertical-align: middle;
}
.dropship-copy-wrap {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  max-width: 100%;
  vertical-align: middle;
}
.dropship-sku-main {
  display: inline-block;
  font-variant-numeric: tabular-nums;
  color: var(--w11-text);
}
.dropship-td-sku .dropship-copy-wrap {
  gap: 2px;
}
.dropship-copy-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  flex-shrink: 0;
  opacity: 0;
  pointer-events: none;
}
.dropship-art-row:hover .dropship-copy-btn,
.dropship-art-row.is-selected .dropship-copy-btn {
  opacity: 1;
  pointer-events: auto;
}
.dropship-copy-btn:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-muted) 16%, var(--w11-window-bg));
}
.dropship-jtl-nr {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 7.5rem;
  height: 22px;
  padding: 0 6px;
  margin-left: 8px;
  border-radius: 6px;
  font-size: 0.72rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid transparent;
}
.dropship-jtl-nr.is-known {
  color: color-mix(in srgb, #0b5a0b 80%, var(--w11-text));
  background: color-mix(in srgb, #107c10 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 28%, var(--w11-stroke));
}
.dropship-jtl-nr.is-new {
  color: color-mix(in srgb, #8a5a00 75%, var(--w11-text));
  background: color-mix(in srgb, #ffb900 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #ffb900 32%, var(--w11-stroke));
}
.dropship-art-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  cursor: pointer;
}
.dropship-art-switch.is-disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
.dropship-art-switch.is-disabled .switch-track {
  background: color-mix(in srgb, var(--w11-muted) 28%, var(--w11-window-bg));
}
.dropship-art-switch .switch-track {
  width: 36px;
  height: 20px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-muted) 35%, var(--w11-window-bg));
  position: relative;
  flex-shrink: 0;
  transition: background 0.15s ease;
}
.dropship-art-switch .switch-track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--w11-window-bg);
  box-shadow: 0 1px 2px color-mix(in srgb, #000 25%, transparent);
  transition: transform 0.15s ease;
}
.dropship-art-switch input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.dropship-art-switch input:checked + .switch-track {
  background: color-mix(in srgb, var(--w11-accent) 85%, #107c10);
}
.dropship-art-switch input:checked + .switch-track::after {
  transform: translateX(16px);
}
.dropship-article-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.dropship-article-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
  background: var(--w11-win-body);
  overflow: auto;
}
.dropship-article-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-content: start;
}
.dropship-prop-cell {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
}
.dropship-prop-cell.is-wide {
  grid-column: 1 / -1;
}
.dropship-prop-cell.tone-key {
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-stroke));
}
.dropship-prop-cell.tone-ok {
  background: color-mix(in srgb, #107c10 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 26%, var(--w11-stroke));
}
.dropship-prop-cell.tone-warn {
  background: color-mix(in srgb, #ffb900 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #ffb900 30%, var(--w11-stroke));
}
.dropship-prop-cell.tone-err {
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 26%, var(--w11-stroke));
}
.dropship-prop-cell.tone-new {
  background: color-mix(in srgb, #ffb900 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #ffb900 28%, var(--w11-stroke));
}
.dropship-prop-label {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--w11-muted);
}
.dropship-prop-value {
  font-size: 0.84rem;
  color: var(--w11-text);
  word-break: break-word;
  line-height: 1.3;
}
.dropship-ord-table,
.dropship-ord-table th,
.dropship-ord-table td {
  user-select: none;
  -webkit-user-select: none;
}
.dropship-ord-row { cursor: default; }
.dropship-track-link {
  color: var(--w11-accent);
  text-decoration: none;
  font-weight: 600;
}
.dropship-track-link:hover {
  text-decoration: underline;
}
.dropship-td-track .dropship-copy-wrap {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 8px;
}
.dropship-ord-row:hover td {
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
}
.dropship-order-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px 14px;
  background: var(--w11-win-body);
  overflow: hidden;
}
.dropship-order-meta {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font-size: 0.86rem;
}

/* Lieferant-Einstellungen = Win11 Eigenschaftenblatt (Tabs oben, kein App-Header) */
#acc-dropshipment-supplier .dropship-supplier-shell {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--w11-win-body);
}
#acc-dropshipment-supplier .dropship-supplier-shell > .win-app-toolbar {
  display: none !important;
}
#acc-dropshipment-supplier .dropship-supplier-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: hidden;
  padding: 0;
  background: var(--w11-win-body);
}
#acc-dropshipment-supplier .dropship-sup-tabs.win-sheet-tabs {
  flex-shrink: 0;
  margin: 0;
  padding: 0 12px;
  gap: 2px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
}
#acc-dropshipment-supplier .dropship-sup-tabs .win-sheet-tab {
  padding: 8px 12px 7px;
  font-size: 0.82rem;
}
#acc-dropshipment-supplier .dropship-sup-panes {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 10px 14px 8px;
  display: flex;
  flex-direction: column;
}
#acc-dropshipment-supplier .dropship-sup-pane {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#acc-dropshipment-supplier .dropship-sup-pane[hidden] {
  display: none !important;
}
#acc-dropshipment-supplier .dropship-sup-table {
  width: 100%;
  border-collapse: collapse;
  flex-shrink: 0;
  table-layout: fixed;
}
#acc-dropshipment-supplier .dropship-sup-table th {
  width: 128px;
  padding: 4px 10px 4px 0;
  text-align: left;
  vertical-align: middle;
  font-weight: 400;
  color: var(--w11-muted);
  font-size: 0.78rem;
  white-space: nowrap;
}
#acc-dropshipment-supplier .dropship-sup-table td {
  padding: 4px 0;
  vertical-align: middle;
}
#acc-dropshipment-supplier .dropship-sup-table td input[type="text"],
#acc-dropshipment-supplier .dropship-sup-table td input[type="password"],
#acc-dropshipment-supplier .dropship-sup-table td input[type="number"] {
  width: 100%;
  height: 26px;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 0 8px;
  font: inherit;
  font-size: 0.8rem;
  box-sizing: border-box;
}
#acc-dropshipment-supplier .dropship-sup-table td input:focus {
  border-color: var(--w11-accent);
  outline: none;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-accent) 55%, transparent);
}
#acc-dropshipment-supplier .dropship-proto-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  min-width: 0;
}
#acc-dropshipment-supplier .dropship-test-btn {
  flex: 0 0 auto;
  height: 26px;
  padding: 0 10px;
  font-size: 0.74rem;
  border-radius: 4px;
  white-space: nowrap;
}
#acc-dropshipment-supplier .dropship-inline {
  display: flex;
  align-items: center;
  gap: 8px;
}
#acc-dropshipment-supplier .dropship-inline input {
  width: 88px !important;
  flex: 0 0 auto;
}
#acc-dropshipment-supplier .dropship-seg {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  overflow: hidden;
  background: var(--w11-window-bg);
  flex: 0 1 auto;
  min-width: 0;
}
#acc-dropshipment-supplier .dropship-seg-btn {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 3px 8px;
  font: inherit;
  font-size: 0.74rem;
  font-weight: 550;
  cursor: pointer;
  min-width: 40px;
  height: 24px;
  line-height: 1;
  white-space: nowrap;
}
#acc-dropshipment-supplier [data-ds-seg="profile"] .dropship-seg-btn {
  min-width: 0;
  padding: 3px 9px;
}
#acc-dropshipment-supplier .dropship-seg-btn + .dropship-seg-btn {
  border-left: 1px solid var(--w11-stroke);
}
#acc-dropshipment-supplier .dropship-seg-btn:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 10%, transparent);
}
#acc-dropshipment-supplier .dropship-seg-btn.active {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
}
#acc-dropshipment-supplier .dropship-seg-onoff .dropship-seg-btn {
  min-width: 44px;
}
#acc-dropshipment-supplier .dropship-pwd-wrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
#acc-dropshipment-supplier .dropship-pwd-wrap input {
  padding-right: 34px !important;
}
#acc-dropshipment-supplier .dropship-pwd-eye {
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 22px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  z-index: 1;
}
#acc-dropshipment-supplier .dropship-pwd-eye:hover,
#acc-dropshipment-supplier .dropship-pwd-eye.is-on {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 14%, transparent);
}
#acc-dropshipment-supplier .dropship-assigned-code {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.72rem;
  color: var(--w11-muted);
  background: var(--w11-window-bg);
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  border-radius: 4px;
  padding: 5px 8px;
}
#acc-dropshipment-supplier .dropship-sup-hint {
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.35;
  color: var(--w11-muted);
}
#acc-dropshipment-supplier .dropship-test-out {
  margin: 0;
  max-height: 52px;
  overflow: auto;
  font-size: 0.7rem;
  line-height: 1.3;
  padding: 6px 8px;
  border-radius: 4px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-muted);
  flex-shrink: 0;
}
#acc-dropshipment-supplier .win-app-status {
  flex-shrink: 0;
  min-height: 22px;
  padding: 2px 12px;
  font-size: 0.72rem;
}

.dropship-sup-dot.checking { background: #ffb900; }

.dropship-settings-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--w11-win-body);
}
.dropship-settings-panes {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 12px 14px 14px;
}
.dropship-pane {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
}
.dropship-sup-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  color: var(--w11-muted);
  font-size: 0.8rem;
}
.dropship-sup-wrap {
  flex: 1;
  min-height: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
  overflow: hidden;
}
.dropship-sup-list {
  height: 100%;
  overflow: auto;
  padding: 6px;
}
.dropship-list-empty {
  padding: 36px 16px;
  text-align: center;
  color: var(--w11-muted);
  line-height: 1.45;
}
.dropship-sup-item {
  width: 100%;
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  padding: 10px 10px;
  border-radius: 8px;
  cursor: pointer;
}
.dropship-sup-item:hover { background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)); }
.dropship-sup-item.selected {
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
  outline: 1px solid color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.dropship-sup-item.is-off { opacity: 0.65; }
.dropship-sup-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--w11-muted);
}
.dropship-sup-dot.ok { background: #107c10; }
.dropship-sup-dot.err { background: #c42b1c; }
.dropship-sup-dot.off { background: var(--w11-muted); }
.dropship-sup-text strong { display: block; font-size: 0.9rem; }
.dropship-sup-text small { color: var(--w11-muted); font-size: 0.75rem; }
.dropship-eingang-empty {
  margin: 24px 0;
  text-align: center;
  color: var(--w11-muted);
}
.dropship-in-table th {
  width: 140px;
  color: var(--w11-muted);
}
.dropship-check {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0;
  color: var(--w11-text);
  font-size: 0.86rem;
}
.dropship-assigned-code {
  display: block;
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font-size: 0.8rem;
  word-break: break-all;
}
.dropship-in-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.dropship-test-out {
  margin: 8px 0 0;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.78rem;
  white-space: pre-wrap;
  max-height: 140px;
  overflow: auto;
}
#acc-dropshipment-settings .win-sheet-tabs {
  padding: 0 14px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.w11-win-body #acc-dropshipment-supplier.w11-hosted,
.w11-win-body #acc-dropshipment-assign.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.dropship-supplier-shell,
.dropship-assign-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.dropship-supplier-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  background: var(--w11-win-body);
}
.dropship-assign-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 10px 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--w11-win-body);
}
.dropship-assign-mode {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.dropship-assign-mode-label {
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.dropship-assign-mode .dropship-seg {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  overflow: hidden;
  background: var(--w11-window-bg);
}
.dropship-assign-mode .dropship-seg-btn {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 3px 12px;
  font: inherit;
  font-size: 0.74rem;
  font-weight: 550;
  cursor: pointer;
  height: 24px;
  line-height: 1;
}
.dropship-assign-mode .dropship-seg-btn + .dropship-seg-btn {
  border-left: 1px solid var(--w11-stroke);
}
.dropship-assign-mode .dropship-seg-btn:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 10%, transparent);
}
.dropship-assign-mode .dropship-seg-btn.active {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
}
.dropship-assign-bar {
  display: flex;
  gap: 6px;
  align-items: center;
}
.dropship-assign-path {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 6px 10px;
  font-size: 0.85rem;
}
.dropship-assign-shell > .win-app-toolbar {
  display: none !important;
}
.dropship-assign-list-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
  user-select: none;
  -webkit-user-select: none;
}
.dropship-assign-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
  user-select: none;
  -webkit-user-select: none;
}
.dropship-assign-table th {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
  color: var(--w11-muted);
  font-weight: 600;
  position: sticky;
  top: 0;
}
.dropship-assign-table td {
  padding: 7px 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  color: var(--w11-text);
}
.dropship-assign-row {
  cursor: default;
}
.dropship-assign-row[data-type="dir"] {
  cursor: pointer;
}
.dropship-assign-row[data-type="file"] {
  cursor: pointer;
}
.dropship-assign-row:hover,
.dropship-assign-row.selected,
.dropship-assign-row:active,
.dropship-assign-row:focus {
  background: transparent;
  outline: none;
}
.w11-win-body #acc-dropshipment-map.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.dropship-map-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.dropship-map-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 14px 12px;
  overflow: hidden;
  background:
    radial-gradient(900px 420px at 12% 0%, color-mix(in srgb, var(--w11-accent) 16%, transparent), transparent 60%),
    radial-gradient(700px 380px at 88% 100%, color-mix(in srgb, #107c10 10%, transparent), transparent 55%),
    var(--w11-win-body);
}
.dropship-map-hint {
  margin: 0;
  color: var(--w11-muted);
  font-size: 0.8rem;
}
.dropship-map-stage {
  position: relative;
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(260px, 0.82fr) minmax(520px, 1.4fr);
  gap: 48px;
  padding: 4px 2px;
  overflow: hidden;
}
.dropship-map-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
  overflow: visible;
}
.dropship-map-svg path.dropship-wire {
  fill: none;
  stroke: color-mix(in srgb, var(--w11-accent) 78%, #fff 8%);
  stroke-width: 2.25;
  stroke-linecap: round;
  filter: drop-shadow(0 0 4px color-mix(in srgb, var(--w11-accent) 45%, transparent));
  pointer-events: none;
  transition: stroke 0.15s ease, stroke-width 0.15s ease;
}
.dropship-map-svg path.dropship-wire-draft {
  fill: none;
  stroke: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-muted));
  stroke-width: 2;
  stroke-dasharray: 6 6;
  pointer-events: none;
}
.dropship-map-col {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 14px;
  background: color-mix(in srgb, var(--w11-window-bg) 88%, transparent);
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 28px color-mix(in srgb, #000 18%, transparent);
  overflow: hidden;
}
.dropship-map-col-h {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.dropship-map-col-h strong { color: var(--w11-text); font-size: 0.92rem; }
.dropship-map-col-h small { color: var(--w11-muted); font-size: 0.72rem; margin-left: auto; }
.dropship-map-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
  color: var(--w11-text);
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
}
.dropship-map-add:hover {
  background: color-mix(in srgb, var(--w11-accent) 32%, var(--w11-window-bg));
  border-color: var(--w11-active-border);
}
.dropship-flyout {
  position: fixed;
  z-index: 12000;
  min-width: 260px;
  max-width: 320px;
  max-height: min(70vh, 520px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px;
  border-radius: 10px;
  border: 1px solid var(--w11-win-border);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: 0 12px 32px color-mix(in srgb, #000 28%, transparent);
}
.dropship-flyout-cat,
.dropship-flyout-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 8px 10px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--w11-text);
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.dropship-flyout-cat:hover,
.dropship-flyout-item:hover:not(:disabled) {
  background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg));
}
.dropship-flyout-cat.is-open {
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
}
.dropship-flyout-chevron {
  color: var(--w11-muted);
  font-size: 1.1rem;
}
.dropship-flyout-subpanel {
  position: fixed;
  z-index: 12001;
  min-width: 260px;
  max-width: 380px;
  max-height: min(60vh, 440px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px;
  border-radius: 10px;
  border: 1px solid var(--w11-win-border);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: 0 12px 28px color-mix(in srgb, #000 24%, transparent);
}
.dropship-flyout-item.is-on {
  opacity: 0.55;
  cursor: default;
}
.dropship-flyout-check {
  color: color-mix(in srgb, #107c10 80%, var(--w11-text));
  font-weight: 700;
}
.dropship-flyout-empty {
  padding: 8px 10px;
  color: var(--w11-muted);
  font-size: 0.85rem;
}
.dropship-catalog-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.jtl-tree-ico {
  display: grid;
  place-items: center;
  color: var(--w11-muted);
}
.jtl-tree-handle {
  cursor: grab;
  border-radius: 6px;
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}
.jtl-tree-handle:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, transparent);
  color: var(--w11-accent);
}
.jtl-tree-handle:active,
.jtl-tree-handle.is-dragging {
  cursor: grabbing;
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 22%, transparent);
}
.jtl-tree-node.is-dragging {
  opacity: 0.4;
  pointer-events: none;
}
body.jtl-tree-dragging {
  cursor: grabbing !important;
  user-select: none !important;
}
body.jtl-tree-dragging * {
  cursor: grabbing !important;
}
.jtl-tree-node.is-drag-before {
  box-shadow: inset 0 2px 0 0 var(--w11-accent);
}
.jtl-tree-node.is-drag-after {
  box-shadow: inset 0 -2px 0 0 var(--w11-accent);
}
.jtl-tree-node.is-cat.is-drag-over {
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 55%, transparent);
  outline-offset: -2px;
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
}
.jtl-tree-ico.is-folder {
  color: color-mix(in srgb, var(--w11-accent) 75%, var(--w11-text));
}
.jtl-tree-ico.is-field {
  color: color-mix(in srgb, #107c10 55%, var(--w11-muted));
}
.jtl-tree {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(1200px 480px at 0% 0%, color-mix(in srgb, var(--w11-accent) 10%, transparent), transparent 60%),
    radial-gradient(900px 420px at 100% 100%, color-mix(in srgb, #107c10 8%, transparent), transparent 55%),
    var(--w11-win-body);
  color: var(--w11-text);
  user-select: none;
  -webkit-user-select: none;
}
.jtl-tree-search {
  flex-shrink: 0;
  padding: 10px 14px 6px;
}
.jtl-tree-search input {
  width: 100%;
  box-sizing: border-box;
  height: 34px;
  padding: 0 12px 0 34px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke) !important;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23888' d='M11.7 10.9a5.5 5.5 0 1 0-.8.8l3.2 3.2.8-.8zM6.5 10.5a4 4 0 1 1 0-8 4 4 0 0 1 0 8z'/%3E%3C/svg%3E")
    12px 50% / 14px no-repeat,
    var(--w11-window-bg) !important;
  color: var(--w11-text) !important;
  font: inherit;
  font-size: 0.86rem;
  outline: none;
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 4%, transparent);
}
.jtl-tree-search input:focus {
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--w11-accent) 22%, transparent);
}
.jtl-tree-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 6px 12px 16px;
}
.jtl-tree-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 220px;
  text-align: center;
  color: var(--w11-muted);
  padding: 32px 16px;
}
.jtl-tree-empty-orb {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
  margin-bottom: 4px;
}
.jtl-tree-empty strong {
  color: var(--w11-text);
  font-size: 1rem;
}
.jtl-tree-empty p {
  margin: 0;
  line-height: 1.45;
  font-size: 0.84rem;
}
.jtl-tree-node.is-cat {
  margin: 4px 0;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 85%, transparent);
  background: color-mix(in srgb, var(--w11-window-bg) 88%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent);
  overflow: hidden;
}
.jtl-tree-node.is-cat.is-open {
  border-color: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-window-bg) 94%, var(--w11-accent));
}
.jtl-tree-row {
  display: grid;
  grid-template-columns: 28px 22px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  min-height: 38px;
  padding: 4px 10px 4px 6px;
}
.jtl-tree-node.is-field > .jtl-tree-row {
  grid-template-columns: 28px 22px minmax(0, 1.2fr) minmax(100px, 0.9fr);
  min-height: 34px;
  margin-left: 8px;
  border-radius: 8px;
  position: relative;
}
.jtl-tree-node.is-field > .jtl-tree-row::before {
  content: "";
  position: absolute;
  left: 13px;
  top: -8px;
  bottom: 50%;
  width: 1px;
  background: color-mix(in srgb, var(--w11-stroke) 80%, transparent);
}
.jtl-tree-node.is-field > .jtl-tree-row::after {
  content: "";
  position: absolute;
  left: 13px;
  top: 50%;
  width: 12px;
  height: 1px;
  background: color-mix(in srgb, var(--w11-stroke) 80%, transparent);
}
.jtl-tree-node.is-field:not(.is-last) > .jtl-tree-row::before {
  bottom: -8px;
}
.jtl-tree-node.is-field > .jtl-tree-row:hover {
  background: color-mix(in srgb, var(--w11-highlight) 35%, transparent);
}
.jtl-tree-row.is-cat-row {
  cursor: pointer;
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-window-bg));
  border-bottom: 1px solid transparent;
}
.jtl-tree-node.is-cat.is-open > .jtl-tree-row.is-cat-row {
  border-bottom-color: var(--w11-stroke);
}
.jtl-tree-row.is-cat-row:hover {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-titlebar));
}
.jtl-tree-twist {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--w11-muted);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: transform 0.18s ease, background 0.15s ease, color 0.15s ease;
}
.jtl-tree-twist:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, transparent);
  color: var(--w11-text);
}
.jtl-tree-node.is-cat.is-open > .jtl-tree-row .jtl-tree-twist {
  transform: rotate(90deg);
  color: var(--w11-accent);
}
.jtl-tree-label,
.jtl-tree-id {
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--w11-text) !important;
  font: inherit;
  font-size: 0.88rem;
  padding: 4px 6px;
  border-radius: 6px;
  outline: none;
  user-select: text;
  -webkit-user-select: text;
}
.jtl-tree-label.is-cat {
  font-weight: 650;
  font-size: 0.92rem;
}
.jtl-tree-id {
  font-family: "JetBrains Mono", ui-monospace, Consolas, monospace;
  font-size: 0.72rem;
  color: var(--w11-muted) !important;
  text-align: right;
}
.jtl-tree-label:hover,
.jtl-tree-id:hover {
  border-color: var(--w11-stroke) !important;
  background: color-mix(in srgb, var(--w11-win-body) 70%, transparent) !important;
}
.jtl-tree-label:focus,
.jtl-tree-id:focus {
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke)) !important;
  background: var(--w11-window-bg) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--w11-accent) 18%, transparent);
  color: var(--w11-text) !important;
}
.jtl-tree-badge {
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-win-body) 70%, var(--w11-stroke));
  border: 1px solid var(--w11-stroke);
}
.jtl-tree-children {
  padding: 4px 8px 8px 4px;
  animation: jtl-tree-open 0.18s ease;
}
.jtl-tree-children[hidden] {
  display: none !important;
}
.jtl-tree-node.is-empty .jtl-tree-row {
  font-size: 0.78rem;
  padding-left: 36px;
  min-height: 30px;
}
@keyframes jtl-tree-open {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
body.w11-desktop-mode .w11-win-body .jtl-tree,
body.w11-desktop-mode .w11-win-body .jtl-tree-node.is-cat,
body.w11-desktop-mode .w11-win-body .jtl-tree-scroll {
  color: var(--w11-text) !important;
}
body.w11-desktop-mode .w11-win-body .jtl-tree-label,
body.w11-desktop-mode .w11-win-body .jtl-tree-id,
body.w11-desktop-mode .w11-win-body .jtl-tree-search input {
  color: var(--w11-text) !important;
  background: transparent;
}
body.w11-desktop-mode .w11-win-body .jtl-tree-id {
  color: var(--w11-muted) !important;
}
body.w11-desktop-mode .w11-win-body .jtl-tree-label:focus,
body.w11-desktop-mode .w11-win-body .jtl-tree-id:focus,
body.w11-desktop-mode .w11-win-body .jtl-tree-search input {
  background: var(--w11-window-bg) !important;
}
.dropship-map-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-accent) 35%, var(--w11-stroke));
}
.dropship-map-badge.jtl {
  background: color-mix(in srgb, #107c10 20%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 40%, var(--w11-stroke));
}
.dropship-map-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  user-select: none;
  -webkit-user-select: none;
}
.dropship-map-card {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px 10px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 4%, transparent);
  transition: border-color 0.15s ease, transform 0.15s ease, background 0.15s ease;
  user-select: none;
  -webkit-user-select: none;
}
.dropship-map-card:hover {
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  transform: translateY(-1px);
}
.dropship-map-card.is-linked {
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-win-body));
}
.dropship-map-card.is-active {
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 55%, transparent);
}
.dropship-map-card.is-jtl.is-linked {
  background: color-mix(in srgb, #107c10 12%, var(--w11-win-body));
  border-color: color-mix(in srgb, #107c10 45%, var(--w11-stroke));
}
.dropship-map-jtl-head,
.dropship-map-card.is-jtl {
  display: grid;
  grid-template-columns: 18px minmax(130px, 1.05fr) minmax(130px, 1fr) minmax(120px, 1fr) minmax(180px, 1.55fr);
  gap: 8px 14px;
  align-items: center;
}
.dropship-map-jtl-head {
  padding: 4px 12px 6px;
  color: var(--w11-muted);
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  position: sticky;
  top: 0;
  z-index: 2;
  background: color-mix(in srgb, var(--w11-window-bg) 92%, transparent);
  border-bottom: 1px solid var(--w11-stroke);
  margin: -2px 0 2px;
}
.dropship-map-card.is-jtl {
  grid-template-columns: 18px minmax(130px, 1.05fr) minmax(130px, 1fr) minmax(120px, 1fr) minmax(180px, 1.55fr);
  cursor: grab;
}
.dropship-map-card.is-jtl.is-editing {
  cursor: default;
}
.dropship-map-card.is-jtl.is-editing .dropship-map-col-val {
  overflow: visible;
}
.dropship-map-card.is-jtl.is-drag-over {
  border-top: 2px solid var(--w11-accent);
  border-radius: 4px 12px 12px 12px;
}
.dropship-map-card.is-jtl.is-fixed {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-win-body));
  border-color: color-mix(in srgb, var(--w11-accent) 42%, var(--w11-stroke));
}
.dropship-map-col-filters {
  min-width: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.dropship-map-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 100%;
}
.dropship-map-chip {
  font-size: 0.65rem;
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  color: var(--w11-muted);
  white-space: nowrap;
}
.dropship-map-col-name {
  font-size: 0.88rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.dropship-map-col-src {
  color: var(--w11-muted);
  font-size: 0.78rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.dropship-map-col-val {
  font-style: normal;
  font-size: 0.8rem;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  color: color-mix(in srgb, #107c10 70%, var(--w11-text));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.dropship-map-col-val.is-editable {
  cursor: text;
  border-radius: 4px;
  padding: 2px 4px;
  margin: -2px -4px;
  border: 1px solid transparent;
}
.dropship-map-col-val.is-editable:hover {
  border-color: var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-window-bg) 70%, transparent);
}
.dropship-map-val-placeholder {
  color: var(--w11-muted);
  font-style: italic;
  font-family: inherit;
}
.dropship-map-val-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  font: inherit;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.8rem;
  color: var(--w11-text);
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-accent);
  border-radius: 4px;
  padding: 2px 6px;
  outline: none;
  user-select: text;
  -webkit-user-select: text;
}
.dropship-map-cell.muted {
  color: var(--w11-muted);
  font-size: 0.75rem;
}
.dropship-map-port {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--w11-accent) 70%, var(--w11-stroke));
  background: var(--w11-window-bg);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--w11-accent) 18%, transparent);
  cursor: crosshair;
  flex-shrink: 0;
}
.dropship-map-card.is-jtl .dropship-map-port {
  border-color: color-mix(in srgb, #107c10 70%, var(--w11-stroke));
  box-shadow: 0 0 0 3px color-mix(in srgb, #107c10 16%, transparent);
}
.dropship-filter-pop {
  position: fixed;
  z-index: 10050;
  min-width: 260px;
  max-width: 320px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--w11-win-border);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: 0 16px 40px color-mix(in srgb, #000 35%, transparent);
}
.dropship-filter-pop h4 {
  margin: 0 0 8px;
  font-size: 0.9rem;
}
.dropship-filter-pop label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0;
  font-size: 0.82rem;
}
.dropship-filter-pop input[type="text"] {
  width: 100%;
  margin-top: 4px;
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.dropship-filter-pop .dropship-filter-actions {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  justify-content: flex-end;
}
@media (max-width: 800px) {
  .dropship-map-stage { grid-template-columns: 1fr; gap: 16px; }
}

.w11-win-body #acc-windows-server.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.w11-win-body #acc-windows-server .winsrv-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.winsrv-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 10px 12px 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--w11-win-body);
}
.winsrv-hero {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  flex: 0 0 auto;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  position: relative;
  z-index: 1;
}
.winsrv-hero[data-status="ok"] {
  background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 40%, var(--w11-stroke));
}
.winsrv-hero[data-status="err"] {
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 32%, var(--w11-stroke));
}
.winsrv-hero[data-status="off"] {
  background: color-mix(in srgb, var(--w11-muted) 10%, var(--w11-window-bg));
}
.winsrv-orb {
  width: 56px;
  height: 56px;
  position: relative;
  display: grid;
  place-items: center;
  margin-top: 2px;
}
.winsrv-orb-core {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 1.2rem;
  background: var(--w11-win-body);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  z-index: 2;
}
.winsrv-orb-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--w11-accent) 55%, transparent);
  animation: winsrv-pulse 2.4s ease-out infinite;
  opacity: 0.7;
}
.winsrv-orb-ring.delay { animation-delay: 0.8s; }
.winsrv-hero[data-status="ok"] .winsrv-orb-ring {
  border-color: color-mix(in srgb, #107c10 70%, transparent);
}
.winsrv-hero[data-status="err"] .winsrv-orb-ring {
  border-color: color-mix(in srgb, #c42b1c 70%, transparent);
  animation-duration: 1.4s;
}
@keyframes winsrv-pulse {
  0% { transform: scale(0.72); opacity: 0.7; }
  70% { transform: scale(1.08); opacity: 0; }
  100% { transform: scale(1.08); opacity: 0; }
}
.winsrv-hero-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: var(--w11-text);
}
.winsrv-hero-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.winsrv-kicker {
  margin: 0;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--w11-muted);
  font-weight: 600;
}
.winsrv-hero-main h3 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 650;
  color: var(--w11-text);
  line-height: 1.2;
}
.winsrv-pill {
  flex: 0 0 auto;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-muted);
}
.winsrv-hero[data-status="ok"] .winsrv-pill {
  color: #107c10;
  border-color: color-mix(in srgb, #107c10 40%, var(--w11-stroke));
  background: color-mix(in srgb, #107c10 16%, var(--w11-window-bg));
}
.winsrv-hero[data-status="err"] .winsrv-pill {
  color: #c42b1c;
  border-color: color-mix(in srgb, #c42b1c 40%, var(--w11-stroke));
  background: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg));
}
.winsrv-state {
  margin: 0;
  color: var(--w11-muted);
  font-size: 0.82rem;
  line-height: 1.25;
}
.winsrv-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 2px;
}
.winsrv-chip {
  font-size: 0.7rem;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.winsrv-chip.is-on {
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
}
.winsrv-hero-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px 10px;
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid var(--w11-stroke);
}
.winsrv-hero-meta div {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.winsrv-hero-meta span {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--w11-muted);
}
.winsrv-hero-meta strong {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--w11-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.winsrv-grid {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 10px;
  overflow: hidden;
}
.winsrv-card {
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.winsrv-card-h {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  flex: 0 0 auto;
}
.winsrv-card-h strong {
  font-size: 0.9rem;
  color: var(--w11-text);
}
.winsrv-card-h small {
  color: var(--w11-muted);
  font-size: 0.72rem;
}
.winsrv-form {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
}
.winsrv-table th {
  width: 120px;
  color: var(--w11-muted);
  padding: 4px 8px 4px 0 !important;
  font-size: 0.8rem;
  vertical-align: middle;
}
.winsrv-table td {
  padding: 4px 0 !important;
}
.winsrv-table td input,
.winsrv-table td select {
  width: 100%;
  box-sizing: border-box;
  padding: 5px 8px;
  font-size: 0.84rem;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.winsrv-actions {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 0 0 auto;
}
.winsrv-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--w11-text);
  font-size: 0.82rem;
}
.winsrv-secure-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-height: 0;
}
.winsrv-secure-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8rem;
  color: var(--w11-muted);
  padding: 7px 9px;
  border-radius: 8px;
  background: var(--w11-win-body);
  border: 1px solid var(--w11-stroke);
}
.winsrv-secure-list li.is-on {
  color: var(--w11-text);
  background: color-mix(in srgb, #107c10 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 30%, var(--w11-stroke));
}
.winsrv-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--w11-muted) 50%, transparent);
  flex: 0 0 auto;
}
.winsrv-secure-list li.is-on .winsrv-dot {
  background: #107c10;
  box-shadow: 0 0 0 3px color-mix(in srgb, #107c10 25%, transparent);
}
.winsrv-hint {
  margin: 0;
  font-size: 0.74rem;
  line-height: 1.3;
  color: var(--w11-muted);
  flex: 0 0 auto;
}
@media (max-width: 860px) {
  .winsrv-hero-meta { grid-template-columns: 1fr 1fr; }
  .winsrv-grid { grid-template-columns: 1fr; }
}

.w11-win-body #acc-users.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body, var(--surface, #fff));
}
.w11-win-body #acc-users .users-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body, var(--surface, #fff)) !important;
  color: var(--w11-text, var(--text, #1a1a1a));
}
.users-list-wrap {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--w11-bg, #f3f3f3);
}
.users-list-h {
  padding: 10px 14px 8px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--w11-muted, #666);
  background: var(--w11-win-body, #fff);
  border-bottom: 1px solid var(--w11-border, #eee);
  flex-shrink: 0;
}
.users-list {
  flex: 1;
  overflow: auto;
  padding: 8px;
  background: var(--w11-win-body, #fff);
}
.users-empty {
  padding: 28px 16px;
  font-size: 0.84rem;
  color: var(--w11-muted, #666);
  line-height: 1.45;
  text-align: center;
}
.users-item {
  appearance: none;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  color: inherit;
  padding: 10px 12px;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  margin-bottom: 2px;
}
.users-item:hover {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 12%, transparent);
}
.users-item.selected {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 22%, transparent);
  border-color: color-mix(in srgb, var(--w11-accent, #0078d4) 45%, transparent);
}
.users-item.disabled-conn {
  opacity: 0.55;
}
.users-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: 0 0 auto;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-text) 12%, transparent);
}
.users-dot.ok {
  background: #16a34a;
  box-shadow: 0 0 0 2px color-mix(in srgb, #16a34a 28%, transparent);
}
.users-dot.off {
  background: #9ca3af;
}
.users-item-ico {
  flex: 0 0 auto;
  font-size: 1.15rem;
}
.users-item-text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.users-item-text strong {
  font-size: 0.88rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.users-item-text small {
  font-size: 0.74rem;
  color: var(--w11-muted, #666);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.w11-win-body #acc-mssql.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body, var(--surface, #fff));
}
.w11-win-body #acc-api-bindings.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.w11-win-body #acc-mssql .mssql-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body, var(--surface, #fff)) !important;
  color: var(--w11-text, var(--text, #1a1a1a));
}
.w11-win-body #acc-api-bindings .apibind-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
}
.w11-win-body #acc-system.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.w11-win-body #acc-system .sysinfo-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
}
.sysinfo-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 16px 20px 24px;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.sysinfo-loading {
  padding: 32px 12px;
  text-align: center;
  color: var(--w11-muted);
}
.sysinfo-loading.err { color: #e81123; }
.sysinfo-hero {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  margin-bottom: 14px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  color: var(--w11-text);
}
.sysinfo-pc {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  font-size: 2.4rem;
  background: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
  border-radius: 8px;
  flex-shrink: 0;
}
.sysinfo-hero-text h2 {
  margin: 0 0 4px;
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--w11-text);
}
.sysinfo-edition {
  margin: 0;
  font-size: 0.95rem;
  color: var(--w11-text);
}
.sysinfo-update {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 14px 16px;
  margin-bottom: 14px;
  border-radius: 4px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
}
.sysinfo-update.ok {
  border-color: color-mix(in srgb, #107c10 55%, var(--w11-stroke));
  background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg));
}
.sysinfo-update.has-updates {
  border-color: color-mix(in srgb, #c27d0e 55%, var(--w11-stroke));
  background: color-mix(in srgb, #c27d0e 16%, var(--w11-window-bg));
}
.sysinfo-update.has-release {
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.sysinfo-update-ico {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1rem;
  flex-shrink: 0;
  background: color-mix(in srgb, var(--w11-text) 12%, var(--w11-window-bg));
  color: var(--w11-text);
}
.sysinfo-update.ok .sysinfo-update-ico { background: #107c10; color: #fff; }
.sysinfo-update.has-updates .sysinfo-update-ico { background: #c27d0e; color: #fff; }
.sysinfo-update.has-release .sysinfo-update-ico {
  background: var(--w11-accent);
  color: var(--w11-highlight-fg, #fff);
}
.sysinfo-update-text { flex: 1; min-width: 0; }
.sysinfo-update-text strong {
  display: block;
  margin-bottom: 4px;
  font-size: 0.95rem;
  color: var(--w11-text);
}
.sysinfo-update-text p { margin: 0 0 6px; font-size: 0.85rem; color: var(--w11-muted); }
.sysinfo-update-text .muted { color: var(--w11-muted); font-size: 0.8rem; }
.sysinfo-err { color: #e81123 !important; }
.sysinfo-upd-list {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  max-height: 140px;
  overflow: auto;
  font-size: 0.8rem;
  color: var(--w11-text);
}
.sysinfo-upd-list li {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 3px 0;
  border-bottom: 1px solid var(--w11-stroke);
}
.sysinfo-upd-list li span { color: var(--w11-muted); white-space: nowrap; }
.sysinfo-update-actions { flex-shrink: 0; align-self: center; }
.sysinfo-card {
  margin-bottom: 14px;
  padding: 14px 16px 16px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  color: var(--w11-text);
}
.sysinfo-card h3 {
  margin: 0 0 12px;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--w11-accent);
  border-bottom: 1px solid var(--w11-stroke);
  padding-bottom: 8px;
}
.sysinfo-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.86rem;
}
.sysinfo-table th {
  width: 38%;
  max-width: 180px;
  text-align: left;
  vertical-align: top;
  padding: 8px 12px 8px 0;
  font-weight: 600;
  color: var(--w11-muted);
}
.sysinfo-table td {
  padding: 8px 0;
  vertical-align: top;
  color: var(--w11-text);
}
.sysinfo-table .muted { color: var(--w11-muted); font-size: 0.8rem; }
.sysinfo-disk {
  margin-bottom: 12px;
  color: var(--w11-text);
}
.sysinfo-disk:last-child { margin-bottom: 0; }
.sysinfo-disk strong { display: block; font-size: 0.86rem; color: var(--w11-text); }
.sysinfo-disk > span { font-size: 0.8rem; color: var(--w11-muted); }
.sysinfo-bar {
  margin-top: 6px;
  height: 8px;
  background: color-mix(in srgb, var(--w11-text) 14%, var(--w11-window-bg));
  border-radius: 4px;
  overflow: hidden;
}
.sysinfo-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--w11-accent) 70%, #fff),
    var(--w11-accent)
  );
  border-radius: 4px;
}
.sysinfo-ifaces {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.86rem;
  color: var(--w11-text);
}
.sysinfo-ifaces li {
  padding: 6px 0;
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.sysinfo-ifaces li:last-child { border-bottom: 0; }
.sysinfo-ifaces .muted { color: var(--w11-muted); }
.mssql-list-wrap {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--w11-win-body);
}
.mssql-list-h {
  padding: 10px 14px 8px;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--w11-muted, #666);
  background: var(--w11-win-body, #fff);
  border-bottom: 1px solid var(--w11-border, #eee);
  flex-shrink: 0;
}
.mssql-list {
  flex: 1;
  overflow: auto;
  padding: 8px;
  background: var(--w11-win-body, #fff);
}
.mssql-empty {
  padding: 28px 16px;
  font-size: 0.84rem;
  color: var(--w11-muted, #666);
  line-height: 1.45;
  text-align: center;
}
.mssql-item {
  appearance: none;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  color: inherit;
  padding: 10px 12px;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  margin-bottom: 2px;
}
.mssql-item:hover {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 12%, transparent);
}
.mssql-item.selected {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 22%, transparent);
  border-color: color-mix(in srgb, var(--w11-accent, #0078d4) 45%, transparent);
}
.mssql-item.disabled-conn {
  opacity: 0.55;
}
.mssql-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: 0 0 auto;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-text) 12%, transparent);
}
.mssql-dot.ok {
  background: #16a34a;
  box-shadow: 0 0 0 2px color-mix(in srgb, #16a34a 28%, transparent);
}
.mssql-dot.err {
  background: #dc2626;
  box-shadow: 0 0 0 2px color-mix(in srgb, #dc2626 28%, transparent);
}
.mssql-dot.off {
  background: #9ca3af;
}
.mssql-item-ico {
  flex: 0 0 auto;
  font-size: 1.15rem;
}
.mssql-item-text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mssql-item-text strong {
  font-size: 0.88rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mssql-item-text small {
  font-size: 0.74rem;
  color: var(--w11-muted, #666);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mssql-item-text .mssql-item-ver {
  font-size: 0.7rem;
  color: color-mix(in srgb, var(--w11-muted, #666) 80%, var(--w11-accent, #60cdff));
}
.mssql-props-ico {
  display: grid;
  place-items: center;
  font-size: 1.45rem;
  background: linear-gradient(160deg, #cce0f5, #0078d4);
  color: #fff;
}
.w11-win-body #acc-mssql-props.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  overflow: hidden !important;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.w11-win-body #acc-weitere-zugaenge-props.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  overflow: hidden !important;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.wz-pass-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.wz-pass-row input {
  flex: 1 1 auto;
  min-width: 0;
}
.wz-pass-row .win-sheet-btn {
  flex: 0 0 auto;
  white-space: nowrap;
}
.w11-win-body #acc-api-bindings-props.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  overflow: hidden !important;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
#acc-api-bindings-props .apibind-props-shell,
#acc-api-bindings-props .apibind-props-form {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--w11-win-body);
}
#acc-api-bindings-props .apibind-props-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 12px 16px 28px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#acc-api-bindings-props .apibind-check24-bridge-card {
  flex-shrink: 0;
  margin-bottom: 8px;
}
#acc-api-bindings-props .apibind-props-hero {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke, rgba(120, 150, 210, 0.22));
  background: color-mix(in srgb, var(--w11-window-bg, #1a1a1a) 92%, transparent);
}
#acc-api-bindings-props .apibind-props-hero-ico {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 18%, var(--w11-window-bg, #222));
  flex-shrink: 0;
}
#acc-api-bindings-props .apibind-props-hero-main {
  flex: 1;
  min-width: 0;
}
#acc-api-bindings-props .apibind-props-name {
  width: 100%;
  border: none;
  background: transparent;
  color: var(--w11-text);
  font-size: 16px;
  font-weight: 700;
  padding: 0;
  outline: none;
}
#acc-api-bindings-props .apibind-props-meta {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--w11-muted);
}
#acc-api-bindings-props .apibind-props-grid {
  flex: 0 0 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  align-items: start;
  overflow: visible;
}
/* Check24: Allgemein | Zugang oben, Bridge darunter volle Breite */
#acc-api-bindings-props .apibind-props-grid:has(.apibind-check24-only:not([hidden])) {
  grid-template-columns: 1fr 1fr;
}
#acc-api-bindings-props .apibind-check24-bridge-card:not([hidden]) {
  grid-column: 1 / -1;
}
#acc-api-bindings-props .apibind-c24-bridge-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
  align-items: start;
}
#acc-api-bindings-props .apibind-c24-bridge-grid .apibind-field {
  min-width: 0;
}
#acc-api-bindings-props #apibind-c24-poll-access-wrap .apibind-hint {
  font-size: 11px;
  line-height: 1.35;
}
#acc-api-bindings-props .apibind-card {
  min-height: 0;
  height: auto;
  overflow: visible;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke, rgba(120, 150, 210, 0.22));
  background: var(--w11-window-bg, rgba(10, 16, 32, 0.45));
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
#acc-api-bindings-props .apibind-card-title {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--w11-muted);
}
#acc-api-bindings-props .apibind-card-sub {
  margin: 6px 0 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--w11-text);
}
#acc-api-bindings-props .apibind-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
}
#acc-api-bindings-props .apibind-field > span,
#acc-api-bindings-props .apibind-check > span {
  font-size: 11px;
  color: var(--w11-muted);
}
#acc-api-bindings-props .apibind-field input,
#acc-api-bindings-props .apibind-field select {
  width: 100%;
  box-sizing: border-box;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke, rgba(120, 150, 210, 0.28));
  background: color-mix(in srgb, var(--w11-win-body, #111) 88%, transparent);
  color: var(--w11-text);
  padding: 6px 10px;
  font-size: 13px;
  height: 32px;
}
#acc-api-bindings-props .apibind-field-inline {
  display: flex;
  gap: 6px;
  align-items: center;
}
#acc-api-bindings-props .apibind-field-inline select {
  flex: 1;
}
#acc-api-bindings-props .apibind-check {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 12px;
  color: var(--w11-text);
}
#acc-api-bindings-props .apibind-host-row {
  display: grid;
  grid-template-columns: 1fr 88px auto;
  gap: 8px;
  align-items: end;
}
#acc-api-bindings-props .apibind-host-row .port input {
  text-align: center;
}
#acc-api-bindings-props .apibind-host-row .https {
  padding-bottom: 8px;
  white-space: nowrap;
}
#acc-api-bindings-props .apibind-ep-preview {
  margin: 0;
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px;
  color: var(--w11-muted);
  word-break: break-all;
  line-height: 1.35;
}
#acc-api-bindings-props .apibind-hint {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: var(--w11-muted);
}
#acc-api-bindings-props .apibind-ups-mode {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  width: 100%;
}
#acc-api-bindings-props .apibind-ups-mode-btn {
  box-sizing: border-box;
  width: 100%;
  min-height: 36px;
  height: 36px;
  margin: 0;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke, rgba(120, 150, 210, 0.28));
  background: var(--w11-window-bg, var(--w11-win-body));
  color: var(--w11-text);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
}
#acc-api-bindings-props .apibind-ups-mode-btn:hover {
  border-color: color-mix(in srgb, var(--w11-accent, #0078d4) 55%, var(--w11-stroke));
}
#acc-api-bindings-props .apibind-ups-mode-btn.is-active {
  border-color: var(--w11-accent, #0078d4);
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 18%, var(--w11-window-bg, var(--w11-win-body)));
  color: var(--w11-text);
  outline: 2px solid color-mix(in srgb, var(--w11-accent, #0078d4) 35%, transparent);
  outline-offset: 0;
}
#acc-api-bindings-props .apibind-label-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
#acc-api-bindings-props .apibind-help-btn {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid var(--w11-stroke, rgba(120, 150, 210, 0.35));
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 16%, var(--w11-window-bg));
  color: var(--w11-text);
  font: 600 13px/1 "Segoe UI", system-ui, sans-serif;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
#acc-api-bindings-props .apibind-help-btn:hover {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 28%, var(--w11-window-bg));
}
#acc-api-bindings-props .apibind-help-pop {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, #000 42%, transparent);
  padding: 16px;
}
#acc-api-bindings-props .apibind-help-pop[hidden] {
  display: none !important;
}
#acc-api-bindings-props .apibind-help-pop-card {
  width: min(520px, 94vw);
  max-height: min(70vh, 560px);
  overflow: auto;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  padding: 12px 14px 14px;
}
#acc-api-bindings-props .apibind-help-pop-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
#acc-api-bindings-props .apibind-help-close {
  border: none;
  background: transparent;
  color: var(--w11-muted);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
}
#acc-api-bindings-props .apibind-jtl-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
#acc-api-bindings-props .apibind-jtl-onprem-block,
#acc-api-bindings-props .apibind-jtl-reg {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 2px;
  padding-top: 6px;
  border-top: 1px solid var(--w11-stroke, rgba(120, 150, 210, 0.18));
  flex-shrink: 0;
}
#acc-api-bindings-props .apibind-jtl-onprem-only[hidden],
#acc-api-bindings-props .apibind-jtl-only[hidden],
#acc-api-bindings-props .apibind-jtl-cloud-only[hidden],
#acc-api-bindings-props .apibind-onemin-only[hidden],
#acc-api-bindings-props .apibind-marketplace-only[hidden],
#acc-api-bindings-props .apibind-marketplace-cred[hidden],
#acc-api-bindings-props .apibind-scopes-row[hidden],
#acc-api-bindings-props .apibind-jtl-reg[hidden] {
  display: none !important;
}
#acc-api-bindings-props .apibind-props-footer {
  flex-shrink: 0;
  padding: 10px 16px 12px;
  border-top: 1px solid var(--w11-stroke, rgba(120, 150, 210, 0.18));
}
#acc-api-bindings-props .form-error {
  flex-shrink: 0;
  margin: 0;
}
.mssql-dot.ready {
  background: #f59e0b;
  box-shadow: 0 0 0 2px color-mix(in srgb, #f59e0b 28%, transparent);
}
.mssql-dot.pending {
  background: #f59e0b;
  box-shadow: 0 0 0 2px color-mix(in srgb, #f59e0b 28%, transparent);
  animation: apibind-pulse 1.4s ease-in-out infinite;
}
@keyframes apibind-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}
#acc-api-bindings-props .mssql-props-shell,
#acc-api-bindings-props .dlg-form {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#acc-api-bindings-props .win-sheet-tabs {
  flex-shrink: 0;
}
#acc-api-bindings-props .win-sheet-footer {
  flex-shrink: 0;
}
#acc-api-bindings-props .mssql-props-body {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 10px 14px 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: var(--w11-win-body);
}
#acc-api-bindings-props .win-sheet-pane {
  flex: 0 0 auto;
  overflow: visible;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#acc-api-bindings-props .win-sheet-identity {
  flex-shrink: 0;
}
#acc-api-bindings-props .win-sheet-rule {
  flex-shrink: 0;
  margin: 4px 0 2px;
}
#acc-api-bindings-props .mssql-props-dl {
  margin: 0;
  flex-shrink: 0;
}
#acc-api-bindings-props .mssql-props-table {
  flex-shrink: 0;
}
#acc-api-bindings-props .apibind-jtl-host-table {
  margin: 8px 0 4px;
}
#acc-api-bindings-props .apibind-jtl-port-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
#acc-api-bindings-props .apibind-jtl-port-cell input[type="number"] {
  width: 96px;
  flex: 0 0 auto;
}
#acc-api-bindings-props .apibind-jtl-https {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--w11-muted, #6b7280);
  white-space: nowrap;
}
#acc-api-bindings-props .apibind-jtl-ep-preview {
  display: block;
  margin: 0;
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px;
  word-break: break-all;
  color: var(--w11-muted, #6b7280);
}
#acc-api-bindings .win-app-toolbar .win-app-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
#acc-api-bindings .win-app-btn.primary {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 88%, transparent);
  color: #fff;
  border-color: color-mix(in srgb, var(--w11-accent, #0078d4) 70%, var(--w11-stroke, #ccc));
}
#acc-api-bindings-props .apibind-jtl-reg,
#acc-api-bindings-props .win-sheet-hint,
#acc-api-bindings-props .mssql-props-hint {
  flex-shrink: 0;
}
#acc-api-bindings-props .win-sheet-pane[hidden] {
  display: none !important;
}
#acc-api-bindings-props .mssql-props-table {
  width: 100%;
  border-collapse: collapse;
}
#acc-api-bindings-props .mssql-props-table th {
  width: 132px;
  padding: 5px 10px 5px 0;
  text-align: left;
  vertical-align: middle;
  font-weight: 400;
  color: var(--w11-muted);
  font-size: 0.8rem;
  white-space: nowrap;
}
#acc-api-bindings-props .mssql-props-table td {
  padding: 5px 0;
  vertical-align: middle;
}
#acc-api-bindings-props .mssql-props-table td input,
#acc-api-bindings-props .mssql-props-table td select {
  width: 100%;
  height: 28px;
  border: 1px solid var(--w11-stroke);
  border-radius: 3px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  padding: 0 8px;
  font: inherit;
  font-size: 0.82rem;
  box-sizing: border-box;
}
#acc-api-bindings-props .mssql-props-table td input:focus,
#acc-api-bindings-props .mssql-props-table td select:focus {
  border-color: var(--w11-accent);
  outline: none;
  box-shadow: 0 0 0 1px var(--w11-accent);
}
#acc-api-bindings-props .mssql-props-table td:has(#apibind-props-api-version) {
  display: flex;
  align-items: center;
  gap: 6px;
}
#acc-api-bindings-props .mssql-props-table td:has(#apibind-props-api-version) select {
  flex: 1;
  min-width: 0;
}
#acc-api-bindings-props .apibind-ver-refresh {
  flex-shrink: 0;
  min-width: 32px;
  height: 28px;
  padding: 0 8px;
}
#acc-api-bindings-props .apibind-scopes-all {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  font-size: 0.78rem;
  color: var(--w11-muted);
  cursor: pointer;
}
#acc-api-bindings-props .apibind-scopes-all input {
  width: auto;
  height: auto;
}
#acc-api-bindings-props .apibind-jtl-reg {
  margin-top: 2px;
  padding: 6px 0 0;
  border: none;
  border-radius: 0;
  background: transparent;
}
#acc-api-bindings-props .apibind-jtl-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}
#acc-api-bindings-props .win-sheet-hint,
#acc-api-bindings-props .mssql-props-hint {
  margin: 4px 0 0;
  font-size: 0.74rem;
  line-height: 1.35;
  color: var(--w11-muted);
}
#acc-api-bindings-props .dlg-footer-spacer {
  flex: 1;
}
#acc-mssql-props .mssql-props-shell,
#acc-mssql-props .dlg-form {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#acc-mssql-props .win-sheet-tabs {
  flex-shrink: 0;
}
#acc-mssql-props .mssql-props-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 12px 16px 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--w11-win-body);
}
#acc-mssql-props .win-sheet-pane {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#acc-mssql-props .win-sheet-pane[hidden] {
  display: none !important;
}
#acc-mssql-props .win-sheet-identity {
  flex-shrink: 0;
  gap: 12px;
}
#acc-mssql-props .win-sheet-rule {
  margin: 4px 0 2px;
}
#acc-mssql-props .mssql-props-dl {
  margin: 0;
  flex-shrink: 0;
}
#acc-mssql-props .mssql-props-dl > div {
  padding: 4px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
}
#acc-mssql-props .mssql-props-dl dt {
  min-width: 88px;
  color: var(--w11-muted);
}
#acc-mssql-props .mssql-props-dl dd {
  color: var(--w11-text);
  font-size: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#acc-mssql-props .mssql-props-table {
  width: 100%;
  border-collapse: collapse;
  flex-shrink: 0;
}
#acc-mssql-props .mssql-props-table th {
  width: 132px;
  padding: 5px 10px 5px 0;
  text-align: left;
  vertical-align: middle;
  font-weight: 400;
  color: var(--w11-muted);
  font-size: 0.8rem;
  white-space: nowrap;
}
#acc-mssql-props .mssql-props-table td {
  padding: 5px 0;
  vertical-align: middle;
}
#acc-mssql-props .mssql-props-table td input,
#acc-mssql-props .mssql-props-table td select {
  width: 100%;
  height: 28px;
  border: 1px solid var(--w11-border-strong, #8a8886);
  border-radius: 3px;
  background: var(--w11-win-body, #fff);
  color: var(--w11-text, #1a1a1a);
  padding: 0 8px;
  font: inherit;
  font-size: 0.82rem;
  box-sizing: border-box;
}
#acc-mssql-props .mssql-props-table td input:focus,
#acc-mssql-props .mssql-props-table td select:focus {
  border-color: var(--w11-accent, #0078d4);
  outline: none;
  box-shadow: 0 0 0 1px var(--w11-accent, #0078d4);
}
#acc-mssql-props .mssql-props-hint {
  margin: 4px 0 0;
  font-size: 0.74rem;
  line-height: 1.35;
}
#acc-mssql-props .form-error {
  margin: 0;
  flex-shrink: 0;
  font-size: 0.78rem;
}
#acc-mssql-props .dlg-footer-spacer {
  flex: 1;
}
#acc-mssql-props .win-sheet-footer {
  flex-shrink: 0;
}
.cert-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 12px 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
/* Windows-Zertifikat „Allgemein“-Fläche */
.cert-general {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 12px 14px 10px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  overflow: auto;
}
.cert-general.is-editing {
  outline: 1px solid color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
}
.cert-general-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.cert-general-ico {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
}
.cert-general-title {
  flex: 1;
  min-width: 0;
}
.cert-general-title strong {
  display: block;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--w11-text);
  margin-bottom: 4px;
}
.cert-general-msg {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.35;
  font-weight: 600;
  color: var(--w11-text);
}
.cert-general-msg.is-ok {
  color: color-mix(in srgb, #107c10 70%, var(--w11-text));
}
.cert-general-msg.is-warn {
  color: color-mix(in srgb, #c27d0e 75%, var(--w11-text));
}
.cert-general-rule {
  border: 0;
  border-top: 1px solid var(--w11-stroke);
  margin: 6px 0 10px;
}
.cert-general-fields {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cert-field {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 26px;
}
.cert-field dt {
  margin: 0;
  font-size: 0.8rem;
  color: var(--w11-muted);
  font-weight: 400;
}
.cert-field dd {
  margin: 0;
  font-size: 0.86rem;
  color: var(--w11-text);
  word-break: break-all;
  min-width: 0;
}
.cert-field .cert-view {
  display: inline;
}
.cert-edit-input {
  width: 100%;
  box-sizing: border-box;
  height: 24px;
  padding: 2px 6px;
  border: 1px solid var(--w11-stroke);
  border-radius: 0;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font: inherit;
  font-size: 0.86rem;
}
.cert-edit-input:focus {
  outline: 1px solid var(--w11-accent);
  border-color: var(--w11-accent);
}
.cert-general:not(.is-editing) .cert-edit-input { display: none !important; }
.cert-general.is-editing .cert-field[data-cert-field] .cert-view { display: none !important; }
.cert-general.is-editing .cert-field[data-cert-field] .cert-edit-input { display: block !important; }
.cert-key-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 14px 0 0;
  font-size: 0.8rem;
  line-height: 1.35;
  color: var(--w11-text);
}
.cert-key-ico {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  background-color: color-mix(in srgb, #c9a227 80%, var(--w11-accent));
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M9.5 2a3.5 3.5 0 0 0-3.37 4.45L1 11.58V14h2.5v-1.5H5V11h1.5V9.5l.55-.55A3.5 3.5 0 1 0 9.5 2zm0 2a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M9.5 2a3.5 3.5 0 0 0-3.37 4.45L1 11.58V14h2.5v-1.5H5V11h1.5V9.5l.55-.55A3.5 3.5 0 1 0 9.5 2zm0 2a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.cert-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
  flex-shrink: 0;
  padding: 2px 0 0;
}
.cert-actions-spacer { flex: 1; min-width: 8px; }
.cert-actions .win-sheet-btn {
  flex: 0 0 auto;
  min-width: 88px;
}
.cert-error {
  flex-shrink: 0;
  margin: 0;
  font-size: 0.78rem;
}
.cert-statusbar.win-app-status {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 22px;
  padding: 3px 10px;
  background: var(--w11-titlebar);
  border-top: 1px solid var(--w11-stroke);
  color: var(--w11-muted);
  font-size: 0.75rem;
}
.cert-statusbar .cert-sb-sep {
  width: 1px;
  align-self: stretch;
  margin: 2px 2px;
  background: var(--w11-stroke);
  flex-shrink: 0;
}
.cert-statusbar .cert-sb-main {
  color: var(--w11-text);
  white-space: nowrap;
}
.cert-statusbar .cert-sb-detail {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sec-layout {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  background:
    radial-gradient(1200px 420px at -10% -20%, color-mix(in srgb, var(--w11-accent) 14%, transparent), transparent 60%),
    radial-gradient(900px 380px at 110% 0%, color-mix(in srgb, #16a34a 10%, transparent), transparent 55%),
    var(--w11-win-body);
}
.sec-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 10px;
  border-right: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 72%, var(--w11-win-body));
  overflow: auto;
  scrollbar-width: thin;
}
.sec-nav-item {
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  color: var(--w11-text);
  text-align: left;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border-radius: 10px;
  cursor: pointer;
  font: inherit;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.sec-nav-item:hover {
  background: color-mix(in srgb, var(--w11-highlight) 40%, var(--w11-window-bg));
}
.sec-nav-item.active {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
  box-shadow: inset 3px 0 0 var(--w11-accent);
}
.sec-nav-ico,
.sec-pane-hero-ico,
.sec-card-ico {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  font-size: 1.05rem;
  background: linear-gradient(160deg, #b8e0c8, #3d8f5f);
  border: 1px solid color-mix(in srgb, #8ec9a5 70%, var(--w11-stroke));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 28%, transparent);
}
.sec-nav-ico.tone-net,
.sec-pane-hero-ico.tone-net,
.sec-card-ico.tone-net {
  background: linear-gradient(160deg, #9ed0ff, #2f6fbf);
  border-color: color-mix(in srgb, #6e9cc8 70%, var(--w11-stroke));
}
.sec-nav-ico.tone-lock,
.sec-pane-hero-ico.tone-lock,
.sec-card-ico.tone-lock {
  background: linear-gradient(160deg, #ffd0a8, #d18b2c);
  border-color: color-mix(in srgb, #e0a86a 70%, var(--w11-stroke));
}
.sec-nav-ico.tone-ssh,
.sec-pane-hero-ico.tone-ssh,
.sec-card-ico.tone-ssh {
  background: linear-gradient(160deg, #c9b8f0, #6b4fbf);
  border-color: color-mix(in srgb, #9a7fd4 70%, var(--w11-stroke));
}
.sec-nav-ico.tone-ports,
.sec-pane-hero-ico.tone-ports,
.sec-card-ico.tone-ports {
  background: linear-gradient(160deg, #9ad7e8, #2a7f99);
  border-color: color-mix(in srgb, #5eafc4 70%, var(--w11-stroke));
}
.sec-nav-ico.tone-geo,
.sec-pane-hero-ico.tone-geo {
  background: linear-gradient(160deg, #f6d58a, #c9851a);
  border-color: color-mix(in srgb, #e0b45a 70%, var(--w11-stroke));
}
.sec-nav-text {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.sec-nav-text strong {
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1.2;
}
.sec-nav-text small {
  font-size: 0.68rem;
  color: var(--w11-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sec-main {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: 16px 18px 18px;
  scrollbar-width: thin;
}
.sec-form {
  display: contents;
}
.sec-pane {
  display: none;
  animation: sec-pane-in 0.22s ease;
}
.sec-pane.active {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100%;
}
@keyframes sec-pane-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.sec-pane-hero {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg)),
      var(--w11-window-bg) 55%
    );
  box-shadow: 0 10px 28px color-mix(in srgb, var(--w11-accent) 8%, transparent);
}
.sec-pane-hero-ico {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  font-size: 1.35rem;
}
.sec-pane-hero > div {
  flex: 1;
  min-width: 0;
}
.sec-pane-hero h3 {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--w11-text);
}
.sec-pane-hero p {
  margin: 3px 0 0;
  font-size: 0.8rem;
  color: var(--w11-muted);
  line-height: 1.35;
}
.sec-pane-hero .win-app-btn {
  flex-shrink: 0;
}
.sec-card {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  padding: 10px 0 12px;
  min-height: 0;
  color: var(--w11-text);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 6%, transparent);
}
.sec-card-solo {
  flex: 1;
}
.sec-card-list {
  padding-bottom: 6px;
}
.sec-card-h {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px 6px;
}
.sec-card-h > div { flex: 1; min-width: 0; }
.sec-card-h strong { display: block; color: var(--w11-text); font-size: 0.86rem; font-weight: 600; }
.sec-card-h small { display: block; color: var(--w11-muted); font-size: 0.72rem; margin-top: 1px; }
.sec-row.switch {
  display: flex; align-items: center; gap: 10px;
  margin: 2px 12px 8px;
  padding: 8px 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: color-mix(in srgb, var(--w11-titlebar) 35%, var(--w11-window-bg));
  color: var(--w11-text);
}
.sec-row-text { flex: 1; min-width: 0; }
.sec-row-text strong { display: block; color: var(--w11-text); font-size: 0.82rem; }
.sec-row-text small { display: block; color: var(--w11-muted); font-size: 0.7rem; margin-top: 1px; }
.sec-row.switch .switch-track { margin-left: auto; flex-shrink: 0; }
.sec-table {
  margin: 0 12px;
  width: calc(100% - 24px);
}
.sec-table th {
  width: 42%; color: var(--w11-text) !important; font-weight: 500;
  vertical-align: middle; padding: 6px 8px 6px 0; font-size: 0.78rem;
}
.sec-table td { padding: 4px 0; }
.sec-table input,
.sec-table select,
.sec-table textarea {
  width: 100%; box-sizing: border-box;
  height: 28px;
  background: var(--w11-win-body) !important; color: var(--w11-text) !important;
  border: 1px solid var(--w11-stroke) !important; border-radius: 6px !important;
  box-shadow: none !important; font: inherit; font-size: 0.78rem;
  padding: 0 10px;
}
.sec-table textarea {
  height: auto; min-height: 120px; max-height: 220px; resize: vertical;
  padding: 8px 10px;
  font-family: "Cascadia Mono", "Consolas", monospace; font-size: 0.75rem;
}
.sec-hint { margin: 6px 14px 0; font-size: 0.72rem; color: var(--w11-muted); }
.sec-ws-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 4px 12px 12px;
  overflow: auto;
  flex: 1;
  min-height: 0;
}
.sec-ws-card {
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: color-mix(in srgb, var(--w11-window-bg) 92%, var(--w11-titlebar));
  padding: 10px 12px 12px;
  color: var(--w11-text);
}
.sec-ws-card.focus {
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 55%, transparent);
  outline-offset: 1px;
}
.sec-ws-card.disabled { opacity: 0.72; }
.sec-ws-card-h {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.sec-ws-card-h > div { flex: 1; min-width: 0; }
.sec-ws-card-h strong { display: block; font-size: 0.9rem; }
.sec-ws-card-h small { display: block; color: var(--w11-muted); font-size: 0.72rem; margin-top: 2px; }
.sec-ws-auto {
  margin: 0 !important;
  flex-shrink: 0;
  max-width: 220px;
}
.sec-ws-ports {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.sec-ws-port {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
  font-size: 0.78rem;
  cursor: pointer;
}
.sec-ws-port input { margin: 0; }
.sec-ws-port small { color: var(--w11-muted); margin-left: 2px; }
.sec-ws-port.ok { border-color: color-mix(in srgb, #107c10 45%, var(--w11-stroke)); background: color-mix(in srgb, #107c10 10%, var(--w11-window-bg)); }
.sec-ws-port.warn { border-color: color-mix(in srgb, #c9a227 50%, var(--w11-stroke)); background: color-mix(in srgb, #ffe08a 18%, var(--w11-window-bg)); }
.sec-ws-port.off { opacity: 0.65; }
.sec-ws-http80 {
  margin: 0 12px 8px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  font-size: 0.78rem;
  color: var(--w11-text);
}
.sec-ws-http80.ok { background: color-mix(in srgb, #107c10 12%, var(--w11-window-bg)); }
.sec-ws-http80.closed { background: color-mix(in srgb, var(--w11-titlebar) 40%, var(--w11-window-bg)); }
.sec-geo-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  gap: 6px 10px;
  max-height: min(320px, 42vh);
  overflow: auto;
  margin: 10px 12px 4px;
  padding: 10px 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: color-mix(in srgb, var(--w11-win-body) 55%, var(--w11-window-bg));
  scrollbar-width: thin;
}
.sec-geo-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.78rem;
  color: var(--w11-text);
  cursor: pointer;
  user-select: none;
  min-width: 0;
  padding: 4px 6px;
  border-radius: 6px;
}
.sec-geo-item:hover {
  background: color-mix(in srgb, var(--w11-highlight) 45%, transparent);
}
.sec-geo-item input {
  flex-shrink: 0;
  margin: 0;
}
.sec-geo-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sec-block-list,
.sec-port-list {
  padding: 0 4px 4px;
  max-height: none;
  overflow: visible;
}
.sec-block-row,
.sec-port-row {
  display: grid; grid-template-columns: 32px 1fr auto; gap: 8px;
  align-items: center; padding: 8px 10px;
  border-top: 1px solid color-mix(in srgb, var(--w11-stroke) 80%, transparent);
}
.sec-block-row:hover,
.sec-port-row:hover {
  background: color-mix(in srgb, var(--w11-accent) 10%, transparent);
}
.sec-block-ico,
.sec-port-ico {
  width: 28px; height: 28px; border-radius: 6px;
  display: grid; place-items: center; font-size: 0.85rem;
  background: color-mix(in srgb, #c42b1c 18%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, #c42b1c 35%, var(--w11-stroke));
}
.sec-port-ico.is-ok {
  background: color-mix(in srgb, #107c10 18%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 35%, var(--w11-stroke));
}
.sec-block-body strong,
.sec-port-body strong { display: block; color: var(--w11-text); font-size: 0.82rem; }
.sec-block-body small,
.sec-port-body small { display: block; color: var(--w11-muted); font-size: 0.7rem; margin-top: 1px; }
.sec-block-tag {
  display: inline-block;
  font-weight: 600;
  color: color-mix(in srgb, #c42b1c 70%, var(--w11-text));
}
.sec-block-tag.is-ftp {
  color: color-mix(in srgb, #c9a227 55%, var(--w11-text));
}
.sec-block-row.is-ftp .sec-block-ico {
  background: color-mix(in srgb, #c9a227 22%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c9a227 40%, var(--w11-stroke));
}
.sec-port-badge {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  padding: 3px 8px;
  border-radius: 999px;
  white-space: nowrap;
}
.sec-port-badge.ok {
  background: color-mix(in srgb, #107c10 18%, var(--w11-window-bg));
  color: color-mix(in srgb, #107c10 75%, var(--w11-text));
  border: 1px solid color-mix(in srgb, #107c10 35%, var(--w11-stroke));
}
.sec-port-badge.bad {
  background: color-mix(in srgb, #c42b1c 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #c42b1c 75%, var(--w11-text));
  border: 1px solid color-mix(in srgb, #c42b1c 35%, var(--w11-stroke));
}
.sec-empty { padding: 14px 12px; color: var(--w11-muted); }

@media (max-width: 820px) {
  .sec-layout { grid-template-columns: 1fr; }
  .sec-nav {
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    border-right: 0;
    border-bottom: 1px solid var(--w11-stroke);
    padding: 8px;
  }
  .sec-nav-item {
    min-width: 148px;
    flex: 0 0 auto;
  }
  .sec-nav-item.active {
    box-shadow: inset 0 -3px 0 var(--w11-accent);
  }
}

.vpn-connections {
  flex: 1; min-height: 0; overflow: auto;
  background: #fff; user-select: none;
}
.vpn-conn {
  display: grid; grid-template-columns: 56px 1fr auto; gap: 12px;
  align-items: center; padding: 12px 14px;
  border-bottom: 1px solid #f0f0f0; background: #fff;
}
.vpn-conn:hover { background: #f5f9fc; }
.vpn-conn-ico {
  width: 48px; height: 48px; border-radius: 4px;
  display: grid; place-items: center; font-size: 1.45rem;
  background: linear-gradient(160deg, #9ed0ff, #2f6fbf);
  border: 1px solid #6e9cc8; color: #fff;
}
.vpn-conn-body { min-width: 0; }
.vpn-conn-body strong { display: block; color: #1a1a1a; font-size: 0.92rem; }
.vpn-conn-body small { display: block; color: #666; font-size: 0.78rem; margin-top: 2px; }
.vpn-conn-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.vpn-conn-tags .tag {
  display: inline-block; padding: 1px 8px; border-radius: 3px; font-size: 0.72rem;
  border: 1px solid #ccc; background: #f7f7f7; color: #555;
}
.vpn-conn-tags .tag.ok { color: #0b6a0b; border-color: #9fd89f; background: #eaf6ea; }
.vpn-conn-tags .tag.accent { color: #0078d4; border-color: #99d1ff; background: #e8f4ff; }
.vpn-conn-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }

.w11-win-body #acc-vpn-wizard.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0; background: #ffffff;
  padding: 0 !important; margin: 0 !important;
}
.vpn-wizard-shell { height: 100%; background: var(--w11-win-body) !important; }
.vpn-wizard-form {
  display: flex; flex-direction: column;
  height: 100%; min-height: 0;
  background: #ffffff; color: #1a1a1a;
}
.vpn-wizard-body {
  flex: 1; min-height: 0; overflow: auto;
  padding: 16px 20px 12px;
  background: #ffffff;
  border: 0;
  margin: 0;
}
.vpn-wizard-body textarea {
  width: 100%; min-height: 220px; box-sizing: border-box;
  font-family: "Cascadia Mono", "Consolas", var(--mono, monospace);
  font-size: 0.78rem; resize: vertical;
}
.vpn-wizard-form .win-sheet-footer {
  flex-shrink: 0; margin-top: auto;
  display: flex; justify-content: flex-end; align-items: center; gap: 8px;
  padding: 12px 16px 14px;
  background: #f3f3f3; border-top: 1px solid #ebebeb;
}

.prn-devices {
  flex: 1; min-height: 0; overflow: auto;
  display: flex; flex-direction: column; gap: 0;
  background: var(--w11-win-body); user-select: none;
}
.prn-device {
  display: grid; grid-template-columns: 56px 1fr auto; gap: 12px;
  align-items: center; padding: 12px 14px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
}
.prn-device:hover {
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
}
.prn-device-ico {
  width: 48px; height: 48px; border-radius: 4px;
  display: grid; place-items: center; font-size: 1.6rem;
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.prn-device-body { min-width: 0; }
.prn-device-body strong { display: block; color: var(--w11-text); font-size: 0.92rem; }
.prn-device-body small { display: block; color: var(--w11-muted); font-size: 0.78rem; margin-top: 2px; }
.prn-device-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.prn-device-tags .tag {
  display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 0.72rem;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-text) 6%, var(--w11-window-bg));
  color: var(--w11-muted);
}
.prn-device-tags .tag.ok {
  color: var(--w11-text);
  border-color: color-mix(in srgb, #107c10 42%, var(--w11-stroke));
  background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg));
}
.prn-device-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.prn-inline-fields {
  display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 8px;
}
.prn-inline-fields label {
  display: flex; flex-direction: column; gap: 4px; font-size: 0.78rem; color: var(--w11-muted);
}
.prn-shell .win-app-toolbar-text strong {
  font-size: 1.28rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.prn-shell .win-app-toolbar {
  padding: 14px 16px 12px;
  align-items: flex-start;
}
.prn-device-actions .win-app-btn { min-height: 28px; font-size: 0.78rem; }

.w11-win-body #acc-email .email-shell { flex: 1; min-height: 0; }
.email-accounts {
  flex: 1; min-height: 0; overflow: auto;
  display: flex; flex-direction: column; gap: 0;
  background: #fff; user-select: none;
  outline: none;
}
.email-account {
  display: grid;
  grid-template-columns: 12px 48px 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid #f0f0f0;
  background: #fff;
  cursor: default;
}
.email-account:hover { background: #f5f9fc; }
.email-account.selected { background: #cce8ff; }
.email-account-dot {
  width: 10px; height: 10px; border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.15);
  justify-self: center;
}
.email-account-dot.on { background: #16a34a; }
.email-account-dot.off { background: #dc2626; }
.email-account-ico {
  width: 48px; height: 48px; border-radius: 4px;
  display: grid; place-items: center; font-size: 1.45rem;
  background: linear-gradient(160deg, #ffe8c8, #f0c078);
  border: 1px solid #e0b060;
}
.email-account-body { min-width: 0; }
.email-account-body strong {
  display: block; color: #1a1a1a; font-size: 0.9rem; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.email-account-body small {
  display: block; color: #666; font-size: 0.76rem; margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.email-account-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 5px; }
.email-account-tags .tag {
  display: inline-block; padding: 1px 8px; border-radius: 3px; font-size: 0.7rem;
  border: 1px solid #ccc; background: #f7f7f7; color: #555;
}
.email-account-tags .tag.ok { color: #0b6a0b; border-color: #9fd89f; background: #eaf6ea; }
.email-account-empty {
  padding: 28px 16px; text-align: center; color: #666; font-size: 0.85rem;
}
.email-props-grid { margin-top: 8px; }
.email-props-switch {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 4px 0 8px;
}
.email-props-switch .switch-text { color: var(--w11-text) !important; font-size: 0.85rem; }
.email-perms {
  margin-top: 14px;
  display: flex; flex-direction: column; gap: 10px;
  border-top: 1px solid #ebebeb;
  padding-top: 12px;
}
.email-perm-row strong {
  display: block; font-size: 0.75rem; color: #555; font-weight: 600; margin-bottom: 4px;
}
.email-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.email-tags .tag {
  display: inline-block; padding: 2px 8px; border-radius: 3px; font-size: 0.72rem;
  border: 1px solid #9dc3e6; background: #e8f4fc; color: #005a9e;
}
#email-ctx.w11-ctx {
  min-width: 200px;
}

.pwa-install { color: var(--w11-text); }
.pwa-hero {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 14px;
}
.pwa-hero img {
  width: 64px; height: 64px; border-radius: 12px;
  box-shadow: 0 2px 8px color-mix(in srgb, #000 18%, transparent);
}
.pwa-hero strong { display: block; font-size: 1rem; color: var(--w11-text); }
.pwa-hero small { display: block; margin-top: 4px; color: var(--w11-muted); font-size: 0.8rem; }
.pwa-points {
  margin: 14px 0 0; padding-left: 18px; color: var(--w11-text); font-size: 0.84rem; line-height: 1.45;
}
.pwa-points li { margin: 6px 0; }

#prn-modal.modal { z-index: 10046; }
.prn-wizard-sheet { width: min(560px, 96vw); max-height: min(90vh, 720px); }
.prn-wizard-sheet .win-sheet-content { max-height: 52vh; overflow: auto; }
.w11-win-body #acc-prn-wizard.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0; background: var(--w11-win-body);
  padding: 0 !important; margin: 0 !important;
  color: var(--w11-text);
}
.prn-wizard-shell {
  height: 100%; background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.prn-wizard-form {
  display: flex; flex-direction: column;
  height: 100%; min-height: 0;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.prn-wizard-form .win-sheet-tabs {
  flex-shrink: 0;
  display: flex; gap: 0;
  padding: 8px 12px 0;
  background: var(--w11-win-body) !important;
  border-bottom: 1px solid var(--w11-stroke) !important;
}
.prn-wizard-form .win-sheet-tab {
  appearance: none;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  color: var(--w11-muted) !important;
  padding: 8px 12px 10px !important;
  font: inherit;
  font-size: 0.82rem;
  border-radius: 0 !important;
  top: 0 !important;
}
.prn-wizard-form .win-sheet-tab.active {
  color: var(--w11-text) !important;
  font-weight: 600 !important;
  background: transparent !important;
  border-bottom-color: var(--w11-accent) !important;
}
.prn-wizard-content {
  flex: 1; min-height: 0 !important; overflow: auto;
  padding: 16px 20px !important;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
  border: 0 !important;
  margin: 0 !important;
}
.prn-wizard-form .win-sheet-footer {
  flex-shrink: 0;
  margin-top: auto;
  display: flex; justify-content: flex-end; align-items: center; gap: 8px;
  padding: 12px 16px 14px;
  background: var(--w11-titlebar) !important;
  border-top: 1px solid var(--w11-stroke) !important;
}
.prn-wizard-form #prn-msg { margin: 0 20px; }
.prn-wizard-form .win-sheet-table th {
  width: 11.5rem;
  max-width: 38%;
  background: transparent !important;
  color: var(--w11-text) !important;
  font-weight: 600;
  white-space: normal;
  vertical-align: top;
  padding: 10px 14px 10px 0;
}
.prn-wizard-form .win-sheet-table td {
  color: var(--w11-text) !important;
  background: transparent !important;
  vertical-align: top;
}
.prn-wizard-form :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]) {
  background: var(--w11-window-bg) !important;
  color: var(--w11-text) !important;
  border: 1px solid var(--w11-stroke) !important;
  caret-color: var(--w11-accent);
}
.prn-wizard-form .switch-text { color: var(--w11-text) !important; }
.prn-ep-form {
  display: flex; flex-direction: column; gap: 0;
}
.prn-field {
  display: grid;
  grid-template-columns: minmax(9.5rem, 32%) minmax(0, 1fr);
  gap: 10px 16px;
  align-items: start;
  padding: 10px 0;
  border-bottom: 1px solid var(--w11-stroke);
}
.prn-field-label {
  color: var(--w11-text);
  font-weight: 600;
  padding-top: 6px;
  line-height: 1.35;
}
.prn-field-ctrl {
  display: flex; flex-direction: column; gap: 8px; min-width: 0;
}
.prn-field-ctrl .switch { margin: 0; }
.prn-search-bar {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  margin: 8px 0 12px;
}
.prn-discover-list {
  display: flex; flex-direction: column; gap: 4px;
  min-height: 160px; max-height: 280px; overflow: auto;
  border: 1px solid var(--w11-stroke); background: var(--w11-window-bg); padding: 4px;
}
.prn-discover-item {
  appearance: none; border: 0; background: transparent; text-align: left;
  display: flex; gap: 12px; align-items: center;
  padding: 10px; border-radius: 4px; cursor: pointer; font: inherit; color: var(--w11-text);
}
.prn-discover-item:hover, .prn-discover-item:focus-visible {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg)); outline: none;
}
.prn-discover-item.added { opacity: 0.7; }
.prn-dev-ico {
  width: 40px; height: 40px; border-radius: 4px;
  display: grid; place-items: center; font-size: 1.3rem;
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke); flex-shrink: 0;
  color: var(--w11-text);
}
.prn-dev-meta { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.prn-dev-meta strong { font-size: 0.88rem; color: var(--w11-text); }
.prn-dev-meta small { color: var(--w11-muted); font-size: 0.75rem; }
.prn-dev-meta small.ok { color: var(--w11-text); }
.prn-dev-meta small.accent { color: var(--w11-accent); }

@media (max-width: 800px) {
  .prn-device { grid-template-columns: 48px 1fr; }
  .prn-device-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .vpn-conn { grid-template-columns: 48px 1fr; }
  .vpn-conn-actions { grid-column: 1 / -1; justify-content: flex-start; }
}

@media (max-width: 800px) {
  .start-pinned { grid-template-columns: repeat(4, 1fr); }
  .pg-layout { grid-template-columns: 1fr; }
  #start-menu { width: calc(100vw - 16px); bottom: 8px; }
  .fe-body { grid-template-columns: 1fr; }
  .fe-nav { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid #ddd; }
  .mc-panes { grid-template-columns: 1fr; }
}

/* Dialog windows (no modal overlay) ? Personalisierung / Fluent */
.w11-window.w11-dialog {
  min-width: 280px;
  min-height: 140px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-win-border);
  border-radius: 10px;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--w11-accent) 18%, transparent),
    0 4px 12px rgba(0, 0, 0, 0.12),
    0 18px 48px rgba(0, 0, 0, 0.28);
  color: var(--w11-text);
  overflow: hidden;
}
.w11-window.w11-dialog.w11-dlg-anim {
  opacity: 0;
}
.w11-window.w11-dialog.w11-dlg-anim.w11-dlg-ready {
  opacity: 1;
  transition: opacity 0.26s cubic-bezier(0.16, 1, 0.3, 1);
}
.w11-window.w11-dialog .w11-titlebar {
  cursor: default;
}
.w11-window.w11-dialog.focused {
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-win-border));
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--w11-accent) 35%, transparent),
    0 6px 16px rgba(0, 0, 0, 0.14),
    0 22px 56px rgba(0, 0, 0, 0.32);
}
/* Popup-/Dialog-Titelleiste folgt Personalisierung (Windows-Stil) */
.w11-window.w11-dialog .w11-titlebar,
.w11-window.w11-dialog.focused .w11-titlebar,
.w11-window:has(.dlg-shell) .w11-titlebar,
.w11-window:has(.dlg-shell).focused .w11-titlebar,
.w11-window:has(.vpn-wizard-shell) .w11-titlebar,
.w11-window:has(.prn-wizard-shell) .w11-titlebar {
  height: 32px !important;
  background: var(--w11-titlebar) !important;
  border-bottom: 1px solid var(--w11-stroke) !important;
  color: var(--w11-title-color) !important;
  padding: 0 0 0 12px !important;
}
.w11-window.w11-dialog.focused .w11-titlebar,
.w11-window:has(.dlg-shell).focused .w11-titlebar,
.w11-window:has(.vpn-wizard-shell).focused .w11-titlebar,
.w11-window:has(.prn-wizard-shell).focused .w11-titlebar {
  background: var(--w11-titlebar-focus) !important;
}
.w11-window.w11-dialog .w11-title,
.w11-window:has(.dlg-shell) .w11-title,
.w11-window:has(.vpn-wizard-shell) .w11-title,
.w11-window:has(.prn-wizard-shell) .w11-title {
  color: var(--w11-title-color) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  opacity: 1 !important;
}
.w11-window.w11-dialog .w11-title-ico,
.w11-window:has(.dlg-shell) .w11-title-ico,
.w11-window:has(.vpn-wizard-shell) .w11-title-ico,
.w11-window:has(.prn-wizard-shell) .w11-title-ico {
  width: 16px !important;
  height: 16px !important;
  opacity: 0.85 !important;
  filter: none !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--w11-title-color) !important;
  display: inline-grid;
  place-items: center;
}
.w11-window.w11-dialog .w11-win-btns button,
.w11-window:has(.dlg-shell) .w11-win-btns button,
.w11-window:has(.vpn-wizard-shell) .w11-win-btns button,
.w11-window:has(.prn-wizard-shell) .w11-win-btns button {
  color: var(--w11-title-color) !important;
  width: 46px;
}
.w11-window.w11-dialog .w11-win-btns button:hover,
.w11-window:has(.dlg-shell) .w11-win-btns button:hover,
.w11-window:has(.vpn-wizard-shell) .w11-win-btns button:hover,
.w11-window:has(.prn-wizard-shell) .w11-win-btns button:hover {
  background: color-mix(in srgb, var(--w11-text) 10%, transparent) !important;
}
.w11-window.w11-dialog .w11-win-btns button.close:hover,
.w11-window:has(.dlg-shell) .w11-win-btns button.close:hover,
.w11-window:has(.vpn-wizard-shell) .w11-win-btns button.close:hover,
.w11-window:has(.prn-wizard-shell) .w11-win-btns button.close:hover {
  background: #c42b1c !important;
  color: #fff !important;
}
.w11-window.w11-dialog .w11-win-body,
.w11-window.w11-dialog .w11-dialog-body,
.w11-window:has(.dlg-shell) .w11-win-body,
.w11-window:has(.vpn-wizard-shell) .w11-win-body,
.w11-window:has(.prn-wizard-shell) .w11-win-body {
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
  overflow: hidden;
}

.w11-win-body .dlg-host.w11-hosted,
.w11-win-body #acc-user-wizard.w11-hosted,
.w11-win-body #acc-email-wizard.w11-hosted,
.w11-win-body #acc-email-detail.w11-hosted,
.w11-win-body #acc-stor-wizard.w11-hosted,
.w11-win-body #acc-stor-dup.w11-hosted,
.w11-win-body #acc-stor-folder.w11-hosted,
.w11-win-body #acc-stor-props.w11-hosted,
.w11-win-body #acc-bak-wizard.w11-hosted,
.w11-win-body #acc-desk-props.w11-hosted,
.w11-win-body #acc-taskbar-props.w11-hosted,
.w11-win-body #acc-download.w11-hosted,
.w11-win-body #acc-dms-confirm.w11-hosted,
.w11-win-body #acc-dms-recipient.w11-hosted,
.w11-win-body #acc-dms-contact.w11-hosted,
.w11-win-body #acc-dms-mail.w11-hosted,
.w11-win-body #acc-dms-wipe.w11-hosted,
.w11-win-body #acc-dms-sender-resolve.w11-hosted,
.w11-win-body #acc-windows-app.w11-hosted {
  display: flex !important; flex-direction: column;
  height: 100%; min-height: 0; padding: 0 !important; margin: 0 !important;
  background: var(--w11-win-body);
  color: var(--w11-text);
}

.dlg-pad.email-device {
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: hidden;
}
.dlg-pad.email-device .win-sheet-hint {
  margin: 0;
  font-size: 0.88rem;
  color: #323130;
  line-height: 1.45;
  word-break: break-word;
}
.email-device-code-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid #e1dfdd;
  border-radius: 4px;
  background: #faf9f8;
}
.email-device-code-label {
  align-self: flex-start;
  font-size: 0.72rem;
  font-weight: 600;
  color: #605e5c;
}
.email-device .email-code {
  margin: 0;
  font-family: var(--w11-font, "Segoe UI", sans-serif);
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-align: center;
  color: #0067c0;
  user-select: all;
  line-height: 1.2;
}
.email-device-link-row {
  margin: 0;
  font-size: 0.86rem;
}
.email-device-link-row a {
  color: #0067c0;
  text-decoration: none;
  word-break: break-all;
}
.email-device-link-row a:hover {
  text-decoration: underline;
}
.email-device-status {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  min-height: 20px;
  font-size: 0.82rem;
}
.email-device-status.ok { color: #0f7b0f; }
.email-device-status.err { color: #c42b1c; }
.email-device-spin {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid #c8c6c4;
  border-top-color: #0067c0;
  flex-shrink: 0;
  opacity: 0;
}
.email-device-status.pending .email-device-spin {
  opacity: 1;
  animation: email-device-spin 0.7s linear infinite;
}
.email-device-status.ok .email-device-spin,
.email-device-status.err .email-device-spin {
  display: none;
}
@keyframes email-device-spin {
  to { transform: rotate(360deg); }
}

/* Unified dialog surface ? folgt Personalisierung */
.dlg-shell {
  height: 100%;
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.dlg-form {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.dlg-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.dlg-pad {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 16px 20px 12px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  border: 0;
  margin: 0;
}
.dlg-scroll { overflow: auto; }
.dlg-form .win-sheet-tabs,
.dlg-shell .win-sheet-tabs {
  flex-shrink: 0;
  display: flex;
  gap: 0;
  padding: 8px 12px 0;
  background: var(--w11-win-body) !important;
  border-bottom: 1px solid var(--w11-stroke) !important;
}
.dlg-form .win-sheet-tab,
.dlg-shell .win-sheet-tab {
  appearance: none;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  color: var(--w11-muted) !important;
  padding: 8px 12px 10px !important;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 500;
  border-radius: 0 !important;
  top: 0 !important;
  cursor: pointer;
}
.dlg-form .win-sheet-tab.active,
.dlg-shell .win-sheet-tab.active {
  color: var(--w11-text) !important;
  font-weight: 600 !important;
  background: transparent !important;
  border-bottom-color: var(--w11-accent) !important;
  z-index: 1;
}
.dlg-form .win-sheet-content,
.dlg-shell .win-sheet-content {
  flex: 1;
  min-height: 0 !important;
  overflow: auto;
  padding: 16px 20px !important;
  margin: 0 !important;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
  border: 0 !important;
  border-top: 0 !important;
}
.dlg-form .win-sheet-footer,
.dlg-shell .win-sheet-footer {
  flex-shrink: 0;
  margin-top: auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  padding: 12px 16px 14px;
  background: var(--w11-titlebar);
  border-top: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.dlg-form .form-error,
.dlg-shell .form-error { margin: 8px 20px; color: #c42b1c; }
.win-sheet-hint {
  color: var(--w11-muted) !important;
}

/* Win11 Fluent buttons inside dialogs */
.w11-dialog .win-sheet-btn,
.w11-dialog .win-app-btn,
.dlg-shell .win-sheet-btn {
  appearance: none;
  min-width: 88px;
  height: 34px;
  padding: 0 18px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-window-bg) 88%, var(--w11-text)) !important;
  color: var(--w11-text) !important;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 500;
  box-shadow: none !important;
  cursor: pointer;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    transform 0.12s ease,
    box-shadow 0.16s ease;
}
.w11-dialog .win-sheet-btn:hover,
.dlg-shell .win-sheet-btn:hover {
  background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)) !important;
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.w11-dialog .win-sheet-btn:active,
.dlg-shell .win-sheet-btn:active {
  transform: translateY(1px);
  background: var(--w11-titlebar) !important;
}
.w11-dialog .win-sheet-btn.primary,
.dlg-shell .win-sheet-btn.primary {
  border-color: color-mix(in srgb, var(--w11-accent) 80%, #000) !important;
  background: var(--w11-accent) !important;
  color: #fff !important;
  font-weight: 600;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--w11-accent) 35%, transparent) !important;
}
.w11-dialog .win-sheet-btn.primary:hover,
.dlg-shell .win-sheet-btn.primary:hover {
  background: color-mix(in srgb, var(--w11-accent) 86%, #fff) !important;
  border-color: color-mix(in srgb, var(--w11-accent) 86%, #fff) !important;
  color: #fff !important;
}
.w11-dialog .win-sheet-btn.danger,
.dlg-shell .win-sheet-btn.danger {
  border-color: #b42318 !important;
  background: linear-gradient(180deg, #d13438 0%, #c42b1c 100%) !important;
  color: #fff !important;
  font-weight: 600;
  box-shadow: 0 4px 16px color-mix(in srgb, #c42b1c 38%, transparent) !important;
}
.w11-dialog .win-sheet-btn.danger:hover,
.dlg-shell .win-sheet-btn.danger:hover {
  background: linear-gradient(180deg, #e04649 0%, #d13438 100%) !important;
  border-color: #d13438 !important;
  color: #fff !important;
}
.w11-dialog .win-sheet-btn:focus-visible,
.dlg-shell .win-sheet-btn:focus-visible {
  outline: 2px solid var(--w11-accent);
  outline-offset: 2px;
}

/* Confirm / Prompt Meisterst?ck */
@keyframes win-dlg-shell-in {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes win-dlg-ico-in {
  0% {
    opacity: 0;
    transform: scale(0.72) rotate(-8deg);
  }
  60% {
    opacity: 1;
    transform: scale(1.06) rotate(1deg);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
@keyframes win-dlg-glow-pulse {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 0.9; transform: scale(1.08); }
}
@keyframes win-dlg-shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-5px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(3px); }
}

.win-dlg-shell {
  position: relative;
  animation: win-dlg-shell-in 0.36s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.w11-window.w11-dialog.w11-dlg-ready .dlg-shell:not(.win-dlg-shell) {
  animation: win-dlg-shell-in 0.32s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.win-dlg-form {
  position: relative;
  z-index: 1;
}
.win-dlg-pad {
  position: relative;
  padding: 22px 22px 14px !important;
  overflow: hidden;
}
.win-dlg-hero {
  pointer-events: none;
  position: absolute;
  inset: -20% -10% auto;
  height: 70%;
  background:
    radial-gradient(ellipse 70% 80% at 12% 20%, color-mix(in srgb, var(--w11-accent) 22%, transparent), transparent 70%),
    radial-gradient(ellipse 55% 60% at 88% 0%, color-mix(in srgb, var(--w11-highlight) 28%, transparent), transparent 65%);
  opacity: 0.95;
}
.win-dlg-shell.is-danger .win-dlg-hero {
  background:
    radial-gradient(ellipse 70% 80% at 10% 18%, color-mix(in srgb, #c42b1c 26%, transparent), transparent 72%),
    radial-gradient(ellipse 50% 55% at 92% 8%, color-mix(in srgb, #f7630c 16%, transparent), transparent 68%);
}
.win-dlg-row {
  position: relative;
  display: flex;
  gap: 18px;
  align-items: flex-start;
  z-index: 1;
}
.win-dlg-ico-wrap {
  position: relative;
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 12%, transparent),
    0 8px 22px color-mix(in srgb, var(--w11-accent) 18%, transparent);
  animation: win-dlg-ico-in 0.52s cubic-bezier(0.34, 1.45, 0.64, 1) 0.06s both;
}
.win-dlg-shell.is-danger .win-dlg-ico-wrap {
  color: #ff8a7a;
  background: color-mix(in srgb, #c42b1c 18%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 36%, var(--w11-stroke));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 10%, transparent),
    0 8px 22px color-mix(in srgb, #c42b1c 22%, transparent);
}
.win-dlg-ico-wrap.is-prompt {
  color: var(--w11-accent);
}
.win-dlg-ico-glow {
  position: absolute;
  inset: -10px;
  border-radius: 22px;
  background: radial-gradient(circle, currentColor 0%, transparent 70%);
  opacity: 0.35;
  filter: blur(8px);
  animation: win-dlg-glow-pulse 2.4s ease-in-out infinite;
  z-index: 0;
}
.win-dlg-svg {
  position: relative;
  z-index: 1;
  width: 32px;
  height: 32px;
  display: block;
}
.win-dlg-copy {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 2px;
}
.win-dlg-lead {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -0.01em;
  color: var(--w11-text);
  white-space: pre-wrap;
}
.win-dlg-detail {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.5;
  color: var(--w11-muted);
  white-space: pre-wrap;
}
.win-dlg-footer {
  position: relative;
  gap: 10px !important;
  padding: 14px 18px 16px !important;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--w11-titlebar) 70%, transparent) 0%,
      var(--w11-titlebar) 100%
    ) !important;
  border-top: 1px solid var(--w11-stroke) !important;
}
.win-dlg-footer::before {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    color-mix(in srgb, var(--w11-accent) 55%, transparent),
    transparent
  );
  opacity: 0.7;
}
.win-dlg-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 2px;
}
.win-dlg-field-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--w11-muted);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.win-dlg-input {
  width: 100%;
  box-sizing: border-box;
  height: 38px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font: inherit;
  font-size: 0.92rem;
  outline: none;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}
.win-dlg-input:focus {
  border-color: color-mix(in srgb, var(--w11-accent) 70%, var(--w11-stroke));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--w11-accent) 28%, transparent);
}
.win-dlg-input.is-shake {
  animation: win-dlg-shake 0.4s ease;
  border-color: #c42b1c;
}

.dms-confirm-msg {
  margin: 4px 0 8px;
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--w11-text);
  white-space: pre-wrap;
}
.win-confirm-dontask {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  cursor: pointer;
  user-select: none;
  color: var(--w11-muted);
  font-size: 0.86rem;
}
.win-confirm-dontask:hover {
  color: var(--w11-text);
}
.win-confirm-dontask input {
  width: 16px;
  height: 16px;
  accent-color: var(--w11-accent);
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  .w11-window.w11-dialog.w11-dlg-anim,
  .w11-window.w11-dialog.w11-dlg-anim.w11-dlg-ready,
  .win-dlg-shell,
  .win-dlg-ico-wrap,
  .win-dlg-ico-glow,
  .win-dlg-input.is-shake,
  .w11-dialog .win-sheet-btn,
  .dlg-shell .win-sheet-btn {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

#acc-user-wizard .user-perms {
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px;
}
#acc-user-wizard .user-perms .switch-text,
#acc-user-wizard .win-sheet-auto .switch-text,
#acc-stor-props .switch-text { color: var(--w11-text) !important; }
.w11-win-body .dlg-host .form-grid label span { color: #555; }
.w11-win-body .dlg-host input,
.w11-win-body .dlg-host select,
.w11-win-body .dlg-host textarea {
  background: var(--w11-win-body) !important; color: var(--w11-text) !important;
  border: 1px solid #7a7a7a !important; border-radius: 2px !important;
  box-shadow: none !important;
}
.w11-win-body #acc-download .files-bar,
.w11-win-body #acc-download .sm-dl-bar {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-shrink: 0;
}
.w11-win-body #acc-download #files-path,
.w11-win-body #acc-download .sm-dl-path {
  flex: 1;
  min-width: 0;
  height: 30px;
  padding: 0 10px;
  font-family: "Cascadia Mono", "Consolas", ui-monospace, monospace;
  font-size: 0.8rem;
  background: var(--w11-window-bg) !important;
  color: var(--w11-text) !important;
  border: 1px solid var(--w11-stroke) !important;
  border-radius: 6px !important;
}
.w11-win-body #acc-download .files-list,
.w11-win-body #acc-download .sm-dl-list {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 4px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
}
#acc-download.sm-dl-shell,
#acc-download .sm-dl-shell {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.sm-dl-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px 8px;
  box-sizing: border-box;
}
.sm-dl-ico-btn {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  cursor: pointer;
}
.sm-dl-ico-btn:hover {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.sm-dl-ico-btn:active {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
}
.sm-dl-cols {
  display: grid;
  grid-template-columns: 1fr 88px;
  gap: 8px;
  padding: 0 10px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--w11-muted);
  flex-shrink: 0;
}
.sm-dl-col-size { text-align: right; }
.sm-dl-list .file-row,
#acc-download .file-row {
  display: grid;
  grid-template-columns: 22px 1fr 88px;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  margin: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  cursor: pointer;
  color: var(--w11-text);
  background: transparent;
  font-size: 0.84rem;
  line-height: 1.25;
}
#acc-download .file-row:hover {
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 22%, transparent);
}
#acc-download .file-row.selected {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke));
  color: var(--w11-text);
}
#acc-download .file-row .sm-dl-ico {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
#acc-download .file-row .sm-dl-ico svg { display: block; }
#acc-download .file-row .sm-dl-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--w11-text);
  font-weight: 500;
}
#acc-download .file-row .meta,
#acc-download .file-row .sm-dl-size {
  text-align: right;
  color: var(--w11-muted);
  font-family: "Cascadia Mono", "Consolas", ui-monospace, monospace;
  font-size: 0.72rem;
  white-space: nowrap;
}
#acc-download .sm-dl-empty,
#acc-download .sm-dl-list .muted,
#acc-download .sm-dl-list .form-error {
  padding: 28px 16px;
  text-align: center;
  color: var(--w11-muted);
  font-size: 0.86rem;
}
#acc-download .sm-dl-list .form-error {
  color: #e81123;
}
.sm-dl-status {
  margin: 0;
  flex-shrink: 0;
  font-size: 0.75rem;
  color: var(--w11-muted);
  min-height: 1.1em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#acc-download .win-sheet-footer {
  flex-shrink: 0;
  border-top: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-win-body));
}

/* Windows Explorer app */
.w11-win-body.w11-files-body {
  overflow: hidden; padding: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.w11-win-body.w11-mc-body { background: #0000aa; }
.fe-host, .mc-host, .dc-host, .dcfr-host { height: 100%; min-height: 0; display: flex; flex-direction: column; }
.w11-win-body:has(.fe-host),
.w11-win-body:has(.mc-host),
.w11-win-body:has(.dc-host),
.w11-win-body:has(.dcfr-host),
.w11-win-body.w11-dc-body,
.w11-win-body.w11-dcfr-body {
  overflow: hidden; padding: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}

/* Dateimanager (FileRise unter /dcfr/) – füllt Fenster, keine Scrollbalken am Shell */
.dcfr-host,
.dcfr-app {
  flex: 1; min-height: 0; min-width: 0; width: 100%; height: 100%;
  display: flex; flex-direction: column;
  overflow: hidden !important;
  background: var(--w11-win-body); color: var(--w11-text);
  position: relative;
}
.dcfr-frame {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border: 0; background: var(--w11-win-body);
  overflow: hidden !important;
}
.dcfr-boot {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--w11-win-body) 92%, #000);
  color: var(--w11-text); z-index: 2; padding: 24px; text-align: center;
}
.dcfr-boot[hidden] { display: none !important; }

/* Legacy Double Commander styles (unused; kept for old caches) */
.dc-app {
  flex: 1; min-height: 0; display: flex; flex-direction: column;
  background: var(--w11-win-body); color: var(--w11-text);
  font-family: "Segoe UI", var(--w11-font);
  font-size: 0.82rem;
  position: relative;
  user-select: none;
}
.dc-app.dc-native .dc-frame-wrap {
  flex: 1; min-height: 0; position: relative;
  background: var(--w11-window-bg);
}
.dc-frame {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border: 0; background: var(--w11-win-body);
}
.dc-boot {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--w11-win-body) 92%, #000);
  color: var(--w11-text); z-index: 2; padding: 24px; text-align: center;
}
.dc-boot[hidden] { display: none !important; }
.dc-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  flex-shrink: 0; padding: 6px 8px;
  background: var(--w11-titlebar); border-bottom: 1px solid var(--w11-stroke);
}
.dc-tb-group { display: flex; flex-wrap: wrap; gap: 4px; }
.dc-tb-group button, .dc-go {
  appearance: none; border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg); color: var(--w11-text);
  border-radius: 4px; padding: 4px 10px; font: inherit; cursor: pointer;
}
.dc-tb-group button:hover, .dc-go:hover {
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
}
.dc-tb-hint { color: var(--w11-muted); font-size: 0.75rem; white-space: nowrap; }
.dc-panes {
  flex: 1; min-height: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
  padding: 2px; background: var(--w11-stroke);
}
.dc-pane {
  display: flex; flex-direction: column; min-height: 0; min-width: 0;
  background: var(--w11-win-body); border: 2px solid transparent;
}
.dc-pane.active { border-color: var(--w11-accent); }
.dc-pane-bar {
  display: flex; gap: 4px; align-items: center; flex-shrink: 0;
  padding: 4px 6px; background: var(--w11-titlebar); border-bottom: 1px solid var(--w11-stroke);
}
.dc-side {
  flex: 0 0 auto; max-width: 130px; height: 26px;
  border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text); font: inherit;
}
.dc-path {
  flex: 1; min-width: 0; height: 26px; padding: 0 8px;
  border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text); font: inherit;
}
.dc-cols {
  display: grid; grid-template-columns: 1fr 88px 140px; gap: 8px;
  padding: 3px 10px; flex-shrink: 0;
  background: color-mix(in srgb, var(--w11-window-bg) 88%, var(--w11-text));
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-muted); font-size: 0.72rem; font-weight: 600;
}
.dc-list { flex: 1; overflow: auto; outline: none; background: var(--w11-window-bg); }
.dc-row {
  display: grid; grid-template-columns: 1fr 88px 140px; gap: 8px;
  padding: 3px 10px; cursor: default; color: var(--w11-text);
}
.dc-row:hover { background: color-mix(in srgb, var(--w11-accent) 12%, transparent); }
.dc-row.sel { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)); }
.dc-pane.active .dc-row.sel {
  background: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-window-bg));
  outline: 1px solid color-mix(in srgb, var(--w11-accent) 50%, transparent);
}
.dc-row.dir .n { font-weight: 600; }
.dc-row .s, .dc-row .t { color: var(--w11-muted); font-variant-numeric: tabular-nums; }
.dc-status {
  flex-shrink: 0; padding: 3px 8px;
  background: var(--w11-titlebar); border-top: 1px solid var(--w11-stroke);
  color: var(--w11-muted); font-size: 0.72rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dc-fkeys {
  display: grid; grid-template-columns: repeat(10, 1fr); flex-shrink: 0;
  background: var(--w11-titlebar); border-top: 1px solid var(--w11-stroke);
}
.dc-fkeys button {
  appearance: none; border: 0; border-right: 1px solid var(--w11-stroke);
  background: transparent; color: var(--w11-text); padding: 5px 2px;
  font: inherit; font-size: 0.7rem; cursor: pointer; text-align: left;
}
.dc-fkeys button b {
  display: inline-block; margin-right: 3px; padding: 0 3px;
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  border-radius: 2px; font-weight: 700;
}
.dc-fkeys button:hover { background: color-mix(in srgb, var(--w11-accent) 16%, transparent); }
.dc-view {
  position: absolute; inset: 40px 32px 48px;
  background: var(--w11-window-bg); color: var(--w11-text);
  border: 1px solid var(--w11-win-border); border-radius: 8px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.35);
  display: flex; flex-direction: column; z-index: 8;
}
.dc-view[hidden] { display: none !important; }
.dc-view header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 12px; background: var(--w11-titlebar); border-bottom: 1px solid var(--w11-stroke);
}
.dc-view header button {
  appearance: none; border: 1px solid var(--w11-stroke); border-radius: 4px;
  background: var(--w11-window-bg); color: var(--w11-text); padding: 4px 10px; cursor: pointer; font: inherit;
}
.dc-view pre {
  flex: 1; margin: 0; padding: 12px; overflow: auto;
  font-family: "Cascadia Mono", Consolas, monospace; font-size: 0.8rem;
  white-space: pre-wrap; word-break: break-word;
}
@media (max-width: 900px) {
  .dc-panes { grid-template-columns: 1fr; }
}
.fe-explorer {
  flex: 1; min-height: 0; display: flex; flex-direction: column;
  background: var(--w11-win-body); color: var(--w11-text); font-family: "Segoe UI", var(--w11-font);
  font-size: 0.82rem;
  user-select: none;
  -webkit-user-select: none;
}
.fe-explorer input,
.fe-explorer textarea {
  user-select: text;
  -webkit-user-select: text;
}
.fe-row { cursor: default; }
.fe-row[draggable="true"] { cursor: grab; }
.fe-row.fe-dragging { opacity: 0.45; }
.fe-row.fe-drop-hover,
.fe-nav button.fe-drop-hover,
.fe-main.fe-drop-hover {
  outline: 2px solid #0078d4;
  outline-offset: -2px;
  background: #e5f1fb !important;
}
.fe-main.fe-drop-hover { background: #f0f7fc !important; }
.fe-toolbar {
  display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
  padding: 6px 8px; background: var(--w11-titlebar); border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.fe-upload { display: inline-flex; align-items: center; cursor: pointer; margin: 0; }
.fe-addr { flex: 1; min-width: 160px; }
.fe-addr input {
  width: 100%; box-sizing: border-box; height: 28px;
  border: 1px solid #7a7a7a; border-radius: 2px; padding: 0 8px; font: inherit;
}
.fe-body { flex: 1; min-height: 0; display: grid; grid-template-columns: 180px 1fr; }
.fe-nav {
  background: color-mix(in srgb, var(--w11-win-body) 92%, var(--w11-text));
  border-right: 1px solid var(--w11-stroke);
  padding: 8px; display: flex; flex-direction: column; gap: 2px; overflow: auto;
}
.fe-nav button {
  appearance: none; border: 0; background: transparent; text-align: left;
  padding: 8px 10px; border-radius: 4px; cursor: pointer; font: inherit; color: var(--w11-text);
}
.fe-nav button:hover { background: color-mix(in srgb, var(--w11-accent) 18%, transparent); }
.fe-main { overflow: auto; background: #fff; }
.fe-table { width: 100%; border-collapse: collapse; }
.fe-table th {
  text-align: left; padding: 6px 10px; font-weight: 600; font-size: 0.75rem;
  border-bottom: 1px solid #e0e0e0; background: #fafafa; position: sticky; top: 0;
}
.fe-table td { padding: 5px 10px; border-bottom: 1px solid #f0f0f0; white-space: nowrap; }
.fe-row { cursor: default; }
.fe-row:hover { background: #f5f9fc; }
.fe-row.selected { background: #cce8ff; }
.fe-ico { margin-right: 6px; }
.fe-status {
  padding: 4px 10px; background: #f3f3f3; border-top: 1px solid #d0d0d0;
  color: #555; font-size: 0.75rem;
}

/* Notepad / Editor */
.np-host { height: 100%; min-height: 0; display: flex; flex-direction: column; }
.np-app {
  flex: 1; min-height: 0; display: flex; flex-direction: column;
  background: #fff; color: #1a1a1a;
  font-family: "Segoe UI", var(--w11-font);
}
.np-menubar {
  display: flex; gap: 0; flex-shrink: 0;
  background: #f3f3f3; border-bottom: 1px solid #d0d0d0;
  padding: 0 4px;
}
.np-menu { position: relative; }
.np-menu-btn {
  appearance: none; border: 0; background: transparent;
  padding: 5px 10px; font: inherit; font-size: 0.8rem; color: #1a1a1a;
  cursor: pointer; border-radius: 2px;
}
.np-menu-btn:hover { background: #e5f1fb; }
.np-menu-drop {
  position: absolute; left: 0; top: 100%; z-index: 20;
  min-width: 220px;
  background: #f2f2f2; border: 1px solid #c6c6c6; border-radius: 4px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.28);
  padding: 4px;
}
.np-menu-drop[hidden] { display: none !important; }
.np-menu-drop button {
  width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 16px;
  appearance: none; border: 0; background: transparent;
  padding: 7px 12px; border-radius: 3px; cursor: pointer;
  font: inherit; font-size: 0.8rem; color: #1a1a1a; text-align: left;
}
.np-menu-drop button:hover { background: #cce8ff; }
.np-menu-drop button span { color: #666; font-size: 0.72rem; }
.np-menu-drop hr { border: 0; border-top: 1px solid #ddd; margin: 4px 6px; }
.np-check {
  display: inline-block; width: 14px; margin-right: 6px;
  font-style: normal; color: #0078d4;
}
.np-find {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 6px 10px; background: #fafafa; border-bottom: 1px solid #e5e5e5;
  flex-shrink: 0; font-size: 0.8rem;
}
.np-find[hidden] { display: none !important; }
.np-find label { display: flex; align-items: center; gap: 6px; color: #444; }
.np-find input {
  height: 26px; min-width: 140px; padding: 0 8px;
  border: 1px solid #7a7a7a; border-radius: 2px; background: #fff; font: inherit;
}
.np-text {
  flex: 1; min-height: 0; width: 100%;
  border: 0; outline: none; resize: none;
  padding: 8px 10px;
  font-family: "Cascadia Mono", "Consolas", "Courier New", monospace;
  font-size: 14px; line-height: 1.45;
  color: #1a1a1a; background: #fff;
  white-space: pre-wrap;
}
.np-text.np-nowrap { white-space: pre; overflow: auto; }
.np-status {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 3px 10px; flex-shrink: 0;
  background: #f3f3f3; border-top: 1px solid #d0d0d0;
  color: #555; font-size: 0.72rem;
}
.np-status[hidden] { display: none !important; }

/* Midnight Commander */
.mc-app {
  flex: 1; min-height: 0; display: flex; flex-direction: column;
  background: #0000aa; color: #aaaaaa;
  font-family: "Consolas", "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.85rem;
  position: relative;
}
.mc-menubar {
  display: flex; gap: 16px; padding: 2px 8px;
  background: #00aaaa; color: #000;
  font-weight: 700;
}
.mc-panes {
  flex: 1; min-height: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px;
  padding: 2px;
}
.mc-pane {
  display: flex; flex-direction: column; min-height: 0;
  border: 1px solid #00aaaa; background: #000088;
}
.mc-pane.active { border-color: #ffff55; }
.mc-pane-head {
  background: #00aaaa; color: #000; text-align: center;
  padding: 2px 6px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mc-pane.active .mc-pane-head { background: #ffff55; }
.mc-list { flex: 1; overflow: auto; outline: none; }
.mc-row {
  display: grid; grid-template-columns: 1fr auto; gap: 8px;
  padding: 1px 8px; cursor: default;
}
.mc-row.dir { color: #fff; font-weight: 600; }
.mc-row.sel { background: #00aaaa; color: #000; }
.mc-pane.active .mc-row.sel { background: #ffff55; color: #000; }
.mc-row .s { opacity: 0.85; }
.mc-cmdline {
  padding: 2px 8px; background: #000; color: #00ff00;
  border-top: 1px solid #00aaaa;
}
.mc-cmdline em { color: #aaaaaa; font-style: normal; margin-left: 8px; font-size: 0.78rem; }
.mc-fkeys {
  display: grid; grid-template-columns: repeat(10, 1fr);
  background: #00aaaa;
}
.mc-fkeys button {
  appearance: none; border: 0; border-right: 1px solid #000088;
  background: #00aaaa; color: #000; padding: 4px 2px;
  font: inherit; font-size: 0.72rem; cursor: pointer; text-align: left;
}
.mc-fkeys button b { background: #000; color: #fff; padding: 0 3px; margin-right: 3px; font-weight: 700; }
.mc-fkeys button:hover { background: #ffff55; }
.mc-view {
  position: absolute; inset: 24px 24px 40px;
  background: #000088; border: 2px solid #00aaaa; color: #fff;
  display: flex; flex-direction: column; z-index: 5;
}
.mc-view[hidden] { display: none !important; }
.mc-view header {
  display: flex; justify-content: space-between; align-items: center;
  background: #00aaaa; color: #000; padding: 4px 8px;
}
.mc-view header button {
  appearance: none; border: 1px solid #000; background: #00aaaa; cursor: pointer; font: inherit;
}
.mc-view pre {
  flex: 1; margin: 0; padding: 8px; overflow: auto; white-space: pre-wrap; word-break: break-word;
}

/* DMS Kontakt / Mail / Wipe ? Formulare in dlg-shell Fenstern */
.dms-co-form { grid-template-columns: 1fr 1fr; gap: 10px 12px; }
.dms-co-form label { display: flex; flex-direction: column; gap: 4px; font-size: 0.78rem; }
.dms-co-form label span { color: var(--w11-muted, #5d5d5d); font-weight: 500; }
.dms-co-form input, .dms-co-form select, .dms-co-form textarea {
  height: 32px; padding: 0 10px;
  border: 1px solid var(--w11-stroke, #8a8a8a); border-radius: 2px;
  background: var(--w11-window-bg, #fff); color: var(--w11-text, #1a1a1a); font: inherit;
  outline: none;
}
.dms-co-form textarea {
  height: auto; min-height: 110px; padding: 8px 10px; resize: vertical;
}
.dms-co-form input:focus, .dms-co-form select:focus, .dms-co-form textarea:focus {
  border-color: var(--w11-accent, #1670c5);
  box-shadow: 0 0 0 1px var(--w11-accent, #1670c5);
}

/* Absender Neu = Absender Bearbeiten = Zuordnen: gleiche kompakte Form, kein Scroll */
#acc-dms-contact .dlg-form,
#acc-dms-sender-resolve .dlg-form {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
#acc-dms-contact .dlg-pad,
#acc-dms-sender-resolve .dlg-pad {
  overflow: hidden;
  flex: 1;
  min-height: 0;
  padding: 10px 14px 6px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#acc-dms-contact .dms-co-form,
#acc-dms-sender-resolve .dms-co-form {
  gap: 5px 10px;
  flex: 0 0 auto;
}
#acc-dms-contact .dms-co-form label,
#acc-dms-sender-resolve .dms-co-form label {
  gap: 1px;
  font-size: 0.72rem;
}
#acc-dms-contact .dms-co-form input,
#acc-dms-sender-resolve .dms-co-form input {
  height: 26px;
  padding: 0 7px;
  font-size: 0.82rem;
}
#acc-dms-contact .win-sheet-footer,
#acc-dms-sender-resolve .win-sheet-footer {
  padding-top: 6px;
  padding-bottom: 8px;
  flex: 0 0 auto;
}
#acc-dms-sender-resolve .win-sheet-hint {
  margin: 0;
  font-size: 0.74rem;
  line-height: 1.3;
  flex: 0 0 auto;
}
#acc-dms-sender-resolve .dms-sr-suggest-label {
  margin-top: 2px !important;
}
#acc-dms-sender-resolve .dms-suggest-list {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: auto;
}
.dms-wipe-warn {
  margin: 0 0 10px; font-size: 0.88rem; line-height: 1.4; color: var(--w11-text);
}
.dms-wipe-warn strong { color: #c42b1c; }
.dms-wipe-list {
  margin: 0 0 12px; padding-left: 18px;
  font-size: 0.82rem; line-height: 1.45; color: var(--w11-text);
}
.dms-wipe-confirm-label {
  display: flex; flex-direction: column; gap: 4px;
  font-size: 0.78rem; color: var(--w11-text); margin-top: 8px;
}
.dms-wipe-confirm-label input {
  height: 32px; padding: 0 10px;
  border: 1px solid var(--w11-stroke); border-radius: 2px;
  background: var(--w11-window-bg); color: var(--w11-text); font: inherit;
}
.dms-wipe-confirm-label input:focus {
  border-color: #1670c5; outline: none; box-shadow: 0 0 0 1px #1670c5;
}
.dms-co-form .span-2 { grid-column: 1 / -1; }
.dms-master-row {
  cursor: default; user-select: none;
}
.dms-master-row.selected { outline: 1px solid #0067c0; background: #e8f2fc; }
.dms-master-row small { display: block; color: #666; margin-top: 2px; }

/* Task-Manager ? Personalisierung (--w11-*) */
.w11-window.w11-fixed-size .w11-resize { display: none !important; }
.w11-taskmgr-body {
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
  padding: 0 !important;
  overflow: hidden !important;
  scrollbar-width: none;
}
.w11-taskmgr-body::-webkit-scrollbar { display: none; width: 0; height: 0; }
.w11-taskmgr-body .tm-main,
.w11-taskmgr-body .tm-nav,
.w11-taskmgr-body .tm-panel,
.w11-taskmgr-body .tm-core-grid,
.w11-taskmgr-body .tm-disk-grid {
  overflow: hidden !important;
  scrollbar-width: none;
}
.w11-taskmgr-body *::-webkit-scrollbar { display: none; width: 0; height: 0; }
.tm-boot {
  height: 100%;
  display: grid;
  place-content: center;
  gap: 14px;
  text-align: center;
  color: var(--w11-muted);
  background: var(--w11-win-body);
}
.tm-boot-pulse {
  width: 42px;
  height: 42px;
  margin: 0 auto;
  border-radius: 50%;
  border: 3px solid color-mix(in srgb, var(--w11-accent) 25%, transparent);
  border-top-color: var(--w11-accent);
  animation: tm-spin 0.8s linear infinite;
}
@keyframes tm-spin { to { transform: rotate(360deg); } }
.tm-app {
  display: flex;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.tm-nav {
  width: 200px;
  flex-shrink: 0;
  border-right: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body));
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow: hidden;
}
.tm-nav-item {
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  text-align: left;
  padding: 8px 10px;
  border-radius: 10px;
  cursor: pointer;
  font: inherit;
  color: var(--w11-text);
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  min-height: 0;
}
.tm-nav-item:hover {
  background: color-mix(in srgb, var(--w11-highlight) 35%, var(--w11-window-bg));
}
.tm-nav-item.active {
  background: color-mix(in srgb, var(--tm-nav-accent, var(--w11-accent)) 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--tm-nav-accent, var(--w11-accent)) 28%, var(--w11-stroke));
  box-shadow: inset 3px 0 0 var(--tm-nav-accent, var(--w11-accent));
}
.tm-nav-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.tm-nav-item strong { font-size: 0.88rem; font-weight: 650; }
.tm-nav-pct {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--tm-nav-accent, var(--w11-accent));
  font-variant-numeric: tabular-nums;
}
.tm-nav-meter {
  height: 3px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-stroke) 80%, transparent);
  overflow: hidden;
}
.tm-nav-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  transition: width 0.35s ease;
}
.tm-nav-item .tm-chart {
  height: 34px;
  width: 100%;
  display: block;
  border-radius: 6px;
  background: color-mix(in srgb, var(--w11-window-bg) 70%, transparent);
}
.tm-nav-conn-hint {
  font-size: 0.68rem;
  color: var(--w11-muted);
  letter-spacing: 0.02em;
}
.tm-panel-conn {
  min-height: 0;
}
.tm-conn-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  flex: 1;
  min-height: 0;
  align-content: stretch;
}
.tm-conn-section {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  padding: 10px 10px 8px;
}
.tm-conn-section .tm-subh {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin: 0 0 8px;
  padding: 0 2px;
}
.tm-conn-section .tm-subh em {
  font-style: normal;
  font-weight: 650;
  color: var(--tm-nav-accent, var(--w11-accent));
  font-variant-numeric: tabular-nums;
}
.tm-conn-table {
  flex: 1;
  min-height: 0;
  overflow: auto;
  scrollbar-width: thin;
}
.tm-conn-head,
.tm-conn-row {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) 58px minmax(0, 1fr) 52px minmax(148px, auto);
  gap: 6px;
  align-items: center;
  padding: 6px 8px;
  font-size: 0.78rem;
}
.tm-conn-head {
  color: var(--w11-muted);
  font-weight: 650;
  border-bottom: 1px solid var(--w11-stroke);
  position: sticky;
  top: 0;
  background: var(--w11-window-bg);
  z-index: 1;
}
.tm-conn-row {
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  color: var(--w11-text);
}
.tm-conn-row:last-child { border-bottom: 0; }
.tm-conn-row.is-blocked {
  background: color-mix(in srgb, #dc2626 10%, var(--w11-window-bg));
}
.tm-conn-ip,
.tm-conn-user {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.tm-conn-n {
  text-align: center;
  font-variant-numeric: tabular-nums;
  color: var(--w11-muted);
}
.tm-conn-acts {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: flex-end;
}
.tm-conn-btn {
  appearance: none;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 40%, var(--w11-window-bg));
  color: var(--w11-text);
  border-radius: 6px;
  padding: 3px 8px;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 600;
  cursor: pointer;
}
.tm-conn-btn:hover {
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-highlight) 40%, var(--w11-window-bg));
}
.tm-conn-btn-danger {
  border-color: color-mix(in srgb, #dc2626 35%, var(--w11-stroke));
  color: color-mix(in srgb, #dc2626 70%, var(--w11-text));
}
.tm-conn-btn-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--w11-stroke));
  color: color-mix(in srgb, #16a34a 70%, var(--w11-text));
}
@media (max-width: 900px) {
  .tm-conn-cols { grid-template-columns: 1fr; }
}
.tm-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  padding: 12px 16px 12px;
  background: var(--w11-win-body);
  display: flex;
  flex-direction: column;
}
.tm-panel {
  flex: 1;
  min-height: 0;
  max-width: none;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.tm-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  flex-shrink: 0;
}
.tm-kicker {
  margin: 0 0 2px;
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--w11-muted);
}
.tm-panel h3 {
  margin: 0;
  font-size: 1.28rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--w11-text);
}
.tm-head-stat {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.tm-head-stat strong {
  display: block;
  font-size: 1.55rem;
  font-weight: 300;
  line-height: 1;
  color: var(--w11-text);
}
.tm-head-stat span {
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.tm-head-rates {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-end;
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
}
.tm-rate { display: inline-flex; align-items: center; gap: 6px; color: var(--w11-text); }
.tm-rate i {
  width: 8px; height: 8px; border-radius: 50%;
}
.tm-rate.read i { background: #16a34a; }
.tm-rate.write i { background: #ca8a04; }
.tm-chart-frame {
  position: relative;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--w11-accent) 6%, var(--w11-window-bg)),
      var(--w11-window-bg)
    );
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent);
  overflow: hidden;
}
.tm-chart-frame-lg {
  padding: 8px 8px 6px;
  margin-bottom: 10px;
  flex: 0 1 auto;
  min-height: 0;
}
.tm-chart-frame-sm { padding: 4px; }
.tm-chart-frame .tm-chart {
  width: 100%;
  height: 96px;
  display: block;
}
.tm-chart-frame-sm .tm-chart { height: 36px; }
.tm-chart-labels {
  position: absolute;
  left: 12px;
  top: 10px;
  bottom: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  pointer-events: none;
  font-size: 0.65rem;
  color: var(--w11-muted);
  z-index: 1;
}
.tm-chart-legend {
  display: flex;
  gap: 14px;
  padding: 2px 6px 4px;
  font-size: 0.72rem;
  color: var(--w11-muted);
}
.tm-chart-legend .read::before,
.tm-chart-legend .write::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 3px;
  margin-right: 6px;
  vertical-align: middle;
  border-radius: 2px;
}
.tm-chart-legend .read::before { background: #16a34a; }
.tm-chart-legend .write::before { background: #ca8a04; }
.tm-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
  flex-shrink: 0;
}
.tm-stat {
  padding: 7px 10px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  min-width: 0;
}
.tm-stat-wide {
  grid-column: 1 / -1;
}
.tm-stat span {
  display: block;
  font-size: 0.68rem;
  color: var(--w11-muted);
  margin-bottom: 2px;
}
.tm-stat strong {
  display: block;
  font-size: 0.84rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  color: var(--w11-text);
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.25;
}
.tm-ellip {
  /* kept for compatibility; Task-Manager values wrap fully */
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}
.tm-subh {
  margin: 0 0 6px;
  font-size: 0.76rem;
  font-weight: 650;
  color: var(--w11-muted);
  letter-spacing: 0.02em;
  flex-shrink: 0;
}
.tm-core-grid {
  display: grid;
  grid-template-columns: repeat(var(--tm-core-cols, 6), minmax(0, 1fr));
  gap: 6px;
  flex: 1;
  min-height: 0;
  align-content: stretch;
}
.tm-core-card {
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
  padding: 5px 6px 4px;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.tm-core-card:hover {
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
  box-shadow: 0 4px 14px color-mix(in srgb, var(--w11-accent) 12%, transparent);
}
.tm-core-h {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 2px;
  font-size: 0.66rem;
  color: var(--w11-muted);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
.tm-core-h em {
  font-style: normal;
  font-weight: 650;
  color: var(--w11-accent);
}
.tm-core-card .tm-chart {
  width: 100%;
  flex: 1;
  min-height: 28px;
  max-height: 44px;
  height: 36px;
  display: block;
  border-radius: 5px;
  background: color-mix(in srgb, var(--w11-accent) 5%, var(--w11-win-body));
}
.tm-compose { margin-bottom: 10px; flex-shrink: 0; }
.tm-compose-bar {
  display: flex;
  height: 14px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--w11-stroke) 70%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
}
.tm-compose-bar i { display: block; height: 100%; transition: width 0.4s ease; }
.tm-compose-bar i.free { background: color-mix(in srgb, var(--w11-muted) 18%, var(--w11-window-bg)); }
.tm-compose-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 8px;
  font-size: 0.75rem;
  color: var(--w11-muted);
}
.tm-compose-legend span { display: inline-flex; align-items: center; gap: 6px; }
.tm-compose-legend i {
  width: 10px; height: 10px; border-radius: 3px; display: inline-block;
}
.tm-compose-legend i.free {
  background: color-mix(in srgb, var(--w11-muted) 28%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
}
.tm-mem-hero {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, #a78bfa 8%, var(--w11-window-bg));
  flex-shrink: 0;
  margin-top: auto;
}
.tm-mem-hero-txt strong {
  display: block;
  font-size: 1.25rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.tm-mem-hero-txt span { font-size: 0.8rem; color: var(--w11-muted); }
.tm-ring { width: 72px; height: 72px; flex: 0 0 auto; }
.tm-ring-track {
  fill: none;
  stroke: color-mix(in srgb, var(--w11-stroke) 90%, transparent);
  stroke-width: 7;
}
.tm-ring-val {
  fill: none;
  stroke-width: 7;
  stroke-linecap: round;
  transition: stroke-dasharray 0.4s ease;
}
.tm-ring-txt {
  font-size: 13px;
  font-weight: 700;
  fill: var(--w11-text);
  font-variant-numeric: tabular-nums;
}
.tm-disk-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
  flex: 1;
  min-height: 0;
  align-content: start;
  overflow: hidden;
}
.tm-disk-card {
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.tm-disk-card.is-hot {
  border-color: color-mix(in srgb, #dc2626 45%, var(--w11-stroke));
  background: color-mix(in srgb, #dc2626 8%, var(--w11-window-bg));
}
.tm-disk-card-top {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tm-disk-name {
  display: block;
  font-size: 0.9rem;
  font-weight: 650;
  color: var(--w11-text);
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.tm-disk-sub, .tm-disk-size, .tm-disk-free {
  display: block;
  font-size: 0.72rem;
  color: var(--w11-muted);
  font-variant-numeric: tabular-nums;
  white-space: normal;
  overflow-wrap: anywhere;
}
.tm-empty { margin: 8px 0; color: var(--w11-muted); font-size: 0.85rem; }

@media (max-width: 900px) {
  .tm-core-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .tm-app { flex-direction: column; }
  .tm-nav {
    width: 100%;
    flex-direction: row;
    overflow: hidden;
    border-right: 0;
    border-bottom: 1px solid var(--w11-stroke);
  }
  .tm-nav-item { min-width: 0; flex: 1; }
  .tm-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tm-core-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Dienste */
.w11-services-body { background: var(--w11-win-body) !important; color: var(--w11-text); }
.svc-app { height: 100%; display: flex; flex-direction: column; min-height: 0; background: #fff; }
.svc-toolbar {
  display: flex; gap: 8px; padding: 8px 10px; background: #f3f3f3; border-bottom: 1px solid #d0d0d0;
}
.svc-toolbar input[type="search"] {
  flex: 1; height: 28px; padding: 0 8px; border: 1px solid #7a7a7a; border-radius: 2px; font: inherit;
}
.svc-table-wrap { flex: 1; min-height: 0; overflow: auto; }
.svc-table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.svc-table th {
  text-align: left; padding: 8px 10px; background: #fafafa; border-bottom: 1px solid #e0e0e0;
  position: sticky; top: 0; z-index: 1;
}
.svc-table td { padding: 7px 10px; border-bottom: 1px solid #f0f0f0; vertical-align: top; }
.svc-row { cursor: default; user-select: none; }
.svc-row:hover { background: #f5f9fc; }
.svc-row.selected { background: #cce8ff; }
.svc-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px;
  background: #9ca3af; vertical-align: middle;
}
.svc-row.running .svc-dot { background: #16a34a; }
.svc-row.active .svc-dot { background: #eab308; }
.svc-row.stopped .svc-dot { background: #dc2626; }

/* Outlook + Tickets ? Farben aus Personalisierung */
.ol-host,
.ol-compose-host {
  --ol-accent: var(--w11-accent);
  --ol-accent-hover: color-mix(in srgb, var(--w11-accent) 85%, #ffffff);
  --ol-accent-pressed: color-mix(in srgb, var(--w11-accent) 75%, #000000);
  --ol-bg: var(--w11-win-body);
  --ol-bg-subtle: color-mix(in srgb, var(--w11-win-body) 88%, var(--w11-text));
  --ol-bg-hover: color-mix(in srgb, var(--w11-win-body) 82%, var(--w11-text));
  --ol-border: var(--w11-stroke);
  --ol-border-strong: var(--w11-win-border);
  --ol-text: var(--w11-text);
  --ol-muted: var(--w11-muted);
  --ol-sel-folder: var(--w11-highlight);
  --ol-sel-msg: var(--w11-highlight);
  --ol-unread-bar: var(--w11-accent);
  --ol-badge: var(--w11-accent);
  --ol-avatar: var(--w11-ol-avatar, #c7e0f4);
  --ol-avatar-fg: var(--w11-ol-avatar-fg, #004578);
  --ol-font: "Segoe UI", SegoeUI, "Segoe UI Web (West European)", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
}
.ol-host {
  height: 100%;
  width: 100%;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--ol-bg);
  color: var(--ol-text);
  font-family: var(--ol-font);
  container-type: size;
  container-name: ol;
}
.w11-win-body.w11-outlook-body {
  overflow: hidden !important;
  padding: 0 !important;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.w11-win-body.w11-outlook-body > .ol-host,
.w11-win-body.w11-outlook-body > .ol-compose-host,
.w11-win-body.w11-outlook-body > .ol-ticket-reply-host,
.w11-win-body.w11-outlook-body > .ol-ticket-note-host,
.w11-win-body.w11-outlook-body > .ol-viewer-mount {
  flex: 1;
  min-width: 0;
  min-height: 0;
  height: 100%;
  width: 100%;
}
.ol-app {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: row;
  font-family: var(--ol-font);
  color: var(--ol-text);
  background: var(--ol-bg);
}
.ol-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--ol-bg);
}

/* ?? 3-pane mail shell (folders | list | reading) ?? */
.ol-shell {
  flex: 1;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  background: var(--ol-bg);
  overflow: hidden;
}
.ol-splitter {
  flex: 0 0 5px;
  width: 5px;
  cursor: col-resize;
  background: var(--ol-border);
  border-left: 1px solid var(--ol-border-strong);
  border-right: 1px solid transparent;
  position: relative;
  z-index: 3;
  align-self: stretch;
  touch-action: none;
  user-select: none;
}
/* Breitere Trefferfl?che zum Ziehen */
.ol-splitter::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -4px;
  right: -4px;
}
.ol-splitter:hover,
.ol-splitter.dragging {
  background: var(--ol-accent);
  border-color: var(--ol-accent);
}
.ol-host.ol-dark .ol-splitter {
  background: var(--ol-border);
  border-left-color: var(--ol-border-strong);
}
.ol-host.ol-dark .ol-splitter:hover,
.ol-host.ol-dark .ol-splitter.dragging {
  background: var(--ol-accent);
  border-color: var(--ol-accent);
}
.ol-nav {
  width: 48px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 0;
  background: var(--ol-bg-subtle);
  border-right: 1px solid var(--ol-border);
}
.ol-nav-btn {
  appearance: none;
  border: 0;
  background: transparent;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  cursor: pointer;
  color: var(--ol-muted);
  font-family: inherit;
  font-size: 0.62rem;
  line-height: 1;
  position: relative;
  transition: background 0.1s ease, color 0.1s ease;
}
.ol-nav-btn svg,
.ol-nav-btn .ol-nav-ico {
  width: 20px;
  height: 20px;
  display: block;
  fill: currentColor;
}
.ol-nav-btn:hover { background: var(--ol-bg-hover); color: var(--ol-text); }
.ol-nav-btn.active {
  color: var(--ol-accent);
  background: transparent;
}
.ol-nav-btn.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 2px 2px 0;
  background: var(--ol-accent);
}
.ol-nav-spacer { flex: 1; }

/* ?? Ribbon toolbar ?? */
.ol-ribbon,
.ol-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0;
  padding: 0;
  background: var(--ol-bg-subtle);
  border-bottom: 1px solid var(--ol-border);
  flex-shrink: 0;
  min-height: 72px;
  color: var(--ol-text);
}
.ol-ribbon-inner,
.ol-toolbar-left,
.ol-toolbar-right,
.ol-toolbar-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0;
}
.ol-toolbar {
  justify-content: space-between;
  align-items: center;
  padding: 4px 8px;
  min-height: 48px;
  gap: 8px;
}
.ol-toolbar-left,
.ol-toolbar-right { align-items: center; gap: 4px; padding: 4px 0; }
.ol-toolbar-tabs { align-items: center; gap: 2px; }
.ol-ribbon-group {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  padding: 6px 8px;
  border-right: 0;
  min-height: 68px;
  gap: 2px;
}
.ol-ribbon-sep {
  width: 1px;
  align-self: stretch;
  margin: 10px 4px;
  background: var(--ol-border-strong);
  flex-shrink: 0;
}
.ol-ribbon-grow { flex: 1; min-width: 8px; }
.ol-ribbon-search {
  align-items: center;
  gap: 8px;
  margin-left: auto;
  flex: 0 0 480px;
  width: 480px;
  max-width: 480px;
  min-width: 480px;
  justify-content: flex-end;
}
.ol-ribbon-search #ol-search-scope,
.ol-ribbon-search .ol-dd[data-for="ol-search-scope"] {
  width: 102px;
  max-width: 102px;
  min-width: 102px;
  flex: 0 0 102px;
}
.ol-ribbon-search .ol-dd[data-for="ol-account"] {
  width: 128px;
  max-width: 128px;
  min-width: 128px;
  flex: 0 0 128px;
}

/* Unified search bar with filter chips */
.ol-search-bar {
  --ol-search-h: 34px;
  --ol-search-w: 480px;
  position: relative;
  display: flex;
  align-items: center;
  gap: 4px;
  box-sizing: border-box;
  width: var(--ol-search-w);
  min-width: var(--ol-search-w);
  max-width: var(--ol-search-w);
  flex: 0 0 var(--ol-search-w);
  min-height: var(--ol-search-h);
  height: var(--ol-search-h);
  padding: 3px 6px 3px 4px;
  border: 1px solid color-mix(in srgb, var(--ol-border-strong) 88%, var(--ol-accent) 12%);
  border-radius: 999px;
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--ol-bg) 88%, var(--ol-accent) 12%) 0%,
      var(--ol-bg) 42%,
      color-mix(in srgb, var(--ol-bg) 94%, #fff 6%) 100%
    );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 14%, transparent),
    0 1px 2px color-mix(in srgb, #000 10%, transparent);
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease;
}
.ol-search-bar:hover {
  border-color: color-mix(in srgb, var(--ol-accent) 42%, var(--ol-border-strong));
}
.ol-search-bar.is-focused,
.ol-search-bar.suggest-open {
  border-color: var(--ol-accent);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 10%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ol-accent) 70%, transparent),
    0 8px 22px color-mix(in srgb, var(--ol-accent) 18%, transparent);
}
.ol-search-bar-compact {
  --ol-search-w: 260px;
  width: 260px;
  min-width: 260px;
  max-width: 260px;
  flex: 0 0 260px;
  margin-left: auto;
}
.ol-search-filters {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  min-width: 0;
}
.ol-search-divider {
  width: 1px;
  height: 18px;
  margin: 0 2px;
  flex-shrink: 0;
  background: linear-gradient(
    180deg,
    transparent,
    color-mix(in srgb, var(--ol-text) 22%, transparent),
    transparent
  );
}
.ol-search-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-left: 2px;
  color: color-mix(in srgb, var(--ol-muted, #888) 80%, var(--ol-accent) 20%);
  opacity: 0.9;
  transition: color 0.15s ease, transform 0.15s ease;
}
.ol-search-bar.is-focused .ol-search-ico,
.ol-search-bar.suggest-open .ol-search-ico {
  color: var(--ol-accent);
  transform: scale(1.05);
}
.ol-search-bar #ol-q {
  appearance: none;
  flex: 1 1 auto;
  min-width: 72px;
  width: auto;
  height: 26px;
  margin: 0;
  padding: 0 4px;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ol-text);
  font: inherit;
  font-size: 0.8rem;
  outline: none !important;
}
.ol-search-bar #ol-q::-webkit-search-decoration,
.ol-search-bar #ol-q::-webkit-search-cancel-button,
.ol-search-bar #ol-q::-webkit-search-results-button {
  -webkit-appearance: none;
  appearance: none;
}
.ol-search-bar #ol-q::placeholder {
  color: color-mix(in srgb, var(--ol-muted, #888) 88%, transparent);
}
.ol-search-clear {
  appearance: none;
  flex: 0 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ol-text) 10%, transparent);
  color: var(--ol-muted, #888);
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, opacity 0.12s ease;
}
.ol-search-clear:hover {
  background: color-mix(in srgb, var(--ol-accent) 22%, transparent);
  color: var(--ol-text);
}
.ol-search-clear[hidden] {
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
}

/* Chip dropdowns inside search bar */
.ol-dd.ol-dd-chip {
  flex: 0 0 auto;
}
.ol-dd.ol-dd-chip .ol-dd-btn {
  width: 100%;
  height: 26px;
  gap: 5px;
  padding: 0 7px 0 8px;
  border-radius: 999px;
  border-color: color-mix(in srgb, var(--ol-border-strong) 70%, transparent);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--ol-bg) 70%, #fff 30%) 0%,
      color-mix(in srgb, var(--ol-bg) 92%, var(--ol-accent) 8%) 100%
    );
  box-shadow: none;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.ol-dd.ol-dd-chip .ol-dd-btn:hover {
  border-color: color-mix(in srgb, var(--ol-accent) 50%, var(--ol-border-strong));
  background: color-mix(in srgb, var(--ol-accent) 12%, var(--ol-bg));
}
.ol-dd.ol-dd-chip.open .ol-dd-btn,
.ol-dd.ol-dd-chip .ol-dd-btn:focus-visible {
  border-color: var(--ol-accent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ol-accent) 55%, transparent);
}
.ol-dd.ol-dd-chip .ol-dd-ico {
  flex-shrink: 0;
  opacity: 0.85;
  color: var(--ol-accent);
}
.ol-dd.ol-dd-chip .ol-dd-label {
  flex: 1;
  min-width: 0;
  max-width: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-dd.ol-dd-chip .ol-dd-chev {
  opacity: 0.55;
}
.ol-dd.ol-dd-chip.open::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 12px;
  z-index: 91;
}
.ol-dd.ol-dd-chip .ol-dd-menu {
  min-width: max(100%, 180px);
  border-radius: 12px;
  padding: 6px;
  top: calc(100% + 8px);
  box-shadow:
    0 14px 36px color-mix(in srgb, #000 34%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ol-text) 8%, transparent);
}
.ol-dd.ol-dd-chip .ol-dd-opt {
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 0.78rem;
}

/* Suggest dropdown (anchored to .ol-search-bar) */
.ol-search-bar.suggest-open::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 12px;
  z-index: 89;
}
.ol-suggest {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 90;
  max-height: 300px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 14px;
  background: color-mix(in srgb, var(--ol-bg) 92%, #fff 8%);
  color: var(--ol-text);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow:
    0 16px 40px color-mix(in srgb, #000 34%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ol-text) 6%, transparent);
}
.ol-suggest[hidden] { display: none !important; }

/* Custom Outlook dropdowns */
.ol-dd {
  position: relative;
  display: inline-flex;
  vertical-align: middle;
  min-width: 0;
}
.ol-dd-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.ol-dd-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 30px;
  max-width: 100%;
  padding: 0 10px 0 12px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 6px;
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--ol-bg) 92%, #fff) 0%,
      var(--ol-bg) 100%);
  color: var(--ol-text);
  font: inherit;
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ol-text) 6%, transparent);
  transition: border-color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}
.ol-dd-btn:hover {
  background: var(--ol-bg-hover);
  border-color: color-mix(in srgb, var(--ol-accent) 45%, var(--ol-border-strong));
}
.ol-dd.open .ol-dd-btn,
.ol-dd-btn:focus-visible {
  border-color: var(--ol-accent);
  box-shadow: 0 0 0 1px var(--ol-accent);
  outline: none;
}
.ol-dd-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}
.ol-dd-chev {
  flex-shrink: 0;
  display: inline-flex;
  opacity: 0.7;
  transition: transform 0.15s ease;
}
.ol-dd.open .ol-dd-chev { transform: rotate(180deg); }
.ol-dd-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  min-width: 100%;
  max-height: 240px;
  overflow: auto;
  z-index: 80;
  padding: 4px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 8px;
  background: var(--ol-bg);
  color: var(--ol-text);
  box-shadow:
    0 8px 24px color-mix(in srgb, #000 28%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ol-text) 6%, transparent);
}
.ol-dd-menu[hidden] { display: none !important; }
.ol-dd-opt {
  appearance: none;
  display: block;
  width: 100%;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.8rem;
  text-align: left;
  padding: 7px 10px;
  cursor: pointer;
}
.ol-dd-opt:hover,
.ol-dd-opt:focus-visible {
  background: var(--ol-bg-hover);
  outline: none;
}
.ol-dd-opt.selected {
  background: color-mix(in srgb, var(--ol-accent) 18%, var(--ol-bg));
  color: var(--ol-accent);
  font-weight: 600;
}
.ol-dd-opt.selected:hover {
  background: color-mix(in srgb, var(--ol-accent) 26%, var(--ol-bg));
}

/* Search suggestions list items */
.ol-suggest-item {
  appearance: none;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  padding: 8px 10px;
  cursor: pointer;
}
.ol-suggest-item:hover,
.ol-suggest-item.active {
  background: var(--ol-bg-hover);
}
.ol-suggest-ico {
  flex-shrink: 0;
  width: 18px;
  text-align: center;
  opacity: 0.75;
  font-size: 0.85rem;
  line-height: 1.35;
}
.ol-suggest-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.ol-suggest-label {
  font-size: 0.8rem;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-suggest-hint {
  font-size: 0.68rem;
  color: var(--ol-muted);
}

.ol-search-progress {
  padding: 20px 16px;
  color: var(--ol-muted);
  font-size: 0.85rem;
}
.ol-search-progress p {
  margin: 10px 0 14px;
  color: var(--ol-text);
  font-weight: 600;
}
.ol-search-progress-bar {
  height: 3px;
  border-radius: 2px;
  background: var(--ol-border-strong);
  overflow: hidden;
}
.ol-search-progress-bar i {
  display: block;
  height: 100%;
  width: 40%;
  background: var(--ol-accent);
  border-radius: 2px;
  animation: ol-search-indeterminate 1.1s ease-in-out infinite;
}
@keyframes ol-search-indeterminate {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(280%); }
}
.ol-search-skel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 8px;
}
.ol-search-skel .ol-skel-line {
  height: 10px;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--ol-bg-subtle), var(--ol-bg-hover), var(--ol-bg-subtle));
  background-size: 200% 100%;
  animation: ol-skel-shimmer 1.2s ease-in-out infinite;
}
.ol-ribbon-title {
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0 8px;
  align-self: center;
}
.ol-ribbon-group-btns {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  flex: 1;
}
.ol-ribbon-group-label {
  font-size: 0.68rem;
  color: var(--ol-muted);
  margin-top: 2px;
  white-space: nowrap;
  user-select: none;
}
.ol-rbtn,
.ol-tab {
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ol-text);
  font-family: inherit;
  font-size: 0.75rem;
  padding: 4px 8px;
  border-radius: 2px;
  cursor: pointer;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 44px;
  min-height: 48px;
  line-height: 1.15;
  transition: background 0.08s ease, border-color 0.08s ease;
}
.ol-rbtn svg,
.ol-rbtn .ol-rbtn-ico {
  width: 20px;
  height: 20px;
  display: block;
  fill: currentColor;
}
.ol-rbtn.ol-rbtn-sm {
  flex-direction: row;
  min-width: 0;
  min-height: 24px;
  padding: 2px 6px;
  gap: 4px;
}
.ol-rbtn.ol-rbtn-sm svg,
.ol-rbtn.ol-rbtn-sm .ol-rbtn-ico { width: 16px; height: 16px; }
.ol-rbtn:hover,
.ol-tab:hover { background: var(--ol-bg-hover); border-color: transparent; }
.ol-rbtn:active,
.ol-tab:active { background: color-mix(in srgb, var(--ol-bg-hover) 70%, var(--ol-text)); }
.ol-rbtn.active,
.ol-rbtn[aria-pressed="true"] {
  background: color-mix(in srgb, var(--ol-accent) 18%, var(--ol-bg));
  border-color: color-mix(in srgb, var(--ol-accent) 40%, var(--ol-border));
  color: var(--ol-accent);
}
.ol-rbtn.ol-rbtn-primary,
.ol-rbtn.primary {
  background: var(--ol-accent);
  color: #fff;
  border-color: var(--ol-accent);
  font-weight: 600;
  min-width: 64px;
}
.ol-rbtn.ol-rbtn-primary:hover,
.ol-rbtn.primary:hover { background: var(--ol-accent-hover); border-color: var(--ol-accent-hover); }
.ol-rbtn.ol-rbtn-primary:active,
.ol-rbtn.primary:active { background: var(--ol-accent-pressed); }
.ol-rbtn.danger { color: #a4262c; }
.ol-rbtn.danger:hover { background: #fde7e9; }
.ol-rbtn:disabled,
.ol-tab:disabled { opacity: 0.45; cursor: default; pointer-events: none; }
.ol-tab {
  min-width: 0;
  min-height: 32px;
  flex-direction: row;
  padding: 6px 14px;
  font-size: 0.82rem;
  border-radius: 4px;
}
.ol-tab.active {
  background: var(--ol-bg);
  box-shadow: inset 0 -2px 0 var(--ol-accent);
  font-weight: 600;
  color: var(--ol-accent);
}
.ol-ribbon select,
.ol-ribbon input[type="search"],
.ol-toolbar select,
.ol-toolbar input[type="search"] {
  height: 28px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 2px;
  background: var(--ol-bg);
  color: var(--ol-text);
  font-family: inherit;
  font-size: 0.8rem;
  padding: 0 8px;
  outline: none;
}
.ol-ribbon select:focus,
.ol-ribbon input[type="search"]:focus,
.ol-toolbar select:focus,
.ol-toolbar input[type="search"]:focus {
  border-color: var(--ol-accent);
  box-shadow: 0 0 0 1px var(--ol-accent);
}
.ol-toolbar input[type="search"],
.ol-ribbon input[type="search"] { min-width: 180px; }

/* Dark: Postfach-Dropdown + Suche (schl?gt .w11-hosted input !important) */
body.w11-desktop-mode .w11-win-body .ol-host.ol-dark .ol-ribbon select,
body.w11-desktop-mode .w11-win-body .ol-host.ol-dark .ol-ribbon input[type="search"],
body.w11-desktop-mode .w11-win-body .ol-host.ol-dark .ol-ribbon input[type="text"],
.w11-win-body .ol-host.ol-dark .ol-ribbon select,
.w11-win-body .ol-host.ol-dark .ol-ribbon input[type="search"],
.w11-win-body .ol-host.ol-dark .ol-ribbon input[type="text"],
.ol-host.ol-dark .ol-ribbon select,
.ol-host.ol-dark .ol-ribbon input[type="search"],
.ol-host.ol-dark #ol-account,
.ol-host.ol-dark #ol-q {
  background: #2d2d2d !important;
  background-color: #2d2d2d !important;
  color: #f3f2f1 !important;
  border: 1px solid #5a5a5a !important;
  color-scheme: dark;
}
.ol-host.ol-dark .ol-ribbon select option,
.ol-host.ol-dark #ol-account option {
  background: #2d2d2d !important;
  color: #f3f2f1 !important;
}
.ol-host.ol-dark .ol-ribbon input[type="search"]::placeholder,
.ol-host.ol-dark #ol-q::placeholder {
  color: #a19f9d !important;
  opacity: 1;
}
.ol-host.ol-dark .ol-ribbon select:focus,
.ol-host.ol-dark .ol-ribbon input[type="search"]:focus,
.ol-host.ol-dark #ol-account:focus,
.ol-host.ol-dark #ol-q:focus {
  border-color: var(--ol-accent) !important;
  box-shadow: 0 0 0 1px var(--ol-accent);
  outline: none;
}
.ol-host.ol-dark .ol-search-bar,
body.w11-desktop-mode .w11-win-body .ol-host.ol-dark .ol-search-bar {
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-window-bg, #2a2a2a) 86%, var(--w11-accent, var(--ol-accent)) 14%) 0%,
      var(--w11-window-bg, #2a2a2a) 48%,
      color-mix(in srgb, var(--w11-window-bg, #2a2a2a) 92%, #000 8%) 100%
    ) !important;
  border-color: color-mix(in srgb, var(--w11-stroke, #5a5a5a) 75%, var(--w11-accent, var(--ol-accent)) 25%) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 6%, transparent),
    0 1px 2px color-mix(in srgb, #000 28%, transparent) !important;
}
.ol-host.ol-dark .ol-search-bar #ol-q,
.ol-host.ol-dark .ol-search-bar #ol-q:focus,
body.w11-desktop-mode .w11-win-body .ol-host.ol-dark .ol-search-bar #ol-q,
body.w11-desktop-mode .w11-win-body .ol-host.ol-dark .ol-search-bar #ol-q:focus {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--w11-text, #f3f2f1) !important;
}
.ol-host.ol-dark .ol-dd.ol-dd-chip .ol-dd-btn {
  background: color-mix(in srgb, var(--w11-window-bg, #323232) 88%, var(--w11-accent, var(--ol-accent)) 12%) !important;
  border-color: color-mix(in srgb, var(--w11-stroke, #5a5a5a) 80%, transparent) !important;
  color: var(--w11-text, #f3f2f1) !important;
  box-shadow: none !important;
}
.ol-body {
  flex: 1;
  min-height: 0;
  position: relative;
  display: block;
  background: var(--ol-bg);
  overflow: hidden;
}
.ol-pane {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
  min-width: 0;
  background: var(--ol-bg, var(--w11-win-body));
  color: var(--ol-text, var(--w11-text));
}
.ol-pane:not([hidden]) {
  z-index: 1;
}
.ol-pane[hidden] { display: none !important; }
.ol-ribbon[hidden],
.win-app-status[hidden] { display: none !important; }
.ol-module-host {
  flex: 1;
  min-height: 0;
  min-width: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* ?? Mail layout: folder pane + message list + reading ?? */
.ol-mail {
  height: 100%;
  display: grid;
  grid-template-columns: 240px 1fr;
  min-height: 0;
  background: var(--ol-bg);
}
.ol-mail.ol-mail-3pane {
  grid-template-columns: 240px minmax(280px, 360px) 1fr;
}
.ol-folder-pane,
.ol-folders {
  border-right: 0;
  background: var(--ol-bg-subtle);
  overflow: hidden;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 0 0 auto;
  width: 240px;
  min-width: 140px;
  max-width: 480px;
}
.ol-folder-acct {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px 8px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--ol-text);
  border-bottom: 1px solid var(--ol-border);
  flex-shrink: 0;
  user-select: none;
}
.ol-folder-acct .ol-avatar {
  width: 28px;
  height: 28px;
  font-size: 0.7rem;
  flex-shrink: 0;
}
.ol-folder-acct-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.ol-folder-acct-meta small {
  font-weight: 400;
  font-size: 0.68rem;
  color: var(--ol-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Folder tree */
.ol-tree {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 4px 0 8px;
}
.ol-tree-section {
  margin-top: 4px;
}
.ol-tree-row,
.ol-folder {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  appearance: none;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 4px 8px 4px calc(4px + (var(--ol-depth, 0) * 14px));
  font: inherit;
  font-size: 0.8125rem;
  color: var(--ol-text);
  cursor: default;
  border-radius: 0;
  min-height: 28px;
  box-sizing: border-box;
  position: relative;
}
.ol-chevron-spacer { width: 16px; height: 16px; flex-shrink: 0; }
.ol-fico[data-folder-drag],
.ol-fname[data-folder-drag] {
  cursor: default;
}
.ol-tree-row.ol-dragging .ol-fico,
.ol-tree-row.ol-dragging .ol-fname {
  cursor: grabbing;
}
.ol-fname {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-fname-edit {
  flex: 1;
  min-width: 0;
  height: 22px;
  margin: 0 4px 0 0;
  padding: 0 6px;
  border: 1px solid #0067c0;
  border-radius: 2px;
  background: #fff;
  color: #1a1a1a;
  font: inherit;
  font-size: 0.82rem;
  outline: none;
  box-shadow: 0 0 0 1px rgba(0, 103, 192, 0.25);
}
.ol-host.ol-dark .ol-fname-edit {
  background: #2d2d2d;
  color: #f3f3f3;
  border-color: #4cc2ff;
}
.ol-folder-props-host {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.ol-folder-props-shell {
  height: 100%;
}
.ol-folder-props-identity {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
}
.ol-folder-props-ico {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  color: #0078d4;
}
.ol-folder-props-ico svg {
  width: 28px;
  height: 28px;
}
.ol-folder-props-identity-text {
  flex: 1;
  min-width: 0;
}
.ol-folder-props-name {
  width: 100%;
  appearance: none;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  padding: 6px 10px;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 600;
  color: #1a1a1a;
  background: #fff;
}
.ol-folder-props-type {
  margin: 6px 0 0;
  font-size: 0.78rem;
  color: #605e5c;
}
.ol-folder-props-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 4px;
}
.ol-folder-props-table th {
  width: 120px;
  text-align: left;
  vertical-align: top;
  padding: 8px 12px 8px 0;
  font-weight: 600;
  font-size: 0.82rem;
  color: #605e5c;
  white-space: nowrap;
}
.ol-folder-props-table td {
  padding: 8px 0;
  font-size: 0.84rem;
  color: #1a1a1a;
  word-break: break-word;
}
.ol-folder-props-err {
  margin: 0;
  word-break: break-word;
  white-space: pre-wrap;
  max-height: 180px;
  overflow: auto;
}
.w11-window.ol-folder-props-win.ol-dark .ol-folder-props-name,
.w11-window.ol-cat-dlg-win.ol-dark .ol-folder-props-name {
  background: #2d2d2d !important;
  color: #f3f3f3 !important;
  border-color: #3d3d3d !important;
}
.w11-window.ol-folder-props-win.ol-dark .ol-folder-props-type,
.w11-window.ol-folder-props-win.ol-dark .ol-folder-props-table th,
.w11-window.ol-cat-dlg-win.ol-dark .ol-folder-props-type,
.w11-window.ol-cat-dlg-win.ol-dark .ol-folder-props-table th {
  color: #a19f9d !important;
}
.w11-window.ol-folder-props-win.ol-dark .ol-folder-props-table td,
.w11-window.ol-cat-dlg-win.ol-dark .ol-folder-props-table td {
  color: #f3f3f3 !important;
}
.w11-window.ol-folder-props-win.ol-dark .ol-folder-props-ico,
.w11-window.ol-cat-dlg-win.ol-dark .ol-folder-props-ico {
  color: #4cc2ff;
}
.w11-window.ol-folder-props-win,
.w11-window.ol-folder-props-win .w11-win-body,
.w11-window.ol-folder-props-win .w11-dialog-body,
.w11-window.ol-folder-props-win .dlg-shell,
.w11-window.ol-folder-props-win .dlg-form,
.w11-window.ol-folder-props-win .dlg-pad,
.w11-window.ol-folder-props-win .ol-folder-props-host {
  overflow: hidden;
}
.ol-tree-row:hover,
.ol-folder:hover { background: var(--ol-bg-hover); }
.ol-tree-row.selected,
.ol-tree-row.active,
.ol-folder.active {
  background: var(--ol-sel-folder);
  color: var(--w11-highlight-fg, var(--ol-text));
  font-weight: 600;
}
.ol-tree-row.selected:hover,
.ol-tree-row.active:hover,
.ol-folder.active:hover {
  background: color-mix(in srgb, var(--ol-sel-folder) 82%, var(--ol-text));
}
.ol-chevron {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ol-muted);
  border-radius: 2px;
  transition: transform 0.12s ease;
}
.ol-chevron svg { width: 10px; height: 10px; fill: currentColor; }
.ol-chevron:hover { background: rgba(0, 0, 0, 0.06); color: var(--ol-text); }
.ol-tree-row.expanded > .ol-chevron,
.ol-chevron.open { transform: rotate(90deg); }
.ol-tree-row .ol-tree-indent { width: 16px; flex-shrink: 0; }
.ol-fico {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ol-accent);
}
.ol-fico svg { width: 14px; height: 14px; fill: currentColor; }
.ol-fico.inbox { color: #0078d4; }
.ol-fico.sent { color: #8764b8; }
.ol-fico.drafts { color: #ca5010; }
.ol-fico.deleted { color: #a4262c; }
.ol-fico.junk { color: #69797e; }
.ol-fico.archive { color: #038387; }
.ol-tree-label,
.ol-folder > span:first-child {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-badge,
.ol-tree-row em,
.ol-folder em {
  font-style: normal;
  font-size: 0.68rem;
  font-weight: 600;
  color: #fff;
  background: var(--ol-badge);
  border-radius: 10px;
  padding: 1px 7px;
  min-width: 18px;
  text-align: center;
  line-height: 1.4;
  flex-shrink: 0;
}
/* JS only mounts children when expanded */
.ol-tree-children { display: block; }

/* Message list pane */
.ol-msg-pane,
.ol-list {
  overflow: hidden;
  border-bottom: 0;
  border-right: 0;
  background: var(--ol-bg);
  min-height: 0;
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  width: 320px;
  min-width: 200px;
  max-width: 640px;
}
.ol-msg-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.ol-msg-loadmore {
  height: 1px;
  width: 100%;
  pointer-events: none;
}
.ol-account-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px 10px;
  border-bottom: 1px solid var(--ol-border);
  flex-shrink: 0;
  background: var(--ol-bg-subtle);
}
.ol-account-head strong {
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.2;
}
.ol-account-head small {
  font-size: 0.72rem;
  color: var(--ol-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-reading-pane {
  min-width: 160px;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: var(--ol-bg);
  flex: 1 1 0;
}
.ol-reading-pane > .ol-reading,
.ol-reading-pane > .ol-empty {
  flex: 1;
  min-height: 0;
}
.ol-reading-head h2 {
  margin: 0 0 12px;
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--ol-text);
}
.ol-reading-from {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 0.8rem;
  color: var(--ol-muted);
}
.ol-reading-from-main {
  flex: 1;
  min-width: 0;
}
.ol-reading-atts {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 8px;
  flex: 0 1 auto;
  max-width: min(320px, 48%);
  min-width: 72px;
  margin-left: auto;
  padding-top: 2px;
  background: transparent;
}
.ol-att-loading {
  font-size: 0.75rem;
  color: var(--ol-muted, var(--w11-muted));
  padding: 8px 4px;
  white-space: nowrap;
}
.ol-att-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 72px;
  padding: 6px 4px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: var(--ol-text, #242424);
  cursor: pointer;
  font: inherit;
  appearance: none;
}
.ol-att-tile:hover {
  background: rgba(0, 120, 212, 0.08);
  border-color: rgba(0, 120, 212, 0.25);
}
.ol-att-tile.is-busy,
.ol-att-tile:disabled {
  opacity: 0.55;
  pointer-events: none;
  cursor: wait;
}
.ol-att-tile.is-dragging {
  opacity: 0.65;
  cursor: grabbing;
}
.ol-att-tile:focus-visible {
  outline: 2px solid var(--ol-accent, #0078d4);
  outline-offset: 1px;
}
.ol-att-tile-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 40px;
  pointer-events: none;
}
.ol-att-tile-ico svg { display: block; }
.ol-att-tile-name {
  font-size: 0.68rem;
  line-height: 1.15;
  text-align: center;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ol-muted, #605e5c);
  pointer-events: none;
}
.ol-att-tile.ol-att-resized {
  position: relative;
}
.ol-att-resized-badge {
  display: block;
  margin-top: 1px;
  padding: 1px 4px;
  border-radius: 3px;
  font-size: 0.58rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  color: #835c00;
  background: color-mix(in srgb, #ffb900 22%, var(--w11-window-bg, #fff));
  border: 1px solid color-mix(in srgb, #ffb900 45%, var(--w11-stroke, #ccc));
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}
.ol-host.ol-dark .ol-att-resized-badge {
  color: #fde7c3;
  background: color-mix(in srgb, #ffb900 18%, var(--w11-window-bg, #1f1f1f));
  border-color: color-mix(in srgb, #ffb900 40%, var(--w11-stroke, #3f3f46));
}
.ol-host.ol-dark .ol-att-tile:hover {
  background: rgba(0, 120, 212, 0.18);
  border-color: rgba(0, 120, 212, 0.35);
}
.ol-host.ol-dark .ol-att-tile-name { color: #c8c6c4; }
.ol-viewer-mount,
.ol-viewer-host,
.ol-viewer {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.ol-viewer-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  min-height: 32px;
  height: 32px;
  box-sizing: border-box;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-win-border);
  flex-shrink: 0;
  color: var(--w11-title-color);
}
.ol-viewer-title {
  flex: 1;
  min-width: 0;
  font-size: 0.82rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: inherit;
  line-height: 1.2;
}
.ol-viewer-actions {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}
.ol-viewer-actions .ol-rbtn {
  color: var(--w11-text);
  border-color: var(--w11-win-border);
  background: color-mix(in srgb, var(--w11-text) 8%, transparent);
  min-height: 28px;
}
.ol-viewer-actions .ol-rbtn:hover {
  background: color-mix(in srgb, var(--w11-text) 14%, transparent);
}
.ol-viewer-ico-btn {
  appearance: none;
  width: 26px;
  height: 26px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 4px;
  display: inline-grid;
  place-items: center;
  background: transparent;
  color: var(--w11-title-color, var(--w11-text));
  cursor: pointer;
  flex-shrink: 0;
}
.ol-viewer-ico-btn svg {
  width: 16px;
  height: 16px;
  display: block;
}
.ol-viewer-ico-btn:hover {
  background: color-mix(in srgb, var(--w11-title-color, var(--w11-text)) 14%, transparent);
}
.ol-viewer-ico-btn:active {
  background: color-mix(in srgb, var(--w11-title-color, var(--w11-text)) 22%, transparent);
}
.ol-pdf-pages {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  background: #525252;
}
.ol-pdf-frame-wrap {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #525252;
}
.ol-pdf-frame {
  flex: 1;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: 0;
  background: #525252;
}
.ol-viewer-meta {
  flex-shrink: 0;
  font-size: 0.75rem;
  color: var(--w11-muted);
  white-space: nowrap;
}
.ol-pdf-page-wrap {
  position: relative;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
  max-width: 100%;
}
.ol-pdf-page-wrap.sm-doc-page {
  max-width: none !important;
}
.ol-pdf-page {
  display: block;
  background: #fff;
  max-width: none !important;
  width: auto !important;
  height: auto;
  user-select: none;
  pointer-events: none;
  opacity: 1 !important;
  image-rendering: auto;
}
/* PDF.js TextLayer ? nur im Text-Modus sichtbar (sonst Ghosting/Unsch?rfe ?ber Canvas) */
.ol-pdf-page-wrap .textLayer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  line-height: 1;
  text-size-adjust: none;
  forced-color-adjust: none;
  transform-origin: 0 0;
  z-index: 2;
  cursor: text;
  pointer-events: none;
}
.sm-doc-text-mode .ol-pdf-page-wrap .textLayer,
.sm-doc-text-mode .sm-doc-textlayer {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.sm-doc-select-mode .ol-pdf-page-wrap .textLayer,
.sm-doc-select-mode .ol-pdf-page-wrap .sm-doc-textlayer {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  user-select: text !important;
  -webkit-user-select: text !important;
  z-index: 10 !important;
  cursor: text;
}
.sm-doc-select-mode .ol-pdf-page-wrap .textLayer span,
.sm-doc-select-mode .ol-pdf-page-wrap .sm-doc-textlayer span {
  pointer-events: auto !important;
  user-select: text !important;
  -webkit-user-select: text !important;
}
.ol-pdf-page-wrap .textLayer span,
.ol-pdf-page-wrap .textLayer br {
  color: transparent;
  position: absolute;
  white-space: pre;
  cursor: text;
  transform-origin: 0% 0%;
}
.ol-pdf-page-wrap .textLayer span::selection,
.ol-pdf-page-wrap .textLayer ::selection {
  background: rgba(0, 120, 215, 0.35);
  color: transparent;
}
.ol-viewer-loading {
  color: #ddd;
  padding: 40px;
  font-size: 0.9rem;
}
.sm-doc-loading-ph {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 280px;
  width: 100%;
}
.sm-doc-skel {
  width: min(420px, 70%);
  height: 520px;
  max-height: 55vh;
  border-radius: 4px;
  background: linear-gradient(90deg, #3a3a3a 0%, #4a4a4a 40%, #3a3a3a 80%);
  background-size: 200% 100%;
  animation: sm-doc-skel 1.2s ease-in-out infinite;
  box-shadow: 0 8px 28px rgba(0,0,0,.35);
}
.sm-doc-skel-sm {
  height: 12px;
  max-height: none;
  width: min(220px, 40%);
  opacity: 0.7;
}
@keyframes sm-doc-skel {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
/* Systemweiter Druckdialog */
.w11-print-body {
  padding: 0 !important;
  overflow: hidden;
  background: #2b2b2b;
}
.sm-print-mount {
  height: 100%;
  min-height: 0;
}
.sm-print-dlg {
  height: 100%;
  display: grid;
  grid-template-columns: 1fr 300px;
  min-height: 0;
  background: #2b2b2b;
  color: #f3f2f1;
}
.sm-print-preview {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  border-right: 1px solid #3f3f46;
  background: #1e1e1e;
}
.sm-print-preview-bar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid #3f3f46;
  background: #252526;
}
.sm-print-preview-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: #a19f9d;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sm-print-preview-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.sm-print-preview-tools .win-app-btn {
  min-height: 28px;
  padding: 0 10px;
  font-size: 0.8rem;
  background: #3f3f46;
  border-color: #5a5a5a;
  color: #f3f2f1;
}
.sm-print-preview-tools .win-app-btn:hover {
  background: #505050;
}
.sm-print-preview-tools .win-app-btn.active {
  background: #0078d4;
  border-color: #0078d4;
  color: #fff;
}
.sm-print-preview-stage {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  outline: none;
}
.sm-print-preview-stage.sm-region-mode {
  cursor: crosshair;
}
.sm-print-sheet {
  --sm-paper-aspect: 0.707;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  background: #323232;
  border: 1px dashed #6b6b6b;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
}
.sm-print-page-wrap {
  position: relative;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
.sm-print-page {
  display: block;
  background: #fff;
  max-width: 100%;
  user-select: none;
  pointer-events: none;
}
.sm-print-region-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}
.sm-print-region-rect {
  position: absolute;
  border: 2px solid #0078d4;
  background: rgba(0, 120, 212, 0.18);
  box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.35);
}
.sm-print-img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  background: #fff;
}
.sm-print-html-wrap {
  background: #fff;
  overflow: hidden;
}
.sm-print-html-frame {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 520px;
  border: 0;
  background: #fff;
}
.sm-print-more,
.sm-print-file {
  color: #a19f9d;
  font-size: 0.85rem;
  margin: 4px 0 0;
}
.sm-print-settings {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px 16px 16px;
  background: #2b2b2b;
  overflow: auto;
}
.sm-print-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sm-print-field label {
  font-size: 0.78rem;
  font-weight: 600;
  color: #c8c6c4;
}
.sm-print-field select,
.sm-print-field input {
  height: 32px;
  border: 1px solid #605e5c;
  border-radius: 4px;
  padding: 0 8px;
  font-size: 0.85rem;
  background: #1e1e1e;
  color: #f3f2f1;
}
.sm-print-field select:focus,
.sm-print-field input:focus {
  outline: 2px solid #0078d4;
  outline-offset: -1px;
  border-color: #0078d4;
}
.sm-print-field select:disabled,
.sm-print-field input:disabled,
.sm-print-field.is-disabled select,
.sm-print-field.is-disabled input {
  opacity: 0.45;
  cursor: not-allowed;
  background: #252526;
}
.sm-print-field.is-disabled label {
  opacity: 0.55;
}
.sm-print-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.sm-print-hint {
  margin: 0;
  font-size: 0.78rem;
  color: #a19f9d;
  line-height: 1.35;
  min-height: 2.2em;
}
.sm-print-actions {
  margin-top: auto;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 8px;
}
.sm-print-actions .win-app-btn {
  min-width: 88px;
}
@media (max-width: 720px) {
  .sm-print-dlg {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
  }
  .sm-print-preview {
    border-right: none;
    border-bottom: 1px solid #3f3f46;
    max-height: 45%;
  }
}
.ol-img-stage {
  flex: 1;
  min-height: 0;
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
  overflow: auto;
  padding: 0;
  background: var(--w11-scrollbar-track, var(--w11-win-body));
  outline: none;
}
.ol-img-stage.ol-img-pannable {
  cursor: grab;
}
.ol-img-stage.ol-img-pannable.is-panning {
  cursor: grabbing;
  user-select: none;
}
.ol-img-stage.ol-img-pannable.is-panning * {
  cursor: grabbing;
}
.ol-img-canvas {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 100%;
  min-height: 100%;
  padding: 16px;
  box-sizing: border-box;
}
.ol-img-stage img {
  max-width: none;
  max-height: none;
  width: auto;
  height: auto;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
  box-shadow: 0 4px 24px color-mix(in srgb, #000 45%, transparent);
  transition: width 0.05s linear, height 0.05s linear;
}
.ol-img-zoom-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px 8px 8px;
  border-radius: 999px;
  pointer-events: none;
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-window-bg) 82%, transparent);
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  box-shadow:
    0 8px 28px color-mix(in srgb, #000 28%, transparent),
    inset 0 1px 0 color-mix(in srgb, #fff 12%, transparent);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  opacity: 0;
  transform: translateY(-6px) scale(0.96);
  transition: opacity 0.22s ease, transform 0.22s ease;
}
.ol-img-zoom-badge.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.ol-img-zoom-ring {
  position: relative;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
}
.ol-img-zoom-ring svg {
  display: block;
}
.ol-img-zoom-ring-bg {
  stroke: color-mix(in srgb, var(--w11-muted) 35%, transparent);
}
.ol-img-zoom-ring-fg {
  stroke: var(--w11-accent, #0078d4);
  transition: stroke-dashoffset 0.15s ease;
}
.ol-img-zoom-lens {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--w11-text);
  opacity: 0.9;
  pointer-events: none;
}
.ol-img-zoom-lens svg {
  width: 12px;
  height: 12px;
}
.ol-img-zoom-pct {
  font-size: 0.92rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  min-width: 3.2em;
  line-height: 1;
}
.ol-img-viewer .ol-viewer-toolbar {
  padding: 4px 8px;
  min-height: 32px;
  height: 32px;
}
.ol-sheet-viewer {
  background: #f3f2f1;
  color: #242424;
  font-size: 9px;
}
.ol-sheet-viewer .ol-viewer-toolbar {
  background: #217346;
  border-bottom: 1px solid #185c37;
  color: #fff;
  font-size: 12px;
}
.ol-sheet-viewer .ol-viewer-title,
.ol-sheet-viewer .ol-viewer-meta {
  color: #fff;
}
.ol-sheet-viewer .ol-viewer-actions {
  gap: 4px;
}
.ol-sheet-viewer .ol-viewer-actions .ol-rbtn {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.14);
  min-width: 30px;
  padding: 4px 7px;
}
.ol-sheet-viewer .ol-viewer-actions .ol-rbtn:hover {
  background: rgba(255, 255, 255, 0.24);
}
.ol-sheet-viewer .ol-viewer-actions .ol-rbtn svg {
  display: block;
}
.ol-sheet-stage {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #e8e8e8;
  overflow: hidden;
}
.ol-sheet-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: #fff;
}
.ol-sheet-table {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-size: 9px;
  font-family: Calibri, "Segoe UI", Arial, sans-serif;
  color: #000;
  width: max-content;
  max-width: none;
  min-width: 0;
}
.ol-sheet-table col[data-col] {
  box-sizing: border-box;
}
.ol-sheet-table th,
.ol-sheet-table td {
  border-right: 1px solid #b4b4b4;
  border-bottom: 1px solid #b4b4b4;
  padding: 0 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  min-height: 16px;
  line-height: 1.12;
  box-sizing: border-box;
}
.ol-sheet-table td.ol-sheet-wrap {
  white-space: pre-wrap;
  overflow-wrap: break-word;
  word-break: normal;
  text-overflow: clip;
  overflow: hidden;
  hyphens: manual;
}
.ol-sheet-table td.ol-sheet-align-center {
  text-align: center;
}
.ol-sheet-table td.ol-sheet-align-right {
  text-align: right;
}
.ol-sheet-table td.ol-sheet-valign-top {
  vertical-align: top;
}
.ol-sheet-table td.ol-sheet-valign-bottom {
  vertical-align: bottom;
}
.ol-sheet-cell-text {
  display: inline;
}
.ol-sheet-wrap .ol-sheet-cell-text {
  display: block;
  white-space: inherit;
}
.ol-sheet-corner,
.ol-sheet-colhead,
.ol-sheet-rowhead {
  position: sticky;
  background: #f3f2f1;
  color: #605e5c;
  font-weight: 600;
  text-align: center;
  z-index: 2;
  user-select: none;
}
.ol-sheet-corner {
  left: 0;
  top: 0;
  z-index: 4;
  min-width: 40px;
  width: 40px;
  border-right: 1px solid #c8c6c4;
  border-bottom: 1px solid #c8c6c4;
}
.ol-sheet-colhead {
  top: 0;
  z-index: 3;
  min-width: 0;
  border-bottom: 1px solid #c8c6c4;
  cursor: pointer;
  padding: 0 10px 0 4px;
  position: sticky;
  overflow: visible;
}
.ol-sheet-col-resize {
  position: absolute;
  right: -4px;
  top: 0;
  width: 12px;
  height: 100%;
  cursor: col-resize;
  z-index: 8;
  touch-action: none;
  pointer-events: auto;
}
.ol-sheet-col-resize::after {
  content: "";
  position: absolute;
  top: 20%;
  bottom: 20%;
  left: 5px;
  width: 2px;
  border-radius: 1px;
  background: rgba(33, 115, 70, 0.35);
}
.ol-sheet-colhead:hover .ol-sheet-col-resize::after,
.ol-sheet-col-resize:hover::after,
.ol-sheet-table.ol-sheet-col-resize-hover .ol-sheet-col-resize::after {
  background: rgba(33, 115, 70, 0.85);
}
.ol-sheet-col-resize:hover {
  background: rgba(33, 115, 70, 0.12);
}
.ol-sheet-rowhead {
  overflow: visible;
}
.ol-sheet-row-resize {
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 100%;
  height: 8px;
  cursor: row-resize;
  z-index: 6;
  touch-action: none;
  pointer-events: auto;
}
.ol-sheet-row-resize:hover {
  background: rgba(33, 115, 70, 0.25);
}
body.ol-sheet-resizing-col,
body.ol-sheet-resizing-col * {
  cursor: col-resize !important;
  user-select: none !important;
}
body.ol-sheet-resizing-row,
body.ol-sheet-resizing-row * {
  cursor: row-resize !important;
  user-select: none !important;
}
.ol-sheet-colhead {
  display: table-cell;
}
.ol-sheet-colhead .ol-sheet-col-label {
  display: inline-block;
  vertical-align: middle;
  margin-right: 2px;
}
.ol-sheet-sort {
  display: inline-flex;
  flex-direction: column;
  vertical-align: middle;
  gap: 0;
  line-height: 0;
}
.ol-sheet-sort-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 12px;
  height: 9px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  color: #a19f9d;
  cursor: pointer;
  border-radius: 2px;
  line-height: 0;
}
.ol-sheet-sort-btn:hover {
  color: #217346;
  background: rgba(33, 115, 70, 0.12);
}
.ol-sheet-sort-btn.active {
  color: #217346;
}
.ol-sheet-rowhead {
  left: 0;
  z-index: 3;
  min-width: 40px;
  width: 40px;
  text-align: center;
  border-right: 1px solid #c8c6c4;
  cursor: pointer;
  position: sticky;
}
.ol-sheet-corner {
  cursor: pointer;
}
.ol-sheet-cell {
  background-color: #fff;
  cursor: cell;
  user-select: text;
  position: relative;
}
.ol-sheet-cell[style*="background-color"] {
  /* Excel-Farben aus Datei haben Vorrang vor Standard-Weiß */
}
.ol-sheet-cell.has-img {
  padding: 4px;
  vertical-align: middle;
  text-align: center;
  white-space: normal;
}
.ol-sheet-cell-img {
  display: inline-block;
  max-width: calc(100% - 4px);
  max-height: 100px;
  width: auto;
  height: auto;
  object-fit: contain;
  cursor: zoom-in;
  border-radius: 4px;
  background: #f3f3f3;
  vertical-align: middle;
}
.ol-sheet-cell-img + .ol-sheet-cell-text {
  display: block;
  margin-top: 4px;
  font-size: 0.72rem;
  color: #666;
}
.ol-sheet-first-row:not([style*="background-color"]) {
  font-weight: 600;
  background-color: #d9d9d9;
  text-align: center;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  text-overflow: clip;
}
.ol-sheet-table td.ol-sheet-cell.is-selected,
.ol-sheet-table th.ol-sheet-rowhead.is-selected,
.ol-sheet-table th.ol-sheet-colhead.is-selected,
.ol-sheet-table th.ol-sheet-corner.is-selected {
  background: #c6e0b4 !important;
  box-shadow: inset 0 0 0 1px #217346;
}
.ol-sheet-viewer:focus {
  outline: none;
}
.ol-sheet-viewer:focus-visible {
  outline: none;
}
.ol-sheet-trunc {
  flex-shrink: 0;
  padding: 6px 10px;
  font-size: 0.75rem;
  color: #605e5c;
  background: #fff4ce;
  border-top: 1px solid #f2e4a8;
}
.ol-sheet-tabs {
  display: flex;
  gap: 2px;
  padding: 4px 6px 2px;
  background: #e1dfdd;
  border-top: 1px solid #c8c6c4;
  flex-shrink: 0;
  overflow-x: auto;
}
.ol-sheet-tab {
  border: 1px solid transparent;
  border-bottom: none;
  background: transparent;
  color: #323130;
  font-size: 0.75rem;
  padding: 4px 12px;
  border-radius: 4px 4px 0 0;
  cursor: pointer;
  white-space: nowrap;
}
.ol-sheet-tab:hover {
  background: #f3f2f1;
}
.ol-sheet-tab.active {
  background: #fff;
  border-color: #c8c6c4;
  font-weight: 600;
}
.ol-sheet-statusbar {
  flex-shrink: 0;
  padding: 4px 10px;
  font-size: 0.72rem;
  color: #323130;
  background: #f3f2f1;
  border-top: 1px solid #e1dfdd;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-viewer-error {
  color: #a4262c !important;
}
.ol-compose-paste-ctx,
.ol-compose-edit-ctx {
  min-width: 200px;
}
.ol-compose-edit-ctx button {
  justify-content: space-between;
  gap: 24px;
}
.ol-compose-edit-ctx button:disabled,
.ol-compose-edit-ctx button[disabled],
.ol-reading-edit-ctx button:disabled {
  opacity: 0.4;
  cursor: default;
  pointer-events: none;
}
.ol-compose-edit-ctx.w11-ctx-dark button:disabled,
.ol-reading-edit-ctx.w11-ctx-dark button:disabled {
  opacity: 0.35;
  color: #a19f9d !important;
}
.ol-compose-edit-ctx kbd {
  margin-left: auto;
  font: inherit;
  font-size: 0.72rem;
  color: #605e5c;
  font-style: normal;
}
.ol-compose-edit-ctx.w11-ctx-dark kbd {
  color: #a19f9d;
}
.sm-spell-block {
  display: flex;
  flex-direction: column;
  padding: 2px 0 4px;
  min-width: 200px;
}
.sm-spell-block .sm-spell-sugg {
  font-weight: 600;
  color: var(--w11-text);
}
.sm-spell-block .sm-spell-sugg em {
  font-style: normal;
  font-weight: 600;
}
.sm-spell-empty {
  padding: 6px 12px;
  font-size: 0.75rem;
  color: var(--w11-muted);
}
.sm-spell-ctx .sm-spell-block {
  border-bottom: 1px solid var(--w11-stroke);
  margin-bottom: 2px;
  padding-bottom: 6px;
}
.ol-mail-img-wrap {
  position: relative;
  z-index: 4;
  display: inline-block;
  vertical-align: top;
  max-width: none;
  line-height: 0;
  margin: 2px 6px 2px 0;
  cursor: move;
  touch-action: none;
  outline: 2px solid transparent;
  outline-offset: 1px;
  box-sizing: border-box;
}
/* Overlay: Text bleibt unver?ndert */
.ol-mail-img-wrap.ol-mail-img-free {
  position: absolute;
  margin: 0;
  float: none;
  max-width: none;
  z-index: 5;
}
.ol-compose-editor.ol-compose-editor-imgs {
  position: relative;
}
/* Ein einziger Positionsrahmen w?hrend des Ziehens */
.ol-mail-pos-ghost {
  position: absolute;
  z-index: 35;
  pointer-events: none;
  box-sizing: border-box;
  border: 2px solid #0078d4;
  border-radius: 3px;
  background: rgba(0, 120, 212, 0.10);
  box-shadow: 0 0 0 1px rgba(0, 120, 212, 0.25);
}
.ol-compose-host.ol-dark .ol-mail-pos-ghost,
.ol-host.ol-dark .ol-mail-pos-ghost {
  border-color: #4cc2ff;
  background: rgba(76, 194, 255, 0.12);
  box-shadow: 0 0 0 1px rgba(76, 194, 255, 0.3);
}
.ol-mail-img-wrap:hover {
  outline-color: rgba(0, 120, 212, 0.45);
}
.ol-mail-img-wrap.selected {
  outline-color: #0078d4;
  z-index: 6;
}
.ol-mail-img-wrap.is-dragging {
  position: absolute;
  float: none !important;
  margin: 0 !important;
  opacity: 0.85;
  outline-color: #0078d4;
  z-index: 40;
  pointer-events: none;
}
.ol-mail-img-wrap.is-dragging .ol-mail-img-h,
.ol-mail-img-wrap.is-dragging .ol-mail-img-del {
  pointer-events: none;
}
.ol-mail-img-wrap img {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  user-select: none;
  pointer-events: none;
  -webkit-user-drag: none;
  /* Dark-Mode: Screenshots nicht auswaschen/invertierten */
  color-scheme: only light;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
.ol-compose-editor img,
.ol-compose-host.ol-dark .ol-compose-editor img {
  color-scheme: only light;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
.ol-mail-img-h {
  position: absolute;
  width: 10px;
  height: 10px;
  background: #fff;
  border: 1px solid #0078d4;
  box-sizing: border-box;
  z-index: 7;
  opacity: 0;
  pointer-events: auto;
}
.ol-mail-img-wrap.selected .ol-mail-img-h,
.ol-mail-img-wrap:hover .ol-mail-img-h {
  opacity: 1;
}
.ol-mail-img-h-nw { left: -5px; top: -5px; cursor: nwse-resize; }
.ol-mail-img-h-ne { right: -5px; top: -5px; cursor: nesw-resize; }
.ol-mail-img-h-sw { left: -5px; bottom: -5px; cursor: nesw-resize; }
.ol-mail-img-h-se { right: -5px; bottom: -5px; cursor: nwse-resize; }
.ol-mail-img-del {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid #c42b1c;
  background: #fff;
  color: #c42b1c;
  font-size: 16px;
  line-height: 18px;
  padding: 0;
  cursor: pointer;
  z-index: 8;
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 4px rgba(0,0,0,.18);
}
.ol-mail-img-wrap.selected .ol-mail-img-del,
.ol-mail-img-wrap:hover .ol-mail-img-del {
  opacity: 1;
}
.ol-mail-img-del:hover {
  background: #c42b1c;
  color: #fff;
}
.ol-compose-paste-ctx button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 8px 12px;
  font: inherit;
  cursor: pointer;
  border-radius: 2px;
}
.ol-compose-paste-ctx button:hover {
  background: #deecf9;
}
.ol-reading-from strong {
  display: block;
  font-size: 0.9rem;
  color: var(--ol-text);
  margin: 0;
}
.ol-avatar.lg {
  width: 40px;
  height: 40px;
  font-size: 0.85rem;
}
.ol-empty-ico {
  width: 48px;
  height: 48px;
  margin: 0 auto 12px;
  color: #c8c6c4;
  opacity: 0.9;
}
.ol-empty-ico svg { width: 48px; height: 48px; }
.ol-msg-att {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ol-muted);
  flex-shrink: 0;
}
.ol-msg-trailing {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  width: 22px;
  min-height: 1.2em;
  margin-left: 4px;
  align-self: center;
}
.ol-msg-trailing:empty {
  width: 0;
  margin: 0;
}
.ol-msg-trailing .ol-msg-att {
  margin: 0;
}
.ol-msg-trailing .ol-msg-att svg {
  width: 14px;
  height: 14px;
}
.ol-msg-end {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  flex: 0 0 auto;
  align-self: flex-start;
  padding-top: 1px;
  margin-left: 4px;
}
.ol-msg-att-slot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 22px;
  flex: 0 0 18px;
}
.ol-msg-reply-slot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 22px;
  flex: 0 0 18px;
}
.ol-msg-reply-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-accent, var(--ol-accent, #0078d4));
  cursor: pointer;
}
.ol-msg-reply-btn:hover,
.ol-msg-reply-btn.is-open {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 18%, var(--w11-window-bg, var(--ol-bg)));
  color: var(--w11-accent, #0078d4);
}
.ol-msg-reply-btn svg {
  width: 14px;
  height: 14px;
  display: block;
}
.ol-msg-fwd-btn {
  color: var(--w11-accent, var(--ol-accent, #0078d4));
}
.ol-msg-row.selected .ol-msg-reply-btn,
.ol-msg.selected .ol-msg-reply-btn {
  color: var(--w11-highlight-fg, var(--ol-text, #fff));
}
.ol-msg-row.selected .ol-msg-reply-btn:hover,
.ol-msg-row.selected .ol-msg-reply-btn.is-open,
.ol-msg.selected .ol-msg-reply-btn:hover,
.ol-msg.selected .ol-msg-reply-btn.is-open {
  background: color-mix(in srgb, #fff 22%, transparent);
  color: var(--w11-highlight-fg, var(--ol-text, #fff));
}
.ol-msg-reply-pop {
  position: fixed;
  z-index: 12000;
  min-width: 280px;
  max-width: min(420px, calc(100vw - 16px));
  max-height: min(360px, calc(100vh - 24px));
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke, var(--ol-border, #d0d0d0));
  background: var(--w11-window-bg, var(--ol-bg, #fff));
  color: var(--w11-text, var(--ol-text, #1a1a1a));
  box-shadow: 0 8px 28px color-mix(in srgb, #000 22%, transparent);
  overflow: hidden;
}
.ol-msg-reply-pop-h {
  flex: 0 0 auto;
  padding: 8px 12px;
  font-size: 0.75rem;
  font-weight: 650;
  border-bottom: 1px solid var(--w11-stroke, var(--ol-border));
  background: var(--w11-titlebar, var(--ol-bg-subtle, #f3f3f3));
  color: var(--w11-text, var(--ol-text));
}
.ol-msg-reply-pop-body {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 4px 0;
}
.ol-msg-reply-pop-loading,
.ol-msg-reply-pop-empty {
  padding: 12px 14px;
  font-size: 0.8rem;
  color: var(--w11-muted, var(--ol-muted));
}
.ol-msg-reply-item {
  display: grid;
  grid-template-columns: 18px 4.6rem minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 7px 12px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.ol-msg-reply-item:hover,
.ol-msg-reply-item.is-previewing {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 14%, var(--w11-window-bg, #fff));
}
.ol-msg-reply-preview {
  position: fixed;
  z-index: 12001;
  width: 420px;
  max-width: min(460px, calc(100vw - 24px));
  max-height: min(520px, calc(100vh - 24px));
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke, var(--ol-border, #d0d0d0));
  background: var(--w11-window-bg, var(--ol-bg, #fff));
  color: var(--w11-text, var(--ol-text, #1a1a1a));
  box-shadow: 0 10px 32px color-mix(in srgb, #000 24%, transparent);
  overflow: hidden;
}
.ol-msg-reply-preview[hidden] {
  display: none !important;
}
.ol-msg-reply-preview-h {
  flex: 0 0 auto;
  padding: 10px 12px 8px;
  border-bottom: 1px solid var(--w11-stroke, var(--ol-border));
  background: var(--w11-titlebar, var(--ol-bg-subtle, #f3f3f3));
}
.ol-msg-reply-preview-subj {
  display: block;
  font-size: 0.86rem;
  font-weight: 650;
  color: var(--w11-text, var(--ol-text));
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-msg-reply-preview-meta {
  margin-top: 3px;
  font-size: 0.72rem;
  color: var(--w11-muted, var(--ol-muted));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-msg-reply-preview-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  background: transparent;
  cursor: default;
}
.ol-msg-reply-preview-scroll {
  scrollbar-color: color-mix(in srgb, var(--w11-accent, #0078d4) 65%, var(--w11-scrollbar, #6a7684)) var(--w11-scrollbar-track, #141414);
}
.ol-msg-reply-preview-scroll::-webkit-scrollbar {
  width: 11px;
  height: 11px;
}
.ol-msg-reply-preview-scroll::-webkit-scrollbar-track {
  background: var(--w11-scrollbar-track, #141414);
  border-radius: 999px;
  margin: 3px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--w11-stroke, #d0d0d0) 55%, transparent);
}
.ol-msg-reply-preview-scroll::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 50%, var(--w11-scrollbar, #6a7684) 50%);
  border-radius: 999px;
  border: 2px solid var(--w11-scrollbar-track, #141414);
  background-clip: padding-box;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #ffffff 28%, transparent),
    0 1px 2px color-mix(in srgb, #000000 35%, transparent);
  min-height: 36px;
}
.ol-msg-reply-preview-scroll::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 70%, var(--w11-scrollbar, #6a7684) 30%);
}
.ol-msg-reply-preview-scroll.is-mid-scroll {
  cursor: grabbing;
}
.ol-msg-reply-preview-loading {
  padding: 16px 14px;
  font-size: 0.8rem;
  color: var(--w11-muted, var(--ol-muted));
}
.ol-msg-reply-preview-frame {
  display: block;
  width: 100%;
  min-height: 120px;
  border: 0;
  background: #fff;
}
.ol-msg-reply-item-ico {
  display: inline-flex;
  color: var(--w11-muted, var(--ol-muted));
}
.ol-msg-reply-item-ico svg {
  width: 14px;
  height: 14px;
}
.ol-msg-reply-item-date {
  font-size: 0.72rem;
  color: var(--w11-muted, var(--ol-muted));
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.ol-msg-reply-item-subj {
  font-size: 0.8rem;
  color: var(--w11-text, var(--ol-text));
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  /* Nie Scrollbalken ? ?berlauf per Lauftext */
  scrollbar-width: none;
}
.ol-msg-reply-item-subj::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.ol-msg-reply-item-subj-run {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
  will-change: transform;
}
.ol-msg-reply-item-subj.is-overflow .ol-msg-reply-item-subj-run {
  max-width: 100%;
  text-overflow: ellipsis;
  padding-right: 0;
  animation: ol-msg-reply-marquee var(--ol-marquee-dur, 8s) linear infinite;
  animation-play-state: paused;
}
.ol-msg-reply-item:hover .ol-msg-reply-item-subj.is-overflow .ol-msg-reply-item-subj-run,
.ol-msg-reply-item:focus-visible .ol-msg-reply-item-subj.is-overflow .ol-msg-reply-item-subj-run {
  max-width: none;
  text-overflow: clip;
  padding-right: 1.25em;
  animation-play-state: running;
}
@keyframes ol-msg-reply-marquee {
  0%,
  12% {
    transform: translateX(0);
  }
  88%,
  100% {
    transform: translateX(calc(-1 * var(--ol-marquee-shift, 0px)));
  }
}
.ol-msg-att-slot .ol-msg-att {
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ol-msg-att-slot .ol-msg-att svg {
  width: 14px;
  height: 14px;
}
.ol-msg-pane-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--ol-border);
  background: #fff;
  position: sticky;
  top: 0;
  z-index: 1;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--ol-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-msg-pane-h strong {
  font-size: 0.9rem;
  font-weight: 600;
}
.ol-msg-pane-h .ol-muted { color: var(--ol-muted); font-size: 0.75rem; font-weight: 400; }
.ol-split {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: 42% 58%;
  background: var(--ol-bg);
}
.ol-msg-row,
.ol-msg {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 12px 10px 8px;
  border-bottom: 1px solid var(--ol-border);
  cursor: pointer;
  user-select: none;
  background: var(--ol-bg);
  color: var(--ol-text);
  position: relative;
  border-left: 3px solid transparent;
}
.ol-msg-leading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  width: 32px;
  flex-shrink: 0;
  padding-top: 0;
}
.ol-msg-cats-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 3px;
  min-height: 8px;
  width: 100%;
}
.ol-msg-cats-rail .ol-cat-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.18);
  flex-shrink: 0;
}
.ol-msg-row .ol-avatar { margin-top: 0; }
.ol-msg-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ol-msg {
  display: block;
  padding-left: 12px;
}
.ol-msg-row:hover,
.ol-msg:hover {
  background: color-mix(in srgb, var(--w11-highlight) 28%, var(--ol-bg));
}
.ol-msg-row.selected,
.ol-msg.selected {
  background: var(--w11-highlight);
  color: var(--w11-highlight-fg, var(--ol-text));
}
.ol-msg-row.selected .ol-msg-from,
.ol-msg-row.selected .ol-msg-subj,
.ol-msg-row.selected .ol-msg-preview,
.ol-msg-row.selected .ol-msg-date,
.ol-msg.selected .ol-msg-from,
.ol-msg.selected .ol-msg-subj,
.ol-msg.selected .ol-msg-preview,
.ol-msg.selected .ol-msg-date {
  color: var(--w11-highlight-fg, var(--ol-text)) !important;
}
.ol-msg-row.selected:hover,
.ol-msg.selected:hover {
  background: color-mix(in srgb, var(--w11-highlight) 82%, var(--w11-text));
}
.ol-msg-row.unread,
.ol-msg.unread {
  border-left-color: var(--ol-unread-bar);
}
.ol-msg-row.unread .ol-msg-from,
.ol-msg-row.unread .ol-msg-subj,
.ol-msg.unread .ol-msg-from,
.ol-msg.unread .ol-msg-subj {
  font-weight: 700;
  color: var(--ol-text);
}
.ol-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ol-avatar, var(--w11-ol-avatar, #c7e0f4));
  color: var(--ol-avatar-fg, var(--w11-ol-avatar-fg, #004578));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  flex-shrink: 0;
  text-transform: uppercase;
  user-select: none;
  position: relative;
  box-sizing: border-box;
}
/* Goldener Pulsring bei ungelesenen Nachrichten */
.ol-msg-row.unread .ol-avatar,
.ol-msg.unread .ol-avatar {
  box-shadow:
    0 0 0 2px rgba(212, 175, 55, 0.95),
    0 0 0 0 rgba(212, 175, 55, 0);
  animation: ol-unread-avatar-pulse 2.8s ease-in-out infinite;
}
@keyframes ol-unread-avatar-pulse {
  0%,
  100% {
    box-shadow:
      0 0 0 2px rgba(212, 175, 55, 0.85),
      0 0 0 0 rgba(212, 175, 55, 0);
  }
  50% {
    box-shadow:
      0 0 0 2px rgba(232, 196, 72, 1),
      0 0 10px 3px rgba(212, 175, 55, 0.45);
  }
}
@media (prefers-reduced-motion: reduce) {
  .ol-msg-row.unread .ol-avatar,
  .ol-msg.unread .ol-avatar {
    animation: none;
    box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.9);
  }
}
.ol-host.ol-dark .ol-msg-row.unread .ol-avatar,
.ol-host.ol-dark .ol-msg.unread .ol-avatar {
  animation-name: ol-unread-avatar-pulse-dark;
}
@keyframes ol-unread-avatar-pulse-dark {
  0%,
  100% {
    box-shadow:
      0 0 0 2px rgba(218, 183, 70, 0.9),
      0 0 0 0 rgba(218, 183, 70, 0);
  }
  50% {
    box-shadow:
      0 0 0 2px rgba(240, 205, 90, 1),
      0 0 12px 3px rgba(218, 183, 70, 0.55);
  }
}
.ol-msg-row .ol-avatar { margin-top: 0; }
.ol-msg-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}
.ol-msg-from-line {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex: 1 1 auto;
}
.ol-msg-from-line .ol-msg-from {
  min-width: 0;
  flex: 1 1 auto;
}
.ol-msg-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.ol-msg-when {
  display: none;
}
.ol-msg-ticket {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.15;
  padding: 2px 6px;
  border-radius: 3px;
  background: #fce100 !important;
  color: #1a1400 !important;
  border: 1px solid #c2a000;
  white-space: nowrap;
  user-select: none;
  flex-shrink: 0;
}
.ol-host.ol-dark .ol-msg-ticket,
.ol-msg-row .ol-msg-ticket,
.ol-msg .ol-msg-ticket {
  background: #fce100 !important;
  color: #1a1400 !important;
  border-color: #c2a000;
}
.ol-msg-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin-top: 3px;
  min-height: 0;
}
.ol-cat-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.65rem;
  line-height: 1;
  padding: 2px 6px 2px 4px;
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.04);
  color: var(--ol-muted);
  max-width: 100%;
}
.ol-host.ol-dark .ol-cat-chip {
  background: rgba(255, 255, 255, 0.06);
}
.ol-cat-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  border: 1px solid rgba(0, 0, 0, 0.15);
}
.ol-cat-chip span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-reading-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
}
.ol-ctx-cat {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ol-ctx-cat .ol-cat-dot { width: 10px; height: 10px; }
.ol-ctx button.cat-on {
  font-weight: 600;
  background: var(--ol-bg-hover, #f3f2f1);
}
.ol-ctx button.ol-ctx-heading {
  font-weight: 700;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ol-muted, #605e5c);
  pointer-events: none;
  cursor: default;
}
.ol-host.ol-dark .ol-ctx button.cat-on {
  background: #2d2d30;
}
.ol-msg-del {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--ol-muted);
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  border-radius: 4px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.1s ease, background 0.1s ease, color 0.1s ease;
}
.ol-msg-del svg { width: 14px; height: 14px; }
.ol-msg-row:hover .ol-msg-del,
.ol-msg-row.selected .ol-msg-del,
.ol-msg-del:focus-visible {
  opacity: 1;
  pointer-events: auto;
}
.ol-msg-del:hover {
  background: #fde7e9;
  color: #a4262c;
}
.ol-msg-row.ol-dragging {
  opacity: 0.45;
}
.ol-tree-row.ol-dragging {
  opacity: 0.45;
}
.ol-tree-row.ol-drop-target,
.ol-tree-row.ol-drop-into {
  background: var(--ol-sel-folder) !important;
  outline: 1px dashed var(--ol-accent);
}
.ol-tree-row.ol-drop-before {
  box-shadow: inset 0 2px 0 0 var(--ol-accent);
  background: color-mix(in srgb, var(--ol-sel-folder) 55%, transparent);
}
.ol-tree-row.ol-drop-after {
  box-shadow: inset 0 -2px 0 0 var(--ol-accent);
  background: color-mix(in srgb, var(--ol-sel-folder) 55%, transparent);
}
.ol-msg-from {
  font-size: 0.8125rem;
  color: var(--ol-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-msg-subj {
  font-size: 0.78rem;
  color: var(--ol-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-msg-preview,
.ol-msg-meta {
  display: flex;
  gap: 8px;
  font-size: 0.72rem;
  color: var(--ol-muted);
  margin-top: 1px;
}
.ol-msg-meta span:last-child,
.ol-msg-preview {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-msg-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
  padding-top: 2px;
}
.ol-msg-date {
  display: inline-block;
  width: 4.75rem;
  flex: 0 0 4.75rem;
  font-size: 0.68rem;
  color: var(--ol-muted);
  white-space: nowrap;
  text-align: right;
  font-variant-numeric: tabular-nums;
  line-height: 22px;
}
.ol-msg-row.unread .ol-msg-date { color: var(--ol-accent); font-weight: 600; }
.ol-att-ico {
  width: 14px;
  height: 14px;
  color: var(--ol-muted);
  display: inline-block;
  vertical-align: middle;
}
.ol-att-ico svg { width: 14px; height: 14px; fill: currentColor; }

/* Reading pane */
.ol-reading,
.ol-preview {
  overflow: auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--ol-bg);
  color: var(--ol-text);
}
.ol-reading-head,
.ol-preview-head {
  padding: 16px 20px 12px;
  border-bottom: 1px solid var(--ol-border);
  flex-shrink: 0;
  background: var(--ol-bg);
}
.ol-reading-head strong,
.ol-preview-head strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--ol-text);
  line-height: 1.3;
}
.ol-reading-meta,
.ol-preview-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.78rem;
  color: var(--ol-muted);
}
.ol-reading-meta .ol-from-line {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--ol-text);
}
.ol-reading-meta .ol-from-line strong { font-size: 0.85rem; margin: 0; }
.ol-reading-frame,
.ol-preview-frame {
  flex: 1;
  min-height: 160px;
  width: 100%;
  border: 0;
  background: var(--ol-bg);
  /* Volle Mail scrollen, nicht abschneiden */
  height: auto;
}
/* Outlook-Lesebereich: helles Briefpapier wie die Mail selbst */
.ol-reading-pane .ol-preview-frame,
.ol-reading > .ol-preview-frame {
  background: #ffffff !important;
  color-scheme: light;
}
.ol-atts {
  padding: 10px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-top: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
}
.ol-att {
  font-size: 0.8rem;
  color: var(--ol-text);
}
.ol-att img {
  max-width: 100%;
  max-height: 280px;
  display: block;
  margin-top: 6px;
  border: 1px solid var(--ol-border);
  border-radius: 2px;
}
.ol-att iframe {
  width: 100%;
  height: 320px;
  border: 1px solid var(--ol-border);
  margin-top: 6px;
  border-radius: 2px;
  background: #fff;
}
.ol-att-link a { color: var(--ol-accent); text-decoration: none; }
.ol-att-link a:hover { text-decoration: underline; color: var(--ol-accent-hover); }
.ol-empty {
  padding: 40px 28px;
  text-align: center;
  color: var(--ol-muted);
  font-size: 0.9rem;
}

/* Message loading skeleton / progress */
.ol-reading-loading .ol-load {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  padding: 20px 24px 28px;
  min-height: 180px;
}
.ol-load-bar {
  height: 3px;
  border-radius: 2px;
  background: var(--ol-bg-hover);
  overflow: hidden;
}
.ol-load-bar i {
  display: block;
  height: 100%;
  width: 40%;
  border-radius: 2px;
  background: var(--ol-accent);
  animation: ol-load-slide 1.1s ease-in-out infinite;
}
@keyframes ol-load-slide {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(280%); }
}
.ol-load p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--ol-muted);
}
.ol-load-preview {
  font-size: 0.8rem !important;
  color: var(--ol-muted) !important;
  line-height: 1.45;
  max-height: 4.2em;
  overflow: hidden;
}
.ol-skel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 8px;
}
.ol-skel-line {
  height: 12px;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--ol-bg-hover) 0%, var(--ol-bg-subtle) 50%, var(--ol-bg-hover) 100%);
  background-size: 200% 100%;
  animation: ol-skel-shimmer 1.4s ease-in-out infinite;
}
.ol-skel-box,
.ol-skel-ico {
  display: inline-block;
  background: linear-gradient(90deg, #ecebea 0%, #f5f4f3 50%, #ecebea 100%);
  background-size: 200% 100%;
  animation: ol-skel-shimmer 1.4s ease-in-out infinite;
  border-radius: 2px;
}
.ol-skel-ico {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.ol-skel-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(90deg, #ecebea 0%, #f5f4f3 50%, #ecebea 100%);
  background-size: 200% 100%;
  animation: ol-skel-shimmer 1.4s ease-in-out infinite;
  flex-shrink: 0;
}
.ol-skel-row,
.ol-skel-msg {
  pointer-events: none;
  cursor: default;
}
.ol-skel-msg .ol-msg-main {
  flex: 1;
  min-width: 0;
}
.ol-skel-msg .ol-msg-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}
.ol-host.ol-dark .ol-skel-box,
.ol-host.ol-dark .ol-skel-ico,
.ol-host.ol-dark .ol-skel-avatar {
  background: linear-gradient(90deg, #2d2d2d 0%, #3a3a3a 50%, #2d2d2d 100%);
  background-size: 200% 100%;
}
.ol-tree-row.ol-skel-row {
  opacity: 0.9;
}
.ol-skel-line.w60 { width: 60%; }
.ol-skel-line.w75 { width: 75%; }
.ol-skel-line.w85 { width: 85%; }
.ol-skel-line.w90 { width: 90%; }
.ol-skel-line.w95 { width: 95%; }
@keyframes ol-skel-shimmer {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
.ol-host.ol-dark .ol-skel-line {
  background: linear-gradient(90deg, #2d2d30 0%, #3a3a3e 50%, #2d2d30 100%);
  background-size: 200% 100%;
}

/* ?? Compose window ?? */
.ol-compose-host {
  height: 100%;
  width: 100%;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--ol-bg, #ffffff);
  font-family: var(--ol-font);
  color: var(--ol-text, #242424);
}
.ol-compose-win,
.ol-compose {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0;
  gap: 0;
  min-width: 0;
  min-height: 0;
  flex: 1;
  overflow: hidden;
  background: var(--ol-bg, #ffffff);
  color: var(--ol-text, #242424);
}
.ol-compose.dragover,
.ol-compose-win.dragover {
  outline: 2px dashed var(--ol-accent);
  outline-offset: -4px;
  background: #f0f7fc;
}
.ol-compose-sendbar,
.ol-compose-ribbon {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px 10px;
  background: color-mix(in srgb, var(--w11-win-body) 88%, var(--w11-text));
  border-bottom: 1px solid var(--ol-border);
  color: var(--ol-text);
  flex-shrink: 0;
  min-height: 56px;
}
.ol-compose-ribbon .ol-rbtn {
  min-height: 44px;
}
.ol-compose-ribbon .ol-rbtn.ol-rbtn-sm {
  min-height: 32px;
  min-width: 32px;
  padding: 4px 6px;
}
.ol-compose-ribbon .ol-ribbon-sep {
  height: 36px;
  margin: 4px 6px;
  align-self: center;
}
.ol-compose-fmt {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
  min-height: 36px;
}
.ol-fmt-sep {
  width: 1px;
  height: 22px;
  margin: 0 4px;
  background: var(--ol-border-strong, #c8c6c4);
  flex-shrink: 0;
}
.ol-fmt-select {
  height: 28px;
  border: 1px solid var(--ol-border-strong, var(--w11-stroke));
  border-radius: 2px;
  background: var(--w11-window-bg);
  color: var(--ol-text);
  font-size: 0.78rem;
  padding: 0 6px;
  outline: none;
}
.ol-fmt-select:hover { border-color: var(--w11-accent); }
.ol-fmt-select:focus {
  border-color: var(--ol-accent, #0078d4);
  box-shadow: 0 0 0 1px var(--ol-accent, #0078d4);
}
.ol-fmt-font { width: 132px; max-width: 28vw; }
.ol-fmt-size { width: 56px; }
.ol-fmt-dd {
  position: relative;
  display: inline-flex;
}
.ol-fmt-caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 4px solid currentColor;
  opacity: 0.75;
}
.ol-fmt-color-btn,
.ol-fmt-hi-btn {
  gap: 2px;
}
.ol-fmt-pop {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 40;
  min-width: 168px;
  padding: 8px;
  background: var(--w11-window-bg);
  color: var(--ol-text);
  border: 1px solid #c8c6c4;
  border-radius: 4px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}
.ol-fmt-pop-title {
  font-size: 0.72rem;
  font-weight: 600;
  color: #605e5c;
  margin: 0 0 6px;
}
.ol-fmt-swatch-grid {
  display: grid;
  grid-template-columns: repeat(6, 20px);
  gap: 4px;
}
.ol-fmt-swatch {
  width: 20px;
  height: 20px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 2px;
  padding: 0;
  cursor: pointer;
  appearance: none;
  background: #ccc;
}
.ol-fmt-swatch:hover {
  outline: 1px solid #605e5c;
  outline-offset: 1px;
}
.ol-fmt-swatch-none {
  background: #fff;
  color: #a4262c;
  font-size: 0.7rem;
  line-height: 18px;
  text-align: center;
}
.ol-compose-fields {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 12px;
  border-bottom: 1px solid var(--ol-border);
  flex-shrink: 0;
  background: var(--ol-bg);
  color: var(--ol-text);
  overflow: visible;
  position: relative;
  z-index: 2;
}
.ol-compose-fields label,
.ol-settings label {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 4px 10px;
  align-items: center;
  font-size: 0.8rem;
  color: var(--ol-muted);
  padding: 4px 0;
  border-bottom: 1px solid var(--ol-border);
  width: 100%;
  box-sizing: border-box;
}
.ol-compose-fields label:last-child { border-bottom: 0; }
.ol-compose-fields label span,
.ol-settings label span { font-weight: 600; color: var(--ol-muted); }
.ol-compose-fields input,
.ol-settings input,
.ol-tdetail-controls select,
.ol-tdetail-controls input[type="range"] {
  height: 28px;
  border: 1px solid transparent;
  border-radius: 2px;
  padding: 0 8px;
  font: inherit;
  font-family: inherit;
  background: transparent;
  color: var(--ol-text, #242424);
  outline: none;
}
.ol-compose-fields .ol-addr-wrap input,
.ol-compose-fields .ol-compose-subj input,
.ol-compose-fields #ol-cw-subj {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0;
  padding: 0 2px;
  background: transparent !important;
}
.ol-compose-fields .ol-addr-wrap input:hover,
.ol-compose-fields .ol-addr-wrap input:focus,
.ol-compose-fields #ol-cw-subj:hover,
.ol-compose-fields #ol-cw-subj:focus,
.ol-compose-fields .ol-compose-subj input:hover,
.ol-compose-fields .ol-compose-subj input:focus {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}
.ol-settings input:hover { background: var(--ol-bg-subtle, #faf9f8); }
.ol-settings input:focus {
  background: var(--ol-bg, #fff);
  border-color: var(--ol-accent);
  box-shadow: 0 0 0 1px var(--ol-accent);
}
.ol-compose-body-wrap {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}
.ol-compose-editor {
  flex: 1 1 auto;
  min-height: 0;
  border: 0;
  padding: 14px 16px 20px;
  overflow: auto;
  background: var(--ol-bg, #ffffff);
  font-size: 11pt;
  font-family: Calibri, Aptos, "Segoe UI", sans-serif;
  color: var(--ol-text, #242424);
  outline: none;
  line-height: 1.45;
  position: relative;
}
.ol-compose-html {
  flex: 1;
  min-height: 160px;
  width: 100%;
  box-sizing: border-box;
  border: 0;
  border-top: 1px solid var(--ol-border, #edebe9);
  padding: 12px 14px;
  resize: none;
  overflow: auto;
  background: #1e1e1e;
  color: #d4d4d4;
  font: 12px/1.45 Consolas, "Cascadia Mono", "Courier New", monospace;
  outline: none;
  tab-size: 2;
}
.ol-compose-headers {
  flex: 0 0 auto;
  max-height: 38%;
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--ol-border, #edebe9);
  background: var(--ol-bg-subtle, #faf9f8);
}
.ol-compose-headers-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 10px;
  font-size: 0.78rem;
  border-bottom: 1px solid var(--ol-border, #edebe9);
}
.ol-compose-headers-pre {
  margin: 0;
  padding: 10px 12px;
  overflow: auto;
  font: 11px/1.45 Consolas, "Cascadia Mono", "Courier New", monospace;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--ol-text, #242424);
}
.ol-compose-ribbon .ol-rbtn.active,
.ol-compose-fmt .ol-rbtn.active {
  background: rgba(0, 120, 212, 0.18);
  color: var(--ol-accent, #0078d4);
  box-shadow: inset 0 0 0 1px var(--ol-accent, #0078d4);
}
.ol-compose-host.ol-dark .ol-compose-html {
  background: #111;
  color: #d4d4d4;
  border-top-color: #3b3b3b;
}
.ol-compose-host.ol-dark .ol-compose-headers {
  background: #252525;
  border-top-color: #3b3b3b;
}
.ol-compose-host.ol-dark .ol-compose-headers-bar {
  border-bottom-color: #3b3b3b;
}
.ol-compose-host.ol-dark .ol-compose-headers-pre {
  color: #e0e0e0;
}
.ol-compose-body-wrap .ol-compose-editor {
  flex: 1;
  min-height: 120px;
}
.ol-compose-mjml {
  flex: 1;
  min-height: 280px;
  height: 100%;
  overflow: hidden;
  background: #f0f0f0;
  border-top: 1px solid var(--ol-border, #edebe9);
}
.ol-compose-mjml .ol-mjml-gjs,
.ol-compose-mjml .gjs-editor,
.ol-compose-mjml .gjs-cv-canvas {
  height: 100% !important;
}
.ol-compose-host.ol-compose-mjml-on .ol-compose-fmt {
  display: none !important;
}
.ol-compose-host.ol-compose-mjml-on .ol-compose-win {
  min-height: 0;
}
.ol-compose-host.ol-compose-mjml-on .ol-compose-mjml {
  display: flex;
  flex-direction: column;
}
.ol-compose-host.ol-dark .ol-compose-mjml {
  background: #2b2b2b;
  border-top-color: #3b3b3b;
}
/* GrapesJS in compose: etwas kompakter */
.ol-compose-mjml .gjs-pn-panel {
  font-size: 12px;
}
.ol-compose-mjml .gjs-block {
  min-height: 48px;
  font-size: 11px;
}
.ol-compose-editor .ol-reply-compose {
  min-height: 4.5em;
  margin-bottom: 8px;
  font-family: Calibri, Aptos, "Segoe UI", sans-serif;
  font-size: 11pt;
  line-height: 1.45;
  color: var(--ol-text, #323130);
}
.ol-compose-editor .ol-reply-compose p {
  margin: 0 0 0.35em;
}
.ol-compose-editor .ol-sig-block {
  margin-top: 8px;
  color: var(--ol-text);
  user-select: none;
  cursor: default;
}
.ol-set-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  margin: 8px 0;
  cursor: pointer;
}
.ol-set-toggle input {
  width: 16px;
  height: 16px;
  accent-color: var(--ol-accent, #0078d4);
}
.ol-set-hint {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.45;
}
.ol-compose-editor .ol-quote-block {
  margin-top: 12px;
  clear: both;
}
.ol-compose-editor .ol-quote-hr {
  border: 0;
  border-top: 1px solid var(--ol-border);
  margin: 12px 0 10px;
}
.ol-compose-editor .ol-quote-meta {
  font-size: 0.78rem;
  color: var(--ol-muted);
  line-height: 1.45;
  margin: 0 0 10px;
  font-family: var(--ol-font);
  user-select: text;
  -webkit-user-select: text;
  cursor: text;
}
.ol-compose-editor .ol-quote-meta b {
  color: var(--ol-text);
  font-weight: 600;
}
.ol-compose-editor .ol-quote-body {
  margin: 0;
  padding: 12px;
  border-left: 2px solid var(--ol-accent, #0078d4);
  border-radius: 4px;
  background: #ffffff;
  color: #242424;
  font-size: 0.88rem;
  line-height: 1.45;
  /* Original-Mail bleibt lesbar; Chrome drumherum folgt dem Theme */
  isolation: isolate;
  user-select: text;
  -webkit-user-select: text;
  cursor: text;
}
.ol-compose-editor .ol-inline-reply {
  display: block;
  margin: 4px 0;
  color: #c239b3;
  font-family: "Segoe UI", SegoeUI, sans-serif;
  font-size: 0.9rem;
  line-height: 1.4;
}
.ol-compose-editor .ol-inline-mark {
  font-weight: 700;
  color: #c239b3;
  margin-right: 2px;
  user-select: none;
}
.ol-compose-host.ol-dark .ol-compose-editor .ol-inline-reply,
.ol-compose-host.ol-dark .ol-compose-editor .ol-inline-mark {
  color: #e8a0df;
}
.ol-compose-editor .ol-quote-body img {
  max-width: 100%;
  height: auto;
}
.ol-compose-host.ol-dark .ol-compose-editor .ol-quote-hr {
  border-top-color: #5a5a5a;
}
.ol-compose-host.ol-dark .ol-compose-editor .ol-quote-meta {
  color: #a19f9d;
}
.ol-compose-host.ol-dark .ol-compose-editor .ol-quote-meta b,
.ol-compose-host.ol-dark .ol-compose-editor .ol-quote-body {
  color: #f3f2f1;
}
.ol-compose-host.ol-dark .ol-compose-editor .ol-quote-body {
  border-left-color: #4cc2ff;
}
.ol-compose-ribbon .ol-rbtn,
.ol-compose-win .ol-rbtn {
  color: var(--ol-text, #242424);
}
.ol-compose-ribbon .ol-rbtn.primary {
  color: #fff;
}
.ol-compose-atts {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 14px 10px;
  border-top: 1px solid var(--ol-border);
  border-bottom: 1px solid var(--ol-border);
  background: #faf9f8;
  flex: 0 0 auto;
  max-height: min(28vh, 160px);
  overflow: auto;
  z-index: 2;
}
.ol-compose-atts[hidden] {
  display: none !important;
}
.ol-compose-att-tile {
  position: relative;
}
.ol-compose-att-rm {
  position: absolute;
  top: -5px;
  right: -5px;
  width: 20px;
  height: 20px;
  border: 1px solid color-mix(in srgb, #c42b1c 40%, var(--w11-stroke, #c8c6c4));
  border-radius: 50%;
  background: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg, #fff));
  color: #c42b1c !important;
  font-size: 0;
  line-height: 0;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22);
}
.ol-compose-att-rm::before {
  content: "";
  width: 9px;
  height: 9px;
  background: currentColor;
  clip-path: polygon(
    10% 0%, 50% 40%, 90% 0%, 100% 10%, 60% 50%, 100% 90%, 90% 100%, 50% 60%, 10% 100%, 0% 90%, 40% 50%, 0% 10%
  );
}
.ol-compose-att-rm:hover {
  background: #c42b1c !important;
  color: #fff !important;
  border-color: #a4262c;
}
.ol-compose-host.ol-dark .ol-compose-att-rm,
.ol-host.ol-dark .ol-compose-att-rm,
.ol-ticket-reply-win .ol-compose-att-rm {
  background: color-mix(in srgb, #c42b1c 22%, var(--w11-window-bg, #2d2d30));
  border-color: color-mix(in srgb, #f1707b 55%, var(--w11-stroke, #3f3f46));
  color: #f1707b !important;
}
.ol-compose-host.ol-dark .ol-compose-att-rm:hover,
.ol-host.ol-dark .ol-compose-att-rm:hover,
.ol-ticket-reply-win .ol-compose-att-rm:hover {
  background: #c42b1c !important;
  color: #fff !important;
  border-color: #f1707b;
}
.ol-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 2px;
  background: #deecf9;
  border: 1px solid #c7e0f4;
  font-size: 0.75rem;
  color: var(--ol-text);
}
.ol-chip button {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  color: var(--ol-muted);
  padding: 0 2px;
}
.ol-chip button:hover { color: var(--ol-text); }
.ol-drop-hint {
  margin: 0;
  padding: 4px 12px 8px;
  font-size: 0.72rem;
  color: var(--ol-muted);
  background: #faf9f8;
  flex: 0 0 auto;
}
.ol-compose-actions {
  display: flex;
  gap: 8px;
  padding: 8px 12px;
  border-top: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
  flex-shrink: 0;
}

/* ?? Tickets (Fluent-aligned) ?? */
.ol-tickets {
  height: 100%;
  display: grid;
  grid-template-columns: 280px 1fr;
  min-height: 0;
  background: var(--ol-bg);
  position: relative;
}
.ol-ticket-side {
  border-right: 1px solid var(--ol-border);
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--ol-bg-subtle);
}
.ol-ticket-side-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--ol-text);
}
.ol-ticket-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
  padding: 0 6px;
}
.ol-ticket-tab {
  appearance: none;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--ol-muted);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 8px 10px;
  cursor: pointer;
}
.ol-ticket-tab:hover { color: var(--ol-text); }
.ol-ticket-tab.active {
  color: var(--ol-accent);
  border-bottom-color: var(--ol-accent);
}
.ol-tev-h,
.ol-tev > header {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
  font-size: 0.78rem;
  color: var(--ol-muted);
  justify-content: flex-start;
}
.ol-tev-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 11rem;
  width: 11rem;
  box-sizing: border-box;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  padding: 3px 6px;
  border-radius: 3px;
  background: var(--ol-bg-hover);
  color: var(--ol-muted);
  text-align: center;
  white-space: nowrap;
  margin: 0;
}
.ol-tev-who {
  flex: 0 1 auto;
  font-weight: 600;
  color: var(--ol-text);
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 28%;
}
.ol-tev-when {
  flex: 0 0 auto;
  color: var(--ol-muted);
  font-size: 0.78rem;
  white-space: nowrap;
}
.ol-tev-edited {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--ol-muted);
  font-size: 0.72rem;
  font-style: italic;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-tev-edit,
.ol-tev-edit-spacer {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  margin-left: auto;
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--ol-muted);
  cursor: pointer;
  padding: 0;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ol-tev-edit:hover {
  color: var(--ol-accent);
  background: var(--ol-bg-hover);
}
.ol-tev-edit-spacer {
  visibility: hidden;
  pointer-events: none;
}
.ol-tev.vendor-out .ol-tev-badge { background: #fce4d6; color: #c43e1c; }
.ol-tev.system .ol-tev-badge { background: var(--ol-bg-hover); color: var(--ol-muted); }
.ol-ticket-win {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--ol-bg);
  color: var(--ol-text);
}
.ol-ticket-win .ol-ticket-reply-meta {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px 14px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--ol-border);
  user-select: none;
  -webkit-user-select: none;
}
.ol-ticket-win .ol-ticket-reply-ed {
  flex: 1 1 auto;
  min-height: 120px;
  max-height: none;
  overflow: auto;
  margin: 0;
  border: 0;
  border-bottom: 1px solid var(--ol-border);
  padding: 12px 14px;
  width: 100%;
  box-sizing: border-box;
}
.ol-ticket-win-f {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 10px 14px;
  flex-shrink: 0;
}
.ol-ticket-win-f .ol-ai-bar-ticket {
  flex: 1 1 auto;
  min-width: 180px;
  margin: 0;
}
.ol-ticket-note-win textarea {
  flex: 1;
  width: calc(100% - 28px);
  margin: 8px 14px;
  min-height: 160px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 4px;
  padding: 10px;
  background: var(--ol-bg);
  color: var(--ol-text);
  font: inherit;
  resize: vertical;
}
.ol-ticket-note-win input[type="file"] {
  margin: 0 14px 8px;
}
.ol-ticket-list { flex: 1; overflow: auto; background: var(--ol-bg); }
.ol-ticket-search {
  padding: 8px 10px;
  border-bottom: 1px solid var(--ol-border);
}
.ol-ticket-search input {
  width: 100%;
  height: 30px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 4px;
  padding: 0 10px;
  background: var(--ol-bg);
  color: var(--ol-text);
  font: inherit;
}
.ol-ticket-closed-tog {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  font-weight: 500;
  color: var(--ol-muted);
  cursor: pointer;
}
.ol-ticket-bulk {
  padding: 8px 10px;
  border-bottom: 1px solid var(--ol-border);
}
.ol-ticket-row {
  display: flex;
  align-items: stretch;
  width: 100%;
  text-align: left;
  border: 0;
  border-bottom: 1px solid var(--ol-border);
  border-left: 3px solid transparent;
  background: var(--ol-bg);
  padding: 0;
  font: inherit;
  font-family: inherit;
  color: var(--ol-text);
}
/* Neues Ticket: goldener linker Indikator (kein goldener Rahmen) */
.ol-ticket-row.is-new {
  border-left-color: #c9a227;
  background: linear-gradient(90deg, rgba(201, 162, 39, 0.1), transparent 42%);
}
.ol-ticket-row.is-overdue:not(.needs-vendor-reply) {
  border-left-color: #c42b1c;
  background: linear-gradient(90deg, rgba(196, 43, 28, 0.08), transparent 45%);
}
.ol-ticket-row.is-stale:not(.is-overdue):not(.needs-vendor-reply):not(.is-new) {
  border-left-color: #ca5010;
}
.ol-ticket-row.pri-urgent:not(.needs-vendor-reply):not(.is-new) { border-left-color: #c42b1c; }
.ol-ticket-row.pri-high:not(.is-overdue):not(.needs-vendor-reply):not(.is-new) { border-left-color: #ca5010; }
.ol-ticket-row.pri-low:not(.needs-vendor-reply):not(.is-new) { border-left-color: #8a8886; }
/* Herstellerantwort wartet auf Agent: rot pulsierender linker Indikator */
.ol-ticket-row.needs-vendor-reply {
  --ol-pulse-ms: 2400ms;
  --ol-pulse-alpha: 0.28;
  border-left-color: #e81123;
  background: linear-gradient(90deg, rgba(232, 17, 35, calc(var(--ol-pulse-alpha) * 0.45)), transparent 48%);
  animation: ol-ticket-vendor-pulse var(--ol-pulse-ms) ease-in-out infinite;
}
@keyframes ol-ticket-vendor-pulse {
  0%, 100% {
    border-left-color: #a80000;
    box-shadow: inset 4px 0 0 0 rgba(232, 17, 35, calc(var(--ol-pulse-alpha) * 0.55));
  }
  50% {
    border-left-color: #ff4d4f;
    box-shadow: inset 5px 0 10px 0 rgba(255, 60, 60, var(--ol-pulse-alpha));
  }
}
.ol-ticket-num-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 2px;
  width: 100%;
}
.ol-ticket-chips {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
  flex: 0 1 auto;
  min-width: 0;
}
.ol-new-chip {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  padding: 2px 7px;
  border-radius: 2px;
  line-height: 1.2;
  background: #c9a227 !important;
  color: #1a1a1a !important;
}
.ol-pri-chip {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  padding: 2px 7px;
  border-radius: 2px;
  line-height: 1.2;
}
.ol-pri-chip.pri-low {
  background: #605e5c !important;
  color: #fff !important;
}
.ol-pri-chip.pri-normal {
  background: #0078d4 !important;
  color: #fff !important;
}
.ol-pri-chip.pri-high {
  background: #ca5010 !important;
  color: #fff !important;
}
.ol-pri-chip.pri-urgent {
  background: #a4262c !important;
  color: #fff !important;
}
.ol-host.ol-dark .ol-pri-chip.pri-low {
  background: #8a8886 !important;
  color: #1b1a19 !important;
}
.ol-host.ol-dark .ol-pri-chip.pri-normal {
  background: #3aa0f3 !important;
  color: #0b1a26 !important;
}
.ol-host.ol-dark .ol-pri-chip.pri-high {
  background: #ff8c00 !important;
  color: #1b1200 !important;
}
.ol-host.ol-dark .ol-pri-chip.pri-urgent {
  background: #e81123 !important;
  color: #fff !important;
}
.ol-ticket-warn {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 2px;
}
.ol-ticket-warn.overdue { background: #a4262c; color: #fff; }
.ol-ticket-warn.stale { background: #ca5010; color: #fff; }
.ol-ticket-due { white-space: nowrap; }
.ol-ticket-banner {
  padding: 8px 16px;
  font-size: 0.8rem;
  font-weight: 600;
  border-bottom: 1px solid var(--ol-border);
}
.ol-ticket-banner.overdue {
  background: color-mix(in srgb, #a4262c 22%, var(--w11-window-bg, #ffffff));
  color: var(--w11-text, #a4262c);
}
.ol-ticket-banner.stale {
  background: color-mix(in srgb, #ca5010 22%, var(--w11-window-bg, #ffffff));
  color: var(--w11-text, #835c00);
}
.ol-host.ol-dark .ol-ticket-banner.stale {
  background: color-mix(in srgb, #ca5010 22%, var(--w11-window-bg, #1a1a1a));
  color: var(--w11-text, #ffffff);
}
.ol-host.ol-dark .ol-ticket-banner.overdue {
  background: color-mix(in srgb, #a4262c 22%, var(--w11-window-bg, #1a1a1a));
  color: var(--w11-text, #ffffff);
}
.ol-ticket-files {
  display: none !important;
}
.ol-tev-atts {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  margin-left: auto;
  max-width: none;
  justify-content: flex-end;
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
}
.ol-tev-atts .ol-att-tile {
  flex: 0 0 auto;
  max-width: 140px;
}
.ol-tev-h:has(.ol-tev-atts) .ol-tev-edited {
  flex: 0 1 auto;
  max-width: 18%;
}
.ol-tev-h:has(.ol-tev-atts) .ol-tev-edit-spacer {
  display: none;
}
.ol-ticket-reply-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--ol-border);
  flex-shrink: 0;
}
.ol-ticket-reply-win.dragover,
.ol-ticket-win.dragover {
  outline: 2px dashed var(--ol-accent);
  outline-offset: -4px;
  background: color-mix(in srgb, var(--ol-accent) 8%, transparent);
}
.ol-ticket-att-hint {
  margin: 0;
  padding: 4px 14px 0;
  font-size: 0.75rem;
}
.ol-ticket-reply-win .ol-compose-atts {
  background: var(--ol-bg-subtle, #faf9f8);
}
.ol-ticket-files-h {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.ol-ticket-files-h strong {
  font-size: 0.78rem;
  color: var(--ol-muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.ol-ticket-files-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.ol-ticket-file {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  border: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
  border-radius: 2px;
  font-size: 0.78rem;
  max-width: 100%;
}
.ol-ticket-file-name {
  color: var(--ol-accent);
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 220px;
}
.ol-ticket-file-name:hover { text-decoration: underline; }
.ol-ticket-file-meta { color: var(--ol-muted); font-size: 0.72rem; }
.ol-ticket-file-del {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--ol-muted);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  padding: 0 2px;
}
.ol-ticket-file-del:hover { color: #a4262c; }
.ol-tpl-modal { width: min(720px, 96vw); max-height: 90vh; }
.ol-tpl-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 12px;
  padding: 12px 16px;
  min-height: 260px;
}
.ol-tpl-list {
  border: 1px solid var(--ol-border);
  background: var(--ol-bg);
  overflow: auto;
  max-height: 320px;
}
.ol-tpl-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--ol-border);
}
.ol-tpl-acts { display: flex; gap: 6px; flex-shrink: 0; }
.ol-tpl-editor {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ol-tpl-editor label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.72rem;
  color: var(--ol-muted);
}
.ol-tpl-editor input,
.ol-tpl-editor textarea {
  border: 1px solid var(--ol-border-strong);
  background: var(--ol-bg);
  color: var(--ol-text);
  padding: 6px 8px;
  font: inherit;
}
.ol-tpl-editor-acts { display: flex; gap: 8px; justify-content: flex-end; }

/* Antwortvorlagen ? Windows-Listenansicht + Editor-Dialog */
.w11-window.ol-tpl-dlg-win,
.w11-window.ol-tpl-dlg-win .w11-win-body,
.w11-window.ol-tpl-dlg-win .w11-dialog-body,
.w11-window.ol-tpl-dlg-win .dlg-shell,
.w11-window.ol-tpl-dlg-win .dlg-form,
.w11-window.ol-tpl-dlg-win .ol-tpl-list-host,
.w11-window.ol-tpl-dlg-win .ol-tpl-edit-host {
  overflow: hidden !important;
  height: 100%;
}
.ol-tpl-list-host,
.ol-tpl-edit-host {
  height: 100%;
  min-height: 0;
}
.ol-tpl-dlg-pad {
  display: flex;
  flex-direction: column;
  padding: 12px 12px 8px !important;
  min-height: 0;
}
.ol-tpl-lv {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  outline: none;
}
.ol-tpl-lv:focus-visible {
  border-color: var(--w11-accent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-accent) 55%, transparent);
}
.ol-tpl-lv-head {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  padding: 4px 10px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
  border-bottom: 1px solid var(--w11-stroke);
  user-select: none;
}
.ol-tpl-lv-col { flex: 1; min-width: 0; }
.ol-tpl-lv-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.ol-tpl-lv-empty {
  padding: 28px 16px;
  text-align: center;
  color: var(--w11-muted);
  font-size: 0.85rem;
}
.ol-tpl-lv-row {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 6px 10px;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  border-radius: 0;
  background: transparent;
  color: var(--w11-text);
  font: inherit;
  font-size: 0.84rem;
  text-align: left;
  cursor: default;
}
.ol-tpl-lv-row:hover {
  background: color-mix(in srgb, var(--w11-highlight) 28%, var(--w11-window-bg));
}
.ol-tpl-lv-row.selected {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  box-shadow: inset 3px 0 0 var(--w11-accent);
}
.ol-tpl-lv-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-tpl-dlg .win-sheet-footer {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ol-tpl-count {
  margin-right: auto;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.ol-tpl-edit-pad {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
}
.ol-tpl-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.ol-tpl-field input,
.ol-tpl-field textarea {
  font: inherit;
  font-size: 0.88rem;
  padding: 7px 10px;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  outline: none;
}
.ol-tpl-field input:focus,
.ol-tpl-field textarea:focus {
  border-color: var(--w11-accent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-accent) 45%, transparent);
}
.ol-tpl-field-body {
  flex: 1;
  min-height: 0;
}
.ol-tpl-field-body textarea {
  flex: 1;
  min-height: 180px;
  resize: vertical;
  line-height: 1.4;
}
.ol-tpl-rich {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-window-bg);
  overflow: hidden;
}
.ol-tpl-rich-toolbar {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  padding: 4px 6px;
  border-bottom: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 72%, var(--w11-window-bg));
}
.ol-tpl-rich-toolbar .ol-ribbon-sep { display: none; }
.ol-tpl-rich-toolbar .ol-compose-fmt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  width: 100%;
}
.ol-tpl-rich-ed.ol-compose-editor {
  flex: 1;
  min-height: 200px;
  max-height: none;
  overflow: auto;
  padding: 10px 12px;
  font-family: Calibri, "Segoe UI", var(--w11-font), sans-serif;
  font-size: 11pt;
  line-height: 1.45;
  color: var(--w11-text);
  background: var(--w11-win-body);
  outline: none;
  border: 0;
  border-radius: 0;
}
.ol-tpl-rich-ed:focus {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--w11-accent) 45%, transparent);
}
.ol-tpl-rich-ed p {
  margin: 0 0 0.55em;
}
.ol-tpl-rich-ed p:last-child {
  margin-bottom: 0;
}
.ol-ticket-tpl-label {
  display: block;
  min-width: 160px;
  max-width: 240px;
  width: 200px;
  position: relative;
  flex-shrink: 0;
  margin-left: auto;
}
.ol-ticket-tpl-label select,
.ol-ticket-tpl-field {
  display: block;
  width: 100%;
  height: 32px;
  box-sizing: border-box;
  padding: 0 32px 0 12px;
  border: 1px solid var(--w11-stroke, var(--ol-border-strong));
  border-radius: 6px;
  background-color: var(--w11-window-bg, var(--ol-bg));
  color: var(--w11-text, var(--ol-text));
  font: inherit;
  font-size: 0.8rem;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--w11-muted, #8a8886) 50%),
    linear-gradient(135deg, var(--w11-muted, #8a8886) 50%, transparent 50%);
  background-position:
    calc(100% - 16px) 13px,
    calc(100% - 11px) 13px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.ol-ticket-tpl-label select:focus,
.ol-ticket-tpl-field:focus {
  outline: 2px solid color-mix(in srgb, var(--w11-accent, #0078d4) 55%, transparent);
  outline-offset: 1px;
}
.ol-ticket-tpl-label select.ol-tpl-empty,
.ol-ticket-tpl-field.ol-tpl-empty {
  color: var(--w11-muted, #8a8886);
}
.ol-ticket-tpl-label select:not(.ol-tpl-empty),
.ol-ticket-tpl-field:not(.ol-tpl-empty) {
  color: var(--w11-text, var(--ol-text));
  font-weight: 600;
}
.ol-ticket-tpl-label select option {
  color: var(--w11-text, #111);
  background: var(--w11-window-bg, #fff);
}
.ol-ticket-open {
  flex: 1;
  appearance: none;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 10px 12px;
  cursor: pointer;
  font: inherit;
  color: inherit;
  min-width: 0;
}
.ol-ticket-row:hover { background: var(--ol-bg-hover); }
.ol-ticket-row.selected {
  background: var(--ol-sel-msg);
  border-left-color: var(--ol-accent);
}
.ol-ticket-row.multi-sel:not(.selected) {
  background: rgba(0, 120, 212, 0.12);
  border-left-color: var(--ol-accent);
}
.ol-ticket-row.selected.is-new:not(.needs-vendor-reply),
.ol-ticket-row.multi-sel.is-new:not(.needs-vendor-reply) {
  border-left-color: #c9a227;
}
.ol-ticket-row.selected.needs-vendor-reply,
.ol-ticket-row.multi-sel.needs-vendor-reply {
  border-left-color: #e81123;
}
.ol-ticket-tnum {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 2px;
  background: var(--ol-bg-hover);
  color: var(--ol-text);
  margin-right: 4px;
  flex: 0 0 auto;
}
.ol-multi-ticket-h {
  padding: 14px 16px;
  border-bottom: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
}
.ol-multi-ticket-h h3 {
  margin: 0 0 4px;
  font-size: 1.05rem;
}
.ol-multi-ticket-h small { color: var(--ol-muted); }
.ol-multi-ticket-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.ol-multi-ticket-tag {
  font-size: 0.72rem;
  padding: 2px 8px;
  border: 1px solid var(--ol-border);
  background: var(--ol-bg);
  border-radius: 2px;
}
.ol-ticket-row strong {
  display: block;
  font-size: 0.82rem;
  margin: 2px 0;
  font-weight: 600;
}
.ol-ticket-row small { color: var(--ol-muted); font-size: 0.72rem; }
.ol-tdetail {
  min-height: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--ol-bg);
  color: var(--ol-text);
}
.ol-thread-full {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 12px 16px 24px;
  border-right: 0;
}
.ol-tev.outbound .ol-tev-badge { background: #deecf9; color: #0078d4; }
.ol-tev.inbound .ol-tev-badge { background: #dff6dd; color: #0b6a0b; }
.ol-tev.vendor .ol-tev-badge { background: #fff4ce; color: #835c00; }
.ol-tev-auto-badge {
  display: inline-flex;
  align-items: center;
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: #8764b8;
  background: color-mix(in srgb, #8764b8 16%, var(--w11-window-bg, #fff));
  border: 1px solid color-mix(in srgb, #8764b8 35%, var(--w11-stroke, #c8c6c4));
  border-radius: 3px;
  padding: 2px 6px;
  margin-left: 2px;
  white-space: nowrap;
}
.ol-tev-note {
  border-color: #c9a227 !important;
  background: rgba(201, 162, 39, 0.1) !important;
}
.ol-tev-note .ol-tev-badge {
  background: #c9a227;
  color: #1a1a1a;
}
.ol-tev-note-acts { margin-left: auto; }
.ol-ticket-modal-bg {
  position: absolute;
  inset: 0;
  z-index: 40;
  background: rgba(0, 0, 0, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.ol-ticket-modal {
  width: min(720px, 100%);
  max-height: min(90%, 720px);
  overflow: auto;
  background: var(--ol-bg);
  color: var(--ol-text);
  border: 1px solid var(--ol-border-strong);
  border-radius: 8px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  display: flex;
  flex-direction: column;
}
.ol-ticket-reply-win {
  width: 100%;
  height: 100%;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.ol-t-attach-pop {
  min-width: 150px;
  padding: 4px;
  right: 0;
  left: auto;
}
.ol-t-attach-item {
  appearance: none;
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.82rem;
  padding: 8px 10px;
  border-radius: 4px;
  cursor: pointer;
}
.ol-t-attach-item:hover {
  background: color-mix(in srgb, var(--w11-accent, var(--ol-accent)) 18%, transparent);
}
.ol-compose-attach-dd {
  position: relative;
}
.ol-compose-attach-pop {
  min-width: 168px;
  padding: 4px;
  left: 0;
  right: auto;
  top: calc(100% + 4px);
  z-index: 40;
}
.w11-scan-picker-body {
  padding: 0 !important;
  background: var(--w11-win-body, var(--ol-bg)) !important;
}
.ol-scan-picker-host,
.ol-scan-picker-mount,
.ol-scan-picker {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.ol-scan-picker {
  background: var(--w11-win-body, #1f1f1f);
  color: var(--w11-text, #f3f3f3);
}
.ol-scan-picker-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--w11-stroke, var(--w11-win-border, #3a3a3a));
  background: color-mix(in srgb, var(--w11-titlebar, #2b2b2b) 88%, var(--w11-window-bg, #202020));
}
.ol-scan-picker-path {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.ol-scan-picker-path-ico {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 22%, var(--w11-window-bg, #2a2a2a));
  color: var(--w11-accent, #4cc2ff);
  flex: 0 0 auto;
}
.ol-scan-picker-path strong {
  display: block;
  font-size: 0.92rem;
  font-weight: 600;
}
.ol-scan-picker-path small {
  display: block;
  color: var(--w11-muted, #b3b3b3);
  font-size: 0.75rem;
}
.ol-scan-picker-actions {
  display: flex;
  gap: 8px;
  flex: 0 0 auto;
}
.ol-scan-picker-body {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(240px, 34%) 1fr;
  gap: 0;
}
.ol-scan-picker-list {
  min-height: 0;
  overflow: auto;
  border-right: 1px solid var(--w11-stroke, var(--w11-win-border, #3a3a3a));
  background: color-mix(in srgb, var(--w11-window-bg, #252525) 92%, #000);
  padding: 6px;
}
.ol-scan-picker-empty {
  padding: 18px 12px;
  color: var(--w11-muted, #aaa);
  font-size: 0.84rem;
  text-align: center;
}
.ol-scan-row {
  appearance: none;
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  color: inherit;
  font: inherit;
  border-radius: 8px;
  padding: 9px 10px;
  cursor: pointer;
  margin-bottom: 2px;
}
.ol-scan-row:hover {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 14%, transparent);
}
.ol-scan-row.is-active {
  background: color-mix(in srgb, var(--w11-accent, #1670c5) 22%, var(--w11-window-bg, #2a2a2a));
  border-color: color-mix(in srgb, var(--w11-accent, #1670c5) 45%, transparent);
}
.ol-scan-row-ico {
  flex: 0 0 auto;
  margin-top: 1px;
  opacity: 0.95;
}
.ol-scan-row-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ol-scan-row-name {
  font-size: 0.84rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-scan-row-meta {
  font-size: 0.72rem;
  color: var(--w11-muted, #b0b0b0);
}
.ol-scan-picker-preview {
  min-height: 0;
  overflow: auto;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 14px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--w11-win-body, #1a1a1a) 88%, #000), var(--w11-win-body, #1a1a1a));
}
.ol-scan-picker-preview-ph {
  margin: auto;
  color: var(--w11-muted, #aaa);
  font-size: 0.88rem;
  text-align: center;
  padding: 24px;
}
.ol-scan-preview-canvas,
.ol-scan-preview-img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
  background: #fff;
}
.ol-scan-picker-status {
  flex: 0 0 auto;
  padding: 6px 12px;
  font-size: 0.75rem;
  color: var(--w11-muted, #b3b3b3);
  border-top: 1px solid var(--w11-stroke, var(--w11-win-border, #3a3a3a));
  background: color-mix(in srgb, var(--w11-titlebar, #2b2b2b) 80%, transparent);
}
@media (max-width: 780px) {
  .ol-scan-picker-body {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(160px, 38%) 1fr;
  }
  .ol-scan-picker-list {
    border-right: 0;
    border-bottom: 1px solid var(--w11-stroke, var(--w11-win-border, #3a3a3a));
  }
}
.ol-ticket-att-flyout {
  position: fixed;
  display: flex;
  flex-direction: column;
  min-height: 0;
  box-sizing: border-box;
  border: 1px solid var(--w11-win-border, var(--ol-border));
  border-radius: var(--w11-radius, 8px);
  background: var(--w11-win-body, var(--ol-bg));
  color: var(--w11-text, var(--ol-text));
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  overflow: hidden;
  pointer-events: auto;
}
.ol-ticket-att-drawer-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--ol-border, var(--w11-win-border));
  background: var(--w11-titlebar, var(--ol-bg-subtle));
  color: var(--w11-title-color, var(--w11-text));
  flex-shrink: 0;
}
.ol-ticket-att-drawer-h strong {
  font-size: 0.78rem;
  font-weight: 600;
}
.ol-ticket-att-drawer-x {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--ol-muted, var(--w11-muted));
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
  border-radius: 4px;
}
.ol-ticket-att-drawer-x:hover {
  background: color-mix(in srgb, var(--w11-text) 12%, transparent);
  color: var(--ol-text, var(--w11-text));
}
.ol-ticket-att-drawer-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: var(--w11-win-body, var(--ol-bg));
}
.ol-ticket-att-drawer-empty {
  margin: 8px 4px;
  font-size: 0.8rem;
}
.ol-ticket-att-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--ol-border, var(--w11-win-border));
  border-radius: 6px;
  background: color-mix(in srgb, var(--w11-text) 4%, var(--w11-win-body, var(--ol-bg)));
  cursor: grab;
  user-select: none;
}
.ol-ticket-att-item:hover {
  border-color: color-mix(in srgb, var(--w11-accent, var(--ol-accent)) 45%, var(--ol-border, var(--w11-win-border)));
  background: color-mix(in srgb, var(--w11-accent, var(--ol-accent)) 8%, transparent);
}
.ol-ticket-att-item.is-dragging {
  opacity: 0.55;
}
.ol-ticket-att-item-ico {
  flex-shrink: 0;
  display: grid;
  place-items: center;
}
.ol-ticket-att-item-ico svg {
  width: 22px;
  height: 28px;
}
.ol-ticket-att-item-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ol-ticket-att-item-name {
  font-size: 0.78rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-ticket-att-item-meta {
  font-size: 0.7rem;
  color: var(--ol-muted, var(--w11-muted));
}
.ol-ticket-reply-toolbar .ol-t-attach-dd .ol-rbtn span {
  display: none;
}
.ol-ticket-modal-h {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
}
.ol-ticket-modal-x {
  appearance: none;
  border: 0;
  background: transparent;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  color: var(--ol-muted);
  padding: 2px 8px;
}
.ol-ticket-reply-meta {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px 14px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--ol-border);
  flex-shrink: 0;
  user-select: none;
  -webkit-user-select: none;
}
.ol-ticket-reply-targets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  flex: 1;
  min-width: 0;
  user-select: none;
  -webkit-user-select: none;
}
.ol-ticket-reply-targets .ol-check {
  user-select: none;
  -webkit-user-select: none;
  cursor: pointer;
}
.ol-ticket-reply-meta-sep {
  width: 1px;
  align-self: stretch;
  min-height: 28px;
  background: var(--ol-border, var(--w11-win-border));
  flex-shrink: 0;
}
.ol-ticket-reply-ed {
  min-height: 120px;
  max-height: none;
  overflow: auto;
  margin: 0;
  border: 0;
  border-bottom: 1px solid var(--ol-border);
  padding: 12px 14px;
}
.ol-ticket-modal-f {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 14px;
}
.ol-ticket-modal textarea {
  width: calc(100% - 28px);
  margin: 10px 14px;
  min-height: 140px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 4px;
  padding: 10px;
  background: var(--ol-bg);
  color: var(--ol-text);
  font: inherit;
  resize: vertical;
}
.ol-ticket-note-hint { margin: 8px 14px 0; font-size: 0.78rem; }
.ol-ticket-merge-list { padding: 8px 14px 4px; display: flex; flex-direction: column; gap: 8px; }
.ol-ticket-merge-opt {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 8px 10px;
  border: 1px solid var(--ol-border);
  border-radius: 4px;
  cursor: pointer;
}
.ol-ticket-merge-opt:has(input:checked) {
  border-color: var(--ol-accent);
  background: var(--ol-sel-msg);
}
.ol-ticket-num {
  color: var(--ol-accent);
  font-weight: 700;
  font-size: 0.78rem;
}
.ol-progress {
  height: 4px;
  background: var(--ol-bg-hover);
  border-radius: 2px;
  margin-top: 6px;
  overflow: hidden;
}
.ol-progress i {
  display: block;
  height: 100%;
  background: #107c10;
  border-radius: 2px;
}
.ol-ticket-main {
  min-width: 0;
  overflow: auto;
  background: var(--ol-bg);
  color: var(--ol-text);
}
.ol-tdetail {
  min-height: 100%;
  background: var(--ol-bg);
  color: var(--ol-text);
}
.ol-tdetail-h {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--ol-border);
  background: var(--ol-bg-subtle);
  color: var(--ol-text);
}
.ol-tdetail-h h3 {
  margin: 4px 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--ol-text);
}
.ol-tdetail-h small { color: var(--ol-muted); }
.ol-tdetail-numline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.ol-amazon-invoice-link {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none;
  color: #111;
  background: color-mix(in srgb, #ff9900 88%, var(--w11-window-bg, #fff));
  border: 1px solid color-mix(in srgb, #ff9900 55%, var(--w11-stroke, #ccc));
}
.ol-amazon-invoice-link:hover {
  filter: brightness(0.95);
  text-decoration: none;
}
.ol-ticket-portal {
  margin: 0 16px 12px;
  padding: 12px 14px;
  border: 1px solid var(--ol-border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--ol-accent, #0078d4) 8%, var(--ol-bg-subtle, var(--ol-bg)));
}
.ol-portal-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.ol-portal-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: #fff;
  background: #ff9900;
}
.ol-ticket-portal[data-portal-source="amazon"] .ol-portal-badge {
  background: #ff9900;
  color: #111;
}
.ol-ticket-portal[data-portal-source="otto"] .ol-portal-badge {
  background: #e50310;
  color: #fff;
}
.ol-ticket-source.src-amazon {
  background: #ff9900 !important;
  color: #111 !important;
}
.ol-ticket-source.src-otto {
  background: #e50310 !important;
  color: #fff !important;
}
.ol-portal-resolve {
  font-size: 0.78rem;
  color: var(--ol-accent);
  text-decoration: none;
}
.ol-portal-resolve:hover { text-decoration: underline; }
.ol-portal-grid {
  display: grid;
  gap: 6px;
  flex: 1;
  min-width: 0;
}
.ol-portal-cols {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px 24px;
  align-items: start;
}
@media (max-width: 900px) {
  .ol-portal-cols {
    grid-template-columns: 1fr;
  }
}
.ol-portal-grid-addr {
  padding-left: 4px;
  border-left: 1px solid color-mix(in srgb, var(--ol-border) 70%, transparent);
}
.ol-portal-grid-empty {
  border-left: none;
  min-height: 1px;
}
.ol-portal-addr {
  white-space: pre-line;
  line-height: 1.35;
}
.ol-ticket-files {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 16px 12px;
  padding: 0;
}
.ol-portal-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 8px;
  align-items: start;
  font-size: 0.84rem;
}
.ol-portal-k {
  color: var(--ol-muted);
}
.ol-portal-v {
  color: var(--ol-text);
  word-break: break-word;
}
.ol-portal-muted {
  color: var(--ol-muted);
  font-style: italic;
}
.ol-portal-order {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ol-portal-order code {
  font-family: Consolas, "Segoe UI Mono", monospace;
  font-size: 0.86rem;
}
.ol-portal-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--ol-border-strong, var(--ol-border));
  border-radius: 4px;
  background: var(--ol-bg);
  color: var(--ol-muted);
  cursor: pointer;
  padding: 0;
}
.ol-portal-copy:hover {
  color: var(--ol-accent);
  border-color: var(--ol-accent);
}
.ol-portal-product {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: baseline;
}
.ol-portal-chip {
  display: inline-flex;
  padding: 1px 7px;
  border-radius: 999px;
  border: 1px solid var(--ol-border);
  background: var(--ol-bg);
  color: var(--ol-muted);
  font-size: 0.72rem;
  font-family: Consolas, "Segoe UI Mono", monospace;
}
.ol-ticket-source {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 650;
  background: color-mix(in srgb, #ff9900 28%, transparent);
  color: var(--ol-text);
}
.ol-ticket-files-hint {
  display: block;
  margin: 0 0 8px;
  font-size: 0.75rem;
}
.ol-tdetail-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: end;
}
.ol-tdetail-controls label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.72rem;
  color: var(--ol-muted);
}
.ol-tdetail-controls select,
.ol-tdetail-controls input[type="range"],
.ol-tdetail-controls input[type="date"],
.ol-tdetail-controls input[type="number"] {
  border: 1px solid var(--ol-border-strong);
  background: var(--ol-bg);
  color: var(--ol-text);
  height: 28px;
  min-width: 0;
  padding: 0 6px;
}
.ol-tdetail-controls select:focus {
  border-color: var(--ol-accent);
  outline: none;
  box-shadow: 0 0 0 1px var(--ol-accent);
}
.ol-tdetail-grid {
  display: grid;
  grid-template-columns: 1fr 300px;
  min-height: 0;
  background: var(--ol-bg);
}
.ol-thread {
  padding: 12px;
  overflow: auto;
  border-right: 1px solid var(--ol-border);
  background: var(--ol-bg);
  color: var(--ol-text);
}
.ol-tev {
  border: 1px solid var(--ol-border);
  border-radius: 2px;
  margin-bottom: 10px;
  background: var(--ol-bg);
  color: var(--ol-text);
  overflow: hidden;
}
.ol-tev.outbound {
  border-color: #c7e0f4;
  background: #f3f9fd;
}
.ol-tev-body {
  padding: 0;
  max-height: none;
  overflow: hidden;
  color: var(--ol-text);
  background: var(--ol-bg);
}
.ol-tev-frame {
  display: block;
  width: 100%;
  min-height: 72px;
  max-height: 420px;
  border: 0;
  background: transparent;
}
.ol-ttools {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--ol-bg-subtle);
}
.ol-card {
  background: var(--ol-bg);
  border: 1px solid var(--ol-border);
  border-radius: 2px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: var(--ol-text);
}
.ol-card strong {
  font-size: 0.82rem;
  color: var(--ol-text);
}
.ol-card textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--ol-border-strong);
  border-radius: 2px;
  padding: 8px;
  font: inherit;
  font-family: inherit;
  font-size: 0.82rem;
  resize: vertical;
  color: var(--ol-text);
  background: var(--ol-bg);
  outline: none;
}
.ol-card textarea:focus {
  border-color: var(--ol-accent);
  box-shadow: 0 0 0 1px var(--ol-accent);
}
.ol-check {
  display: flex !important;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  color: var(--ol-text);
}
.ol-ttools-btns { display: flex; gap: 6px; flex-wrap: wrap; }
.ol-note {
  border-top: 1px solid var(--ol-border);
  padding-top: 6px;
  font-size: 0.8rem;
  color: var(--ol-text);
}
.ol-note img {
  max-width: 100%;
  margin-top: 6px;
  border: 1px solid var(--ol-border);
  border-radius: 2px;
}
.ol-activity {
  margin: 0;
  padding-left: 16px;
  font-size: 0.75rem;
  color: var(--ol-text);
}
.ol-activity em { color: var(--ol-muted); font-style: normal; }
.ol-pending-banner {
  flex-shrink: 0;
  position: relative;
  z-index: 2;
  background: color-mix(in srgb, #fff4ce 88%, var(--ol-bg-subtle));
  color: #835c00;
  padding: 8px 12px;
  font-size: 0.78rem;
  border: 0;
  border-bottom: 1px solid #f0d78c;
  width: 100%;
  text-align: left;
  cursor: pointer;
  appearance: none;
  font: inherit;
  font-weight: 600;
  pointer-events: auto;
}
.ol-pending-banner:hover { filter: brightness(0.97); }
.ol-pending-banner.is-active {
  outline: 2px solid var(--ol-accent, #0078d4);
  outline-offset: -2px;
  background: color-mix(in srgb, #fff4ce 70%, var(--ol-accent, #0078d4));
}
.ol-pending-list {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100%;
  box-sizing: border-box;
}
.ol-pending-hint {
  margin: 0;
  font-size: 0.78rem;
  color: var(--ol-muted);
  line-height: 1.35;
}
.ol-pending-card {
  border: 1px solid var(--ol-border);
  padding: 0;
  margin: 0;
  background: var(--ol-bg);
  border-radius: 4px;
  overflow: hidden;
  cursor: grab;
}
.ol-pending-card.is-dragging {
  opacity: 0.55;
  cursor: grabbing;
}
.ol-pending-meta {
  padding: 12px 14px 10px;
  background: var(--ol-bg-subtle);
  border-bottom: 1px solid var(--ol-border);
}
.ol-pending-title-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.ol-pending-drag {
  color: var(--ol-muted);
  font-size: 0.9rem;
  line-height: 1.2;
  user-select: none;
  cursor: grab;
}
.ol-pending-card small {
  display: block;
  color: var(--ol-muted);
  margin: 4px 0 8px;
}
.ol-pending-cands { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ol-pending-body {
  padding: 10px 12px 12px;
  background: var(--ol-bg);
  min-height: 180px;
}
.ol-pending-loading {
  font-size: 0.8rem;
  color: var(--ol-muted);
  padding: 12px 4px;
}
.ol-pending-frame {
  width: 100%;
  min-height: 280px;
  border: 1px solid var(--ol-border);
  border-radius: 2px;
  background: #fff;
}
.ol-ticket-row.ol-drop-ready {
  outline: 1px dashed color-mix(in srgb, var(--ol-accent, #0078d4) 55%, transparent);
  outline-offset: -2px;
}
.ol-ticket-row.ol-drag-over {
  outline: 2px solid var(--ol-accent, #0078d4);
  outline-offset: -2px;
  background: color-mix(in srgb, var(--ol-accent, #0078d4) 12%, var(--ol-bg));
}

/* Settings */
.ol-settings {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow: auto;
  height: 100%;
  box-sizing: border-box;
  background: var(--ol-bg-subtle);
}
.ol-settings .ol-card { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); }
.ol-settings .ol-mfg-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid var(--ol-border);
}
.ol-settings .ol-mfg-row small { display: block; color: var(--ol-muted); }
.ol-mfg-add { display: flex; flex-wrap: wrap; gap: 6px; }
.ol-mfg-add input {
  flex: 1;
  min-width: 120px;
  height: 28px;
  border: 1px solid var(--ol-border-strong);
  border-radius: 2px;
  padding: 0 8px;
  font-family: inherit;
  background: #fff;
  color: var(--ol-text);
}

/* Shared Fluent buttons inside Outlook */
.ol-host .w11-btn,
.ol-compose-host .w11-btn,
.ol-compose-actions .w11-btn {
  font-family: inherit;
}
.ol-muted { color: var(--ol-muted); }

/* (Outlook Dark-Mode-Toggle entfernt ? Farben ?ber Personalisierung) */

/* Dark mode surface overrides (legacy, unused without .ol-dark) */
.ol-host.ol-dark,
.ol-host.ol-dark .ol-app,
.ol-host.ol-dark .ol-main,
.ol-host.ol-dark .ol-body,
.ol-host.ol-dark .ol-pane,
.ol-host.ol-dark .ol-shell,
.ol-app.ol-dark {
  background: var(--ol-bg) !important;
  color: var(--ol-text) !important;
}
.ol-host.ol-dark .ol-nav,
.ol-host.ol-dark .ol-ribbon,
.ol-host.ol-dark .ol-toolbar,
.ol-host.ol-dark .ol-folder-pane,
.ol-host.ol-dark .ol-account-head,
.ol-host.ol-dark .ol-msg-pane,
.ol-host.ol-dark .ol-msg-pane-h,
.ol-host.ol-dark .ol-msg-list,
.ol-host.ol-dark .ol-msg-row,
.ol-host.ol-dark .ol-reading-pane,
.ol-host.ol-dark .ol-reading,
.ol-host.ol-dark .ol-reading-head,
.ol-host.ol-dark .ol-atts,
.ol-host.ol-dark .ol-tickets,
.ol-host.ol-dark .ol-ticket-side,
.ol-host.ol-dark .ol-ticket-side-h,
.ol-host.ol-dark .ol-ticket-list,
.ol-host.ol-dark .ol-ticket-main,
.ol-host.ol-dark .ol-ticket-row,
.ol-host.ol-dark .ol-card,
.ol-host.ol-dark .ol-settings,
.ol-host.ol-dark .ol-rbtn,
.ol-host.ol-dark .win-app-status,
.ol-compose-host.ol-dark .ol-compose-ribbon,
.ol-compose-host.ol-dark .ol-compose-atts,
.ol-compose-host.ol-dark .ol-compose-fields,
.ol-compose-host.ol-dark .ol-drop-hint {
  background: var(--ol-bg-subtle) !important;
  color: var(--ol-text) !important;
  border-color: var(--ol-border) !important;
}
.ol-compose-host.ol-dark .ol-fmt-select {
  background: #2d2d30 !important;
  color: #f3f2f1 !important;
  border-color: #3f3f46 !important;
}
.ol-compose-host.ol-dark .ol-fmt-pop {
  background: #252526;
  border-color: #3f3f46;
  color: #f3f2f1;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.ol-compose-host.ol-dark .ol-fmt-pop-title { color: #c8c6c4; }
.ol-compose-host.ol-dark .ol-fmt-sep,
.ol-compose-host.ol-dark .ol-ribbon-sep {
  background: #3f3f46;
}
.ol-host.ol-dark .ol-msg-row,
.ol-host.ol-dark .ol-reading,
.ol-host.ol-dark .ol-reading-pane,
.ol-host.ol-dark .ol-ticket-list,
.ol-host.ol-dark .ol-preview-frame,
.ol-compose-host.ol-dark,
.ol-compose-host.ol-dark .ol-compose-win,
.ol-compose-host.ol-dark .ol-rbtn {
  background: var(--ol-bg) !important;
  color: var(--ol-text) !important;
}
.ol-compose-host.ol-dark .ol-compose-editor {
  background: #ffffff !important;
  color: #242424 !important;
}
.ol-host.ol-dark .ol-msg-row.selected,
.ol-host.ol-dark .ol-msg.selected {
  background: var(--ol-sel-msg) !important;
  box-shadow: inset 3px 0 0 var(--ol-accent);
}
.ol-host.ol-dark .ol-msg-row.selected:hover,
.ol-host.ol-dark .ol-msg.selected:hover {
  background: color-mix(in srgb, var(--w11-highlight) 82%, var(--w11-text)) !important;
}
.ol-host.ol-dark .ol-msg-row:hover:not(.selected),
.ol-host.ol-dark .ol-msg:hover:not(.selected) {
  background: var(--ol-bg-hover) !important;
}
.ol-host.ol-dark .ol-rbtn.primary,
.ol-compose-host.ol-dark .ol-rbtn.primary {
  background: var(--ol-accent) !important;
  color: #fff !important;
}
.ol-host.ol-dark .ol-msg-row:hover:not(.selected),
.ol-host.ol-dark .ol-ticket-row:hover:not(.selected),
.ol-host.ol-dark .ol-tree-row:hover,
.ol-host.ol-dark .ol-rbtn:hover {
  background: var(--ol-bg-hover) !important;
}
.ol-host.ol-dark .ol-msg-del:hover {
  background: #4a1c1f !important;
  color: #f1707b !important;
}
.ol-host.ol-dark .ol-compose-fields input,
.ol-compose-host.ol-dark .ol-compose-fields input,
.ol-host.ol-dark .ol-compose-fields label span,
.ol-compose-host.ol-dark .ol-compose-fields label span {
  color: var(--ol-text) !important;
}
.ol-host.ol-dark .ol-compose-fields .ol-addr-wrap input:hover,
.ol-compose-host.ol-dark .ol-compose-fields .ol-addr-wrap input:hover,
.ol-host.ol-dark .ol-compose-fields #ol-cw-subj:hover,
.ol-compose-host.ol-dark .ol-compose-fields #ol-cw-subj:hover,
.ol-host.ol-dark .ol-compose-fields .ol-addr-wrap input:focus,
.ol-compose-host.ol-dark .ol-compose-fields .ol-addr-wrap input:focus,
.ol-host.ol-dark .ol-compose-fields #ol-cw-subj:focus,
.ol-compose-host.ol-dark .ol-compose-fields #ol-cw-subj:focus {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.ol-host.ol-dark .ol-nav-btn.active {
  color: var(--ol-accent) !important;
}

/* Dark scrollbars in Outlook (inkl. Listen/Panes ? schl?gt Desktop-Hell-Scrollbar) */
body.w11-desktop-mode .ol-host.ol-dark,
body.w11-desktop-mode .ol-host.ol-dark *,
body.w11-desktop-mode .ol-compose-host.ol-dark,
body.w11-desktop-mode .ol-compose-host.ol-dark *,
.ol-host.ol-dark,
.ol-host.ol-dark *,
.ol-compose-host.ol-dark,
.ol-compose-host.ol-dark * {
  scrollbar-width: thin !important;
  scrollbar-color: #6e6e6e #1f1f1f !important;
  color-scheme: dark;
}
body.w11-desktop-mode .ol-host.ol-dark *::-webkit-scrollbar,
body.w11-desktop-mode .ol-compose-host.ol-dark *::-webkit-scrollbar,
.ol-host.ol-dark *::-webkit-scrollbar,
.ol-compose-host.ol-dark *::-webkit-scrollbar,
.ol-host.ol-dark::-webkit-scrollbar,
.ol-compose-host.ol-dark::-webkit-scrollbar {
  width: 12px !important;
  height: 12px !important;
}
body.w11-desktop-mode .ol-host.ol-dark *::-webkit-scrollbar-track,
body.w11-desktop-mode .ol-compose-host.ol-dark *::-webkit-scrollbar-track,
.ol-host.ol-dark *::-webkit-scrollbar-track,
.ol-compose-host.ol-dark *::-webkit-scrollbar-track,
.ol-host.ol-dark::-webkit-scrollbar-track,
.ol-compose-host.ol-dark::-webkit-scrollbar-track {
  background: #1f1f1f !important;
  border-radius: 0 !important;
}
body.w11-desktop-mode .ol-host.ol-dark *::-webkit-scrollbar-thumb,
body.w11-desktop-mode .ol-compose-host.ol-dark *::-webkit-scrollbar-thumb,
.ol-host.ol-dark *::-webkit-scrollbar-thumb,
.ol-compose-host.ol-dark *::-webkit-scrollbar-thumb,
.ol-host.ol-dark::-webkit-scrollbar-thumb,
.ol-compose-host.ol-dark::-webkit-scrollbar-thumb {
  background-color: #5a5a5a !important;
  border-radius: 6px !important;
  border: 3px solid #1f1f1f !important;
  background-clip: padding-box !important;
}
body.w11-desktop-mode .ol-host.ol-dark *::-webkit-scrollbar-thumb:hover,
body.w11-desktop-mode .ol-compose-host.ol-dark *::-webkit-scrollbar-thumb:hover,
.ol-host.ol-dark *::-webkit-scrollbar-thumb:hover,
.ol-compose-host.ol-dark *::-webkit-scrollbar-thumb:hover {
  background-color: #7a7a7a !important;
}
body.w11-desktop-mode .ol-host.ol-dark *::-webkit-scrollbar-corner,
body.w11-desktop-mode .ol-compose-host.ol-dark *::-webkit-scrollbar-corner,
.ol-host.ol-dark *::-webkit-scrollbar-corner,
.ol-compose-host.ol-dark *::-webkit-scrollbar-corner {
  background: #1f1f1f !important;
}
/* iframe-Rahmen selbst (Scroll oft im Dokument ? Styles kommen aus previewFrameStyles) */
.ol-host.ol-dark .ol-preview-frame,
.ol-host.ol-dark .ol-tev-frame,
.ol-host.ol-dark .ol-reading-frame {
  color-scheme: light;
  background: #ffffff;
}
/* Lesebereich bleibt helles Briefpapier auch bei dunklem Desktop */
.ol-host.ol-dark .ol-reading-pane .ol-preview-frame,
.ol-host.ol-dark .ol-reading > .ol-preview-frame,
.ol-host.ol-dark .ol-tev-frame,
body.w11-desktop-mode .ol-host.ol-dark .ol-reading-pane .ol-preview-frame,
body.w11-desktop-mode .ol-host.ol-dark .ol-tev-frame {
  color-scheme: light !important;
  background: #ffffff !important;
}

/* Tickets dark mode ? detail / thread / forms */
.ol-host.ol-dark .ol-tdetail,
.ol-host.ol-dark .ol-tdetail-grid,
.ol-host.ol-dark .ol-ticket-main,
.ol-host.ol-dark .ol-thread,
.ol-host.ol-dark .ol-tev,
.ol-host.ol-dark .ol-tev-body,
.ol-host.ol-dark .ol-pending-list,
.ol-host.ol-dark .ol-pending-card {
  background: var(--ol-bg) !important;
  color: var(--ol-text) !important;
  border-color: var(--ol-border) !important;
}
.ol-host.ol-dark .ol-pending-meta {
  background: var(--ol-bg-subtle) !important;
}
.ol-host.ol-dark .ol-pending-frame {
  background: var(--ol-bg) !important;
  border-color: var(--ol-border) !important;
}
.ol-host.ol-dark .ol-tdetail-h,
.ol-host.ol-dark .ol-ttools,
.ol-host.ol-dark .ol-tev header,
.ol-host.ol-dark .ol-tev-h {
  background: var(--ol-bg-subtle) !important;
  color: var(--ol-text) !important;
  border-color: var(--ol-border) !important;
}
.ol-host.ol-dark .ol-tdetail-h h3,
.ol-host.ol-dark .ol-tdetail-h small,
.ol-host.ol-dark .ol-tev header strong,
.ol-host.ol-dark .ol-tev-who,
.ol-host.ol-dark .ol-card strong,
.ol-host.ol-dark .ol-check,
.ol-host.ol-dark .ol-empty {
  color: var(--ol-text) !important;
}
.ol-host.ol-dark .ol-tdetail-h small,
.ol-host.ol-dark .ol-tdetail-controls label,
.ol-host.ol-dark .ol-tev header,
.ol-host.ol-dark .ol-tev-h,
.ol-host.ol-dark .ol-muted {
  color: var(--ol-muted) !important;
}
.ol-host.ol-dark .ol-tev.outbound {
  background: #0c2d48 !important;
  border-color: #0e4a6e !important;
}
.ol-host.ol-dark .ol-tev-body,
.ol-host.ol-dark .ol-tev-frame {
  background: var(--ol-bg) !important;
  border-color: var(--ol-border) !important;
}
.ol-host.ol-dark .ol-tev-body a { color: var(--ol-accent) !important; }
.ol-host.ol-dark .ol-tdetail-controls select,
.ol-host.ol-dark .ol-tdetail-controls input[type="range"],
.ol-host.ol-dark .ol-card textarea,
.ol-host.ol-dark .ol-card input,
.ol-host.ol-dark .ol-settings input,
.ol-host.ol-dark .ol-settings textarea {
  background: var(--ol-bg) !important;
  color: var(--ol-text) !important;
  border-color: var(--ol-border-strong) !important;
}
.ol-host.ol-dark .ol-compose-editor,
.ol-host.ol-dark .ol-ticket-reply-ed,
.ol-host.ol-dark .ol-sig-editor,
.ol-host.ol-dark .ol-note-editor {
  background: #ffffff !important;
  color: #242424 !important;
  border-color: var(--ol-border-strong) !important;
}
.ol-host.ol-dark .ol-tdetail-controls select option {
  background: #252526;
  color: #f3f2f1;
}
.ol-host.ol-dark .ol-card {
  background: var(--ol-bg) !important;
  color: var(--ol-text) !important;
  border-color: var(--ol-border) !important;
}
.ol-host.ol-dark .win-app-btn {
  background: var(--ol-bg-hover) !important;
  color: var(--ol-text) !important;
  border-color: var(--ol-border-strong) !important;
}
.ol-host.ol-dark .win-app-btn.primary {
  background: var(--ol-accent) !important;
  color: #fff !important;
  border-color: var(--ol-accent) !important;
}
.ol-host.ol-dark .ol-ticket-row.selected {
  background: var(--ol-sel-msg) !important;
}
.ol-host.ol-dark .ol-ticket-row.multi-sel:not(.selected) {
  background: rgba(0, 120, 212, 0.22) !important;
}
.ol-host.ol-dark .ol-ticket-tnum {
  background: #3f3f46 !important;
  color: #f3f2f1 !important;
}
.ol-host.ol-dark .ol-multi-ticket-h {
  background: var(--ol-bg-subtle) !important;
  color: var(--ol-text) !important;
  border-color: var(--ol-border) !important;
}
.ol-host.ol-dark .ol-pending-banner {
  background: color-mix(in srgb, #43380a 88%, var(--ol-bg-subtle)) !important;
  color: #f0e6b8 !important;
  border-color: #6b5a12 !important;
}
.ol-host.ol-dark .ol-pending-banner.is-active {
  background: color-mix(in srgb, #43380a 65%, var(--ol-accent, #0078d4)) !important;
}

@media (max-width: 900px) {
  .ol-mail,
  .ol-mail.ol-mail-3pane { grid-template-columns: 1fr; }
  .ol-nav { width: 40px; }
}

/* Dynamisches Outlook-Layout bezogen auf Fensterbreite (nicht Viewport) */
@container ol (max-width: 1100px) {
  .ol-ribbon {
    flex-wrap: wrap;
    row-gap: 4px;
    min-height: 0;
  }
  .ol-ribbon-search {
    width: 480px;
    min-width: 480px;
    max-width: 480px;
    flex: 0 0 480px;
    margin-left: auto;
    justify-content: flex-end;
  }
  .ol-rbtn span {
    font-size: 0.68rem;
  }
}
@container ol (max-width: 900px) {
  .ol-tickets {
    grid-template-columns: minmax(180px, 220px) 1fr;
  }
  .ol-tdetail-grid {
    grid-template-columns: 1fr;
  }
  .ol-ttools {
    max-height: 42%;
    overflow: auto;
  }
  .ol-nav {
    width: 44px;
  }
  .ol-nav-btn span {
    font-size: 0.58rem;
  }
  .ol-folder-pane,
  .ol-msg-pane {
    min-width: 120px;
  }
  .ol-reading-pane {
    min-width: 140px;
  }
}
@container ol (max-width: 760px) {
  .ol-rbtn span {
    display: none;
  }
  .ol-rbtn {
    min-width: 36px;
    padding: 4px 6px;
  }
  .ol-ribbon input[type="search"] {
    min-width: 100px;
  }
  .ol-tickets {
    grid-template-columns: 1fr;
  }
  .ol-ticket-side {
    max-height: 36%;
    border-right: 0;
    border-bottom: 1px solid var(--ol-border);
  }
}

/* ?? Outlook settings popup ?? */
.ol-settings-host,
.ol-calendar-host,
.ol-notes-host {
  height: 100%;
  min-height: 0;
}
.w11-window[data-app-id="outlook-settings"] .w11-titlebar,
.w11-window[data-app-id="outlook-settings"].focused .w11-titlebar {
  background: var(--w11-titlebar) !important;
  color: var(--w11-title-color, var(--w11-text)) !important;
  border-bottom: 1px solid var(--w11-stroke) !important;
}
.w11-window[data-app-id="outlook-settings"].focused .w11-titlebar {
  background: var(--w11-titlebar-focus) !important;
}
.w11-window[data-app-id="outlook-settings"] .w11-win-body {
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.ol-settings-win,
.ol-cal-app,
.ol-notes-app,
.ol-contacts-app {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--ol-bg, var(--w11-win-body));
  color: var(--ol-text, var(--w11-text));
}
.ol-settings-tabs {
  display: flex;
  gap: 0;
  flex-shrink: 0;
  border-bottom: 1px solid var(--ol-border, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-win-body) 88%, var(--w11-text));
  padding: 0 8px;
}
.ol-stab {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 10px 14px;
  font: inherit;
  font-size: 0.82rem;
  color: var(--ol-muted, var(--w11-muted));
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.ol-stab:hover { color: var(--ol-text, var(--w11-text)); }
.ol-stab.active {
  color: var(--ol-accent, var(--w11-accent));
  border-bottom-color: var(--ol-accent, var(--w11-accent));
  font-weight: 600;
}
.ol-settings-panels {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  padding: 12px 14px 14px;
  background: var(--ol-bg, var(--w11-win-body));
}
.ol-apw-studio .ol-apw-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-window-bg);
  padding: 6px;
  min-height: 180px;
  max-height: min(52vh, 420px);
  overflow: auto;
}
.ol-apw-row {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 4px;
  color: var(--w11-text);
  border: 1px solid transparent;
}
.ol-apw-row:not(.is-editing):hover,
.ol-apw-row:not(.is-editing):focus {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 28%, transparent);
  outline: none;
}
.ol-apw-row.is-editing {
  background: color-mix(in srgb, var(--w11-highlight) 16%, var(--w11-window-bg));
  border-color: var(--w11-stroke);
}
.ol-apw-label-view,
.ol-apw-pwd-view {
  font-size: 0.88rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-apw-pwd-view {
  color: var(--w11-muted);
  letter-spacing: 0.12em;
  font-family: ui-monospace, Consolas, monospace;
}
.ol-apw-row input.ol-apw-label,
.ol-apw-row input.ol-apw-pwd {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  padding: 6px 8px;
  font: inherit;
  font-size: 0.88rem;
}
.ol-apw-row input.ol-apw-label:focus,
.ol-apw-row input.ol-apw-pwd:focus {
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 55%, transparent);
  border-color: var(--w11-accent);
}
.ol-apw-empty {
  padding: 28px 12px;
  text-align: center;
}
.ol-spane:not([hidden]) {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.ol-set-card {
  max-width: none;
  height: 100%;
  box-sizing: border-box;
  border: 1px solid var(--ol-border, var(--w11-stroke));
  border-radius: 10px;
  background: color-mix(in srgb, var(--w11-win-body) 94%, var(--w11-text));
  padding: 12px 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}
.ol-set-card-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
}
.ol-set-card-h strong {
  display: block;
  font-size: 0.95rem;
  color: var(--ol-text, var(--w11-text));
}
.ol-set-card-h .muted,
.ol-set-card .muted {
  margin: 4px 0 0;
  color: var(--ol-muted, var(--w11-muted));
  font-size: 0.8rem;
}
.ol-sig-studio {
  gap: 8px;
}
.ol-sig-fmt-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px;
  padding: 4px 6px;
  border: 1px solid var(--ol-border, var(--w11-stroke));
  border-radius: 8px;
  background: var(--ol-bg, var(--w11-win-body));
  flex-shrink: 0;
}
.ol-sig-fmt-bar .ol-ribbon-sep { display: none; }
.ol-sig-editor {
  flex: 1 1 auto;
  min-height: 120px;
  max-height: none;
  overflow: auto;
  border: 1px solid var(--ol-border-strong, var(--w11-win-border));
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--ol-bg, var(--w11-win-body));
  color: var(--ol-text, var(--w11-text));
  outline: none;
}
.ol-sig-editor:focus {
  border-color: var(--ol-accent, var(--w11-accent));
  box-shadow: 0 0 0 1px var(--ol-accent, var(--w11-accent));
}
.ol-sig-preview-wrap {
  border: 1px solid var(--ol-border, var(--w11-stroke));
  border-radius: 8px;
  overflow: hidden;
  background: var(--ol-bg, var(--w11-win-body));
  flex-shrink: 0;
}
.ol-sig-preview-label {
  padding: 5px 10px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ol-muted, var(--w11-muted));
  border-bottom: 1px solid var(--ol-border, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-win-body) 88%, var(--w11-text));
}
.ol-sig-preview {
  width: 100%;
  height: 120px;
  border: 0;
  background: var(--ol-bg, var(--w11-win-body));
}
.ol-sig-hint { margin: 0; }
.ol-init-grid {
  display: grid;
  grid-template-columns: minmax(120px, 180px) 1fr 1fr;
  gap: 14px;
  align-items: start;
}
.ol-set-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ol-set-field > span {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--ol-muted, var(--w11-muted));
}
.ol-set-field input {
  height: 32px;
  border: 1px solid var(--ol-border-strong, var(--w11-win-border));
  border-radius: 6px;
  padding: 0 10px;
  background: var(--ol-bg, var(--w11-win-body));
  color: var(--ol-text, var(--w11-text));
  font: inherit;
}
.ol-set-field select {
  height: 32px;
  border: 1px solid var(--ol-border-strong, var(--w11-win-border));
  border-radius: 6px;
  padding: 0 10px;
  background: var(--ol-bg, var(--w11-win-body));
  color: var(--ol-text, var(--w11-text));
  font: inherit;
}
.ol-ai-set-grid {
  display: grid;
  grid-template-columns: minmax(160px, 220px) minmax(200px, 1fr);
  gap: 14px;
  align-items: start;
}
.ol-ai-settings-card .ol-ai-websearch {
  opacity: 0.92;
}
.ol-ai-settings-card .ol-ai-websearch input:disabled {
  opacity: 1;
  accent-color: var(--ol-accent, var(--w11-accent));
}
.ol-host.ol-dark .ol-set-field select {
  background: var(--ol-bg, var(--w11-win-body));
  color: var(--ol-text, var(--w11-text));
}
.ol-sla-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}
.ol-sla-day-list {
  margin-top: 4px;
  min-height: 120px;
  max-height: 200px;
  overflow: auto;
  border: 1px solid var(--ol-border-strong, var(--w11-stroke));
  border-radius: 6px;
  background: var(--ol-bg, var(--w11-window-bg));
  padding: 4px;
  outline: none;
}
.ol-sla-day-list:focus {
  border-color: var(--ol-accent, var(--w11-accent));
  box-shadow: 0 0 0 1px var(--ol-accent, var(--w11-accent));
}
.ol-sla-day-row {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--ol-text, var(--w11-text));
  font: inherit;
  font-size: 0.84rem;
  padding: 7px 10px;
  border-radius: 4px;
  cursor: pointer;
}
.ol-sla-day-row:hover {
  background: color-mix(in srgb, var(--ol-accent, var(--w11-accent)) 14%, transparent);
}
.ol-sla-day-row.selected {
  background: var(--ol-sel-msg, color-mix(in srgb, var(--ol-accent, var(--w11-accent)) 22%, transparent));
  color: var(--ol-text, var(--w11-text));
}
.ol-sla-day-empty {
  padding: 14px 10px;
  font-size: 0.8rem;
}
.ol-sla-card .ol-set-hint { margin-top: 4px; }
.ol-init-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ol-init-swatch {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  padding: 0;
}
.ol-init-swatch.selected {
  border-color: var(--ol-accent, var(--w11-accent));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ol-accent, var(--w11-accent)) 35%, transparent);
}
.ol-init-preview {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px dashed var(--ol-border, var(--w11-stroke));
  background: var(--ol-bg, var(--w11-win-body));
}
.ol-init-sample {
  font-weight: 700;
  font-size: 1.05rem;
  font-family: Consolas, "Courier New", monospace;
}
.ol-init-sample-text {
  font-size: 0.85rem;
}
.ol-cal-acct-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.ol-cal-acct {
  border: 1px solid var(--ol-border, var(--w11-stroke));
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--ol-bg, var(--w11-win-body));
}
.ol-cal-acct-h {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 8px;
}
.ol-cal-acct-h small { color: var(--ol-muted, var(--w11-muted)); }
.ol-cal-pick-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
}
.ol-cal-pick {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.86rem;
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 6px;
}
.ol-cal-pick:hover {
  background: color-mix(in srgb, var(--w11-win-body) 82%, var(--w11-text));
}
.ol-cal-pick-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.ol-cal-tag {
  font-style: normal;
  font-size: 0.7rem;
  color: var(--ol-muted, var(--w11-muted));
  margin-left: 6px;
}
.ol-cal-tag.shared { color: var(--ol-accent, var(--w11-accent)); }
.ol-cal-swatch {
  width: 12px;
  height: 12px;
  border-radius: 2px;
  flex-shrink: 0;
  border: 1px solid color-mix(in srgb, var(--w11-text) 18%, transparent);
}
.ol-mfg-grid {
  display: none;
}
.ol-mfg-studio {
  min-height: 0;
}
.ol-mfg-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-height: 0;
  overflow: auto;
  border: 1px solid var(--ol-border, var(--w11-stroke));
  border-radius: 8px;
  background: var(--ol-bg, var(--w11-win-body));
  padding: 4px;
}
.ol-mfg-row {
  display: grid;
  grid-template-columns: 36px minmax(120px, 1.1fr) minmax(140px, 1.2fr) minmax(100px, 1fr) 36px;
  gap: 8px;
  align-items: center;
  padding: 6px 8px;
  border-radius: 6px;
  transition: background 0.12s ease;
}
.ol-mfg-row:hover {
  background: color-mix(in srgb, var(--ol-accent, var(--w11-accent)) 8%, transparent);
}
.ol-mfg-row-new {
  border-top: 1px dashed var(--ol-border, var(--w11-stroke));
  margin-top: 2px;
  opacity: 0.92;
}
.ol-mfg-row-new:focus-within {
  opacity: 1;
  background: color-mix(in srgb, var(--ol-accent, var(--w11-accent)) 10%, transparent);
}
.ol-mfg-letter {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  font-size: 0.78rem;
  font-weight: 700;
  color: #fff;
  background: var(--ol-accent, var(--w11-accent));
  flex-shrink: 0;
}
.ol-mfg-row-new .ol-mfg-letter {
  background: color-mix(in srgb, var(--ol-muted, var(--w11-muted)) 55%, transparent);
  color: var(--ol-text, var(--w11-text));
  font-size: 1rem;
  font-weight: 500;
}
.ol-mfg-row input {
  height: 30px;
  border: 1px solid transparent;
  border-radius: 5px;
  padding: 0 8px;
  background: transparent;
  color: var(--ol-text, var(--w11-text));
  font: inherit;
  font-size: 0.84rem;
  min-width: 0;
}
.ol-mfg-row input:hover,
.ol-mfg-row input:focus {
  border-color: var(--ol-border-strong, var(--w11-win-border));
  background: color-mix(in srgb, var(--w11-win-body) 92%, var(--w11-text));
  outline: none;
}
.ol-mfg-del {
  appearance: none;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--ol-muted, var(--w11-muted));
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
  opacity: 0;
}
.ol-mfg-row:hover .ol-mfg-del,
.ol-mfg-row:focus-within .ol-mfg-del {
  opacity: 1;
}
.ol-mfg-del:hover {
  background: color-mix(in srgb, #c42b1c 18%, transparent);
  color: #c42b1c;
}
.ol-mfg-hint {
  font-size: 0.7rem;
  color: var(--ol-muted, var(--w11-muted));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-mfg-card,
.ol-mfg-new {
  display: none;
}
@media (max-width: 720px) {
  .ol-init-grid,
  .ol-mfg-row {
    grid-template-columns: 1fr;
  }
  .ol-mfg-del,
  .ol-mfg-hint {
    opacity: 1;
    justify-self: start;
  }
}
.ol-spane .ol-card { max-width: 720px; }
/* Calendar / notes / contacts layout */
.ol-cal-body,
.ol-notes-body,
.ol-contacts-body {
  flex: 1;
  min-height: 0;
  display: flex;
}
.ol-cal-side {
  width: 248px;
  flex: 0 0 248px;
  min-width: 236px;
  flex-shrink: 0;
  border-right: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 0;
  background: var(--w11-win-body);
}
.ol-cal-splitter {
  flex: 0 0 5px;
  width: 5px;
  cursor: col-resize;
  position: relative;
  z-index: 5;
  background: transparent;
  border-left: 1px solid var(--w11-stroke);
  touch-action: none;
}
.ol-cal-splitter::after {
  content: "";
  position: absolute;
  inset: 0 -3px;
}
.ol-cal-splitter:hover,
.ol-cal-splitter.dragging {
  background: color-mix(in srgb, var(--w11-accent) 55%, transparent);
  border-left-color: var(--w11-accent);
}
body.ol-cal-splitting {
  cursor: col-resize !important;
  user-select: none !important;
}
.ol-cal-mini-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  position: relative;
  outline: none;
  border-bottom: 1px solid var(--ol-border, var(--w11-stroke));
  scrollbar-width: none;
}
.ol-cal-mini-scroll::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}
.ol-cal-mini-track {
  will-change: transform;
  padding: 0 10px;
}
.ol-cal-mini-fade {
  pointer-events: none;
  position: absolute;
  left: 0;
  right: 0;
  z-index: 4;
}
.ol-cal-mini-fade-top {
  top: 0;
  height: 56px;
  background: linear-gradient(
    to bottom,
    var(--w11-win-body) 0%,
    color-mix(in srgb, var(--w11-win-body) 75%, transparent) 40%,
    transparent 100%
  );
}
.ol-cal-mini-fade-bot {
  bottom: 0;
  height: 56px;
  background: linear-gradient(
    to top,
    var(--w11-win-body) 0%,
    color-mix(in srgb, var(--w11-win-body) 75%, transparent) 40%,
    transparent 100%
  );
}
.ol-mini-month {
  transition: opacity 320ms ease, filter 320ms ease, transform 320ms ease;
}
.ol-mini-month.fade-clear {
  opacity: 1;
  filter: none;
  transform: none;
}
.ol-mini-month.fade-focus .ol-mini-title {
  color: var(--w11-accent);
  font-weight: 700;
}
.ol-mini-month.fade-edge {
  pointer-events: none;
  user-select: none;
}
.ol-mini-month.fade-edge-top {
  opacity: 0.5;
  filter: blur(1.8px);
  transform: scale(0.985);
  transform-origin: top center;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.7) 75%, #000 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.7) 75%, #000 100%);
}
.ol-mini-month.fade-edge-bot {
  opacity: 0.5;
  filter: blur(1.8px);
  transform: scale(0.985);
  transform-origin: bottom center;
  -webkit-mask-image: linear-gradient(to top, transparent 0%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.7) 75%, #000 100%);
  mask-image: linear-gradient(to top, transparent 0%, rgba(0, 0, 0, 0.2) 35%, rgba(0, 0, 0, 0.7) 75%, #000 100%);
}
.ol-mini-month + .ol-mini-month {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--ol-border, var(--w11-stroke));
}
.ol-mini-month.fade-edge + .ol-mini-month.fade-clear,
.ol-mini-month.fade-clear + .ol-mini-month.fade-edge {
  border-top-color: color-mix(in srgb, var(--w11-stroke) 40%, transparent);
}
.ol-cal-list {
  flex: 0 0 auto;
  max-height: 132px;
  min-height: 72px;
  overflow: auto;
  padding: 8px 10px 10px;
  margin-top: 0;
  scrollbar-width: thin;
  border-top: 1px solid var(--ol-border, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body));
}
.ol-mini-grid.ol-mini-grid-kw {
  display: grid;
  grid-template-columns: 30px repeat(7, minmax(0, 1fr));
  gap: 2px;
  font-size: 0.7rem;
}
.ol-mini-kw-h,
.ol-mini-kw {
  text-align: center;
  color: var(--w11-muted);
  font-size: 0.62rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
}
.ol-mini-day.week-cur:not(.sel),
.ol-mini-kw.week-cur {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  color: var(--w11-text);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--w11-accent) 45%, transparent);
}
.ol-mini-kw.week-cur {
  color: var(--w11-accent);
  font-weight: 800;
  border-radius: 4px;
}
.ol-mini-day.week-cur {
  border-radius: 4px;
}
.ol-mini-day.sel {
  background: var(--w11-accent);
  color: #fff;
  box-shadow: none;
}
.ol-mini-day.today:not(.sel) {
  color: var(--w11-accent);
  font-weight: 800;
  box-shadow: inset 0 0 0 1.5px var(--w11-accent);
}
.ol-mini-day:hover:not(.sel) {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.ol-month-grid.ol-month-grid-kw {
  grid-template-columns: 36px repeat(7, 1fr);
}
.ol-month-kw-h,
.ol-month-kw {
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
  color: var(--w11-muted);
  font-size: 0.7rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ol-month-h {
  background: var(--w11-titlebar);
  color: var(--w11-muted);
}
.ol-month-cell {
  background: var(--w11-window-bg);
  color: var(--w11-text);
}
.ol-month-cell.out {
  background: color-mix(in srgb, var(--w11-win-body) 85%, var(--w11-text));
  color: var(--w11-muted);
}
.ol-month-ev {
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
  color: var(--w11-text);
}

/* Time grid week/day */
.ol-tg {
  display: flex;
  flex-direction: column;
  height: calc(100% - 42px);
  min-height: 420px;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  overflow: hidden;
  background: var(--w11-window-bg);
  color: var(--w11-text);
}
.ol-tg-head,
.ol-tg-allday {
  display: grid;
  grid-template-columns: 56px repeat(7, 1fr);
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.ol-tg[data-days="1"] .ol-tg-head,
.ol-tg[data-days="1"] .ol-tg-allday,
.ol-tg[data-days="1"] .ol-tg-scroll {
  grid-template-columns: 56px 1fr;
}
.ol-tg-scroll {
  display: grid;
  grid-template-columns: 56px 1fr;
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: var(--w11-win-body);
}
.ol-tg-corner,
.ol-tg-allday-label {
  border-right: 1px solid var(--w11-stroke);
  font-size: 0.68rem;
  color: var(--w11-muted);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 4px;
}
.ol-tg-dayhead {
  padding: 8px 6px;
  text-align: center;
  border-right: 1px solid var(--w11-stroke);
  cursor: pointer;
}
.ol-tg-dayhead.today strong { color: var(--w11-accent); }
.ol-tg-daynum {
  display: inline-flex;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  font-weight: 700;
}
.ol-tg-daynum.today {
  background: var(--w11-accent);
  color: #fff;
}
.ol-tg-allday-cell {
  min-height: 34px;
  padding: 4px;
  border-right: 1px solid var(--w11-stroke);
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.ol-tg-allday-ev {
  appearance: none;
  border: 0;
  border-left: 3px solid var(--ev-color, var(--w11-accent));
  background: color-mix(in srgb, var(--ev-color, var(--w11-accent)) 18%, var(--w11-window-bg));
  color: var(--w11-text);
  border-radius: 3px;
  font: inherit;
  font-size: 0.72rem;
  padding: 3px 6px;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-tg-times {
  border-right: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.ol-tg-hour {
  position: relative;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  box-sizing: border-box;
}
.ol-tg-hour span {
  position: absolute;
  top: -0.55em;
  right: 6px;
  font-size: 0.68rem;
  color: var(--w11-muted);
}
.ol-tg-cols {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  min-height: calc(24 * 52px);
}
.ol-tg[data-days="1"] .ol-tg-cols { grid-template-columns: 1fr; }
.ol-tg-event.ol-tg-ghost {
  pointer-events: none;
  z-index: 6;
  opacity: 0.92;
  border-style: dashed;
  background: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-window-bg));
  box-shadow: 0 6px 18px color-mix(in srgb, var(--w11-accent) 30%, transparent);
  animation: ol-cal-ghost-in 140ms ease-out;
}
@keyframes ol-cal-ghost-in {
  from { opacity: 0.4; transform: scaleY(0.92); }
  to { opacity: 0.92; transform: scaleY(1); }
}
.ol-tg-col {
  position: relative;
  border-right: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
}
.ol-tg-dayhead.week-cur {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-titlebar));
}
.ol-tg-col.today {
  background: color-mix(in srgb, var(--w11-accent) 6%, var(--w11-window-bg));
  box-shadow: inset 0 3px 0 var(--w11-accent);
}
.ol-tg-gridlines {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.ol-tg-line {
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  box-sizing: border-box;
}
.ol-tg-events { position: absolute; inset: 0; }
.ol-tg-event {
  position: absolute;
  z-index: 2;
  border-radius: 4px;
  border: 1px solid color-mix(in srgb, var(--ev-color, var(--w11-accent)) 55%, var(--w11-stroke));
  border-left: 3px solid var(--ev-color, var(--w11-accent));
  background: color-mix(in srgb, var(--ev-color, var(--w11-accent)) 22%, var(--w11-window-bg));
  color: var(--w11-text);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--w11-text) 12%, transparent);
  overflow: hidden;
  cursor: grab;
  transition: box-shadow 160ms ease, transform 180ms ease, left 220ms cubic-bezier(.22,.61,.36,1);
  user-select: none;
}
.ol-tg-event:hover {
  box-shadow: 0 4px 14px color-mix(in srgb, var(--w11-text) 18%, transparent);
  z-index: 4;
}
.ol-tg-event.dragging,
.ol-tg-event.resizing {
  cursor: grabbing;
  opacity: 0.94;
  pointer-events: none;
  box-shadow: 0 10px 28px color-mix(in srgb, var(--w11-accent) 35%, transparent);
  z-index: 8;
}
.ol-tg-event.ol-tg-day-hop {
  animation: ol-cal-hop 280ms cubic-bezier(.22,.61,.36,1);
}
@keyframes ol-cal-hop {
  0% { transform: scale(0.96); }
  50% { transform: scale(1.03); }
  100% { transform: scale(1); }
}
.ol-tg-event-body {
  padding: 8px 6px 10px;
  font-size: 0.72rem;
  line-height: 1.25;
  pointer-events: none;
}
.ol-tg-event-body strong {
  display: block;
  font-size: 0.78rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-tg-event-body span,
.ol-tg-event-body em {
  display: block;
  color: var(--w11-muted);
  font-style: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-tg-resize {
  position: absolute;
  left: 0;
  right: 0;
  height: 10px;
  z-index: 3;
  pointer-events: auto;
}
.ol-tg-resize-n {
  top: 0;
  cursor: n-resize;
  background: linear-gradient(color-mix(in srgb, var(--ev-color, var(--w11-accent)) 40%, transparent), transparent);
  border-radius: 4px 4px 0 0;
}
.ol-tg-resize-s {
  bottom: 0;
  cursor: s-resize;
  background: linear-gradient(transparent, color-mix(in srgb, var(--ev-color, var(--w11-accent)) 40%, transparent));
  border-radius: 0 0 4px 4px;
}

/* Event editor */
.ol-ev-edit {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.ol-ev-edit-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.ol-ev-edit-body {
  flex: 1;
  overflow: auto;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ol-ev-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.8rem;
  color: var(--w11-muted);
}
.ol-ev-field input,
.ol-ev-field textarea {
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 8px 10px;
  font: inherit;
  font-size: 0.92rem;
}
.ol-ev-field input:focus,
.ol-ev-field textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 55%, transparent);
  border-color: var(--w11-accent);
}
.ol-ev-times {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.ol-ev-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  color: var(--w11-text);
}
.ol-ev-body-field textarea { min-height: 160px; resize: vertical; }
.ol-event-edit-host,
.ol-calendar-host { height: 100%; }
.ol-cal-main,
.ol-notes-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: 10px 12px;
}
.ol-cal-list { margin-top: 0; }
.ol-cal-list > strong {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ol-muted);
  margin-bottom: 8px;
}
.ol-mini-title {
  font-weight: 600;
  font-size: 0.85rem;
  margin-bottom: 6px;
}
.ol-mini-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  font-size: 0.7rem;
}
.ol-mini-h {
  text-align: center;
  color: var(--ol-muted);
  padding: 2px 0;
}
.ol-mini-day {
  appearance: none;
  border: 0;
  background: transparent;
  border-radius: 4px;
  aspect-ratio: 1;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.ol-mini-day.out { opacity: 0.35; }
.ol-mini-day.today { font-weight: 700; color: var(--ol-accent); }
.ol-mini-day.sel { background: var(--ol-accent); color: #fff; }
.ol-mini-day:hover:not(.sel) { background: var(--ol-bg-hover, #f3f2f1); }
.ol-cal-head h2 {
  margin: 0 0 10px;
  font-size: 1.15rem;
  font-weight: 600;
}
.ol-month-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  background: var(--ol-border);
  border: 1px solid var(--ol-border);
  min-height: 420px;
}
.ol-month-h {
  background: #f3f2f1;
  text-align: center;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 6px 4px;
  color: var(--ol-muted);
}
.ol-month-cell {
  appearance: none;
  border: 0;
  background: #fff;
  text-align: left;
  padding: 4px;
  min-height: 72px;
  cursor: pointer;
  font: inherit;
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: stretch;
}
.ol-month-cell.out { background: #faf9f8; color: #a19f9d; }
.ol-month-cell.today .ol-month-num {
  background: var(--ol-accent);
  color: #fff;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ol-month-cell.sel { outline: 2px solid var(--ol-accent); outline-offset: -2px; }
.ol-month-num { font-size: 0.78rem; font-weight: 600; }
.ol-month-ev {
  font-size: 0.68rem;
  background: #deecf9;
  color: #004578;
  border-radius: 2px;
  padding: 1px 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-month-more { font-size: 0.65rem; color: var(--ol-muted); }
.ol-week-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  min-height: 360px;
}
.ol-week-col {
  border: 1px solid var(--ol-border);
  border-radius: 4px;
  background: #fff;
  min-height: 280px;
  display: flex;
  flex-direction: column;
}
.ol-week-col.today { border-color: var(--ol-accent); }
.ol-week-day {
  appearance: none;
  border: 0;
  border-bottom: 1px solid var(--ol-border);
  background: #faf9f8;
  padding: 8px;
  font: inherit;
  font-weight: 600;
  font-size: 0.8rem;
  cursor: pointer;
  text-align: left;
}
.ol-week-evs {
  flex: 1;
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow: auto;
}
.ol-ev {
  appearance: none;
  border: 0;
  background: #deecf9;
  color: #004578;
  border-radius: 3px;
  padding: 6px;
  text-align: left;
  font: inherit;
  font-size: 0.75rem;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ol-day-list { display: flex; flex-direction: column; gap: 10px; }
.ol-day-ev {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 12px;
  border: 1px solid var(--ol-border);
  border-radius: 4px;
  padding: 10px 12px;
  background: #fff;
}
.ol-day-time { font-size: 0.8rem; color: var(--ol-muted); font-weight: 600; }
.ol-day-body strong { display: block; margin-bottom: 4px; }
.ol-day-body small { color: var(--ol-muted); }
.ol-day-body p { margin: 6px 0 10px; font-size: 0.85rem; color: var(--ol-muted); }
.ol-rbtn.active { color: var(--ol-accent); background: #deecf9; }

/* ?? Notes ?? */
.ol-notes-list {
  width: 260px;
  flex-shrink: 0;
  border-right: 1px solid var(--ol-border);
  overflow: auto;
  background: #faf9f8;
}
.ol-note-item {
  appearance: none;
  border: 0;
  border-bottom: 1px solid var(--ol-border);
  background: transparent;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  cursor: pointer;
  font: inherit;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ol-note-item:hover { background: var(--ol-bg-hover, #f3f2f1); }
.ol-note-item.active {
  background: #deecf9;
  border-left: 3px solid var(--ol-accent);
}
.ol-note-item strong {
  font-size: 0.88rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-note-item small { color: var(--ol-muted); font-size: 0.72rem; }
.ol-note-item span {
  color: var(--ol-muted);
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-note-title {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--ol-border);
  font: inherit;
  font-size: 1.15rem;
  font-weight: 600;
  padding: 8px 4px 10px;
  margin-bottom: 8px;
  background: transparent;
  color: inherit;
}
.ol-note-title:focus { outline: none; border-bottom-color: var(--ol-accent); }
.ol-note-editor {
  min-height: 280px;
  flex: 1;
}
.ol-notes-main {
  display: flex;
  flex-direction: column;
}

.ol-host.ol-dark .ol-settings-tabs,
.ol-host.ol-dark .ol-cal-side,
.ol-host.ol-dark .ol-notes-list,
.ol-host.ol-dark .ol-month-h,
.ol-host.ol-dark .ol-week-day {
  background: #2b2b2b;
  border-color: #3b3b3b;
}
.ol-host.ol-dark .ol-month-cell,
.ol-host.ol-dark .ol-week-col,
.ol-host.ol-dark .ol-day-ev,
.ol-host.ol-dark .ol-month-grid {
  background: #1f1f1f;
  border-color: #3b3b3b;
  color: #f3f2f1;
}
.ol-host.ol-dark .ol-month-cell.out { background: #252525; }
.ol-host.ol-dark .ol-month-ev,
.ol-host.ol-dark .ol-ev,
.ol-host.ol-dark .ol-note-item.active,
.ol-host.ol-dark .ol-rbtn.active {
  background: #0c2d48;
  color: #9dc3e6;
}
.ol-host.ol-dark .ol-stab.active { color: #4cc2ff; border-bottom-color: #4cc2ff; }
.ol-host.ol-dark .ol-note-title { border-color: #3b3b3b; }

/* Category dialogs ? dark chrome must win over dlg-shell !important light defaults */
.w11-window.w11-dialog.ol-cat-dlg-win.ol-dark,
.w11-window.ol-cat-dlg-win.ol-dark {
  background: #1f1f1f !important;
  color: #f3f2f1 !important;
  border-color: #3f3f46 !important;
}
.w11-window.w11-dialog.ol-cat-dlg-win.ol-dark .w11-titlebar,
.w11-window.ol-cat-dlg-win.ol-dark .w11-titlebar,
.w11-window.w11-dialog.ol-cat-dlg-win.ol-dark.focused .w11-titlebar,
.w11-window.ol-cat-dlg-win.ol-dark:has(.dlg-shell) .w11-titlebar {
  background: #2b2b2b !important;
  border-bottom-color: #3f3f46 !important;
  color: #f3f2f1 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .w11-title,
.w11-window.ol-cat-dlg-win.ol-dark .w11-title-ico,
.w11-window.ol-cat-dlg-win.ol-dark .w11-win-btns button {
  color: #f3f2f1 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .w11-win-btns button:hover {
  background: rgba(255, 255, 255, 0.08) !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .w11-win-body,
.w11-window.ol-cat-dlg-win.ol-dark .w11-dialog-body {
  background: #1f1f1f !important;
  color: #f3f2f1 !important;
  overflow: hidden !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .dlg-shell,
.w11-window.ol-cat-dlg-win.ol-dark .dlg-form,
.w11-window.ol-cat-dlg-win.ol-dark .dlg-pad,
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-dlg,
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-dlg-host {
  background: #1f1f1f !important;
  color: #f3f2f1 !important;
  overflow: hidden !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-dlg-hint,
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-color-name,
.w11-window.ol-cat-dlg-win.ol-dark .muted {
  color: #a19f9d !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-field > span {
  color: #f3f2f1 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-field input[type="text"] {
  background: #2b2b2b !important;
  border-color: #5a5a5a !important;
  color: #f3f2f1 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-del-list {
  background: #252526 !important;
  border-color: #3f3f46 !important;
  overflow: hidden !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-del-row {
  color: #f3f2f1 !important;
  border-bottom-color: #3f3f46 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-del-name {
  color: #f3f2f1 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-del-row:hover {
  background: #2d2d30 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .ol-cat-del-row.selected {
  background: #0c4a6e !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .win-sheet-footer {
  background: #252526 !important;
  border-top-color: #3f3f46 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .win-sheet-btn {
  background: #2b2b2b !important;
  border-color: #5a5a5a !important;
  color: #f3f2f1 !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .win-sheet-btn:hover {
  background: #3a3a3c !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .win-sheet-btn.primary {
  background: #0078d4 !important;
  border-color: #0078d4 !important;
  color: #fff !important;
}
.w11-window.ol-cat-dlg-win.ol-dark .win-sheet-btn.danger {
  background: #c42b1c !important;
  border-color: #c42b1c !important;
  color: #fff !important;
}

/* No outer scrollbars on category dialogs (light + dark) */
.w11-window.ol-cat-dlg-win,
.w11-window.ol-cat-dlg-win .w11-win-body,
.w11-window.ol-cat-dlg-win .w11-dialog-body,
.w11-window.ol-cat-dlg-win .dlg-shell,
.w11-window.ol-cat-dlg-win .dlg-form,
.w11-window.ol-cat-dlg-win .dlg-pad,
.w11-window.ol-cat-dlg-win .ol-cat-dlg-host,
.w11-window.ol-cat-dlg-win .ol-cat-dlg {
  overflow: hidden !important;
}

/* ?? Contacts + address book ?? */
.ol-contacts-list {
  width: 280px;
  flex-shrink: 0;
  border-right: 1px solid var(--ol-border, #edebe9);
  overflow: auto;
  background: #faf9f8;
}
.ol-contacts-main,
.ol-notes-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow: auto;
}
.ol-contact-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 10px 12px;
  cursor: pointer;
  font: inherit;
  border-bottom: 1px solid #f0f0f0;
  color: var(--ol-text, #242424);
}
.ol-contact-item:hover { background: var(--ol-bg-hover, #f3f2f1); }
.ol-contact-item.active {
  background: #deecf9;
  box-shadow: inset 3px 0 0 var(--ol-accent, #0078d4);
}
.ol-contact-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ol-contact-meta strong {
  font-size: 0.86rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-contact-meta small {
  font-size: 0.72rem;
  color: var(--ol-muted, #605e5c);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-ct-form { padding: 16px 20px 24px; max-width: 860px; }
.ol-ct-form h3 { margin: 0 0 14px; font-size: 1.1rem; }
.ol-ct-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
}
.ol-ct-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.8rem;
  color: var(--ol-muted);
}
.ol-ct-field > span { font-weight: 600; color: var(--ol-text); }
.ol-ct-field input,
.ol-ct-field textarea {
  height: 30px;
  border: 1px solid #8a8886;
  border-radius: 2px;
  padding: 4px 8px;
  font: inherit;
  background: #fff;
  color: var(--ol-text);
}
.ol-ct-field textarea { height: auto; min-height: 80px; resize: vertical; }
.ol-ct-field input:focus,
.ol-ct-field textarea:focus {
  outline: 1px solid #005a9e;
  border-color: #005a9e;
}
.ol-ct-notes { grid-column: 1 / -1; margin-top: 8px; }
.ol-compose-recip {
  display: grid !important;
  grid-template-columns: 48px 1fr;
  gap: 4px 10px;
  align-items: center;
  width: 100%;
  position: relative;
  z-index: 1;
}
/* Autocomplete ?ber Cc/Bcc/Betreff legen (sonst decken Folgezeilen die Liste ab) */
.ol-compose-recip:focus-within,
.ol-compose-recip.ol-addr-open {
  z-index: 120;
}
.ol-compose-subj {
  display: grid !important;
  grid-template-columns: 48px 1fr;
  gap: 4px 10px;
  align-items: center;
  width: 100%;
}
.ol-compose-subj-wrap {
  position: relative;
  min-width: 0;
  width: 100%;
  display: block;
}
.ol-compose-subj-wrap .ol-compose-subj-hint,
.ol-compose-subj-hint {
  position: absolute;
  left: 2px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
  padding: 0;
  border: 0;
  pointer-events: none;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  color: #e81123 !important;
  white-space: nowrap;
  z-index: 2;
}
.ol-compose-subj-wrap.ol-subj-missing .ol-compose-subj-hint {
  display: inline-block;
  animation: ol-subj-missing-pulse 1.1s ease-in-out infinite;
  color: #e81123 !important;
}
.ol-compose-subj-wrap.ol-subj-missing #ol-cw-subj,
.ol-compose-host.ol-dark .ol-compose-subj-wrap.ol-subj-missing #ol-cw-subj,
.ol-host.ol-dark .ol-compose-subj-wrap.ol-subj-missing #ol-cw-subj {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  caret-color: #e81123 !important;
}
.ol-compose-host.ol-dark .ol-compose-subj-hint,
.ol-host.ol-dark .ol-compose-subj-hint,
.ol-compose-host.ol-dark .ol-compose-fields .ol-compose-subj-hint,
.ol-host.ol-dark .ol-compose-fields .ol-compose-subj-hint {
  color: #e81123 !important;
}
@keyframes ol-subj-missing-pulse {
  0%,
  100% {
    opacity: 0.4;
    color: #e81123;
  }
  50% {
    opacity: 1;
    color: #ff4d5a;
  }
}

/* Readonly EML-Vorschau (angeh?ngte E-Mail) */
.ol-eml-view-host,
.ol-eml-view {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.ol-eml-view .ol-eml-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--w11-win-body, var(--ol-bg, #fff));
}
.ol-eml-view .ol-eml-reading {
  flex: 1;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ol-eml-view .ol-eml-reading .ol-preview-frame {
  flex: 1;
  min-height: 0;
  width: 100%;
  border: 0;
  background: #fff;
}
.w11-window[data-app-id^="outlook-eml"] {
  min-width: 520px;
  min-height: 400px;
}
.ol-compose-recip[hidden] {
  display: none !important;
}
.ol-addr-link {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--ol-accent, #0078d4);
  font: inherit;
  font-weight: 600;
  font-size: 0.8rem;
  text-align: left;
  padding: 4px 0;
  cursor: pointer;
  text-decoration: underline;
  width: 48px;
}
.ol-addr-link:hover { color: var(--ol-accent-hover, #106ebe); }
.ol-addr-wrap {
  position: relative;
  min-width: 0;
  width: 100%;
  flex: 1;
}
.ol-addr-suggest {
  position: absolute;
  left: 0;
  right: auto;
  top: calc(100% - 2px);
  z-index: 130;
  min-width: 100%;
  width: max(100%, 380px);
  max-width: min(520px, 90vw);
  background: var(--w11-window-bg, #fff);
  border: 1px solid var(--w11-stroke, #c8c6c4);
  border-radius: 2px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.16);
  max-height: 260px;
  overflow: auto;
}
.ol-addr-suggest:not([hidden]) {
  display: block;
}
.ol-compose-fields .ol-addr-wrap input.ol-addr-invalid {
  outline: 1px solid #e81123;
  border-color: #e81123 !important;
}
.ol-addr-sug-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 0 4px 0 0;
  color: var(--w11-text, var(--ol-text, #242424));
}
.ol-addr-sug-item:hover,
.ol-addr-sug-item:focus-within {
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent, #0078d4)) 16%, var(--w11-window-bg, #fff));
}
.ol-addr-sug-pick {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 8px 6px 8px 10px;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.ol-addr-sug-pick:focus-visible {
  outline: none;
}
.ol-addr-sug-pick strong {
  font-size: 0.82rem;
  color: var(--w11-text, var(--ol-text, #242424));
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-addr-sug-pick span {
  font-size: 0.72rem;
  color: var(--w11-muted, var(--ol-muted, #605e5c));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-addr-sug-del {
  appearance: none;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin: 0 4px 0 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-muted, #888);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  opacity: 0.55;
}
.ol-addr-sug-del:hover {
  opacity: 1;
  background: color-mix(in srgb, #c42b1c 18%, transparent);
  color: #c42b1c;
}
/* Adressbuch-Picker ? Personalisierung (--w11-*) */
.ol-addrbook-host,
.ol-addrbook,
.ol-addrbook.dlg-shell,
.ol-addrbook-host .dlg-shell {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.w11-window.ol-addrbook-win .w11-win-body,
.w11-window.ol-addrbook-win .w11-dialog-body {
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.ol-addrbook-form {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  padding: 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(120% 80% at 100% -10%, color-mix(in srgb, var(--w11-accent) 18%, transparent), transparent 55%),
    radial-gradient(90% 60% at -10% 110%, color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 12%, transparent), transparent 50%),
    var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.ol-addrbook-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  flex-shrink: 0;
  background: color-mix(in srgb, var(--w11-titlebar, var(--w11-window-bg)) 72%, transparent);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.ol-addrbook-search {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-window-bg) 88%, var(--w11-win-body));
  color: var(--w11-text);
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 6%, transparent);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.ol-addrbook-search:focus-within {
  border-color: var(--w11-accent);
  box-shadow:
    0 0 0 1px var(--w11-accent),
    0 0 0 4px color-mix(in srgb, var(--w11-accent) 22%, transparent);
  background: var(--w11-window-bg);
}
.ol-addrbook-search-ico {
  display: inline-flex;
  color: var(--w11-muted);
  flex-shrink: 0;
  opacity: 0.9;
}
.ol-addrbook-search:focus-within .ol-addrbook-search-ico {
  color: var(--w11-accent);
}
.ol-addrbook-search input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--w11-text) !important;
  font: inherit;
  font-size: 0.86rem;
  padding: 0;
}
.ol-addrbook-search input::placeholder {
  color: var(--w11-muted);
  opacity: 0.85;
}
.ol-addrbook-toolbar .ol-rbtn {
  width: 34px;
  height: 34px;
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-window-bg) 80%, transparent);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  transition: background 0.12s ease, border-color 0.12s ease, transform 0.12s ease;
}
.ol-addrbook-toolbar .ol-rbtn:hover {
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
  color: var(--w11-accent);
}
.ol-addrbook-toolbar .ol-rbtn:active {
  transform: scale(0.96);
}
.ol-addrbook-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 8px 10px 12px;
  background: transparent;
  scroll-behavior: smooth;
}
.ol-addrbook-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  margin: 0 0 4px;
  border: 1px solid transparent;
  border-radius: 12px;
  cursor: pointer;
  color: var(--w11-text);
  user-select: none;
  background: color-mix(in srgb, var(--w11-window-bg) 55%, transparent);
  transition: background 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease, transform 0.14s ease;
}
.ol-addrbook-row:hover {
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-stroke) 80%, transparent);
}
.ol-addrbook-row.selected {
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  box-shadow:
    inset 3px 0 0 var(--w11-accent),
    0 1px 8px color-mix(in srgb, var(--w11-accent) 12%, transparent);
}
.ol-addrbook-row input[type="checkbox"] {
  width: 17px;
  height: 17px;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--w11-accent);
  cursor: pointer;
}
.ol-addrbook-row .ol-avatar {
  width: 36px;
  height: 36px;
  font-size: 0.74rem;
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--w11-accent) 42%, var(--w11-window-bg)),
      color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg))
    );
  color: var(--w11-text);
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--w11-accent) 35%, transparent),
    0 2px 6px color-mix(in srgb, var(--w11-accent) 14%, transparent);
}
.ol-addrbook-row.selected .ol-avatar {
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--w11-accent) 70%, #fff),
      var(--w11-accent)
    );
  color: #fff;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, #fff 25%, transparent),
    0 2px 10px color-mix(in srgb, var(--w11-accent) 35%, transparent);
}
.ol-addrbook-row .ol-contact-meta {
  flex: 1;
  min-width: 0;
  gap: 3px;
}
.ol-addrbook-row .ol-contact-meta strong {
  color: var(--w11-text);
  font-weight: 600;
  font-size: 0.88rem;
  letter-spacing: 0.01em;
}
.ol-addrbook-row .ol-contact-meta small {
  color: var(--w11-muted);
  font-size: 0.75rem;
}
.ol-addrbook-row .ol-ab-domain {
  flex-shrink: 0;
  max-width: 38%;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 500;
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-stroke) 28%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ol-addrbook-row.selected .ol-ab-domain {
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 35%, transparent);
}
.ol-addrbook .win-sheet-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px !important;
  background: color-mix(in srgb, var(--w11-titlebar, var(--w11-window-bg)) 88%, var(--w11-win-body)) !important;
  border-top: 1px solid var(--w11-stroke) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.ol-addrbook .ol-ab-selcount {
  margin-right: auto;
  font-size: 0.78rem;
  color: var(--w11-muted);
  min-width: 0;
}
.ol-addrbook .ol-ab-selcount strong {
  color: var(--w11-accent);
  font-weight: 650;
}
.ol-addrbook .win-sheet-footer .win-sheet-btn {
  min-width: 88px;
}
.ol-addrbook .ol-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 180px;
  padding: 36px 20px;
  text-align: center;
  color: var(--w11-muted);
}
.ol-addrbook .ol-empty::before {
  content: "";
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background:
    radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--w11-accent) 35%, transparent), transparent 60%),
    color-mix(in srgb, var(--w11-window-bg) 80%, var(--w11-win-body));
  border: 1px solid color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
  box-shadow: 0 8px 24px color-mix(in srgb, var(--w11-accent) 12%, transparent);
  margin-bottom: 4px;
}
.ol-addrbook .ol-empty p {
  margin: 0;
  font-size: 0.9rem;
  color: var(--w11-text);
  font-weight: 560;
}
.ol-addrbook .ol-empty span {
  font-size: 0.78rem;
  color: var(--w11-muted);
}

.ol-compose-host.ol-dark .ol-addr-suggest,
.ol-host.ol-dark .ol-addr-suggest {
  background: var(--w11-window-bg, #252526);
  border-color: var(--w11-stroke, #3f3f46);
}
.ol-compose-host.ol-dark .ol-addr-sug-item,
.ol-host.ol-dark .ol-addr-sug-item {
  color: var(--w11-text, #f3f2f1);
}
.ol-compose-host.ol-dark .ol-addr-sug-pick strong,
.ol-host.ol-dark .ol-addr-sug-pick strong {
  color: var(--w11-text, #f3f2f1);
}
.ol-compose-host.ol-dark .ol-addr-sug-pick span,
.ol-host.ol-dark .ol-addr-sug-pick span {
  color: var(--w11-muted, #c8c6c4);
}
.ol-compose-host.ol-dark .ol-addr-sug-item:hover,
.ol-compose-host.ol-dark .ol-addr-sug-item:focus-within,
.ol-host.ol-dark .ol-addr-sug-item:hover,
.ol-host.ol-dark .ol-addr-sug-item:focus-within {
  background: color-mix(in srgb, var(--w11-accent, #0078d4) 22%, var(--w11-window-bg, #252526));
}
.ol-compose-host.ol-dark .ol-addr-sug-del,
.ol-host.ol-dark .ol-addr-sug-del {
  color: var(--w11-muted, #c8c6c4);
}
.ol-host.ol-dark .ol-contacts-list,
.ol-host.ol-dark .ol-contact-item { background: transparent; border-color: #3f3f46; color: #f3f2f1; }
.ol-host.ol-dark .ol-contact-item.active { background: #0c4a6e; }
.ol-host.ol-dark .ol-ct-field input,
.ol-host.ol-dark .ol-ct-field textarea {
  background: #2b2b2b;
  border-color: #5a5a5a;
  color: #f3f2f1;
}

/* KI-Modell / Ollama ? Windows Sheet wie Sicherheit */
.w11-win-body #acc-ai.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
}
.w11-win-body #acc-ai .ai-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
}
.ai-settings-tabs.win-sheet-tabs {
  flex-shrink: 0;
  display: flex;
  gap: 0;
  padding: 6px 10px 0;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
}
.ai-settings-tabs .win-sheet-tab {
  appearance: none;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  color: #616161 !important;
  padding: 8px 14px 10px !important;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 500;
  border-radius: 0 !important;
  min-width: 0;
  height: auto;
  cursor: pointer;
  box-shadow: none !important;
}
.ai-settings-tabs .win-sheet-tab.active {
  color: var(--w11-text) !important;
  font-weight: 600 !important;
  border-bottom-color: #0067c0 !important;
}
.ai-pane { min-height: 0; }
.ai-setup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 12px 4px;
}
.ai-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 10px 12px 12px;
  background: #f3f3f3;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-content: start;
}
.ai-form { display: flex; flex-direction: column; gap: 10px; }
.ai-card {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  padding: 2px 0 8px;
  min-height: 0;
}
.ai-card-h {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px 6px;
}
.ai-card-h > div { flex: 1; min-width: 0; }
.ai-card-h strong {
  display: block;
  color: #1a1a1a;
  font-size: 0.86rem;
  font-weight: 600;
}
.ai-card-h small {
  display: block;
  color: #666;
  font-size: 0.72rem;
  margin-top: 1px;
}
.ai-card-ico {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  font-size: 0.95rem;
  background: linear-gradient(160deg, #c8f0e8, #2a9d8f);
  border: 1px solid #7bc4b8;
  color: #0f3d38;
}
.ai-card-ico.tone-cfg {
  background: linear-gradient(160deg, #d7e8f8, #6e9cc8);
  border-color: #6e9cc8;
  color: #1a3a5c;
}
.ai-card-ico.tone-mic {
  background: linear-gradient(160deg, #ffe0a8, #d18b2c);
  border-color: #e0a86a;
  color: #5c3a10;
}
.ai-card-ico.tone-pkg {
  background: linear-gradient(160deg, #f0d4b8, #b87a3d);
  border-color: #d0a070;
  color: #4a2e12;
}
.ai-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 0 10px 6px;
  padding: 0;
}
.ai-meta > div {
  padding: 8px 10px;
  border-bottom: 1px solid #f0f0f0;
}
.ai-meta dt {
  font-size: 0.72rem;
  color: #666;
  margin: 0;
}
.ai-meta dd {
  margin: 2px 0 0;
  font-size: 0.88rem;
  color: #1a1a1a;
  font-weight: 600;
}
.ai-row.switch {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 2px 10px 8px;
  padding: 6px 10px;
  border: 1px solid #eee;
  border-radius: 4px;
  background: #fafafa;
}
.ai-row-text { flex: 1; min-width: 0; }
.ai-row-text strong { display: block; color: #1a1a1a; font-size: 0.82rem; }
.ai-row-text small { display: block; color: #666; font-size: 0.7rem; margin-top: 1px; }
.ai-row.switch .switch-track { margin-left: auto; flex-shrink: 0; }
#acc-ai .ai-win-switch {
  position: relative;
}
#acc-ai .ai-win-switch .switch-track {
  width: 40px;
  height: 20px;
  border-radius: 10px;
  background: #929292;
  box-shadow: none;
  flex-shrink: 0;
  position: relative;
  display: inline-block;
}
#acc-ai .ai-win-switch .switch-track::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  transition: transform 0.15s ease;
}
#acc-ai .ai-win-switch input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
#acc-ai .ai-win-switch input:checked + .switch-track {
  background: #005fb8;
  box-shadow: none;
}
#acc-ai .ai-win-switch input:checked + .switch-track::after {
  transform: translateX(20px);
}
.ai-table {
  margin: 0 10px;
  width: calc(100% - 20px);
}
.ai-table th {
  width: 34%;
  color: var(--w11-text) !important;
  font-weight: 500;
  vertical-align: middle;
  padding: 5px 8px 5px 0;
  font-size: 0.78rem;
}
.ai-table td { padding: 4px 0; }
.ai-table input,
.ai-table select,
.ai-table textarea {
  width: 100%;
  box-sizing: border-box;
  height: 28px;
  padding: 0 8px;
  font-size: 0.82rem;
  border: 1px solid #7a7a7a !important;
  border-radius: 2px !important;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
  box-shadow: none !important;
}
.ai-table textarea {
  height: auto;
  min-height: 72px;
  padding: 6px 8px;
  resize: vertical;
  font: inherit;
  line-height: 1.35;
}
.ai-table th label { color: inherit; font-weight: inherit; cursor: pointer; }
.ai-tools-block { padding: 4px 12px 8px; }
.ai-tools-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
}
.ai-tools-row input[type="text"] {
  flex: 1;
  min-width: 160px;
  height: 28px;
  padding: 0 8px;
  font-size: 0.82rem;
  border: 1px solid #7a7a7a;
  border-radius: 2px;
  background: #fff;
  color: #1a1a1a;
}
.ai-hint {
  margin: 2px 0 0;
  font-size: 0.72rem;
  color: #666;
  line-height: 1.35;
}

.ol-ai-bar {
  position: relative;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  margin: 4px 0 2px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)) 0%,
      var(--w11-window-bg) 42%,
      color-mix(in srgb, var(--w11-highlight) 18%, var(--w11-window-bg)) 100%
    );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent),
    0 6px 18px color-mix(in srgb, var(--w11-accent) 12%, transparent);
  overflow: visible;
  isolation: isolate;
}
.ol-ai-bar-glow {
  pointer-events: none;
  position: absolute;
  inset: -30% -10% auto;
  height: 120%;
  background: radial-gradient(ellipse at 20% 30%, color-mix(in srgb, var(--w11-accent) 35%, transparent), transparent 60%);
  opacity: 0.55;
  z-index: 0;
  animation: ol-ai-glow 3.2s ease-in-out infinite;
}
@keyframes ol-ai-glow {
  0%, 100% { opacity: 0.4; transform: translateX(0); }
  50% { opacity: 0.75; transform: translateX(6%); }
}
.ol-ai-bar.is-busy .ol-ai-bar-glow {
  animation: ol-ai-glow-fast 0.9s ease-in-out infinite;
}
@keyframes ol-ai-glow-fast {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 1; }
}
.ol-ai-bar-ico {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(145deg, var(--w11-accent), color-mix(in srgb, var(--w11-accent) 55%, #7c3aed));
  box-shadow: 0 4px 14px color-mix(in srgb, var(--w11-accent) 40%, transparent);
}
.ol-ai-field {
  position: relative;
  z-index: 2;
  flex: 1;
  min-width: 0;
}
.ol-ai-bar input.ol-ai-input,
.ol-ai-bar #ol-cw-ai,
.ol-ai-bar #ol-t-ai {
  width: 100%;
  box-sizing: border-box;
  height: 36px !important;
  border-radius: 9px !important;
  border: 1px solid color-mix(in srgb, var(--w11-accent) 22%, var(--w11-stroke)) !important;
  padding: 0 12px !important;
  background: color-mix(in srgb, var(--w11-win-body) 88%, transparent) !important;
  color: var(--w11-text) !important;
  font-size: 0.86rem !important;
  outline: none;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}
.ol-ai-bar input.ol-ai-input:focus,
.ol-ai-bar #ol-cw-ai:focus,
.ol-ai-bar #ol-t-ai:focus {
  border-color: color-mix(in srgb, var(--w11-accent) 70%, var(--w11-stroke)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--w11-accent) 26%, transparent);
}
.ol-ai-bar input.is-shake {
  animation: win-dlg-shake 0.4s ease;
}
.ol-ai-suggest {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  z-index: 40;
  max-height: 220px;
  overflow: auto;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.28),
    0 0 0 1px color-mix(in srgb, var(--w11-accent) 18%, transparent);
  animation: ol-ai-sug-in 0.18s ease both;
}
@keyframes ol-ai-sug-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: none; }
}
.ol-ai-sug-row {
  display: flex;
  align-items: center;
  gap: 4px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
}
.ol-ai-sug-row:last-child { border-bottom: 0; }
.ol-ai-sug-pick {
  flex: 1;
  min-width: 0;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  font: inherit;
  font-size: 0.82rem;
  padding: 9px 12px;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ol-ai-sug-pick:hover,
.ol-ai-sug-pick:focus {
  background: color-mix(in srgb, var(--w11-accent) 16%, transparent);
  outline: none;
}
.ol-ai-sug-del {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  margin-right: 6px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--w11-muted);
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
}
.ol-ai-sug-del:hover {
  background: color-mix(in srgb, #c42b1c 18%, transparent);
  color: #ff8a7a;
}
.ol-ai-btn {
  position: relative;
  z-index: 1;
  appearance: none;
  height: 36px;
  min-width: 36px;
  padding: 0 14px;
  border-radius: 9px;
  border: 1px solid transparent;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: transform 0.12s ease, box-shadow 0.16s ease, background 0.16s ease;
}
.ol-ai-btn-run {
  min-width: 118px;
  color: #fff;
  background: linear-gradient(145deg, var(--w11-accent), color-mix(in srgb, var(--w11-accent) 70%, #5b21b6));
  box-shadow: 0 6px 16px color-mix(in srgb, var(--w11-accent) 38%, transparent);
}
.ol-ai-btn-run:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px color-mix(in srgb, var(--w11-accent) 48%, transparent);
}
.ol-ai-btn-run:active { transform: translateY(1px); }
.ol-ai-btn-run.is-busy {
  pointer-events: none;
  opacity: 0.85;
}
.ol-ai-btn-run.is-busy .ol-ai-btn-label { opacity: 0.35; }
.ol-ai-btn-spin {
  display: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, #fff 35%, transparent);
  border-top-color: #fff;
}
.ol-ai-btn-run.is-busy .ol-ai-btn-spin {
  display: inline-block;
  position: absolute;
  animation: email-device-spin 0.7s linear infinite;
}
.ol-ai-btn-dict {
  background: color-mix(in srgb, var(--w11-window-bg) 80%, var(--w11-text));
  color: var(--w11-text);
  border-color: var(--w11-stroke);
}
.ol-ai-btn-dict:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.ol-ai-bar-ticket {
  margin: 0;
  flex: 1;
  min-width: 0;
}
.ol-compose-host.ol-dark .ol-ai-bar input,
.ol-host.ol-dark .ol-ai-bar input {
  background: color-mix(in srgb, var(--w11-win-body) 92%, #000) !important;
}
.ol-ai-read-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.ol-ai-read-bar .win-app-btn.active {
  background: var(--w11-accent, #0078d4);
  color: #fff;
  border-color: transparent;
}
.ol-ai-read-bar .win-app-btn.busy {
  opacity: 0.65;
  pointer-events: none;
}
.ol-ai-read-bar .win-app-btn.busy::after {
  content: "?";
}
.ol-tr-status {
  margin: 0 0 8px;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.35;
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
  border-radius: 4px;
}
.ol-ai-translate {
  margin: 0 0 8px;
  padding: 10px 12px;
  border-radius: 4px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  color: var(--w11-text);
  font-size: 13px;
  line-height: 1.45;
  max-height: 220px;
  overflow: auto;
}
.ol-ai-translate.err {
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 40%, var(--w11-stroke));
}

@media (prefers-reduced-motion: reduce) {
  .ol-ai-bar-glow,
  .ol-ai-btn-run.is-busy .ol-ai-btn-spin,
  .ol-ai-suggest {
    animation: none !important;
  }
}
.ol-ai-translate strong { display: block; margin-bottom: 6px; }
.ol-ai-translate-body { margin-bottom: 8px; white-space: pre-wrap; }
.ol-host.ol-dark .ol-ai-translate {
  background: #2b2b2b;
  border-color: #5a5a5a;
  color: #f3f2f1;
}

/* ?? PDF editor + Stempel ?? */
.sm-doc-editor { display:flex; flex-direction:column; height:100%; min-height:0; }
.sm-doc-ribbon,
.sm-doc-ribbon-dark {
  flex-shrink: 0;
  background: #2d2d30;
  border-bottom: 1px solid #3f3f46;
  color: #f3f2f1;
  --ol-text: #f3f2f1;
  --ol-muted: #a19f9d;
  --ol-accent: #60cdff;
  --ol-accent-hover: #4db8eb;
  --ol-accent-pressed: #3aa0d0;
}
.sm-doc-ribbon-inner {
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 4px 8px 2px;
  overflow: visible;
  min-height: 68px;
}
.sm-doc-ribbon,
.sm-doc-ribbon-dark {
  overflow: visible;
  position: relative;
  z-index: 20;
}
.sm-doc-fmt-dd {
  position: relative;
  z-index: 30;
}
.sm-doc-color-pop {
  position: fixed;
  z-index: 10080;
  background: #252526;
  border: 1px solid #3f3f46;
  border-radius: 4px;
  box-shadow: 0 12px 32px rgba(0,0,0,.55);
  padding: 10px;
  min-width: 200px;
  color: #f3f2f1;
}
.sm-doc-text-mode .sm-doc-textlayer {
  pointer-events: auto !important;
  z-index: 6 !important;
  cursor: text;
}
.sm-doc-text-mode .sm-doc-objs {
  pointer-events: none !important;
  z-index: 4;
}
.sm-doc-text-mode .sm-doc-obj {
  pointer-events: auto !important;
}
.sm-doc-textlayer span {
  cursor: text;
}
.sm-doc-textlayer span:hover {
  outline: 1px dashed rgba(0, 120, 212, 0.7);
  background: rgba(0, 120, 212, 0.12);
}
.sm-doc-obj-erase-stroke {
  pointer-events: none;
}
.sm-doc-ribbon-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding: 0 6px 2px;
}
.sm-doc-ribbon-group-btns {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  flex: 1;
}
.sm-doc-ribbon .ol-ribbon-group-label {
  color: #a19f9d;
}
.sm-doc-ribbon .ol-rbtn {
  color: #f3f2f1;
  border-color: transparent;
  background: transparent;
}
.sm-doc-ribbon .ol-rbtn:hover {
  background: #3e3e42;
  border-color: #3e3e42;
}
.sm-doc-ribbon .ol-rbtn.active,
.sm-doc-ribbon .ol-rbtn[aria-pressed="true"] {
  background: #094771;
  border-color: #0a5a8c;
  color: #fff;
}
.sm-doc-ribbon .ol-ribbon-sep {
  width: 1px;
  align-self: stretch;
  margin: 6px 4px 18px;
  background: #3f3f46;
  flex-shrink: 0;
}
.sm-doc-ribbon .ol-ribbon-grow { flex: 1; min-width: 8px; }
.sm-doc-ribbon-props {
  align-items: center;
  gap: 8px;
  padding-bottom: 4px;
}
.sm-doc-color-pop-title {
  font-size: 0.72rem;
  font-weight: 600;
  margin-bottom: 8px;
  color: #a19f9d;
}
.sm-doc-swatch-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
}
.sm-doc-swatch-btn {
  width: 22px;
  height: 22px;
  border: 1px solid #3f3f46;
  border-radius: 2px;
  cursor: pointer;
  padding: 0;
}
.sm-doc-swatch-btn:hover { outline: 1px solid #60cdff; outline-offset: 1px; }
.sm-doc-color-custom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
  font-size: 0.72rem;
  color: #a19f9d;
}
.sm-doc-color-custom input[type=color] {
  width: 36px;
  height: 24px;
  border: 1px solid #3f3f46;
  border-radius: 2px;
  padding: 0;
  background: #2d2d30;
  cursor: pointer;
}
.sm-doc-size-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.68rem;
  color: #a19f9d;
  min-width: 88px;
}
.sm-doc-size-wrap input[type=range] { width: 88px; accent-color: #60cdff; }
.sm-doc-stage.sm-doc-pages {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  background: #525252;
  padding: 0;
  display: block;
  position: relative;
}
.sm-doc-stage.sm-doc-pages.ol-pdf-pages {
  display: block;
  align-items: stretch;
}
.sm-doc-pan-inner {
  display: block;
  padding: 16px;
  width: max-content;
  max-width: none;
  box-sizing: border-box;
  margin: 0;
  transform-origin: 0 0;
  will-change: transform;
}
.sm-doc-stage.sm-doc-hand-mode {
  cursor: grab;
  user-select: none;
}
.sm-doc-stage.sm-doc-hand-mode.sm-doc-panning {
  cursor: grabbing;
}
.sm-doc-stage.sm-doc-hand-mode .sm-doc-page {
  cursor: grab;
}
.sm-doc-stage.sm-doc-hand-mode.sm-doc-panning .sm-doc-page {
  cursor: grabbing;
}
.sm-doc-page {
  position: relative;
  margin: 0 auto 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,.35);
  background: #fff;
  max-width: none !important;
  flex-shrink: 0;
  overflow: visible;
}
.sm-doc-page .sm-doc-base,
.sm-doc-page canvas.ol-pdf-page {
  position: absolute;
  left: 0;
  top: 0;
  max-width: none !important;
  width: 100% !important;
  max-height: none !important;
  height: 100% !important;
  display: block;
  pointer-events: none;
  user-select: none;
  opacity: 1 !important;
  image-rendering: auto;
}
.sm-doc-page .sm-doc-textlayer {
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
}
.sm-doc-text-mode .sm-doc-page .sm-doc-textlayer {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.sm-doc-select-mode .sm-doc-page .sm-doc-textlayer,
.sm-doc-select-mode .sm-doc-page .textLayer {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto;
  user-select: text;
  -webkit-user-select: text;
  z-index: 5;
}
.sm-doc-select-mode .sm-doc-page .sm-doc-textlayer span,
.sm-doc-select-mode .sm-doc-page .textLayer span,
.sm-doc-select-mode .ol-pdf-page-wrap .textLayer span {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  user-select: text;
  -webkit-user-select: text;
  cursor: text;
}
.sm-doc-select-mode .sm-doc-page .sm-doc-textlayer span::selection,
.sm-doc-select-mode .sm-doc-page .textLayer span::selection,
.sm-doc-select-mode .ol-pdf-page-wrap .textLayer ::selection {
  background: rgba(0, 120, 215, 0.35);
  color: transparent;
}
.sm-doc-effects {
  position: absolute;
  inset: 0;
  z-index: 11;
  pointer-events: none;
  overflow: hidden;
}
.sm-doc-pixelate-overlay {
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
  overflow: visible;
  cursor: move;
}
.sm-doc-pixelate-canvas {
  display: block;
  width: 100%;
  height: 100%;
  image-rendering: pixelated;
  pointer-events: none;
}
.sm-doc-pixelate-frame {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  border: 2px dashed #0078d4;
  pointer-events: none;
}
.sm-doc-pixelate-overlay.selected .sm-doc-pixelate-frame {
  border-style: solid;
}
.sm-doc-objs {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}
.sm-doc-obj {
  position: absolute;
  box-sizing: border-box;
  pointer-events: auto;
  cursor: move;
  user-select: none;
}
.sm-doc-obj.selected {
  outline: 2px solid #0078d4;
  outline-offset: 1px;
  z-index: 4;
}
.sm-doc-obj-svg {
  display: block;
  overflow: visible;
  pointer-events: none;
}
.sm-doc-obj-shape {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border-style: solid;
  background: transparent;
  pointer-events: none;
}
.sm-doc-obj-circle { border-radius: 50%; }
.sm-doc-obj-cover {
  position: absolute;
  left: 0;
  top: 0;
  background: #fff;
  pointer-events: none;
}
.sm-doc-obj-text {
  position: relative;
  z-index: 1;
  font-family: "Segoe UI", Arial, sans-serif;
  line-height: 1.15;
  white-space: pre-wrap;
  word-break: break-word;
  min-width: 1em;
  outline: none;
}
.sm-doc-obj[data-source="pdf"] .sm-doc-obj-text {
  line-height: 1;
}
.sm-doc-obj-text[contenteditable="true"] {
  cursor: text;
  background: rgba(255,255,255,.92);
  box-shadow: 0 0 0 2px #0078d4;
  padding: 1px 2px;
  user-select: text;
}
.sm-doc-obj-whiteout {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff;
  pointer-events: none;
}
.sm-doc-obj-pixelate {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border: 1px dashed rgba(0,120,212,.7);
  background: repeating-conic-gradient(#00000010 0% 25%, transparent 0% 50%) 0 0 / 8px 8px;
  pointer-events: none;
}
.sm-doc-obj-pixelate-outline {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border: 1px dashed rgba(0,120,212,.7);
  background: transparent;
  pointer-events: none;
}
.sm-doc-obj[data-otype="pixelate"]:not(.selected) {
  pointer-events: none;
}
.sm-doc-h {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #fff;
  border: 1px solid #0078d4;
  box-sizing: border-box;
  z-index: 5;
  pointer-events: auto;
}
.sm-doc-h-nw { left: -5px; top: -5px; cursor: nwse-resize; }
.sm-doc-h-n  { left: 50%; top: -5px; margin-left: -4px; cursor: ns-resize; }
.sm-doc-h-ne { right: -5px; top: -5px; cursor: nesw-resize; }
.sm-doc-h-e  { right: -5px; top: 50%; margin-top: -4px; cursor: ew-resize; }
.sm-doc-h-se { right: -5px; bottom: -5px; cursor: nwse-resize; }
.sm-doc-h-s  { left: 50%; bottom: -5px; margin-left: -4px; cursor: ns-resize; }
.sm-doc-h-sw { left: -5px; bottom: -5px; cursor: nesw-resize; }
.sm-doc-h-w  { left: -5px; top: 50%; margin-top: -4px; cursor: ew-resize; }
.sm-doc-h-line-a,
.sm-doc-h-line-b { cursor: grab; }
.sm-doc-draft {
  position: absolute;
  z-index: 6;
  pointer-events: none;
  box-sizing: border-box;
  border: 1px dashed #0078d4;
  background: rgba(0,120,212,.08);
}
.sm-doc-draft.is-circle { border-radius: 50%; }
.sm-doc-draft.is-pixelate {
  border-style: dashed;
  background: repeating-conic-gradient(#00000012 0% 25%, transparent 0% 50%) 0 0 / 8px 8px;
}
.sm-doc-draft svg { display: block; overflow: visible; }
.sm-doc-draw .sm-doc-textlayer { pointer-events: none; }
.sm-doc-draw .sm-doc-objs { pointer-events: none; }
.sm-doc-select-mode .sm-doc-objs { pointer-events: none; }
/* pointer-events am Objekt setzt syncObjPointerEvents per Inline-Style */
.sm-doc-select-mode .sm-doc-obj { pointer-events: none; }

.sm-doc-place-ghost {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 10050;
  pointer-events: none;
  opacity: 0;
  box-sizing: border-box;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25));
  will-change: transform;
}
.sm-doc-place-ghost.is-visible { opacity: 0.92; }
.sm-doc-place-ghost canvas,
.sm-doc-place-ghost img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  background: transparent;
}
.sm-doc-stage.sm-doc-placing,
.sm-doc-stage.sm-doc-placing .sm-doc-page {
  cursor: none !important;
}
.sm-doc-obj[data-otype="signature"] .sm-doc-obj-sig {
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.sm-doc-obj[data-otype="signature"] .sm-doc-obj-sig img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  display: block;
}
.sm-doc-obj[data-otype="stamp"] canvas {
  pointer-events: none;
  display: block;
}

.stamps-host, .stamps-shell { height:100%; min-height:0; display:flex; flex-direction:column; color:var(--w11-text); }
.stamps-shell { flex:1; background:var(--w11-win-body); }
.stamps-layout { display:grid; grid-template-columns:270px 1fr; flex:1; height:100%; min-height:0; min-width:0; }
.stamps-side {
  border-right:1px solid var(--w11-stroke, var(--w11-win-border));
  padding:12px; display:flex; flex-direction:column; gap:10px; min-height:0; overflow:auto; min-width:0;
  background:var(--w11-window-bg);
}
.stamps-side-head { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--w11-text); }
.stamps-list { display:flex; flex-direction:column; gap:6px; flex:1; min-height:80px; }
.stamps-list-empty { padding:12px 4px; font-size:0.82rem; }
.stamps-list-item {
  display:flex; flex-direction:column; align-items:stretch; gap:4px;
  padding:6px; border:1px solid transparent; border-radius:6px;
  background:var(--w11-win-body); color:var(--w11-text); cursor:pointer; text-align:left;
}
.stamps-list-item:hover {
  border-color:var(--w11-active-border, var(--w11-accent));
  background:color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 18%, var(--w11-win-body));
}
.stamps-list-item.active {
  border-color:var(--w11-accent);
  background:color-mix(in srgb, var(--w11-accent) 14%, var(--w11-win-body));
}
.stamps-list-item canvas {
  width:100%; height:auto;
  background:
    linear-gradient(45deg, color-mix(in srgb, var(--w11-text) 12%, var(--w11-window-bg)) 25%, transparent 25%) 0 0 / 12px 12px,
    linear-gradient(-45deg, color-mix(in srgb, var(--w11-text) 12%, var(--w11-window-bg)) 25%, transparent 25%) 0 6px / 12px 12px,
    linear-gradient(45deg, transparent 75%, color-mix(in srgb, var(--w11-text) 12%, var(--w11-window-bg)) 75%) 6px -6px / 12px 12px,
    linear-gradient(-45deg, transparent 75%, color-mix(in srgb, var(--w11-text) 12%, var(--w11-window-bg)) 75%) -6px 0 / 12px 12px,
    var(--w11-window-bg);
  border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:4px;
}
.stamps-list-item span, .stamps-list-name { font-size:0.78rem; color:var(--w11-text); }
.stamps-hint { font-size:0.72rem; line-height:1.35; color:var(--w11-muted); }
.stamps-dms-details {
  border-top:1px solid var(--w11-stroke, var(--w11-win-border));
  padding-top:6px; margin-top:auto;
}
.stamps-dms-details > summary {
  cursor:pointer; font-size:0.8rem; color:var(--w11-muted); user-select:none; padding:4px 0;
}
.stamps-dms-details[open] > summary { color:var(--w11-text); margin-bottom:6px; }
.stamps-dms-box {
  padding:10px; border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:8px;
  background:var(--w11-win-body); display:flex; flex-direction:column; gap:8px;
}
.stamps-dms-box > strong { font-size:0.82rem; color:var(--w11-text); }
.stamps-dms-switch { margin:0; }
.stamps-dms-field { display:flex; flex-direction:column; gap:3px; font-size:0.75rem; color:var(--w11-muted); }
.stamps-dms-field select {
  height:28px; border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:4px;
  background:var(--w11-window-bg); color:var(--w11-text);
}
.stamps-editor {
  padding:0; overflow:hidden; min-height:0; min-width:0; display:flex; flex-direction:column; gap:0;
  background:var(--w11-win-body); color:var(--w11-text);
}
.stamps-empty {
  padding:32px 28px; max-width:420px;
  display:flex; flex-direction:column; gap:10px; align-items:flex-start;
}
.stamps-empty strong { font-size:1.05rem; }
.stamps-editor-head {
  display:flex; flex-wrap:wrap; align-items:end; gap:10px 14px;
  padding:10px 12px; flex-shrink:0;
  background:var(--w11-titlebar, var(--w11-window-bg));
  border-bottom:1px solid var(--w11-stroke, var(--w11-win-border));
}
.stamps-name-field { display:flex; flex-direction:column; gap:3px; flex:1 1 180px; min-width:140px; }
.stamps-name-field span, .stamps-size-fields label span {
  font-size:0.72rem; color:var(--w11-muted);
}
.stamps-name-field input, .stamps-size-fields input {
  height:30px; border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:4px;
  padding:0 8px; background:var(--w11-window-bg); color:var(--w11-text);
}
.stamps-size-fields { display:flex; gap:8px; align-items:end; }
.stamps-size-fields label { display:flex; flex-direction:column; gap:3px; }
.stamps-size-fields input { width:72px; }
.stamps-save-status {
  font-size:0.75rem; color:var(--w11-muted); min-width:7.5rem; align-self:center;
}
.stamps-save-status.is-saving { color:var(--w11-accent); }
.stamps-save-status.is-dirty { color:var(--w11-muted); }
.stamps-save-status.is-saved { color:color-mix(in srgb, #107c10 70%, var(--w11-text)); }
.stamps-save-status.is-err { color:#c42b1c; }
.stamps-editor-hint { margin:0; padding:6px 12px; font-size:0.75rem; flex-shrink:0; }
.st-ph-preview { opacity:0.92; }
.stamps-ribbon {
  display:block; flex-shrink:0; max-width:100%;
  overflow-x:auto; overflow-y:hidden;
  padding:0;
  background:var(--w11-titlebar-focus, var(--w11-titlebar));
  color:var(--w11-text);
  border-bottom:1px solid var(--w11-stroke, var(--w11-win-border));
}
.stamps-ribbon .sm-doc-ribbon-inner {
  display:flex; align-items:stretch; flex-wrap:wrap;
  gap:0; row-gap:2px; padding:4px 8px 2px;
  min-height:0; max-width:100%; overflow:visible;
}
.stamps-ribbon .sm-doc-ribbon-group { flex:0 1 auto; max-width:100%; }
.stamps-ribbon .sm-doc-ribbon-group-btns { flex-wrap:wrap; }
.stamps-ribbon .sm-doc-ribbon-props { flex-wrap:wrap; max-width:100%; }
.stamps-ribbon .ol-rbtn { color:var(--w11-text); }
.stamps-ribbon .ol-rbtn span { display:none; } /* kompakt ? Titel per title */
.stamps-ribbon .ol-rbtn.active, .stamps-ribbon .ol-rbtn:hover {
  background:color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 22%, transparent);
}
.stamps-ribbon .ol-ribbon-group-label { color:var(--w11-muted); }
.stamps-ribbon .sm-doc-text-fmt {
  flex-wrap:wrap; max-width:100%;
}
.stamps-ribbon .sm-doc-text-fmt select {
  max-width:120px; min-width:72px;
  background:var(--w11-window-bg); color:var(--w11-text);
  border:1px solid var(--w11-stroke, var(--w11-win-border));
}
.stamps-ribbon .sm-doc-text-fmt input[type="number"] {
  background:var(--w11-window-bg); color:var(--w11-text);
  border:1px solid var(--w11-stroke, var(--w11-win-border));
}
.stamps-ribbon .sm-doc-tf-btn {
  background:var(--w11-window-bg); color:var(--w11-text);
  border:1px solid var(--w11-stroke, var(--w11-win-border));
}
.stamps-ribbon .sm-doc-tf-btn.active {
  background:var(--w11-accent); border-color:var(--w11-accent); color:#fff;
}
.stamps-ribbon-group { display:flex; flex-direction:column; align-items:center; gap:2px; padding:0 6px; }
.stamps-ribbon-btns { display:flex; align-items:center; gap:2px; flex-wrap:wrap; }
.stamps-fmt { gap:6px; }
.stamps-fmt-group:not(.is-text) .stamps-font-sel,
.stamps-fmt-group:not(.is-text) .stamps-fs-inp,
.stamps-fmt-group:not(.is-text) .sm-doc-tf-btn { opacity:.35; pointer-events:none; }
.stamps-font-sel, .stamps-fs-inp {
  height:28px; border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:4px;
  background:var(--w11-window-bg); color:var(--w11-text);
  font-size:0.75rem; padding:0 6px;
}
.stamps-fs-inp { width:52px; }
.stamps-meta-bar {
  display:flex; flex-wrap:wrap; gap:10px; align-items:end;
  padding:8px 12px; background:var(--w11-window-bg); border-bottom:1px solid var(--w11-stroke, var(--w11-win-border));
}
.stamps-meta-bar label { display:flex; flex-direction:column; gap:2px; font-size:0.75rem; color:var(--w11-muted); }
.stamps-meta-bar input {
  height:28px; border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:4px;
  padding:0 8px; min-width:100px; background:var(--w11-win-body); color:var(--w11-text);
}
.stamps-stage-outer {
  flex:1; min-height:0; overflow:auto; padding:20px;
  display:flex; justify-content:center; align-items:flex-start;
  background:
    linear-gradient(45deg, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 25%, transparent 25%) 0 0 / 16px 16px,
    linear-gradient(-45deg, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 25%, transparent 25%) 0 8px / 16px 16px,
    linear-gradient(45deg, transparent 75%, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 75%) 8px -8px / 16px 16px,
    linear-gradient(-45deg, transparent 75%, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 75%) -8px 0 / 16px 16px,
    var(--w11-win-body);
}
.stamps-stage {
  position:relative; background:transparent;
  box-shadow:0 2px 12px color-mix(in srgb, #000 25%, transparent); outline:none;
  border:1px solid var(--w11-stroke, var(--w11-win-border)); flex-shrink:0;
}
.stamps-objs { position:absolute; inset:0; }
.stamps-draft { position:absolute; inset:0; pointer-events:none; }
.st-obj {
  position:absolute; box-sizing:border-box; cursor:move; user-select:none;
  min-width:8px; min-height:8px;
}
.stamps-shell .st-obj.selected {
  outline:2px solid var(--w11-accent);
  outline-offset:8px;
  z-index:2;
}
.stamps-shell .st-obj.selected.is-locked {
  outline-style:dashed;
  outline-offset:8px;
}
.stamps-shell .st-obj.editing {
  outline:2px solid var(--w11-accent);
  outline-offset:6px;
  cursor:text; z-index:3;
}
.stamps-shell .sm-doc-h { width:9px; height:9px; border-width:1.5px; border-color:var(--w11-accent); }
.stamps-shell .sm-doc-h-nw { left:-14px; top:-14px; }
.stamps-shell .sm-doc-h-n  { left:50%; top:-14px; margin-left:-4.5px; }
.stamps-shell .sm-doc-h-ne { right:-14px; top:-14px; }
.stamps-shell .sm-doc-h-e  { right:-14px; top:50%; margin-top:-4.5px; }
.stamps-shell .sm-doc-h-se { right:-14px; bottom:-14px; }
.stamps-shell .sm-doc-h-s  { left:50%; bottom:-14px; margin-left:-4.5px; }
.stamps-shell .sm-doc-h-sw { left:-14px; bottom:-14px; }
.stamps-shell .sm-doc-h-w  { left:-14px; top:50%; margin-top:-4.5px; }
.st-obj.selected { outline:1px solid var(--w11-accent); outline-offset:1px; z-index:2; }
.st-obj.editing { outline:2px solid var(--w11-accent); cursor:text; z-index:3; }
.st-obj-text {
  width:100%; height:100%; overflow:hidden; line-height:1.15;
  white-space:pre-wrap; word-break:break-word; outline:none;
}
.st-obj-img { width:100%; height:100%; object-fit:contain; display:block; pointer-events:none; }
.stamps-props {
  display:flex; flex-wrap:wrap; gap:8px; align-items:end;
  padding:8px 12px; background:var(--w11-window-bg); border-top:1px solid var(--w11-stroke, var(--w11-win-border)); min-height:44px;
}
.stamps-props label { display:flex; flex-direction:column; gap:2px; font-size:0.75rem; color:var(--w11-muted); }
.stamps-props .span-2 { flex:1 1 220px; }
.stamps-props input, .stamps-props select {
  height:28px; border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:4px;
  padding:0 8px; background:var(--w11-win-body); color:var(--w11-text);
}
.st-color-pop { z-index:10060; }

.stamps-editor-bar {
  display:flex; flex-wrap:wrap; gap:10px; align-items:end; flex-shrink:0;
  padding:8px 12px; background:var(--w11-window-bg); border-bottom:1px solid var(--w11-stroke, var(--w11-win-border));
}
.stamps-editor-bar label { display:flex; flex-direction:column; gap:2px; font-size:0.75rem; color:var(--w11-muted); }
.stamps-editor-bar input {
  height:28px; border:1px solid var(--w11-stroke, var(--w11-win-border)); border-radius:4px;
  padding:0 8px; min-width:100px; background:var(--w11-win-body); color:var(--w11-text);
}
.stamps-tools { display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
.stamps-ph { display:inline-flex; flex-wrap:wrap; gap:4px; }
.stamps-ph-dd { position:relative; }
.stamps-ph-pop {
  min-width:220px; max-width:280px; padding:6px;
  background:var(--w11-window-bg); color:var(--w11-text);
  border:1px solid var(--w11-stroke, var(--w11-win-border));
  border-radius:8px; box-shadow:0 8px 24px color-mix(in srgb, #000 28%, transparent);
  display:flex; flex-direction:column; gap:2px;
}
.stamps-ph-pop[hidden] { display:none !important; }
.stamps-ph-item {
  display:flex; flex-direction:column; align-items:flex-start; gap:1px;
  width:100%; text-align:left; padding:8px 10px; border:0; border-radius:6px;
  background:transparent; color:var(--w11-text); cursor:pointer; font:inherit;
}
.stamps-ph-item:hover, .stamps-ph-item:focus-visible {
  background:color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 18%, var(--w11-window-bg));
  outline:none;
}
.stamps-ph-item strong { font-size:0.82rem; font-weight:600; }
.stamps-ph-item span { font-size:0.72rem; color:var(--w11-muted); font-family:Consolas, monospace; }
.st-obj.is-locked { cursor:default; }
.st-obj.is-locked.selected { outline-style:dashed; }
.st-lock-badge {
  position:absolute; top:-8px; right:-8px; z-index:5;
  width:18px; height:18px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--w11-window-bg); color:var(--w11-text);
  border:1px solid var(--w11-stroke, var(--w11-win-border));
  box-shadow:0 1px 4px color-mix(in srgb, #000 20%, transparent);
  pointer-events:none;
}
.st-lock-badge svg { width:12px; height:12px; display:block; }
.ol-rbtn[data-st="lock"]:disabled { opacity:0.4; pointer-events:none; }
.stamps-canvas-wrap,
.stamps-stage-wrap {
  flex:1; min-height:0; overflow:auto; padding:20px;
  display:flex; justify-content:center; align-items:flex-start;
  background:
    linear-gradient(45deg, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 25%, transparent 25%) 0 0 / 16px 16px,
    linear-gradient(-45deg, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 25%, transparent 25%) 0 8px / 16px 16px,
    linear-gradient(45deg, transparent 75%, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 75%) 8px -8px / 16px 16px,
    linear-gradient(-45deg, transparent 75%, color-mix(in srgb, var(--w11-text) 10%, var(--w11-win-body)) 75%) -8px 0 / 16px 16px,
    var(--w11-win-body);
  border-radius:0;
}
.stamps-canvas-wrap canvas {
  background: transparent;
  box-shadow:0 1px 6px color-mix(in srgb, #000 18%, transparent); cursor:crosshair; max-width:100%;
}
.st-stage {
  position:relative; flex-shrink:0; background:transparent;
  box-shadow:0 2px 12px color-mix(in srgb, #000 25%, transparent);
  border:1px solid var(--w11-stroke, var(--w11-win-border));
  outline:none; touch-action:none;
}
.st-stage .sm-doc-objs,
.st-objs {
  position:absolute; inset:0; z-index:3; pointer-events:none;
}
.st-stage.sm-doc-select-mode .sm-doc-objs,
.st-stage.sm-doc-select-mode .st-objs { pointer-events:auto; }
.st-stage .st-obj.sm-doc-obj { pointer-events:auto; }
.stamps-ribbon.sm-doc-ribbon-dark .sm-doc-text-fmt select,
.stamps-ribbon.sm-doc-ribbon-dark .sm-doc-text-fmt input[type="number"] {
  background:var(--w11-window-bg); color:var(--w11-text); border-color:var(--w11-stroke, var(--w11-win-border));
}
.stamps-props { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:8px; }

.sm-stamp-pick-overlay {
  position:fixed; inset:0; z-index:10050; background:rgba(0,0,0,.45);
  display:flex; align-items:center; justify-content:center; padding:24px;
}
.sm-stamp-pick {
  background:var(--surface, #fff); color:var(--text, #1a1a1a);
  border-radius:10px; min-width:min(520px, 92vw); max-width:720px; max-height:80vh;
  display:flex; flex-direction:column; box-shadow:0 12px 40px rgba(0,0,0,.35);
}
.sm-stamp-pick header {
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px; border-bottom:1px solid #ddd;
}
.sm-stamp-pick-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:10px; padding:12px; overflow:auto;
}
.sm-stamp-pick-item {
  display:flex; flex-direction:column; gap:6px; align-items:center;
  padding:8px; border:1px solid #ddd; border-radius:8px; background:#fafafa; cursor:pointer;
}
.sm-stamp-pick-item:hover { border-color:#0078d4; }
.sm-stamp-pick-item canvas {
  background:
    linear-gradient(45deg, #e8e8e8 25%, transparent 25%) 0 0 / 10px 10px,
    linear-gradient(-45deg, #e8e8e8 25%, transparent 25%) 0 5px / 10px 10px,
    #fff;
  width:100%; height:auto;
}
.sm-stamp-pick-item span { font-size:0.78rem; }
button.linkish {
  background:none; border:none; color:#0078d4; padding:0; cursor:pointer; text-decoration:underline; font:inherit;
}

.cpl-ico.tone-stamps { background:linear-gradient(145deg,#c01818,#8b1010); color:#fff; }
.cpl-ico.tone-sig { background:linear-gradient(145deg,#2b88d8,#0b5a9e); color:#fff; }

.signatures-host, .sig-shell { height:100%; min-height:0; display:flex; flex-direction:column; }
.sig-shell .sig-body {
  flex:1; min-height:0; overflow:auto; padding:14px 16px 20px;
  display:flex; flex-direction:column; gap:14px;
  background: linear-gradient(180deg, #f3f6fa 0%, #e8eef5 100%);
}
.sig-preview-card {
  background:#fff; border:1px solid #d0d7de; border-radius:8px; padding:12px 14px;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.sig-preview-label { font-size:0.78rem; color:#605e5c; margin-bottom:8px; }
.sig-preview {
  min-height:72px; display:flex; align-items:center; justify-content:center;
  background: repeating-linear-gradient(-45deg, #fafafa, #fafafa 8px, #f3f3f3 8px, #f3f3f3 16px);
  border:1px dashed #c8c6c4; border-radius:6px; padding:10px;
}
.sig-preview img { max-height:96px; max-width:100%; object-fit:contain; }
.sig-tabs { display:flex; gap:4px; }
.sig-tab {
  border:1px solid #c8c6c4; background:#f3f2f1; color:#323130; padding:6px 14px;
  border-radius:6px; cursor:pointer; font:inherit; font-size:0.85rem;
}
.sig-tab.active { background:#0078d4; border-color:#0078d4; color:#fff; }
.sig-pane { background:#fff; border:1px solid #d0d7de; border-radius:8px; padding:12px; }
.sig-canvas {
  width:100%; height:auto; max-height:240px; display:block;
  border:1px solid #c8c6c4; border-radius:4px; cursor:crosshair; touch-action:none;
  background:
    linear-gradient(45deg, #e8e8e8 25%, transparent 25%) 0 0 / 14px 14px,
    linear-gradient(-45deg, #e8e8e8 25%, transparent 25%) 0 7px / 14px 14px,
    linear-gradient(45deg, transparent 75%, #e8e8e8 75%) 7px -7px / 14px 14px,
    linear-gradient(-45deg, transparent 75%, #e8e8e8 75%) -7px 0 / 14px 14px,
    #fff;
}
.sig-draw-actions { display:flex; align-items:center; gap:16px; margin-top:10px; flex-wrap:wrap; }
.sig-ink { display:flex; align-items:center; gap:8px; font-size:0.82rem; color:#605e5c; }
.sig-upload-zone {
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  min-height:160px; border:2px dashed #a19f9d; border-radius:8px; cursor:pointer;
  background:#faf9f8; color:#323130;
}
.sig-upload-zone:hover { border-color:#0078d4; background:#f3f9fd; }
.sig-upload-preview { margin-top:12px; text-align:center; }
.sig-upload-preview img { max-height:120px; max-width:100%; }

.sm-doc-text-fmt {
  display:flex; align-items:center; gap:6px; flex-wrap:wrap;
}
.sm-doc-text-fmt[hidden] { display:none !important; }
.sm-doc-text-fmt select,
.sm-doc-text-fmt input[type="number"] {
  height:28px; border:1px solid #605e5c; border-radius:4px; background:#2b2b2b; color:#fff;
  font-size:0.75rem; padding:0 6px;
}
.sm-doc-text-fmt input[type="number"] { width:52px; }
.sm-doc-tf-btn {
  min-width:28px; height:28px; border:1px solid #605e5c; border-radius:4px;
  background:#2b2b2b; color:#fff; font-weight:700; cursor:pointer; font-size:0.8rem;
}
.sm-doc-tf-btn.active { background:#0078d4; border-color:#0078d4; }
.sm-doc-tf-btn[data-tf="italic"] { font-style:italic; font-weight:600; }
.sm-doc-tf-btn[data-tf="underline"] { text-decoration:underline; }
.sm-doc-obj-sig img { width:100%; height:100%; object-fit:contain; display:block; pointer-events:none; }
.sm-doc-reply-btn { color:#4fc3f7 !important; }


/* Selection / highlight surfaces */
.fe-row.selected,
.dms-row.selected,
.bak-row.selected,
.email-account.selected,
.svc-row.selected,
.pgb-node.selected,
.stor-item.selected,
.ol-ticket-row.selected,
.ol-tree-row.selected,
.ol-tree-row.active {
  background: var(--w11-highlight) !important;
  color: var(--w11-text) !important;
}
.w11-theme-preset-user {
  border-color: var(--w11-accent);
}
.w11-theme-preset-user span {
  font-weight: 600;
}

/* ===== Theme bridge: force Personalisierung across shells / popups ===== */
.w11-win-body,
.w11-win-body.w11-cpl-body,
.w11-win-body.w11-files-body,
.w11-win-body.w11-outlook-body,
.cpl,
.ol-host,
.ol-compose-host,
.ol-app,
.ol-main,
.ol-shell,
.ol-mail,
.ol-nav,
.ol-ribbon,
.ol-toolbar,
.ol-folder-pane,
.ol-folders,
.ol-msg-pane,
.ol-list,
.ol-msg-list,
.ol-reading-pane,
.ol-reading,
.ol-empty,
.ol-preview,
.ol-preview-frame,
.ol-account-head,
.ol-msg-pane-h,
.win-app-shell,
.dlg-shell,
.fe-explorer,
.fe-main,
.np-host,
.dms-host {
  background-color: var(--w11-win-body);
  color: var(--w11-text);
}
.ol-nav,
.ol-ribbon,
.ol-toolbar,
.ol-folder-pane,
.ol-folders,
.ol-account-head,
.ol-msg-pane-h,
.cpl-nav,
.fe-toolbar,
.fe-nav {
  background: color-mix(in srgb, var(--w11-win-body) 88%, var(--w11-text)) !important;
  color: var(--w11-text) !important;
  border-color: var(--w11-stroke) !important;
}
.ol-msg-pane,
.ol-list,
.ol-msg-list,
.ol-reading-pane,
.ol-reading,
.ol-empty,
.ol-preview,
.cpl-grid,
.fe-main {
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
/* Nur der Mail-Inhalt: helles Briefpapier (Kopfzeile bleibt thematisiert) */
body.w11-desktop-mode .ol-reading-pane .ol-preview-frame,
body.w11-desktop-mode .ol-reading > .ol-preview-frame,
.ol-reading-pane .ol-preview-frame,
.ol-reading > .ol-preview-frame {
  background: #ffffff !important;
  color: #242424 !important;
  color-scheme: light !important;
}
.ol-att-link {
  background: var(--w11-window-bg) !important;
  border-color: var(--w11-stroke) !important;
  color: var(--w11-text) !important;
}
.w11-window.focused {
  border-color: var(--w11-active-border) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.55), 0 0 0 1px color-mix(in srgb, var(--w11-active-border) 55%, transparent) !important;
}
.w11-window:not(.focused) {
  border-color: var(--w11-win-border);
}
.w11-ctx,
.ctx-menu,
.w11-ctx-flyout,
.ol-fmt-pop,
.ol-compose-paste-ctx {
  background: var(--w11-window-bg) !important;
  color: var(--w11-text) !important;
  border-color: var(--w11-win-border) !important;
}
.w11-ctx-item:hover:not(.disabled),
.w11-ctx button:hover:not(:disabled):not(.disabled),
.ctx-menu button:hover:not(:disabled),
.w11-ctx-flyout button:hover:not(:disabled),
.w11-ctx-subwrap.open > .w11-ctx-parent,
.w11-ctx-parent:hover,
.w11-ctx-sender-item:hover {
  background: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-window-bg)) !important;
  color: var(--w11-text) !important;
}
.w11-ctx-flyout button.cat-on,
.w11-ctx-sender-item.cat-on {
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 34%, var(--w11-window-bg)) !important;
  color: var(--w11-text) !important;
}
.w11-ctx-sender-item:hover .w11-ctx-sender-main small,
.w11-ctx-sender-item:hover .w11-ctx-sender-pct,
.w11-ctx-sender-item.cat-on .w11-ctx-sender-main small,
.w11-ctx-sender-item.cat-on .w11-ctx-sender-pct {
  color: var(--w11-text) !important;
  opacity: 0.88;
}
.win-sheet-footer,
.dlg-shell .win-sheet-footer {
  background: var(--w11-titlebar) !important;
  border-top-color: var(--w11-stroke) !important;
  color: var(--w11-text) !important;
}
.w11-win-body #acc-printers.w11-hosted,
.w11-win-body #acc-vpn.w11-hosted,
.w11-win-body #acc-backup.w11-hosted,
.w11-win-body #acc-dms.w11-hosted,
.w11-win-body #acc-stamps.w11-hosted,
.w11-win-body #acc-signatures.w11-hosted,
.w11-win-body #acc-storage.w11-hosted,
.w11-win-body #acc-security.w11-hosted,
.w11-win-body #acc-certificate.w11-hosted,
.w11-win-body #acc-ai.w11-hosted {
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
.fe-addr input,
.cpl-search,
.cpl-view select,
.ol-ribbon select,
.ol-ribbon input[type="search"],
.ol-ribbon input[type="text"] {
  background: var(--w11-window-bg) !important;
  color: var(--w11-text) !important;
  border-color: var(--w11-stroke) !important;
}
/* Word viewer */
.ol-word-viewer { background:#e8e8e8; color:#1a1a1a; }
.ol-word-viewer .ol-viewer-toolbar { background:#2b579a; border-bottom:1px solid:#1e3f73; color:#fff; }
.ol-word-viewer .ol-viewer-title { color:#fff; }
.ol-word-viewer .ol-viewer-actions .ol-rbtn {
  color:#fff; border-color:rgba(255,255,255,.28); background:rgba(255,255,255,.14);
}
.ol-word-stage {
  flex:1; min-height:0; overflow:auto; padding:16px; background:#525252;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.ol-word-page {
  width:min(816px, 100%); min-height:400px; background:#fff; color:#1a1a1a;
  padding:48px 56px; box-shadow:0 4px 24px rgba(0,0,0,.35);
  font-family:"Calibri","Segoe UI",serif; font-size:11pt; line-height:1.4;
}
.ol-word-page img { max-width:100%; height:auto; }
.ol-word-warn {
  width:min(816px,100%); padding:8px 12px; background:#fff4ce; color:#605e5c;
  font-size:.75rem; border-radius:4px;
}

/* Ticket notes + activity */
.ol-tnotes-block { margin-top:16px; padding-top:12px; border-top:1px solid var(--ol-border); }
.ol-tnotes-block h4 { margin:0 0 8px; font-size:.85rem; }
.ol-tnote {
  border:1px solid var(--ol-border); border-radius:6px; padding:8px 10px; margin-bottom:8px;
  background:var(--ol-bg-subtle);
}
.ol-tnote header { display:flex; justify-content:space-between; gap:8px; font-size:.75rem; color:var(--ol-muted); margin-bottom:4px; }
.ol-tnote-body { font-size:.82rem; white-space:pre-wrap; }
.ol-tnote-img { display:block; max-width:100%; margin-top:8px; border-radius:4px; }
.ol-tact-list { list-style:none; margin:0; padding:0; max-height:220px; overflow:auto; }
.ol-tact-list li {
  font-size:.72rem; padding:6px 0; border-bottom:1px solid var(--ol-border);
  display:flex; flex-wrap:wrap; gap:4px 8px; align-items:baseline;
}
.ol-tact-when { color:var(--ol-muted); min-width:7.5rem; }
.ol-tact-detail { color:var(--ol-muted); width:100%; }
button.ol-pending-banner {
  width:100%; text-align:left; cursor:pointer; appearance:none; pointer-events:auto;
}
button.ol-pending-banner:hover { filter:brightness(0.97); }
.ol-linkish {
  appearance:none; border:0; background:transparent; color:var(--ol-accent);
  font:inherit; font-size:.75rem; cursor:pointer; padding:0;
}
.ol-ticket-side-h { display:flex; align-items:center; justify-content:space-between; gap:8px; }

/* Word viewer */
.ol-word-viewer { background:#e8e8e8; color:#1a1a1a; }
.ol-word-viewer .ol-viewer-toolbar { background:#2b579a; border-bottom:1px solid:#1e3f73; color:#fff; }
.ol-word-viewer .ol-viewer-title { color:#fff; }
.ol-word-viewer .ol-viewer-actions .ol-rbtn {
  color:#fff; border-color:rgba(255,255,255,.28); background:rgba(255,255,255,.14);
}
.ol-word-stage {
  flex:1; min-height:0; overflow:auto; padding:16px; background:#525252;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.ol-word-page {
  width:min(816px, 100%); min-height:400px; background:#fff; color:#1a1a1a;
  padding:48px 56px; box-shadow:0 4px 24px rgba(0,0,0,.35);
  font-family:"Calibri","Segoe UI",serif; font-size:11pt; line-height:1.4;
}
.ol-word-page img { max-width:100%; height:auto; }
.ol-word-warn {
  width:min(816px,100%); padding:8px 12px; background:#fff4ce; color:#605e5c;
  font-size:.75rem; border-radius:4px;
}
.ol-tnotes-block { margin-top:16px; padding-top:12px; border-top:1px solid var(--ol-border); }
.ol-tnotes-block h4 { margin:0 0 8px; font-size:.85rem; }
.ol-tnote {
  border:1px solid var(--ol-border); border-radius:6px; padding:8px 10px; margin-bottom:8px;
  background:var(--ol-bg-subtle);
}
.ol-tnote header { display:flex; justify-content:space-between; gap:8px; font-size:.75rem; color:var(--ol-muted); margin-bottom:4px; }
.ol-tnote-body { font-size:.82rem; white-space:pre-wrap; }
.ol-tnote-img { display:block; max-width:100%; margin-top:8px; border-radius:4px; }
.ol-tact-list { list-style:none; margin:0; padding:0; max-height:220px; overflow:auto; }
.ol-tact-list li {
  font-size:.72rem; padding:6px 0; border-bottom:1px solid var(--ol-border);
  display:flex; flex-wrap:wrap; gap:4px 8px; align-items:baseline;
}
.ol-tact-when { color:var(--ol-muted); min-width:7.5rem; }
.ol-tact-detail { color:var(--ol-muted); width:100%; }
button.ol-pending-banner { width:100%; text-align:left; cursor:pointer; appearance:none; pointer-events:auto; }
button.ol-pending-banner:hover { filter:brightness(0.97); }
.ol-linkish {
  appearance:none; border:0; background:transparent; color:var(--ol-accent);
  font:inherit; font-size:.75rem; cursor:pointer; padding:0;
}
.ol-ticket-side-h { display:flex; align-items:center; justify-content:space-between; gap:8px; }


/* Compose follows Personalisierung ? Fenster-Chrome ja, Mail-Papier nein */
.ol-compose-host,
.ol-compose-win,
.ol-compose {
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
}
/* Empf?nger sehen wei?en Hintergrund: Editor immer dunkle Schrift auf Papier */
.ol-compose-editor,
.ol-ticket-reply-ed,
.ol-sig-editor.ol-compose-editor,
.ol-note-editor.ol-compose-editor {
  background: #ffffff !important;
  color: #242424 !important;
  caret-color: #242424;
}
.ol-compose-html {
  background: #1e1e1e !important;
  color: #d4d4d4 !important;
  caret-color: #d4d4d4;
}
.ol-compose-host.ol-dark .ol-compose-editor,
.ol-host.ol-dark .ol-compose-editor,
.ol-compose-host.ol-dark .ol-ticket-reply-ed,
.ol-host.ol-dark .ol-ticket-reply-ed,
.ol-compose-host.ol-dark .ol-sig-editor,
.ol-host.ol-dark .ol-sig-editor,
.ol-compose-host.ol-dark .ol-note-editor,
.ol-host.ol-dark .ol-note-editor {
  background: #ffffff !important;
  color: #242424 !important;
}
.ol-ai-bar {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  grid-column: 1 / -1;
}
.ol-compose-fields .ol-ai-bar {
  display: flex;
  grid-template-columns: none;
}
.ol-ai-bar .ol-ai-btn {
  flex-shrink: 0;
}
.ol-drop-hint,
.ol-compose-atts {
  background: var(--w11-titlebar) !important;
  color: var(--w11-muted) !important;
  border-top: 1px solid var(--w11-stroke);
  border-bottom: 0;
}
.ol-compose-ribbon .ol-rbtn:not(.primary) {
  color: var(--w11-text) !important;
  border-color: var(--w11-stroke) !important;
  background: transparent !important;
}
.ol-compose-ribbon .ol-rbtn:not(.primary):hover {
  background: color-mix(in srgb, var(--w11-accent) 18%, transparent) !important;
}
.ol-addr-link {
  color: var(--w11-accent) !important;
  background: transparent !important;
  border: 0 !important;
}
.ol-compose.dragover,
.ol-compose-win.dragover {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-win-body)) !important;
}

/* ===== UNIFIED Personalisierung (alle Desktop-Fenster) ===== */
body.w11-desktop-mode .w11-win-body {
  --surface: var(--w11-win-body);
  --surface-2: var(--w11-window-bg);
  --surface-3: var(--w11-titlebar);
  --ink: var(--w11-text);
  --ink-muted: var(--w11-muted);
  --line: var(--w11-stroke);
  --focus: var(--w11-accent);
  --sel: var(--w11-highlight);
  --sel-ink: var(--w11-highlight-fg, var(--w11-text));
  background: var(--surface) !important;
  color: var(--ink) !important;
}

/* Shells / hosts / panes */
body.w11-desktop-mode .w11-win-body :is(
  .w11-hosted, .win-app-shell, .dlg-shell,
  .vpn-shell, .vpn-connections, .vpn-wizard-shell, .vpn-wizard-form, .vpn-wizard-body,
  .prn-shell, .prn-devices, .prn-wizard-shell, .prn-wizard-form, .prn-wizard-body,
  .sec-shell, .sec-body, .sec-card, .sec-block-list,
  .cert-shell, .cert-body,
  .mssql-shell, .mssql-layout, .mssql-side, .mssql-main, .mssql-card,
  .email-shell, .email-accounts,
  .ai-shell, .ai-body, .ai-card, .ai-settings-tabs, .ai-settings-body,
  .stor-shell, .stor-view, .stor-nav, .stor-address, .stor-list,
  .bak-shell, .bak-list-pane, .bak-detail, .bak-snaps, .bak-wizard-body,
  .dms-host, .dms-app, .dms-settings-shell, .dms-settings-body, .dms-settings-tabs,
  .dms-side, .dms-main, .dms-list, .dms-viewer, .dms-viewer-pane, .dms-list-pane,
  .dms-meta, .dms-master-list,
  .dms-wipe-shell, .dms-wipe-body, .dms-co-form, .dms-confirm-shell,
  .stamps-host, .stamps-shell, .stamps-side, .stamps-editor, .stamps-canvas-wrap,
  .signatures-host, .sig-shell, .sig-body, .sig-preview-card, .sig-pane,
  .pga-host, .pga-app, .pga-status-card, .pga-section, .pga-metric, .pga-toolbar,
  .pgb-host, .pgb-app, .pgb-tree-pane, .pgb-main, .pgb-output, .pgb-props, .pgb-props-sheet,
  .pgb-editor, .pgb-grid-wrap, .pkg-list, .win-app-list, .logs-list,
  .fe-explorer, .fe-main, .fe-nav, .acc-card, .acc-body
) {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* Elevated / toolbar strips */
body.w11-desktop-mode .w11-win-body :is(
  .win-app-toolbar, .pkg-tools, .win-app-status, .fe-status, .fe-toolbar,
  .dms-toolbar, .dms-viewer-bar, .dms-settings-tabs, .ai-settings-tabs,
  .dms-table th, .stor-nav, .stor-address, .bak-detail, .pga-toolbar, .pgb-toolbar,
  .sig-tabs, .stamps-side
) {
  background: var(--surface-3) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body .dms-viewer-bar button {
  background: color-mix(in srgb, var(--surface) 75%, var(--ink)) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}
body.w11-desktop-mode .w11-win-body .dms-viewer-bar button:hover {
  background: color-mix(in srgb, var(--focus) 22%, var(--surface)) !important;
  border-color: var(--focus) !important;
}
body.w11-desktop-mode .w11-win-body .dms-table thead th {
  background: var(--surface-3) !important;
  color: var(--ink) !important;
  z-index: 4;
}
body.w11-desktop-mode .w11-win-body .dms-table td {
  background: var(--surface) !important;
}
body.w11-desktop-mode .w11-win-body .dms-row:hover td {
  background: color-mix(in srgb, var(--focus) 12%, var(--surface)) !important;
}
body.w11-desktop-mode .w11-win-body .dms-row.selected td {
  background: color-mix(in srgb, var(--focus) 22%, var(--surface)) !important;
}
body.w11-desktop-mode .w11-win-body .dms-row.dms-row-busy td,
body.w11-desktop-mode .w11-win-body .dms-row.ocr-busy td {
  background: color-mix(in srgb, var(--focus) 14%, var(--surface)) !important;
}
body.w11-desktop-mode .w11-win-body .dms-row.dms-row-busy.selected td,
body.w11-desktop-mode .w11-win-body .dms-row.ocr-busy.selected td {
  background: color-mix(in srgb, var(--focus) 26%, var(--surface)) !important;
}

/* Subtle second surfaces */
body.w11-desktop-mode .w11-win-body :is(
  .sec-body, .cert-body, .ai-body, .dms-settings-shell,
  .pgb-tree-pane, .sig-body, .stamps-editor
) {
  background: color-mix(in srgb, var(--surface) 92%, var(--ink)) !important;
}

/* Cards */
body.w11-desktop-mode .w11-win-body :is(
  .sec-card, .ai-card, .pga-status-card, .pga-section, .pga-metric,
  .sig-preview-card, .sig-pane, .acc-card, .w11-hosted .card, .w11-hosted .glass
) {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body .sec-row.switch {
  background: color-mix(in srgb, var(--surface-2) 82%, var(--ink)) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .sec-row-text strong,
body.w11-desktop-mode .w11-win-body .sec-card-h strong,
body.w11-desktop-mode .w11-win-body .sec-port-body strong,
body.w11-desktop-mode .w11-win-body .sec-block-body strong {
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .sec-row-text small,
body.w11-desktop-mode .w11-win-body .sec-card-h small,
body.w11-desktop-mode .w11-win-body .sec-hint,
body.w11-desktop-mode .w11-win-body .sec-port-body small,
body.w11-desktop-mode .w11-win-body .sec-block-body small,
body.w11-desktop-mode .w11-win-body .sec-empty {
  color: var(--ink-muted) !important;
}

/* Text */
body.w11-desktop-mode .w11-win-body,
body.w11-desktop-mode .w11-win-body :is(
  h1, h2, h3, h4, label, p, span, td, th, strong, small, dt, dd, li, div
) {
  color: inherit;
}
/* Excel-Viewer: helles Sheet-Chrome ? nicht dunklen Theme-Text erben */
body.w11-desktop-mode .w11-win-body .ol-sheet-viewer {
  color: #242424 !important;
  background: #f3f2f1 !important;
}
body.w11-desktop-mode .w11-win-body .ol-sheet-viewer .ol-viewer-toolbar {
  color: #fff !important;
  background: #217346 !important;
  border-bottom-color: #185c37 !important;
}
body.w11-desktop-mode .w11-win-body .ol-sheet-viewer .ol-viewer-toolbar :is(
  .ol-viewer-title, .ol-viewer-meta, .ol-rbtn, span, button, div
) {
  color: #fff !important;
}
body.w11-desktop-mode .w11-win-body .ol-sheet-statusbar {
  color: #323130 !important;
  background: #f3f2f1 !important;
  border-top-color: #e1dfdd !important;
}
body.w11-desktop-mode .w11-win-body .ol-sheet-tabs {
  color: #323130 !important;
  background: #e1dfdd !important;
  border-top-color: #c8c6c4 !important;
}
body.w11-desktop-mode .w11-win-body .ol-sheet-tab {
  color: #323130 !important;
}
body.w11-desktop-mode .w11-win-body .ol-sheet-tab.active {
  background: #fff !important;
  color: #323130 !important;
  border-color: #c8c6c4 !important;
}
body.w11-desktop-mode .w11-win-body .ol-sheet-trunc {
  color: #605e5c !important;
  background: #fff4ce !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .win-app-toolbar-text strong, .sec-card-h, .ai-card h3, .card-h, .muted,
  .win-sheet-hint, .sec-hint, .stor-addr-label, .stor-crumb-sep
) {
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body :is(.muted, .win-sheet-hint, .sec-hint, small) {
  color: var(--ink-muted) !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .switch-text, .email-props-switch .switch-text, .pgb-write-switch .switch-text,
  #acc-dms .dms-win-switch .switch-text, #acc-stor-props .switch-text
) {
  color: var(--ink) !important;
}

/* Tables */
body.w11-desktop-mode .w11-win-body :is(
  .win-sheet-table, .sec-table, .bak-table, .ai-table, .pg-table, .pga-table, .pgb-grid
) {
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .win-sheet-table th, .sec-table th, .bak-table th, .ai-table th, .pg-table th, .pga-table th, .pgb-grid th, .pgb-rownum
) {
  background: var(--surface-3) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .win-sheet-table td, .sec-table td, .bak-table td, .ai-table td, .pg-table td, .pga-table td
) {
  color: var(--ink) !important;
  border-color: var(--line) !important;
  background: transparent !important;
}
body.w11-desktop-mode .w11-win-body .prn-wizard-form :is(
  .win-sheet-table th
) {
  background: transparent !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .prn-wizard-form :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select, textarea
) {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* Form controls */
body.w11-desktop-mode .w11-win-body :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]),
  select, textarea
),
body.w11-desktop-mode .w11-win-body :is(
  .dms-combo-field, .dms-combo-input, .dms-combo-list, .dms-cfg input, .dms-cfg select,
  .ai-table input, .ai-table select, .ai-table textarea,
  .fe-addr input, .fe-rename-input, .stor-path, .win-sheet-field input, .win-sheet-field select, .win-sheet-field textarea
) {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  caret-color: var(--focus);
}
body.w11-desktop-mode .w11-win-body :is(input, textarea)::placeholder {
  color: var(--ink-muted) !important;
}
body.w11-desktop-mode .w11-win-body option {
  background: var(--surface-2);
  color: var(--ink);
}

/* Buttons */
body.w11-desktop-mode .w11-win-body :is(
  .win-app-btn, .win-sheet-btn, .fe-toolbar button, .fe-upload, .btn, .btn-ghost, .sig-tab, .dms-combo-toggle, .dms-tb-btn
) {
  background: color-mix(in srgb, var(--surface) 75%, var(--ink)) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .win-app-btn:hover, .win-sheet-btn:hover, .fe-toolbar button:hover, .btn:hover, .sig-tab:hover, .dms-combo-toggle:hover, .dms-tb-btn:hover
) {
  background: color-mix(in srgb, var(--focus) 22%, var(--surface)) !important;
  border-color: var(--focus) !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .win-app-btn.primary, .btn-primary, .sig-tab.active, .win-sheet-btn.primary
) {
  background: var(--focus) !important;
  border-color: var(--focus) !important;
  color: var(--sel-ink) !important;
}

/* Lists / rows */
body.w11-desktop-mode .w11-win-body :is(
  .vpn-conn, .prn-device, .email-account, .bak-row, .dms-row, .stor-item, .fe-row,
  .svc-row, .pkg-row, .log-row, .sec-block-item, .pga-table tbody tr, .dms-master-row
) {
  color: var(--ink) !important;
  border-color: var(--line) !important;
  background: transparent;
}
body.w11-desktop-mode .w11-win-body :is(
  .vpn-conn:hover, .prn-device:hover, .email-account:hover, .bak-row:hover, .bak-snap:hover,
  .dms-row:hover, .stor-item:hover, .fe-row:hover, .svc-row:hover, .pkg-row:hover,
  .dms-combo-option:hover, .stor-crumb:hover, .dms-master-row:hover
) {
  background: color-mix(in srgb, var(--sel) 28%, var(--surface)) !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .vpn-conn.selected, .prn-device.selected, .email-account.selected, .bak-row.selected,
  .dms-row.selected, .stor-item.selected, .fe-row.selected, .svc-row.selected,
  .dms-combo-option.selected, .dms-master-row.selected, .pgb-node.selected
) {
  background: var(--sel) !important;
  color: var(--sel-ink) !important;
}
/* Storage-Badges: Theme-Inherit ?berschreibt sonst Pastell+wei?e Schrift */
body.w11-desktop-mode .w11-win-body .stor-badge.bak {
  color: #fff !important;
  background: #107c10 !important;
  border-color: color-mix(in srgb, #0b6a0b 70%, #000) !important;
}
body.w11-desktop-mode .w11-win-body .stor-badge.dms {
  color: #fff !important;
  background: #0078d4 !important;
  border-color: color-mix(in srgb, #005a9e 70%, #000) !important;
}
body.w11-desktop-mode .w11-win-body .bak-pill {
  color: var(--ink) !important;
  background: color-mix(in srgb, var(--ink-muted) 14%, var(--surface)) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body .bak-pill.on {
  color: #0b6a0b !important;
  background: color-mix(in srgb, #107c10 16%, var(--surface)) !important;
  border-color: color-mix(in srgb, #107c10 40%, var(--line)) !important;
}
body.w11-desktop-mode .w11-win-body .bak-pill.err {
  color: #c42b1c !important;
  background: color-mix(in srgb, #c42b1c 16%, var(--surface)) !important;
  border-color: color-mix(in srgb, #c42b1c 40%, var(--line)) !important;
}
body.w11-desktop-mode .w11-win-body .bak-pill.run {
  color: var(--focus) !important;
  background: color-mix(in srgb, var(--focus) 16%, var(--surface)) !important;
  border-color: color-mix(in srgb, var(--focus) 40%, var(--line)) !important;
}
body.w11-desktop-mode .w11-win-body .bak-error {
  color: var(--ink) !important;
  background: color-mix(in srgb, #c42b1c 14%, var(--surface)) !important;
  border-color: color-mix(in srgb, #c42b1c 40%, var(--line)) !important;
}
body.w11-desktop-mode .w11-win-body .stor-badge.sp {
  color: #fff !important;
  background: #5c2d91 !important;
  border-color: color-mix(in srgb, #5c2d91 70%, #000) !important;
}

/* DMS-Filter-Dropdowns: immer lesbar (heller Text auf solidem Hintergrund) */
body.w11-desktop-mode .w11-win-body .dms-combo-list {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55) !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.w11-desktop-mode .w11-win-body .dms-combo-option {
  background: transparent !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .dms-combo-option:hover,
body.w11-desktop-mode .w11-win-body .dms-combo-option.active {
  background: color-mix(in srgb, var(--sel) 32%, var(--surface-2)) !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .dms-combo-option.selected,
body.w11-desktop-mode .w11-win-body .dms-combo-option.selected:hover,
body.w11-desktop-mode .w11-win-body .dms-combo-option.selected.active {
  background: var(--sel) !important;
  color: var(--sel-ink) !important;
}
body.w11-desktop-mode .w11-win-body .dms-combo-empty {
  color: var(--ink-muted) !important;
}
body.w11-desktop-mode .w11-win-body .dms-dl-menu {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body .dms-dl-menu button {
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .dms-dl-menu button:hover {
  background: color-mix(in srgb, var(--sel) 32%, var(--surface-2)) !important;
  color: var(--ink) !important;
}

/* Footers / danger / wipe */
body.w11-desktop-mode .w11-win-body :is(
  .win-sheet-footer, .dlg-shell .win-sheet-footer
) {
  background: var(--surface-3) !important;
  border-top-color: var(--line) !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body :is(
  .dms-danger, .dms-wipe-zone, .dms-wipe-panel, #dms-wipe-panel, .dms-settings-danger,
  .dms-danger-zone, .dms-wipe-warn, .dms-wipe-list, .dms-wipe-confirm-label
) {
  background: color-mix(in srgb, #c42b1c 12%, var(--surface)) !important;
  color: var(--ink) !important;
  border-color: color-mix(in srgb, #c42b1c 45%, var(--line)) !important;
}
body.w11-desktop-mode .w11-win-body #acc-dms-wipe.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-dms-wipe .dlg-shell {
  background: var(--surface) !important;
  color: var(--ink) !important;
}

/* ID-specific stubborn shells (beat older #acc-* !important) */
body.w11-desktop-mode .w11-win-body #acc-ai.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-ai .ai-shell,
body.w11-desktop-mode .w11-win-body #acc-vpn.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-printers.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-security.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-certificate.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-email.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-storage.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-backup.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-dms.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-stamps.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-signatures.w11-hosted,
body.w11-desktop-mode .w11-win-body #acc-users.w11-hosted,
body.w11-desktop-mode .w11-win-body #page-packages.w11-hosted,
body.w11-desktop-mode .w11-win-body #page-logs.w11-hosted,
body.w11-desktop-mode .w11-win-body.w11-pga-body,
body.w11-desktop-mode .w11-win-body.w11-pgb-body {
  background: var(--surface) !important;
  color: var(--ink) !important;
}

/* Packages / logs list area */
body.w11-desktop-mode .w11-win-body .pkg-list,
body.w11-desktop-mode .w11-win-body .win-app-list,
body.w11-desktop-mode .w11-win-body .logs-list {
  background: var(--surface) !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .pkg-row,
body.w11-desktop-mode .w11-win-body .log-row .msg {
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .log-row .ts {
  color: var(--ink-muted) !important;
}
body.w11-desktop-mode .w11-win-body .log-row .unit {
  color: var(--focus) !important;
}

/* PG browser panes that used SSMS light skin */
body.w11-desktop-mode .w11-win-body :is(
  .pgb-tabs, .pgb-tab, .pgb-sql, .pgb-result, .pgb-tree, .pgb-node, .pgb-prop
) {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body .pgb-tab.active {
  background: var(--surface-2) !important;
  color: var(--focus) !important;
  border-bottom-color: var(--focus) !important;
}

/* Stamp / signature designers */
body.w11-desktop-mode .w11-win-body .sig-preview,
body.w11-desktop-mode .w11-win-body .sig-upload-zone,
body.w11-desktop-mode .w11-win-body .sig-canvas {
  background: color-mix(in srgb, var(--surface) 88%, var(--ink)) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* Outlook reading chrome + custom controls follow Personalisierung */
body.w11-desktop-mode .w11-win-body :is(
  .ol-reading-head, .ol-preview-head, .ol-atts,
  .ol-ai-read-bar, .ol-tr-status, .ol-dd-menu, .ol-suggest, .ol-dd-btn
) {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
body.w11-desktop-mode .w11-win-body :is(.ol-atts, .ol-reading-head, .ol-preview-head) {
  background: color-mix(in srgb, var(--surface) 90%, var(--ink)) !important;
}
body.w11-desktop-mode .w11-win-body .ol-reading-atts {
  background: transparent !important;
}
body.w11-desktop-mode .w11-win-body .ol-dd-btn {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--surface) 92%, #fff) 0%,
    var(--surface) 100%
  ) !important;
}
body.w11-desktop-mode .w11-win-body .ol-dd-opt.selected,
body.w11-desktop-mode .w11-win-body .ol-suggest-item.active,
body.w11-desktop-mode .w11-win-body .ol-suggest-item:hover {
  background: color-mix(in srgb, var(--focus) 18%, var(--surface)) !important;
  color: var(--ink) !important;
}
body.w11-desktop-mode .w11-win-body .ol-folder.active,
body.w11-desktop-mode .w11-win-body .ol-tree-row.active,
body.w11-desktop-mode .w11-win-body .ol-tree-row.selected {
  background: var(--sel) !important;
  color: var(--sel-ink) !important;
}
body.w11-desktop-mode .w11-win-body .ol-search-bar {
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-window-bg, var(--surface)) 88%, var(--w11-accent, var(--ol-accent)) 12%) 0%,
      var(--w11-window-bg, var(--surface)) 45%,
      color-mix(in srgb, var(--w11-window-bg, var(--surface)) 94%, var(--w11-text, var(--ink)) 6%) 100%
    ) !important;
  border-color: color-mix(in srgb, var(--w11-stroke, var(--line)) 80%, var(--w11-accent, var(--ol-accent)) 20%) !important;
  color: var(--w11-text, var(--ink)) !important;
}
body.w11-desktop-mode .w11-win-body .ol-search-bar #ol-q {
  background: transparent !important;
  color: var(--w11-text, var(--ink)) !important;
  border-color: transparent !important;
}
body.w11-desktop-mode .w11-win-body .ol-dd.ol-dd-chip .ol-dd-btn {
  background: color-mix(in srgb, var(--w11-window-bg, var(--surface)) 82%, var(--w11-accent, var(--ol-accent)) 18%) !important;
  color: var(--w11-text, var(--ink)) !important;
  border-color: color-mix(in srgb, var(--w11-stroke, var(--line)) 75%, transparent) !important;
}
body.w11-desktop-mode .w11-win-body .ol-rbtn:hover,
body.w11-desktop-mode .w11-win-body .ol-tab:hover {
  background: color-mix(in srgb, var(--surface) 82%, var(--ink)) !important;
}

/* JTL booking (DMS PC1/PC2) */
.w11-always-on-top { box-shadow: 0 12px 40px rgba(0,0,0,.35) !important; }
.w11-window[data-app-id^="dms-jtl-book-"] .w11-titlebar,
.w11-window[data-app-id^="dms-jtl-book-"].focused .w11-titlebar {
  background: var(--w11-titlebar) !important;
  color: var(--w11-title-color, var(--w11-text)) !important;
  border-bottom: 1px solid var(--w11-stroke, var(--w11-win-border));
}
.w11-window[data-app-id^="dms-jtl-book-"].focused .w11-titlebar {
  background: var(--w11-titlebar-focus) !important;
}
.w11-window[data-app-id^="dms-jtl-book-"] .w11-title,
.w11-window[data-app-id^="dms-jtl-book-"] .w11-win-btns button {
  color: var(--w11-title-color, var(--w11-text)) !important;
}
.w11-jtl-book-body { padding: 0 !important; overflow: hidden !important; background: var(--w11-win-body) !important; }
.jtl-book-host, .jtl-book-mount, .jtl-book-app {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.jtl-book-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--w11-stroke, var(--w11-win-border));
  background: var(--w11-titlebar);
  color: var(--w11-text);
  flex: 0 0 auto;
  min-height: 40px;
  box-sizing: border-box;
}
.jtl-book-tools {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}
.jtl-book-toolbar-main {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-start;
}
.jtl-book-nr-input {
  flex: 1 1 180px;
  max-width: 280px;
  height: 28px;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 0 8px;
  font: inherit;
  font-size: 0.82rem;
  box-sizing: border-box;
}
.jtl-book-nr-input:focus {
  outline: none;
  border-color: var(--w11-accent);
  box-shadow: 0 0 0 1px var(--w11-accent);
}
.jtl-book-meta {
  flex-shrink: 0;
  margin-left: auto;
  font-size: 0.7rem;
  color: var(--w11-muted);
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jtl-book-zoom-lbl {
  font-size: 0.7rem;
  color: var(--w11-muted);
  min-width: 2.6rem;
  text-align: right;
  margin-left: 4px;
}
.jtl-ico-btn {
  appearance: none;
  width: 30px;
  height: 28px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-text);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
}
.jtl-ico-btn:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, transparent);
  border-color: color-mix(in srgb, var(--w11-accent) 28%, transparent);
}
.jtl-ico-btn:disabled {
  opacity: 0.4;
  cursor: default;
  pointer-events: none;
}
.jtl-ico-btn.jtl-ico-primary {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  color: var(--w11-text);
}
.jtl-ico-btn.jtl-ico-primary:hover:not(:disabled) {
  background: color-mix(in srgb, var(--w11-accent) 34%, var(--w11-window-bg));
}
.jtl-book-body {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr minmax(150px, 200px);
}
.jtl-book-pdf {
  overflow: auto;
  background: color-mix(in srgb, var(--w11-win-body) 82%, var(--w11-text));
  cursor: grab;
  min-width: 0;
}
.jtl-book-pdf.dragging { cursor: grabbing; }
.jtl-book-pages {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 16px;
}
.jtl-page-canvas {
  background: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  opacity: 1 !important;
}
.jtl-book-side {
  border-left: 1px solid var(--w11-stroke, var(--w11-win-border));
  background: var(--w11-window-bg);
  color: var(--w11-text);
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.jtl-book-side-h {
  padding: 6px 8px 4px;
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.jtl-book-side-h strong {
  display: block;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.jtl-book-inv-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 2px 4px 6px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.jtl-book-empty {
  padding: 10px 6px;
  color: var(--w11-muted);
  font-size: 0.75rem;
  line-height: 1.35;
}
.jtl-inv-item {
  appearance: none;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  background: transparent;
  text-align: left;
  padding: 3px 6px;
  border-radius: 0;
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--w11-text);
  line-height: 1.25;
  min-height: 0;
}
.jtl-inv-item:last-child { border-bottom: 0; }
.jtl-inv-item:hover {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.jtl-inv-item.selected {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  color: var(--w11-text);
  box-shadow: inset 2px 0 0 var(--w11-accent);
}
#taskbar-booking-wrap .tb-booking-ico {
  display: block;
  filter: drop-shadow(0 0 0.5px rgba(0,0,0,.35));
}
.tb-dms-stack {
  position: relative;
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
}
.tb-dms-stack .tb-dms-ico {
  display: block;
  width: 18px;
  height: 18px;
  filter: drop-shadow(0 0 0.5px rgba(0,0,0,.35));
}
.tb-dms-spin-badge {
  position: absolute;
  right: -5px;
  bottom: -4px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #0078d4;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}
.tb-dms-spin {
  display: block;
  animation: tb-dms-spin 0.85s linear infinite;
  transform-origin: 50% 50%;
}
@keyframes tb-dms-spin {
  to { transform: rotate(360deg); }
}
#taskbar-booking-badge:not([hidden]) {
  background: #c42b1c;
}

/* -- RoboTask (theme tokens) ----------------------------------------------- */
.win-app-btn.danger {
  border-color: #a52316 !important;
  color: #fff !important;
  background: linear-gradient(180deg, #e81123, #c50f1f) !important;
}
.w11-win-body #acc-robotask.w11-hosted,
.w11-win-body #acc-robotask-edit.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.w11-win-body #acc-robotask .rt-shell,
.w11-win-body #acc-robotask-edit .rt-edit-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  position: relative;
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
}
.rt-shell, .rt-edit-shell { font-size: 0.82rem; }
.rt-toolbar-sep { width: 1px; height: 20px; background: var(--w11-stroke); margin: 0 2px; }
.rt-check { display: inline-flex; align-items: center; gap: 6px; font-size: 0.82rem; color: var(--w11-text); cursor: pointer; }
.rt-hint { font-size: 0.76rem; color: var(--w11-muted); margin: 0 0 8px; line-height: 1.4; }
.rt-hint code { color: var(--w11-accent); }
.rt-ico {
  width: 24px; height: 24px; flex-shrink: 0;
  border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-win-body); color: var(--w11-text);
  cursor: pointer; font: inherit; line-height: 1;
}
.rt-ico:hover { border-color: var(--w11-accent); color: var(--w11-accent); }
.rt-empty, .rt-empty-sm, .rt-empty-row { padding: 24px 12px; text-align: center; color: var(--w11-muted); }
.rt-empty-sm { padding: 12px; font-size: 0.82rem; }

/* -- Main window: tree + table + log --------------------------------------- */
.rt-workspace { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.rt-upper { flex: 1; min-height: 0; display: flex; overflow: hidden; }
.rt-tree-pane {
  width: 220px; flex-shrink: 0; display: flex; flex-direction: column; min-height: 0;
  border-right: 1px solid var(--w11-stroke); background: var(--w11-window-bg);
}
.rt-tree { flex: 1; min-height: 0; overflow: auto; padding: 4px; }
.rt-tree-item {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 8px 5px calc(8px + var(--rt-depth, 0) * 14px);
  border-radius: 3px; cursor: pointer; color: var(--w11-text);
  font-size: 0.82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rt-tree-item:hover { background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg)); }
.rt-tree-item.selected {
  background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg));
  font-weight: 600;
}
.rt-tree-item.root { font-weight: 600; }
.rt-tree-item.rt-drop-over {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  outline: 1px solid var(--w11-accent);
}
.rt-tree-item.rt-dragging,
.rt-row.rt-dragging { opacity: 0.45; }
.rt-tree-ico { flex-shrink: 0; }
.rt-tree-label { overflow: hidden; text-overflow: ellipsis; }
.rt-tree-count {
  margin-left: auto; font-size: 0.68rem; padding: 0 6px; border-radius: 8px;
  background: color-mix(in srgb, var(--w11-accent) 70%, var(--w11-window-bg)); color: #fff;
}
.rt-tree-toolbar { display: flex; gap: 4px; padding: 6px; border-top: 1px solid var(--w11-stroke); flex-shrink: 0; }
.rt-tree-toolbar .win-app-btn { flex: 1; min-width: 0; padding: 0 4px; font-size: 0.72rem; height: 26px; }
.rt-table-pane { flex: 1; min-width: 0; overflow: auto; background: var(--w11-win-body); }
.rt-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.rt-table thead th {
  position: sticky; top: 0; z-index: 1;
  text-align: left; padding: 7px 10px; background: var(--w11-titlebar);
  color: var(--w11-muted); font-weight: 600; border-bottom: 1px solid var(--w11-stroke);
  white-space: nowrap;
}
.rt-table tbody td {
  padding: 6px 10px; border-bottom: 1px solid var(--w11-stroke); color: var(--w11-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px;
}
.rt-row { cursor: grab; }
.rt-row:active { cursor: grabbing; }
.rt-row:hover { background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-win-body)); }
.rt-row.selected { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-win-body)); }
.rt-status-badge { display: inline-flex; align-items: center; gap: 5px; }
.rt-status-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--w11-muted); flex-shrink: 0; }
.rt-status-badge.ok::before, .rt-status-badge.running::before { background: #107c10; }
.rt-status-badge.error::before { background: #e81123; }
.rt-status-badge.warn::before { background: #f7a828; }
.rt-status-badge.off::before { background: #8a8a8a; }
.rt-log-pane {
  height: 160px; flex-shrink: 0; display: flex; flex-direction: column; min-height: 0;
  border-top: 1px solid var(--w11-stroke); background: var(--w11-window-bg);
}
.rt-log-head {
  padding: 5px 10px; font-size: 0.72rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.04em; color: var(--w11-muted); border-bottom: 1px solid var(--w11-stroke); flex-shrink: 0;
}
.rt-log { flex: 1; min-height: 0; overflow: auto; padding: 4px 10px; font-family: Consolas, "Courier New", monospace; font-size: 0.76rem; }
.rt-log-line { display: flex; gap: 8px; padding: 2px 0; color: var(--w11-text); }
.rt-log-ts { color: var(--w11-muted); flex-shrink: 0; }
.rt-log-warn .rt-log-msg { color: #b9770e; }
.rt-log-error .rt-log-msg { color: #e81123; }
.rt-log-empty { padding: 10px; color: var(--w11-muted); }

/* -- Editor window ---------------------------------------------------------- */
.rt-edit-head { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--w11-stroke); flex-shrink: 0; }
.rt-edit-name-wrap { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 3px; }
.rt-edit-name-wrap span { font-size: 0.72rem; font-weight: 600; color: var(--w11-muted); }
.rt-edit-name {
  height: 30px; padding: 0 10px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text); font: inherit; font-size: 0.95rem; font-weight: 600;
}
.rt-edit-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--w11-stroke); padding: 0 8px; flex-shrink: 0; }
.rt-tab {
  appearance: none; border: 0; background: transparent; color: var(--w11-muted);
  padding: 8px 14px; cursor: pointer; font: inherit; font-size: 0.84rem; border-bottom: 2px solid transparent;
}
.rt-tab.active { color: var(--w11-text); border-bottom-color: var(--w11-accent); font-weight: 600; }
.rt-tab:hover { color: var(--w11-text); background: color-mix(in srgb, var(--w11-accent) 10%, transparent); }
.rt-edit-body { flex: 1; min-height: 0; overflow: auto; padding: 12px 14px 16px; background: var(--w11-win-body); color: var(--w11-text); display: flex; flex-direction: column; }
.rt-edit-body > .rt-trg-split { flex: 1; min-height: 360px; }

/* -- Actions tab: palette + steps -------------------------------------------- */
.rt-actions-split { display: grid; grid-template-columns: 260px 1fr; gap: 12px; height: 100%; min-height: 460px; }
.rt-palette { display: flex; flex-direction: column; min-height: 0; border: 1px solid var(--w11-stroke); border-radius: 4px; background: var(--w11-window-bg); overflow: hidden; }
.rt-palette-search { padding: 8px; border-bottom: 1px solid var(--w11-stroke); flex-shrink: 0; }
.rt-palette-search input, .rt-steps-toolbar input[type="search"] {
  width: 100%; height: 28px; padding: 0 8px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-win-body); color: var(--w11-text); font: inherit; font-size: 0.8rem;
}
.rt-palette-groups { flex: 1; min-height: 0; overflow: auto; padding: 4px; }
.rt-pal-group { margin-bottom: 2px; }
.rt-pal-group-head {
  width: 100%; text-align: left; display: flex; align-items: center; gap: 6px;
  padding: 6px 8px; border: 0; background: transparent; color: var(--w11-text);
  font: inherit; font-size: 0.78rem; font-weight: 600; cursor: pointer; border-radius: 3px;
  text-transform: uppercase; letter-spacing: 0.03em;
}
.rt-pal-group-head:hover { background: color-mix(in srgb, var(--w11-accent) 10%, transparent); }
.rt-pal-caret { color: var(--w11-muted); width: 10px; display: inline-block; }
.rt-pal-group.collapsed .rt-pal-group-body { display: none; }
.rt-pal-item {
  display: flex; align-items: center; gap: 4px;
  padding: 5px 10px 5px 12px; margin: 1px 0; border-radius: 3px; cursor: grab;
  font-size: 0.8rem; color: var(--w11-text); border: 1px solid transparent;
}
.rt-pal-item:hover { background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)); border-color: color-mix(in srgb, var(--w11-accent) 30%, var(--w11-stroke)); }
.rt-pal-item.dragging { opacity: 0.4; }
.rt-steps-pane { display: flex; flex-direction: column; min-height: 0; border: 1px solid var(--w11-stroke); border-radius: 4px; background: var(--w11-window-bg); overflow: hidden; }
.rt-steps-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 8px; border-bottom: 1px solid var(--w11-stroke); flex-shrink: 0; }
.rt-steps-toolbar input[type="search"] { flex: 1; min-width: 140px; }
.rt-steps-list { flex: 1; min-height: 0; overflow: auto; padding: 2px 0; }
.rt-step {
  position: relative; display: flex; align-items: center; gap: 8px;
  padding: 5px 10px 5px calc(10px + var(--rt-depth, 0) * 18px);
  border-bottom: 1px solid var(--w11-stroke); cursor: pointer; color: var(--w11-text); font-size: 0.82rem;
  user-select: none; -webkit-user-select: none;
}
.rt-step[data-family="if"] { background: color-mix(in srgb, var(--w11-accent) calc(4% + var(--rt-depth, 0) * 3%), var(--w11-window-bg)); }
.rt-step[data-family="loop"] { background: color-mix(in srgb, #e8880a calc(4% + var(--rt-depth, 0) * 3%), var(--w11-window-bg)); }
.rt-step:hover { filter: brightness(1.06); }
.rt-step.selected { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)) !important; }
.rt-step.disabled { opacity: 0.5; }
.rt-step.dragging { opacity: 0.35; }
.rt-step.drop-before::before, .rt-step.drop-after::after {
  content: ""; position: absolute; left: 6px; right: 6px; height: 2px;
  background: var(--w11-accent); border-radius: 1px;
}
.rt-step.drop-before::before { top: -1px; }
.rt-step.drop-after::after { bottom: -1px; }
.rt-steps-list.drop-empty { outline: 2px dashed var(--w11-accent); outline-offset: -2px; }
.rt-step-drag { color: var(--w11-muted); cursor: grab; flex-shrink: 0; }
.rt-step-num { color: var(--w11-muted); font-variant-numeric: tabular-nums; flex-shrink: 0; width: 26px; }
.rt-step-enable { flex-shrink: 0; }
.rt-step-label {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  user-select: none; -webkit-user-select: none; flex: 1; min-width: 0;
}
.rt-steps-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; border-top: 1px solid var(--w11-stroke); flex-shrink: 0; }
.rt-steps-actions .win-app-btn { height: 26px; padding: 0 10px; font-size: 0.76rem; }

/* -- Settings / Vars / Notes / Triggers tabs -------------------------------- */
.rt-settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; max-width: 760px; }
.rt-field { display: flex; flex-direction: column; gap: 4px; margin-bottom: 4px; }
.rt-field.rt-field-wide, .rt-field.span-2 { grid-column: 1 / -1; }
.rt-field span { font-size: 0.76rem; color: var(--w11-muted); font-weight: 600; }
.rt-field select, .rt-field input, .rt-field textarea,
.rt-trigger-grid input, .rt-trigger-grid select {
  height: 28px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text); font: inherit; font-size: 0.82rem; padding: 0 8px;
}
.rt-field textarea { height: auto; min-height: 70px; padding: 8px; width: 100%; resize: vertical; }
.rt-notes {
  width: 100%; height: 100%; min-height: 320px; padding: 10px; resize: vertical;
  border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text); font: inherit; font-size: 0.85rem;
}
.rt-trigger-card { border: 1px solid var(--w11-stroke); border-radius: 4px; padding: 12px 14px; margin-bottom: 12px; background: var(--w11-window-bg); }
.rt-trigger-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.rt-trigger-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 0.76rem; color: var(--w11-muted); font-weight: 600; }

/* Ausl?ser-Zweispaltiges Layout */
.rt-trg-split {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px;
  height: 100%; min-height: 0; max-height: 100%;
}
.rt-trg-pane {
  display: flex; flex-direction: column; min-height: 0; min-width: 0;
  border: 1px solid var(--w11-stroke); border-radius: 4px; background: var(--w11-window-bg); overflow: hidden;
}
.rt-trg-pane-head {
  padding: 8px 10px; font-size: 0.78rem; font-weight: 600; color: var(--w11-muted);
  border-bottom: 1px solid var(--w11-stroke); background: var(--w11-titlebar); flex-shrink: 0;
}
.rt-trg-search { padding: 8px; border-bottom: 1px solid var(--w11-stroke); flex-shrink: 0; }
.rt-trg-search input { width: 100%; height: 28px; border: 1px solid var(--w11-stroke); border-radius: 3px; background: var(--w11-win-body); color: var(--w11-text); padding: 0 8px; font: inherit; font-size: 0.8rem; }
.rt-trg-avail-list, .rt-trg-task-list { flex: 1; min-height: 0; overflow: auto; padding: 4px; }
.rt-trg-group { margin-bottom: 6px; }
.rt-trg-group-head { padding: 4px 8px; font-size: 0.76rem; font-weight: 600; color: var(--w11-muted); }
.rt-trg-avail, .rt-trg-task {
  display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 3px;
  cursor: pointer; font-size: 0.82rem; color: var(--w11-text); user-select: none;
}
.rt-trg-avail:hover, .rt-trg-task:hover { background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg)); }
.rt-trg-avail.selected, .rt-trg-task.selected { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)); }
.rt-trg-avail.disabled { opacity: 0.45; }
.rt-trg-ico { flex-shrink: 0; width: 1.2em; text-align: center; }
.rt-trg-task-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rt-trg-mid { display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.rt-trg-mid .win-app-btn { min-width: 40px; }
.rt-trg-task-opts { padding: 8px 10px; border-top: 1px solid var(--w11-stroke); display: flex; flex-direction: column; gap: 6px; flex-shrink: 0; }
.rt-trg-task-toolbar { display: flex; gap: 6px; padding: 8px; border-top: 1px solid var(--w11-stroke); flex-shrink: 0; }

/* File-Monitor Dialog (Tabs werden von .rt-win-tabs gestylt) */
.rt-fm-dlg { width: min(720px, 100%); }
.rt-fm-folders { margin-bottom: 12px; }
.rt-fm-folders-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.rt-fm-folders-head strong { color: var(--w11-text); }
.rt-fm-folder-btns { display: flex; gap: 4px; }
.rt-fm-folder-btns .win-app-btn { min-width: 28px; height: 26px; padding: 0 6px; }
.rt-fm-folder-list {
  border: 1px solid var(--w11-stroke); border-radius: 3px; min-height: 90px; max-height: 140px; overflow: auto;
  background: var(--w11-window-bg);
}
.rt-fm-folder-item { display: flex; align-items: center; gap: 6px; padding: 5px 8px; cursor: pointer; font-size: 0.8rem; color: var(--w11-text); }
.rt-fm-folder-item:hover { background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)); }
.rt-fm-folder-item.selected { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)); }
.rt-fm-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 10px 0; }
.rt-fm-filters .rt-check { display: flex; margin-bottom: 4px; }
.rt-fm-chg-hint { margin: 0 0 6px; }
.rt-fm-chg-opts.disabled, .rt-fm-block.disabled { opacity: 0.45; pointer-events: none; }
.rt-fm-indent { margin: 6px 0 10px 22px; }
.rt-fm-adv { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin-bottom: 16px; }
.rt-fm-adv .rt-dlg-hint { margin-left: 22px; }

.rt-vars-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; margin-bottom: 10px; }
.rt-vars-table th { text-align: left; padding: 6px 8px; color: var(--w11-muted); border-bottom: 1px solid var(--w11-stroke); }
.rt-vars-table td { padding: 4px 8px; border-bottom: 1px solid var(--w11-stroke); color: var(--w11-text); }
.rt-vars-table input {
  width: 100%; height: 26px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-win-body); color: var(--w11-text); padding: 0 6px; font: inherit;
}

/* -- Action dialogs: Windows-klassisch (dunkel, lesbar, ohne Scrollleisten) --- */
.rt-dlg-backdrop {
  position: fixed; inset: 0; z-index: 12000; display: flex; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, 0.45); padding: 20px; overflow: hidden;
}
.rt-dlg,
.rt-win-dlg,
.rt-action-shell.rt-action-native {
  --rt-face: #2b2b2b;
  --rt-face-2: #323232;
  --rt-input: #1e1e1e;
  --rt-text: #f3f3f3;
  --rt-muted: #c8c8c8;
  --rt-border: #5a5a5a;
  --rt-border-dark: #6e6e6e;
  --rt-tab: #3a3a3a;
  --rt-tab-on: #2b2b2b;
  --rt-btn-face: #3c3c3c;
  --rt-btn-hover: #454545;
  --rt-btn-border: #6a6a6a;
  --rt-accent: #4cc2ff;
  font-family: "Segoe UI", "Segoe UI Variable", Tahoma, sans-serif;
  font-size: 13px;
  line-height: 1.35;
  color: var(--rt-text);
  background: var(--rt-face) !important;
  -webkit-font-smoothing: antialiased;
}
.rt-dlg {
  width: min(640px, 100%); display: flex; flex-direction: column;
  border: 1px solid #1a1a1a; border-radius: 0;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.55); overflow: hidden;
}
.rt-dlg.rt-dlg-wide { width: min(760px, 100%); }
.rt-dlg.rt-dlg-tall { width: min(720px, 100%); }
.rt-action-shell.rt-action-native {
  display: flex; flex-direction: column; height: 100%; min-height: 0;
  border: 0; box-shadow: none; overflow: hidden;
}
.rt-action-native-head { flex-shrink: 0; }
.rt-action-native-body {
  flex: 1; min-height: 0; overflow: hidden !important;
  padding: 12px 14px 10px;
  background: var(--rt-face) !important; color: var(--rt-text) !important;
  scrollbar-width: none;
}
.rt-action-native-body::-webkit-scrollbar { width: 0; height: 0; display: none; }
.rt-action-native-foot { flex-shrink: 0; }

/* Klassische Windows-Tabs (dunkel) */
.rt-win-tabs,
.rt-mail-tabs,
.rt-fm-tabs {
  display: flex; flex-wrap: nowrap; align-items: flex-end; gap: 0;
  margin: 0 0 12px; padding: 0 2px;
  border-bottom: 1px solid var(--rt-border-dark);
  background: transparent;
}
.rt-win-tab,
.rt-mail-tab,
.rt-fm-tab {
  position: relative; z-index: 0;
  border: 1px solid var(--rt-border-dark);
  border-bottom: 0;
  border-radius: 3px 3px 0 0;
  background: var(--rt-tab);
  color: var(--rt-text);
  padding: 6px 12px 5px;
  margin: 0 2px -1px 0;
  font: inherit; font-size: 13px; cursor: pointer;
  line-height: 1.25; white-space: nowrap;
}
.rt-win-tab:hover,
.rt-mail-tab:hover,
.rt-fm-tab:hover { background: #444; color: #fff; }
.rt-win-tab.is-on,
.rt-win-tab.active,
.rt-mail-tab.is-on,
.rt-fm-tab.active {
  z-index: 1;
  background: var(--rt-tab-on);
  font-weight: 600;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--rt-tab-on);
  color: #fff;
}
.rt-mail-body-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; margin-bottom: 4px;
}
.rt-mail-body-lab {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
}
.rt-mail-att-actions { display: flex; gap: 8px; margin: 6px 0 0 118px; }
.rt-mail-creds {
  border: 1px solid var(--rt-border);
  border-radius: 0;
  padding: 10px 10px 4px;
  margin-top: 6px;
  background: var(--rt-face-2);
}
.rt-path-roots {
  display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 12px 0;
  background: var(--rt-face);
}
.rt-path-root {
  border: 1px solid var(--rt-border); background: var(--rt-btn-face); color: var(--rt-text);
  border-radius: 0; padding: 3px 8px; font: inherit; font-size: 13px; cursor: pointer;
}
.rt-path-root:hover { background: var(--rt-btn-hover); border-color: var(--rt-accent); }
.rt-var-sp td { opacity: 0.92; }
.rt-dlg-head {
  display: flex; align-items: center; gap: 8px;
  height: 32px; min-height: 32px; padding: 0 0 0 10px;
  background: linear-gradient(180deg, #3a3a3a 0%, #2f2f2f 100%) !important;
  color: #fff !important;
  border-bottom: 1px solid #1f1f1f;
  flex-shrink: 0;
}
.rt-dlg-head.rt-dlg-drag,
.rt-dlg-head.sm-electron-drag { cursor: move; user-select: none; }
.rt-dlg-head strong {
  flex: 1; font-size: 13px; font-weight: 600; color: #fff; pointer-events: none;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  letter-spacing: 0.01em;
}
.rt-dlg-title-ico,
.rt-dlg-head .rt-ib-img.rt-dlg-title-ico {
  width: 16px; height: 16px; flex-shrink: 0; pointer-events: none;
}
.rt-dlg-win-btns {
  display: flex; align-items: stretch; height: 32px; margin-left: auto; flex-shrink: 0;
}
.rt-dlg-win-btn {
  width: 46px; height: 32px; border: 0; border-radius: 0; background: transparent;
  color: #e8e8e8; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  padding: 0;
}
.rt-dlg-win-btn:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.rt-dlg-win-btn.rt-dlg-win-close:hover { background: #c42b1c; color: #fff; }
.rt-dlg-close {
  width: 46px; height: 32px; border: 0; border-radius: 0; background: transparent;
  color: #e8e8e8; cursor: pointer; font-size: 14px; line-height: 1; margin-left: auto;
}
.rt-dlg-close:hover { background: #c42b1c; color: #fff; }
.rt-dlg-body {
  flex: 1; min-height: 0; overflow: hidden !important; padding: 12px 14px 10px;
  background: var(--rt-face) !important; color: var(--rt-text) !important;
  scrollbar-width: none;
}
.rt-dlg-body::-webkit-scrollbar { width: 0; height: 0; display: none; }
.rt-win-form { display: flex; flex-direction: column; gap: 0; }

/* Label links, Feld rechts — wie Original-RoboTask */
.rt-dlg-field {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 6px 10px;
  align-items: center;
  margin-bottom: 7px;
}
.rt-dlg-field.disabled { opacity: 0.5; }
.rt-dlg-field.rt-dlg-field-offset {
  grid-template-columns: 118px minmax(0, 1fr);
}
.rt-dlg-field.rt-dlg-field-stack {
  grid-template-columns: 1fr;
  align-items: stretch;
  margin-top: 8px;
}
.rt-dlg-lab,
.rt-dlg-field > label,
.rt-dlg-field label.rt-dlg-lab {
  font-size: 13px; color: var(--rt-text); font-weight: 400;
  text-align: right; justify-self: end;
  display: inline-flex; align-items: center; justify-content: flex-end; gap: 4px;
  margin: 0; line-height: 1.3;
}
.rt-dlg-ctl-wrap { min-width: 0; width: 100%; }
.rt-dlg-ctl-wrap-full { width: 100%; }
.rt-radio-group { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; }
.rt-radio-group .rt-check { font-weight: 400; color: var(--rt-text); }
.rt-dlg .rt-check,
.rt-win-dlg .rt-check {
  color: var(--rt-text); font-weight: 400; font-size: 13px;
  display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
}
.rt-dlg input[type="checkbox"],
.rt-dlg input[type="radio"],
.rt-win-dlg input[type="checkbox"],
.rt-win-dlg input[type="radio"] {
  width: 14px; height: 14px; accent-color: var(--rt-accent); flex-shrink: 0;
}
.rt-dlg-ctl {
  width: 100%; height: 26px; border: 1px solid var(--rt-border-dark); border-radius: 0;
  background: var(--rt-input) !important; color: var(--rt-text) !important;
  font: inherit; font-size: 13px; padding: 0 6px;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.25);
}
.rt-dlg-ctl::placeholder { color: #9a9a9a; }
.rt-dlg-ctl:focus {
  outline: 1px solid var(--rt-accent); outline-offset: 0; border-color: var(--rt-accent);
}
textarea.rt-dlg-ctl {
  height: auto; min-height: 0; padding: 6px; resize: none;
  line-height: 1.4; overflow: hidden;
}
select.rt-dlg-ctl { padding-right: 22px; }
.rt-dlg-section { margin: 8px 0 6px; font-weight: 600; color: var(--rt-muted); font-size: 13px; }
.rt-dlg-hint { font-size: 12px; color: var(--rt-muted); line-height: 1.35; margin: 0 0 8px; }

/* Windows-Buttons (dunkel) — Text immer vollständig sichtbar */
.rt-win-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  box-sizing: border-box;
  min-width: 80px; width: auto; max-width: none;
  min-height: 28px; height: auto;
  padding: 4px 14px;
  border: 1px solid var(--rt-btn-border) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #454545 0%, #383838 100%) !important;
  color: #f3f3f3 !important;
  font: inherit; font-size: 13px; line-height: 1.25; cursor: pointer;
  white-space: nowrap; overflow: visible; text-overflow: clip;
  flex-shrink: 0;
  box-shadow: none !important;
}
.rt-win-btn:hover {
  background: linear-gradient(180deg, #505050 0%, #404040 100%) !important;
  border-color: var(--rt-accent) !important;
  color: #fff !important;
}
.rt-win-btn:active { background: #303030 !important; }
.rt-win-btn.rt-win-btn-fit {
  min-width: max(80px, fit-content);
  padding: 4px 18px;
}
/* Passwort-Feld ohne type=password (Autofill-Schutz), optisch wie Password */
.rt-win-dlg #em-smtp-secret {
  -webkit-text-security: disc;
  text-security: disc;
}
.rt-win-dlg #em-smtp-secret[data-rt-pw-plain="1"] {
  -webkit-text-security: none;
  text-security: none;
}
.rt-win-btn.rt-win-var {
  min-width: 34px; width: 34px; min-height: 28px; height: 28px; padding: 0;
  font-weight: 700; font-family: Consolas, "Cascadia Mono", monospace;
}
.rt-win-btn-ico,
.rt-win-btn .rt-ib-img {
  width: 14px; height: 14px; flex-shrink: 0;
}
.rt-win-ok { min-width: 92px; }
.rt-win-cancel { min-width: 92px; }
.rt-dlg-foot .rt-win-btn,
.rt-mail-att-actions .rt-win-btn {
  white-space: nowrap;
}
.rt-sql-test-bar {
  display: flex; align-items: center; gap: 10px; margin: 10px 0 6px;
}
.rt-sql-result {
  margin-top: 6px; max-height: 180px; overflow: hidden;
  border: 1px solid var(--rt-border); border-radius: 0;
  background: var(--rt-input);
}
.rt-sql-meta {
  padding: 6px 8px; font-size: 12px; color: var(--rt-muted);
  border-bottom: 1px solid var(--rt-border); background: var(--rt-face-2);
}
.rt-sql-table-wrap { overflow: hidden; }
.rt-sql-table {
  width: 100%; border-collapse: collapse; font-size: 12px;
}
.rt-sql-table th, .rt-sql-table td {
  padding: 3px 8px; border-bottom: 1px solid #3a3a3a;
  text-align: left; white-space: nowrap; max-width: 280px;
  overflow: hidden; text-overflow: ellipsis; color: var(--rt-text);
}
.rt-sql-table th {
  position: sticky; top: 0; background: #3a3a3a; font-weight: 600;
}
.rt-sql-pre {
  margin: 0; padding: 8px; font-family: Consolas, "Cascadia Mono", monospace;
  font-size: 12px; white-space: pre-wrap; word-break: break-word; color: var(--rt-text);
}
.rt-sql-pre.rt-sql-err { color: #ff6b6b; }
.rt-dlg:has(#sql-conn) { width: min(720px, 94vw); }

/* nativer Aktions-Host */
#acc-robotask-action,
#acc-robotask-action .win-app-shell {
  background: #2b2b2b !important;
  color: #f3f3f3 !important;
  overflow: hidden !important;
  height: 100%;
}
.rt-dlg-field-del {
  width: 16px; height: 16px; border: 0; border-radius: 0; background: transparent; color: #aaa;
  cursor: pointer; font-size: 12px; line-height: 1;
}
.rt-dlg-field-del:hover { color: #ff6b6b; }
.rt-dlg-add-field { display: flex; gap: 8px; margin: 8px 0 0 118px; }
.rt-dlg-add-field input { flex: 1; }
.rt-dlg-foot {
  display: flex; align-items: center; gap: 8px; padding: 10px 12px;
  background: var(--rt-face-2) !important;
  border-top: 1px solid #1f1f1f;
  flex-shrink: 0;
}
.rt-dlg-spacer { flex: 1; }
/* Legacy win-app-btn in Dialogen → Windows-Look */
.rt-dlg .win-app-btn,
.rt-win-dlg .win-app-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  box-sizing: border-box;
  min-width: 80px; width: auto;
  min-height: 28px; height: auto;
  padding: 4px 14px;
  border: 1px solid var(--rt-btn-border) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #454545 0%, #383838 100%) !important;
  color: #f3f3f3 !important;
  font-size: 13px !important; line-height: 1.25 !important;
  white-space: nowrap; overflow: visible;
  flex-shrink: 0;
  box-shadow: none !important;
}
.rt-dlg .win-app-btn:hover,
.rt-win-dlg .win-app-btn:hover {
  background: linear-gradient(180deg, #505050 0%, #404040 100%) !important;
  border-color: var(--rt-accent) !important;
  color: #fff !important;
}
.rt-dlg .win-app-btn.primary,
.rt-win-dlg .win-app-btn.primary {
  border-color: var(--rt-btn-border) !important;
  background: linear-gradient(180deg, #454545 0%, #383838 100%) !important;
  color: #f3f3f3 !important;
}
.rt-dlg .win-app-btn.primary:hover { filter: none; border-color: var(--rt-accent) !important; }

/* Path-Picker / Combobox in Windows-Dialogen */
.rt-win-dlg .rt-path-field,
.rt-dlg .rt-path-field {
  display: flex; gap: 4px; align-items: center; width: 100%;
}
.rt-win-dlg .rt-combo,
.rt-dlg .rt-combo { width: 100%; }
.rt-win-dlg .rt-combo-menu,
.rt-dlg .rt-combo-menu {
  background: #1e1e1e; color: #f3f3f3; border: 1px solid #6e6e6e;
}

.rt-var-browser-backdrop { z-index: 14000; }
.rt-var-browser {
  width: min(720px, 96vw);
  height: min(560px, 90vh);
  max-height: min(560px, 90vh);
  display: flex; flex-direction: column;
}
.rt-vb-tabs {
  display: flex; gap: 2px; padding: 8px 10px 0;
  background: var(--w11-win-body); border-bottom: 1px solid var(--w11-stroke); flex-shrink: 0;
}
.rt-vb-tab {
  border: 1px solid var(--w11-stroke); border-bottom: 0; border-radius: 3px 3px 0 0;
  background: var(--w11-window-bg); color: var(--w11-muted); padding: 6px 12px; cursor: pointer;
  font: inherit; font-size: 0.78rem; margin-bottom: -1px;
}
.rt-vb-tab.active {
  background: var(--w11-win-body); font-weight: 600; border-bottom: 1px solid var(--w11-win-body); color: var(--w11-text);
}
.rt-vb-toolbar {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  border-bottom: 1px solid var(--w11-stroke); font-size: 0.78rem; color: var(--w11-muted);
  background: var(--w11-win-body); flex-shrink: 0;
}
.rt-vb-spacer { flex: 1; }
.rt-vb-toolbar input {
  height: 26px; border: 1px solid var(--w11-stroke); border-radius: 3px; background: var(--w11-window-bg);
  color: var(--w11-text); padding: 0 8px; font: inherit; min-width: 180px;
}
.rt-vb-body {
  display: grid; grid-template-columns: 200px 1fr; min-height: 0; flex: 1; overflow: hidden;
  background: var(--w11-win-body);
}
.rt-vb-cats {
  border-right: 1px solid var(--w11-stroke); overflow: auto; background: var(--w11-window-bg); padding: 4px; min-height: 0;
}
.rt-vb-cat {
  display: block; width: 100%; text-align: left; border: 0; border-radius: 3px; padding: 5px 8px;
  background: transparent; color: var(--w11-text); font: inherit; font-size: 0.78rem; cursor: pointer;
}
.rt-vb-cat:hover { background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)); }
.rt-vb-cat.selected { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)); font-weight: 600; }
.rt-vb-list-wrap { overflow: auto; background: var(--w11-win-body); min-height: 0; }
.rt-vb-table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.rt-vb-table th {
  position: sticky; top: 0; text-align: left; padding: 6px 10px; background: var(--w11-titlebar);
  color: var(--w11-muted); border-bottom: 1px solid var(--w11-stroke);
}
.rt-vb-table td { padding: 5px 10px; border-bottom: 1px solid var(--w11-stroke); color: var(--w11-text); }
.rt-vb-row { cursor: pointer; }
.rt-vb-row:hover { background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-win-body)); }
.rt-vb-row.selected { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-win-body)); }
.rt-vb-preview { padding: 8px 12px; border-top: 1px solid var(--w11-stroke); flex-shrink: 0; background: var(--w11-win-body); }
.rt-vb-preview input {
  width: 100%; height: 28px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text); padding: 0 8px; font: inherit; font-size: 0.8rem;
}
.rt-var-browser .rt-dlg-foot { flex-shrink: 0; }

.rt-combo { position: relative; display: flex; gap: 0; align-items: stretch; }
.rt-combo .rt-combo-input {
  flex: 1; border-top-right-radius: 0; border-bottom-right-radius: 0;
  background: var(--w11-window-bg); color: var(--w11-text); border-color: var(--w11-stroke);
}
.rt-combo-btn {
  width: 28px; flex-shrink: 0; border: 1px solid var(--w11-stroke); border-left: 0;
  border-radius: 0 3px 3px 0; background: var(--w11-window-bg); color: var(--w11-text); cursor: pointer;
}
.rt-combo-btn:hover { background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg)); }
.rt-combo-menu {
  position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 5;
  max-height: 200px; overflow: auto; background: var(--w11-window-bg); border: 1px solid var(--w11-stroke);
  border-radius: 4px; box-shadow: 0 8px 20px rgba(0,0,0,0.28); padding: 4px;
}
.rt-combo-opt {
  display: block; width: 100%; text-align: left; border: 0; border-radius: 3px; padding: 6px 8px;
  background: transparent; color: var(--w11-text); font: inherit; font-size: 0.8rem; cursor: pointer;
}
.rt-combo-opt:hover { background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg)); }
.rt-path-field { display: flex; gap: 6px; align-items: flex-start; }
.rt-path-field .rt-dlg-ctl { flex: 1; min-width: 0; }
.rt-path-browse { flex-shrink: 0; height: 28px; min-width: 36px; padding: 0 10px; }
.rt-path-picker-backdrop { z-index: 13000; }
.rt-path-picker { width: min(560px, 100%); max-height: min(720px, 92vh); }
.rt-path-picker-bar {
  display: flex; gap: 6px; padding: 10px 14px 0; align-items: center;
  background: var(--w11-win-body);
}
.rt-path-picker-bar .rt-dlg-ctl { flex: 1; }
.rt-path-picker-list {
  margin: 10px 14px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  min-height: 240px; max-height: 360px; overflow: auto; background: var(--w11-window-bg);
}
.rt-pp-row {
  display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
  padding: 6px 10px; border: 0; border-bottom: 1px solid var(--w11-stroke);
  background: transparent; color: var(--w11-text); font: inherit; font-size: 0.82rem; cursor: pointer;
}
.rt-pp-row:hover { background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)); }
.rt-pp-row.selected { background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)); }
.rt-pp-ico { flex-shrink: 0; }
.rt-pp-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rt-path-picker-sel {
  padding: 0 14px 8px; display: flex; flex-direction: column; gap: 4px;
  background: var(--w11-win-body);
}
.rt-path-picker-sel label { font-size: 0.76rem; color: var(--w11-muted); font-weight: 600; }

@media (max-width: 900px) {
  .rt-upper { flex-direction: column; }
  .rt-tree-pane { width: 100%; max-height: 160px; border-right: 0; border-bottom: 1px solid var(--w11-stroke); }
  .rt-actions-split { grid-template-columns: 1fr; grid-template-rows: 220px 1fr; }
  .rt-settings-grid, .rt-trigger-grid { grid-template-columns: 1fr; }
  .rt-trg-split { grid-template-columns: 1fr; grid-template-rows: 220px auto 1fr; }
  .rt-trg-mid { flex-direction: row; }
  .rt-vb-body { grid-template-columns: 1fr; }
  .rt-fm-filters { grid-template-columns: 1fr; }
}

/* Outlook Rules Manager */
.ol-rules-shell,
.ol-rule-edit-shell {
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.ol-rules-form { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.ol-rules-pad { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 8px; }
.ol-rules-folder-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  color: var(--w11-text); font-size: 0.82rem;
}
.ol-rules-folder-row select {
  min-width: 240px; height: 28px;
  background: var(--w11-window-bg); color: var(--w11-text);
  border: 1px solid var(--w11-stroke); border-radius: 2px; padding: 0 8px;
}
.ol-rules-toolbar {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.ol-rules-toolbar.secondary { padding-top: 2px; }
.ol-rules-toolbar .win-app-btn.icon { min-width: 32px; padding: 0 8px; }
.ol-rules-list-wrap {
  flex: 1; min-height: 140px; overflow: auto;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  border-radius: 2px;
}
.ol-rules-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.ol-rules-table th {
  text-align: left; padding: 6px 10px; font-weight: 600;
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-titlebar) 88%, var(--w11-window-bg));
  border-bottom: 1px solid var(--w11-stroke);
  position: sticky; top: 0; z-index: 1;
}
.ol-rules-col-act { width: 88px; text-align: center !important; }
.ol-rules-row td {
  padding: 5px 10px; border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  color: var(--w11-text); vertical-align: middle;
}
.ol-rules-row:hover { background: color-mix(in srgb, var(--w11-highlight) 55%, transparent); }
.ol-rules-row.is-selected {
  background: color-mix(in srgb, var(--w11-highlight) 85%, var(--w11-window-bg));
  outline: 1px solid color-mix(in srgb, var(--w11-accent) 40%, transparent);
}
.ol-rules-check { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.ol-rules-acts { text-align: center; white-space: nowrap; letter-spacing: 2px; }
.ol-rules-desc-label { font-size: 0.75rem; color: var(--w11-muted); margin-top: 2px; }
.ol-rules-desc {
  min-height: 72px; max-height: 120px; overflow: auto;
  padding: 8px 10px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border-radius: 2px;
  font-size: 0.8rem; line-height: 1.45;
}
.ol-rules-desc u {
  color: var(--w11-accent); text-decoration: underline; font-weight: 600;
}
.ol-rule-edit { display: flex; flex-direction: column; gap: 10px; }
.ol-rule-field { display: flex; flex-direction: column; gap: 4px; font-size: 0.82rem; }
.ol-rule-field input,
.ol-rule-grid input,
.ol-rule-grid select {
  height: 28px; padding: 0 8px;
  background: var(--w11-win-body); color: var(--w11-text);
  border: 1px solid var(--w11-stroke); border-radius: 2px; font: inherit;
}
.ol-rule-checkline { display: flex; align-items: center; gap: 8px; font-size: 0.82rem; }
.ol-rule-sec {
  margin: 8px 0 0; font-size: 0.86rem; font-weight: 600;
  color: var(--w11-text); border-bottom: 1px solid var(--w11-stroke); padding-bottom: 4px;
}
.ol-rule-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px;
}
.ol-rule-grid label { display: flex; flex-direction: column; gap: 3px; font-size: 0.78rem; color: var(--w11-text); }
.ol-rule-grid label span { color: var(--w11-muted); }
.ol-rule-checks {
  display: flex; flex-wrap: wrap; gap: 8px 14px; font-size: 0.78rem;
}
.ol-rule-checks label { display: flex; align-items: center; gap: 6px; color: var(--w11-text); }
@media (max-width: 640px) {
  .ol-rule-grid { grid-template-columns: 1fr; }
}
body.w11-desktop-mode .w11-win-body .ol-rules-list-wrap,
body.w11-desktop-mode .w11-win-body .ol-rules-desc,
body.w11-desktop-mode .w11-win-body .ol-rule-field input,
body.w11-desktop-mode .w11-win-body .ol-rule-grid input,
body.w11-desktop-mode .w11-win-body .ol-rule-grid select {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* ===== Outlook Post-it board ===== */
.ol-postit-app {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.ol-postit-ribbon { flex-shrink: 0; }
.ol-postit-stage-wrap {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.ol-postit-stage {
  position: absolute;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
}
.ol-postit-desk {
  position: absolute;
  inset: 0;
  background-color: #c4a574;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0.08), transparent 28%, rgba(0,0,0,0.12) 100%),
    url("/assets/img/cork-board.png");
  background-size: cover, 420px auto;
  background-position: center, center;
  background-repeat: no-repeat, repeat;
  box-shadow: inset 0 0 90px rgba(40, 22, 8, 0.38);
}
.ol-postit-desk::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 90% 70% at 50% 40%, transparent 40%, rgba(30, 18, 8, 0.22) 100%);
  pointer-events: none;
}
.ol-postit-board {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.ol-postit-empty {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-content: center;
  text-align: center;
  color: rgba(255, 246, 230, 0.92);
  text-shadow: 0 1px 2px rgba(0,0,0,0.35);
  pointer-events: none;
}
.ol-postit-empty .ol-muted { color: rgba(255,246,230,0.72); }

.ol-postit {
  --postit-bg: #f6d045;
  --postit-deep: #c9a012;
  --postit-ink: #2a2118;
  --postit-pin: #fdd835;
  --postit-rot: -1.5deg;
  position: absolute;
  width: min(168px, 18vw);
  aspect-ratio: 1 / 1.05;
  padding: 34px 14px 16px;
  border-radius: 4px;
  /* Solid paper color MUST be last layer ? gradients alone never show hue */
  background:
    radial-gradient(120% 80% at 16% 10%, rgba(255,255,255,0.35), transparent 46%),
    linear-gradient(180deg, transparent 72%, color-mix(in srgb, var(--postit-deep) 22%, transparent) 100%),
    var(--postit-bg) !important;
  background-color: var(--postit-bg) !important;
  color: var(--postit-ink);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.55) inset,
    0 -1px 0 color-mix(in srgb, var(--postit-deep) 35%, transparent) inset,
    0 10px 22px rgba(20, 12, 4, 0.22),
    0 2px 6px rgba(20, 12, 4, 0.16);
  transform: rotate(var(--postit-rot));
  cursor: grab;
  user-select: none;
  transition: box-shadow 0.2s ease, filter 0.2s ease, background 0.2s ease;
  filter: drop-shadow(0 6px 8px rgba(0,0,0,0.1));
}
.ol-postit[data-color="0"] { --postit-bg: #5BA3E0; --postit-deep: #2E6FAF; --postit-ink: #10233A; --postit-pin: #1E88E5; }
.ol-postit[data-color="1"] { --postit-bg: #8BC34A; --postit-deep: #558B2F; --postit-ink: #1B2E0E; --postit-pin: #43A047; }
.ol-postit[data-color="2"] { --postit-bg: #EF6A6A; --postit-deep: #C62828; --postit-ink: #3A1010; --postit-pin: #E53935; }
.ol-postit[data-color="3"] { --postit-bg: #F6D045; --postit-deep: #C9A012; --postit-ink: #2A2118; --postit-pin: #FDD835; }
.ol-postit[data-color="4"] { --postit-bg: #FFF8E7; --postit-deep: #E0C98A; --postit-ink: #2A2118; --postit-pin: #F5F5F5; }
.ol-postit[data-color="5"] { --postit-bg: #FFA726; --postit-deep: #EF6C00; --postit-ink: #3A1F00; --postit-pin: #FB8C00; }
.ol-postit[data-color="6"] { --postit-bg: #F48FB1; --postit-deep: #C2185B; --postit-ink: #3A1020; --postit-pin: #EC407A; }
.ol-postit[data-color="7"] { --postit-bg: #B39DDB; --postit-deep: #7E57C2; --postit-ink: #1F1433; --postit-pin: #8E24AA; }
.ol-postit[data-color="8"] { --postit-bg: #4DD0E1; --postit-deep: #00838F; --postit-ink: #0A2A30; --postit-pin: #00ACC1; }
.ol-postit[data-color="9"] { --postit-bg: #CFD8DC; --postit-deep: #78909C; --postit-ink: #1A2326; --postit-pin: #90A4AE; }
.ol-postit:hover {
  box-shadow:
    0 1px 0 rgba(255,255,255,0.6) inset,
    0 -1px 0 color-mix(in srgb, var(--postit-deep) 40%, transparent) inset,
    0 14px 28px rgba(20, 12, 4, 0.28),
    0 3px 8px rgba(20, 12, 4, 0.18);
}
.ol-postit.is-dragging {
  cursor: grabbing;
  transition: none;
  z-index: 9999 !important;
  filter: drop-shadow(0 16px 18px rgba(0,0,0,0.24));
}
.ol-postit.is-expanded-source { opacity: 0.25; pointer-events: none; }

.ol-postit-pin {
  position: absolute;
  top: -18px;
  left: 52%;
  transform: translateX(-50%);
  z-index: 4;
  width: 28px;
  height: 40px;
  pointer-events: none;
  display: grid;
  place-items: start center;
  filter: drop-shadow(2px 4px 3px rgba(0,0,0,0.35));
}
.ol-postit-pin.lg {
  top: -26px;
  left: 54%;
  width: 44px;
  height: 64px;
  filter: drop-shadow(3px 6px 4px rgba(0,0,0,0.38));
}
.ol-pushpin-svg {
  display: block;
  overflow: visible;
  pointer-events: none;
}
.ol-pushpin-svg.lg {
  width: 44px;
  height: 64px;
}

/* Curl removed ? legacy selectors disabled */
.ol-postit-curl,
.ol-postit-curl.lg,
.ol-postit-curl::after {
  display: none !important;
}

.ol-postit-title {
  margin: 0 0 6px;
  font: 700 0.92rem/1.2 "Segoe Print", "Comic Sans MS", "Bradley Hand", cursive, system-ui;
  letter-spacing: 0.01em;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  word-break: break-word;
}
.ol-postit-preview {
  margin: 0;
  font: 400 0.68rem/1.35 "Segoe UI", system-ui, sans-serif;
  opacity: 0.72;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.ol-postit-tools {
  position: absolute;
  top: 8px;
  right: 6px;
  display: flex;
  gap: 2px;
  opacity: 0;
  transform: translateY(-2px);
  transition: opacity 0.15s ease, transform 0.15s ease;
  z-index: 4;
}
.ol-postit:hover .ol-postit-tools { opacity: 1; transform: none; }
.ol-postit-ico {
  appearance: none;
  border: 0;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--postit-bg) 55%, rgba(255,255,255,0.85));
  color: var(--postit-ink);
  box-shadow: 0 1px 2px rgba(0,0,0,0.18);
  cursor: pointer;
  font: 600 0.62rem/1 system-ui;
  padding: 0 4px;
}
.ol-postit-ico:hover { filter: brightness(1.06); }
.ol-postit-ico.danger { color: #b71c1c; }

.ol-postit-color-row {
  position: absolute;
  top: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  display: flex;
  gap: 5px;
  padding: 5px 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-window-bg) 88%, rgba(255,255,255,0.7));
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  box-shadow: 0 6px 16px rgba(0,0,0,0.22);
}
.ol-postit-color-row[hidden] { display: none !important; }
.ol-postit-swatch {
  appearance: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1.5px solid rgba(0,0,0,0.18);
  background:
    radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--sw) 70%, #fff), var(--sw) 58%, color-mix(in srgb, var(--sw) 70%, #000));
  box-shadow: inset 0 -1px 2px rgba(0,0,0,0.18);
  cursor: pointer;
  padding: 0;
}
.ol-postit-swatch.is-on {
  outline: 2px solid var(--w11-accent, #0078d4);
  outline-offset: 1px;
}
.ol-postit-swatch:hover { filter: brightness(1.06); transform: scale(1.08); }
.ol-postit-ctx-swatch {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid rgba(0,0,0,0.2);
  vertical-align: middle;
}

/* Expanded editor */
.ol-postit-expand {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: grid;
  place-items: center;
  padding: 24px;
}
.ol-postit-expand[hidden] { display: none !important; }
.ol-postit-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(28, 18, 8, 0);
  backdrop-filter: blur(0px);
  transition: background 0.42s ease, backdrop-filter 0.42s ease;
}
.ol-postit-backdrop.is-on {
  background: rgba(28, 18, 8, 0.48);
  backdrop-filter: blur(3px);
}
.ol-postit-large {
  --postit-bg: #f6d045;
  --postit-deep: #c9a012;
  --postit-ink: #2a2118;
  --postit-pin: #fdd835;
  position: relative;
  z-index: 1;
  width: min(560px, 92%);
  height: min(620px, 88%);
  display: flex;
  flex-direction: column;
  padding: 56px 28px 28px;
  border-radius: 6px;
  background:
    radial-gradient(120% 80% at 16% 8%, rgba(255,255,255,0.35), transparent 44%),
    linear-gradient(180deg, transparent 72%, color-mix(in srgb, var(--postit-deep) 18%, transparent) 100%),
    var(--postit-bg) !important;
  background-color: var(--postit-bg) !important;
  color: var(--postit-ink);
  box-shadow:
    0 2px 0 rgba(255,255,255,0.4) inset,
    0 30px 60px rgba(10, 6, 2, 0.45),
    0 8px 20px rgba(10, 6, 2, 0.25);
  transform-origin: center center;
  will-change: transform, opacity;
  transition: none;
}
.ol-postit-large[data-color="0"] { --postit-bg: #5BA3E0; --postit-deep: #2E6FAF; --postit-ink: #10233A; --postit-pin: #1E88E5; }
.ol-postit-large[data-color="1"] { --postit-bg: #8BC34A; --postit-deep: #558B2F; --postit-ink: #1B2E0E; --postit-pin: #43A047; }
.ol-postit-large[data-color="2"] { --postit-bg: #EF6A6A; --postit-deep: #C62828; --postit-ink: #3A1010; --postit-pin: #E53935; }
.ol-postit-large[data-color="3"] { --postit-bg: #F6D045; --postit-deep: #C9A012; --postit-ink: #2A2118; --postit-pin: #FDD835; }
.ol-postit-large[data-color="4"] { --postit-bg: #FFF8E7; --postit-deep: #E0C98A; --postit-ink: #2A2118; --postit-pin: #F5F5F5; }
.ol-postit-large[data-color="5"] { --postit-bg: #FFA726; --postit-deep: #EF6C00; --postit-ink: #3A1F00; --postit-pin: #FB8C00; }
.ol-postit-large[data-color="6"] { --postit-bg: #F48FB1; --postit-deep: #C2185B; --postit-ink: #3A1020; --postit-pin: #EC407A; }
.ol-postit-large[data-color="7"] { --postit-bg: #B39DDB; --postit-deep: #7E57C2; --postit-ink: #1F1433; --postit-pin: #8E24AA; }
.ol-postit-large[data-color="8"] { --postit-bg: #4DD0E1; --postit-deep: #00838F; --postit-ink: #0A2A30; --postit-pin: #00ACC1; }
.ol-postit-large[data-color="9"] { --postit-bg: #CFD8DC; --postit-deep: #78909C; --postit-ink: #1A2326; --postit-pin: #90A4AE; }
.ol-postit-large .ol-postit-color-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
  position: relative;
  z-index: 4;
}
.ol-postit-large.is-zooming {
  transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.42s ease;
}
.ol-postit-large.anim-in { transform: none; opacity: 1; }
.ol-postit-large.anim-out {
  transition: transform 0.36s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.36s ease;
}
.ol-postit-x {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 5;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: color-mix(in srgb, var(--postit-bg) 40%, rgba(255,255,255,0.85));
  color: var(--postit-ink);
  box-shadow: 0 2px 6px rgba(0,0,0,0.18);
  cursor: pointer;
  display: grid;
  place-items: center;
}
.ol-postit-x:hover { filter: brightness(1.05); }
.ol-postit-large-tools {
  position: absolute;
  top: 14px;
  left: 16px;
  display: flex;
  gap: 6px;
  z-index: 5;
}
.ol-postit-large-tools .ol-postit-ico {
  width: auto;
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  font-size: 0.72rem;
}
.ol-postit-large-title {
  border: 0;
  background: transparent;
  font: 700 1.45rem/1.25 "Segoe Print", "Comic Sans MS", cursive, system-ui;
  color: inherit;
  outline: none;
  width: 100%;
  margin: 8px 0 12px;
  border-bottom: 1px dashed color-mix(in srgb, var(--postit-ink) 25%, transparent);
  padding-bottom: 6px;
}
.ol-postit-large-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  font: 400 1rem/1.5 "Segoe UI", system-ui, sans-serif;
  outline: none;
  padding-right: 6px;
}

/* Shared color editor panel */
.ol-postit-colors {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 20px;
}
.ol-postit-colors[hidden] { display: none !important; }
.ol-postit-colors-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 14, 8, 0.45);
  backdrop-filter: blur(2px);
}
.ol-postit-colors-card {
  position: relative;
  z-index: 1;
  width: min(560px, 96%);
  max-height: min(640px, 92%);
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  box-shadow: 0 24px 48px rgba(0,0,0,0.35);
  overflow: hidden;
}
.ol-postit-colors-head {
  position: relative;
  padding: 16px 48px 12px 18px;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
}
.ol-postit-colors-head h3 {
  margin: 0 0 4px;
  font: 600 1rem/1.3 system-ui, sans-serif;
}
.ol-postit-colors-head .ol-muted {
  margin: 0;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.ol-postit-colors-head .ol-postit-x {
  top: 10px;
  right: 10px;
  background: color-mix(in srgb, var(--w11-window-bg) 70%, transparent);
  color: var(--w11-text);
}
.ol-postit-colors-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ol-postit-color-edit {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 12px;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-win-body) 55%, var(--w11-window-bg));
}
.ol-postit-color-edit-preview {
  --postit-bg: #f6d045;
  --postit-deep: #c9a012;
  --postit-ink: #2a2118;
  --postit-pin: #fdd835;
  position: relative;
  min-height: 92px;
  border-radius: 4px;
  padding: 28px 8px 8px;
  background:
    radial-gradient(120% 80% at 20% 12%, rgba(255,255,255,0.4), transparent 45%),
    var(--postit-bg);
  color: var(--postit-ink);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.45) inset,
    0 4px 10px rgba(0,0,0,0.15);
  font: 600 0.72rem/1.2 system-ui, sans-serif;
  text-align: center;
  overflow: hidden;
}
.ol-postit-color-edit-preview .ol-postit-pin {
  top: -8px;
  width: 22px;
  height: 32px;
}
.ol-postit-color-edit-fields {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.ol-postit-color-edit-fields label {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font: 500 0.72rem/1.2 system-ui, sans-serif;
  color: var(--w11-muted);
}
.ol-postit-color-edit-fields input[type="text"] {
  appearance: none;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 6px 8px;
  font: 400 0.85rem/1.2 system-ui, sans-serif;
}
.ol-postit-color-edit-swatches {
  display: flex;
  gap: 14px;
}
.ol-postit-color-edit-swatches label {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.ol-postit-color-edit-swatches input[type="color"] {
  width: 36px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
}
.ol-postit-colors-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 14px;
  border-top: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.ol-postit-colors-foot-spacer { flex: 1; }
.ol-postit-colors-foot .ol-rbtn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ol-postit-color-edit-top {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}
.ol-postit-color-edit-top .grow { flex: 1; min-width: 0; }
.ol-postit-color-badge {
  flex-shrink: 0;
  font: 600 0.65rem/1 system-ui, sans-serif;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--w11-muted);
  border: 1px solid var(--w11-stroke);
  border-radius: 999px;
  padding: 5px 8px;
  margin-bottom: 2px;
}
.ol-postit-color-del {
  appearance: none;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  margin-bottom: 2px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: color-mix(in srgb, #c42b1c 10%, var(--w11-window-bg));
  color: #c42b1c;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.ol-postit-color-del:hover {
  background: color-mix(in srgb, #c42b1c 18%, var(--w11-window-bg));
}

/* ---- Post-it board areas (template: flat Rei?zwecken + jute twine + knot) ---- */
.ol-postit-areas {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.ol-postit-board > .ol-postit { z-index: 5; }
.ol-postit-area {
  position: absolute;
  pointer-events: none;
  transition: filter 0.2s ease;
}
.ol-postit-area.is-dragging {
  filter: brightness(1.02);
  z-index: 4 !important;
}
.ol-area-frame {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  overflow: visible;
}
.ol-area-cord-sides {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
.ol-area-hit {
  position: absolute;
  inset: 12% 10%;
  pointer-events: auto;
  cursor: move;
  border-radius: 8px;
  background: transparent;
  z-index: 2;
}
.ol-area-hit:hover {
  background: color-mix(in srgb, #8b5a2b 5%, transparent);
}
.ol-area-corner {
  appearance: none;
  position: absolute;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  pointer-events: auto;
  z-index: 6;
  display: grid;
  place-items: center;
}
/* Pin centers on the frame corners (template) ? not floating outside */
.ol-area-corner.nw { top: -10px; left: -10px; cursor: nwse-resize; }
.ol-area-corner.ne { top: -10px; right: -10px; left: auto; cursor: nesw-resize; }
.ol-area-corner.sw { bottom: -10px; top: auto; left: -10px; cursor: nesw-resize; }
.ol-area-corner.se { bottom: -10px; top: auto; right: -10px; left: auto; cursor: nwse-resize; }
.ol-area-wrap {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: 1;
  pointer-events: none;
  line-height: 0;
}
.ol-area-wrap-svg {
  display: block;
  width: 34px;
  height: 34px;
  overflow: visible;
}
.ol-area-pin-head {
  position: relative;
  z-index: 2;
  width: 38px;
  height: 38px;
  pointer-events: none;
  line-height: 0;
  /* head above wrap so twine sits under the flat top */
  transform: translateY(-3px);
}
.ol-area-tack {
  display: block;
  width: 38px;
  height: 38px;
  overflow: visible;
}
.ol-area-label {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  max-width: min(90%, 360px);
  min-width: 120px;
  padding: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none;
  pointer-events: auto;
  cursor: move;
  z-index: 7;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ol-area-label-pill {
  position: relative;
  z-index: 1;
  width: auto;
  min-width: 140px;
  max-width: 100%;
  background: #1c1c1c;
  border-radius: 999px;
  padding: 8px 20px;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.35),
    inset 0 1px 2px rgba(255,255,255,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ol-area-label-input {
  appearance: none;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: center;
  font: italic 700 1.08rem/1.2 "Segoe UI", system-ui, sans-serif;
  color: #fff;
  outline: none;
  padding: 0;
  cursor: text;
  letter-spacing: 0.01em;
}
.ol-area-label-input:focus {
  outline: 1px dashed rgba(255,255,255,0.35);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Electron Desktop-Shell */
html.sm-electron,
body.sm-electron {
  overscroll-behavior: none;
}
/* Drag nur auf Titelbereich ? Buttons bleiben klickbar (nur Electron) */
body.sm-electron .w11-titlebar {
  -webkit-app-region: no-drag;
  app-region: no-drag;
}
body.sm-electron .w11-titlebar-drag {
  -webkit-app-region: drag;
  app-region: drag;
}
body.sm-electron .w11-titlebar button,
body.sm-electron .w11-titlebar input,
body.sm-electron .w11-titlebar a,
body.sm-electron .w11-titlebar .w11-win-btns,
body.sm-electron .w11-titlebar .w11-title-actions,
body.sm-electron .w11-titlebar .w11-title-act,
body.sm-electron .w11-titlebar .w11-win-btns * {
  -webkit-app-region: no-drag !important;
  app-region: no-drag !important;
}
/* Native OS-Fenster: Windows-Overlay-Buttons nutzen, HTML-Buttons ausblenden
   (nur Electron ? nie Chrome/Browser ?ber sm-shell-app allein) */
body.sm-electron.sm-electron-native .w11-win-btns,
body.sm-electron.sm-shell-app .w11-win-btns {
  display: none !important;
}
body.sm-electron.sm-electron-native .w11-titlebar,
body.sm-electron.sm-shell-app .w11-titlebar {
  /* Platz f?r Windows Caption Buttons (Min/Max/Close) */
  padding-right: 140px;
  box-sizing: border-box;
}
body.sm-electron.sm-electron-native .w11-titlebar-drag,
body.sm-electron.sm-shell-app .w11-titlebar-drag {
  -webkit-app-region: drag;
  app-region: drag;
}
body.sm-electron-native #view-desktop,
body.sm-shell-app #view-desktop {
  padding-right: 0;
}
body.sm-electron-native #desktop-icons,
body.sm-electron-native #desktop-widgets,
body.sm-electron-native #taskbar,
body.sm-electron-native #start-menu,
body.sm-electron-native .desk-ctx,
body.sm-electron-native #desktop-wallpaper,
body.sm-electron-native:not(.sm-shell-app) #w11-ctx,
body.sm-shell-app #desktop-icons,
body.sm-shell-app #desktop-widgets,
body.sm-shell-app #taskbar,
body.sm-shell-app #start-menu,
body.sm-shell-app .desk-ctx,
body.sm-shell-app #desktop-wallpaper {
  display: none !important;
  pointer-events: none !important;
}
/* Kontextmenüs in installierten App-Fenstern (Dropshipment, DMS, …) */
body.sm-shell-app #w11-ctx {
  display: flex !important;
  pointer-events: auto !important;
}
body.sm-shell-app #w11-ctx[hidden] {
  display: none !important;
  pointer-events: none !important;
}
/* Installierte Windows-Apps: kein Desktop-Hintergrund, nur das Programm */
body.sm-electron-native.sm-shell-app,
body.sm-shell-app #view-desktop,
html.sm-shell-app,
html.sm-shell-app body {
  background: var(--w11-win-body, var(--w11-window-bg, #0b1a33)) !important;
}
body.sm-shell-app #view-desktop {
  background: var(--w11-win-body, var(--w11-window-bg, #0b1a33)) !important;
}
body.sm-shell-app .bg-aurora,
body.sm-shell-app .bg-grid {
  display: none !important;
}
body.sm-electron-native #desktop-windows,
body.sm-shell-app #desktop-windows,
body.sm-shell-app #desktop-surface {
  inset: 0 !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: transparent !important;
}
body.sm-electron-native .w11-window.maximized,
body.sm-electron-native .w11-window.sm-shell-app-win,
body.sm-shell-app .w11-window.sm-shell-app-win,
body.sm-shell-app .w11-window.maximized.sm-shell-app-win,
body.sm-shell-app .sm-shell-app-win {
  border-radius: 0 !important;
  box-shadow: none !important;
  border: 0 !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  right: 0 !important;
  bottom: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  resize: none !important;
}
/* DMS-/Dialog-OS-Fenster: nie Opacity-0 (sonst nur Min/Close, leerer Body) */
body.sm-shell-app .w11-window.sm-shell-app-win.w11-dlg-anim,
body.sm-electron-native .w11-window.sm-shell-app-win.w11-dlg-anim {
  opacity: 1 !important;
}
body.sm-shell-app .w11-window.sm-shell-app-win .w11-win-body,
body.sm-electron-native .w11-window.sm-shell-app-win .w11-win-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}
body.sm-shell-app .w11-window.sm-shell-app-win .dlg-host.w11-hosted,
body.sm-electron-native .w11-window.sm-shell-app-win .dlg-host.w11-hosted {
  flex: 1 1 auto !important;
  height: 100% !important;
  min-height: 0 !important;
}
/* Sekundärfenster (Compose/Dialoge) im Outlook-Prozess: zentriert, feste Dialoggröße */
body.sm-electron-native .w11-window:not(.sm-shell-app-win):not(.sm-shell-float-win):not([data-float-viewer="1"]):not(.sm-shell-body-layer),
body.sm-shell-app .w11-window:not(.sm-shell-app-win):not(.sm-shell-float-win):not([data-float-viewer="1"]):not(.sm-shell-body-layer) {
  border-radius: 8px !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45) !important;
  border: 1px solid var(--w11-win-border, var(--w11-stroke, #3d3d3d)) !important;
  left: max(12px, calc(50% - 410px)) !important;
  top: max(12px, calc(50% - 350px)) !important;
  width: min(820px, calc(100% - 24px)) !important;
  height: min(700px, calc(100% - 24px)) !important;
  right: auto !important;
  bottom: auto !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  resize: none !important;
  z-index: 1000 !important;
}
/* PDF/Excel/Word/Bild/Druck + Dialoge: frei verschiebbar – Body-Layer nicht vom Outlook-Container abschneiden */
body.sm-electron-native .w11-window.sm-shell-float-win,
body.sm-shell-app .w11-window.sm-shell-float-win,
body.sm-electron-native .w11-window[data-float-viewer="1"],
body.sm-shell-app .w11-window[data-float-viewer="1"],
body.sm-electron-native .w11-window.sm-shell-body-layer,
body.sm-shell-app .w11-window.sm-shell-body-layer {
  border-radius: 8px !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45) !important;
  border: 1px solid var(--w11-win-border, var(--w11-stroke, #3d3d3d)) !important;
  /* Position/Größe nur aus Inline-Styles (JS-Drag) – keine !important-Locks */
  right: auto !important;
  bottom: auto !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  resize: none !important;
  z-index: 1000 !important;
}
body.sm-electron-native .w11-window.sm-shell-body-layer,
body.sm-shell-app .w11-window.sm-shell-body-layer {
  position: fixed !important;
  z-index: 10000 !important;
  pointer-events: auto;
}
/* Echtes Windows-Fenster (frame:true): OS-Titelleiste, In-App-Chrome aus */
body.sm-os-frame .w11-window.sm-shell-app-win .w11-titlebar,
body.sm-os-frame.sm-shell-app .w11-window.sm-shell-app-win .w11-titlebar {
  display: none !important;
}
body.sm-os-frame .w11-window.sm-shell-app-win,
body.sm-os-frame.sm-shell-app .w11-window.sm-shell-app-win {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.sm-os-frame .w11-window.sm-shell-app-win .w11-win-body,
body.sm-os-frame.sm-shell-app .w11-window.sm-shell-app-win .w11-win-body {
  border-radius: 0 !important;
}
body.sm-electron-native .w11-window.maximized.sm-shell-float-win,
body.sm-shell-app .w11-window.maximized.sm-shell-float-win,
body.sm-electron-native .w11-window.maximized[data-float-viewer="1"],
body.sm-shell-app .w11-window.maximized[data-float-viewer="1"] {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
}
body.sm-shell-app .w11-window.sm-shell-float-win .w11-titlebar,
body.sm-electron-native .w11-window.sm-shell-float-win .w11-titlebar,
body.sm-shell-app .w11-window[data-float-viewer="1"] .w11-titlebar,
body.sm-electron-native .w11-window[data-float-viewer="1"] .w11-titlebar {
  cursor: move;
}
body.sm-shell-app .w11-window.sm-shell-float-win .w11-titlebar-drag,
body.sm-electron-native .w11-window.sm-shell-float-win .w11-titlebar-drag,
body.sm-shell-app .w11-window[data-float-viewer="1"] .w11-titlebar-drag,
body.sm-electron-native .w11-window[data-float-viewer="1"] .w11-titlebar-drag {
  -webkit-app-region: no-drag !important;
  app-region: no-drag !important;
  cursor: move;
}
.sm-doc-native-fast {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: var(--w11-win-body, #1e1e1e);
}
body.sm-electron.sm-electron-native .w11-window:not(.sm-shell-app-win) .w11-win-btns,
body.sm-electron.sm-shell-app .w11-window:not(.sm-shell-app-win) .w11-win-btns {
  display: flex !important;
}
body.sm-electron.sm-electron-native .w11-window:not(.sm-shell-app-win) .w11-titlebar,
body.sm-electron.sm-shell-app .w11-window:not(.sm-shell-app-win) .w11-titlebar {
  padding-right: 8px;
}
body.sm-electron.sm-electron-native .w11-window:not(.sm-shell-app-win) .w11-titlebar-drag,
body.sm-electron.sm-shell-app .w11-window:not(.sm-shell-app-win) .w11-titlebar-drag {
  -webkit-app-region: no-drag !important;
  app-region: no-drag !important;
}
body.sm-shell-app .w11-window .w11-win-resize,
body.sm-shell-app .w11-window .resize-handle {
  display: none !important;
}
body.sm-shell-app .w11-window:not(.sm-shell-app-win) .w11-resize,
body.sm-electron-native .w11-window:not(.sm-shell-app-win) .w11-resize,
body.sm-shell-app .w11-window.sm-shell-float-win .w11-resize,
body.sm-electron-native .w11-window.sm-shell-float-win .w11-resize,
body.sm-shell-app .w11-window[data-float-viewer="1"] .w11-resize,
body.sm-electron-native .w11-window[data-float-viewer="1"] .w11-resize {
  display: block !important;
}
.desk-shell-cfg .win-sheet-input {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
}

/* Manager: Login-only Fenster */
html.sm-shell-login,
body.sm-shell-login {
  background: var(--w11-win-body, #0b1a33) !important;
}
body.sm-shell-login .bg-aurora,
body.sm-shell-login .bg-grid,
body.sm-shell-login .w11-signin-footer,
body.sm-shell-login .w11-signin-hint,
body.sm-shell-login #view-desktop,
body.sm-shell-login #view-app {
  display: none !important;
}
body.sm-shell-login #view-login {
  display: flex !important;
  min-height: 100vh;
  align-items: center;
  justify-content: center;
}
body.sm-shell-login .w11-signin-bg,
body.sm-shell-login .w11-signin-blur {
  opacity: 0.35;
}

/* Versandscheine */
.w11-win-body #acc-versandscheine.w11-hosted {
  position: relative;
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.vs-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.vs-toolbar {
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
}
.vs-tabs {
  display: flex;
  gap: 2px;
  padding: 6px 10px 0;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.vs-tab {
  appearance: none;
  border: 1px solid transparent;
  border-bottom: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 7px 14px;
  border-radius: 6px 6px 0 0;
  cursor: pointer;
  font: inherit;
}
.vs-tab:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-highlight) 28%, transparent);
}
.vs-tab.active {
  color: var(--w11-text);
  background: var(--w11-window-bg);
  border-color: var(--w11-stroke);
  box-shadow: 0 1px 0 var(--w11-window-bg);
}
.vs-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
}
.vs-pane {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.vs-pane[hidden] {
  display: none !important;
}
.vs-table-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  margin: 10px 12px 8px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
}
.vs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}
.vs-table th,
.vs-table td {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.vs-table th {
  position: sticky;
  top: 0;
  background: var(--w11-titlebar);
  color: var(--w11-muted);
  font-weight: 600;
  z-index: 1;
}
.vs-table tbody tr:hover td {
  background: color-mix(in srgb, var(--w11-highlight) 22%, var(--w11-window-bg));
}
.vs-th-del,
.vs-td-del {
  width: 36px;
  padding-right: 6px !important;
  text-align: center;
}
.vs-td-acts {
  width: 76px;
  white-space: nowrap;
  text-align: right;
  padding-right: 8px !important;
}
.vs-ico-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 28px;
  padding: 0;
  margin: 0 1px;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: color-mix(in srgb, var(--w11-text) 6%, var(--w11-window-bg));
  color: var(--w11-text);
  cursor: pointer;
  vertical-align: middle;
}
.vs-ico-btn:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border-color: var(--w11-active-border);
}
.vs-ico-btn:active {
  background: color-mix(in srgb, var(--w11-accent) 24%, var(--w11-window-bg));
}
.vs-ico-btn svg {
  display: block;
}
.vs-arch-pop {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: color-mix(in srgb, #000 42%, transparent);
}
.vs-arch-pop[hidden] {
  display: none !important;
}
.vs-arch-pop-card {
  width: min(720px, 100%);
  max-height: min(78vh, 560px);
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  border: 1px solid var(--w11-win-border);
  border-radius: 10px;
  box-shadow: 0 12px 40px color-mix(in srgb, #000 35%, transparent);
  overflow: hidden;
}
.vs-arch-pop-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
  flex-shrink: 0;
}
.vs-arch-pop-meta {
  padding: 8px 12px 0;
  color: var(--w11-muted);
  font-size: 0.78rem;
  flex-shrink: 0;
}
.vs-arch-pop-table {
  margin: 8px 12px 12px;
  flex: 1;
  min-height: 0;
}
.vs-edit {
  display: block;
  min-height: 1.15em;
  cursor: text;
  outline: none;
  border-radius: 3px;
  padding: 1px 4px;
  margin: -1px -4px;
}
.vs-edit:empty::before {
  content: "—";
  color: var(--w11-muted);
}
.vs-edit:focus {
  background: var(--w11-window-bg);
  box-shadow: 0 0 0 1px var(--w11-accent);
}
.vs-carrier-label {
  display: inline-block;
  cursor: pointer;
  border-radius: 3px;
  padding: 1px 4px;
  margin: -1px -4px;
  outline: none;
}
.vs-carrier-label:hover,
.vs-carrier-label:focus,
.vs-carrier-label[aria-expanded="true"] {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
#vs-carrier-pick {
  min-width: 8.5rem;
  max-width: 14rem;
  padding: 2px;
}
#vs-carrier-pick button.is-on {
  font-weight: 600;
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 28%, var(--w11-window-bg));
}
.vs-del {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  font: 600 15px/1 "Segoe UI", system-ui, sans-serif;
}
.vs-del:hover {
  background: color-mix(in srgb, #e81123 16%, var(--w11-window-bg));
  color: #e81123;
}
.vs-empty {
  text-align: center;
  color: var(--w11-muted) !important;
  padding: 28px 12px !important;
}
.vs-pane-split {
  flex-direction: row;
  gap: 0;
}
.vs-carrier-list {
  width: 200px;
  flex-shrink: 0;
  overflow: auto;
  border-right: 1px solid var(--w11-stroke);
  padding: 8px;
  background: var(--w11-window-bg);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.vs-carrier-btn {
  appearance: none;
  text-align: left;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  border-radius: 8px;
  padding: 8px 10px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.vs-carrier-btn small {
  color: var(--w11-muted);
}
.vs-carrier-btn.selected {
  border-color: var(--w11-active-border);
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 45%, transparent);
}
.vs-tpl-edit {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
  gap: 8px;
}
.vs-tpl-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-end;
}
.vs-bon-meta {
  color: var(--w11-muted);
  font-size: 0.72rem;
  margin: 0;
}
.vs-tpl-row label,
.vs-setup label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: var(--w11-text);
  font-size: 0.78rem;
}
.vs-tpl-row input,
.vs-tpl-row select,
.vs-setup input,
.vs-setup select,
.vs-toolbar select {
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  padding: 6px 8px;
  font: inherit;
}
.vs-bon-stage {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 16px;
  padding: 10px 8px 12px;
  background: color-mix(in srgb, var(--w11-stroke) 22%, var(--w11-win-body));
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
}
.vs-bon-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 0 0 auto;
  min-height: 0;
}
.vs-bon-cap {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted);
  text-align: center;
}
.vs-bon-paper {
  --vs-bon-cols: 42;
  box-sizing: border-box;
  font-family: Consolas, "Cascadia Mono", ui-monospace, monospace;
  font-size: 0.72rem;
  width: calc(var(--vs-bon-cols) * 1ch + 20px);
  max-width: 100%;
  min-height: 100%;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  background: color-mix(in srgb, #f7f1e4 82%, var(--w11-window-bg));
  color: #1a1a1a;
  border: 1px dashed color-mix(in srgb, #8a7a5c 55%, var(--w11-stroke));
  border-radius: 2px;
  box-shadow: 0 6px 18px color-mix(in srgb, #000 18%, transparent);
  padding: 8px 10px 12px;
}
.vs-bon-ruler {
  font-family: Consolas, "Cascadia Mono", ui-monospace, monospace;
  font-size: 0.65rem;
  line-height: 1.1;
  color: color-mix(in srgb, #6b5b3e 70%, #888);
  white-space: pre;
  overflow: hidden;
  user-select: none;
  margin-bottom: 4px;
  letter-spacing: 0;
}
.vs-bon-editor {
  flex: 1;
  min-height: 420px;
  width: 100%;
  box-sizing: border-box;
  border: 0;
  outline: none;
  resize: none;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: 1.35;
  padding: 0;
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-all;
  overflow-x: hidden;
}
.vs-bon-preview-paper,
body.w11-desktop-mode .w11-win-body .vs-bon-preview-paper {
  overflow: auto;
  background: #fff !important;
  color: #000 !important;
  color-scheme: light;
  border: 1px solid #ccc;
  box-shadow: 0 6px 18px color-mix(in srgb, #000 16%, transparent);
}
.vs-bon-preview-paper .vs-bon-preview,
body.w11-desktop-mode .w11-win-body .vs-bon-preview-paper :is(div, span, b, strong, small) {
  color: #000 !important;
  background: transparent !important;
}
.vs-bon-preview {
  flex: 1;
  min-height: 420px;
  font: inherit;
  line-height: 1.35;
  color: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-all;
}
.vs-bon-preview b {
  font-weight: 700;
}
.vs-bon-preview small {
  font-size: 0.78em;
  letter-spacing: -0.02em;
}
.vs-bon-preview .vs-pv-c {
  display: block;
  text-align: center;
}
.vs-bon-preview .vs-pv-empty {
  color: #555 !important;
}
#vs-tpl-ctx {
  min-width: 240px;
  max-width: 320px;
}
#vs-tpl-ctx button {
  justify-content: space-between;
}
#vs-tpl-ctx .muted {
  color: var(--w11-muted);
  font-size: 0.72rem;
}
.vs-hint {
  margin: 0;
  color: var(--w11-muted);
  font-size: 0.72rem;
}
.vs-hint code {
  font-family: Consolas, "Cascadia Mono", ui-monospace, monospace;
  font-size: 0.7rem;
  color: var(--w11-text);
}
.vs-setup {
  overflow: auto;
  padding: 12px 16px 16px;
}
.vs-setup-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
  max-width: 920px;
}
.vs-setup .span-2,
.vs-jtl-help.span-2 {
  grid-column: 1 / -1;
}
.vs-copy-row {
  display: flex;
  gap: 8px;
}
.vs-copy-row input {
  flex: 1;
  min-width: 0;
}
.vs-setup-actions {
  display: flex;
  gap: 8px;
  align-items: flex-end;
}
.vs-jtl-help {
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--w11-window-bg);
}
.vs-jtl-help h3 {
  margin: 0 0 8px;
  font-size: 0.92rem;
}
.vs-jtl-help ol {
  margin: 0 0 10px;
  padding-left: 1.2rem;
  color: var(--w11-text);
}
.vs-jtl-help pre {
  margin: 6px 0 10px;
  padding: 10px;
  overflow: auto;
  background: color-mix(in srgb, var(--w11-win-body) 70%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  color: var(--w11-text);
  font-size: 0.75rem;
}
.vs-add-carrier {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.vs-add-carrier input {
  flex: 1;
}

/* Telefonie */
.w11-win-body #acc-telefonie.w11-hosted {
  position: relative;
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.tel-shell {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.tel-body,
.tel-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 12px 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tel-section {
  margin-bottom: 0;
  padding: 12px 14px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  flex-shrink: 0;
}
.tel-h-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.tel-h-row .tel-h { margin: 0; }
.tel-field-wide { grid-column: 1 / -1; }
.tel-url-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.tel-url-row input { flex: 1; min-width: 0; }
.tel-unifi-actions { margin-top: 10px; }
.tel-check-field .tel-switch-inline { margin: 0; }
.tel-banner-answered {
  font-size: 0.78rem;
  color: var(--w11-text);
  padding: 2px 0;
}
.tel-unifi-help {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 16px;
  background: color-mix(in srgb, #000 42%, transparent);
}
.tel-unifi-help[hidden] { display: none !important; }
.tel-unifi-help-card {
  width: min(520px, 100%);
  max-height: min(520px, 100%);
  overflow: auto;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: 0 18px 48px color-mix(in srgb, #000 35%, transparent);
  padding: 14px 16px 16px;
}
.tel-unifi-help-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.tel-unifi-help-steps {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 10px 0;
}
.tel-unifi-help-step {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 8px;
  align-items: start;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-win-body) 55%, var(--w11-window-bg));
}
.tel-unifi-help-label {
  font-size: 0.78rem;
  color: var(--w11-muted);
  padding-top: 2px;
}
.tel-unifi-help-val {
  font-size: 0.85rem;
  word-break: break-all;
  color: var(--w11-text);
  text-align: left;
}
.tel-sip-line {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-win-body) 55%, var(--w11-window-bg));
}
.tel-sip-led {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--w11-muted);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--w11-muted) 28%, transparent);
}
.tel-sip-led[data-state="registered"] {
  background: #107c10;
  box-shadow:
    0 0 0 3px color-mix(in srgb, #107c10 28%, transparent),
    0 0 12px color-mix(in srgb, #107c10 55%, transparent);
}
.tel-sip-led[data-state="connecting"],
.tel-sip-led[data-state="reconnect"] {
  background: #ffb900;
  box-shadow:
    0 0 0 3px color-mix(in srgb, #ffb900 28%, transparent),
    0 0 12px color-mix(in srgb, #ffb900 45%, transparent);
  animation: tel-sip-blink 1.2s ease-in-out infinite;
}
.tel-sip-led[data-state="error"] {
  background: #c42b1c;
  box-shadow:
    0 0 0 3px color-mix(in srgb, #c42b1c 28%, transparent),
    0 0 12px color-mix(in srgb, #c42b1c 45%, transparent);
}
.tel-sip-led[data-state="stopped"] {
  background: color-mix(in srgb, var(--w11-muted) 70%, #666);
}
@keyframes tel-sip-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}
.tel-sip-line-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.tel-sip-line-text strong {
  font-size: 0.92rem;
  color: var(--w11-text);
}
.tel-sip-line-text .muted {
  font-size: 0.78rem;
  color: var(--w11-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tel-section.tel-test {
  flex-shrink: 0;
}
.tel-h {
  margin: 0 0 8px;
  font-size: 0.95rem;
  color: var(--w11-text);
}
.tel-hint {
  margin: 0 0 12px;
  font-size: 0.78rem;
  color: var(--w11-muted);
  line-height: 1.4;
}
.tel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px 12px;
}
.tel-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.tel-field input,
.tel-field select {
  padding: 7px 9px;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font: inherit;
}
.tel-switch { margin-bottom: 10px; }
.tel-test-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
}
.tel-test-row input {
  flex: 1;
  min-width: 160px;
  padding: 8px 10px;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font: inherit;
}
.tel-test-result { display: flex; flex-direction: column; gap: 10px; }
.tel-empty {
  padding: 14px;
  border-radius: 8px;
  background: color-mix(in srgb, #c42b1c 10%, var(--w11-window-bg));
  color: var(--w11-text);
  font-size: 0.85rem;
}
.tel-card {
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  padding: 12px;
  background: var(--w11-win-body);
}
.tel-card header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}
.tel-knr {
  font-size: 0.78rem;
  color: var(--w11-muted);
  font-variant-numeric: tabular-nums;
}
.tel-order {
  margin-top: 8px;
  border-top: 1px solid var(--w11-stroke);
  padding-top: 6px;
}
.tel-order summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  gap: 10px;
  align-items: baseline;
}
.tel-pos {
  margin: 6px 0 0;
  padding-left: 1.1rem;
  font-size: 0.8rem;
  color: var(--w11-text);
}
.tel-pos em { color: var(--w11-muted); font-style: normal; }
.tel-artnr { font-variant-numeric: tabular-nums; color: var(--w11-muted); margin-right: 4px; }

/* Anruf-Banner – oben am Monitor, horizontal verschiebbar */
.tel-banner-host {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 200000;
  pointer-events: none;
  height: 0;
  overflow: visible;
}
.tel-banner-host[hidden] { display: none !important; }
.tel-banner {
  pointer-events: auto;
  position: absolute;
  top: 0;
  left: 8px;
  width: min(560px, calc(100vw - 16px));
  box-sizing: border-box;
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 14px 14px 12px 16px;
  border-radius: 0 0 16px 16px;
  border: 1px solid var(--w11-win-border);
  border-top: none;
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--w11-accent) 22%, var(--w11-titlebar)) 0%,
      var(--w11-win-body) 55%);
  color: var(--w11-text);
  box-shadow:
    0 18px 48px color-mix(in srgb, #000 38%, transparent),
    0 0 0 1px color-mix(in srgb, var(--w11-accent) 28%, transparent);
  transform: translateY(-120%);
  opacity: 0;
  transition: transform 0.48s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease;
  overflow: hidden;
  will-change: transform, left;
}
.tel-banner.tel-banner-in {
  transform: translateY(0);
  opacity: 1;
}
.tel-banner.tel-banner-out {
  transform: translateY(-110%);
  opacity: 0;
}
.tel-banner.is-dragging {
  transition: none;
  cursor: grabbing;
  user-select: none;
}
body.tel-banner-dragging {
  cursor: grabbing !important;
  user-select: none !important;
}
.tel-banner-glow {
  position: absolute;
  inset: -40% -20% auto;
  height: 120%;
  background: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, var(--w11-accent) 35%, transparent), transparent 70%);
  pointer-events: none;
}
.tel-banner-drag {
  flex: 1;
  min-width: 0;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  cursor: grab;
}
.tel-banner.is-dragging .tel-banner-drag { cursor: grabbing; }
.tel-banner-ico {
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(145deg, var(--w11-accent), color-mix(in srgb, var(--w11-accent) 55%, #0a3));
  box-shadow: 0 8px 20px color-mix(in srgb, var(--w11-accent) 40%, transparent);
  animation: tel-pulse 1.8s ease-in-out infinite;
}
@keyframes tel-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}
.tel-banner-body { flex: 1; min-width: 0; position: relative; }
.tel-banner-kicker {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--w11-muted);
  margin-bottom: 2px;
}
.tel-copyable {
  appearance: none;
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: copy;
  border-radius: 4px;
  max-width: 100%;
}
.tel-copyable:hover,
.tel-copyable:focus-visible {
  outline: none;
  background: color-mix(in srgb, var(--w11-accent) 14%, transparent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--w11-accent) 28%, transparent);
}
.tel-banner-name {
  display: inline-block;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--w11-text);
}
.tel-banner-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 6px;
  font-size: 0.88rem;
  align-items: center;
}
.tel-banner-phone {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--w11-accent);
}
.tel-banner-knr {
  color: var(--w11-muted);
  font-size: inherit;
}
.tel-banner-miss {
  margin-top: 8px;
  font-size: 0.8rem;
  color: color-mix(in srgb, #c42b1c 70%, var(--w11-text));
}
.tel-banner-orders { margin-top: 10px; }
.tel-banner-toggle {
  appearance: none;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-text) 6%, var(--w11-window-bg));
  color: var(--w11-text);
  border-radius: 999px;
  padding: 5px 12px;
  font: inherit;
  font-size: 0.78rem;
  cursor: pointer;
}
.tel-banner-toggle:hover,
.tel-banner-toggle.open {
  border-color: var(--w11-active-border);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.tel-banner-orders-panel {
  margin-top: 8px;
  max-height: min(36vh, 280px);
  overflow: auto;
  padding: 8px 6px 8px 8px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--w11-window-bg) 80%, transparent);
  border: 1px solid var(--w11-stroke);
  scrollbar-width: thin;
  scrollbar-color:
    color-mix(in srgb, var(--w11-accent) 55%, var(--w11-muted))
    color-mix(in srgb, var(--w11-window-bg) 70%, transparent);
}
.tel-banner-orders-panel::-webkit-scrollbar {
  width: 10px;
}
.tel-banner-orders-panel::-webkit-scrollbar-track {
  background: color-mix(in srgb, var(--w11-text) 6%, transparent);
  border-radius: 999px;
  margin: 4px 2px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--w11-stroke) 40%, transparent);
}
.tel-banner-orders-panel::-webkit-scrollbar-thumb {
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--w11-accent) 70%, #fff) 0%,
      var(--w11-accent) 45%,
      color-mix(in srgb, var(--w11-accent) 55%, #000) 100%);
  border-radius: 999px;
  border: 2px solid color-mix(in srgb, var(--w11-window-bg) 85%, transparent);
  background-clip: padding-box;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 22%, transparent),
    0 1px 2px color-mix(in srgb, #000 35%, transparent);
  min-height: 32px;
}
.tel-banner-orders-panel::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--w11-accent) 85%, #fff) 0%,
      color-mix(in srgb, var(--w11-accent) 90%, #fff) 50%,
      var(--w11-accent) 100%);
  border: 2px solid color-mix(in srgb, var(--w11-window-bg) 85%, transparent);
  background-clip: padding-box;
}
.tel-banner-orders-panel::-webkit-scrollbar-thumb:active {
  background: color-mix(in srgb, var(--w11-accent) 80%, #000);
}
.tel-banner-orders-panel::-webkit-scrollbar-corner { background: transparent; }
.tel-banner-orders-panel::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
.tel-banner-order {
  margin-bottom: 6px;
  font-size: 0.8rem;
}
.tel-banner-order summary {
  cursor: pointer;
  list-style: none;
}
.tel-banner-order summary::-webkit-details-marker { display: none; }
.tel-banner-ordline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.tel-banner-ord {
  font-weight: 700;
  color: var(--w11-text);
}
.tel-banner-ord-date {
  color: var(--w11-muted);
  flex-shrink: 0;
}
.tel-banner-order ul {
  margin: 4px 0 0;
  padding-left: 1.1rem;
  color: var(--w11-muted);
}
.tel-banner-close {
  appearance: none;
  border: none;
  background: transparent;
  color: var(--w11-muted);
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 6px;
  flex-shrink: 0;
}
.tel-banner-close:hover {
  background: color-mix(in srgb, var(--w11-text) 10%, transparent);
  color: var(--w11-text);
}
.tel-name-input {
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  padding: 2px 6px;
  margin: 0 0 0 -6px;
  width: calc(100% + 6px);
  max-width: 100%;
  box-sizing: border-box;
  font: inherit;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--w11-text);
  border-radius: 6px;
  cursor: text;
}
.tel-name-input::placeholder {
  color: var(--w11-muted);
  font-weight: 600;
  opacity: 0.85;
}
.tel-name-input:hover {
  background: color-mix(in srgb, var(--w11-accent) 10%, transparent);
}
.tel-name-input:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--w11-accent) 55%, transparent);
  background: color-mix(in srgb, var(--w11-window-bg) 55%, transparent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--w11-accent) 28%, transparent);
}
.tel-hist-list {
  margin-top: 4px;
  max-height: min(60vh, 520px);
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-right: 4px;
}
.tel-hist-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 10px;
  padding: 8px 10px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--w11-window-bg) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
}
.tel-hist-row .tel-name-input {
  font-size: 0.98rem;
  margin: 0;
  width: 100%;
}
.tel-hist-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  grid-column: 1 / -1;
  font-size: 0.8rem;
}
.tel-hist-at {
  color: var(--w11-muted);
  font-variant-numeric: tabular-nums;
  justify-self: end;
  font-size: 0.72rem;
  white-space: nowrap;
}
.tel-hist-empty {
  margin-top: 8px;
  color: var(--w11-muted);
  font-size: 0.85rem;
}
.tel-banner-history .tel-banner-ico { animation: none; }


/* —— CSV-Exporter —— */
.w11-win-body #acc-csv-exporter.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.csvexp-shell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.csvexp-export-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 8px 12px 0;
  flex-shrink: 0;
  border-bottom: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 40%, var(--w11-win-body));
}
.csvexp-export-tab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 220px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--w11-muted);
  padding: 6px 12px;
  border-radius: 8px 8px 0 0;
  cursor: pointer;
  font: 600 13px/1.2 "Segoe UI", var(--w11-font);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.csvexp-export-tab:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-highlight) 30%, transparent);
}
.csvexp-export-tab.active {
  color: var(--w11-text);
  background: var(--w11-window-bg);
  border-color: var(--w11-stroke);
  border-bottom-color: var(--w11-window-bg);
  margin-bottom: -1px;
  box-shadow: inset 0 -2px 0 var(--w11-accent);
}
.csvexp-export-tab-name {
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  width: 140px;
  min-width: 80px;
  max-width: 180px;
  padding: 0;
  outline: none;
}
.csvexp-export-tab-del {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  padding: 0 2px;
  border-radius: 4px;
}
.csvexp-export-tab-del:hover {
  color: #c42b1c;
  background: color-mix(in srgb, #c42b1c 14%, transparent);
}
.csvexp-export-add {
  min-width: 36px;
  justify-content: center;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--w11-accent);
}
.csvexp-check { gap: 8px !important; }
.csvexp-tabs {
  display: flex;
  gap: 2px;
  padding: 6px 12px 0;
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.csvexp-tab {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 8px 14px;
  border-radius: 8px 8px 0 0;
  cursor: pointer;
  font: 600 13px/1 "Segoe UI", var(--w11-font);
}
.csvexp-tab:hover { color: var(--w11-text); background: color-mix(in srgb, var(--w11-highlight) 35%, transparent); }
.csvexp-tab.active {
  color: var(--w11-text);
  background: var(--w11-window-bg);
  box-shadow: inset 0 -2px 0 var(--w11-accent);
}
.csvexp-body { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
.csvexp-pane { flex: 1; min-height: 0; overflow: hidden; padding: 12px; display: flex; flex-direction: column; }
.csvexp-pane-map { gap: 0; padding-bottom: 0; }
.csvexp-pane[data-csvexp-pane="filters"],
.csvexp-pane[data-csvexp-pane="skip"],
.csvexp-pane[data-csvexp-pane="csv"],
.csvexp-pane[data-csvexp-pane="settings"] { overflow: auto; }
.csvexp-pane-skip { padding: 12px; }
.csvexp-pane-csv { padding: 12px; }
.csvexp-csv-settings {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
}
.csvexp-csv-settings-page {
  max-width: 420px;
}
.csvexp-csv-settings h3 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 650;
  color: var(--w11-text);
}
.csvexp-csv-settings .csvexp-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.csvexp-csv-settings .csvexp-field input,
.csvexp-csv-settings .csvexp-field select {
  background: var(--w11-win-body);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  padding: 6px 8px;
  font: inherit;
}
.csvexp-csv-settings-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.csvexp-csv-settings-check {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--w11-text);
  font-size: 0.85rem;
}
.csvexp-btn-gen { align-self: stretch; margin-top: 4px; }
.csvexp-map {
  display: grid;
  grid-template-columns: minmax(220px, 280px) 1fr;
  gap: 12px;
  flex: 1;
  min-height: 0;
}
.csvexp-palette-wrap,
.csvexp-cols-wrap {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
  overflow: hidden;
}
.csvexp-palette-wrap > header,
.csvexp-cols-wrap > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 40%, var(--w11-window-bg));
}
.csvexp-palette-wrap > header small { color: var(--w11-muted); font-size: 0.75rem; }
.csvexp-cols-wrap > header small { color: var(--w11-muted); font-size: 0.72rem; margin-right: auto; margin-left: 8px; }
.csvexp-palette,
.csvexp-columns {
  max-height: calc(6 * 44px + 12px);
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  flex: 0 1 auto;
}
.csvexp-palette { padding: 10px; }
.csvexp-columns {
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.csvexp-pal-cat { margin-bottom: 14px; }
.csvexp-pal-cat h4 {
  margin: 0 0 8px;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--w11-muted);
}
.csvexp-pal-chips { display: flex; flex-direction: column; gap: 6px; }
.csvexp-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
  color: var(--w11-text);
  border-radius: 10px;
  padding: 8px 10px;
  cursor: grab;
  transition: border-color .15s, transform .12s, box-shadow .15s;
}
.csvexp-chip:hover {
  border-color: var(--w11-accent);
  box-shadow: 0 4px 14px color-mix(in srgb, var(--w11-accent) 22%, transparent);
  transform: translateY(-1px);
}
.csvexp-chip:active { cursor: grabbing; }
.csvexp-chip-grip { opacity: .45; font-size: 0.7rem; letter-spacing: -1px; }
.csvexp-col-row {
  display: grid;
  grid-template-columns: 22px 22px 26px 26px minmax(120px, 180px) minmax(100px, 0.95fr) minmax(100px, 1.05fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 4px 8px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-win-body);
  transition: border-color .15s, box-shadow .15s, opacity .12s;
}
.csvexp-col-row:hover {
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
}
.csvexp-col-row.is-disabled {
  opacity: 0.55;
  background: color-mix(in srgb, var(--w11-muted) 8%, var(--w11-win-body));
}
.csvexp-col-row.is-disabled .csvexp-col-header,
.csvexp-col-row.is-disabled .csvexp-col-sources,
.csvexp-col-row.is-disabled .csvexp-col-filters {
  text-decoration: line-through;
  text-decoration-color: color-mix(in srgb, var(--w11-muted) 55%, transparent);
}
.csvexp-col-enable {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  cursor: pointer;
}
.csvexp-col-enable input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: var(--w11-accent);
  cursor: pointer;
}
.csvexp-col-row.is-dragging { opacity: .45; }
.csvexp-col-row.is-drop-target {
  border-color: var(--w11-accent);
  box-shadow: inset 0 0 0 1px var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-win-body));
}
.csvexp-col-grip {
  cursor: grab;
  opacity: .5;
  font-size: 0.72rem;
  letter-spacing: -1px;
  text-align: center;
  user-select: none;
}
.csvexp-col-grip:active { cursor: grabbing; }
.csvexp-col-sources {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  align-items: center;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 2px 6px;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--w11-stroke) 80%, transparent);
  background: color-mix(in srgb, var(--w11-window-bg) 90%, var(--w11-win-body));
}
.csvexp-col-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  min-width: 0;
  max-height: 52px;
  overflow: hidden;
  padding: 2px 6px;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--w11-stroke) 65%, transparent);
  background: color-mix(in srgb, var(--w11-window-bg) 92%, var(--w11-win-body));
}
.csvexp-col-filters .csvexp-no-filters {
  font-size: 0.75rem;
  white-space: nowrap;
}
.csvexp-filter-pill {
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.csvexp-field-drag .csvexp-col-sources {
  flex-wrap: wrap;
  overflow: visible;
  white-space: normal;
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.csvexp-col-row.is-csv-hidden .csvexp-col-header {
  color: var(--w11-muted);
}
.csvexp-col-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  min-width: 26px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  line-height: 1;
  font-size: 1.05rem;
}
.csvexp-col-icon:hover {
  background: color-mix(in srgb, var(--w11-highlight) 40%, transparent);
  color: var(--w11-text);
}
.csvexp-col-eye {
  color: var(--w11-text);
}
.csvexp-col-eye.is-off {
  color: var(--w11-muted);
  opacity: 0.7;
}
.csvexp-col-x:hover {
  background: color-mix(in srgb, #c42b1c 18%, var(--w11-window-bg));
  color: #c42b1c;
}
.csvexp-ico {
  width: 16px;
  height: 16px;
  display: block;
}
.csvexp-col-actions { display: flex; gap: 0; flex-shrink: 0; }
.csvexp-drop-hint {
  border: 2px dashed color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  border-radius: 14px;
  padding: 28px 20px;
  text-align: center;
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-accent) 6%, var(--w11-window-bg));
  margin: 8px;
}
.csvexp-drop-hint.is-field-drop-active {
  border-color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  color: var(--w11-text);
}
.csvexp-insert-marker {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 2px 8px 6px;
  color: var(--w11-accent);
  font-size: 0.78rem;
  font-weight: 600;
}
.csvexp-insert-marker::before,
.csvexp-insert-marker::after {
  content: "";
  flex: 1;
  height: 2px;
  background: var(--w11-accent);
  border-radius: 2px;
}
.csvexp-col-row.is-field-drop-before {
  border-color: var(--w11-accent);
  box-shadow: inset 0 3px 0 0 var(--w11-accent);
  position: relative;
}
.csvexp-col-row.is-field-drop-before::before {
  content: "Neue Spalte";
  position: absolute;
  top: -1px;
  left: 28px;
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--w11-accent);
  background: var(--w11-win-body);
  padding: 0 6px;
  line-height: 1.2;
  pointer-events: none;
  z-index: 2;
}
.csvexp-col-sources.is-field-drop-zone.is-field-drop-on-source,
.csvexp-col-row.is-field-drop-on-source .csvexp-col-sources {
  border-color: var(--w11-accent);
  border-style: solid;
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
  box-shadow: inset 0 0 0 1px var(--w11-accent);
}
.csvexp-src-pill-ghost-wrap {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.csvexp-src-pill-ghost {
  border-style: dashed;
  background: color-mix(in srgb, var(--w11-highlight) 50%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke));
  color: var(--w11-text);
  font-weight: 500;
}
.csvexp-field-drag .csvexp-drop-hint.is-field-drop-active {
  border-color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  color: var(--w11-text);
}
#csvexp-columns.is-field-drop-end {
  box-shadow: inset 0 -3px 0 0 var(--w11-accent);
}
.csvexp-insert-marker-end {
  margin-top: 4px;
  margin-bottom: 8px;
}
.csvexp-chip.is-dragging { opacity: 0.55; }
.csvexp-img-url { cursor: help; }
.csvexp-img-url-t {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--w11-accent);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--w11-accent) 45%, transparent);
}
.csvexp-img-preview {
  position: fixed;
  z-index: 10050;
  max-width: min(420px, 90vw);
  max-height: min(420px, 70vh);
  padding: 6px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  box-shadow: 0 8px 28px color-mix(in srgb, #000 28%, transparent);
  pointer-events: none;
}
.csvexp-img-preview img {
  display: block;
  max-width: min(408px, 88vw);
  max-height: min(408px, 68vh);
  width: auto;
  height: auto;
  border-radius: 6px;
}
.csvexp-img-preview-loading,
.csvexp-img-preview-err {
  padding: 24px 32px;
  text-align: center;
  min-width: 120px;
}
.csvexp-col-idx {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.72rem;
  font-weight: 700;
  background: var(--w11-accent);
  color: #fff;
  flex-shrink: 0;
}
.csvexp-col-header {
  width: 100%;
  border: 1px solid transparent;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font-weight: 600;
  padding: 4px 8px;
  min-width: 0;
  border-radius: 6px;
}
.csvexp-col-header:focus {
  border-color: var(--w11-accent);
  outline: none;
}
.csvexp-src-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-accent) 35%, var(--w11-stroke));
  font-size: 0.8rem;
  font-weight: 600;
}
.csvexp-join { color: var(--w11-muted); font-style: normal; font-size: 0.75rem; padding: 0 2px; }
.csvexp-preview-dock {
  flex-shrink: 0;
  border-top: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 35%, var(--w11-win-body));
  display: flex;
  flex-direction: column;
  min-height: 160px;
  max-height: 38%;
}
.csvexp-preview-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.csvexp-preview-head .muted { font-size: 0.78rem; margin-right: auto; }
.csvexp-preview-modes {
  display: inline-flex;
  gap: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
}
.csvexp-preview-mode {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  font-size: 0.75rem;
  padding: 4px 10px;
  cursor: pointer;
  font-family: inherit;
}
.csvexp-preview-mode + .csvexp-preview-mode {
  border-left: 1px solid var(--w11-stroke);
}
.csvexp-preview-mode:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-highlight) 40%, transparent);
}
.csvexp-preview-mode.active {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  font-weight: 600;
}
.csvexp-preview {
  flex: 1;
  margin: 0;
  padding: 10px 12px;
  border: 0;
  border-radius: 0;
  background: color-mix(in srgb, #107c10 8%, var(--w11-window-bg));
  color: var(--w11-text);
  font: 12px/1.45 Consolas, "Cascadia Mono", monospace;
  white-space: pre-wrap;
  overflow: auto;
  min-height: 0;
}
.csvexp-preview-grid {
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: var(--w11-window-bg);
}
.csvexp-preview-grid-empty {
  padding: 16px 12px;
  font-size: 0.82rem;
}
.csvexp-sheet {
  border-collapse: collapse;
  width: max-content;
  min-width: 100%;
  table-layout: fixed;
  font-size: 0.78rem;
  color: var(--w11-text);
}
.csvexp-sheet th,
.csvexp-sheet td {
  border: 1px solid var(--w11-stroke);
  padding: 4px 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.csvexp-sheet td.csvexp-cell-has-copy {
  position: relative;
  padding-right: 26px;
}
.csvexp-cell-val {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.csvexp-cell-copy {
  position: absolute;
  top: 50%;
  right: 3px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  flex-shrink: 0;
}
.csvexp-cell-copy:hover {
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
}
.csvexp-sheet thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
  font-weight: 600;
  text-align: left;
  box-shadow: 0 1px 0 var(--w11-stroke);
  padding-right: 10px;
}
.csvexp-th-label {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.csvexp-col-resize {
  position: absolute;
  top: 0;
  right: 0;
  width: 7px;
  height: 100%;
  cursor: col-resize;
  user-select: none;
  touch-action: none;
}
.csvexp-col-resize:hover,
body.csvexp-col-resizing .csvexp-col-resize {
  background: color-mix(in srgb, var(--w11-accent) 40%, transparent);
}
body.csvexp-col-resizing {
  cursor: col-resize;
  user-select: none;
}
.csvexp-sheet tbody tr:nth-child(even) td {
  background: color-mix(in srgb, var(--w11-highlight) 28%, var(--w11-window-bg));
}
.csvexp-sheet tbody tr:hover td {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.csvexp-src-del:hover {
  background: color-mix(in srgb, #c42b1c 18%, var(--w11-window-bg));
  color: #c42b1c;
}
.w11-window[data-app-id="csv-exporter-col"] .w11-title-ico,
.w11-window[data-app-id^="csv-exporter-col"] .w11-title-ico,
html[data-sm-app="csv-exporter-col"] .w11-title-ico {
  display: none !important;
}
.csvexp-col-dlg {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.csvexp-col-dlg-head { flex-shrink: 0; }
.csvexp-col-dlg-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 14px 16px;
}
.csvexp-col-dlg-foot { flex-shrink: 0; }
.w11-win-body #acc-csv-exporter-col.w11-hosted {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.csvexp-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; font-size: 0.82rem; color: var(--w11-muted); }
.csvexp-field input,
.csvexp-field textarea,
.csvexp-field select,
.csvexp-join-row input,
.csvexp-join-row select,
.csvexp-filter-row input,
.csvexp-filter-row select,
.csvexp-affix input,
.csvexp-cond-row input,
.csvexp-cond-row select {
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  padding: 6px 8px;
}
.csvexp-join-row { display: flex; gap: 8px; }
.csvexp-join-card {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  padding: 8px 12px;
  margin: 0;
  background: var(--w11-window-bg);
  transition: border-color .15s;
}
.csvexp-join-card:hover {
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.csvexp-join-label {
  flex: 0 0 auto;
  font-size: 0.82rem;
  color: var(--w11-muted);
  white-space: nowrap;
}
.csvexp-join-card select,
.csvexp-join-card input {
  flex: 1 1 auto;
  min-width: 0;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  padding: 6px 8px;
  font-size: 0.82rem;
}
.csvexp-join-card select { flex: 1 1 160px; max-width: 220px; }
.csvexp-join-card input { flex: 1 1 100px; max-width: 180px; }
.csvexp-src-card {
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  padding: 0;
  margin: 0;
  background: var(--w11-window-bg);
  overflow: hidden;
  transition: border-color .15s, box-shadow .15s, opacity .12s;
}
.csvexp-src-card:hover {
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
}
.csvexp-src-card.is-dragging { opacity: .4; }
.csvexp-src-card.is-drop-target {
  border-color: var(--w11-accent);
  box-shadow: inset 0 0 0 1px var(--w11-accent);
}
.csvexp-src-head {
  display: grid;
  grid-template-columns: 22px 28px 1fr minmax(0, 4.6rem) 26px;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  margin: 0;
  background: color-mix(in srgb, var(--w11-titlebar) 45%, var(--w11-window-bg));
  border-bottom: 1px solid var(--w11-stroke);
}
.csvexp-src-card.is-collapsed .csvexp-src-head { border-bottom: 0; }
.csvexp-src-card.is-collapsed .csvexp-src-body { display: none; }
.csvexp-src-grip {
  cursor: grab;
  opacity: .5;
  font-size: 0.72rem;
  letter-spacing: -1px;
  text-align: center;
  user-select: none;
}
.csvexp-src-grip:active { cursor: grabbing; }
.csvexp-src-fold {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  font-size: 0.85rem;
}
.csvexp-src-fold:hover {
  background: color-mix(in srgb, var(--w11-highlight) 40%, transparent);
  color: var(--w11-text);
}
.csvexp-src-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.88rem;
  color: var(--w11-text);
}
.csvexp-src-body { padding: 10px 12px 12px; }
.csvexp-src-type-sel {
  width: 100%;
  max-width: 4.6rem;
  min-width: 0;
  font-size: 0.72rem;
  padding: 3px 4px;
  height: 26px;
}
.csvexp-src-del {
  min-width: 26px;
}
.csvexp-src-stack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}
.csvexp-src-plus {
  align-self: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px dashed var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-highlight) 16%, var(--w11-window-bg));
  color: var(--w11-text);
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}
.csvexp-src-plus:hover {
  border-style: solid;
  border-color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  color: var(--w11-text);
}
.csvexp-src-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.csvexp-empty-src { padding: 16px; text-align: center; color: var(--w11-muted); border: 1px dashed var(--w11-stroke); border-radius: 10px; }
.csvexp-currency-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: flex-end;
  margin: 8px 0 0;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 6%, var(--w11-window-bg));
}
.csvexp-measure-opts {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 8px 0 0;
}
.csvexp-measure-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: flex-end;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 6%, var(--w11-window-bg));
}
.csvexp-measure-dec,
.csvexp-measure-sep {
  margin: 0 !important;
  min-width: 160px;
}
.csvexp-image-opts {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.csvexp-image-opts .csvexp-field { margin: 0; min-width: 180px; }
.csvexp-image-opts small.muted { line-height: 1.35; }
.csvexp-image-opts code {
  font-size: 0.85em;
  color: var(--w11-muted);
}
.csvexp-currency-sep { margin: 0 !important; min-width: 160px; }
.csvexp-var-menu {
  position: fixed;
  z-index: 100000;
  min-width: 220px;
  max-width: 340px;
  max-height: min(360px, 70vh);
  overflow: auto;
  padding: 6px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: 0 12px 32px color-mix(in srgb, #000 35%, transparent);
}
.csvexp-var-title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--w11-muted);
  padding: 6px 10px 8px;
}
.csvexp-var-section {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--w11-muted);
  padding: 10px 10px 4px;
  border-top: 1px solid var(--w11-stroke);
  margin-top: 4px;
}
.csvexp-var-section:first-of-type { border-top: 0; margin-top: 0; }
.csvexp-var-empty {
  padding: 12px 10px;
  color: var(--w11-muted);
  font-size: 0.85rem;
}
.csvexp-var-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  border-radius: 8px;
  padding: 8px 10px;
  cursor: pointer;
}
.csvexp-var-item:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
}
.csvexp-var-item .muted {
  font-size: 0.75rem;
  font-family: Consolas, "Cascadia Mono", monospace;
  color: var(--w11-muted);
}
.csvexp-conds-h::after {
  content: none;
}
.csvexp-cond-eq {
  flex: 0 0 auto;
  color: var(--w11-muted);
  font-weight: 600;
  padding: 0 2px;
}
.csvexp-cond-row select[data-cond-then-target] {
  max-width: 140px;
  flex: 0 1 140px;
  min-width: 90px;
}
.csvexp-cond-row input[data-cond-val] {
  flex: 0 1 110px;
  min-width: 72px;
  max-width: 140px;
}
.csvexp-cond-row input[data-cond-then] {
  flex: 1 1 100px;
  min-width: 80px;
}
.csvexp-cond-row select[data-cond-op] {
  flex: 0 0 auto;
  max-width: 120px;
}
.csvexp-cond-del {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  min-width: 26px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--w11-muted);
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
}
.csvexp-cond-del:hover {
  background: color-mix(in srgb, #c42b1c 18%, var(--w11-window-bg));
  color: #c42b1c;
}
.csvexp-src-list textarea { min-height: 88px; font-family: Consolas, "Cascadia Mono", monospace; font-size: 0.82rem; }
.csvexp-transforms {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 10px;
}
.csvexp-transforms > .csvexp-filter-group,
.csvexp-transforms > .csvexp-fold-box {
  margin: 0;
}
.csvexp-filter-group {
  padding: 8px 10px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: color-mix(in srgb, var(--w11-highlight) 10%, var(--w11-window-bg));
}
.csvexp-filter-group-title {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0;
}
.csvexp-fold-box-h {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  padding: 0;
  text-align: left;
}
.csvexp-fold-chev {
  flex: 0 0 auto;
  color: var(--w11-muted);
  font-size: 0.78rem;
  width: 12px;
}
.csvexp-fold-box .csvexp-fold-box-body { display: none; }
.csvexp-fold-box.is-open .csvexp-fold-box-body { display: block; }
.csvexp-fold-box.is-open .csvexp-fold-box-h { margin-bottom: 6px; }
.csvexp-filter-toggles { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 0; }
.csvexp-tog { display: flex; align-items: center; gap: 6px; font-size: 0.78rem; color: var(--w11-text); white-space: nowrap; }
.csvexp-affix { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
.csvexp-affix label { display: flex; flex-direction: column; gap: 4px; font-size: 0.75rem; color: var(--w11-muted); }
.csvexp-conds-h { display: flex; align-items: center; gap: 8px; font-size: 0.8rem; margin-bottom: 6px; color: var(--w11-muted); }
.csvexp-cond-row {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 6px;
  width: 100%;
  min-width: 0;
}
.csvexp-filters { max-width: 920px; }
.csvexp-filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; align-items: center; }
.csvexp-filter-actions { margin: 10px 0 16px; }
.csvexp-skip-rules { max-width: 920px; min-width: 0; }
.csvexp-skip-panel {
  padding: 14px 16px;
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
}
.csvexp-skip-enable { margin-bottom: 8px; }
.csvexp-skip-hint { margin: 0 0 14px; font-size: 0.82rem; }
.csvexp-skip-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 14px;
}
.csvexp-skip-presets-label {
  font-size: 0.78rem;
  color: var(--w11-muted);
  margin-right: 4px;
}
.csvexp-skip-list { display: flex; flex-direction: column; gap: 8px; }
.csvexp-skip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: color-mix(in srgb, var(--w11-highlight) 12%, var(--w11-window-bg));
}
.csvexp-skip-row-label {
  font-size: 0.78rem;
  color: var(--w11-muted);
  min-width: 64px;
}
.csvexp-skip-row select {
  flex: 1;
  min-width: 140px;
  font-size: 0.82rem;
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.csvexp-skip-row select[data-skip-op] {
  flex: 0 0 auto;
  min-width: 110px;
  max-width: 140px;
}
.csvexp-skip-empty { padding: 8px 2px; font-size: 0.82rem; }
.csvexp-settings { max-width: 980px; display: flex; flex-direction: column; gap: 14px; }
.csvexp-url-row { display: flex; gap: 8px; flex-wrap: wrap; }
.csvexp-url-row input { flex: 1; min-width: 180px; }
.csvexp-output-settings { gap: 16px; }
.csvexp-output-head h3 {
  margin: 0 0 4px;
  font-size: 1.05rem;
  color: var(--w11-text);
}
.csvexp-output-head p { margin: 0; }
.csvexp-output-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.95fr) minmax(280px, 1.15fr) minmax(240px, 0.95fr);
  gap: 14px;
  align-items: stretch;
}
@media (max-width: 1100px) {
  .csvexp-output-grid { grid-template-columns: 1fr 1fr; }
  .csvexp-output-log { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  .csvexp-output-grid { grid-template-columns: 1fr; }
  .csvexp-output-log { grid-column: auto; }
}
.csvexp-output-card {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.csvexp-output-card h4 {
  margin: 0;
  font-size: 0.92rem;
  color: var(--w11-text);
}
.csvexp-output-hint { margin: 0; font-size: 0.78rem; line-height: 1.35; }
.csvexp-format-hint {
  display: block;
  margin: 8px 2px 0;
  font-size: 0.75rem;
  line-height: 1.35;
}
.csvexp-output-schedule { align-items: center; }
.csvexp-clock {
  position: relative;
  width: min(280px, 100%);
  aspect-ratio: 1;
  margin: 4px auto 0;
}
.csvexp-clock-svg {
  width: 100%;
  height: 100%;
  display: block;
  filter: drop-shadow(0 8px 18px color-mix(in srgb, var(--w11-text) 12%, transparent));
}
.csvexp-clock-face {
  fill: url(#csvexpClockFace);
  stroke: var(--w11-win-border);
  stroke-width: 1.5;
}
.csvexp-clock-ring {
  fill: none;
  stroke: color-mix(in srgb, var(--w11-accent) 35%, var(--w11-stroke));
  stroke-width: 2;
  stroke-dasharray: 4 5;
}
.csvexp-clock-ticks line {
  stroke: var(--w11-muted);
  stroke-width: 2;
  stroke-linecap: round;
}
.csvexp-clock-hand-g {
  transform-origin: 110px 110px;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.csvexp-clock-hand {
  stroke: var(--w11-accent);
  stroke-width: 3.5;
  stroke-linecap: round;
}
.csvexp-clock-hub {
  fill: var(--w11-accent);
  stroke: var(--w11-window-bg);
  stroke-width: 2;
}
.csvexp-clock-labels {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.csvexp-clock-label {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  border: 1px solid transparent;
  background: color-mix(in srgb, var(--w11-window-bg) 88%, transparent);
  color: var(--w11-muted);
  font-size: 0.68rem;
  font-weight: 600;
  padding: 3px 7px;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.15s;
}
.csvexp-clock-label:hover {
  color: var(--w11-text);
  border-color: var(--w11-stroke);
  transform: translate(-50%, -50%) scale(1.06);
}
.csvexp-clock-label.active {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke));
}
.csvexp-clock-center {
  position: absolute;
  left: 50%;
  top: 58%;
  transform: translate(-50%, -50%);
  text-align: center;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.csvexp-clock-center strong {
  font-size: 1.35rem;
  color: var(--w11-text);
  letter-spacing: 0.02em;
}
.csvexp-clock-center span { font-size: 0.72rem; max-width: 120px; }
.csvexp-gen-meta { display: flex; flex-direction: column; gap: 8px; }
.csvexp-gen-meta-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  padding: 6px 0;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
}
.csvexp-gen-meta-row strong { color: var(--w11-text); font-size: 0.9rem; text-align: right; }
.csvexp-progress {
  margin-top: 4px;
  padding: 10px 12px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--w11-highlight) 18%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
}
.csvexp-progress.is-running {
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
}
.csvexp-progress-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.82rem;
  color: var(--w11-text);
  margin-bottom: 6px;
}
.csvexp-progress-track {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-muted) 18%, var(--w11-window-bg));
  overflow: hidden;
}
.csvexp-progress-track > i {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--w11-accent), color-mix(in srgb, var(--w11-accent) 55%, var(--w11-highlight)));
  transition: width 0.35s ease;
}
.csvexp-progress.is-running .csvexp-progress-track > i {
  animation: csvexp-progress-pulse 1.4s ease-in-out infinite;
}
@keyframes csvexp-progress-pulse {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.15); }
}
.csvexp-dl-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 6px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  color: var(--w11-text);
  cursor: pointer;
  text-align: left;
  transition: background 0.15s, border-color 0.15s, transform 0.12s;
}
.csvexp-dl-btn.csvexp-gen-btn {
  border-color: color-mix(in srgb, #107c10 40%, var(--w11-stroke));
  background: color-mix(in srgb, #107c10 12%, var(--w11-window-bg));
}
.csvexp-dl-btn.csvexp-gen-btn .csvexp-dl-ico {
  background: color-mix(in srgb, #107c10 22%, var(--w11-window-bg));
  color: color-mix(in srgb, #107c10 70%, var(--w11-text));
}
.csvexp-dl-btn.csvexp-gen-btn:hover:not(:disabled) {
  background: color-mix(in srgb, #107c10 20%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 55%, var(--w11-stroke));
}
.csvexp-gen-shell {
  display: flex;
  align-items: stretch;
  margin-top: 6px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #107c10 40%, var(--w11-stroke));
  background: color-mix(in srgb, #107c10 12%, var(--w11-window-bg));
  overflow: hidden;
  transition: border-color 0.15s, background 0.15s;
}
.csvexp-gen-shell:hover {
  background: color-mix(in srgb, #107c10 20%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #107c10 55%, var(--w11-stroke));
}
.csvexp-gen-shell .csvexp-gen-btn {
  flex: 1;
  min-width: 0;
  margin: 0;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  transform: none !important;
  box-shadow: none !important;
}
.csvexp-gen-shell .csvexp-gen-btn:hover:not(:disabled) {
  background: transparent !important;
  transform: none !important;
}
.csvexp-gen-shell .csvexp-gen-btn:disabled {
  opacity: 1;
  cursor: default;
}
.csvexp-gen-cancel-part {
  flex: 0 0 auto;
  align-self: stretch;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.75rem;
  padding: 0 14px;
  margin: 0;
  border: 0;
  border-left: 1px solid color-mix(in srgb, #c42b1c 40%, var(--w11-stroke));
  background: color-mix(in srgb, #c42b1c 16%, transparent);
  color: color-mix(in srgb, #c42b1c 75%, var(--w11-text));
  font: inherit;
  font-size: 0.86rem;
  font-weight: 650;
  cursor: pointer;
  white-space: nowrap;
}
.csvexp-gen-cancel-part:hover:not(:disabled) {
  background: color-mix(in srgb, #c42b1c 28%, transparent);
}
.csvexp-gen-cancel-part[hidden] {
  display: none !important;
}
.csvexp-gen-shell.is-running {
  border-color: color-mix(in srgb, #107c10 45%, var(--w11-stroke));
}
.csvexp-output-log .csvexp-dl-log {
  flex: 1;
  min-height: 140px;
  max-height: 320px;
  overflow: auto;
}
.csvexp-dl-btn:hover:not(:disabled) {
  background: color-mix(in srgb, var(--w11-accent) 24%, var(--w11-window-bg));
  border-color: var(--w11-accent);
  transform: translateY(-1px);
}
.csvexp-dl-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.csvexp-dl-ico {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-window-bg));
  color: var(--w11-accent);
  flex-shrink: 0;
}
.csvexp-dl-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.csvexp-dl-text strong { font-size: 0.92rem; }
.csvexp-dl-text small { color: var(--w11-muted); font-size: 0.75rem; }
.csvexp-dl-log {
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  overflow: hidden;
  background: var(--w11-win-body);
}
.csvexp-dl-log-empty { padding: 14px; }
.csvexp-dl-log-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}
.csvexp-dl-log-table th,
.csvexp-dl-log-table td {
  padding: 8px 10px;
  text-align: left;
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.csvexp-dl-log-table th {
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
  color: var(--w11-muted);
  font-weight: 600;
}
.csvexp-dl-log-table tr:last-child td { border-bottom: 0; }
.csvexp-muted { color: var(--w11-muted); font-size: 0.85rem; }
.csvexp-empty { padding: 40px; text-align: center; color: var(--w11-muted); }
#csvexp-btn-save.is-dirty {
  outline: 2px solid var(--w11-accent);
  outline-offset: 1px;
}
.win-app-btn.ghost {
  background: transparent;
  border: 0;
  color: var(--w11-muted);
  padding: 2px 6px;
}
.win-app-btn.ghost:hover { color: var(--w11-text); background: color-mix(in srgb, var(--w11-highlight) 40%, transparent); }
.win-app-btn.ghost.danger:hover { color: #c42b1c; }

/* === Inventur === */
.w11-win-body #acc-inventur.w11-hosted,
.w11-win-body #acc-inventur-pair.w11-hosted {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.inv-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
}
.inv-main {
  display: flex;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.inv-side {
  width: 220px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  min-height: 0;
}
.inv-side-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 10px 8px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--w11-muted);
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.inv-side-add {
  min-width: 32px;
  width: 32px;
  height: 28px;
  padding: 0;
  font-size: 1.15rem;
  line-height: 1;
  font-weight: 600;
}
.inv-side-list {
  list-style: none;
  margin: 0;
  padding: 6px;
  overflow: auto;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.inv-side-list li {
  margin: 0;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer;
  color: var(--w11-text);
  background: transparent;
}
.inv-side-list li:hover {
  background: color-mix(in srgb, var(--w11-highlight) 35%, transparent);
}
.inv-side-list li.is-selected {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
}
.inv-side-list li .inv-side-name {
  display: block;
  font-size: 0.86rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.inv-side-list li .inv-side-meta {
  display: block;
  margin-top: 2px;
  font-size: 0.72rem;
  color: var(--w11-muted);
}
.inv-side-list li .inv-side-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-right: 5px;
  background: var(--w11-muted);
  vertical-align: middle;
}
.inv-side-list li .inv-side-dot.on,
.inv-side-list li .inv-side-dot.active { background: #107c10; }
.inv-side-list li .inv-side-dot.paused { background: #c19c00; }
.inv-side-list li .inv-side-dot.ended { background: color-mix(in srgb, var(--w11-muted) 70%, transparent); }
.inv-side-list li.is-renaming {
  padding: 4px 6px;
  cursor: default;
}
.inv-side-rename {
  width: 100%;
  height: 28px;
  border: 1px solid var(--w11-accent);
  border-radius: 4px;
  padding: 0 8px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-size: 0.86rem;
  box-sizing: border-box;
}
.inv-side-empty {
  cursor: default !important;
  color: var(--w11-muted);
  font-size: 0.8rem;
  padding: 12px 10px !important;
}
.inv-side-empty:hover { background: transparent !important; }
.inv-devices-bar { display: none !important; }
.inv-content {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.inv-new-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.inv-new-body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.inv-new-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.85rem;
  color: var(--w11-muted);
}
.inv-new-input {
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font-size: 0.95rem;
}
.inv-new-opts {
  margin: 0;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.inv-new-opts legend {
  padding: 0 6px;
  font-size: 0.8rem;
  color: var(--w11-muted);
}
.inv-new-hint {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.35;
}
.inv-new-hint code {
  font-family: Consolas, ui-monospace, monospace;
  font-size: 0.85em;
}
.inv-new-status {
  min-height: 1.2em;
  margin: 0;
  font-size: 0.85rem;
  color: var(--w11-muted);
}
.inv-new-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: auto;
}
.w11-win-body #acc-inventur-new.w11-hosted {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.inv-toolbar {
  display: flex;
  align-items: center;
  justify-content: stretch;
  gap: 12px;
  flex-wrap: nowrap;
  padding: 8px 12px;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.inv-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  width: 100%;
}
.inv-toolbar-search-only {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.inv-search {
  flex: 1;
  width: 100%;
  min-width: 0;
  height: 34px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  padding: 0 14px;
  font-size: 0.95rem;
  background: var(--w11-window-bg);
  color: var(--w11-text);
}
.inv-filter-wrap {
  position: relative;
  flex-shrink: 0;
}
.inv-filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  min-width: 7.5rem;
  padding: 0 10px 0 12px;
  white-space: nowrap;
}
.inv-filter-caret {
  font-size: 0.75rem;
  opacity: 0.75;
}
.inv-filter-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 40;
  min-width: 220px;
  padding: 4px;
  border-radius: 8px;
  border: 1px solid var(--w11-win-border);
  background: var(--w11-window-bg);
  box-shadow: 0 10px 28px color-mix(in srgb, #000 28%, transparent);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.inv-filter-menu[hidden] {
  display: none !important;
}
.inv-filter-item {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  text-align: left;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 0.9rem;
  cursor: pointer;
}
.inv-filter-item:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
}
.inv-filter-item.is-active {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  color: var(--w11-text);
  font-weight: 600;
}
.inv-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  background: color-mix(in srgb, var(--w11-muted) 18%, var(--w11-window-bg));
  color: var(--w11-muted);
}
.inv-badge[data-state="on"] {
  background: color-mix(in srgb, #107c10 18%, var(--w11-window-bg));
  color: #107c10;
}
.inv-table-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: var(--w11-window-bg);
}
.inv-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}
.inv-table th,
.inv-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--w11-stroke);
  border-left: 1px solid color-mix(in srgb, var(--w11-stroke) 42%, transparent);
  text-align: left;
  white-space: nowrap;
  vertical-align: middle;
}
.inv-table th:first-child,
.inv-table td:first-child {
  border-left: 0;
}
.inv-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: color-mix(in srgb, var(--w11-titlebar-focus) 88%, var(--w11-window-bg));
  color: var(--w11-muted);
  font-weight: 600;
  letter-spacing: 0.01em;
}
.inv-th-sort {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.inv-th-sort::after {
  content: "";
  display: inline-block;
  width: 0.55em;
  margin-left: 0.35em;
  opacity: 0.35;
}
.inv-th-sort.is-asc::after { content: "▲"; opacity: 0.9; }
.inv-th-sort.is-desc::after { content: "▼"; opacity: 0.9; }
.inv-th-sort:hover { color: var(--w11-text); }
.inv-th-num { text-align: left; }
.inv-table .inv-name {
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.inv-table .inv-num {
  text-align: left;
  font-variant-numeric: tabular-nums;
}
.inv-table .inv-mono { font-family: Consolas, ui-monospace, monospace; }
.inv-table,
.inv-table th,
.inv-table td {
  -webkit-user-select: none;
  user-select: none;
}
.inv-row {
  cursor: pointer;
  transition: background 0.12s ease;
}
.inv-table tbody tr.inv-row:hover {
  background: color-mix(in srgb, var(--w11-highlight) 32%, var(--w11-window-bg));
}
.inv-table tbody tr.inv-row.inv-green:hover {
  background: color-mix(in srgb, #107c10 20%, color-mix(in srgb, var(--w11-highlight) 22%, var(--w11-window-bg)));
}
.inv-table tbody tr.inv-row.inv-yellow:hover {
  background: color-mix(in srgb, #c19c00 22%, color-mix(in srgb, var(--w11-highlight) 18%, var(--w11-window-bg)));
}
.inv-table tbody tr.inv-row.inv-red:hover {
  background: color-mix(in srgb, #c42b1c 20%, color-mix(in srgb, var(--w11-highlight) 18%, var(--w11-window-bg)));
}
.inv-table tbody tr.inv-row.inv-blue:hover {
  background: color-mix(in srgb, var(--w11-accent) 24%, color-mix(in srgb, var(--w11-highlight) 18%, var(--w11-window-bg)));
}
.inv-row.is-selected {
  outline: 2px solid color-mix(in srgb, var(--w11-accent) 70%, transparent);
  outline-offset: -2px;
  background: color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 18%, var(--w11-window-bg));
}
.inv-row.inv-green.is-selected {
  background: color-mix(in srgb, #107c10 22%, var(--w11-window-bg));
}
.inv-row.inv-yellow.is-selected {
  background: color-mix(in srgb, #c19c00 24%, var(--w11-window-bg));
}
.inv-row.inv-red.is-selected {
  background: color-mix(in srgb, #c42b1c 22%, var(--w11-window-bg));
}
.inv-row.inv-blue.is-selected {
  background: color-mix(in srgb, var(--w11-accent) 26%, var(--w11-window-bg));
}
.inv-soll {
  cursor: text;
  min-width: 4.5em;
  font-variant-numeric: tabular-nums;
  padding: 0;
}
.inv-soll-input {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 2.1em;
  box-sizing: border-box;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-radius: 0;
  outline: none;
  box-shadow: none;
  background: transparent;
  color: var(--w11-text);
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: left;
  line-height: inherit;
  -moz-appearance: textfield;
  appearance: textfield;
  -webkit-user-select: text;
  user-select: text;
  cursor: text;
}
.inv-soll-input:hover {
  background: color-mix(in srgb, var(--w11-highlight) 22%, transparent);
}
.inv-soll-input:focus {
  outline: none;
  box-shadow: none;
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
}
.inv-soll-input::-webkit-outer-spin-button,
.inv-soll-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.inv-row.inv-green { background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg)); }
.inv-row.inv-yellow { background: color-mix(in srgb, #c19c00 16%, var(--w11-window-bg)); }
.inv-row.inv-red { background: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg)); }
.inv-row.inv-blue { background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg)); }
.inv-row.inv-flash { animation: invFlash 0.65s ease; }
@keyframes invFlash {
  0% { box-shadow: inset 0 0 0 2px var(--w11-accent); }
  100% { box-shadow: inset 0 0 0 0 transparent; }
}
.inv-export-panel {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, #000 35%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}
.inv-shell { position: relative; }
.inv-export-card {
  width: min(520px, 92%);
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-win-border);
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 16px 40px color-mix(in srgb, #000 28%, transparent);
}
.inv-export-card header,
.inv-export-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.inv-export-card footer { margin-top: 12px; justify-content: flex-end; }
.inv-export-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
  max-height: 240px;
  overflow: auto;
}
.inv-check { display: flex; gap: 8px; align-items: center; color: var(--w11-text); font-size: 0.85rem; }
.inv-pair-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.inv-pair-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 12px;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.inv-pair-toolbar-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.inv-pair-main {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  gap: 0;
}
.inv-scanner-table-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: var(--w11-window-bg);
}
.inv-enroll-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.inv-enroll-body {
  padding: 12px 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.inv-enroll-code {
  font-size: 1.85rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-align: center;
  font-family: Consolas, ui-monospace, monospace;
  color: var(--w11-text);
  flex-shrink: 0;
}
.inv-enroll-codes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  flex: 1;
  min-height: 0;
}
.inv-enroll-code-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
}
.inv-enroll-code-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--w11-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.inv-enroll-barcode-wrap,
.inv-enroll-qr-wrap {
  flex: 1;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  background: #fff;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
}
.inv-enroll-barcode-wrap img,
.inv-enroll-qr-wrap img {
  max-width: 100%;
  max-height: 160px;
  width: auto;
  height: auto;
  object-fit: contain;
  background: #fff;
}
.inv-enroll-status { margin: 0; font-size: 0.8rem; color: var(--w11-muted); flex-shrink: 0; }
.inv-enroll-usb { margin-top: 2px; flex-shrink: 0; }
.inv-enroll-usb-msg { margin: 0; min-height: 1.1em; font-size: 0.78rem; color: var(--w11-muted); flex-shrink: 0; }
.inv-scanner-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}
.inv-scanner-table th,
.inv-scanner-table td {
  padding: 8px 10px;
  text-align: left;
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.inv-scanner-table th {
  position: sticky;
  top: 0;
  background: var(--w11-titlebar);
  font-weight: 600;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.inv-scanner-row { cursor: context-menu; }
.inv-scanner-row:hover { background: color-mix(in srgb, var(--w11-highlight) 35%, transparent); }
.inv-scanner-row.is-selected {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.inv-up-tag { color: var(--w11-accent); font-weight: 600; font-size: 0.8em; }
.inv-pair-hint { margin: 0; font-size: 0.78rem; }
.inv-enroll-link {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.75rem;
  flex-shrink: 0;
  max-width: 100%;
}
.inv-enroll-actions { display: flex; justify-content: flex-end; margin-top: auto; }
.w11-win-body #acc-inventur-enroll.w11-hosted {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.inv-pair-body {
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 100%;
  overflow: auto;
}
.inv-pair-qr-wrap {
  display: flex;
  justify-content: center;
  padding: 12px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
}
.inv-pair-qr-wrap img {
  width: 220px;
  height: 220px;
  image-rendering: pixelated;
  background: #fff;
  border-radius: 8px;
}
.inv-pair-link {
  font-size: 0.72rem;
  color: var(--w11-accent);
  word-break: break-all;
}
.inv-pair-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.inv-pair-devices { list-style: none; margin: 0; padding: 0; }
.inv-pair-devices li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--w11-stroke);
}
.inv-phone-btn { font-size: 0.95rem; }
.inv-pair-code {
  font-size: 2.4rem;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-align: center;
  padding: 10px 0 4px;
  color: var(--w11-text);
  font-family: Consolas, ui-monospace, monospace;
}
.inv-pair-barcode-wrap img {
  width: 100%;
  max-width: 420px;
  height: auto;
  min-height: 90px;
  object-fit: contain;
  background: #fff;
  border-radius: 8px;
  padding: 10px;
}
.inv-pair-qr-fallback {
  color: var(--w11-muted);
  font-size: 0.85rem;
}
.inv-pair-logs {
  max-height: 220px;
  overflow: auto;
  margin: 8px 0 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  font-family: Consolas, ui-monospace, monospace;
  font-size: 0.72rem;
  line-height: 1.45;
  color: var(--w11-text);
}
.inv-log-line { padding: 2px 0; border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent); }
.inv-log-line time { color: var(--w11-muted); margin-right: 6px; }
.inv-log-error { color: #c42b1c; }
.inv-log-info { color: var(--w11-text); }
.inv-pair-devices li {
  display: flex;
  align-items: center;
  gap: 10px;
}
.inv-dev-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  background: color-mix(in srgb, var(--w11-muted) 50%, transparent);
}
.inv-dev-dot.online { background: #107c10; box-shadow: 0 0 0 3px color-mix(in srgb, #107c10 25%, transparent); }
.inv-dev-dot.offline { background: #c42b1c; }
.inv-dev-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.inv-dev-meta small { color: var(--w11-muted); }
.inv-dev-actions { display: flex; gap: 8px; flex-shrink: 0; align-items: center; }
.inv-devices-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 12px 8px;
}
.inv-device-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.75rem;
  background: color-mix(in srgb, var(--w11-highlight) 40%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.inv-device-chip .inv-dev-dot { width: 8px; height: 8px; }
.inv-device-chip .inv-chip-up { margin-left: 6px; padding: 2px 8px; font-size: 0.75rem; }

.inv-dev-actions{display:flex;gap:8px;flex-shrink:0;align-items:center}
.inv-pair-devices li{display:flex;gap:10px;align-items:center}


/* Vaultwarden Systemsteuerung */
#acc-vaultwarden .vw-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
#acc-vaultwarden .vw-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 14px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
#acc-vaultwarden .vw-card {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  padding: 12px 14px 14px;
}
#acc-vaultwarden .vw-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
#acc-vaultwarden .vw-card-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
#acc-vaultwarden .vw-card-title strong {
  font-size: 14px;
  font-weight: 600;
  color: var(--w11-text);
}
#acc-vaultwarden .vw-card-title small {
  color: var(--w11-muted);
  font-size: 12px;
}
#acc-vaultwarden .vw-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
#acc-vaultwarden .vw-hint {
  margin: 10px 0 0;
  color: var(--w11-muted);
  font-size: 12px;
  line-height: 1.4;
}
#acc-vaultwarden .vw-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#acc-vaultwarden .vw-row {
  display: grid;
  grid-template-columns: 148px minmax(0, 1fr);
  gap: 10px 14px;
  align-items: center;
  min-height: 34px;
}
#acc-vaultwarden .vw-row > label {
  margin: 0;
  color: var(--w11-text);
  font-size: 13px;
  font-weight: 500;
}
#acc-vaultwarden .vw-ctrl {
  min-width: 0;
}
#acc-vaultwarden .vw-ctrl-split {
  display: flex;
  gap: 8px;
  align-items: center;
}
#acc-vaultwarden .vw-ctrl-split input {
  flex: 1;
  min-width: 0;
}
#acc-vaultwarden .vw-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--w11-text);
  font-size: 13px;
  cursor: pointer;
  user-select: none;
}
#acc-vaultwarden .vw-switch input {
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
}
#acc-vaultwarden .vw-ctrl input[type="url"],
#acc-vaultwarden .vw-ctrl input[type="text"],
#acc-vaultwarden .vw-ctrl input[type="number"],
#acc-vaultwarden .vw-ctrl input[type="password"],
#acc-vaultwarden .vw-ctrl select {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: var(--w11-win-body);
  color: var(--w11-text);
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  padding: 7px 10px;
  font-size: 13px;
}
#acc-vaultwarden .vw-badge {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  white-space: nowrap;
}
#acc-vaultwarden .vw-badge.is-on {
  color: #0b6a0b;
  border-color: color-mix(in srgb, #107c10 40%, var(--w11-stroke));
  background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg));
}
#acc-vaultwarden .vw-badge.is-warn {
  color: #9a5b00;
  border-color: color-mix(in srgb, #fce100 40%, var(--w11-stroke));
  background: color-mix(in srgb, #fce100 16%, var(--w11-window-bg));
}
#acc-vaultwarden .vw-badge.is-off {
  color: var(--w11-muted);
}
#acc-vaultwarden .vw-steps {
  margin: 0 0 12px;
  padding-left: 18px;
  color: var(--w11-text);
  font-size: 13px;
  line-height: 1.45;
}
#acc-vaultwarden .vw-steps li + li {
  margin-top: 4px;
}
#acc-vaultwarden .vw-steps em {
  font-style: normal;
  color: var(--w11-accent);
}
#acc-vaultwarden .vw-update-hint {
  color: var(--w11-text);
  font-size: 12px;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid color-mix(in srgb, var(--w11-accent) 35%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
  white-space: nowrap;
}
#acc-vaultwarden .vw-update-hint[hidden],
#acc-vaultwarden #btn-vw-update[hidden] {
  display: none !important;
}
@media (max-width: 560px) {
  #acc-vaultwarden .vw-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

.jtlc-shell {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
#acc-jtl-carts .win-app-status {
  display: none;
}
.jtlc-body {
  display: grid;
  grid-template-columns: 200px 228px minmax(0, 1fr);
  gap: 10px;
  min-height: 0;
  flex: 1;
  padding: 10px;
}
.jtlc-shops,
.jtlc-carts,
.jtlc-detail {
  min-height: 0;
  overflow: auto;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  padding: 10px;
}
.jtlc-h {
  font-weight: 650;
  margin-bottom: 8px;
}
.jtlc-shop,
.jtlc-cart,
.jtlc-hit {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  margin: 0 0 6px;
  padding: 8px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: transparent;
  color: var(--w11-text);
  text-align: left;
  cursor: pointer;
}
.jtlc-shop.is-on,
.jtlc-cart.is-on,
.jtlc-hit:hover,
.jtlc-shop:hover,
.jtlc-cart:hover {
  border-color: var(--w11-accent);
  background: var(--w11-highlight);
}
.jtlc-shop small,
.jtlc-cart small,
.jtlc-cart span,
.jtlc-line-title small,
.jtlc-note,
.jtlc-empty {
  color: var(--w11-muted);
  font-style: normal;
}
.jtlc-cart-foot {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  margin-top: 6px;
}
.jtlc-cart-foot em {
  margin: 0 0 0 auto;
}
.jtlc-customer {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: 9.6rem minmax(0, 1fr);
  margin: 0 0 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  overflow: hidden;
  background: var(--w11-win-body);
}
.jtlc-customer-total {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 42px;
  padding: 0 12px;
  background: var(--w11-window-bg);
}
.jtlc-customer-total span {
  color: var(--w11-muted);
}
.jtlc-customer-total strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.jtlc-customer > span,
.jtlc-customer > b {
  height: 28px;
  margin: 0;
  padding: 0 12px;
  border-top: 1px solid var(--w11-stroke);
  line-height: 28px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jtlc-customer > span {
  color: var(--w11-muted);
}
.jtlc-customer > b {
  font-weight: 600;
}
.jtlc-line {
  display: grid;
  grid-template-columns: 84px 128px 108px minmax(96px, 1fr) auto;
  gap: 8px 10px;
  align-items: end;
  margin-bottom: 10px;
  padding: 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-win-body);
}
.jtlc-line-title {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  min-width: 0;
}
.jtlc-line-title strong,
.jtlc-line-title small {
  grid-column: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jtlc-line-title strong {
  font-size: 0.95rem;
  line-height: 1.35;
}
.jtlc-edit {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.jtlc-edit > span {
  color: var(--w11-muted);
  font-size: 11px;
}
.jtlc-affix {
  display: flex;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
}
.jtlc-affix input {
  border: 0;
  background: transparent;
}
.jtlc-affix i {
  flex: 0 0 auto;
  padding-right: 8px;
  color: var(--w11-muted);
  font-style: normal;
}
.jtlc-edit-sum {
  justify-content: flex-end;
}
.jtlc-line-sum {
  font-variant-numeric: tabular-nums;
  line-height: 32px;
  white-space: nowrap;
}
.jtlc-x {
  grid-column: 2;
  grid-row: 1 / span 2;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--w11-muted);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.jtlc-x:hover {
  background: var(--w11-highlight);
  color: var(--w11-text);
}
.jtlc-line > .jtlc-btn {
  grid-column: 1 / -1;
  justify-self: start;
  height: 32px;
  min-width: 12.5rem;
  padding: 0 14px;
  white-space: nowrap;
}
.jtlc-ship {
  grid-template-columns: minmax(0, 1fr) 140px auto;
}
.jtlc-ship .jtlc-line-title {
  grid-column: auto;
}
.jtlc-form,
.jtlc-search {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 10px;
}
.jtlc-search {
  flex-direction: row;
}
.jtlc-form input,
.jtlc-search input,
.jtlc-edit input {
  width: 100%;
  min-width: 0;
  height: 32px;
  padding: 6px 8px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font-variant-numeric: tabular-nums;
}
.jtlc-affix input {
  height: 32px;
  border-radius: 8px 0 0 8px;
}
.jtlc-btn {
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-accent);
  color: #fff;
  padding: 6px 12px;
  cursor: pointer;
}
.jtlc-btn:disabled {
  cursor: default;
}
.jtlc-btn.is-confirmed {
  background: #107c10;
  border-color: #107c10;
}
#jtlc-hits {
  display: none;
}
.jtlc-line input:disabled {
  opacity: 0.55;
}
.jtlc-table {
  width: 100%;
  border-collapse: collapse;
}
.jtlc-table th,
.jtlc-table td {
  padding: 6px 4px;
  border-bottom: 1px solid var(--w11-stroke);
  vertical-align: middle;
}
.jtlc-table td small {
  display: block;
}
.jtlc-note {
  margin: 0 0 8px;
}
.jtlc-step {
  display: block;
  margin-top: 2px;
  color: var(--w11-accent);
  font-size: 0.78rem;
  font-weight: 650;
}
.jtlc-detail {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.jtlc-detail-main {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding-bottom: 68px;
}
.jtlc-plus-menu input {
  width: 100%;
  height: 32px;
  padding: 6px 8px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.jtlc-plus {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 5;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: var(--w11-accent);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}
.jtlc-plus-menu {
  position: absolute;
  right: 14px;
  bottom: 66px;
  z-index: 6;
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: min(280px, calc(100% - 28px));
  padding: 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
}
.jtlc-plus-menu[hidden] {
  display: none;
}
.jtlc-plus-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.jtlc-pop {
  position: fixed;
  z-index: 80;
  width: 280px;
  padding: 12px 14px;
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}
.jtlc-pop[hidden] {
  display: none;
}
.jtlc-pop strong {
  display: block;
  margin-bottom: 2px;
}
.jtlc-pop h3 {
  margin: 10px 0 4px;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.jtlc-pop p {
  margin: 0;
  line-height: 1.4;
}
.jtlc-hint {
  margin: -4px 0 8px;
  color: var(--w11-muted);
  font-size: 0.75rem;
}
.jtlc-modal {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: color-mix(in srgb, var(--w11-text) 28%, transparent);
}
.jtlc-modal[hidden] {
  display: none !important;
}
.jtlc-dialog {
  width: min(440px, 100%);
  margin: 0;
  padding: 16px 16px 14px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: 0 16px 40px color-mix(in srgb, #000 32%, transparent);
}
.jtlc-dialog h2 {
  margin: 0 0 14px;
  font-size: 1rem;
  font-weight: 650;
}
.jtlc-field {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}
.jtlc-field span {
  color: var(--w11-muted);
}
.jtlc-field input {
  width: 100%;
  padding: 7px 8px;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.jtlc-switch {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 2px 0 12px;
  cursor: pointer;
}
.jtlc-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.jtlc-switch span {
  width: 36px;
  height: 20px;
  border-radius: 999px;
  background: var(--w11-stroke);
  position: relative;
}
.jtlc-switch span::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--w11-text);
}
.jtlc-switch input:checked + span {
  background: var(--w11-accent);
}
.jtlc-switch input:checked + span::after {
  left: 18px;
}
.jtlc-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.jtlc-btn.ghost {
  background: transparent;
  color: var(--w11-text);
}

/* Marktplätze */
.mp-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.mp-tabs {
  display: flex;
  gap: 2px;
  padding: 8px 12px 0;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
  flex-shrink: 0;
}
.mp-tab {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 8px 14px;
  border-radius: 6px 6px 0 0;
  cursor: pointer;
  font: inherit;
}
.mp-tab.active {
  color: var(--w11-text);
  background: var(--w11-win-body);
  border: 1px solid var(--w11-stroke);
  border-bottom-color: var(--w11-win-body);
  margin-bottom: -1px;
}
.mp-pane {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  gap: 0;
}
.mp-pane[data-mp-pane="anbindung"],
.mp-subpane[data-mp-subpane="einstellungen"] {
  padding: 10px 12px;
  gap: 8px;
}
.mp-subpane[data-mp-subpane="produktzuordnung"] {
  padding: 0;
  gap: 0;
}
.mp-subpane[data-mp-subpane="produktzuordnung"] .mp-split {
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  flex: 1;
}
.mp-pane[hidden] {
  display: none !important;
}
.mp-subtabs {
  display: flex;
  gap: 2px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--w11-stroke);
  margin: 0;
  padding: 6px 10px 0;
  background: var(--w11-win-body);
}
.mp-subtab {
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 7px 12px;
  border-radius: 6px 6px 0 0;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
}
.mp-subtab.active {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
  border-bottom-color: transparent;
  margin-bottom: -1px;
}
.mp-subpane {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mp-subpane[hidden] {
  display: none !important;
}
.mp-settings {
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: auto;
  min-height: 0;
  padding-bottom: 8px;
}
.mp-settings-card {
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mp-settings-head strong {
  display: block;
  margin-bottom: 2px;
}
.mp-settings-head p {
  margin: 0;
  font-size: 12px;
}
.mp-settings-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
}
.mp-ship-proc {
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  overflow: hidden;
  background: var(--w11-win-body);
}
.mp-ship-proc-head,
.mp-ship-proc-row {
  display: grid;
  grid-template-columns: minmax(140px, 1.5fr) 72px 72px 100px;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
}
.mp-ship-proc-head {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--w11-muted);
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
}
.mp-ship-proc-body {
  max-height: min(420px, 50vh);
  overflow: auto;
}
.mp-ship-proc-row + .mp-ship-proc-row {
  border-top: 1px solid var(--w11-stroke);
}
.mp-ship-proc-label {
  font-size: 13px;
  color: var(--w11-text);
}
.mp-ship-proc-row input[type="number"] {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 5px 8px;
  font: inherit;
}
.mp-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.mp-toolbar-left {
  display: flex;
  align-items: center;
  gap: 14px;
}
.mp-toolbar-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.mp-auto {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--w11-muted);
  font-size: 13px;
}
.mp-win-switch {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 2px 0 4px;
  cursor: pointer;
  user-select: none;
}
.mp-win-switch .switch-text {
  color: var(--w11-text) !important;
  font-size: 13px;
  line-height: 1.25;
  order: 2;
}
.mp-win-switch .switch-track {
  width: 40px;
  height: 20px;
  border-radius: 10px;
  background: #929292;
  box-shadow: none;
  flex-shrink: 0;
  order: 1;
  position: relative;
}
.mp-win-switch .switch-track::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  transition: transform 0.12s ease;
}
.mp-win-switch input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.mp-win-switch input:checked + .switch-track {
  background: var(--w11-accent, #005fb8);
}
.mp-win-switch input:checked + .switch-track::after {
  transform: translateX(20px);
}
.mp-field-row {
  display: grid;
  grid-template-columns: 140px minmax(160px, 220px);
  gap: 12px;
  align-items: center;
  margin-top: 10px;
  max-width: 420px;
}
.mp-field-label {
  font-size: 13px;
  color: var(--w11-text);
}
.mp-field-ctrl {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-win-body);
  overflow: hidden;
  min-height: 28px;
}
.mp-field-ctrl:focus-within {
  border-color: var(--w11-accent);
  outline: 1px solid color-mix(in srgb, var(--w11-accent) 45%, transparent);
}
.mp-field-ctrl input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  padding: 4px 8px;
  font: inherit;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.mp-field-ctrl input:focus {
  outline: none;
}
.mp-field-suffix {
  display: inline-flex;
  align-items: center;
  padding: 0 10px;
  font-size: 12px;
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
  border-left: 1px solid var(--w11-stroke);
  white-space: nowrap;
}
.mp-settings-meta {
  margin: 8px 0 0;
  font-size: 12px;
}
.mp-ship-proc-win {
  border-radius: 4px;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--w11-stroke) 40%, transparent);
}
.mp-ship-proc-win .mp-ship-proc-head {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  font-size: 12px;
}
.mp-ship-proc-win .mp-ship-proc-row input[type="number"] {
  border-radius: 2px;
  height: 26px;
  padding: 2px 6px;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.mp-statusbar {
  display: flex;
  align-items: center;
  gap: 0;
  flex-shrink: 0;
  min-height: 22px;
  padding: 0 8px;
  border-top: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 92%, var(--w11-window-bg));
  color: var(--w11-muted);
  font-size: 11px;
  user-select: none;
  overflow: hidden;
}
.mp-sb-main,
.mp-sb-item,
.mp-sb-count {
  padding: 2px 8px;
  white-space: nowrap;
  line-height: 18px;
}
.mp-sb-main {
  min-width: 0;
  max-width: 28%;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--w11-text);
}
.mp-sb-item {
  color: var(--w11-muted);
}
.mp-sb-sep {
  width: 1px;
  align-self: stretch;
  background: var(--w11-stroke);
  flex-shrink: 0;
  margin: 3px 0;
}
.mp-sb-sep-push {
  margin-left: auto;
  width: 0;
  background: transparent;
}
.mp-sb-count {
  font-variant-numeric: tabular-nums;
  color: var(--w11-text);
  flex-shrink: 0;
}
.mp-toolbar {
  display: none;
}
.mp-split {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(320px, 42%) 1fr;
  gap: 0;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
}
.mp-col {
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 0;
  border-radius: 0;
  background: var(--w11-window-bg);
  overflow: hidden;
}
.mp-col + .mp-col {
  border-left: 1px solid var(--w11-stroke);
}
.mp-col-head {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
  flex-shrink: 0;
}
.mp-col-head strong {
  font-size: 12px;
  font-weight: 600;
}
.mp-col-head small {
  color: var(--w11-muted);
  font-size: 11px;
}
.mp-filter {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--w11-stroke);
  border-radius: 2px;
  padding: 4px 6px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font: inherit;
  font-size: 12px;
}
.mp-list,
.mp-cats,
.mp-arts,
.mp-lv {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0;
  user-select: none;
}
.mp-lv {
  display: flex;
  flex-direction: column;
}
.mp-lv-head,
.mp-lv-row {
  display: grid;
  grid-template-columns: 14px minmax(110px, 1.35fr) 56px 56px minmax(80px, 1fr);
  align-items: center;
  gap: 8px;
  width: 100%;
  box-sizing: border-box;
  padding: 4px 8px;
  font-size: 12px;
}
.mp-lv-head {
  position: sticky;
  top: 0;
  z-index: 1;
  font-size: 11px;
  font-weight: 600;
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-titlebar) 85%, var(--w11-window-bg));
  border-bottom: 1px solid var(--w11-stroke);
  flex-shrink: 0;
}
.mp-lv-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.mp-lv-row {
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  background: transparent;
  color: var(--w11-text);
  text-align: left;
  cursor: default;
  font: inherit;
  border-radius: 0;
}
.mp-lv-row:hover {
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
}
.mp-lv-row.selected {
  background: color-mix(in srgb, var(--w11-highlight) 28%, var(--w11-window-bg));
  color: var(--w11-text);
}
.mp-lv-c-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
}
.mp-lv-c-cnt,
.mp-lv-c-online,
.mp-lv-c-total {
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--w11-muted);
}
.mp-lv-c-online {
  color: color-mix(in srgb, #107c10 70%, var(--w11-muted));
}
.mp-lv-row.selected .mp-lv-c-cnt,
.mp-lv-row.selected .mp-lv-c-online,
.mp-lv-row.selected .mp-lv-c-total,
.mp-lv-row.selected .mp-lv-c-cat {
  color: var(--w11-text);
}
.mp-lv-c-cat {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--w11-muted);
}
.mp-row,
.mp-cat,
.mp-art {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  border-radius: 0;
  padding: 6px 8px;
  cursor: pointer;
  font: inherit;
}
.mp-row:hover,
.mp-cat:hover,
.mp-art:hover {
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
}
.mp-row.selected,
.mp-cat.active,
.mp-art.selected {
  background: color-mix(in srgb, var(--w11-highlight) 28%, var(--w11-window-bg));
}
.mp-row-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.mp-row-main small,
.mp-cat {
  font-size: 12px;
  color: var(--w11-muted);
}
.mp-row-main strong {
  font-size: 13px;
  color: var(--w11-text);
}
.mp-cat {
  color: var(--w11-text);
  font-size: 12.5px;
  line-height: 1.35;
}
.mp-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 0;
  flex-shrink: 0;
  background: var(--w11-stroke);
  justify-self: center;
}
.mp-dot.ok {
  background: #107c10;
}
.mp-dot.off {
  background: #c42b1c;
}
.mp-dot.warn {
  background: #c19c00;
  box-shadow: 0 0 0 1px color-mix(in srgb, #c19c00 35%, transparent);
}
.mp-dot.empty {
  background: var(--w11-muted);
}
.mp-empty {
  padding: 16px;
  color: var(--w11-muted);
  font-size: 13px;
}
#mp-ctx.mp-ctx.w11-ctx,
.mp-ctx {
  z-index: 10080 !important;
  min-width: 200px;
  width: max-content;
  max-width: none !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 4px;
  box-sizing: border-box;
}
.mp-ctx-cascade-root {
  overflow: visible !important;
}
.mp-ctx-head {
  padding: 4px 10px 6px;
  font-size: 11px;
  white-space: nowrap;
}
.mp-ctx-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  text-align: left;
  padding: 6px 10px;
  border-radius: 0;
  cursor: default;
  font: inherit;
  font-size: 13px;
  white-space: nowrap;
}
.mp-ctx-item:hover:not(:disabled) {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
}
.mp-ctx-item:disabled {
  opacity: 0.45;
  cursor: default;
}
.mp-ctx-item.danger {
  color: #c42b1c;
}
.mp-ctx-item em {
  font-style: normal;
  flex: 1;
  min-width: 0;
  white-space: nowrap;
}
.mp-ctx-hint {
  color: var(--w11-muted);
  font-size: 11px;
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mp-ctx-chev-r {
  color: var(--w11-muted);
  margin-left: auto;
  flex-shrink: 0;
}
.mp-ctx-cascade-item {
  position: relative;
}
.mp-ctx-cascade-panel {
  position: fixed;
  z-index: 10081;
  min-width: 220px;
  width: max-content;
  max-width: none;
  max-height: none;
  overflow: visible;
  padding: 4px;
  box-sizing: border-box;
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  background: var(--w11-window-bg);
  box-shadow: 0 8px 24px color-mix(in srgb, #000 28%, transparent);
  scrollbar-width: thin;
}
.mp-ctx-cascade-panel:not(.mp-ctx-cats-panel)::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}
.mp-ctx-cascade-panel[hidden] {
  display: none !important;
}
.mp-ctx-cats-panel {
  pointer-events: auto;
  min-width: 380px;
  width: min(520px, 92vw);
  max-width: min(560px, 94vw);
  display: flex;
  flex-direction: column;
  max-height: min(460px, 72vh);
  overflow: hidden;
}
.mp-ctx-filter {
  display: block;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0 0 4px;
  border: 1px solid var(--w11-stroke);
  border-radius: 2px;
  padding: 5px 8px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font: inherit;
  font-size: 12px;
  flex-shrink: 0;
}
.mp-ctx-filter:focus {
  outline: 1px solid var(--w11-accent);
  border-color: var(--w11-accent);
}
.mp-ctx-tree,
.mp-ctx-search-results {
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: auto;
  flex: 1;
  min-height: 0;
  max-height: min(360px, 60vh);
  scrollbar-width: thin;
}
.mp-ctx-search-results[hidden],
.mp-ctx-tree[hidden] {
  display: none !important;
}
.mp-ctx-search-hit {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  text-align: left;
  padding: 6px 10px;
  cursor: default;
  font: inherit;
  font-size: 13px;
}
.mp-ctx-search-hit:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
}
.mp-ctx-search-hit em {
  font-style: normal;
  font-weight: 500;
}
.mp-ctx-search-hit small {
  color: var(--w11-muted);
  font-size: 11px;
  max-width: 100%;
  white-space: normal;
  word-break: break-word;
  line-height: 1.35;
}
.mp-ctx-empty {
  padding: 10px;
  color: var(--w11-muted);
  font-size: 12px;
  white-space: nowrap;
}
.mp-art-head,
.mp-art {
  display: grid;
  grid-template-columns: 18px 18px 44px minmax(110px, 18%) minmax(140px, 1fr) 72px;
  align-items: center;
  gap: 8px;
  width: 100%;
  box-sizing: border-box;
}
.mp-art-head {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 600;
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-titlebar) 85%, var(--w11-window-bg));
  border-bottom: 1px solid var(--w11-stroke);
  margin: 0;
  width: 100%;
}
.mp-art-c-k,
.mp-art-c-o {
  text-align: center;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--w11-muted);
}
.mp-art {
  padding: 4px 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  border-radius: 0;
}
.mp-art .mp-dot {
  margin-top: 0;
  justify-self: center;
}
.mp-art-c-nr,
button.mp-art-copy {
  font-weight: 600;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--w11-accent);
  padding: 0;
  margin: 0;
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  min-width: 0;
}
button.mp-art-copy:hover {
  text-decoration: underline;
}
button.mp-art-copy:focus-visible {
  outline: 1px solid var(--w11-accent);
  outline-offset: 1px;
}
.mp-art-c-name {
  font-size: 12.5px;
  color: var(--w11-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.mp-art-c-stock {
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--w11-text);
}
.mp-art-flag {
  font-style: normal;
  font-size: 11px;
  color: var(--w11-muted);
  margin-left: 4px;
}
.mp-art-thumb-wrap {
  width: 40px;
  height: 40px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 40%, var(--w11-window-bg));
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.mp-art-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.mp-art-thumb-empty {
  background: repeating-linear-gradient(
    -45deg,
    transparent,
    transparent 4px,
    color-mix(in srgb, var(--w11-stroke) 40%, transparent) 4px,
    color-mix(in srgb, var(--w11-stroke) 40%, transparent) 8px
  );
}
.mp-img-gallery {
  position: fixed;
  z-index: 10060;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  max-width: min(720px, calc(100vw - 24px));
  max-height: min(420px, calc(100vh - 24px));
  overflow: auto;
  padding: 8px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
}
.mp-img-gallery img {
  width: 120px;
  height: 120px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
}
.mp-setup {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 4px 2px 12px;
}
.mp-setup-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.mp-setup-head p {
  margin: 4px 0 0;
  font-size: 13px;
}
.mp-setup-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  padding: 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
}
.mp-setup-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--w11-muted);
}
.mp-setup-grid .span-2 {
  grid-column: 1 / -1;
}
.mp-copy-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.mp-copy-row input,
.mp-copy-row textarea {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  padding: 7px 10px;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font: inherit;
  font-family: Consolas, "Cascadia Mono", monospace;
  font-size: 12px;
}
.mp-copy-row textarea {
  resize: vertical;
  min-height: 84px;
  line-height: 1.35;
}
.mp-copy-row-pre {
  align-items: flex-start;
}
.mp-jtl-help {
  padding: 12px 14px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
  font-size: 13px;
  color: var(--w11-text);
}
.mp-jtl-help h3 {
  margin: 0 0 8px;
  font-size: 14px;
}
.mp-jtl-help ol {
  margin: 0 0 10px;
  padding-left: 1.25rem;
}
.mp-jtl-help code {
  font-family: Consolas, "Cascadia Mono", monospace;
  font-size: 12px;
  color: var(--w11-accent);
}

/* Retoureprozess – Windows-Einstellungen (linke Navigation + Inhalt) */
.w11-win-body #acc-retoure-process.w11-hosted {
  position: relative;
  display: flex !important;
  flex-direction: column;
  height: 100%;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0;
  background: var(--w11-win-body);
  overflow: hidden;
}
.rp-shell {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.rp-layout {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: row;
  overflow: hidden;
}
.rp-nav {
  width: 220px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 10px 12px;
  background: var(--w11-titlebar);
  border-right: 1px solid var(--w11-stroke);
  overflow: auto;
}
.rp-nav-brand {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px 10px 10px;
}
.rp-nav-brand strong {
  font-size: 14px;
  font-weight: 600;
  color: var(--w11-text);
}
.rp-nav-brand span {
  font-size: 11px;
  color: var(--w11-muted);
}
.rp-nav-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.rp-nav-item {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  padding: 9px 10px;
  border-radius: 4px;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.rp-nav-item:hover {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-titlebar));
}
.rp-nav-item.is-on {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-titlebar));
  font-weight: 600;
}
.rp-nav-ico {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: color-mix(in srgb, var(--w11-accent) 85%, #000);
}
.rp-nav-label { min-width: 0; }
.rp-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
}
.rp-body,
.rp-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 18px 22px 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.rp-page-head { margin: 0 0 2px; }
.rp-page-title {
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--w11-text);
}
.rp-page-sub {
  margin: 0;
  max-width: 52rem;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--w11-muted);
}
.rp-group {
  margin: 0;
  padding: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: var(--w11-window-bg);
  overflow: hidden;
  flex-shrink: 0;
}
.rp-group-title {
  margin: 0;
  padding: 10px 14px 8px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--w11-muted);
  border-bottom: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-window-bg));
}
.rp-rows { display: flex; flex-direction: column; }
.rp-row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  padding: 12px 14px;
  border-bottom: 1px solid var(--w11-stroke);
  cursor: pointer;
}
.rp-row:last-child { border-bottom: 0; }
.rp-row:hover {
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
}
.rp-row-text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.rp-row-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--w11-text);
}
.rp-row-hint {
  font-size: 11.5px;
  line-height: 1.35;
  color: var(--w11-muted);
}
.rp-row.switch {
  position: relative;
}
.rp-row.switch input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.rp-row.switch .switch-track {
  flex-shrink: 0;
  margin-left: auto;
  width: 40px;
  height: 20px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--w11-muted) 45%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
  position: relative;
  transition: background 0.15s ease;
}
.rp-row.switch .switch-track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  transition: transform 0.15s ease;
}
.rp-row.switch input:checked + .switch-track {
  background: var(--w11-accent);
  border-color: color-mix(in srgb, var(--w11-accent) 70%, #000);
}
.rp-row.switch input:checked + .switch-track::after {
  transform: translateX(20px);
}
.rp-row.switch input:focus-visible + .switch-track {
  outline: 2px solid var(--w11-accent);
  outline-offset: 2px;
}
.rp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 14px;
  padding: 14px;
}
.rp-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--w11-muted);
}
.rp-field-wide { grid-column: 1 / -1; }
.rp-field input,
.rp-field select {
  font: inherit;
  font-size: 13px;
  color: var(--w11-text);
  background: var(--w11-win-body);
  border: 1px solid var(--w11-stroke);
  border-radius: 4px;
  padding: 7px 9px;
}
.rp-footer {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  border-top: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.rp-footer-status {
  font-size: 12px;
  color: var(--w11-muted);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 640px) {
  .rp-nav { width: 168px; }
  .rp-grid { grid-template-columns: 1fr; }
  .rp-field-wide { grid-column: auto; }
}

/* ── RoboTask 1:1 classic chrome (theme tokens) ─────────────────────────── */
.rt-menubar {
  display: flex; gap: 0; flex-shrink: 0;
  background: var(--w11-titlebar); border-bottom: 1px solid var(--w11-stroke);
  padding: 0 4px; height: 24px; align-items: stretch;
}
.rt-menu-btn {
  border: 0; background: transparent; color: var(--w11-text);
  padding: 0 10px; font: inherit; font-size: 0.78rem; cursor: pointer;
}
.rt-menu-btn:hover { background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-titlebar)); }
.rt-menu-pop {
  position: absolute; z-index: 40; min-width: 200px;
  background: var(--w11-window-bg); border: 1px solid var(--w11-stroke);
  box-shadow: 0 4px 16px color-mix(in srgb, #000 22%, transparent);
  padding: 4px 0;
}
.rt-menu-item {
  display: block; width: 100%; text-align: left; border: 0; background: transparent;
  color: var(--w11-text); padding: 6px 14px; font: inherit; font-size: 0.8rem; cursor: pointer;
}
.rt-menu-item:hover { background: color-mix(in srgb, var(--w11-highlight) 70%, var(--w11-window-bg)); }
.rt-menu-sep { height: 1px; margin: 4px 8px; background: var(--w11-stroke); }
.rt-iconbar {
  display: flex; flex-wrap: wrap; align-items: stretch; gap: 2px;
  padding: 6px 8px; flex-shrink: 0;
  background: var(--w11-titlebar); border-bottom: 1px solid var(--w11-stroke);
}
.rt-iconbtn {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; min-width: 56px; padding: 4px 6px;
  border: 1px solid transparent; border-radius: 3px;
  background: transparent; color: var(--w11-text); font: inherit; font-size: 0.68rem;
  cursor: pointer;
}
.rt-iconbtn:hover:not(:disabled) {
  border-color: var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-titlebar));
}
.rt-iconbtn:disabled { opacity: 0.4; cursor: default; }
.rt-ib-ico {
  width: 28px; height: 28px; border-radius: 4px;
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
  border: 1px solid var(--w11-stroke);
  display: inline-block; position: relative;
}
/* Original-RoboTask-Icons (aus RoboTask.exe) */
.rt-ib-img {
  width: 28px; height: 28px; object-fit: contain;
  display: block; flex-shrink: 0;
  image-rendering: auto;
}
.rt-ib-img.rt-ib-sm { width: 16px; height: 16px; }
.rt-act-ico {
  width: 16px; height: 16px; object-fit: contain;
  flex-shrink: 0;
}
.rt-tree-ico { display: inline-flex; align-items: center; width: 18px; justify-content: center; }
.rt-tree-ico .rt-ib-img { width: 16px; height: 16px; }
.rt-log-ico-wrap { display: inline-flex; width: 16px; height: 16px; flex-shrink: 0; }
.rt-log-ico-wrap .rt-ib-img { width: 16px; height: 16px; }
.rt-xfer-btn .rt-ib-img { width: 14px; height: 14px; margin: 0 auto; }
.rt-col-ico .rt-ib-img { width: 16px; height: 16px; }
.rt-ib-new { background: color-mix(in srgb, #107c10 28%, var(--w11-window-bg)); }
.rt-ib-run { background: color-mix(in srgb, #107c10 40%, var(--w11-window-bg)); border-radius: 50%; }
.rt-ib-stop { background: color-mix(in srgb, #e81123 35%, var(--w11-window-bg)); }
.rt-ib-del { background: color-mix(in srgb, #e81123 22%, var(--w11-window-bg)); }
.rt-ib-ok { background: color-mix(in srgb, #0078d4 35%, var(--w11-window-bg)); }
.rt-ib-cancel { background: color-mix(in srgb, #e81123 30%, var(--w11-window-bg)); }
.rt-ib-save { background: color-mix(in srgb, #0078d4 22%, var(--w11-window-bg)); }
.rt-ib-rec { background: color-mix(in srgb, #e81123 40%, var(--w11-window-bg)); border-radius: 50%; }
.rt-ib-debug { background: color-mix(in srgb, #107c10 25%, var(--w11-window-bg)); }
.rt-tree-pane.rt-hidden,
.rt-log-pane.rt-hidden,
.rt-iconbar.rt-hidden,
.rt-tree-toolbar.rt-hidden { display: none !important; }
.rt-log.rt-log-mono { font-family: Consolas, "Cascadia Mono", "Courier New", monospace; font-size: 0.78rem; }
.rt-col-ico { width: 28px; padding-left: 6px !important; padding-right: 0 !important; }
.rt-task-doc {
  display: inline-block; width: 14px; height: 16px;
  border: 1px solid var(--w11-stroke); border-radius: 2px;
  background: var(--w11-window-bg);
}
.rt-log-ico {
  width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.65rem; font-weight: 700; color: #fff;
  background: #0078d4;
}
.rt-log-error .rt-log-ico, .rt-log-ico[data-lvl="error"] { background: #e81123; }
.rt-log-warn .rt-log-ico, .rt-log-ico[data-lvl="warn"] { background: #f7a828; }
.rt-statusbar {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0;
  padding: 3px 10px; font-size: 0.76rem; color: var(--w11-muted);
  border-top: 1px solid var(--w11-stroke); background: var(--w11-titlebar);
}
.rt-status-dot {
  width: 10px; height: 10px; border-radius: 2px; background: var(--w11-muted);
}
.rt-status-dot.ok { background: #107c10; }
.rt-actions-classic { grid-template-columns: 240px 40px 1fr !important; }
.rt-xfer {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; padding: 8px 0;
}
.rt-xfer-btn {
  width: 32px; height: 28px; border: 1px solid var(--w11-stroke); border-radius: 3px;
  background: var(--w11-window-bg); color: var(--w11-text); cursor: pointer; font-size: 0.75rem;
}
.rt-xfer-btn.primary { background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg)); }
.rt-xfer-btn:hover { border-color: var(--w11-accent); }
.rt-palette-caption {
  padding: 4px 8px; font-size: 0.7rem; color: var(--w11-muted);
  border-bottom: 1px solid var(--w11-stroke); flex-shrink: 0;
}
.rt-pal-item.selected {
  background: color-mix(in srgb, var(--w11-highlight) 60%, var(--w11-window-bg));
  border-color: var(--w11-accent);
}
.rt-shell, .rt-edit-shell { position: relative; }
.rt-log-pane { height: 138px; }
.rt-log-head { display: none; }

/* —— Webserver (Win7 MMC) —— */
#acc-webserver,
#acc-webserver.dlg-host {
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
}
.ws-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden !important;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-family: "Segoe UI", Tahoma, sans-serif;
  font-size: 12px;
}
.ws-shell > .win-app-status {
  flex-shrink: 0;
}
.ws-mmc {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
}
.ws-tree {
  width: 200px;
  flex-shrink: 0;
  border-right: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
  padding: 6px 0;
  overflow: auto;
}
.ws-tree-root {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px 8px;
  font-weight: 600;
  color: var(--w11-text);
}
.ws-tree-ico {
  width: 16px;
  height: 16px;
  border-radius: 2px;
  background: linear-gradient(160deg, #9ed0ff, #2f6fbf);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #000 25%, transparent);
}
.ws-tree-item {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  padding: 4px 10px 4px 28px;
  cursor: pointer;
  font: inherit;
}
.ws-tree-item:hover {
  background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
}
.ws-tree-item.active {
  background: color-mix(in srgb, var(--w11-highlight, #cce8ff) 88%, var(--w11-window-bg));
  color: var(--w11-text);
  outline: 1px solid color-mix(in srgb, var(--w11-accent, #99d1ff) 55%, var(--w11-stroke));
  outline-offset: -1px;
}
.ws-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--w11-window-bg);
}
.ws-toolbar {
  display: flex;
  flex-wrap: nowrap;
  gap: 2px;
  padding: 4px 6px;
  border-bottom: 1px solid var(--w11-stroke);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--w11-titlebar-focus) 40%, var(--w11-window-bg)),
    var(--w11-titlebar)
  );
  white-space: nowrap;
}
.ws-tool {
  border: 1px solid transparent;
  background: transparent;
  color: var(--w11-text);
  padding: 3px 10px;
  font: inherit;
  cursor: pointer;
  border-radius: 2px;
}
.ws-tool:hover:not(:disabled) {
  border-color: var(--w11-stroke);
  background: color-mix(in srgb, #fff 35%, var(--w11-window-bg));
}
.ws-tool:disabled { opacity: 0.45; cursor: default; }
.ws-banner {
  margin: 6px 8px 0;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, #c9a227 50%, var(--w11-stroke));
  background: color-mix(in srgb, #ffe08a 28%, var(--w11-window-bg));
  color: var(--w11-text);
}
.ws-panel { flex: 1; min-height: 0; overflow: auto; padding: 8px; }
.ws-table-wrap {
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  overflow: auto;
  max-height: 100%;
}
.ws-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  table-layout: auto;
}
#ws-sites-table {
  white-space: nowrap;
}
#ws-sites-table th,
#ws-sites-table td {
  white-space: nowrap;
}
#ws-sites-table .ws-mono {
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ws-table th {
  text-align: left;
  padding: 4px 8px;
  border-bottom: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-window-bg));
  font-weight: 600;
  white-space: nowrap;
}
.ws-table td {
  padding: 3px 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
  vertical-align: top;
}
.ws-table tr.ws-row {
  cursor: default;
  user-select: none;
  -webkit-user-select: none;
}
.ws-table tr.ws-row:hover { background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)); }
.ws-table tr.ws-row.selected {
  background: color-mix(in srgb, var(--w11-highlight, #cce8ff) 88%, var(--w11-window-bg));
  color: var(--w11-text);
  outline: 1px solid color-mix(in srgb, var(--w11-accent, #99d1ff) 55%, var(--w11-stroke));
  outline-offset: -1px;
}
.ws-table tr.ws-row.selected .ws-badge { color: inherit; }
.ws-mono { font-family: Consolas, "Courier New", monospace; font-size: 11px; word-break: break-all; }
.ws-badge {
  display: inline-block;
  padding: 0 6px;
  border-radius: 2px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-window-bg) 80%, #107c10);
}
.ws-badge.off { background: color-mix(in srgb, var(--w11-window-bg) 80%, #a0a0a0); }
.ws-badge.ok { background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg)); }
.ws-group {
  border: 1px solid var(--w11-stroke);
  margin: 0 0 10px;
  padding: 8px 10px 10px;
  background: color-mix(in srgb, var(--w11-window-bg) 92%, var(--w11-titlebar));
}
.ws-group legend {
  padding: 0 8px;
  margin-left: 4px;
  font-weight: 600;
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-window-bg) 92%, var(--w11-titlebar));
  position: relative;
  z-index: 1;
  line-height: 1.25;
}
.ws-kv { display: grid; gap: 4px; }
.ws-kv > div { display: flex; gap: 12px; }
.ws-kv span { color: var(--w11-muted); min-width: 100px; }
.ws-row-btns { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
.ws-btn {
  border: 1px solid var(--w11-stroke);
  background: linear-gradient(180deg, color-mix(in srgb, #fff 22%, var(--w11-window-bg)), var(--w11-window-bg));
  color: var(--w11-text);
  padding: 3px 12px;
  font: inherit;
  cursor: pointer;
  border-radius: 3px;
  min-height: 24px;
}
.ws-btn:hover { border-color: var(--w11-accent); }
.ws-btn:disabled,
.ws-btn[disabled] {
  opacity: 1;
  cursor: default;
  color: var(--w11-muted);
  border-color: color-mix(in srgb, var(--w11-stroke) 75%, transparent);
  background: color-mix(in srgb, var(--w11-window-bg) 88%, var(--w11-stroke));
  box-shadow: none;
}
.ws-btn.ghost { background: transparent; }
.ws-btn.ghost:disabled,
.ws-btn.ghost[disabled] {
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-window-bg) 92%, var(--w11-stroke));
}
.ws-mod-list { display: flex; flex-direction: column; gap: 4px; }
.ws-mod-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  background: var(--w11-window-bg);
}
.ws-mod-row small { display: block; color: var(--w11-muted); }
.ws-form-grid {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 6px 10px;
  align-items: center;
}
.ws-form-grid input,
.ws-form-grid select,
.ws-form-grid textarea {
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 3px 6px;
  font: inherit;
  width: 100%;
  box-sizing: border-box;
}
.ws-switch { display: inline-flex; align-items: center; gap: 6px; }
.ws-new-card { width: min(460px, 94%); }
.ws-new-ports {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ws-slide {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  color: var(--w11-text);
}
.ws-slide input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.ws-slide-track {
  position: relative;
  width: 40px;
  height: 20px;
  flex-shrink: 0;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #000 22%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-window-bg) 70%, var(--w11-stroke));
  box-shadow: inset 1px 1px 2px color-mix(in srgb, #000 12%, transparent);
  transition: background 0.15s ease, border-color 0.15s ease;
}
.ws-slide-thumb {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: linear-gradient(180deg, color-mix(in srgb, #fff 55%, var(--w11-window-bg)), var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, #000 18%, var(--w11-stroke));
  box-shadow: 0 1px 2px color-mix(in srgb, #000 22%, transparent);
  transition: transform 0.15s ease;
}
.ws-slide input:checked + .ws-slide-track {
  background: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 50%, var(--w11-stroke));
}
.ws-slide input:checked + .ws-slide-track .ws-slide-thumb {
  transform: translateX(20px);
  background: #fff;
}
.ws-slide input:focus-visible + .ws-slide-track {
  outline: 2px solid var(--w11-accent);
  outline-offset: 2px;
}
.ws-slide-text { font-size: 12px; }
.ws-new-hint {
  margin: 8px 0 0;
  color: var(--w11-muted);
  font-size: 11px;
  line-height: 1.4;
}
.ws-modal {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, #000 35%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
}
.ws-modal[hidden] { display: none !important; }
.ws-modal-card {
  width: min(420px, 92%);
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-win-border);
  box-shadow: 0 8px 28px color-mix(in srgb, #000 35%, transparent);
  padding: 12px 14px;
}
.ws-modal-title { font-weight: 600; margin-bottom: 10px; font-size: 13px; }
.ws-modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.ws-edit-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-family: "Segoe UI", Tahoma, sans-serif;
  font-size: 12px;
}
.ws-edit-head {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid var(--w11-stroke);
  background: linear-gradient(180deg, color-mix(in srgb, var(--w11-titlebar-focus) 35%, var(--w11-window-bg)), var(--w11-titlebar));
}
.ws-edit-ico {
  width: 32px;
  height: 32px;
  border-radius: 3px;
  background: linear-gradient(160deg, #9ed0ff, #2f6fbf);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #000 20%, transparent);
}
.ws-edit-title { font-weight: 600; font-size: 13px; }
.ws-edit-sub { color: var(--w11-muted); }
.ws-edit-tabs { flex-shrink: 0; }
.ws-edit-body {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 10px 12px;
  background: var(--w11-window-bg);
}
.ws-edit-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 8px 12px;
  border-top: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.ws-edit-status { margin-right: auto; color: var(--w11-muted); }
.ws-sum { display: grid; gap: 6px; }
.ws-sum > div { display: grid; grid-template-columns: 120px 1fr; gap: 8px; }
.ws-sum dt { color: var(--w11-muted); }
.ws-empty-row td { padding: 16px; color: var(--w11-muted); text-align: center; }

/* —— Webserver: ZAP-Parität (Kontextmenü, Toggle-Listen, Passwort-Zellen, Dialoge) —— */
.ws-shell,
.ws-edit-shell { position: relative; }
.ws-shell .hint,
.ws-edit-shell .hint {
  margin: 0 0 8px;
  color: var(--w11-muted);
  font-size: 11px;
  line-height: 1.4;
}
.ws-shell .hint code,
.ws-edit-shell .hint code,
.ws-mod-row code,
.ws-kv code {
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px;
  padding: 0 3px;
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 60%, transparent);
  border-radius: 2px;
}
.ws-banner[hidden] { display: none !important; }
.ws-banner.danger {
  border-color: color-mix(in srgb, #c42b1c 55%, var(--w11-stroke));
  background: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg));
}
.ws-banner.warn {
  border-color: color-mix(in srgb, #c9a227 50%, var(--w11-stroke));
  background: color-mix(in srgb, #ffe08a 28%, var(--w11-window-bg));
}
.ws-banner .ws-btn { margin-left: 8px; }
.ws-panel[hidden] { display: none !important; }
.ws-toolbar[hidden] { display: none !important; }
.ws-table tr.ws-row.selected .ws-fw,
.ws-table tr.ws-row.selected .ws-site-live { color: inherit; }
.ws-table tr.ws-row.selected td { border-bottom-color: color-mix(in srgb, #fff 25%, transparent); }
.ws-fw {
  display: inline-block;
  padding: 0 6px;
  border-radius: 2px;
  border: 1px solid var(--w11-stroke);
}
.ws-fw.ok { background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg)); }
.ws-fw.warn { background: color-mix(in srgb, #c9a227 22%, var(--w11-window-bg)); }
.ws-fw.blocked { background: color-mix(in srgb, #c42b1c 20%, var(--w11-window-bg)); }
.ws-site-live { font-style: italic; color: var(--w11-accent); }
.ws-fw-alert {
  margin: 8px 12px 0;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, #c9a227 50%, var(--w11-stroke));
  background: color-mix(in srgb, #ffe08a 28%, var(--w11-window-bg));
  color: var(--w11-text);
}
.ws-fw-alert[hidden] { display: none !important; }
.ws-fw-alert.danger {
  border-color: color-mix(in srgb, #c42b1c 55%, var(--w11-stroke));
  background: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg));
}
.ws-fw-alert .ws-btn { margin-left: 8px; }

/* Kontextmenü */
.ws-ctx {
  position: fixed;
  z-index: 60;
  min-width: 180px;
  padding: 3px 0;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  border: 1px solid var(--w11-win-border);
  box-shadow: 0 6px 20px color-mix(in srgb, #000 32%, transparent);
  font-size: 12px;
}
.ws-ctx[hidden] { display: none !important; }
.ws-ctx button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 4px 22px 4px 14px;
  cursor: pointer;
}
.ws-ctx button[hidden] { display: none !important; }
.ws-ctx button:hover:not(:disabled) {
  background: color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg));
}
.ws-ctx button:disabled { opacity: 0.45; cursor: default; }
.ws-ctx button.danger { color: color-mix(in srgb, #c42b1c 80%, var(--w11-text)); }
.ws-ctx hr {
  margin: 3px 0;
  border: 0;
  border-top: 1px solid var(--w11-stroke);
}
.ws-ctx hr[hidden] { display: none !important; }

/* Paket-Zeilen mit Fortschritt */
.ws-mod-row { position: relative; overflow: hidden; }
.ws-mod-row > span:not(.ws-pkg-actions) { position: relative; z-index: 1; }
.ws-mod-row .ws-pkg-actions { position: relative; z-index: 1; display: inline-flex; gap: 6px; align-items: center; }
.ws-mod-row .ws-mod-actions { position: relative; z-index: 1; }
.ws-mod-progress {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  background: color-mix(in srgb, var(--w11-accent) 22%, transparent);
  transition: width 0.6s ease;
  pointer-events: none;
}
.ws-mod-row.is-busy { border-color: var(--w11-accent); }
.ws-mod-row.is-done .ws-mod-progress { background: color-mix(in srgb, #107c10 26%, transparent); }

/* Toggle-Listen (PHP-Erweiterungen / Nginx-Module je Website) */
.ws-toggle-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 4px 8px;
  max-height: 340px;
  overflow: auto;
  padding: 4px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
}
.ws-toggle-list > .hint { grid-column: 1 / -1; margin: 6px; }
.ws-toggle-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 6px;
  border: 1px solid transparent;
  cursor: pointer;
}
.ws-toggle-row:hover {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-stroke) 70%, transparent);
}
.ws-toggle-meta { display: flex; flex-direction: column; min-width: 0; }
.ws-toggle-label { font-weight: 600; }
.ws-toggle-pkg {
  color: var(--w11-muted);
  font-size: 10px;
  font-family: Consolas, "Courier New", monospace;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Edit-Fenster: Win7 Property-Sheet-Layout (Inhalt nie abschneiden) */
.ws-edit-shell {
  overflow: hidden !important;
  min-height: 0;
}
#acc-webserver-edit.dlg-host,
#acc-webserver-edit .ws-edit-shell {
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}
.ws-edit-tabs {
  flex-wrap: wrap;
  row-gap: 0;
  overflow: visible !important;
  white-space: normal;
}
.ws-edit-shell .win-sheet-pane[hidden] { display: none !important; }
.ws-edit-shell .win-sheet-pane:not([hidden]) {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: min-content;
  height: auto;
  overflow: visible;
}
.ws-edit-body {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  display: block;
}
.ws-edit-body .ws-group.grow {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 160px;
}
.ws-edit-body .ws-group.grow > .ws-table-wrap {
  flex: 1;
  min-height: 140px;
  max-height: 280px;
  overflow: auto;
}

/* JTL-Shop tab — Fenster selbst ohne Scroll, Liste scrollt intern */
.ws-edit-body:has([data-ws-pane="jtl"]:not([hidden])) {
  overflow-y: hidden !important;
  display: flex;
  flex-direction: column;
}
.win-sheet-pane[data-ws-pane="jtl"]:not([hidden]) {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  gap: 8px;
}
.win-sheet-pane[data-ws-pane="jtl"] > .ws-group {
  flex-shrink: 0;
  margin: 0;
}
.win-sheet-pane[data-ws-pane="jtl"] > .ws-group.wse-jtl-update {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.wse-jtl-ver {
  font-weight: 600;
  color: var(--w11-text);
}
.wse-jtl-versions-wrap {
  flex: 1 1 auto;
  min-height: 120px;
  max-height: none;
  overflow: auto;
  margin-top: 6px;
}
.win-sheet-pane[data-ws-pane="jtl"] .ws-row-btns {
  flex-shrink: 0;
}
#wse-jtl-versions tr.is-current td {
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
}
.wse-jtl-progress {
  flex-shrink: 0;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid var(--w11-stroke);
  border-radius: 6px;
  background: var(--w11-window-bg);
}
.wse-jtl-progress-bar {
  height: 8px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--w11-muted) 18%, var(--w11-window-bg));
  overflow: hidden;
}
.wse-jtl-progress-bar > i {
  display: block;
  height: 100%;
  width: 0;
  background: var(--w11-accent);
  transition: width 0.25s ease;
}
.wse-jtl-progress-msg {
  margin-top: 6px;
  font-size: 12px;
  color: var(--w11-muted);
}
.wse-jtl-progress-msg.ok { color: #107c10; }
.wse-jtl-progress-msg.err { color: #c50f1f; }

/* Bindung: Domain-/Port-Listen mit fester Maxhöhe, Rest sichtbar */
.ws-binding-pane:not([hidden]) {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: visible;
  height: auto;
}
.ws-binding-domains {
  display: flex;
  flex-direction: column;
  margin: 0;
  min-height: 0;
}
.ws-binding-domain-list {
  min-height: 100px;
  max-height: 200px;
  overflow: auto;
  margin-top: 8px;
}
.ws-binding-listen-list {
  min-height: 100px;
  max-height: 180px;
  overflow: auto;
  margin-top: 8px;
}
.ws-php-opt-list {
  min-height: 120px;
  max-height: 220px;
  overflow: auto;
  margin-top: 4px;
}
.ws-edit-body .ws-table input:not([type="checkbox"]),
.ws-edit-body .ws-row-btns input:not([type="checkbox"]),
.ws-edit-body .ws-row-btns select {
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  padding: 2px 6px;
  font: inherit;
  box-sizing: border-box;
}
.ws-edit-body .ws-table td input:not([type="checkbox"]) { width: 100%; }
.ws-edit-body .ws-table td input[type="number"] { width: 80px; }
.ws-edit-body .ws-form-grid label { color: var(--w11-text); }
.ws-edit-body .ws-switch.is-disabled { opacity: 0.5; }
.ws-form-grid > p.hint { margin: 0; align-self: start; }
.ws-nginx-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-top: 10px;
}
.ws-edit-shell textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font: inherit;
  padding: 4px 6px;
  resize: vertical;
}
.wse-summary {
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px;
  min-height: 300px;
  white-space: pre;
}
.wse-service-box {
  margin-top: 10px;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  background: color-mix(in srgb, var(--w11-titlebar) 40%, var(--w11-window-bg));
}
.wse-service-title { font-weight: 600; margin-bottom: 6px; }
.wse-kv {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 3px 10px;
}
.wse-kv > span:nth-child(odd) { color: var(--w11-muted); }
.wse-kv em { color: var(--w11-muted); font-style: normal; }
.wse-le-status.ok { color: color-mix(in srgb, #107c10 80%, var(--w11-text)); }
.wse-le-status.err { color: color-mix(in srgb, #c42b1c 80%, var(--w11-text)); }
.wse-le-status.busy { color: color-mix(in srgb, #c9a227 80%, var(--w11-text)); }
.wse-le-status-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.wse-le-error {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, #c42b1c 35%, var(--w11-stroke));
  background: color-mix(in srgb, #c42b1c 10%, var(--w11-window-bg));
  color: var(--w11-text);
  white-space: pre-wrap;
  line-height: 1.45;
  font-size: 0.82rem;
  max-height: 240px;
  overflow: auto;
  scrollbar-width: thin;
}
.ws-msg { padding: 0 12px; min-height: 0; font-size: 12px; }
.ws-msg:empty { display: none; }
.ws-msg.err { color: color-mix(in srgb, #c42b1c 80%, var(--w11-text)); padding-top: 4px; }
.ws-msg.ok { color: color-mix(in srgb, #107c10 80%, var(--w11-text)); padding-top: 4px; }

/* FTP-/MySQL-Benutzertabellen */
.ws-user-table tr.ws-row td { cursor: default; }
.ws-user-table .ws-hint-row td { color: var(--w11-muted); padding: 14px; text-align: center; }
.wse-pwd-cell { white-space: nowrap; }
.wse-pwd-text { font-family: Consolas, "Courier New", monospace; margin-right: 6px; }
.wse-pwd-eye,
.wse-pwd-copy {
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
  border: 1px solid transparent;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  color: inherit;
  cursor: pointer;
  padding: 0;
  border-radius: 2px;
}
.wse-pwd-eye {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}
.wse-pwd-eye.is-on {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.94 10.94 0 0 1 12 19c-7 0-11-7-11-7a21.8 21.8 0 0 1 5.06-5.94'/%3E%3Cpath d='M9.9 4.24A10.94 10.94 0 0 1 12 4c7 0 11 7 11 7a21.9 21.9 0 0 1-2.16 3.19'/%3E%3Cpath d='M14.12 14.12a3 3 0 0 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
}
.wse-pwd-copy {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='13' height='13' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E");
}
.wse-pwd-eye:hover,
.wse-pwd-copy:hover {
  border-color: var(--w11-stroke);
  background-color: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}

/* Modale (Warnung, Benutzer) */
.ws-modal { z-index: 50; }
.ws-modal-card .ws-form-grid { margin-top: 4px; }
.ws-modal-card .error {
  min-height: 0;
  color: color-mix(in srgb, #c42b1c 80%, var(--w11-text));
}
.ws-modal-card .error:empty { display: none; }
.ws-form-grid input[type="checkbox"],
.ws-form-grid input[type="radio"] { width: auto; margin: 0; }
.ws-form-grid > label.ws-switch,
.ws-form-grid > label.ws-slide { white-space: normal; }
.ws-form-grid > .ws-pwd-wrap { min-width: 0; }
.ws-warn-card { width: min(560px, 94%); }
.ws-warn-body {
  white-space: pre-wrap;
  line-height: 1.45;
  max-height: 320px;
  overflow: auto;
  scrollbar-width: thin;
}
.ws-warn-body { margin: 0; white-space: pre-wrap; line-height: 1.45; max-height: 260px; overflow: auto; }

/* ═══════════════════════════════════════════════════════════
   Webserver — echte Win7-MMC / Property-Sheet-Haptik
   (Theme-Tokens: --w11-*; hell & dunkel)
   ═══════════════════════════════════════════════════════════ */
.ws-shell,
.ws-edit-shell {
  font-family: "Segoe UI", Tahoma, "MS Sans Serif", sans-serif;
  font-size: 12px;
  letter-spacing: 0;
}
.ws-shell {
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body));
  color: var(--w11-text);
  padding: 0;
  overflow: hidden !important;
}
.ws-mmc {
  margin: 0;
  border: 1px solid color-mix(in srgb, #000 28%, var(--w11-stroke));
  box-shadow:
    inset 1px 1px 0 color-mix(in srgb, #fff 55%, transparent),
    inset -1px -1px 0 color-mix(in srgb, #000 12%, transparent);
  background: var(--w11-window-bg);
  overflow: hidden;
}

/* Tree (MMC-Konsole) */
.ws-tree {
  width: 212px;
  background: color-mix(in srgb, var(--w11-titlebar) 72%, var(--w11-window-bg));
  border-right: 1px solid color-mix(in srgb, #000 18%, var(--w11-stroke));
  box-shadow: inset -1px 0 0 color-mix(in srgb, #fff 35%, transparent);
  padding: 6px 0 10px;
}
.ws-tree-root {
  padding: 6px 10px 8px;
  font-size: 12px;
  font-weight: 600;
  gap: 8px;
}
.ws-tree-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px 5px 22px;
  border: 1px solid transparent;
  border-radius: 0;
}
.ws-tree-item:hover {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 28%, transparent);
}
.ws-tree-item.active {
  background: color-mix(in srgb, var(--w11-highlight, #cce8ff) 88%, var(--w11-window-bg));
  color: var(--w11-text);
  border-color: color-mix(in srgb, var(--w11-accent, #99d1ff) 55%, var(--w11-stroke));
  outline: 1px solid color-mix(in srgb, var(--w11-accent, #99d1ff) 45%, transparent);
  outline-offset: -1px;
  outline: none;
}
.ws-tree-ico {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  border-radius: 0;
  box-shadow: none;
  background-color: transparent;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='3' width='12' height='10' rx='1' fill='%232f6fbf'/%3E%3C/svg%3E");
}
.ws-tree-ico.root {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='2.5' width='13' height='11' rx='1' fill='%232f6fbf'/%3E%3Crect x='3' y='4.5' width='10' height='2' fill='%23fff'/%3E%3Crect x='3' y='7.5' width='10' height='2' fill='%23cce8ff'/%3E%3Crect x='3' y='10.5' width='6' height='2' fill='%23cce8ff'/%3E%3C/svg%3E");
}
.ws-tree-ico.folder-sites {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 4h5l1.2 1.5H14v7.5H2z' fill='%23e8b84a'/%3E%3Cpath d='M2 5.5h12v7H2z' fill='%23f0d078'/%3E%3C/svg%3E");
}
.ws-tree-ico.folder-server {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='2' width='12' height='4' rx='0.5' fill='%234a6d94'/%3E%3Crect x='2' y='6.5' width='12' height='4' rx='0.5' fill='%235a7da4'/%3E%3Crect x='2' y='11' width='12' height='3' rx='0.5' fill='%234a6d94'/%3E%3Ccircle cx='4' cy='4' r='0.8' fill='%2370e070'/%3E%3Ccircle cx='4' cy='8.5' r='0.8' fill='%2370e070'/%3E%3C/svg%3E");
}
.ws-tree-ico.folder-modules {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='2' y='2' width='5' height='5' fill='%232f6fbf'/%3E%3Crect x='9' y='2' width='5' height='5' fill='%2300a0d8'/%3E%3Crect x='2' y='9' width='5' height='5' fill='%2300a0d8'/%3E%3Crect x='9' y='9' width='5' height='5' fill='%232f6fbf'/%3E%3C/svg%3E");
}
.ws-tree-ico.folder-mysql {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cellipse cx='8' cy='4' rx='5.5' ry='2.2' fill='%23c47a2c'/%3E%3Cpath d='M2.5 4v6c0 1.2 2.5 2.2 5.5 2.2s5.5-1 5.5-2.2V4' fill='%23e09a3e'/%3E%3Cellipse cx='8' cy='10' rx='5.5' ry='2.2' fill='%23c47a2c'/%3E%3C/svg%3E");
}
.ws-tree-ico.folder-ftp {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 3h5l1.5 1.5H13v8.5H3z' fill='%234a8f4a'/%3E%3Cpath d='M5 8h6v1.2H5zm0 2.2h4v1.2H5z' fill='%23fff' opacity='.85'/%3E%3C/svg%3E");
}
.ws-tree-ico.folder-redis {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 5.5c0-1.2 2.7-2.2 6-2.2s6 1 6 2.2-2.7 2.2-6 2.2-6-1-6-2.2z' fill='%23c0392b'/%3E%3Cpath d='M2 5.5v5c0 1.2 2.7 2.2 6 2.2s6-1 6-2.2v-5' fill='%23e74c3c'/%3E%3Cellipse cx='8' cy='10.5' rx='6' ry='2.2' fill='%23c0392b'/%3E%3C/svg%3E");
}
.ws-toggle-row {
  cursor: default;
}
.ws-toggle-row > input[type="checkbox"] {
  cursor: pointer;
  flex: 0 0 auto;
}
.ws-toggle-row .ws-toggle-name {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--w11-accent);
  font: inherit;
  font-weight: 600;
  text-align: left;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ws-toggle-row .ws-toggle-name:hover {
  color: var(--w11-text);
}
.ws-toggle-row.is-selected {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-stroke) 70%, transparent);
}
.ws-php-ext-settings-empty {
  color: var(--w11-muted);
  margin: 0;
}
.ws-mysql-tunables {
  max-width: 720px;
}
.ws-mysql-tunables .ws-tunable-hint {
  grid-column: 1 / -1;
  margin: -4px 0 8px;
  color: var(--w11-muted);
  font-size: 11px;
}
.ws-redis-site-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.ws-redis-jtl-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}
.ws-redis-jtl-status {
  font-size: 11px;
  color: var(--w11-muted);
}
.ws-redis-jtl-status.is-ok {
  color: color-mix(in srgb, #107c10 70%, var(--w11-text));
}
.ws-help {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 6px;
  border-radius: 50%;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
  color: var(--w11-accent);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  vertical-align: middle;
  flex: 0 0 auto;
}
.ws-help:hover {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  color: var(--w11-text);
  border-color: var(--w11-accent);
}
.ws-label-with-help {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.ws-redis-tunables {
  max-width: 760px;
}
.ws-redis-tunables .ws-tunable-hint {
  grid-column: 1 / -1;
  margin: -4px 0 8px;
  color: var(--w11-muted);
  font-size: 11px;
}
.ws-tree-group {
  margin-top: 4px;
}
.ws-tree-group-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--w11-text);
}
.ws-tree-item.child {
  padding-left: 34px;
  font-size: 12px;
}
.ws-tree-ico.leaf-svc {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='3' y='3' width='10' height='10' rx='1' fill='%234a6d94'/%3E%3Ccircle cx='8' cy='8' r='2' fill='%2370e070'/%3E%3C/svg%3E");
}
.ws-tree-ico.leaf-feat {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2l1.2 3.6H13l-3 2.2 1.2 3.6L8 9.2 4.8 11.4 6 7.8 3 5.6h3.8z' fill='%23e8b84a'/%3E%3C/svg%3E");
}
.ws-tree-ico.leaf-user {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='5.5' r='2.5' fill='%232f6fbf'/%3E%3Cpath d='M3 13c0-2.5 2.2-4 5-4s5 1.5 5 4' fill='%232f6fbf'/%3E%3C/svg%3E");
}
.ws-tree-ico.leaf-db {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cellipse cx='8' cy='4' rx='5' ry='2' fill='%23c47a2c'/%3E%3Cpath d='M3 4v7c0 1.1 2.2 2 5 2s5-.9 5-2V4' fill='%23e09a3e'/%3E%3C/svg%3E");
}
.ws-feat-list,
.ws-feat-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 2px 0 4px;
  min-height: 28px;
}
.ws-feat-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 8px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  color: var(--w11-text);
}
.ws-feat-row.ws-slide {
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  user-select: none;
}
.ws-feat-row.ws-slide .ws-feat-row-label,
.ws-feat-row.ws-slide .ws-slide-text {
  flex: 1 1 auto;
  min-width: 0;
  order: 0;
}
.ws-feat-row.ws-slide > input {
  order: 1;
}
.ws-feat-row.ws-slide > .ws-slide-track {
  order: 2;
  flex-shrink: 0;
  margin-left: 0;
}
.ws-feat-row.ws-slide.is-disabled,
.ws-feat-row.ws-slide:has(input:disabled) {
  opacity: 0.58;
  cursor: default;
  pointer-events: none;
}
.ws-feat-row.ws-slide input:disabled + .ws-slide-track {
  filter: grayscale(0.4);
  opacity: 0.85;
}
.ws-feat-row-label {
  font-size: 12px;
}
.ws-ver-ok {
  display: inline;
  margin-left: 8px;
  padding: 0;
  font-size: 12px;
  font-weight: 600;
  color: #107c10;
  border: 0;
  background: transparent;
  vertical-align: baseline;
}
.ws-ver-upd {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
  padding: 0;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  color: #c47a00;
  border: 0;
  background: transparent;
  cursor: pointer;
  vertical-align: baseline;
  animation: ws-php-blink 1.1s ease-in-out infinite;
}
.ws-ver-upd:hover {
  color: #a35f00;
  text-decoration: underline;
}
.ws-ver-upd-ico {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2l5 6H9v6H7V8H3z' fill='%23c47a00'/%3E%3C/svg%3E");
}
.ws-ports-cell {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.ws-ssl-warn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 2px;
  background: transparent;
  cursor: pointer;
  vertical-align: middle;
  flex-shrink: 0;
  animation: ws-php-blink 1.1s ease-in-out infinite;
}
.ws-ssl-warn img {
  width: 14px;
  height: 14px;
  display: block;
  pointer-events: none;
}
.ws-ssl-warn:hover {
  background: color-mix(in srgb, #c42b1c 16%, var(--w11-window-bg));
}
.ws-pwd-wrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
}
.ws-pwd-wrap > input {
  width: 100%;
  padding-right: 28px !important;
  box-sizing: border-box;
}
.ws-pwd-toggle {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 3px;
  color: var(--w11-muted);
  background-color: var(--w11-muted);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: 16px 16px;
  mask-size: 16px 16px;
  cursor: pointer;
  flex-shrink: 0;
}
.ws-pwd-toggle:hover {
  border-color: var(--w11-stroke);
  background-color: var(--w11-text);
}
.ws-pwd-toggle.is-on {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.94 10.94 0 0 1 12 19c-7 0-11-7-11-7a21.8 21.8 0 0 1 5.06-5.94'/%3E%3Cpath d='M9.9 4.24A10.94 10.94 0 0 1 12 4c7 0 11 7 11 7a21.9 21.9 0 0 1-2.16 3.19'/%3E%3Cpath d='M14.12 14.12a3 3 0 0 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.94 10.94 0 0 1 12 19c-7 0-11-7-11-7a21.8 21.8 0 0 1 5.06-5.94'/%3E%3Cpath d='M9.9 4.24A10.94 10.94 0 0 1 12 4c7 0 11 7 11 7a21.9 21.9 0 0 1-2.16 3.19'/%3E%3Cpath d='M14.12 14.12a3 3 0 0 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
  background-color: var(--w11-accent);
}
.ws-user-panel .ws-table,
#ws-mysql-users-table,
#ws-ftp-users-table,
#ws-mysql-dbs-table,
.ws-user-table {
  user-select: none;
  -webkit-user-select: none;
}
.ws-feat-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  font-size: 11px;
  line-height: 1.3;
  border: 1px solid var(--w11-stroke);
  border-radius: 2px;
  background: color-mix(in srgb, var(--w11-window-bg) 92%, var(--w11-muted));
  color: var(--w11-muted);
  flex-shrink: 0;
}
.ws-feat-chip.is-on {
  color: var(--w11-text);
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
}
.ws-panel[data-ws-panel^="mysql-"],
.ws-panel[data-ws-panel^="ftp-"] {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}
.ws-panel[data-ws-panel^="mysql-"].active,
.ws-panel[data-ws-panel^="ftp-"].active {
  display: flex;
}
.ws-panel[data-ws-panel^="mysql-"] .ws-group.grow,
.ws-panel[data-ws-panel^="ftp-"] .ws-group.grow {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.ws-panel[data-ws-panel^="mysql-"] .ws-group.grow > .ws-table-wrap,
.ws-panel[data-ws-panel^="ftp-"] .ws-group.grow > .ws-table-wrap,
.ws-panel[data-ws-panel^="mysql-"] .ws-group.grow > .ws-feat-rows,
.ws-panel[data-ws-panel^="ftp-"] .ws-group.grow > .ws-feat-rows {
  flex: 1 1 auto;
  min-height: 140px;
  overflow: auto;
}
.ws-user-panel {
  min-height: 180px;
}

/* Toolbar */
.ws-toolbar {
  gap: 4px;
  padding: 5px 7px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 42%, var(--w11-titlebar)) 0%,
    var(--w11-titlebar) 55%,
    color-mix(in srgb, #000 6%, var(--w11-titlebar)) 100%
  );
  border-bottom: 1px solid color-mix(in srgb, #000 16%, var(--w11-stroke));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 50%, transparent);
}
.ws-tool {
  border: 1px solid color-mix(in srgb, #000 22%, var(--w11-stroke));
  border-radius: 2px;
  padding: 2px 11px 3px;
  min-height: 22px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 55%, var(--w11-window-bg)) 0%,
    color-mix(in srgb, #fff 18%, var(--w11-window-bg)) 48%,
    color-mix(in srgb, #000 5%, var(--w11-window-bg)) 100%
  );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 65%, transparent),
    inset 0 -1px 0 color-mix(in srgb, #000 8%, transparent);
}
.ws-tool:hover:not(:disabled) {
  border-color: var(--w11-accent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)),
    color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg))
  );
}
.ws-tool:active:not(:disabled) {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  box-shadow: inset 1px 1px 2px color-mix(in srgb, #000 18%, transparent);
}

/* ListView */
.ws-panel[data-ws-panel="sites"] {
  padding: 0;
  background: var(--w11-window-bg);
}
.ws-panel[data-ws-panel="sites"] .ws-table-wrap {
  border: 0;
  height: 100%;
  max-height: none;
}
.ws-panel:not([data-ws-panel="sites"]) {
  padding: 10px 12px;
  background: color-mix(in srgb, var(--w11-titlebar) 28%, var(--w11-window-bg));
}
.ws-table th {
  padding: 4px 8px;
  font-weight: 600;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 70%, var(--w11-window-bg)),
    color-mix(in srgb, var(--w11-titlebar) 65%, var(--w11-window-bg))
  );
  border-bottom: 1px solid color-mix(in srgb, #000 18%, var(--w11-stroke));
  border-right: 1px solid color-mix(in srgb, var(--w11-stroke) 80%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 55%, transparent);
  position: sticky;
  top: 0;
  z-index: 1;
}
.ws-table td {
  padding: 3px 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 45%, transparent);
  vertical-align: middle;
}
.ws-table tr.ws-row:hover {
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
}
.ws-table tr.ws-row.selected {
  background: color-mix(in srgb, var(--w11-highlight, #cce8ff) 88%, var(--w11-window-bg));
  color: var(--w11-text);
  outline: 1px solid color-mix(in srgb, var(--w11-accent, #99d1ff) 55%, var(--w11-stroke));
  outline-offset: -1px;
}
.ws-table tr.ws-row.selected td {
  border-bottom-color: color-mix(in srgb, var(--w11-accent) 25%, transparent);
}
.ws-table tr.ws-row.ws-row-range {
  background: color-mix(in srgb, var(--w11-highlight, #cce8ff) 55%, var(--w11-window-bg));
}
.ws-row-ico {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 6px;
  vertical-align: -3px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.ws-row-ico.site {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='3' width='13' height='10' rx='1' fill='%232f6fbf'/%3E%3Crect x='3' y='5' width='10' height='1.5' fill='%23fff'/%3E%3Crect x='3' y='7.5' width='10' height='1.5' fill='%23cce8ff'/%3E%3Crect x='3' y='10' width='6' height='1.5' fill='%23cce8ff'/%3E%3C/svg%3E");
}

/* GroupBox + Buttons */
.ws-group {
  border: 1px solid color-mix(in srgb, #000 14%, var(--w11-stroke));
  border-radius: 2px;
  background: color-mix(in srgb, var(--w11-window-bg) 94%, var(--w11-titlebar));
  box-shadow: inset 1px 1px 0 color-mix(in srgb, #fff 40%, transparent);
  padding: 10px 12px 12px;
}
.ws-group legend {
  padding: 0 8px;
  margin-left: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-window-bg) 94%, var(--w11-titlebar));
  position: relative;
  z-index: 1;
  line-height: 1.25;
}
.ws-btn {
  border: 1px solid color-mix(in srgb, #000 28%, var(--w11-stroke));
  border-radius: 2px;
  min-height: 23px;
  min-width: 75px;
  padding: 2px 12px 3px;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 58%, var(--w11-window-bg)) 0%,
    color-mix(in srgb, #fff 22%, var(--w11-window-bg)) 45%,
    color-mix(in srgb, #000 4%, var(--w11-window-bg)) 100%
  );
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #fff 70%, transparent),
    0 1px 0 color-mix(in srgb, #000 6%, transparent);
}
.ws-btn:hover:not(:disabled) {
  border-color: var(--w11-accent);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--w11-highlight) 50%, var(--w11-window-bg)),
    color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg))
  );
}
.ws-btn:active:not(:disabled) {
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  box-shadow: inset 1px 1px 2px color-mix(in srgb, #000 16%, transparent);
}
.ws-btn.ghost {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 40%, var(--w11-window-bg)),
    var(--w11-window-bg)
  );
}
.ws-btn:disabled,
.ws-btn[disabled] {
  opacity: 1;
  cursor: default;
  color: var(--w11-muted);
  border-color: color-mix(in srgb, var(--w11-stroke) 75%, transparent);
  background: color-mix(in srgb, var(--w11-window-bg) 88%, var(--w11-stroke));
  box-shadow: none;
}
.ws-btn.ghost:disabled,
.ws-btn.ghost[disabled] {
  color: var(--w11-muted);
  background: color-mix(in srgb, var(--w11-window-bg) 92%, var(--w11-stroke));
}
.ws-form-grid input,
.ws-form-grid select,
.ws-form-grid textarea,
.ws-edit-body .ws-table input:not([type="checkbox"]),
.ws-edit-body .ws-row-btns input:not([type="checkbox"]),
.ws-edit-body .ws-row-btns select,
.ws-edit-shell textarea,
.ws-row-btns input:not([type="checkbox"]),
.ws-row-btns select {
  border: 1px solid color-mix(in srgb, #000 28%, var(--w11-stroke));
  border-radius: 2px;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  box-shadow: inset 1px 1px 0 color-mix(in srgb, #000 8%, transparent);
  padding: 3px 6px;
}
.ws-form-grid input:focus,
.ws-form-grid select:focus,
.ws-form-grid textarea:focus,
.ws-edit-body input:focus,
.ws-edit-body select:focus,
.ws-edit-body textarea:focus {
  outline: none;
  border-color: var(--w11-accent);
  box-shadow:
    inset 1px 1px 0 color-mix(in srgb, #000 8%, transparent),
    0 0 0 1px var(--w11-accent);
}

/* Kontextmenü (klassisch) */
.ws-ctx {
  min-width: 168px;
  padding: 2px;
  background: color-mix(in srgb, var(--w11-titlebar) 35%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, #000 35%, var(--w11-win-border));
  box-shadow: 2px 2px 5px color-mix(in srgb, #000 28%, transparent);
  border-radius: 0;
}
.ws-ctx button {
  padding: 4px 22px 4px 28px;
  border-radius: 0;
}
.ws-ctx button:hover:not(:disabled) {
  background: var(--w11-accent);
  color: #fff;
}
.ws-ctx button.danger:hover:not(:disabled) {
  background: #c42b1c;
  color: #fff;
}
.ws-ctx hr {
  margin: 2px 1px;
  border-top: 1px solid color-mix(in srgb, #000 14%, var(--w11-stroke));
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 40%, transparent);
}

/* Modal-Dialog */
.ws-modal {
  background: color-mix(in srgb, #000 28%, transparent);
}
.ws-modal-card {
  background: color-mix(in srgb, var(--w11-titlebar) 40%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, #000 32%, var(--w11-win-border));
  box-shadow:
    inset 1px 1px 0 color-mix(in srgb, #fff 45%, transparent),
    0 8px 24px color-mix(in srgb, #000 30%, transparent);
  border-radius: 0;
  padding: 12px 14px 10px;
}
.ws-modal-title {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid color-mix(in srgb, #000 10%, var(--w11-stroke));
}

/* Property Sheet (Edit) — überschreibt flache dlg-shell Tabs */
.ws-edit-shell.dlg-shell,
.ws-edit-shell {
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body)) !important;
  box-shadow: inset 1px 1px 0 color-mix(in srgb, #fff 40%, transparent);
}
.ws-edit-shell.dlg-shell .ws-edit-tabs.win-sheet-tabs,
.ws-edit-shell .ws-edit-tabs.win-sheet-tabs {
  display: flex;
  gap: 0;
  flex-wrap: wrap;
  align-items: flex-end;
  padding: 8px 10px 0 !important;
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body)) !important;
  border-bottom: none !important;
  overflow: visible !important;
}
.ws-edit-shell.dlg-shell .ws-edit-tabs .win-sheet-tab,
.ws-edit-shell .ws-edit-tabs .win-sheet-tab {
  appearance: none;
  border: 1px solid color-mix(in srgb, #000 28%, var(--w11-stroke)) !important;
  border-bottom: none !important;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 35%, var(--w11-titlebar)),
    color-mix(in srgb, #000 5%, var(--w11-titlebar))
  ) !important;
  color: var(--w11-text) !important;
  padding: 6px 14px !important;
  margin: 0 2px 0 0;
  border-radius: 3px 3px 0 0 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  top: 0 !important;
  white-space: nowrap;
  flex-shrink: 0;
}
.ws-edit-shell.dlg-shell .ws-edit-tabs .win-sheet-tab:hover,
.ws-edit-shell .ws-edit-tabs .win-sheet-tab:hover {
  background: color-mix(in srgb, #fff 22%, var(--w11-titlebar)) !important;
}
.ws-edit-shell.dlg-shell .ws-edit-tabs .win-sheet-tab.active,
.ws-edit-shell .ws-edit-tabs .win-sheet-tab.active {
  background: var(--w11-window-bg) !important;
  color: var(--w11-text) !important;
  font-weight: 600 !important;
  border-bottom-color: transparent !important;
  position: relative;
  z-index: 2;
  padding-bottom: 7px !important;
  margin-bottom: -1px;
}
.ws-edit-body {
  margin: 0 8px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, #000 28%, var(--w11-stroke));
  background: var(--w11-window-bg) !important;
  box-shadow: inset 1px 1px 0 color-mix(in srgb, #fff 35%, transparent);
  border-radius: 0;
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
.ws-edit-foot {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 8px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body));
  border-top: 1px solid color-mix(in srgb, #000 12%, var(--w11-stroke));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 40%, transparent);
  gap: 8px;
}
.ws-edit-foot .ws-edit-status {
  margin-right: auto;
  margin-left: 0;
}
/* Listen/Toggle: begrenzte Höhe, Formulare bleiben voll sichtbar */
.ws-edit-body .ws-toggle-list {
  min-height: 160px;
  max-height: 320px;
  overflow: auto;
}
.ws-edit-body .wse-summary {
  min-height: 280px;
  max-height: 420px;
  height: auto;
  resize: none;
  overflow: auto;
}
.ws-edit-body .win-sheet-pane[data-ws-pane="ftp"] .ws-table-wrap,
.ws-edit-body .win-sheet-pane[data-ws-pane="mysql"] .ws-table-wrap {
  min-height: 140px;
  max-height: 240px;
  overflow: auto;
}
.ws-edit-body .ws-group {
  overflow: visible;
}
.wse-ssl-layout {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-height: 0;
}
.wse-ssl-main {
  flex: 1 1 auto;
  min-width: 0;
}
.wse-ssl-badge {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  margin-top: 6px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 80%, transparent);
  background-color: color-mix(in srgb, #c42b1c 14%, var(--w11-window-bg));
  background-repeat: no-repeat;
  background-position: center;
  background-size: 34px 34px;
  /* padlock red (inactive) */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23c42b1c' d='M12 2a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8a2 2 0 0 0-2-2h-1V7a5 5 0 0 0-5-5zm-3 5a3 3 0 0 1 6 0v3H9V7zm3 7a2 2 0 0 1 1 3.73V19h-2v-1.27A2 2 0 0 1 12 14z'/%3E%3C/svg%3E");
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 35%, transparent);
}
.wse-ssl-badge[data-state="on"] {
  background-color: color-mix(in srgb, #107c10 16%, var(--w11-window-bg));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23107c10' d='M12 2a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8a2 2 0 0 0-2-2h-1V7a5 5 0 0 0-5-5zm-3 5a3 3 0 0 1 6 0v3H9V7zm3 7a2 2 0 0 1 1 3.73V19h-2v-1.27A2 2 0 0 1 12 14z'/%3E%3C/svg%3E");
}
.ws-edit-body .ws-form-grid {
  grid-template-columns: 160px 1fr;
  gap: 8px 12px;
}
.ws-edit-body .ws-form-grid input,
.ws-edit-body .ws-form-grid select {
  min-height: 24px;
  padding: 4px 7px;
}
.ws-msg:empty { display: none !important; }
.ws-fw-alert { flex-shrink: 0; }
.ws-edit-foot .ws-btn { min-width: 88px; }
.ws-edit-status {
  margin-left: auto;
  color: var(--w11-muted);
  font-size: 11px;
  padding-right: 4px;
}
.ws-fw-alert {
  margin: 8px 8px 0;
  border-radius: 0;
}
.ws-mod-row {
  border: 1px solid color-mix(in srgb, #000 12%, var(--w11-stroke));
  background: var(--w11-window-bg);
  border-radius: 0;
}
.ws-mod-row:hover {
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
}
.ws-badge,
.ws-fw {
  border-radius: 0;
  border: 1px solid color-mix(in srgb, #000 18%, var(--w11-stroke));
  font-size: 11px;
  padding: 0 5px;
  line-height: 16px;
}
.ws-toggle-list {
  border: 1px solid color-mix(in srgb, #000 22%, var(--w11-stroke));
  box-shadow: inset 1px 1px 0 color-mix(in srgb, #000 6%, transparent);
  border-radius: 0;
  background: var(--w11-window-bg);
}
.ws-banner {
  margin: 6px 8px 0;
  border-radius: 0;
}

/* Webserver — Nginx-Dienst (Icon-Toolbar) */
.ws-svc-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.ws-svc-actions {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  flex-shrink: 0;
}
.ws-ico-btn {
  width: 32px;
  height: 28px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid color-mix(in srgb, #000 22%, var(--w11-stroke));
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 22%, var(--w11-window-bg)),
    color-mix(in srgb, #000 6%, var(--w11-window-bg))
  );
  color: var(--w11-text);
  box-shadow: inset 1px 1px 0 color-mix(in srgb, #fff 35%, transparent);
  cursor: pointer;
  border-radius: 0;
}
.ws-ico-btn:hover {
  border-color: var(--w11-accent);
  background: color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg));
}
.ws-ico-btn:active {
  box-shadow: inset 1px 1px 2px color-mix(in srgb, #000 18%, transparent);
}
.ws-ico-btn[hidden] { display: none !important; }
.ws-ico {
  width: 14px;
  height: 14px;
  display: block;
  background: currentColor;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
}
.ws-ico.install {
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M8 1v9M4.5 6.5 8 10l3.5-3.5M2 13h12'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M8 1v9M4.5 6.5 8 10l3.5-3.5M2 13h12'/></svg>");
}
.ws-ico.power-start {
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M6 3.2v9.6L13 8z'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M6 3.2v9.6L13 8z'/></svg>");
  background: #107c10;
}
.ws-ico.power-stop {
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M4 4h8v8H4z'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M4 4h8v8H4z'/></svg>");
  background: #c42b1c;
}
.ws-ico.reload {
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13 8a5 5 0 1 1-1.2-3.3L13 6V3l3 3-3 3V7.2A3.5 3.5 0 1 0 11.5 11'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M13 8a5 5 0 1 1-1.2-3.3L13 6V3l3 3-3 3V7.2A3.5 3.5 0 1 0 11.5 11'/></svg>");
}
.ws-ico.restart {
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M2 2h4v4H2zm8 0h4v4h-4zM2 10h4v4H2zm8 0h4v4h-4z'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='black' d='M2 2h4v4H2zm8 0h4v4h-4zM2 10h4v4H2zm8 0h4v4h-4z'/></svg>");
}

/* PHP-Karten (Win7-Stil) */
.ws-php-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 8px;
}
.ws-php-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, #000 18%, var(--w11-stroke));
  background: linear-gradient(
    180deg,
    color-mix(in srgb, #fff 16%, var(--w11-window-bg)),
    var(--w11-window-bg)
  );
  box-shadow: inset 1px 1px 0 color-mix(in srgb, #fff 28%, transparent);
  position: relative;
  overflow: hidden;
}
.ws-php-card.is-on {
  border-color: color-mix(in srgb, #107c10 35%, var(--w11-stroke));
}
.ws-php-card-ico {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border: 1px solid color-mix(in srgb, #000 16%, var(--w11-stroke));
  background:
    linear-gradient(135deg, color-mix(in srgb, #777bb3 55%, var(--w11-window-bg)), color-mix(in srgb, #4f5b93 70%, var(--w11-window-bg)));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 25%, transparent);
  position: relative;
}
.ws-php-card-ico::after {
  content: "php";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 9px/1 Tahoma, "Segoe UI", sans-serif;
  color: #fff;
  letter-spacing: 0.02em;
  text-transform: lowercase;
}
.ws-php-card-body { flex: 1; min-width: 0; }
.ws-php-card-ver {
  font-weight: 700;
  font-size: 13px;
  color: var(--w11-text);
  display: flex;
  align-items: center;
  gap: 6px;
}
.ws-php-card-st {
  font-size: 11px;
  color: var(--w11-muted);
  margin-top: 2px;
}
.ws-php-card-act { flex-shrink: 0; }
.ws-php-card-act .ws-btn { font-size: 11px; padding: 2px 8px; }
.ws-php-card-up {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  vertical-align: middle;
  animation: ws-php-blink 1.1s ease-in-out infinite;
}

/* Update-Pfeil in Website-Liste (gleiches Icon wie ws-ver-upd-ico) */
.ws-php-cell {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.ws-php-up {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 0;
  animation: ws-php-blink 1.1s ease-in-out infinite;
}
.ws-php-up:hover {
  opacity: 1;
  filter: brightness(0.85);
}
.ws-php-up-ico {
  display: inline-block;
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2l5 6H9v6H7V8H3z' fill='%23c47a00'/%3E%3C/svg%3E");
}
@keyframes ws-php-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.25; }
}

/* Module-Untertabs */
.ws-subtabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--w11-stroke);
  margin: 0 0 10px;
}
.ws-subtab {
  border: 1px solid transparent;
  border-bottom: none;
  background: transparent;
  color: var(--w11-muted);
  padding: 5px 14px;
  font: inherit;
  cursor: pointer;
  margin-bottom: -1px;
  border-radius: 0;
}
.ws-subtab:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
}
.ws-subtab.active {
  color: var(--w11-text);
  background: var(--w11-window-bg);
  border-color: var(--w11-stroke);
  font-weight: 600;
}
.ws-mod-pane[hidden] { display: none !important; }
.ws-mod-pane { margin-top: 4px; }
.ws-mod-toolbar { margin-bottom: 8px; }
.ws-mod-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 6px;
}
.ws-mod-tiles .ws-mod-row {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  padding: 8px 10px;
}
.ws-mod-tiles .ws-pkg-actions {
  align-self: flex-end;
}

/* ===== Aktivitäten (Live-Graphen) ===== */
.w11-akt-body {
  background: var(--w11-win-body) !important;
  color: var(--w11-text);
  padding: 0 !important;
  overflow: hidden !important;
}
.akt-boot {
  height: 100%;
  display: grid;
  place-content: center;
  gap: 14px;
  text-align: center;
  color: var(--w11-muted);
}
.akt-boot-pulse {
  width: 42px;
  height: 42px;
  margin: 0 auto;
  border-radius: 50%;
  border: 3px solid color-mix(in srgb, var(--w11-accent) 25%, transparent);
  border-top-color: var(--w11-accent);
  animation: akt-spin 0.8s linear infinite;
}
@keyframes akt-spin { to { transform: rotate(360deg); } }
.akt-app {
  display: flex;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
}
.akt-nav {
  width: 210px;
  flex-shrink: 0;
  border-right: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body));
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  overflow: auto;
  scrollbar-width: thin;
}
.akt-nav-item {
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  text-align: left;
  padding: 8px 10px;
  border-radius: 10px;
  cursor: pointer;
  font: inherit;
  color: var(--w11-text);
  display: flex;
  flex-direction: column;
  gap: 5px;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.akt-nav-item:hover {
  background: color-mix(in srgb, var(--w11-highlight) 35%, var(--w11-window-bg));
}
.akt-nav-item.active {
  background: color-mix(in srgb, var(--akt-accent, var(--w11-accent)) 14%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--akt-accent, var(--w11-accent)) 28%, var(--w11-stroke));
  box-shadow: inset 3px 0 0 var(--akt-accent, var(--w11-accent));
}
.akt-nav-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
}
.akt-nav-item strong { font-size: 0.86rem; font-weight: 650; }
.akt-nav-pct {
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--akt-accent, var(--w11-accent));
  font-variant-numeric: tabular-nums;
}
.akt-nav-meter {
  height: 3px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-stroke) 80%, transparent);
  overflow: hidden;
}
.akt-nav-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
  transition: width 0.35s ease;
}
.akt-chart {
  width: 100%;
  height: 120px;
  display: block;
  border-radius: 8px;
  background: color-mix(in srgb, var(--w11-window-bg) 70%, transparent);
}
.akt-chart-sm { height: 34px; }
.akt-main {
  flex: 1;
  min-width: 0;
  overflow: auto;
  padding: 14px 16px 18px;
  scrollbar-width: thin;
}
.akt-main-fit {
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
  padding: 10px 12px 12px;
}
.akt-panel { display: flex; flex-direction: column; gap: 14px; min-height: 100%; }
.akt-panel-overview {
  flex: 1;
  min-height: 0;
  height: 100%;
  gap: clamp(6px, 1.1vh, 12px);
  overflow: hidden;
}
.akt-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  flex-shrink: 0;
}
.akt-head-compact h3 { font-size: 1.15rem; }
.akt-kicker {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--w11-muted);
}
.akt-head h3 {
  margin: 2px 0 0;
  font-size: 1.35rem;
  font-weight: 650;
  color: var(--w11-text);
}
.akt-head-stat {
  text-align: right;
  color: var(--w11-accent);
}
.akt-head-stat strong {
  display: block;
  font-size: 1.6rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.akt-head-stat span {
  font-size: 0.75rem;
  color: var(--w11-muted);
}
.akt-overview-grid {
  --akt-cols: 3;
  --akt-rows: 2;
  --akt-chart-h: 72px;
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(var(--akt-cols), minmax(0, 1fr));
  grid-template-rows: repeat(var(--akt-rows), minmax(0, 1fr));
  gap: clamp(6px, 1vh, 10px);
  overflow: hidden;
}
.akt-card {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  padding: clamp(8px, 1.1vh, 12px);
  display: flex;
  flex-direction: column;
  gap: clamp(4px, 0.7vh, 8px);
  min-height: 0;
  overflow: hidden;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--w11-stroke) 40%, transparent);
}
.akt-card .akt-chart {
  flex: 1 1 auto;
  min-height: 28px;
  height: var(--akt-chart-h, 72px);
}
.akt-card-h {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: flex-start;
  flex-shrink: 0;
}
.akt-card-h strong { display: block; font-size: clamp(0.82rem, 1.5vh, 0.95rem); }
.akt-card-h small { color: var(--w11-muted); font-size: 0.72rem; }
.akt-badge {
  font-size: 0.68rem;
  padding: 2px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-muted) 18%, var(--w11-window-bg));
  color: var(--w11-muted);
  font-weight: 600;
  flex-shrink: 0;
}
.akt-badge.on {
  background: color-mix(in srgb, #107c10 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #107c10 70%, var(--w11-text));
}
.akt-card-val {
  font-size: clamp(1.25rem, 2.6vh, 1.8rem);
  font-weight: 650;
  color: var(--akt-accent, var(--w11-accent));
  font-variant-numeric: tabular-nums;
  line-height: 1;
  flex-shrink: 0;
}
.akt-card-val em { font-style: normal; font-size: 0.9rem; margin-left: 2px; opacity: 0.8; }
.akt-chart-frame {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  width: 100%;
}
.akt-chart-frame > .akt-chart {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  height: 100%;
}
.akt-chart-badge {
  position: absolute;
  top: 4px;
  right: 8px;
  z-index: 2;
  text-align: right;
  pointer-events: none;
  line-height: 1.05;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--w11-window-bg) 85%, transparent),
    0 1px 2px color-mix(in srgb, var(--w11-window-bg) 70%, transparent);
}
.akt-chart-badge strong {
  display: block;
  font-size: clamp(1.05rem, 2.4vh, 1.55rem);
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.akt-chart-badge span {
  display: block;
  font-size: 0.68rem;
  color: var(--w11-muted);
  font-weight: 500;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.akt-card .akt-chart-frame {
  height: var(--akt-chart-h, 72px);
}
.akt-card .akt-chart-frame > .akt-chart {
  height: 100%;
}
.akt-card-detail {
  margin: 0;
  font-size: clamp(0.68rem, 1.2vh, 0.75rem);
  color: var(--w11-muted);
  flex-shrink: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.akt-sys-strip {
  --akt-strip-chart-h: 36px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(6px, 1vh, 10px);
  flex: 0 0 auto;
  min-height: 0;
}
.akt-sys-pill {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  padding: clamp(8px, 1vh, 12px);
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
  overflow: hidden;
}
.akt-sys-pill .akt-chart {
  height: var(--akt-strip-chart-h, 36px);
  min-height: 22px;
}
.akt-sys-pill > span { font-size: 0.75rem; color: var(--w11-muted); }
.akt-sys-pill strong { font-size: clamp(1rem, 2vh, 1.2rem); font-variant-numeric: tabular-nums; }
.akt-sys-pill small { color: var(--w11-muted); font-size: 0.72rem; }
.akt-bar {
  height: 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--w11-stroke) 85%, transparent);
  overflow: hidden;
  margin-top: 4px;
}
.akt-bar i {
  display: block;
  height: 100%;
  background: var(--w11-accent);
  border-radius: inherit;
  transition: width 0.35s ease;
}
.akt-hero-chart {
  --akt-hero-h: 160px;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  padding: 10px;
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
}
.akt-hero-chart .akt-chart-frame {
  height: var(--akt-hero-h, 160px);
  min-height: 56px;
}
.akt-hero-chart .akt-chart { height: 100%; }
.akt-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.akt-meta {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  padding: 10px 12px;
}
.akt-meta span {
  display: block;
  font-size: 0.7rem;
  color: var(--w11-muted);
  margin-bottom: 2px;
}
.akt-meta strong {
  font-size: 0.92rem;
  font-weight: 600;
  word-break: break-word;
}
.akt-meta-wide { grid-column: 1 / -1; }
.akt-block { display: flex; flex-direction: column; gap: 8px; }
.akt-block h4 {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 650;
  color: var(--w11-text);
}
.akt-core-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 8px;
}
.akt-core {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  padding: 8px 10px;
}
.akt-core header {
  display: flex;
  justify-content: space-between;
  font-size: 0.75rem;
  margin-bottom: 4px;
  color: var(--w11-muted);
}
.akt-core header strong { color: var(--w11-accent); font-variant-numeric: tabular-nums; }
.akt-disk-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
}
.akt-disk {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  padding: 10px 12px;
}
.akt-disk header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.akt-disk p { margin: 6px 0 0; font-size: 0.78rem; color: var(--w11-text); }
.akt-disk small { color: var(--w11-muted); font-size: 0.7rem; }
.akt-legend {
  display: flex;
  gap: 14px;
  font-size: 0.75rem;
  color: var(--w11-muted);
}
.akt-leg.r::before,
.akt-leg.w::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 3px;
  border-radius: 2px;
  margin-right: 6px;
  vertical-align: middle;
}
.akt-leg.r::before { background: #16a34a; }
.akt-leg.w::before { background: #ca8a04; }
.akt-empty { color: var(--w11-muted); font-size: 0.85rem; }
.akt-panel-svc {
  height: 100%;
  min-height: 0;
  overflow: hidden;
  gap: 10px;
}
.akt-panel-svc .akt-hero-chart {
  flex: 1 1 auto;
  min-height: 0;
}
.akt-panel-svc .akt-meta-grid {
  flex-shrink: 0;
}
.akt-panel-system {
  height: 100%;
  min-height: 0;
  overflow: hidden;
  gap: 0;
}
.akt-system-grid {
  --akt-sys-chart-h: 100px;
  flex: 1;
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: clamp(6px, 1vh, 10px);
  overflow: hidden;
}
.akt-system-grid > .akt-block {
  min-height: 0;
  overflow: hidden;
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  padding: clamp(8px, 1vh, 12px);
  gap: 6px;
}
.akt-system-grid .akt-hero-chart {
  background: transparent;
  border: none;
  padding: 0;
  flex: 1 1 auto;
}
.akt-system-grid .akt-hero-chart .akt-chart-frame {
  height: var(--akt-sys-chart-h, 100px);
}
.akt-system-grid .akt-core-grid {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  scrollbar-width: thin;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 6px;
}
.akt-system-grid .akt-core {
  padding: 4px 6px;
}
.akt-system-grid .akt-core .akt-chart-sm {
  height: 28px;
}
.akt-system-grid .akt-disk-grid {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  scrollbar-width: thin;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  align-content: start;
}
.akt-system-grid .akt-disk {
  padding: 8px 10px;
}
.akt-system-grid .akt-meta-grid-compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  flex-shrink: 0;
}
.akt-system-grid .akt-meta {
  padding: 6px 8px;
}
.akt-system-grid .akt-legend {
  flex-shrink: 0;
}
.akt-system-fit {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}
@media (max-width: 900px) {
  .akt-sys-strip { grid-template-columns: 1fr; }
  .akt-meta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .akt-system-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    overflow: auto;
  }
}

/* Speditionsanbindung */
.sped-root-host, .sped-shell {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.sped-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px 0;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
}
.sped-tabs, .sped-subtabs { display: flex; gap: 4px; flex-wrap: wrap; }
.sped-subtabs { padding: 8px 14px; border-bottom: 1px solid var(--w11-stroke); background: var(--w11-titlebar); }
.sped-carrier-tab, .sped-sub {
  border: 1px solid transparent;
  background: transparent;
  color: var(--w11-muted);
  padding: 7px 12px;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
}
.sped-carrier-tab.active, .sped-sub.active {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg));
  border-color: var(--w11-stroke);
}
.sped-carrier-soon { opacity: .55; cursor: default; }
.sped-body { flex: 1; min-height: 0; overflow: auto; padding: 14px; }
.sped-card {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 12px;
}
.sped-toolbar { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.sped-h { margin: 0 0 4px; font-size: 1.05rem; color: var(--w11-text); }
.sped-h3 { margin: 0 0 10px; font-size: .95rem; color: var(--w11-text); }
.sped-subline, .sped-muted { color: var(--w11-muted); font-size: .86rem; margin: 0; }
.sped-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.sped-table th, .sped-table td {
  border-bottom: 1px solid var(--w11-stroke);
  padding: 8px 6px;
  text-align: left;
  vertical-align: middle;
}
.sped-table th { color: var(--w11-muted); font-weight: 600; }
.sped-mono { font-family: ui-monospace, Consolas, monospace; font-size: .84rem; }
.sped-empty { color: var(--w11-muted); padding: 24px 8px; text-align: center; }
.sped-empty-state {
  min-height: calc(100% - 8px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 16px;
}
.sped-empty-card {
  width: min(440px, 100%);
  text-align: center;
  padding: 36px 28px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 7%, var(--w11-window-bg));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--w11-stroke) 55%, transparent);
}
.sped-empty-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--w11-text);
  letter-spacing: 0.01em;
}
.sped-versand-panel {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 920px;
  width: 100%;
}
.sped-versand-panel.sped-versand-full {
  max-width: none;
}
.sped-versand-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 2px 0;
}
.sped-versand-head .sped-h { margin: 0; font-size: 1.15rem; font-weight: 650; letter-spacing: 0.01em; }
.sped-count-line {
  margin: 4px 0 0;
  color: var(--w11-muted);
  font-size: 0.86rem;
}
.sped-order-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sped-order-card {
  display: grid;
  grid-template-columns: 4px 1fr auto;
  align-items: stretch;
  gap: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.sped-order-card:hover {
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--w11-stroke) 40%, transparent);
}
.sped-order-card.is-focus {
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
}
.sped-order-card-accent {
  background: linear-gradient(
    180deg,
    var(--w11-accent),
    color-mix(in srgb, var(--w11-accent) 55%, var(--w11-window-bg))
  );
}
.sped-order-card-body {
  padding: 14px 16px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sped-order-card-top {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.sped-order-card-title {
  font-size: 1.02rem;
  font-weight: 650;
  color: var(--w11-text);
  letter-spacing: 0.01em;
}
.sped-order-card-badge {
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
  color: color-mix(in srgb, #107c10 70%, var(--w11-text));
  background: color-mix(in srgb, #107c10 14%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, #107c10 22%, var(--w11-stroke));
}
.sped-order-card-file {
  color: var(--w11-muted);
  font-size: 0.8rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sped-order-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
  margin-top: 4px;
}
.sped-order-meta-item {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.9rem;
  color: var(--w11-text);
}
.sped-order-meta-label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--w11-muted);
}
.sped-order-card-actions {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 12px 14px;
  border-left: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg));
}
.sped-order-card-actions .w11-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  white-space: nowrap;
  min-width: 118px;
}
@media (max-width: 720px) {
  .sped-order-card {
    grid-template-columns: 4px 1fr;
  }
  .sped-order-card-actions {
    grid-column: 2;
    flex-direction: row;
    border-left: 0;
    border-top: 1px solid var(--w11-stroke);
    padding-top: 10px;
  }
}
.sped-row-focus { background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg)); }
.sped-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.sped-form-grid-tight { margin-bottom: 0; flex: 1 1 auto; min-width: 0; }
.sped-settings-row {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 12px;
}
.sped-settings-side {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  gap: 8px;
  flex: 0 0 168px;
  width: 168px;
}
.sped-settings-side .w11-btn {
  width: 100%;
  white-space: nowrap;
}
.sped-stat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 30px;
}
.sped-stat strong { display: block; margin-top: 4px; color: var(--w11-text); }
.sped-field { display: flex; flex-direction: column; gap: 4px; font-size: .82rem; color: var(--w11-muted); }
.sped-field input {
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  border-radius: 6px;
  padding: 7px 8px;
  font: inherit;
}
.sped-form-actions, .sped-row-actions, .sped-top-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.sped-editor { margin-top: 12px; padding: 12px; border: 1px solid var(--w11-stroke); border-radius: 8px; background: var(--w11-window-bg); }
.sped-order-host.sped-root-host {
  height: auto !important;
  min-height: 100%;
  overflow: auto; /* Sicherheit: Buttons nie unsichtbar abschneiden */
}
.sped-order-host, .sped-order-shell {
  height: auto;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  padding: 10px 14px 16px;
  box-sizing: border-box;
  overflow: visible;
  min-height: 0;
}
.sped-order-shell.sped-order-compact {
  overflow: visible;
  height: auto;
  flex: 0 0 auto;
}
.sped-order-head { flex-shrink: 0; margin-bottom: 10px; }
.sped-order-head-compact {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.sped-order-head-compact .sped-h { margin: 0; font-size: 1.02rem; }
.sped-order-head-compact .sped-subline { margin-top: 2px; font-size: 0.78rem; }
.sped-order-form {
  /* natürliche Höhe – nicht zusammenschieben / abschneiden */
  flex: 0 0 auto;
  overflow: visible;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sped-order-compact .sped-field { gap: 2px; font-size: 0.78rem; }
.sped-order-compact .sped-field input,
.sped-order-compact .sped-field select,
.sped-order-compact .sped-field textarea {
  padding: 5px 8px;
  font-size: 0.86rem;
  border-radius: 5px;
}
.sped-form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 10px;
}
.sped-form-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px 10px;
}
.sped-form-grid-4 {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 8px 10px;
}
.sped-form-grid-5 {
  display: grid;
  grid-template-columns: 1.35fr 0.9fr 0.9fr 0.9fr 0.95fr;
  gap: 8px 10px;
}
.sped-field-full { width: 100%; }
.sped-field select,
.sped-field textarea {
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  border-radius: 6px;
  padding: 7px 9px;
  font: inherit;
  width: 100%;
  box-sizing: border-box;
}
.sped-field textarea { resize: none; min-height: 44px; line-height: 1.3; }
.sped-order-compact .sped-field textarea { min-height: 40px; }
.sped-frankatur-info {
  padding: 10px 12px;
  border: 1px solid var(--w11-stroke);
  border-radius: 8px;
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
  font-size: 0.84rem;
  line-height: 1.4;
  color: var(--w11-text);
}
.sped-frankatur-compact {
  padding: 6px 10px;
  font-size: 0.78rem;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: baseline;
}
.sped-frankatur-info[hidden] { display: none !important; }
.sped-frankatur-title { font-weight: 700; }
.sped-frankatur-desc { color: var(--w11-muted); }
.sped-frankatur-rec { color: var(--w11-accent); font-weight: 700; }
.sped-prefilled {
  border-color: color-mix(in srgb, #107c10 35%, var(--w11-stroke)) !important;
  background: color-mix(in srgb, #107c10 12%, var(--w11-win-body)) !important;
}
.sped-dim-hint {
  border-color: color-mix(in srgb, var(--w11-accent) 55%, var(--w11-stroke)) !important;
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-win-body)) !important;
}
.sped-jtl-filled {
  border-color: color-mix(in srgb, #c19c00 45%, var(--w11-stroke)) !important;
  background: color-mix(in srgb, #c19c00 16%, var(--w11-win-body)) !important;
}
.sped-jtl-badge {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 4px 9px;
  border-radius: 999px;
  color: color-mix(in srgb, #8a6d00 80%, var(--w11-text));
  background: color-mix(in srgb, #c19c00 18%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, #c19c00 30%, var(--w11-stroke));
}
.sped-src-tag {
  font-style: normal;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: color-mix(in srgb, #8a6d00 85%, var(--w11-text));
  margin-left: 4px;
}
.sped-dim-hint-note {
  margin: 0;
  align-self: end;
  font-size: 0.78rem;
  color: var(--w11-muted);
  padding-bottom: 4px;
}
.sped-dim-hint-note.hidden { display: none; }
.sped-order-weight-row { align-items: end; }
.sped-order-actions {
  flex: 0 0 auto;
  flex-shrink: 0;
  margin-top: 12px;
  margin-bottom: 4px;
  justify-content: space-between;
  width: 100%;
  padding-top: 4px;
  padding-bottom: 2px;
  background: var(--w11-win-body);
  position: relative;
  z-index: 2;
}
.sped-form-actions-right { display: flex; gap: 8px; flex-wrap: wrap; }
.sped-order-shell .sped-form-actions {
  flex: 0 0 auto;
  flex-shrink: 0;
  margin-top: 12px;
  padding-bottom: 6px;
}
.sped-order-shell #sped-order-status {
  flex: 0 0 auto;
  min-height: 0;
  margin-top: 4px;
}
@media (max-width: 760px) {
  .sped-form-grid-2, .sped-form-grid-3, .sped-form-grid-4, .sped-form-grid-5 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .sped-form-grid-2, .sped-form-grid-3, .sped-form-grid-4, .sped-form-grid-5 { grid-template-columns: 1fr; }
}
.sped-row-actions .w11-btn { display: inline-flex; align-items: center; gap: 6px; }
.sped-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.sped-stats strong { display: block; margin-top: 4px; color: var(--w11-text); }
.sped-code {
  display: block;
  padding: 8px 10px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--w11-window-bg) 80%, var(--w11-stroke));
  border: 1px solid var(--w11-stroke);
  color: var(--w11-text);
  font-size: .8rem;
  word-break: break-all;
}
.sped-check { display: flex; gap: 8px; align-items: center; margin: 8px 0 12px; color: var(--w11-text); }
.w11-btn.accent {
  background: var(--w11-accent);
  color: #fff;
  border-color: var(--w11-accent);
}
.sped-search {
  width: 220px;
  max-width: 36vw;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  border-radius: 6px;
  padding: 7px 10px;
  font: inherit;
}
.sped-toolbar-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.sped-arch-wrap {
  overflow: auto;
  padding: 0 !important;
}
.sped-arch-table {
  table-layout: fixed;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
.sped-arch-table col.sped-col-time { width: 168px; }
.sped-arch-table col.sped-col-order { width: 132px; }
.sped-arch-table col.sped-col-name { width: 20%; }
.sped-arch-table col.sped-col-sn { width: 210px; }
.sped-arch-table col.sped-col-file { width: 22%; }
.sped-arch-table col.sped-col-track { width: 148px; }
.sped-arch-table col.sped-col-acts { width: 112px; }
.sped-th-track { text-align: center; color: var(--w11-muted); font-weight: 600; }
.sped-td-track { vertical-align: middle; }
.sped-track-host { display: flex; justify-content: center; }
.sped-track-steps {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.sped-track-step {
  width: 22px;
  height: 22px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: color-mix(in srgb, var(--w11-muted) 45%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  flex-shrink: 0;
}
.sped-track-step .sped-ico { width: 12px; height: 12px; }
.sped-track-step.is-done {
  background: #2ea043;
  border-color: color-mix(in srgb, #2ea043 70%, #000);
}
.sped-track-step.is-active {
  box-shadow: 0 0 0 2px color-mix(in srgb, #2ea043 45%, transparent);
}
.sped-track-step.is-pending {
  background: color-mix(in srgb, var(--w11-muted) 38%, var(--w11-window-bg));
  color: color-mix(in srgb, var(--w11-muted) 80%, #fff);
}
.sped-file-link {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--w11-accent);
  cursor: pointer;
  font: inherit;
  padding: 0;
  text-align: left;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.sped-file-link:hover { filter: brightness(1.1); }
.sped-csv-shell {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px 18px 14px;
  box-sizing: border-box;
  background:
    radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--w11-accent) 10%, transparent), transparent 55%),
    radial-gradient(90% 70% at 100% 0%, color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 8%, transparent), transparent 50%),
    var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.sped-csv-loading {
  margin: auto;
  color: var(--w11-muted);
  font-size: 0.92rem;
  letter-spacing: 0.01em;
}
.sped-csv-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-shrink: 0;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)),
      color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg))
    );
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset;
}
.sped-csv-hero-main { min-width: 0; flex: 1 1 auto; }
.sped-csv-kicker {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--w11-muted);
  font-weight: 650;
  margin-bottom: 4px;
}
.sped-csv-title {
  margin: 0 0 10px;
  font-size: 1.35rem;
  font-weight: 650;
  line-height: 1.25;
  color: var(--w11-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sped-csv-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.sped-csv-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  max-width: 100%;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 80%, transparent);
  background: color-mix(in srgb, var(--w11-window-bg) 88%, transparent);
  font-size: 0.8rem;
  color: var(--w11-text);
}
.sped-csv-chip-muted { color: var(--w11-muted); }
.sped-csv-chip-k {
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--w11-muted);
  font-weight: 650;
}
.sped-csv-dl {
  flex-shrink: 0;
  margin-top: 2px;
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg)) !important;
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke)) !important;
  color: var(--w11-accent) !important;
}
.sped-csv-dl:hover {
  filter: brightness(1.08);
}
.sped-csv-grid {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  align-content: start;
  padding-right: 2px;
}
.sped-csv-card {
  border: 1px solid var(--w11-stroke);
  border-radius: 12px;
  background: var(--w11-window-bg);
  overflow: hidden;
  min-width: 0;
  box-shadow: 0 8px 24px color-mix(in srgb, #000 6%, transparent);
}
.sped-csv-card-h {
  padding: 10px 14px;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--w11-muted);
  border-bottom: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 80%, var(--w11-window-bg));
}
.sped-csv-card-body {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 4px 0;
}
.sped-csv-row {
  display: grid;
  grid-template-columns: 118px 1fr;
  gap: 10px;
  padding: 9px 14px;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 55%, transparent);
}
.sped-csv-row:last-child { border-bottom: 0; }
.sped-csv-label {
  font-size: 0.78rem;
  color: var(--w11-muted);
  font-weight: 550;
  line-height: 1.35;
}
.sped-csv-value {
  font-size: 0.9rem;
  color: var(--w11-text);
  font-weight: 550;
  line-height: 1.35;
  word-break: break-word;
}
.sped-csv-raw {
  flex-shrink: 0;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: color-mix(in srgb, var(--w11-window-bg) 92%, transparent);
  overflow: hidden;
}
.sped-csv-raw > summary {
  cursor: pointer;
  list-style: none;
  padding: 8px 12px;
  font-size: 0.78rem;
  color: var(--w11-muted);
  font-weight: 600;
  user-select: none;
}
.sped-csv-raw > summary::-webkit-details-marker { display: none; }
.sped-csv-raw[open] > summary {
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
}
.sped-csv-pre {
  margin: 0;
  padding: 12px;
  max-height: 160px;
  overflow: auto;
  background: var(--w11-window-bg);
  color: var(--w11-text);
  font-family: ui-monospace, Consolas, monospace;
  font-size: 0.78rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}
.sped-csv-host {
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
}
.sped-arch-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
  padding: 10px 12px;
  font-size: .78rem;
  letter-spacing: .02em;
  text-transform: uppercase;
  white-space: nowrap;
}
.sped-arch-table tbody td {
  padding: 0;
  vertical-align: middle;
  border-bottom: 1px solid color-mix(in srgb, var(--w11-stroke) 70%, transparent);
  height: 44px;
}
.sped-arch-table tbody tr:hover td {
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
}
.sped-th-sort { cursor: pointer; user-select: none; }
.sped-th-sort:hover { color: var(--w11-text); }
.sped-th-acts { text-align: center; }
.sped-td { overflow: hidden; }
.sped-td-sn { overflow: visible; }
.sped-cell {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 44px;
  padding: 0 12px;
  box-sizing: border-box;
}
.sped-cell-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--w11-text);
}
.sped-td-time .sped-cell-text,
.sped-td-file .sped-cell-text {
  color: var(--w11-muted);
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
}
.sped-td-time .sped-cell-text {
  overflow: visible;
  text-overflow: clip;
}
.sped-td-order .sped-cell-text {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  overflow: visible;
  text-overflow: clip;
}
.sped-td-order .sped-icon-btn,
.sped-td-name .sped-icon-btn,
.sped-td-sn .sped-icon-btn {
  width: 26px;
  height: 26px;
  opacity: 0;
}
.sped-arch-table tbody tr:hover .sped-td-order .sped-icon-btn,
.sped-arch-table tbody tr:hover .sped-td-name .sped-icon-btn,
.sped-arch-table tbody tr:hover .sped-td-sn .sped-icon-btn,
.sped-td-order .sped-icon-btn:focus,
.sped-td-name .sped-icon-btn:focus,
.sped-td-sn .sped-icon-btn:focus {
  opacity: 1;
}
.sped-td-sn .sped-cell {
  gap: 2px;
}
.sped-td-sn .sped-cell-text {
  font-family: ui-monospace, Consolas, monospace;
  font-size: .78rem;
  letter-spacing: -0.02em;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: clip;
}
.sped-field select {
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  border-radius: 6px;
  padding: 7px 8px;
  font: inherit;
  max-width: 100%;
}
.sped-autosave-hint {
  color: var(--w11-muted);
  font-size: .82rem;
  margin: 0;
}
.sped-td-acts .sped-ico-group {
  justify-content: center;
  width: 100%;
  padding: 0 8px;
}
.sped-ico-group {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  flex: 0 0 auto;
}
.sped-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  flex: 0 0 auto;
  line-height: 0;
}
.sped-icon-btn:hover:not(:disabled) {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border-color: var(--w11-stroke);
}
.sped-icon-btn:disabled {
  opacity: .32;
  cursor: default;
}
.sped-icon-btn-lg {
  width: 34px;
  height: 34px;
}
.sped-icon-btn.accent,
.sped-icon-btn.accent:hover:not(:disabled) {
  color: #fff;
  background: var(--w11-accent);
  border-color: var(--w11-accent);
}
.sped-icon-danger:hover:not(:disabled) {
  color: #c42b1c;
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 35%, var(--w11-stroke));
}
.sped-ico { display: block; }
.sped-track-link {
  color: var(--w11-accent);
  text-decoration: none;
}
.sped-track-link:hover { text-decoration: underline; }
.sped-bc-host {
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
}
.sped-bc-shell {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px 18px 14px;
  box-sizing: border-box;
  background:
    radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--w11-accent) 10%, transparent), transparent 55%),
    radial-gradient(90% 70% at 100% 0%, color-mix(in srgb, var(--w11-highlight, var(--w11-accent)) 8%, transparent), transparent 50%),
    var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.sped-bc-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-shrink: 0;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)),
      color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg))
    );
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset;
}
.sped-bc-hero-main { min-width: 0; flex: 1 1 auto; }
.sped-bc-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-top: 2px;
}
.sped-bc-print {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg)) !important;
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke)) !important;
  color: var(--w11-accent) !important;
}
.sped-bc-stage {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: stretch;
  justify-content: stretch;
}
.sped-bc-frame {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--w11-window-bg) 92%, #fff),
      var(--w11-window-bg)
    );
  box-shadow: 0 10px 28px color-mix(in srgb, #000 7%, transparent);
  overflow: hidden;
  position: relative;
}
.sped-bc-img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 2px 12px color-mix(in srgb, #000 12%, transparent);
}
.sped-bc-loading {
  color: var(--w11-muted);
  font-size: 0.92rem;
  letter-spacing: 0.01em;
}

/* —— Versanddienstleister —— */
.vd-root-host,
#acc-versanddienstleister {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.vd-app {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-win-body)),
      var(--w11-win-body) 48px
    );
  color: var(--w11-text);
  overflow: hidden;
}
.vd-carrier-bar {
  flex-shrink: 0;
  padding: 10px 12px 0;
  background: var(--w11-titlebar);
  border-bottom: 1px solid var(--w11-stroke);
}
.vd-main-tabs {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: 40px;
}
.vd-main-tabs-left,
.vd-main-tabs-right {
  display: flex;
  gap: 6px;
  align-items: flex-end;
  min-width: 0;
}
.vd-main-tabs-right {
  margin-left: auto;
  flex-shrink: 0;
}
.vd-main-tabs-search {
  flex: 1 1 auto;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  align-self: flex-end;
  min-width: 0;
  max-width: 440px;
  height: 40px;
  margin: 0 auto;
  padding: 0 8px 0;
}
.vd-main-tabs-search[hidden] {
  display: none !important;
}
.vd-search {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 180px;
  height: 40px;
}
.vd-search-input {
  width: 100%;
  height: 40px;
  padding: 0 38px 0 14px;
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 82%, transparent);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: color-mix(in srgb, var(--w11-window-bg) 42%, transparent);
  color: var(--w11-text);
  font: inherit;
  font-size: 0.88rem;
  outline: none;
  box-shadow: none;
  transition: border-color 0.12s ease, background 0.12s ease, color 0.12s ease;
}
.vd-search-input::placeholder {
  color: var(--w11-muted);
}
.vd-search-input:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-highlight) 35%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
}
.vd-search-input:focus {
  color: var(--w11-text);
  background: var(--w11-window-bg);
  border-color: var(--w11-stroke);
  box-shadow:
    0 1px 0 var(--w11-window-bg),
    inset 0 2px 0 var(--w11-accent),
    inset 0 1px 0 color-mix(in srgb, #fff 10%, transparent);
  z-index: 1;
}
.vd-search-input::-webkit-search-cancel-button,
.vd-search-input::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}
.vd-search-clear {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--w11-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 2;
}
.vd-search-clear:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-highlight) 55%, transparent);
}
.vd-search-clear[hidden] {
  display: none !important;
}
.vd-search-clear svg {
  width: 14px;
  height: 14px;
}
/* VD: Texte nicht markierbar (wie Win11-Fenster) */
.vd-app,
.vd-app .vd-table,
.vd-app .vd-table th,
.vd-app .vd-table td,
.vd-app .vd-status-title,
.vd-app .vd-panel-h,
.vd-app .vd-cell-text,
.vd-hist-app,
.vd-hist-app * {
  user-select: none;
  -webkit-user-select: none;
}
.vd-pill-btn {
  appearance: none;
  font: inherit;
  cursor: pointer;
  max-width: 100%;
}
.vd-pill-btn:hover {
  filter: brightness(1.05);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-accent) 35%, transparent);
}
.vd-td-empty {
  text-align: center;
  padding: 28px 16px !important;
  color: var(--w11-muted);
  font-size: 0.9rem;
}
.vd-row-skel td {
  padding-top: 12px;
  padding-bottom: 12px;
}
.vd-skel {
  display: block;
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--w11-muted) 10%, var(--w11-window-bg)) 0%,
    color-mix(in srgb, var(--w11-highlight) 55%, var(--w11-window-bg)) 45%,
    color-mix(in srgb, var(--w11-muted) 10%, var(--w11-window-bg)) 100%
  );
  background-size: 220% 100%;
  animation: vd-skel-shine 1.15s ease-in-out infinite;
}
.vd-skel-tn { width: 72%; height: 14px; }
.vd-skel-sm { width: 48%; }
.vd-skel-md { width: 68%; }
.vd-skel-pill { width: 88px; height: 22px; border-radius: 999px; }
.vd-skel-acts { width: 120px; height: 28px; margin-left: auto; }
@keyframes vd-skel-shine {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
.w11-win-body:has(.vd-hist-app),
.vd-hist-host {
  height: 100%;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 0 !important;
}
.vd-hist-app {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: var(--w11-win-body);
  color: var(--w11-text);
}
.vd-hist-toolbar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
}
.vd-hist-toolbar-acts {
  display: flex;
  gap: 4px;
}
.vd-hist-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 16px 18px 24px;
  scrollbar-width: thin;
  scrollbar-color: var(--w11-scrollbar) var(--w11-scrollbar-track);
}
.vd-hist-body::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.vd-hist-body::-webkit-scrollbar-track {
  background: var(--w11-scrollbar-track);
  border-radius: 8px;
}
.vd-hist-body::-webkit-scrollbar-thumb {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--w11-scrollbar) 88%, #ffffff) 0%,
    var(--w11-scrollbar) 45%,
    color-mix(in srgb, var(--w11-scrollbar) 75%, #000000) 100%
  );
  border: 2px solid var(--w11-scrollbar-track);
  border-radius: 8px;
}
.vd-hist-body::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--w11-scrollbar-thumb-hover, var(--w11-scrollbar)) 92%, #ffffff) 0%,
    var(--w11-scrollbar-thumb-hover, var(--w11-scrollbar)) 50%,
    color-mix(in srgb, var(--w11-scrollbar) 65%, #000000) 100%
  );
}
.vd-hist-body::-webkit-scrollbar-corner {
  background: var(--w11-scrollbar-track);
}
.vd-hist-loading {
  color: var(--w11-muted);
  padding: 24px 0;
  text-align: center;
}
.vd-hist-head {
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--w11-stroke);
}
.vd-hist-head-top {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.vd-hist-head-top .vd-row-carrier-ico {
  width: 22px;
  height: 22px;
  margin-top: 2px;
}
.vd-hist-kicker {
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--w11-muted);
  margin-bottom: 2px;
}
.vd-hist-title {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 650;
  letter-spacing: 0.01em;
}
.vd-hist-sub {
  margin: 8px 0 0;
  color: var(--w11-muted);
  font-size: 0.86rem;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 0;
}
.vd-hist-sep {
  margin: 0 6px;
  opacity: 0.55;
}
.vd-hist-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
}
.vd-hist-item {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 12px;
  align-items: stretch;
}
.vd-hist-rail {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 12px;
}
.vd-hist-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--w11-accent);
  border: 2px solid var(--w11-win-body);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--w11-accent) 45%, transparent);
  z-index: 1;
}
.vd-hist-line {
  flex: 1;
  width: 2px;
  margin-top: 4px;
  background: color-mix(in srgb, var(--w11-stroke) 85%, transparent);
  min-height: 18px;
}
.vd-hist-item.is-current .vd-hist-dot {
  background: color-mix(in srgb, #107c10 70%, var(--w11-accent));
  box-shadow: 0 0 0 2px color-mix(in srgb, #107c10 35%, transparent);
}
.vd-hist-item.is-current .vd-hist-card {
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
}
.vd-hist-card {
  background: var(--w11-window-bg);
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  padding: 11px 13px;
  margin-bottom: 12px;
}
.vd-hist-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: baseline;
  margin-bottom: 5px;
  font-size: 0.78rem;
  color: var(--w11-muted);
}
.vd-hist-src {
  display: inline-flex;
  padding: 1px 7px;
  border-radius: 999px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
  color: var(--w11-text);
  font-size: 0.72rem;
}
.vd-hist-event {
  font-weight: 650;
  font-size: 0.95rem;
}
.vd-hist-detail,
.vd-hist-loc,
.vd-hist-raw {
  margin-top: 3px;
  font-size: 0.8rem;
  color: var(--w11-muted);
}
.vd-hist-raw {
  font-style: italic;
  opacity: 0.9;
}
.vd-hist-empty {
  color: var(--w11-muted);
  padding: 20px 0;
  text-align: center;
}
.vd-carrier-tabs {
  display: flex;
  gap: 6px;
  align-items: flex-end;
  height: 40px;
}
.vd-row-carrier-ico {
  width: 16px;
  height: 16px;
  object-fit: contain;
  flex-shrink: 0;
  display: block;
}
.vd-row-carrier-ico-dhl {
  border-radius: 50%;
  background: #ffcc00;
}
.vd-td-tn .vd-cell {
  gap: 8px;
}
.vd-tn-row {
  display: grid;
  grid-template-columns: 16px 18ch auto 26px;
  align-items: center;
  column-gap: 8px;
  min-width: 0;
  width: 100%;
}
.vd-tn-row .vd-row-carrier-ico {
  grid-column: 1;
  justify-self: start;
}
.vd-tn-slot {
  grid-column: 2;
  min-width: 18ch;
  max-width: 18ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: ui-monospace, Consolas, monospace;
  font-size: 0.8rem;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.vd-tn-placeholder {
  color: color-mix(in srgb, var(--w11-muted) 55%, transparent);
  user-select: none;
  letter-spacing: -0.02em;
}
.vd-track-link.vd-tn-slot {
  color: var(--w11-accent);
  text-decoration: none;
}
.vd-track-link.vd-tn-slot:hover {
  text-decoration: underline;
}
.vd-jtl-slot {
  grid-column: 3;
  justify-self: start;
  min-width: 2.75rem;
  text-align: center;
}
.vd-jtl-slot-empty {
  display: inline-block;
  height: 1.15rem;
  visibility: hidden;
}
.vd-tn-row .vd-copy-btn {
  grid-column: 4;
  justify-self: end;
}
.vd-progress-act {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  min-height: 30px;
  padding: 0 4px;
  color: var(--w11-muted);
  font-size: 0.82rem;
  line-height: 1.2;
}
.vd-progress-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--w11-accent);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--w11-accent) 45%, transparent);
  animation: vd-progress-pulse 1.2s ease-in-out infinite;
}
.vd-progress-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@keyframes vd-progress-pulse {
  0%,
  100% {
    opacity: 0.55;
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--w11-accent) 35%, transparent);
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--w11-accent) 0%, transparent);
  }
}
.vd-status-carriers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}
.vd-status-carrier {
  margin: 0;
  padding: 10px 12px;
  min-width: 0;
}
.vd-status-carrier-h {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 0.92rem;
}
.vd-status-carrier-h .vd-row-carrier-ico {
  width: 18px;
  height: 18px;
}
.vd-status-overview {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 14px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
  color: var(--w11-text);
  font-size: 0.86rem;
  line-height: 1.35;
}
.vd-status-overview-kicker {
  color: var(--w11-muted);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  flex-shrink: 0;
}
.vd-status-overview-text {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  min-width: 0;
}
.vd-row-carrier-ico-gls,
.vd-carrier-logo-gls {
  object-fit: contain;
  border-radius: 2px;
  background: #000;
}
.vd-carrier-logo-gls {
  width: 22px;
  height: 14px;
}
.vd-carrier-tab {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  min-width: 112px;
  height: 40px;
  padding: 0 15px;
  border: 1px solid color-mix(in srgb, var(--w11-stroke) 82%, transparent);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: color-mix(in srgb, var(--w11-window-bg) 42%, transparent);
  color: var(--w11-muted);
  font: inherit;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
  position: relative;
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent);
}
.vd-carrier-tab:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-highlight) 35%, var(--w11-window-bg));
  border-color: color-mix(in srgb, var(--w11-accent) 28%, var(--w11-stroke));
}
.vd-carrier-tab.active {
  color: var(--w11-text);
  background: var(--w11-window-bg);
  border-color: var(--w11-stroke);
  box-shadow:
    0 1px 0 var(--w11-window-bg),
    inset 0 2px 0 var(--w11-accent),
    inset 0 1px 0 color-mix(in srgb, #fff 10%, transparent);
  z-index: 1;
}
.vd-carrier-ico {
  font-size: 1rem;
  line-height: 1;
}
.vd-carrier-logo {
  width: 18px;
  height: 18px;
  object-fit: contain;
  display: block;
  flex-shrink: 0;
}
.vd-carrier-logo-dhl {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffcc00;
}
.vd-carrier-name {
  line-height: 1;
}
.vd-sandbox-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  margin-left: 2px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1;
  color: #5c3d00;
  background: color-mix(in srgb, #f5b846 78%, var(--w11-window-bg));
  border: 1px solid color-mix(in srgb, #c9891a 55%, var(--w11-stroke));
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 35%, transparent);
  flex-shrink: 0;
}
.vd-carrier-tab.is-sandbox:not(.active) .vd-sandbox-badge {
  background: color-mix(in srgb, #f5b846 55%, var(--w11-titlebar));
}
.vd-subbar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 10px;
  background: var(--w11-window-bg);
  border-bottom: 1px solid var(--w11-stroke);
  min-height: 42px;
}
.vd-subtabs {
  display: flex;
  gap: 2px;
  flex: 1;
  min-width: 0;
  overflow-x: auto;
}
.vd-subtab {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--w11-muted);
  padding: 10px 14px;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 600;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
}
.vd-subtab:hover {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-highlight) 22%, transparent);
}
.vd-subtab.active {
  color: var(--w11-text);
  border-bottom-color: var(--w11-accent);
}
.vd-settings-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.vd-subbar-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
  padding: 6px 0;
}
.vd-ghost-btn {
  background: color-mix(in srgb, var(--w11-text) 5%, var(--w11-window-bg)) !important;
  color: var(--w11-text) !important;
  border: 1px solid var(--w11-stroke) !important;
}
.vd-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 12px;
  background: var(--w11-win-body);
}
.vd-statusbar {
  display: none !important;
  flex-shrink: 0;
  padding: 6px 12px;
  border-top: 1px solid var(--w11-stroke);
  background: var(--w11-titlebar);
  color: var(--w11-muted);
  font-size: 12px;
}
.vd-table-wrap {
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  overflow: auto;
  background: var(--w11-window-bg);
  box-shadow: 0 8px 24px color-mix(in srgb, #000 6%, transparent);
  max-height: 100%;
}
.vd-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}
.vd-table th,
.vd-table td {
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid var(--w11-stroke);
  color: var(--w11-text);
  vertical-align: middle;
}
.vd-open-table td.vd-td,
.vd-arch-table td.vd-td {
  padding: 6px 10px;
}
.vd-open-table td.vd-col-acts,
.vd-arch-table td.vd-col-acts {
  padding: 6px 8px;
}
.vd-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--w11-titlebar);
  color: var(--w11-muted);
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.vd-table tbody tr:hover td {
  background: color-mix(in srgb, var(--w11-highlight) 20%, var(--w11-window-bg));
}
.vd-row-void td {
  opacity: 0.55;
}
.vd-col-acts {
  white-space: nowrap;
  text-align: center;
  width: 1%;
  vertical-align: middle;
}
.vd-col-acts .win-sheet-btn {
  margin-left: 4px;
}
.vd-act-row {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}
.vd-ico-group {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 2px;
  flex-wrap: nowrap;
}
.vd-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--w11-muted);
  cursor: pointer;
  flex: 0 0 auto;
  line-height: 0;
}
.vd-icon-btn:hover:not(:disabled) {
  color: var(--w11-text);
  background: color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg));
  border-color: var(--w11-stroke);
}
.vd-icon-btn:disabled {
  opacity: 0.32;
  cursor: default;
}
.vd-icon-btn-lg {
  width: 34px;
  height: 34px;
}
.vd-icon-danger:hover:not(:disabled) {
  color: #c42b1c;
  background: color-mix(in srgb, #c42b1c 12%, var(--w11-window-bg));
  border-color: color-mix(in srgb, #c42b1c 35%, var(--w11-stroke));
}
.vd-ico {
  display: block;
}
.vd-td {
  overflow: hidden;
  vertical-align: middle;
}
.vd-cell {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
}
.vd-cell-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.vd-cell-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--w11-text);
}
.vd-td-order .vd-cell-text {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.vd-td-tn .vd-cell-text,
.vd-track-link {
  font-family: ui-monospace, Consolas, monospace;
  font-size: 0.8rem;
  letter-spacing: -0.02em;
}
.vd-track-link {
  color: var(--w11-accent);
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.vd-track-link:hover {
  text-decoration: underline;
}
.vd-td-order .vd-copy-btn,
.vd-td-name .vd-copy-btn,
.vd-td-tn .vd-copy-btn,
.vd-td-place .vd-copy-btn {
  width: 26px;
  height: 26px;
  opacity: 0;
  flex-shrink: 0;
  transition: opacity 0.12s ease;
}
.vd-open-table tbody tr:hover .vd-td-order .vd-copy-btn,
.vd-open-table tbody tr:hover .vd-td-name .vd-copy-btn,
.vd-open-table tbody tr:hover .vd-td-place .vd-copy-btn,
.vd-arch-table tbody tr:hover .vd-td-order .vd-copy-btn,
.vd-arch-table tbody tr:hover .vd-td-name .vd-copy-btn,
.vd-arch-table tbody tr:hover .vd-td-tn .vd-copy-btn,
.vd-arch-table tbody tr:hover .vd-td-place .vd-copy-btn,
.vd-td-order .vd-copy-btn:focus,
.vd-td-name .vd-copy-btn:focus,
.vd-td-tn .vd-copy-btn:focus,
.vd-td-place .vd-copy-btn:focus {
  opacity: 1;
}
.vd-live-table {
  height: 100%;
  max-height: none;
}
.vd-table-wrap.vd-live-table {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
@keyframes vd-row-enter {
  from {
    opacity: 0;
    transform: translateY(-6px);
    background: color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg));
  }
  to {
    opacity: 1;
    transform: none;
    background: transparent;
  }
}
@keyframes vd-row-flash {
  0% {
    background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg));
  }
  100% {
    background: transparent;
  }
}
.vd-row-enter {
  animation: vd-row-enter 0.45s ease both;
}
.vd-row-flash td {
  animation: vd-row-flash 0.7s ease both;
}
.vd-app[data-width="sm"] .vd-hide-sm,
.vd-app[data-width="sm"] .vd-hide-md {
  display: none !important;
}
.vd-app[data-width="md"] .vd-hide-md {
  display: none !important;
}
.vd-carrier-logo-dhl {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  background: #ffcc00;
}
.vd-tpl-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.vd-tpl-head-acts {
  display: inline-flex;
  gap: 4px;
}
.vd-tpl-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 10px;
}
.vd-tpl-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-titlebar) 55%, var(--w11-window-bg));
}
.vd-tpl-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.vd-tpl-main strong {
  color: var(--w11-text);
  font-size: 0.9rem;
  font-weight: 650;
}
.vd-tpl-actions {
  display: inline-flex;
  gap: 4px;
  flex-shrink: 0;
}
.vd-tpl-add-menu {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 8px;
  padding: 6px;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
}
.vd-tpl-add-item {
  appearance: none;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--w11-text);
  padding: 8px 10px;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
}
.vd-tpl-add-item:hover {
  background: color-mix(in srgb, var(--w11-highlight) 40%, transparent);
}
.vd-modal-backdrop {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: color-mix(in srgb, #000 35%, transparent);
}
.vd-modal {
  width: min(420px, 100%);
  max-height: min(90%, 560px);
  overflow: auto;
  border-radius: 12px;
  border: 1px solid var(--w11-win-border);
  background: var(--w11-win-body);
  color: var(--w11-text);
  box-shadow: 0 12px 40px color-mix(in srgb, #000 28%, transparent);
  padding: 14px 16px 16px;
}
.vd-modal-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--w11-stroke);
}
.vd-modal .vd-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 10px;
}
.vd-market-page {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.vd-market-table-wrap {
  overflow: auto;
}
.vd-market-table td,
.vd-market-table th {
  vertical-align: middle;
}
.vd-app[data-width="sm"] .vd-carrier-tab {
  min-width: 0;
  height: 40px;
  padding: 0 10px;
}
.vd-app[data-width="sm"] .vd-subtab {
  padding: 10px 10px;
  font-size: 0.8rem;
}
.vd-app[data-width="sm"] .vd-body {
  padding: 8px;
}
.vd-app[data-width="sm"] .vd-ico-group .vd-icon-btn {
  width: 28px;
  height: 28px;
}
.vd-status-page {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 100%;
  animation: vd-row-enter 0.35s ease both;
}
.vd-status-hero {
  display: none;
  padding: 16px 18px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 14%, var(--w11-window-bg)),
      color-mix(in srgb, var(--w11-titlebar) 65%, var(--w11-window-bg))
    );
}
.vd-status-kicker {
  color: var(--w11-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.vd-status-title {
  margin: 4px 0 2px;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--w11-text);
  letter-spacing: -0.02em;
}
.vd-status-lead {
  margin: 0;
  color: var(--w11-muted);
  font-size: 0.86rem;
}
.vd-status-grid-live {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 0;
}
.vd-status-carrier .vd-stat-card {
  padding: 8px 10px;
}
.vd-status-carrier .vd-stat-value {
  margin-top: 2px;
  font-size: 1.25rem;
}
.vd-status-carrier .vd-volume-grid {
  gap: 6px;
  margin-top: 8px;
}
.vd-status-carrier .vd-volume-card {
  padding: 8px 10px;
}
.vd-status-carrier .vd-stat-value-sm {
  font-size: 1.05rem;
}
.vd-stat-hint {
  display: none;
  margin-top: 4px;
  color: var(--w11-muted);
  font-size: 0.75rem;
}
.vd-stat-open {
  background: color-mix(in srgb, var(--w11-accent) 8%, var(--w11-window-bg));
}
.vd-stat-ship {
  background: color-mix(in srgb, #c9891a 10%, var(--w11-window-bg));
}
.vd-stat-done {
  background: color-mix(in srgb, #107c10 10%, var(--w11-window-bg));
}
.vd-stats-panel {
  margin-bottom: 0;
}
.vd-volume-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.vd-volume-card {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-win-body) 70%, var(--w11-window-bg));
}
.vd-volume-current {
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke));
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
}
.vd-stat-value-sm {
  font-size: 1.35rem;
}
@keyframes vd-stat-pop {
  0% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.08);
    color: var(--w11-accent);
  }
  100% {
    transform: scale(1);
  }
}
.vd-stat-pop {
  animation: vd-stat-pop 0.45s ease;
}
.vd-act-primary {
  border-color: color-mix(in srgb, var(--w11-accent) 45%, var(--w11-stroke)) !important;
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg)) !important;
}
.vd-label-host {
  height: 100%;
  min-height: 0;
  background: var(--w11-win-body);
}
.vd-label-shell {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px 18px 14px;
  box-sizing: border-box;
  background:
    radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--w11-accent) 10%, transparent), transparent 55%),
    var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.vd-label-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-shrink: 0;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 12%, var(--w11-window-bg)),
      color-mix(in srgb, var(--w11-titlebar) 70%, var(--w11-window-bg))
    );
}
.vd-label-hero-main {
  min-width: 0;
  flex: 1 1 auto;
}
.vd-label-kicker {
  color: var(--w11-muted);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.vd-label-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 650;
  color: var(--w11-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.vd-label-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.vd-label-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-top: 2px;
}
.vd-label-print {
  background: color-mix(in srgb, var(--w11-accent) 16%, var(--w11-window-bg)) !important;
  border-color: color-mix(in srgb, var(--w11-accent) 40%, var(--w11-stroke)) !important;
  color: var(--w11-accent) !important;
}
.vd-label-stage {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
}
.vd-label-frame {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-window-bg);
  box-shadow: 0 10px 28px color-mix(in srgb, #000 7%, transparent);
  overflow: hidden;
  position: relative;
  padding: 10px;
}
.vd-label-frame-el {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}
.vd-label-img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  margin: 0 auto;
  background: #fff;
  box-shadow: 0 2px 14px color-mix(in srgb, #000 14%, transparent);
}
.vd-label-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--w11-muted);
  font-size: 0.92rem;
  background: var(--w11-window-bg);
}
.vd-label-shell {
  overflow: hidden;
}
.vd-label-stage {
  overflow: hidden;
}
.vd-td-place .vd-cell-text {
  font-variant-numeric: tabular-nums;
  color: var(--w11-muted);
  font-size: 0.82rem;
}
.vd-pill-muted {
  background: color-mix(in srgb, var(--w11-muted) 12%, var(--w11-window-bg));
  color: var(--w11-muted);
  border-color: color-mix(in srgb, var(--w11-muted) 35%, var(--w11-stroke));
}
/* In Zustellung – Amber/Orange (klar getrennt von Blau/Grün) */
.vd-pill-info {
  background: color-mix(in srgb, #d83b01 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #d83b01 72%, var(--w11-text));
  border-color: color-mix(in srgb, #d83b01 42%, var(--w11-stroke));
  font-weight: 600;
}
/* Unterwegs / Versendet – klares Blau */
.vd-pill-transit {
  background: color-mix(in srgb, #0078d4 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #0078d4 78%, var(--w11-text));
  border-color: color-mix(in srgb, #0078d4 45%, var(--w11-stroke));
  font-weight: 600;
}
.vd-muted {
  color: var(--w11-muted);
  font-size: 0.78rem;
  margin-top: 2px;
}
.vd-pill {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-accent) 10%, var(--w11-window-bg));
  color: var(--w11-text);
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vd-pill-warn {
  background: color-mix(in srgb, #c42b1c 16%, var(--w11-window-bg));
  color: color-mix(in srgb, #c42b1c 75%, var(--w11-text));
  border-color: color-mix(in srgb, #c42b1c 42%, var(--w11-stroke));
  font-weight: 600;
}
/* Zugestellt – kräftiges Grün, klar von Blau unterscheidbar */
.vd-pill-ok {
  background: color-mix(in srgb, #0b6a0b 18%, var(--w11-window-bg));
  color: color-mix(in srgb, #0b6a0b 82%, var(--w11-text));
  border-color: color-mix(in srgb, #0b6a0b 48%, var(--w11-stroke));
  font-weight: 600;
}
.vd-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 280px;
  padding: 32px 20px;
  text-align: center;
  color: var(--w11-muted);
  border: 1px dashed var(--w11-stroke);
  border-radius: 12px;
  background: color-mix(in srgb, var(--w11-window-bg) 80%, transparent);
}
.vd-empty strong {
  color: var(--w11-text);
  font-size: 1rem;
}
.vd-empty p {
  margin: 0;
  max-width: 420px;
  line-height: 1.45;
}
.vd-empty-ico {
  font-size: 1.8rem;
  margin-bottom: 4px;
  opacity: 0.85;
}
.vd-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.vd-stat-card {
  padding: 14px 16px;
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  box-shadow: 0 4px 14px color-mix(in srgb, #000 5%, transparent);
}
.vd-stat-wide {
  grid-column: 1 / -1;
}
.vd-stat-label {
  color: var(--w11-muted);
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.vd-stat-value {
  margin-top: 6px;
  font-size: 1.7rem;
  font-weight: 700;
  color: var(--w11-text);
  letter-spacing: -0.02em;
}
.vd-stat-path {
  margin-top: 8px;
  font-family: ui-monospace, Consolas, monospace;
  font-size: 0.8rem;
  word-break: break-all;
  color: var(--w11-text);
}
.vd-panel {
  border: 1px solid var(--w11-stroke);
  border-radius: 10px;
  background: var(--w11-window-bg);
  padding: 14px 16px;
  margin-bottom: 12px;
  box-shadow: 0 4px 14px color-mix(in srgb, #000 5%, transparent);
}
.vd-panel-h {
  font-weight: 650;
  margin-bottom: 12px;
  color: var(--w11-text);
  font-size: 0.92rem;
}
.vd-track-list {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}
.vd-track-row {
  display: grid;
  grid-template-columns: minmax(140px, 1.2fr) 0.8fr 1fr;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-win-body) 70%, var(--w11-window-bg));
  font-size: 0.82rem;
}
.vd-settings {
  max-width: 720px;
  display: grid;
  gap: 0;
}
.vd-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) 72px;
  gap: 10px 12px;
  align-items: end;
}
.vd-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.vd-field > span {
  color: var(--w11-muted);
  font-size: 0.75rem;
  font-weight: 600;
}
.vd-field-country {
  min-width: 0;
}
.vd-span-2 {
  grid-column: 1 / -1;
}
.vd-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  background: var(--w11-win-body) !important;
  color: var(--w11-text) !important;
  border: 1px solid var(--w11-stroke) !important;
  padding: 7px 9px !important;
  border-radius: 6px;
}
.vd-autosave-hint {
  margin: 12px 0 0;
  color: var(--w11-muted);
  font-size: 0.78rem;
}
.vd-jtl-host,
.vd-jtl-shell {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--w11-win-body);
  color: var(--w11-text);
  overflow: hidden;
}
.vd-jtl-app {
  padding: 16px 18px 24px;
  max-width: 860px;
  margin: 0 auto;
}
.vd-jtl-app.vd-jtl-compact {
  padding: 14px 16px 16px;
  max-width: none;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}
.vd-jtl-compact .vd-jtl-hero {
  padding: 12px 14px;
  margin-bottom: 10px;
}
.vd-jtl-compact .vd-jtl-hero h1 {
  font-size: 1.15rem;
  margin: 8px 0 4px;
}
.vd-jtl-compact .vd-jtl-hero p {
  font-size: 0.86rem;
}
.vd-jtl-compact .vd-jtl-actions {
  margin-bottom: 10px;
}
.vd-jtl-compact .vd-panel {
  margin-bottom: 0;
  padding: 12px 14px;
}
.vd-jtl-compact .vd-jtl-steps {
  font-size: 0.82rem;
  line-height: 1.4;
}
.vd-jtl-compact .vd-jtl-steps li {
  margin-bottom: 4px;
}
.vd-jtl-hero {
  padding: 18px 20px;
  margin-bottom: 14px;
  border-radius: 12px;
  border: 1px solid var(--w11-stroke);
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--w11-accent) 18%, var(--w11-window-bg)),
      var(--w11-window-bg) 55%
    );
  box-shadow: 0 10px 28px color-mix(in srgb, #000 7%, transparent);
}
.vd-jtl-badge {
  display: inline-flex;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid var(--w11-stroke);
  background: color-mix(in srgb, var(--w11-window-bg) 80%, #fff);
  color: var(--w11-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.vd-jtl-hero h1 {
  margin: 10px 0 6px;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--w11-text);
  letter-spacing: -0.02em;
}
.vd-jtl-hero p {
  margin: 0;
  color: var(--w11-muted);
  line-height: 1.45;
  max-width: 52ch;
}
.vd-jtl-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.vd-jtl-primary {
  background: color-mix(in srgb, var(--w11-accent) 22%, var(--w11-window-bg)) !important;
  border-color: color-mix(in srgb, var(--w11-accent) 50%, var(--w11-stroke)) !important;
  font-weight: 600 !important;
}
.vd-jtl-steps {
  margin: 0;
  padding-left: 1.2rem;
  color: var(--w11-text);
  line-height: 1.55;
  font-size: 0.88rem;
}
.vd-jtl-steps li {
  margin-bottom: 6px;
}
.vd-jtl-path {
  margin-top: 12px;
  display: grid;
  gap: 4px;
}
.vd-jtl-path span {
  color: var(--w11-muted);
  font-size: 0.75rem;
  font-weight: 600;
}
.vd-jtl-path code {
  display: block;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-size: 0.8rem;
  word-break: break-all;
}
.vd-jtl-code {
  margin: 0 0 10px;
  padding: 12px;
  max-height: 280px;
  overflow: auto;
  border-radius: 8px;
  border: 1px solid var(--w11-stroke);
  background: var(--w11-win-body);
  color: var(--w11-text);
  font-size: 0.72rem;
  line-height: 1.4;
  white-space: pre-wrap;
  word-break: break-word;
}
.vd-jtl-loading {
  padding: 28px;
  color: var(--w11-muted);
}
@media (max-width: 720px) {
  .vd-form-grid {
    grid-template-columns: 1fr 1fr;
  }
  .vd-field-country {
    grid-column: 1 / -1;
  }
  .vd-status-grid,
  .vd-status-grid-live,
  .vd-volume-grid,
  .vd-status-carriers {
    grid-template-columns: 1fr;
  }
  .vd-track-row {
    grid-template-columns: 1fr;
  }
}
.vd-app[data-width="sm"] .vd-status-grid-live,
.vd-app[data-width="sm"] .vd-volume-grid,
.vd-app[data-width="sm"] .vd-status-carriers {
  grid-template-columns: 1fr;
}
.vd-app[data-width="md"] .vd-status-carriers {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.vd-app[data-width="md"] .vd-volume-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}