html{--bb-bg: #FFFFFF;--bb-bg-alt: #F7F9FC;--bb-bg-subtle: #F1F4F9;--bb-border: #E4E8EF;--bb-border-strong: #D1D7E0;--bb-border-blue: #D6E4F4;--bb-text: #0F1729;--bb-text-soft: #4A5567;--bb-text-muted: #7A8597;--bb-primary: #1E5AA8;--bb-primary-dark: #154277;--bb-primary-light: #E8F0FA;--bb-primary-soft: #F4F8FD;--bb-slash: #60A5FA;--bb-success: #1F7A4D;--bb-success-bg: #E6F4EE;--bb-warn: #B8721E;--bb-warn-bg: #FBF1E1;--bb-danger: #B42318;--bb-toast-green: #22C55E;--bb-radius: 8px;--bb-radius-md: 12px;--bb-radius-lg: 16px;--bb-radius-pill: 100px;--bb-shadow-card-hover: 0 1px 2px rgba(15,23,41,.04),0 12px 30px rgba(15,23,41,.08);--bb-shadow-dialog: 0 20px 60px rgba(15,23,41,.18);--bb-focus-ring: 0 0 0 3px rgba(30,90,168,.10);--bb-ease-out: cubic-bezier(0.22,0.61,0.36,1);--bb-ease-spring: cubic-bezier(0.34,1.56,0.64,1);--aura-font-family: "Inter",-apple-system,"Segoe UI",system-ui,sans-serif;--lumo-font-family: "Inter",-apple-system,"Segoe UI",system-ui,sans-serif;--lumo-primary-color: var(--bb-primary);--lumo-primary-text-color: var(--bb-primary);--lumo-primary-color-50pct: rgba(30,90,168,0.5);--lumo-primary-color-10pct: rgba(30,90,168,0.1);--lumo-border-radius-m: var(--bb-radius);background: var(--bb-bg-alt);color: var(--bb-text)}body{margin: 0;background: var(--bb-bg-alt);-webkit-font-smoothing: antialiased;text-rendering: optimizeLegibility}.bb-eyebrow{display: inline-block;font-size: 0.78rem;font-weight: 600;letter-spacing: 0.12em;text-transform: uppercase;color: var(--bb-primary)}.bb-seiten-titel{font-size: 1.7rem;font-weight: 700;letter-spacing: -0.02em;margin: 8px 0 0;line-height: 1.2}.bb-seiten-untertitel{font-size: 0.95rem;line-height: 1.6;color: var(--bb-text-soft);margin: 10px 0 0}.bb-meta{font-size: 0.82rem;color: var(--bb-text-muted)}.bb-beschreibung{color: var(--bb-text-soft);line-height: 1.65;max-width: 760px;white-space: pre-line}.bb-seite{width: 100%;max-width: 1280px;margin: 0 auto;padding: 36px 32px 96px;box-sizing: border-box}.bb-seite-schmal{max-width: 900px}.bb-seite-builder{max-width: 860px}.bb-seiten-kopf{display: flex;align-items: flex-end;justify-content: space-between;gap: 24px;flex-wrap: wrap;margin-bottom: 26px;width: 100%;box-sizing: border-box}.bb-kopfzeile{padding: 10px 24px;background: rgba(255,255,255,0.92);backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);border-bottom: 1px solid var(--bb-border)}.bb-kopf-titelblock{display: flex;flex-direction: column;gap: 1px}.bb-kopf-titel{font-size: 1.05rem;font-weight: 700;letter-spacing: -0.01em;line-height: 1.2}.bb-kopf-untertitel{font-size: 0.68rem;color: var(--bb-text-muted);letter-spacing: 0.04em;line-height: 1}.bb-logo-hover{transition: transform 0.4s var(--bb-ease-spring)}.bb-logo-hover:hover{transform: rotate(-8deg) scale(1.08)}.bb-nav{display: flex;gap: 2px;margin-left: 28px}.bb-nav-link{display: inline-flex;align-items: center;height: 42px;padding: 0 16px;border-bottom: 2px solid transparent;color: var(--bb-text-soft);text-decoration: none;font-size: 0.9rem;font-weight: 600;transition: color 0.15s,border-color 0.15s}.bb-nav-link:hover{color: var(--bb-primary)}.bb-nav-link.bb-nav-aktiv{color: var(--bb-primary);border-bottom-color: var(--bb-primary)}vaadin-button.bb-btn-primary{position: relative;overflow: hidden;background: var(--bb-primary) !important;color: white !important;border: 1px solid var(--bb-primary) !important;border-radius: var(--bb-radius) !important;font-weight: 600;height: 42px;cursor: pointer;box-shadow: 0 1px 2px rgba(15,23,41,.04);transition: background 0.15s,border-color 0.15s,transform 0.1s}vaadin-button.bb-btn-primary:hover{background: var(--bb-primary-dark) !important;border-color: var(--bb-primary-dark) !important}vaadin-button.bb-btn-primary:active{transform: translateY(1px)}vaadin-button.bb-btn-primary::part(label){color: white;font-weight: 600}vaadin-button.bb-btn-primary::after{content: "";position: absolute;top: 0;bottom: 0;left: -60%;width: 40%;background: rgba(255,255,255,0.18);transform: skewX(-20deg);transition: left 0.5s var(--bb-ease-out);pointer-events: none}vaadin-button.bb-btn-primary:hover::after{left: 130%}vaadin-button.bb-btn-gross{height: 50px;padding: 0 28px;font-size: 1rem}vaadin-button.bb-btn-secondary{background: white !important;color: var(--bb-text) !important;border: 1px solid var(--bb-border-strong) !important;border-radius: var(--bb-radius) !important;font-weight: 600 !important;height: 42px;cursor: pointer;transition: background 0.15s,border-color 0.15s,transform 0.1s}vaadin-button.bb-btn-secondary:hover{background: var(--bb-bg-alt) !important;border-color: var(--bb-text-muted) !important}vaadin-button.bb-btn-secondary:active{transform: translateY(1px)}vaadin-button.bb-btn-secondary::part(label){color: inherit}vaadin-button.bb-btn-ghost{background: transparent !important;color: var(--bb-text-soft) !important;border: 1px solid var(--bb-border-strong) !important;border-radius: var(--bb-radius) !important;font-weight: 500 !important;height: 42px;cursor: pointer;transition: all 0.15s}vaadin-button.bb-btn-ghost:hover{background: var(--bb-bg-alt) !important;color: var(--bb-text) !important}vaadin-button.bb-btn-ghost::part(label){color: inherit}vaadin-text-field.bb-input,vaadin-text-area.bb-input,vaadin-select.bb-input,vaadin-combo-box.bb-input,vaadin-email-field.bb-input,vaadin-date-picker.bb-input{--vaadin-input-field-background: var(--bb-primary-soft);--vaadin-input-field-border-color: var(--bb-border-strong);--vaadin-input-field-value-color: var(--bb-text);--vaadin-input-field-label-color: var(--bb-text);--vaadin-input-field-placeholder-color: var(--bb-text-muted);--vaadin-input-field-border-radius: 8px}.bb-pille{display: inline-flex;align-items: center;font-size: 0.7rem;font-weight: 600;padding: 3px 9px;border-radius: var(--bb-radius-pill);white-space: nowrap;line-height: 1.5}.bb-pille-neu{background: var(--bb-primary-light);color: var(--bb-primary)}.bb-pille-arbeit{background: var(--bb-warn-bg);color: var(--bb-warn)}.bb-pille-wartet{background: var(--bb-bg-subtle);color: var(--bb-text-soft)}.bb-pille-erledigt{background: var(--bb-success-bg);color: var(--bb-success)}.bb-pille-offen{background: var(--bb-warn-bg);color: var(--bb-warn)}.bb-pille-grau{background: var(--bb-bg-subtle);color: var(--bb-text-muted)}.bb-pille-gruen{background: var(--bb-success-bg);color: var(--bb-success)}.bb-tag{display: inline-flex;align-items: center;font-size: 0.75rem;font-weight: 500;padding: 4px 10px;border-radius: var(--bb-radius-pill);background: var(--bb-bg-alt);border: 1px solid var(--bb-border);color: var(--bb-text-soft);white-space: nowrap}.bb-prio{display: inline-flex;align-items: center;gap: 6px;font-size: 0.82rem;color: var(--bb-text-soft)}.bb-prio-punkt{width: 7px;height: 7px;border-radius: 50%;flex-shrink: 0}.bb-prio-hoch .bb-prio-punkt{background: var(--bb-warn)}.bb-prio-normal .bb-prio-punkt{background: var(--bb-primary)}.bb-prio-niedrig .bb-prio-punkt{background: var(--bb-text-muted)}.bb-rf-hinweis{display: inline-flex;align-items: center;gap: 6px;font-size: 0.8rem;color: var(--bb-warn);font-weight: 600}.bb-rf-hinweis::after{content: "";width: 6px;height: 6px;border-radius: 50%;background: var(--bb-warn)}.bb-kpis{display: grid;grid-template-columns: repeat(4,minmax(120px,150px));gap: 10px}.bb-kpi{background: white;border: 1px solid var(--bb-border);border-radius: var(--bb-radius);padding: 10px 14px}.bb-kpi-label{display: block;font-size: 0.68rem;font-weight: 600;letter-spacing: 0.05em;text-transform: uppercase;color: var(--bb-text-muted);margin-bottom: 2px;white-space: nowrap}.bb-kpi-wert{display: block;font-size: 1.25rem;font-weight: 700;color: var(--bb-text)}.bb-filterzeile{display: flex;gap: 12px;margin-bottom: 16px;align-items: center;flex-wrap: wrap}.bb-chip{height: 32px;padding: 0 14px;border-radius: var(--bb-radius-pill);border: 1px solid var(--bb-border-strong);background: white;color: var(--bb-text-soft);font-family: var(--bb-font,inherit);font-size: 0.8rem;font-weight: 600;cursor: pointer;transition: background 0.15s,color 0.15s,border-color 0.15s}.bb-chip:hover{border-color: var(--bb-primary);color: var(--bb-primary)}.bb-chip.bb-chip-aktiv{background: var(--bb-primary-light);color: var(--bb-primary);border-color: var(--bb-border-blue)}.bb-suche{width: 320px;max-width: 100%}.bb-zaehler{margin-left: auto;font-size: 0.82rem;color: var(--bb-text-muted)}.bb-listenkarte{background: white;border: 1px solid var(--bb-border);border-radius: var(--bb-radius-md);overflow: hidden}.bb-listenkarte-kopf{padding: 14px 20px;border-bottom: 1px solid var(--bb-border);display: flex;justify-content: space-between;align-items: center;gap: 12px}.bb-listenkarte-titel{font-size: 0.78rem;font-weight: 600;letter-spacing: 0.12em;text-transform: uppercase;color: var(--bb-text-muted)}.bb-tab-kopf,.bb-tab-zeile{display: grid;grid-template-columns: var(--bb-spalten);gap: 12px;padding: 12px 20px;align-items: center;border-bottom: 1px solid var(--bb-border)}.bb-tab-kopf{background: var(--bb-bg-alt);font-size: 0.7rem;font-weight: 600;letter-spacing: 0.08em;text-transform: uppercase;color: var(--bb-text-muted)}.bb-tab-zeile{padding: 14px 20px;transition: background 0.15s}.bb-tab-kopf>*,.bb-tab-zeile>*{justify-self: start;align-self: center;min-width: 0}.bb-tab-zeile:last-child{border-bottom: none}.bb-tab-zeile.bb-klickbar{cursor: pointer}.bb-tab-zeile.bb-klickbar:hover{background: var(--bb-primary-soft)}.bb-tab-zeile.bb-zeile-gewaehlt{background: var(--bb-primary-light)}.bb-zelle-nr{font-size: 0.82rem;font-weight: 600;color: var(--bb-primary)}.bb-zelle-haupt{font-size: 0.92rem;font-weight: 500;letter-spacing: -0.01em}.bb-zelle-doppel{display: flex;flex-direction: column;gap: 1px;min-width: 0}.bb-zelle-doppel>:first-child{font-size: 0.85rem}.bb-zelle-doppel>:last-child{font-size: 0.75rem;color: var(--bb-text-muted)}.bb-zelle-datum{font-size: 0.82rem;color: var(--bb-text-muted)}.bb-zelle-text{font-size: 0.88rem;color: var(--bb-text-soft)}.bb-karte{width: 100%;box-sizing: border-box;background: white;border: 1px solid var(--bb-border);border-radius: var(--bb-radius-md);padding: 24px;transition: transform 0.35s var(--bb-ease-out),box-shadow 0.35s var(--bb-ease-out),border-color 0.15s}.bb-karte-hover:hover{transform: translateY(-2px);box-shadow: var(--bb-shadow-card-hover);border-color: var(--bb-border-strong)}.bb-vorschau-karte{width: 100%;box-sizing: border-box;background: white;border: 2px solid var(--bb-border-strong);outline: 1px solid var(--bb-border);border-radius: var(--bb-radius-md);padding: 28px;box-shadow: 0 12px 30px rgba(15,23,41,.06)}.bb-typ-kachel{text-align: left;padding: 14px 16px;border-radius: var(--bb-radius);border: 1px solid var(--bb-border-strong);background: white;cursor: pointer;font-family: inherit;transition: border-color 0.15s,background 0.15s}.bb-typ-kachel:hover{border-color: var(--bb-primary)}.bb-typ-kachel.bb-typ-aktiv{background: var(--bb-primary-soft);border-color: var(--bb-primary)}.bb-typ-kachel .bb-typ-titel{display: block;font-size: 0.9rem;font-weight: 600;margin-bottom: 3px}.bb-typ-kachel.bb-typ-aktiv .bb-typ-titel{color: var(--bb-primary)}.bb-typ-kachel .bb-typ-text{display: block;font-size: 0.78rem;color: var(--bb-text-soft);line-height: 1.45}.bb-antwort-pille{display: inline-flex;align-items: center;padding: 9px 18px;border-radius: var(--bb-radius-pill);border: 1px solid var(--bb-border-strong);background: white;font-size: 0.9rem;font-weight: 500;cursor: pointer;transition: border-color 0.15s,background 0.15s,transform 0.1s}.bb-antwort-pille:hover{border-color: var(--bb-primary);background: var(--bb-primary-soft)}.bb-antwort-pille:active{transform: translateY(1px)}.bb-antwort-pille.bb-gewaehlt{border-color: var(--bb-primary);background: var(--bb-primary-light);color: var(--bb-primary);font-weight: 600}.bb-bild-option{width: 150px;border: 1px solid var(--bb-border-strong);border-radius: var(--bb-radius);overflow: hidden;cursor: pointer;background: white;transition: border-color 0.15s,transform 0.35s var(--bb-ease-out),box-shadow 0.35s}.bb-bild-option:hover{border-color: var(--bb-primary);transform: translateY(-2px);box-shadow: var(--bb-shadow-card-hover)}.bb-bild-option.bb-gewaehlt{border-color: var(--bb-primary);box-shadow: var(--bb-focus-ring)}.bb-bild-option img{width: 100%;height: 92px;object-fit: cover;display: block}.bb-bild-option .bb-option-text{display: block;padding: 8px 10px;font-size: 0.82rem;font-weight: 500}.bb-kontext-badge{display: inline-flex;align-items: center;padding: 4px 12px;border-radius: var(--bb-radius-pill);background: var(--bb-primary-light);border: 1px solid var(--bb-border-blue);color: var(--bb-primary);font-size: 0.75rem;font-weight: 600}.bb-upload-zone vaadin-upload{border: 1px dashed var(--bb-border-strong);border-radius: var(--bb-radius);background: var(--bb-primary-soft);padding: 4px 10px;transition: border-color 0.15s}.bb-upload-zone vaadin-upload:hover{border-color: var(--bb-primary)}vaadin-upload.bb-upload-anhang-wrap{border: none;padding: 0;background: transparent;box-shadow: none;width: 100%}vaadin-upload.bb-upload-anhang-wrap>[slot="drop-label"],vaadin-upload.bb-upload-anhang-wrap>[slot="drop-label-icon"]{display: none}.bb-upload-anhang{display: flex;align-items: center;gap: 12px;width: 100%;box-sizing: border-box;padding: 14px 16px;border: 1px dashed var(--bb-border-strong);border-radius: var(--bb-radius);background: var(--bb-primary-soft);color: var(--bb-text-soft);font-size: 0.88rem;cursor: pointer;transition: border-color 0.15s}.bb-upload-anhang:hover{border-color: var(--bb-primary)}.bb-upload-anhang vaadin-icon,.bb-upload-anhang .v-icon{width: 16px;height: 16px;color: var(--bb-primary)}.bb-dialog-infos{display: flex;flex-wrap: wrap;justify-content: space-between;gap: 10px 28px;margin: 10px 0 22px;padding: 14px 16px;width: 100%;box-sizing: border-box;background: var(--bb-primary-soft);border: 1px solid var(--bb-border);border-radius: var(--bb-radius)}.bb-dialog-info-feld{display: flex;flex-direction: column;gap: 2px;min-width: 0}.bb-dialog-info-label{font-size: 0.7rem;font-weight: 600;letter-spacing: 0.06em;text-transform: uppercase;color: var(--bb-text-muted)}.bb-dialog-info-wert{font-size: 0.9rem;font-weight: 500;color: var(--bb-text)}.bb-ticket-dialog::part(content){padding: 34px 36px}.bb-ticket-dialog vaadin-select{width: 100%}.bb-dialog-kopf{display: flex;justify-content: space-between;align-items: flex-start;margin-bottom: 6px}.bb-dialog-schliessen{width: 30px;height: 30px;border-radius: 8px;border: none;background: transparent;color: var(--bb-text-muted);font-size: 0.95rem;cursor: pointer;transition: background 0.15s,color 0.15s;flex-shrink: 0}.bb-dialog-schliessen:hover{background: var(--bb-bg-subtle);color: var(--bb-text)}vaadin-dialog-overlay::part(overlay){background: white;border: 1px solid var(--bb-border);border-radius: var(--bb-radius-lg);box-shadow: var(--bb-shadow-dialog);color: var(--bb-text);animation: bb-dialog-auf 0.25s var(--bb-ease-out)}vaadin-dialog-overlay::part(backdrop){background: rgba(15,23,41,0.45);backdrop-filter: blur(4px);-webkit-backdrop-filter: blur(4px)}@keyframes bb-dialog-auf{from{opacity: 0;transform: scale(0.98) translateY(6px)}to{opacity: 1;transform: scale(1) translateY(0)}}.bb-toast{display: flex;align-items: flex-start;gap: 12px;background: white;border: 1px solid var(--bb-border);border-left: 5px solid var(--bb-toast-green);border-radius: var(--bb-radius-md);padding: 14px 18px;box-shadow: var(--bb-shadow-card-hover);animation: bb-toast-rein 0.35s var(--bb-ease-out);max-width: 460px}.bb-toast-titel{display: block;font-weight: 700;font-size: 0.95rem;margin-bottom: 2px}.bb-toast-text{display: block;font-size: 0.85rem;color: var(--bb-text-soft);line-height: 1.5}@keyframes bb-toast-rein{from{opacity: 0;transform: translateY(-8px)}to{opacity: 1;transform: translateY(0)}}vaadin-notification-card::part(overlay){background: transparent;box-shadow: none;padding: 0}.bb-kommentar{border-radius: var(--bb-radius-md);padding: 10px 14px;margin-bottom: 8px;max-width: 85%;animation: bb-auftauchen 0.35s var(--bb-ease-out)}.bb-kommentar-brama{background: var(--bb-primary-light);align-self: flex-start}.bb-kommentar-kunde{background: var(--bb-bg-subtle);align-self: flex-end}.bb-kommentar-text{margin: 4px 0 0 0;white-space: pre-line}.bb-datei-link{color: var(--bb-primary);font-size: 0.92rem}.bb-vorschau-bild{max-width: 280px;max-height: 200px;object-fit: contain;border-radius: var(--bb-radius);border: 1px solid var(--bb-border);background: white}@keyframes bb-auftauchen{from{opacity: 0;transform: translateY(14px)}to{opacity: 1;transform: translateY(0)}}.bb-reveal{animation: bb-auftauchen 0.5s var(--bb-ease-out) both}.bb-reveal-2{animation-delay: 0.06s}.bb-reveal-3{animation-delay: 0.12s}.bb-reveal-4{animation-delay: 0.18s}.bb-login-seite{background: var(--bb-bg-alt)}.bb-login-kopf{display: flex;flex-direction: column;align-items: center;gap: 12px}.bb-login-kopf h1{font-size: 1.5rem;letter-spacing: -0.02em;margin: 0}.bb-login-hinweis{color: var(--bb-text-muted);font-size: 0.85rem}.bb-portal{background: var(--bb-bg-alt);min-height: 100vh}.bb-portal-kopfleiste{width: 100%;box-sizing: border-box;padding: 14px 32px;background: white;border-bottom: 1px solid var(--bb-border);display: flex;align-items: center;gap: 12px}.bb-portal-inhalt{width: 100%;max-width: 900px;padding: 40px 32px 72px;box-sizing: border-box}.bb-portal-inhalt h1{font-size: 1.9rem;font-weight: 700;letter-spacing: -0.02em;margin: 10px 0 6px}.bb-portal-fehler{margin-top: 12vh;text-align: center;color: var(--bb-text-soft)}.bb-portal-fuss{margin-top: 40px;font-size: 0.82rem;color: var(--bb-text-muted)}@media (max-width: 1024px){.bb-seite{padding: 28px 24px 72px}.bb-kpis{grid-template-columns: repeat(2,1fr)}.bb-seiten-kopf{align-items: flex-start;flex-direction: column}.bb-nav{margin-left: 12px}.bb-tab-kopf{display: none}.bb-tab-zeile{display: flex !important;flex-wrap: wrap;gap: 6px 10px;padding: 14px 16px}.bb-tab-zeile>*{justify-self: initial}.bb-zelle-nr{order: 1}.bb-zelle-pille{order: 2;margin-left: auto}.bb-zelle-haupt{order: 3;width: 100%;font-size: 0.9rem}.bb-zelle-doppel{order: 4;flex-direction: row;gap: 6px;align-items: baseline}.bb-zelle-neben{order: 4}.bb-zelle-datum{order: 5}.bb-zelle-aktion{order: 6;width: 100%}}@media (max-width: 640px){.bb-seite,.bb-portal-inhalt{padding: 20px 16px 56px}.bb-portal-kopfleiste{padding: 12px 16px}.bb-kopfzeile{padding: 8px 12px;flex-wrap: wrap;justify-content: space-between;row-gap: 6px}.bb-nav{order: 3;width: 100%;margin-left: 0;gap: 0;overflow-x: auto;-webkit-overflow-scrolling: touch}.bb-nav-link{padding: 0 10px;font-size: 0.85rem;white-space: nowrap;height: 38px}.bb-kpis{grid-template-columns: repeat(2,1fr);width: 100%}.bb-suche{width: 100%}.bb-zaehler{margin-left: 0;width: 100%}.bb-tab-zeile{padding: 13px 14px}.bb-zelle-haupt{font-size: 0.88rem}.bb-zelle-neben{display: none}vaadin-dialog-overlay::part(overlay){max-width: calc(100vw - 24px)}}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;transition-duration: 0.01ms !important}}