:root {
  --bg: #f5f3ec;
  --surface: #ffffff;
  --surface-soft: #fbfaf5;
  --text: #1f2933;
  --muted: #64748b;
  --border: #ddd7c8;
  --accent: #146666;
  --accent-dark: #0d4b4b;
  --accent-deep: #0a3333;
  --accent-soft: #effaf4;
  --gold: #d5b45f;
  --gold-soft: #f2df91;
  --success: #0b7046;
  --success-bg: #e1f6eb;
  --danger: #9c3030;
  --danger-bg: #fbeaea;
  --warning: #765309;
  --warning-bg: #fff8dc;
  --shadow: 0 12px 34px rgba(10, 51, 51, .10);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); }
button, input { font: inherit; }
button, .button-link {
  border: 1px solid var(--accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color: white;
  border-radius: 8px;
  padding: .72rem 1rem;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: .15s ease;
}
button:hover, .button-link:hover { background: linear-gradient(135deg, #1b7f7f, var(--accent-dark)); border-color: var(--accent-deep); }
button.secondary, .button-link.secondary { background: white; color: var(--accent-deep); border-color: #b6a66f; }
button.secondary:hover, .button-link.secondary:hover { background: #fff8df; border-color: var(--gold); }
.disabled { opacity: .45; pointer-events: none; }
.topbar {
  padding: 2rem max(2rem, calc((100vw - 1520px) / 2));
  background: linear-gradient(125deg, var(--accent-deep), var(--accent-dark) 58%, #117272);
  color: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}
.eyebrow, .step { text-transform: uppercase; letter-spacing: .12em; font-size: .72rem; font-weight: 800; }
.topbar h1 { margin: .35rem 0; font-size: clamp(1.8rem, 3vw, 2.55rem); }
.topbar p { margin: 0; color: #fff7d6; }
.topbar-actions { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; justify-content: flex-end; }
.status-badge { border: 1px solid rgba(242,223,145,.72); background: rgba(255,255,255,.08); color: #fff8dc; border-radius: 999px; padding: .55rem .85rem; white-space: nowrap; }
button.close-app { background: rgba(213,180,95,.16); border-color: rgba(242,223,145,.78); color: #fff8dc; }
button.close-app:hover { background: var(--gold-soft); color: var(--accent-deep); border-color: var(--gold-soft); }
button.close-app:disabled { opacity: .7; cursor: wait; }
.scope-note { max-width: 1520px; margin: 1rem auto 0; padding: .9rem 1.1rem; background: var(--success-bg); color: #0a4f36; border: 1px solid #9ed7b8; border-radius: 10px; }
.tabs { max-width: 1520px; margin: 1rem auto 0; display: flex; gap: .45rem; padding: 0 1rem; overflow-x: auto; }
.tab { background: transparent; color: var(--muted); border-color: transparent; border-radius: 8px 8px 0 0; white-space: nowrap; }
.tab:hover { color: var(--accent-deep); background: #fff8df; }
.tab.active { color: var(--accent-deep); background: var(--surface); border-color: var(--gold); border-bottom-color: var(--surface); box-shadow: inset 0 3px 0 var(--gold); }
main { max-width: 1520px; margin: 0 auto 3rem; padding: 0 1rem; }
.panel { display: none; background: var(--surface); border: 1px solid var(--border); border-radius: 0 12px 12px 12px; box-shadow: var(--shadow); padding: 1.5rem; min-height: 610px; }
.panel.active { display: block; }
.section-heading, .catalog-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.5rem; }
h2 { margin: .2rem 0 .35rem; }
h3 { margin-top: 0; }
p { line-height: 1.55; }
.section-heading p, .catalog-header p { margin: 0; color: var(--muted); }
.step { color: var(--accent); }
.read-only-pill { background: var(--success-bg); color: var(--success); border: 1px solid #b7dac8; border-radius: 999px; padding: .45rem .7rem; font-size: .85rem; font-weight: 750; }
.cards { display: grid; grid-template-columns: repeat(4, minmax(170px, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.cards article { border: 1px solid var(--border); background: var(--surface-soft); border-radius: 10px; padding: 1rem; }
.cards strong { display: block; font-size: 1.35rem; color: var(--accent-dark); margin-bottom: .3rem; }
.cards span { color: var(--muted); }
.workflow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.25rem 0; }
.workflow article { display: flex; gap: .85rem; border: 1px solid var(--border); border-radius: 10px; padding: 1rem; }
.workflow article > span { width: 2rem; height: 2rem; flex: 0 0 2rem; border-radius: 50%; background: var(--accent); color: white; display: grid; place-items: center; font-weight: 800; }
.workflow h3 { margin: .1rem 0 .3rem; }
.workflow p { margin: 0; color: var(--muted); }
.import-box { margin-top: 1.4rem; background: var(--surface-soft); border: 1px solid var(--border); border-radius: 10px; padding: 1rem; }
.path-row { margin-top: 1rem; display: grid; grid-template-columns: 1fr auto; gap: .7rem; align-items: end; }
.form-grid { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: 1rem; margin-top: 1rem; }
label { display: flex; flex-direction: column; gap: .42rem; font-weight: 650; }
input { width: 100%; border: 1px solid #bcc9d0; border-radius: 8px; padding: .72rem .8rem; background: white; color: var(--text); }
input:focus { outline: 3px solid rgba(20,102,102,.15); border-color: var(--accent); }
.compact-field { max-width: 230px; }
.checkbox-field { flex-direction: row; align-items: center; align-self: center; margin-top: 1.35rem; }
.checkbox-field input { width: auto; }
.full-width { grid-column: 1 / -1; }
.form-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: .35rem; }
.result { margin-top: 1rem; padding: .9rem 1rem; border-radius: 8px; white-space: pre-wrap; overflow-wrap: anywhere; }
.result.success { background: var(--success-bg); color: var(--success); border: 1px solid #aedac2; }
.result.error { background: var(--danger-bg); color: var(--danger); border: 1px solid #efbcbc; }
.result.info { background: var(--accent-soft); color: var(--accent-deep); border: 1px solid #9ed7b8; }
.result.warning { background: var(--warning-bg); color: var(--warning); border: 1px solid #ead18b; }
.hidden { display: none !important; }
.divider { height: 1px; background: var(--border); margin: 2rem 0; }
.runtime-note { margin-top: 1rem; color: var(--muted); font-size: .9rem; }
.catalog-header { padding-bottom: 1rem; border-bottom: 1px solid var(--border); }
.header-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.catalog-layout { display: grid; grid-template-columns: 350px 1fr; gap: 1rem; margin-top: 1rem; min-height: 680px; }
.catalog-list { border-right: 1px solid var(--border); padding-right: 1rem; }
.search { margin-bottom: .75rem; }
.entity-list { max-height: 740px; overflow: auto; display: flex; flex-direction: column; gap: .35rem; }
.entity-button { width: 100%; text-align: left; display: block; background: white; color: var(--text); border-color: var(--border); padding: .7rem .75rem; font-weight: 650; }
.entity-button:hover { background: var(--surface-soft); color: var(--accent); }
.entity-button.active { background: var(--accent-soft); border-color: #9ed7b8; color: var(--accent-deep); }
.entity-button strong { display: block; margin-bottom: .2rem; }
.entity-button code { display: inline-block; margin-bottom: .15rem; }
.entity-button small { display: block; color: var(--muted); font-weight: 400; margin-top: .2rem; }
.empty-state { color: var(--muted); padding: 1.2rem; background: var(--surface-soft); border-radius: 8px; }
.catalog-details { min-width: 0; }
.detail-title { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: .5rem; }
.detail-title h3 { margin: 0 0 .2rem; font-size: 1.45rem; }
.detail-title p { margin: 0; color: var(--muted); }
.entity-description { margin-top: .5rem; }
.count-chip { white-space: nowrap; background: var(--accent-soft); color: var(--accent-dark); border-radius: 999px; padding: .45rem .65rem; font-weight: 750; }
.coverage { margin: .8rem 0 1rem; padding: .65rem .75rem; border-radius: 7px; font-size: .9rem; }
.coverage-good { background: var(--success-bg); color: var(--success); border: 1px solid #badcc9; }
.coverage-limited { background: var(--warning-bg); color: var(--warning); border: 1px solid #ead18b; }
.table-wrap { overflow: auto; border: 1px solid var(--border); border-radius: 8px; }
table { border-collapse: collapse; width: 100%; min-width: 1080px; font-size: .91rem; }
th, td { padding: .7rem .75rem; border-bottom: 1px solid var(--border); vertical-align: top; text-align: left; }
th { position: sticky; top: 0; background: #f7f1de; z-index: 1; color: var(--accent-deep); }
tr:last-child td { border-bottom: none; }
tbody tr:hover { background: #fbfff7; }
code { background: #f2efe5; border-radius: 4px; padding: .12rem .3rem; font-size: .9em; }
.field-name { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-weight: 700; color: var(--accent-deep); }
.badge { display: inline-block; padding: .18rem .38rem; border-radius: 5px; background: #edf1f3; margin: 0 .2rem .2rem 0; font-size: .78rem; white-space: nowrap; }
.badge.yes { background: #e6f4eb; color: #1b6644; }
.badge.no { background: #f2f3f4; color: #68737b; }
.doc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin: 1rem 0 1.5rem; }
.doc-grid article { background: var(--surface-soft); border: 1px solid var(--border); border-radius: 10px; padding: 1rem; }
.doc-grid p { margin-bottom: 0; color: #45535d; }
.loading-overlay { position: fixed; inset: 0; background: rgba(244,246,248,.88); z-index: 50; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .7rem; backdrop-filter: blur(2px); text-align: center; padding: 2rem; }
.loading-overlay span { color: var(--muted); max-width: 680px; }
.spinner { width: 46px; height: 46px; border: 4px solid #c8d7dc; border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.shutdown-screen { min-height: 100vh; display: grid; place-items: center; padding: 2rem; }
.shutdown-screen section { max-width: 680px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow); padding: 2rem; text-align: center; }
.shutdown-screen h1 { margin-top: 0; color: var(--accent-dark); }
.shutdown-screen p { margin-bottom: 0; color: var(--muted); }
@media (max-width: 1050px) {
  .cards { grid-template-columns: 1fr 1fr; }
  .workflow { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr 1fr; }
  .catalog-layout { grid-template-columns: 1fr; }
  .catalog-list { border-right: 0; border-bottom: 1px solid var(--border); padding-right: 0; padding-bottom: 1rem; }
  .entity-list { max-height: 330px; }
}
@media (max-width: 700px) {
  .topbar, .section-heading, .catalog-header { flex-direction: column; align-items: stretch; }
  .topbar-actions { justify-content: flex-start; }
  .cards, .form-grid, .doc-grid, .path-row { grid-template-columns: 1fr; }
  .compact-field { max-width: none; }
  .tabs { padding: 0 .5rem; }
  main { padding: 0 .5rem; }
  .panel { padding: 1rem; }
}

/* Version 0.2.0: lokale Kundendatenbank */
.cards-five { grid-template-columns: repeat(5, minmax(150px, 1fr)); }
.workflow-four { grid-template-columns: repeat(4, 1fr); }
button.danger-button { background: white; color: var(--danger); border-color: #d9a6a6; }
button.danger-button:hover { background: var(--danger-bg); color: #7f2020; }
select { width: 100%; border: 1px solid #bcc9d0; border-radius: 8px; padding: .72rem .8rem; background: white; color: var(--text); font: inherit; }
select:focus { outline: 3px solid rgba(20,102,102,.15); border-color: var(--accent); }
.privacy-note { margin: 1rem 0; padding: .9rem 1rem; background: #fff8dc; border: 1px solid #e6d18a; border-radius: 9px; color: #5c4a12; }
.import-progress { margin: 1rem 0; padding: 1rem; border: 1px solid #9ed7b8; background: var(--accent-soft); border-radius: 10px; }
.progress-heading { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .65rem; }
.progress-track { height: 14px; background: white; border: 1px solid #d8c99d; border-radius: 999px; overflow: hidden; }
.progress-fill { height: 100%; width: 0; background: var(--accent); transition: width .25s ease; }
.progress-detail { margin-top: .55rem; color: var(--muted); font-size: .9rem; }
.customer-stats { display: grid; grid-template-columns: repeat(5, minmax(140px, 1fr)); gap: .8rem; margin: 1rem 0; }
.customer-stats article { border: 1px solid var(--border); background: var(--surface-soft); border-radius: 9px; padding: .8rem; }
.customer-stats strong { display: block; color: var(--accent-dark); font-size: 1.2rem; margin-bottom: .15rem; }
.customer-stats span { color: var(--muted); font-size: .88rem; }
.customer-toolbar { display: grid; grid-template-columns: minmax(320px, 1fr) 150px auto; gap: .75rem; align-items: end; margin: 1rem 0; }
.search-label, .page-size-label { font-size: .9rem; }
.column-selector { border: 1px solid var(--border); background: var(--surface-soft); border-radius: 10px; padding: 1rem; margin-bottom: 1rem; }
.column-selector-header { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: .8rem; }
.column-selector-header span { display: block; color: var(--muted); font-size: .87rem; margin-top: .2rem; }
.no-margin { margin: 0; }
.small-button { padding: .48rem .7rem; font-size: .86rem; }
.column-groups { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: .8rem; max-height: 430px; overflow: auto; margin-top: .8rem; }
.column-group { background: white; border: 1px solid var(--border); border-radius: 8px; padding: .75rem; }
.column-group h4 { margin: 0 0 .55rem; color: var(--accent-dark); }
.column-option { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: .45rem; padding: .35rem 0; font-weight: 500; font-size: .88rem; }
.column-option input { width: auto; margin-top: .15rem; }
.column-option small { color: var(--muted); }
.custom-field-marker { display: inline-block; border-radius: 999px; padding: .08rem .35rem; background: #fff8df; color: #8a7430; border: 1px solid #ecd8a4; font-size: .7rem; font-weight: 750; white-space: nowrap; }
.customer-table-wrap { min-height: 370px; max-height: 670px; }
.customer-table { min-width: 1400px; }
.customer-table th { white-space: nowrap; cursor: pointer; }
.customer-table th.no-sort { cursor: default; }
.customer-table td { max-width: 360px; white-space: pre-wrap; overflow-wrap: anywhere; }
.customer-table td.empty-value { color: #9aa5ab; }
.customer-row { cursor: pointer; }
.customer-row:hover { background: #effaf4; }
.detail-button { padding: .35rem .55rem; font-size: .82rem; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: 1rem; }
.pagination button:disabled { opacity: .45; cursor: not-allowed; }
.modal { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 2rem; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(10, 51, 51, .62); }
.modal-card { position: relative; width: min(1240px, 96vw); max-height: 92vh; overflow: hidden; display: flex; flex-direction: column; background: white; border-radius: 12px; box-shadow: 0 24px 80px rgba(0,0,0,.28); }
.modal-header { padding: 1.2rem 1.35rem; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.modal-header h2 { margin: .2rem 0; }
.modal-header p { margin: 0; color: var(--muted); }
.modal-content { overflow: auto; padding: 1.25rem; }
.detail-groups { display: grid; grid-template-columns: repeat(2, minmax(300px, 1fr)); gap: 1rem; }
.detail-group { border: 1px solid var(--border); border-radius: 9px; overflow: hidden; }
.detail-group h3 { margin: 0; padding: .7rem .85rem; background: #f7f1de; border-bottom: 1px solid var(--border); color: var(--accent-deep); font-size: 1rem; }
.detail-list { margin: 0; }
.detail-row { display: grid; grid-template-columns: minmax(180px, .8fr) minmax(220px, 1.2fr); gap: .8rem; padding: .58rem .8rem; border-bottom: 1px solid #edf1f3; }
.detail-row:last-child { border-bottom: 0; }
.detail-row dt { font-weight: 700; color: #344750; }
.detail-row dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.address-card { border: 1px solid var(--border); border-radius: 8px; padding: .8rem; margin-top: .7rem; background: var(--surface-soft); }
.address-card h4 { margin: 0 0 .45rem; color: var(--accent-dark); }
@media (max-width: 1250px) {
  .cards-five { grid-template-columns: repeat(3, 1fr); }
  .workflow-four { grid-template-columns: repeat(2, 1fr); }
  .customer-stats { grid-template-columns: repeat(3, 1fr); }
  .column-groups { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 800px) {
  .cards-five, .workflow-four, .customer-stats, .column-groups, .detail-groups { grid-template-columns: 1fr; }
  .customer-toolbar { grid-template-columns: 1fr; }
  .column-selector-header { flex-direction: column; }
  .modal { padding: .4rem; }
  .modal-card { width: 100%; max-height: 98vh; }
  .detail-row { grid-template-columns: 1fr; gap: .2rem; }
}

/* Version 0.3.0: aufklappbare Ambassador-Genealogie */
.workflow-five { grid-template-columns: repeat(5, minmax(180px, 1fr)); }
.genealogy-rule { margin: 1rem 0; padding: .9rem 1rem; border: 1px solid #9ed7b8; border-radius: 9px; background: var(--accent-soft); color: var(--accent-deep); }
.genealogy-mapping { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) minmax(280px, 1.25fr); gap: 1rem; align-items: end; margin: 1rem 0; }
.mapping-note { min-height: 48px; display: flex; align-items: center; padding: .72rem .8rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-soft); color: var(--muted); font-size: .9rem; }
.genealogy-stats { display: grid; grid-template-columns: repeat(7, minmax(120px, 1fr)); gap: .75rem; margin: 1rem 0; }
.genealogy-stats article { border: 1px solid var(--border); background: var(--surface-soft); border-radius: 9px; padding: .8rem; }
.genealogy-stats strong { display: block; color: var(--accent-dark); font-size: 1.25rem; margin-bottom: .15rem; }
.genealogy-stats span { color: var(--muted); font-size: .84rem; }
.genealogy-toolbar { margin: 1rem 0; }
.genealogy-toolbar label { display: block; max-width: 760px; }
.genealogy-issues { margin: 1rem 0; padding: 1rem 1.1rem; border: 1px solid #e2bd72; border-radius: 10px; background: var(--warning-bg); color: #5f4711; }
.genealogy-issues h3 { margin: 0 0 .6rem; }
.genealogy-issues ul { margin: 0; padding-left: 1.3rem; }
.genealogy-issues li + li { margin-top: .55rem; }
.duplicate-list { margin-top: .35rem; padding: .5rem .65rem; border-radius: 6px; background: rgba(255,255,255,.65); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .84rem; }
.genealogy-tree { margin-top: 1rem; border: 1px solid #d8c99d; border-radius: 10px; background: #fbfaf5; padding: .75rem; min-height: 240px; overflow: auto; }
.genealogy-node { position: relative; margin: .45rem 0; }
.genealogy-node-row { width: 100%; max-width: 1120px; display: grid; grid-template-columns: 32px 70px minmax(220px, 1.25fr) minmax(200px, .9fr) minmax(170px, .7fr); grid-template-areas: "toggle level person identifiers actions" "toggle status status status status"; gap: .45rem .65rem; align-items: center; padding: .65rem .7rem; border: 1px solid #d8c99d; border-left: 5px solid var(--accent); border-radius: 9px; background: white; box-shadow: 0 2px 8px rgba(10, 51, 51, .06); }
.genealogy-node-row:hover { border-color: var(--gold); box-shadow: 0 4px 13px rgba(10, 51, 51, .11); }
.genealogy-search-match { outline: 3px solid rgba(213,180,95,.52); background: #fffdf8; }
.genealogy-toggle { grid-area: toggle; align-self: stretch; width: 32px; min-height: 40px; padding: 0; border-radius: 7px; font-size: 1.25rem; line-height: 1; }
.genealogy-toggle-placeholder { grid-area: toggle; width: 32px; }
.genealogy-level { grid-area: level; justify-self: start; border-radius: 999px; padding: .28rem .48rem; background: var(--accent-soft); color: var(--accent-dark); font-size: .78rem; font-weight: 800; white-space: nowrap; }
.genealogy-person { grid-area: person; min-width: 0; }
.genealogy-person strong { display: block; color: var(--accent-deep); font-size: 1.02rem; }
.genealogy-person span { display: block; color: var(--muted); font-size: .82rem; margin-top: .14rem; overflow-wrap: anywhere; }
.genealogy-person .genealogy-join-date, .genealogy-customer-person .genealogy-join-date { color: var(--accent-dark); font-weight: 700; }
.genealogy-identifiers { grid-area: identifiers; display: grid; gap: .35rem; min-width: 0; }
.genealogy-identifiers span { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: .45rem; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .84rem; overflow-wrap: anywhere; }
.genealogy-identifiers b { color: var(--accent-deep); font-family: inherit; }
.genealogy-node-actions { grid-area: actions; display: grid; gap: .45rem; justify-items: end; }
.direct-count { color: var(--muted); font-size: .8rem; text-align: right; }
.genealogy-node-status { grid-area: status; min-height: 0; }
.genealogy-badge { display: inline-block; margin: .15rem .35rem 0 0; padding: .2rem .45rem; border-radius: 999px; background: #edf1f3; color: #52626a; font-size: .75rem; font-weight: 750; }
.genealogy-badge.status-root { background: #effaf4; color: var(--accent-dark); border: 1px solid #b7e4ca; }
.genealogy-badge.status-unresolved { background: #fff0c8; color: #6a4b00; }
.genealogy-badge.status-ambiguous { background: #f5e8ff; color: #68428d; }
.genealogy-badge.status-cycle { background: var(--danger-bg); color: #8a2929; }
.genealogy-status-unresolved > .genealogy-node-row { border-left-color: #d3a12e; }
.genealogy-status-ambiguous > .genealogy-node-row { border-left-color: #8b5bb1; }
.genealogy-status-cycle > .genealogy-node-row { border-left-color: #b94a4a; }
.genealogy-children { position: relative; margin-left: 2rem; padding-left: 1.15rem; border-left: 2px solid #d8c99d; }
.genealogy-children::before { content: ""; position: absolute; top: 0; left: -2px; width: 1rem; border-top: 2px solid #d8c99d; }
@media (max-width: 1450px) {
  .workflow-five { grid-template-columns: repeat(3, 1fr); }
  .genealogy-stats { grid-template-columns: repeat(3, 1fr); }
  .genealogy-node-row { grid-template-columns: 34px 72px minmax(220px, 1.2fr) minmax(220px, 1fr); grid-template-areas: "toggle level person identifiers" "toggle status status actions"; }
}
@media (max-width: 980px) {
  .workflow-five, .genealogy-mapping, .genealogy-stats { grid-template-columns: 1fr; }
  .genealogy-node-row { grid-template-columns: 34px 1fr; grid-template-areas: "toggle level" "toggle person" "toggle identifiers" "toggle actions" "toggle status"; align-items: start; }
  .genealogy-node-actions { justify-items: start; }
  .direct-count { text-align: left; }
  .genealogy-children { margin-left: .85rem; padding-left: .8rem; }
}

/* Version 0.4.1: kompaktere Genealogie-Kacheln mit Beitrittsdatum */
.genealogy-stats { grid-template-columns: repeat(4, minmax(150px, 1fr)); }
.genealogy-action-buttons { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; }
.genealogy-no-customers { color: var(--muted); font-size: .78rem; font-style: italic; }
.genealogy-direct-customers {
  margin: .5rem 0 .75rem 3.1rem;
  max-width: 1060px;
  padding: .6rem;
  border: 1px solid #d8c99d;
  border-left: 5px solid var(--gold);
  border-radius: 9px;
  background: #fffdf7;
}
.genealogy-customer-list-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: .55rem;
  padding: 0 .2rem;
  color: var(--accent-deep);
}
.genealogy-customer-list-heading span { color: var(--muted); font-size: .8rem; }
.genealogy-customer-list { display: grid; gap: .42rem; }
button.genealogy-direct-customer-row {
  width: 100%;
  max-width: 1000px;
  display: grid;
  grid-template-columns: 68px minmax(230px, 1.3fr) minmax(185px, .75fr) 96px;
  gap: .6rem;
  align-items: center;
  padding: .55rem .65rem;
  border: 1px solid #e1d8ba;
  border-radius: 8px;
  background: white;
  color: var(--text);
  text-align: left;
  box-shadow: none;
}
button.genealogy-direct-customer-row:hover {
  background: #fff8df;
  border-color: var(--gold);
  color: var(--text);
  box-shadow: 0 3px 9px rgba(10, 51, 51, .09);
}
.genealogy-customer-type {
  justify-self: start;
  border-radius: 999px;
  padding: .25rem .48rem;
  background: var(--gold-soft);
  color: var(--accent-deep);
  font-size: .75rem;
  font-weight: 800;
}
.genealogy-customer-person { min-width: 0; }
.genealogy-customer-person strong { display: block; color: var(--accent-deep); }
.genealogy-customer-person span { display: block; color: var(--muted); font-size: .8rem; margin-top: .12rem; overflow-wrap: anywhere; }
.genealogy-customer-sponsor {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: .4rem;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .82rem;
  overflow-wrap: anywhere;
}
.genealogy-customer-sponsor b { color: var(--accent-deep); }
.genealogy-customer-detail-hint { color: var(--accent-dark); font-size: .78rem; font-weight: 750; text-align: right; }

@media (max-width: 1450px) {
  .genealogy-stats { grid-template-columns: repeat(4, 1fr); }
  button.genealogy-direct-customer-row { grid-template-columns: 66px minmax(210px, 1fr) minmax(180px, .8fr); }
  .genealogy-customer-detail-hint { display: none; }
}
@media (max-width: 980px) {
  .genealogy-stats { grid-template-columns: 1fr; }
  .genealogy-action-buttons { justify-content: flex-start; }
  .genealogy-direct-customers { margin-left: .85rem; }
  button.genealogy-direct-customer-row { grid-template-columns: 1fr; gap: .35rem; }
  .genealogy-customer-sponsor { grid-template-columns: 82px minmax(0, 1fr); }
}

/* Version 0.4.6: kompakte Anzeige der Shopware-Standardanschriften */
.last-address-section {
  margin-bottom: 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.last-address-section-title {
  margin: 0;
  padding: .72rem .9rem;
  background: #f7f1de;
  border-bottom: 1px solid var(--border);
  color: var(--accent-deep);
  font-size: 1rem;
}
.last-address-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: .8rem;
  padding: .8rem;
}
.last-address-card {
  border: 1px solid #dfe5e5;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}
.last-address-card h3 {
  margin: 0;
  padding: .58rem .72rem;
  background: #fbf8ed;
  border-bottom: 1px solid #e6dfc9;
  color: var(--accent-deep);
  font-size: .95rem;
}
.last-address-list {
  margin: 0;
}
.last-address-row {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr);
  gap: .65rem;
  padding: .42rem .7rem;
  border-bottom: 1px solid #edf1f3;
}
.last-address-row:last-child {
  border-bottom: 0;
}
.last-address-row dt {
  font-weight: 700;
  color: #3b4d55;
}
.last-address-row dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.address-name-lines {
  display: flex;
  flex-direction: column;
  gap: .12rem;
}
.last-address-empty {
  margin: 0;
  padding: .8rem;
  color: #66757c;
}

@media (max-width: 850px) {
  .last-address-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .last-address-row { grid-template-columns: 1fr; gap: .12rem; }
}

/* Version 0.5.0: Seitenleiste und neue Navigationsstruktur */
body {
  background: #e7e1d1;
}
.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
}
.sidebar {
  background: linear-gradient(180deg, #114f52 0%, #0f6467 100%);
  color: #fff6d1;
  padding: 1.2rem 1rem;
  border-right: 1px solid rgba(255,255,255,.08);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: auto;
}
.brand-card {
  background: rgba(5, 49, 51, .42);
  border: 1px solid rgba(230, 214, 160, .45);
  border-radius: 18px;
  padding: .95rem .95rem 1rem;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}
.brand-logo {
  width: 100%;
  display: block;
  border-radius: 14px;
  margin-bottom: .65rem;
}
.brand-product {
  font-size: 1.25rem;
  font-weight: 800;
  line-height: 1.2;
  color: #fff5cc;
}
.brand-version {
  margin-top: .2rem;
  color: #dfeee5;
  font-weight: 700;
}
.sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.nav-link,
.nav-group-toggle {
  width: 100%;
  text-align: left;
  border-radius: 14px;
  border: 1px solid rgba(212, 201, 146, .25);
  background: rgba(4, 57, 59, .28);
  color: #ffe78f;
  padding: .85rem .95rem;
  font-weight: 800;
  justify-content: space-between;
}
.nav-link:hover,
.nav-group-toggle:hover {
  background: rgba(255,255,255,.12);
  color: #fff4b9;
  border-color: rgba(242,223,145,.45);
}
.nav-link.active {
  background: rgba(255,255,255,.12);
  color: #ffffff;
  border-color: var(--gold-soft);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}
.nav-group {
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.nav-group > .nav-submenu {
  display: none;
  padding-left: .55rem;
  gap: .45rem;
}
.nav-group.open > .nav-submenu {
  display: flex;
  flex-direction: column;
}
.nav-group.nested {
  gap: .4rem;
}
.nav-group.nested .nav-group-toggle {
  background: rgba(255,255,255,.08);
  color: #fff3bd;
  font-size: .95rem;
  font-weight: 700;
}
.nav-group.nested .nav-submenu {
  padding-left: .65rem;
}
.nav-sublink {
  font-size: .94rem;
  font-weight: 700;
  color: #ebf6f2;
  background: rgba(255,255,255,.06);
}
.nav-chevron {
  font-size: .95rem;
  transition: transform .18s ease;
}
.nav-group.open > .nav-group-toggle .nav-chevron {
  transform: rotate(180deg);
}
.content-shell {
  min-width: 0;
  padding: 1.5rem;
}
.topbar {
  padding: 0 0 1rem 0;
  background: transparent;
  color: var(--accent-deep);
  border-bottom: 1px solid rgba(190, 177, 145, .65);
}
.topbar p {
  color: #56636b;
}
.status-badge {
  background: #dff3e8;
  color: #0f7d4d;
  border: 1px solid #a6dfbf;
}
button.close-app {
  background: white;
  color: var(--accent-deep);
  border-color: #cbb871;
}
button.close-app:hover {
  background: #fff7db;
  color: var(--accent-deep);
  border-color: var(--gold);
}
.scope-note {
  max-width: none;
  margin: 0 0 1rem 0;
}
main.content-main {
  max-width: none;
  margin: 0;
  padding: 0;
}
.panel {
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  min-height: 640px;
}
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 1rem;
  margin: 1rem 0;
}
.dashboard-card {
  border: 1px solid var(--border);
  background: var(--surface-soft);
  border-radius: 12px;
  padding: 1rem;
}
.dashboard-card h3 {
  margin-bottom: .45rem;
}
.dashboard-card p {
  margin-top: 0;
  color: var(--muted);
}
.quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.placeholder-panel .empty-state {
  margin-top: 1rem;
}
@media (max-width: 1180px) {
  .app-shell {
    grid-template-columns: 1fr;
  }
  .sidebar {
    position: static;
    height: auto;
  }
  .content-shell {
    padding-top: 1rem;
  }
}
@media (max-width: 900px) {
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
}


/* Version 0.5.1: Typografie an Shopware2sevDesk-Menüleiste angenähert */
.sidebar, .brand-card, .sidebar-nav {
  font-family: "Trebuchet MS", "Arial Narrow", "Segoe UI", Arial, sans-serif;
}
.brand-product {
  font-size: 0.98rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0;
}
.brand-version {
  font-size: 0.88rem;
  font-weight: 700;
}
.nav-link,
.nav-group-toggle {
  font-family: "Trebuchet MS", "Arial Narrow", "Segoe UI", Arial, sans-serif;
  font-size: 0.82rem;
  line-height: 1.15;
  letter-spacing: 0;
  font-weight: 800;
  padding: .8rem .9rem;
}
.nav-sublink {
  font-family: "Trebuchet MS", "Arial Narrow", "Segoe UI", Arial, sans-serif;
  font-size: 0.78rem;
  line-height: 1.12;
  font-weight: 800;
}
.nav-group.nested .nav-group-toggle {
  font-size: .82rem;
  font-weight: 800;
}
.eyebrow {
  font-size: .74rem;
}
.topbar h1 {
  font-size: clamp(2rem, 3.1vw, 2.8rem);
}


/* Version 0.5.2: Logo vollständig sichtbar und ADMIN-Menü */
.brand-card {
  overflow: visible;
}
.brand-logo {
  width: calc(100% - 12px);
  max-width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  margin: .15rem auto .7rem;
  border-radius: 0;
}
.topbar p {
  display: none;
}

/* Version 0.5.3: Admin-Vorschau und Ambassador-Sicht */
body.ambassador-view .admin-only {
  display: none !important;
}
body:not(.ambassador-view) .ambassador-only {
  display: none !important;
}
.view-mode-banner {
  margin: 0 0 1rem;
  padding: .85rem 1rem;
  border: 1px solid #d5b45f;
  border-radius: 12px;
  background: #fff7d7;
  color: var(--accent-deep);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.view-mode-banner > div {
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.view-mode-banner strong {
  font-size: 1rem;
}
.view-mode-banner span {
  color: #5d5a4c;
}
.admin-view-grid {
  display: grid;
  grid-template-columns: minmax(340px, 1.25fr) minmax(300px, .75fr);
  gap: 1rem;
  margin: 1.25rem 0;
}
.admin-view-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  padding: 1rem;
}
.admin-view-card h3 {
  margin-bottom: .45rem;
}
.admin-view-card p {
  margin-top: 0;
  color: var(--muted);
}
.admin-view-card label + label {
  margin-top: .85rem;
}
.admin-current-view {
  min-height: 118px;
  border: 1px solid #cfc5a8;
  border-radius: 9px;
  background: white;
  padding: .9rem;
  display: flex;
  flex-direction: column;
  gap: .3rem;
}
.admin-current-view strong {
  color: var(--accent-deep);
  font-size: 1.15rem;
}
.admin-current-view span {
  color: var(--muted);
}
.admin-permission-note {
  margin-top: 1rem;
  padding: .8rem;
  border-radius: 8px;
  border: 1px solid #b9d9c6;
  background: #edf9f2;
  color: #275744;
  line-height: 1.45;
}
.ambassador-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(170px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0;
}
.ambassador-dashboard article {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
  padding: 1rem;
}
.ambassador-dashboard strong {
  display: block;
  color: var(--accent-dark);
  font-size: 1.2rem;
  margin-bottom: .25rem;
}
.ambassador-dashboard span {
  color: var(--muted);
}
.profile-content {
  margin-top: 1.2rem;
}
.profile-card {
  max-width: 900px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
  padding: 1.15rem;
}
.profile-card h3 {
  margin: .15rem 0 .2rem;
  font-size: 1.45rem;
  color: var(--accent-deep);
}
.profile-card p {
  margin: 0;
  color: var(--muted);
}
.profile-label {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: .72rem;
  font-weight: 800;
}
.profile-summary {
  margin: 1rem 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: .55rem 1rem;
}
.profile-summary div {
  border-bottom: 1px solid #ebe5d6;
  padding: .45rem 0;
}
.profile-summary dt {
  color: var(--muted);
  font-size: .82rem;
  font-weight: 700;
}
.profile-summary dd {
  margin: .12rem 0 0;
  color: var(--text);
  overflow-wrap: anywhere;
}
.genealogy-direct-customer-row:disabled,
.genealogy-customer-button:disabled,
.genealogy-detail-restricted {
  opacity: .74;
  cursor: default;
}
.genealogy-direct-customer-row:disabled:hover,
.genealogy-customer-button:disabled:hover {
  transform: none;
  box-shadow: none;
}
body.ambassador-view .genealogy-rule {
  background: #f7f1de;
  border-color: #dccd9e;
}
@media (max-width: 900px) {
  .admin-view-grid,
  .ambassador-dashboard,
  .profile-summary {
    grid-template-columns: 1fr;
  }
  .view-mode-banner {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Version 0.5.4: neues Ambassador-Dashboard */
.ambassador-dashboard-view {
  max-width: 980px;
}
.ambassador-dashboard-heading {
  margin-bottom: 1.15rem;
}
.ambassador-dashboard-list {
  display: flex;
  flex-direction: column;
  gap: .8rem;
}
.ambassador-dashboard-row {
  display: grid;
  grid-template-columns: minmax(210px, .72fr) minmax(320px, 1.28fr);
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.1rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}
.ambassador-dashboard-label {
  color: var(--muted);
  font-weight: 750;
}
.ambassador-dashboard-row strong,
.ambassador-dashboard-row a {
  color: var(--accent-deep);
  font-size: 1.05rem;
  overflow-wrap: anywhere;
}
.ambassador-link-control {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
}
.ambassador-link-control a {
  min-width: 0;
  flex: 1;
}
.copy-link-button {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  padding: .55rem;
  border-radius: 9px;
  background: white;
  color: var(--accent-deep);
  border-color: #cbb871;
}
.copy-link-button:hover {
  background: #fff7db;
  color: var(--accent-deep);
  border-color: var(--gold);
}
.copy-link-button svg {
  width: 21px;
  height: 21px;
  fill: currentColor;
}
.copy-link-button:disabled {
  opacity: .45;
  cursor: not-allowed;
}
.dashboard-external-link {
  font-weight: 750;
}
.dashboard-action-link {
  display: inline-flex;
  width: fit-content;
  padding: .65rem .85rem;
  border: 1px solid var(--accent);
  border-radius: 8px;
  background: linear-gradient(135deg, var(--accent), var(--accent-dark));
  color: white !important;
  text-decoration: none;
}
.dashboard-action-link:hover {
  background: linear-gradient(135deg, #1b7f7f, var(--accent-dark));
}
.disabled-link {
  pointer-events: none;
  color: var(--muted) !important;
  text-decoration: none;
}
@media (max-width: 760px) {
  .ambassador-dashboard-row {
    grid-template-columns: 1fr;
    gap: .35rem;
  }
}

/* Version 0.5.5: Mediathek */
.media-source-status {
  flex: 0 0 auto;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--muted);
  padding: .48rem .75rem;
  font-size: .82rem;
  font-weight: 750;
  white-space: nowrap;
}
.media-source-status.live {
  background: var(--success-bg);
  border-color: #a9d8bf;
  color: var(--success);
}
.media-source-status.cached {
  background: var(--warning-bg);
  border-color: #e5c97c;
  color: var(--warning);
}
.media-source-status.error {
  background: var(--danger-bg);
  border-color: #efbcbc;
  color: var(--danger);
}
.media-source-status.loading {
  background: var(--accent-soft);
  border-color: #9ed7b8;
  color: var(--accent-deep);
}
.media-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  gap: 1rem;
  align-items: end;
  margin: 1rem 0;
}
.media-toolbar label {
  max-width: 760px;
}
.media-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(220px, 1fr));
  gap: 1rem;
  align-items: stretch;
}
.media-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 3px 12px rgba(10, 51, 51, .07);
}
.media-thumbnail-button {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  background: #0a3333;
}
.media-thumbnail-button:hover {
  background: #0a3333;
  border: 0;
}
.media-thumbnail-button img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .18s ease;
}
.media-thumbnail-button:hover img {
  transform: scale(1.025);
}
.media-play-icon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 3.15rem;
  height: 3.15rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(10, 51, 51, .84);
  color: white;
  border: 2px solid rgba(255,255,255,.88);
  font-size: 1.2rem;
  padding-left: .15rem;
}
.media-card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: .55rem;
  padding: .9rem;
}
.media-card-date {
  color: var(--accent);
  font-size: .78rem;
  font-weight: 800;
}
.media-card h3 {
  margin: 0;
  color: var(--accent-deep);
  font-size: 1rem;
  line-height: 1.3;
}
.media-card p {
  margin: 0;
  color: var(--muted);
  font-size: .86rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.media-open-button {
  margin-top: auto;
  width: 100%;
}
.media-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 1.25rem;
}
.document-grid {
  display: flex;
  flex-direction: column;
  gap: .7rem;
}
.document-card {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) auto;
  gap: .9rem;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
  padding: .8rem;
}
.document-icon {
  min-height: 52px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: var(--accent-soft);
  color: var(--accent-deep);
  border: 1px solid #aed8c1;
  font-size: .75rem;
  font-weight: 850;
  overflow-wrap: anywhere;
  text-align: center;
  padding: .35rem;
}
.document-card-main h3 {
  margin: 0 0 .28rem;
  font-size: .98rem;
  color: var(--accent-deep);
  overflow-wrap: anywhere;
}
.document-card-main span {
  color: var(--muted);
  font-size: .82rem;
}
.document-card-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .5rem;
}
.inline-spinner {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  margin-right: .45rem;
  vertical-align: -.12rem;
  border: 2px solid #c8d9d2;
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin .8s linear infinite;
}
.media-modal-card {
  width: min(1320px, 96vw);
  max-height: 95vh;
}
.media-viewer-content {
  padding: 1rem;
  background: #111;
}
.video-frame {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}
.video-frame iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.media-viewer-actions {
  min-height: 64px;
  display: flex;
  justify-content: flex-end;
  gap: .65rem;
  padding: .8rem 1.1rem;
  border-top: 1px solid var(--border);
  background: var(--surface-soft);
}
.youtube-button {
  background: #b42318;
  border-color: #8f1c14;
}
.youtube-button:hover {
  background: #8f1c14;
  border-color: #74160f;
}
.document-pdf-preview {
  width: 100%;
  height: min(74vh, 900px);
  border: 0;
  display: block;
  background: white;
}
.document-image-preview {
  min-height: 360px;
  max-height: 76vh;
  display: grid;
  place-items: center;
  overflow: auto;
  background: #242424;
}
.document-image-preview img {
  max-width: 100%;
  max-height: 74vh;
  object-fit: contain;
}
@media (max-width: 1500px) {
  .media-grid { grid-template-columns: repeat(3, minmax(220px, 1fr)); }
}
@media (max-width: 1050px) {
  .media-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
}
@media (max-width: 720px) {
  .media-toolbar { grid-template-columns: 1fr; }
  .media-grid { grid-template-columns: 1fr; }
  .document-card { grid-template-columns: 54px minmax(0, 1fr); }
  .document-card-actions { grid-column: 1 / -1; justify-content: stretch; }
  .document-card-actions > * { flex: 1; }
}

/* Version 0.5.7: edle Magazinansicht für Akademie, Reels und Tools */
#panel-media-academy,
#panel-media-reels,
#panel-media-tools {
  --media-deep: #063b3c;
  --media-deeper: #042d2e;
  --media-card: #0a4a49;
  --media-card-hover: #0d5755;
  --media-gold: #d5b45f;
  --media-gold-light: #f2df91;
  --media-cream: #fff8dc;
  position: relative;
  overflow: hidden;
  color: var(--media-cream);
  border-color: rgba(213, 180, 95, .4);
  background:
    radial-gradient(circle at 88% 3%, rgba(20, 102, 102, .45), transparent 32%),
    linear-gradient(145deg, var(--media-deeper), var(--media-deep) 52%, #07504f);
  box-shadow: 0 18px 55px rgba(4, 45, 46, .2);
}
#panel-media-academy::before,
#panel-media-reels::before,
#panel-media-tools::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(242, 223, 145, .13) 0 1px, transparent 1.5px),
    radial-gradient(circle at 74% 68%, rgba(242, 223, 145, .1) 0 1px, transparent 1.5px);
  background-size: 48px 48px, 64px 64px;
}
#panel-media-academy > *,
#panel-media-reels > *,
#panel-media-tools > * {
  position: relative;
  z-index: 1;
}
#panel-media-academy .catalog-header,
#panel-media-reels .catalog-header,
#panel-media-tools .catalog-header {
  align-items: end;
  border-bottom-color: rgba(213, 180, 95, .25);
}
#panel-media-academy .catalog-header h2,
#panel-media-reels .catalog-header h2,
#panel-media-tools .catalog-header h2 {
  margin-top: .35rem;
  color: #fffdf3;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.35rem, 4vw, 4.25rem);
  font-weight: 500;
  line-height: 1;
}
#panel-media-academy .catalog-header p,
#panel-media-reels .catalog-header p,
#panel-media-tools .catalog-header p {
  max-width: 820px;
  color: rgba(255, 248, 220, .76);
  font-size: 1rem;
}
#panel-media-academy .step,
#panel-media-reels .step,
#panel-media-tools .step {
  color: var(--media-gold-light);
}
#panel-media-academy .media-source-status,
#panel-media-reels .media-source-status,
#panel-media-tools .media-source-status {
  color: var(--media-cream);
  border-color: rgba(213, 180, 95, .48);
  background: rgba(4, 45, 46, .68);
  backdrop-filter: blur(8px);
}
#panel-media-academy .media-source-status.live,
#panel-media-reels .media-source-status.live,
#panel-media-tools .media-source-status.live {
  color: #eaffef;
  border-color: rgba(148, 225, 183, .48);
  background: rgba(16, 112, 72, .34);
}
#panel-media-academy .media-toolbar,
#panel-media-reels .media-toolbar,
#panel-media-tools .media-toolbar {
  margin: 1.25rem 0 1rem;
}
#panel-media-academy .media-toolbar label,
#panel-media-reels .media-toolbar label,
#panel-media-tools .media-toolbar label {
  color: var(--media-gold-light);
}
#panel-media-academy .media-toolbar input,
#panel-media-reels .media-toolbar input,
#panel-media-tools .media-toolbar input {
  min-height: 50px;
  color: white;
  border-color: rgba(213, 180, 95, .42);
  background: rgba(3, 38, 39, .72);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
}
#panel-media-academy .media-toolbar input::placeholder,
#panel-media-reels .media-toolbar input::placeholder,
#panel-media-tools .media-toolbar input::placeholder {
  color: rgba(255,248,220,.55);
}
#panel-media-academy .media-toolbar input:focus,
#panel-media-reels .media-toolbar input:focus,
#panel-media-tools .media-toolbar input:focus {
  outline-color: rgba(213, 180, 95, .28);
  border-color: var(--media-gold);
}
#panel-media-academy .count-chip,
#panel-media-reels .count-chip,
#panel-media-tools .count-chip {
  color: var(--media-gold-light);
  border: 1px solid rgba(213,180,95,.42);
  background: rgba(4,45,46,.72);
}
#panel-media-academy .media-grid,
#panel-media-reels .media-grid,
#panel-media-tools .media-grid {
  display: block;
}
.media-magazine {
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
}
.media-featured {
  position: relative;
  min-height: clamp(390px, 45vw, 600px);
  overflow: hidden;
  border: 1px solid rgba(213, 180, 95, .6);
  border-radius: 18px;
  background: var(--media-deeper);
  box-shadow: 0 18px 44px rgba(0,0,0,.24);
}
.media-featured-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
}
.media-featured-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(3, 35, 36, .98) 0%, rgba(3, 35, 36, .9) 33%, rgba(3, 35, 36, .46) 62%, rgba(3, 35, 36, .12) 100%),
    linear-gradient(0deg, rgba(3,35,36,.64), transparent 45%);
}
.media-featured-content {
  position: relative;
  z-index: 2;
  width: min(650px, 62%);
  min-height: inherit;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: clamp(1.6rem, 4vw, 3.4rem);
}
.media-featured-badge {
  display: inline-flex;
  margin-bottom: 1rem;
  padding: .38rem .72rem;
  border: 1px solid rgba(213, 180, 95, .75);
  border-radius: 999px;
  color: var(--media-gold-light);
  background: rgba(4,45,46,.62);
  font-size: .76rem;
  font-weight: 850;
  letter-spacing: .08em;
}
.media-featured h3 {
  max-width: 780px;
  margin: 0 0 .8rem;
  color: #fffdf5;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 4.1rem);
  font-weight: 500;
  line-height: 1.04;
  text-shadow: 0 2px 18px rgba(0,0,0,.34);
}
.media-featured p {
  max-width: 590px;
  margin: 0 0 1rem;
  color: rgba(255,248,220,.88);
  font-size: clamp(.95rem, 1.35vw, 1.12rem);
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.media-featured-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem 1.2rem;
  margin-bottom: 1.3rem;
  color: var(--media-gold-light);
  font-size: .9rem;
  font-weight: 700;
}
.media-featured-meta span + span::before {
  content: "•";
  margin-right: 1.2rem;
}
.media-featured-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}
.media-featured-actions button {
  min-height: 48px;
  border-radius: 999px;
  padding-inline: 1.25rem;
  background: linear-gradient(135deg, #f0d78c, #cda64b);
  border-color: #f2df91;
  color: #063b3c;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.media-featured-actions button:hover {
  background: linear-gradient(135deg, #fff0b5, #d5b45f);
}
.media-featured-actions .media-youtube-outline {
  color: #fff8dc;
  border-color: rgba(242,223,145,.78);
  background: rgba(4,45,46,.54);
  backdrop-filter: blur(7px);
}
.media-featured-actions .media-youtube-outline:hover {
  color: #063b3c;
  background: #f2df91;
}
.media-magazine-section-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
  padding-top: .3rem;
}
.media-magazine-section-heading h3 {
  margin: .1rem 0 0;
  color: #fffdf5;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.7rem, 2.6vw, 2.45rem);
  font-weight: 500;
}
.media-magazine-section-heading > span {
  color: var(--media-gold-light);
  font-size: .85rem;
}
.media-magazine-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(190px, 1fr));
  gap: 1rem;
}
.media-magazine-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(213,180,95,.46);
  border-radius: 14px;
  color: var(--media-cream);
  background: linear-gradient(155deg, rgba(12,82,79,.94), rgba(5,52,53,.98));
  box-shadow: 0 8px 22px rgba(0,0,0,.16);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.media-magazine-card:hover {
  transform: translateY(-3px);
  border-color: rgba(242,223,145,.82);
  box-shadow: 0 14px 30px rgba(0,0,0,.23);
}
.media-magazine-thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #032f30;
}
.media-magazine-thumb:hover {
  border: 0;
  background: #032f30;
}
.media-magazine-thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .22s ease;
}
.media-magazine-card:hover .media-magazine-thumb img {
  transform: scale(1.035);
}
.media-magazine-play {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 2.9rem;
  height: 2.9rem;
  display: grid;
  place-items: center;
  transform: translate(-50%, -50%);
  padding-left: .12rem;
  border: 1px solid rgba(242,223,145,.9);
  border-radius: 50%;
  color: #063b3c;
  background: rgba(242,223,145,.9);
  box-shadow: 0 8px 22px rgba(0,0,0,.24);
  opacity: 0;
  transition: opacity .18s ease, transform .18s ease;
}
.media-magazine-card:hover .media-magazine-play,
.media-magazine-thumb:focus-visible .media-magazine-play {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.04);
}
.media-magazine-card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: .45rem;
  padding: .85rem .9rem .8rem;
}
.media-magazine-card .media-card-date {
  color: var(--media-gold-light);
}
.media-magazine-card h4 {
  margin: 0;
  color: #fffdf4;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.08rem;
  font-weight: 500;
  line-height: 1.28;
}
.media-magazine-card p {
  margin: 0;
  color: rgba(255,248,220,.7);
  font-size: .82rem;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.media-magazine-card-actions {
  display: flex;
  gap: .5rem;
  margin-top: auto;
  padding-top: .45rem;
}
.media-icon-button {
  width: 2.35rem;
  height: 2.35rem;
  padding: 0;
  border-radius: 50%;
  border-color: rgba(213,180,95,.65);
  color: var(--media-gold-light);
  background: rgba(3,42,43,.65);
  font-size: .78rem;
}
.media-icon-button:hover {
  color: #063b3c;
  border-color: #f2df91;
  background: #f2df91;
}
.media-icon-button.youtube {
  border-radius: 9px;
  width: 2.8rem;
}
#panel-media-academy .media-more-wrap,
#panel-media-reels .media-more-wrap,
#panel-media-tools .media-more-wrap {
  margin-top: 1.4rem;
}
#panel-media-academy .media-more-wrap button,
#panel-media-reels .media-more-wrap button,
#panel-media-tools .media-more-wrap button {
  width: min(520px, 100%);
  min-height: 48px;
  color: #063b3c;
  border-color: #f2df91;
  border-radius: 999px;
  background: linear-gradient(135deg, #f0d78c, #cda64b);
}
#panel-media-academy .media-more-wrap button:hover,
#panel-media-reels .media-more-wrap button:hover,
#panel-media-tools .media-more-wrap button:hover {
  background: linear-gradient(135deg, #fff0b5, #d5b45f);
}
#panel-media-academy .empty-state,
#panel-media-reels .empty-state,
#panel-media-tools .empty-state {
  color: rgba(255,248,220,.78);
  border: 1px solid rgba(213,180,95,.28);
  background: rgba(4,45,46,.65);
}
#panel-media-academy .result,
#panel-media-reels .result,
#panel-media-tools .result {
  background: rgba(4,45,46,.75);
  border-color: rgba(213,180,95,.35);
  color: var(--media-cream);
}
@media (max-width: 1480px) {
  .media-magazine-grid { grid-template-columns: repeat(3, minmax(190px, 1fr)); }
}
@media (max-width: 1080px) {
  .media-featured-content { width: 75%; }
  .media-featured-overlay {
    background: linear-gradient(90deg, rgba(3,35,36,.98), rgba(3,35,36,.78) 62%, rgba(3,35,36,.32));
  }
  .media-magazine-grid { grid-template-columns: repeat(2, minmax(190px, 1fr)); }
}
@media (max-width: 720px) {
  .media-featured { min-height: 500px; }
  .media-featured-content { width: 100%; justify-content: flex-end; }
  .media-featured-overlay {
    background: linear-gradient(0deg, rgba(3,35,36,.99) 0%, rgba(3,35,36,.76) 58%, rgba(3,35,36,.18) 100%);
  }
  .media-featured h3 { font-size: 2rem; }
  .media-featured-actions { width: 100%; }
  .media-featured-actions button { flex: 1; }
  .media-magazine-section-heading { align-items: flex-start; flex-direction: column; }
  .media-magazine-grid { grid-template-columns: 1fr; }
  .media-magazine-play { opacity: 1; }
}


/* Version 0.5.8: rote YouTube-Schaltflächen */
.youtube-button,
.media-featured-actions .media-youtube-button,
.media-icon-button.youtube {
  background: #ff0000;
  border-color: #ff0000;
  color: #ffffff;
  box-shadow: 0 7px 20px rgba(255, 0, 0, .24);
}
.youtube-button:hover,
.media-featured-actions .media-youtube-button:hover,
.media-icon-button.youtube:hover {
  background: #cc0000;
  border-color: #cc0000;
  color: #ffffff;
  box-shadow: 0 9px 24px rgba(204, 0, 0, .34);
}
.youtube-button,
.media-featured-actions .media-youtube-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 48px;
  padding-inline: 1.15rem;
  border-radius: 10px;
  font-weight: 800;
}
.media-icon-button.youtube {
  width: auto;
  min-width: 4.75rem;
  height: 2.35rem;
  padding: 0 .62rem;
  border-radius: 8px;
  display: inline-flex;
  gap: .36rem;
  align-items: center;
  justify-content: center;
  font-size: .75rem;
  font-weight: 800;
}
.youtube-logo-mark {
  width: 1.55rem;
  height: 1.08rem;
  flex: 0 0 auto;
  border-radius: .3rem;
  background: #ffffff;
  display: inline-grid;
  place-items: center;
}
.youtube-logo-mark > span {
  width: 0;
  height: 0;
  border-top: .25rem solid transparent;
  border-bottom: .25rem solid transparent;
  border-left: .42rem solid #ff0000;
  margin-left: .08rem;
}
.media-icon-button.youtube .youtube-logo-mark {
  width: 1.35rem;
  height: .94rem;
}
.media-icon-button.youtube .youtube-logo-mark > span {
  border-top-width: .21rem;
  border-bottom-width: .21rem;
  border-left-width: .35rem;
}

/* Version 0.6.0: Bestellungen der direkten Downline */
.order-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(145px, 1fr));
  gap: .8rem;
  margin: 1rem 0;
}
.order-stats article {
  border: 1px solid var(--border);
  background: var(--surface-soft);
  border-radius: 10px;
  padding: .85rem;
}
.order-stats strong {
  display: block;
  color: var(--accent-dark);
  font-size: 1.2rem;
  margin-bottom: .2rem;
}
.order-stats span { color: var(--muted); font-size: .86rem; }
.order-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(150px, .35fr) minmax(150px, .35fr) 145px;
  gap: .75rem;
  margin: 1rem 0;
  align-items: end;
}
.order-table-wrap { min-height: 420px; max-height: 690px; }
.order-table { min-width: 1220px; }
.order-table td { vertical-align: middle; }
.order-table small { color: var(--muted); }
.order-status {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border-radius: 999px;
  padding: .25rem .55rem;
  font-size: .78rem;
  font-weight: 800;
  white-space: nowrap;
  border: 1px solid transparent;
}
.order-status.success { background: var(--success-bg); color: var(--success); border-color: #b1ddc5; }
.order-status.warning { background: var(--warning-bg); color: var(--warning); border-color: #ead18b; }
.order-status.danger { background: var(--danger-bg); color: var(--danger); border-color: #efbcbc; }
.order-status.neutral { background: #edf1f3; color: #52616a; border-color: #d7dfe3; }
.order-number-button {
  background: transparent;
  border: 0;
  color: var(--accent-dark);
  padding: 0;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.order-number-button:hover { background: transparent; color: var(--accent); border: 0; }
.number-cell { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.invoice-button { min-width: 58px; padding: .4rem .65rem; }
.invoice-missing { color: var(--muted); font-size: .8rem; }
.order-detail-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: .8rem;
  margin-bottom: 1rem;
}
.order-detail-summary article {
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: .8rem;
  background: var(--surface-soft);
}
.order-detail-summary span { display: block; color: var(--muted); font-size: .82rem; margin-bottom: .2rem; }
.order-detail-summary strong { color: var(--accent-dark); }
.order-item-table { min-width: 1080px; }
@media (max-width: 1180px) {
  .order-stats { grid-template-columns: repeat(3, 1fr); }
  .order-toolbar { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
}
@media (max-width: 760px) {
  .order-stats, .order-toolbar, .order-detail-summary { grid-template-columns: 1fr; }
}


/* Version 0.6.1: getrennte Eigen- und Team-Bestellansichten */
.team-order-toolbar {
  grid-template-columns: 170px minmax(260px, 1fr) minmax(145px, .35fr) minmax(145px, .35fr) 140px;
}
@media (max-width: 1280px) {
  .team-order-toolbar { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
}
@media (max-width: 760px) {
  .team-order-toolbar { grid-template-columns: 1fr; }
}

/* Version 0.6.2: Monatsansicht und Ebenengliederung der Teambestellungen */
.team-level-row td {
  background: linear-gradient(90deg, #0d4b4b, #146666);
  color: #fff8dc;
  border-bottom: 1px solid #d5b45f;
  padding: .72rem .85rem;
}
.team-level-row strong {
  display: inline-block;
  margin-right: 1rem;
  color: #f2df91;
  font-size: 1rem;
}
.team-level-row span {
  font-size: .88rem;
  color: #ffffff;
}


/* Version 0.6.3: korrekte Statusbegriffe und kompaktere Bestellansichten */
.order-stats {
  gap: .55rem;
  margin: .7rem 0;
}
.order-stats article {
  padding: .62rem .7rem;
}
.order-stats strong {
  font-size: 1.08rem;
  margin-bottom: .1rem;
}
.order-toolbar,
.team-order-toolbar {
  gap: .55rem;
  margin: .7rem 0;
}
.order-toolbar label {
  gap: .3rem;
  font-size: .86rem;
}
.order-toolbar input,
.order-toolbar select {
  padding: .58rem .65rem;
}
.order-table-wrap {
  min-height: 360px;
  max-height: 690px;
}
.order-table {
  font-size: .86rem;
}
.order-table th,
.order-table td {
  padding: .48rem .55rem;
  line-height: 1.3;
}
.order-table th {
  white-space: nowrap;
}
.order-table td {
  overflow-wrap: anywhere;
}
.own-order-table {
  min-width: 860px;
}
.team-order-table {
  min-width: 1080px;
}
.order-status {
  min-height: 23px;
  padding: .2rem .45rem;
  font-size: .73rem;
}
.invoice-button {
  min-width: 50px;
  padding: .32rem .5rem;
}
.team-level-row td {
  padding: .56rem .65rem;
}


/* Version 0.6.4: gemeinsame automatische Aktualisierung beim App-Start */
.automatic-sync-banner {
  margin: 0 0 1rem;
  padding: .75rem 1rem;
  border: 1px solid #9ed7b8;
  border-radius: 10px;
  background: #edf8f2;
  color: var(--accent-deep);
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(240px, 420px);
  gap: 1rem;
  align-items: center;
}
.automatic-sync-banner.running {
  background: #fff8dc;
  border-color: #e1c56e;
}
.automatic-sync-banner.success {
  background: var(--success-bg);
  border-color: #9ed7b8;
}
.automatic-sync-banner.warning {
  background: var(--warning-bg);
  border-color: #e2bd72;
}
.automatic-sync-banner.error {
  background: var(--danger-bg);
  border-color: #e0a1a1;
  color: var(--danger);
}
.automatic-sync-copy {
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.automatic-sync-copy strong {
  font-size: .96rem;
}
.automatic-sync-copy span {
  font-size: .86rem;
  color: inherit;
  opacity: .88;
}
.automatic-sync-progress-wrap {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) 48px;
  gap: .65rem;
  align-items: center;
}
.automatic-sync-progress-track {
  height: 10px;
  overflow: hidden;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(10,51,51,.18);
  border-radius: 999px;
}
.automatic-sync-progress-fill {
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--gold));
  transition: width .25s ease;
}
#automaticSyncPercent {
  text-align: right;
  font-weight: 800;
  font-size: .84rem;
}
.automatic-update-note {
  margin-top: 0;
}
@media (max-width: 850px) {
  .automatic-sync-banner {
    grid-template-columns: 1fr;
  }
}


/* Version 0.6.5: ausklappbare Filter und reduzierte Eigenbestellungs-Tabelle */
.order-filter-panel {
  padding: .75rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
}
#ownOrderFilterToggle,
#teamOrderFilterToggle {
  min-width: 126px;
}
.own-order-table {
  min-width: 760px;
}

/* Version 0.6.6: historische PP-Werte im technischen Setup */
.pp-history-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin: 1rem 0 .8rem;
}
.pp-history-header h3 {
  margin: .2rem 0 .35rem;
}
.pp-history-header p {
  margin: 0;
  max-width: 980px;
  color: var(--text-muted);
}
.pp-history-stats {
  display: grid;
  grid-template-columns: repeat(7, minmax(120px, 1fr));
  gap: .55rem;
  margin: .75rem 0;
}
.pp-history-stats article {
  padding: .68rem .72rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
  min-width: 0;
}
.pp-history-stats strong {
  display: block;
  margin-bottom: .15rem;
  color: var(--accent-deep);
  font-size: 1.02rem;
  overflow-wrap: anywhere;
}
.pp-history-stats span {
  color: var(--text-muted);
  font-size: .78rem;
}
.pp-history-meta {
  margin: .55rem 0;
  font-size: .86rem;
  color: var(--text-muted);
}
.pp-history-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 520px);
  gap: .65rem;
  margin: .65rem 0;
}
.pp-history-toolbar label {
  display: grid;
  gap: .3rem;
  font-size: .86rem;
}
.pp-history-toolbar input {
  padding: .58rem .65rem;
}
.pp-history-table-wrap {
  min-height: 300px;
  max-height: 680px;
}
.pp-history-table {
  width: 100%;
  min-width: 1080px;
  border-collapse: collapse;
  font-size: .84rem;
}
.pp-history-table th,
.pp-history-table td {
  padding: .5rem .58rem;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
  text-align: left;
}
.pp-history-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--accent-deep);
  color: #fff;
  white-space: nowrap;
}
.pp-history-table .number-cell {
  text-align: right;
  white-space: nowrap;
}
.pp-history-table small {
  display: block;
  margin-top: .15rem;
  color: var(--text-muted);
  font-size: .72rem;
}
.pp-current-row {
  background: #fff9e7;
}
.pp-current-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  padding: .23rem .5rem;
  border-radius: 999px;
  background: var(--gold);
  color: var(--accent-deep);
  font-weight: 800;
  text-transform: lowercase;
}
.pp-source-text {
  display: block;
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 1200px) {
  .pp-history-stats {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }
}
@media (max-width: 760px) {
  .pp-history-header {
    flex-direction: column;
  }
  .pp-history-stats {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }
}

/* Version 0.6.8: hochwertiges Dashboard für Admin und Ambassadors */
.dashboard-panel{padding:0;overflow:hidden;border-radius:18px;background:#062f31;border-color:rgba(213,180,95,.55)}
.premium-dashboard{min-height:640px;padding:clamp(1.1rem,2vw,1.8rem);color:#f8f5ea;background:radial-gradient(circle at 88% 8%,rgba(36,137,134,.28),transparent 29%),radial-gradient(circle at 12% 92%,rgba(213,180,95,.10),transparent 24%),linear-gradient(145deg,#062f31 0%,#083f41 56%,#052a2c 100%)}
.premium-dashboard-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1.5rem;margin-bottom:1.25rem}
.premium-dashboard-header h2{margin:.25rem 0 .35rem;color:#fffdf6;font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.8rem,3vw,2.55rem);font-weight:500}
.premium-dashboard-header p{margin:0;color:rgba(248,245,234,.72)}
.premium-kicker{color:var(--gold);text-transform:uppercase;letter-spacing:.13em;font-size:.72rem;font-weight:800}
.dashboard-status-strip{display:flex;align-items:stretch;gap:.65rem;flex-wrap:wrap;justify-content:flex-end}
.dashboard-status-strip>div{min-width:150px;padding:.65rem .8rem;border:1px solid rgba(213,180,95,.34);border-radius:10px;background:rgba(255,255,255,.035)}
.dashboard-status-strip span{display:block;margin-bottom:.2rem;color:rgba(248,245,234,.58);font-size:.72rem}
.dashboard-status-strip strong{color:#f2df91;font-size:.88rem}
button.dashboard-outline-button{padding-inline:1rem;background:transparent;border-color:rgba(213,180,95,.75);color:#f2df91}
button.dashboard-outline-button:hover{background:rgba(213,180,95,.13);border-color:#f2df91}
.dashboard-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:.75rem;margin-bottom:.8rem}
.dashboard-kpi-card{min-height:108px;display:flex;align-items:center;gap:.8rem;padding:.9rem;border:1px solid rgba(213,180,95,.28);border-radius:12px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.dashboard-kpi-icon{flex:0 0 38px;width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(213,180,95,.65);border-radius:50%;color:#f2cf68;font-size:1.1rem;font-weight:800}
.dashboard-kpi-card div{min-width:0}.dashboard-kpi-card div>span{display:block;color:rgba(248,245,234,.68);font-size:.76rem;font-weight:700}.dashboard-kpi-card strong{display:block;margin:.12rem 0;color:#fffdf6;font-size:clamp(1.18rem,2vw,1.55rem);line-height:1.1;overflow-wrap:anywhere}.dashboard-kpi-card small{color:rgba(248,245,234,.48);font-size:.7rem}
.dashboard-main-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.72fr) minmax(230px,.55fr);gap:.75rem}.ambassador-dashboard-grid{grid-template-columns:1fr;margin-top:.8rem}
.dashboard-widget{min-width:0;padding:.95rem;border:1px solid rgba(213,180,95,.26);border-radius:12px;background:rgba(3,31,33,.46)}
.dashboard-widget-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:.65rem}.dashboard-widget-heading>div>span,.dashboard-widget-heading>span:first-child{display:block;color:#d5b45f;text-transform:uppercase;letter-spacing:.1em;font-size:.65rem;font-weight:800}.dashboard-widget-heading h3{margin:.18rem 0 0;color:#fffdf6;font-family:Georgia,"Times New Roman",serif;font-size:1.05rem;font-weight:500}.dashboard-widget-note{color:rgba(248,245,234,.58);font-size:.75rem;white-space:nowrap}.dashboard-widget-note strong{color:#f2df91}
.dashboard-chart{min-height:220px}.dashboard-chart-compact{min-height:220px}.dashboard-chart svg{display:block;width:100%;height:auto;overflow:visible}.dashboard-chart-grid{stroke:rgba(255,255,255,.10);stroke-width:1}.dashboard-chart-line{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.dashboard-chart-line.series-1{stroke:#e2bd58}.dashboard-chart-line.series-2{stroke:#28b2aa}.dashboard-chart-dot.series-1{fill:#e2bd58;stroke:#062f31;stroke-width:2}.dashboard-chart-dot.series-2{fill:#28b2aa;stroke:#062f31;stroke-width:2}.dashboard-chart-label{fill:rgba(248,245,234,.64);font-size:18px;font-family:Inter,sans-serif}
.dashboard-chart-legend{display:flex;flex-wrap:wrap;gap:.7rem;color:rgba(248,245,234,.72);font-size:.72rem}.dashboard-chart-legend span::before{content:"";display:inline-block;width:8px;height:8px;margin-right:.35rem;border-radius:50%}.legend-ambassadors::before{background:#e2bd58}.legend-customers::before{background:#28b2aa}
.dashboard-quick-links{display:grid;gap:.55rem}.dashboard-quick-links button{justify-content:flex-start;background:rgba(255,255,255,.055);border-color:rgba(213,180,95,.24);color:#f8f5ea}.dashboard-quick-links button:hover{background:rgba(213,180,95,.14);border-color:rgba(213,180,95,.68)}
.dashboard-technical-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:.55rem;margin-top:.75rem}.dashboard-technical-strip article{padding:.65rem .75rem;border-top:1px solid rgba(213,180,95,.28);background:rgba(255,255,255,.018)}.dashboard-technical-strip span{display:block;color:rgba(248,245,234,.46);font-size:.68rem}.dashboard-technical-strip strong{display:block;margin-top:.2rem;color:#f2df91;font-size:.9rem}.dashboard-result{margin-bottom:0;background:rgba(40,178,170,.10)!important;border-color:rgba(40,178,170,.35)!important;color:#ccf6ef!important}
.activation-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.9rem;align-items:center;margin:.75rem 0 0;padding:.85rem 1rem;border:1px solid rgba(213,180,95,.35);border-radius:12px;background:rgba(255,255,255,.04)}.activation-indicator{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.09);font-weight:900;letter-spacing:-.1em}.activation-card>div:nth-child(2)>span{color:rgba(248,245,234,.58);font-size:.72rem;font-weight:700}.activation-card h3{margin:.08rem 0;color:#fffdf6;font-size:1.05rem}.activation-card p{margin:0;color:rgba(248,245,234,.68);font-size:.82rem}.activation-card button{white-space:nowrap}.activation-card.active{border-color:rgba(55,190,128,.65);background:rgba(24,124,78,.20)}.activation-card.active .activation-indicator{background:#147b50;color:white}.activation-card.neutral{border-color:rgba(89,177,173,.48)}.activation-card.neutral .activation-indicator{background:rgba(40,178,170,.22);color:#9ce5df}.activation-card.warning{border-color:#e1c55e;background:rgba(188,151,28,.18)}.activation-card.warning .activation-indicator{background:#d6b53e;color:#342b08}.activation-card.urgent{border-color:#e28a42;background:rgba(190,94,25,.20)}.activation-card.urgent .activation-indicator{background:#d86f29;color:white}.activation-card.critical{border-color:#e05a55;background:rgba(164,42,38,.24)}.activation-card.critical .activation-indicator{background:#b8322e;color:white}
.dashboard-level-list{display:flex;flex-direction:column;gap:.45rem;max-height:270px;overflow:auto;padding-right:.2rem}.dashboard-level-row{display:grid;grid-template-columns:80px 1fr 1fr auto;gap:.55rem;align-items:center;padding:.62rem .7rem;border:1px solid rgba(213,180,95,.18);border-radius:8px;background:rgba(255,255,255,.035);color:rgba(248,245,234,.72);font-size:.76rem}.dashboard-level-row strong{color:#f2df91}.dashboard-level-row b{color:#fffdf6}.dashboard-level-total{color:rgba(248,245,234,.48);white-space:nowrap}.dashboard-empty{min-height:90px;display:grid;place-items:center;padding:1rem;border:1px dashed rgba(213,180,95,.25);border-radius:8px;color:rgba(248,245,234,.55);text-align:center}
.ambassador-contact-widget{margin-top:.75rem}.premium-dashboard .ambassador-dashboard-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.premium-dashboard .ambassador-dashboard-row{grid-template-columns:minmax(150px,.65fr) minmax(0,1.35fr);padding:.7rem .8rem;border-color:rgba(213,180,95,.20);background:rgba(255,255,255,.035)}.premium-dashboard .ambassador-dashboard-label{color:rgba(248,245,234,.55)}.premium-dashboard .ambassador-dashboard-row strong,.premium-dashboard .ambassador-dashboard-row a{color:#f8f5ea;font-size:.88rem}.premium-dashboard .copy-link-button{background:rgba(255,255,255,.05);color:#f2df91;border-color:rgba(213,180,95,.45)}.premium-dashboard .dashboard-action-link{padding:.45rem .65rem;background:rgba(213,180,95,.14);border-color:rgba(213,180,95,.56);color:#f2df91!important}
@media(max-width:1280px){.dashboard-kpi-grid{grid-template-columns:repeat(3,minmax(170px,1fr))}.dashboard-main-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-widget-wide{grid-column:1/-1}.dashboard-technical-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.premium-dashboard-header{flex-direction:column}.dashboard-status-strip{justify-content:flex-start;width:100%}.dashboard-kpi-grid,.dashboard-main-grid,.ambassador-dashboard-grid,.dashboard-technical-strip,.premium-dashboard .ambassador-dashboard-list{grid-template-columns:1fr}.dashboard-widget-wide{grid-column:auto}.activation-card{grid-template-columns:auto 1fr}.activation-card button{grid-column:1/-1}.dashboard-level-row{grid-template-columns:80px 1fr 1fr}.dashboard-level-total{grid-column:2/-1}.premium-dashboard .ambassador-dashboard-row{grid-template-columns:1fr}}

/* Version 0.6.9: moderne GAIAVIDA-Bestellansichten für Menü 03 und 04 */
.order-premium-panel {
  --order-deep: #052d2f;
  --order-mid: #073d3f;
  --order-card: rgba(3, 31, 33, .62);
  --order-line: rgba(213, 180, 95, .28);
  --order-cream: #f8f5ea;
  position: relative;
  overflow: hidden;
  padding: clamp(1.1rem, 2vw, 1.65rem);
  color: var(--order-cream);
  border-color: rgba(213, 180, 95, .52);
  border-radius: 18px;
  background:
    radial-gradient(circle at 91% 4%, rgba(36, 137, 134, .29), transparent 30%),
    radial-gradient(circle at 8% 92%, rgba(213, 180, 95, .10), transparent 25%),
    linear-gradient(145deg, var(--order-deep) 0%, var(--order-mid) 58%, #04292b 100%);
  box-shadow: 0 20px 58px rgba(4, 45, 46, .22);
}
.order-premium-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image:
    radial-gradient(circle at 14% 18%, rgba(242, 223, 145, .13) 0 1px, transparent 1.6px),
    radial-gradient(circle at 78% 72%, rgba(242, 223, 145, .09) 0 1px, transparent 1.6px);
  background-size: 54px 54px, 72px 72px;
}
.order-premium-panel > * { position: relative; z-index: 1; }
.order-premium-header {
  align-items: flex-end;
  padding-bottom: 1.15rem;
  border-bottom-color: rgba(213, 180, 95, .25);
}
.order-premium-heading { max-width: 930px; }
.order-premium-heading .step {
  color: #d5b45f;
  letter-spacing: .14em;
}
.order-premium-heading h2 {
  margin: .32rem 0 .42rem;
  color: #fffdf6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 3.5vw, 3.35rem);
  font-weight: 500;
  line-height: 1.03;
}
.order-premium-heading p {
  max-width: 900px;
  color: rgba(248, 245, 234, .70);
  font-size: .96rem;
}
.order-header-actions { justify-content: flex-end; }
.order-premium-panel .order-header-actions button.secondary {
  min-height: 44px;
  background: rgba(255, 255, 255, .045);
  color: #f2df91;
  border-color: rgba(213, 180, 95, .62);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}
.order-premium-panel .order-header-actions button.secondary:hover {
  background: rgba(213, 180, 95, .15);
  color: #fff8dc;
  border-color: #f2df91;
}
.order-premium-panel .result {
  color: #d6f8f1;
  border-color: rgba(40, 178, 170, .40);
  background: rgba(40, 178, 170, .12);
}
.order-premium-panel .result.warning {
  color: #fff2bd;
  border-color: rgba(225, 197, 94, .55);
  background: rgba(188, 151, 28, .16);
}
.order-premium-stats {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: .72rem;
  margin: .9rem 0;
}
.order-premium-stats article {
  min-height: 94px;
  display: flex;
  align-items: center;
  gap: .72rem;
  padding: .78rem .84rem;
  border-color: rgba(213, 180, 95, .27);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255,255,255,.058), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.order-premium-stats article > div { min-width: 0; }
.order-stat-icon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(213, 180, 95, .68);
  border-radius: 50%;
  color: #f2cf68;
  font-size: .96rem;
  font-weight: 900;
  line-height: 1;
}
.order-stat-icon:nth-child(n) { letter-spacing: -.03em; }
.order-premium-stats article:nth-child(4) .order-stat-icon { font-size: .58rem; }
.order-premium-stats strong {
  margin: 0 0 .12rem;
  color: #fffdf6;
  font-size: clamp(1.08rem, 1.75vw, 1.42rem);
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.order-premium-stats article:last-child strong { font-size: .82rem; line-height: 1.25; }
.order-premium-stats article div > span {
  color: rgba(248, 245, 234, .58);
  font-size: .73rem;
  font-weight: 700;
}
.order-list-card {
  margin-top: .75rem;
  padding: .92rem;
  border: 1px solid rgba(213, 180, 95, .27);
  border-radius: 14px;
  background: rgba(3, 31, 33, .51);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 13px 32px rgba(0,0,0,.10);
}
.order-list-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: .1rem .1rem .8rem;
}
.order-list-heading > div > span {
  display: block;
  color: #d5b45f;
  text-transform: uppercase;
  letter-spacing: .11em;
  font-size: .65rem;
  font-weight: 800;
}
.order-list-heading h3 {
  margin: .18rem 0 0;
  color: #fffdf6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.16rem;
  font-weight: 500;
}
.order-list-hint {
  color: rgba(248, 245, 234, .48);
  font-size: .74rem;
  text-align: right;
}
.order-premium-panel .order-filter-panel {
  margin: 0 0 .75rem;
  padding: .78rem;
  border-color: rgba(213, 180, 95, .32);
  background: rgba(255, 255, 255, .035);
}
.order-premium-panel .order-filter-panel label {
  color: #f2df91;
  font-size: .78rem;
}
.order-premium-panel .order-filter-panel input,
.order-premium-panel .order-filter-panel select {
  min-height: 42px;
  color: #fffdf6;
  border-color: rgba(213, 180, 95, .34);
  background: rgba(2, 26, 28, .72);
}
.order-premium-panel .order-filter-panel input::placeholder { color: rgba(248, 245, 234, .42); }
.order-premium-panel .order-filter-panel select option { color: #1f2933; background: #fff; }
.order-premium-panel .order-filter-panel input:focus,
.order-premium-panel .order-filter-panel select:focus {
  outline: 3px solid rgba(213, 180, 95, .14);
  border-color: #d5b45f;
}
.order-premium-panel .order-table-wrap {
  min-height: 360px;
  max-height: 690px;
  border-color: rgba(213, 180, 95, .30);
  border-radius: 11px;
  background: rgba(2, 25, 27, .52);
  scrollbar-color: rgba(213, 180, 95, .55) rgba(255,255,255,.04);
}
.order-premium-panel .order-table {
  color: #fff;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: .9rem;
  font-weight: 500;
  text-shadow: none;
}
.order-premium-panel .order-table th {
  padding: .62rem .62rem;
  color: #f2df91;
  border-bottom-color: rgba(213, 180, 95, .42);
  background: rgba(8, 63, 65, .97);
  box-shadow: 0 1px 0 rgba(255,255,255,.025);
}
.order-premium-panel .order-table td {
  padding: .55rem .62rem;
  color: #fff;
  border-bottom-color: rgba(213, 180, 95, .12);
  background: transparent;
}
.order-premium-panel .order-table tbody tr:nth-child(even):not(.team-level-row) {
  background: rgba(255,255,255,.018);
}
.order-premium-panel .order-table tbody tr:hover:not(.team-level-row) {
  background: rgba(213, 180, 95, .075);
}
.order-premium-panel .order-table small { color: #d7e5e4; }
.order-premium-panel .order-status {
  min-height: 25px;
  padding: .22rem .5rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.order-premium-panel .order-status.success {
  color: #fff;
  border-color: rgba(75, 199, 135, .42);
  background: rgba(29, 126, 79, .27);
}
.order-premium-panel .order-status.warning {
  color: #fff;
  border-color: rgba(225, 197, 94, .44);
  background: rgba(166, 125, 18, .24);
}
.order-premium-panel .order-status.danger {
  color: #fff;
  border-color: rgba(224, 90, 85, .46);
  background: rgba(154, 45, 42, .26);
}
.order-premium-panel .order-status.neutral {
  color: #fff;
  border-color: rgba(166, 196, 194, .30);
  background: rgba(135, 165, 165, .13);
}
.order-premium-panel .order-number-button {
  color: #f2df91;
  font-weight: 850;
}
.order-premium-panel .order-number-button:hover { color: #fff8dc; text-decoration: underline; }
.order-premium-panel .invoice-button {
  color: #f2df91;
  border-color: rgba(213, 180, 95, .55);
  background: rgba(213, 180, 95, .09);
}
.order-premium-panel .invoice-button:hover {
  color: #052d2f;
  border-color: #f2df91;
  background: #f2df91;
}
.order-premium-panel .invoice-missing { color: rgba(248, 245, 234, .42); font-size: .75rem; }
.order-premium-panel .team-level-row td {
  padding: .62rem .72rem;
  color: #fffdf6;
  border-top: 1px solid rgba(213, 180, 95, .48);
  border-bottom: 1px solid rgba(213, 180, 95, .42);
  background: linear-gradient(90deg, rgba(213,180,95,.18), rgba(20,102,102,.36));
}
.order-premium-panel .team-level-row strong { color: #f2df91; }
.order-premium-panel .team-level-row span { color: rgba(248,245,234,.78); }
.order-premium-panel .empty-state {
  color: rgba(248, 245, 234, .55);
  border: 1px dashed rgba(213, 180, 95, .23);
  background: rgba(255,255,255,.025);
}
.order-premium-panel .pagination { margin: .8rem 0 .05rem; }
.order-premium-panel .pagination span { color: rgba(248,245,234,.60); font-size: .82rem; }
.order-premium-panel .pagination button.secondary {
  min-width: 88px;
  color: #f2df91;
  border-color: rgba(213,180,95,.45);
  background: rgba(255,255,255,.035);
}
.order-premium-panel .pagination button.secondary:hover:not(:disabled) {
  color: #fff8dc;
  border-color: #f2df91;
  background: rgba(213,180,95,.13);
}
.order-detail-premium {
  color: #f8f5ea;
  border: 1px solid rgba(213,180,95,.58);
  background: radial-gradient(circle at 90% 6%,rgba(36,137,134,.24),transparent 30%),linear-gradient(145deg,#052d2f,#073d3f 58%,#04292b);
}
.order-detail-premium .modal-header { border-bottom-color: rgba(213,180,95,.28); }
.order-detail-premium .modal-header h2 { color: #fffdf6; font-family: Georgia,"Times New Roman",serif; font-weight: 500; }
.order-detail-premium .modal-header p { color: rgba(248,245,234,.62); }
.order-detail-premium .modal-header .step { color: #d5b45f; }
.order-detail-premium .modal-header button.secondary { color:#f2df91;border-color:rgba(213,180,95,.58);background:rgba(255,255,255,.04); }
.order-detail-premium .order-detail-summary article { border-color:rgba(213,180,95,.24);background:rgba(255,255,255,.035); }
.order-detail-premium .order-detail-summary span { color:rgba(248,245,234,.52); }
.order-detail-premium .order-detail-summary strong { color:#f2df91; }
.order-detail-premium .table-wrap { border-color:rgba(213,180,95,.28); }
.order-detail-premium table { color:rgba(248,245,234,.82); }
.order-detail-premium th { color:#f2df91;border-bottom-color:rgba(213,180,95,.4);background:#083f41; }
.order-detail-premium td { border-bottom-color:rgba(213,180,95,.12); }
.order-detail-premium tbody tr:hover { background:rgba(213,180,95,.07); }
@media (max-width: 1280px) {
  .order-premium-stats { grid-template-columns: repeat(3, minmax(170px, 1fr)); }
}
@media (max-width: 820px) {
  .order-premium-header,
  .order-list-heading { flex-direction: column; align-items: stretch; }
  .order-header-actions { justify-content: flex-start; }
  .order-list-hint { text-align: left; }
  .order-premium-stats { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .order-premium-stats { grid-template-columns: 1fr; }
  .order-premium-panel { padding: .85rem; }
}

/* Version 0.7.0: PP-Historie um historische und aktuelle Verkaufspreise erweitert. */

/* Version 0.7.3: modernes hochwertiges GAIAVIDA-Design für Menü 01 Netzwerk */
.network-premium-panel {
  --network-deep: #052d2f;
  --network-mid: #073d3f;
  --network-card: rgba(3, 31, 33, .62);
  --network-line: rgba(213, 180, 95, .28);
  --network-cream: #f8f5ea;
  position: relative;
  overflow: hidden;
  padding: clamp(1.1rem, 2vw, 1.65rem);
  color: var(--network-cream);
  border-color: rgba(213, 180, 95, .52);
  border-radius: 18px;
  background:
    radial-gradient(circle at 91% 4%, rgba(36, 137, 134, .29), transparent 30%),
    radial-gradient(circle at 8% 92%, rgba(213, 180, 95, .10), transparent 25%),
    linear-gradient(145deg, var(--network-deep) 0%, var(--network-mid) 58%, #04292b 100%);
  box-shadow: 0 20px 58px rgba(4, 45, 46, .22);
}
.network-premium-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image:
    radial-gradient(circle at 14% 18%, rgba(242, 223, 145, .13) 0 1px, transparent 1.6px),
    radial-gradient(circle at 78% 72%, rgba(242, 223, 145, .09) 0 1px, transparent 1.6px);
  background-size: 54px 54px, 72px 72px;
}
.network-premium-panel > * { position: relative; z-index: 1; }
.network-premium-header {
  align-items: flex-end;
  padding-bottom: 1.15rem;
  border-bottom-color: rgba(213, 180, 95, .25);
}
.network-premium-heading { max-width: 850px; }
.network-premium-heading .step {
  color: #d5b45f;
  letter-spacing: .14em;
}
.network-premium-heading h2 {
  margin: .32rem 0 .42rem;
  color: #fffdf6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 3.5vw, 3.35rem);
  font-weight: 500;
  line-height: 1.03;
}
.network-premium-heading p {
  max-width: 860px;
  margin: 0;
  color: rgba(248, 245, 234, .70);
  font-size: .96rem;
}
.network-header-actions { justify-content: flex-end; }
.network-premium-panel .network-header-actions button {
  min-height: 42px;
  padding: .62rem .8rem;
  border-radius: 10px;
  font-size: .78rem;
}
.network-premium-panel .network-header-actions button:not(.secondary) {
  color: #052d2f;
  border-color: #f2df91;
  background: linear-gradient(135deg, #f0d78c, #cda64b);
  box-shadow: 0 8px 22px rgba(0,0,0,.16);
}
.network-premium-panel .network-header-actions button:not(.secondary):hover {
  background: linear-gradient(135deg, #fff0b5, #d5b45f);
}
.network-premium-panel .network-header-actions button.secondary {
  background: rgba(255, 255, 255, .045);
  color: #f2df91;
  border-color: rgba(213, 180, 95, .60);
}
.network-premium-panel .network-header-actions button.secondary:hover {
  background: rgba(213, 180, 95, .15);
  color: #fff8dc;
  border-color: #f2df91;
}
.network-explanation-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .85rem;
  align-items: center;
  margin: .9rem 0;
  padding: .82rem .92rem;
  border: 1px solid rgba(213, 180, 95, .28);
  border-radius: 12px;
  background: rgba(3, 31, 33, .46);
  color: var(--network-cream);
}
.network-explanation-card .network-explanation-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(213, 180, 95, .65);
  border-radius: 50%;
  color: #f2cf68;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
}
.network-explanation-card strong {
  display: block;
  margin-bottom: .18rem;
  color: #f2df91;
  font-size: .88rem;
}
.network-explanation-card p {
  margin: 0;
  color: rgba(248, 245, 234, .68);
  font-size: .82rem;
  line-height: 1.5;
}
.network-mapping-card {
  margin: .8rem 0;
  padding: .82rem;
  border: 1px solid rgba(213, 180, 95, .24);
  border-radius: 12px;
  background: rgba(3, 31, 33, .50);
}
.network-premium-panel .network-mapping-card label {
  color: #f2df91;
  font-size: .79rem;
}
.network-premium-panel .network-mapping-card select,
.network-premium-panel .network-search-toolbar input {
  min-height: 44px;
  color: #fffdf6;
  border-color: rgba(213, 180, 95, .40);
  background: rgba(1, 25, 27, .62);
}
.network-premium-panel .network-mapping-card select:focus,
.network-premium-panel .network-search-toolbar input:focus {
  outline: 3px solid rgba(213, 180, 95, .18);
  border-color: #d5b45f;
}
.network-premium-panel .network-mapping-card select option { color: #1f2933; background: white; }
.network-premium-panel .mapping-note {
  align-self: stretch;
  display: flex;
  align-items: center;
  padding: .72rem .8rem;
  color: rgba(248, 245, 234, .68);
  border: 1px solid rgba(213, 180, 95, .18);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
  font-size: .78rem;
  line-height: 1.45;
}
.network-premium-panel .result {
  color: #d6f8f1;
  border-color: rgba(40, 178, 170, .40);
  background: rgba(40, 178, 170, .12);
}
.network-premium-panel .result.warning {
  color: #fff2bd;
  border-color: rgba(225, 197, 94, .55);
  background: rgba(188, 151, 28, .16);
}
.network-premium-stats {
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: .68rem;
  margin: .9rem 0;
}
.network-premium-stats article {
  min-height: 88px;
  display: flex;
  align-items: center;
  gap: .72rem;
  padding: .76rem .82rem;
  border: 1px solid rgba(213, 180, 95, .27);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255,255,255,.058), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.network-premium-stats article > div { min-width: 0; }
.network-stat-icon {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(213, 180, 95, .68);
  border-radius: 50%;
  color: #f2cf68;
  font-size: .9rem;
  font-weight: 900;
}
.network-stat-icon-warning {
  color: #ffd786;
  border-color: rgba(255, 190, 74, .68);
  background: rgba(174, 99, 12, .12);
}
.network-premium-stats strong {
  display: block;
  margin: 0 0 .12rem;
  color: #fffdf6;
  font-size: clamp(1.08rem, 1.75vw, 1.42rem);
  line-height: 1.08;
}
.network-premium-stats article div > span {
  color: rgba(248, 245, 234, .58);
  font-size: .73rem;
  font-weight: 700;
}
.network-tree-card {
  margin-top: .75rem;
  padding: .92rem;
  border: 1px solid rgba(213, 180, 95, .27);
  border-radius: 14px;
  background: rgba(3, 31, 33, .51);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 13px 32px rgba(0,0,0,.10);
}
.network-tree-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  padding: .1rem .1rem .8rem;
}
.network-tree-heading > div:first-child > span {
  display: block;
  color: #d5b45f;
  text-transform: uppercase;
  letter-spacing: .11em;
  font-size: .65rem;
  font-weight: 800;
}
.network-tree-heading h3 {
  margin: .18rem 0 0;
  color: #fffdf6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.35rem, 2.2vw, 1.9rem);
  font-weight: 500;
}
.network-search-toolbar {
  width: min(560px, 100%);
  margin: 0;
}
.network-search-toolbar label {
  max-width: none;
  color: #f2df91;
  font-size: .78rem;
}
.network-search-toolbar input::placeholder { color: rgba(248,245,234,.42); }
.network-premium-panel .genealogy-issues {
  margin: .3rem 0 .8rem;
  color: #fff1bd;
  border-color: rgba(225, 197, 94, .44);
  background: rgba(188, 151, 28, .15);
}
.network-premium-tree {
  margin-top: 0;
  min-height: 290px;
  max-height: 720px;
  padding: .78rem;
  border: 1px solid rgba(213, 180, 95, .20);
  border-radius: 12px;
  background: rgba(1, 23, 25, .46);
  scrollbar-color: rgba(213,180,95,.55) rgba(255,255,255,.04);
}
.network-premium-panel .genealogy-tree .empty-state {
  color: rgba(248,245,234,.62);
  border: 1px dashed rgba(213,180,95,.28);
  background: rgba(255,255,255,.028);
  text-align: center;
}
.network-premium-panel .genealogy-node { margin: .5rem 0; }
.network-premium-panel .genealogy-node-row {
  max-width: none;
  padding: .7rem .74rem;
  color: var(--network-cream);
  border: 1px solid rgba(213, 180, 95, .28);
  border-left: 4px solid #28a29e;
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(12, 82, 79, .72), rgba(5, 52, 53, .84));
  box-shadow: 0 7px 18px rgba(0,0,0,.13), inset 0 1px 0 rgba(255,255,255,.025);
}
.network-premium-panel .genealogy-node-row:hover {
  border-color: rgba(242, 223, 145, .72);
  border-left-color: #f2cf68;
  background: linear-gradient(145deg, rgba(15, 92, 88, .78), rgba(6, 61, 62, .92));
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}
.network-premium-panel .genealogy-search-match {
  outline: 2px solid rgba(242, 223, 145, .76);
  background: linear-gradient(145deg, rgba(21, 103, 96, .82), rgba(7, 64, 64, .94));
}
.network-premium-panel .genealogy-toggle {
  color: #052d2f;
  border-color: #f2df91;
  background: linear-gradient(135deg, #f0d78c, #cda64b);
}
.network-premium-panel .genealogy-toggle:hover {
  color: #052d2f;
  border-color: #fff0b5;
  background: linear-gradient(135deg, #fff0b5, #d5b45f);
}
.network-premium-panel .genealogy-level {
  color: #f2df91;
  border: 1px solid rgba(213,180,95,.42);
  background: rgba(3,31,33,.46);
}
.network-premium-panel .genealogy-person strong {
  color: #fffdf6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.04rem;
  font-weight: 500;
}
.network-premium-panel .genealogy-person span,
.network-premium-panel .genealogy-customer-person span {
  color: rgba(248,245,234,.62);
}
.network-premium-panel .genealogy-person .genealogy-join-date,
.network-premium-panel .genealogy-customer-person .genealogy-join-date {
  color: #d8c574;
}
.network-premium-panel .genealogy-identifiers span { color: rgba(248,245,234,.78); }
.network-premium-panel .genealogy-identifiers b { color: #f2df91; }
.network-premium-panel .direct-count { color: rgba(248,245,234,.66); }
.network-premium-panel .genealogy-no-customers { color: rgba(248,245,234,.45); }
.network-premium-panel .genealogy-action-buttons button.secondary {
  padding: .42rem .62rem;
  color: #f2df91;
  border-color: rgba(213,180,95,.48);
  background: rgba(3,31,33,.54);
}
.network-premium-panel .genealogy-action-buttons button.secondary:hover {
  color: #052d2f;
  border-color: #f2df91;
  background: #f2df91;
}
.network-premium-panel .genealogy-badge {
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(248,245,234,.76);
  background: rgba(255,255,255,.07);
}
.network-premium-panel .genealogy-badge.status-root {
  color: #b8f1d3;
  border-color: rgba(82,193,135,.42);
  background: rgba(31,127,78,.22);
}
.network-premium-panel .genealogy-badge.status-unresolved {
  color: #ffe7a0;
  border-color: rgba(225,197,94,.45);
  background: rgba(188,151,28,.18);
}
.network-premium-panel .genealogy-badge.status-ambiguous {
  color: #e1c8ff;
  border-color: rgba(163,115,210,.45);
  background: rgba(104,66,141,.22);
}
.network-premium-panel .genealogy-badge.status-cycle {
  color: #ffc5c2;
  border-color: rgba(224,90,85,.48);
  background: rgba(164,42,38,.24);
}
.network-premium-panel .genealogy-status-unresolved > .genealogy-node-row { border-left-color: #d3a12e; }
.network-premium-panel .genealogy-status-ambiguous > .genealogy-node-row { border-left-color: #a574d2; }
.network-premium-panel .genealogy-status-cycle > .genealogy-node-row { border-left-color: #e05a55; }
.network-premium-panel .genealogy-children {
  border-left-color: rgba(213,180,95,.42);
}
.network-premium-panel .genealogy-children::before {
  border-top-color: rgba(213,180,95,.42);
}
.network-premium-panel .genealogy-direct-customers {
  max-width: none;
  border-color: rgba(213,180,95,.28);
  border-left-color: #d5b45f;
  background: rgba(1, 25, 27, .50);
}
.network-premium-panel .genealogy-customer-list-heading { color: #fffdf6; }
.network-premium-panel .genealogy-customer-list-heading span { color: rgba(248,245,234,.52); }
.network-premium-panel button.genealogy-direct-customer-row {
  max-width: none;
  color: var(--network-cream);
  border-color: rgba(213,180,95,.22);
  background: rgba(255,255,255,.045);
}
.network-premium-panel button.genealogy-direct-customer-row:hover {
  color: var(--network-cream);
  border-color: rgba(242,223,145,.68);
  background: rgba(213,180,95,.11);
}
.network-premium-panel .genealogy-customer-type {
  color: #052d2f;
  border: 1px solid rgba(242,223,145,.72);
  background: #e4c96d;
}
.network-premium-panel .genealogy-customer-person strong {
  color: #fffdf6;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
}
.network-premium-panel .genealogy-customer-sponsor { color: rgba(248,245,234,.74); }
.network-premium-panel .genealogy-customer-sponsor b { color: #f2df91; }
.network-premium-panel .genealogy-customer-detail-hint { color: #f2df91; }
.network-premium-panel .genealogy-direct-customer-row:disabled,
.network-premium-panel .genealogy-customer-button:disabled,
.network-premium-panel .genealogy-detail-restricted {
  opacity: .62;
}
body.ambassador-view .network-premium-panel .genealogy-rule {
  background: rgba(3,31,33,.46);
  border-color: rgba(213,180,95,.28);
}
@media (max-width: 1300px) {
  .network-premium-stats { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
  .network-premium-header { align-items: flex-start; }
  .network-header-actions { max-width: 520px; }
}
@media (max-width: 900px) {
  .network-premium-header,
  .network-tree-heading { flex-direction: column; align-items: stretch; }
  .network-header-actions { justify-content: flex-start; max-width: none; }
  .network-search-toolbar { width: 100%; }
  .network-mapping-card { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .network-premium-stats { grid-template-columns: 1fr; }
  .network-explanation-card { grid-template-columns: 1fr; }
  .network-premium-panel .network-header-actions button { width: 100%; }
  .network-premium-tree { padding: .5rem; }
}

/* Version 0.7.4: hochwertiges GAIAVIDA-Redesign der Seitenleiste */
.app-shell {
  grid-template-columns: 296px minmax(0, 1fr);
}
.sidebar {
  --sidebar-gold: #d5b45f;
  --sidebar-gold-soft: #f2df91;
  --sidebar-cream: #fffaf0;
  --sidebar-muted: rgba(244, 239, 222, .62);
  position: sticky;
  isolation: isolate;
  top: 0;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 1.05rem .9rem 1.25rem;
  gap: .85rem;
  color: var(--sidebar-cream);
  border-right: 1px solid rgba(213, 180, 95, .30);
  background:
    radial-gradient(circle at 35% -2%, rgba(213, 180, 95, .16), transparent 28%),
    radial-gradient(circle at 110% 55%, rgba(31, 139, 132, .19), transparent 34%),
    linear-gradient(180deg, #052c2f 0%, #073a3d 45%, #052d30 100%);
  box-shadow: 14px 0 38px rgba(1, 31, 33, .16);
  scrollbar-width: thin;
  scrollbar-color: rgba(213,180,95,.52) rgba(255,255,255,.035);
}
.sidebar::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  opacity: .46;
  background:
    linear-gradient(135deg, transparent 0 47%, rgba(255,255,255,.022) 47% 48%, transparent 48% 100%),
    radial-gradient(ellipse at 25% 85%, transparent 0 58%, rgba(213,180,95,.055) 59% 60%, transparent 61%);
  background-size: 92px 92px, 310px 310px;
}
.sidebar::-webkit-scrollbar { width: 8px; }
.sidebar::-webkit-scrollbar-track { background: rgba(255,255,255,.025); }
.sidebar::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgba(213,180,95,.42);
  background-clip: padding-box;
}
.brand-card {
  position: relative;
  overflow: hidden;
  padding: .95rem .95rem .9rem;
  border: 1px solid rgba(213, 180, 95, .43);
  border-radius: 20px;
  background:
    radial-gradient(circle at 20% 8%, rgba(242,223,145,.10), transparent 36%),
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
  box-shadow:
    0 17px 36px rgba(0,0,0,.15),
    inset 0 1px 0 rgba(255,255,255,.07);
}
.brand-card::after {
  content: "";
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 2.72rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(213,180,95,.58), transparent);
}
.brand-logo-frame {
  min-height: 76px;
  display: grid;
  place-items: center;
  padding: .1rem .15rem .65rem;
}
.brand-logo {
  width: min(100%, 210px);
  max-height: 92px;
  margin: 0 auto;
  object-fit: contain;
  filter: drop-shadow(0 7px 15px rgba(0,0,0,.15));
}
.brand-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .75rem;
  padding-top: .72rem;
}
.brand-product {
  color: #fff8dc;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.06rem;
  font-weight: 500;
  letter-spacing: .025em;
}
.brand-version {
  margin: 0;
  padding: .2rem .48rem;
  color: #f2df91;
  border: 1px solid rgba(213,180,95,.38);
  border-radius: 999px;
  background: rgba(2, 30, 32, .48);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .05em;
}
.sidebar-nav {
  position: relative;
  gap: .3rem;
  padding: .65rem .12rem .25rem;
}
.sidebar-nav-heading {
  margin: 0 .62rem .35rem;
  color: rgba(242,223,145,.65);
  font-size: .61rem;
  font-weight: 900;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.nav-link,
.nav-group-toggle {
  position: relative;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  padding: .48rem .58rem;
  color: rgba(255, 250, 240, .84);
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.2;
  transition: color .18s ease, background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.nav-link::after,
.nav-group-toggle::after {
  content: "";
  position: absolute;
  left: -3px;
  top: 9px;
  bottom: 9px;
  width: 3px;
  border-radius: 999px;
  background: transparent;
  transition: background .18s ease, box-shadow .18s ease;
}
.nav-link:hover,
.nav-group-toggle:hover {
  color: #fffbea;
  border-color: rgba(213,180,95,.25);
  background: linear-gradient(90deg, rgba(213,180,95,.11), rgba(255,255,255,.035));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  transform: translateX(2px);
}
.nav-link:hover::after,
.nav-group-toggle:hover::after {
  background: rgba(213,180,95,.62);
}
.nav-link.active {
  color: #082f31;
  border-color: rgba(255, 239, 180, .76);
  background: linear-gradient(135deg, #f5e7ae 0%, #d9b75d 58%, #c69836 100%);
  box-shadow:
    0 8px 20px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.58);
  transform: none;
}
.nav-link.active::after {
  background: #fff7d3;
  box-shadow: 0 0 12px rgba(255,239,180,.7);
}
.nav-entry {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .66rem;
}
.nav-index {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: #efd777;
  border: 1px solid rgba(213,180,95,.43);
  border-radius: 9px;
  background: rgba(2, 30, 32, .40);
  font-size: .67rem;
  font-weight: 900;
  letter-spacing: .03em;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.nav-link.active .nav-index {
  color: #073234;
  border-color: rgba(7,50,52,.24);
  background: rgba(255,255,255,.32);
}
.nav-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.nav-group {
  gap: .16rem;
}
.nav-group.open > .nav-group-toggle {
  color: #fff7d3;
  border-color: rgba(213,180,95,.17);
  background: rgba(255,255,255,.025);
}
.nav-chevron {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  color: #e9cf70;
  border: 1px solid rgba(213,180,95,.24);
  border-radius: 50%;
  background: rgba(2,30,32,.34);
  font-size: .69rem;
}
.nav-group > .nav-submenu {
  position: relative;
  padding: .18rem 0 .2rem 2.05rem;
  gap: .08rem;
}
.nav-group > .nav-submenu::before {
  content: "";
  position: absolute;
  left: 1.19rem;
  top: .08rem;
  bottom: .38rem;
  width: 1px;
  background: linear-gradient(180deg, rgba(213,180,95,.56), rgba(213,180,95,.08));
}
.nav-sublink {
  min-height: 38px;
  justify-content: flex-start;
  gap: .58rem;
  padding: .38rem .58rem;
  color: rgba(246, 242, 225, .70);
  border-radius: 9px;
  background: transparent;
  font-size: .76rem;
  font-weight: 700;
}
.nav-sublink::after { left: -1.05rem; top: 11px; bottom: 11px; width: 2px; }
.nav-sublink:hover {
  color: #fff8dc;
  border-color: rgba(213,180,95,.18);
  background: rgba(213,180,95,.075);
}
.nav-sublink.active {
  color: #fff8dc;
  border-color: rgba(213,180,95,.34);
  background: linear-gradient(90deg, rgba(213,180,95,.19), rgba(255,255,255,.035));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.018);
}
.nav-sublink.active::after {
  background: #f2df91;
  box-shadow: 0 0 9px rgba(242,223,145,.5);
}
.nav-submark {
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  border: 1px solid rgba(242,223,145,.72);
  border-radius: 50%;
  background: rgba(213,180,95,.18);
  box-shadow: 0 0 0 3px rgba(213,180,95,.055);
}
.nav-sublink.active .nav-submark {
  background: #f2df91;
  box-shadow: 0 0 10px rgba(242,223,145,.48);
}
.nav-group.nested {
  margin-top: .14rem;
  gap: .12rem;
}
.nav-group.nested .nav-group-toggle {
  min-height: 40px;
  padding: .42rem .52rem;
  color: rgba(255,248,220,.82);
  border: 1px solid rgba(213,180,95,.15);
  border-radius: 10px;
  background: rgba(255,255,255,.024);
  font-size: .77rem;
}
.nav-nested-mark {
  flex: 0 0 20px;
  width: 20px;
  display: grid;
  place-items: center;
  color: #d8bb5d;
  font-size: .58rem;
}
.nav-group.nested > .nav-submenu {
  padding-left: 1.62rem;
}
.nav-group.nested > .nav-submenu::before {
  left: .78rem;
}
.nav-group.nested .nav-sublink {
  min-height: 35px;
  font-size: .73rem;
}
.content-shell {
  padding-left: 1.7rem;
}
@media (max-width: 1180px) {
  .app-shell { grid-template-columns: 1fr; }
  .sidebar {
    position: static;
    height: auto;
    max-height: none;
    padding: .9rem;
    border-right: 0;
    border-bottom: 1px solid rgba(213,180,95,.34);
    box-shadow: 0 12px 30px rgba(1,31,33,.14);
  }
  .brand-card {
    max-width: 340px;
  }
  .sidebar-nav {
    display: grid;
    grid-template-columns: repeat(3, minmax(190px, 1fr));
    align-items: start;
    gap: .4rem;
  }
  .sidebar-nav-heading { grid-column: 1 / -1; }
  .nav-group { min-width: 0; }
  .content-shell { padding-left: 1rem; }
}
@media (max-width: 760px) {
  .sidebar-nav { grid-template-columns: 1fr; }
  .brand-card { max-width: none; }
  .nav-link,
  .nav-group-toggle { min-height: 44px; }
}
.nav-sublink[data-panel="pp-history"]::before {
  content: "";
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  border: 1px solid rgba(242,223,145,.72);
  border-radius: 50%;
  background: rgba(213,180,95,.18);
  box-shadow: 0 0 0 3px rgba(213,180,95,.055);
}
.nav-sublink[data-panel="pp-history"].active::before {
  background: #f2df91;
  box-shadow: 0 0 10px rgba(242,223,145,.48);
}

/* v0.8.0 – ADMIN-Zusatzdaten, Dokumentenarchiv und Meine Dokumente */
.admin-record-panel,
.admin-document-panel {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%, rgba(213, 180, 95, .13), transparent 34%),
    linear-gradient(145deg, #073c3b 0%, #0a5552 55%, #073735 100%);
  border: 1px solid rgba(213, 180, 95, .42);
  box-shadow: 0 22px 58px rgba(2, 34, 33, .22);
  color: #f7f2e4;
}

.admin-record-panel .premium-section-heading,
.admin-document-panel .premium-section-heading {
  border-bottom: 1px solid rgba(242, 223, 145, .24);
  padding-bottom: 22px;
  margin-bottom: 24px;
}

.admin-record-panel h2,
.admin-document-panel h2,
.admin-record-panel h3,
.admin-document-panel h3 { color: #fff7df; }
.admin-record-panel p,
.admin-document-panel p { color: rgba(255,255,255,.78); }
.admin-record-panel .step,
.admin-document-panel .step { color: #f2df91; }

.admin-workspace-grid {
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(520px, 2fr);
  gap: 22px;
  align-items: start;
  margin-bottom: 24px;
}

.admin-selector-card,
.admin-editor-card,
.admin-category-editor,
.document-path-card {
  border: 1px solid rgba(242, 223, 145, .24);
  border-radius: 22px;
  background: rgba(4, 47, 46, .72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 16px 35px rgba(0,0,0,.13);
  padding: 20px;
}

.admin-selector-card { position: sticky; top: 18px; }
.admin-selector-card label,
.admin-editor-card label,
.admin-category-editor label,
.document-review-form label,
.order-filter-panel label { color: rgba(255,255,255,.88); }
.admin-selector-card input,
.admin-selector-card select,
.admin-editor-card input,
.admin-editor-card select,
.admin-editor-card textarea,
.admin-category-editor input,
.document-review-form input,
.document-review-form select,
.document-review-form textarea {
  background: rgba(255,255,255,.96);
  color: #123f3d;
  border-color: rgba(213,180,95,.58);
}

.ambassador-selection-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 84px;
  padding: 14px;
  margin-top: 14px;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(213,180,95,.18), rgba(255,255,255,.07));
  border: 1px solid rgba(242,223,145,.3);
  color: rgba(255,255,255,.76);
}
.ambassador-selection-summary strong { color: #f6df94; font-size: 1.05rem; }
.ambassador-selection-summary span { color: #fff; }
.ambassador-selection-summary small { color: rgba(255,255,255,.65); }

.form-grid-four { grid-template-columns: repeat(4, minmax(150px, 1fr)); }
.form-grid-three { grid-template-columns: repeat(3, minmax(170px, 1fr)); }
.form-grid-two { grid-template-columns: repeat(2, minmax(170px, 1fr)); }
.check-row { display: flex !important; flex-direction: row !important; align-items: center; gap: 9px; padding-top: 28px; }
.check-row input { width: auto !important; }

.admin-table-wrap {
  border: 1px solid rgba(242, 223, 145, .24);
  border-radius: 20px;
  overflow: auto;
  background: rgba(247, 244, 235, .98);
}
.admin-data-table { width: 100%; border-collapse: collapse; min-width: 880px; color: #173f3d; }
.admin-data-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 12px 13px;
  background: #0b4b49;
  color: #f7e7ad;
  border-bottom: 1px solid #d5b45f;
  text-align: left;
  white-space: nowrap;
}
.admin-data-table td { padding: 11px 13px; border-bottom: 1px solid rgba(13,75,73,.12); vertical-align: top; }
.admin-data-table tbody tr:hover { background: rgba(213,180,95,.11); }

/* B5-UI: readable comparison values and wrapping within the review card. */
#panel-altbo-reviews .admin-data-table {
  min-width: 0;
  width: 100%;
  table-layout: fixed;
  color: #fff7df;
  background: #0a3333;
}
#panel-altbo-reviews .admin-data-table th,
#panel-altbo-reviews .admin-data-table td {
  white-space: normal;
  overflow-wrap: anywhere;
  color: #fff7df;
  background: #0a3333;
  border-color: #d5b45f;
}
#panel-altbo-reviews .admin-data-table th:first-child { width: 24%; }
#panel-altbo-reviews .admin-data-table th { position: static; }
#panel-altbo-reviews .admin-data-table mark {
  color: #0a3333;
  background: #f2df91;
  padding: .1em .2em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.compact-button { padding: 7px 11px; min-height: 0; border-radius: 10px; }

.status-chip.überfällig,
.status-chip.gemahnt { background: #922f29; color: #fff; }
.status-chip.bezahlt { background: #28724e; color: #fff; }
.status-chip.offen { background: #d9a72c; color: #2e250f; }
.status-chip.storniert,
.status-chip.nicht-mehr-geschuldet { background: #676b6a; color: #fff; }

.admin-category-editor {
  display: grid;
  grid-template-columns: minmax(260px, 2fr) 160px 150px auto auto;
  gap: 14px;
  align-items: end;
  margin-bottom: 20px;
}

.document-admin-status { margin-bottom: 18px; }
.document-path-card { display: grid; grid-template-columns: auto 1fr; gap: 5px 16px; }
.document-path-card strong { color: #f2df91; }
.document-path-card code { color: #fff; overflow-wrap: anywhere; }
.document-path-card span { grid-column: 1 / -1; color: rgba(255,255,255,.72); }

.document-admin-modal-card { width: min(1500px, 96vw); height: min(920px, 94vh); }
.document-review-layout { display: grid; grid-template-columns: minmax(480px, 1.35fr) minmax(420px, 1fr); min-height: 0; flex: 1; overflow: hidden; }
.document-review-layout .document-pdf-preview { width: 100%; height: 100%; min-height: 700px; border: 0; background: #e9e7df; }
.document-review-form { overflow: auto; padding: 22px; background: linear-gradient(150deg, #073d3b, #0b5955); color: #fff; }
.document-review-form details { margin: 16px 0; border: 1px solid rgba(242,223,145,.25); border-radius: 14px; padding: 12px; background: rgba(0,0,0,.1); }
.document-review-form summary { color: #f2df91; cursor: pointer; font-weight: 700; }
.document-review-form pre { white-space: pre-wrap; color: #fff; background: rgba(0,0,0,.18); padding: 10px; border-radius: 10px; }
.extracted-text { max-height: 280px; overflow: auto; white-space: pre-wrap; padding: 12px; border-radius: 10px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.78); }
.button-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }

#panel-my-documents .order-table { min-width: 760px; }
#panel-my-documents .pdf-button { display: inline-flex; min-width: 52px; justify-content: center; }

@media (max-width: 1180px) {
  .admin-workspace-grid { grid-template-columns: 1fr; }
  .admin-selector-card { position: static; }
  .form-grid-four { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
  .admin-category-editor { grid-template-columns: 1fr 130px 130px; }
  .document-review-layout { grid-template-columns: 1fr; overflow: auto; }
  .document-review-layout .document-pdf-preview { min-height: 520px; }
}

@media (max-width: 720px) {
  .form-grid-four,
  .form-grid-three,
  .form-grid-two,
  .admin-category-editor { grid-template-columns: 1fr; }
  .check-row { padding-top: 0; }
  .document-admin-modal-card { width: 100vw; height: 100vh; border-radius: 0; }
}

/* v0.8.1 – konfigurierbare Jahresgebühren-Status */
.configured-fee-status {
  background: var(--fee-status-color, #64748b) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.38);
  box-shadow: 0 4px 12px color-mix(in srgb, var(--fee-status-color, #64748b) 40%, transparent);
}

.annual-fee-status-editor {
  display: grid;
  grid-template-columns: minmax(240px, 2fr) 110px 130px 150px 190px auto auto;
  gap: 14px;
  align-items: end;
  margin-bottom: 18px;
  padding: 20px;
  border: 1px solid rgba(242, 223, 145, .24);
  border-radius: 22px;
  background: rgba(4, 47, 46, .72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 16px 35px rgba(0,0,0,.13);
}

.annual-fee-status-editor label { color: rgba(255,255,255,.88); }
.annual-fee-status-editor input[type="text"],
.annual-fee-status-editor input[type="number"] {
  background: rgba(255,255,255,.96);
  color: #123f3d;
  border-color: rgba(213,180,95,.58);
}
.annual-fee-status-editor input[type="color"] {
  width: 100%;
  min-height: 44px;
  padding: 4px;
  border-radius: 10px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(213,180,95,.58);
}

.status-config-note {
  margin: 0 0 18px;
  padding: 14px 16px;
  border: 1px solid rgba(242,223,145,.24);
  border-radius: 15px;
  background: rgba(4,47,46,.52);
  color: rgba(255,255,255,.76);
  line-height: 1.55;
}
.status-config-note strong { color: #f2df91; }

.status-color-swatch {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 8px;
  vertical-align: middle;
  border-radius: 50%;
  background: var(--fee-status-color, #64748b);
  border: 1px solid rgba(0,0,0,.18);
  box-shadow: 0 2px 7px rgba(0,0,0,.18);
}

@media (max-width: 1380px) {
  .annual-fee-status-editor { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
}

@media (max-width: 720px) {
  .annual-fee-status-editor { grid-template-columns: 1fr; }
}

/* v0.8.2 – Jahresbeitrag im Ambassador-Dashboard */
.annual-fee-dashboard-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .9rem;
  align-items: center;
  margin: .75rem 0 0;
  padding: .9rem 1rem;
  overflow: hidden;
  border: 1px solid rgba(213,180,95,.35);
  border-radius: 12px;
  background: rgba(255,255,255,.04);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
}
.annual-fee-dashboard-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: currentColor;
  opacity: .95;
}
.annual-fee-dashboard-indicator {
  position: relative;
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 1.25rem;
  font-weight: 900;
  line-height: 1;
}
.annual-fee-dashboard-copy { min-width: 0; }
.annual-fee-dashboard-copy > span {
  display: block;
  color: rgba(248,245,234,.58);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.annual-fee-dashboard-copy h3 {
  margin: .08rem 0;
  color: #fffdf6;
  font-size: 1.08rem;
}
.annual-fee-dashboard-copy p {
  margin: 0;
  color: rgba(248,245,234,.72);
  font-size: .82rem;
}
.annual-fee-dashboard-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .9rem;
  margin-top: .45rem;
  color: rgba(248,245,234,.66);
  font-size: .74rem;
}
.annual-fee-dashboard-meta span {
  display: inline-flex;
  gap: .3rem;
  align-items: baseline;
}
.annual-fee-dashboard-meta b { color: rgba(248,245,234,.9); }
.annual-fee-dashboard-card button { white-space: nowrap; }
.annual-fee-dashboard-card.paid {
  color: #43d28e;
  border-color: rgba(67,210,142,.68);
  background: linear-gradient(105deg, rgba(16,116,72,.30), rgba(255,255,255,.025));
}
.annual-fee-dashboard-card.paid .annual-fee-dashboard-indicator {
  color: #fff;
  background: linear-gradient(145deg, #238d5d, #126b46);
  box-shadow: 0 0 0 5px rgba(67,210,142,.11), 0 10px 24px rgba(0,0,0,.20);
}
.annual-fee-dashboard-card.paid button {
  border-color: rgba(67,210,142,.55);
  background: rgba(35,141,93,.16);
  color: #d7ffeb;
}
.annual-fee-dashboard-card.unpaid,
.annual-fee-dashboard-card.missing {
  color: #ff5e59;
  border-color: rgba(255,94,89,.82);
  background:
    radial-gradient(circle at 0 50%, rgba(214,44,39,.28), transparent 34%),
    linear-gradient(105deg, rgba(137,25,23,.34), rgba(255,255,255,.02));
  box-shadow: 0 10px 30px rgba(93,8,8,.16), inset 0 1px 0 rgba(255,255,255,.04);
}
.annual-fee-dashboard-card.unpaid .annual-fee-dashboard-indicator,
.annual-fee-dashboard-card.missing .annual-fee-dashboard-indicator {
  color: #fff;
  background: linear-gradient(145deg, #dc3934, #9e1c19);
  box-shadow: 0 0 0 5px rgba(255,94,89,.13), 0 10px 24px rgba(74,0,0,.28);
}
.annual-fee-dashboard-card.unpaid .annual-fee-dashboard-indicator::after,
.annual-fee-dashboard-card.missing .annual-fee-dashboard-indicator::after {
  content: "";
  position: absolute;
  inset: -6px;
  border: 1px solid rgba(255,104,99,.36);
  border-radius: 50%;
}
.annual-fee-dashboard-card.unpaid h3,
.annual-fee-dashboard-card.missing h3 { color: #fff4f3; }
.annual-fee-dashboard-card.unpaid button,
.annual-fee-dashboard-card.missing button {
  border-color: rgba(255,117,112,.70);
  background: rgba(180,38,34,.18);
  color: #fff4f3;
}
.annual-fee-dashboard-card.settled {
  color: #d5b45f;
  border-color: rgba(213,180,95,.58);
  background: linear-gradient(105deg, rgba(137,108,33,.21), rgba(255,255,255,.02));
}
.annual-fee-dashboard-card.settled .annual-fee-dashboard-indicator {
  color: #2d260e;
  background: linear-gradient(145deg, #f2df91, #caa64b);
  box-shadow: 0 0 0 5px rgba(213,180,95,.11);
}
@media(max-width:820px) {
  .annual-fee-dashboard-card { grid-template-columns: auto 1fr; }
  .annual-fee-dashboard-card button { grid-column: 1 / -1; }
}

/* v0.9.1 Rollen-, Sichtbarkeits- und Aktualisierungssteuerung */
.role-visibility-hidden {
  display: none !important;
}

.role-visibility-panel,
.manual-updates-panel {
  color: #f8f5ea;
  background:
    radial-gradient(circle at 85% 0%, rgba(213, 180, 95, .12), transparent 30%),
    linear-gradient(145deg, #0b3534 0%, #0c4442 48%, #092d2d 100%);
  border: 1px solid rgba(213, 180, 95, .36);
  border-radius: 24px;
  box-shadow: 0 26px 60px rgba(4, 25, 25, .24);
  padding: clamp(20px, 3vw, 34px);
}

.visibility-concept-grid,
.manual-update-grid,
.update-policy-card {
  display: grid;
  gap: 16px;
}

.visibility-concept-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 22px 0;
}

.visibility-concept-grid article,
.update-policy-card > div,
.manual-update-card {
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  border: 1px solid rgba(242, 223, 145, .2);
  border-radius: 18px;
  padding: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.visibility-concept-grid strong,
.update-policy-card strong,
.manual-update-card h3 {
  display: block;
  color: #f2df91;
  margin-bottom: 6px;
}

.visibility-concept-grid span,
.update-policy-card p,
.manual-update-card p {
  color: rgba(248,245,234,.76);
  line-height: 1.55;
  margin: 0;
}

.visibility-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 8px 0 18px;
}

.visibility-table-wrap {
  max-height: min(68vh, 760px);
  border: 1px solid rgba(242, 223, 145, .22);
  border-radius: 18px;
  background: rgba(2, 25, 25, .28);
}

.visibility-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 920px;
}

.visibility-table th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #0b3938;
  color: #f2df91;
  border-bottom: 1px solid rgba(242,223,145,.26);
  padding: 13px 12px;
}

.visibility-table td {
  padding: 11px 12px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  color: #f8f5ea;
}

.visibility-table tbody tr:not(.visibility-group-row):hover td {
  background: rgba(213,180,95,.06);
}

.visibility-group-row td {
  position: sticky;
  top: 45px;
  z-index: 2;
  padding: 9px 12px;
  background: linear-gradient(90deg, #d5b45f, #f2df91);
  color: #123f3d;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .78rem;
}

.visibility-checkbox-cell {
  text-align: center;
  min-width: 118px;
}

.visibility-checkbox-cell label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  cursor: pointer;
  color: rgba(248,245,234,.72);
  font-size: .82rem;
}

.visibility-checkbox-cell input {
  width: 18px;
  height: 18px;
  accent-color: #d5b45f;
}

.visibility-checkbox-cell input:checked + span {
  color: #f2df91;
  font-weight: 700;
}

.visibility-checkbox-cell input:disabled {
  cursor: not-allowed;
  opacity: .65;
}

.visibility-level-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: .72rem;
  white-space: nowrap;
  border: 1px solid rgba(255,255,255,.15);
  color: rgba(248,245,234,.78);
}
.visibility-level-chip.menu { background: rgba(213,180,95,.18); color: #f2df91; }
.visibility-level-chip.submenu { background: rgba(85,151,146,.18); }
.visibility-level-chip.section { background: rgba(255,255,255,.06); }

.visibility-security-note {
  margin-top: 16px;
  padding: 14px 16px;
  border-left: 3px solid #d5b45f;
  background: rgba(213,180,95,.08);
  border-radius: 12px;
  color: rgba(248,245,234,.82);
}

.update-policy-card {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 20px 0;
}
.update-policy-card > div {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  align-items: start;
}
.update-policy-card strong,
.update-policy-card p { grid-column: 2; }
.update-policy-icon {
  grid-row: 1 / span 2;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  font-size: 1.2rem;
  font-weight: 800;
}
.update-policy-icon.automatic { background: rgba(74, 196, 139, .14); color: #8ee7b8; border: 1px solid rgba(74,196,139,.3); }
.update-policy-icon.manual { background: rgba(213,180,95,.14); color: #f2df91; border: 1px solid rgba(213,180,95,.3); }

.manual-update-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 18px;
}
.manual-update-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  min-height: 215px;
}
.manual-update-card button { align-self: flex-start; }
.manual-update-card .result { width: 100%; margin: 0; }

@media (max-width: 1000px) {
  .visibility-concept-grid,
  .update-policy-card,
  .manual-update-grid {
    grid-template-columns: 1fr;
  }
}

/* v0.9.1 Dashboard- und Einstellungsanpassungen */
.dashboard-chart-legend .legend-series-1::before { background: #e2bd58; }
.dashboard-chart-legend .legend-series-2::before { background: #28b2aa; }
.dashboard-chart-legend .legend-series-3::before { background: #d88962; }
.dashboard-widget-heading > div:last-child .dashboard-chart-legend { justify-content: flex-end; margin-top: .3rem; }
.manual-updates-panel .settings-scope-note {
  max-width: none;
  margin: 18px 0;
  color: rgba(248,245,234,.88);
  background: linear-gradient(145deg, rgba(213,180,95,.13), rgba(255,255,255,.035));
  border-color: rgba(242,223,145,.34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

/* v0.9.2 – Premium-Card-Dashboard und fixierter Markenbereich */
.admin-dashboard-premium-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: .9rem;
}
.dashboard-premium-card {
  position: relative;
  isolation: isolate;
  min-height: 304px;
  overflow: hidden;
  padding: 1rem 1.05rem .92rem;
  border-color: rgba(224, 194, 104, .44);
  border-radius: 16px;
  background:
    radial-gradient(circle at 9% 12%, rgba(226, 189, 88, .12), transparent 28%),
    radial-gradient(circle at 96% 2%, rgba(41, 177, 168, .10), transparent 31%),
    linear-gradient(145deg, rgba(4, 40, 42, .94), rgba(2, 27, 29, .88));
  box-shadow:
    0 18px 44px rgba(0, 0, 0, .18),
    inset 0 1px 0 rgba(255, 255, 255, .055),
    inset 0 0 0 1px rgba(213, 180, 95, .035);
}
.dashboard-premium-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 190px;
  height: 190px;
  left: -82px;
  top: -92px;
  border-radius: 50%;
  background: rgba(226, 189, 88, .09);
  filter: blur(24px);
  pointer-events: none;
}
.dashboard-premium-card::after {
  content: "";
  position: absolute;
  left: 1rem;
  right: 1rem;
  top: 4.55rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(213, 180, 95, .38), rgba(255, 255, 255, .035), transparent);
  pointer-events: none;
}
.dashboard-premium-card-header {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .78rem;
  margin-bottom: .76rem;
}
.dashboard-premium-card-icon {
  flex: 0 0 46px;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  color: #f4d873;
  border: 1px solid rgba(226, 189, 88, .68);
  border-radius: 50%;
  background:
    radial-gradient(circle at 38% 28%, rgba(255, 244, 185, .15), transparent 38%),
    rgba(3, 31, 33, .68);
  box-shadow: 0 0 24px rgba(226, 189, 88, .11), inset 0 1px 0 rgba(255, 255, 255, .06);
  font-size: 1.05rem;
  font-weight: 900;
}
.dashboard-premium-card-header > div { min-width: 0; }
.dashboard-premium-card-header > div > span {
  display: block;
  color: #d5b45f;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .63rem;
  font-weight: 900;
}
.dashboard-premium-card-header h3 {
  margin: .1rem 0 .04rem;
  color: #fffdf6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.16rem;
  font-weight: 500;
}
.dashboard-premium-card-header small {
  color: rgba(248, 245, 234, .53);
  font-size: .72rem;
}
.dashboard-premium-card-body { min-width: 0; }
.dashboard-premium-split {
  display: grid;
  grid-template-columns: minmax(104px, .62fr) minmax(0, 1.38fr);
  align-items: center;
  gap: .62rem;
  min-height: 180px;
}
.dashboard-premium-metric {
  min-width: 0;
  padding: .25rem 0 .25rem .12rem;
}
.dashboard-premium-metric strong {
  display: block;
  color: #fffaf0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 2.65vw, 2.45rem);
  font-weight: 500;
  line-height: 1.04;
  overflow-wrap: anywhere;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .16);
}
.dashboard-premium-metric span {
  display: block;
  margin-top: .38rem;
  color: rgba(248, 245, 234, .58);
  font-size: .7rem;
  line-height: 1.32;
}
.dashboard-premium-currency strong {
  color: #f5e5aa;
  font-size: clamp(1.34rem, 2.05vw, 2rem);
}
.dashboard-chart-premium {
  min-height: 174px;
  display: flex;
  align-items: center;
}
.dashboard-chart-premium-wide {
  min-height: 178px;
  margin-top: -.15rem;
}
.dashboard-chart-premium svg { filter: drop-shadow(0 6px 13px rgba(0, 0, 0, .10)); }
.dashboard-premium-card .dashboard-chart-grid { stroke: rgba(255, 255, 255, .075); }
.dashboard-premium-card .dashboard-chart-label {
  fill: rgba(248, 245, 234, .60);
  font-size: 16px;
}
.dashboard-chart-bar {
  transform-box: fill-box;
  transform-origin: center bottom;
  transition: opacity .18s ease, filter .18s ease;
}
.dashboard-chart-bar.series-1 {
  fill: #d9b34f;
  filter: drop-shadow(0 5px 7px rgba(222, 184, 75, .15));
}
.dashboard-chart-bar.series-2 {
  fill: #218f89;
  filter: drop-shadow(0 5px 7px rgba(33, 143, 137, .14));
}
.dashboard-chart-bar:hover { opacity: .82; filter: brightness(1.14); }
.dashboard-premium-network .dashboard-chart-line { stroke-width: 3.4; }
.dashboard-premium-network .dashboard-chart-dot { r: 4.5px; }
.dashboard-chart-legend-bottom {
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-top: .3rem;
  padding-top: .66rem;
  border-top: 1px solid rgba(213, 180, 95, .16);
  color: rgba(248, 245, 234, .68);
}
.dashboard-chart-legend-bottom span::before {
  width: 18px;
  height: 3px;
  margin-right: .42rem;
  border-radius: 999px;
  vertical-align: middle;
}
.dashboard-chart-legend-bottom .legend-ambassadors::before,
.dashboard-chart-legend-bottom .legend-series-1::before { background: #e2bd58; }
.dashboard-chart-legend-bottom .legend-customers::before,
.dashboard-chart-legend-bottom .legend-series-2::before { background: #28b2aa; }

/* Der Markenbereich bleibt vollständig sichtbar; nur die Navigation scrollt. */
.sidebar {
  overflow: hidden;
}
.brand-card {
  flex: 0 0 auto;
  z-index: 3;
}
.brand-logo-frame {
  min-height: 84px;
  overflow: visible;
}
.brand-logo {
  width: min(100%, 218px);
  max-height: none;
  height: auto;
  object-fit: contain;
}
.sidebar-nav {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: .38rem;
  margin-right: -.38rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(213, 180, 95, .52) rgba(255, 255, 255, .025);
}
.sidebar-nav::-webkit-scrollbar { width: 7px; }
.sidebar-nav::-webkit-scrollbar-track { background: rgba(255, 255, 255, .025); }
.sidebar-nav::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgba(213, 180, 95, .46);
  background-clip: padding-box;
}
@media (max-width: 1420px) {
  .admin-dashboard-premium-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-premium-average { grid-column: 1 / -1; }
  .dashboard-premium-average .dashboard-premium-split { grid-template-columns: minmax(150px, .38fr) minmax(0, 1.62fr); }
}
@media (max-width: 980px) {
  .admin-dashboard-premium-grid { grid-template-columns: 1fr; }
  .dashboard-premium-average { grid-column: auto; }
}
@media (max-width: 620px) {
  .dashboard-premium-split,
  .dashboard-premium-average .dashboard-premium-split { grid-template-columns: 1fr; }
  .dashboard-premium-metric { text-align: center; }
  .dashboard-premium-card { min-height: 340px; }
}
@media (max-width: 1180px) {
  .sidebar { overflow: visible; }
  .sidebar-nav {
    flex: none;
    min-height: auto;
    overflow: visible;
    margin-right: 0;
    padding-right: .12rem;
  }
}

/* v0.9.3 – korrigierte Premium-Cards nach freigegebener Vorlage */
.dashboard-kpi-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .72rem;
  margin-bottom: .95rem;
}
.dashboard-kpi-card {
  position: relative;
  isolation: isolate;
  min-width: 0;
  min-height: 118px;
  overflow: hidden;
  padding: .92rem .82rem;
  border: 1px solid rgba(224, 194, 104, .46);
  border-radius: 15px;
  background:
    radial-gradient(circle at 12% 16%, rgba(226, 189, 88, .13), transparent 30%),
    radial-gradient(circle at 92% 0%, rgba(41, 177, 168, .09), transparent 34%),
    linear-gradient(145deg, rgba(4, 40, 42, .96), rgba(2, 27, 29, .91));
  box-shadow:
    0 16px 36px rgba(0, 0, 0, .17),
    inset 0 1px 0 rgba(255, 255, 255, .055),
    inset 0 0 0 1px rgba(213, 180, 95, .035);
}
.dashboard-kpi-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 110px;
  height: 110px;
  left: -52px;
  top: -58px;
  border-radius: 50%;
  background: rgba(226, 189, 88, .10);
  filter: blur(18px);
}
.dashboard-kpi-card::after {
  content: "";
  position: absolute;
  left: .82rem;
  right: .82rem;
  bottom: .58rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(213,180,95,.34), transparent 76%);
}
.dashboard-kpi-icon {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border-color: rgba(226, 189, 88, .72);
  color: #f4d873;
  background:
    radial-gradient(circle at 36% 26%, rgba(255, 244, 185, .17), transparent 38%),
    rgba(3, 31, 33, .72);
  box-shadow: 0 0 24px rgba(226, 189, 88, .11), inset 0 1px 0 rgba(255,255,255,.06);
  font-size: 1.08rem;
}
.dashboard-kpi-card div > span {
  color: #d8c27a;
  text-transform: uppercase;
  letter-spacing: .075em;
  font-size: .64rem;
  font-weight: 900;
}
.dashboard-kpi-card strong {
  margin: .18rem 0 .08rem;
  color: #fffaf0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.3rem, 1.8vw, 1.72rem);
  font-weight: 500;
  text-shadow: 0 2px 14px rgba(0,0,0,.15);
}
.dashboard-kpi-card small {
  color: rgba(248,245,234,.5);
  font-size: .68rem;
}

.admin-dashboard-premium-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch;
  gap: .8rem;
  width: 100%;
}
.dashboard-premium-card {
  min-width: 0;
  min-height: 284px;
  padding: .92rem .95rem .82rem;
  border-radius: 15px;
  border-color: rgba(224, 194, 104, .48);
  background:
    radial-gradient(circle at 7% 12%, rgba(226,189,88,.14), transparent 27%),
    radial-gradient(circle at 96% 0%, rgba(41,177,168,.10), transparent 30%),
    linear-gradient(145deg, rgba(4,40,42,.97), rgba(2,27,29,.92));
  box-shadow:
    0 18px 42px rgba(0,0,0,.19),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(213,180,95,.04);
}
.dashboard-premium-card-header {
  min-height: 54px;
  gap: .7rem;
  margin-bottom: .48rem;
}
.dashboard-premium-card-icon {
  flex-basis: 44px;
  width: 44px;
  height: 44px;
  font-size: 1.02rem;
}
.dashboard-premium-card-header > div > span {
  font-size: .61rem;
  letter-spacing: .13em;
}
.dashboard-premium-card-header h3 {
  font-size: clamp(.98rem, 1.25vw, 1.13rem);
  line-height: 1.1;
}
.dashboard-premium-card-header small { font-size: .68rem; }
.dashboard-premium-card::after { top: 4.15rem; }
.dashboard-premium-split {
  grid-template-columns: minmax(92px, .55fr) minmax(0, 1.45fr);
  gap: .45rem;
  min-height: 164px;
}
.dashboard-premium-metric strong {
  font-size: clamp(1.48rem, 2.2vw, 2.15rem);
}
.dashboard-premium-currency strong {
  font-size: clamp(1.22rem, 1.72vw, 1.82rem);
}
.dashboard-chart-premium,
.dashboard-chart-premium-wide {
  min-height: 160px;
}
.dashboard-premium-card .dashboard-chart-label { font-size: 15px; }
.dashboard-chart-legend-bottom {
  margin-top: .12rem;
  padding-top: .52rem;
  gap: .85rem;
  font-size: .68rem;
}
.dashboard-chart-legend-bottom span::before { width: 16px; }
.dashboard-premium-network .dashboard-chart-premium-wide {
  margin-top: -.2rem;
}

/* Drei Karten bleiben auf typischen Desktopbreiten nebeneinander. */
@media (max-width: 1420px) {
  .admin-dashboard-premium-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .dashboard-premium-average { grid-column: auto; }
  .dashboard-premium-average .dashboard-premium-split {
    grid-template-columns: minmax(92px, .55fr) minmax(0, 1.45fr);
  }
}
@media (max-width: 1180px) {
  .dashboard-kpi-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .dashboard-kpi-card { padding-inline: .66rem; }
  .dashboard-kpi-icon { flex-basis: 38px; width: 38px; height: 38px; }
  .dashboard-kpi-card strong { font-size: 1.28rem; }
  .dashboard-premium-card { padding-inline: .76rem; }
  .dashboard-premium-card-icon { flex-basis: 38px; width: 38px; height: 38px; }
  .dashboard-premium-split,
  .dashboard-premium-average .dashboard-premium-split {
    grid-template-columns: minmax(78px, .5fr) minmax(0, 1.5fr);
  }
}
@media (max-width: 900px) {
  .dashboard-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-dashboard-premium-grid { grid-template-columns: 1fr !important; }
  .dashboard-premium-split,
  .dashboard-premium-average .dashboard-premium-split {
    grid-template-columns: minmax(130px, .4fr) minmax(0, 1.6fr);
  }
}
@media (max-width: 560px) {
  .dashboard-kpi-grid { grid-template-columns: 1fr; }
  .dashboard-premium-split,
  .dashboard-premium-average .dashboard-premium-split { grid-template-columns: 1fr; }
}

/* Version 0.10.2: Shopware-Anmeldung und rollenbasierte Anwendungssitzung */
body.auth-pending {
  margin: 0;
  min-height: 100vh;
  overflow: hidden;
  background: #031f21;
}
body.auth-pending .app-shell { display: none !important; }
.login-screen {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: clamp(1rem, 4vw, 3rem);
  overflow: auto;
  color: #fff9e9;
  background:
    radial-gradient(circle at 18% 14%, rgba(214, 177, 75, .18), transparent 29%),
    radial-gradient(circle at 84% 74%, rgba(28, 143, 139, .19), transparent 34%),
    linear-gradient(145deg, #021719 0%, #06383a 47%, #032629 100%);
}
.login-screen.hidden { display: none !important; }
.login-ambient {
  position: fixed;
  width: 34rem;
  height: 34rem;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(80px);
  opacity: .22;
}
.login-ambient-one { left: -14rem; top: -17rem; background: #d5b45f; }
.login-ambient-two { right: -16rem; bottom: -18rem; background: #1c9a94; }
.login-card {
  position: relative;
  isolation: isolate;
  width: min(100%, 550px);
  padding: clamp(1.5rem, 4vw, 2.55rem);
  overflow: hidden;
  border: 1px solid rgba(229, 199, 112, .58);
  border-radius: 26px;
  background:
    radial-gradient(circle at 12% 5%, rgba(236, 204, 116, .12), transparent 28%),
    linear-gradient(145deg, rgba(4, 47, 49, .96), rgba(2, 28, 30, .97));
  box-shadow: 0 36px 90px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255,255,255,.08);
}
.login-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 18%, rgba(255,255,255,.025) 48%, transparent 72%);
}
.login-brand {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding-bottom: 1.2rem;
  margin-bottom: 1.45rem;
  border-bottom: 1px solid rgba(218, 188, 102, .25);
}
.login-brand img {
  width: 174px;
  max-width: 48%;
  height: auto;
  object-fit: contain;
}
.login-brand > div { display: flex; flex-direction: column; gap: .18rem; }
.login-brand strong { color: #f4d873; font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; }
.login-brand span { color: rgba(255,248,226,.55); font-size: .74rem; }
.login-copy .premium-kicker { color: #d7b75f; }
.login-copy h1 {
  margin: .35rem 0 .65rem;
  color: #fffaf0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 6vw, 3rem);
  font-weight: 500;
  line-height: 1.02;
}
.login-copy p { margin: 0 0 1.45rem; color: rgba(255,249,232,.72); line-height: 1.55; }
.login-form { display: grid; gap: 1rem; }
.login-form label { display: grid; gap: .45rem; color: #ead99f; font-size: .78rem; font-weight: 800; letter-spacing: .035em; }
.login-form input {
  width: 100%;
  min-height: 50px;
  padding: .78rem .9rem;
  border: 1px solid rgba(218, 188, 102, .4);
  border-radius: 12px;
  color: #fffaf0;
  background: rgba(1, 22, 24, .64);
  outline: none;
  box-shadow: inset 0 1px 8px rgba(0,0,0,.18);
}
.login-form input:focus { border-color: #edcf72; box-shadow: 0 0 0 3px rgba(221, 186, 86, .12); }
.password-field { position: relative; }
.password-field input { padding-right: 6rem; }
.password-toggle {
  position: absolute;
  right: .42rem;
  top: 50%;
  transform: translateY(-50%);
  min-height: 36px;
  padding: .35rem .7rem;
  border: 1px solid rgba(218,188,102,.28);
  border-radius: 9px;
  color: #ead483;
  background: rgba(10,65,67,.72);
  font-size: .72rem;
}
.login-submit {
  min-height: 52px;
  margin-top: .2rem;
  border: 1px solid #f0d276;
  border-radius: 13px;
  color: #06292b;
  background: linear-gradient(135deg, #f3d87d, #c79b38);
  box-shadow: 0 12px 28px rgba(205,159,52,.2), inset 0 1px 0 rgba(255,255,255,.45);
  font-weight: 900;
  letter-spacing: .025em;
}
.login-submit:hover { transform: translateY(-1px); filter: brightness(1.04); }
.login-submit:disabled { opacity: .62; transform: none; }
.login-result {
  padding: .75rem .85rem;
  border: 1px solid rgba(220,190,104,.28);
  border-radius: 11px;
  color: #f7e9b2;
  background: rgba(4,31,33,.66);
  white-space: pre-wrap;
  line-height: 1.4;
}
.login-result.error { border-color: rgba(245,99,99,.65); color: #ffd0d0; background: rgba(100,12,18,.38); }
.login-result.warning { border-color: rgba(239,188,61,.58); color: #ffe8a0; }
.login-result.success { border-color: rgba(65,190,153,.58); color: #bcf5de; }
.login-security-note {
  display: flex;
  gap: .7rem;
  margin-top: 1.25rem;
  padding: .78rem .85rem;
  border: 1px solid rgba(55,159,153,.28);
  border-radius: 12px;
  color: rgba(225,247,241,.7);
  background: rgba(8,73,74,.35);
}
.login-security-note > span { color: #d9ba61; }
.login-security-note p { margin: 0; font-size: .74rem; line-height: 1.45; }
.login-development-note { margin-top: .8rem; color: rgba(255,248,226,.42); font-size: .68rem; text-align: center; }

.session-user {
  display: flex;
  flex-direction: column;
  min-width: 145px;
  padding: .48rem .7rem;
  border: 1px solid rgba(213,180,95,.36);
  border-radius: 11px;
  background: rgba(5,55,57,.08);
}
.session-user span { color: #a67e22; font-size: .63rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.session-user strong { color: var(--accent-deep); font-size: .82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.logout-button {
  border: 1px solid rgba(122,88,20,.48);
  color: #5b4312;
  background: #fffaf0;
}
.logout-button:hover { background: #f7e8b6; }

.admin-dashboard-role { display: none; }
body.role-admin:not(.ambassador-view) .admin-dashboard-role,
body.role-employee .admin-dashboard-role { display: block; }
body:not(.role-admin) .admin-only { display: none !important; }
body.role-admin.ambassador-view .admin-only { display: none !important; }
body:not(.ambassador-view) .ambassador-only { display: none !important; }
body.role-employee .dashboard-status-strip button.admin-only,
body.role-employee [data-switch-panel="orders-setup"] { display: none !important; }

@media (max-width: 980px) {
  .session-user { display: none; }
  .topbar-actions { flex-wrap: wrap; justify-content: flex-end; }
}
@media (max-width: 560px) {
  .login-card { padding: 1.25rem; border-radius: 19px; }
  .login-brand { align-items: flex-start; flex-direction: column; }
  .login-brand img { max-width: 68%; }
}


/* Version 0.10.2: kompakte Kundenansicht und Abmeldung in der Seitenleiste */
.sidebar-footer {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid rgba(223, 198, 112, .22);
}
.sidebar-logout-button {
  width: 100%;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  border: 1px solid rgba(229, 203, 117, .48);
  border-radius: 12px;
  color: #fff2bd;
  background: rgba(2, 32, 34, .56);
  font-family: "Trebuchet MS", "Arial Narrow", "Segoe UI", Arial, sans-serif;
  font-size: .82rem;
  font-weight: 900;
}
.sidebar-logout-button:hover {
  color: #062f31;
  background: linear-gradient(135deg, #f5e7ae 0%, #d9b75d 58%, #c69836 100%);
  border-color: #f1da8b;
}
.sidebar-logout-button:disabled {
  opacity: .6;
  cursor: wait;
}
.sidebar-logout-icon {
  font-size: 1rem;
  line-height: 1;
}
body.role-customer .topbar,
body.role-ambassador .topbar,
body.role-customer .automatic-sync-banner,
body.role-ambassador .automatic-sync-banner {
  display: none !important;
}
body.role-customer .content-shell,
body.role-ambassador .content-shell {
  padding-top: 1rem;
}
@media (max-width: 1180px) {
  .sidebar-footer { margin-top: 0; }
}

/* Version 0.10.4: responsive dashboard hardening for all roles */
.premium-dashboard,.dashboard-panel,.dashboard-kpi-grid,.admin-dashboard-premium-grid,.dashboard-main-grid,.ambassador-dashboard-grid{min-width:0;width:100%}

/* Version 0.10.6: Provisionstabellen und Monatsübersichten */
body:not(.role-admin):not(.role-employee) .staff-only,
body.role-admin.ambassador-view .staff-only {
  display: none !important;
}
.commission-panel {
  color: #f8f5ea;
  border-color: rgba(213,180,95,.45);
  background:
    radial-gradient(circle at 92% 5%, rgba(40,178,170,.14), transparent 30%),
    linear-gradient(145deg, #063638, #052b2d);
}
.commission-panel .premium-section-heading h2,
.commission-panel .premium-section-heading p { color: #fffaf0; }
.commission-panel .premium-section-heading p { color: rgba(248,245,234,.72); }
.commission-rule-editor,
.commission-month-toolbar,
.commission-month-summary {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(213,180,95,.26);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
}
.commission-rule-form-grid {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
}
.commission-panel label { color: rgba(248,245,234,.82); }
.commission-panel input,
.commission-panel select {
  color: #153f40;
  background: #fffdf7;
  border-color: rgba(213,180,95,.58);
}
.commission-month-toolbar {
  display: grid;
  grid-template-columns: minmax(220px,1fr) minmax(180px,.65fr) minmax(260px,1.2fr) auto;
  align-items: end;
  gap: .8rem;
}
.commission-file-label input { padding: .58rem; }
.commission-month-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: .7rem;
}
.commission-month-summary article {
  padding: .8rem;
  border: 1px solid rgba(213,180,95,.22);
  border-radius: 11px;
  background: rgba(255,255,255,.035);
}
.commission-month-summary span {
  display: block;
  color: rgba(248,245,234,.58);
  font-size: .72rem;
}
.commission-month-summary strong { color: #f2df91; }
.commission-table-wrap {
  max-width: 100%;
  border-color: rgba(213,180,95,.26);
  background: rgba(1,28,30,.44);
}
.commission-panel .admin-data-table { color: #f8f5ea; }
.commission-panel .admin-data-table th {
  color: #f2df91;
  background: rgba(213,180,95,.09);
}
.commission-panel .admin-data-table td { border-color: rgba(213,180,95,.13); }
.commission-panel .admin-data-table tbody tr:hover { background: rgba(255,255,255,.045); }
.commission-panel .inactive-row { opacity: .58; }
.commission-rule-table { min-width: 1620px; }
.commission-month-table { min-width: 1180px; }
@media (max-width: 1300px) {
  .commission-rule-form-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
  .commission-month-toolbar { grid-template-columns: repeat(2, minmax(220px,1fr)); }
}
@media (max-width: 760px) {
  .commission-rule-form-grid,
  .commission-month-toolbar,
  .commission-month-summary { grid-template-columns: 1fr; }
}

/* Version 0.10.8: monatliche Provisionsberechnung je Bestellposition */
.commission-calculation-toolbar { grid-template-columns: minmax(260px,1fr) minmax(190px,.55fr) auto; align-items:end; }
.commission-calculation-summary { grid-template-columns: repeat(8,minmax(130px,1fr)); }
.commission-calculation-source { margin:.75rem 0; padding:.75rem .9rem; border:1px solid rgba(213,180,95,.26); border-radius:10px; color:rgba(248,245,234,.74); background:rgba(255,255,255,.035); }
.commission-calculation-table { min-width: 3150px; }
.commission-calculation-table th { white-space:nowrap; }
.commission-calculation-table td { white-space:nowrap; max-width:280px; overflow:hidden; text-overflow:ellipsis; }
.commission-calculation-table td:nth-child(7) { min-width:250px; }
.commission-warning-row { background:rgba(193,117,42,.12); }
.commission-status { display:inline-flex; padding:.22rem .48rem; border-radius:999px; font-size:.68rem; font-weight:800; }
.commission-status.success { color:#a9ebc9; background:rgba(28,131,83,.22); border:1px solid rgba(73,190,126,.35); }
.commission-status.warning { color:#f5d783; background:rgba(177,113,25,.22); border:1px solid rgba(226,177,70,.42); }
@media(max-width:1180px){.commission-calculation-toolbar{grid-template-columns:1fr 1fr}.commission-calculation-toolbar button{grid-column:1/-1}.commission-calculation-summary{grid-template-columns:repeat(4,minmax(145px,1fr))}}
@media(max-width:720px){.commission-calculation-toolbar,.commission-calculation-summary{grid-template-columns:1fr}}


/* Version 0.10.9: feste Tabellenüberschrift und dauerhaft erreichbare Seitwärtsnavigation */
.commission-calculation-scroll-nav {
  position: sticky;
  top: 0;
  z-index: 18;
  height: 20px;
  margin: .55rem 0 0;
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid rgba(213,180,95,.32);
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
  background: #062f31;
  scrollbar-color: #d5b45f rgba(255,255,255,.08);
  scrollbar-width: auto;
}
.commission-calculation-scroll-nav > div { height: 1px; min-width: 100%; }
.commission-calculation-table-wrap {
  position: relative;
  height: clamp(360px, 62vh, 760px);
  max-height: none;
  margin-top: 0;
  overflow: auto;
  border-radius: 0 0 12px 12px;
  scrollbar-gutter: stable both-edges;
  scrollbar-color: #d5b45f rgba(255,255,255,.08);
}
.commission-calculation-table thead th {
  position: sticky;
  top: 0;
  z-index: 12;
  background: #123f40;
  box-shadow: inset 0 -1px 0 rgba(213,180,95,.42), 0 4px 10px rgba(0,0,0,.18);
}
.commission-calculation-table thead th:first-child { z-index: 13; }

/* v0.10.16: zeitabhängige Provisionstabellen und Simulation */
.commission-rule-status,
.simulation-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  white-space: nowrap;
}

.commission-rule-status.production {
  background: rgba(35, 115, 86, 0.12);
  color: var(--success, #237356);
}

.commission-rule-status.simulation,
.simulation-pill {
  background: rgba(126, 86, 190, 0.12);
  color: #68429a;
}

.commission-simulation-section {
  margin-top: 32px;
  padding-top: 28px;
  border-top: 2px solid var(--border, #dde3ea);
}

.commission-simulation-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 18px;
}

.commission-simulation-heading h3,
.commission-simulation-subtitle {
  margin: 4px 0 6px;
}

.commission-simulation-heading p {
  max-width: 960px;
  margin: 0;
  color: var(--muted, #667085);
}

.commission-simulation-subtitle {
  margin-top: 24px;
  font-size: 1rem;
}

.commission-simulation-table-wrap {
  max-height: 520px;
}

.commission-simulation-table {
  min-width: 2450px;
}

.commission-simulation-ambassador-table,
.commission-simulation-level-table {
  min-width: 1120px;
}

.commission-difference {
  font-weight: 800;
}

.commission-difference.positive {
  color: var(--success, #237356);
}

.commission-difference.negative {
  color: var(--danger, #b42318);
}

.commission-difference.neutral {
  color: var(--muted, #667085);
}

@media (max-width: 900px) {
  .commission-simulation-heading {
    flex-direction: column;
  }
}

/* v0.10.18: Monatsabrechnung - aufklappbare Empfaengerdetails */
.commission-recipient-link { border: 0; padding: 0; background: transparent; color: inherit; font: inherit; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(213,180,95,.65); text-underline-offset: 3px; cursor: pointer; }
.commission-recipient-link:hover, .commission-recipient-link:focus-visible { color: #d5b45f; }
.commission-month-detail-modal-card { width: min(1080px, 96vw); }
.commission-month-detail-table tfoot th { border-top: 2px solid var(--border); }

#panel-altbo-reviews .altbo-tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
#panel-altbo-reviews .altbo-tabs [aria-selected="true"] { color: #0a3333; background: #f2df91; }

#panel-altbo-reviews .sponsor-comparison th:first-child { width: 50%; }

#panel-altbo-reviews fieldset {
  min-width: 0;
  margin: 1rem 0;
  border: 1px solid #f2df91;
  color: #fff7df;
  background: #0a3333;
}
#panel-altbo-reviews fieldset label,
#panel-altbo-reviews fieldset legend { color: #fff7df; }
#panel-altbo-reviews fieldset input {
  color: #fff7df;
  background: #0a3333;
}
/* B5-UI: keep native choices and their entire clickable label on one row. */
#panel-altbo-reviews .altbo-choice {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
  gap: .65rem;
  width: 100%;
  min-height: 44px;
  padding: .5rem 0;
  line-height: 1.5;
  cursor: pointer;
}
#panel-altbo-reviews input[type="checkbox"],
#panel-altbo-reviews input[type="radio"] {
  width: 20px;
  height: 20px;
  min-width: 20px;
  margin: .125rem 0 0;
  padding: 0;
  accent-color: #f2df91;
  cursor: pointer;
}
#panel-altbo-reviews label,
#panel-altbo-reviews legend {
  min-width: 0;
  max-width: 100%;
  color: #fff7df;
  overflow-wrap: anywhere;
}
#panel-altbo-reviews form,
#panel-altbo-reviews fieldset {
  display: grid;
  gap: .75rem;
  min-width: 0;
}
#panel-altbo-reviews input:not([type="checkbox"]):not([type="radio"]),
#panel-altbo-reviews select,
#panel-altbo-reviews textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: #fff7df;
  background: #0a3333;
  font: inherit;
}
#panel-altbo-reviews button {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
#panel-altbo-reviews input:focus-visible,
#panel-altbo-reviews select:focus-visible,
#panel-altbo-reviews textarea:focus-visible,
#panel-altbo-reviews button:focus-visible,
#panel-altbo-reviews .altbo-choice:focus-within {
  outline: 3px solid #f2df91;
  outline-offset: 3px;
}
#panel-altbo-reviews button[hidden] { display: none; }
#panel-altbo-reviews .altbo-removal {
  color: #fff7df;
  background: #0a3333;
  border: 1px solid #f2df91;
  border-radius: 8px;
  padding: 1rem;
  margin-block: 1rem;
}
#panel-altbo-reviews .altbo-removal label,
#panel-altbo-reviews .altbo-removal p { color: #fff7df; }
#panel-altbo-reviews .altbo-removal select,
#panel-altbo-reviews .altbo-removal textarea { color: #fff7df; background: #0a3333; }
