:root {
  --ww-blue: #008ccd;
  --ww-darkblue: #002d55;
  --ww-red: #e60005;
  --ww-beige: #f5f0e6;
  --ww-blue-60: #73afdc;
  --ww-blue-30: #b4d7eb;
  --ww-darkblue-60: #698caf;
  --ww-darkblue-30: #b4c3d7;
  --gray-900: #2d2b29;
  --gray-700: #554f4a;
  --gray-400: #e0ddd6;
  --gray-200: #efeeea;
  --white: #fff;
  --shadow: 0 10px 30px rgba(0, 45, 85, .08);
  --radius: 14px;
}
* { box-sizing: border-box; }
html { font-family: "Open Sans", Arial, Helvetica, sans-serif; color: var(--gray-900); background: #f8fafb; }
body { margin: 0; min-height: 100vh; }
a { color: var(--ww-darkblue); text-decoration: none; }
a:hover { color: var(--ww-blue); }
button, input, select, textarea { font: inherit; }
input, select, textarea { width: 100%; border: 1px solid #c7c4bd; border-radius: 8px; padding: .75rem .85rem; background: #fff; color: var(--gray-900); }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(0, 140, 205, .16); border-color: var(--ww-blue); }
input[type="checkbox"] { width: auto; }
label { display: block; font-weight: 700; color: var(--ww-darkblue); margin-bottom: .4rem; }
small, .muted { color: var(--gray-700); }
code { background: var(--gray-200); border-radius: 6px; padding: .16rem .38rem; word-break: break-word; }
h1, h2, h3 { color: var(--ww-blue); margin-top: 0; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.9rem, 4vw, 2.7rem); line-height: 1.12; }
h2 { font-size: 1.25rem; }
.maritime-stripes { height: 10px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; background: white; }
.maritime-stripes span { background: var(--ww-blue); }
.site-header { min-height: 88px; background: white; border-bottom: 1px solid var(--gray-400); display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1rem 2rem; position: sticky; top: 0; z-index: 20; }
.brand { display: flex; align-items: center; gap: 1.1rem; min-width: 0; }
.brand img { width: min(390px, 48vw); max-height: 62px; object-fit: contain; object-position: left center; }
.brand-product { border-left: 1px solid var(--gray-400); padding-left: 1rem; color: var(--ww-darkblue); font-weight: 700; white-space: nowrap; }
.header-meta { display: flex; align-items: center; gap: .8rem; color: var(--gray-700); }
.user-chip { background: var(--ww-beige); color: var(--ww-darkblue); padding: .4rem .7rem; border-radius: 999px; }
.link-button { border: 0; background: transparent; color: var(--ww-darkblue); cursor: pointer; padding: 0; }
.layout { display: grid; grid-template-columns: 245px minmax(0, 1fr); min-height: calc(100vh - 140px); }
.sidebar { background: var(--ww-darkblue); padding: 1.5rem 1rem; display: flex; flex-direction: column; gap: .35rem; }
.sidebar a { color: white; padding: .8rem .9rem; border-radius: 8px; }
.sidebar a:hover, .sidebar a.active { background: var(--ww-blue); color: white; }
.content { padding: 2rem; max-width: 1500px; width: 100%; margin: 0 auto; }
.site-footer { background: white; border-top: 1px solid var(--gray-400); padding: 1rem 2rem; display: flex; justify-content: space-between; gap: 1rem; color: var(--gray-700); font-size: .9rem; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; margin-bottom: 1.5rem; }
.page-heading p { margin-bottom: 0; }
.eyebrow { text-transform: uppercase; letter-spacing: .12em; color: var(--ww-darkblue); font-size: .76rem; font-weight: 800; margin-bottom: .45rem !important; }
.panel { background: white; border: 1px solid var(--gray-400); border-radius: var(--radius); padding: 1.35rem; box-shadow: var(--shadow); margin-bottom: 1.5rem; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.panel-heading h2 { margin-bottom: 0; }
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.stat-grid.compact .stat-card { min-height: 115px; }
.stat-card { background: var(--ww-beige); border-radius: var(--radius); padding: 1.2rem; min-height: 130px; display: flex; flex-direction: column; justify-content: center; gap: .35rem; border-left: 5px solid var(--ww-blue); }
.stat-card strong { color: var(--ww-darkblue); font-size: 2rem; }
.stat-card span { color: var(--gray-700); }
.two-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.align-start { align-items: start; }
.list-cards { display: grid; gap: .7rem; }
.list-card { border: 1px solid var(--gray-400); padding: .85rem 1rem; border-radius: 9px; display: flex; flex-direction: column; gap: .25rem; }
.list-card:hover { border-color: var(--ww-blue); background: #f6fbfe; }
.details-list { margin: 0; }
.details-list > div { display: grid; grid-template-columns: minmax(120px, .8fr) 1.4fr; gap: 1rem; padding: .72rem 0; border-bottom: 1px solid var(--gray-200); }
.details-list > div:last-child { border-bottom: 0; }
.details-list dt { color: var(--gray-700); }
.details-list dd { margin: 0; color: var(--ww-darkblue); font-weight: 600; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .8rem .75rem; border-bottom: 1px solid var(--gray-200); vertical-align: top; }
th { color: var(--ww-darkblue); background: #fbfcfd; font-size: .86rem; }
.badge { display: inline-flex; border-radius: 999px; padding: .3rem .6rem; background: var(--gray-200); color: var(--gray-700); font-size: .8rem; font-weight: 700; }
.badge.success, .badge.queued { background: #e6f6fb; color: var(--ww-darkblue); }
.badge.warning, .badge.running { background: #fff4d6; color: #765300; }
.badge.failed { background: #fde8e8; color: #8b0000; }
.badge.success { background: #e8f6ee; color: #145a32; }
.button { display: inline-flex; justify-content: center; align-items: center; border-radius: 8px; border: 1px solid transparent; padding: .7rem 1rem; font-weight: 700; cursor: pointer; text-align: center; }
.button.primary { background: var(--ww-blue); color: white; }
.button.primary:hover { background: var(--ww-darkblue); color: white; }
.button.secondary { background: white; color: var(--ww-darkblue); border-color: var(--ww-darkblue-30); }
.button.secondary:hover { border-color: var(--ww-blue); color: var(--ww-blue); }
.button.warning { background: var(--ww-red); color: white; }
.button.small { padding: .45rem .65rem; font-size: .86rem; }
.button.full { width: 100%; }
.button-row { display: flex; gap: .6rem; align-items: center; }
.button-row.wrap { flex-wrap: wrap; }
.form-panel fieldset { border: 0; padding: 0; margin: 0 0 1.5rem; }
.form-panel legend { color: var(--ww-blue); font-size: 1.18rem; font-weight: 800; padding: 0; margin-bottom: 1rem; }
.form-grid { display: grid; gap: 1rem; }
.form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.span-2 { grid-column: 1 / -1; }
.form-actions { display: flex; justify-content: flex-end; gap: .7rem; margin-top: 1.4rem; }
.form-panel.narrow { max-width: 620px; }
.form-panel p { margin: 0 0 1rem; }
.errorlist { color: var(--ww-red); margin: .35rem 0 0; padding-left: 1.2rem; font-size: .86rem; }
.auto-data { display: flex; gap: .65rem; flex-wrap: wrap; align-items: center; padding: .9rem; background: var(--ww-beige); color: var(--ww-darkblue); border-radius: 8px; margin-top: 1rem; }
.auto-data span { background: white; border-radius: 999px; padding: .3rem .55rem; }
.notice { background: var(--ww-beige); color: var(--ww-darkblue); border-left: 4px solid var(--ww-blue); padding: .8rem 1rem; border-radius: 7px; margin-top: 1rem; }
.messages { margin-bottom: 1rem; }
.message { padding: .85rem 1rem; border-radius: 8px; background: var(--ww-beige); border-left: 4px solid var(--ww-blue); }
.message + .message { margin-top: .5rem; }
.message.error { border-color: var(--ww-red); background: #fff1f1; }
.message.success { background: #eaf7ef; border-color: #248a52; }
.empty-state { padding: 2rem; text-align: center; border: 1px dashed var(--gray-400); border-radius: 9px; color: var(--gray-700); }
.station-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 1rem; }
.station-card { border: 1px solid var(--gray-400); border-radius: 10px; padding: 1rem; display: grid; gap: .8rem; }
.station-card h3 { margin-bottom: .25rem; }
.station-card > .badge { justify-self: start; }
.station-meta { display: flex; flex-direction: column; gap: .25rem; color: var(--gray-700); font-size: .88rem; }
.timeline { list-style: none; padding: 0; margin: 1rem 0 0; }
.timeline li { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-top: 1px solid var(--gray-200); }
.check-list { list-style: none; padding: 0; }
.check-list li { padding: .45rem 0 .45rem 1.6rem; position: relative; }
.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--ww-blue); font-weight: 800; }
.search-bar { display: flex; gap: .6rem; margin-bottom: 1rem; }
.release-list { display: grid; gap: 1rem; }
.release-card { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding: 1rem; border: 1px solid var(--gray-400); border-radius: 10px; }
.release-card h3 { margin-bottom: .45rem; }
.login-body { min-height: 100vh; background: linear-gradient(180deg, #f8fbfd 0%, var(--ww-beige) 100%); display: grid; place-items: center; padding: 2rem; }
.login-body .maritime-stripes { position: fixed; top: 0; left: 0; right: 0; }
.login-card { width: min(460px, 100%); background: white; border-radius: 18px; box-shadow: 0 20px 60px rgba(0, 45, 85, .14); padding: 2rem; border: 1px solid var(--gray-400); }
.login-logo.long { width: 100%; max-height: 120px; object-fit: contain; }
.login-logo.round { width: 150px; display: block; margin: 0 auto; }
.slogan { color: var(--ww-blue); font-weight: 800; text-align: center; }
.login-card h1 { text-align: center; font-size: 2rem; margin-bottom: .4rem; }
.login-card > .muted { text-align: center; }
.stack-form { display: grid; gap: .55rem; margin-top: 1.4rem; }
.stack-form .button { margin-top: .6rem; }
.station-content { max-width: 1180px; margin: 0 auto; padding: 2rem; }
.hero-panel { display: flex; justify-content: space-between; align-items: center; background: var(--ww-beige); }
.hero-panel img { width: 150px; opacity: .9; }
.station-header { position: static; }
@media (max-width: 1000px) {
  .layout { grid-template-columns: 1fr; }
  .sidebar { flex-direction: row; overflow-x: auto; padding: .75rem 1rem; }
  .sidebar a { white-space: nowrap; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .site-header { padding: .8rem 1rem; align-items: flex-start; }
  .brand img { width: 170px; }
  .brand-product { display: none; }
  .header-meta > span:first-child { display: none; }
  .content, .station-content { padding: 1rem; }
  .page-heading, .release-card { flex-direction: column; }
  .two-column, .form-grid.two, .stat-grid { grid-template-columns: 1fr; }
  .details-list > div { grid-template-columns: 1fr; gap: .25rem; }
  .form-actions { flex-direction: column-reverse; }
  .form-actions .button { width: 100%; }
  .site-footer { flex-direction: column; padding: 1rem; }
  .hero-panel img { display: none; }
  .button-row { flex-wrap: wrap; }
}
.config-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.config-card { border: 1px solid var(--gray-400); border-radius: 10px; padding: 1rem; display: flex; flex-direction: column; gap: .35rem; min-height: 110px; }
.config-card strong { color: var(--ww-darkblue); }
.config-card span { color: var(--gray-700); font-size: .9rem; }
.config-card:hover { border-color: var(--ww-blue); background: #f6fbfe; }
.setup-panel { border-left: 5px solid var(--ww-blue-60); }
.setup-panel.ready { border-left-color: #248a52; }
.setup-panel .panel-heading p { margin: .25rem 0 0; color: var(--gray-700); }
.setup-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .65rem; }
.setup-step { display: flex; gap: .6rem; align-items: center; border: 1px solid var(--gray-400); padding: .75rem; border-radius: 8px; }
.setup-step > span { color: var(--ww-darkblue-60); font-size: 1.2rem; }
.setup-step.complete { background: #f1f9f4; border-color: #b9dec8; }
.setup-step.complete > span { color: #248a52; }
.log-output { background: #13283b; color: #eef7fb; border-radius: 9px; padding: 1rem; overflow: auto; white-space: pre-wrap; word-break: break-word; max-height: 520px; font: .86rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }

/* Wachbuch V0.2 */
.active-book-card { border-left: 5px solid var(--ww-blue); background: #f8fcfe; }
.weather-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.weather-box { border: 1px solid var(--gray-400); border-radius: 10px; padding: 1rem; background: #fbfcfd; }
.weather-box ul, .form-panel ul { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .45rem; }
.weather-box label, .form-panel li label { display: flex; align-items: center; gap: .55rem; font-weight: 500; color: var(--gray-900); margin: 0; }
.checkbox-row { display: flex; flex-wrap: wrap; gap: 1rem; }
.checkbox-row > div { min-width: 220px; }
.checklist-panel { display: grid; gap: .55rem; }
.checklist-line { margin: 0; }
.checklist-line button { width: 100%; border: 1px solid var(--gray-400); background: white; border-radius: 9px; padding: .75rem .85rem; display: flex; align-items: center; gap: .75rem; text-align: left; color: var(--gray-900); cursor: pointer; }
.checklist-line button:hover:not(:disabled) { border-color: var(--ww-blue); background: #f6fbfe; }
.checklist-line button:disabled { cursor: default; opacity: .9; }
.checklist-line button > span:first-child { color: var(--ww-blue); font-size: 1.25rem; font-weight: 800; width: 1.25rem; }
.checklist-line.complete button { background: #f1f9f4; border-color: #b9dec8; }
.checklist-line small { display: inline-block; margin-left: .35rem; background: var(--ww-beige); color: var(--ww-darkblue); border-radius: 999px; padding: .1rem .4rem; }
.incident-list { display: grid; gap: 1rem; }
.incident-card { border: 1px solid var(--gray-400); border-left: 5px solid var(--ww-blue); border-radius: 10px; padding: 1rem; background: #fff; }
.incident-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.incident-title h3 { margin: .55rem 0 0; }
.incident-meta, .tag-row { display: flex; flex-wrap: wrap; gap: .55rem; align-items: center; margin-top: .75rem; color: var(--gray-700); }
.tag { display: inline-flex; border-radius: 999px; padding: .25rem .55rem; background: var(--ww-blue-30); color: var(--ww-darkblue); font-size: .82rem; }
.danger-text { color: var(--ww-red); }
.completion-panel { border-top: 5px solid var(--ww-blue); }
.completion-panel.completed { border-top-color: #248a52; }
.success-box { display: grid; gap: .7rem; background: #f1f9f4; border: 1px solid #b9dec8; border-radius: 10px; padding: 1rem; color: #145a32; }
tfoot th { background: var(--ww-beige); color: var(--ww-darkblue); }
@media (max-width: 720px) {
  .weather-grid { grid-template-columns: 1fr; }
  .incident-title { flex-direction: column; }
  .checkbox-row { display: grid; }
}

/* Wachbuch V0.2.3 */
.end-time-list { display: grid; gap: .85rem; }
.end-time-row { display: grid; grid-template-columns: minmax(220px, 1.2fr) minmax(180px, .8fr) minmax(150px, .6fr); gap: 1rem; align-items: end; padding: 1rem; border: 1px solid var(--gray-400); border-radius: 10px; background: #fbfcfd; }
.end-time-row > div:first-child { display: flex; flex-direction: column; gap: .25rem; }
.end-time-row > div:first-child strong { color: var(--ww-darkblue); }
.end-time-row > div:first-child span { color: var(--gray-700); }
.until-watch-end label { display: flex; align-items: center; gap: .55rem; margin: 0 0 .7rem; }
.until-watch-end input { width: auto; }
.stat-card small { display: block; line-height: 1.35; }
@media (max-width: 720px) {
  .end-time-row { grid-template-columns: 1fr; align-items: stretch; }
}

/* Rollen und WW-Bordbuch V0.3 */
.span-two { grid-column: 1 / -1; }
.field { min-width: 0; }
.field > small { display: block; margin-top: .35rem; line-height: 1.35; }
.field-error { display: block; color: var(--ww-red); margin-top: .35rem; font-size: .86rem; }
.checkbox-label { display: flex; align-items: center; gap: .55rem; color: var(--ww-darkblue); }
.checkbox-label input { width: auto; }
.button.danger { background: var(--ww-red); color: white; }
.button.danger:hover { background: #b50004; color: white; }
.danger-zone { border-left: 5px solid var(--ww-red); }
.boat-card { border-left: 5px solid var(--ww-blue); }
@media (max-width: 720px) {
  .span-two { grid-column: auto; }
}
.boat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }

/* V0.3.1 – Mitglieder- und Qualifikationsverwaltung */
.filter-row { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; margin-bottom: 1rem; }
.filter-row input[type="search"] { flex: 1 1 18rem; }
.filter-row select { min-width: 10rem; }
button.badge { border: 0; font: inherit; cursor: pointer; }
button.badge:hover { filter: brightness(.96); }


/* V0.3.5 – kompakte Auswahl und gekoppelte Einsatzmittel */
.completion-overview { border-top: 5px solid var(--ww-blue); }
.completion-number { color: var(--ww-darkblue); font-size: 1.35rem; white-space: nowrap; }
.progress-track { width: 100%; height: .7rem; border-radius: 999px; overflow: hidden; background: var(--gray-400); margin: .75rem 0; }
.progress-track > span { display: block; height: 100%; background: var(--ww-blue); transition: width .2s ease; }
.missing-tags { margin-top: .7rem; }
.warning-tag { background: #fff3cd; color: #6b4f00; }
.warning-box { display: grid; gap: .65rem; background: #fff8e5; border: 1px solid #e6c66a; border-radius: 10px; padding: 1rem; color: #5d4800; }
.info-box { display: grid; gap: .65rem; background: #f2f8fc; border: 1px solid var(--ww-blue-30); border-radius: 10px; padding: 1rem; }
.success-text { color: #145a32; font-weight: 600; }
.autosave-status { min-height: 1.35rem; margin-bottom: .8rem; color: var(--gray-700); font-size: .88rem; }
.autosave-status.saving { color: var(--ww-darkblue); }
.autosave-status.saved { color: #145a32; }
.autosave-status.failed { color: var(--ww-red); }
.compact-filter { margin: 0 0 .8rem; }
.compact-filter .active { background: var(--ww-darkblue); color: white; border-color: var(--ww-darkblue); }
.compact-panel { padding-top: .8rem; padding-bottom: .8rem; }
.compact-timeline { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.compact-timeline li { display: grid; gap: .15rem; padding-left: .85rem; border-left: 3px solid var(--ww-blue-30); }
.compact-timeline span { color: var(--gray-700); font-size: .9rem; }
.mobile-quickbar { display: none; }
.narrow { max-width: 760px; margin-inline: auto; }
.button-row.wrap { flex-wrap: wrap; }

@media (max-width: 720px) {
  body:has(.mobile-quickbar) main { padding-bottom: 5.6rem; }
  .mobile-quickbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 1px; background: var(--ww-darkblue); box-shadow: 0 -4px 18px rgba(0, 45, 85, .18); }
  .mobile-quickbar a { display: flex; align-items: center; justify-content: center; min-height: 3.9rem; padding: .55rem .35rem; color: white; text-align: center; font-size: .82rem; font-weight: 700; text-decoration: none; border-right: 1px solid rgba(255,255,255,.2); }
  .mobile-quickbar a:last-child { border-right: 0; }
  .completion-overview .panel-heading { align-items: flex-start; }
}


/* V0.3.12 – Pilot-Feedback */
.ticket-message { border-top: 1px solid var(--gray-400); padding: 1rem 0; }
.ticket-message:first-child { border-top: 0; }
.ticket-message.internal { background: var(--ww-beige); border-radius: .5rem; padding: 1rem; margin: .75rem 0; }
.ticket-message-meta { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin-bottom: .45rem; color: var(--gray-700); }
.text-block { white-space: normal; line-height: 1.55; }
.card.subtle { background: var(--gray-200); }
@media (max-width: 760px) { .brand img { width: min(250px, 64vw); max-height: 54px; } }
.page-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; margin-bottom: 1.5rem; }
.card { background: white; border: 1px solid var(--gray-400); border-radius: var(--radius); padding: 1.35rem; box-shadow: var(--shadow); margin-bottom: 1.5rem; }
.table-card { overflow-x: auto; }
.grid.two-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
.detail-list { display: grid; grid-template-columns: minmax(130px, .7fr) 1.5fr; gap: .65rem 1rem; margin: 0 0 1rem; }
.detail-list dt { color: var(--gray-700); }
.detail-list dd { margin: 0; color: var(--ww-darkblue); font-weight: 600; }
.filter-bar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; margin-bottom: 1rem; }
.filter-bar input[type="search"] { flex: 1 1 18rem; }
.filter-bar select { width: auto; min-width: 10rem; }
.status-pill { display: inline-flex; border-radius: 999px; padding: .3rem .6rem; background: var(--gray-200); color: var(--gray-700); font-size: .8rem; font-weight: 700; }
.form-field { display: grid; gap: .35rem; }
@media (max-width: 720px) { .page-header { flex-direction: column; } .grid.two-columns { grid-template-columns: 1fr; } .detail-list { grid-template-columns: 1fr; gap: .2rem; } }

/* V0.5.0 – Kalender der Digitalen Wache */
.calendar-toolbar{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1rem}.calendar-toolbar h2{margin:0;min-width:14rem;text-align:center}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.4rem;margin-bottom:.4rem}.calendar-head>div{font-weight:700;text-align:center;color:var(--ww-darkblue);padding:.45rem}.calendar-day{min-height:8rem;border:1px solid var(--gray-400);border-radius:.45rem;padding:.4rem;background:white}.calendar-day.empty{background:var(--gray-200)}.calendar-day-number{font-weight:800;margin-bottom:.35rem}.calendar-entry{display:block;margin:.25rem 0;padding:.4rem;border-left:4px solid var(--ww-blue);background:var(--gray-200);border-radius:.25rem;text-decoration:none;font-size:.82rem}.calendar-entry.open{border-left-color:var(--ww-red)}.calendar-entry.ok{border-left-color:#27823f}.calendar-entry span{display:block;color:var(--gray-700);font-size:.75rem;margin-top:.15rem}.inline-form{display:inline}.link-button{border:0;background:none;color:var(--ww-red);text-decoration:underline;cursor:pointer;padding:0}.helper-header-logo{max-height:45px}
@media(max-width:900px){.calendar-grid{min-width:760px}.panel:has(.calendar-grid){overflow-x:auto}.calendar-day{min-height:7rem}}

.select-search { margin-bottom: .55rem; }
select[data-searchable-select] { min-height: 15rem; }

.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.5rem;margin-bottom:.5rem}.calendar-head{text-align:center}.calendar-day{min-height:8rem;border:1px solid var(--border,#d7dde2);border-radius:.6rem;padding:.5rem;background:#fff}.calendar-day.empty{background:#f4f6f7}.calendar-number{display:block;margin-bottom:.35rem}.calendar-plan{display:grid;gap:.25rem;padding:.45rem;border-left:4px solid #008ccd;background:#eef8fc;border-radius:.35rem;margin-bottom:.35rem}.calendar-plan form{margin:0}.attendance-qr{width:min(100%,160px);height:auto;background:#fff;padding:.5rem}.field-search{margin-bottom:1rem}@media(max-width:800px){.calendar-grid{grid-template-columns:1fr}.calendar-head{display:none}.calendar-day.empty{display:none}.calendar-day{min-height:auto}.calendar-number:before{content:"Tag ";}}

.qr-planned-list{display:grid;gap:.65rem}.qr-person-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem;border:1px solid var(--border,#d7dde2);border-radius:.6rem}.qr-person-row div{display:grid;gap:.2rem}.qr-person-row small{color:var(--muted,#66727c)}@media(max-width:600px){.qr-person-row{align-items:stretch;flex-direction:column}.qr-person-row .button{width:100%}}

/* V0.7.0 – mobile Wachplanung */
.mobile-planning-agenda { display: none; }
.agenda-plan { display: grid; grid-template-columns: 4.5rem 1fr; gap: .9rem; padding: .9rem 0; border-bottom: 1px solid var(--gray-400); }
.agenda-plan:last-child { border-bottom: 0; }
.agenda-date { display: grid; align-content: start; text-align: center; border-radius: 10px; overflow: hidden; border: 1px solid var(--ww-blue-30); }
.agenda-date strong { background: var(--ww-blue); color: white; padding: .3rem; text-transform: uppercase; font-size: .78rem; }
.agenda-date span { padding: .55rem .25rem; color: var(--ww-darkblue); font-weight: 800; }
.agenda-content h3 { margin: 0 0 .2rem; }
.agenda-content p { margin: 0 0 .25rem; }
.agenda-actions { margin-top: .65rem; }
.agenda-plan.today { background: #f2f8fc; margin-inline: -.75rem; padding-inline: .75rem; border-radius: 10px; }
.agenda-plan.past { opacity: .72; }
@media (max-width: 720px) {
  .desktop-planning-calendar { display: none; }
  .mobile-planning-agenda { display: block; }
  .planning-calendar-heading { align-items: stretch; }
  .calendar-nav { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; }
  .calendar-nav .button { width: 100%; text-align: center; }
  .planning-calendar { padding: 1rem; }
  .agenda-actions .button, .agenda-actions form, .agenda-actions button { width: 100%; }
}

/* V0.7.1.3 – Detailzeilen und kompakter QR-Code */
.dashboard-detail-row{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(10rem,auto);gap:1rem;align-items:start}.dashboard-detail-row dt,.dashboard-detail-row dd{overflow-wrap:anywhere}.home-attendance{display:flex;justify-content:center;text-align:center}.login-separator{display:flex;align-items:center;gap:.75rem;margin:1.25rem 0;color:var(--gray-700)}.login-separator:before,.login-separator:after{content:"";height:1px;background:var(--gray-400);flex:1}@media(max-width:700px){.dashboard-detail-row{grid-template-columns:1fr}.dashboard-detail-row dd{margin-top:.15rem}}
/* V0.7.1.4 – einheitliches Layout für „Meine Wache“ */
.helper-content { min-height: calc(100vh - 170px); }
.helper-auth-panel { width: min(620px, 100%); margin: 0 auto; }
.helper-navigation .button.primary { background: var(--ww-blue); color: white; }
@media (max-width: 720px) {
  .helper-navigation { justify-content: flex-end; }
  .helper-navigation .button { flex: 1 1 auto; }
}

/* Version 0.7.1.5: Wachleiter-, Mitglieder- und PDF-Signatur-Workflow */
.leader-picker{margin-top:1.25rem}.leader-picker .field-search{margin-bottom:1rem}.leader-picker select{width:100%}
.signature-section{margin-top:1.5rem}.signature-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr);gap:1.5rem;align-items:start}.signature-direct,.signature-qr{border:1px solid var(--border,#d7dde2);border-radius:.75rem;padding:1rem;background:#fff}.signature-direct h3,.signature-qr h3{margin-top:0}.signature-pad-wrap{width:100%;border:2px dashed #9aa7b2;border-radius:.65rem;background:#fff;overflow:hidden;touch-action:none;margin:.75rem 0}.signature-pad{display:block;width:100%;height:auto;aspect-ratio:3/1;background:#fff;cursor:crosshair;touch-action:none}.signature-qr-box{display:grid;justify-items:center;gap:.75rem;margin-top:1rem;padding:1rem;border-radius:.65rem;background:#f4f7f9;text-align:center}.signature-qr-box img{width:min(100%,220px);height:auto;background:#fff;padding:.5rem;border-radius:.35rem}.signature-qr-box.signature-confirmed{background:#eaf7ef;border:1px solid #83c49b}.signature-mobile-page{max-width:760px;margin:0 auto}.signature-mobile-page .signature-pad{min-height:180px}.signature-status-card{display:grid;gap:.35rem;padding:.8rem 1rem;margin-top:.75rem;border-radius:.6rem;background:#eaf7ef;border-left:4px solid #2d8a52}.signature-status-card code{overflow-wrap:anywhere}
@media(max-width:800px){.signature-layout{grid-template-columns:1fr}.signature-direct,.signature-qr{padding:.85rem}.signature-pad{min-height:160px}.leader-picker{margin-top:1rem}}

/* Version 0.7.5: Anlagen-Upload direkt oder über QR-Code */
.attachment-upload-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:1.25rem;align-items:start}
.upload-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin:.8rem 0}
.upload-choice-grid.single-column{grid-template-columns:1fr}
.upload-choice{display:grid;gap:.25rem;padding:1rem;border:1px solid var(--border,#d7dde2);border-radius:.7rem;background:#f8fafb;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease}
.upload-choice:hover,.upload-choice:focus-within{border-color:#007fb5;background:#eef8fc;transform:translateY(-1px)}
.upload-choice strong{color:var(--navy,#002d55)}
.upload-choice span{font-size:.88rem;color:#5e6b75}
.upload-choice input[type=file]{width:100%;font-size:.85rem;margin-top:.4rem}
.selected-file{padding:.65rem .8rem;border-radius:.5rem;background:#f2f5f7;color:#34424d}
.attachment-qr-box{display:grid;justify-items:center;gap:.7rem;margin-top:1rem;padding:1rem;border-radius:.65rem;background:#f4f7f9;text-align:center}
.attachment-qr-box img{width:min(100%,230px);height:auto;background:#fff;padding:.5rem;border-radius:.35rem}
.attachment-qr-box.signature-confirmed{background:#eaf7ef;border:1px solid #83c49b}
.full-width{width:100%;justify-content:center}
@media(max-width:900px){.attachment-upload-layout{grid-template-columns:1fr}.upload-choice-grid{grid-template-columns:1fr}}

.required-star,.required-hint{color:#b42318;font-weight:700}.status-pill.warning{display:inline-block;background:#fff3cd;color:#664d03;border-radius:999px;padding:.25rem .65rem}.calendar-entry.status-closed{opacity:.68;filter:saturate(.55)}.calendar-entry.status-opened{outline:2px solid currentColor}.calendar-filters{margin-bottom:.75rem}


/* V0.7.6.15 – zusammengeführte Admin-Baumnavigation */
.sidebar { overflow-y: auto; }
.sidebar details { margin: 0; }
.sidebar summary { list-style: none; cursor: pointer; color: white; padding: .8rem .9rem; border-radius: 8px; font-weight: 700; display: flex; align-items: center; gap: .45rem; }
.sidebar summary::-webkit-details-marker { display: none; }
.sidebar summary::before { content: "›"; display: inline-block; width: .8rem; transition: transform .16s ease; }
.sidebar details[open] > summary::before { transform: rotate(90deg); }
.sidebar summary:hover, .sidebar summary.active { background: var(--ww-blue); }
.sidebar-subtree { display: grid; gap: .2rem; margin: .2rem 0 .45rem .65rem; padding-left: .45rem; border-left: 1px solid rgba(255,255,255,.22); }
.sidebar .sidebar-link { display: block; color: white; padding: .58rem .7rem; border-radius: 7px; font-size: .92rem; }
.sidebar .sidebar-level-1 { font-weight: 700; }
.sidebar-organization > summary { align-items: flex-start; flex-direction: column; gap: .12rem; padding: .62rem .7rem; font-size: .9rem; }
.sidebar-organization > summary::before { position: absolute; margin-left: -.05rem; }
.sidebar-organization > summary > span { padding-left: 1rem; }
.sidebar-code { font-size: .76rem; opacity: .78; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.sidebar-organization-meta { color: rgba(255,255,255,.72); font-size: .76rem; line-height: 1.3; padding: .2rem .65rem .35rem 1.7rem; }
.sidebar-level-2 { margin-left: .7rem; }
.sidebar-nested > summary { font-size: .9rem; padding: .58rem .7rem; }
.sidebar-empty { color: rgba(255,255,255,.7); font-size: .85rem; padding: .5rem .75rem; }
@media (max-width: 1000px) {
  .sidebar { flex-direction: column; overflow-x: visible; max-height: 55vh; }
  .sidebar a { white-space: normal; }
  .sidebar-subtree { min-width: 0; }
}


/* V0.7.6.16 – echtes mobiles Hamburger-Menü und mitscrollende Baum-Pfeile */
.admin-menu-toggle { display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; width:44px; height:44px; border:0; border-radius:8px; background:transparent; color:var(--ww-darkblue); font-size:1.8rem; padding:.45rem; cursor:pointer; }
.admin-sidebar-backdrop { position:fixed; inset:0; z-index:80; background:rgba(0,0,0,.52); }
.sidebar summary { position:relative; }
.sidebar summary::before { position:static !important; flex:0 0 .8rem; margin:0 !important; }
.sidebar-organization > summary { display:grid; grid-template-columns:.8rem minmax(0,1fr); align-items:start; }
.sidebar-organization > summary::before { grid-row:1 / span 2; grid-column:1; }
.sidebar-organization > summary > span { padding-left:0; grid-column:2; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
body.admin-sidebar-collapsed .layout { grid-template-columns:0 minmax(0,1fr); }
body.admin-sidebar-collapsed .sidebar { visibility:hidden; overflow:hidden; width:0; min-width:0; padding-left:0; padding-right:0; }
.admin-site-header { justify-content:flex-start; }
.admin-site-header .header-meta { margin-left:auto; }
@media (max-width:1000px) {
  .admin-menu-toggle { display:inline-flex; margin-left:0; }
  .layout { display:block; }
  .sidebar { position:fixed; z-index:90; left:0; top:0; bottom:0; width:min(88vw,360px); max-height:none; overflow-y:auto; overflow-x:hidden; transform:translateX(-105%); transition:transform .2s ease; padding:1rem; box-shadow:0 0 28px rgba(0,0,0,.35); }
  .sidebar.is-open { transform:translateX(0); }
  body.admin-menu-open { overflow:hidden; }
  .content { min-width:0; }
}


/* Benutzerbereich: mobile Navigation */
.station-menu-toggle{display:inline-flex;border:0;background:transparent;color:var(--ww-darkblue);font-size:1.85rem;line-height:1;width:44px;height:44px;align-items:center;justify-content:center;flex:0 0 44px;border-radius:8px;cursor:pointer}
.station-menu-backdrop{display:block;position:fixed;inset:0;z-index:98;background:rgba(0,0,0,.5)}.station-menu-backdrop[hidden]{display:none}.station-navigation{display:block;position:fixed;z-index:99;top:0;bottom:0;left:0;width:min(88vw,360px);overflow-y:auto;background:var(--ww-darkblue);padding:1rem;transform:translateX(-105%);transition:transform .2s ease;box-shadow:0 0 28px rgba(0,0,0,.38)}.station-navigation.is-open{transform:translateX(0)}
.station-navigation-heading{display:flex;align-items:center;justify-content:space-between;padding:.4rem .35rem .8rem;color:white}.station-navigation-heading button{border:0;background:transparent;color:white;font-size:2rem;width:44px;height:44px;cursor:pointer}
.station-navigation details{border-bottom:1px solid rgba(255,255,255,.15)}.station-navigation summary{cursor:pointer;list-style:none;color:white;font-weight:700;padding:.9rem .6rem;display:flex;gap:.55rem;align-items:center}.station-navigation summary::-webkit-details-marker{display:none}.station-navigation summary::before{content:'›';display:inline-block;transition:transform .15s ease}.station-navigation details[open]>summary::before{transform:rotate(90deg)}
.station-navigation-group{display:grid;padding:0 .4rem .7rem 1.6rem;gap:.2rem}.station-navigation a{color:white;padding:.68rem .7rem;border-radius:8px}.station-navigation a:hover,.station-navigation a:focus{background:var(--ww-blue);color:white}.station-navigation-logout{display:block;margin-top:.8rem;border:1px solid rgba(255,255,255,.4)}
body.station-menu-open{overflow:hidden}


/* Benutzerbereich: Hamburger-Menü auf Desktop und Mobilgeräten */
.station-header{display:flex;align-items:center;gap:.4rem}
.station-menu-toggle{order:0}
.station-header .brand{order:1;min-width:0}
.station-header .station-desktop-actions{order:2;margin-left:auto}

/* Einheitliche Such- und Auswahlfelder */
.ww-combobox{position:relative;width:100%}.ww-combobox-input{width:100%}.ww-combobox-native{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.ww-combobox-list{position:absolute;z-index:120;left:0;right:0;top:calc(100% + .25rem);max-height:18rem;overflow:auto;background:white;border:1px solid var(--border,#cbd2d8);border-radius:.65rem;box-shadow:0 12px 28px rgba(0,0,0,.18);padding:.3rem}.ww-combobox-option{display:block;width:100%;text-align:left;border:0;background:white;padding:.85rem .9rem;border-radius:.45rem;font:inherit;color:var(--ww-darkblue);cursor:pointer}.ww-combobox-option:hover,.ww-combobox-option:focus,.ww-combobox-option[aria-selected=true]{background:#eaf5fb;outline:none}.ww-combobox-empty{padding:.9rem;color:#666}

@media(max-width:800px){
  .station-header{display:flex;align-items:center;gap:.4rem;padding-inline:1rem}.station-menu-toggle{display:inline-flex;order:0}.station-header .brand{order:1;min-width:0;flex:1}.station-header .brand img{max-width:min(100%,280px)}.station-desktop-actions{display:none!important}
  .ww-combobox-list{position:fixed;left:1rem;right:1rem;top:auto;bottom:1rem;max-height:min(52vh,24rem);border-radius:.9rem;padding:.45rem}.ww-combobox-option{min-height:48px;padding:1rem}
}
.ww-combobox-selected{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.4rem}.ww-combobox-chip{border:1px solid #b9c9d8;background:#eef7fc;color:var(--ww-darkblue);border-radius:999px;padding:.38rem .62rem;font:inherit;cursor:pointer}

.copy-feedback { min-height: 1.25rem; margin: .5rem 0 0; font-size: .9rem; color: var(--muted, #4b5f6f); }

/* V0.7.6.30 – Tagesereignisse direkt erhöhen */
.daily-event-list dd { display: flex; align-items: center; justify-content: flex-end; gap: .65rem; }
.daily-event-plus { width: 2rem; height: 2rem; border: 0; border-radius: 999px; font-size: 1.35rem; line-height: 1; font-weight: 700; cursor: pointer; background: var(--ww-blue, #0077a8); color: #fff; }
.daily-event-plus:active { transform: scale(.96); }
.autosave-status { min-height: 1.25rem; margin: .5rem 0 0; font-size: .9rem; }
.autosave-status.error { color: #a40000; }

/* 0.7.6.41: öffentliche QR-Mitgliedsanmeldung und Start geplanter Wachen */
.qr-member-list { display: grid; gap: .65rem; margin-top: 1rem; }
.qr-member-row { border: 1px solid var(--border, #d7dde5); border-radius: .75rem; background: #fff; }
.qr-member-row.is-present { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem 1rem; }
.qr-member-row strong, .qr-member-row small { display: block; }
.qr-member-row small { margin-top: .2rem; color: var(--muted, #5d6672); }
.qr-member-button { width: 100%; min-height: 3.25rem; border: 0; border-radius: .75rem; padding: .8rem 1rem; background: transparent; display: flex; align-items: center; justify-content: space-between; gap: 1rem; text-align: left; color: inherit; font: inherit; cursor: pointer; }
.qr-member-button:hover, .qr-member-button:focus-visible { background: #eef5fb; outline: 2px solid transparent; }
.qr-member-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .6rem; align-items: end; }
.qr-member-search-row input { width: 100%; }
.planned-watch-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem; align-items: center; }
.planned-watch-details { display: grid; gap: .25rem; color: inherit; text-decoration: none; }
.planned-watch-actions form { margin: 0; }
@media(max-width:700px){.qr-member-search-row{grid-template-columns:1fr}.qr-member-search-row .button{width:100%}.qr-member-row.is-present{align-items:flex-start;flex-direction:column}.planned-watch-card{grid-template-columns:1fr}.planned-watch-actions .button{width:100%}}