:root{
  --bg:#eef4fb;
  --panel:#ffffff;
  --border:#d7e0ee;
  --text:#22304a;
  --muted:#6c7b96;
  --primary:#2c77f4;
  --primary-dark:#185fce;
  --danger:#d95a5a;
  --success:#2f9e59;
  --warn:#d6a728;
  --shadow:0 10px 24px rgba(26, 60, 115, .08);
  --radius:18px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
a{text-decoration:none;color:inherit}
button,input,select{font:inherit}
button{cursor:pointer}
.page-wrap{padding:18px;max-width:1280px;margin:0 auto}
.topbar{position:sticky;top:0;z-index:20;background:rgba(238,244,251,.94);backdrop-filter:blur(8px);display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px;border-bottom:1px solid rgba(215,224,238,.8)}
.topbar h1{margin:0 0 4px;font-size:32px}
.muted{margin:0;color:var(--muted)}
.topbar-actions{display:flex;gap:10px;flex-wrap:wrap}
.btn{border:1px solid var(--border);background:#fff;color:var(--text);padding:11px 16px;border-radius:14px;font-weight:700;box-shadow:none}
.btn:hover{border-color:#b9cae5}
.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}
.btn-danger{background:#fff5f5;border-color:#f0c1c1;color:#a53c3c}
.btn-ghost{background:transparent}
.btn-full{width:100%}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-bottom:18px}
.section-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}
.section-head h2{margin:0;font-size:22px}
.toolbar-grid{display:grid;grid-template-columns:minmax(240px,1fr) 260px;gap:16px;align-items:start}
.toolbar-grow{position:relative}
.toolbar-cell{display:flex;flex-direction:column;gap:8px}
.field-label{font-size:13px;font-weight:700;color:var(--muted)}
input[type=text], select{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:#fff;color:var(--text)}
input[type=text]:focus, select:focus{outline:none;border-color:#8fb2f7;box-shadow:0 0 0 4px rgba(44,119,244,.11)}
.search-results{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.search-result,.search-empty{border:1px solid var(--border);background:#fff;border-radius:14px;padding:10px 12px;text-align:left}
.search-result{display:flex;flex-direction:column;gap:4px}
.search-result span{font-size:13px;color:var(--muted)}
.flash-message{display:none;margin-top:12px;padding:10px 12px;border-radius:12px;font-weight:700}
.flash-message.show{display:block}
.flash-message.success{background:#e8f8ee;color:#267b47}
.flash-message.warn{background:#fff6dc;color:#8f6f0e}
.save-status{margin-top:10px;font-size:13px;color:var(--muted)}
.error-text{color:#b33b3b}
.time-section + .time-section{margin-top:14px}
.time-heading{margin:0 0 8px;font-size:18px}
.overview-list{display:flex;flex-direction:column;gap:8px}
.overview-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.overview-main{display:flex;align-items:center;gap:12px;border:1px solid var(--border);background:#fff;border-radius:14px;padding:12px 14px;text-align:left;min-height:54px}
.overview-main:hover{border-color:#b9cae5}
.overview-row.active .overview-main{border-color:#7ea8f7;background:#eef5ff}
.overview-dot{width:12px;height:12px;border-radius:999px;display:inline-block;flex:0 0 12px}
.tone-green{background:#29a356}.tone-yellow{background:#d7ab20}.tone-red{background:#d9534f}
.overview-text{font-weight:700;line-height:1.35}
.overview-delete{width:38px;height:38px;border-radius:999px;border:1px solid var(--border);background:#fff;color:#8b96aa;font-size:24px;line-height:1}
.detail-card{display:flex;flex-direction:column;gap:16px}
.quick-add-bar{display:grid;grid-template-columns:minmax(220px,1fr) minmax(180px,280px) auto;gap:10px;align-items:end;padding:14px;border:1px solid var(--border);border-radius:16px;background:#f8fbff}
.detail-line-label{font-weight:700;line-height:1.35}
.quick-add-input{min-width:0}
.detail-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.field-block{display:flex;flex-direction:column;gap:8px}
.capacity-bar{display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap;padding:14px;border:1px solid var(--border);border-radius:16px;background:#fcfdff}
.capacity-info{font-weight:700}
.capacity-actions{display:flex;gap:10px;flex-wrap:wrap}
.children-table,.appell-table{display:flex;flex-direction:column;gap:8px}
.children-head,.child-table-row,.appell-head,.appell-row{display:grid;grid-template-columns:58px minmax(180px,1fr) repeat(5,56px);gap:8px;align-items:center}
.children-head,.appell-head{font-size:13px;font-weight:700;color:var(--muted)}
.children-head-day,.appell-head-day{text-align:center}
.child-table-row,.appell-row{padding:8px 0;border-top:1px solid #edf1f7}
.child-number-btn,.child-name-btn{border:1px solid var(--border);background:#fff;border-radius:14px;padding:12px;text-align:left;min-height:48px}
.child-number-btn{text-align:center;font-weight:700}
.child-table-row.open .child-number-btn,.child-table-row.open .child-name-btn{border-color:#8fb2f7;background:#eef5ff}
.child-action-row{display:grid;grid-template-columns:minmax(160px,1fr) auto minmax(160px,1fr) auto;gap:10px;align-items:center;padding:6px 0 12px 66px}
.attendance-cell{height:48px;border-radius:16px;border:1px solid var(--border);background:#fff;font-size:24px;font-weight:700;text-align:center}
.attendance-large{height:58px;font-size:28px}
.attendance-cell.state-1{background:#e8f8ee;border-color:#9cd3b2;color:#1f7f44}
.attendance-cell.state-2{background:#fff0f0;border-color:#efbbbb;color:#b44444}
.empty-state{padding:18px;border:1px dashed var(--border);border-radius:16px;color:var(--muted);text-align:center}
.appell-block{border:1px solid var(--border);border-radius:18px;padding:16px;margin-bottom:14px;background:#fff}
.appell-block-title{margin:0 0 14px;font-size:20px}
.appell-number,.appell-name{padding:12px;border:1px solid transparent}
.appell-number{font-weight:700;text-align:center}
.pulse-highlight{animation:pulse 1.2s ease}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(44,119,244,.34)}100%{box-shadow:0 0 0 16px rgba(44,119,244,0)}}
.login-page{min-height:100vh;display:grid;place-items:center;padding:20px}
.login-card{width:min(100%,420px);background:#fff;border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);padding:22px}
.login-card h1{margin:0 0 8px}
.login-form{display:flex;flex-direction:column;gap:14px;margin-top:18px}
.alert.error{background:#fff0f0;color:#b44444;padding:10px 12px;border-radius:12px;margin-top:14px}

@media (max-width: 920px){
  .toolbar-grid{grid-template-columns:1fr}
  .detail-fields{grid-template-columns:1fr}
  .quick-add-bar{grid-template-columns:1fr}
}
@media (max-width: 760px){
  .page-wrap{padding:12px}
  .topbar{padding:14px;position:static}
  .topbar h1{font-size:28px}
  .overview-row{grid-template-columns:1fr 40px}
  .overview-text{font-size:15px}
  .children-head,.child-table-row,.appell-head,.appell-row{grid-template-columns:44px minmax(130px,1fr) repeat(5,46px);gap:6px}
  .child-action-row{grid-template-columns:1fr; padding-left:0}
  .attendance-cell{height:44px;font-size:20px}
  .attendance-large{height:52px;font-size:26px}
}


.block-color-blue{background:linear-gradient(180deg,#eef5ff 0%,#ffffff 100%);border-color:#cfe0ff;}
.block-color-green{background:linear-gradient(180deg,#ecfbf0 0%,#ffffff 100%);border-color:#c7ead1;}
.block-color-yellow{background:linear-gradient(180deg,#fff8e8 0%,#ffffff 100%);border-color:#f3e0a6;}
.block-color-pink{background:linear-gradient(180deg,#fff0f6 0%,#ffffff 100%);border-color:#f2c4d6;}
.block-color-purple{background:linear-gradient(180deg,#f4efff 0%,#ffffff 100%);border-color:#d8c9ff;}
.overview-row.block-color-blue .overview-main,.appell-block.block-color-blue{background:linear-gradient(180deg,#eef5ff 0%,#ffffff 100%);}
.overview-row.block-color-green .overview-main,.appell-block.block-color-green{background:linear-gradient(180deg,#ecfbf0 0%,#ffffff 100%);}
.overview-row.block-color-yellow .overview-main,.appell-block.block-color-yellow{background:linear-gradient(180deg,#fff8e8 0%,#ffffff 100%);}
.overview-row.block-color-pink .overview-main,.appell-block.block-color-pink{background:linear-gradient(180deg,#fff0f6 0%,#ffffff 100%);}
.overview-row.block-color-purple .overview-main,.appell-block.block-color-purple{background:linear-gradient(180deg,#f4efff 0%,#ffffff 100%);}
.color-picker-bar{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:12px 14px;border:1px solid var(--border);border-radius:16px;background:#fafcff;margin-bottom:14px;}
.color-actions{display:flex;gap:10px;flex-wrap:wrap;}
.color-dot{width:34px;height:34px;border-radius:999px;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.12);cursor:pointer;}
.color-dot.active{box-shadow:0 0 0 3px rgba(44,119,244,.25);transform:scale(1.06);}
.color-dot.color-blue{background:#9ec4ff;}
.color-dot.color-green{background:#9ed7ae;}
.color-dot.color-yellow{background:#f1d37a;}
.color-dot.color-pink{background:#f0afc9;}
.color-dot.color-purple{background:#c0a8ff;}
.row-highlight{background:#ededed !important;transition:background .25s ease;}


/* --- Deutlichere Kurszeit-Gruppierung --- */
.time-section{
  border:2px solid #000;
  border-radius:18px;
  padding:14px 12px 12px;
  margin:0 0 18px;
  background:#fff;
}
.time-section + .time-section{
  margin-top:18px;
}
.time-heading{
  margin:0 0 10px;
  padding:0 4px;
  font-size:18px;
  font-weight:800;
  color:#111;
}

/* --- Zeiten-Manager --- */
.modal-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.42);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:1000;
}
.modal-backdrop.hidden{display:none;}
.modal-card{
  width:min(100%,560px);
  background:#fff;
  border:1px solid var(--border);
  border-radius:22px;
  box-shadow:var(--shadow);
  padding:18px;
}
.modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.modal-head h2{
  margin:0;
  font-size:24px;
}
.times-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin:14px 0 12px;
  max-height:48vh;
  overflow:auto;
}
.time-manage-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}
.time-manage-input{
  min-width:0;
}
.times-add-bar{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}