/* file: web/style/components.css */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 6px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  text-decoration: none;
  color: var(--text);
  background: #f7f7f7;
  font-size: 14px;
  min-height: 40px;
  transition: background-color .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease, transform .1s ease;
}
.btn:focus-visible,
.btn-icon:focus-visible{
  outline: 2px solid #7fb2e4;
  outline-offset: 2px;
}
.btn:hover{
  background: #f1f5f9;
  border-color: #c7d1db;
}
.btn:active{
  transform: translateY(1px);
}
.btn i{
  margin-right: 0;
  font-size: 13px;
}

.btn-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background:#f7f7f7;
  font-size: 18px;
  text-decoration: none;
  color: inherit;
}
.btn-icon i{ pointer-events:none; }
.btn-icon-avatar{
  border-radius: 999px;
  overflow: hidden;
  padding: 0;
}
.btn-icon-avatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
  border-radius: 999px;
}
.btn-icon-profile{
  border-radius: 10px;
  border-color: #ffffff;
  background: rgba(255,255,255,0.78);
  box-shadow: 0 1px 0 rgba(255,255,255,0.65) inset;
}
.btn-icon-profile.btn-icon-avatar{
  border-radius: 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btn-icon-profile.btn-icon-avatar img{
  width: 30px;
  height: 30px;
  border-radius: 8px;
}
.btn-icon-mail{
  position: relative;
  border-color: #ffffff;
  box-shadow: 0 1px 0 rgba(255,255,255,0.65) inset;
}
.btn-icon-mail.is-empty{
  background: rgba(255,255,255,0.78);
  color: #2b6519;
}
.btn-icon-mail.is-unread{
  background: #c73a32;
  border-color: #b73029;
  color: #ffffff;
}
.btn-badge{
  position: absolute;
  top: -6px;
  right: -5px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  border: 1px solid #fff;
  background: #fff;
  color: #c73a32;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
}
.btn-icon-mini{
  width: 32px;
  height: 32px;
  border-radius: 8px;
  font-size: 16px;
}

.btn-action{ background: var(--action); color:#fff; border-color: var(--action); }
.btn-filter{ background: var(--filter); color:#fff; border-color: var(--filter); }
.btn-yes{ background: var(--yes); color:#fff; border-color: var(--yes); }
.btn-no{ background: var(--no); color:#fff; border-color: var(--no); }
.btn-choice{
  background: #f8fafc;
  border-color: #d7dee6;
  color: #334155;
}
.btn-choice:hover{
  background: #f1f5f9;
  border-color: #c9d4df;
}
.btn-choice.is-active{
  background: #e8f1ff;
  border-color: #9ec2ff;
  color: #184a8b;
  box-shadow: inset 0 0 0 1px rgba(96, 146, 218, 0.16);
}
.btn-action:hover,
.btn-filter:hover,
.btn-yes:hover,
.btn-no:hover{
  color: #ffffff;
  filter: brightness(0.97);
}
.btn-choice.is-active, .btn-yes.is-active, .btn-no.is-active{ outline: 2px solid #00000020; }

.btn-group{
  display:flex;
  gap:8px;
  flex-wrap: wrap;
}
.btn-row{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.input, .select{
  width: 100%;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-size: 14px;
}

.label{ display:block; margin: 10px 0 6px 0; color: var(--muted); font-size: 13px; }

.alert{
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  margin: 10px 0;
}
.alert-info{ background:#eef5ff; }
.alert-success{ background:#e9f7ef; }
.alert-warning{ background:#fff3cd; }
.alert-danger{ background:#f8d7da; }

.card{
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px;
  background:#ffffff;
}
.page > .card + .card{
  margin-top: 16px;
}
.page > .alert + .card{
  margin-top: 14px;
}
.page > .alert + .alert{
  margin-top: 14px;
}
.page > .card + .alert{
  margin-top: 14px;
}
.page > .module-tiles + .card,
.page > .card + .module-tiles{
  margin-top: 16px;
}
.page > .module-tiles + .alert,
.page > .alert + .module-tiles,
.page > .module-tiles + .module-tiles{
  margin-top: 16px;
}
.card > h2:first-child{
  margin: -14px -14px 14px -14px;
  padding: 11px 14px;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid #d5e3d0;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(
    135deg,
    rgba(43, 101, 25, 0.22) 0%,
    rgba(43, 101, 25, 0.11) 58%,
    rgba(43, 101, 25, 0.02) 100%
  );
}

.spacer-12{ height: 12px; }
.spacer-16{ height: 16px; }
.u-sr-only{
  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;
}
.muted{ color: var(--muted); }
.auth-forgot-link{
  display:inline-block;
  margin-top: 4px;
  font-size: 14px;
  color:#2b6519;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.auth-forgot-link:hover{
  color:#1e6f2a;
}

.pwdrec-admin-item{
  padding:10px 0;
}
.pwdrec-admin-ua{
  font-size:12px;
  word-break: break-word;
}
.pwdrec-admin-form{
  margin-top:8px;
}

.dash-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.dash-card{
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  background:#ffffff;
}
.dash-card-full{
  grid-column: 1 / -1;
}
.dash-title{
  font-weight: 700;
  margin-bottom: 8px;
  font-size: 18px;
  display:flex;
  align-items:center;
  gap:6px;
}
.dash-title i{
  color: #5a6b7a;
  font-size: 18px;
}
.dash-title-link{
  color: inherit;
  text-decoration: none;
  font-weight: inherit;
}
.dash-title-link:hover{
  text-decoration: underline;
}
.dash-title-action{
  margin-left:auto;
}
.dash-title-action.btn-icon-mini{
  width:30px;
  height:30px;
  border-radius:8px;
}
.dash-kpis{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
}
.dash-kpi{
  min-width: 90px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background:#f7f7f7;
}
.dash-kpi-num{ font-size: 18px; font-weight: 700; }
.dash-kpi-label{ font-size: 12px; color: var(--muted); }

.dash-list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.dash-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--border);
  text-decoration: none;
  color: var(--text);
  background: #f9f9f9;
}
.dash-item-title{ font-weight: 600; }
.dash-item-meta{ font-size: 12px; color: var(--muted); }
.news-home-item{
  align-items: flex-start;
  justify-content: flex-start;
  gap: 10px;
}
.news-home-thumb{
  width: 54px;
  height: 54px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid #d8e4d2;
  flex: 0 0 54px;
}
.news-home-main{
  min-width: 0;
}
.news-home-head{
  font-weight: 700;
  color: var(--text);
}
.news-home-text{
  margin-top: 2px;
  color: #3e4b57;
}
.news-important{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #ffe89b;
  border: 1px solid #f0d45a;
  color: #8a6400;
  font-weight: 700;
  font-size: 12px;
}
.news-list{
  display: grid;
  gap: 10px;
}
.news-item{
  border: 1px solid #d8e4d2;
  border-radius: 12px;
  background: #fbfdfb;
  overflow: hidden;
}
.news-item.is-hidden{
  opacity: .8;
}
.news-item.is-important{
  box-shadow: inset 3px 0 0 #e3c22d;
}
.news-link{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  text-decoration: none;
  color: inherit;
  padding: 10px;
}
.news-thumb{
  width: 72px;
  height: 72px;
  align-self: flex-start;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid #d8e4d2;
  flex: 0 0 72px;
}
.news-thumb.placeholder{
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f3f7f1;
  color: #8aa186;
  font-size: 24px;
}
.news-thumb.placeholder.is-blog{
  background: #eef6ea;
  color: #3f6f3b;
}
.news-thumb.placeholder.is-news{
  background: #edf3fa;
  color: #44678a;
}
.news-main{
  min-width: 0;
  flex: 1;
}
.news-headline{
  display: flex;
  align-items: center;
  gap: 6px;
}
.news-headline h3{
  margin: 0;
  font-size: 20px;
  line-height: 1.2;
}
.news-meta{
  margin-top: 3px;
  color: var(--muted);
  font-size: 14px;
}
.news-detail-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.news-detail-meta i{
  margin-right: 6px;
}
.news-window{
  margin-top: 2px;
  color: #5b6d60;
  font-size: 13px;
}
.news-text{
  margin: 7px 0 0;
  color: #2f3f35;
}
.news-actions{
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 0 10px 10px;
}
.news-actions form{
  margin: 0;
}
.news-photo-current{
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.news-photo-current img{
  width: 84px;
  height: 56px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid #d8e4d2;
}
.news-detail-top{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.check-group{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin: 4px 0 10px;
}
.check-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#f7faf6;
  color:#1f2d1a;
  font-size:14px;
  line-height:1.2;
  cursor:pointer;
  user-select:none;
}
.check-pill input{
  margin:0;
}
.check-pill:has(input:checked){
  border-color:#9ec58f;
  background:#ebf6e7;
}
.news-filter-bar{
  margin-bottom: 10px;
  display: grid;
  gap: 8px;
}
.news-filter-tabs{
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.news-filter-search{
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 6px;
  align-items: end;
}
.news-filter-search .label{
  grid-column: 1 / -1;
  margin-bottom: 0;
}
.blog-filter-search{
  grid-template-columns: 1fr 1fr auto auto;
}
.blog-photo-card{
  margin-top: 12px;
}
.blog-comments-card{
  margin-top: 12px;
}
.blog-comment-item{
  border: 1px solid #d8e4d2;
  border-radius: 12px;
  background: #fbfdfb;
  padding: 10px;
  margin-bottom: 10px;
}
.blog-comment-item.is-moderated{
  background: #fff9e8;
  border-color: #f0d9a6;
}
.blog-comment-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #4d5f53;
  font-size: 14px;
}
.blog-comment-body{
  margin-top: 6px;
  line-height: 1.45;
}
.blog-comment-actions{
  margin-top: 8px;
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.blog-moderate-form{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.blog-moderate-form .input{
  height: 34px;
  min-width: 200px;
  padding: 6px 10px;
}
.blog-replies{
  margin-top: 8px;
  display: grid;
  gap: 8px;
}
.blog-reply-item{
  border-left: 3px solid #d6e7d0;
  background: #f7fbf6;
  border-radius: 8px;
  padding: 8px 10px;
}
.blog-reply-item.is-moderated{
  background: #fff9e8;
  border-left-color: #f0d9a6;
}
.blog-reply-form{
  margin-top: 8px;
  border-top: 1px dashed #d8e4d2;
  padding-top: 8px;
}
.blog-comment-new{
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #d8e4d2;
}
.blog-home-head{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}
.blog-status{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid #bcd3b3;
  color: #315331;
  background: #edf6ea;
  font-size: 12px;
  font-weight: 700;
}
.blog-status.is-draft{
  border-color: #f0d45a;
  color: #8a6400;
  background: #fff6d9;
}
.news-detail-body{
  margin-top: 8px;
  line-height: 1.5;
}
.news-detail-photo{
  margin: 10px 0 8px;
}
.news-detail-photo img{
  display: block;
  max-width: min(100%, 820px);
  border-radius: 12px;
  border: 1px solid #d8e4d2;
}

.dash-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 8px;
  padding: 9px 2px;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid #e2e8de;
  background: transparent;
}
.dash-row:last-child{ border-bottom: 0; }
.dash-row-title{ font-weight: 600; }
.dash-row-meta{ font-size: 12px; color: var(--muted); white-space: nowrap; }

.cache-version-card .alert{
  margin-bottom:10px;
}
.cache-version-current{
  display:grid;
  grid-template-columns: 1fr auto;
  align-items:end;
  gap:12px;
  padding:12px 14px;
  border:1px solid #d8e4d2;
  border-radius:10px;
  background:linear-gradient(180deg,#f8fcf6 0%,#f1f8ee 100%);
}
.cache-version-label{
  font-size:14px;
  color:#4f6155;
  font-weight:600;
}
.cache-version-value{
  font-size:30px;
  font-weight:800;
  letter-spacing:.3px;
  line-height:1;
  color:#203d1a;
}
.cache-version-actions{
  margin-bottom:10px;
}
.cache-version-info{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:8px 12px;
  padding-top:2px;
}
.cache-version-info-item{
  font-size:13px;
  color:#4f5d54;
}
.cache-version-info-item:last-child{
  grid-column:1 / -1;
}
.cache-version-info code{
  background:#eef3ec;
  border:1px solid #d6e0d3;
  border-radius:6px;
  padding:1px 6px;
  font-size:12px;
}
.dash-weather-warnings{
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px dashed var(--border);
}
.dash-weather-warnings-title{
  font-size: 12px;
  font-weight: 700;
  color: #9a5b00;
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom: 6px;
}
.dash-weather-warning-item{
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid #f3d089;
  background: #fff7e7;
  font-size: 12px;
  margin-bottom: 6px;
}
.dash-weather-warning-link{
  color: inherit;
  text-decoration: none;
  font-weight: 600;
}
.dash-weather-warning-link:hover{ text-decoration: underline; }
.dash-weather-warning-exp{
  color: #8a5a1d;
  margin-top: 2px;
}
.dash-weather-warning-sev-extreme{
  border-color: #e85757;
  background: #ffe8e8;
}
.dash-weather-warning-sev-severe{
  border-color: #f4a35d;
  background: #fff3e6;
}
.dash-weather-warning-sev-moderate{
  border-color: #f3d089;
  background: #fff7e7;
}
.dash-weather-warning-sev-minor{
  border-color: #d9d9d9;
  background: #f7f7f7;
}


.diary-pin-card{
  max-width: 420px;
  margin: 0 auto;
}
.diary-pin-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.diary-pin-input{
  text-align:center;
  font-size: 26px;
  letter-spacing: 10px;
  font-weight: 700;
}
.diary-pin-pad{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:8px;
}
.diary-pin-key{
  min-height: 46px;
  font-size: 16px;
}
.diary-pin-key i{
  margin-right: 0;
}
.diary-pin-key.is-clear{
  background:#f5f7f5;
}
.diary-edit-meta{
  margin-bottom: 10px;
  display:flex;
  flex-direction:column;
  gap:3px;
  font-size:12px;
  color: var(--muted);
}
.diary-page .card{
  margin-bottom: 12px;
}
.diary-page .card:last-child{
  margin-bottom: 0;
}
.diary-page .cal-title-row{
  margin-bottom: 10px;
}
.diary-page .msg-subject{
  display:inline-flex;
  align-items:center;
  gap: 7px;
}
.diary-page .msg-meta{
  font-size: 12px;
}
.diary-page .msg-preview{
  font-size: 14px;
  line-height: 1.45;
}
.diary-page .msg-item-side .btn{
  min-width: 40px;
}
.diary-item-thumb-wrap{
  flex: 0 0 auto;
  margin-right: 10px;
}
.diary-item-thumb{
  width: 52px;
  height: 52px;
  object-fit: cover;
  border-radius: 8px;
  border:1px solid var(--border);
  display:block;
  background:#fff;
}
.diary-item-thumb.placeholder{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color: var(--muted);
}
.diary-page .help-tag-cloud{
  margin-top: 12px;
}
.diary-filter-card > h2:first-child{
  margin-bottom: 8px;
}
.diary-filter-acc{
  width:100%;
  margin: -12px -12px 10px -12px;
  border-radius: 12px 12px 0 0;
}
.diary-filter-form .label{
  margin: 0 0 4px 0;
  font-size: 12px;
}
.diary-entry-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}
.diary-editor-toolbar{
  display:flex;
  gap:6px;
  margin:4px 0 6px 0;
}
.diary-editor-toolbar .btn{
  min-width:40px;
}
.diary-editor-toolbar .btn.is-active{
  border-color:#7bb174;
  background:#e9f5e5;
  color:#1f5f1a;
}
.diary-editor-help{
  margin:0 0 8px 0;
  padding:8px 10px;
  border:1px dashed #c8dcc1;
  border-radius:10px;
  background:#f7fcf4;
  font-size:13px;
  color:#2f4c2a;
}
.diary-editor-help code{
  background:#eef7ea;
  border:1px solid #d8ead1;
  border-radius:6px;
  padding:1px 5px;
  font-family:ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size:12px;
}
.diary-preview{
  margin:8px 0 10px 0;
  border:1px solid #dce8d7;
  border-radius:10px;
  background:#fbfef9;
}
.diary-preview-title{
  font-size:13px;
  font-weight:700;
  color:#2c4f22;
  border-bottom:1px solid #e2eee0;
  padding:8px 10px;
  background:#f1f8ee;
}
.diary-preview-body{
  padding:10px;
  line-height:1.5;
}
.diary-months-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.diary-filter-row{
  display:grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto;
  gap:8px;
  align-items:end;
}
.diary-filter-col{
  min-width: 0;
}
.diary-filter-actions{
  display:inline-flex;
  gap:6px;
}
.diary-filter-actions .btn{
  min-width: 40px;
  padding-left: 10px;
  padding-right: 10px;
}
.diary-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin: 8px 0 0 0;
}
.diary-new-hero{
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.diary-new-big{
  min-height:44px;
  font-size:16px;
  font-weight:700;
}
.diary-load-sentinel{
  width:100%;
  height:2px;
}
.diary-version-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid #dbe9d6;
  border-radius:10px;
  padding:8px 10px;
  margin: 0 0 8px 0;
  background:#fbfef9;
}
.diary-version-title{
  font-weight:700;
}
.diary-version-meta{
  font-size:12px;
  color:var(--muted);
}
.diary-mood-group.is-tiles{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:8px;
}
.diary-mood-group.is-tiles .diary-mood-btn{
  width:100%;
  height:auto;
  min-height:46px;
  padding:8px 10px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
}
.diary-mood-btn-label{
  font-size:14px;
  font-weight:700;
}
.diary-months-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.diary-months-year{
  font-size:14px;
  font-weight:800;
  color:#315e26;
  margin-top:8px;
}
.diary-months-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  border:1px solid #d8e7d2;
  border-radius:10px;
  padding:10px 12px;
  text-decoration:none;
  color:inherit;
  background:#fcfffb;
}
.diary-months-item:hover{
  border-color:#b9d6af;
  background:#f5fbf2;
}
.diary-months-item-label{
  font-weight:700;
}
.diary-months-item-count{
  color:var(--muted);
  font-weight:600;
}
.link-inline{
  color:#2d6f1f;
  text-decoration:none;
}
.link-inline:hover{
  text-decoration:underline;
}
.diary-mood-group{
  gap:7px;
}
.diary-mood-btn{
  width: 46px;
  height: 42px;
  padding: 0;
  border-radius: 10px;
}
.diary-mood-btn i{
  margin: 0;
  font-size: 18px;
}
.diary-mood-btn.mood-1{
  color:#b3261e;
  border-color:#e6b4b0;
  background:#fff3f2;
}
.diary-mood-btn.mood-2{
  color:#b85b20;
  border-color:#edc5a8;
  background:#fff6ee;
}
.diary-mood-btn.mood-3{
  color:#6a6f77;
  border-color:#d6dce4;
  background:#f5f7fa;
}
.diary-mood-btn.mood-4{
  color:#3f7d2e;
  border-color:#bad8b2;
  background:#f2faf0;
}
.diary-mood-btn.mood-5{
  color:#1f6a1a;
  border-color:#8dc78d;
  background:#e8f8e8;
}
.diary-mood-btn.is-active{
  outline: 2px solid rgba(23, 92, 42, 0.24);
}
.diary-mood-legend{
  margin-top: 4px;
  font-size: 12px;
}
.diary-mood-icon,
.diary-mood-text{
  color:#6a6f77;
}
.diary-mood-icon.mood-1,
.diary-mood-text.mood-1{
  color:#b3261e;
}
.diary-mood-icon.mood-2,
.diary-mood-text.mood-2{
  color:#b85b20;
}
.diary-mood-icon.mood-3,
.diary-mood-text.mood-3{
  color:#6a6f77;
}
.diary-mood-icon.mood-4,
.diary-mood-text.mood-4{
  color:#3f7d2e;
}
.diary-mood-icon.mood-5,
.diary-mood-text.mood-5{
  color:#1f6a1a;
}
.diary-entry-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  margin-bottom: 10px;
  font-size: 13px;
  color: #485867;
}
.diary-entry-meta span{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.diary-entry-body{
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:10px 12px;
  background:#fbfef9;
  line-height:1.55;
  white-space: normal;
}
.diary-entry-body p{
  margin:0 0 9px 0;
}
.diary-entry-body p:last-child{
  margin-bottom:0;
}
.diary-rich-list{
  margin:0 0 9px 0;
  padding-left:20px;
}
.diary-rich-empty{
  margin:0;
  min-height:10px;
}
.diary-month-group{
  border:1px solid #d2e5cf;
  border-radius:12px;
  overflow:hidden;
  margin-bottom:12px;
  background:#f9fdf8;
}
.diary-month-group.is-alt{
  background:#f3f9f2;
  border-color:#c9ddc5;
}
.diary-month-head{
  background: linear-gradient(90deg, #2b6519, #3f8a2c);
  color:#fff;
  padding:8px 12px;
  font-size:14px;
  font-weight:800;
}
.diary-month-body{
  padding:8px;
}
.diary-day-head{
  position: static;
  background:#e8f0e6;
  border:1px solid #c6dbc0;
  border-radius:8px;
  padding:6px 10px;
  margin:8px 0 6px 0;
  font-weight:800;
  color:#17351e;
}
.diary-day-list{
  margin-bottom:8px;
}
.diary-entry-row{
  border-left:2px solid #8ec08a;
}
.diary-entry-row .msg-item-link{
  align-items:flex-start;
}
.diary-entry-tags{
  margin-bottom:10px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.diary-photo-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap:10px;
}
.diary-photo-item{
  border:1px solid #dce8d7;
  border-radius:10px;
  background:#fbfef9;
  overflow:hidden;
}
.diary-photo-thumb{
  display:block;
  width:100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.diary-photo-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  padding:6px;
}
.diary-photo-actions{
  display:inline-flex;
  gap:6px;
}
.diary-photo-actions .btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.diary-primary-btn.is-active{
  color:#f5a000;
  border-color:#f4d18b;
  background:#fff8e9;
}
.diary-photo-actions-hint{
  margin-top:4px;
  font-size:11px;
  color:var(--muted);
}
.diary-page.is-simple .diary-entry-meta{
  font-size:15px;
}
.diary-page.is-simple .msg-preview{
  font-size:16px;
  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient: vertical;
  overflow:hidden;
}
.diary-page.is-simple .msg-subject{
  font-size:19px;
}
.diary-page.is-simple .muted{
  font-size:14px;
}
.diary-page.is-simple .diary-filter-form .label{
  font-size:13px;
}
.diary-page.is-simple .diary-item-thumb-wrap{
  display:none;
}

@media (max-width: 640px){
  .diary-page .msg-item-link{
    padding: 10px;
  }
  .diary-page .msg-item{
    gap: 8px;
  }
  .diary-page .card{
    padding: 10px;
    border-radius: 10px;
  }
  .diary-page .card > h2:first-child{
    margin: -10px -10px 10px -10px;
    padding: 9px 10px;
    border-radius: 10px 10px 0 0;
    min-height: 40px;
  }
  .diary-filter-acc{
    margin: -10px -10px 10px -10px;
    border-radius: 10px 10px 0 0;
  }
  .diary-filter-row{
    grid-template-columns: 1fr;
    gap:7px;
  }
  .diary-filter-actions{
    justify-content:flex-end;
  }
  .diary-mood-btn{
    width: 42px;
    height: 38px;
  }
  .diary-photo-actions .btn span{
    display:none;
  }
  .diary-item-thumb{
    width:46px;
    height:46px;
  }
  .news-thumb{
    width:56px;
    height:56px;
    flex-basis:56px;
  }
  .news-filter-search{
    grid-template-columns: 1fr auto;
  }
  .blog-filter-search{
    grid-template-columns: 1fr auto;
  }
  .blog-filter-search #blog_filter_cat{
    grid-column: 1 / -1;
  }
  .news-headline h3{
    font-size:18px;
  }
  .diary-day-head{ position: static; }
}

.weather-card{
  margin-bottom: 12px;
}
.weather-page-head{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.weather-head-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 11px;
  border-radius:999px;
  border:1px solid #d6e0d1;
  background:#f7faf6;
  color:#4f6155;
  font-size:12px;
  font-weight:700;
}
.weather-head-pill.is-minor{
  background:#eef6ff;
  border-color:#bfd7f1;
  color:#245b8f;
}
.weather-head-pill.is-moderate,
.weather-head-pill.is-warning{
  background:#fff7e8;
  border-color:#ebd096;
  color:#8a5a06;
}
.weather-head-pill.is-severe,
.weather-head-pill.is-extreme{
  background:#fff0f0;
  border-color:#efb3b3;
  color:#a22c2c;
}
.weather-head-pill.is-cold{
  background:#eff7ff;
  border-color:#c6d8f0;
  color:#2d5f90;
}
.weather-now{
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.weather-now-layout{
  display:grid;
  grid-template-columns:minmax(220px, 290px) minmax(0, 1fr);
  gap:12px;
  align-items:start;
}
.weather-now-hero{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  padding:14px;
  border:1px solid #dce6d6;
  border-radius:16px;
  background:linear-gradient(180deg, #fbfefd 0%, #f4faf1 100%);
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.05);
}
.weather-now-side{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.weather-now-head{
  display:flex;
  align-items:center;
  gap: 8px;
  font-size:24px;
  font-weight: 700;
  color:#243126;
}
.weather-now-meta{
  font-size: 13px;
  color:#5b6a5d;
}
.weather-now-temp{
  font-size:40px;
  line-height:1;
  font-weight:900;
  color:#25352a;
}
.weather-now-kpis{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
}
.weather-now-kpi{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  padding:9px 10px;
  border-radius:12px;
  border:1px solid #dce6d6;
  background:#f8fbf7;
  box-shadow:0 6px 14px rgba(55, 84, 52, 0.03);
}
.weather-now-kpi.is-good{
  background:#eef8ea;
  border-color:#b9ddb5;
}
.weather-now-kpi.is-moderate{
  background:#fff8ea;
  border-color:#ebcb8b;
}
.weather-now-kpi.is-poor{
  background:#fff3ea;
  border-color:#e9b886;
}
.weather-now-kpi.is-very-poor,
.weather-now-kpi.is-high{
  background:#fff0f0;
  border-color:#e4b5b5;
}
.weather-now-kpi.is-mid{
  background:#fff7ea;
  border-color:#e8ce8a;
}
.weather-now-kpi.is-low{
  background:#eef8ea;
  border-color:#b9ddb5;
}
.weather-now-kpi-label{
  font-size:12px;
  color:#62736e;
  font-weight:700;
}
.weather-now-kpi strong{
  font-size:18px;
  color:#304a35;
}
.weather-short-outlook{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
}
.weather-short-outlook.weather-short-outlook-compact{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}
.weather-short-outlook-item{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:9px 11px;
  border-radius:12px;
  border:1px solid #dde7d7;
  background:#fbfcf9;
}
.weather-short-outlook-compact .weather-short-outlook-item{
  padding:8px 10px;
}
.weather-short-outlook-label{
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
  color:#4f6155;
}
.weather-short-outlook-main{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:14px;
  font-weight:700;
  color:#243b2f;
}
.weather-short-outlook-meta{
  font-size:12px;
  color:#667085;
}
.weather-now-updated{
  font-size: 12px;
  color: var(--muted);
}
.weather-text-title{
  font-size: 16px;
  font-weight: 800;
  color: #314933;
}
.weather-text-body{
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: #28352a;
}
.weather-text-stamp{
  margin-top: 8px;
  font-size: 12px;
  color: #617164;
}
.weather-highlights{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap:10px;
  margin-top:14px;
}
.weather-highlight-card{
  padding:12px 14px;
  border-radius:14px;
  background:linear-gradient(180deg, #ffffff 0%, #f6faf4 100%);
  border:1px solid #d8e4d1;
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.05);
}
.weather-highlight-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:700;
  color:#5d6f5f;
}
.weather-highlight-value{
  margin-top:8px;
  font-size:24px;
  font-weight:800;
  color:#243126;
  line-height:1.1;
}
.weather-highlight-meta{
  margin-top:4px;
  font-size:12px;
  color:#617164;
}
.weather-health-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap:12px;
}
.weather-health-card{
  padding:14px;
  border:1px solid #d8e4d1;
  border-radius:16px;
  background:linear-gradient(180deg, #ffffff 0%, #f8fbf6 100%);
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.05);
}
.weather-health-title{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:16px;
  font-weight:800;
  color:#314933;
}
.weather-health-sub{
  margin-top:6px;
  font-size:12px;
  color:#617164;
}
.weather-health-table{
  margin-top:10px;
}
.weather-health-table th,
.weather-health-table td{
  white-space:normal;
  font-size:12px;
}
.weather-uv-list{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
  margin-top:12px;
}
.weather-uv-item{
  padding:12px;
  border-radius:14px;
  border:1px solid #d6e2d0;
  background:#f8fbf6;
}
.weather-uv-item.is-low{
  background:#eef8ea;
  border-color:#cfe2c6;
}
.weather-uv-item.is-mid{
  background:#fff7e8;
  border-color:#ebcb8b;
}
.weather-uv-item.is-high{
  background:#fff0f0;
  border-color:#e4b5b5;
}
.weather-uv-item-label{
  font-size:12px;
  font-weight:700;
  color:#5d6f5f;
}
.weather-uv-item-value{
  margin-top:6px;
  font-size:26px;
  font-weight:800;
  color:#243126;
  line-height:1;
}
.weather-uv-item-meta{
  margin-top:6px;
  font-size:12px;
  color:#617164;
  text-transform:uppercase;
  letter-spacing:.03em;
  font-weight:700;
}
.weather-bio-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}
.weather-bio-item{
  padding:12px;
  border-radius:14px;
  border:1px solid #d6e2d0;
  background:#f8fbf6;
}
.weather-bio-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  margin-bottom:8px;
}
.weather-bio-date{
  font-size:14px;
  font-weight:800;
  color:#243126;
}
.weather-bio-period{
  font-size:12px;
  font-weight:700;
  color:#617164;
}
.weather-bio-line{
  font-size:13px;
  line-height:1.5;
  color:#304133;
}
.weather-bio-recommendation{
  margin-top:8px;
  font-size:12px;
  color:#5b6a5d;
}
.weather-air-grid{
  display:grid;
  grid-template-columns:minmax(220px, 280px) minmax(0, 1fr);
  gap:12px;
}
.weather-air-main{
  padding:16px;
  border-radius:18px;
  border:1px solid #d8e4d1;
  background:linear-gradient(180deg, #ffffff 0%, #f8fbf6 100%);
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.05);
}
.weather-air-main.is-good{
  background:linear-gradient(180deg, #eef8ea 0%, #e3f3dd 100%);
  border-color:#b9ddb5;
}
.weather-air-main.is-moderate{
  background:linear-gradient(180deg, #fff8ea 0%, #fff0cf 100%);
  border-color:#ebcb8b;
}
.weather-air-main.is-poor,
.weather-air-trend-item.is-poor{
  background:linear-gradient(180deg, #fff3ea 0%, #ffe2ca 100%);
  border-color:#e9b886;
}
.weather-air-main.is-very-poor,
.weather-air-trend-item.is-very-poor{
  background:linear-gradient(180deg, #fff0f0 0%, #ffd7d7 100%);
  border-color:#e4b5b5;
}
.weather-air-main-label{
  font-size:13px;
  font-weight:700;
  color:#5d6f5f;
}
.weather-air-main-value{
  margin-top:8px;
  font-size:48px;
  line-height:1;
  font-weight:900;
  color:#243126;
}
.weather-air-main-meta{
  margin-top:8px;
  font-size:14px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.03em;
  color:#314933;
}
.weather-air-main-stamp{
  margin-top:12px;
  font-size:12px;
  color:#617164;
}
.weather-air-side{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.weather-air-kpis{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(130px, 1fr));
  gap:10px;
}
.weather-air-kpi{
  padding:12px;
  border-radius:14px;
  border:1px solid #d8e4d1;
  background:linear-gradient(180deg, #ffffff 0%, #f8fbf6 100%);
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.04);
}
.weather-air-kpi-label{
  display:block;
  font-size:12px;
  font-weight:700;
  color:#5d6f5f;
}
.weather-air-kpi strong{
  display:block;
  margin-top:8px;
  font-size:24px;
  line-height:1.1;
  color:#243126;
}
.weather-air-kpi-unit{
  display:block;
  margin-top:4px;
  font-size:12px;
  color:#617164;
}
.weather-aqi-chart-block{
  margin-top:2px;
}
.weather-aqi-chart-title{
  margin:0 0 8px;
  font-size:13px;
  font-weight:700;
  color:#3f5544;
}
.weather-aqi-chart-wrap{
  padding:10px 10px 8px;
  border:1px solid #dbe6d5;
  border-radius:14px;
  background:linear-gradient(180deg, #fbfefd 0%, #f6faf4 100%);
}
.weather-aqi-chart-svg{
  width:100%;
  height:168px;
  display:block;
}
.weather-aqi-chart-band{
  opacity:.6;
}
.weather-aqi-chart-band.good{
  fill:#e8f5e5;
}
.weather-aqi-chart-band.moderate{
  fill:#fff3cf;
}
.weather-aqi-chart-band.poor{
  fill:#ffe2ca;
}
.weather-aqi-chart-band.very-poor{
  fill:#ffd7d7;
}
.weather-aqi-chart-grid{
  stroke:#cdd9c6;
  stroke-width:1;
}
.weather-aqi-chart-ytext{
  fill:#647765;
  font-size:11px;
  font-weight:700;
}
.weather-aqi-chart-line{
  fill:none;
  stroke:#2f6fa8;
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.weather-aqi-chart-dot{
  stroke:#fff;
  stroke-width:1.2;
  fill:#2f6fa8;
}
.weather-aqi-chart-dot.is-good{
  fill:#68b158;
}
.weather-aqi-chart-dot.is-moderate{
  fill:#d6a338;
}
.weather-aqi-chart-dot.is-poor{
  fill:#d98b40;
}
.weather-aqi-chart-dot.is-very-poor{
  fill:#cc6f6f;
}
.weather-aqi-axis{
  display:grid;
  grid-template-columns:repeat(var(--waqicols, 8), minmax(0, 1fr));
  gap:6px;
  margin-top:8px;
}
.weather-aqi-cols-1{ --waqicols:1; }
.weather-aqi-cols-2{ --waqicols:2; }
.weather-aqi-cols-3{ --waqicols:3; }
.weather-aqi-cols-4{ --waqicols:4; }
.weather-aqi-cols-5{ --waqicols:5; }
.weather-aqi-cols-6{ --waqicols:6; }
.weather-aqi-cols-7{ --waqicols:7; }
.weather-aqi-cols-8{ --waqicols:8; }
.weather-aqi-cols-9{ --waqicols:9; }
.weather-aqi-cols-10{ --waqicols:10; }
.weather-aqi-cols-11{ --waqicols:11; }
.weather-aqi-cols-12{ --waqicols:12; }
.weather-aqi-cols-13{ --waqicols:13; }
.weather-aqi-cols-14{ --waqicols:14; }
.weather-aqi-cols-15{ --waqicols:15; }
.weather-aqi-cols-16{ --waqicols:16; }
.weather-aqi-cols-17{ --waqicols:17; }
.weather-aqi-cols-18{ --waqicols:18; }
.weather-aqi-cols-19{ --waqicols:19; }
.weather-aqi-cols-20{ --waqicols:20; }
.weather-aqi-cols-21{ --waqicols:21; }
.weather-aqi-cols-22{ --waqicols:22; }
.weather-aqi-cols-23{ --waqicols:23; }
.weather-aqi-cols-24{ --waqicols:24; }
.weather-aqi-tick{
  min-width:0;
  text-align:center;
}
.weather-aqi-tick.is-silent{
  visibility:hidden;
}
.weather-aqi-time{
  font-size:11px;
  font-weight:700;
  color:#617164;
}
.weather-aqi-value{
  margin-top:3px;
  font-size:12px;
  font-weight:800;
  color:#243126;
}
.weather-aqi-value.is-good{
  color:#4d8a42;
}
.weather-aqi-value.is-moderate{
  color:#a1720f;
}
.weather-aqi-value.is-poor{
  color:#b96b28;
}
.weather-aqi-value.is-very-poor{
  color:#b14f4f;
}
.weather-aqi-legend{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
  font-size:12px;
  font-weight:700;
}
.weather-aqi-legend span{
  padding:4px 8px;
  border-radius:999px;
  border:1px solid #d8e4d1;
}
.weather-aqi-legend .is-good{
  background:#eef8ea;
  border-color:#b9ddb5;
  color:#2f5c31;
}
.weather-aqi-legend .is-moderate{
  background:#fff8ea;
  border-color:#ebcb8b;
  color:#8b670f;
}
.weather-aqi-legend .is-poor{
  background:#fff3ea;
  border-color:#e9b886;
  color:#9a5e1f;
}
.weather-aqi-legend .is-very-poor{
  background:#fff0f0;
  border-color:#e4b5b5;
  color:#934646;
}
.weather-air-trend{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.weather-air-trend-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:70px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid #d8e4d1;
  background:#f8fbf6;
  color:#243126;
}
.weather-air-trend-item.is-good{
  background:#eef8ea;
  border-color:#b9ddb5;
}
.weather-air-trend-item.is-moderate{
  background:#fff8ea;
  border-color:#ebcb8b;
}
.weather-air-trend-time{
  font-size:11px;
  font-weight:700;
  color:#617164;
}
.weather-air-trend-item strong{
  margin-top:4px;
  font-size:20px;
  line-height:1;
}
.weather-media-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.weather-radar-history-card{
  align-self:start;
}
.weather-radar-history-block{
  margin:0;
}
.weather-radar-history-title{
  margin:0 0 8px;
  font-size:13px;
  font-weight:700;
  color:#3f5544;
}
.weather-radar-history-sub{
  margin:0 0 10px;
  font-size:12px;
  color:#617164;
}
.weather-radar-sequence{
  border:1px solid #d8e4d1;
  border-radius:16px;
  background:linear-gradient(180deg, #ffffff 0%, #f8fbf6 100%);
  padding:10px;
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.04);
}
.weather-radar-sequence-body{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 180px;
  gap:10px;
  align-items:start;
}
.weather-radar-panel{
  display:block;
}
.weather-radar-sequence-stage{
  position:relative;
}
.weather-radar-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:8px;
}
.weather-radar-panel-title{
  font-size:15px;
  font-weight:800;
  color:#243126;
}
.weather-radar-panel-stamp{
  font-size:12px;
  color:#617164;
}
.weather-radar-panel-frame{
  overflow:hidden;
  border-radius:14px;
  border:1px solid #d8e4d1;
  background:#eef4ea;
}
.weather-radar-panel-image{
  display:block;
  width:100%;
  max-height:420px;
  height:auto;
  object-fit:contain;
}
.weather-radar-sequence-steps{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.weather-radar-step{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  padding:8px 10px;
  border:1px solid #d8e4d1;
  border-radius:12px;
  background:#f8fbf6;
}
.weather-radar-step-index{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:999px;
  background:#e0edd9;
  color:#27442b;
  font-size:12px;
  font-weight:900;
  flex:0 0 24px;
}
.weather-radar-step-time{
  font-size:11px;
  font-weight:800;
  color:#425644;
}
.weather-radar-sequence-steps.is-passive .weather-radar-step{
  cursor:pointer;
  text-decoration:none;
  color:inherit;
}
.weather-radar-step.is-active{
  background:#eef6ea;
  border-color:#9fca97;
}
.weather-radar-step.is-active .weather-radar-step-index{
  background:#9fca97;
}
.weather-media-card{
  padding:12px;
  border:1px solid #d8e4d1;
  border-radius:16px;
  background:linear-gradient(180deg, #ffffff 0%, #f8fbf6 100%);
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.05);
}
.weather-media-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
}
.weather-media-title{
  font-size:15px;
  font-weight:800;
  color:#243126;
}
.weather-media-stamp{
  font-size:12px;
  color:#617164;
}
.weather-media-frame{
  overflow:hidden;
  border-radius:14px;
  border:1px solid #d8e4d1;
  background:#eef4ea;
}
.weather-media-image{
  display:block;
  width:100%;
  height:auto;
}
.weather-warning-layout{
  display:grid;
  grid-template-columns:minmax(280px, 360px) minmax(0, 1fr);
  gap:12px;
  align-items:start;
}
.weather-warning-map-card .weather-media-image{
  width:100%;
  max-height:420px;
  object-fit:contain;
}
.weather-warning-text-card{
  padding:12px;
  border:1px solid #d8e4d1;
  border-radius:16px;
  background:linear-gradient(180deg, #ffffff 0%, #f8fbf6 100%);
  box-shadow:0 8px 18px rgba(55, 84, 52, 0.05);
}
.weather-warning-text-title{
  margin-bottom:10px;
  font-size:15px;
  font-weight:800;
  color:#243126;
}
.weather-table th,
.weather-table td{
  white-space: nowrap;
}
.weather-trend{
  display:flex;
  align-items:flex-end;
  gap: 3px;
  overflow-x:hidden;
  padding: 8px 0 10px;
  margin-bottom: 10px;
  border-bottom: 1px dashed var(--border);
  justify-content: space-between;
}
.weather-trend-item{
  min-width: 0;
  flex: 1 1 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap: 3px;
}
.weather-trend-bar{
  width: 10px;
  border-radius: 6px 6px 4px 4px;
  background: #93c5fd;
  border: 1px solid #60a5fa;
  height: 14px;
}
.weather-trend-icon{
  font-size: 11px;
  color: #4b5563;
  line-height: 1;
}
.weather-trend-hour{
  font-size: 10px;
  color: var(--muted);
  line-height: 1;
}
.weather-trend-bar.t-0{ height: 12px; }
.weather-trend-bar.t-1{ height: 18px; }
.weather-trend-bar.t-2{ height: 24px; }
.weather-trend-bar.t-3{ height: 30px; }
.weather-trend-bar.t-4{ height: 36px; }
.weather-trend-bar.t-5{ height: 42px; }
.weather-trend-bar.t-6{ height: 48px; }
.weather-trend-bar.t-7{ height: 54px; }
.weather-trend-bar.t-8{ height: 60px; }
.weather-trend-bar.r-0{ box-shadow: inset 0 -2px 0 rgba(255,255,255,0.0); }
.weather-trend-bar.r-1{ box-shadow: inset 0 -4px 0 rgba(59,130,246,0.20); }
.weather-trend-bar.r-2{ box-shadow: inset 0 -6px 0 rgba(59,130,246,0.28); }
.weather-trend-bar.r-3{ box-shadow: inset 0 -8px 0 rgba(59,130,246,0.38); }
.weather-trend-bar.r-4{ box-shadow: inset 0 -10px 0 rgba(37,99,235,0.48); }
.weather-trend-bar.r-5{ box-shadow: inset 0 -12px 0 rgba(29,78,216,0.58); }
.weather-chart-wrap{
  margin-bottom: 10px;
  border-bottom: 1px dashed var(--border);
  padding-bottom: 10px;
}
.weather-chart-svg{
  width:100%;
  height:176px;
  display:block;
  border:1px solid #dbe6d5;
  border-radius:10px;
  background:linear-gradient(180deg,#fbfefd 0%, #f6faf4 100%);
}
.weather-chart-grid{
  stroke:#cdd9c6;
  stroke-width:1;
}
.weather-chart-ytext{
  fill:#647765;
  font-size:11px;
  font-weight:700;
}
.weather-chart-line-temp{
  fill:none;
  stroke:#d34d4d;
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.weather-chart-dot-temp{
  fill:#d34d4d;
  stroke:#fff;
  stroke-width:1;
}
.weather-chart-rain-bar{
  fill:rgba(61,130,214,0.34);
  stroke:rgba(45,103,176,0.45);
  stroke-width:0.8;
}
.weather-chart-marker{
  stroke:rgba(255,255,255,0.7);
  stroke-width:1;
}
.weather-chart-marker.max{
  fill:#d34d4d;
}
.weather-chart-marker.min{
  fill:#4f79c8;
}
.weather-chart-marker-text{
  fill:#fff;
  font-size:11px;
  font-weight:700;
  text-anchor:middle;
}
.weather-chart-axis{
  display:grid;
  grid-template-columns: repeat(var(--wcols, 12), minmax(0, 1fr));
  gap:2px;
  margin-top:4px;
}
.weather-chart-cols-1{ --wcols:1; }
.weather-chart-cols-2{ --wcols:2; }
.weather-chart-cols-3{ --wcols:3; }
.weather-chart-cols-4{ --wcols:4; }
.weather-chart-cols-5{ --wcols:5; }
.weather-chart-cols-6{ --wcols:6; }
.weather-chart-cols-7{ --wcols:7; }
.weather-chart-cols-8{ --wcols:8; }
.weather-chart-cols-9{ --wcols:9; }
.weather-chart-cols-10{ --wcols:10; }
.weather-chart-cols-11{ --wcols:11; }
.weather-chart-cols-12{ --wcols:12; }
.weather-chart-cols-13{ --wcols:13; }
.weather-chart-cols-14{ --wcols:14; }
.weather-chart-cols-15{ --wcols:15; }
.weather-chart-cols-16{ --wcols:16; }
.weather-chart-cols-17{ --wcols:17; }
.weather-chart-cols-18{ --wcols:18; }
.weather-chart-cols-19{ --wcols:19; }
.weather-chart-cols-20{ --wcols:20; }
.weather-chart-cols-21{ --wcols:21; }
.weather-chart-cols-22{ --wcols:22; }
.weather-chart-cols-23{ --wcols:23; }
.weather-chart-cols-24{ --wcols:24; }
.weather-chart-tick{
  text-align:center;
  min-height: 26px;
  color:#506351;
  font-size:11px;
}
.weather-chart-tick.is-silent{
  min-height:1px;
}
.weather-chart-time{
  font-weight:700;
  line-height:1.1;
}
.weather-chart-tick-meta{
  margin-top:1px;
  font-size:10px;
  color:#62736e;
}
.weather-chart-tick-meta i{
  color:#47657f;
}
.weather-chart-legend{
  margin-top:4px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  font-size:11px;
  color:#4f6155;
}
.weather-chart-legend .temp{ color:#d34d4d; }
.weather-chart-legend .min{ color:#4f79c8; }
.weather-chart-legend .rain{ color:#2f6fa8; }
.weather-day-sep td{
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  background: #f5f8f6;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.weather-hourly-compact-head{
  margin: 4px 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: #3f5544;
}
.weather-more-hours{
  margin-top: 8px;
  border-top: 1px dashed var(--border);
  padding-top: 8px;
}
.weather-more-hours > summary{
  list-style: none;
  cursor: pointer;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #2b6519;
  font-weight: 700;
}
.weather-more-hours > summary::-webkit-details-marker{
  display:none;
}
.weather-more-hours-note{
  margin-top: 8px;
}
.weather-daily-compact-head{
  margin: 4px 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: #3f5544;
}
.weather-daily-chart-block{
  margin: 4px 0 14px;
}
.weather-daily-chart-title{
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: #3f5544;
}
.weather-daily-chart-wrap{
  padding: 10px 10px 8px;
  border: 1px solid #dbe6d5;
  border-radius: 14px;
  background: linear-gradient(180deg, #fbfefd 0%, #f6faf4 100%);
}
.weather-daily-chart-svg{
  width: 100%;
  height: 170px;
  display: block;
}
.weather-daily-chart-grid{
  stroke: #cdd9c6;
  stroke-width: 1;
}
.weather-daily-chart-ytext{
  fill: #647765;
  font-size: 11px;
  font-weight: 700;
}
.weather-daily-chart-line{
  fill: none;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.weather-daily-chart-line.day{
  stroke: #d34d4d;
}
.weather-daily-chart-line.night{
  stroke: #4f79c8;
}
.weather-daily-chart-dot{
  stroke: #fff;
  stroke-width: 1;
}
.weather-daily-chart-dot.day{
  fill: #d34d4d;
}
.weather-daily-chart-dot.night{
  fill: #4f79c8;
}
.weather-daily-axis{
  display: grid;
  grid-template-columns: repeat(var(--wdcols, 7), minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}
.weather-daily-cols-1{ --wdcols:1; }
.weather-daily-cols-2{ --wdcols:2; }
.weather-daily-cols-3{ --wdcols:3; }
.weather-daily-cols-4{ --wdcols:4; }
.weather-daily-cols-5{ --wdcols:5; }
.weather-daily-cols-6{ --wdcols:6; }
.weather-daily-cols-7{ --wdcols:7; }
.weather-daily-cols-8{ --wdcols:8; }
.weather-daily-cols-9{ --wdcols:9; }
.weather-daily-cols-10{ --wdcols:10; }
.weather-daily-cols-11{ --wdcols:11; }
.weather-daily-cols-12{ --wdcols:12; }
.weather-daily-tick{
  text-align: center;
  color: #506351;
  font-size: 12px;
}
.weather-daily-label{
  font-weight: 700;
  line-height: 1.1;
}
.weather-daily-temps{
  margin-top: 2px;
  font-size: 11px;
}
.weather-daily-temps .night{
  color: #4f79c8;
  font-weight: 700;
}
.weather-daily-temps .day{
  color: #d34d4d;
  font-weight: 700;
}
.weather-daily-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.weather-daily-card{
  padding: 14px 16px;
  border: 1px solid #d8e4d1;
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbf6 100%);
  box-shadow: 0 8px 20px rgba(55, 84, 52, 0.06);
}
.weather-daily-card.is-sunny{
  background: linear-gradient(180deg, #fffef0 0%, #fff6d3 100%);
  border-color: #ebd17f;
}
.weather-daily-card.is-bright{
  background: linear-gradient(180deg, #fbfdf2 0%, #eef5d9 100%);
  border-color: #d4dfa9;
}
.weather-daily-card.is-warm{
  background: linear-gradient(180deg, #fff7ef 0%, #ffe7cf 100%);
  border-color: #e8c09a;
}
.weather-daily-card.is-rainy{
  background: linear-gradient(180deg, #f4f8ff 0%, #e0eafb 100%);
  border-color: #b9cce8;
}
.weather-daily-card.is-cold{
  background: linear-gradient(180deg, #f4f9ff 0%, #e0ecfc 100%);
  border-color: #bfd1ef;
}
.weather-daily-card.is-stormy{
  background: linear-gradient(180deg, #f7f1ff 0%, #ebe0fb 100%);
  border-color: #d0c0e8;
}
.weather-daily-card.is-soft{
  background: linear-gradient(180deg, #ffffff 0%, #f4f8f1 100%);
}
.weather-daily-card-head{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.weather-daily-card-title{
  font-size: 16px;
  font-weight: 800;
  color: #1e2520;
}
.weather-daily-card-condition{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eef6ea;
  color: #335b33;
  font-size: 13px;
  font-weight: 700;
}
.weather-daily-card-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
}
.weather-daily-metric{
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(242, 247, 239, 0.95);
  border: 1px solid rgba(211, 226, 206, 0.9);
  color: #2f3f31;
}
.weather-daily-metric strong{
  font-size: 15px;
  font-weight: 800;
}
.weather-daily-metric-label{
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #607262;
}
.weather-more-days{
  margin-top: 8px;
  border-top: 1px dashed var(--border);
  padding-top: 8px;
}
.weather-more-days > summary{
  list-style: none;
  cursor: pointer;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #2b6519;
  font-weight: 700;
}
.weather-more-days > summary::-webkit-details-marker{
  display:none;
}
.weather-more-days-note{
  margin-top: 8px;
}
.weather-daily-meta{
  white-space: normal;
}
@media (max-width: 640px){
  .cal-jump{
    gap: 6px;
    margin-bottom: 8px;
  }
  .cal-jump .cal-btn{
    min-height: 32px;
    padding: 5px 10px;
    font-size: 11px;
  }
  .cal-jump .cal-btn-label{
    min-width: 72px;
    padding-left: 8px;
    padding-right: 8px;
  }
  .cal-btn-label-full{
    display:none !important;
  }
  .cal-btn-label-short{
    display:inline !important;
  }
  .weather-table-compact td,
  .weather-table-compact th{
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .weather-table thead{
    display:none;
  }
  .weather-table,
  .weather-table tbody,
  .weather-table tr,
  .weather-table td{
    display:block;
    width:100%;
  }
  .weather-table tr{
    border-bottom:1px solid #e0e8dc;
    padding:8px 0;
  }
  .weather-table td{
    border:none;
    padding:6px 10px;
    text-align:left;
    white-space:normal;
  }
  .weather-table td::before{
    content:attr(data-label);
    display:block;
    margin-bottom:2px;
    font-size:11px;
    font-weight:800;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:#617164;
  }
  .weather-day-sep td{
    padding:8px 10px 4px;
    background:#f1f4ef;
    border-radius:8px;
  }
  .weather-day-sep td::before{
    display:none;
  }
  .weather-head-pill{
    font-size:11px;
    padding:5px 9px;
  }
  .weather-now-layout{
    grid-template-columns:1fr;
    gap:10px;
  }
  .weather-now-hero{
    padding:14px;
  }
  .weather-now-head{
    font-size:24px;
  }
  .weather-now-temp{
    font-size:38px;
  }
  .weather-now-kpis{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .weather-now-kpi{
    min-width:0;
  }
  .weather-highlights{
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .weather-highlight-card{
    padding: 11px 12px;
  }
  .weather-highlight-value{
    font-size: 20px;
  }
  .weather-health-grid{
    grid-template-columns: 1fr;
  }
  .weather-uv-list{
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
  }
  .weather-uv-item{
    padding: 10px;
  }
  .weather-uv-item-value{
    font-size: 22px;
  }
  .weather-air-grid{
    grid-template-columns: 1fr;
  }
  .weather-air-main{
    padding: 14px;
  }
  .weather-air-main-value{
    font-size: 40px;
  }
  .weather-aqi-chart-svg{
    height: 150px;
  }
  .weather-aqi-axis{
    gap: 4px;
  }
  .weather-air-kpis{
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .weather-air-kpi{
    padding: 10px;
  }
  .weather-air-kpi strong{
    font-size: 21px;
  }
  .weather-media-grid{
    grid-template-columns: 1fr;
  }
  .weather-warning-layout{
    grid-template-columns:1fr;
    gap:8px;
  }
  .weather-radar-sequence{
    padding:8px;
  }
  .weather-radar-sequence-body{
    grid-template-columns:1fr;
    gap:8px;
  }
  .weather-radar-sequence-steps{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .weather-radar-step{
    padding:7px 8px;
  }
  .weather-radar-panel-head{
    flex-direction:column;
    gap:4px;
  }
  .weather-radar-panel-image{
    max-height:260px;
  }
  .weather-warning-map-card .weather-media-image{
    max-height:260px;
  }
  .weather-media-card{
    padding: 10px;
  }
  .weather-short-outlook-item{
    min-width:0;
  }
  .weather-chart-svg{
    height:160px;
  }
  .weather-chart-tick{
    font-size:10px;
  }
  .weather-daily-chart-svg{
    height: 152px;
  }
  .weather-daily-axis{
    gap: 4px;
  }
  .weather-daily-card{
    padding: 12px;
  }
  .weather-daily-card-head{
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 10px;
  }
  .weather-daily-card-grid{
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
}

.cal-header{
  margin-bottom: 12px;
}
.cal-title{
  font-weight: 700;
  margin-bottom: 0;
}
.cal-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.cal-title-actions{
  display:inline-flex;
  align-items:center;
  gap: 6px;
}
.cal-add{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid var(--border);
  text-decoration:none;
  color: var(--text);
  background:#f7f7f7;
  font-weight: 700;
}
.cal-add i{
  font-size: 14px;
}
.duty-action-link{
  width: auto;
  padding: 0 12px;
  gap: 8px;
}
.duty-action-link span{
  font-size: 12px;
}
.cal-add[data-cal-badge]{
  position: relative;
}
.cal-add[data-cal-badge]::after{
  content: attr(data-cal-badge);
  position: absolute;
  right: -4px;
  top: -4px;
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border-radius: 999px;
  background: #2c6b22;
  color: #fff;
  border: 1px solid #fff;
  font-size: 9px;
  line-height: 12px;
  text-align: center;
  font-weight: 800;
}
.cal-add-soft{
  background: #f1f7f0;
  border-color: #bdd5b9;
  color: #2c6b22;
}
.cal-jump{
  display:flex;
  gap: 8px;
  margin-bottom: 10px;
}
.cal-btn{
  min-height: 34px;
  padding: 6px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  text-decoration:none;
  color: var(--text);
  background:#fff;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cal-btn-label{
  min-width: 92px;
  text-align: center;
  font-weight: 700;
}
.cal-btn-label-full{
  display:inline;
}
.cal-btn-label-short{
  display:none;
}
.cal-nav{
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
}
.cal-nav-group{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.cal-nav-group-extra{
  margin-left:10px;
  padding-left:10px;
  border-left:1px dashed #cddbc8;
}
.calendar-print-toolbar{
  margin-bottom: 10px;
}
.calendar-print-hint{
  font-size: 12px;
  color: var(--muted);
  margin-top: 6px;
}
.cal-tab{
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  text-decoration:none;
  color: var(--text);
  font-size: 12px;
  background:#f7f7f7;
}
.cal-tab-icon{
  width: 36px;
  height: 36px;
  padding: 0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.cal-tab-icon i{
  font-size: 14px;
}
.cal-tab.is-active{
  background:#e8f0ff;
  border-color:#bcd4ff;
}
@media (max-width: 640px){
  .cal-nav-group-extra{
    margin-left:0;
    padding-left:0;
    border-left:0;
    position:relative;
  }
  .cal-nav-group-extra::before{
    content:"";
    position:absolute;
    left:0;
    top:-5px;
    width:100%;
    border-top:1px dashed #d4e0cf;
  }
}

@media print{
  @page cal-grid-landscape{
    size: A4 landscape;
    margin: 6mm;
  }
  @page cal-grid-portrait{
    size: A4 portrait;
    margin: 6mm;
  }
  body[data-current-m="calendar"] .calendar-print-page.calendar-print-landscape{
    page: cal-grid-landscape;
  }
  body[data-current-m="calendar"] .calendar-print-page.calendar-print-portrait{
    page: cal-grid-portrait;
  }

  body[data-current-m="calendar"] .app-top,
  body[data-current-m="calendar"] .favbar,
  body[data-current-m="calendar"] .fav-bar,
  body[data-current-m="calendar"] .bottom-dock,
  body[data-current-m="calendar"] .app-bottom-pad,
  body[data-current-m="calendar"] .calendar-print-toolbar{
    display:none !important;
  }
  body[data-current-m="calendar"] .app-main{
    padding:0 !important;
  }
  body[data-current-m="calendar"] .page{
    margin:0 !important;
    max-width:none !important;
    padding:0 !important;
  }
  body[data-current-m="calendar"] .card{
    border:0 !important;
    box-shadow:none !important;
  }
  body[data-current-m="calendar"] .calendar-print-page > h1{
    display:none !important;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-header{
    margin-bottom: 6px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-title{
    font-size: 22px;
    font-weight: 800;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-title-row{
    margin-bottom: 4px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-add,
  body[data-current-m="calendar"] .calendar-print-page .cal-day-add,
  body[data-current-m="calendar"] .calendar-print-page .cal-sleep-btn,
  body[data-current-m="calendar"] .calendar-print-page .cal-av-actions{
    display:none !important;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-list{
    gap: 5px;
    margin-top: 4px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-month-head{
    margin: 8px 0 4px;
    font-size: 15px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-week-head-stream{
    padding: 6px 8px;
    font-size: 13px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-week-head-stream .cal-week-head-range{
    font-size: 11px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-week-block-stream{
    padding: 6px;
    break-inside: avoid;
    page-break-inside: avoid;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-day-group{
    border-radius: 8px;
    margin-bottom: 5px;
    padding: 0 6px 6px;
    break-inside: avoid;
    page-break-inside: avoid;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-day-group > .cal-day-head{
    margin: 0 -6px 5px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-day-head{
    min-height: 30px;
    padding: 4px 8px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-day-link{
    font-size: 16px;
    line-height: 1.2;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-item{
    padding: 6px 8px;
    border-radius: 8px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-item-title{
    font-size: 14px;
    line-height: 1.2;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-item-meta{
    font-size: 11px;
    line-height: 1.25;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-free-slots{
    margin-top: 4px;
    padding: 4px 6px;
    gap: 5px;
  }
  body[data-current-m="calendar"] .calendar-print-page .cal-free-slot,
  body[data-current-m="calendar"] .calendar-print-page .cal-free-slots-label{
    font-size: 11px;
  }

  /* Monats-Grid: dichteres Raster für besseren Seitenfit */
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-grid{
    gap: 4px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-weekdays,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-row{
    gap: 4px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-weekdays span{
    font-size: 10px;
    padding: 1px 0;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell{
    padding: 4px;
    min-height: 60px;
    border-radius: 6px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell-head{
    margin-bottom: 2px;
    font-size: 10px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-day-link{
    font-size: 10px;
    line-height: 1.1;
    font-weight: 700;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell-body{
    gap: 1px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-dot,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-duty-grid-line,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-duty-grid-time{
    font-size: 10px;
    line-height: 1.2;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell .cal-badge{
    font-size: 10px;
    padding: 1px 6px;
    min-height: 16px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell-more{
    font-size: 10px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-month-notes{
    margin-top: 6px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-note{
    padding: 4px 6px;
    font-size: 10px;
    margin-bottom: 4px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-month-legend{
    margin-top: 4px;
    gap: 5px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-legend-item{
    font-size: 10px;
  }

  /* Monats-Grid: "1 Seite quer" priorisieren */
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-header{
    margin-bottom: 4px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .card{
    padding: 4px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-month-notes,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-month-legend{
    display: none !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell{
    min-height: 47px;
    padding: 3px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-dot,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-duty-grid-line{
    font-size: 8.5px;
    line-height: 1.08;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell .cal-badge{
    font-size: 8.5px;
    min-height: 13px;
    padding: 0 5px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-header{
    margin-bottom: 2px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .card{
    padding: 3px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-weekdays span{
    font-size: 9px;
    padding: 0;
    line-height: 1;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-cell{
    min-height: 48px;
    padding: 2px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-cell-head{
    margin-bottom: 1px;
    font-size: 9px;
    line-height: 1;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-day-link{
    font-size: 9px;
    line-height: 1;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-cell-body{
    gap: 0;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-dot,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-duty-grid-line,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-duty-grid-time{
    font-size: 8px;
    line-height: 1.02;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-cell .cal-badge{
    font-size: 8px;
    min-height: 12px;
    padding: 0 4px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-header{
    margin-bottom: 3px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .card{
    padding: 3px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-grid,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-weekdays,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-row{
    gap: 3px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-weekdays span{
    font-size: 9px;
    padding: 0;
    line-height: 1;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-cell{
    min-height: 43px;
    padding: 2px;
    border-radius: 5px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-cell-head{
    margin-bottom: 1px;
    font-size: 9px;
    line-height: 1;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-day-link{
    font-size: 9px;
    line-height: 1;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-cell-flags{
    gap: 1px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-cell-flag{
    font-size: 8px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-dot,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-duty-grid-line,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-duty-grid-time{
    font-size: 8px;
    line-height: 1.02;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-cell .cal-badge{
    font-size: 8px;
    min-height: 12px;
    padding: 0 4px;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-entry-overflow{
    display: none !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-cell-more{
    display: block !important;
    font-size: 8px;
    line-height: 1;
    margin-top: 1px;
  }

  /* Monatsliste: 1 Woche pro Seite priorisieren */
  body[data-current-m="calendar"][data-current-v="month_list"] .calendar-print-page details.cal-week-collapsible{
    display:block;
  }
  body[data-current-m="calendar"][data-current-v="month_list"] .calendar-print-page details.cal-week-collapsible:not([open]) > *{
    display:block;
  }
  body[data-current-m="calendar"][data-current-v="month_list"] .calendar-print-page details.cal-week-collapsible > summary{
    list-style:none;
  }
  body[data-current-m="calendar"][data-current-v="month_list"] .calendar-print-page .cal-week-head-stream{
    break-before: page;
    page-break-before: always;
  }
  body[data-current-m="calendar"][data-current-v="month_list"] .calendar-print-page .cal-week-head-stream:first-of-type{
    break-before: auto;
    page-break-before: auto;
  }
  body[data-current-m="calendar"][data-current-v="month_list"] .calendar-print-page .cal-week-block-stream{
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Wochenansicht: kompakt auf 1 Seite priorisieren */
  body[data-current-m="calendar"][data-current-v="week"] .calendar-print-page .cal-week-head-stream{
    margin-bottom: 4px;
  }
  body[data-current-m="calendar"][data-current-v="week"] .calendar-print-page .cal-day-group{
    margin-bottom: 4px;
    padding: 0 5px 5px;
  }
  body[data-current-m="calendar"][data-current-v="week"] .calendar-print-page .cal-item{
    padding: 5px 7px;
  }
  body[data-current-m="calendar"][data-current-v="week"] .calendar-print-page .cal-month-notes{
    margin-top: 4px;
  }
  body[data-current-m="calendar"][data-current-v="week"] .calendar-print-page .cal-note{
    padding: 3px 6px;
    font-size: 10px;
    margin-bottom: 3px;
  }

  /* Timeline: fortlaufender, kompakter Bericht */
  body[data-current-m="calendar"][data-current-v="timeline"] .calendar-print-page .cal-list{
    gap: 4px;
  }
  body[data-current-m="calendar"][data-current-v="timeline"] .calendar-print-page .cal-month-head{
    margin: 7px 0 2px;
    font-size: 14px;
  }
  body[data-current-m="calendar"][data-current-v="timeline"] .calendar-print-page .cal-day-group{
    margin-bottom: 3px;
    padding: 0 5px 5px;
  }
  body[data-current-m="calendar"][data-current-v="timeline"] .calendar-print-page .cal-day-head{
    min-height: 26px;
    padding: 3px 7px;
  }
  body[data-current-m="calendar"][data-current-v="timeline"] .calendar-print-page .cal-item{
    margin-bottom: 3px;
  }
}
.cal-empty{
  padding: 12px;
  border: 1px dashed var(--border);
  border-radius: 10px;
  background:#fafafa;
  color: var(--muted);
}
.cal-list{
  display:flex;
  flex-direction:column;
  gap: 8px;
  margin-top: 8px;
}
.cal-item{
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px;
  background:#fff;
}
.cal-item-title{ font-weight: 700; }
.cal-item-meta{ font-size: 12px; color: var(--muted); }
.cal-item-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.cal-item-head .cal-item-title{
  flex: 1 1 180px;
}
.cal-item-permission{
  margin: 6px 0 2px;
}
.cal-permission-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
.cal-permission-badge.is-manage{
  border: 1px solid #cfe7c8;
  background: #edf8e9;
  color: #24551a;
}
.cal-permission-badge.is-readonly{
  border: 1px solid #d9e1ea;
  background: #f5f7fa;
  color: #526071;
}
.cal-item-users{
  margin-left: auto;
  display:flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: flex-end;
}
.cal-user-badge{
  display:inline-flex;
  align-items:center;
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid #d8dde6;
  background: #f8fafc;
  color: #39465a;
  font-size: 11px;
  font-weight: 700;
}
.cal-cancel{ margin-top: 6px; }
.cal-move-occurrence-inline{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.cal-move-occurrence-inline .input{
  width: 180px;
  min-height: 36px;
}
.cal-files{
  display:flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.cal-file-item{
  display:inline-flex;
  align-items:center;
  gap: 6px;
}
.cal-file{
  font-size: 12px;
  padding: 4px 6px;
  border: 1px solid var(--border);
  border-radius: 6px;
  text-decoration: none;
  color: var(--text);
  background:#f7f7f7;
}
.cal-start-card{
  margin-bottom: 12px;
}
.cal-start-quicknav{
  margin-bottom: 12px;
}
.cal-start-quicknav-links{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}
.cal-start-quicknav-link{
  width: 38px;
  height: 38px;
  border: 1px solid var(--border);
  border-radius: 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  color: var(--text);
  background: #fff;
}
.cal-start-quicknav-link i{
  font-size: 15px;
}
.cal-start-quicknav-link.is-accent{
  background: #e8f0ff;
  border-color: #bcd4ff;
  color: #245fcb;
}
.cal-start-card h2{
  display:flex;
  align-items:center;
  gap:8px;
}
.cal-start-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.cal-start-item{
  border:1px solid var(--border);
  border-radius:10px;
  padding:8px 10px;
  background:#fff;
}
.cal-start-item-title{
  font-weight:700;
}
.cal-start-item-meta{
  margin-top:2px;
  font-size:12px;
  color:var(--muted);
}
.cal-start-item-link{
  display:inline-flex;
  margin-top:5px;
  font-size:12px;
  text-decoration:none;
}
.cal-start-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.cal-start-chip{
  display:inline-flex;
  align-items:center;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid #d5e2d2;
  background:#f5faf4;
  font-size:12px;
}
.cal-start-subtitle{
  margin-top:4px;
  margin-bottom:6px;
  font-weight:700;
}
.cal-start-day{
  border: 1px solid #d9e4d7;
  border-left-width: 6px;
  border-left-color: #c8d4c5;
  border-radius: 10px;
  background: #ffffff;
  padding: 10px;
  margin-bottom: 10px;
}
.cal-start-day.is-holiday{
  border-left-color: #e3a12a;
}
.cal-start-day.is-school-break{
  border-left-color: #2f9e44;
}
.cal-start-day.is-holiday-break{
  border-left-color: #8c6f21;
}
.cal-start-day-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 8px;
  margin-bottom: 3px;
}
.cal-start-day-title{
  font-size: 18px;
  font-weight: 800;
}
.cal-start-day-note{
  font-size: 12px;
  color: #596578;
  margin-bottom: 4px;
}
.cal-start-weather{
  font-size: 12px;
  color: #4e5d73;
  margin-bottom: 6px;
  display:flex;
  align-items:center;
  gap: 6px;
  flex-wrap: wrap;
}
.cal-start-entry{
  margin: 4px 0;
  padding: 6px 8px;
  border: 1px solid #dce5db;
  border-radius: 8px;
  background: #f9fcf9;
}
.cal-start-entry.is-foreign{
  background: #f8f9fb;
  border-color: #d8dde6;
  opacity: 0.88;
}
.cal-start-entry.is-birthday{
  background: #fff7fb;
  border-color: #f1d6e4;
}
.cal-start-entry.is-sleep{
  background: #f7f4ff;
  border-color: #dfd5ff;
}
.cal-start-entry-main{
  display:flex;
  align-items:center;
  gap: 6px;
  flex-wrap: wrap;
}
.cal-start-entry-time{
  font-weight: 800;
  color: #344558;
}
.cal-start-people{
  margin-left: auto;
  display:inline-flex;
  align-items:center;
  gap: 4px;
  flex-wrap: wrap;
}
.cal-start-duty-row{
  display:flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0;
}
.cal-start-more-days{
  margin-top: 6px;
}
.cal-start-more-days > summary{
  list-style: none;
  cursor: pointer;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: #2b6519;
  margin-bottom: 8px;
}
.cal-start-more-days > summary::-webkit-details-marker{
  display:none;
}
.cal-start-duty-chip{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  border: 1px solid #d7e0d6;
  border-radius: 999px;
  background: #f8fbf8;
  padding: 4px 8px;
}
.cal-start-duty-owner{
  font-size: 12px;
  color: #4d5a6d;
}
.cal-start-av-hints{
  display:flex;
  flex-wrap:wrap;
  gap: 6px;
  margin: 6px 0;
}
.cal-start-duty-table-wrap{
  overflow-x: auto;
}
.cal-start-duty-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.cal-start-duty-table th,
.cal-start-duty-table td{
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.cal-start-duty-table th{
  background: #f3f7f2;
  font-size: 13px;
}
.cal-start-duty-table td:first-child{
  white-space: nowrap;
  width: 1%;
}
.cal-start-duty-table tr:last-child td{
  border-bottom: 0;
}
.cal-start-duty-line{
  display:flex;
  align-items:center;
  gap: 8px;
  margin: 2px 0;
}
.cal-start-duty-hours{
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
.cal-start-av-table .cal-av-status-badge{
  margin-bottom: 2px;
}
.cal-start-av-meta{
  font-size: 11px;
  color: var(--muted);
}
.cal-start-options summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
}
.cal-start-options summary::-webkit-details-marker{
  display:none;
}
.cal-start-options[open] summary{
  margin-bottom:10px;
}
.cal-start-checks{
  display:grid;
  grid-template-columns:1fr;
  gap:6px;
  margin-top:8px;
}
.cal-start-checks label{
  display:flex;
  align-items:center;
  gap:8px;
}
.btn-delete-mini{
  min-height: 28px;
  height: 28px;
  padding: 0 8px;
  border-radius: 6px;
  background: #fff2f2;
  border-color: #f0c7c7;
  color: #a12a2a;
}
.cal-history{
  margin-top: 6px;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.cal-history-groups{
  margin-top: 6px;
}
.cal-history-group{
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  margin-bottom: 8px;
  overflow: hidden;
}
.cal-history-group summary{
  cursor: pointer;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 700;
  list-style: none;
  border-bottom: 1px solid var(--border);
  background: #f8fafc;
}
.cal-history-group summary::-webkit-details-marker{ display:none; }
.cal-history-count{
  color: var(--muted);
  font-weight: 500;
}
.cal-history-item{
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  background: #fff;
}
.cal-history-item:last-child{ border-bottom: none; }
.cal-history-main{
  font-size: 13px;
  font-weight: 600;
  margin-top: 4px;
}
.cal-history-meta{
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
}
.cal-history-changes{
  margin: 6px 0 0 16px;
  padding: 0;
  font-size: 12px;
  line-height: 1.35;
}
.cal-history-changes li{
  margin: 2px 0;
  word-break: break-word;
}
.cal-history-badge{
  display:inline-flex;
  align-items:center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid #dbe2ea;
  color: #334155;
  background: #f8fafc;
}
.cal-history-badge.is-created{
  border-color: #b7ebc0;
  color: #24613a;
  background: #edf9f0;
}
.cal-history-badge.is-updated{
  border-color: #c8d8f8;
  color: #2b4f9e;
  background: #edf3ff;
}
.cal-history-badge.is-file{
  border-color: #eadbb7;
  color: #6b4f19;
  background: #fff8ea;
}
.cal-history-badge.is-cancel{
  border-color: #f2c2c2;
  color: #8f2f2f;
  background: #fff1f1;
}

.choice-inline{
  display:flex;
  flex-wrap: wrap;
  gap: 6px;
}
.choice-chip{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 6px 8px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background:#f7f7f7;
  font-size: 12px;
}
.settings-required{
  border: 1px solid #d9e4d7;
  border-radius: 10px;
  background: #fbfdfb;
  padding: 10px;
  margin-bottom: 10px;
}
.settings-required-title{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 800;
  color: #2a5b23;
  margin-bottom: 6px;
}
.settings-optional{
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fbfdfb;
  padding: 8px 10px;
  margin: 8px 0;
}
.settings-optional > summary{
  cursor: pointer;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  color: #2f3a46;
}
.settings-optional > summary::-webkit-details-marker{
  display: none;
}
.settings-optional[open] > summary{
  margin-bottom: 8px;
}
.settings-section{
  border: 1px solid #d9e4d7;
  border-radius: 10px;
  background: #fbfdfb;
  padding: 10px;
  margin-bottom: 10px;
}
.settings-section > h3{
  margin: 0 0 10px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
}
.settings-page .card + .card{
  margin-top: 12px;
}

.cal-event-form [data-choice-group="category"] .btn-choice{
  border-color: var(--cat-border, var(--border));
  background: var(--cat-bg, #f7f7f7);
  color: var(--cat-fg, var(--text));
}
.cal-event-form [data-choice-group="category"] .btn-choice,
.cal-event-form [data-choice-group="visibility_role"] .btn-choice,
.cal-event-form [data-choice-group="reminder_enabled"] .btn-choice{
  min-height: 34px;
  padding: 6px 10px;
  font-size: 13px;
}
.cal-event-form [data-choice-group="category"] .btn-choice.is-active{
  background: var(--cat-fg, var(--text));
  color: #fff;
  border-color: var(--cat-fg, var(--text));
  outline: 2px solid #00000020;
}
.cal-event-form [data-choice-group="category"],
.cal-event-form [data-choice-group="visibility_role"],
.cal-event-form [data-choice-group="reminder_enabled"]{
  gap: 6px;
}
.cal-event-form [data-rec-interval-hint]{
  font-size: 11px;
  line-height: 1.3;
  margin-top: 4px;
}
.cal-form-required{
  border: 1px solid #d9e4d7;
  border-radius: 10px;
  background: #fbfdfb;
  padding: 10px;
  margin-bottom: 10px;
}
.cal-form-required-title{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 800;
  color: #2a5b23;
  margin-bottom: 6px;
}
.cal-form-optional{
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fbfdfb;
  padding: 8px 10px;
  margin: 8px 0;
}
.cal-form-optional > summary{
  cursor: pointer;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  list-style: none;
  color: #2f3a46;
}
.cal-form-optional > summary::-webkit-details-marker{
  display: none;
}
.cal-form-optional[open] > summary{
  margin-bottom: 8px;
}
.cal-form-conflict-override{
  margin-top: 8px;
}
.cal-move-box{
  border: 1px solid #d8e3f1;
  border-radius: 12px;
  background: linear-gradient(180deg, #f8fbff 0%, #f1f6ff 100%);
  padding: 12px;
}
.cal-move-box-head{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:800;
  color:#1f4f8c;
}
.cal-move-box-sub{
  margin-top:6px;
  color:#52657a;
  font-size:13px;
}
.cal-move-form{
  margin-top:10px;
}
.cal-move-form-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
  align-items:end;
}
.cal-move-form-action{
  display:flex;
  align-items:flex-end;
}
.cal-form-row2{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.cal-form-field{
  min-width: 0;
}
.cal-form-row2 .label{
  margin-top: 6px;
}
.cal-participants-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.cal-files-note{
  font-size: 12px;
  margin-bottom: 6px;
}
.cal-cat-btn-privat,
.cal-cat-btn-familie{
  --cat-bg:#e8f0ff;
  --cat-fg:#1c7ed6;
  --cat-border:#bcd4ff;
}
.cal-cat-btn-arzt{
  --cat-bg:#ffe3e3;
  --cat-fg:#e03131;
  --cat-border:#ffc9c9;
}
.cal-cat-btn-schule{
  --cat-bg:#ebfbee;
  --cat-fg:#2f9e44;
  --cat-border:#b2f2bb;
}
.cal-cat-btn-beruf{
  --cat-bg:#f3f0ff;
  --cat-fg:#7048e8;
  --cat-border:#d0bfff;
}
.cal-cat-btn-sonstiges{
  --cat-bg:#f1f3f5;
  --cat-fg:#5c6770;
  --cat-border:#dee2e6;
}
.cal-grid{
  display:flex;
  flex-direction:column;
  gap: 6px;
  overflow-x: hidden;
  width: 100%;
}
.cal-weekdays{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  margin-bottom: 2px;
}
.cal-weekdays span{
  text-align:center;
  font-size: 11px;
  font-weight: 800;
  color: #4b5563;
  padding: 4px 0;
}
.cal-row{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  width: 100%;
  min-width: 0;
}
.cal-cell{
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px;
  min-height: 70px;
  background:#fff;
}
.cal-cell.muted:not(.is-today){
  background: #f8f9fb;
  border-color: #e3e8ef;
}
.cal-cell.muted:not(.is-today) .cal-cell-head{
  color: #919aa8;
}
.cal-cell.muted:not(.is-today) .cal-day-link{
  color: #798390;
}
.cal-cell.muted:not(.is-today) .cal-dot{
  color: #727b87;
  border-left-color: #d2d9e2;
}
.cal-cell.muted:not(.is-today) .cal-cell-body{
  opacity: .78;
}
.cal-cell.muted:not(.is-today) .cal-duty-grid-time{
  color: #838e9b;
}
.cal-cell.muted:not(.is-today) .cal-duty-grid-line .cal-badge{
  opacity: .72;
  filter: saturate(.62);
}
.cal-cell.muted:not(.is-today) .cal-cell-flag{
  opacity: .72;
}
.cal-cell.cal-cell-weekend:not(.muted):not(.is-today):not(.cal-cell-holiday):not(.cal-cell-school-break){
  background: #fcfdfc;
  border-color: #d7e3d3;
}
.cal-cell.is-today{
  border-color: #86bb7f;
  background: linear-gradient(180deg, #edf8ec 0%, #ffffff 46%);
  box-shadow: inset 0 0 0 1px #b9dcb4;
}
.cal-cell-head{
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 4px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 4px;
}
.cal-cell-head-right{
  display:inline-flex;
  align-items:center;
  gap: 4px;
}
.cal-cell-head-left{
  display:inline-flex;
  align-items:center;
  gap: 4px;
  min-width: 0;
}
.cal-day-add{
  border: 1px solid #d5dce7;
  background: #f6f8fb;
  color: #3f536e;
  border-radius: 999px;
  width: 30px;
  min-width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.cal-day-add:hover,
.cal-day-add:focus-visible{
  background: #e8eef7;
  border-color: #b8c4d6;
  color: #2c4664;
  text-decoration: none;
}
.cal-day-add i{ font-size: 12px; }
.cal-day-add.is-mini{
  width: 20px;
  min-width: 20px;
  height: 20px;
}
.cal-day-add.is-mini i{ font-size: 9px; }
.cal-grid-tools-card{
  margin-bottom: 8px;
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}
.cal-grid-compact-note{
  font-size: 12px;
}
.cal-cell-body{
  font-size: 12px;
  display:flex;
  flex-direction:column;
  gap: 4px;
  min-width: 0;
}
.cal-cell-flags{
  display:inline-flex;
  align-items:center;
  gap: 4px;
}
.cal-cell-flag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  font-size: 9px;
  border: 1px solid var(--border);
  background: #fff;
  color: #64748b;
}
.cal-cell-flag.is-holiday{
  border-color: #ffd08a;
  background: #fff5e5;
  color: #a56410;
}
.cal-cell-flag.is-school-break{
  border-color: #b7ebc0;
  background: #edf9f0;
  color: #24613a;
}
.cal-cell-flag.is-birthday{
  border-color: #f3c2d6;
  background: #fff1f8;
  color: #b63269;
}
.cal-cell-flag.is-sleep{
  border-color: #c4b5fd;
  background: #f3edff;
  color: #5b33b6;
}
.cal-sleep-btn{
  border: 1px solid #d1d5db;
  background: #f3f4f6;
  color: #64748b;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  line-height: 1;
}
.cal-sleep-btn i{ font-size: 12px; }
.cal-sleep-btn.is-on{
  border-color: #c4b5fd;
  background: #f3edff;
  color: #5b33b6;
}
.cal-sleep-btn.is-compact{
  width: 30px;
  min-width: 30px;
  height: 30px;
  padding: 0;
  justify-content: center;
  gap: 0;
}
.cal-sleep-btn.is-compact i{
  font-size: 12px;
}
.cal-cell-holiday{
  border-color: #ffd08a;
  background: linear-gradient(180deg, #fff9ef 0%, #ffffff 52%);
}
.cal-cell-school-break{
  border-color: #b7ebc0;
  background: linear-gradient(180deg, #f2fbf4 0%, #ffffff 52%);
}
.cal-cell.cal-cell-past:not(.is-today){
  background: #eceff3;
  border-color: #c6ced9;
}
.cal-cell.cal-cell-past:not(.is-today) .cal-cell-head{
  color: #657180;
}
.cal-cell.cal-cell-past:not(.is-today) .cal-day-link{
  color: #53606f;
}
.cal-cell.cal-cell-past:not(.is-today) .cal-dot{
  color: #596878;
  border-left-color: #b5c0cd;
}
.cal-cell.cal-cell-past:not(.is-today) .cal-duty-grid-time{
  color: #5f6e7d;
}
.cal-cell.cal-cell-past:not(.is-today) .cal-duty-grid-line .cal-badge,
.cal-cell.cal-cell-past:not(.is-today) .cal-cell-flag{
  opacity: .78;
  filter: saturate(.68);
}
.cal-cell.cal-cell-past:not(.is-today) .cal-cell-body{
  opacity: .9;
}
.cal-cell.cal-cell-weekend.cal-cell-past:not(.is-today):not(.muted):not(.cal-cell-holiday):not(.cal-cell-school-break){
  background: #e7ebf0;
  border-color: #bcc6d3;
}
.cal-dot{
  display:block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 11px;
  padding-left: 6px;
  border-left: 3px solid var(--border);
}
.cal-dot.cal-link{
  color: var(--text);
  text-decoration: none;
}
.cal-dot.cal-link:hover{
  text-decoration: underline;
}
.cal-duty-grid-line{
  display:flex;
  align-items:center;
  gap: 6px;
  width: 100%;
  min-width: 0;
}
.cal-duty-grid-line .cal-badge{
  flex: 0 0 auto;
}
.cal-duty-grid-time{
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  white-space: nowrap;
}
.cal-cell-more{
  display:none;
}
.cal-day-head{
  margin: 10px 0 6px;
  font-weight: 700;
  color: var(--text);
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid #dfe3ea;
  background: #f7f9fc;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
}
.cal-day-head.is-month-list{
  margin: 0 0 8px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.cal-day-head.is-month-list .cal-day-head-left{
  flex: 1 1 auto;
}
.cal-day-head.is-month-list .cal-day-head-right{
  margin-left: auto;
}
.cal-day-head-left{ min-width: 0; }
.cal-day-head-left{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  flex-wrap: wrap;
}
.cal-day-head-right{
  display:flex;
  align-items:center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.cal-day-head-right.is-month-list{
  flex-wrap: nowrap;
  white-space: nowrap;
}
.cal-day-head-right.is-month-list .cal-day-flags{
  flex-wrap: nowrap;
}
.cal-day-head-right.is-month-list .cal-av-actions,
.cal-day-head-right.is-month-list .cal-sleep-btn{
  flex: 0 0 auto;
}
.cal-day-flags{
  display:flex;
  align-items:center;
  gap: 6px;
}
.cal-day-flag{
  display:inline-flex;
  align-items:center;
  gap: 4px;
  border: 1px solid var(--border);
  background: #fff;
  color: #334155;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
}
.cal-day-flag.is-holiday{
  border-color: #ffd08a;
  background: #fff5e5;
  color: #a56410;
}
.cal-day-flag.is-school-break{
  border-color: #b7ebc0;
  background: #edf9f0;
  color: #24613a;
}
.cal-day-head.is-holiday{
  border-color: #ffd08a;
  background: #fff9ef;
}
.cal-day-head.is-school-break{
  border-color: #b7ebc0;
}
.cal-day-head.is-holiday.is-school-break{
  background: linear-gradient(90deg, #fff9ef 0%, #f2fbf4 100%);
}
.cal-av-actions{
  display:flex;
  align-items:center;
  gap: 6px;
}
.cal-av-btn{
  border: 1px solid #d3d7de;
  background: #f3f4f6;
  color: #475569;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 700;
  display:inline-flex;
  align-items:center;
  gap: 6px;
  line-height: 1;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.cal-av-btn.is-icon{
  width: 30px;
  min-width: 30px;
  height: 30px;
  padding: 0;
  justify-content:center;
  gap: 0;
}
.cal-av-btn i{ font-size: 12px; }
.cal-av-btn.is-open{
  background: #fff3cd;
  border-color: #f0b429;
  color: #8a5a00;
}
.cal-av-btn.is-approved{
  background: #e8f7ea;
  border-color: #8bd7a1;
  color: #1f7a37;
}
.cal-av-btn.is-rejected{
  background: #fdecec;
  border-color: #f3a7a7;
  color: #a61b1b;
}
.cal-av-btn.is-approved,
.cal-av-btn.is-rejected{
  cursor: not-allowed;
}
.cal-av-btn.is-icon:not(.is-open):not(.is-approved):not(.is-rejected):hover,
.cal-sleep-btn.is-compact:not(.is-on):hover{
  background: #e9edf3;
  border-color: #c3cbd8;
  color: #49596f;
}
.cal-av-btn.is-icon:focus-visible,
.cal-sleep-btn.is-compact:focus-visible{
  outline: none;
  box-shadow: 0 0 0 2px #cfe0ff;
  border-color: #86a9e6;
}
.cal-av-visible{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:8px 0 4px;
}
.cal-av-visible.is-grid{
  margin:0 0 6px;
  gap:4px;
}
.cal-av-visible.is-inline{
  margin:10px 0 2px;
}
.cal-av-marker{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #8ec89c;
  background:linear-gradient(180deg, #effbf1 0%, #dff3e4 100%);
  color:#1c6a31;
  font-size:12px;
  font-weight:800;
  letter-spacing:0.01em;
  box-shadow:0 4px 10px rgba(47, 125, 50, 0.08);
}
.cal-av-marker.is-night{
  border-color:#9eb0de;
  background:linear-gradient(180deg, #f1f4ff 0%, #e2e8ff 100%);
  color:#314a86;
  box-shadow:0 4px 10px rgba(70, 97, 168, 0.08);
}
.cal-av-marker i{
  font-size:12px;
}
.cal-av-marker.is-compact{
  gap:5px;
  padding:3px 7px;
  font-size:10px;
  line-height:1.1;
  box-shadow:none;
}
.cal-av-marker.is-compact i{
  font-size:10px;
}
.cal-week-head{
  margin: 16px 0 0;
  padding: 8px 10px;
  border-radius: 10px 10px 0 0;
  background: #2f6f3b;
  border: 2px solid #24592f;
  border-bottom: 0;
  font-size: 17px;
  font-weight: 800;
  color: #ffffff;
}
.cal-week-head-range{
  margin-left: 8px;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
}
.cal-week-collapsible{
  margin: 0;
}
.cal-week-head-collapsible{
  list-style: none;
  cursor: pointer;
  user-select: none;
  position: relative;
  padding-right: 34px;
}
.cal-week-head-collapsible::-webkit-details-marker{
  display:none;
}
.cal-week-head-collapsible::after{
  content: "\f078";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: rgba(255,255,255,0.95);
}
.cal-week-head-stream.cal-week-head-collapsible::after{
  color: #4f6a57;
}
.cal-week-collapsible[open] > .cal-week-head-collapsible::after{
  content: "\f077";
}
.cal-week-block{
  margin: 0 0 10px;
  padding: 8px;
  border: 2px solid #24592f;
  border-radius: 0 0 10px 10px;
  background: #f2f8f2;
}
.cal-list-stream{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cal-week-head-stream{
  margin: 0;
  background: #e9f2e8;
  border: 1px solid #c7dbc3;
  border-bottom: 0;
  color: #203a25;
  font-size: 15px;
  font-weight: 800;
  border-radius: 10px 10px 0 0;
}
.cal-week-head-stream .cal-week-head-range{
  color: #4f6a57;
  font-size: 12px;
  font-weight: 700;
}
.cal-week-block-stream{
  margin: 0;
  padding: 8px;
  border: 1px solid #c7dbc3;
  border-radius: 0 0 10px 10px;
  background: #f8fcf8;
}
.cal-list-stream .cal-day-group{
  margin-bottom: 6px;
}
.cal-list-stream .cal-day-group:last-child{
  margin-bottom: 0;
}
.cal-day-head.is-today{
  border-color: #86bb7f;
  background: linear-gradient(90deg, #dff2dd 0%, #eef8ed 100%);
  box-shadow: inset 4px 0 0 #2f7d32;
}
.cal-day-link{
  color: inherit;
  text-decoration: none;
}
.cal-day-link-text-short{
  display:none;
}
.cal-day-link:hover{
  text-decoration: underline;
}
.cal-today-pill{
  display:inline-flex;
  align-items:center;
  padding: 1px 7px;
  border-radius: 999px;
  border: 1px solid #6ea968;
  background: #edf8ec;
  color: #245f2c;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
}
.cal-empty-day{
  margin-bottom: 6px;
  padding: 8px 10px;
  border: 1px dashed var(--border);
  border-radius: 8px;
  background: #fafafa;
  color: var(--muted);
  font-size: 13px;
}
.cal-free-slots{
  margin: 6px 0 2px;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px dashed #c8d7e8;
  background: #f7fbff;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}
.cal-free-slots-label{
  color: #47607c;
  font-size: 12px;
  font-weight: 700;
}
.cal-free-slot{
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid #bfd3ea;
  background: #ffffff;
  color: #2f4d6f;
  font-size: 12px;
  font-weight: 700;
}
.cal-quickmenu-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.28);
  z-index: 1300;
}
.cal-quickmenu{
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 1301;
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22);
  padding: 10px;
  display: grid;
  gap: 8px;
}
.cal-quickmenu-title{
  font-size: 14px;
  font-weight: 800;
  color: #2c3f56;
  margin: 0 0 2px 0;
}
.cal-day-group{
  border: 1px solid #d9e4d7;
  border-radius: 10px;
  background: #fbfdfb;
  padding: 0 8px 8px;
  margin-bottom: 8px;
}
.cal-day-group.is-today{
  border-color: #8fc88a;
  background: #ffffff;
  box-shadow: 0 0 0 1px #cae6c6;
}
.cal-day-group > .cal-day-head{
  margin: 0 -8px 8px;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.cal-day-group > .cal-av-visible{
  padding: 0 4px 8px;
}
.cal-day-group > .cal-av-visible.is-inline{
  padding-top: 2px;
}
.cal-day-group.is-today > .cal-day-head.is-month-list{
  margin-top: 0;
}
.cal-month-head{
  margin: 12px 0 6px;
  font-size: 18px;
  font-weight: 800;
}
.cal-status-head{
  margin: 8px 0 4px;
  font-size: 13px;
  font-weight: 700;
  color: #334155;
}
.cal-link{
  color: #2b6519;
  text-decoration: none;
  transition: color .12s ease;
}
.cal-link:hover,
.cal-link:focus-visible{
  color: #1f4f12;
  text-decoration: none;
}
.cal-actions{
  display:flex;
  gap:8px;
  justify-content:space-between;
  align-items:center;
  margin-bottom: 8px;
}
.cal-actions-inline{
  display:flex;
  align-items:center;
  gap:8px;
}
.cal-actions-right{
  justify-content: flex-end;
}
.cal-detail-note{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin: 8px 0 12px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid #d7e3d3;
  background: #f7fbf6;
  color: #35562d;
  font-size: 14px;
  line-height: 1.4;
}
.cal-detail-note i{
  margin-top: 2px;
}
.cal-detail-note.is-readonly{
  border-color: #d9e1ea;
  background: #f7f9fb;
  color: #475569;
}
.cal-detail-note.is-manage{
  border-color: #cfe7c8;
  background: #f4fbf2;
  color: #24551a;
}
.cal-detail-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin-top: 6px;
}
.cal-detail-row i{
  width: 16px;
  margin-top: 2px;
  color: #4b5563;
}

.cal-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 4px 9px;
  border-radius: 999px;
  background: var(--badge-color, #556);
  color:#fff;
  font-size: 13px;
  font-weight: 700;
}
.cal-duty-line{
  margin: 4px 0;
}

.color-dot{
  display:inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--badge-color, #556);
  margin-right: 6px;
}

.color-red{ --badge-color:#e03131; }
.color-orange{ --badge-color:#f08c00; }
.color-amber{ --badge-color:#f59f00; }
.color-yellow{ --badge-color:#fab005; }
.color-lime{ --badge-color:#82c91e; }
.color-green{ --badge-color:#2f9e44; }
.color-teal{ --badge-color:#0ca678; }
.color-cyan{ --badge-color:#1098ad; }
.color-blue{ --badge-color:#1c7ed6; }
.color-indigo{ --badge-color:#364fc7; }
.color-violet{ --badge-color:#7048e8; }
.color-pink{ --badge-color:#d6336c; }

.cal-item.color-red,
.cal-item.color-orange,
.cal-item.color-amber,
.cal-item.color-yellow,
.cal-item.color-lime,
.cal-item.color-green,
.cal-item.color-teal,
.cal-item.color-cyan,
.cal-item.color-blue,
.cal-item.color-indigo,
.cal-item.color-violet,
.cal-item.color-pink{
  border-left: 4px solid var(--badge-color);
}

.cal-item.cal-source-duty,
.cal-item.cal-source-duty-bundle,
.cal-item.cal-source-birthday{
  border-left: 4px solid #fff !important;
}
.cal-item.cal-source-sleepover{
  border-left: 4px solid #fff !important;
}

.cal-item.cal-cat-birthday{
  border-left: 4px solid #fff !important;
}

.cal-item.cal-cat-privat,
.cal-item.cal-cat-familie{
  border-left: 4px solid #1c7ed6;
}
.cal-item.cal-cat-beruf{
  border-left: 4px solid #7048e8;
}
.cal-item.cal-cat-arzt{
  border-left: 4px solid #e03131;
}
.cal-item.cal-cat-schule{
  border-left: 4px solid #2f9e44;
}
.cal-item.cal-cat-sonstiges{
  border-left: 4px solid #868e96;
}
.cal-item.cal-cat-birthday{
  border-left: 4px solid #d6336c;
}
.cal-item.cal-cat-sleepover{
  border-left: 4px solid #7c3aed;
}
.cal-item.cal-cat-holiday{
  border-left: 4px solid #f59f00;
}
.cal-item.cal-cat-schoolbreak{
  border-left: 4px solid #2f9e44;
}

.cal-dot.cal-cat-privat,
.cal-dot.cal-cat-familie{ border-left-color:#1c7ed6; }
.cal-dot.cal-cat-beruf{ border-left-color:#7048e8; }
.cal-dot.cal-cat-arzt{ border-left-color:#e03131; }
.cal-dot.cal-cat-schule{ border-left-color:#2f9e44; }
.cal-dot.cal-cat-sonstiges{ border-left-color:#868e96; }
.cal-dot.cal-cat-holiday{ border-left-color:#f59f00; }
.cal-dot.cal-cat-schoolbreak{ border-left-color:#2f9e44; }
.cal-dot.cal-cat-sleepover{ border-left-color:#7c3aed; }
.cal-dot.cal-cat-birthday{
  border-left-color: transparent;
  padding-left: 0;
}

.cal-month-legend{
  display:flex;
  flex-wrap:wrap;
  gap: 8px 12px;
  padding: 2px 0 8px;
}
.cal-legend-item{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  font-size: 12px;
  color: var(--muted);
}
.cal-legend-dot{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size: 9px;
  border: 1px solid var(--border);
  background:#f5f7fb;
}
.cal-legend-dot.is-holiday{
  color: #a56410;
  border-color: #ffd08a;
  background: #fff5e5;
}
.cal-legend-dot.is-school-break{
  color: #24613a;
  border-color: #b7ebc0;
  background: #edf9f0;
}
.cal-legend-dot.is-birthday{
  color: #b63269;
  border-color: #f3c2d6;
  background: #fff1f8;
}
.cal-legend-dot.is-sleep{
  color: #5b33b6;
  border-color: #c4b5fd;
  background: #f3edff;
}

.cal-month-notes{
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.cal-month-notes h3{
  margin: 0 0 8px 0;
  font-size: 14px;
}
.cal-note{
  margin: 4px 0;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid var(--border);
  font-size: 13px;
}
.cal-note-holiday{
  background: #fff4db;
  border-color: #ffe0a3;
}
.cal-note-break{
  background: #e9f7ef;
  border-color: #b9e3c7;
}
.cal-note-birthday{
  background: #fff1f8;
  border-color: #f3c2d6;
  color: #8d2f56;
}
.cal-note-sleep{
  background: #f3edff;
  border-color: #d8ccff;
  color: #4c2a9f;
}

.cal-av-review{
  margin: 10px 0 12px;
  border: 1px solid #e4d5a6;
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(255, 245, 204, 0.72), transparent 28%),
    linear-gradient(180deg, #fffef7 0%, #fffaf0 100%);
  padding: 12px;
  box-shadow: 0 12px 26px rgba(132, 107, 34, 0.07);
}
.cal-av-review-head{
  font-weight: 800;
  font-size: 14px;
  margin-bottom: 8px;
}
.cal-av-review-subhead{
  margin-top: 10px;
  font-size: 12px;
  font-weight: 700;
  color: #785000;
}
.cal-av-review-subhead.is-reopen{
  color: #334155;
}
.cal-av-review-line{
  display:flex;
  gap: 12px;
  align-items:center;
  flex-wrap: wrap;
  border: 1px solid #e6e9ef;
  background: rgba(255,255,255,0.96);
  border-radius: 14px;
  padding: 12px;
  margin-top: 8px;
  box-shadow: 0 8px 18px rgba(39, 52, 67, 0.05);
}
.cal-av-review-line.is-open{ border-color: #f0b429; background: #fff9e8; }
.cal-av-review-line.is-approved{ border-color: #8bd7a1; background: #f2fbf4; }
.cal-av-review-line.is-rejected{ border-color: #f3a7a7; background: #fff4f4; }
.cal-av-review-main{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}
.cal-av-review-slot{
  font-weight: 700;
}
.cal-av-review-slot-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background:#ffffff;
  border:1px solid #d7e0cf;
  color:#31473a;
  font-size:12px;
  font-weight:800;
}
.cal-av-review-status{
  display:flex;
  align-items:center;
  gap: 8px;
  flex-wrap: wrap;
  min-width:0;
}
.cal-av-review-meta{
  font-size: 12px;
  color: var(--muted);
}
.cal-av-reopen-meta{
  font-weight: 600;
}
.cal-av-review-actions{
  margin-left: auto;
  display:flex;
  gap: 6px;
}

@media (max-width: 640px){
  .cal-av-review{
    padding:10px;
    border-radius:14px;
  }
  .cal-av-review-line{
    padding:10px;
    border-radius:12px;
  }
  .cal-av-review-actions{
    margin-left: 0;
    width: 100%;
    justify-content:flex-start;
  }
}
.cal-av-status-badge{
  display:inline-flex;
  align-items:center;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid #d3d7de;
  background: #fff;
  color: #2f3542;
  font-size: 12px;
  font-weight: 700;
}
.cal-av-status-badge.is-open{
  background: #fff3cd;
  border-color: #f0b429;
  color: #8a5a00;
}
.cal-av-status-badge.is-approved{
  background: #e8f7ea;
  border-color: #8bd7a1;
  color: #1f7a37;
}
.cal-av-status-badge.is-rejected{
  background: #fdecec;
  border-color: #f3a7a7;
  color: #a61b1b;
}
.cal-av-status-badge.is-planned{
  background: #eef2ff;
  border-color: #9db0e8;
  color: #294d99;
}
.cal-av-requests-card{
  background:
    radial-gradient(circle at top left, rgba(231, 245, 234, 0.9), transparent 34%),
    linear-gradient(180deg, #fbfdf8 0%, #f5f8f2 100%);
}
.cal-av-month-block + .cal-av-month-block{
  margin-top: 28px;
}
.cal-av-request-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}
.cal-av-request-item{
  border-left-width: 4px;
  display:flex;
  flex-direction:column;
  gap: 10px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid #d9e3d2;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 24px rgba(34, 63, 45, 0.06);
}
.cal-av-request-item.is-open{ border-left-color: #f0b429; }
.cal-av-request-item.is-approved{ border-left-color: #2f9e44; }
.cal-av-request-item.is-rejected{ border-left-color: #e03131; }
.cal-av-request-item.is-planned{ border-left-color: #4c6edb; }
.cal-av-request-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
}
.cal-av-request-when{
  display:flex;
  flex-direction:column;
  gap: 8px;
  min-width: 0;
}
.cal-av-request-slot{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.cal-av-request-slot.is-day{
  background: #fff6db;
  color: #8a5a00;
}
.cal-av-request-slot.is-night{
  background: #edf2ff;
  color: #354a7a;
}
.cal-av-request-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 8px;
  flex-wrap:wrap;
}
.cal-av-icon-btn{
  width: 42px;
  height: 42px;
  border: 1px solid #cfd8c4;
  border-radius: 14px;
  background: #ffffff;
  color: #37523d;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}
.cal-av-icon-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(47, 69, 45, 0.12);
  border-color: #9cb48e;
}
.cal-av-icon-btn:disabled{
  opacity: 0.55;
  cursor: wait;
  transform:none;
  box-shadow:none;
}
.cal-av-icon-btn.is-primary{
  background: #2f7d32;
  border-color: #2f7d32;
  color: #fff;
}
.cal-av-request-badges{
  display:flex;
  align-items:center;
  gap: 8px;
  flex-wrap:wrap;
}
.cal-av-request-meta{
  color: #5e6f62;
}

@media (max-width: 640px){
  .cal-grid{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .cal-grid > .cal-weekdays,
  .cal-grid > .cal-row{
    min-width: 720px;
  }
  .cal-row{
    gap: 4px;
  }
  .cal-weekdays{
    gap: 4px;
  }
  .cal-cell{
    padding: 4px;
    min-height: 62px;
  }
  .cal-cell-head{
    font-size: 10px;
    margin-bottom: 2px;
  }
  .cal-av-visible{
    gap:6px;
  }
  .cal-av-marker{
    padding:5px 8px;
    font-size:11px;
  }
  .cal-cell .cal-today-pill{
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: 999px;
    border-color: #2f7d32;
    background: #2f7d32;
    color: transparent;
    font-size: 0;
    overflow: hidden;
  }
  .cal-badge{
    font-size: 11px;
    padding: 2px 6px;
  }
  .cal-dot{
    font-size: 10px;
  }
  .cal-grid.is-compact-mobile .cal-cell-body .cal-entry-overflow{
    display:none;
  }
  .cal-grid.is-compact-mobile .cal-cell-more{
    display:block;
    margin-top:2px;
    font-size:10px;
    font-weight:700;
    color:#4f647f;
  }
  .cal-day-add{
    width: 28px;
    min-width: 28px;
    height: 28px;
  }
  .cal-item{
    padding: 8px;
  }
  .cal-av-request-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .cal-av-request-item{
    padding: 12px;
    border-radius: 14px;
  }
  .cal-av-request-top{
    flex-direction: column;
  }
  .cal-av-request-actions{
    width: 100%;
    justify-content:flex-start;
  }
  .cal-av-icon-btn{
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }
  .cal-item-permission{
    margin-top: 4px;
  }
  .cal-permission-badge{
    gap: 4px;
    padding: 3px 7px;
    font-size: 10px;
  }
  .settings-required{
    padding: 8px;
    margin-bottom: 8px;
  }
  .settings-required-title{
    font-size: 14px;
    margin-bottom: 4px;
  }
  .settings-optional{
    padding: 7px 8px;
    margin: 6px 0;
  }
  .settings-optional > summary{
    font-size: 14px;
  }
  .settings-section{
    padding: 8px;
    margin-bottom: 8px;
  }
  .settings-section > h3{
    font-size: 14px;
    margin-bottom: 6px;
  }
  .cal-form-required{
    padding: 8px;
    margin-bottom: 8px;
  }
  .cal-form-required-title{
    font-size: 14px;
    margin-bottom: 4px;
  }
  .cal-form-optional{
    padding: 7px 8px;
    margin: 6px 0;
  }
  .cal-form-optional > summary{
    font-size: 14px;
  }
  .cal-form-row2{
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .cal-move-form-row{
    grid-template-columns: 1fr;
  }
  .cal-participants-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  .cal-participants-grid .choice-chip{
    min-height: 32px;
    font-size: 12px;
    padding: 4px 8px;
  }
  .cal-item-title{
    font-size: 15px;
    line-height: 1.25;
  }
  .cal-move-occurrence-inline{
    flex-direction:column;
    align-items:stretch;
  }
  .cal-move-occurrence-inline .input{
    width:100%;
  }
  .cal-item-meta{
    font-size: 13px;
    line-height: 1.3;
  }
  .cal-day-head{
    margin: 8px 0 4px;
    font-size: 14px;
    flex-wrap: wrap;
    gap: 6px;
  }
  .cal-day-head-right{
    width: 100%;
    justify-content: flex-end;
  }
  .cal-day-head.is-inline-actions{
    flex-wrap: nowrap;
    align-items: center;
    gap: 4px;
  }
  .cal-day-head.is-inline-actions .cal-day-head-left{
    flex: 1 1 auto;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
  }
  .cal-day-head.is-inline-actions .cal-day-head-left .cal-day-link{
    white-space: nowrap;
    font-size: 14px;
  }
  .cal-day-head.is-inline-actions .cal-day-head-right{
    width: auto;
    margin-left: auto;
    gap: 4px;
    flex-wrap: nowrap;
  }
  .cal-day-head.is-inline-actions .cal-av-actions{
    gap: 4px;
  }
  .cal-day-head.is-inline-actions .cal-av-btn.is-icon,
  .cal-day-head.is-inline-actions .cal-sleep-btn,
  .cal-day-head.is-inline-actions .cal-day-add{
    width: 28px;
    min-width: 28px;
    height: 28px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .cal-day-head.is-inline-actions .cal-av-btn.is-icon i,
  .cal-day-head.is-inline-actions .cal-sleep-btn i,
  .cal-day-head.is-inline-actions .cal-day-add i{
    font-size: 11px;
  }
  .cal-day-head.is-inline-actions .cal-sleep-btn span{
    display: none;
  }
  .cal-day-head.is-inline-actions .cal-day-flags{
    display: none;
  }
  .cal-day-head.is-inline-actions .cal-today-pill{
    padding: 1px 6px;
    font-size: 10px;
  }
  .cal-week-head-stream{
    font-size: 14px;
    padding: 7px 9px;
  }
  .cal-week-head-stream .cal-week-head-range{
    margin-left: 6px;
    font-size: 11px;
  }
  .cal-week-block-stream{
    padding: 6px;
  }
  .cal-list-stream{
    gap: 6px;
  }
  .cal-list-stream .cal-day-group{
    padding: 0 6px 6px;
  }
  .cal-list-stream .cal-day-group > .cal-day-head{
    margin-left: -6px;
    margin-right: -6px;
    margin-bottom: 6px;
  }
  .cal-av-btn{
    padding: 4px 8px;
    font-size: 11px;
  }
  .cal-av-btn.is-icon{
    width: 28px;
    min-width: 28px;
    height: 28px;
    padding: 0;
  }
  .cal-sleep-btn{
    padding: 4px 8px;
    font-size: 11px;
  }
  .cal-av-review-actions{
    margin-left: 0;
    width: 100%;
  }
  .dash-weather-next2{ font-size: 12px; }
}

@media (min-width: 641px) and (max-width: 980px){
  .cal-grid{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .cal-grid > .cal-weekdays,
  .cal-grid > .cal-row{
    min-width: 860px;
  }
}

@media (max-width: 700px){
  .cal-day-head.is-inline-actions .cal-day-link-text-full{
    display:none;
  }
  .cal-day-head.is-inline-actions .cal-day-link-text-short{
    display:inline;
  }
  .cal-day-head.is-inline-actions .cal-day-head-left .cal-day-link{
    font-size: 13px;
  }
  .cal-day-head.is-inline-actions .cal-av-btn.is-icon,
  .cal-day-head.is-inline-actions .cal-sleep-btn,
  .cal-day-head.is-inline-actions .cal-day-add{
    width: 26px;
    min-width: 26px;
    height: 26px;
    padding: 0;
  }
  .cal-day-head.is-inline-actions .cal-av-btn.is-icon i,
  .cal-day-head.is-inline-actions .cal-sleep-btn i,
  .cal-day-head.is-inline-actions .cal-day-add i{
    font-size: 10px;
  }
  .cal-day-head.is-inline-actions .cal-sleep-btn span{
    display:none;
  }
  .cal-day-head.is-inline-actions .cal-today-pill{
    width: 8px;
    height: 8px;
    padding: 0;
    border-radius: 999px;
    font-size: 0;
    color: transparent;
    overflow: hidden;
  }
}

.color-grid{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}
.color-choice{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 2px solid transparent;
  cursor: pointer;
}
.color-choice input{ display:none; }
.color-choice .color-swatch{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--badge-color, #556);
}
.color-choice input:checked + .color-swatch{
  outline: 2px solid #111;
}

.duty-month{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.duty-row{
  display:grid;
  grid-template-columns: 140px 1fr auto;
  gap: 10px;
  align-items:center;
  padding: 6px 0;
  border-bottom: 1px dashed var(--border);
}
.duty-row.is-free{
  background: #e9f7ef;
  border-radius: 8px;
  padding: 6px 8px;
}
.duty-date{ font-weight:600; font-size: 13px; }
.duty-select .select{ width: 100%; }
.note-btn{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: #fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.note-btn.has-note{
  border-color: #2f9e44;
  color: #2f9e44;
}
.note-dialog{
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  max-width: 420px;
  width: calc(100% - 24px);
}
.note-dialog::backdrop{
  background: rgba(0,0,0,0.35);
}
.note-dialog-title{
  margin: 0 0 4px 0;
}
.note-dialog-meta{
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 8px;
}
.note-dialog-actions{
  display:flex;
  justify-content:flex-end;
  gap: 8px;
  margin-top: 10px;
}

.duty-plan-list{
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.duty-plan-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px dashed var(--border);
}
.duty-plan-title{
  display:flex;
  align-items:center;
  gap: 6px;
  font-weight:600;
}
.duty-plan-meta{
  font-size: 12px;
  color: var(--muted);
  margin-left: auto;
  margin-right: 8px;
}

.edit-block{
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 10px;
  margin-top: 8px;
}
.edit-block summary{
  cursor: pointer;
  font-weight: 600;
}

.duty-card{
  position: relative;
}
.duty-card.color-red{ background: rgba(224,49,49,0.08); }
.duty-card.color-orange{ background: rgba(240,140,0,0.08); }
.duty-card.color-amber{ background: rgba(245,159,0,0.08); }
.duty-card.color-yellow{ background: rgba(250,176,5,0.10); }
.duty-card.color-lime{ background: rgba(130,201,30,0.10); }
.duty-card.color-green{ background: rgba(47,158,68,0.10); }
.duty-card.color-teal{ background: rgba(12,166,120,0.10); }
.duty-card.color-cyan{ background: rgba(16,152,173,0.10); }
.duty-card.color-blue{ background: rgba(28,126,214,0.10); }
.duty-card.color-indigo{ background: rgba(54,79,199,0.10); }
.duty-card.color-violet{ background: rgba(112,72,232,0.10); }
.duty-card.color-pink{ background: rgba(214,51,108,0.10); }

.duty-overview-wrap{
  overflow-x: auto;
}
.duty-overview th,
.duty-overview td{
  vertical-align: top;
}
.duty-overview tr.duty-offday-row td{
  background: #fff3f3;
}
.duty-overview tr.duty-offday-row:hover td{
  background: #ffe9e9;
}
.duty-date-col{
  white-space: nowrap;
  min-width: 92px;
  font-weight: 600;
}
.duty-free-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  color: #2b6b2f;
  background: #dff7df;
  border: 1px solid #bfe8bf;
}
.duty-shift-line{
  display:flex;
  align-items:center;
  gap: 6px;
  margin: 2px 0;
}
.duty-shift-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  color:#fff;
  background: var(--badge-color, #556);
  border: 1px solid transparent;
}
.duty-shift-time{
  font-size: 11px;
  font-weight: 700;
  color: var(--text);
}

.duty-shift-table th,
.duty-shift-table td{
  white-space: normal;
  vertical-align: top;
}
.duty-shift-link{
  color: var(--text);
  text-decoration: none;
}
.duty-shift-link:hover{
  text-decoration: underline;
}
.duty-shift-entry-link{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  color: var(--text);
  text-decoration: none;
}
.duty-shift-entry-link:hover{
  text-decoration: underline;
}
.duty-type-icon{
  display:inline-flex;
  align-items:center;
  gap: 4px;
  margin-right: 6px;
  color: #4b5563;
}
.duty-entry-card{
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.duty-entry-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
}
.duty-entry-actions{
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
}
.duty-stats-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 16px;
}
.duty-stat-card{
  border:1px solid #d7e5d1;
  border-radius:12px;
  background:#fbfdf9;
  padding:10px 12px;
}
.duty-report-summary-card{
  border:1px solid #dbe7d5;
  background:linear-gradient(180deg,#fbfdf8,#f3f8ef);
}
.duty-report-summary-card.is-open{
  border-color:#ead2a7;
  background:linear-gradient(180deg,#fffdf7,#fff4df);
}
.duty-report-summary-card.is-submitted{
  border-color:#bfd9c2;
  background:linear-gradient(180deg,#f7fff8,#eaf8ec);
}
.duty-status-pill{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid #d8e3d2;
  background:#f7faf5;
  color:#355332;
  font-size:12px;
  font-weight:700;
}
.duty-status-pill.is-open{
  border-color:#e4c28d;
  background:#fff7e8;
  color:#855116;
}
.duty-status-pill.is-submitted{
  border-color:#bbd8be;
  background:#edf9ef;
  color:#226038;
}
.duty-report-table tr.is-sick td{
  background:#fff1f1;
}
.duty-report-table tr.is-called-in td{
  background:#eef8ff;
}
.duty-report-table tr.is-vacation td{
  background:#f5f7ff;
}
.duty-timesheet-card{
  border:1px solid #d5dbe7;
  background:linear-gradient(180deg,#ffffff,#f8fafc);
}
.duty-timesheet-preview td:nth-child(2),
.duty-timesheet-preview td:nth-child(3),
.duty-timesheet-preview td:nth-child(4),
.duty-timesheet-preview td:nth-child(5),
.duty-timesheet-preview td:nth-child(6){
  white-space:nowrap;
  text-align:center;
}

.dash-modules{ display:flex; flex-direction:column; gap:12px; }
.dash-module-title{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-weight:700;
  text-decoration:none;
  color: var(--text);
}
.dash-module-title i{ color: #345; }
.dash-pills{
  margin-top: 6px;
  display:flex;
  flex-wrap: wrap;
  gap: 6px;
}
.dash-pill{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background:#eef5ff;
  border: 1px solid #cfe2ff;
  text-decoration:none;
  color: var(--text);
  font-size: 12px;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .12s ease;
}
.dash-pill.is-status-warn{
  background: #fff9e8;
  border-color: #ebd899;
  color: #664d03;
}
.dash-pill:hover{
  background: #e7f0ff;
  border-color: #bdd6ff;
}
.dash-pill:active{
  transform: translateY(1px);
}
.dash-pill.is-status-open{
  background: #f5f7fa;
  border-color: #d7dde5;
  color: #344054;
}
.dash-pill.is-status-doing{
  background: #fff7e9;
  border-color: #f0d08a;
  color: #8a4b00;
}
.dash-pill.is-status-done{
  background: #eaf8ef;
  border-color: #9fd7b6;
  color: #0f5132;
}
.dash-pill.is-status-danger{
  background: #fceef0;
  border-color: #e6b8bf;
  color: #842029;
}
.dash-pill i{
  margin-right: 0;
}

.status-color-open{ color: #344054; }
.status-color-doing{ color: #8a4b00; }
.status-color-done{ color: #0f5132; }
.status-color-danger{ color: #842029; }
.bd-tab.is-current{
  background: #dbe9ff;
  border-color: #9ec2ff;
  font-weight: 700;
}
.bd-filter-card{
  padding-top: 8px;
}
.bd-filter-details > summary{
  cursor: pointer;
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: #1f2e44;
}
.bd-filter-details > summary::-webkit-details-marker{
  display: none;
}
.bd-filter-details > summary::before{
  content: "▸";
  color: #3b4f68;
  font-size: 12px;
}
.bd-filter-details[open] > summary::before{
  content: "▾";
}
.bd-filter-form{
  margin-top: 8px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
  align-items: end;
}
.bd-filter-field-full{
  grid-column: 1 / -1;
}
.bd-filter-form .label{
  margin: 0 0 4px 0;
  font-size: 12px;
}
.bd-filter-form .input{
  padding: 8px 10px;
  min-height: 36px;
}
.bd-filter-checks{
  grid-column: 1 / -1;
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}
.bd-filter-checks .label{
  margin: 0;
}
.bd-filter-actions{
  grid-column: 1 / -1;
}
.bd-choice-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bd-choice-grid-users{
  max-height: 220px;
  overflow: auto;
  padding: 2px 0;
}
.bd-choice-chip{
  position: relative;
  display: inline-flex;
}
.bd-choice-chip input{
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.bd-choice-chip span{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #cfe2ff;
  background: #eef5ff;
  color: #22344f;
  font-size: 12px;
  line-height: 1.2;
}
.bd-choice-chip input:checked + span{
  background: #dbe9ff;
  border-color: #8fb3ff;
  font-weight: 700;
}
.bd-choice-chip:hover span{
  border-color: #9ec2ff;
}
.bd-bulk-form{
  display: grid;
  gap: 10px;
}
.bd-bulk-toolbar{
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #d8e4ff;
  border-radius: 10px;
  background: #f5f9ff;
}
.bd-bulk-toolbar .label{
  margin: 0;
}
.bd-bulk-select{
  min-width: 220px;
  max-width: 320px;
}
.bd-select-doc{
  display: inline-flex;
  align-items: center;
  position: relative;
}
.bd-select-doc input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.bd-select-doc span{
  width: 18px;
  height: 18px;
  border-radius: 5px;
  border: 1px solid #9ec2ff;
  background: #fff;
  display: inline-block;
  position: relative;
}
.bd-select-doc input:checked + span{
  background: #2563eb;
  border-color: #1d4ed8;
}
.bd-select-doc input:checked + span::after{
  content: "";
  position: absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.bd-mail-dialog{
  width: min(680px, 96vw);
  border: 1px solid #cfdceb;
  border-radius: 12px;
  padding: 12px;
}
.bd-mail-dialog::backdrop{
  background: rgba(17, 24, 39, 0.4);
}
.bd-mail-dialog-head{
  margin-bottom: 6px;
}
.bd-group{
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}
.bd-listmode-pills{
  margin-top: 8px;
}
.bd-tab-icononly{
  min-width: 42px;
  justify-content: center;
  padding: 8px 10px;
}
.bd-tab-icononly i{
  margin-right: 0;
}
.bd-group-title{
  margin: 10px 0 0;
  font-size: 15px;
}
.bd-doc-item{
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px;
  background: #fbfcff;
}
.bd-doc-item.is-pinned{
  background: #fffbe8;
  border-color: #f0dd9b;
}
.bd-doc-head{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}
.bd-doc-head-left{
  min-width: 0;
  display: grid;
  gap: 2px;
}
.bd-doc-title{
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.bd-doc-meta{
  color: var(--muted);
  font-size: 12px;
}
.bd-permission-note{
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid #d8e4d4;
  border-radius: 12px;
  background: #f8fbf7;
  color: #46613f;
  font-size: 14px;
  line-height: 1.45;
  display:flex;
  align-items:flex-start;
  gap: 8px;
}
.bd-doc-permission{
  margin-top: 8px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}
.bd-doc-permission.is-manage{
  background: #ecf8e9;
  color: #24551a;
  border: 1px solid #cfe7c8;
}
.bd-doc-permission.is-readonly{
  background: #f5f7fa;
  color: #526071;
  border: 1px solid #d9e1ea;
}
.bd-doc-readonly-note{
  margin-top: 10px;
  color: #617083;
  font-size: 13px;
  line-height: 1.45;
}
.bd-doc-share-note{
  margin-top: 6px;
  color: #526071;
  font-size: 13px;
  line-height: 1.45;
}
.bd-doc-desc{
  margin: 8px 0;
}
.bd-doc-source{
  margin: 6px 0;
}
.bd-doc-item.is-compact .bd-doc-head{
  align-items: center;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 8px 10px;
}
.bd-doc-item.is-compact .bd-doc-title{
  font-size: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bd-doc-item.is-compact .bd-doc-meta{
  font-size: 11px;
  grid-column: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bd-doc-item.is-compact .bd-doc-actions{
  margin-top: 0;
  margin-left: auto;
  flex-wrap: nowrap;
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
}
.bd-doc-actions{
  margin-top: 6px;
}
.bd-doc-actions .btn-icon{
  width: 36px;
  height: 36px;
  min-height: 36px;
}
.bd-doc-badges{
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.bd-doc-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid #d8e4d2;
  background: #f5faf3;
  color: #1f4d19;
  font-size: 12px;
}
.bd-doc-badge.is-scanned{
  border-color: #c6d6f8;
  background: #eef4ff;
  color: #1f3f76;
}
.bd-doc-badge.is-tag{
  border-color: #e3d7f5;
  background: #f6f1ff;
  color: #4f2d88;
}
.bd-doc-badge.is-person{
  border-color: #ffd9c8;
  background: #fff4ee;
  color: #7a3b1c;
}
@media (min-width: 781px){
  .bd-doc-head{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px 14px;
  }
  .bd-doc-actions{
    margin-top: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 220px;
  }
  .bd-doc-meta{
    word-break: break-word;
  }
}
.bd-scanner-preview{
  margin: 10px 0;
  border: 1px solid #dce6f5;
  border-radius: 10px;
  background: #f7fbff;
  overflow: hidden;
}
.bd-scanner-preview img{
  width: 100%;
  max-height: 360px;
  object-fit: contain;
  background: #eef4ff;
}
.bd-scanner-preview embed{
  width: 100%;
  height: 300px;
  border: 0;
  background: #fff;
}
.bd-ocr-preview{
  margin: 10px 0;
  border: 1px solid #dce6f5;
  border-radius: 10px;
  background: #f8fbff;
  padding: 8px 10px;
}
.bd-ocr-preview > summary{
  cursor: pointer;
  font-weight: 700;
  color: #24486f;
}
.bd-ocr-preview-body{
  margin-top: 8px;
}
.bd-ocr-preview pre{
  margin: 6px 0 0;
  max-height: 180px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  background: #ffffff;
  border: 1px solid #dce6f5;
  border-radius: 8px;
  padding: 8px;
  font-size: 12px;
  line-height: 1.35;
}
.bd-scanner-list{
  display: grid;
  gap: 14px;
}
.bd-doc-mail,
.bd-doc-admin{
  margin-top: 8px;
}
.bd-doc-mail > summary,
.bd-doc-admin > summary{
  cursor: pointer;
  color: #1f3f76;
}
.bd-admin-item{
  border: 1px solid #dce6f5;
  border-radius: 10px;
  background: #fbfcff;
  padding: 8px 10px;
  margin-bottom: 8px;
}
.bd-admin-item > summary{
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.bd-admin-item > summary::-webkit-details-marker{
  display: none;
}
.bd-admin-item > summary::before{
  content: "▸";
  margin-right: 6px;
  color: #415b7b;
  font-size: 12px;
}
.bd-admin-item[open] > summary::before{
  content: "▾";
}
.bd-admin-item-title{
  font-weight: 700;
}
.bd-admin-item-meta{
  color: var(--muted);
  font-size: 12px;
  margin-left: auto;
}
@media (max-width: 780px){
  .bd-filter-form{
    grid-template-columns: 1fr;
  }
  .bd-filter-actions{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }
  .bd-filter-actions .btn{
    width: 100%;
    justify-content: center;
  }
  .bd-bulk-toolbar{
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 8px;
  }
  .bd-bulk-toolbar .btn{
    width: 100%;
    justify-content: center;
  }
  .bd-bulk-select{
    max-width: none;
    min-width: 0;
  }
  .bd-doc-head{
    flex-direction: column;
    align-items: flex-start;
  }
  .bd-doc-actions{
    display: grid;
    grid-template-columns: repeat(4, minmax(32px, auto));
    gap: 8px;
    width: 100%;
    justify-content: start;
  }
  .bd-doc-item.is-compact .bd-doc-actions{
    grid-template-columns: repeat(4, minmax(32px, auto));
    flex-wrap: wrap;
  }
  .bd-doc-actions .btn-icon{
    width: 32px;
    height: 32px;
    min-height: 32px;
    font-size: 14px;
    border-radius: 8px;
  }
}
.dash-pill-child{
  background: #f4f8ff;
  border-color: #d9e7ff;
  margin-left: 10px;
}
.dash-pill-child-mark{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 12px;
  margin-right: 5px;
  color: #5f6f89;
  font-size: 11px;
}

.dash-acc{
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  padding: 8px 0;
  background: transparent;
  border: none;
  text-align: left;
  cursor: pointer;
}
.dash-acc-title{
  display:flex;
  align-items:center;
  gap:6px;
  font-weight: 700;
  font-size: 14px;
}
.dash-acc-icon{ font-size: 16px; color: var(--muted); }
.dash-acc-body{ display: block; }

.fav-bar{
  background: #f7f9ff;
}
.fav-link{
  background:#fff;
  border-color:#d9e4ff;
}
.fav-link.is-active{
  background:#e8f0ff;
  border-color:#bcd4ff;
}
.fav-link.fav-link-alert{
  position: relative;
}
.fav-link.fav-link-alert.is-unread{
  background: #c73a32;
  border-color: #b73029;
  color: #ffffff;
}
.fav-link.fav-link-alert.is-unread .btn-badge{
  background: #ffffff;
  color: #c73a32;
}

.nav-drawer{
  position: fixed;
  top: 0;
  left: 0;
  width: min(88vw, 390px);
  height: 100dvh;
  max-height: 100dvh;
  background: #fff;
  border-right: 1px solid var(--border);
  transform: translateX(-105%);
  transition: transform 0.2s ease;
  z-index: 80;
  padding-top: env(safe-area-inset-top);
  display: flex;
  flex-direction: column;
}
.nav-drawer.is-open{ transform: translateX(0); }
body.nav-open{
  position: fixed;
  overflow: hidden;
  width: 100%;
}

.nav-backdrop{
  position: fixed;
  inset: 0;
  background: #00000055;
  z-index: 70;
  display: none;
}
.nav-backdrop.is-open{ display: block; }

.nav-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 12px 10px;
  border-bottom: 1px solid var(--border);
  background: #fff;
  position: sticky;
  top: 0;
  z-index: 1;
}
.nav-title{ font-weight:800; font-size: 17px; }
.nav-actions{ display:flex; align-items:center; gap:8px; }

.nav-content{
  padding: 10px 10px calc(16px + env(safe-area-inset-bottom));
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
  scrollbar-gutter: stable;
}

.nav-module{
  margin-bottom: 8px;
  border: 1px solid #e2ebde;
  border-radius: 12px;
  background: #fcfefb;
  padding: 4px 6px;
}
.nav-module.is-open{
  background: #ffffff;
  border-color: #d5e4d0;
}
.nav-module-body{
  display: none;
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed #e1e8dc;
}
.nav-module.is-open .nav-module-body{
  display: block;
}
.nav-module-title{
  font-weight:700;
  margin-bottom: 4px;
  font-size: 16px;
  line-height: 1.2;
}
.nav-module-link{
  display:block;
  text-decoration:none;
  color: var(--text);
  padding: 10px 10px;
  min-height: 44px;
  border-radius: 10px;
  line-height: 1.25;
}
.nav-module-link.is-active{ background:#f0f6ff; border: 1px solid #cfe2ff; }

.nav-link{
  display:block;
  padding: 9px 10px;
  border-radius: 10px;
  color: var(--text);
  text-decoration:none;
  font-size: 15px;
  min-height: 42px;
  line-height: 1.25;
}
.nav-link.is-active{ background:#f0f6ff; border: 1px solid #cfe2ff; }
.nav-link-sub{
  margin-left: 10px;
  border-left: 2px solid #dde4ed;
  border-radius: 0 10px 10px 0;
  background: #f9fbf8;
}
.nav-sub{ margin-left: 8px; border-left: 2px solid var(--border); padding-left: 8px; }
.nav-sublink{ font-size: 14px; }

.fav-bar{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
  background: #d7e9d1;
  border-top: 1px solid #b5d1ac;
  display:flex;
  align-items:center;
  gap: 8px;
  z-index: 50;
}
.fav-bar{
  box-shadow: 0 -8px 20px rgba(32, 63, 26, 0.08);
}
.fav-scroll{
  flex: 1 1 auto;
  min-width: 0;
  display:flex;
  gap: 8px;
  overflow-x:auto;
  overflow-y:visible;
  padding-top: 8px;
  padding-right: 6px;
  -webkit-overflow-scrolling: touch;
}
.fav-actions{
  flex: 0 0 auto;
  width: 48px;
  display:flex;
  justify-content:flex-end;
}
.fav-link{
  flex: 0 0 auto;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--border);
  text-decoration:none;
  color: var(--text);
  background:#f7f7f7;
  white-space: nowrap;
  font-size: 13px;
  position: relative;
  overflow: visible;
}
.fav-link i{
  font-size: 16px;
  line-height: 1;
}
@media (min-width: 901px){
  .fav-bar{
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    width: min(var(--maxw), calc(100vw - 32px));
    margin: 0 auto;
    padding: 10px 12px;
    border: 1px solid #b5d1ac;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 12px 28px rgba(32, 63, 26, 0.10);
  }
  .fav-scroll{
    scrollbar-width: thin;
  }
}
@media (min-width: 1280px){
  .fav-bar{
    width: min(var(--maxw), calc(100vw - 48px));
  }
}
.fav-link.is-active{ background:#f0f6ff; border-color:#cfe2ff; }

.install-hint{
  position: fixed;
  right: 10px;
  left: auto;
  width: min(420px, calc(100vw - 20px));
  bottom: calc(64px + env(safe-area-inset-bottom));
  z-index: 65;
  border: 1px solid #b7d7ac;
  border-radius: 12px;
  background: rgba(247, 255, 243, 0.96);
  box-shadow: 0 8px 18px rgba(26, 56, 28, 0.14);
  padding: 9px 10px;
}
.install-hint-main{
  min-width: 0;
}
.install-hint-title{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  color: #285d1f;
  margin-bottom: 3px;
  font-size: 14px;
}
.install-hint-text{
  color: #31483a;
  font-size: 12px;
  line-height: 1.3;
}
.install-hint-actions{
  margin-top: 7px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
body[data-current-m="home"][data-current-v="start"] .install-hint{
  bottom: calc(76px + env(safe-area-inset-bottom));
  opacity: 0.92;
}


/* Favoriten bearbeiten (Stern im Menü) */
.nav-item{
  display:flex;
  align-items:center;
  gap: 8px;
}
.nav-item .nav-link,
.nav-item .nav-module-link{ flex: 1; }
.nav-item-module{
  gap: 6px;
}
.nav-item-module .nav-module-title{
  margin-bottom: 0;
}
.nav-module-toggle{
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 10px;
  width: 36px;
  height: 36px;
  font-size: 18px;
  line-height: 1;
  color: #5b6573;
  cursor: pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 36px;
  transition: transform .15s ease;
}
.nav-module.is-open .nav-module-toggle{
  transform: rotate(180deg);
}

.nav-fav-toggle{
  display:none;
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 10px;
  width: 42px;
  height: 38px;
  line-height: 1;
  font-size: 19px;
  cursor: pointer;
}
body.fav-edit .nav-fav-toggle{ display:inline-flex; align-items:center; justify-content:center; }
.nav-fav-toggle.is-on{ border-color:#cfe2ff; background:#f0f6ff; }

.nav-item-sub .nav-fav-toggle{ width: 38px; height: 34px; font-size: 17px; }

@media (max-width: 640px){
  .nav-drawer{
    width: min(91vw, 400px);
  }
  .nav-content{
    padding: 8px 8px calc(14px + env(safe-area-inset-bottom));
  }
  .nav-module{
    margin-bottom: 6px;
  }
  .nav-title{
    font-size: 18px;
  }
  .nav-link{
    padding: 10px 10px;
    min-height: 44px;
    font-size: 16px;
  }
  .nav-module-link{
    min-height: 46px;
    font-size: 16px;
  }
  .nav-link-sub{
    margin-left: 8px;
  }
  .install-hint{
    left: 8px;
    right: 8px;
    width: auto;
    bottom: calc(62px + env(safe-area-inset-bottom));
    padding: 9px;
  }
  body[data-current-m="home"][data-current-v="start"] .install-hint{
    bottom: calc(68px + env(safe-area-inset-bottom));
  }
  .install-hint-actions .btn{
    min-height: 36px;
    font-size: 13px;
    padding: 8px 10px;
  }
}


.table{ width:100%; border-collapse: collapse; }
.table th, .table td{ padding:8px; border-bottom:1px solid var(--border); text-align:left; }


.admin-checklist label{ display:block; margin:6px 0; }
.admin-muted{ color: var(--muted); }
.admin-subtitle{ font-weight:700; margin-bottom:8px; }
.admin-mini-input{ max-width: 120px; }

.admin-user-edit-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.admin-users-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.admin-user-item{
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}
.admin-user-col{
  padding:10px 12px;
}
.admin-user-col-main{
  display:flex;
  align-items:center;
  gap:10px;
  border-bottom:1px solid var(--border);
}
.admin-user-avatar-link{
  text-decoration:none;
  color:inherit;
}
.admin-user-maintext{
  min-width:0;
}
.admin-user-username{
  display:inline-block;
  font-weight:700;
  text-decoration:none;
  color:inherit;
}
.admin-user-display{
  color:var(--muted);
  font-size:13px;
}
.admin-user-col-mail{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.admin-user-toggle{
  flex: 0 0 auto;
}
.admin-user-toggle i{
  transition: transform .15s ease;
}
.admin-user-toggle.is-open i{
  transform: rotate(180deg);
}
.admin-user-extra{
  border-top:1px solid var(--border);
  background:#fafbfc;
  padding:10px 12px;
}
.admin-user-meta-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:6px 10px;
  font-size:13px;
}

.msg-layout{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.msg-toolbar{
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
}
.msg-toolbar-main{
  margin-bottom: 10px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:8px;
}
.msg-toolbar-main .btn.msg-btn{
  min-height:34px;
  padding:7px 8px;
}
.msg-toolbar-main .btn.msg-btn span{
  white-space:nowrap;
}
.msg-btn{
  min-height: 36px;
  padding: 8px 10px;
  border-radius: 9px;
}
.msg-btn-sub{
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 9px;
  font-size: 13px;
}
.msg-btn-sub i{
  font-size: 12px;
}
.msg-toolbar .btn.msg-btn:not(.btn-action){
  background:#eef5ee;
  border-color:#c8ddc3;
  color:#2b6519;
}
.msg-toolbar .btn.msg-btn.btn-action{
  background:#2b6519;
  border-color:#2b6519;
  color:#fff;
}
.msg-toolbar .btn.msg-btn-sub:not(.btn-action){
  background:#f5f7f5;
  border-color:#d7e2d3;
  color:#38513b;
}
.msg-toolbar .btn.msg-btn-sub.btn-action{
  background:#e7f3e4;
  border-color:#9ec798;
  color:#2b6519;
}
.msg-toolbar .btn.msg-btn-sub[type="submit"],
.msg-inline-form .btn.msg-btn-sub{
  background:#fff2f1;
  border-color:#f1b2ae;
  color:#a72822;
}
.msg-toolbar .btn.msg-btn-sub[type="submit"]:hover,
.msg-inline-form .btn.msg-btn-sub:hover{
  background:#ffe7e5;
}
.msg-toolbar .btn.msg-btn:hover:not(.btn-action){
  background:#e6f0e3;
}
.msg-toolbar .btn.msg-btn.btn-action:hover{
  filter: brightness(0.95);
}
.msg-toolbar .btn.msg-btn-danger,
.msg-inline-form .btn.msg-btn-danger{
  background:#fff2f1;
  border-color:#f1b2ae;
  color:#a72822;
}
.msg-toolbar .btn.msg-btn-danger:hover,
.msg-inline-form .btn.msg-btn-danger:hover{
  background:#ffe7e5;
}
.msg-inline-form{
  margin:0;
}
.msg-draft-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.msg-draft-state{
  font-size:12px;
  color:var(--muted);
}
.msg-reply-scope label{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.msg-reply-scope input[type="radio"]{
  margin:0;
}
.msg-pager{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.msg-pager-text{
  font-size:12px;
  color:var(--muted);
}
.msg-pager-jump{
  margin-top:8px;
}
.msg-pager-jump-row{
  display:flex;
  align-items:center;
  gap:8px;
  max-width:240px;
}
.msg-pager-jump-row .input{
  min-width:90px;
}
.btn.is-disabled{
  opacity:.45;
  pointer-events:none;
}
.msg-trash-actions{
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:0 0 auto;
}
.msg-list{
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.msg-item{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 10px;
  padding: 10px 2px;
  border-bottom: 1px solid #e2e8de;
}
.msg-item-selectable{
  border:1px solid #d9e2d5;
  border-radius:10px;
  background:#fbfdfb;
  transition: border-color .12s ease, background-color .12s ease;
  padding:0;
}
.msg-item.is-active{
  background:#f1f7ff;
  border-bottom-color:#d2e2ff;
}
.msg-item-selectable.is-active{
  border-color:#b8cff7;
}
.msg-item-link{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding:12px;
  width:100%;
  flex:1 1 auto;
  text-decoration:none;
  color:inherit;
  border-radius:10px;
}
.msg-item-link:hover{
  background:#f2f7f1;
}
.msg-item-main{
  flex:1 1 auto;
  min-width:0;
}
.msg-item-side{
  flex:0 0 auto;
  margin-left:auto;
}
.msg-subject{
  font-weight: 700;
  text-decoration:none;
  color: inherit;
}
.msg-meta{
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
}
.msg-preview{
  margin-top: 4px;
  font-size: 13px;
  color: #46535f;
  line-height: 1.35;
}
.msg-flag{
  flex: 0 0 auto;
  border-radius: 999px;
  font-size: 11px;
  padding: 3px 8px;
  border: 1px solid var(--border);
  background:#fff;
}
.msg-flag-unread{
  border-color:#e7a09c;
  background:#fdeceb;
  color:#9f251f;
}
.msg-flag-read{
  border-color:#9ec798;
  background:#e7f3e4;
  color:#2b6519;
}
.msg-view-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.msg-highlight{
  border:1px solid #b7d5af;
  border-left:5px solid #2b6519;
  border-radius:10px;
  background:linear-gradient(180deg,#eef7ec 0%, #e7f3e4 100%);
  padding:12px 12px 10px 12px;
  margin-bottom:8px;
}
.msg-highlight .msg-subject{
  font-size: 18px;
  line-height: 1.25;
}
.msg-highlight .msg-body{
  font-size: 20px;
  line-height: 1.45;
  color:#1f2d1a;
}
.msg-body{
  white-space: pre-wrap;
  line-height: 1.45;
}
.msg-target-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.msg-thread{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.msg-bubble{
  border:1px solid var(--border);
  border-radius:10px;
  background:#fff;
  padding:8px 10px;
}
.msg-bubble-me{
  background:#f0f6ff;
  border-color:#cfe2ff;
}
.msg-bubble-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  color:var(--muted);
  margin-bottom:4px;
}
.msg-bubble-subject{
  font-weight:700;
  margin-bottom:4px;
}
@media (min-width: 860px){
  .msg-target-grid{
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 720px){
  .msg-highlight{
    padding:10px;
  }
  .msg-highlight .msg-body{
    font-size: 16px;
    line-height: 1.4;
  }
  .msg-item{ gap: 8px; padding-top: 8px; padding-bottom: 8px; }
  .msg-item-selectable{ padding:0; }
  .msg-item-link{
    gap:8px;
    padding:10px;
  }
  .msg-subject{
    display:block;
    line-height: 1.3;
    word-break: break-word;
  }
  .msg-meta{
    font-size: 11px;
    line-height: 1.35;
  }
  .msg-preview{
    font-size: 12px;
  }
  .msg-flag{
    font-size: 10px;
    padding: 2px 7px;
  }
  .cache-version-current{
    grid-template-columns:1fr;
    align-items:start;
  }
  .cache-version-value{
    font-size:24px;
  }
  .cache-version-info{
    grid-template-columns:1fr;
  }
}
@media (max-width: 500px){
  .msg-item{
    flex-direction: column;
    align-items: stretch;
  }
  .msg-item-link{
    flex-direction: column;
    align-items: stretch;
  }
  .msg-item-side{
    align-self:flex-start;
  }
  .msg-flag{
    align-self: flex-start;
  }
  .msg-toolbar .btn{
    flex: 1 1 auto;
    justify-content: center;
  }
  .msg-toolbar-main{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .msg-toolbar-main .btn.msg-btn{
    width:100%;
    margin:0;
    min-height:42px;
    padding:8px 0;
    justify-content:center;
  }
  .msg-toolbar-main .btn.msg-btn span{
    display:none;
  }
  .msg-toolbar-main .btn.msg-btn i{
    margin:0;
    font-size:20px;
  }
}
@media (min-width: 860px){
  .admin-user-item{
    display:grid;
    grid-template-columns: 1.2fr 1fr;
  }
  .admin-user-col-main{
    border-bottom:none;
    border-right:1px solid var(--border);
  }
  .admin-user-col-mail{
    border-left:none;
  }
  .admin-user-extra{
    grid-column: 1 / -1;
  }
  .admin-user-meta-grid{
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 900px){
  .dash-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}
@media (max-width: 640px){
  .dash-title{
    font-size: 16px;
  }
  .dash-title i{
    font-size: 16px;
  }
}

.hannah-start-page .card{
  margin-bottom: 12px;
}
.hannah-start-page .card > h2:first-child{
  display:flex;
  align-items:center;
  gap:8px;
}
.hannah-start-page .card > h2:first-child i{
  margin-right:2px;
}
.hannah-tiles{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.hannah-tile{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap: 6px;
  min-height: 106px;
  border: 1px solid #c7dbc0;
  border-radius: 14px;
  background: linear-gradient(180deg, #eef8ea 0%, #ffffff 100%);
  text-decoration:none;
  color:#214021;
  padding: 10px 7px;
  text-align:center;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.hannah-tile:hover,
.hannah-tile:focus-visible{
  border-color:#9fcf94;
  box-shadow: 0 4px 14px rgba(31,60,25,0.10);
  transform: translateY(-1px);
}
.hannah-tile i{
  font-size: 33px;
  line-height: 1;
  color:#2b6519;
}
.hannah-tile span{
  font-size: 12px;
  font-weight: 700;
  line-height:1.2;
}
.hannah-tile-meta{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:5px;
  margin-top:2px;
}
.hannah-tile-meta .badge{
  font-size:10px;
  padding:2px 6px;
  border-radius:999px;
  line-height:1.2;
}
.hannah-tile-summary{
  display:none;
  margin-top:3px;
  font-size:10px;
  font-weight:700;
  color:#325b2c;
  line-height:1.25;
}
.hannah-today-head{
  font-weight:700;
  margin-bottom:6px;
}
.hannah-school-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.hannah-school-item{
  display:grid;
  grid-template-columns: 118px 1fr auto;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  border:1px solid #dbe8d8;
  border-radius:10px;
  background:#fbfefb;
}
.hannah-school-time{
  font-weight:700;
  color:#1f3c19;
  white-space:nowrap;
}
.hannah-school-subject{
  min-width:0;
}
.hannah-school-teacher{
  color:var(--muted);
  white-space:nowrap;
}
.hannah-school-ogs{
  margin-top:8px;
}
@media (max-width: 740px){
  .hannah-tiles{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:8px;
  }
  .hannah-tile{
    min-height:98px;
    border-radius:12px;
    padding:8px 6px;
  }
  .hannah-tile i{
    font-size:28px;
  }
  .hannah-tile span{
    font-size:11px;
  }
  .hannah-tile-meta .badge{
    font-size:9px;
    padding:2px 5px;
  }
}
@media (max-width: 430px){
  .hannah-tile-meta{
    display:none;
  }
  .hannah-tile-summary{
    display:block;
  }
}
@media (max-width: 560px){
  .hannah-tiles{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.menu-manage-item{
  border:1px solid var(--border);
  border-radius:10px;
  background:#fff;
  margin-bottom:10px;
  overflow:hidden;
}
.menu-manage-item > summary{
  list-style:none;
  cursor:pointer;
  padding:10px 12px;
  background:#f7faf7;
  border-bottom:1px solid var(--border);
}
.menu-manage-item > summary::-webkit-details-marker{ display:none; }
.menu-manage-form{
  padding:10px 12px 12px;
}
.menu-manage-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.menu-manage-roles{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
}
.menu-manage-roles label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
}
.hero-admin-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.hero-admin-item{
  display:grid;
  grid-template-columns: 180px 1fr auto;
  gap:10px;
  align-items:center;
  border:1px solid var(--border);
  border-radius:10px;
  padding:8px;
}
.hero-admin-thumb{
  width:100%;
  aspect-ratio:2/1;
  object-fit:cover;
  border-radius:8px;
  border:1px solid var(--border);
  background:#f5f7fa;
}
.hero-admin-meta{
  font-size:13px;
  line-height:1.35;
  color:#2a2a2a;
}
.cache-notes-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.cache-note-item{
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:10px;
  background:#f9fcf8;
}
.cache-note-head{
  font-size:12px;
  color:#4f6155;
  margin-bottom:4px;
}
.cache-note-text{
  font-size:14px;
  line-height:1.45;
}

.help-page .card{ margin-bottom:12px; }
.help-page .card > h2:first-child{
  font-size:18px;
}
.help-search-actions{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.help-tag-cloud{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:flex-start;
}
.help-tag{
  display:inline-flex;
  align-items:center;
  gap:4px;
  border:1px solid #bfd6b7;
  border-radius:999px;
  padding:4px 10px;
  text-decoration:none;
  color:#2f5f24;
  background:#eef6ea;
  font-size:12px;
}
.help-tag span{
  color:#4f6a4a;
  font-weight:700;
}
.help-tag.is-active{
  background:#2b6519;
  border-color:#2b6519;
  color:#fff;
}
.help-tag.is-active span{ color:#ebf6e8; }
.help-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.help-list-item{
  display:block;
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:12px;
  background:#fbfef9;
  color:var(--text);
  text-decoration:none;
}
.help-list-item:hover{
  border-color:#b9d1b2;
  background:#f4faf1;
}
.help-list-title{
  font-size:16px;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:8px;
}
.help-list-title i{ color:#2b6519; font-size:13px; }
.help-list-meta{
  margin-top:6px;
  font-size:12px;
  color:#5d6f5a;
  line-height:1.35;
}
.help-list-snippet{
  margin-top:10px;
  font-size:14px;
  color:#1f2f1c;
  line-height:1.5;
}
.help-inline-tags{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.help-inline-tag{
  display:inline-flex;
  align-items:center;
  gap:2px;
  border:1px solid #d5e3cf;
  border-radius:999px;
  padding:2px 8px;
  font-size:12px;
  color:#476640;
  background:#f8fcf6;
}
.help-inline-tag a{
  color:inherit;
  text-decoration:none;
}
.help-inline-tag a:hover{ text-decoration:underline; }
.help-list-summary{
  margin-top:10px;
  font-size:13px;
  color:#566653;
}
.help-pager{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.help-pager-info{
  font-size:13px;
  color:#5a6c57;
}
.help-version-line{
  margin-bottom:8px;
  font-size:15px;
}
.help-change-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.help-change-item{
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:10px;
  background:#f9fcf8;
}
.help-change-head{
  font-size:12px;
  color:#556a50;
  margin-bottom:4px;
}
.help-change-note{
  font-size:14px;
  line-height:1.4;
}
.help-tech-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 12px;
}
.help-tech-grid > div{
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:8px;
  background:#f9fcf8;
  font-size:13px;
  line-height:1.35;
}
.help-tech-ua{
  border:1px solid #dde7da;
  border-radius:10px;
  padding:8px;
  background:#f8faf9;
  overflow:auto;
  word-break:break-word;
}
.help-article-head{
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:10px;
  background:#f9fcf8;
}
.help-article-title-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.help-article-title{
  font-size:24px;
  line-height:1.2;
  font-weight:800;
}
.help-pinned-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid #c9e1c1;
  border-radius:999px;
  padding:3px 10px;
  background:#edf7e8;
  color:#2b6519;
  font-size:12px;
  font-weight:700;
}
.help-article-meta{
  margin-top:8px;
  font-size:13px;
  color:#5a6c57;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.help-article-body{
  margin-top:12px;
  font-size:16px;
  line-height:1.6;
}
.help-link-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.help-link-item{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:8px 10px;
  background:#f9fcf8;
  color:#2a5d21;
  text-decoration:none;
  width:fit-content;
}
.help-link-item:hover{ background:#f1f8ed; }
.help-subtitle{
  margin:0 0 8px 0;
  font-size:16px;
}
.help-image-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(120px, 1fr));
  gap:8px;
}
.help-image-link{
  display:block;
  border:1px solid #d6e3d1;
  border-radius:10px;
  overflow:hidden;
  background:#f6faf4;
}
.help-image-link img{
  width:100%;
  height:100px;
  object-fit:cover;
  display:block;
}
.help-article-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.help-history{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.help-history-item{
  border:1px solid #dce8d7;
  border-radius:10px;
  padding:8px 10px;
  background:#f9fcf8;
}
.help-history-head{
  font-size:12px;
  color:#5a6d57;
  margin-bottom:4px;
}
.help-history-msg{
  font-size:14px;
  line-height:1.45;
}

.help-lightbox{
  border:1px solid #d5e2d0;
  border-radius:12px;
  padding:12px;
  width:min(96vw, 1100px);
  background:#0f172a;
  color:#fff;
}
.help-lightbox::backdrop{
  background:rgba(0,0,0,0.68);
}
.help-lightbox img{
  display:block;
  width:100%;
  max-height:75vh;
  object-fit:contain;
  border-radius:8px;
  background:#000;
}
.help-lightbox-caption{
  margin-top:8px;
  font-size:13px;
  color:#dbeafe;
}
.help-lightbox-close{
  margin-left:auto;
  margin-bottom:8px;
  color:#fff;
  background:rgba(255,255,255,0.12);
  border-color:rgba(255,255,255,0.35);
}

.help-manage-item > summary{
  display:flex;
  align-items:center;
  gap:8px;
}
.help-manage-meta{
  padding:10px 12px 0;
  font-size:12px;
  color:#5a6c57;
}
.help-manage-subcard{
  border:1px solid #dde7da;
  border-radius:10px;
  padding:10px;
  background:#fbfef9;
}
.help-image-grid-admin{
  grid-template-columns:repeat(auto-fill, minmax(140px, 1fr));
}
.help-admin-image{
  border:1px solid #d6e3d1;
  border-radius:10px;
  padding:8px;
  background:#fff;
}
.help-admin-image img{
  width:100%;
  height:88px;
  object-fit:cover;
  border-radius:6px;
  margin-bottom:8px;
}
@media (max-width: 680px){
  .menu-manage-grid{ grid-template-columns:1fr; }
  .hero-admin-item{
    grid-template-columns:1fr;
    align-items:start;
  }
  .help-page{ padding-bottom: 6px; }
  .help-page .card{ border-radius:12px; }
  .help-page .card > h2:first-child{
    font-size:17px;
    min-height:42px;
  }
  .help-search-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .help-search-actions .btn{
    width:100%;
  }
  .help-list-item{
    padding:11px 10px;
  }
  .help-list-title{
    font-size:15px;
    line-height:1.3;
  }
  .help-list-meta{
    font-size:12px;
  }
  .help-tag-cloud{
    gap:7px;
  }
  .help-tag{
    padding:6px 11px;
    font-size:12px;
  }
  .help-article-title-wrap{
    flex-direction:column;
    align-items:flex-start;
  }
  .help-article-body{
    font-size:15px;
    line-height:1.55;
  }
  .help-article-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .help-article-actions .btn{
    width:100%;
  }
  .help-image-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .help-tech-grid{ grid-template-columns:1fr; }
  .help-article-title{ font-size:20px; }
  .help-pager{
    flex-wrap:wrap;
    justify-content:flex-start;
  }
  .help-pager .btn{
    min-width:140px;
  }
}
@media (max-width: 420px){
  .help-page .card{
    padding:10px;
  }
  .help-page .card > h2:first-child{
    margin:-10px -10px 10px -10px;
    padding:9px 10px;
    font-size:16px;
  }
  .help-list-title{
    font-size:14px;
  }
  .help-list-snippet{
    font-size:13px;
  }
  .help-image-grid{
    grid-template-columns:1fr 1fr;
    gap:6px;
  }
  .help-link-item{
    width:100%;
    justify-content:flex-start;
  }
}

/* Album */
.album-page{
  --album-gap: 12px;
}
.album-page .card h2{
  margin-bottom: 12px;
}
.album-page .card{
  scroll-margin-top: calc(var(--app-top-sticky-offset) + env(safe-area-inset-top) + 24px);
}
.album-top-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.album-top-actions-main{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:10px;
}
.album-top-actions-main .btn{
  width:100%;
  justify-content:center;
}
.album-view-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:12px;
  align-items:flex-end;
}
.album-view-group{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
}
.album-view-label{
  font-size:12px;
  color:var(--muted);
  font-weight:700;
  margin-right:2px;
}
.album-icon-btn{
  min-width:38px;
  min-height:38px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.album-icon-btn.is-active{
  border-color:#a9cf9d;
  background:#e8f5e3;
  color:#1f5a13;
}
.album-hero{
  display:flex;
  flex-direction:column;
  gap:4px;
  background:linear-gradient(180deg, #f5faf4 0%, #eef6ee 100%);
  border-color:#cddfc8;
}
.album-hero-title{
  font-size:32px;
  line-height:1.1;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:10px;
}
.album-hero-meta{
  color:var(--muted);
  font-size:15px;
  font-weight:600;
}
.album-top-actions .btn{
  min-height: 44px;
}
.album-filter-details > summary{
  list-style:none;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  user-select:none;
  font-weight:700;
}
.album-filter-details > summary::-webkit-details-marker{
  display:none;
}
.album-filter-details > summary::after{
  content:"\f078";
  margin-left:auto;
  font-family:"Font Awesome 6 Free";
  font-weight:900;
  color:var(--muted);
  font-size:12px;
}
.album-filter-details[open] > summary::after{
  content:"\f077";
}
.album-filter-form{
  margin-top:10px;
}
.album-filter-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:10px;
}
.album-filter-actions{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.album-tag-cloud{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.album-tag,
.album-tag-mini{
  display:inline-flex;
  align-items:center;
  gap:4px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:4px 10px;
  color:var(--text);
  text-decoration:none;
  font-size:13px;
  background:var(--bg-soft);
}
.album-tag.is-active{
  border-color:var(--primary-200);
  background:#eaf3ff;
}
.album-tag span{
  color:var(--muted);
  font-size:12px;
}
.album-batch-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.album-batch-tools{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.album-batch-controls{
  margin-top:10px;
  margin-bottom:12px;
  padding:10px;
  border:1px dashed #c9d6c9;
  border-radius:10px;
  background:#f8fcf8;
}
.album-batch-row{
  display:grid;
  grid-template-columns: 1fr 180px auto;
  gap:10px;
}
.album-batch-select{
  min-width:140px;
}
.album-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap:12px;
}
.album-grid.album-grid-thumb-small{
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
.album-grid.album-grid-thumb-large{
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.album-grid.album-grid-view-square .album-thumb-link{
  aspect-ratio: 1 / 1;
}
.album-grid.album-grid-view-square .album-thumb{
  object-fit: contain;
  background:#f2f5f7;
}
.album-grid.album-grid-view-natural .album-thumb-link{
  aspect-ratio: auto;
  border-bottom:0;
}
.album-grid.album-grid-view-natural .album-thumb{
  height:auto;
  object-fit: contain;
  background:#f8fafb;
}
.album-grid.album-grid-view-natural{
  display:block;
  column-count:4;
  column-gap:12px;
}
.album-grid.album-grid-view-natural .album-tile{
  display:inline-block;
  width:100%;
  margin:0 0 12px;
  break-inside:avoid;
}
.album-grid.album-grid-info-title .album-meta,
.album-grid.album-grid-info-title .album-tags{
  display:none;
}
.album-grid.album-grid-info-title .album-title{
  padding-bottom:8px;
}
@media (min-width: 1100px){
  .album-grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (min-width: 1450px){
  .album-grid{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
.album-tile{
  position:relative;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  padding-bottom:8px;
  box-shadow: 0 1px 0 rgba(15,23,42,0.02);
}
.album-select{
  position:absolute;
  left:8px;
  top:8px;
  z-index:3;
  background:rgba(255,255,255,0.9);
  border:1px solid var(--line);
  border-radius:999px;
  padding:3px 8px;
  font-size:12px;
  display:flex;
  align-items:center;
  gap:6px;
}
.album-thumb-link{
  display:block;
  position:relative;
  aspect-ratio: 4/3;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  text-decoration:none;
}
.album-thumb{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.album-grid.album-grid-thumb-small .album-thumb-link{
  aspect-ratio: 1 / 1;
}
.album-grid.album-grid-thumb-large .album-thumb-link{
  aspect-ratio: 16 / 10;
}
.album-badge{
  position:absolute;
  right:8px;
  top:8px;
  border-radius:999px;
  padding:2px 8px;
  font-size:12px;
  font-weight:700;
  border:1px solid transparent;
}
.album-badge-new{
  background:#fff3cd;
  color:#6c4a00;
  border-color:#e8cc7f;
}
.album-badge-fav{
  top:auto;
  bottom:8px;
  background:#ffe9ee;
  color:#9d1039;
  border-color:#f3bfd0;
}
.album-title{
  display:block;
  padding:8px 10px 4px;
  font-size:16px;
  font-weight:700;
  color:var(--text);
  text-decoration:none;
  line-height:1.25;
}
.album-title:hover{
  text-decoration:underline;
}
.album-meta{
  padding:0 10px 4px;
  color:var(--muted);
  font-size:14px;
}
.album-tags{
  padding:2px 10px 0;
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.album-tile-thumb-small .album-title{
  font-size:14px;
  padding:7px 8px 4px;
}
.album-tile-thumb-small .album-meta{
  font-size:12px;
  padding:0 8px 4px;
}
.album-pager{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.album-pager-info{
  color:var(--muted);
  font-size:14px;
}
.album-pager-buttons{
  row-gap:8px;
  column-gap:8px;
}
.album-pager-ellipsis{
  display:inline-flex;
  align-items:center;
  min-width:18px;
  justify-content:center;
}

.album-upload-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:10px;
}
.album-people-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.album-crop-state{
  margin-top:8px;
}
.album-crop-dialog{
  width:min(940px, calc(100vw - 24px));
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px;
}
.album-crop-dialog::backdrop{
  background:rgba(0,0,0,0.45);
}
.album-crop-dialog-title{
  font-weight:700;
  font-size:24px;
}
.album-crop-dialog-sub{
  color:var(--muted);
  margin-top:2px;
  margin-bottom:8px;
}
.album-crop-canvas-wrap{
  width:100%;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:10px;
  background:#0a1b44;
  display:flex;
  justify-content:center;
  align-items:center;
  max-height:70vh;
}
.album-crop-canvas{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  touch-action:none;
}
.album-crop-dialog-actions{
  margin-top:10px;
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.album-slideshow{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.album-slideshow-view{
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:#f7fafb;
}
.album-slideshow-link{
  display:block;
}
.album-slideshow-image{
  display:block;
  width:100%;
  height:min(72vh, 760px);
  object-fit:contain;
  background:#f7fafb;
}
.album-slideshow-caption{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.album-slideshow-title{
  font-size:24px;
  font-weight:700;
  line-height:1.2;
}
.album-slideshow-meta{
  color:var(--muted);
}
.album-slideshow-controls{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.album-slideshow-delay{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-left:4px;
  color:var(--muted);
}
.album-slideshow-delay .input{
  min-width:84px;
}
.album-slideshow-count{
  margin-left:auto;
  color:var(--muted);
  font-weight:600;
}

.album-photo-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.album-photo-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.album-photo-image-link{
  display:block;
  margin-top:10px;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
}
.album-photo-image{
  display:block;
  width:100%;
  height:auto;
  max-height:70vh;
  object-fit:contain;
  background:#f8fafb;
}
.album-photo-desc{
  margin-top:10px;
  white-space:pre-wrap;
  background:#f7fbf6;
  border:1px solid #d7e4d6;
  border-radius:10px;
  padding:10px;
}
.album-access-note{
  margin-top:10px;
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:10px 12px;
  border-radius:10px;
  font-size:14px;
  line-height:1.45;
}
.album-access-note.is-manage{
  background:#ecf8e9;
  border:1px solid #cfe7c8;
  color:#24551a;
}
.album-access-note.is-readonly{
  background:#f5f7fa;
  border:1px solid #d9e1ea;
  color:#526071;
}
.album-photo-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.album-rate-form{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.album-files-list ul{
  margin:8px 0 0 18px;
  padding:0;
}
.album-files-list li{
  margin-bottom:4px;
}
.album-manage-inline{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.album-comment-form{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:10px;
}
.album-comment{
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px;
  margin-bottom:8px;
  background:#fdfefe;
}
.album-comment-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  margin-bottom:6px;
}

/* Kalender iCal block (CSP-safe classes statt inline styles) */
.cal-ics-block{
  margin-bottom:10px;
}
.cal-ics-muted{
  margin-bottom:8px;
}
.cal-ics-panel{
  padding:10px;
  margin-bottom:8px;
}
.cal-ics-panel-last{
  margin-bottom:0;
}
.cal-ics-subhead{
  margin:0 0 8px 0;
}
.cal-ics-row{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.cal-ics-actions{
  margin-top:8px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.cal-ics-steps{
  margin:6px 0 0 18px;
}
.cal-ics-steps-gap{
  margin-bottom:10px;
}
.cal-search-form{
  margin-bottom:10px;
}
.cal-search-row{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.cal-search-row .input{
  flex: 1 1 260px;
}
.cal-search-row .btn{
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.cal-conflict-list{
  margin:8px 0 0 18px;
}

.album-comment-body{
  white-space:pre-wrap;
}

.album-trash-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.album-trash-item{
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px;
  display:grid;
  grid-template-columns:120px 1fr;
  gap:10px;
}
.album-trash-thumb{
  width:120px;
  height:90px;
  object-fit:cover;
  border-radius:8px;
  border:1px solid var(--line);
}
.album-trash-title{
  font-size:24px;
  font-weight:700;
}
.album-trash-actions{
  margin-top:8px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

@media (max-width: 900px){
  .album-filter-grid,
  .album-upload-grid,
  .album-batch-row{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .album-batch-controls{
    position: sticky;
    top: calc(var(--app-top-sticky-offset) + env(safe-area-inset-top));
    z-index: 8;
  }
  .album-trash-item{
    grid-template-columns:1fr;
  }
  .album-trash-thumb{
    width:100%;
    height:auto;
    max-height:220px;
  }
  .album-pager-buttons .album-page-num.is-far,
  .album-pager-buttons .album-pager-ellipsis{
    display:none;
  }
  .album-grid.album-grid-view-natural{
    column-count:3;
  }
}

@media (max-width: 640px){
  .album-page{
    --album-gap: 10px;
  }
  .album-hero-title{
    font-size:26px;
  }
  .album-hero-meta{
    font-size:14px;
  }
  .album-top-actions{
    gap:8px;
  }
  .album-top-actions-main{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px;
  }
  .album-view-toolbar{
    gap:8px;
  }
  .album-view-group{
    width:100%;
  }
  .album-top-actions .btn{
    flex:1 1 calc(50% - 8px);
    justify-content:center;
  }
  .album-filter-grid,
  .album-upload-grid,
  .album-batch-row{
    grid-template-columns:1fr;
  }
  .album-filter-form{
    margin-top:8px;
  }
  .album-filter-grid{
    gap:8px;
  }
  .album-filter-actions{
    margin-top:8px;
    gap:8px;
  }
  .album-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:10px;
  }
  .album-grid.album-grid-thumb-small{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .album-grid.album-grid-thumb-large{
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .album-grid.album-grid-view-natural{
    column-count:2;
    column-gap:10px;
  }
  .album-grid.album-grid-view-natural .album-tile{
    margin-bottom:10px;
  }
  .album-select{
    left:6px;
    top:6px;
    padding:2px 7px;
    font-size:11px;
  }
  .album-title{
    font-size:15px;
    padding:7px 8px 2px;
  }
  .album-meta{
    padding:0 8px 3px;
    font-size:13px;
  }
  .album-tile-thumb-small .album-meta{
    padding:0 7px 3px;
    font-size:11px;
  }
  .album-tags{
    padding:2px 8px 0;
    gap:4px;
  }
  .album-tag-mini{
    font-size:12px;
    padding:3px 8px;
  }
  .album-comment-head{
    align-items:flex-start;
    flex-direction:column;
    gap:2px;
  }
  .album-slideshow-title{
    font-size:20px;
  }
  .album-slideshow-count{
    margin-left:0;
    width:100%;
  }
}


.school-setup-nav{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.school-setup-nav .btn{
  border-color:#b8d4b2;
  color:#295723;
}
.school-setup-nav .btn.is-active{
  background:#2b6519;
  color:#fff;
  border-color:#2b6519;
}
.school-setup-hint{
  margin-top:8px;
  font-size:13px;
  color:var(--muted);
}
.school-setup-hint a{
  color:#2b6519;
  text-decoration:none;
  font-weight:600;
}
.school-setup-hint a:hover,
.school-setup-hint a:focus-visible{
  text-decoration:underline;
}
.ogs-page-card{
  margin-bottom:12px;
}
.ogs-form{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.ogs-week{
  border:1px solid #d6e4d2;
  border-radius:12px;
  background:#f9fcf9;
  padding:8px;
}
.ogs-week-title{
  font-weight:800;
  color:#244d20;
  margin:2px 4px 6px;
}
.ogs-row{
  border:1px solid #c9dbc5;
  border-radius:10px;
  background:linear-gradient(180deg, #ffffff 0%, #f1f8ef 100%);
  padding:7px;
  margin-bottom:7px;
  box-shadow:0 1px 0 rgba(43,101,25,.06);
}
.ogs-row.is-alt{
  border-color:#bdd1b8;
  background:linear-gradient(180deg, #f5faf3 0%, #eaf4e7 100%);
  box-shadow:0 1px 0 rgba(43,101,25,.08);
}
.ogs-row.is-today{
  border-color:#7eaf71;
  box-shadow:inset 0 0 0 1px rgba(43,101,25,.14);
}
.ogs-row.is-deviation{
  border-color:#d7bb69;
  background:linear-gradient(180deg, #fffdf4 0%, #fff7df 100%);
}
.ogs-row:last-child{
  margin-bottom:0;
}
.ogs-row-head{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:6px;
}
.ogs-row-date{
  font-weight:700;
  font-size:20px;
  line-height:1.15;
}
.ogs-row-main{
  display:grid;
  grid-template-columns: 1fr;
  gap:8px;
}
.ogs-section{
  border:1px solid #d8e5d5;
  border-radius:10px;
  padding:7px;
  background:#fff;
}
.ogs-section-title{
  font-weight:800;
  margin-bottom:5px;
  display:flex;
  align-items:center;
  gap:6px;
}
.ogs-section-title-school{
  justify-content:space-between;
  gap:10px;
}
.ogs-section-title-school > span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.ogs-section-school{
  border-color:#d8d8d8;
  background:linear-gradient(180deg, #ffffff 0%, #f8f8f8 100%);
  display:flex;
  flex-direction:column;
}
.ogs-section-school .check-inline{
  margin:1px 0 6px;
}
.ogs-section-school .check-inline input{
  margin-right:6px;
}
.ogs-school-toggle{
  margin:0;
  white-space:nowrap;
  margin-left:auto;
  font-size:14px;
}
.ogs-section-ogs{
  border-color:#c9dbc5;
  background:linear-gradient(180deg, #ffffff 0%, #f6fbf4 100%);
}
.ogs-section-ogs.is-disabled{
  opacity:.65;
  filter:grayscale(.08);
}
.ogs-meta{
  font-size:13px;
  color:#3f5044;
  margin-bottom:2px;
}
.ogs-inline-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  align-items:end;
}
.ogs-inline-field{
  min-width:0;
}
.ogs-inline-field .label{
  margin-top:6px;
}
.ogs-row-controls .label{
  margin-top:0;
}
.ogs-effective{
  margin-top:5px;
  font-size:13px;
  color:#34463c;
}
.ogs-school-note{
  min-height:90px;
  height:100%;
  resize:vertical;
  flex:1 1 auto;
}
.ogs-actions{
  margin-top:4px;
}
@media (min-width: 640px){
  .ogs-row-main{
    grid-template-columns: minmax(220px, 1fr) minmax(300px, 1fr);
  }
  .ogs-inline-fields{
    grid-template-columns:1fr 1fr;
    align-items:end;
    gap:10px;
  }
  .ogs-inline-field .label{
    margin-top:4px;
  }
}
@media (max-width: 430px){
  .ogs-inline-fields{
    grid-template-columns:1fr;
  }
  .ogs-section-title-school{
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .ogs-school-toggle{
    margin-left:0;
  }
}

/* --- module start tiles --- */
.module-tiles,
.medicine-tiles{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
}
.module-tiles + .card,
.medicine-tiles + .card{
  margin-top:14px;
}
.module-tile,
.medicine-tile{
  border:1px solid #c9ddc2;
  border-radius:12px;
  background:#f7fbf6;
  color:var(--text);
  text-decoration:none;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.module-tile:hover,
.medicine-tile:hover{
  border-color:#9fbe95;
  background:#f1f8ef;
}
.module-tile i,
.medicine-tile i{
  font-size:18px;
  color:#2b6519;
}
.module-tile-title,
.medicine-tile-title{
  font-weight:700;
}
.module-tile-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.module-tile-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:700;
  line-height:1;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid transparent;
  white-space:nowrap;
}
.module-tile-badge.is-ok{
  color:#1f5a13;
  background:#e7f5e2;
  border-color:#a9cf9d;
}
.module-tile-badge.is-warn{
  color:#7a5600;
  background:#fff2cc;
  border-color:#e4c87a;
}
.module-tile-badge.is-bad{
  color:#8a221d;
  background:#ffe4e1;
  border-color:#d99a95;
}
@media (max-width: 780px){
  .page > .card + .card{
    margin-top: 10px;
  }
}
.module-tile-text,
.medicine-tile-text{
  font-size:13px;
  color:var(--muted);
}
.module-tile-lines{
  display:grid;
  gap:4px;
}
.module-tile-line{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
}
.module-tile-line strong{
  flex:0 0 auto;
  color:#415445;
  font-weight:600;
}
.module-tile-line span{
  min-width:0;
  text-align:right;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.module-tile-sub{
  font-size:12px;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.module-tile-sub summary{
  cursor:pointer;
}
.module-tile.module-tile--ok{
  border-color:#9fbe95;
  background:#eef8ea;
}
.module-tile.module-tile--ok i{
  color:#2b6519;
}
.module-tile.module-tile--warn{
  border-color:#e4c87a;
  background:#fff8e6;
}
.module-tile.module-tile--warn i{
  color:#9a6b00;
}
.module-tile.module-tile--bad{
  border-color:#e3a7a1;
  background:#fff1f0;
}
.module-tile.module-tile--bad i{
  color:#a72822;
}
.module-tile.module-tile--ok:hover{
  border-color:#87ad7a;
  background:#e5f3df;
}
.module-tile.module-tile--warn:hover{
  border-color:#d5b45f;
  background:#fff3d7;
}
.module-tile.module-tile--bad:hover{
  border-color:#d48f87;
  background:#ffe7e5;
}
.family-list{
  display:grid;
  gap:12px;
}
.family-card{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
  align-items:start;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(248,250,252,0.98) 100%);
}
.family-card-link{
  min-width:0;
  display:grid;
  grid-template-columns:64px minmax(0, 1fr);
  gap:12px;
  align-items:start;
  color:inherit;
  text-decoration:none;
}
.family-card-link:hover,
.family-card-link:focus-visible{
  text-decoration:none;
}
.family-card-avatar-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
}
.family-card-avatar{
  width:64px;
  height:64px;
  border-radius:18px;
  object-fit:cover;
  border:1px solid var(--border);
  background:#f6f8fb;
}
.family-card-avatar-fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#748095;
}
.family-card-main{
  min-width:0;
}
.family-card-name{
  font-size:18px;
  font-weight:700;
  line-height:1.2;
}
.family-card-status{
  margin-top:2px;
  font-size:12px;
  line-height:1.3;
  color:#7b8797;
  overflow-wrap:anywhere;
}
.family-card-meta{
  margin-top:4px;
  display:grid;
  gap:2px;
}
.family-card-meta-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  color:var(--muted);
  min-width:0;
  font-size:15px;
  line-height:1.25;
}
.family-card-meta-row i{
  width:16px;
  margin-top:1px;
  color:#6f7f95;
}
.family-card-meta-row span{
  min-width:0;
  overflow-wrap:anywhere;
}
.family-card-meta-row.is-muted{
  color:#7c8798;
}
.family-card-actions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  padding-top:2px;
}
.family-card-message-btn{
  width:38px;
  min-width:38px;
  height:38px;
  padding:0;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.family-card-message-btn i{
  margin:0;
}
.family-compose-hint{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 14px;
  border:1px solid #d7e3f4;
  border-radius:12px;
  background:#f5f9ff;
  color:#39506f;
}
.family-compose-form{
  margin-top:12px;
}
.family-compose-actions{
  margin-top:12px;
  display:flex;
  justify-content:flex-end;
}
.family-info-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.family-info-card{
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  background:#fafbfc;
}
.family-info-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.family-info-title{
  font-weight:700;
  display:flex;
  align-items:center;
  gap:8px;
}
.family-info-title i{
  color:#5f728e;
}
.family-info-edit{
  width:34px;
  min-width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #d7dee8;
  border-radius:10px;
  background:#fff;
  color:#49617f;
  text-decoration:none;
}
.family-info-edit:hover,
.family-info-edit:focus-visible{
  text-decoration:none;
  border-color:#b8c9dd;
  background:#f4f8fc;
}
.family-info-text{
  margin-top:6px;
  color:var(--muted);
  font-size:14px;
  line-height:1.4;
}
.family-info-form{
  margin-top:12px;
}
.family-info-textarea{
  min-height:180px;
}
.family-info-actions{
  margin-top:12px;
  display:flex;
  justify-content:flex-end;
}
@media (max-width: 768px){
  .family-card{
    grid-template-columns:1fr;
  }
  .family-card-link{
    grid-template-columns:56px minmax(0, 1fr);
  }
  .family-card-avatar{
    width:56px;
    height:56px;
    border-radius:16px;
  }
  .family-card-actions{
    justify-content:flex-end;
    margin-top:-42px;
  }
  .family-compose-actions{
    justify-content:flex-start;
  }
  .family-info-grid{
    grid-template-columns:1fr;
  }
  .family-info-actions{
    justify-content:flex-start;
  }
}
/* --- medicine module --- */
.medicine-page{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.medicine-search-form{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.med-search-inline{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.medicine-search-summary{
  border:1px solid #d8e7d3;
  border-radius:10px;
  background:#f6fbf4;
  padding:8px 10px;
  font-size:14px;
}
.med-grid-3{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.medicine-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.medicine-head{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.medicine-head-image img{
  width:100%;
  max-width:300px;
  height:auto;
  border-radius:12px;
  border:1px solid #d4e3ce;
}
.medicine-head-main{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.medicine-subline{
  color:var(--muted);
}
.medicine-quick-head{
  display:flex;
  align-items:center;
  gap:10px;
}
.medicine-quick-symbol{
  width:64px;
  height:64px;
  object-fit:cover;
  border-radius:12px;
  border:1px solid #d4e3ce;
  background:#fff;
}
.medicine-head-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.medicine-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.medicine-header-actions{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.medicine-row-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.btn.btn-mini{
  padding:8px 10px;
  font-size:14px;
}
.medicine-list-item{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
  color:var(--text);
  text-decoration:none;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.medicine-list-item:hover{
  background:#f3f9f1;
}
.medicine-list-title{
  font-weight:700;
  color:#193226;
  font-size:18px;
  line-height:1.25;
}
.medicine-list-meta{
  font-size:17px;
  color:#24382f;
  line-height:1.42;
}
.medicine-list-text{
  font-size:17px;
  color:#24382f;
  line-height:1.5;
}
.medicine-chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.inline-form{
  margin:0;
}
.medicine-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid #b8d2af;
  background:#f6fbf5;
  color:#2c5f1c;
  font-size:13px;
  text-decoration:none;
}
.medicine-chip:hover{
  background:#edf7ea;
}
.medicine-chip.is-active{
  border-color:#8fc28a;
  background:#e8f5e4;
  color:#214f27;
  font-weight:800;
}
.medicine-drug-row{
  border:1px solid #d6e5d1;
  border-radius:12px;
  background:#fff;
  padding:10px;
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.medicine-drug-main{
  text-decoration:none;
  color:var(--text);
}
.medicine-drug-title{
  font-weight:800;
  font-size:20px;
}
.medicine-drug-sub{
  margin-top:3px;
  color:var(--muted);
}
.medicine-drug-meta{
  margin-top:6px;
  font-size:13px;
  color:var(--muted);
}
.medicine-drug-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.medicine-stock-group + .medicine-stock-group{
  margin-top:16px;
}
.medicine-drugs-toolbar{
  margin:8px 0 18px;
  padding:14px 16px;
  border:1px solid #dbe7d4;
  border-radius:18px;
  background:linear-gradient(180deg, #f9fcf7 0%, #f3f8ef 100%);
  box-shadow:0 8px 18px rgba(55, 88, 34, .06);
}
.medicine-filter-form{
  margin:0;
}
.medicine-filter-grid{
  display:grid;
  grid-template-columns:minmax(240px, 1.4fr) minmax(220px, 1fr) auto;
  gap:14px;
  align-items:end;
}
.medicine-filter-field{
  min-width:0;
}
.medicine-filter-field .label{
  margin-bottom:6px;
}
.medicine-filter-actions{
  display:flex;
  gap:10px;
  align-items:flex-end;
  flex-wrap:wrap;
}
.medicine-filter-actions .btn{
  min-height:48px;
  padding-inline:18px;
}
.medicine-filter-summary{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.medicine-filter-count{
  font-size:15px;
  font-weight:800;
  color:#2b4d2f;
}
.medicine-filter-hint{
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  background:#e6f1df;
  color:#295c2a;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.medicine-category-pills{
  margin-top:12px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.medicine-category-legend{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
  gap:10px;
}
.medicine-category-legend-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid #dbe7d4;
  border-left-width:4px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 6px 14px rgba(62, 94, 44, .04);
}
.medicine-category-legend-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#eef6ea;
  color:#2f5c35;
  font-size:16px;
  flex:0 0 auto;
}
.medicine-category-legend-text{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.medicine-category-legend-text strong{
  font-size:14px;
  color:#274f2d;
}
.medicine-category-legend-text span{
  font-size:12px;
  color:#61745f;
}
.medicine-category-pill{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 14px;
  border:1px solid #d8e6d2;
  border-radius:999px;
  background:#fff;
  color:#325735;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  box-shadow:0 4px 10px rgba(62, 94, 44, .04);
}
.medicine-category-pill:hover{
  background:#f4f9ef;
}
.medicine-category-pill.is-active{
  border-color:#8fbf84;
  background:#e6f1df;
  color:#254d29;
}
.medicine-stock-group{
  border:1px solid #dbe7d4;
  border-radius:20px;
  background:linear-gradient(180deg, #fbfdf9 0%, #ffffff 100%);
  padding:12px;
  box-shadow:0 10px 22px rgba(62, 94, 44, .05);
  border-top:4px solid #cfe3c8;
}
.medicine-stock-group--analgesie{ border-top-color:#c97bbb; }
.medicine-stock-group--narkose{ border-top-color:#4ba76d; }
.medicine-stock-group--sedierung-und-antikonvulsion{ border-top-color:#e0a51f; }
.medicine-stock-group--herz--kreislauf{ border-top-color:#d35e5e; }
.medicine-stock-group--antidots{ border-top-color:#d88836; }
.medicine-stock-group--katecholamine{ border-top-color:#cf5a5a; }
.medicine-stock-group--atmung{ border-top-color:#4d7ecb; }
.medicine-stock-group--elektrolytloesungen{ border-top-color:#7f64c8; }
.medicine-stock-group--paediatrie{ border-top-color:#b1a321; }
.medicine-stock-group--sonstiges{ border-top-color:#9a6a48; }
.medicine-category-legend-item.medicine-stock-group--analgesie,
.medicine-stock-group--analgesie .medicine-stock-badge{ border-color:#ebc4e4; background:#f8edf5; color:#7e3d72; }
.medicine-category-legend-item.medicine-stock-group--narkose,
.medicine-stock-group--narkose .medicine-stock-badge{ border-color:#c4e5cf; background:#edf8f0; color:#2f6e47; }
.medicine-category-legend-item.medicine-stock-group--sedierung-und-antikonvulsion,
.medicine-stock-group--sedierung-und-antikonvulsion .medicine-stock-badge{ border-color:#f0dfb5; background:#fff7e8; color:#8b650e; }
.medicine-category-legend-item.medicine-stock-group--herz--kreislauf,
.medicine-stock-group--herz--kreislauf .medicine-stock-badge{ border-color:#efc7c7; background:#fff0f0; color:#9a3a3a; }
.medicine-category-legend-item.medicine-stock-group--antidots,
.medicine-stock-group--antidots .medicine-stock-badge{ border-color:#efd2b6; background:#fff4ea; color:#99571e; }
.medicine-category-legend-item.medicine-stock-group--katecholamine,
.medicine-stock-group--katecholamine .medicine-stock-badge{ border-color:#efc5c5; background:#fff1f1; color:#a13f3f; }
.medicine-category-legend-item.medicine-stock-group--atmung,
.medicine-stock-group--atmung .medicine-stock-badge{ border-color:#cad9f3; background:#eef4ff; color:#365eaa; }
.medicine-category-legend-item.medicine-stock-group--elektrolytloesungen,
.medicine-stock-group--elektrolytloesungen .medicine-stock-badge{ border-color:#dbd0f0; background:#f4effd; color:#6347a8; }
.medicine-category-legend-item.medicine-stock-group--paediatrie,
.medicine-stock-group--paediatrie .medicine-stock-badge{ border-color:#ebe5b7; background:#fbfaea; color:#817516; }
.medicine-category-legend-item.medicine-stock-group--sonstiges,
.medicine-stock-group--sonstiges .medicine-stock-badge{ border-color:#e5d5c8; background:#f9f1eb; color:#7d563b; }
.medicine-stock-group-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.medicine-stock-title{
  margin:0;
  font-size:26px;
  line-height:1.05;
  color:#274f2d;
  display:flex;
  align-items:center;
  gap:10px;
}
.medicine-stock-title i{
  width:34px;
  height:34px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#eef6ea;
  color:#2f5c35;
  font-size:16px;
  flex:0 0 auto;
}
.medicine-stock-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  height:38px;
  padding:0 12px;
  border-radius:999px;
  background:#e5f2dd;
  color:#295c2a;
  font-size:14px;
  font-weight:900;
}
.medicine-stock-wrap{
  overflow-x:auto;
  border:1px solid #dbe7d4;
  border-radius:16px;
  background:#fff;
}
.medicine-stock-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:780px;
}
.medicine-stock-table th,
.medicine-stock-table td{
  padding:12px 14px;
  border-right:1px solid #e0ebda;
  border-bottom:1px solid #e0ebda;
  vertical-align:middle;
  text-align:left;
}
.medicine-stock-table th{
  position:sticky;
  top:0;
  z-index:1;
  background:#f2f7ee;
  font-size:13px;
  font-weight:900;
  color:#355a36;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.medicine-stock-table td{
  background:#fff;
  font-size:16px;
}
.medicine-stock-table tr:last-child td{
  border-bottom:none;
}
.medicine-stock-table th:last-child,
.medicine-stock-table td:last-child{
  border-right:none;
}
.medicine-stock-table tbody tr:nth-child(even) td{
  background:#fcfefb;
}
.medicine-stock-table tbody tr:hover td{
  background:#f4f9ef;
}
.medicine-stock-row.is-group-start td{
  background:#fbfdf9;
}
.medicine-stock-row.is-group-continued td{
  background:#fdfefc;
}
.medicine-stock-link{
  color:var(--text);
  text-decoration:none;
  font-weight:700;
  font-size:17px;
}
.medicine-stock-continuation{
  display:inline-block;
  color:#6b7e69;
  font-size:13px;
  font-weight:700;
  line-height:1.35;
}
.medicine-stock-pills{
  margin-top:6px;
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.medicine-stock-pill{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:0 8px;
  border-radius:999px;
  background:#edf5e8;
  color:#355a36;
  font-size:11px;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.medicine-stock-pill--accent{
  background:#fff2da;
  color:#8a5b08;
}
.medicine-stock-link:hover{
  text-decoration:underline;
}
.medicine-stock-actions{
  white-space:nowrap;
  width:1%;
  text-align:right;
}
.medicine-stock-actions .btn{
  min-width:48px;
  min-height:46px;
}
.medicine-check-grid{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.medicine-kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px,1fr));
  gap:8px;
}
.medicine-kpi{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
  padding:8px 10px;
}
.medicine-kpi-label{
  font-size:12px;
  color:var(--muted);
}
.medicine-kpi-val{
  font-size:16px;
  font-weight:700;
}
.medicine-bullets{
  margin:0;
  padding-left:18px;
}
.medicine-box-ind{
  border-color:#cbe0c0;
  background:#f3faef;
}
.medicine-box-red{
  border-color:#efc7c7;
  background:#fff4f4;
}
.medicine-box-yellow{
  border-color:#eadfb0;
  background:#fffdf2;
}
.medicine-grid-quick{
  grid-template-columns:1fr;
}
.medicine-quick-block{
  padding:10px;
}
.medicine-text{
  line-height:1.55;
  color:#192d23;
}
.medicine-text-strong{
  font-size:18px;
  line-height:1.55;
  color:#15251d;
}
.medicine-cases{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.medicine-case{
  border:1px solid #d5e4d0;
  border-radius:10px;
  background:#fbfdfb;
  padding:8px 10px;
}
.medicine-case-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
}
.medicine-image-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(210px,1fr));
  gap:8px;
}
.medicine-image-card{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
  padding:8px;
  margin:0;
}
.medicine-image-card img{
  width:100%;
  border-radius:8px;
  border:1px solid #dde9d8;
}
.medicine-image-card figcaption{
  margin-top:6px;
  color:var(--muted);
  font-size:13px;
}
.medicine-image-item{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
  padding:8px;
}
.medicine-image-item img{
  width:100%;
  border-radius:8px;
  border:1px solid #dde9d8;
}
.medicine-image-card img,
.medicine-image-item img{
  display:block;
  height:auto;
}
.medicine-image-meta{
  margin-top:6px;
  font-size:13px;
  color:var(--muted);
}
.medicine-image-actions{
  margin-top:6px;
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.medicine-collapsible{
  border:1px solid #d6e5d1;
  border-radius:14px;
  background:#f8fcf7;
}
.medicine-collapsible + .medicine-collapsible{
  margin-top:12px;
}
.medicine-collapsible-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  cursor:pointer;
  padding:12px 14px;
  font-weight:700;
  color:#1e4f2f;
}
.medicine-collapsible-summary::-webkit-details-marker{
  display:none;
}
.medicine-collapsible-summary::after{
  content:"▾";
  font-size:13px;
  opacity:.75;
}
.medicine-collapsible[open] .medicine-collapsible-summary::after{
  content:"▴";
}
.medicine-collapsible-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:30px;
  height:30px;
  padding:0 8px;
  border-radius:999px;
  background:#e4f1de;
  border:1px solid #cfe4c8;
  color:#234f2e;
  font-size:13px;
}
.medicine-collapsible-card{
  border:0;
  border-top:1px solid #dce9d7;
  border-radius:0 0 14px 14px;
  box-shadow:none;
  margin:0;
}
.medicine-quick-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.medicine-quick-inline{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.medicine-anchor-links{
  margin-top:8px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.medicine-nextsteps{
  border:1px solid #dbe9d5;
  border-radius:12px;
  background:#f7fbf5;
  padding:10px 12px;
}
.medicine-nextsteps.is-complete{
  border-color:#cae2bf;
  background:#edf8e7;
}
.medicine-nextsteps-title{
  font-weight:700;
  color:#2a5b2c;
  margin-bottom:8px;
}
.medicine-chip-next{
  border-color:#cfe2c8;
  background:#ffffff;
}
.medicine-summary-card{
  border-color:#b7d2b5;
  box-shadow:0 8px 22px rgba(33, 74, 48, .08);
}
.medicine-summary-card > h2:first-child{
  border-bottom-color:#b8d6b8;
  background:linear-gradient(135deg, rgba(24, 79, 49, 0.25) 0%, rgba(24, 79, 49, 0.08) 100%);
}
.medicine-summary-flow{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.medicine-summary-item{
  border-left:4px solid #3a7f4f;
  border-radius:10px;
  background:#f5faf5;
  padding:12px 14px;
}
.medicine-summary-title{
  font-size:15px;
  font-weight:900;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:#1f5531;
}
.medicine-summary-value{
  margin-top:4px;
  font-size:18px;
  color:#172c21;
  line-height:1.5;
}
.medicine-summary-drugs{
  margin:8px 0 0;
  padding-left:18px;
}
.medicine-summary-drugs li{
  color:#172c21;
  font-size:18px;
  line-height:1.5;
  margin:6px 0;
}
.medicine-summary-drugs li span{
  display:block;
  font-size:16px;
  color:#284237;
}
.medicine-contra-text{
  color:#a22222 !important;
  font-weight:700;
}
.medicine-alert-card{
  border:2px solid #d98e8e;
  background:#fff4f4;
  box-shadow:0 8px 20px rgba(172, 40, 40, .09);
}
.medicine-alert-card > h2:first-child{
  border-bottom-color:#efc0c0;
  background:linear-gradient(135deg, rgba(168, 33, 33, .2) 0%, rgba(168, 33, 33, .04) 100%);
  color:#732121;
}
.medicine-alert-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.medicine-alert-item{
  border:1px solid #e9b7b7;
  border-radius:10px;
  padding:10px 12px;
  background:#fffafa;
}
.medicine-alert-item-title{
  font-size:15px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.03em;
  color:#7b2323;
}
.medicine-alert-item .medicine-bullets{
  margin-top:6px;
}
.medicine-alert-item .medicine-bullets li{
  font-size:17px;
  color:#431414;
  line-height:1.45;
}
.medicine-pathophysiology-card{
  border-color:#d7e4d1;
}
.medicine-pathophysiology-short{
  font-size:18px;
  line-height:1.55;
  color:#15251d;
}
.medicine-pathophysiology-long{
  margin-top:10px;
  padding-top:10px;
  border-top:1px dashed #cfdcca;
  font-size:15px;
  line-height:1.5;
  color:#345043;
}
.medicine-image-item-compact{
  max-width:180px;
}
.medicine-image-grid-compact{
  grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
}
.medicine-image-grid-compact .medicine-image-item img{
  aspect-ratio:4 / 3;
  object-fit:cover;
}
.medicine-image-type-badge{
  margin-top:6px;
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 8px;
  border-radius:999px;
  background:#e9f3e5;
  border:1px solid #c7ddbf;
  color:#28572d;
  font-size:11px;
  font-weight:900;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.medicine-structure-warning{
  border-color:#e0d3a5;
  background:#fffdf4;
}
.medicine-structure-warning > h2:first-child{
  border-bottom-color:#eadcaf;
  background:linear-gradient(135deg, rgba(171, 132, 34, .2) 0%, rgba(171, 132, 34, .04) 100%);
  color:#73571a;
}
.medicine-card-core{
  border-color:#bfd8bc;
  background:#fbfef9;
}
.medicine-card-core > h2:first-child{
  border-bottom-color:#cbe2c7;
  background:linear-gradient(135deg, rgba(35, 104, 56, .2) 0%, rgba(35, 104, 56, .05) 100%);
}
.medicine-card-check{
  border-color:#c8d6e8;
  background:#fbfdff;
}
.medicine-card-check > h2:first-child{
  border-bottom-color:#d3deec;
  background:linear-gradient(135deg, rgba(48, 92, 148, .19) 0%, rgba(48, 92, 148, .05) 100%);
}
.medicine-card-therapy{
  border-color:#d6c7e8;
  background:#fefcff;
}
.medicine-card-therapy > h2:first-child{
  border-bottom-color:#e1d5ef;
  background:linear-gradient(135deg, rgba(98, 73, 157, .2) 0%, rgba(98, 73, 157, .05) 100%);
}
.medicine-card-tip{
  border-color:#d8d6b7;
  background:#fffef6;
}
.medicine-card-tip > h2:first-child{
  border-bottom-color:#e3dfc0;
  background:linear-gradient(135deg, rgba(140, 116, 37, .2) 0%, rgba(140, 116, 37, .05) 100%);
}
.medicine-card-background{
  border-color:#d4ddd1;
  background:#fcfdfc;
}
.medicine-card-background > h2:first-child{
  border-bottom-color:#dde5da;
  background:linear-gradient(135deg, rgba(76, 98, 81, .18) 0%, rgba(76, 98, 81, .04) 100%);
}
.medicine-bullets-spaced{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.medicine-bullets-spaced li{
  line-height:1.5;
}
.medicine-doc-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.medicine-doc-card{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
}
.medicine-doc-link{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:inherit;
  padding:10px;
}
.medicine-doc-thumb{
  width:42px;
  height:42px;
  border-radius:10px;
  border:1px solid #efc8c8;
  background:#fff1f1;
  color:#b32d2d;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  flex:0 0 auto;
}
.medicine-doc-main{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.medicine-doc-main strong{
  color:#1b3427;
  font-size:16px;
}
.medicine-doc-main span{
  color:#466054;
  font-size:13px;
}
@media (min-width:1100px){
  .medicine-page{
    gap:16px;
  }
  .medicine-summary-card{
    box-shadow:0 12px 28px rgba(33, 74, 48, .1);
  }
  .medicine-summary-item{
    padding:14px 16px;
  }
  .medicine-summary-value{
    font-size:19px;
  }
  .medicine-summary-drugs li{
    font-size:19px;
  }
  .medicine-grid{
    gap:14px;
    align-items:start;
  }
  .medicine-image-grid{
    grid-template-columns:repeat(auto-fill, minmax(180px, 180px));
    justify-content:flex-start;
    gap:10px;
  }
  .medicine-image-grid-compact{
    grid-template-columns:repeat(auto-fill, minmax(140px, 140px));
  }
  .medicine-image-card,
  .medicine-image-item{
    max-width:180px;
  }
  .medicine-image-item-compact{
    max-width:140px;
  }
  .medicine-image-card img,
  .medicine-image-item img{
    aspect-ratio:4 / 3;
    object-fit:cover;
  }
  .medicine-pathophysiology-short{
    font-size:20px;
  }
  .medicine-pathophysiology-long{
    font-size:16px;
    max-width:110ch;
  }
}
@media (min-width: 900px){
  .medicine-quick-inline{
    grid-template-columns:1fr 180px;
  }
  .medicine-alert-grid{
    grid-template-columns:1fr 1fr;
  }
  .medicine-full-width-card{
    grid-column:1 / -1;
  }
  .medicine-doc-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}
.medicine-comments{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.medicine-comment{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fff;
  padding:8px 10px;
}
.medicine-comment-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:4px;
}
.medicine-comment.is-deleted{
  opacity:.65;
}
.medicine-comment-head{
  color:var(--muted);
  font-size:13px;
}
.medicine-hit{
  background:#fff4b8;
  color:#3b2f00;
  padding:0 2px;
  border-radius:3px;
}
.medicine-wiki-layout{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.medicine-wiki-main{
  min-width:0;
}
.medicine-wiki-toc{
  position:static;
  top:unset;
  align-self:start;
}
.medicine-wiki-toc h2{
  margin-bottom:8px;
}
.medicine-wiki-toc a{
  display:block;
  padding:6px 8px;
  border-radius:8px;
  color:#2b6519;
  text-decoration:none;
  font-weight:600;
}
.medicine-wiki-toc a:hover{
  background:#f0f8ec;
}
.medicine-wiki-toc a.is-active{
  background:#2b6519;
  color:#fff;
}
.medicine-wiki-hero{
  background:linear-gradient(180deg, #f9fcf8 0%, #ffffff 100%);
}
.medicine-attachment-card{
  background:#ffffff;
  border-color:#d2e2cc;
}
.medicine-attachment-row{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
  padding:8px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.medicine-history-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.medicine-history-item{
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
  padding:8px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.pill.pill-red{
  background:#fff1f1;
  border-color:#f2c3c3;
  color:#9a2525;
}
.medicine-catalog-inline-form{
  display:grid;
  grid-template-columns:minmax(180px, 1fr) 140px auto;
  gap:8px;
  align-items:end;
}
.medicine-catalog-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.medicine-catalog-item{
  display:grid;
  grid-template-columns:minmax(180px, 1fr) 130px auto auto;
  gap:8px;
  align-items:center;
  border:1px solid #d6e5d1;
  border-radius:10px;
  background:#fbfdfb;
  padding:8px;
}
.self-end{
  align-self:end;
}
@media (max-width:760px){
  .medicine-drugs-toolbar{
    padding:12px;
    border-radius:16px;
  }
  .medicine-filter-grid{
    grid-template-columns:1fr;
  }
  .medicine-filter-actions{
    width:100%;
  }
  .medicine-filter-actions .btn{
    flex:1 1 0;
    justify-content:center;
  }
  .medicine-category-pills{
    gap:6px;
  }
  .medicine-category-legend{
    grid-template-columns:1fr;
  }
  .medicine-category-pill{
    min-height:34px;
    padding:0 12px;
    font-size:13px;
  }
  .medicine-stock-group{
    padding:10px;
    border-radius:16px;
  }
  .medicine-stock-group-head{
    align-items:flex-start;
  }
  .medicine-stock-title{
    font-size:24px;
  }
  .medicine-stock-wrap{
    overflow:visible;
    border:none;
    background:transparent;
  }
  .medicine-stock-table{
    min-width:0;
    border-spacing:0 10px;
  }
  .medicine-stock-table thead{
    display:none;
  }
  .medicine-stock-table,
  .medicine-stock-table tbody,
  .medicine-stock-table tr,
  .medicine-stock-table td{
    display:block;
    width:100%;
  }
  .medicine-stock-table tr{
    border:1px solid #dbe7d4;
    border-radius:16px;
    background:#fff;
    box-shadow:0 8px 18px rgba(62, 94, 44, .05);
    overflow:hidden;
  }
  .medicine-stock-table td{
    padding:10px 12px;
    border-right:none;
    border-bottom:1px solid #e6efe0;
    text-align:left;
  }
  .medicine-stock-table td:last-child{
    border-bottom:none;
  }
  .medicine-stock-table td::before{
    content:attr(data-label);
    display:block;
    margin-bottom:4px;
    color:#5d735d;
    font-size:11px;
    font-weight:800;
    letter-spacing:.03em;
    text-transform:uppercase;
  }
  .medicine-stock-table td[data-label="Handelsname"]{
    padding-top:12px;
    background:#f8fbf6;
  }
  .medicine-stock-table td[data-label="Handelsname"]::before{
    color:#6a8169;
  }
  .medicine-stock-table td[data-label="Aktionen"]{
    background:#fbfdf9;
  }
  .medicine-stock-actions{
    display:flex;
    gap:8px;
    justify-content:flex-start;
    width:auto;
    white-space:normal;
    text-align:left;
  }
  .medicine-stock-pills{
    margin-top:5px;
  }
  .medicine-catalog-inline-form{
    grid-template-columns:1fr;
  }
  .medicine-catalog-item{
    grid-template-columns:1fr 120px;
  }
  .medicine-quick-symbol{
    width:52px;
    height:52px;
  }
  .medicine-quick-title{
    font-size:24px;
  }
}
.medicine-quick-title{
  font-size:28px;
  font-weight:800;
}
.medicine-print-toolbar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.medicine-print-card{
  border:1px solid #d5e4d0;
  border-radius:12px;
  background:#fff;
  padding:12px;
}
.medicine-print-case{
  margin:5px 0;
}
.medicine-print-hint{
  border:1px solid #ecd7aa;
  border-radius:10px;
  background:#fff9ea;
  padding:8px 10px;
}
.medicine-print-compact .medicine-print-card{
  padding:10px;
}
.medicine-print-compact .medicine-print-card ul{
  margin:6px 0 10px;
}
.medicine-print-compact .medicine-print-case{
  margin:3px 0;
}
@media print{
  .medicine-print-toolbar,
  .header,
  .footer-fav{
    display:none !important;
  }
  .medicine-print{
    margin:0;
    padding:0;
  }
  .medicine-print .card{
    border:0;
    box-shadow:none;
    margin:0;
    padding:0;
  }
  .medicine-print-compact .medicine-print-card{
    font-size:13px;
    line-height:1.35;
  }
  .medicine-print-compact .medicine-print-card h3{
    margin-bottom:4px;
    font-size:20px;
  }
}
@media (min-width:900px){
  .medicine-wiki-layout{
    grid-template-columns:260px minmax(0,1fr);
  }
  .medicine-wiki-toc{
    position:sticky;
    top:120px;
  }
  .medicine-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
  .medicine-head{
    grid-template-columns:minmax(220px, 300px) 1fr;
    align-items:start;
  }
  .medicine-drug-row{
    grid-template-columns:1fr auto;
    align-items:center;
  }
  .medicine-stock-table{
    min-width:0;
  }
  .med-grid-3{
    grid-template-columns:repeat(3, minmax(0,1fr));
  }
  .med-search-inline{
    grid-template-columns:minmax(220px, 1fr) auto auto;
    align-items:end;
  }
}


/* Calendar month-grid print hard overrides (late to beat mobile/tablet rules) */
@media print{
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .card{
    display: block !important;
    min-height: 0 !important;
    height: auto !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-grid{
    display: grid !important;
    grid-template-rows: auto repeat(6, minmax(0, 1fr)) !important;
    width: 100% !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    scrollbar-width: none !important;
    gap: 4px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-grid::-webkit-scrollbar{
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-grid > .cal-weekdays,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-grid > .cal-row{
    min-width: 0 !important;
    width: 100% !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-row{
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 4px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell{
    min-height: 0 !important;
    height: auto !important;
    padding: 3px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-weekdays{
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    gap: 4px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-weekdays span{
    font-size: 10px !important;
    line-height: 1.1 !important;
    padding: 0 !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell-head{
    margin-bottom: 2px !important;
    font-size: 10px !important;
    line-height: 1.05 !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-day-link{
    font-size: 10px !important;
    line-height: 1.05 !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-dot,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-duty-grid-line,
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-duty-grid-time{
    font-size: 9px !important;
    line-height: 1.08 !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell .cal-badge{
    font-size: 9px !important;
    min-height: 13px !important;
    padding: 0 5px !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page .cal-cell-more{
    font-size: 9px !important;
    line-height: 1.05 !important;
  }

  /* Feste Druckhöhe je Orientierung: gute Flächennutzung ohne zweite Seite */
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-landscape .cal-grid{
    height: 170mm !important;
  }
  body[data-current-m="calendar"][data-current-v="month_grid"] .calendar-print-page.calendar-print-portrait .cal-grid{
    height: 252mm !important;
  }
}



/* Fuel / Tanken */
.fuel-page .card{
  margin-bottom:12px;
}
.fuel-overall-card{
  border:1px solid #d7e6d0;
  background:linear-gradient(180deg,#fcfffa,#f4faf0);
}
.fuel-overall-card.is-now{
  border-color:#58a96a;
  background:linear-gradient(180deg,#f1fcf4,#def4e5);
  box-shadow:0 8px 22px rgba(43, 114, 59, 0.10);
}
.fuel-overall-card.is-wait{
  border-color:#d39a45;
  background:linear-gradient(180deg,#fffaf2,#ffeccf);
  box-shadow:0 8px 22px rgba(160, 104, 19, 0.10);
}
.fuel-overall-title{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:22px;
  font-weight:800;
  color:#244922;
}
.fuel-overall-title-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  flex:0 0 12px;
  background:#2d8a45;
  box-shadow:0 0 0 4px rgba(255,255,255,0.72);
}
.fuel-overall-card.is-wait .fuel-overall-title{
  color:#8a531b;
}
.fuel-overall-card.is-wait .fuel-overall-title-dot{
  background:#c97615;
}
.fuel-overall-window,
.fuel-overall-summary,
.fuel-station-summary,
.fuel-chart-note{
  margin-top:8px;
  color:#526250;
  font-size:14px;
}
.fuel-station-summary{
  margin-bottom:10px;
}
.fuel-fav-card{
  border-color:#cfe2c6;
  background:linear-gradient(180deg,#ffffff,#f6fbf3);
}
.fuel-station-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:8px;
}
.fuel-pill{
  display:inline-flex;
  align-items:center;
  gap:4px;
  border:1px solid #d7e6d0;
  background:#ffffff;
  border-radius:999px;
  padding:5px 10px;
  font-size:13px;
  color:#274525;
}
.fuel-pill.is-open{
  border-color:#77c08b;
  background:#ebfaef;
  color:#1f6d34;
}
.fuel-pill.is-closed{
  border-color:#e0c1c1;
  background:#fff3f3;
  color:#7f2f2f;
}
.fuel-pill.is-closing_soon{
  border-color:#f0c37d;
  background:#fff7ea;
  color:#9b5a12;
}
.fuel-pill-rec.is-now{
  border-color:#58a96a;
  background:linear-gradient(180deg,#effcf2,#def4e5);
  color:#155d2a;
}
.fuel-pill-rec.is-wait{
  border-color:#d39a45;
  background:linear-gradient(180deg,#fffaf2,#ffe9c8);
  color:#8a4a06;
}
.fuel-pill-rec-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  flex:0 0 8px;
  background:#8fa990;
}
.fuel-pill-rec.is-now .fuel-pill-rec-dot{
  background:#248a41;
}
.fuel-pill-rec.is-wait .fuel-pill-rec-dot{
  background:#c96f10;
}
.fuel-chart-wrap{
  border:1px solid #d8e6d2;
  border-radius:12px;
  overflow:hidden;
  background:#f9fcf7;
  padding:8px;
}
.fuel-market-card{
  border-color:#e6d6bf;
  background:linear-gradient(180deg,#fffdf9,#fff8ef);
}
.fuel-market-range-switch{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:2px 0 10px 0;
}
.fuel-market-range-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid #dcc8aa;
  color:#805529;
  background:#fff9f0;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
}
.fuel-market-range-link:hover{
  background:#fff2de;
  border-color:#cfaf82;
}
.fuel-market-range-link.is-active{
  background:#f2d9b7;
  border-color:#bf8b4a;
  color:#673c14;
}
.fuel-chart-wrap-market{
  border-color:#ead7bc;
  background:#fffaf2;
}
.fuel-chart-canvas{
  width:100%;
  height:240px;
  display:block;
}
.fuel-admin-add,
.fuel-admin-edit{
  border:1px dashed #cfe2c6;
  background:#fbfef9;
}
.fuel-market-freshness{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  border:1px solid #d7e6d0;
  border-radius:999px;
  padding:6px 12px;
  margin:2px 0 10px 0;
  font-size:13px;
  background:#ffffff;
  color:#2d4f2a;
}
.fuel-market-freshness-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#7a8a79;
  flex:0 0 9px;
}
.fuel-market-freshness-hint{
  color:#586a56;
}
.fuel-market-freshness-age{
  color:#4f6350;
  font-weight:600;
}
.fuel-market-freshness.is-fresh{
  border-color:#6fbe84;
  background:#effaf2;
  color:#1f6a35;
}
.fuel-market-freshness.is-fresh .fuel-market-freshness-dot{
  background:#2f9d4f;
}
.fuel-market-freshness.is-warning{
  border-color:#e7be7f;
  background:#fff7e8;
  color:#8a5618;
}
.fuel-market-freshness.is-warning .fuel-market-freshness-dot{
  background:#d08a2f;
}
.fuel-market-freshness.is-stale{
  border-color:#e2b4b4;
  background:#fff1f1;
  color:#8d2f2f;
}
.fuel-market-freshness.is-stale .fuel-market-freshness-dot{
  background:#c74a4a;
}
.admin-settings-card h2 i{
  margin-right:8px;
  color:#356d2c;
}
.admin-settings-filter-summary{
  color:#4c5a4b;
  font-size:14px;
}
.admin-settings-field{
  border-top:1px dashed #dbe6d6;
  padding-top:12px;
}
.admin-settings-field:first-of-type{
  border-top:0;
  padding-top:0;
}
.admin-settings-color-row{
  display:flex;
  align-items:center;
  gap:12px;
}
.admin-settings-color-row .input{
  flex:1 1 auto;
}
.admin-settings-color-preview{
  width:42px;
  height:42px;
  flex:0 0 42px;
  border-radius:12px;
  border:1px solid #cfe2c6;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.5);
  background:transparent;
}
.admin-settings-color-preview.is-empty{
  background:
    linear-gradient(45deg, #eef3ea 25%, transparent 25%, transparent 50%, #eef3ea 50%, #eef3ea 75%, transparent 75%, transparent),
    #ffffff;
  background-size:14px 14px;
}
@media (max-width: 700px){
  .fuel-pill{
    font-size:12px;
    padding:5px 9px;
  }
  .fuel-chart-canvas{
    height:200px;
  }
  .admin-settings-card h2{
    font-size:28px;
  }
  .admin-settings-color-row{
    gap:10px;
  }
  .admin-settings-color-preview{
    width:38px;
    height:38px;
    flex-basis:38px;
  }
}