*{box-sizing:border-box}body{margin:0;font:15px system-ui,sans-serif;color:#182535;background:#f1f5f9}header{display:flex;justify-content:space-between;align-items:center;padding:18px 26px;background:#132c41;color:white;gap:16px}header h1{font-size:23px;margin:0}header a{color:#c8f5ff}.layout{display:grid;grid-template-columns:320px minmax(0,1fr);min-height:90vh}aside{padding:18px;background:#fff;border-right:1px solid #d5dde5}main{padding:24px;min-width:0}h2{font-size:20px}h3{margin-top:24px}.branch{border-left:2px solid #d8e5ec;padding-left:12px;margin-top:18px}.branch h3,.branch h4{margin:12px 0}.weapon{display:flex;gap:5px;padding:4px 0}button{cursor:pointer;border:1px solid #bdcbd8;background:white;color:#124c60;border-radius:6px;padding:8px 10px;margin:3px 3px 3px 0;font:inherit}button:hover{background:#e1f3f5}button:disabled{opacity:.5;cursor:wait}input,select,textarea{font:inherit;border:1px solid #b6c4d1;border-radius:5px;padding:8px;max-width:100%;background:white;color:#182535}label{display:flex;flex-direction:column;gap:5px}.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.filters label{min-width:140px;flex:1}textarea{width:100%}.hint{font-size:13px;color:#526479;line-height:1.6}.summary{padding:14px 0;font-weight:600}.chart{background:white;border-radius:8px;padding:10px}canvas{width:100%;height:330px;display:block}.tablewrap{overflow:auto}table{border-collapse:collapse;width:100%;background:white}th,td{text-align:left;padding:10px;border-bottom:1px solid #dfe7ed;vertical-align:top}th{white-space:nowrap}dialog{width:min(850px,95vw);max-height:92vh;overflow:auto;border:0;border-radius:10px;padding:24px}dialog::backdrop{background:#11283e99}.seriesrow{display:flex;gap:12px;align-items:end;margin:12px 0}.seriesrow input{width:155px}.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}#error,#formError{color:#ac1226}#error{background:#ffe4e8;padding:14px}button[type=submit],#addSession{background:#12677a;color:white}#title{overflow-wrap:anywhere}@media(max-width:850px){.layout{grid-template-columns:1fr}aside{border-bottom:1px solid #cbd5e1}main{padding:15px}header{padding:15px;flex-wrap:wrap}.seriesrow{flex-wrap:wrap}.seriesrow input{width:120px}}

/* BEGIN series-table-v3 */
#sessions > tr > td { vertical-align: top; }
#sessions .series-results { width: auto; min-width: 255px; border: 1px solid #d7e2ea; border-collapse: separate; border-spacing: 0; border-radius: 7px; overflow: hidden; font-size: 14px; }
#sessions .series-results th { padding: 7px 12px; background: #eaf1f6; color: #344054; font-size: 12px; font-weight: 600; white-space: nowrap; text-align: right; border-bottom: 1px solid #d7e2ea; }
#sessions .series-results td { padding: 6px 12px; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; border-bottom: 1px solid #e8edf2; }
#sessions .series-results th:first-child, #sessions .series-results td:first-child { text-align: left; }
#sessions .series-results tbody tr:nth-child(even) { background: #f7fafc; }
#sessions .series-results tbody tr:last-child td { border-bottom: 0; }
#sessions .series-results .series-legacy { font-size: 12px; color: #995500; text-align: left; }
#sessions .result-number { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* END series-table-v3 */

[hidden]{display:none!important}.toolbar{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.toolbar form{margin:0}.toolbar button{padding:6px 10px}.authcard{max-width:560px;margin:6vh auto;background:white;padding:30px;border-radius:12px;border:1px solid #d8e3ec}.authcard label{margin:16px 0}.authcard h1{font-size:25px}.authcard p{line-height:1.6}.error{color:#a5162e;background:#fff0f2;padding:12px}.authcard a{color:#12677a}@media(max-width:650px){.authcard{margin:20px 12px;padding:22px}.toolbar{gap:10px}}

/* Bestleistungen einzelner 10-Schuss-Serien */
.record-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px;margin:14px 0}
.record-card{background:#fff;border:1px solid #d7e2ea;border-top:4px solid #147d92;border-radius:8px;padding:16px}
.record-card h4{margin:0 0 12px;color:#344054;font-size:15px}
.record-card .record-value{margin:0 0 8px;font-size:30px;font-weight:700;color:#12677a;font-variant-numeric:tabular-nums}
.record-secondary{margin:0;font-variant-numeric:tabular-nums}
.record-card .hint{margin:8px 0 0}

/* Form und Serienverlauf */
.form-card{background:white;border:1px solid #d7e2ea;border-top:4px solid #147d92;border-radius:8px;padding:16px;margin:18px 0}.form-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.form-heading h3{margin:0}.form-controls{display:flex;gap:12px;flex-wrap:wrap}.form-controls label{font-size:12px;color:#526479}.form-controls input{width:175px}.form-controls select{max-width:100%}.form-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}.form-value{font-size:27px;font-weight:700;color:#12677a;font-variant-numeric:tabular-nums;margin:4px 0}.form-card>p{margin-bottom:0}.form-stat{min-width:0}#formTarget:invalid{border-color:#ac1226}.progress-stats{grid-template-columns:repeat(3,minmax(0,1fr))}#progressChart{height:250px;margin:12px 0}.form-card summary{cursor:pointer;color:#12677a;padding:8px 0}.form-card details table{max-width:700px}.form-card details td:not(:first-child){font-variant-numeric:tabular-nums;text-align:right}.form-card details th:not(:first-child){text-align:right}@media(max-width:1100px){.form-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:450px){.form-stats{gap:12px}.progress-stats{grid-template-columns:1fr}.form-value{font-size:23px}.form-controls{width:100%}.form-controls label{flex:1;min-width:0}.form-controls input{width:100%}}

/* Unabhängige Filter für die Trainingstabelle */
.table-filter-card{margin:20px 0 8px;padding:14px 16px;background:#eaf1f6;border:1px solid #d7e2ea;border-radius:8px}.table-filter-card h3{margin:0 0 12px;font-size:16px}.table-filter-card .filters label{flex:0 1 180px}.table-filter-card p{margin:8px 0 0}#tableTo:invalid{border-color:#ac1226}@media(max-width:650px){.table-filter-card .filters label{flex:1 1 140px}}

/* Benutzerverwaltung und Freigaben */
.badge{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:9px;background:#fde7a6;color:#5c4200;font-size:12px;font-weight:600;vertical-align:middle}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.notice{color:#14532d;background:#e8f7ee;padding:12px}
.authcard.wide{max-width:1000px}
form.inline{display:inline;margin:0}
table.users td{vertical-align:middle}table.users tr.pending{background:#fff8e1}table.users button{padding:5px 9px;font-size:14px}
.admin-course{border:1px solid #d7e2ea;border-radius:8px;padding:12px 14px;margin:14px 0}.admin-course-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.admin-course h3{margin:0;font-size:16px}
.danger-zone{margin-top:28px;padding:14px 16px;border:1px solid #f1b7c0;border-radius:8px;background:#fff7f8}.danger-zone h2,.danger-zone h3{margin-top:0}
button.danger,button[type=submit].danger{background:#ac1226;border-color:#ac1226;color:white}
.admin-course-meta{margin:4px 0 0}

/* Aenderungsprotokoll */
.chart-changes{color:#8a5a12}
.cmp-warning{color:#7a4a00;background:#fff5e0;border-left:4px solid #b7791f;padding:10px 12px;margin:12px 0}.cmp-warning:empty{display:none}
#cmpPeriods{margin-top:12px}

/* Anpassbare Ansicht */
.workspace-actions{display:flex;gap:8px;flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0 4px}.kpi{background:white;border:1px solid #d7e2ea;border-radius:8px;padding:10px 14px;display:flex;flex-direction:column;gap:2px;min-width:0}.kpi strong{font-size:22px;color:#12677a;font-variant-numeric:tabular-nums}.kpi .hint{line-height:1.3}
.sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;align-items:start}.section-item{grid-column:1/-1;min-width:0}.section-item.half{grid-column:auto}
.section-item.half .form-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
.view-list{list-style:none;padding:0;margin:14px 0}.view-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid #d7e2ea;border-radius:8px;margin:6px 0;background:white}.view-item.dragging{opacity:.5;border-style:dashed}
.view-check{flex-direction:row;align-items:center;gap:8px;flex:1;min-width:0}.drag-handle{cursor:grab;color:#7a8a9b;font-size:18px;user-select:none}.view-item select{width:auto}.view-item button{padding:5px 10px;margin:0}
.tree-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.tree-head h2{margin:12px 0}#toggleTree{display:none}
@media(max-width:1100px){.sections{grid-template-columns:1fr}.section-item.half{grid-column:1/-1}.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){#toggleTree{display:inline-block}#treePanel.collapsed #tree,#treePanel.collapsed #addDiscipline{display:none}}
@media(max-width:450px){.view-item{flex-wrap:wrap}.view-check{flex-basis:100%}}
.temp-password{margin:16px 0;padding:14px 16px;border:2px solid #12677a;border-radius:8px;background:#eef8fa}.temp-password h3{margin-top:0}.temp-password code{font-size:22px;letter-spacing:1px;user-select:all;background:white;padding:4px 10px;border-radius:5px;border:1px solid #b6c4d1}
.flash{margin:0;padding:14px 26px;background:#e8f7ee;color:#14532d;border-bottom:1px solid #b7e1c6;font-weight:600}

/* Trainingsstruktur: einklappbar mit Suche */
.tree-tools{display:flex;gap:6px;margin:10px 0 4px}.tree-tools input{flex:1;min-width:0;padding:6px 8px}.tree-tools button{margin:0;padding:6px 8px;font-size:13px;white-space:nowrap}
.tree-node{margin-top:6px}.tree-node>summary{cursor:pointer;display:flex;align-items:baseline;gap:8px;padding:6px 4px;border-radius:6px;list-style:none}.tree-node>summary::-webkit-details-marker{display:none}
.tree-node>summary::before{content:'▸';color:#7a8a9b;width:12px;flex:none}.tree-node[open]>summary::before{content:'▾'}.tree-node>summary:hover{background:#f1f5f9}
.tree-discipline{border-left:2px solid #d8e5ec;padding-left:6px;margin-top:12px}.tree-discipline>summary .tree-name{font-weight:700;font-size:16px}
.tree-course{margin-left:12px}.tree-course>summary .tree-name{font-weight:600}
.tree-name{flex:1;min-width:0;overflow-wrap:anywhere}.tree-count{font-size:12px;color:#7a8a9b;white-space:nowrap}
.tree-actions{display:flex;flex-wrap:wrap;gap:0 4px;margin:0 0 4px 20px}.tree-actions button{padding:4px 8px;font-size:13px}
.tree-course .weapon{margin-left:20px}
@media(max-width:850px){#treePanel.collapsed .tree-tools{display:none}}
/* Serien in der Einheiten-Tabelle kompakt */
.series-box>summary{cursor:pointer;display:flex;gap:6px 10px;align-items:baseline;flex-wrap:wrap;max-width:420px}.series-box[open]>summary{margin-bottom:8px}
.series-count{font-weight:600;white-space:nowrap}.series-chips{font-variant-numeric:tabular-nums;color:#344054}
.more-row{text-align:center}.more-row button{margin:3px}
.series-box{min-width:230px}
.app-version{margin:28px auto 18px;text-align:center;color:#6b7c88;font-size:12px}

/* Diagramm: Tooltip und Gesten */
.chart{position:relative}#chart{touch-action:pan-y;cursor:crosshair;user-select:none;-webkit-user-select:none}
.chart-tip{position:absolute;z-index:2;pointer-events:none;max-width:min(280px,90%);padding:6px 10px;border-radius:6px;background:#132c41;color:white;font-size:13px;line-height:1.4;box-shadow:0 4px 12px #0003}

/* Touch-Bedienung: groessere Ziele, 16px-Schrift verhindert das automatische Hineinzoomen in iOS */
@media(pointer:coarse){
button{min-height:44px;padding:10px 14px}
input,select,textarea{font-size:16px}input:not([type=checkbox]):not([type=radio]),select{min-height:44px}
input[type=checkbox]{width:22px;height:22px}
.toolbar a{display:inline-block;padding:10px 2px}.toolbar button{padding:8px 12px}
.tree-node>summary{padding:11px 6px}.tree-tools button,.tree-actions button,.view-item button{min-height:40px;padding:8px 12px}
.weapon button{min-height:44px}.series-box>summary{padding:8px 0}
}

/* Schmale Bildschirme */
@media(max-width:650px){
header{padding:12px 14px}header h1{font-size:19px}.toolbar{gap:4px 12px;font-size:14px}
main{padding:12px}aside{padding:12px 14px}.form-card{padding:12px}
.filters{gap:10px}.filters label{min-width:0;flex:1 1 140px}
.workspace-actions button{flex:1 1 auto}
dialog{width:100vw;max-width:100vw;max-height:100dvh;margin:auto 0 0;border-radius:12px 12px 0 0;padding:16px}
dialog .actions{position:sticky;bottom:-16px;margin:18px -16px -16px;padding:12px 16px;background:white;border-top:1px solid #dfe7ed}
dialog .actions button{flex:1}
.seriesrow{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:end;padding:10px 0;margin:0;border-bottom:1px solid #eef2f6}.seriesrow>span{align-self:center;font-weight:600}.seriesrow input{width:100%}.seriesrow>button{grid-column:2;grid-row:1;justify-self:end;margin:0;padding:6px 12px;min-height:38px}
}

/* Tabellen als Karten, sobald der Platz fuer alle Spalten nicht reicht. Container-Abfrage statt Bildschirmbreite:
   greift auf Handy und Tablet ebenso wie bei halber Bereichsbreite. Karten nebeneinander, wenn Platz ist. */
.cards{container:cards/inline-size}
@container cards (max-width:860px){
table.stack,table.stack>tbody{display:block;background:transparent}table.stack>thead{display:none}
table.stack>tbody{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:10px;margin:10px 0}
table.stack>tbody>tr{display:flex;flex-direction:column;background:white;border:1px solid #d7e2ea;border-radius:8px;padding:4px 12px 10px;min-width:0}
table.stack>tbody>tr:has(>td[colspan]){grid-column:1/-1;background:transparent;border:0}
table.stack>tbody>tr>td{display:block;border:0;padding:6px 0}
table.stack>tbody>tr>td[data-label]{display:grid;grid-template-columns:minmax(96px,38%) minmax(0,1fr);gap:10px;text-align:left}
table.stack>tbody>tr>td[data-label]::before{content:attr(data-label);font-size:13px;color:#526479;text-align:left}
table.stack>tbody>tr>td[data-label]>*{grid-column:2}#sessions>tr>td.result-number{text-align:left}
table.stack>tbody>tr>td:first-child{font-weight:700;border-bottom:1px solid #eef2f6;padding-bottom:8px}
table.stack>tbody>tr>td:last-child{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}table.stack>tbody>tr>td:last-child::before{display:none}table.stack>tbody>tr>td:last-child button{flex:1;margin:0}
table.stack>tbody>tr>td[colspan]{display:block;font-weight:400;text-align:center}
/* Serien ueber die volle Kartenbreite, damit die Detailtabelle nicht aus der Karte ragt */
table.stack>tbody>tr>td.card-wide{display:block}table.stack>tbody>tr>td.card-wide::before{display:block;margin-bottom:2px}
#sessions .series-box{min-width:0}#sessions .series-box>summary{max-width:none}
#sessions .series-box .series-results{width:100%;min-width:0}#sessions .series-box .series-results th{white-space:normal}
/* Zeilen nebeneinanderliegender Karten aneinander ausrichten (Subgrid): Ort, Serien, Summen und Knoepfe stehen
   auf gleicher Hoehe, auch wenn eine Karte Fotos oder mehr Serien hat. Ohne Subgrid bleibt es bei einfachen Karten. */
@supports(grid-template-rows:subgrid){
table.stack>tbody{row-gap:0}
table.stack>tbody>tr{display:grid;grid-template-rows:subgrid;row-gap:0;margin-bottom:10px}
#sessions>tr{grid-row:span 8}#changes>tr{grid-row:span 6}
table.stack>tbody>tr:has(>td[colspan]){display:block;grid-row:auto}
table.stack>tbody>tr>td:last-child{align-self:end;margin-top:0}table.stack>tbody>tr>td[data-label]{align-content:start}
}
}

/* Ueberschrift steht schon in der aufklappbaren Kopfzeile; nur fuer Screenreader behalten */
#formTitle,#progressTitle{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Auswahllisten mit langen Texten breiter, damit sie nicht abgeschnitten werden */
.filters label:has(>select){flex:2 1 220px}
/* Einheitliche Feldhoehe auf allen Geraeten. Safari (iPad/iPhone) zeichnet Auswahllisten sonst nativ ohne Innenabstand
   und leere Datumsfelder hoeher, wodurch Felder in einer Zeile versetzt stehen. Auswahlpfeil daher selbst gezeichnet. */
input:not([type=checkbox]):not([type=radio]):not([type=file]),select{height:40px;line-height:22px}
select{-webkit-appearance:none;appearance:none;padding-right:32px;text-overflow:ellipsis;background:white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23526479' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 12px center/12px 8px}
@supports(-webkit-touch-callout:none){input[type=date]{-webkit-appearance:none;appearance:none;display:block;width:100%;min-width:0;text-align:left}input[type=date]::-webkit-date-and-time-value{text-align:left;margin:0}}
.filters button{min-height:40px;margin-top:0;margin-bottom:0}
@media(pointer:coarse){input:not([type=checkbox]):not([type=radio]):not([type=file]),select{height:44px}.filters button{min-height:44px}}
/* Nebeneinanderliegende Bereiche gleich hoch; eingeklappte Bereiche behalten ihre eigene Hoehe */
.sections{align-items:stretch}.section-item:not([open]){align-self:start}

/* Fotos */
.photo-editor{border:1px solid #d7e2ea;border-radius:8px;padding:10px 14px 4px;margin:14px 0 0}.photo-editor legend{padding:0 6px;font-weight:600}
.photo-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px;margin:4px 0 8px}
.photo-tile{position:relative;aspect-ratio:1;border-radius:6px;overflow:hidden;background:#eaf1f6}.photo-tile img{width:100%;height:100%;object-fit:cover;display:block}
.photo-tile.photo-new{outline:2px dashed #147d92;outline-offset:-2px}
.photo-remove{position:absolute;top:4px;right:4px;margin:0;width:30px;height:30px;min-height:0;padding:0;border-radius:50%;border:0;background:#132c41cc;color:white;font-size:18px;line-height:30px}
.photo-remove:hover{background:#ac1226}
.photo-actions{display:flex;flex-wrap:wrap;gap:6px}.photo-actions button{margin:0}.photo-status:empty{display:none}
.photo-strip{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.photo-thumb{padding:0;margin:0;border:1px solid #d7e2ea;border-radius:6px;overflow:hidden;width:56px;height:56px;min-height:0;background:#eaf1f6}.photo-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.photo-more{margin:0;width:56px;height:56px;min-height:0;padding:0;font-weight:600}
.photo-viewer{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:0;border-radius:0;background:#0b1620;color:white;overflow:hidden}
.photo-viewer[open]{display:flex;flex-direction:column}.photo-viewer::backdrop{background:#000c}
.photo-viewer-bar{display:flex;align-items:center;gap:14px;padding:10px 14px;background:#132c41}.photo-viewer-bar span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.photo-viewer-bar a{color:#c8f5ff}.photo-viewer-bar button{margin:0}
.photo-viewer-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px}
.photo-viewer-stage img{max-width:100%;max-height:100%;min-width:0;object-fit:contain;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.photo-viewer-stage>button{flex:none;width:48px;height:64px;margin:0;font-size:30px;line-height:1;background:#ffffff1a;border-color:#ffffff33;color:white}
@media(max-width:650px){.photo-viewer-stage{padding:0;position:relative}.photo-viewer-stage>button{position:absolute;top:50%;transform:translateY(-50%);z-index:1;background:#0008}#photoPrev{left:6px}#photoNext{right:6px}}
