/* ============================================================
   JOTWINGIA — component layer · GLASS edition
   ============================================================ */

/* shared glass mixin applied to panels */
.appbar, .cal, .card, .modal, .daycard, .kasa-stat, .minitile,
.guest-tile, .pay-tile, .subcard, .extra-existing, .input, .select,
.textarea, .navchip, .svc-btn, .tabbar, .search-big, .nights, .sugg, .seg {
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
}

/* ---------- app bar ---------- */
.appbar {
  display: flex; align-items: center; gap: var(--sp-3);
  height: 60px; padding: 0 var(--sp-5);
  background: var(--surface);
  border-bottom: 0.5px solid var(--separator);
  box-shadow: var(--glass-edge);
  position: relative; z-index: 6;
}
.brand { display: flex; align-items: center; gap: var(--sp-3); }
.brand-mark {
  width: 34px; height: 34px; border-radius: 11px; flex: 0 0 auto;
  background: linear-gradient(140deg, var(--accent), #18b4ff);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-weight: var(--w-black); font-size: 18px; letter-spacing: -0.04em;
  box-shadow: var(--accent-glow);
}
.brand-name { font-size: var(--t-17); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.brand-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; display: flex; align-items: center; gap: 6px; }
.sync-dot { width: 6px; height: 6px; border-radius: var(--r-full); background: var(--paid); box-shadow: 0 0 8px var(--paid); }

.spacer { flex: 1; }
.iconbtn {
  width: 38px; height: 38px; border-radius: var(--r-full); border: none;
  background: transparent; color: var(--text-2); cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s;
}
.iconbtn:hover { color: var(--text); }
.iconbtn.is-active { background: var(--accent-soft); color: var(--accent); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; white-space: nowrap;
  height: 40px; padding: 0 var(--sp-5); border-radius: var(--r-full);
  font: inherit; font-size: var(--t-14); font-weight: var(--w-semibold);
  border: 0.5px solid var(--separator-strong);
  background: var(--fill); color: var(--text);
  cursor: pointer; transition: background .15s, transform .06s, box-shadow .15s;
}
.btn:active { transform: scale(.98); }
.btn-primary {
  background: linear-gradient(140deg, var(--accent), #5b6bff);
  color: #fff; border-color: transparent; box-shadow: var(--accent-glow);
}
.btn-ghost { background: var(--fill); border-color: transparent; }
.btn-danger { color: var(--unpaid); border-color: color-mix(in srgb, var(--unpaid) 45%, transparent); background: transparent; }
.btn-danger:hover { background: var(--unpaid-soft); }
.btn-lg { height: 50px; font-size: var(--t-15); }
.btn-block { width: 100%; }

/* ---------- calendar ---------- */
.cal-toolbar {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: var(--sp-4) var(--sp-5) var(--sp-3); background: transparent;
}
.month-title { font-size: var(--t-24); font-weight: var(--w-bold); letter-spacing: -0.03em; min-width: 150px; }
.navchip {
  width: 36px; height: 36px; border-radius: var(--r-full); border: 0.5px solid var(--separator);
  background: var(--surface); color: var(--text-2); cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: background .15s;
}
.navchip:hover { color: var(--text); }

.cal {
  --rail-w: 134px; --col-w: 92px; --row-h: 64px;
  position: relative; background: var(--surface);
  margin: 0 var(--sp-5) var(--sp-5); border-radius: var(--r-2xl);
  border: 0.5px solid var(--separator);
  box-shadow: var(--glass-edge), var(--shadow-lg);
  overflow: hidden;
}
.cal-scroll { overflow: hidden; }
.cal-grid { position: relative; width: max-content; min-width: 100%; }

.cal-headrow { display: grid; grid-auto-flow: column; grid-auto-columns: var(--col-w);
  border-bottom: 0.5px solid var(--separator); }
.day-head { padding: 10px 0 11px; text-align: center; border-left: 0.5px solid var(--separator); position: relative; }
.day-head .dow { font-size: var(--t-11); font-weight: var(--w-semibold); color: var(--text-3); text-transform: lowercase; letter-spacing: .02em; }
.day-head .dom { font-size: var(--t-17); font-weight: var(--w-bold); margin-top: 2px; letter-spacing: -0.02em; }
.day-head.weekend .dow, .day-head.weekend .dom { color: color-mix(in srgb, var(--unpaid) 78%, var(--text-2)); }
/* dzień świąteczny — skrót dnia u góry normalnie, nazwa święta pod ikoną pogody + kropka */
.day-head.holiday .dom { color: var(--c5); }
.holname { margin-top: 4px; font-size: 9px; line-height: 1.05; font-weight: var(--w-bold);
  color: var(--c5); letter-spacing: 0; max-width: 100%; padding: 0 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 0 8px color-mix(in srgb, var(--c5) 40%, transparent); }
.holdot { position: absolute; top: 6px; right: 8px; width: 6px; height: 6px; border-radius: var(--r-full);
  background: var(--c5); box-shadow: 0 0 9px var(--c5); }
.day-head.mini .holdot { top: 4px; right: 5px; width: 5px; height: 5px; }
.day-head.today .dom {
  color: #fff; background: linear-gradient(140deg, var(--accent), #5b6bff);
  width: 28px; height: 28px; line-height: 28px; border-radius: var(--r-full);
  display: inline-block; margin-top: 1px; font-size: var(--t-14); box-shadow: var(--accent-glow);
}
.day-head .wx { font-size: 10px; color: var(--text-3); margin-top: 4px; display: flex; align-items: center; justify-content: center; gap: 2px; }

.cal-body { position: relative; }
.cal-lane { display: grid; grid-template-columns: var(--rail-w) 1fr; align-items: stretch;
  border-bottom: 0.5px solid var(--separator); min-height: var(--row-h); }
.cal-lane:last-child { border-bottom: none; }
.lane-head {
  display: flex; align-items: center; gap: 10px; padding: 0 var(--sp-4);
  position: sticky; left: 0; z-index: 2;
  background: color-mix(in srgb, var(--surface-solid) 78%, transparent);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  border-right: 0.5px solid var(--separator);
}
.lane-chip {
  width: 28px; height: 28px; border-radius: 9px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--t-13); font-weight: var(--w-bold); color: #fff; letter-spacing: -0.02em;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--cc, var(--accent)) 50%, transparent);
}
.lane-name { font-size: var(--t-13); font-weight: var(--w-medium); color: var(--text-2); }
.lane-track { position: relative; }
.lane-track::before {
  content: ""; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(to right,
    transparent 0, transparent calc(var(--col-w) - 0.5px),
    var(--separator) calc(var(--col-w) - 0.5px), var(--separator) var(--col-w));
}
.lane-sub { position: relative; height: calc(var(--row-h) / var(--subrows, 1)); }

/* booking bar — glowing glass */
.bar {
  position: absolute; top: 7px; bottom: 7px; left: var(--x); width: var(--w);
  background: color-mix(in srgb, var(--cc) calc(var(--bar-tint) * 100%), transparent);
  border-radius: var(--r-md);
  border: 0.5px solid color-mix(in srgb, var(--cc) 60%, transparent);
  box-shadow: 0 4px 18px color-mix(in srgb, var(--cc) 30%, transparent), var(--glass-edge);
  display: flex; align-items: center; gap: 8px; padding: 0 10px 0 8px;
  overflow: hidden; cursor: pointer;
}
.bar::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--cc); box-shadow: 0 0 12px var(--cc); }
.bar-ava {
  width: 24px; height: 24px; border-radius: var(--r-full); flex: 0 0 auto;
  background: color-mix(in srgb, var(--cc) 40%, #000 10%); border: 1.5px solid var(--cc); color: #fff;
  display: flex; align-items: center; justify-content: center; margin-left: 3px;
}
.bar-main { min-width: 0; flex: 1; line-height: 1.08; }
.bar-name { font-size: var(--t-13); font-weight: var(--w-bold); color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -0.01em; }
.bar-meta { font-size: var(--t-11); color: var(--text-2); white-space: nowrap; margin-top: 1px; }
.bar-svc { display: flex; gap: 4px; flex: 0 0 auto; color: var(--text-2); }
.bar-pin { margin-left: auto; flex: 0 0 auto; }
.bar.compact { padding-left: 7px; }
.bar.compact .bar-meta { display: none; }

.today-line { position: absolute; top: 0; bottom: 0; width: 2px;
  background: linear-gradient(var(--accent), #18b4ff); left: var(--today-x); z-index: 1; pointer-events: none;
  box-shadow: 0 0 14px var(--accent); }
.today-line::before { content: ""; position: absolute; top: -2px; left: -4px; width: 10px; height: 10px;
  border-radius: var(--r-full); background: var(--accent); box-shadow: 0 0 12px var(--accent); }

/* ---------- status bits ---------- */
.statuslab { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-12); font-weight: var(--w-semibold); }
.statuslab.paid { color: var(--paid); } .statuslab.partial { color: var(--partial); } .statuslab.unpaid { color: var(--unpaid); }
.chip { display: inline-flex; align-items: center; gap: 5px; height: 23px; padding: 0 10px;
  border-radius: var(--r-full); font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .01em; }
.chip-paid { background: var(--paid-soft); color: var(--paid); }
.chip-partial { background: var(--partial-soft); color: var(--partial); }
.chip-unpaid { background: var(--unpaid-soft); color: var(--unpaid); }
.chip-neutral { background: var(--fill); color: var(--text-2); }

/* ---------- generic surfaces ---------- */
.card { background: var(--surface); border: 0.5px solid var(--separator); border-radius: var(--r-xl);
  box-shadow: var(--glass-edge), var(--shadow-md); }
.group { padding: var(--sp-5); }
.group + .group { border-top: 0.5px solid var(--separator); }
.glabel { font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); margin-bottom: var(--sp-3); }

/* ---------- modal ---------- */
.scrim { position: absolute; inset: 0; background: rgba(4,4,10,.5);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.modal {
  position: absolute; background: var(--surface-3);
  border-radius: var(--r-3xl);
  box-shadow: var(--glass-edge), var(--shadow-modal);
  border: 0.5px solid var(--separator-strong);
  overflow: hidden; display: flex; flex-direction: column;
}
.modal-head { display: flex; align-items: flex-start; gap: var(--sp-3);
  padding: var(--sp-5) var(--sp-5) var(--sp-4); border-bottom: 0.5px solid var(--separator); }
.modal-title { font-size: var(--t-24); font-weight: var(--w-bold); letter-spacing: -0.03em; }
.modal-sub { font-size: var(--t-13); color: var(--text-2); margin-top: 3px; display: flex; align-items: center; gap: 7px; }
.modal-close { width: 34px; height: 34px; border-radius: var(--r-full); border: none; cursor: pointer;
  background: var(--fill); color: var(--text-2); display: flex; align-items: center; justify-content: center; }
.modal-close:hover { background: var(--fill-2); color: var(--text); }
.modal-body { padding: var(--sp-5); overflow: hidden; display: flex; flex-direction: column; gap: var(--sp-5); }
.modal-foot { padding: var(--sp-4) var(--sp-5); border-top: 0.5px solid var(--separator); display: flex; gap: var(--sp-3); }

/* form fields */
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.field-lab { font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); }
.input, .select {
  height: 44px; border-radius: var(--r-md); border: 0.5px solid var(--separator-strong);
  background: var(--surface-2); color: var(--text); font: inherit; font-size: var(--t-15);
  padding: 0 var(--sp-4); width: 100%; letter-spacing: -0.01em;
}
.input::placeholder { color: var(--text-4); }
.input:focus, .select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.textarea { border-radius: var(--r-md); border: 0.5px solid var(--separator-strong);
  background: var(--surface-2); color: var(--text); font: inherit; font-size: var(--t-15);
  padding: var(--sp-3) var(--sp-4); width: 100%; resize: none; line-height: 1.45; }
.select { display: flex; align-items: center; justify-content: space-between; cursor: pointer; }
.fieldgrid { display: grid; gap: var(--sp-4); }

.subcard { background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-md); padding: var(--sp-4); }
.subcard-head { display: flex; align-items: center; gap: 8px; font-size: var(--t-14); font-weight: var(--w-semibold); margin-bottom: var(--sp-3); }

.sugg { display: flex; align-items: center; gap: 8px; font-size: var(--t-13); color: var(--text-2);
  background: var(--accent-soft); border: 0.5px solid color-mix(in srgb, var(--accent) 30%, transparent);
  border-radius: var(--r-md); padding: 10px var(--sp-4); }
.sugg b { color: var(--accent-hover); font-weight: var(--w-semibold); }
.sugg .sep { color: var(--text-4); }

/* payment tiles */
.pay-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-3); }
.pay-tile { position: relative; text-align: left; cursor: pointer;
  background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-lg);
  padding: var(--sp-4); display: flex; flex-direction: column; gap: 11px; overflow: hidden;
  transition: background .15s, box-shadow .15s; }
.pay-tile::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--separator-strong); }
.pay-tile:hover { background: var(--surface-3); }
.pay-tile.is-paid::before    { background: var(--paid);    box-shadow: 0 0 16px var(--paid); }
.pay-tile.is-partial::before { background: var(--partial); box-shadow: 0 0 16px var(--partial); }
.pay-tile.is-unpaid::before  { background: var(--unpaid);  box-shadow: 0 0 16px var(--unpaid); }
.pay-tile .pt-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pay-tile .pt-name { font-size: var(--t-13); font-weight: var(--w-semibold); }
.pay-tile .pt-amt { font-size: var(--t-24); font-weight: var(--w-bold); letter-spacing: -0.03em; }
.pay-tile .pt-sub { font-size: var(--t-12); color: var(--text-3); }

/* segmented control */
.seg { display: inline-flex; background: var(--fill); border-radius: var(--r-full); padding: 3px; gap: 3px; border: 0.5px solid var(--separator); }
.seg button { border: none; background: transparent; color: var(--text-2); font: inherit;
  font-size: var(--t-13); font-weight: var(--w-medium); padding: 7px 14px; border-radius: var(--r-full); cursor: pointer; }
.seg button.on { background: var(--surface-3); color: var(--text); box-shadow: var(--shadow-sm); }
/* status płatności: zaznaczony segment w kolorze swojego statusu (zielony = zapłacone, czerwony = niezapłacone) */
.seg button.on.tone-paid {
  color: var(--paid); background: var(--paid-soft);
  box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--paid) 45%, transparent), 0 0 14px color-mix(in srgb, var(--paid) 22%, transparent), var(--shadow-sm);
}
.seg button.on.tone-unpaid {
  color: var(--unpaid); background: var(--unpaid-soft);
  box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--unpaid) 45%, transparent), 0 0 14px color-mix(in srgb, var(--unpaid) 22%, transparent), var(--shadow-sm);
}
.seg button.on.tone-partial {
  color: var(--partial); background: var(--partial-soft);
  box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--partial) 45%, transparent), 0 0 14px color-mix(in srgb, var(--partial) 22%, transparent), var(--shadow-sm);
}
.seg button.on.tone-paid:hover    { color: var(--paid);    text-shadow: 0 0 3px currentColor; box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--paid) 60%, transparent),    0 0 20px color-mix(in srgb, var(--paid) 34%, transparent),    var(--shadow-sm); }
.seg button.on.tone-unpaid:hover  { color: var(--unpaid);  text-shadow: 0 0 3px currentColor; box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--unpaid) 60%, transparent),  0 0 20px color-mix(in srgb, var(--unpaid) 34%, transparent),  var(--shadow-sm); }
.seg button.on.tone-partial:hover { color: var(--partial); text-shadow: 0 0 3px currentColor; box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--partial) 60%, transparent), 0 0 20px color-mix(in srgb, var(--partial) 34%, transparent), var(--shadow-sm); }

/* nights pill */
.nights { display: flex; align-items: center; gap: 8px; background: var(--accent-soft);
  border: 0.5px solid color-mix(in srgb, var(--accent) 30%, transparent);
  border-radius: var(--r-md); padding: 10px var(--sp-4); font-size: var(--t-14); }
.nights b { font-weight: var(--w-bold); }
.nights .mini { font-size: var(--t-11); color: var(--text-2); background: var(--fill);
  border-radius: var(--r-full); padding: 3px 9px; font-weight: var(--w-medium); }

/* extras */
.extra-existing { display: flex; align-items: center; gap: 12px; padding: var(--sp-3) var(--sp-4);
  background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-md); }
.svc-ico { width: 38px; height: 38px; border-radius: var(--r-full); flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center; background: var(--accent-soft); color: var(--accent-hover); }
.svc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-3); }
.svc-btn { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: var(--sp-4) 4px;
  border-radius: var(--r-md); cursor: pointer; background: var(--surface-2); border: 0.5px solid var(--separator);
  color: var(--text-2); font: inherit; font-size: var(--t-11); font-weight: var(--w-medium); transition: background .15s, border-color .15s; }
.svc-btn:hover { background: var(--surface-3); border-color: var(--separator-strong); color: var(--text); }
.svc-btn .svc-ico { width: 36px; height: 36px; background: var(--fill); color: var(--text); }

/* checkbox */
.check { display: flex; align-items: center; gap: 12px; cursor: pointer; font-size: var(--t-15); }
.check .box { width: 26px; height: 26px; border-radius: 9px; border: 1.5px solid var(--separator-strong);
  background: var(--surface-2); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; transition: background .15s; }
.check.on .box { background: var(--paid); border-color: var(--paid); color: #04140b; box-shadow: 0 0 16px var(--paid-soft); }

/* ---------- day info card (dymek dnia) ---------- */
.daycard { background: var(--surface); border-radius: var(--r-xl); border: 0.5px solid var(--separator);
  box-shadow: var(--glass-edge), var(--shadow-lg); overflow: hidden; }
.daycard.today { border-color: color-mix(in srgb, var(--accent) 60%, var(--separator)); box-shadow: 0 0 0 1px var(--accent-soft), var(--glass-edge), var(--shadow-lg); }
.daycard-head { padding: var(--sp-5) var(--sp-5) var(--sp-4); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
/* relatywny dzień + data w jednej linii */
.daycard-when { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.daycard-day { font-size: var(--t-20); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.daycard-date { font-size: var(--t-13); color: var(--text-3); font-weight: var(--w-medium); }
.daycard-wx { display: flex; align-items: center; gap: 6px; font-size: var(--t-14); color: var(--text-2); flex: 0 0 auto; }

/* lista zdarzeń — każda linia jako pole w kolorze domku */
.daycard-events { display: flex; flex-direction: column; gap: 8px; padding: 0 var(--sp-4) var(--sp-4); }
.evt { display: flex; align-items: center; gap: 11px; padding: 9px 11px; border-radius: var(--r-md);
  background: color-mix(in srgb, var(--cc, var(--accent)) 9%, var(--surface-2));
  border: 0.5px solid color-mix(in srgb, var(--cc, var(--accent)) 24%, var(--separator)); }
.evt-ico { width: 30px; height: 30px; border-radius: 9px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--cc, var(--accent)) 24%, transparent); color: var(--cc, var(--accent));
  box-shadow: 0 0 14px color-mix(in srgb, var(--cc, var(--accent)) 24%, transparent); }
.evt-time { font-size: var(--t-12); font-weight: var(--w-bold); color: var(--cc, var(--accent)); width: 44px; flex: 0 0 auto; text-align: center;
  filter: brightness(1.12); }
.evt-txt { font-size: var(--t-13); font-weight: var(--w-medium); flex: 1; min-width: 0; }
.evt-title { display: block; font-weight: var(--w-semibold); color: var(--cc, var(--accent)); filter: brightness(1.12);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.evt-txt small { display: block; font-size: var(--t-11); color: var(--text-3); font-weight: var(--w-regular); margin-top: 1px; }
.evt-tag { margin-left: auto; flex: 0 0 auto; }

/* dymek osadzony na ekranie startowym — wypełnia panel, lista przewija się */
.daycard-embed { display: flex; flex-direction: column; min-height: 0; }
.dash-bottom > .daycard-embed { flex: 1; min-width: 0; }
.daycard-embed .daycard-head { flex: 0 0 auto; padding-bottom: var(--sp-3); }
.daycard-embed .daycard-events { flex: 1; min-height: 0; overflow-y: auto; }

/* ---------- kasa — skórka Ekranu startowego (szkło nad aurorą, kolor wstaje z tła) ---------- */
.kasa-main { gap: 14px; overflow-y: auto; }
.kasa-hero { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; flex: 0 0 auto; }
.kasa-stat { background: color-mix(in srgb, var(--surface) 55%, transparent); border: 0.5px solid var(--separator);
  border-radius: var(--r-2xl); padding: 18px 22px; box-shadow: var(--glass-edge), var(--shadow-md);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.kasa-stat.k-accent { background: color-mix(in srgb, var(--accent) 10%, color-mix(in srgb, var(--surface) 55%, transparent)); border-color: color-mix(in srgb, var(--accent) 26%, var(--separator)); }
.kasa-stat.k-pos { background: color-mix(in srgb, var(--paid) 10%, color-mix(in srgb, var(--surface) 55%, transparent)); border-color: color-mix(in srgb, var(--paid) 26%, var(--separator)); }
.kasa-stat.k-neg { background: color-mix(in srgb, var(--partial) 9%, color-mix(in srgb, var(--surface) 55%, transparent)); border-color: color-mix(in srgb, var(--partial) 24%, var(--separator)); }
.kasa-stat .ks-lab { font-size: var(--t-12); font-weight: var(--w-semibold); letter-spacing: .01em; color: var(--text-2); }
.kasa-stat .ks-val { font-size: var(--t-44); font-weight: var(--w-black); letter-spacing: -0.04em; margin-top: 8px; line-height: 1; }
.kasa-stat .ks-val.pos { color: var(--paid); text-shadow: 0 0 30px var(--paid-soft); }
.kasa-stat .ks-val.neg { color: var(--partial); text-shadow: 0 0 30px var(--partial-soft); }
.kasa-stat .ks-val.accent { color: var(--accent-hover); text-shadow: 0 0 30px var(--accent-soft); }
.kasa-stat .ks-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 8px; }

.kasa-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 14px; flex: 0 0 auto; align-items: start; }
.kasa-rail { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.kasa-bd { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--sp-6); }
.kasa-splitrow { display: flex; justify-content: space-between; gap: var(--sp-4); }
.kasa-splitlab { font-size: var(--t-12); color: var(--text-3); }
.kasa-splitval { font-size: var(--t-20); font-weight: var(--w-bold); letter-spacing: -0.02em; margin-top: 2px; }
.kasa-splitval span { font-size: var(--t-13); color: var(--text-3); font-weight: var(--w-regular); }
.kasa-goalpct { font-size: var(--t-17); font-weight: var(--w-bold); color: var(--accent-hover); }
.kasa-goalnote { font-size: var(--t-12); color: var(--text-3); }
.kasa-goalnote b { color: var(--text); font-weight: var(--w-semibold); }
.kasa-mini { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; flex: 0 0 auto; }

/* ---- symetryczny rząd: przychód wg kategorii | wydatki sezonu ---- */
.kasa-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; flex: 0 0 auto; align-items: stretch; }
.kasa-two > .edit-card { display: flex; flex-direction: column; }
.bd-total { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 12px;
  border-top: 1px solid var(--separator); }
.bd-total .lab { font-size: var(--t-12); font-weight: var(--w-semibold); letter-spacing: .02em; color: var(--text-2); }
.bd-total .val { font-size: var(--t-17); font-weight: var(--w-black); letter-spacing: -0.03em; }
.bd-total .val.neg { color: var(--partial); }

/* ---- połączona karta: skąd rezerwacje + ile zabrały platformy ---- */
.srccard-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.srccard-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; }
.srccard-fig { text-align: right; flex: 0 0 auto; }
.srccard-figval { font-size: var(--t-24); font-weight: var(--w-black); letter-spacing: -0.04em; color: var(--c5); line-height: 1;
  text-shadow: 0 0 28px color-mix(in srgb, var(--c5) 26%, transparent); }
.srccard-fignote { font-size: var(--t-11); color: var(--text-3); margin-top: 4px; }
.srclist { display: flex; flex-direction: column; margin: 16px 0 4px; }
.srchead, .srcrow { display: grid; grid-template-columns: 1.7fr 0.7fr 1fr 1fr; align-items: center; gap: 12px; }
.srchead { padding-bottom: 9px; font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .05em;
  text-transform: uppercase; color: var(--text-4); }
.srchead > :nth-child(n+2), .srcrow > :nth-child(n+2) { text-align: right; font-variant-numeric: tabular-nums; }
.srcrow { padding: 12px 0; border-top: 0.5px solid var(--separator); }
.src-chan { display: flex; align-items: center; gap: 11px; min-width: 0; text-align: left; }
.src-mark { width: 30px; height: 30px; border-radius: 9px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  font-size: var(--t-13); font-weight: var(--w-black); color: #fff; background: var(--cc); letter-spacing: -0.02em;
  box-shadow: 0 3px 12px color-mix(in srgb, var(--cc) 48%, transparent); }
.src-name { font-size: var(--t-14); font-weight: var(--w-semibold); letter-spacing: -0.01em; min-width: 0; }
.src-name small { display: block; font-size: var(--t-11); color: var(--text-3); font-weight: var(--w-regular); margin-top: 1px; }
.src-share { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.src-gross { font-size: var(--t-14); color: var(--text); font-weight: var(--w-semibold); }
.src-fee { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.src-fee.pos { color: var(--paid); }
.src-fee.neg { color: var(--c5); }

/* ---- hero stat: nagłówek z ikoną + wariant OTA ---- */
.kasa-stat .ks-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kasa-stat .ks-ico { width: 26px; height: 26px; border-radius: 8px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--fill); color: var(--text-3); }
.kasa-stat .ks-ico.k-accent { background: var(--accent-soft); color: var(--accent-hover); }
.kasa-stat .ks-ico.k-pos { background: var(--paid-soft); color: var(--paid); }
.kasa-stat .ks-ico.k-neg { background: var(--partial-soft); color: var(--partial); }
.kasa-stat .ks-ico.k-ota { background: color-mix(in srgb, var(--c5) 20%, transparent); color: var(--c5); }
.kasa-stat.k-ota { background: color-mix(in srgb, var(--c5) 10%, color-mix(in srgb, var(--surface) 55%, transparent)); border-color: color-mix(in srgb, var(--c5) 28%, var(--separator)); }
.kasa-stat .ks-val.ota { color: var(--c5); text-shadow: 0 0 30px color-mix(in srgb, var(--c5) 30%, transparent); }

/* ---- drugi rząd kart ---- */
.kasa-grid-2 { grid-template-columns: 1.35fr 1fr; }

/* ---- OTA — gwiazda ekranu: ile zabrały platformy ---- */
.ota-card { display: flex; flex-direction: column; gap: 14px; }
.ota-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.ota-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; }
.ota-headfig { text-align: right; flex: 0 0 auto; }
.ota-headval { font-size: var(--t-34); font-weight: var(--w-black); letter-spacing: -0.04em; color: var(--c5); line-height: 1;
  text-shadow: 0 0 30px color-mix(in srgb, var(--c5) 28%, transparent); }
.ota-headnote { font-size: var(--t-12); color: var(--text-3); margin-top: 3px; }
.ota-list { display: flex; flex-direction: column; gap: 12px; }
.ota-row { --cc: var(--accent); display: flex; flex-direction: column; gap: 9px; padding: 13px 15px; border-radius: var(--r-lg);
  background: var(--surface-2); border: 0.5px solid var(--separator); }
.ota-top { display: flex; align-items: center; gap: 11px; }
.ota-logo { width: 32px; height: 32px; border-radius: 9px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  font-size: var(--t-13); font-weight: var(--w-black); color: #fff; background: var(--cc); letter-spacing: -0.02em;
  box-shadow: 0 3px 12px color-mix(in srgb, var(--cc) 50%, transparent); }
.ota-name { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.01em; }
.ota-rate { font-size: var(--t-11); font-weight: var(--w-semibold); color: var(--text-3); background: var(--fill);
  padding: 3px 9px; border-radius: var(--r-full); }
.ota-fee-big { margin-left: auto; font-size: var(--t-20); font-weight: var(--w-black); letter-spacing: -0.03em; color: var(--c5); }
.ota-bar { display: flex; height: 9px; border-radius: var(--r-full); overflow: hidden; gap: 2px; }
.ota-bar > i { display: block; height: 100%; }
.ota-bar > .ota-net { background: var(--cc); }
.ota-bar > .ota-fee { background: var(--c5); box-shadow: 0 0 10px color-mix(in srgb, var(--c5) 40%, transparent); }
.ota-figs { display: flex; align-items: center; justify-content: space-between; font-size: var(--t-12); color: var(--text-3); }
.ota-figs b { color: var(--text); font-weight: var(--w-semibold); }
.ota-net-fig b { color: var(--paid); }
.ota-foot { display: flex; align-items: center; gap: 10px; font-size: var(--t-13); color: var(--text-2); line-height: 1.4;
  padding: 12px 14px; border-radius: var(--r-md); background: color-mix(in srgb, var(--accent) 8%, transparent);
  border: 0.5px solid color-mix(in srgb, var(--accent) 22%, var(--separator)); }
.ota-foot b { color: var(--text); font-weight: var(--w-bold); }
.ota-foot-ic { width: 28px; height: 28px; border-radius: 8px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); }

/* ---- split: legenda + netto po prowizji ---- */
.dotleg { display: inline-block; width: 8px; height: 8px; border-radius: 3px; margin: 0 6px; vertical-align: middle;
  box-shadow: 0 0 8px currentColor; }
.kasa-splitlab { display: flex; align-items: center; }
.kasa-splitrow > div:last-child .kasa-splitlab { justify-content: flex-end; }
.kasa-splitnet { font-size: var(--t-11); font-weight: var(--w-semibold); margin-top: 3px; }
.kasa-splitnet.pos { color: var(--paid); }
.kasa-splitnet.neg { color: var(--c5); }


.bd-row { display: flex; align-items: center; gap: var(--sp-3); padding: 10px 0; border-bottom: 0.5px solid var(--separator); }
.bd-row:last-child { border-bottom: none; }
.bd-dot { width: 9px; height: 9px; border-radius: 3px; flex: 0 0 auto; box-shadow: 0 0 8px currentColor; }
.bd-name { font-size: var(--t-13); color: var(--text-2); flex: 1; }
.bd-amt { font-size: var(--t-14); font-weight: var(--w-semibold); }
.bd-amt.zero { color: var(--text-4); font-weight: var(--w-regular); }

.barmeter { height: 9px; border-radius: var(--r-full); background: var(--fill); overflow: hidden; }
.barmeter > i { display: block; height: 100%; border-radius: var(--r-full); background: linear-gradient(90deg, var(--accent), #18b4ff); box-shadow: 0 0 16px var(--accent-soft); }
.split { display: flex; height: 11px; border-radius: var(--r-full); overflow: hidden; gap: 2px; }
.split > i { display: block; height: 100%; }
.goal-wrap { display: flex; flex-direction: column; gap: 11px; }
.goal-top { display: flex; align-items: baseline; justify-content: space-between; }

.minitile { background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-lg); padding: var(--sp-4); }
.minitile .mt-lab { font-size: var(--t-12); color: var(--text-3); }
.minitile .mt-val { font-size: var(--t-28); font-weight: var(--w-bold); letter-spacing: -0.03em; margin-top: 3px; }

/* ---------- guests ---------- */
.guest-tile { background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-lg);
  padding: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-3); }
.guest-top { display: flex; align-items: center; gap: 12px; }
.guest-ava { width: 42px; height: 42px; border-radius: var(--r-full); flex: 0 0 auto;
  background: linear-gradient(140deg, var(--accent), #5b6bff); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: var(--w-bold); font-size: var(--t-17); box-shadow: var(--accent-glow); }
.guest-name { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.01em; }
.guest-phone { font-size: var(--t-12); color: var(--text-2); display: flex; align-items: center; gap: 5px; margin-top: 2px; }
.guest-stats { display: flex; gap: var(--sp-3); font-size: var(--t-12); color: var(--text-3); flex-wrap: wrap; }
.guest-stats b { color: var(--text); font-weight: var(--w-semibold); }
.guest-stats .dot { color: var(--text-4); }
.guest-booking { display: flex; align-items: center; gap: 11px; padding: 10px var(--sp-3);
  background: var(--fill); border: 0.5px solid var(--separator); border-radius: var(--r-md); }
.gb-lane { width: 32px; height: 32px; border-radius: 9px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  font-size: var(--t-11); font-weight: var(--w-bold); color: #fff; box-shadow: 0 3px 12px color-mix(in srgb, var(--cc, var(--accent)) 50%, transparent); }
.gb-dates { font-size: var(--t-13); font-weight: var(--w-semibold); }
.gb-meta { font-size: var(--t-11); color: var(--text-3); margin-top: 1px; }
.gb-amt { margin-left: auto; font-size: var(--t-14); font-weight: var(--w-bold); }

.search-big { display: flex; align-items: center; gap: 11px; height: 52px; padding: 0 var(--sp-5);
  border-radius: var(--r-full); border: 1.5px solid var(--accent); background: var(--surface-2); box-shadow: 0 0 0 4px var(--accent-soft); }
.search-big input { border: none; background: transparent; outline: none; font: inherit; font-size: var(--t-15); color: var(--text); flex: 1; }
.search-big .caret { width: 2px; height: 22px; background: var(--accent); }

/* ---------- guest search · skórka „dymek dnia" ---------- */
.gq-count { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
  font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-2);
  background: var(--fill); border: 0.5px solid var(--separator); border-radius: var(--r-full); padding: 4px 11px; }
.gq-count b { color: var(--accent-hover); font-weight: var(--w-bold); }

/* pole szukania w środku dymka */
.gq-field { display: flex; align-items: center; gap: 10px; height: 46px; padding: 0 14px; margin: 0 var(--sp-4);
  border-radius: var(--r-md); border: 1.5px solid var(--accent); background: var(--surface-2);
  box-shadow: 0 0 0 4px var(--accent-soft); }
.gq-field svg { color: var(--accent); flex: 0 0 auto; }
.gq-field input { border: none; background: transparent; outline: none; font: inherit;
  font-size: var(--t-15); color: var(--text); flex: 1; min-width: 0; }
.gq-field input::placeholder { color: var(--text-4); }
.gq-clear { width: 24px; height: 24px; border-radius: var(--r-full); border: none; cursor: pointer; flex: 0 0 auto;
  background: var(--fill-2); color: var(--text-2); display: flex; align-items: center; justify-content: center; }
.gq-clear:hover { background: var(--fill-strong); color: var(--text); }

.gq-scope { display: flex; margin: var(--sp-3) var(--sp-4) 0; }
.gq-scope.seg { width: auto; }
.gq-scope button { flex: 1; }

/* lista wyników — pudełka w kolorze domku, jak zdarzenia w dymku dnia */
.gq-list { display: flex; flex-direction: column; gap: 8px; padding: var(--sp-3) var(--sp-4) var(--sp-4);
  overflow-y: auto; min-height: 0; }
.gq-row { display: flex; align-items: center; gap: 11px; padding: 9px 11px; border-radius: var(--r-md); cursor: pointer;
  background: color-mix(in srgb, var(--cc, var(--accent)) 9%, var(--surface-2));
  border: 0.5px solid color-mix(in srgb, var(--cc, var(--accent)) 24%, var(--separator));
  transition: background .14s, transform .14s; }
.gq-row:hover { background: color-mix(in srgb, var(--cc, var(--accent)) 16%, var(--surface-2)); transform: translateY(-1px); }
.gq-ava { width: 34px; height: 34px; border-radius: 10px; flex: 0 0 auto; position: relative; display: flex; align-items: center; justify-content: center;
  font-size: var(--t-15); font-weight: var(--w-bold); color: var(--cc, var(--accent)); letter-spacing: -0.02em;
  background: color-mix(in srgb, var(--cc, var(--accent)) 24%, transparent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--cc, var(--accent)) 24%, transparent); }
.gq-cnum { position: absolute; left: -5px; bottom: -5px; width: 17px; height: 17px; border-radius: var(--r-full);
  background: var(--cc, var(--accent)); color: #fff; font-size: 10px; line-height: 1; font-weight: var(--w-bold); letter-spacing: 0;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--cc, var(--accent)) 9%, var(--surface-2)), 0 2px 6px color-mix(in srgb, var(--cc, var(--accent)) 50%, transparent); }
.gq-main { flex: 1; min-width: 0; }
.gq-name { display: flex; align-items: center; gap: 7px; font-size: var(--t-14); font-weight: var(--w-semibold); color: var(--cc, var(--accent)); filter: brightness(1.12);
  letter-spacing: -0.01em; }
.gq-name-txt { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gq-lane { flex: 0 0 auto; font-size: 10px; font-weight: var(--w-bold); letter-spacing: .02em; color: #fff;
  background: var(--cc, var(--accent)); border-radius: var(--r-sm); padding: 1px 6px; filter: none; }
.gq-sub { display: flex; align-items: center; gap: 7px; font-size: var(--t-12); color: var(--text-2); margin-top: 2px; }
.gq-phone { display: inline-flex; align-items: center; gap: 4px; }
.gq-sub svg { color: var(--text-3); flex: 0 0 auto; }
.gq-sub .dot { color: var(--text-4); }
.gq-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: 0 0 auto; }
.gq-amt { font-size: var(--t-13); font-weight: var(--w-bold); letter-spacing: -0.01em; }
mark.gq-hl { background: var(--accent-soft); color: var(--accent-hover); border-radius: 3px; padding: 0 1px;
  font-weight: var(--w-bold); }

.gq-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 30px 16px 26px; text-align: center; }
.gq-empty-ic { width: 46px; height: 46px; border-radius: var(--r-full); display: flex; align-items: center; justify-content: center;
  background: var(--fill); color: var(--text-3); }
.gq-empty-t { font-size: var(--t-14); font-weight: var(--w-semibold); }
.gq-empty-s { font-size: var(--t-12); color: var(--text-3); max-width: 230px; }

/* hide scrollbars inside artboards */
.scr ::-webkit-scrollbar { display: none; }
.scr * { scrollbar-width: none; }

/* legacy no-ops from the previous skin */
.wallpaper { display: none; }

/* tab bar (mobile) */
.tabbar { position: absolute; left: 0; right: 0; bottom: 0; height: 78px; padding-bottom: 16px;
  display: flex; background: color-mix(in srgb, var(--surface-solid) 60%, transparent);
  border-top: 0.5px solid var(--separator); box-shadow: var(--glass-edge); z-index: 7; }
.tab { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  color: var(--text-3); font-size: 10px; font-weight: var(--w-medium); cursor: pointer; }
.tab.on { color: var(--accent-hover); }

/* FAB */
.fab { position: absolute; right: 18px; bottom: 94px; width: 56px; height: 56px; border-radius: var(--r-full);
  background: linear-gradient(140deg, var(--accent), #5b6bff); color: #fff; border: none; cursor: pointer;
  box-shadow: var(--accent-glow), var(--shadow-lg); display: flex; align-items: center; justify-content: center; z-index: 8; }
.fab.desk { bottom: 26px; right: 26px; }

/* ===================== EKRAN STARTOWY / PULPIT ===================== */
.dash { display: flex; height: 100%; }

/* ---------- sidebar (collapsible) ---------- */
.dash-side { width: 236px; flex: 0 0 auto; display: flex; flex-direction: column; gap: 14px;
  padding: 16px 12px; border-right: 0.5px solid var(--separator);
  background: color-mix(in srgb, var(--surface) 55%, transparent);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  transition: width .22s ease; }
.dash-side.collapsed { width: 70px; padding: 16px 11px; }
.side-brand { display: flex; align-items: center; gap: 11px; padding: 2px 6px; cursor: pointer; }
.side-brand .side-collapse { cursor: pointer; }
.dash-side.collapsed .side-brand { flex-direction: column; gap: 12px; padding: 2px 0; }
.side-collapse { margin-left: auto; width: 34px; height: 34px; border-radius: var(--r-full);
  border: none; background: transparent; color: var(--text-2);
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s, color .15s; }
.side-collapse:hover { color: var(--text); }
.dash-side.collapsed .side-collapse { margin-left: 0; }
/* zwinięty sidebar — tylko ikonki (1:1 izolat: chowamy nazwę, etykiety, notatki i Wyloguj) */
.dash-side.collapsed .brand-name { display: none; }
.dash-side.collapsed .dnav-item { justify-content: center; padding: 0; gap: 0; }
.dash-side.collapsed .dnav-item > span:not(.dnav-ico) { display: none; }
.dash-side.collapsed .side-scroll { display: none; }
.dash-side.collapsed .spacer { flex: 1; }
.dash-side.collapsed .dlogout { display: none; }

.dnav { display: flex; flex-direction: column; gap: 3px; }
.dnav-item { display: flex; align-items: center; gap: 13px; height: 40px; padding: 0 14px; border-radius: var(--r-md);
  color: var(--text-2); text-decoration: none; font-size: var(--t-15); font-weight: var(--w-medium); transition: background .15s, color .15s; }
.dnav-item .dnav-ico { display: flex; color: var(--text-3); transition: color .15s; }
.dnav-item:hover { color: var(--text); }
.dnav-item:hover .dnav-ico { color: var(--text); }
/* aktywna pozycja: płaska, identyczna jak reszta sidebara (1:1 izolat — bez pola/akcentu) */
.dnav-item.slim { justify-content: center; padding: 0; gap: 0; }
.dnav-ico { position: relative; }
.dnav-dot { position: absolute; top: -3px; right: -3px; width: 8px; height: 8px; border-radius: var(--r-full);
  background: var(--unpaid); box-shadow: 0 0 8px var(--unpaid); border: 1.5px solid var(--surface-solid); }
/* Czat: ikona w wewnętrznym spanie (by .dnav-dot przetrwał hydrację innerHTML); span ma układać svg
   jak gdyby był bezpośrednim dzieckiem .dnav-ico (flex), więc pozycja ikony = jak w innych pozycjach nav */
.dnav-ico > [data-ico] { display: flex; }

/* count badge inside section labels (np. Notatki domków) */
.side-glabel { display: flex; align-items: center; gap: 7px; }
.glabel-count { display: inline-flex; align-items: center; justify-content: center; min-width: 17px; height: 17px;
  padding: 0 5px; border-radius: var(--r-full); background: var(--fill-2); color: var(--text-2);
  font-size: 10px; font-weight: var(--w-bold); letter-spacing: 0; }

/* count "bańka" — używana wszędzie, gdzie pokazujemy liczbę */
.count-bubble { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px;
  padding: 0 6px; border-radius: var(--r-full); background: var(--fill-2); color: var(--text-2);
  font-size: var(--t-11); font-weight: var(--w-bold); font-variant-numeric: tabular-nums; line-height: 1; flex: 0 0 auto; }
.count-bubble.sm { min-width: 16px; height: 16px; padding: 0 5px; font-size: 10px; }
.count-bubble.tinted { background: color-mix(in srgb, var(--cc) 22%, transparent); color: var(--cc);
  box-shadow: 0 0 9px color-mix(in srgb, var(--cc) 30%, transparent); }

/* identyfikator wiersza: kolorowy domek + kółko statusu */
.row-id { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; margin-top: 1px; }
.row-house { display: flex; flex: 0 0 auto; filter: drop-shadow(0 0 6px currentColor); }

.side-scroll { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 12px 10px; }
/* gdy notatki są obecne, pusty .spacer nie może konkurować o wysokość z obszarem notatek
   (oba miały flex:1 i dzieliły miejsce po połowie → notatki znikały „pod" stopką). */
.side-scroll ~ .spacer { flex: 0 0 0; }
.side-sec .glabel { margin-bottom: 9px; }
.notes { display: flex; flex-direction: column; gap: 3px; }
.note-row { display: flex; align-items: flex-start; gap: 8px; padding: 5px 6px; border-radius: var(--r-sm); cursor: pointer; }
.note-row .note-house, .note-row .count-bubble { margin-top: -1px; }
.side-scroll .side-sec .glabel { margin-bottom: 5px; }
.side-scroll .notes { gap: 2px; }
.side-scroll .note-row { padding: 4px 6px; }
.note-row:hover .note-txt { color: var(--text); }
.note-house { flex: 0 0 auto; display: flex; filter: drop-shadow(0 0 6px currentColor); }
.note-count { width: 17px; flex: 0 0 auto; text-align: center; font-size: var(--t-13); font-weight: var(--w-black);
  line-height: 1; font-variant-numeric: tabular-nums; filter: drop-shadow(0 0 7px currentColor); }
.note-code { font-size: 11px; font-weight: var(--w-black); width: 17px; flex: 0 0 auto; opacity: .9; }
.note-txt { font-size: var(--t-12); color: var(--text-2); white-space: normal; overflow: visible; flex: 1 1 auto; min-width: 0; line-height: 1.3; }
.note-more { flex: 0 0 auto; font-size: 9px; font-weight: var(--w-bold); color: var(--text-3);
  background: var(--fill); border-radius: var(--r-full); padding: 1px 6px; line-height: 1.5; }
.note-empty { opacity: .6; }
.note-txt-empty { color: var(--text-4); font-style: italic; }
.side-stat { display: flex; align-items: baseline; justify-content: space-between; font-size: var(--t-13); color: var(--text-2); padding: 3px 2px; }
.side-stat b { font-size: var(--t-14); font-weight: var(--w-bold); color: var(--text); }
.side-stat b.accent { background: linear-gradient(120deg, var(--accent-hover), #18b4ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.side-cash { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sc-val { font-size: var(--t-20); font-weight: var(--w-black); letter-spacing: -0.03em; }
.sc-val.pos { color: var(--paid); }
.sc-lab { font-size: 11px; color: var(--text-3); margin-top: 1px; }

.dash-foot { display: flex; flex-direction: column; gap: 6px; }
.dlogout { display: flex; align-items: center; gap: 11px; height: 42px; padding: 0 14px; border-radius: var(--r-md);
  border: none; background: transparent; color: var(--text-3); font: inherit; font-size: var(--t-14); font-weight: var(--w-medium);
  cursor: pointer; transition: background .15s, color .15s; }
.dlogout:hover { background: var(--unpaid-soft); color: var(--unpaid); }

/* ---------- top bar ---------- */
.dash-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.dash-top { display: flex; align-items: center; gap: 12px; padding: 14px 18px 10px; }
.dtop-search { flex: 0 1 400px; display: flex; align-items: center; gap: 11px; height: 46px; padding: 0 18px;
  border-radius: var(--r-full); background: var(--surface-2); border: 0.5px solid var(--separator); box-shadow: var(--glass-edge); color: var(--text-3); position: relative; z-index: 60; }
.dtop-search.is-open { border-color: color-mix(in srgb, var(--accent) 55%, var(--separator)); box-shadow: 0 0 0 3px var(--accent-soft), var(--glass-edge); color: var(--text-2); }
.dtop-search input { border: none; background: transparent; outline: none; font: inherit; font-size: var(--t-14); color: var(--text); flex: 1; min-width: 0; }
.dtop-search input::placeholder { color: var(--text-3); }
/* lupka: v8 owija ikonę w <span data-ico> (izolat ma goły <svg>) — span ma wyższy line-box,
   więc svg dryfował ~2px w dół; flex-centrowanie kładzie ją 1:1 w jednej linii z tekstem */
.dtop-search > [data-ico] { flex: 0 0 auto; display: flex; align-items: center; }
.dtop-search-clear { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: var(--r-full);
  border: none; cursor: pointer; background: var(--fill); color: var(--text-2); }
.dtop-search-clear:hover { color: var(--text); }

/* scrim łapie kliknięcie poza wyszukiwarką */
.search-scrim { position: fixed; inset: 0; z-index: 50; }

/* panel wyników — szkło pod paskiem wyszukiwania */
.search-pop { position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 61;
  background: color-mix(in srgb, var(--surface-solid) 94%, transparent); border: 0.5px solid var(--separator); border-radius: var(--r-xl);
  box-shadow: var(--glass-edge), var(--shadow-lg); overflow: hidden;
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.search-pop-head { padding: 11px 16px; font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-2);
  border-bottom: 0.5px solid var(--separator); letter-spacing: .01em; }
.search-pop-list { max-height: 360px; overflow-y: auto; padding: 6px; display: flex; flex-direction: column; gap: 3px; }
.sres { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 9px 10px; border-radius: var(--r-md);
  border: none; cursor: pointer; background: transparent; font: inherit; }
.sres:hover { background: color-mix(in srgb, var(--cc) 12%, var(--surface-2)); }
.sres-ava { position: relative; flex: 0 0 auto; width: 34px; height: 34px; border-radius: var(--r-full); display: flex; align-items: center; justify-content: center;
  font-size: var(--t-14); font-weight: var(--w-bold); color: var(--cc);
  background: color-mix(in srgb, var(--cc) 18%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cc) 38%, transparent); }
.sres-pax { position: absolute; left: -3px; bottom: -3px; min-width: 16px; height: 16px; padding: 0 3px; border-radius: var(--r-full);
  display: flex; align-items: center; justify-content: center; box-sizing: border-box;
  font-size: 10px; font-weight: var(--w-bold); line-height: 1; color: #fff; background: var(--cc);
  box-shadow: 0 0 0 2px var(--surface-2); font-variant-numeric: tabular-nums; }
.sres-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sres-r1 { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sres-name { font-size: var(--t-14); font-weight: var(--w-semibold); letter-spacing: -0.01em; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 0 1 auto; }
.sres-phone { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; margin-left: auto; font-size: var(--t-12); color: var(--text-2);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.sres-phone svg { color: var(--text-3); }
.sres-lane { flex: 0 0 auto; font-size: 10px; font-weight: var(--w-bold); letter-spacing: .02em; color: #fff;
  background: var(--cc); border-radius: var(--r-sm); padding: 1px 6px; }
.sres-r2 { font-size: var(--t-12); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sres-chip { flex: 0 0 auto; }
/* popover footer — date shortcut hint (1:1 _isolate-szukaj-final .sc-tb-foot) */
.search-pop-foot { display: flex; align-items: center; gap: 7px; padding: 10px 14px; border-top: 0.5px solid var(--separator); font-size: var(--t-12); color: var(--text-3); }
.search-pop-foot b { color: var(--text-2); font-weight: var(--w-semibold); }
.search-pop-foot svg { flex: 0 0 auto; }

/* ---- panel wyszukiwania: zakładki gość / wolne terminy ---- */
.search-pop-tabs { display: flex; gap: 4px; padding: 8px; border-bottom: 0.5px solid var(--separator); }
.spt { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 36px; border-radius: var(--r-md); border: none; cursor: pointer; font: inherit;
  font-size: var(--t-12); font-weight: var(--w-semibold); letter-spacing: -0.01em;
  color: var(--text-2); background: transparent; transition: background .14s, color .14s; }
.spt:hover { background: var(--fill); color: var(--text); }
.spt.on { background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent); }

/* ---- pusty stan szukania gościa ---- */
.search-empty { padding: 22px 20px 26px; text-align: center; }
.search-empty-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px;
  border-radius: var(--r-full); background: var(--fill); color: var(--text-3); margin-bottom: 11px; }
.search-empty-t { font-size: var(--t-14); font-weight: var(--w-semibold); color: var(--text); }
.search-empty-s { font-size: var(--t-12); color: var(--text-3); margin-top: 5px; line-height: 1.55; }
.linkbtn { border: none; background: none; padding: 0; font: inherit; font-weight: var(--w-semibold);
  color: var(--accent-hover); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }

/* ---- kalkulator dostępności ---- */
.avail { padding: 12px; display: flex; flex-direction: column; gap: 9px; }
.avail-cal-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 0 2px; }
.avail-cal-title { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.02em; flex: 0 0 auto; }
.avail-cal-hint { font-size: var(--t-12); color: var(--text-2); display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.avail-cal-hint.both { color: var(--text); font-weight: var(--w-semibold); }
.avail-reset { border: none; background: var(--fill); color: var(--text-2); font: inherit; font-size: 10px; font-weight: var(--w-semibold);
  text-transform: uppercase; letter-spacing: .04em; padding: 3px 8px; border-radius: var(--r-full); cursor: pointer; }
.avail-reset:hover { background: var(--fill-2); color: var(--text); }

.avail-dow { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.avail-dow span { text-align: center; font-size: 10px; font-weight: var(--w-semibold); text-transform: uppercase; letter-spacing: .03em; color: var(--text-3); padding: 1px 0; }
.avail-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.cal-day { height: 34px; border: none; background: transparent; font: inherit; cursor: pointer; border-radius: var(--r-sm);
  display: flex; align-items: center; justify-content: center; font-size: var(--t-13); font-weight: var(--w-medium);
  color: var(--text); font-variant-numeric: tabular-nums; transition: background .12s, box-shadow .12s; }
.cal-day.blank { pointer-events: none; }
.cal-day.wknd { color: var(--text-2); }
.cal-day:hover:not(.blank) { background: var(--fill); }
.cal-day.today { box-shadow: inset 0 0 0 1px var(--accent); color: var(--accent-hover); }
.cal-day.inrange { background: var(--accent-soft); color: var(--text); }
.cal-day.preview { background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1.5px var(--accent); }
.cal-day.start, .cal-day.end { background: var(--accent); color: var(--on-accent); font-weight: var(--w-bold); box-shadow: var(--accent-glow); }

.avail-summary { font-size: var(--t-12); color: var(--text-2); padding: 0 4px; }
.avail-summary b { color: var(--text); font-size: var(--t-13); }
.avail-summary.none { color: var(--unpaid); font-weight: var(--w-semibold); }

.avail-list { display: flex; flex-direction: column; gap: 4px; max-height: 264px; overflow-y: auto; }
.avail-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-md); background: var(--fill); }
.avail-row.is-free { background: color-mix(in srgb, var(--paid) 13%, var(--surface-2));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--paid) 24%, transparent); }
.avail-house { flex: 0 0 auto; color: var(--cc); display: flex; }
.avail-dname { flex: 0 0 auto; font-size: var(--t-13); font-weight: var(--w-semibold); color: var(--text); }
.avail-free-chip { margin-left: auto; }
.avail-occ { display: flex; align-items: center; gap: 8px; margin-left: auto; min-width: 0; }
.avail-occ-d { font-size: var(--t-12); color: var(--text-3); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.avail-book { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px; height: 28px; padding: 0 11px;
  border-radius: var(--r-full); border: none; cursor: pointer; font: inherit; font-size: var(--t-12); font-weight: var(--w-semibold);
  background: var(--accent); color: var(--on-accent); box-shadow: var(--accent-glow); transition: background .14s; }
.avail-book:hover { background: var(--accent-hover); }
.dtop-new { height: 46px; }
.theme-toggle { display: flex; align-items: center; gap: 2px; padding: 4px; height: 42px; border-radius: var(--r-full);
  background: var(--surface-2); border: 0.5px solid var(--separator); box-shadow: var(--glass-edge); cursor: pointer; }
.tt-ic { width: 32px; height: 32px; border-radius: var(--r-full); display: flex; align-items: center; justify-content: center; color: var(--text-3); transition: .15s; }
/* aktywny motyw = wyraźne, osobne szklane „pole" (1:1 izolat) */
.tt-ic.on { color: var(--text);
  background: color-mix(in srgb, var(--surface) 82%, transparent);
  background-image: linear-gradient(180deg, rgba(255,255,255,0.18), rgba(255,255,255,0) 62%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.22), var(--shadow-sm); }
.dtop-bell, .dtop-chat { position: relative; }
.dtop-bell .dot, .dtop-chat .dot { position: absolute; top: 8px; right: 9px; width: 7px; height: 7px; border-radius: var(--r-full);
  background: var(--unpaid); box-shadow: 0 0 8px var(--unpaid); border: 1.5px solid var(--aurora-base); }
.dtop-user { position: relative; display: flex; align-items: center; gap: 10px; height: 46px; padding: 0 12px 0 6px; border-radius: var(--r-full);
  background: var(--surface-2); border: 0.5px solid var(--separator); box-shadow: var(--glass-edge); color: var(--text-3); cursor: pointer; }
.dtop-user.is-open { border-color: color-mix(in srgb, var(--accent) 50%, var(--separator)); box-shadow: 0 0 0 3px var(--accent-soft), var(--glass-edge); }
/* awatar AJ — szklany klejnot „Głęboki indygo" (1:1 izolat) */
.dtop-ava { width: 34px; height: 34px; border-radius: var(--r-full); flex: 0 0 auto; position: relative; overflow: hidden;
  background: linear-gradient(160deg, #4e48e0 0%, #1e1a9e 45%, #120e80 100%);
  color: #fff; display: flex; align-items: center; justify-content: center; font-weight: var(--w-bold); font-size: var(--t-13);
  box-shadow: 0 0 0 2px rgba(123,120,255,.4), 0 0 18px rgba(59,53,201,.8), 0 4px 14px rgba(0,0,0,.6), inset 0 2px 0 rgba(255,255,255,.35), inset 0 -2px 4px rgba(0,0,30,.6); }
.dtop-ava::before { content: ''; position: absolute; top: 3px; left: 5px; width: 52%; height: 44%; border-radius: 50%;
  background: radial-gradient(ellipse at 35% 25%, rgba(255,255,255,.6) 0%, rgba(255,255,255,0) 100%); pointer-events: none; }
.dtop-ava::after { content: ''; position: absolute; bottom: 3px; right: 4px; width: 35%; height: 28%; border-radius: 50%;
  background: radial-gradient(ellipse, rgba(123,120,255,.3) 0%, rgba(123,120,255,0) 100%); pointer-events: none; }
.dtop-meta { display: flex; flex-direction: column; line-height: 1.15; }
.dtop-meta b { font-size: var(--t-13); font-weight: var(--w-semibold); color: var(--text); }
.dtop-meta small { font-size: var(--t-11); color: var(--text-3); }

/* topbar „Więcej akcji" dropdown — anchored under .dtop-user (1:1 _isolate-menu-final .mn-*) */
.mn-aic { border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--ac) 16%, transparent); color: var(--ac);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ac) 32%, transparent), 0 0 14px color-mix(in srgb, var(--ac) 30%, transparent);
  transition: background .15s, color .15s, box-shadow .15s; }
.mn-dd { position: absolute; top: calc(100% + 11px); right: 0; z-index: 70; width: 372px;
  background: var(--surface); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  border: 0.5px solid var(--separator-strong); border-radius: var(--r-2xl);
  box-shadow: var(--glass-edge), var(--shadow-modal); overflow: hidden; }
.mn-dd::before { content: ''; position: absolute; top: -7px; right: 22px; width: 14px; height: 14px;
  background: var(--surface); border-left: 0.5px solid var(--separator-strong); border-top: 0.5px solid var(--separator-strong);
  transform: rotate(45deg); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.mn-dd-head { display: flex; align-items: center; gap: 10px; padding: 14px 16px 12px; border-bottom: 0.5px solid var(--separator); }
.mn-dd-title { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.01em; }
.mn-dd-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; }
.mn-dd-body { padding: 6px; }
.mn-dd-glab { padding: 11px 12px 6px; font-size: 10px; font-weight: var(--w-bold); letter-spacing: .09em; text-transform: uppercase; color: var(--text-4); }
.mn-mi { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; font: inherit; cursor: pointer;
  padding: 9px 10px; border-radius: var(--r-md); background: transparent; border: none; color: var(--text); transition: background .12s; }
.mn-mi .mn-aic { width: 30px; height: 30px; }
.mn-mi-name { flex: 1; min-width: 0; font-size: var(--t-14); font-weight: var(--w-medium); transition: color .15s, text-shadow .15s; }
.mn-mi .mn-mi-chev { display: flex; color: var(--text-4); transition: color .15s, transform .15s; }
.mn-mi:hover { background: var(--fill); }
.mn-mi:hover .mn-mi-name { color: #fff; text-shadow: 0 0 12px color-mix(in srgb, var(--ac) 60%, transparent); }
.mn-mi:hover .mn-aic { color: color-mix(in srgb, var(--ac) 78%, #fff); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ac) 48%, transparent), 0 0 16px color-mix(in srgb, var(--ac) 50%, transparent); }
.mn-mi:hover .mn-mi-chev { color: var(--ac); transform: translateX(2px); }
.mn-dd-sep { height: 0.5px; background: var(--separator); margin: 5px 10px; }

/* topbar „Centrum powiadomień" dropdown — anchored under .dtop-bell (1:1 _isolate-powiadomienia-final, opt5) */
.bellwrap { position: relative; display: inline-flex; align-items: center; }
.npop { position: absolute; top: calc(100% + 10px); right: 0; width: var(--npw, 440px); z-index: 70;
  background: var(--surface); border: 0.5px solid var(--separator); border-radius: var(--r-xl);
  box-shadow: var(--glass-edge), var(--shadow-lg); overflow: hidden; text-align: left;
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.npop::before { content: ''; position: absolute; top: -6px; right: 16px; width: 12px; height: 12px;
  background: var(--surface); border-left: 0.5px solid var(--separator); border-top: 0.5px solid var(--separator);
  transform: rotate(45deg); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.npop-head { display: flex; align-items: center; gap: 10px; padding: 13px 14px 11px; border-bottom: 0.5px solid var(--separator); }
.npop-title { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.02em; color: var(--text); display: inline-flex; align-items: center; gap: 8px; }
.npop-title .npop-hic { color: var(--accent); display: flex; }
.npop-list { max-height: 470px; overflow-y: auto; padding: 6px; display: flex; flex-direction: column; gap: 2px; }
.nrow { display: flex; align-items: flex-start; gap: 11px; width: 100%; text-align: left; padding: 10px 10px; border-radius: var(--r-md);
  border: none; cursor: pointer; background: transparent; font: inherit; position: relative; transition: background .14s; }
.nrow:hover { background: var(--fill); }
.nrow.is-unread { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.nrow.is-unread:hover { background: color-mix(in srgb, var(--accent) 13%, transparent); }
.nactor { position: relative; flex: 0 0 auto; width: 36px; height: 36px; border-radius: var(--r-full);
  display: flex; align-items: center; justify-content: center; font-size: var(--t-14); font-weight: var(--w-bold);
  color: var(--ac); background: color-mix(in srgb, var(--ac) 18%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ac) 42%, transparent); }
.nbadge { position: absolute; right: -3px; bottom: -3px; width: 17px; height: 17px; border-radius: var(--r-full);
  display: flex; align-items: center; justify-content: center; color: #fff; background: var(--bc, var(--accent));
  box-shadow: 0 0 0 2px var(--surface-2), 0 0 8px color-mix(in srgb, var(--bc, var(--accent)) 60%, transparent); }
.nbadge svg { width: 11px; height: 11px; }
.nbody { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.nline { font-size: var(--t-13); color: var(--text-2); line-height: 1.4; }
.nline b { color: var(--text); font-weight: var(--w-semibold); }
.nline .nact { color: var(--ac); font-weight: var(--w-semibold); }
.nmeta { display: flex; align-items: center; gap: 7px; min-width: 0; }
.ndomek { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; font-size: 10px; font-weight: var(--w-bold);
  color: #fff; background: var(--cc); border-radius: var(--r-sm); padding: 1px 6px; }
.nname { font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nquote { font-size: var(--t-12); color: var(--text-3); font-style: italic; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nright { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 0 0 auto; align-self: center; }
.ndot { width: 8px; height: 8px; border-radius: var(--r-full); background: var(--accent); box-shadow: 0 0 8px var(--accent); flex: 0 0 auto; }
.nchev { color: var(--text-4); display: flex; opacity: 0; transition: opacity .14s, color .14s, transform .14s; }
.nrow:hover .nchev { opacity: 1; color: var(--accent); transform: translateX(2px); }
.nsec { display: flex; align-items: center; gap: 8px; padding: 12px 12px 5px; }
.nsec-lab { font-size: var(--t-11); font-weight: var(--w-bold); letter-spacing: .07em; text-transform: uppercase; color: var(--text-3); }
.nsec-line { flex: 1; height: 0.5px; background: var(--separator); }
.nsec-n { font-size: 10px; font-weight: var(--w-bold); color: var(--text-3); }
.ntabs { display: flex; gap: 4px; padding: 8px; border-bottom: 0.5px solid var(--separator); }
.ntab { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 34px; border-radius: var(--r-md);
  border: none; cursor: pointer; font: inherit; font-size: var(--t-12); font-weight: var(--w-semibold); letter-spacing: -0.01em;
  color: var(--text-2); background: transparent; transition: background .14s, color .14s; white-space: nowrap; }
.ntab:hover { color: var(--text); }
.ntab.on { background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent); }
.ntab .ntab-n { font-size: 10px; font-weight: var(--w-bold); min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--r-full);
  display: inline-flex; align-items: center; justify-content: center; background: var(--fill); color: var(--text-3); }
.ntab.on .ntab-n { background: var(--accent); color: var(--on-accent); }
.npop-foot { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 9px; border-top: 0.5px solid var(--separator); }
.npop-foot-btn { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 14px; border-radius: var(--r-full);
  border: none; cursor: pointer; font: inherit; font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-2); background: var(--fill);
  transition: background .14s, color .14s; }
.npop-foot-btn:hover { background: var(--fill-2); color: var(--text); }
.npop-foot-btn svg { color: var(--accent); }
.npop-empty { padding: 34px 16px; text-align: center; font-size: var(--t-13); color: var(--text-3); }

/* „Jak korzystać" (pomoc) — szeroki modal z szukajką + lepkimi grupami (1:1 _isolate-pomoc-final .hp-*) */
.ed-sheet.hp-sheet { width: 720px; max-width: calc(100% - 56px); }
.hp-body { max-height: 720px; overflow-y: auto; }
.hp-headico { width: 46px; height: 46px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent), var(--accent-glow); }
.hp-tic { width: 34px; height: 34px; border-radius: var(--r-md); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--tc, var(--accent)) 18%, transparent); color: var(--tc, var(--accent));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc, var(--accent)) 32%, transparent), 0 0 14px color-mix(in srgb, var(--tc, var(--accent)) 32%, transparent);
  transition: box-shadow .18s, transform .12s; }
.hp-key-paid { color: var(--paid); font-weight: var(--w-semibold); }
.hp-srch-field { display: flex; align-items: center; gap: 11px; height: 48px; padding: 0 16px; margin-bottom: 14px;
  border-radius: var(--r-md); border: 1.5px solid var(--accent); background: var(--surface-2); box-shadow: 0 0 0 4px var(--accent-soft); }
.hp-srch-field > svg { color: var(--accent); flex: 0 0 auto; }
.hp-srch-field input { border: none; background: transparent; outline: none; font: inherit; font-size: var(--t-15); color: var(--text); flex: 1; min-width: 0; }
.hp-srch-field input::placeholder { color: var(--text-4); }
.hp-srch-side { flex: 0 0 auto; display: flex; align-items: center; }
.hp-srch-clear { width: 26px; height: 26px; border-radius: var(--r-full); border: none; cursor: pointer; flex: 0 0 auto;
  background: var(--fill-2); color: var(--text-2); display: flex; align-items: center; justify-content: center; transition: color .15s; }
.hp-srch-clear:hover { color: var(--text); }
.hp-srch-count { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-2);
  background: var(--fill); border: 0.5px solid var(--separator); border-radius: var(--r-full); padding: 4px 11px; }
.hp-srch-count b { color: var(--accent-hover); font-weight: var(--w-bold); }
.hp-groups { display: flex; flex-direction: column; gap: 20px; }
.hp-group { display: flex; flex-direction: column; gap: 8px; }
.hp-ghead { position: sticky; top: -7px; z-index: 5; display: flex; align-items: center; gap: 11px; padding: 9px 4px;
  background: linear-gradient(180deg, var(--surface-3) 72%, transparent); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.hp-gico { width: 30px; height: 30px; border-radius: var(--r-sm); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--gc, var(--accent)) 18%, transparent); color: var(--gc, var(--accent));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gc, var(--accent)) 32%, transparent), 0 0 12px color-mix(in srgb, var(--gc, var(--accent)) 34%, transparent); }
.hp-gtitle { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.01em; color: var(--text); flex: 1; min-width: 0; }
.hp-gtitle .hp-gsub { color: var(--text-3); font-weight: var(--w-semibold); }
.hp-gnum { flex: 0 0 auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-full);
  display: inline-flex; align-items: center; justify-content: center; font-size: var(--t-11); font-weight: var(--w-bold); font-variant-numeric: tabular-nums;
  color: var(--gc, var(--accent)); background: color-mix(in srgb, var(--gc, var(--accent)) 16%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gc, var(--accent)) 30%, transparent); }
.hp-rows { display: flex; flex-direction: column; gap: 8px; }
.hp-row { display: flex; align-items: flex-start; gap: 13px; padding: 12px 14px; border-radius: var(--r-md);
  background: color-mix(in srgb, var(--tc, var(--accent)) 8%, var(--surface-2));
  border: 0.5px solid color-mix(in srgb, var(--tc, var(--accent)) 22%, var(--separator)); transition: border-color .15s, box-shadow .15s; }
.hp-row:hover { border-color: color-mix(in srgb, var(--tc) 48%, var(--separator)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--tc) 22%, transparent); }
.hp-row:hover .hp-tic { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tc) 50%, transparent), 0 0 22px color-mix(in srgb, var(--tc) 55%, transparent); }
.hp-row-tic { margin-top: 1px; }
.hp-row-main { flex: 1; min-width: 0; }
.hp-row-q { font-size: var(--t-14); font-weight: var(--w-bold); color: var(--text); letter-spacing: -0.01em; }
.hp-row-q mark { background: var(--accent-soft); color: var(--accent-hover); border-radius: 3px; padding: 0 2px; font-weight: var(--w-bold); }
.hp-row-a { margin: 3px 0 0; font-size: var(--t-13); line-height: 1.5; color: var(--text-2); }
.hp-row-a b { color: var(--text); font-weight: var(--w-semibold); }
.hp-addrow { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.hp-add { width: 27px; height: 27px; border-radius: 8px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--ac) 18%, transparent); color: var(--ac); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ac) 30%, transparent); }
.hp-mini { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 7px; }
.hp-egg { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 11px; border-radius: var(--r-full);
  font-size: var(--t-12); font-weight: var(--w-semibold); background: var(--fill); border: 0.5px solid var(--separator); color: var(--text-2); }
.hp-egg .hp-egg-dot { width: 8px; height: 8px; border-radius: var(--r-full); background: var(--eg, var(--accent)); box-shadow: 0 0 8px var(--eg, var(--accent)); }
.hp-row-from { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: var(--t-11); font-weight: var(--w-semibold); color: var(--gc, var(--text-3));
  background: color-mix(in srgb, var(--gc, var(--accent)) 12%, transparent); border: 0.5px solid color-mix(in srgb, var(--gc, var(--accent)) 26%, transparent);
  border-radius: var(--r-full); padding: 2px 9px 2px 7px; }
.hp-row-from svg { color: var(--gc, var(--text-3)); }
.hp-empty { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 44px 16px 36px; text-align: center; }
.hp-empty-ic { width: 48px; height: 48px; border-radius: var(--r-full); display: flex; align-items: center; justify-content: center; background: var(--fill); color: var(--text-3); }
.hp-empty-t { font-size: var(--t-14); font-weight: var(--w-semibold); }
.hp-empty-s { font-size: var(--t-12); color: var(--text-3); max-width: 280px; line-height: 1.5; }

/* iCal „Krok po kroku" — wide no-scroll modal: 6 cottage links (2-col) + steps + warn (1:1 _isolate-ical-final .ic-*) */
.ed-sheet.ic-sheet { width: 880px; max-width: calc(100% - 56px); display: flex; flex-direction: column; }
.ic-sheet .ed-head, .ic-sheet .ed-foot { flex: 0 0 auto; }
.ic-sheet .ed-fields { display: flex; flex-direction: column; gap: 13px; padding: 15px 18px 14px; }
.ic-headico { width: 46px; height: 46px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent), var(--accent-glow); }
.ic-warn { display: flex; align-items: center; gap: 11px; padding: 9px 13px; border-radius: var(--r-md);
  background: color-mix(in srgb, var(--warning) 13%, transparent); border: 0.5px solid color-mix(in srgb, var(--warning) 42%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--warning) 12%, transparent), 0 0 22px color-mix(in srgb, var(--warning) 20%, transparent); }
.ic-warn-ic { width: 27px; height: 27px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  color: var(--warning); background: color-mix(in srgb, var(--warning) 20%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--warning) 40%, transparent), 0 0 14px color-mix(in srgb, var(--warning) 45%, transparent); }
.ic-warn-tx { font-size: var(--t-13); line-height: 1.4; color: var(--text); }
.ic-warn-tx b { color: var(--warning); font-weight: var(--w-bold); }
.ic-dbadge { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px 0 8px; border-radius: var(--r-full);
  flex: 0 0 auto; font-size: var(--t-13); font-weight: var(--w-bold); letter-spacing: -0.01em; color: var(--dc, var(--text));
  background: color-mix(in srgb, var(--dc) 16%, transparent); border: 0.5px solid color-mix(in srgb, var(--dc) 38%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dc) 14%, transparent), 0 0 12px color-mix(in srgb, var(--dc) 28%, transparent); }
.ic-dbadge .ic-db-ic { display: flex; color: var(--dc); }
.ic-code { flex: 1; min-width: 0; height: 32px; display: flex; align-items: center; padding: 0 11px; border-radius: var(--r-md);
  background: var(--surface-2); border: 0.5px solid var(--separator);
  font-family: "SF Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace; font-size: var(--t-12); color: var(--text-2); letter-spacing: 0;
  overflow-x: auto; white-space: nowrap; scrollbar-width: none; -webkit-user-select: all; user-select: all; }
.ic-code::-webkit-scrollbar { display: none; }
.ic-code .ic-code-dim { color: var(--text-3); }
.ic-code .ic-code-hash { color: var(--dc, var(--accent-hover)); font-weight: var(--w-semibold); }
.ic-copy { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 32px; padding: 0 11px; border-radius: var(--r-full);
  flex: 0 0 auto; cursor: pointer; font: inherit; font-size: var(--t-12); font-weight: var(--w-semibold);
  color: var(--text-2); background: var(--fill); border: 0.5px solid var(--separator-strong); transition: color .15s, box-shadow .15s, background .15s, transform .1s; }
.ic-copy .ic-copy-ic { display: flex; color: currentColor; }
.ic-copy:hover { color: var(--dc, var(--accent-hover));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--dc, var(--accent)) 16%, transparent), 0 0 18px color-mix(in srgb, var(--dc, var(--accent)) 50%, transparent); }
.ic-copy:active { transform: scale(.96); }
.ic-copy.is-done { color: var(--paid); border-color: color-mix(in srgb, var(--paid) 45%, transparent); background: var(--paid-soft); }
.ic-copy.is-done:hover { box-shadow: 0 0 0 3px var(--paid-soft), 0 0 18px color-mix(in srgb, var(--paid) 50%, transparent); }
.ic-sync { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-11); color: var(--text-3); white-space: nowrap; }
.ic-sync .ic-sync-dot { width: 6px; height: 6px; border-radius: var(--r-full); background: var(--paid); box-shadow: 0 0 8px var(--paid); flex: 0 0 auto; }
.ic-sync.is-never .ic-sync-dot { background: var(--text-4); box-shadow: none; }
.ic-steps { display: flex; flex-direction: column; gap: 12px; }
.ic-step { display: flex; gap: 12px; align-items: flex-start; }
.ic-num { width: 28px; height: 28px; border-radius: var(--r-full); flex: 0 0 auto; margin-top: 1px; display: flex; align-items: center; justify-content: center;
  font-size: var(--t-14); font-weight: var(--w-bold); color: #fff; background: linear-gradient(140deg, var(--accent), #5b6bff);
  box-shadow: var(--accent-glow), inset 0 1px 0 rgba(255,255,255,.3); }
.ic-stepbody { flex: 1; min-width: 0; }
.ic-steptitle { font-size: var(--t-14); font-weight: var(--w-semibold); color: var(--text); }
.ic-steptitle .ic-tag { color: var(--accent-hover); }
.ic-stepsub { font-size: var(--t-12); color: var(--text-3); line-height: 1.4; margin-top: 2px; }
.ic-links { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; padding: 10px; border-radius: var(--r-md); background: var(--fill); border: 0.5px solid var(--separator); }
.ic-link { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: var(--r-md); background: var(--surface-2);
  border: 0.5px solid var(--separator); border-left: 3px solid var(--dc); min-width: 0; transition: box-shadow .15s, border-color .15s; }
.ic-link:hover { box-shadow: 0 0 20px color-mix(in srgb, var(--dc) 22%, transparent); }
.ic-link .ic-link-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; }
.ic-step2grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.ic-platforms { display: flex; gap: 8px; margin-top: 9px; flex-wrap: wrap; }
.ic-plat { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 12px; border-radius: var(--r-full); font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-2); background: var(--surface-2); border: 0.5px solid var(--separator); }
.ic-plat .ic-plat-dot { width: 8px; height: 8px; border-radius: 3px; flex: 0 0 auto; }

/* „Wyślij SMS do gości" — szablony + treść + lista odbiorców z filtrem (sms-*) */
.ed-sheet.sms-sheet { width: 480px; max-width: calc(100% - 48px); }
.sms-headico { width: 46px; height: 46px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--c4) 16%, transparent); color: var(--c4);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c4) 32%, transparent), 0 0 18px color-mix(in srgb, var(--c4) 34%, transparent); }
.sms-sheet .ed-fields { gap: 14px; }
.sms-sec { display: flex; flex-direction: column; gap: 8px; }
.sms-lab { font-size: var(--t-12); font-weight: var(--w-bold); letter-spacing: .02em; color: var(--text-2); }
/* szablony */
.sms-tpls { display: flex; flex-wrap: wrap; gap: 7px; }
.sms-tpl { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 13px 0 10px; border-radius: var(--r-full);
  font: inherit; font-size: var(--t-13); font-weight: var(--w-semibold); color: var(--text-2); cursor: pointer;
  background: var(--surface-2); border: 0.5px solid var(--separator); transition: color .15s, background .15s, box-shadow .15s, border-color .15s; }
.sms-tpl .sms-tpl-ic { display: flex; color: var(--ac); }
.sms-tpl:hover { color: #fff; box-shadow: 0 0 16px color-mix(in srgb, var(--ac) 45%, transparent); }
.sms-tpl.is-on { color: #fff; background: color-mix(in srgb, var(--ac) 18%, transparent); border-color: color-mix(in srgb, var(--ac) 50%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ac) 32%, transparent), 0 0 16px color-mix(in srgb, var(--ac) 40%, transparent); }
/* treść */
.sms-text { width: 100%; box-sizing: border-box; resize: vertical; min-height: 92px; padding: 11px 13px; border-radius: var(--r-md);
  font: inherit; font-size: var(--t-14); line-height: 1.45; color: var(--text);
  background: var(--surface-2); border: 0.5px solid var(--separator); transition: border-color .15s, box-shadow .15s; }
.sms-text:focus { outline: none; border-color: color-mix(in srgb, var(--accent) 55%, transparent); box-shadow: 0 0 0 3px var(--accent-soft); }
.sms-text::placeholder { color: var(--text-4); }
.sms-count { font-size: var(--t-12); color: var(--text-3); font-variant-numeric: tabular-nums; align-self: flex-end; }
/* nagłówek odbiorców + zaznacz/odznacz */
.sms-rhead { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.sms-cap { font-size: var(--t-12); font-weight: var(--w-bold); color: var(--accent-hover); font-variant-numeric: tabular-nums; margin-left: 4px; }
.sms-allbtn { border: none; background: var(--fill); color: var(--text-2); font: inherit; font-size: var(--t-12); font-weight: var(--w-semibold);
  height: 28px; padding: 0 11px; border-radius: var(--r-full); cursor: pointer; transition: color .15s, background .15s, box-shadow .15s; }
.sms-allbtn:hover { color: #fff; background: var(--fill-2); box-shadow: 0 0 12px color-mix(in srgb, var(--accent) 35%, transparent); }
.sms-note { font-size: var(--t-12); color: var(--text-3); }
/* wyszukiwarka odbiorców */
.sms-searchwrap { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border-radius: var(--r-md);
  background: var(--surface-2); border: 0.5px solid var(--separator); transition: border-color .15s, box-shadow .15s; }
.sms-searchwrap:focus-within { border-color: color-mix(in srgb, var(--accent) 55%, transparent); box-shadow: 0 0 0 3px var(--accent-soft); }
.sms-search-ic { display: flex; color: var(--text-3); flex: 0 0 auto; }
.sms-search { flex: 1; min-width: 0; border: none; background: transparent; font: inherit; font-size: var(--t-14); color: var(--text); }
.sms-search:focus { outline: none; }
.sms-search::placeholder { color: var(--text-4); }
/* lista odbiorców */
.sms-rcpts { display: flex; flex-direction: column; gap: 2px; max-height: 230px; overflow-y: auto; padding: 2px; margin: 0 -2px; }
.sms-rcpt { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; padding: 8px 9px; border-radius: var(--r-md);
  border: none; cursor: pointer; background: transparent; font: inherit; transition: background .12s; }
.sms-rcpt:hover { background: var(--fill); }
.sms-rcpt.is-on { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.sms-rcpt.is-on:hover { background: color-mix(in srgb, var(--accent) 13%, transparent); }
.sms-rk-check { flex: 0 0 auto; width: 20px; height: 20px; border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center;
  color: #fff; background: var(--surface); border: 1.5px solid var(--separator-strong); transition: background .12s, border-color .12s; }
.sms-rcpt.is-on .sms-rk-check { background: var(--accent); border-color: transparent; box-shadow: var(--accent-glow); }
.sms-rk-ava { flex: 0 0 auto; width: 32px; height: 32px; border-radius: var(--r-full); display: flex; align-items: center; justify-content: center;
  font-size: var(--t-13); font-weight: var(--w-bold); color: var(--accent-hover);
  background: var(--accent-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent); }
.sms-rk-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.sms-rk-name { display: flex; align-items: center; gap: 7px; font-size: var(--t-14); font-weight: var(--w-semibold); color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sms-rk-badge { flex: 0 0 auto; font-size: 10px; font-weight: var(--w-bold); letter-spacing: .02em; text-transform: uppercase;
  color: var(--paid); background: color-mix(in srgb, var(--paid) 16%, transparent); border-radius: var(--r-sm); padding: 1px 6px; }
.sms-rk-phone { display: inline-flex; align-items: center; gap: 5px; font-size: var(--t-12); color: var(--text-2); font-variant-numeric: tabular-nums; }
.sms-rk-phone svg { color: var(--text-3); }
.sms-empty { padding: 18px 12px; text-align: center; font-size: var(--t-13); color: var(--text-3); }
/* stopka — kopiowanie + wyślij */
.sms-foot { flex-wrap: wrap; }
.sms-copybtn, .sms-sendbtn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 40px; padding: 0 16px;
  border-radius: var(--r-full); font: inherit; font-size: var(--t-14); font-weight: var(--w-semibold); cursor: pointer;
  transition: color .15s, background .15s, box-shadow .15s, opacity .15s; }
.sms-copybtn { background: var(--fill); border: 0.5px solid var(--separator-strong); color: var(--text-2); }
.sms-copybtn .sms-cp-ic { display: flex; color: var(--text-3); }
.sms-copybtn:hover { color: #fff; box-shadow: 0 0 14px color-mix(in srgb, var(--accent) 30%, transparent); }
.sms-sendbtn { flex: 1; min-width: 140px; border: none; color: #fff;
  background: linear-gradient(140deg, var(--c4), #b06bff); box-shadow: 0 0 18px color-mix(in srgb, var(--c4) 45%, transparent); }
.sms-sendbtn:hover { box-shadow: 0 0 26px color-mix(in srgb, var(--c4) 60%, transparent); }
.sms-copybtn:disabled, .sms-sendbtn:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.sms-copybtn:disabled:hover { color: var(--text-2); box-shadow: none; }
.sms-sendbtn:disabled:hover { box-shadow: none; }

/* „Wolny termin?" — Macierz dostępności 6 domków × noce + kalendarz 2-krok (1:1 _isolate-dostepnosc-final .av-*) */
.av-ico { width: 46px; height: 46px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent), var(--accent-glow); }
.ed-sheet.av-sheet { width: 880px; max-width: calc(100% - 64px); }
.av-sheet .ed-fields { padding-bottom: 22px; }
.av-range { display: flex; align-items: stretch; gap: 12px; }
.av-slot { flex: 1; min-width: 0; text-align: left; cursor: pointer; font: inherit; display: flex; flex-direction: column; gap: 4px; padding: 11px 15px; border-radius: var(--r-lg);
  border: 0.5px solid var(--separator); background: var(--fill); transition: background .15s, border-color .15s, box-shadow .15s, color .15s; }
.av-slot:hover { background: var(--fill-2); }
.av-slot.is-active { background: var(--accent-soft); border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), var(--accent-glow); }
.av-slot.is-active .av-slot-lab, .av-slot.is-active .av-slot-lab .av-slot-ic { color: var(--accent-hover); }
.av-slot-lab { display: flex; align-items: center; gap: 7px; font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); transition: color .15s; }
.av-slot-lab .av-slot-ic { display: flex; color: var(--text-3); transition: color .15s; }
.av-slot-val { font-size: var(--t-17); font-weight: var(--w-bold); letter-spacing: -0.02em; color: var(--text); font-variant-numeric: tabular-nums; }
.av-nights-pill { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 0 18px; border-radius: var(--r-lg);
  background: var(--accent-soft); border: 0.5px solid color-mix(in srgb, var(--accent) 30%, transparent); }
.av-nights-pill b { font-size: var(--t-24); font-weight: var(--w-black); letter-spacing: -0.03em; color: var(--accent-hover); line-height: 1; text-shadow: var(--accent-glow); }
.av-nights-pill span { font-size: 10px; font-weight: var(--w-semibold); text-transform: uppercase; letter-spacing: .06em; color: var(--text-3); }
.av-sumbar { display: flex; align-items: center; gap: 11px; padding: 2px 2px 0; }
.av-sum-big { display: inline-flex; align-items: baseline; gap: 3px; }
.av-sum-big b { font-size: var(--t-20); font-weight: var(--w-black); letter-spacing: -0.03em; color: var(--paid); text-shadow: 0 0 18px var(--paid-soft); }
.av-sum-big span { font-size: var(--t-13); color: var(--text-3); font-weight: var(--w-semibold); }
.av-sum-lab { font-size: var(--t-13); color: var(--text-2); }
.av-sum-lab b { color: var(--text); font-weight: var(--w-semibold); }
.av-sum-spacer { flex: 1; }
.av-sum-hint { display: inline-flex; align-items: center; gap: 7px; font-size: var(--t-12); color: var(--text-3); }
.av-sum-hint .av-sh-ic { display: flex; color: var(--accent); }
.av-matrix { border-radius: var(--r-xl); border: 0.5px solid var(--separator); background: var(--surface-2); overflow: hidden;
  box-shadow: var(--glass-edge), var(--shadow-sm); display: grid; grid-template-columns: 208px 1fr; }
.av-mx-left { border-right: 0.5px solid var(--separator-strong); background: color-mix(in srgb, var(--fill) 60%, var(--surface-2)); z-index: 3; }
.av-mx-corner { height: 50px; display: flex; align-items: center; padding: 0 14px; border-bottom: 0.5px solid var(--separator); }
.av-mx-corner .mc-lab { font-size: 10px; font-weight: var(--w-bold); letter-spacing: .08em; text-transform: uppercase; color: var(--text-4); }
.av-mx-rowhead { height: 62px; display: flex; align-items: center; gap: 11px; padding: 0 14px; border-bottom: 0.5px solid var(--separator); transition: background .15s; }
.av-mx-left .av-mx-rowhead:last-child { border-bottom: none; }
.av-mx-rowhead.is-free { cursor: pointer; }
.av-mx-rowhead.is-free:hover { background: color-mix(in srgb, var(--paid) 9%, transparent); }
.av-mx-rowhead .av-hstack { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; color: var(--cc); }
.av-mx-rowhead .lane-house { display: flex; filter: drop-shadow(0 0 7px currentColor); }
.av-mx-rowhead .lane-dcode { font-size: var(--t-17); font-weight: var(--w-bold); }
.av-mh-main { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.av-mh-stat { display: inline-flex; align-items: center; gap: 6px; height: 25px; padding: 0 11px; border-radius: var(--r-full); font-size: var(--t-13); font-weight: var(--w-bold); letter-spacing: -0.01em; }
.av-mh-stat.free { color: var(--paid); background: color-mix(in srgb, var(--paid) 15%, transparent); border: 0.5px solid color-mix(in srgb, var(--paid) 34%, var(--separator)); }
.av-mh-stat.busy { color: var(--unpaid); background: color-mix(in srgb, var(--unpaid) 15%, transparent); border: 0.5px solid color-mix(in srgb, var(--unpaid) 34%, var(--separator)); }
.av-mh-stat svg { filter: drop-shadow(0 0 6px currentColor); }
.av-mh-go { display: inline-flex; align-items: center; gap: 5px; padding-left: 3px; font-size: var(--t-13); font-weight: var(--w-semibold); color: var(--accent-hover); transition: color .15s, transform .15s; }
.av-mx-rowhead.is-free:hover .av-mh-stat { filter: brightness(1.14); text-shadow: 0 0 11px color-mix(in srgb, var(--paid) 45%, transparent); }
.av-mx-rowhead.is-free:hover .av-mh-go { color: var(--text-2); transform: translateX(2px); }
.av-mx-scroll { overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; position: relative; cursor: grab; }
.av-mx-scroll.dragging { scroll-behavior: auto; }   /* podczas ciągnięcia — natychmiastowe przewijanie (jak kalendarz), bez smooth */
.av-mx-scroll::-webkit-scrollbar { height: 8px; }
.av-mx-scroll::-webkit-scrollbar-thumb { background: var(--fill-2); border-radius: 999px; }
.av-mx-scroll::-webkit-scrollbar-track { background: transparent; }
.av-mx-track { position: relative; }
.av-mx-days { display: grid; height: 50px; border-bottom: 0.5px solid var(--separator); }
.av-mx-day { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border-right: 0.5px solid var(--separator); }
.av-mx-day:last-child { border-right: none; }
.av-mx-day .md-d { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.av-mx-day .md-w { font-size: 10px; font-weight: var(--w-semibold); text-transform: uppercase; letter-spacing: .04em; color: var(--text-3); }
.av-mx-day.wknd .md-d, .av-mx-day.wknd .md-w { color: color-mix(in srgb, var(--unpaid) 72%, var(--text-2)); }
.av-mx-day.in-sel { background: var(--accent-soft); }
.av-mx-day.in-sel .md-d { color: var(--accent-hover); }
.av-mx-cells { display: grid; height: 62px; position: relative; border-bottom: 0.5px solid var(--separator); }
.av-mx-track .av-mx-cells:last-child { border-bottom: none; }
.av-mx-cell { border-right: 0.5px solid var(--separator); display: flex; align-items: center; justify-content: center; }
.av-mx-cell:last-child { border-right: none; }
.av-mx-cell.in-sel { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.av-mx-cell.free-sel { background: color-mix(in srgb, var(--paid) 12%, transparent); color: var(--paid); cursor: pointer; transition: background .14s; }
.av-mx-cell.free-sel:hover { background: color-mix(in srgb, var(--paid) 22%, transparent); }
.av-mx-cell.free-sel svg { filter: drop-shadow(0 0 6px color-mix(in srgb, var(--paid) 60%, transparent)); }
.av-mx-cell.nogo-sel { background: color-mix(in srgb, var(--unpaid) 13%, transparent); color: var(--unpaid); cursor: default; }
.av-mx-cell.nogo-sel svg { filter: drop-shadow(0 0 6px color-mix(in srgb, var(--unpaid) 55%, transparent)); }
.av-stay { position: absolute; top: 9px; bottom: 9px; border-radius: var(--r-md); display: flex; align-items: center; gap: 8px; padding: 0 11px; overflow: hidden; pointer-events: none;
  background: linear-gradient(135deg, color-mix(in srgb, var(--cc) 34%, rgba(20,20,30,0.46)), color-mix(in srgb, var(--cc) 18%, rgba(20,20,30,0.38)));
  border: 0.5px solid color-mix(in srgb, var(--cc) 46%, var(--separator)); box-shadow: 0 3px 12px color-mix(in srgb, var(--cc) 26%, transparent), inset 0 1px 0 rgba(255,255,255,.10); }
.av-stay-ava { width: 26px; height: 26px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-size: var(--t-11); font-weight: var(--w-bold); color: #fff; background: var(--cc); box-shadow: 0 0 10px color-mix(in srgb, var(--cc) 55%, transparent); }
.av-stay-name { font-size: var(--t-13); font-weight: var(--w-bold); letter-spacing: -0.01em; color: var(--text); white-space: nowrap; }
.av-stay-name small { display: block; font-size: 10px; font-weight: var(--w-semibold); color: color-mix(in srgb, var(--cc) 50%, var(--text-3)); letter-spacing: 0; }
.av-cal-scrim { position: absolute; inset: 0; z-index: 50; background: rgba(4,4,10,.42); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); display: flex; align-items: center; justify-content: center; padding: 24px; }
.av-cal-pop { width: 340px; max-width: 100%; background: var(--surface); border: 0.5px solid var(--separator-strong); border-radius: var(--r-2xl);
  box-shadow: var(--glass-edge), var(--shadow-modal); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); padding: 18px 20px 20px; }
.av-cal-step { display: flex; align-items: center; gap: 11px; padding-bottom: 14px; margin-bottom: 4px; border-bottom: 0.5px solid var(--separator); }
.av-cal-stepic { width: 38px; height: 38px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 32%, transparent), var(--accent-glow); }
.av-cal-steptext { flex: 1; min-width: 0; }
.av-cal-stepk { font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); }
.av-cal-stepv { font-size: var(--t-17); font-weight: var(--w-bold); letter-spacing: -0.02em; margin-top: 1px; }
.av-cal-close { width: 34px; height: 34px; }
.av-cal-head { display: flex; align-items: center; gap: 8px; padding: 12px 0 10px; }
.av-cal-nav { width: 30px; height: 30px; border-radius: var(--r-full); flex: 0 0 auto; border: 0.5px solid var(--separator); background: var(--fill); color: var(--text-2);
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s, color .15s; }
.av-cal-nav:hover { background: var(--fill-2); color: var(--text); }
.av-cal-title { flex: 1; text-align: center; font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.cal-day.is-locked { opacity: .26; pointer-events: none; }
.av-cal-foot { font-size: var(--t-12); color: var(--text-3); text-align: center; padding-top: 12px; }
.av-cal-foot b { color: var(--accent-hover); font-weight: var(--w-semibold); }

/* „+ Dodaj info" — domek-picker + autocomplete + Tarcza + podgląd (1:1 _isolate-dodajinfo-final, di- i dtp- prefixy) */
.ed-sheet.di-sheet { width: 510px; max-width: calc(100% - 48px); overflow: visible; }   /* visible → autocomplete + Tarcza popover nie przycięte */
.di-ico { width: 46px; height: 46px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent), var(--accent-glow);
  transition: background .2s, color .2s, box-shadow .2s; }
.di-ico[data-sc] { background: color-mix(in srgb, var(--sc) 18%, transparent); color: var(--sc);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sc) 34%, transparent), 0 0 18px color-mix(in srgb, var(--sc) 42%, transparent); }
.di-mini-lab { font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); margin-bottom: 7px; }
.di-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.di-pill { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px; border-radius: var(--r-full); cursor: pointer; font: inherit;
  font-size: var(--t-14); font-weight: var(--w-semibold); color: var(--text-2); background: var(--surface-2); border: 0.5px solid var(--separator);
  transition: background .15s, color .15s, border-color .15s, box-shadow .15s; }
.di-pill .di-pill-dot { width: 9px; height: 9px; border-radius: var(--r-full); flex: 0 0 auto; background: var(--pc, var(--text-3)); }
.di-pill:hover { color: var(--text); }
.di-pill.is-on { color: #fff; border-color: transparent; background: linear-gradient(135deg, color-mix(in srgb, var(--pc) 88%, #fff 4%), var(--pc));
  box-shadow: 0 4px 14px color-mix(in srgb, var(--pc) 45%, transparent), inset 0 1px 0 rgba(255,255,255,.28); }
.di-pill.is-on .di-pill-dot { background: rgba(255,255,255,.92); }
.di-pill.di-pill-gen { --pc: var(--text-3); }
.di-pill.di-pill-gen.is-on { background: var(--fill-2); color: var(--text); border-color: var(--separator-strong); box-shadow: var(--shadow-sm); }
.di-pill.di-pill-gen.is-on .di-pill-dot { background: var(--text-2); }
.di-pill .di-pill-ic { display: flex; color: currentColor; opacity: .85; }
.di-ac { position: relative; }
.di-ac-input { position: relative; }
.di-ac-input .di-ac-lead { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); display: flex; color: var(--ac, var(--text-3)); pointer-events: none;
  transition: color .2s; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--ac, transparent) 55%, transparent)); }
.di-ac-input .input { padding-left: 38px; }
.di-ac-menu { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 60; background: var(--surface);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); border: 0.5px solid var(--separator); border-radius: var(--r-lg);
  box-shadow: var(--glass-edge), var(--shadow-lg); padding: 5px; max-height: 252px; overflow-y: auto; }
.di-ac-group { font-size: 10px; font-weight: var(--w-bold); letter-spacing: .08em; text-transform: uppercase; color: var(--text-4); padding: 8px 10px 5px; }
.di-ac-opt { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border-radius: var(--r-md); cursor: pointer; font: inherit;
  background: transparent; border: none; color: var(--text); text-align: left; transition: background .12s; }
.di-ac-opt:hover, .di-ac-opt.is-act { background: var(--fill-2); }
.di-ac-opt .di-ac-oic { width: 28px; height: 28px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--oc) 18%, transparent); color: var(--oc); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--oc) 32%, transparent); }
.di-ac-otext { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.di-ac-olab { font-size: var(--t-14); font-weight: var(--w-semibold); line-height: 1.1; }
.di-ac-olab .hl { color: var(--accent-hover); font-weight: var(--w-bold); }
.di-ac-ocat { font-size: var(--t-11); color: var(--text-4); }
.di-ac-empty { padding: 12px; font-size: var(--t-13); color: var(--text-3); }
.di-timerow { display: flex; align-items: center; gap: 10px; position: relative; }
.di-time-toggle { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 13px; border-radius: var(--r-full); cursor: pointer; font: inherit;
  font-size: var(--t-13); font-weight: var(--w-semibold); color: var(--text-2); background: var(--fill); border: 0.5px solid var(--separator);
  transition: background .15s, color .15s, box-shadow .15s, border-color .15s; flex: 0 0 auto; }
.di-time-toggle .di-tt-box { width: 18px; height: 18px; border-radius: 6px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--separator-strong); color: transparent; transition: background .15s, border-color .15s, color .15s; }
.di-time-toggle.is-on { color: var(--accent-hover); border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: var(--accent-soft); }
.di-time-toggle.is-on .di-tt-box { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 0 10px color-mix(in srgb, var(--accent) 60%, transparent); }
.di-dial-pop { position: absolute; top: calc(100% + 8px); right: 0; z-index: 70; background: var(--surface);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); border: 0.5px solid var(--separator); border-radius: var(--r-xl);
  box-shadow: var(--glass-edge), var(--shadow-lg); padding: 16px 18px 14px; display: flex; flex-direction: column; align-items: center; gap: 12px; width: 268px; }
.dtp-readout { display: flex; align-items: baseline; justify-content: center; gap: 2px; font-size: 40px; font-weight: var(--w-bold); letter-spacing: -0.02em; line-height: 1; font-variant-numeric: tabular-nums; }
.ro-part { cursor: pointer; color: var(--text-3); padding: 0 2px; border-radius: var(--r-xs); transition: color .15s, text-shadow .15s; }
.ro-part:hover { color: var(--text-2); }
.ro-part.is-on { color: var(--accent-hover); text-shadow: var(--accent-glow); }
.ro-colon { color: var(--text-3); font-weight: var(--w-bold); }
.dtp-steplab { display: flex; gap: 6px; font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .06em; text-transform: uppercase; }
.dtp-steplab span { color: var(--text-3); transition: color .15s; }
.dtp-steplab span.on { color: var(--accent-hover); }
.dtp-steplab .sl-sep { color: var(--text-4); }
.dtp-dial { position: relative; width: 230px; height: 230px; border-radius: var(--r-full); flex: 0 0 auto;
  background: radial-gradient(circle at 50% 36%, var(--fill-2), var(--fill)); border: 0.5px solid var(--separator); box-shadow: inset 0 1px 0 rgba(255,255,255,.10); }
.dtp-dial::after { content: ''; position: absolute; left: 50%; top: 50%; width: 124px; height: 124px; margin: -62px 0 0 -62px; border-radius: var(--r-full);
  border: 0.5px solid var(--separator); opacity: .5; pointer-events: none; }
.dtp-dial.is-min::after { display: none; }
.dtp-num { position: absolute; width: 32px; height: 32px; margin: -16px 0 0 -16px; border-radius: var(--r-full); border: 0.5px solid transparent; background: transparent;
  color: var(--text-2); font: inherit; font-size: var(--t-13); font-weight: var(--w-semibold); display: flex; align-items: center; justify-content: center; cursor: pointer;
  padding: 0; font-variant-numeric: tabular-nums; z-index: 2; transition: background .12s, color .12s, box-shadow .12s, transform .12s; }
.dtp-num.inner { color: var(--text-3); font-size: var(--t-12); }
.dtp-num:hover { background: var(--fill-2); color: var(--text); }
.dtp-num.is-on { background: var(--accent); color: var(--on-accent); font-weight: var(--w-bold); box-shadow: var(--accent-glow); transform: scale(1.02); }
.dtp-num.maj { width: 36px; height: 36px; margin: -18px 0 0 -18px; font-size: var(--t-14); font-weight: var(--w-bold); color: var(--text); }
.dtp-num.maj.is-on { color: var(--on-accent); }
.dtp-hand { position: absolute; left: 50%; top: 50%; height: 2px; background: linear-gradient(90deg, transparent, var(--accent)); transform-origin: 0 50%; border-radius: 2px; pointer-events: none; z-index: 1; }
.dtp-hub { position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; border-radius: var(--r-full); background: var(--accent); box-shadow: 0 0 10px var(--accent); pointer-events: none; z-index: 3; }
.di-dial-done { width: 100%; margin-top: 2px; }
.di-prev-wrap { margin-top: 2px; }
.di-prev-lab { font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); margin-bottom: 8px; display: flex; align-items: center; gap: 7px; }
.di-prev-lab .di-prev-bulb { display: flex; color: var(--accent); }
.di-prev-card { background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-md); padding: 9px 11px; box-shadow: var(--shadow-sm); }
.di-prev-card .pevt { background: transparent; border: none; padding: 2px 0; align-items: center; }
.di-prev-catico { width: 26px; height: 26px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--cc) 18%, transparent); color: var(--cc); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cc) 32%, transparent), 0 0 12px color-mix(in srgb, var(--cc) 40%, transparent); }
.di-prev-card .pevt-act { color: var(--cc); filter: brightness(1.16); display: flex; align-items: center; }
.di-prev-card .pevt-time { font-weight: var(--w-bold); font-variant-numeric: tabular-nums; margin-right: 6px; color: var(--text); }
.di-prev-card .di-prev-dcode { margin-left: auto; font-size: var(--t-12); font-weight: var(--w-black); letter-spacing: -0.02em; color: var(--cc); text-shadow: 0 0 8px currentColor; padding-left: 8px; }

/* data + godzina — Klasyk zakres + Tarcza (1:1 _isolate-datetimepicker-final, dpk- prefix; dtp- współdzielone z dodaj-info) */
.dpk-pop { position: relative; width: auto; max-width: calc(100% - 40px); background: var(--surface); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  border: 0.5px solid var(--separator); border-radius: var(--r-xl); box-shadow: var(--glass-edge), var(--shadow-lg); padding: 16px; }
.dpk-slots { display: flex; gap: 10px; margin-bottom: 14px; }
.dpk-slot { flex: 1; min-width: 0; text-align: left; cursor: pointer; font: inherit; display: flex; flex-direction: column; gap: 3px; padding: 9px 13px; border-radius: var(--r-md);
  border: 0.5px solid var(--separator); background: var(--fill); transition: background .15s, border-color .15s, box-shadow .15s, color .15s; }
.dpk-slot:hover { background: var(--fill-2); }
.dpk-slot:hover .dpk-slot-lab { color: var(--text-2); }
.dpk-slot-lab { display: flex; align-items: center; gap: 6px; font-size: var(--t-11); font-weight: var(--w-semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); transition: color .15s; }
.dpk-slot-lab .dpk-slot-ic { display: flex; color: var(--text-3); transition: color .15s; }
.dpk-slot-val { font-size: var(--t-15); font-weight: var(--w-semibold); letter-spacing: -0.01em; color: var(--text); font-variant-numeric: tabular-nums; }
.dpk-slot-val .ss-time { color: var(--accent-hover); font-weight: var(--w-bold); }
.dpk-slot-val .ss-dot { color: var(--text-3); margin: 0 3px; }
.dpk-slot-val .ss-dim { color: var(--text-3); font-weight: var(--w-semibold); }
.dpk-slot.is-active { background: var(--accent-soft); border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), var(--accent-glow); }
.dpk-slot.is-active .dpk-slot-lab, .dpk-slot.is-active .dpk-slot-lab .dpk-slot-ic { color: var(--accent-hover); }
.dpk-head { display: flex; align-items: center; gap: 8px; padding: 0 2px 10px; }
.dpk-nav { width: 30px; height: 30px; border-radius: var(--r-full); flex: 0 0 auto; border: 0.5px solid var(--separator); background: var(--fill); color: var(--text-2);
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s, color .15s, box-shadow .15s; }
.dpk-nav:hover { background: var(--fill-2); color: var(--text); }
.dpk-title { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.02em; text-align: center; flex: 1; }
.dpk-hint { font-size: var(--t-12); color: var(--text-2); display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.dpk-hint.both { color: var(--text); font-weight: var(--w-semibold); }
.dpk-reset { border: none; background: var(--fill); color: var(--text-2); font: inherit; font-size: 10px; font-weight: var(--w-semibold); text-transform: uppercase; letter-spacing: .04em;
  padding: 3px 8px; border-radius: var(--r-full); cursor: pointer; transition: color .15s; }
.dpk-reset:hover { color: var(--text); text-shadow: 0 0 2px currentColor; }
.dpk-body { display: flex; gap: 18px; align-items: flex-start; }
.dpk-cal { width: 246px; flex: 0 0 auto; }
.dpk-time { flex: 0 0 auto; padding-left: 22px; padding-right: 4px; border-left: 0.5px solid var(--separator); display: flex; flex-direction: column; align-items: center; gap: 12px; }
.dpk-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 0.5px solid var(--separator); }
.dpk-today { border: none; background: var(--fill); color: var(--accent-hover); font: inherit; font-size: var(--t-13); font-weight: var(--w-semibold); cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: var(--r-full); transition: background .15s, color .15s, box-shadow .15s; }
.dpk-today:hover { background: var(--fill-2); color: var(--text); }
.dpk-today .dpk-tic { color: var(--accent); display: flex; transition: color .15s; }
.dpk-today:hover .dpk-tic { color: var(--text); }
/* Edycja: desktop trigger-chip otwierający picker (idiom .dpk-slot, ale jako pole) */
.dpk-trigger { width: 100%; }

/* ---------- main ---------- */
.dash-main { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 14px; padding: 4px 18px 18px; }

/* ---------- calendar (transparent over aurora) ---------- */
.dcal { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden;
  background: color-mix(in srgb, var(--surface) 24%, transparent);
  border: 0.5px solid var(--separator); border-radius: var(--r-2xl);
  box-shadow: var(--glass-edge), var(--shadow-md);
  -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.dcal-head { display: flex; align-items: center; gap: 10px; padding: 8px 18px; border-bottom: 0.5px solid var(--separator); }
.dcal-titlewrap { margin-left: 2px; }
.dcal-title { font-size: var(--t-24); font-weight: var(--w-bold); letter-spacing: -0.03em; }
.dcal-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 2px; }
.dcal-head .navchip { width: 34px; height: 34px; background: transparent; background-image: none; border: none; color: var(--text-2);
  box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.dcal-head .navchip:hover { color: var(--text); }
.dcal-today { height: 34px; }
.dcal-body { flex: 1; min-height: 0; display: flex; flex-direction: column; --rail-w: 50px; padding-bottom: 4px;
  overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.dcal-body::-webkit-scrollbar { display: none; }
.dcal-lanes { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.dcal-lanes .cal-lane { flex: 1; min-height: 0; grid-template-columns: var(--rail-w) 1fr; }
/* szyna domków „przyklejona" do lewej, gdy pasek przewija się w bok (jak v7) */
.dcal .cal-headrail, .dcal .lane-head { position: sticky; left: 0; z-index: 5;
  background: color-mix(in srgb, var(--surface) 90%, transparent); }

/* cottage rail: colored house + Dn (transparent, compact) */
.dcal .lane-head { flex-direction: column; gap: 1px; background: transparent;
  -webkit-backdrop-filter: none; backdrop-filter: none; border-right: 0.5px solid var(--separator); justify-content: center; padding: 0; }
.lane-house { display: flex; filter: drop-shadow(0 0 7px currentColor); }
.lane-dcode { font-size: var(--t-13); font-weight: var(--w-black); letter-spacing: .01em; line-height: 1; }

/* pionowe linie dni — 1:1 z izolatem: na samym torze (nie ::before), kolor --cal-grid,
   na POCZĄTKU każdej kolumny (0→1px), okres 100%/n; pseudo-element wyłączony */
.dcal .lane-track::before { display: none; }
.dcal .lane-track { background-image: repeating-linear-gradient(to right,
  var(--cal-grid) 0, var(--cal-grid) 1px,
  transparent 1px, transparent calc(100% / var(--n))); }
/* delikatny ślad dnia dzisiejszego — ledwo widoczny, nie rzuca się w oczy */
.today-col { position: absolute; top: 0; bottom: 0; z-index: 0; pointer-events: none;
  background: color-mix(in srgb, var(--accent) 4.5%, transparent); }

/* przerwa międzysezonowa — zakreskowana kolumna (jak v7 .cell-gap) */
.dcal .day-head.gap { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  background: repeating-linear-gradient(45deg, var(--surface) 0 4px, color-mix(in srgb, var(--separator) 65%, transparent) 4px 8px);
  border-left: 1px dashed var(--separator); border-right: 1px dashed var(--separator); color: var(--text-3); }
.dcal .day-head.gap .gap-dots { font-size: var(--t-14); font-weight: var(--w-bold); line-height: 1; letter-spacing: 1px; }
.dcal .day-head.gap .gap-years { font-size: 9px; font-weight: var(--w-semibold); letter-spacing: .03em; white-space: nowrap; }
.gap-col { position: absolute; top: 0; bottom: 0; z-index: 0; pointer-events: none;
  background: repeating-linear-gradient(45deg, transparent 0 4px, color-mix(in srgb, var(--separator) 50%, transparent) 4px 8px);
  border-left: 1px dashed var(--separator); border-right: 1px dashed var(--separator); }

/* clean bars: cottage colour (deposit paid) vs hatched (no deposit yet) */
.dcal .bar { z-index: 1; top: 7px; bottom: 7px; left: var(--x); width: var(--w);
  border-radius: var(--r-md); display: flex; align-items: center; gap: 8px; padding: 0 11px; overflow: visible; cursor: pointer; box-shadow: none; }
.dcal .bar::before { display: none; }
.bar-filled { background: color-mix(in srgb, var(--cc) 26%, transparent);
  border: 0.5px solid color-mix(in srgb, var(--cc) 55%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10); } /* glow zewnętrzny usunięty — żaden pasek nie świeci (1:1 .dcal .bar-filled) */
.bar-unpaid { background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--text) 13%, transparent) 0 5px, transparent 5px 11px);
  border: 1px dashed var(--separator-strong); }
.bar-main { display: flex; flex-direction: column; justify-content: center; min-width: 0; flex: 1; line-height: 1.12; }
.bar-name { font-size: var(--t-13); font-weight: var(--w-bold); color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -0.01em; }
.bar-nights { font-size: var(--t-11); color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bar-unpaid .bar-name { color: var(--text-2); }
/* gość z usługami: nazwisko w jednej linii u góry, ikonki usług w dolnym
   pasku przypięte do dnia — różne strefy w pionie, więc nie nachodzą. */
.dcal .bar.has-svc { flex-direction: column; align-items: stretch; justify-content: flex-start; padding-top: 5px; padding-bottom: 24px; }
.dcal .bar.has-svc .bar-main { flex: 0 0 auto; }
.bar-main-svc { display: block; }
.bar-main-svc .bar-name { display: block; }
.bar-nsuffix { font-weight: var(--w-medium); color: var(--text-2); }
/* klaster ikon jednego dnia — wycentrowany na środku dnia; rozmiar ikon
   ustawiany w JS (1–2 duże, 3–4 mniejsze, by zmieściły się w dniu). */
.bar-svc-cluster { position: absolute; bottom: 4px; transform: translateX(-50%); display: flex; align-items: flex-end; gap: 3px; z-index: 3; pointer-events: none; }
.bar-svc-day { border-radius: var(--r-full); flex: 0 0 auto;
  background: color-mix(in srgb, var(--cc) 55%, #05050c 34%); border: 1px solid color-mix(in srgb, var(--cc) 82%, transparent);
  color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 10px color-mix(in srgb, var(--cc) 46%, transparent); }
.bar.bar-mid { padding: 0 9px; }
.bar.bar-mid .bar-name { font-size: var(--t-12); }
.bar.bar-block { top: 17px; bottom: 17px; padding: 0; border-radius: var(--r-sm); }
.bar.clipL { border-top-left-radius: 3px; border-bottom-left-radius: 3px; border-left-style: dashed; }
.bar.clipR { border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-right-style: dashed; }
.day-head.mini { padding: 8px 0; }
.day-head.mini .dom { font-size: var(--t-13); }
.day-head.mini.today .dom { width: 24px; height: 24px; line-height: 24px; font-size: var(--t-12); }

/* domek w panelach Do dopłaty / Do zwrotu: ikona + świecący numer w kolorze domku (jak w szynie kalendarza) */
.row-housestack { display: flex; flex-direction: row; align-items: center; gap: 4px; flex: 0 0 auto; }
.row-housestack .row-house { filter: drop-shadow(0 0 6px currentColor); }
.row-dcode { font-size: var(--t-13); font-weight: var(--w-black); line-height: 1; letter-spacing: .01em; text-shadow: 0 0 8px currentColor; }

/* chipy kwot w prawy dolny róg wiersza (spójnie z resztą ekranu) */
.duerow-chips { justify-content: flex-end; }
.zwrot-r2 .deductchip { margin-left: auto; }

/* ---------- bottom row: day strip + do zapłaty + do zwrotu ---------- */
.dash-bottom { flex: 0 0 294px; display: flex; gap: 14px; min-height: 0; position: relative; }
/* Do dopłaty + Do zwrotu jako para (jeden wspólny przycisk zwija OBA „do góry") — port izolatu */
.due-stack { display: flex; gap: 14px; flex: 0 0 auto; min-height: 0; position: relative; margin-left: auto; }
/* wspólny przycisk — sama strzałka (bez obwódki/tła), wysoko, w szczelinie MIĘDZY oboma polami */
.due-collapse { position: absolute; top: -8px; left: 297px; transform: translateX(-50%); z-index: 6;
  width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; border-radius: var(--r-full);
  border: none; background: none; padding: 0; color: var(--text-2); cursor: pointer; transition: background .15s, color .15s; }
.due-collapse:hover { color: var(--text); }
.due-collapse .chev { display: flex; transition: transform .2s; transform: rotate(180deg); }
/* === ZWINIĘTE: Do dopłaty / Do zwrotu chowają listy, sumy wtapiają się w pasek nagłówka === */
.dash-bottom.due-fold .due-stack { position: absolute; top: 0; right: 0; height: 56px;
  display: flex; align-items: center; gap: 26px; padding-right: 20px; }
.dash-bottom.due-fold .duepanel:not(.planpanel), .dash-bottom.due-fold .zwrotpanel {
  background: transparent !important; background-image: none !important;
  border: none !important; box-shadow: none !important;
  -webkit-backdrop-filter: none; backdrop-filter: none; overflow: visible; flex: 0 0 auto; }
.dash-bottom.due-fold .duepanel:not(.planpanel) .due-top,
.dash-bottom.due-fold .zwrotpanel .due-top {
  align-items: center; height: 56px; padding: 0; border: none; box-sizing: border-box; }
.dash-bottom.due-fold .plan-top { justify-content: flex-start; gap: 14px; }
.dash-bottom.due-fold .due-list, .dash-bottom.due-fold .zwrot-list { display: none; }
.dash-bottom.due-fold .due-collapse { position: static; transform: none; flex: 0 0 auto; }
.dash-bottom.due-fold .due-collapse .chev { transform: rotate(0deg); }
/* równa wysokość nagłówków → linia podziału na tym samym poziomie w 3 polach */
.dash-bottom .due-top { min-height: 56px; box-sizing: border-box; }

/* (stary układ paska dni „daystrip/dse" usunięty — aktualny używa .plan-scroll/.daycol/.pevt poniżej) */

/* do zapłaty */
.duepanel { flex: 0 0 290px; display: flex; flex-direction: column; min-height: 0; overflow: hidden;
  background: color-mix(in srgb, var(--surface) 55%, transparent); border: 0.5px solid var(--separator);
  border-radius: var(--r-2xl); box-shadow: var(--glass-edge), var(--shadow-md);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.due-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 4px 18px; border-bottom: 0.5px solid var(--separator); }
.kpi-lab { font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-2); letter-spacing: .01em; }
/* header Do dopłaty / Do zwrotu: etykieta na górze, niżej rząd [kwota ⟷ licznik] —
   licznik ląduje na linii kwoty i przy prawej krawędzi (kolumna gemów) */
.due-headstack { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.due-amountrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.due-total { font-size: var(--t-24); font-weight: var(--w-black); letter-spacing: -0.04em; color: var(--unpaid); text-shadow: none; }
.due-list { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; }
/* wspólny, profesjonalny wiersz płatności (Do dopłaty + Do zwrotu):
   nazwisko = lewy-góra, kwota = prawy-góra (zawsze 1 linia), domek+nr = lewy-dół,
   szczegóły/chipy = prawy-dół. Żadna „rzecz" (np. „500 zł") nie łamie się na 2 wiersze. */
.payrow { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 10px; row-gap: 3px;
  padding: 6px 16px; border-bottom: 0.5px solid var(--separator); }
.payrow:last-child { border-bottom: none; }
.payrow-name { min-width: 0; }
.payrow-name b { display: block; font-size: var(--t-13); font-weight: var(--w-semibold); letter-spacing: -0.01em;
  white-space: normal; overflow: visible; }
.payrow-amt { justify-self: end; display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; flex: 0 0 auto; }
.payrow-sum { font-size: var(--t-13); font-weight: var(--w-bold); letter-spacing: -0.02em; white-space: nowrap; }
.payrow-sum-paid { color: var(--paid); }
.payrow-foot { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; min-width: 0; }
.payrow-detail { display: flex; align-items: center; gap: 5px; min-width: 0; flex: 1; overflow: visible; flex-wrap: wrap; }
/* „złap i przewiń" w pionie jak kalendarz (obsługa globalna w app.js) — tu tylko afordancja kursora.
   Łapka na przewijalnych listach; podczas ciągnięcia (.dragging, dodawane globalnie) → zaciśnięta łapka. */
.due-list, .zwrot-list, .daycol-body, .gst-table, .td-scroll, .kasa-main, .cz-rows, .cz-stream,
.npop-list, .hp-body, .hn-body, .avail-list { cursor: grab; }
.dragging { cursor: grabbing !important; user-select: none; -webkit-user-select: none; }
.dragging * { cursor: grabbing !important; }
/* status płatności = szklany klejnot (kolor = status); piny w Do dopłaty/zwrotu używają bazowego .pin-* z tokens.css */
.owechip { font-size: 10px; font-weight: var(--w-medium); color: var(--text-2); background: var(--fill);
  border: 0.5px solid var(--separator); border-radius: var(--r-full); padding: 3px 7px; white-space: normal;
  flex: 0 1 auto; min-width: 0; }

/* do zwrotu — osobne pole obok do zapłaty */
.zwrotpanel { flex: 0 0 196px; display: flex; flex-direction: column; min-height: 0; overflow: hidden;
  background: color-mix(in srgb, var(--paid) 8%, color-mix(in srgb, var(--surface) 55%, transparent));
  border: 0.5px solid color-mix(in srgb, var(--paid) 24%, var(--separator));
  border-radius: var(--r-2xl); box-shadow: var(--glass-edge), var(--shadow-md);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.zwrotpanel .due-top { border-bottom: 0.5px solid color-mix(in srgb, var(--paid) 20%, var(--separator)); }
.zwrot-total-big { font-size: var(--t-24); font-weight: var(--w-black); letter-spacing: -0.04em;
  color: var(--paid); text-shadow: 0 0 18px var(--paid-soft); }
.zwrot-list { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; padding: 0; }
.zwrotpanel .payrow { border-bottom-color: color-mix(in srgb, var(--paid) 14%, var(--separator)); }
.zwrot-when { font-size: var(--t-11); color: var(--text-3); white-space: normal; overflow: visible; }
.deductchip { flex: 0 1 auto; font-size: 10px; font-weight: var(--w-semibold); color: var(--unpaid);
  background: var(--unpaid-soft); border: 0.5px solid color-mix(in srgb, var(--unpaid) 28%, transparent);
  border-radius: var(--r-full); padding: 2px 8px; white-space: normal; max-width: 100%; }
.zwrot { border-top: 0.5px solid var(--separator-strong); background: color-mix(in srgb, var(--paid) 7%, transparent); padding: 12px 18px 14px; flex: 0 0 auto; }
.zwrot-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 8px; }
.zwrot-total { font-size: var(--t-15); font-weight: var(--w-bold); color: var(--paid); }
.zwrot-row { display: flex; align-items: center; gap: 9px; padding: 5px 0; }
.zwrot-name { flex: 1; min-width: 0; font-size: var(--t-12); }
.zwrot-name b { font-weight: var(--w-semibold); }
.zwrot-name small { color: var(--text-3); }
.zwrot-amt { font-size: var(--t-13); font-weight: var(--w-bold); color: var(--paid); }

/* (Strona „Kalendarz" usunięta — niepotrzebna; kalendarz żyje na Pulpicie,
   a „Wolne terminy" jest w wyszukiwarce. Style calpage- / calp- / legend / cfilter / ct- skasowane.) */

/* ===================== REZERWACJA · EDYCJA (pełna strona) ===================== */
/* ten sam shell co Pulpit; w głównym obszarze nagłówek + symetryczna siatka kart-szkło */
.editpage-main { gap: 12px; }

.edit-head { display: flex; align-items: center; gap: 14px; flex: 0 0 auto; padding: 2px 0 0; }
.edit-back { width: 42px; height: 42px; border-radius: var(--r-full); flex: 0 0 auto;
  border: 0.5px solid var(--separator); background: var(--surface-2); color: var(--text-2);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-edge); display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background .15s, color .15s; }
.edit-back:hover { background: var(--fill-2); color: var(--text); }
.edit-htext { min-width: 0; }
.edit-title { font-size: var(--t-24); font-weight: var(--w-bold); letter-spacing: -0.03em; }
.edit-sub { font-size: var(--t-14); color: var(--text-2); margin-top: 3px; display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.edit-house { display: flex; flex: 0 0 auto; filter: drop-shadow(0 0 7px currentColor); }
.edit-sub b { color: var(--text); font-weight: var(--w-semibold); }

/* siatka: 2 kolumny × 3 wiersze — pary kart tej samej wysokości (align-items: stretch) */
.edit-grid { flex: 1; min-height: 0; overflow-y: auto; display: grid;
  grid-template-columns: 1.04fr 1fr; gap: 12px; align-items: stretch; align-content: start; padding-bottom: 2px; }

/* karta-szkło — identyczna receptura co panele na pulpicie / kalendarzu */
.edit-card { background: color-mix(in srgb, var(--surface) 62%, transparent);
  border: 0.5px solid var(--separator); border-radius: var(--r-2xl);
  box-shadow: var(--glass-edge), var(--shadow-md);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  padding: 16px 18px; display: flex; flex-direction: column; min-width: 0; }
.edit-card > .glabel { margin-bottom: 12px; }
.edit-card .pay-tile .pt-amt { font-size: var(--t-20); }
.edit-card .nights { margin-top: auto; }       /* dosuń pigułkę nocy do dołu, by karta wypełniła wysokość pary */
.edit-card .svc-grid { margin-top: auto; }      /* j.w. — usługi przy dolnej krawędzi */

/* blok akcji (lewa kolumna, pod „Goście") — równoważy kartę Notatki */
.edit-actions { display: flex; flex-direction: column; justify-content: center; gap: 11px;
  background: color-mix(in srgb, var(--surface) 62%, transparent);
  border: 0.5px solid var(--separator); border-radius: var(--r-2xl);
  box-shadow: var(--glass-edge), var(--shadow-md);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  padding: 14px 16px; }
.edit-actions .btn { width: 100%; }

/* natywne pola — po kliknięciu otwiera się systemowy picker (iOS na iPhonie);
   stan zamknięty wygląda identycznie jak nasze pole */
.selectwrap { position: relative; }
.select-native { -webkit-appearance: none; appearance: none;
  height: 44px; width: 100%; border-radius: var(--r-md); border: 0.5px solid var(--separator-strong);
  background: var(--surface-2); color: var(--text); font: inherit; font-size: var(--t-15);
  padding: 0 38px 0 var(--sp-4); letter-spacing: -0.01em; cursor: pointer;
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.select-native:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.selectwrap-chev { position: absolute; right: 13px; top: 50%; transform: translateY(-50%); color: var(--text-3); pointer-events: none; display: flex; }
.fld-date { cursor: pointer; }
.fld-date::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .6; }
[data-theme="dark"] .fld-date::-webkit-calendar-picker-indicator { filter: invert(1); opacity: .55; }

/* kolorowe odznaki usług (jak w oryginale / na kalendarzu pulpitu) */
.editpage-main .svc-grid { grid-template-columns: repeat(4, 1fr); gap: var(--sp-3); }
.editpage-main .svc-btn { padding: 13px 4px 11px; border-radius: var(--r-lg); gap: 9px; font-size: var(--t-12); font-weight: var(--w-semibold); }
.svc-badge { width: 42px; height: 42px; border-radius: var(--r-full); flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center; color: #fff;
  background: radial-gradient(120% 120% at 30% 24%, color-mix(in srgb, var(--sc) 78%, #fff 26%), var(--sc));
  border: 0.5px solid color-mix(in srgb, var(--sc) 72%, #fff 8%);
  box-shadow: 0 5px 16px color-mix(in srgb, var(--sc) 42%, transparent), inset 0 1px 0 rgba(255,255,255,.35); }
.svc-btn.on { background: color-mix(in srgb, var(--sc) 15%, var(--surface-2));
  border-color: color-mix(in srgb, var(--sc) 52%, transparent); color: var(--text);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sc) 32%, transparent); }

/* istniejący dodatek gościa — klikalny wiersz + kolorowa odznaka */
.editpage-main .extra-existing { cursor: pointer; padding: 11px 13px; transition: background .15s, border-color .15s; }
.editpage-main .extra-existing:hover { background: var(--surface-3); border-color: var(--separator-strong); }
.extra-badge { width: 38px; height: 38px; border-radius: var(--r-full); flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center; color: #fff;
  background: radial-gradient(120% 120% at 30% 24%, color-mix(in srgb, var(--sc) 78%, #fff 26%), var(--sc));
  border: 0.5px solid color-mix(in srgb, var(--sc) 72%, #fff 8%);
  box-shadow: 0 4px 13px color-mix(in srgb, var(--sc) 42%, transparent), inset 0 1px 0 rgba(255,255,255,.32); }

/* szczegóły dodatku — pop-over w stylu szkła Ekranu startowego */
.ed-overlay { position: absolute; inset: 0; z-index: 40; display: flex; align-items: center; justify-content: center; }
.ed-scrim { position: absolute; inset: 0; background: rgba(4,4,10,.5); -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); }
.ed-sheet { position: relative; width: min(420px, calc(100% - 48px)); background: var(--surface-3);
  border: 0.5px solid var(--separator-strong); border-radius: var(--r-3xl);
  box-shadow: var(--glass-edge), var(--shadow-modal);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); overflow: hidden; }
.ed-head { display: flex; align-items: center; gap: 13px; padding: 18px 18px 16px; border-bottom: 0.5px solid var(--separator); }
.ed-htext { flex: 1; min-width: 0; }
.ed-name { font-size: var(--t-20); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.ed-by { font-size: var(--t-12); color: var(--text-3); margin-top: 2px; }
.ed-body { padding: 6px 18px 4px; }
.ed-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 0.5px solid var(--separator); }
.ed-row:last-child { border-bottom: none; }
.ed-row .ed-k { font-size: var(--t-13); color: var(--text-3); }
.ed-row .ed-v { font-size: var(--t-15); font-weight: var(--w-semibold); }
.ed-note { font-size: var(--t-13); color: var(--text-2); background: var(--surface-2);
  border: 0.5px solid var(--separator); border-radius: var(--r-md); padding: 11px 13px; margin: 4px 0 14px; }
.ed-foot { display: flex; gap: 10px; padding: 14px 18px; border-top: 0.5px solid var(--separator); }

/* edytor: pola w pop-overze */
.ed-fields { display: flex; flex-direction: column; gap: var(--sp-4); padding: 16px 18px 6px; }
.seg-full { display: flex; width: 100%; }
.seg-full button { flex: 1; }

/* themed confirm/alert + toasts (replace native dialogs) */
.jot-overlay-top { z-index: 60; }

/* dialogi „Bogaty" — haloed status-gem, accent/status top-border, centered (1:1 _isolate-dialogi-final) */
.pr-gem { border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  color: var(--gc, var(--accent));
  background: color-mix(in srgb, var(--gc, var(--accent)) 20%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gc, var(--accent)) 42%, transparent),
              0 0 30px color-mix(in srgb, var(--gc, var(--accent)) 48%, transparent),
              inset 0 1px 0 rgba(255,255,255,.22); }
.pr-gem svg { display: block; filter: drop-shadow(0 0 5px color-mix(in srgb, var(--gc, var(--accent)) 60%, transparent)); }
.pr-title { font-weight: var(--w-bold); letter-spacing: -0.02em; color: var(--text); line-height: 1.15; }
.pr-body  { color: var(--text-2); line-height: 1.45; white-space: pre-line; }
.pr-body b { color: var(--text); font-weight: var(--w-semibold); }
/* near-opaque glass — dialog must read as a clear elevated card over the dimmed pulpit */
.pr-sheet { width: 452px; max-width: calc(100% - 48px); border-top: 3px solid var(--gc, var(--accent));
  background: color-mix(in srgb, var(--surface-solid) 94%, transparent); }
.pr-richbody { padding: 30px 30px 8px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.pr-richbody .pr-gem { width: 52px; height: 52px; margin-bottom: 17px; }
.pr-richbody .pr-title { font-size: var(--t-22); }
.pr-richbody .pr-body { font-size: var(--t-15); margin-top: 10px; }
.pr-richbody .field { width: 100%; margin-top: 20px; text-align: left; }
.pr-sheet .ed-foot { padding: 18px; }
.pr-sheet .ed-foot .btn { flex: 1; height: 46px; }
.pr-sheet .btn-primary:hover { filter: brightness(1.08); box-shadow: 0 0 26px color-mix(in srgb, var(--accent) 55%, transparent); }
.pr-sheet .btn-danger:hover { color: color-mix(in srgb, var(--unpaid) 100%, #fff 14%); box-shadow: 0 0 22px color-mix(in srgb, var(--unpaid) 48%, transparent); border-color: color-mix(in srgb, var(--unpaid) 70%, transparent); }
.pr-sheet .btn:not(.btn-primary):not(.btn-danger):hover { color: var(--text); box-shadow: 0 0 18px rgba(255,255,255,.12); }
.jot-toasts { position: absolute; left: 0; right: 0; bottom: 24px; z-index: 90;
  display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; }
.jot-toast { pointer-events: auto; max-width: min(440px, calc(100% - 48px)); padding: 11px 18px; border-radius: var(--r-full);
  background: var(--surface-3); border: 0.5px solid var(--separator-strong); box-shadow: var(--glass-edge), var(--shadow-modal);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  font-size: var(--t-14); font-weight: var(--w-medium); color: var(--text);
  opacity: 0; transform: translateY(8px); transition: opacity .2s, transform .2s; }
.jot-toast.in { opacity: 1; transform: translateY(0); }

/* Kasa — wydatki: dodawanie + usuwanie pozycji */
.kasa-exp-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.kasa-exp-add { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 11px; border-radius: var(--r-full);
  border: 0.5px dashed var(--separator-strong); background: transparent; color: var(--text-3); font: inherit; font-size: var(--t-12); font-weight: var(--w-medium);
  text-transform: none; letter-spacing: normal; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.kasa-exp-add:hover { background: var(--accent-soft); color: var(--accent-hover); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.exp-row { position: relative; }
.exp-date { margin-left: 7px; font-size: var(--t-11); color: var(--text-4); font-weight: var(--w-regular); }
.exp-del { flex: 0 0 auto; width: 22px; height: 22px; margin-left: 4px; border-radius: var(--r-full); border: none; cursor: pointer; background: transparent;
  color: var(--text-4); display: inline-flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .15s, background .15s, color .15s; }
.exp-row:hover .exp-del, .exp-del:focus-visible { opacity: 1; }
.exp-del:hover { background: var(--unpaid-soft); color: var(--unpaid); }

/* Kasa — nawigacja miesiąca (tryb „Miesiąc") */
.kasa-monthnav { display: inline-flex; align-items: center; gap: 6px; margin-right: 8px; }
.kasa-monthlab { font-size: var(--t-13); font-weight: var(--w-semibold); min-width: 104px; text-align: center; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.amount-wrap { position: relative; display: flex; align-items: center;
  height: 54px; border-radius: var(--r-md); border: 0.5px solid var(--separator-strong);
  background: var(--surface-2); padding: 0 var(--sp-4);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.amount-wrap:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.amount-input { flex: 1; min-width: 0; border: none; background: transparent; outline: none; color: var(--text);
  font: inherit; font-size: var(--t-24); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.amount-suf { color: var(--text-3); font-size: var(--t-17); font-weight: var(--w-medium); margin-left: 6px; }

/* klikalne pola płatności */
.edit-card .pay-tile { cursor: pointer; }

/* dodatki gościa — kafelki (2–4 szt.) */
.extra-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); }
.extra-tile { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left;
  padding: 10px 12px; border-radius: var(--r-lg); cursor: pointer; font: inherit;
  background: var(--surface-2); border: 0.5px solid var(--separator); color: var(--text);
  transition: background .15s, border-color .15s; }
.extra-tile:hover { background: var(--surface-3); border-color: color-mix(in srgb, var(--sc) 50%, var(--separator-strong)); }
.extra-tile-main { flex: 1; min-width: 0; line-height: 1.15; }
.extra-tile-name { font-size: var(--t-14); font-weight: var(--w-semibold); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.extra-tile-when { font-size: var(--t-11); color: var(--text-3); margin-top: 1px; }
.extra-tile-right { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.extra-tile-price { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }

/* ===== dodatki gościa — grupy z licznikiem ×N (np. 2× Full SPA) ===== */
.extra-stack { display: flex; flex-direction: column; gap: var(--sp-3); }
.exg-flex { flex: 1; min-width: 0; }

/* pojedynczy dodatek (count = 1) */
.exg-solo { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; font: inherit; cursor: pointer;
  padding: 10px 13px; border-radius: var(--r-lg); color: var(--text);
  background: var(--surface-2); border: 0.5px solid var(--separator); transition: background .15s, border-color .15s; }
.exg-solo:hover { background: var(--surface-3); border-color: color-mix(in srgb, var(--sc) 50%, var(--separator-strong)); }
.exg-solo-main { flex: 1; min-width: 0; line-height: 1.2; }
.exg-when2 { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exg-price2 { font-size: var(--t-15); font-weight: var(--w-bold); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }

/* grupa dodatków (count > 1) */
.exg { background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-lg); overflow: hidden; }
.exg-head { display: flex; align-items: center; gap: 11px; padding: 10px 13px; }
.exg-name { font-size: var(--t-14); font-weight: var(--w-semibold); }
.exg-mult { display: inline-flex; align-items: center; height: 21px; padding: 0 9px; border-radius: var(--r-full);
  font-size: var(--t-12); font-weight: var(--w-bold); font-variant-numeric: tabular-nums;
  background: color-mix(in srgb, var(--sc) 20%, transparent); color: var(--sc);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sc) 38%, transparent); }
.exg-sum { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.exg-items { display: flex; flex-direction: column; border-top: 0.5px solid var(--separator); }
.exg-item { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; font: inherit; cursor: pointer;
  padding: 9px 13px; background: transparent; border: none; border-top: 0.5px solid var(--separator); color: var(--text); transition: background .15s; }
.exg-items .exg-item:first-child { border-top: none; }
.exg-item:hover { background: var(--surface-3); }
.exg-idx { flex: 0 0 auto; width: 16px; font-size: var(--t-12); font-weight: var(--w-bold); font-variant-numeric: tabular-nums;
  color: color-mix(in srgb, var(--sc) 80%, var(--text-2)); }
.exg-when { font-size: var(--t-13); color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exg-price { font-size: var(--t-13); font-weight: var(--w-semibold); font-variant-numeric: tabular-nums; min-width: 56px; text-align: right; flex: 0 0 auto; }
.exg-item .chip, .exg-solo .chip { min-width: 104px; justify-content: center; flex: 0 0 auto; }
.exg-price2 { min-width: 64px; text-align: right; }

/* podpowiedź + stepper przy siatce usług */
.svc-title { display: inline-flex; align-items: center; gap: 9px; }
.svc-title-bubble { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 7px;
  border-radius: var(--r-full); font-size: var(--t-13); font-weight: var(--w-bold); font-variant-numeric: tabular-nums;
  background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent); }
.svc-title-sum { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--text-2); }
.svc-hint { font-size: var(--t-12); color: var(--text-3); margin: var(--sp-4) 0 var(--sp-3); line-height: 1.4; }
.edit-card .svc-hint { margin-top: auto; }            /* przyklej blok dodawania do dolnej krawędzi karty */
.edit-card .svc-grid { margin-top: 0; }                /* nadpisuje wcześniejsze margin-top:auto */
.editpage-main .svc-btn { position: relative; }
.svc-count { position: absolute; top: 6px; right: 7px; display: inline-flex; align-items: center; justify-content: center;
  min-width: 21px; height: 21px; padding: 0 6px; border-radius: var(--r-full); color: #fff;
  font-size: var(--t-12); font-weight: var(--w-bold); font-variant-numeric: tabular-nums;
  background: radial-gradient(120% 120% at 30% 24%, color-mix(in srgb, var(--sc) 80%, #fff 26%), var(--sc));
  box-shadow: 0 3px 9px color-mix(in srgb, var(--sc) 45%, transparent); }
.svc-step { position: absolute; top: 6px; left: 7px; width: 21px; height: 21px; border-radius: var(--r-full); cursor: pointer;
  display: flex; align-items: center; justify-content: center; color: var(--text-2);
  background: var(--fill-2); border: 0.5px solid var(--separator); transition: background .15s, color .15s; }
.svc-step:hover { background: var(--unpaid-soft); color: var(--unpaid); border-color: color-mix(in srgb, var(--unpaid) 35%, transparent); }
.svc-btn.maxed { cursor: default; }

/* ===== Edycja — finalny układ 50/50 (1:1 z _isolate-edycja-final.html) =====
   Reflow .edit-grid → flex row-reverse z dwiema kolumnami .eg-col; przylegające
   karty (gap 6px) + kompaktowe wnętrza, by zmieścić wszystko bez przewijania. */
.edit-grid { display: flex !important; flex-direction: row-reverse; gap: 14px; align-items: stretch; }
/* flex-start (NIE space-between): karty pakują się ciasno do góry — „zero pustek między nimi"
   (intencja izolatu). space-between wyglądało dobrze tylko przy dokładnej wysokości 940px wypełnionego
   demo; na realnym, wyższym ekranie / pustej „Nowej rezerwacji" rozrzucało karty na całą kolumnę. */
.eg-col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 6px; justify-content: flex-start; }
/* WYPEŁNIENIE wysokości: na realnym (wysokim) ekranie karty ROSNĄ, aż kolumny sięgną dolnej
   krawędzi (intencja izolatu „kolumny do dolnej krawędzi") — zamiast zostawiać wielką pustkę pod
   ciasno upakowanym formularzem. Akcje (Zapisz/Usuń) zostają kompaktowe i lądują u samego dołu;
   notatki rozciągają się, wypełniając swoją kartę. Przy małym ekranie (≈940) brak nadmiaru = bez zmian. */
.eg-col > .edit-card { flex: 1 1 auto; }
.eg-col > .edit-actions { flex: 0 0 auto; margin-top: auto; }
.editpage-main #edNotes { flex: 1 1 auto; min-height: 70px; }
.edit-card, .edit-actions { padding: 7px 16px; }
.edit-actions { flex-direction: column; gap: 8px; }
.edit-actions .btn { width: 100%; }
.editpage-main .svc-grid { grid-template-columns: repeat(4, 1fr); gap: 7px; }
.pay-tiles { grid-template-columns: repeat(3, 1fr); }
.editpage-main .glabel { margin-bottom: 6px; }
.editpage-main .svc-btn { padding: 5px 4px; }
.editpage-main .subcard { padding: 6px 10px; }
.editpage-main .pay-tile { padding: 7px 11px; }
/* :not(.set-page) — kompaktowe pola 31px to LOKALNE nadpisanie izolatu EDYCJI; izolat Ustawień
   (też .editpage-main) ich NIE ma, więc na ekranie ustawień pola wracają do globalnych wymiarów. */
.editpage-main:not(.set-page) .input, .editpage-main:not(.set-page) .amount-input, .editpage-main:not(.set-page) .fld-date, .editpage-main:not(.set-page) .seg button { height: 31px; }

/* ===== Notatki domków — osobne okno ===== */
.side-notes-btn { width: 100%; background: transparent; border: none; cursor: pointer; font: inherit; color: var(--text-3);
  margin-bottom: 9px; padding: 0; transition: color .15s; }
.side-notes-btn:hover { color: var(--text); }
.side-notes-btn .side-notes-chev { margin-left: auto; display: flex; color: var(--text-4); transition: transform .15s, color .15s; }
.side-notes-btn:hover .side-notes-chev { color: var(--accent-hover); transform: translateX(2px); }

.ed-sheet-notes { width: calc(100% - 40px); max-width: 1280px; height: calc(100% - 40px); max-height: none; display: flex; flex-direction: column; }
.hn-headico { width: 42px; height: 42px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); }
.hn-body { flex: 1; min-height: 0; padding: 16px 20px 20px; overflow-y: auto; display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); align-items: start; }
.hn-col { display: flex; flex-direction: column; gap: var(--sp-3); }
.hn-house { --cc: var(--accent); background: var(--surface-2); border: 0.5px solid var(--separator); border-radius: var(--r-lg); padding: 12px 14px; }
.hn-house-head { display: flex; align-items: center; gap: 9px; }
.hn-house-ic { display: flex; color: var(--cc); filter: drop-shadow(0 0 6px color-mix(in srgb, var(--cc) 55%, transparent)); }
.hn-house-name { font-size: var(--t-15); font-weight: var(--w-semibold); }
.hn-flex { flex: 1; }
.hn-empty-tag { font-size: var(--t-11); color: var(--text-4); font-style: italic; }
.hn-notes { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }
.hn-note { display: flex; align-items: center; gap: 10px; padding: 8px 11px; border-radius: var(--r-sm); background: var(--surface-3); }
.hn-bullet { width: 6px; height: 6px; border-radius: var(--r-full); flex: 0 0 auto; background: var(--cc); box-shadow: 0 0 7px var(--cc); }
.hn-note-txt { flex: 1; min-width: 0; font-size: var(--t-13); color: var(--text); }
.hn-note-x { flex: 0 0 auto; width: 24px; height: 24px; border-radius: var(--r-full); border: none; cursor: pointer; background: transparent;
  color: var(--text-4); display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s; }
.hn-note-x:hover { background: var(--unpaid-soft); color: var(--unpaid); }
.hn-noteempty { font-size: var(--t-12); color: var(--text-4); font-style: italic; margin: 9px 0 2px; }
.hn-add { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; height: 32px; padding: 0 13px; border-radius: var(--r-full);
  border: 0.5px dashed var(--separator-strong); background: transparent; color: var(--text-3); font: inherit; font-size: var(--t-12); font-weight: var(--w-medium);
  cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.hn-add:hover { background: var(--accent-soft); color: var(--accent-hover); border-color: color-mix(in srgb, var(--accent) 40%, transparent); }

/* notatki „Inne" — pełna szerokość pod domkami */
.hn-other-wrap { grid-column: 1 / -1; }
.hn-other { --cc: var(--accent); }
.hn-other .hn-house-ic { color: var(--accent-hover); }
.hn-other-tag { font-size: var(--t-11); color: var(--text-3); font-weight: var(--w-medium); }
/* „Inne" siedzi w jednym ciągu z notatkami domków — bez separatora/odstępu */
.note-row-other .note-txt b { color: var(--text); }

/* ===================== ZMIANY 2026-05 ===================== */

/* udział % przy kategoriach przychodu / wydatków */
.bd-pct { font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-3);
  font-variant-numeric: tabular-nums; min-width: 32px; text-align: right; flex: 0 0 auto; }

/* Kasa — zwarte rozmiary, żeby wszystko zmieściło się bez przewijania */
.kasa-main { gap: 8px; }
.kasa-hero { gap: 8px; }
.kasa-main .kasa-stat { padding: 9px 16px; }
.kasa-main .kasa-stat .ks-lab { font-size: var(--t-11); }
.kasa-main .ks-val { font-size: var(--t-28); margin-top: 2px; }
.kasa-main .kasa-stat .ks-sub { margin-top: 2px; font-size: 11px; }
.kasa-two { gap: 8px; }
.kasa-main .edit-card { padding: 10px 14px; }
.kasa-main .edit-card > .glabel { margin-bottom: 5px; }
.kasa-main .bd-row { padding: 3.5px 0; }
.kasa-main .bd-name, .kasa-main .bd-amt { font-size: var(--t-12); }
.kasa-main .bd-total { padding-top: 6px; }
.kasa-main .bd-total .val { font-size: var(--t-15); }
.kasa-main .srccard-head { gap: 12px; }
.kasa-main .srccard-figval { font-size: var(--t-20); }
.kasa-main .split { margin-top: 7px !important; height: 9px; }
.kasa-main .srclist { margin: 7px 0 0; }
.kasa-main .srchead { padding-bottom: 5px; }
.kasa-main .srcrow { padding: 6px 0; }
.kasa-main .src-name small { margin-top: 0; }
.kasa-main .ota-foot { padding: 7px 12px; font-size: var(--t-12); }
.kasa-mini { gap: 8px; }
.kasa-main .minitile { padding: 8px 13px; }
.kasa-main .minitile .mt-lab { font-size: var(--t-11); }
.kasa-main .minitile .mt-val { font-size: var(--t-18); margin-top: 1px; }
.kasa-main .goal-wrap { gap: 5px; }
.kasa-main .barmeter { height: 7px; }

/* — przychód wg kategorii | wydatki sezonu rosną, by ekran kończył się na samym dole — */
.kasa-main .kasa-two { flex: 1 1 auto; min-height: 0; }
.kasa-main .kasa-two .kasa-bd { flex: 1 1 auto; }
.kasa-main .kasa-two .kasa-bd > div { display: flex; flex-direction: column; justify-content: space-between; }
.kasa-main .kasa-two .edit-card > div:not(.glabel):not(.bd-total):not(.kasa-bd) {
  flex: 1 1 auto; display: flex; flex-direction: column; justify-content: space-between; }

/* ===== Kasa — zablokowany układ „Wstęga + tabela" (redesign, opcja 3) =====
   Pełnoszerokościowa wstęga 3 KPI (etykieta+podtytuł z lewej, wielka kwota z prawej),
   pod nią KANAŁY jako bohater na całą szerokość, niżej para rozbić, na dole mini + cel.
   Wklejone 1:1 z _isolate-kasa-final.html; nadpisuje sekcję „zwarte rozmiary" wyżej. */
.kasa-main { display: flex; flex-direction: column; gap: 12px; }
.kasa-main .edit-head { order: 0; }
.kasa-main .kasa-hero { order: 1; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.kasa-main .kasa-hero .kasa-stat { display: grid; grid-template-columns: 1fr auto; align-items: center;
  column-gap: 16px; padding: 14px 20px; }
.kasa-main .kasa-hero .ks-top { grid-column: 1; grid-row: 1; }
.kasa-main .kasa-hero .ks-sub { grid-column: 1; grid-row: 2; margin-top: 3px; }
.kasa-main .kasa-hero .ks-val { grid-column: 2; grid-row: 1 / 3; margin-top: 0; font-size: var(--t-34); text-align: right; }
.kasa-main > .kasa-two + .edit-card { order: 2; }
.kasa-main > .kasa-two + .edit-card .srcrow { padding: 9px 0; }
.kasa-main .kasa-two { order: 3; gap: 12px; flex: 0 0 auto; }
.kasa-main .kasa-mini { order: 4; gap: 12px; }
.kasa-main > .edit-card:last-child { order: 5; }
.kasa-main .kasa-two .kasa-bd { flex: 0 0 auto; }

/* ===== Plan dnia — pozioma taśma kart dni; 4 karty na raz, kompaktowe wiersze ===== */
.planpanel { flex: 1; min-width: 0; }
.planpanel-multi { overflow: hidden; }
.plan-top { align-items: center; justify-content: flex-start; gap: 14px; }
.plan-today-btn { display: inline-flex; align-items: center; gap: 6px; height: 31px; padding: 0 15px; border-radius: var(--r-full);
  border: 0.5px solid color-mix(in srgb, var(--accent) 48%, var(--separator)); background: var(--accent-soft); color: var(--accent);
  font: inherit; font-size: var(--t-12); font-weight: var(--w-semibold); cursor: pointer; flex: 0 0 auto; }
.plan-today-btn:hover { color: var(--accent-hover); }

/* taśma kart — przewijana w poziomie, 4 karty mieszczą się na raz */
.plan-scroll { flex: 1; min-height: 0; display: flex; gap: 10px; overflow-x: auto; overflow-y: hidden; padding: 8px; }
/* przeciąganie myszą L/P (jak v7): pasek Plan dnia + siatka kalendarza */
.plan-scroll, .dcal-body { cursor: grab; }
.plan-scroll.dragging, .dcal-body.dragging { cursor: grabbing; user-select: none; -webkit-user-select: none; }
.plan-scroll.dragging *, .dcal-body.dragging * { cursor: grabbing; }
.daycol { flex: 0 0 216px; display: flex; flex-direction: column; min-height: 0; min-width: 0;
  background: color-mix(in srgb, var(--surface) 50%, transparent); border: 0.5px solid var(--separator);
  border-radius: var(--r-lg); padding: 8px 7px; }
.daycol.is-today { border-color: color-mix(in srgb, var(--accent) 60%, var(--separator));
  box-shadow: 0 0 0 1px var(--accent-soft), 0 0 22px color-mix(in srgb, var(--accent) 16%, transparent);
  background: color-mix(in srgb, var(--accent) 7%, color-mix(in srgb, var(--surface) 50%, transparent)); }

/* nagłówek karty: dzień + data obok + licznik */
.daycol-head { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; padding: 1px 1px 4px; }
.daycol-day { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.01em; flex: 0 0 auto; }
.daycol.is-today .daycol-day { color: var(--accent); }
.daycol-date { font-size: var(--t-12); font-weight: var(--w-medium); color: var(--text-3); }
/* prognoza: ikona pogody + zakres temperatur (jedna linia), dosunięte w prawo przed licznik */
.daycol-wx { margin-left: auto; flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px;
  color: var(--text-3); white-space: nowrap; }
.daycol-temp { font-size: var(--t-11); font-weight: var(--w-semibold); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
/* licznik dnia = ta sama „bańka" co w sidebarze / Do dopłaty / Do zwrotu (.count-bubble.tinted):
   biała normalnie, fioletowa (akcent) w karcie „Dziś" */
.daycol-count { margin-left: 6px; --cc: #e9ebf5; }
.daycol.is-today .daycol-count { margin-left: 6px; --cc: var(--accent); }

.daycol-body { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 5px; padding-bottom: 2px; }
.daycol-empty { font-size: var(--t-12); color: var(--text-3); font-style: italic; padding: 5px 2px; }
.daycol-hol { display: flex; align-items: center; gap: 7px; font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--partial);
  background: var(--partial-soft); border: 0.5px solid color-mix(in srgb, var(--partial) 26%, transparent); border-radius: var(--r-sm); padding: 6px 8px; }
.daycol-hol-dot { width: 7px; height: 7px; background: var(--partial); transform: rotate(45deg); flex: 0 0 auto; }
.daycol-add { flex: 0 0 auto; margin-top: 5px; display: flex; align-items: center; justify-content: center; gap: 6px; height: 22px;
  border: 0.5px dashed var(--separator); border-radius: var(--r-md); background: transparent;
  color: var(--text-3); font: inherit; font-size: var(--t-11); font-weight: var(--w-medium); cursor: pointer; }
.daycol-add:hover { color: var(--text); border-color: color-mix(in srgb, var(--accent) 55%, var(--separator)); }

/* separator sezonów w pasku „Plan dnia" — wąska zakreskowana karta */
.plan-scroll .gap-card { flex: 0 0 58px; align-self: stretch; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 9px; border-radius: var(--r-lg);
  background: repeating-linear-gradient(45deg, var(--surface) 0 5px, color-mix(in srgb, var(--separator) 60%, transparent) 5px 10px);
  border: 1px dashed var(--separator); color: var(--text-3); }
.plan-scroll .gap-card-dots { font-size: var(--t-17); font-weight: var(--w-bold); line-height: 1; }
.plan-scroll .gap-card-lab { font-size: var(--t-11); font-weight: var(--w-semibold); writing-mode: vertical-rl; transform: rotate(180deg); letter-spacing: .04em; }
.plan-scroll .gap-card-years { font-size: 10px; font-weight: var(--w-semibold); letter-spacing: .02em; white-space: nowrap; }

/* kompaktowe pole zdarzenia: akcja+Dn w jednej linii, niżej godzina · status */
.pevt { display: flex; align-items: stretch; gap: 7px; padding: 4px 7px 5px; border-radius: var(--r-md);
  background: color-mix(in srgb, var(--cc) 9%, var(--surface-2));
  border: 0.5px solid color-mix(in srgb, var(--cc) 24%, var(--separator)); }
.pevt-note { cursor: pointer; transition: background .15s, border-color .15s; }
.pevt-note:hover { background: color-mix(in srgb, var(--cc) 16%, var(--surface-2)); border-color: color-mix(in srgb, var(--cc) 40%, var(--separator)); }
.pevt-ico { width: 24px; height: 24px; border-radius: 7px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; margin-top: 1px;
  background: color-mix(in srgb, var(--cc) 24%, transparent); color: var(--cc);
  box-shadow: 0 0 12px color-mix(in srgb, var(--cc) 20%, transparent); }
.pevt-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pevt-act { font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--cc); filter: brightness(1.16);
  white-space: normal; overflow: visible; max-width: 100%; letter-spacing: -0.01em; line-height: 1.3; }
/* kod domku „D1…D6" zamiast ikony akcji (wybór użytkownika) */
.pevt-code { font-size: 12px; font-weight: var(--w-black); letter-spacing: -0.02em; line-height: 1; }
/* status pod opisem → opis ma pełną szerokość i pełny napis jest widoczny */
.pevt-body .pevt-st { align-self: flex-start; margin-left: 0; margin-top: 3px; }
.pevt-act b { font-weight: var(--w-bold); letter-spacing: .01em; }
.pevt-meta { display: flex; align-items: center; gap: 5px; }
.pevt-time { font-weight: var(--w-bold); font-variant-numeric: tabular-nums; margin-right: 4px; }
.pevt-sep { color: var(--text-3); flex: 0 0 auto; }
.pevt-st { font-weight: var(--w-semibold); font-size: 10px; line-height: 1.35; padding: 2px 8px; border-radius: var(--r-full);
  flex: 0 0 auto; margin-left: auto; align-self: flex-end; white-space: nowrap; }
.pevt-st-paid { color: var(--paid); background: var(--paid-soft); border: 0.5px solid color-mix(in srgb, var(--paid) 28%, transparent); }
.pevt-st-unpaid { color: var(--unpaid); background: var(--unpaid-soft); border: 0.5px solid color-mix(in srgb, var(--unpaid) 28%, transparent); }
.pevt-st-neutral { color: var(--text-2); background: var(--fill); border: 0.5px solid var(--separator); }

/* ===================== USTAWIENIA ===================== */
.set-grid { grid-template-columns: 1fr 1fr; align-content: start; }
.set-card { display: flex; flex-direction: column; }
.set-cardhead { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.set-cardhead .glabel { flex: 1; }
.set-count { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 7px;
  border-radius: var(--r-full); background: var(--accent-soft); color: var(--accent-hover); font-size: var(--t-12); font-weight: var(--w-bold); }
.set-span { grid-column: 1 / -1; }

/* zwarte pole z sufiksem (cena / %) */
.amount-wrap-sm { height: 40px; flex: 0 0 auto; width: 104px; padding: 0 12px; }
.amount-wrap-sm .amount-input { font-size: var(--t-15); font-weight: var(--w-semibold); text-align: right; }
.amount-wrap-sm .amount-suf { font-size: var(--t-13); margin-left: 4px; }

/* lista wierszy ustawień */
.set-list { display: flex; flex-direction: column; }
.setrow { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 0.5px solid var(--separator); }
.setrow:last-child { border-bottom: none; }
.setrow-ico { flex: 0 0 auto; width: 34px; height: 34px; border-radius: var(--r-md); display: flex; align-items: center; justify-content: center;
  color: var(--cc); background: color-mix(in srgb, var(--cc) 15%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cc) 26%, transparent); }
.setrow-mark { font-size: var(--t-13); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.setrow-mark .src-glyph { display: flex; }
.setrow-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.setrow-name { font-size: var(--t-14); font-weight: var(--w-semibold); letter-spacing: -0.01em; }
.setrow-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; }

/* nagłówek kolumn */
.set-collab { display: flex; align-items: center; justify-content: space-between; font-size: var(--t-11); font-weight: var(--w-semibold);
  letter-spacing: .06em; text-transform: uppercase; color: var(--text-4); padding-bottom: 8px; }

/* domki */
.set-houserow { gap: 10px; }
.set-dot { flex: 0 0 auto; width: 16px; height: 16px; border-radius: var(--r-full); box-shadow: 0 0 10px currentColor; }
.set-houseinput { flex: 1; height: 40px; font-size: var(--t-14); }
.set-svcbadge { flex: 0 0 auto; width: 34px; height: 34px; border-radius: var(--r-md); display: flex; align-items: center; justify-content: center;
  color: #fff; background: color-mix(in srgb, var(--sc) 78%, #05050c 20%); box-shadow: 0 0 12px color-mix(in srgb, var(--sc) 40%, transparent); }

/* dodaj wiersz */
.set-addrow { margin-top: auto; padding-top: 13px; display: inline-flex; align-items: center; gap: 7px; align-self: flex-start;
  border: none; background: transparent; color: var(--accent-hover); font: inherit; font-size: var(--t-13); font-weight: var(--w-semibold); cursor: pointer; }
.set-addrow:hover { color: var(--accent); }

/* przełącznik */
.switch { flex: 0 0 auto; width: 46px; height: 27px; border-radius: var(--r-full); position: relative; cursor: pointer;
  border: 0.5px solid var(--separator-strong); background: var(--fill); padding: 0; transition: background .18s, border-color .18s; }
.switch::after { content: ""; position: absolute; top: 2px; left: 2px; width: 21px; height: 21px; border-radius: 50%;
  background: #fff; box-shadow: var(--shadow-sm); transition: transform .18s; }
.switch.on { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 14px var(--accent-soft); }
.switch.on::after { transform: translateX(19px); }

/* pigułki metod płatności */
.set-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.tpill { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 15px; border-radius: var(--r-full); cursor: pointer;
  border: 0.5px solid var(--separator-strong); background: var(--surface-2); color: var(--text-2); font: inherit; font-size: var(--t-13); font-weight: var(--w-medium);
  transition: background .15s, color .15s, border-color .15s; }
.tpill:hover { color: var(--text); }
.tpill.on { background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 55%, var(--separator)); color: var(--accent-hover); }
.tpill-check { display: inline-flex; color: var(--accent); }

/* profil obiektu */
.set-profile { display: flex; align-items: center; gap: 13px; }
.set-avatar { flex: 0 0 auto; width: 48px; height: 48px; border-radius: var(--r-full); display: flex; align-items: center; justify-content: center;
  font-weight: var(--w-bold); font-size: var(--t-17); color: #fff; background: linear-gradient(140deg, var(--accent), #5b6bff); box-shadow: var(--accent-glow); }
.set-profile-main { flex: 1; min-width: 0; }
.set-profile-name { font-size: var(--t-17); font-weight: var(--w-semibold); letter-spacing: -0.02em; }
.set-profile-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; }

/* synchronizacja / konto */
.set-sync { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border-radius: var(--r-lg); margin-bottom: 8px;
  background: color-mix(in srgb, var(--paid) 9%, var(--surface-2)); border: 0.5px solid color-mix(in srgb, var(--paid) 24%, var(--separator)); }
.set-sync .sync-dot { flex: 0 0 auto; width: 9px; height: 9px; }
.set-sync-name { font-size: var(--t-14); font-weight: var(--w-semibold); }
.set-sync-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; }
.set-logout { margin-top: 14px; width: 100%; justify-content: center; border: 0.5px solid var(--separator); }

/* settings: backup actions */
.set-backup { display: flex; flex-direction: column; gap: 8px; }
.set-backup .btn { justify-content: flex-start; gap: 10px; }
.set-backup-hint { font-size: var(--t-12); color: var(--text-3); line-height: 1.45; margin-top: 10px; }

/* sync dot — offline / local state */
.sync-dot.off { background: var(--text-3); box-shadow: none; }

/* access lock overlay (one-time password per device) — Login FINAŁ „Split" */
.lock-overlay { position: absolute; inset: 0; z-index: 200; display: none; align-items: center; justify-content: center; padding: 40px;
  background: rgba(4,4,10,.62); -webkit-backdrop-filter: blur(10px) saturate(140%); backdrop-filter: blur(10px) saturate(140%); }
.lock-overlay.open { display: flex; }
.lock-overlay .lg-aurora { position: absolute; inset: 0; background: var(--aurora); background-color: var(--aurora-base); pointer-events: none; }
.lock-overlay .lg-aurora::after { content: ''; position: absolute; inset: 0;
  background: radial-gradient(130% 90% at 50% 130%, transparent 40%, rgba(3,3,10,.55)); }
.lock-card { position: relative; z-index: 1;
  display: grid; grid-template-columns: 1.05fr 1fr; width: min(900px, 100%); height: 480px; max-height: 100%;
  border-radius: var(--r-2xl); overflow: hidden; border: 0.5px solid var(--separator);
  background: var(--surface); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  box-shadow: var(--glass-edge), var(--shadow-modal); }
.lg-brand { position: relative; padding: 42px; display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
  background: linear-gradient(158deg, color-mix(in srgb, var(--accent) 30%, transparent), color-mix(in srgb, var(--accent) 5%, transparent));
  border-right: 0.5px solid var(--separator); overflow: hidden; }
.lg-brand::after { content: ''; position: absolute; right: -80px; top: -80px; width: 260px; height: 260px;
  background: radial-gradient(circle, rgba(123,120,255,.5), transparent 60%); filter: blur(10px); pointer-events: none; }
.lg-brand-grp { position: relative; }
.lg-brand-top { display: flex; align-items: center; gap: 13px; }
.lock-logo { width: 46px; height: 46px; border-radius: var(--r-md); flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(150deg, var(--accent-hover), var(--accent));
  color: #fff; font-weight: 800; font-size: 22px; letter-spacing: -0.03em;
  box-shadow: var(--accent-glow), inset 0 1px 0 rgba(255,255,255,.42); }
.lg-brand-word { font-weight: 800; font-size: 23px; letter-spacing: -0.02em; color: #fff; }
.lg-statement { margin: 24px 0 0; font-weight: 600; font-size: 18px; line-height: 1.5;
  letter-spacing: -0.01em; color: #fff; max-width: 26ch; }
.lg-wip { margin-top: 13px; font-size: 12px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: rgba(255,255,255,.52); }
.lg-dots { display: flex; gap: 9px; }
.lg-dots i { width: 13px; height: 13px; border-radius: var(--r-full); flex: 0 0 auto;
  background: radial-gradient(circle at 36% 28%, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0) 24%),
    radial-gradient(120% 120% at 60% 80%, color-mix(in srgb, var(--g) 55%, #fff) 0%, var(--g) 44%, color-mix(in srgb, var(--g) 66%, #000) 100%);
  box-shadow: 0 0 3px var(--g), 0 0 7px color-mix(in srgb, var(--g) 70%, transparent),
    inset 0 0.5px 0.5px rgba(255,255,255,0.7), inset 0 -0.5px 1px rgba(0,0,0,0.4); }
.lg-left-foot { margin-top: 16px; font-size: 12px; color: rgba(255,255,255,.62); }
.lg-form { padding: 48px 42px; display: flex; flex-direction: column; justify-content: center; }
.lock-title { font-weight: 700; font-size: 19px; color: var(--text); }
.lock-sub { margin-top: 7px; font-size: 13px; line-height: 1.45; color: var(--text-3); }
.lg-form .input { width: 100%; height: 48px; box-sizing: border-box; margin-top: 24px; }
.lock-error { min-height: 16px; font-size: 13px; color: var(--unpaid); margin: 12px 0; }
.lg-form .btn { width: 100%; }

/* ===================== To-do screen (scoped .td-*) ===================== */
.todo-main { overflow: hidden; }
.td-ava { width: 26px; height: 26px; border-radius: var(--r-full); display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 11px; color: #fff; flex: 0 0 auto;
  background: linear-gradient(150deg, color-mix(in srgb, var(--cc) 86%, #fff 5%), var(--cc));
  box-shadow: 0 0 0 .5px rgba(255,255,255,.15); }
.td-ava.lg { width: 30px; height: 30px; font-size: 12px; }
.td-ava-stack { display: inline-flex; align-items: center; flex: 0 0 auto; padding-right: 2px; }
.td-ava-stack .td-ava { width: 22px; height: 22px; font-size: 9.5px; margin-left: -7px; box-shadow: 0 0 0 1.5px var(--surface); }
.td-ava-stack .td-ava:first-child { margin-left: 0; }
.td-who { gap: 6px; height: 26px; padding: 0 10px 0 4px; background: var(--fill); color: var(--text-2); font-weight: var(--w-semibold); }
.td-who.all { padding-left: 6px; }
.td-who .td-who-n { letter-spacing: -0.01em; }
.td-due { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: var(--r-full);
  font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-2);
  background: var(--fill); border: 0.5px solid var(--separator); }
.td-due.soon { color: var(--accent-hover); background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 32%, transparent); }
.td-due svg { opacity: .9; }
.td-tag { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: var(--r-full);
  font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--cc);
  background: color-mix(in srgb, var(--cc) 13%, transparent);
  border: 0.5px solid color-mix(in srgb, var(--cc) 30%, transparent); }
.td-tag .td-tag-dot { width: 8px; height: 8px; border-radius: var(--r-full); background: var(--cc); box-shadow: 0 0 8px color-mix(in srgb, var(--cc) 70%, transparent); }
.td-row { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: var(--r-md);
  background: var(--surface-2); border: 0.5px solid var(--separator); transition: border-color .15s, background .15s; cursor: pointer; }
.td-row + .td-row { margin-top: 8px; }
.td-row .check { flex: 0 0 auto; }
.td-row .check .box { width: 24px; height: 24px; }
.td-txt { flex: 1; min-width: 0; font-size: var(--t-15); color: var(--text); letter-spacing: -0.01em; line-height: 1.3; }
.td-row.done { background: color-mix(in srgb, var(--surface-2) 70%, transparent); border-color: color-mix(in srgb, var(--separator) 70%, transparent); }
.td-row.done .td-txt { color: var(--text-3); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--text-3) 60%, transparent); }
.td-meta { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.td-row:hover .td-txt { color: var(--text); text-shadow: 0 0 8px color-mix(in srgb, var(--text) 22%, transparent); }
.td-row.done:hover .td-txt { color: var(--text-2); }
.td-sec + .td-sec { margin-top: 18px; }
.td-sec-head { display: flex; align-items: center; gap: 9px; margin-bottom: 11px; padding: 0 2px; }
.td-sec-ic { width: 28px; height: 28px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--cc) 16%, transparent); color: var(--cc);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cc) 30%, transparent); }
.td-sec-lab { font-size: var(--t-14); font-weight: var(--w-bold); color: var(--text); letter-spacing: -0.01em; }
.td-sec-sub { font-size: var(--t-12); color: var(--text-3); font-weight: var(--w-medium); }
.td-sec-head .td-head-spacer { flex: 1; }
.td-bar { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; padding: 2px; }
.td-bar .td-head-spacer { flex: 1; }
.td-add { flex: 0 0 auto; gap: 8px; }
.seg.td-seg button { display: inline-flex; align-items: center; gap: 7px; }
.td-donebtn { flex: 0 0 auto; gap: 8px; margin-left: 4px; color: var(--text-2); }
.td-donebtn svg { opacity: .9; }
.td-donebtn:hover { color: var(--text); }
.td-donebtn.on { color: var(--text); background: var(--accent-soft);
  border-color: color-mix(in srgb, var(--accent) 36%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent); }
.td-donebtn.on svg { color: var(--accent-hover); opacity: 1; }
.td-backbtn { flex: 0 0 auto; width: 40px; padding: 0; color: var(--text-2); }
.td-backbtn:hover { color: var(--text); }
.td-addrow { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 8px 10px 8px 12px; border-radius: var(--r-md);
  background: color-mix(in srgb, var(--accent) 7%, var(--surface-2));
  border: 1px dashed color-mix(in srgb, var(--accent) 34%, var(--separator)); }
.td-addrow .td-plus { width: 24px; height: 24px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--accent-hover); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent); }
.td-addrow input { flex: 1; min-width: 0; height: 32px; border: none; background: transparent; color: var(--text); font: inherit; font-size: var(--t-14); padding: 0; }
.td-addrow input::placeholder { color: var(--text-4); }
.td-addrow input:focus { outline: none; }
.td-addrow .td-addchip { font-size: var(--t-12); font-weight: var(--w-semibold); color: var(--text-3); display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.td-scroll { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; padding-bottom: 2px; }
.td-flat { padding: 16px 18px; flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.td-list { display: flex; flex-direction: column; }
.td-flat .td-list { overflow: hidden; }
.td-flow { height: 100%; display: flex; flex-direction: column; }

/* ===================== CZAT (scoped .cz-*) ===================== */
.czat-main { overflow: hidden; }
.cz-ava { width:40px; height:40px; border-radius:var(--r-full); display:flex; align-items:center; justify-content:center; font-weight:var(--w-bold); font-size:15px; color:#fff; flex:0 0 auto; letter-spacing:-0.02em;
  background:linear-gradient(150deg, color-mix(in srgb, var(--cc) 86%, #fff 5%), var(--cc));
  box-shadow:0 0 0 .5px rgba(255,255,255,.15), 0 2px 8px color-mix(in srgb, var(--cc) 40%, transparent); }
.cz-ava.sm { width:34px; height:34px; font-size:13px; }
.cz-ava.xs { width:28px; height:28px; font-size:11px; }
.cz-ava.lg { width:46px; height:46px; font-size:17px; }
.cz-ava.xl { width:52px; height:52px; font-size:19px; }
.cz-ava.cz-group { background:
    conic-gradient(from 210deg, var(--accent) 0 25%, var(--c1) 25% 50%, var(--c3) 50% 75%, var(--c5) 75% 100%);
  box-shadow:0 0 0 .5px rgba(255,255,255,.18), 0 2px 10px rgba(0,0,0,.45); }
.cz-ava.cz-group .cz-glyph { display:flex; filter:drop-shadow(0 1px 2px rgba(0,0,0,.5)); }
.cz-ava-wrap { position:relative; flex:0 0 auto; }
.cz-on { position:absolute; right:-1px; bottom:-1px; width:12px; height:12px; border-radius:var(--r-full);
  background:var(--paid); box-shadow:0 0 8px var(--paid); border:2px solid var(--surface-solid); }
.cz-shell { flex:1; min-height:0; display:flex; flex-direction:column; }
.cz-card { flex:1; min-height:0; display:grid; overflow:hidden;
  background:color-mix(in srgb, var(--surface) 62%, transparent);
  border:0.5px solid var(--separator); border-radius:var(--r-2xl);
  box-shadow:var(--glass-edge), var(--shadow-lg);
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur); }
.cz-2col { grid-template-columns:332px 1fr; }
.cz-list { display:flex; flex-direction:column; min-height:0; border-right:0.5px solid var(--separator);
  background:color-mix(in srgb, var(--surface) 30%, transparent); }
.cz-list-head { flex:0 0 auto; padding:16px 16px 12px; display:flex; flex-direction:column; gap:12px;
  border-bottom:0.5px solid var(--separator); }
.cz-list-titlerow { display:flex; align-items:center; gap:11px; }
.cz-list-ic { width:34px; height:34px; border-radius:var(--r-md); flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  background:var(--accent-soft); color:var(--accent-hover); box-shadow:0 0 16px var(--accent-soft); }
.cz-list-title { font-size:var(--t-20); font-weight:var(--w-bold); letter-spacing:-0.02em; }
.cz-list-sub { font-size:var(--t-12); color:var(--text-3); margin-top:1px; }
.cz-newbtn { margin-left:auto; width:36px; height:36px; border-radius:var(--r-full); flex:0 0 auto;
  border:0.5px solid var(--separator-strong); background:var(--fill); color:var(--text-2);
  display:flex; align-items:center; justify-content:center; cursor:pointer; transition:color .15s, box-shadow .15s; }
.cz-newbtn:hover { color:var(--text); box-shadow:var(--accent-glow); }
.cz-search { display:flex; align-items:center; gap:10px; height:44px; padding:0 14px; border-radius:var(--r-md);
  border:1.5px solid var(--accent); background:var(--surface-2); box-shadow:0 0 0 4px var(--accent-soft);
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur); }
.cz-search svg { color:var(--accent); flex:0 0 auto; }
.cz-search input { border:none; background:transparent; outline:none; font:inherit; font-size:var(--t-15); color:var(--text); flex:1; min-width:0; }
.cz-search input::placeholder { color:var(--text-4); }
.cz-rows { flex:1; min-height:0; overflow-y:auto; padding:8px; display:flex; flex-direction:column; gap:2px; }
.cz-rowsec { font-size:var(--t-11); font-weight:var(--w-semibold); letter-spacing:.08em; text-transform:uppercase; color:var(--text-4);
  padding:10px 10px 4px; }
.cz-row { display:flex; align-items:center; gap:11px; padding:8px 10px; border-radius:var(--r-lg); cursor:pointer;
  border:0.5px solid transparent; transition:background .14s, border-color .14s; min-width:0; }
.cz-row:hover { background:color-mix(in srgb, var(--cc) 7%, var(--fill)); }
.cz-row.on { background:color-mix(in srgb, var(--cc) 14%, var(--surface-2));
  border-color:color-mix(in srgb, var(--cc) 34%, var(--separator)); }
.cz-row-main { flex:1; min-width:0; }
.cz-row-top { display:flex; align-items:baseline; gap:8px; }
.cz-row-name { font-size:var(--t-15); font-weight:var(--w-semibold); letter-spacing:-0.01em; flex:1; min-width:0;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--text); }
.cz-row.on .cz-row-name { color:color-mix(in srgb, var(--cc) 50%, var(--text)); }
.cz-row-time { font-size:var(--t-11); color:var(--text-3); flex:0 0 auto; font-variant-numeric:tabular-nums; }
.cz-row-bot { display:flex; align-items:center; gap:8px; margin-top:3px; }
.cz-row-last { flex:1; min-width:0; font-size:var(--t-13); color:var(--text-2); line-height:1.25;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cz-row-last b { color:var(--text); font-weight:var(--w-semibold); }
.cz-row.unread .cz-row-last { color:var(--text); }
.cz-dot { width:9px; height:9px; border-radius:var(--r-full); flex:0 0 auto;
  background:var(--cc); box-shadow:0 0 9px color-mix(in srgb, var(--cc) 70%, transparent); }
.cz-thread { display:flex; flex-direction:column; min-height:0; position:relative; }
.cz-th-head { flex:0 0 auto; display:flex; align-items:center; gap:13px; padding:14px 18px;
  border-bottom:0.5px solid var(--separator);
  background:color-mix(in srgb, var(--surface-solid) 30%, transparent); }
.cz-th-id { min-width:0; flex:1; }
.cz-th-name { font-size:var(--t-17); font-weight:var(--w-bold); letter-spacing:-0.02em; display:flex; align-items:center; gap:8px; }
.cz-th-sub { font-size:var(--t-12); color:var(--text-2); margin-top:2px; display:flex; align-items:center; gap:7px; }
.cz-th-sub .dot { color:var(--text-4); }
.cz-th-actions { display:flex; gap:6px; flex:0 0 auto; }
.cz-stream { flex:1; min-height:0; overflow-y:auto; padding:16px 20px; display:flex; flex-direction:column; gap:3px; }
.cz-day { align-self:center; font-size:var(--t-11); font-weight:var(--w-semibold);
  color:var(--accent-hover);
  background:var(--accent-soft); border:0.5px solid color-mix(in srgb, var(--accent) 28%, transparent);
  border-radius:var(--r-full); padding:3px 11px; margin:6px 0; letter-spacing:.02em; }
.cz-msg { display:flex; gap:9px; max-width:70%; }
.cz-msg.me { align-self:flex-end; flex-direction:row-reverse; }
.cz-msg-ava { align-self:flex-end; }
.cz-msg.cz-newblock { margin-top:11px; }
.cz-bubble { position:relative; padding:6px 11px; border-radius:var(--r-md); min-width:0; }
.cz-msg.them .cz-bubble { background:var(--surface-2); border:0.5px solid var(--separator);
  border-bottom-left-radius:var(--r-md); box-shadow:var(--glass-edge); }
.cz-msg.me .cz-bubble { background:linear-gradient(140deg, var(--accent), #5b6bff); color:#fff;
  border:0.5px solid transparent; border-bottom-right-radius:var(--r-md); box-shadow:var(--accent-glow); }
.cz-msg.them.cz-grouped .cz-bubble { border-top-left-radius:var(--r-xs); }
.cz-msg.me.cz-grouped .cz-bubble { border-top-right-radius:var(--r-xs); }
.cz-msg-name { font-size:var(--t-11); font-weight:var(--w-bold); letter-spacing:-0.01em; margin-bottom:2px; color:var(--cc); filter:brightness(1.15); }
.cz-msg-txt { font-size:var(--t-13); line-height:1.35; letter-spacing:-0.01em; }
.cz-msg-time { font-size:9px; margin-top:2px; text-align:right; }
.cz-msg.them .cz-msg-time { color:var(--accent-hover); opacity:.7; }
.cz-msg.me .cz-msg-time { color:rgba(255,255,255,.72); }
.cz-composer { flex:0 0 auto; display:flex; align-items:center; gap:11px; padding:14px 18px;
  border-top:0.5px solid var(--separator);
  background:color-mix(in srgb, var(--surface-solid) 30%, transparent); }
.cz-composer .cz-input { flex:1; height:46px; border-radius:var(--r-full); border:0.5px solid var(--separator-strong);
  background:var(--surface-2); color:var(--text); font:inherit; font-size:var(--t-15); padding:0 18px; letter-spacing:-0.01em;
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur); }
.cz-composer .cz-input::placeholder { color:var(--text-4); }
.cz-composer .cz-input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.cz-attach { width:44px; height:44px; border-radius:var(--r-full); flex:0 0 auto; border:0.5px solid var(--separator-strong);
  background:var(--fill); color:var(--text-2); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:color .15s; }
.cz-attach:hover { color:var(--text); }
.cz-send { width:46px; height:46px; border-radius:var(--r-full); flex:0 0 auto; border:none; cursor:pointer;
  background:linear-gradient(140deg, var(--accent), #5b6bff); color:#fff;
  display:flex; align-items:center; justify-content:center; box-shadow:var(--accent-glow); transition:transform .06s, box-shadow .15s; }
.cz-send:hover { box-shadow:0 0 30px color-mix(in srgb, var(--accent) 60%, transparent); }
.cz-send:active { transform:scale(.95); }

/* ===================== Goście (scoped .gst-*) ===================== */
.goscie-main { overflow: hidden; }
.gst-flow { height: 100%; display: flex; flex-direction: column; gap: 14px; padding-top: 4px; }
.gst-headcount { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.gst-search { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; border-radius: var(--r-full);
  background: var(--fill); border: 0.5px solid var(--separator); transition: border-color .15s, background .15s; }
.gst-search:focus-within { border-color: color-mix(in srgb, var(--accent) 40%, transparent); background: var(--accent-soft); }
.gst-search svg { color: var(--text-3); flex: 0 0 auto; }
.gst-search:focus-within svg { color: var(--accent-hover); }
.gst-search input { border: none; background: transparent; color: var(--text); font: inherit; font-size: var(--t-13);
  width: 150px; padding: 0; }
.gst-search input::placeholder { color: var(--text-4); }
.gst-search input:focus { outline: none; }
.gst-num { color: var(--accent-hover); font-weight: var(--w-bold);
  text-shadow: 0 0 12px color-mix(in srgb, var(--accent) 70%, transparent), 0 0 5px color-mix(in srgb, var(--accent) 45%, transparent); }
.gst-star { display: inline-flex; align-items: center; gap: 5px; height: 21px; padding: 0 9px; border-radius: var(--r-full);
  font-size: var(--t-11); font-weight: var(--w-bold); letter-spacing: .01em;
  color: var(--c5); background: color-mix(in srgb, var(--c5) 16%, transparent);
  border: 0.5px solid color-mix(in srgb, var(--c5) 30%, var(--separator));
  text-shadow: 0 0 10px color-mix(in srgb, var(--c5) 45%, transparent); }
.gst-star .gst-star-g { font-size: 11px; line-height: 1; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--c5) 60%, transparent)); }
.gst-statuslab { white-space: nowrap; }
.gst-statuschip { white-space: nowrap; }
.gst-panel { background: color-mix(in srgb, var(--surface) 62%, transparent);
  border: 0.5px solid var(--separator); border-radius: var(--r-2xl); box-shadow: var(--glass-edge), var(--shadow-md);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.gst-table { flex: 1; min-height: 0; overflow-y: auto; padding: 6px 16px 12px; }
.gst-thead, .gst-trow { display: grid; grid-template-columns: 250px 150px 70px 62px 104px 124px minmax(150px, 1fr); align-items: center; gap: 18px; }
.gst-thead { position: sticky; top: 0; z-index: 2; padding: 12px 8px 11px; font-size: var(--t-11); font-weight: var(--w-semibold);
  letter-spacing: .05em; text-transform: uppercase; color: var(--text-4); background: transparent; }
/* 1:1 _isolate-goscie-final: number/status columns left-aligned (not centred); last col stretches */
.gst-thead > :nth-child(n+3), .gst-trow > :nth-child(n+3) { text-align: left; font-variant-numeric: tabular-nums; }
.gst-thead > :nth-child(n+3):nth-child(-n+6), .gst-trow > :nth-child(n+3):nth-child(-n+6) { justify-self: start; justify-content: flex-start; }
.gst-thead > :nth-child(7), .gst-trow > :nth-child(7) { justify-self: stretch; }
.gst-trow { padding: 10px 8px; border-top: 0.5px solid var(--separator); cursor: pointer; transition: background .14s; }
.gst-trow:hover { background: var(--fill); }
.gst-trow.open { background: color-mix(in srgb, var(--cc, var(--accent)) 7%, var(--fill)); }
.gst-tname { display: flex; align-items: center; gap: 11px; min-width: 0; text-align: left; }
.gst-tava { width: 32px; height: 32px; border-radius: 9px; flex: 0 0 auto; position: relative; display: flex; align-items: center; justify-content: center;
  font-size: var(--t-13); font-weight: var(--w-bold); color: var(--cc, var(--accent));
  background: color-mix(in srgb, var(--cc, var(--accent)) 24%, transparent);
  box-shadow: 0 0 12px color-mix(in srgb, var(--cc, var(--accent)) 26%, transparent); }
/* długie nazwiska: zawijaj do max 2 linii w stałej szerokości (nie wchodzi na kolumnę TELEFON); reszta ucięta */
.gst-tnametxt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: var(--t-14); font-weight: var(--w-semibold); letter-spacing: -0.01em; white-space: normal; width: 132px; line-height: 1.2; }
.gst-tphone { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-13); color: var(--text-2); }
.gst-tphone svg { color: var(--text-3); }
.gst-tnum { font-size: var(--t-14); font-weight: var(--w-bold); }
.gst-tmoney { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.gst-recency { color: var(--text-2); font-weight: var(--w-medium); }
.gst-tstatus { display: flex; align-items: center; justify-content: space-between; gap: 7px; }
.gst-tchev { display: flex; color: var(--text-3); transition: transform .2s, color .15s; }
.gst-trow.open .gst-tchev { transform: rotate(90deg); color: var(--text); }
.gst-tdetail { grid-column: 1 / -1; padding: 4px 8px 12px 51px; }
.gst-visits { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.gst-visit { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: var(--r-md);
  background: color-mix(in srgb, var(--cc, var(--accent)) 9%, var(--surface-2));
  border: 0.5px solid color-mix(in srgb, var(--cc, var(--accent)) 24%, var(--separator)); cursor: pointer; }
.gst-visit-lane { width: 30px; height: 30px; border-radius: 9px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  font-size: var(--t-11); font-weight: var(--w-bold); color: #fff; background: var(--cc, var(--accent)); letter-spacing: -0.02em;
  box-shadow: 0 3px 12px color-mix(in srgb, var(--cc, var(--accent)) 48%, transparent); }
.gst-visit-main { flex: 1; min-width: 0; line-height: 1.12; }
.gst-visit-dates { font-size: var(--t-13); font-weight: var(--w-semibold); display: flex; align-items: center; gap: 8px; }
.gst-visit-meta { font-size: var(--t-11); color: var(--text-3); margin-top: 2px; }
.gst-visit-side { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.gst-visit-amt { font-size: var(--t-14); font-weight: var(--w-bold); letter-spacing: -0.01em; }
.gst-empty { padding: 28px 8px; text-align: center; color: var(--text-3); font-size: var(--t-13); font-style: italic; }

/* pasek akcji */
.set-actions { display: flex; gap: 12px; }

/* —— Ustawienia — przewijany obszar treści —— */
.set-scroll { flex: 1; min-height: 0; overflow-y: auto; padding-bottom: 2px; }
.set-card > .glabel { margin-bottom: 14px; }
.set-save { height: 42px; }

/* ceny dodatków — zwarte wiersze z ikoną-odznaką dodatku */
.set-pricegrid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.set-priceitem { display: flex; align-items: center; gap: 10px; min-width: 0; }
.set-priceitem-lab { flex: 1; min-width: 0; font-size: var(--t-14); font-weight: var(--w-semibold); letter-spacing: -0.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.set-priceitem .amount-wrap-sm { width: 94px; }

/* kompaktowo, żeby cały ekran mieścił się bez przewijania */
.set-card { padding: 14px 16px; }
.set-card > .glabel { margin-bottom: 11px; }
.set-card .field { gap: 6px; }
.set-card .amount-wrap { height: 50px; }
.set-pricegrid { gap: 8px; }
.set-account { padding-bottom: 12px; }

/* zaliczka liczona automatycznie (= cena 1 nocy) */
.set-autowrap { justify-content: flex-start; }
.set-autoval { color: var(--accent-hover); font-weight: var(--w-semibold); font-size: var(--t-15); letter-spacing: -0.01em; }

/* segment z ikoną (motyw / rozmiar czcionki) */
.set-iconseg button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.set-iconseg svg { flex: 0 0 auto; }
.set-fontA { font-weight: var(--w-bold); line-height: 1; }

/* kropka koloru przy nazwie dodatku */
.field-lab-svc { display: flex; align-items: center; gap: 7px; }
.set-svcdot { width: 9px; height: 9px; border-radius: 3px; flex: 0 0 auto; box-shadow: 0 0 0 1px color-mix(in srgb, currentColor 25%, transparent); }

/* konto zalogowanej osoby */
.set-account { display: flex; align-items: center; gap: 13px; padding-bottom: 14px; margin-bottom: 4px; border-bottom: 0.5px solid var(--separator); }
.set-avatar-lg { width: 52px; height: 52px; font-size: var(--t-17); }

/* —— Ustawienia: zakładki sekcji + jedna sekcja naraz (1:1 z _isolate-ustawienia-final.html, opcja 2) —— */
.set-host { display: flex; gap: 14px; min-height: 0; flex: 1; }
.set-pane { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.set-stack { display: grid; gap: 12px; align-content: start; grid-template-columns: 1fr; max-width: 920px; margin: 0 auto; width: 100%; }

/* zakładki (pigułka wyśrodkowana u góry) */
.set-tabs { display: flex; gap: 6px; flex: 0 0 auto; padding: 5px; border-radius: var(--r-full);
  width: max-content; margin: 0 auto 6px; background: var(--fill); border: 0.5px solid var(--separator); }
.set-tab { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; border-radius: var(--r-full);
  cursor: pointer; border: none; background: transparent; color: var(--text-2);
  font: var(--w-semibold) var(--t-13)/1 var(--font); letter-spacing: -0.01em;
  transition: background .15s, color .15s, filter .15s; }
.set-tab:hover { color: var(--text); filter: brightness(1.1); text-shadow: 0 0 10px rgba(255,255,255,0.28); }
.set-tab:hover svg { filter: drop-shadow(0 0 6px rgba(255,255,255,0.3)); }
.set-tab svg { flex: 0 0 auto; }
.set-tab.on { background: var(--surface-3); color: var(--text); box-shadow: var(--shadow-sm); filter: none; text-shadow: none; }
.set-tab.on svg { filter: none; }

/* karta sekcji */
.ssec { display: flex; flex-direction: column; padding: 24px 26px; }
.ssec-cnt { display: flex; flex-direction: column; gap: 12px; }
.ssec[data-grp="cennik"] .set-pricegrid { grid-template-columns: 1fr 1fr; }

/* tylko aktywna sekcja widoczna (sterowane data-sec na .set-host) */
.set-pane .ssec { display: none; }
.set-host[data-sec="profil"] .ssec[data-grp="profil"],
.set-host[data-sec="domki"]  .ssec[data-grp="domki"],
.set-host[data-sec="cennik"] .ssec[data-grp="cennik"],
.set-host[data-sec="oplaty"] .ssec[data-grp="oplaty"],
.set-host[data-sec="powiad"] .ssec[data-grp="powiad"],
.set-host[data-sec="chmura"] .ssec[data-grp="chmura"] { display: flex; }

/* wiersz domku (lista 6 domków) */
.house-row { display: flex; align-items: center; gap: 11px; padding: 9px 0; border-bottom: 0.5px solid var(--separator); }
.house-row:last-child { border-bottom: none; }
.house-dot { flex: 0 0 auto; width: 15px; height: 15px; border-radius: var(--r-full); background: var(--hc); box-shadow: 0 0 10px var(--hc); }
.house-name { flex: 1; min-width: 0; font-size: var(--t-14); font-weight: var(--w-semibold); letter-spacing: -0.01em; }
.house-cap { font-size: var(--t-12); color: var(--text-3); display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; min-width: 64px; }

/* wiersz powiadomienia (przełącznik) */
.notif-row { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 0.5px solid var(--separator); }
.notif-row:last-child { border-bottom: none; }
.notif-ic { flex: 0 0 auto; width: 34px; height: 34px; border-radius: var(--r-md); display: grid; place-items: center; color: var(--accent-hover); background: var(--accent-soft); }
.notif-main { flex: 1; min-width: 0; }
.notif-name { font-size: var(--t-14); font-weight: var(--w-semibold); letter-spacing: -0.01em; }
.notif-sub { font-size: var(--t-12); color: var(--text-3); margin-top: 1px; }

/* —— Dodaj wydatek (modal „Klasyk", 1:1 z _isolate-wydatek-final.html) —— */
.ex-sheet { width: 470px; max-width: calc(100% - 48px); }
.ex-ico { width: 46px; height: 46px; border-radius: var(--r-full); flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--unpaid) 16%, transparent); color: var(--unpaid);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--unpaid) 32%, transparent), 0 0 18px color-mix(in srgb, var(--unpaid) 40%, transparent); }
.ex-amt { position: relative; display: flex; align-items: center; height: 54px; border-radius: var(--r-md);
  border: 0.5px solid var(--separator-strong); background: var(--surface-2); padding: 0 var(--sp-4);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.ex-amt:focus-within { border-color: var(--unpaid); box-shadow: 0 0 0 3px var(--unpaid-soft); }
.ex-amt .ex-amt-sign { font-size: var(--t-24); font-weight: var(--w-bold); color: var(--unpaid); margin-right: 8px; flex: 0 0 auto;
  text-shadow: 0 0 14px color-mix(in srgb, var(--unpaid) 40%, transparent); }
.ex-amt input { flex: 1; min-width: 0; border: none; background: transparent; outline: none; color: var(--text);
  font: inherit; font-size: var(--t-24); font-weight: var(--w-bold); letter-spacing: -0.02em; }
.ex-amt input::placeholder { color: var(--text-4); }
.ex-amt .ex-amt-suf { color: var(--text-3); font-size: var(--t-17); font-weight: var(--w-medium); margin-left: 6px; flex: 0 0 auto; }
.ex-inwrap { position: relative; }
.ex-inwrap .ex-lead { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); display: flex; color: var(--lc, var(--text-3)); pointer-events: none; transition: color .2s;
  filter: drop-shadow(0 0 6px color-mix(in srgb, var(--lc, transparent) 50%, transparent)); }
.ex-inwrap .input { padding-left: 40px; }


/* ============================================================
   PORTED 1:1 FROM ISOLATE FINAL LAYER (zrodla/components.css 1466 -> end)
   Final 'wybor uzytkownika' override stack that was missing in v8.
   ============================================================ */
/* ===================== PANELE — wybór użytkownika =====================
   „Górne światło" (sheen) + poziom szkła 3. Dopisane na końcu, żeby
   nadpisać wcześniejsze definicje paneli. Panele: pasek boczny, kalendarz,
   Do dopłaty / Plan dnia (.duepanel), karty dni; zwrot osobno (tint zielony). */
/* wszystkie pola = identyczne, neutralne szkło (Do zwrotu BEZ zielonego tła — jak reszta) */
.dash-side, .dcal, .duepanel, .daycol, .zwrotpanel {
  background-color: color-mix(in srgb, var(--surface) 55%, transparent);
  background-image: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0) 40%);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  box-shadow: inset 0 1.5px 0 rgba(255,255,255,0.22), var(--shadow-md);
  border: 0.5px solid var(--separator);
}

/* ===================== PASKI REZERWACJI — wybór użytkownika =====================
   Opcja 3 (gradient/glossy) + siła 4 (Mocny). Dotyczy opłaconych pasków
   (.bar-filled); „brak zaliczki" (.bar-unpaid, kreskowane) zostaje osobnym stanem. */
.dcal .bar-filled {
  background-color: transparent;
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--cc) 64%, transparent), color-mix(in srgb, var(--cc) 28%, transparent));
  border: 0.5px solid color-mix(in srgb, var(--cc) 68%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.26); /* poświata wyłączona (wybór użytkownika) — zostaje tylko górny połysk */
}

/* ===================== PRZYCISKI + CHIPY STATUSU — wybór użytkownika =====================
   „Szkło + górne światło", intensywność: delikatne (poziom 2). Przyciski i chipy
   dostrojone osobno, ale oba na tym samym, delikatnym szkle. Blok na końcu, żeby
   nadpisać wcześniejsze definicje (kolejność źródła). Light: do dostrojenia później. */

/* — przyciski drugorzędne: Dziś, ‹ ›, Dodaj info, Dziś w Planie dnia — */
.btn:not(.btn-primary), .navchip, .daycol-add, .plan-today-btn {
  background-color: color-mix(in srgb, var(--surface) 55%, transparent);
  background-image: linear-gradient(180deg, rgba(255,255,255,0.09), rgba(255,255,255,0) 55%);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  border: 0.5px solid var(--separator);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), var(--shadow-sm);
}
.plan-today-btn { color: var(--accent-hover); border-color: color-mix(in srgb, var(--accent) 40%, var(--separator)); }

/* — przełącznik widoku Tydzień / 2 tyg. / Miesiąc — */
.seg { background-color: color-mix(in srgb, var(--surface) 40%, transparent);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.seg button.on {
  background: color-mix(in srgb, var(--surface) 72%, transparent);
  background-image: linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0) 60%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), var(--shadow-sm);
}

/* — CTA „Nowa rezerwacja": szklany klejnot „Głęboki indygo" (wybór użytkownika) — */
.btn-primary {
  background:
    radial-gradient(ellipse 70% 45% at 50% 0%, rgba(255,255,255,0.26) 0%, transparent 65%),
    linear-gradient(155deg, #2a26b8 0%, #3b35c9 30%, #5f5cee 65%, #b9b6ff 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.42), inset 0 -3px 6px rgba(0,0,0,0.35), inset 0 1px 18px rgba(80,76,220,0.30),
    0 0 20px rgba(80,76,200,0.55), 0 0 48px rgba(80,76,200,0.25), 0 6px 22px rgba(0,0,0,0.55);
  border: 0.5px solid rgba(185,182,255,0.35);
}

/* — chipy statusu: „Połysk (gradient)" (wybór użytkownika) — kolorowa tinta z gradientem + błysk u góry — */
.pevt-st, .chip {
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.24);
}
.pevt-st-paid, .chip-paid { background-color: transparent;
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--paid) 34%, transparent), color-mix(in srgb, var(--paid) 12%, transparent));
  border: 0.5px solid color-mix(in srgb, var(--paid) 30%, transparent); }
.pevt-st-unpaid, .chip-unpaid { background-color: transparent;
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--unpaid) 34%, transparent), color-mix(in srgb, var(--unpaid) 12%, transparent));
  border: 0.5px solid color-mix(in srgb, var(--unpaid) 30%, transparent); }
.chip-partial { background-color: transparent;
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--partial) 34%, transparent), color-mix(in srgb, var(--partial) 12%, transparent)); }
.pevt-st-neutral, .chip-neutral, .owechip {
  background-image: linear-gradient(180deg, var(--fill-2), var(--fill)); }

/* — liczniki w nagłówkach Do dopłaty / Do zwrotu: ta sama „bańka" co przy „Notatki domków"
   w sidebarze (.count-bubble.tinted — kółko, ten sam rozmiar). Kolor = --cc (Do dopłaty: --unpaid;
   Do zwrotu: --paid, przedefiniowany na panelu — patrz blok „DO ZWROTU · KOLOR"). — */

/* ===================== IKONKI — wybór użytkownika =====================
   „Wyraźne" — równa, mocna kreska 2.0 dla WSZYSTKICH ikon liniowych na każdym ekranie
   (nawigacja, górny pasek, kalendarz, plan dnia). Kreska na <svg> i jej elementach;
   CSS bije atrybut presentation strokeWidth ustawiany per wywołanie Ico(). */
.scr svg, .scr svg * { stroke-width: 2.0; }

/* ===================== WSPÓLNY STYL 3 PÓL — wybór użytkownika (poprawione) =====================
   Plan dnia + Do dopłaty + Do zwrotu: minimal, JEDNOLITE tło (jak tło strony — bez ramek, bez tinty),
   cienkie separatory między wierszami. Status = KROPKA (.pin): zielona=opłacone, czerwona=brak —
   tak jak w Do dopłaty/Do zwrotu. (Wcześniejsze kolorowe obwódki USUNIĘTE.) */
/* separatory wierszy sięgają obrysu pola (jak dolna kreska nagłówka), a NIE urywają się
   przed krawędzią; tekst i kropki statusu zostają na swoim miejscu (padding przejmuje wcięcie).
   Dzień: body wychodzi w padding karty (−7px = poziomy padding .daycol), pevt oddaje to w padding. */
.daycol-body { gap: 0; margin-left: -7px; margin-right: -7px; }
.due-list, .zwrot-list { padding: 2px 0; }
.pevt { background: transparent; border: none; border-radius: 0; padding: 6px 11px; }
.payrow { background: transparent; border-bottom: none; padding: 8px 18px; }
.pevt + .pevt, .payrow + .payrow { border-top: 0.5px solid var(--separator); }
/* dymek święta / „brak czynności" zostają wcięte mimo pełnoszerokiego body */
.daycol-hol, .daycol-empty { margin-left: 7px; margin-right: 7px; }
/* kropka statusu w wierszu zdarzenia (jak .pin w payrow) — dosunięta w prawo */
.pevt .pin { margin-left: auto; align-self: center; }

/* ===================== OPRAWA IKON — wybór użytkownika (premium linia + drogi blask) =====================
   Atom #6 PRZEDEFINIOWANY: cieńsza, „jubilerska" kreska 1.6 z miękkimi końcami/złączami (premium linia)
   + delikatna poświata na ikonach akcentowych/aktywnych (drogi blask). Nadpisuje wcześniejsze 2.0.
   Same KSZTAŁTY glifów zmieniamy osobno (runda „glify pogoda/inne/inne"). */
.scr svg, .scr svg * { stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
/* drogi blask — halo na akcentowych/aktywnych ikonach */
.dcal-today svg { filter: drop-shadow(0 0 6px color-mix(in srgb, var(--accent) 55%, transparent)); }
.daycard-head .plan-today-btn svg { filter: drop-shadow(0 0 6px color-mix(in srgb, var(--accent) 50%, transparent)); }
.lane-house { filter: drop-shadow(0 0 9px currentColor); }
.row-house { filter: drop-shadow(0 0 8px currentColor); }

/* ===================== SIDEBAR — wybór użytkownika (z wersji 1: tylko marka „J" + licznik notatek) =====================
   „J" (.brand-mark) = świecący szklany kafel indygo + cięższy napis „Jotwingia";
   licznik notatek (.count-bubble) świeci w kolorze domku. RESZTA sidebara = stan bazowy (bez zmian). */
.brand-mark {
  background-image: linear-gradient(180deg, rgba(255,255,255,0.28), rgba(255,255,255,0) 50%), linear-gradient(140deg, var(--accent), #18b4ff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45), var(--accent-glow), 0 0 22px rgba(95,90,255,0.6);
}
.brand-name { font-weight: var(--w-black); letter-spacing: -0.03em; }
.count-bubble.tinted { box-shadow: 0 0 11px color-mix(in srgb, var(--cc) 50%, transparent), inset 0 1px 0 rgba(255,255,255,0.18); }

/* ===================== BAR GÓRNY — wybór użytkownika (drill v2: szklane pigułki kontrolek) =====================
   Layout = oryginał (search normalnej wielkości), kolory tekstu/ikon NEUTRALNE jak w sidebarze;
   kontrolki = pływające szkło (połysk + blur + krawędź światła); pasek pozostaje przezroczysty. */
.dtop-search { flex: 0 1 400px; height: 46px; padding: 0 18px; gap: 11px; color: var(--text-2); }
.dtop-search input { font-size: var(--t-14); color: var(--text); }
.dtop-search input::placeholder { color: var(--text-3); }
.theme-toggle, .iconbtn, .dtop-user { color: var(--text-2); }
.dtop-search, .theme-toggle, .dtop-user, .iconbtn {
  background-color: color-mix(in srgb, var(--surface) 58%, transparent);
  background-image: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 58%);
  -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  border: 0.5px solid var(--separator);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.16), var(--shadow-sm);
}

/* ===================== KALENDARZ — wybór użytkownika (drill v4: kropka „dziś" Z PRAWEJ) =====================
   Pigułki nagłówków JEDNOLITE/neutralne (te same dla każdego dnia); weekend = TYLKO skrót „sb/nd" czerwony,
   numery jednakowe; „dziś" = numer fioletowy BEZ glow + fioletowa kropka 7px w PRAWYM górnym rogu;
   święto = bez żółtej kropki (nazwa święta ZOSTAJE); rynna domków = kolorowy znacznik + świecący Dn + odstęp torów. */
.dcal .cal-headrow { padding: 6px 0 7px !important; }
.dcal .day-head { border-left: none !important; padding: 7px 0 8px !important;
  margin: 0 3px !important; border-radius: var(--r-sm) !important;
  background: color-mix(in srgb, var(--surface) 30%, transparent) !important;
  border: 0.5px solid var(--separator) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; }
.dcal .day-head.weekend, .dcal .day-head.holiday, .dcal .day-head.today {
  background: color-mix(in srgb, var(--surface) 30%, transparent) !important;
  border-color: var(--separator) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important; }
.dcal .day-head.weekend .dom { color: var(--text) !important; }
.dcal .day-head.holiday .dom { color: var(--text) !important; }
.dcal .day-head .dow { color: var(--text-3) !important; }
.dcal .day-head.weekend .dow { color: var(--unpaid) !important; font-weight: var(--w-bold) !important; }
.dcal .day-head.today .dom { color: var(--accent) !important; text-shadow: none !important;
  background: none !important; width: auto !important; height: auto !important;
  line-height: inherit !important; border-radius: 0 !important; box-shadow: none !important;
  display: block !important; margin-top: 2px !important; }
.dcal .day-head.holiday .holdot { display: none !important; }
/* „dziś" = szklany klejnot (neon) jak kropki statusu w polu dnia, tylko fioletowy (akcent) */
.dcal .day-head.today::after { content: ""; position: absolute; top: 6px; right: 7px;
  width: 9px; height: 9px; border-radius: var(--r-full); z-index: 3;
  background:
    radial-gradient(circle at 36% 28%, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0) 26%),
    radial-gradient(120% 120% at 60% 80%, #c7c5ff 0%, var(--accent) 44%, #2a26b8 100%) !important;
  box-shadow: 0 0 3px #8e8bff, 0 0 7px rgba(123,120,255,0.75),
    inset 0 0.5px 0.5px rgba(255,255,255,0.7), inset 0 -1px 1.5px rgba(0,0,0,0.4) !important; }
/* święto = ten sam szklany klejnot co „dziś", tylko żółty (--c5); nazwa święta zostaje pod spodem */
.dcal .day-head.holiday::after { content: ""; position: absolute; top: 6px; right: 7px;
  width: 9px; height: 9px; border-radius: var(--r-full); z-index: 3;
  background:
    radial-gradient(circle at 36% 28%, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0) 26%),
    radial-gradient(120% 120% at 60% 80%, #ffe9a8 0%, var(--c5) 44%, #9a6b00 100%) !important;
  box-shadow: 0 0 3px #ffd54a, 0 0 7px rgba(255,198,61,0.75),
    inset 0 0.5px 0.5px rgba(255,255,255,0.7), inset 0 -1px 1.5px rgba(0,0,0,0.4) !important; }
.dcal .lane-head { border-right: none !important;
  box-shadow: inset -2px 0 0 color-mix(in srgb, var(--cc, var(--accent)) 70%, transparent) !important;
  gap: 3px !important; }
.dcal .cal-lane { --cc: var(--accent); }
.dcal-lanes .cal-lane:nth-child(1) { --cc: var(--c1); }
.dcal-lanes .cal-lane:nth-child(2) { --cc: var(--c2); }
.dcal-lanes .cal-lane:nth-child(3) { --cc: var(--c3); }
.dcal-lanes .cal-lane:nth-child(4) { --cc: var(--c4); }
.dcal-lanes .cal-lane:nth-child(5) { --cc: var(--c5); }
.dcal-lanes .cal-lane:nth-child(6) { --cc: var(--c6); }
.dcal .lane-dcode { font-size: var(--t-15) !important; text-shadow: 0 0 10px currentColor !important; }
.dcal .lane-house { filter: drop-shadow(0 0 9px currentColor) !important; }
/* BEZ poziomych linii — tory stykają się (border 0), więc PIONOWE linie dni
   pozostają ciągłe/pełne bez przerw (decyzja użytkownika 2026-06-02). */
.dcal-lanes .cal-lane { border-bottom: none !important; }
.dcal { --cal-grid: rgba(255,255,255,0.11) !important; }

/* ===================== PLAN DNIA — wiersz zdarzenia (wybór użytkownika 2026-06-02) =====================
   Zamiast „D2": kolorowy domek (ikona + numer, jak w Do dopłaty / Do zwrotu). Opis (np. „21:00 Full SPA")
   leży w TEJ SAMEJ, wyśrodkowanej linii co domek. Pełny opis — bez ucinania. */
.pevt { align-items: center; }
.pevt .pevt-house { flex: 0 0 auto; }
.pevt .row-dcode { font-size: var(--t-14); }
/* większa czcionka opisu; długi opis zawija się do max 2 linii (karta dnia ta sama wielkość — nadmiar treści chowa się poniżej) */
.daycol { flex: 0 0 248px; }
.pevt-act { flex: 1 1 auto; min-width: 0; align-self: center; margin-top: 0;
  font-size: var(--t-14); white-space: normal; overflow: hidden;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.25; }

/* ===================== DO ZWROTU · KOLOR (wybór użytkownika) =====================
   „Do zwrotu" pokazuje kaucje DO ODDANIA — zielony („opłacone / zrobione") jest tu mylący.
   Cały akcent panelu (suma, licznik, kwoty wierszy, kropki) jedzie z JEDNEJ pary zmiennych
   --paid / --paid-soft przedefiniowanych NA .zwrotpanel. Zmiana tych dwóch wartości = zmiana koloru.
   WYBÓR UŻYTKOWNIKA (2026-06-02): biały / neutralny. */
.zwrotpanel { --paid: #e9ebf5; --paid-soft: rgba(233,235,245,0.20); }
/* kropka „zwrot w całości" = klejnot w kolorze akcentu (zamiast zielonego); „potrącenie" zostaje bursztynowe */
.zwrotpanel .pin-paid { --pin-d: color-mix(in srgb, var(--paid) 64%, #000);
  --pin-m: var(--paid); --pin-b: #ffffff; --pin-h: var(--paid); }

/* ===================== KALENDARZ · ROZMIAR — wybór użytkownika: wersja 1 (+15%) (2026-06-02) =====================
   Większe domki w rynnie + zawartość nagłówka dnia (dzień tygodnia, liczba, pogoda) + wyższe komórki.
   !important, bo nadpisuje zamrożony stan kalendarza z bloku 1605+. */
.dcal .dcal-body { --rail-w: 58px !important; }
.dcal .lane-head .lane-house svg { width: 28px !important; height: 28px !important; }
.dcal .lane-dcode { font-size: 17px !important; }
.dcal .cal-headrow { padding: 7px 0 8px !important; }
/* pola dni (liczba + pogoda) trochę mniejsze, z zachowaniem skali — reszta bez zmian (rynna domków zostaje) */
.dcal .day-head { padding: 5px 0 6px !important; }
.dcal .day-head .dom { font-size: 17px !important; }
.dcal .day-head .dow { font-size: 11px !important; }
.dcal .day-head .wx svg { width: 17px !important; height: 17px !important; }

/* ===================== UJEDNOLICONE LICZNIKI — cała apka (wybór użytkownika 2026-06-02) =====================
   Każda „liczba = ile czegoś" wygląda jak bańka z Pulpitu (.count-bubble.tinted): pigułka/kółko,
   tinta w kolorze kontekstu, delikatny blask. Treść zostaje (np. „×2", liczba). Kolor:
   liczba usług / gości = akcent (fiolet); mnożniki ×N = kolor danej usługi (--sc). */
.svc-title-bubble, .exg-mult, .svc-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 6px; border: none; border-radius: var(--r-full);
  font-size: var(--t-11); font-weight: var(--w-bold); font-variant-numeric: tabular-nums; line-height: 1;
  background: color-mix(in srgb, var(--cb) 26%, transparent) !important; color: var(--cb) !important; text-shadow: none;
  box-shadow: 0 0 11px color-mix(in srgb, var(--cb) 48%, transparent), inset 0 1px 0 rgba(255,255,255,0.20) !important;
}
.svc-title-bubble { --cb: var(--accent-hover); }
.exg-mult  { --cb: var(--sc); }
.svc-count { --cb: var(--sc); }   /* korner pickera usługi — zostaje „×N", pozycja absolutna z .svc-count bez zmian */
/* licznik gości w nagłówku „Szukaj gościa" — ta sama tinta/blask co bańka, zachowuje etykietę „gości" */
.gq-count { border: none; background: color-mix(in srgb, var(--accent-hover) 22%, transparent); color: var(--accent-hover);
  box-shadow: 0 0 11px color-mix(in srgb, var(--accent-hover) 42%, transparent), inset 0 1px 0 rgba(255,255,255,0.18); }
.gq-count b { color: inherit; font-weight: var(--w-bold); }

/* ===================== HOVER GLOW — reguła globalna (2026-06-02) =====================
   Najechanie na DOWOLNY przycisk: świeci się sama czcionka/ikona, POLE bez zmian.
   Kolor poświaty = kolor czcionki (currentColor): biała/szara (jaśnieje do bieli) → biały glow;
   kolorowa (czerwień/akcent) → WZMOŻONY glow w swoim kolorze. drop-shadow na <svg> nie rusza tła. */

/* — biały/jasny glow tekstu (te elementy jaśnieją do --text na hover) — */
.btn:hover, .btn-primary:hover, .dnav-item:hover, .note-row:hover .note-txt, .side-notes-btn:hover,
.daycol-add:hover, .edit-back:hover, .spt:hover, .avail-reset:hover, .avail-book:hover,
.gq-clear:hover, .gq-row:hover, .sres:hover, .cfilter-row:hover, .pay-tile:hover, .svc-btn:hover,
.extra-tile:hover, .exg-solo:hover, .exg-item:hover, .editpage-main .extra-existing:hover,
.tpill:hover, .cal-day:hover:not(.blank) {
  text-shadow: 0 0 2px currentColor;
}
.seg button:hover { color: var(--text); text-shadow: 0 0 2px currentColor; }

/* — wzmożony glow w kolorze czcionki (czerwień / akcent) — */
.btn-danger:hover, .dlogout:hover, .plan-today-btn:hover, .svc-step:hover, .hn-note-x:hover,
.hn-add:hover, .calp-all:hover, .set-addrow:hover {
  text-shadow: 0 0 3px currentColor;
}

/* — glow ikon w kolorze ikony (drop-shadow nie zmienia tła/pola przycisku) — */
.btn:hover svg, .btn-primary:hover svg, .iconbtn:hover svg, .navchip:hover svg,
.dcal-head .navchip:hover svg, .side-collapse:hover svg, .due-collapse:hover svg, .daycol-add:hover svg,
.dtop-search-clear:hover svg, .modal-close:hover svg, .edit-back:hover svg, .plan-today-btn:hover svg,
.dnav-item:hover .dnav-ico svg, .theme-toggle:hover svg, .spt:hover svg, .avail-book:hover svg {
  filter: drop-shadow(0 0 1px currentColor);
}

/* ===================== POPRAWKI 2026-06-02 (wybór użytkownika) ===================== */

/* 1 — ikona + tekst zawsze w jednej linii, wyśrodkowane w pionie: inline SVG na środku
   linii tekstu (domyślne vertical-align:baseline spycha ikonę w dół/górę) */
.scr svg { vertical-align: middle; }

/* 2 — „Dziś" w Plan dnia: TEKST neutralny jak w kalendarzu, tylko IKONKA fioletowa */
.plan-today-btn, .plan-today-btn:hover { color: var(--text); text-shadow: none; }
.plan-today-btn svg { color: var(--accent-hover); }

/* 3 — Do zwrotu: pod kwotą netto „całość" (cała kaucja oddana) albo „z [pełna kwota]"
   (gdy potrącenie), wyrównane do prawej DOKŁADNIE pod kwotą (margines = kropka + odstęp) */
.zwrot-amt { flex-direction: column; align-items: flex-end; gap: 1px; }
.zwrot-amt-top { display: inline-flex; align-items: center; gap: 7px; }
.zwrot-amt-sub { font-size: var(--t-11); font-weight: var(--w-semibold); color: var(--text-3);
  white-space: nowrap; line-height: 1.1; margin-right: 16px; }

