/* 168 Stunden 0.16.0 - fully scoped; inherits the site's font, no external assets. */
.stunden168-host { width:100%; min-width:0; position:relative; }
.stunden168-wrap {
  --s168-accent:#365f68;
  --s168-accent-dark:#264952;
  --s168-soft:#edf3f3;
  --s168-sand:#f7f5f0;
  --s168-border:#d7e0df;
  --s168-text:#283e43;
  --s168-muted:#576b70;
  --s168-danger:#a93630;
  --s168-danger-soft:#fff3f0;
  width:100%; max-width:none; min-width:0; position:relative;
  margin:24px 0; color:var(--s168-text); font-family:inherit;
  font-size:16px; font-weight:400; line-height:1.5; text-align:left;
  container:stunden168 / inline-size;
  -webkit-text-size-adjust:100%;
}
.stunden168-wrap *, .stunden168-wrap *::before, .stunden168-wrap *::after { box-sizing:border-box; }
.stunden168-wrap [hidden] { display:none !important; }
.stunden168-wrap p { margin:0; color:inherit; font-size:inherit; }
.stunden168-wrap button,
.stunden168-wrap input,
.stunden168-wrap select,
.stunden168-wrap textarea { font-family:inherit !important; letter-spacing:normal; text-transform:none !important; }
.stunden168-wrap button { box-shadow:none !important; background-image:none !important; }
.stunden168-wrap button::before,.stunden168-wrap button::after { content:none; }
.stunden168-wrap button { touch-action:manipulation; }
.stunden168-wrap :focus-visible { outline:3px solid var(--s168-accent); outline-offset:3px; }
.stunden168-wrap .stunden168-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:44px; width:auto; height:auto; max-width:100%;
  margin:0 !important; padding:10px 16px !important; border:1px solid transparent;
  border-radius:7px; font-size:14px; font-weight:600; line-height:1.35;
  text-decoration:none; cursor:pointer; white-space:normal;
  transition:background-color .15s,border-color .15s;
}
.stunden168-wrap .stunden168-btn-primary { color:#fff; background:var(--s168-accent); border-color:var(--s168-accent); }
.stunden168-wrap .stunden168-btn-primary:hover { background:var(--s168-accent-dark); border-color:var(--s168-accent-dark); }
.stunden168-wrap .stunden168-btn-secondary { color:var(--s168-accent-dark); background:#fff; border-color:var(--s168-border); }
.stunden168-wrap .stunden168-btn-secondary:hover { background:var(--s168-soft); border-color:var(--s168-accent); }
.stunden168-wrap .stunden168-btn-ghost { background:transparent; color:var(--s168-accent-dark); }
.stunden168-wrap .stunden168-btn-ghost:hover { background:var(--s168-soft); }
.stunden168-wrap .stunden168-text-btn {
  display:inline; margin:0 !important; padding:6px 0 !important; min-height:36px;
  background:transparent; color:var(--s168-muted); border:0; border-radius:0;
  font-size:13px; line-height:1.4; font-weight:400; text-decoration:underline; cursor:pointer;
}
.stunden168-wrap .stunden168-text-btn:hover { color:var(--s168-danger); }
.stunden168-wrap .stunden168-steps {
  display:flex; align-items:stretch; gap:6px; padding:7px; border:1px solid var(--s168-border);
  border-radius:11px; background:var(--s168-sand); margin:0 0 14px;
}
.stunden168-wrap .stunden168-step {
  display:flex; align-items:center; justify-content:flex-start; gap:10px; flex:1 1 0;
  margin:0 !important; padding:12px 14px !important; min-height:50px;
  min-width:0; border:1px solid transparent; border-radius:7px;
  background:transparent; color:var(--s168-muted); font-size:14px; line-height:1.3; font-weight:500;
  cursor:pointer; text-align:left;
}
.stunden168-wrap .stunden168-step[aria-pressed="true"] { background:#fff; color:var(--s168-accent-dark); border-color:var(--s168-border); font-weight:700; }
.stunden168-wrap .stunden168-step:hover { color:var(--s168-accent-dark); background:#fff; }
.stunden168-wrap .stunden168-step-number { display:grid; place-items:center; flex:0 0 28px; width:28px; height:28px; border:1px solid var(--s168-border); border-radius:50%; font-size:13px; background:#fff; }
.stunden168-wrap .stunden168-step[aria-pressed="true"] .stunden168-step-number { color:#fff; background:var(--s168-accent); border-color:var(--s168-accent); }
.stunden168-wrap .stunden168-step-overview { flex:0 0 auto; justify-content:center; }
.stunden168-wrap .stunden168-stage-note { font-size:14px; color:var(--s168-muted); margin:0 0 18px; }
.stunden168-wrap .stunden168-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:0 0 16px; outline:none; }
.stunden168-wrap .stunden168-summary-card { border:1px solid var(--s168-border); border-top:3px solid var(--s168-accent); border-radius:10px; padding:20px 24px 16px; background:#fff; min-width:0; }
.stunden168-wrap .stunden168-summary-wish { background:var(--s168-sand); border-top-color:#ac9979; }
.stunden168-wrap .stunden168-summary-label { display:block; font-size:14px; font-weight:600; color:var(--s168-muted); }
.stunden168-wrap .stunden168-summary-card strong { display:block; font-size:36px; line-height:1.25; margin:7px 0; font-weight:600; color:var(--s168-text); font-variant-numeric:tabular-nums; }
.stunden168-wrap .stunden168-summary-card small { font-size:18px; font-weight:400; color:var(--s168-muted); }
.stunden168-wrap .stunden168-summary-note { display:block; color:var(--s168-muted); font-size:14px; line-height:1.4; }
.stunden168-wrap .stunden168-progress { height:6px; border-radius:8px; background:#e4eae8; overflow:hidden; margin:15px 0 8px; }
.stunden168-wrap .stunden168-progress span { display:block; height:100%; width:0; background:var(--s168-accent); border-radius:8px; transition:width .15s ease; }
.stunden168-wrap .stunden168-completeness { display:block; color:var(--s168-muted); font-size:12px; line-height:1.4; }
.stunden168-wrap .stunden168-summary-card.is-over { background:var(--s168-danger-soft); border-color:#dcaeaa; border-top-color:var(--s168-danger); }
.stunden168-wrap .stunden168-summary-card.is-over strong,
.stunden168-wrap .stunden168-summary-card.is-over .stunden168-summary-note { color:var(--s168-danger); }
.stunden168-wrap .stunden168-summary-card.is-over .stunden168-progress span { background:var(--s168-danger); }
.stunden168-wrap .stunden168-validation-note { margin:0 0 12px; padding:10px 14px; background:var(--s168-danger-soft); border-left:3px solid var(--s168-danger); font-size:14px; color:var(--s168-danger); }
.stunden168-wrap .stunden168-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin:20px 0 10px; }
.stunden168-wrap .stunden168-copy-line { display:flex; align-items:center; gap:10px; margin:0 0 10px; flex-wrap:wrap; font-size:13px; color:var(--s168-muted); }
.stunden168-wrap .stunden168-help { margin:0 0 24px; font-size:13px; color:var(--s168-muted); }
.stunden168-wrap .stunden168-help summary { display:list-item; cursor:pointer; padding:6px 0; min-height:32px; font-weight:500; }
.stunden168-wrap .stunden168-help p { margin:8px 0; max-width:900px; font-size:13px; line-height:1.6; }
.stunden168-wrap .stunden168-category { border:1px solid var(--s168-border); border-radius:10px; margin:0 0 22px; overflow:hidden; background:#fff; min-width:0; }
.stunden168-wrap .stunden168-category-head { display:flex; align-items:center; gap:12px; padding:14px 18px; background:var(--s168-soft); }
.stunden168-wrap .stunden168-category-number { color:var(--s168-accent); opacity:.75; font-size:13px; font-weight:600; align-self:center; font-variant-numeric:tabular-nums; }
.stunden168-wrap .stunden168-category-name { display:block; flex:1 1 auto; min-width:0; margin:0; }
.stunden168-wrap .stunden168-category-title { display:block; width:100%; min-width:0; max-width:100%; height:40px !important; margin:0 !important; padding:4px 6px !important; border:1px solid transparent !important; border-radius:5px; background:transparent !important; background-image:none !important; box-shadow:none !important; color:var(--s168-text); font-size:18px !important; line-height:1.4 !important; font-weight:600; }
.stunden168-wrap .stunden168-category-title:focus { background:#fff !important; border-color:var(--s168-accent) !important; outline:none; }
.stunden168-wrap .stunden168-category-total { color:var(--s168-muted); font-size:12px; white-space:nowrap; }
.stunden168-wrap .stunden168-table { width:100%; min-width:0; }
.stunden168-wrap .stunden168-row {
  display:grid; grid-template-columns:minmax(200px,1.8fr) 142px 98px 98px minmax(180px,1.5fr) 32px;
  gap:12px; align-items:start; padding:18px; border-top:1px solid #e5eae7; min-width:0;
  background:#fff;
}
.stunden168-wrap .stunden168-row:nth-child(even) { background:var(--s168-sand); }
.stunden168-wrap .stunden168-cell { min-width:0; max-width:100%; margin:0 !important; padding:0 !important; }
.stunden168-wrap .stunden168-cell-label { display:block; color:var(--s168-muted); font-size:12px !important; font-weight:500; line-height:16px !important; margin:0 0 6px !important; padding:0 !important; text-transform:none; letter-spacing:0; }
.stunden168-wrap .stunden168-timing-field { display:grid; gap:10px; min-width:0; }
.stunden168-wrap .stunden168-row input,
.stunden168-wrap .stunden168-row select,
.stunden168-wrap .stunden168-row textarea {
  display:block; width:100%; min-width:0; max-width:100%; height:46px !important; min-height:46px;
  margin:0 !important; padding:10px 11px !important; border:1px solid var(--s168-border) !important;
  border-radius:6px !important; font-size:16px !important; font-weight:400; line-height:24px !important;
  background:#fff !important; background-image:none !important; box-shadow:none !important; color:var(--s168-text);
  opacity:1; -webkit-appearance:none; appearance:none; transition:border-color .15s;
}
.stunden168-wrap .stunden168-row select { padding-right:28px !important; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23576b70' stroke-width='1.5'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important; background-position:right 10px center !important; background-size:10px !important;
}
.stunden168-wrap .stunden168-row textarea { resize:vertical; overflow:auto; white-space:pre-wrap; }
.stunden168-wrap .stunden168-row input:focus,
.stunden168-wrap .stunden168-row select:focus,
.stunden168-wrap .stunden168-row textarea:focus { border-color:var(--s168-accent) !important; outline:2px solid #c6d9dd; outline-offset:1px; }
.stunden168-wrap .stunden168-row input::placeholder,
.stunden168-wrap .stunden168-row textarea::placeholder { color:#687b80; opacity:1; font-size:14px; }
.stunden168-wrap .stunden168-row input.is-invalid { border-color:var(--s168-danger) !important; background:var(--s168-danger-soft) !important; }
.stunden168-wrap .stunden168-row input[readonly],
.stunden168-wrap .stunden168-row select:disabled { background-color:#edf1ef !important; color:var(--s168-muted); cursor:default; }
.stunden168-wrap .stunden168-week-value { display:block; margin-top:5px; font-size:11px; line-height:16px; color:var(--s168-muted); font-variant-numeric:tabular-nums; }
.stunden168-wrap .stunden168-row input[data-role$="-value"] { font-variant-numeric:tabular-nums; }
.stunden168-wrap .stunden168-delete-field { padding-top:22px !important; }
.stunden168-wrap .stunden168-icon-btn { display:inline-flex; align-items:center; justify-content:center; width:32px; min-width:32px; height:44px; margin:0 !important; padding:0 !important; background:transparent; border:1px solid transparent; border-radius:6px; color:var(--s168-muted); font-size:20px; line-height:1; cursor:pointer; }
.stunden168-wrap .stunden168-icon-btn:hover { background:var(--s168-danger-soft); border-color:#e4c3bf; color:var(--s168-danger); }
.stunden168-wrap .stunden168-add-activity { margin:9px 12px 12px !important; font-size:13px; }
.stunden168-wrap .stunden168-step-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:28px 0; }
.stunden168-wrap .stunden168-step-actions [data-step-next] { margin-left:auto !important; }
.stunden168-wrap .stunden168-footer-note { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:18px 0 0; border-top:1px solid var(--s168-border); margin-top:26px; color:var(--s168-muted); }
.stunden168-wrap .stunden168-footer-note p { max-width:760px; font-size:12px; line-height:1.6; margin:0; }
.stunden168-wrap .stunden168-live { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* Only the current-values stage changes the desktop column structure. */
.stunden168-wrap[data-view="current"] .stunden168-summary { grid-template-columns:1fr; }
.stunden168-wrap[data-view="current"] .stunden168-summary-card { max-width:100%; }
.stunden168-wrap[data-view="current"] .stunden168-row { grid-template-columns:minmax(200px,2fr) minmax(280px,1.6fr) minmax(130px,.9fr) 32px; }
.stunden168-wrap[data-view="current"] .stunden168-timing-field { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
/* Container-based cards: activity/unit paired; numbers paired; rhythm in its own row. */
@container stunden168 (max-width: 980px) {
  .stunden168-wrap .stunden168-row,
  .stunden168-wrap[data-view="current"] .stunden168-row {
    grid-template-columns:minmax(0,1.75fr) minmax(132px,1fr);
    grid-template-areas:"activity unit" "now goal" "change change" "delete delete";
    gap:14px 12px; padding:18px;
  }
  .stunden168-wrap .stunden168-row.stunden168-row-daily {
    grid-template-areas:"activity unit" "days days" "now goal" "change change" "delete delete";
  }
  .stunden168-wrap[data-view="current"] .stunden168-row { grid-template-areas:"activity unit" "now now" "delete delete"; }
  .stunden168-wrap[data-view="current"] .stunden168-row.stunden168-row-daily { grid-template-areas:"activity unit" "days days" "now now" "delete delete"; }
  .stunden168-wrap .stunden168-timing-field,
  .stunden168-wrap[data-view="current"] .stunden168-timing-field { display:contents; }
  .stunden168-wrap .stunden168-activity-field { grid-area:activity; }
  .stunden168-wrap .stunden168-unit-field { grid-area:unit; }
  .stunden168-wrap .stunden168-days-field { grid-area:days; }
  .stunden168-wrap .stunden168-now-field { grid-area:now; }
  .stunden168-wrap .stunden168-goal-field { grid-area:goal; }
  .stunden168-wrap .stunden168-change-field { grid-area:change; }
  .stunden168-wrap .stunden168-delete-field { grid-area:delete; justify-self:end; padding-top:0 !important; margin-top:-8px !important; }
  .stunden168-wrap .stunden168-row textarea { height:72px !important; }
  .stunden168-wrap .stunden168-category-total { display:none; }
  .stunden168-wrap .stunden168-icon-btn { height:36px; }
}
@container stunden168 (max-width: 600px) {
  .stunden168-wrap .stunden168-steps { flex-wrap:wrap; gap:5px; padding:5px; }
  .stunden168-wrap .stunden168-step { padding:10px !important; gap:7px; font-size:13px; }
  .stunden168-wrap .stunden168-step-overview { flex:1 0 100%; min-height:36px; padding:6px !important; }
  .stunden168-wrap .stunden168-step-number { flex-basis:24px; width:24px; height:24px; }
  .stunden168-wrap .stunden168-summary { gap:10px; }
  .stunden168-wrap .stunden168-summary-card { padding:14px 12px 12px; }
  .stunden168-wrap .stunden168-summary-card strong { font-size:28px; }
  .stunden168-wrap .stunden168-summary-card small { font-size:14px; }
  .stunden168-wrap .stunden168-summary-label { font-size:13px; }
  .stunden168-wrap .stunden168-summary-note { font-size:12px; min-height:34px; }
  .stunden168-wrap .stunden168-completeness { font-size:11px; }
  .stunden168-wrap .stunden168-toolbar { margin-top:16px; align-items:stretch; }
  .stunden168-wrap .stunden168-toolbar .stunden168-btn { flex:1 1 140px; font-size:13px; padding:10px 12px !important; }
  .stunden168-wrap .stunden168-category-head { gap:5px; padding:12px; }
  .stunden168-wrap .stunden168-category-number { font-size:11px; }
  .stunden168-wrap .stunden168-category-title { font-size:16px !important; }
  .stunden168-wrap .stunden168-row,
  .stunden168-wrap[data-view="current"] .stunden168-row { grid-template-columns:minmax(0,1.6fr) minmax(124px,1fr); padding:14px 12px; gap:12px 10px; }
  .stunden168-wrap .stunden168-row select { font-size:14px !important; padding-left:8px !important; }
  .stunden168-wrap .stunden168-cell-label { font-size:11px !important; }
  .stunden168-wrap .stunden168-stage-note { font-size:13px; }
  .stunden168-wrap .stunden168-step-actions { flex-wrap:wrap; }
  .stunden168-wrap .stunden168-step-actions .stunden168-btn { flex:1 1 160px; }
}
@container stunden168 (max-width: 330px) {
  .stunden168-wrap .stunden168-summary { grid-template-columns:1fr; }
  .stunden168-wrap .stunden168-summary-note { min-height:0; }
}
@media (prefers-reduced-motion: reduce) {
  .stunden168-wrap *, .stunden168-wrap *::before,.stunden168-wrap *::after { transition:none !important; scroll-behavior:auto !important; }
}
/* Fallback for old browsers without container queries: never force a wide row. */
@supports not (container-type:inline-size) {
  .stunden168-wrap .stunden168-row,.stunden168-wrap[data-view="current"] .stunden168-row { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .stunden168-wrap .stunden168-activity-field,.stunden168-wrap .stunden168-change-field { grid-column:1 / -1; }
  .stunden168-wrap .stunden168-timing-field { display:contents; }
}
