/* ============================================================
   Kalendarz streamów — style
   ============================================================ */

:root{
  --bg:            #0a0812;
  --bg-2:          #120e1f;
  --surface:       rgba(255,255,255,.045);
  /* Panele zostają półprzezroczyste — samo przenikanie jest tanie, kosztowne
     było rozmywanie tła pod nimi (backdrop-filter). Za panelami leży tylko
     statyczny gradient, więc bez blura wygląda to praktycznie tak samo. */
  --surface-panel: rgba(255,255,255,.05);
  --surface-2:     rgba(255,255,255,.07);
  --stroke:        rgba(255,255,255,.09);
  --stroke-strong: rgba(255,255,255,.16);

  --text:          #ece9f5;
  --text-dim:      #a49fbb;
  --text-faint:    #6f6a87;

  --brand:         #9146ff;
  --brand-2:       #c084fc;
  --brand-soft:    rgba(145,70,255,.16);
  --accent:        #22d3ee;
  --live:          #ff3d6e;
  --ok:            #34d399;

  --r-sm: 10px;
  --r:    16px;
  --r-lg: 24px;

  --shadow: 0 24px 60px -20px rgba(0,0,0,.75);
  --font: "Outfit", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
}

*{ box-sizing:border-box; }

/* Atrybut hidden musi zawsze wygrywać. Bez tego reguły w rodzaju
   .btn{display:inline-flex} odsłaniały ukryte elementy — każdy widz
   widział plakietkę „Tryb edycji” i przycisk „Zaplanuj transmisję”. */
[hidden]{ display:none !important; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  min-height:100vh;
  font-family:var(--font);
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* Tło jako osobna warstwa przyklejona do okna.
   Wcześniej był to gradient na <body> z background-attachment:fixed — a to
   zmusza przeglądarkę do przemalowania całego tła przy każdej klatce
   przewijania. Element position:fixed dostaje własną warstwę kompozytora,
   którą maluje się raz i przy przewijaniu już nie rusza. */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(1100px 780px at 8% -12%, #2c1f52 0%, transparent 62%),
    radial-gradient(900px 640px at 98% -4%, #113247 0%, transparent 58%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
}

/* --max-w: górny limit szerokości treści, --gutter: odstęp od krawędzi ekranu.
   Oba do podkręcenia w jednym miejscu, jeśli chcesz jeszcze ciaśniej lub luźniej. */
:root{ --max-w:1520px; --gutter:1rem; }

.wrap{ width:min(var(--max-w), 100% - var(--gutter) * 2); margin-inline:auto; }

/* Poświaty tła robił wcześniej duet elementów .glow: dwa koła po 46vw
   z filter:blur(120px), animowane w nieskończoność. Na ekranie 1920 px to
   dwie warstwy ~880x880 px, które karta graficzna rozmywała bez przerwy —
   także wtedy, gdy strona stała nieruszona. Ten sam efekt daje teraz
   statyczny gradient w body::before, za darmo. */

main, header, footer{ position:relative; z-index:1; }

/* ---------- header ---------- */
/* Nagłówek jest przyklejony do góry, więc przemalowuje się przy każdej
   klatce przewijania — backdrop-filter kosztował tu najwięcej ze wszystkiego.
   Zamiast rozmycia dajemy gęstsze, nieprzezroczyste tło. */
.site-header{
  position:sticky; top:0; z-index:40;
  background:linear-gradient(180deg, #0d0a17 0%, rgba(13,10,23,.94) 100%);
  border-bottom:1px solid var(--stroke);
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.85rem 0; }

.brand{ display:flex; align-items:center; gap:.75rem; text-decoration:none; color:inherit; }
.brand-mark{
  display:grid; place-items:center; width:42px; height:42px; border-radius:13px;
  background:linear-gradient(140deg, var(--brand), #6d28d9);
  box-shadow:0 8px 22px -8px var(--brand);
}
.brand-mark svg{ width:21px; height:21px; }
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-text strong{ font-size:1.05rem; font-weight:700; letter-spacing:-.01em; }
.brand-text small{ font-size:.72rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:.14em; }

.header-actions{ display:flex; align-items:center; gap:.5rem; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.62rem 1rem; border-radius:var(--r-sm);
  border:1px solid var(--stroke-strong); background:var(--surface);
  color:var(--text); font:inherit; font-size:.9rem; font-weight:600;
  cursor:pointer; text-decoration:none; white-space:nowrap;
  transition:transform .18s, background .18s, border-color .18s, box-shadow .18s;
}
.btn svg{ width:17px; height:17px; flex:none; }
.btn:hover{ transform:translateY(-1px); background:var(--surface-2); border-color:var(--brand); }
.btn:active{ transform:translateY(0); }
.btn.sm{ padding:.42rem .7rem; font-size:.82rem; }
.btn.icon-only{ padding:.62rem; }
.btn.icon-only svg{ width:18px; height:18px; }

.btn-primary{
  background:linear-gradient(135deg, var(--brand), #7c3aed);
  border-color:transparent; color:#fff;
  box-shadow:0 12px 28px -12px var(--brand);
}
.btn-primary:hover{ background:linear-gradient(135deg, #a06bff, #8b5cf6); }
.btn-twitch{ background:var(--brand-soft); border-color:rgba(145,70,255,.45); color:#d7c4ff; }
.btn-ghost.danger:hover{ border-color:var(--live); color:#ffb3c6; }

.icon-btn{
  display:grid; place-items:center; width:36px; height:36px; border-radius:10px;
  background:var(--surface); border:1px solid var(--stroke); color:var(--text);
  cursor:pointer; transition:background .18s, border-color .18s;
}
.icon-btn svg{ width:17px; height:17px; }
.icon-btn:hover{ background:var(--surface-2); border-color:var(--brand); }

/* ---------- hero ---------- */
.hero{
  display:grid; grid-template-columns:1.35fr .95fr; gap:1.5rem;
  margin:2.5rem 0 1.5rem;
  padding:2rem;
  border-radius:var(--r-lg);
  border:1px solid var(--stroke);
  background:
    radial-gradient(700px 320px at 0% 0%, rgba(145,70,255,.20), transparent 65%),
    var(--surface-panel);
  box-shadow:var(--shadow);
}
.eyebrow{
  display:flex; align-items:center; gap:.5rem;
  margin:0 0 .6rem; font-size:.74rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase; color:var(--text-faint);
}
/* Puls robiony na transform i opacity — te dwie właściwości obsługuje
   kompozytor, więc nie wymuszają przemalowania przy każdej klatce.
   Wcześniej animowany był box-shadow, czyli czysty paint. */
.dot-pulse{
  position:relative; width:8px; height:8px; flex:none;
  border-radius:50%; background:var(--live);
}
.dot-pulse::after{
  content:""; position:absolute; inset:0;
  border-radius:50%; background:var(--live);
  animation:pulse 2s ease-out infinite;
}
@keyframes pulse{
  0%{ transform:scale(1); opacity:.55; }
  70%{ transform:scale(3.4); opacity:0; }
  100%{ transform:scale(3.4); opacity:0; }
}

.hero-title{
  margin:0 0 .5rem; font-size:clamp(1.7rem, 3.6vw, 2.7rem);
  font-weight:800; letter-spacing:-.03em; line-height:1.1;
  background:linear-gradient(100deg, #fff 25%, var(--brand-2));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-meta{ margin:0 0 1.4rem; color:var(--text-dim); font-size:1rem; }
.hero-meta b{ color:var(--text); }

.countdown{ display:flex; gap:.6rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.cd-cell{
  min-width:74px; padding:.7rem .5rem; text-align:center;
  border-radius:14px; border:1px solid var(--stroke);
  background:rgba(0,0,0,.28);
}
.cd-cell b{ display:block; font-family:var(--mono); font-size:1.7rem; font-weight:700; letter-spacing:-.02em; }
.cd-cell span{ font-size:.66rem; text-transform:uppercase; letter-spacing:.14em; color:var(--text-faint); }

.hero-right{ display:flex; flex-direction:column; }
.week-strip{ display:flex; flex-direction:column; gap:.4rem; flex:1; }
.wk-row{
  display:grid; grid-template-columns:2.6rem 1fr auto; align-items:center; gap:.7rem;
  padding:.6rem .8rem; border-radius:12px;
  border:1px solid transparent; background:rgba(0,0,0,.22);
  font-size:.88rem; transition:background .18s, border-color .18s;
}
.wk-row.has{ border-color:rgba(145,70,255,.4); background:rgba(145,70,255,.10); }
.wk-row.today{ box-shadow:inset 0 0 0 1px var(--accent); }
.wk-row .wd{ font-weight:700; color:var(--text-dim); text-transform:uppercase; font-size:.72rem; letter-spacing:.1em; }
.wk-row .wt{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-faint); }
.wk-row.has .wt{ color:var(--text); }
.wk-row .wh{ font-family:var(--mono); font-size:.8rem; color:var(--brand-2); }

/* ---------- panels ---------- */
.panel{
  margin-bottom:1.5rem; padding:1.5rem;
  border-radius:var(--r-lg); border:1px solid var(--stroke);
  background:var(--surface-panel);
  box-shadow:var(--shadow);
}
.panel-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; margin-bottom:1.2rem;
}
.panel-head h2{ margin:0; font-size:1.2rem; font-weight:700; letter-spacing:-.01em; }
.month-nav{ display:flex; align-items:center; gap:.6rem; }
.month-nav h2{ min-width:11ch; text-align:center; text-transform:capitalize; }

.filters{ display:flex; gap:.4rem; flex-wrap:wrap; }
.chip{
  padding:.36rem .8rem; border-radius:999px; font-size:.8rem; font-weight:600;
  border:1px solid var(--stroke); background:var(--surface); color:var(--text-dim);
  cursor:pointer; transition:background .18s, border-color .18s, color .18s;
}
.chip:hover{ border-color:var(--brand); color:var(--text); }
.chip.active{ background:var(--brand); border-color:var(--brand); color:#fff; }

/* ---------- calendar ---------- */
/* minmax(0,1fr) zamiast 1fr — bez tego kolumna nie może zejść poniżej
   szerokości swojej treści i siatka rozpycha panel na średnich ekranach */
.cal-head{
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.5rem; margin-bottom:.5rem;
}
.cal-head span{
  text-align:center; font-size:.72rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint);
}
.cal-grid{
  --cell-pad:.55rem; --cal-gap:.5rem;
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:var(--cal-gap);
}

.day{
  position:relative; display:flex; flex-direction:column; gap:.3rem;
  min-height:104px; padding:.45rem var(--cell-pad) var(--cell-pad); min-width:0;
  border-radius:14px; border:1px solid var(--stroke);
  background:rgba(0,0,0,.22); cursor:default;
  transition:transform .18s, border-color .18s, background .18s;
}
.day.out{ opacity:.32; }
.day.clickable{ cursor:pointer; }
/* bez podnoszenia kratki — przesuwałoby paski eventów i utrudniało celowanie przy przeciąganiu */
.day.clickable:hover{ border-color:var(--brand); background:rgba(145,70,255,.12); }
.day .num{
  display:flex; align-items:center; height:24px;
  font-family:var(--mono); font-size:.85rem; font-weight:700; color:var(--text-dim);
}
.day.today .num{
  display:grid; place-items:center; width:24px; height:24px; border-radius:50%;
  background:var(--accent); color:#04222a;
}
.day.has{ background:linear-gradient(160deg, rgba(145,70,255,.16), rgba(0,0,0,.24)); border-color:rgba(145,70,255,.35); }
.day.past{ opacity:.5; }

/* ---------- transmisja w kratce: grafika + tytuł ---------- */
.ev-tile{ position:relative; display:flex; flex-direction:column; gap:.3rem; min-width:0; }
.ev-tile-img{
  position:relative; aspect-ratio:16/9; border-radius:9px; overflow:hidden;
  background:rgba(0,0,0,.4); border:1px solid rgba(255,255,255,.1);
  box-shadow:0 6px 16px -8px rgba(0,0,0,.85);
  transition:box-shadow .16s;
}
.ev-tile-cover{ width:100%; height:100%; object-fit:cover; display:block; }
.ev-tile .cover-ph span{ font-size:1.5rem; }
.ev-tile:hover .ev-tile-img{ box-shadow:0 0 0 2px var(--brand-2), 0 6px 16px -8px rgba(0,0,0,.85); }
.ev-tile-body{ display:flex; flex-direction:column; gap:.08rem; min-width:0; }
.ev-tile-title{
  font-size:.78rem; font-weight:700; line-height:1.25; color:var(--text);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; overflow-wrap:anywhere;
}
.ev-tile-meta{
  font-family:var(--mono); font-size:.66rem; font-weight:700; color:var(--brand-2);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ev-tile.cancelled .ev-tile-cover{ filter:grayscale(.9); opacity:.5; }
.ev-tile.cancelled .ev-tile-title{ text-decoration:line-through; color:var(--text-faint); }

/* kilka transmisji jednego dnia — kompaktowe wiersze z miniaturą */
.ev-row{
  display:flex; align-items:center; gap:.4rem; min-width:0;
  padding:.2rem; border-radius:8px;
  background:rgba(0,0,0,.3); border:1px solid rgba(255,255,255,.07);
}
.ev-row-img{ width:40px; aspect-ratio:16/9; border-radius:5px; overflow:hidden; flex:none; }
.ev-row-cover{ width:100%; height:100%; object-fit:cover; display:block; }
.ev-row .cover-ph span{ font-size:.7rem; }
.ev-row-body{ display:flex; flex-direction:column; min-width:0; }
.ev-row-title{ font-size:.7rem; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ev-row-meta{ font-family:var(--mono); font-size:.6rem; color:var(--brand-2); white-space:nowrap; }
.ev-row.cancelled .ev-row-title{ text-decoration:line-through; color:var(--text-faint); }
.ev-more{ font-size:.68rem; color:var(--text-faint); padding-left:.2rem; }

/* pasek łączący dni eventu wielodniowego — sięga przez odstęp do sąsiedniej kratki */
.ev-span{
  display:block; height:4px; background:var(--brand-2);
  margin:0 calc(-1 * (var(--cell-pad) + var(--cal-gap) / 2) - 1px);
}
.ev-span.seg-start{ margin-left:0; border-radius:4px 0 0 4px; }
.ev-span.seg-end{ margin-right:0; border-radius:0 4px 4px 0; }
.ev-span.wk-first{ margin-left:0; }
.ev-span.wk-last{ margin-right:0; }

/* ---------- etykiety ---------- */
.si-time{ font-family:var(--mono); color:var(--brand-2); font-weight:700; }
.tag{
  padding:.16rem .55rem; border-radius:999px; font-size:.7rem; font-weight:700;
  letter-spacing:.04em; background:var(--brand-soft); color:#cbb0ff;
  border:1px solid rgba(145,70,255,.3);
}
.tag.red{ background:rgba(255,61,110,.15); color:#ff9fb7; border-color:rgba(255,61,110,.35); }

.empty{ padding:2.4rem 1rem; text-align:center; color:var(--text-faint); font-size:.92rem; }

/* ---------- footer ---------- */
.site-footer{ border-top:1px solid var(--stroke); margin-top:2rem; padding:1.6rem 0 2.4rem; }
.footer-inner{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.84rem; color:var(--text-dim); }

/* ---------- modale ---------- */
.modal{ position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:1.2rem; }
.modal[hidden]{ display:none; }
.modal-backdrop{ position:absolute; inset:0; background:rgba(4,2,10,.72); backdrop-filter:blur(6px); }
.modal-card{
  position:relative; width:min(560px,100%); max-height:88vh; overflow-y:auto;
  padding:1.8rem; border-radius:var(--r-lg);
  border:1px solid var(--stroke-strong);
  background:linear-gradient(165deg, #1a1430, #100c1e);
  box-shadow:0 40px 90px -20px rgba(0,0,0,.9);
  animation:pop .22s ease-out;
}
.modal-card.wide{ width:min(880px,100%); }
@keyframes pop{ from{ opacity:0; transform:translateY(14px) scale(.98); } }
.modal-card h3{ margin:0 0 .4rem; font-size:1.3rem; font-weight:700; }
.modal-card h4{ margin:1.2rem 0 .6rem; font-size:.78rem; text-transform:uppercase; letter-spacing:.12em; color:var(--text-faint); }
.modal-x{
  position:absolute; top:.9rem; right:1rem; width:34px; height:34px;
  border-radius:9px; border:1px solid var(--stroke); background:var(--surface);
  color:var(--text-dim); font-size:1.35rem; line-height:1; cursor:pointer;
}
.modal-x:hover{ color:#fff; border-color:var(--live); }

/* ---------- formularz ---------- */
/* minmax(0,1fr): szeroki pasek dni ma się przewijać, a nie rozpychać formularza */
.form-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; margin-top:1.2rem; }
.f-full{ grid-column:1/-1; }
.form-grid label, .stack{ display:flex; flex-direction:column; gap:.35rem; font-size:.78rem; font-weight:600; color:var(--text-dim); }
.stack{ margin-bottom:.7rem; }
input, textarea, select{
  font:inherit; font-size:.9rem; color:var(--text);
  padding:.6rem .75rem; border-radius:10px;
  border:1px solid var(--stroke-strong); background:rgba(0,0,0,.35);
  width:100%; font-weight:500;
}
input:focus, textarea:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft); }
textarea{ resize:vertical; }
.f-check{ flex-direction:row !important; align-items:center; gap:.5rem; }
.f-check input{ width:auto; accent-color:var(--brand); }
.form-actions, .io-actions{ display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.4rem; }
.file-btn{ position:relative; }

.admin-split{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:1.6rem; margin-top:1rem; }
.admin-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.4rem; max-height:280px; overflow-y:auto; }
.admin-item{
  display:flex; align-items:center; gap:.7rem; padding:.55rem .7rem;
  border-radius:10px; border:1px solid var(--stroke); background:rgba(0,0,0,.28); font-size:.84rem;
}
.admin-item .ai-date{ font-family:var(--mono); font-size:.76rem; color:var(--brand-2); white-space:nowrap; }
.admin-item .ai-title{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-item button{
  border:none; background:transparent; color:var(--text-faint);
  cursor:pointer; font-size:.78rem; font-weight:700; padding:.2rem .35rem; border-radius:6px;
}
.admin-item button:hover{ color:var(--brand-2); background:var(--surface); }
.admin-item button.del:hover{ color:var(--live); }

/* ---------- toast ---------- */
.toast{
  position:fixed; left:50%; bottom:1.6rem; transform:translateX(-50%);
  z-index:200; padding:.75rem 1.2rem; border-radius:12px;
  background:linear-gradient(135deg, var(--brand), #7c3aed); color:#fff;
  font-size:.88rem; font-weight:600; box-shadow:0 16px 40px -12px var(--brand);
  animation:pop .2s ease-out;
}
.toast[hidden]{ display:none; }

.muted{ color:var(--text-faint); }
.sm{ font-size:.82rem; }

/* ---------- responsywność ---------- */

/* Na szerokim ekranie kratki są dużo szersze, więc podnosimy je,
   żeby nie zrobiły się nienaturalnie płaskie. */
@media (min-width: 1200px){
  .day{ min-height:126px; }
}

@media (max-width: 900px){
  .hero{ grid-template-columns:1fr; padding:1.5rem; }
  .admin-split{ grid-template-columns:minmax(0,1fr); }
  .form-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px){
  :root{ --gutter:.7rem; }
  /* mniejszy padding paneli i łamliwa nawigacja miesiąca —
     bez tego pasek z nazwą miesiąca wystaje poza ekran przy 320 px */
  .panel{ padding:1rem; }
  .hero{ padding:1.15rem; }
  .month-nav{ flex-wrap:wrap; row-gap:.5rem; }
  .month-nav h2{ min-width:0; flex:1; font-size:1.05rem; text-align:left; }
  .day{ min-height:74px; padding:.4rem .35rem; }
  .cal-grid, .cal-head{ gap:.3rem; }
  .cal-grid{ --cell-pad:.3rem; --cal-gap:.3rem; }
  .cd-cell{ min-width:64px; }
  .cd-cell b{ font-size:1.35rem; }
  .form-grid{ grid-template-columns:minmax(0,1fr); }
  .brand-text small{ display:none; }
  .btn-twitch span{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}

/* ---------- plakietka trybu edycji ---------- */
.edit-chip{
  display:flex; align-items:center; gap:.45rem;
  padding:.34rem .4rem .34rem .7rem; border-radius:999px;
  border:1px solid rgba(52,211,153,.45); background:rgba(52,211,153,.10);
  font-size:.78rem; font-weight:700; letter-spacing:.03em;
  text-transform:uppercase; color:#7ee2b8;
}
.edit-dot{
  width:7px; height:7px; border-radius:50%; background:var(--ok);
  box-shadow:0 0 0 0 rgba(52,211,153,.6); animation:pulse 2.4s infinite;
}
.edit-chip button{
  display:grid; place-items:center; width:24px; height:24px; flex:none;
  border:none; border-radius:50%; background:transparent;
  color:#7ee2b8; cursor:pointer;
}
.edit-chip button svg{ width:14px; height:14px; }
.edit-chip button:hover{ background:rgba(255,61,110,.2); color:#ff9fb7; }

/* zębatka wyraźniejsza, gdy tryb edycji jest włączony */
body.admin-on #btnAdmin{ border-color:rgba(52,211,153,.45); color:#7ee2b8; }

/* ---------- okno logowania ---------- */
.modal-card.narrow{ width:min(400px,100%); }
.modal-card.narrow form{ margin-top:1.1rem; }
.modal-card.narrow .btn{ width:100%; justify-content:center; margin-top:.3rem; }
.form-error{
  margin:.1rem 0 .6rem; padding:.55rem .7rem; border-radius:9px;
  background:rgba(225,29,72,.14); border:1px solid rgba(225,29,72,.4);
  color:#ffadc0; font-size:.82rem; font-weight:500;
}
.form-error[hidden]{ display:none; }

/* ---------- dziennik zmian ---------- */
.log-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.3rem; max-height:190px; overflow-y:auto; }
.log-list li{
  display:flex; gap:.6rem; align-items:baseline;
  padding:.4rem .55rem; border-radius:8px; background:rgba(0,0,0,.24);
  font-size:.78rem; color:var(--text-dim);
}
.log-list .lg-when{ font-family:var(--mono); font-size:.7rem; color:var(--text-faint); white-space:nowrap; }
.log-list .lg-what{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.log-list .lg-what b{ color:var(--brand-2); font-weight:700; }

/* ---------- toast: wariant błędu ---------- */
.toast[data-kind="err"]{
  background:linear-gradient(135deg, #e11d48, #be123c);
  box-shadow:0 16px 40px -12px rgba(225,29,72,.7);
}

@media (max-width: 620px){
  .edit-chip span:not(.edit-dot){ display:none; }
  .edit-chip{ padding:.34rem .4rem .34rem .5rem; }
}

/* ---------- pasek ostrzegawczy (brak połączenia z serwerem) ---------- */
.offline-bar{
  display:flex; align-items:center; gap:.6rem;
  margin-top:1rem; padding:.8rem 1rem;
  border-radius:12px; border:1px solid rgba(225,29,72,.45);
  background:rgba(225,29,72,.14); color:#ffc2cf;
  font-size:.88rem; font-weight:500; line-height:1.4;
}
.offline-bar[hidden]{ display:none; }
.offline-bar svg{ width:19px; height:19px; flex:none; color:#ff6b8a; }

@media (max-width: 620px){
  #btnAdminLabel{ display:none; }
  #btnAdmin{ padding:.62rem; }
}

/* ---------- szybkie akcje na kafelkach transmisji ---------- */
.mini-btn{
  display:grid; place-items:center; width:34px; height:34px;
  border-radius:9px; border:1px solid var(--stroke);
  background:rgba(0,0,0,.3); color:var(--text-dim);
  cursor:pointer; transition:background .16s, border-color .16s, color .16s;
}
.mini-btn svg{ width:16px; height:16px; }
.mini-btn:hover{ border-color:var(--brand); color:var(--brand-2); background:var(--brand-soft); }
.mini-btn.danger:hover{ border-color:var(--live); color:#ff9fb7; background:rgba(255,61,110,.14); }

/* pusty stan z wezwaniem do działania */
.empty .btn{ margin-top:.9rem; }

/* przycisk na całą szerokość w oknie dnia */
.wide-btn{ width:100%; justify-content:center; margin-top:1rem; }

/* w trybie edycji puste dni też zapraszają do kliknięcia */
body.admin-on:not(.move-mode) .day.clickable:not(.has):not(.locked):hover::after{
  content:"+"; position:absolute; inset:0;
  display:grid; place-items:center;
  font-size:1.5rem; font-weight:700; color:var(--brand-2);
  pointer-events:none;
}

@media (max-width: 620px){
  .mini-btn{ width:30px; height:30px; }
}

/* ---------- eventy wielodniowe ---------- */


.tag.blue{
  background:rgba(34,211,238,.14); color:#7fe6f5;
  border-color:rgba(34,211,238,.35);
}
.tag.live{
  background:rgba(255,61,110,.18); color:#ff9fb7;
  border-color:rgba(255,61,110,.45);
}

/* przełącznik i podpowiedź w formularzu */
.multi-toggle{
  padding:.55rem .75rem; border-radius:10px;
  border:1px solid var(--stroke); background:rgba(0,0,0,.24);
  font-size:.84rem !important; color:var(--text) !important;
}
.form-hint{
  margin:0; padding:.55rem .75rem; border-radius:9px;
  background:rgba(34,211,238,.10); border:1px solid rgba(34,211,238,.3);
  color:#9beaf7; font-size:.82rem;
}
.form-hint.bad{
  background:rgba(225,29,72,.14); border-color:rgba(225,29,72,.4); color:#ffadc0;
}
.form-hint[hidden]{ display:none; }
.lbl-extra{ color:var(--text-faint); font-weight:500; }


/* ============================================================
   GRAFIKI TRANSMISJI
   ============================================================ */

/* ---------- zastępcza okładka, gdy nie wgrano grafiki ---------- */
.cover-ph{
  display:grid; place-items:center;
  background:
    linear-gradient(140deg,
      hsl(var(--h) 62% 34%) 0%,
      hsl(calc(var(--h) + 40) 55% 18%) 100%);
}
.cover-ph span{
  font-size:2.6rem; font-weight:800; letter-spacing:-.04em;
  color:rgba(255,255,255,.82);
  text-shadow:0 2px 14px rgba(0,0,0,.35);
}

/* ---------- tło sekcji powitalnej ---------- */
.hero{ position:relative; overflow:hidden; isolation:isolate; }
.hero-bg{ position:absolute; inset:0; z-index:-1; }
.hero-bg[hidden]{ display:none; }
.hero-bg img{
  width:100%; height:100%; object-fit:cover;
  opacity:.30;
  /* obrazek gaśnie w lewo, żeby tekst zachował kontrast */
  -webkit-mask-image:linear-gradient(105deg, transparent 8%, #000 62%);
          mask-image:linear-gradient(105deg, transparent 8%, #000 62%);
}
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(100deg, #16122a 12%, rgba(22,18,42,.55) 55%, rgba(22,18,42,.2) 100%);
}

/* ---------- siatka kart ---------- */
.card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(268px, 1fr));
  gap:1.1rem;
}
.card-grid .empty{ grid-column:1/-1; }

.card{
  display:flex; flex-direction:column;
  border-radius:16px; overflow:hidden;
  border:1px solid var(--stroke); background:rgba(0,0,0,.26);
  transition:border-color .18s, background .18s;
}
.card:hover{ border-color:rgba(145,70,255,.5); background:rgba(145,70,255,.07); }
.card:hover .cover-img{ transform:scale(1.04); }

.card-cover{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:rgba(0,0,0,.4);
}
.cover-img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .35s ease;
}
.card-cover::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,.35) 0%, transparent 38%, rgba(0,0,0,.45) 100%);
}

.card-date{
  position:absolute; top:.6rem; left:.6rem; z-index:2;
  padding:.28rem .6rem; border-radius:8px;
  background:rgba(8,5,16,.82); border:1px solid rgba(255,255,255,.14);
  font-family:var(--mono); font-size:.76rem; font-weight:700;
  color:#fff; white-space:nowrap;
}
.card-live{
  position:absolute; top:.6rem; right:.6rem; z-index:2;
  display:flex; align-items:center; gap:.32rem;
  padding:.28rem .55rem; border-radius:999px;
  background:var(--live); color:#fff;
  font-size:.66rem; font-weight:800; letter-spacing:.09em;
}
.card-live i{
  width:6px; height:6px; border-radius:50%; background:#fff;
  animation:pulse 1.8s ease-out infinite;
}
.card-off{
  position:absolute; top:.6rem; right:.6rem; z-index:2;
  padding:.28rem .55rem; border-radius:8px;
  background:rgba(8,5,16,.85); color:#ff9fb7;
  border:1px solid rgba(255,61,110,.5);
  font-size:.68rem; font-weight:700;
}

.card-actions{
  position:absolute; right:.55rem; bottom:.55rem; z-index:3;
  display:flex; gap:.35rem;
  opacity:0; transition:opacity .18s;
}
.card:hover .card-actions,
.card:focus-within .card-actions{ opacity:1; }
.card-actions .mini-btn{ background:rgba(8,5,16,.85); }

.card-body{ display:flex; flex-direction:column; gap:.45rem; padding:.85rem .9rem 1rem; }
.card-body h3{
  margin:0; font-size:1rem; font-weight:650; line-height:1.3;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.card-meta{
  margin:0; display:flex; gap:.5rem; flex-wrap:wrap; align-items:baseline;
  font-size:.84rem; color:var(--text-dim);
}
.card-game{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.card-desc{
  margin:0; font-size:.82rem; color:var(--text-faint); line-height:1.45;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.card-tags{ display:flex; gap:.35rem; flex-wrap:wrap; margin-top:.15rem; }
.tag.ghost{ background:transparent; color:var(--text-faint); border-color:var(--stroke); }

.card.is-live{ border-color:rgba(255,61,110,.5); }
.card.is-cancelled .cover-img{ filter:grayscale(.85); opacity:.55; }
.card.is-cancelled .card-body h3{ text-decoration:line-through; color:var(--text-faint); }


/* ---------- pole wgrywania w formularzu ---------- */
.img-field{ display:flex; flex-direction:column; gap:.45rem; }
.img-label{ font-size:.78rem; font-weight:600; color:var(--text-dim); }

.img-drop{
  position:relative;
  aspect-ratio:16/9; max-height:190px;
  border-radius:12px; overflow:hidden; cursor:pointer;
  border:1.5px dashed var(--stroke-strong);
  background:rgba(0,0,0,.3);
  display:grid; place-items:center;
  transition:border-color .18s, background .18s;
}
.img-drop:hover, .img-drop:focus-visible, .img-drop.over{
  border-color:var(--brand); background:var(--brand-soft); outline:none;
}
.img-drop.busy{ opacity:.6; pointer-events:none; }
.img-drop img{ width:100%; height:100%; object-fit:cover; }
.img-empty{
  display:flex; flex-direction:column; align-items:center; gap:.3rem;
  text-align:center; color:var(--text-faint); padding:1rem;
}
.img-empty svg{ width:30px; height:30px; margin-bottom:.15rem; }
.img-empty b{ font-size:.86rem; color:var(--text-dim); font-weight:600; }
.img-empty small{ font-size:.74rem; }
.img-actions{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }

@media (max-width: 620px){
  .card-grid{ grid-template-columns:1fr; gap:.9rem; }
  .card-actions{ opacity:1; }
  .hero-bg img{ opacity:.2; -webkit-mask-image:none; mask-image:none; }
}

/* ============================================================
   PRZENOSZENIE TRANSMISJI PO KALENDARZU
   ============================================================ */

/* w trybie edycji kafelek można złapać myszą */
body.admin-on .ev-tile,
body.admin-on .ev-row{ cursor:grab; user-select:none; -webkit-user-select:none; }
body.admin-on .ev-tile img,
body.admin-on .ev-row img{ -webkit-user-drag:none; }

body.dragging,
body.dragging *{ cursor:grabbing !important; user-select:none; -webkit-user-select:none; }

.drag-src{ opacity:.3; }
.drag-ghost{
  position:fixed; left:0; top:0; z-index:300;
  pointer-events:none; opacity:.95;
  padding:.35rem; border-radius:12px;
  background:#1d1636; border:1px solid var(--brand-2);
  box-shadow:0 24px 48px -12px rgba(0,0,0,.9);
}
.drag-ghost .ev-span{ display:none; }

/* dni, które event zajmie po upuszczeniu */
.day.drop-range{ background:rgba(34,211,238,.13); border-color:rgba(34,211,238,.55); }
.day.drop-ok{ box-shadow:inset 0 0 0 2px var(--accent); }
.day.drop-bad{ background:rgba(225,29,72,.16); border-color:rgba(225,29,72,.6); }

/* dni sprzed limitu — w trybie edycji nic tam nie trafi */
body.admin-on .day.locked{
  background-image:repeating-linear-gradient(135deg,
    transparent 0 7px, rgba(255,255,255,.035) 7px 14px);
}
body.admin-on .day.locked:not(.has){ cursor:not-allowed; }

/* tryb „kliknij nowy dzień” */
body.move-mode .day.clickable:hover{ border-color:var(--accent); background:rgba(34,211,238,.12); }
body.move-mode .day.locked{ opacity:.3; cursor:not-allowed; }
.moving-src .ev-tile-img,
.ev-row.moving-src{ outline:2px dashed var(--accent); outline-offset:2px; }

.move-bar{
  position:fixed; left:50%; bottom:1.2rem; transform:translateX(-50%);
  z-index:150; display:flex; align-items:center; gap:.7rem;
  max-width:calc(100% - 1.5rem);
  padding:.55rem .6rem .55rem 1rem; border-radius:14px;
  background:#0d3240; border:1px solid rgba(34,211,238,.55);
  color:#c3f4fb; font-size:.88rem; font-weight:600;
  box-shadow:0 16px 40px -12px rgba(0,0,0,.85);
}
.move-bar[hidden]{ display:none; }
.move-bar svg{ width:18px; height:18px; flex:none; color:var(--accent); }
.move-bar span{ min-width:0; }
body.move-mode .toast{ bottom:5.2rem; }

#calPanel{ scroll-margin-top:84px; }

/* ---------- komunikat z przyciskiem „Cofnij” ---------- */
.toast{ display:flex; align-items:center; gap:.9rem; max-width:calc(100% - 2rem); }
.toast-action{
  flex:none; padding:.3rem .75rem; border-radius:8px;
  border:1px solid rgba(255,255,255,.55); background:rgba(255,255,255,.16);
  color:#fff; font:inherit; font-size:.82rem; font-weight:700; cursor:pointer;
}
.toast-action:hover{ background:rgba(255,255,255,.3); }
.toast-action[hidden]{ display:none; }

/* ---------- okno dnia: karty z dużą grafiką ---------- */
.day-cards{ margin-top:.9rem; grid-template-columns:1fr; }
.day-cards .card-actions{ opacity:1; }

/* ============================================================
   FORMULARZ — DATA I GODZINY
   ============================================================ */
.dt-block{
  display:flex; flex-direction:column; gap:.55rem; min-width:0;
  padding:.75rem; border-radius:12px;
  border:1px solid var(--stroke); background:rgba(0,0,0,.2);
}
.dt-block[hidden]{ display:none; }
.dt-head{ display:flex; justify-content:space-between; align-items:baseline; gap:.6rem; flex-wrap:wrap; }
.dt-label{ font-size:.78rem; font-weight:600; color:var(--text-dim); }
.dt-human{ font-size:.8rem; font-weight:600; color:var(--accent); }

.date-stepper{ display:flex; gap:.35rem; align-items:stretch; }
.date-stepper input{ flex:1; min-width:0; text-align:center; font-weight:600; }
.step-btn{
  flex:none; width:40px; border-radius:10px;
  border:1px solid var(--stroke-strong); background:rgba(0,0,0,.35);
  color:var(--text); font-size:1.15rem; line-height:1; cursor:pointer;
  transition:background .15s, border-color .15s;
}
.step-btn:hover{ border-color:var(--brand); background:var(--brand-soft); }

.day-strip{
  display:grid; grid-template-columns:repeat(14, minmax(38px, 1fr)); gap:.3rem;
  overflow-x:auto; padding-bottom:.2rem; scrollbar-width:thin;
}
.ds-day{
  position:relative; display:flex; flex-direction:column; align-items:center; gap:.05rem;
  padding:.35rem 0; border-radius:9px;
  border:1px solid var(--stroke); background:rgba(0,0,0,.3);
  color:var(--text-dim); font:inherit; cursor:pointer;
  transition:background .15s, border-color .15s;
}
.ds-day:hover{ border-color:var(--brand); }
.ds-wd{ font-size:.6rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.ds-num{ font-family:var(--mono); font-size:.92rem; font-weight:700; color:var(--text); }
.ds-day.we .ds-wd{ color:var(--brand-2); }
.ds-day.on{ background:var(--brand); border-color:var(--brand); }
.ds-day.on .ds-wd, .ds-day.on .ds-num{ color:#fff; }
/* kropka: tego dnia jest już inna transmisja */
.ds-day.busy::after{
  content:""; position:absolute; top:4px; right:5px;
  width:5px; height:5px; border-radius:50%; background:var(--live);
}

.quick-chips{ display:flex; flex-wrap:wrap; gap:.3rem; align-items:center; }
.qc-label{ font-size:.74rem; color:var(--text-faint); margin-right:.15rem; }
.qchip{
  padding:.28rem .62rem; border-radius:999px;
  border:1px solid var(--stroke-strong); background:rgba(0,0,0,.3);
  color:var(--text-dim); font-family:var(--mono); font-size:.76rem; font-weight:600;
  cursor:pointer; transition:background .15s, border-color .15s, color .15s;
}
.qchip:hover{ border-color:var(--brand); color:var(--text); }
.qchip.on{ background:var(--brand-soft); border-color:var(--brand); color:#e4d6ff; }

.time-row{ display:grid; grid-template-columns:130px 1fr; gap:.8rem; align-items:end; }
.time-field{ margin:0; }

/* ---------- średnie ekrany ---------- */
@media (max-width: 900px){
  .ev-tile-title{ font-size:.7rem; }
  .ev-tile-meta{ font-size:.6rem; }
  .ev-tile .cover-ph span{ font-size:1.1rem; }
}

/* ---------- telefon: w kratce zostaje sama grafika, reszta po dotknięciu ---------- */
@media (max-width: 620px){
  .ev-tile-body, .ev-row-body, .ev-more{ display:none; }
  .ev-tile{ gap:.2rem; }
  .ev-tile-img{ aspect-ratio:1; border-radius:6px; }
  .ev-tile .cover-ph span{ font-size:.8rem; }
  .ev-row{ padding:0; background:none; border:none; }
  .ev-row-img{ width:100%; aspect-ratio:1; }
  .ev-span{ height:3px; }

  .time-row{ grid-template-columns:1fr; gap:.45rem; }
  .day-strip{ grid-template-columns:repeat(14, 42px); }
  .move-bar{ bottom:.8rem; font-size:.82rem; }
}

/* lista „Zaplanowane” na telefonie: tytuł w pierwszej linii, data i przyciski pod nim */
@media (max-width: 620px){
  .admin-item{ flex-wrap:wrap; row-gap:.15rem; }
  .admin-item .ai-title{ flex:1 1 100%; order:-1; }
  .admin-item .ai-date{ flex:1; min-width:0; white-space:normal; }
}

/* pole daty na telefonie: pełna szerokość w pierwszym rzędzie, strzałki pod nim */
@media (max-width: 620px){
  .date-stepper{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:.35rem; }
  .date-stepper.two{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .date-stepper input{ grid-column:1 / -1; grid-row:1; }
  .step-btn{ width:auto; height:38px; }
}

/* ============================================================
   WIDOCZNOŚĆ: PUBLICZNE / NIEOGŁOSZONE / PRYWATNE
   ============================================================ */

/* ---------- zapowiedź: wielki znak zapytania zamiast grafiki ---------- */
.cover-teaser{
  display:grid; place-items:center;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.035) 0 10px, transparent 10px 20px),
    radial-gradient(circle at 50% 45%, #4a2a8a 0%, #1b1233 70%);
}
.cover-teaser span{
  font-family:var(--font); font-weight:800; line-height:1;
  font-size:3.4rem; color:#e9dcff;
  text-shadow:0 0 24px rgba(192,132,252,.75), 0 4px 18px rgba(0,0,0,.5);
}
.ev-tile .cover-teaser span{ font-size:2.6rem; }
.ev-row .cover-teaser span{ font-size:1rem; }
.ev-tile.teaser .ev-tile-title{ color:#d9c6ff; }
.ev-tile.teaser .ev-tile-meta,
.ev-row.teaser .ev-row-meta{ color:var(--text-faint); }
.card.is-teaser .card-body h3{ color:#d9c6ff; }
.card.is-teaser .si-time{ color:var(--text-faint); font-family:var(--font); font-weight:600; }

/* sekcja powitalna przy zapowiedzi — duży „?” w tle */
.hero.teaser::after{
  content:"?"; position:absolute; z-index:-1;
  right:4%; top:50%; transform:translateY(-50%);
  font-size:clamp(9rem, 22vw, 17rem); font-weight:800; line-height:1;
  color:rgba(192,132,252,.09);
  pointer-events:none;
}

/* ---------- plakietki widoczne tylko właścicielowi ---------- */
.vis-badge{
  position:absolute; z-index:2;
  display:inline-flex; align-items:center; gap:.3rem;
  padding:.22rem .5rem; border-radius:999px;
  font-size:.66rem; font-weight:700; letter-spacing:.02em;
  border:1px solid; backdrop-filter:none;
}
.vis-badge svg{ width:12px; height:12px; flex:none; }
.vis-badge i{ font-style:normal; font-weight:800; font-size:.8rem; line-height:1; }
.vis-badge.vis-private{ background:rgba(20,16,32,.9); color:#cfc8e6; border-color:rgba(255,255,255,.35); }
.vis-badge.vis-unannounced{ background:rgba(60,34,4,.9); color:#ffd27a; border-color:rgba(251,191,36,.6); }

/* na karcie: lewy dolny róg okładki */
.card-cover .vis-badge{ left:.6rem; bottom:.6rem; }
/* w kratce kalendarza: sama ikonka w rogu grafiki */
.ev-tile-img .vis-badge,
.ev-row-img .vis-badge{ left:3px; top:3px; padding:.15rem .28rem; }
.ev-row-img{ position:relative; }

/* prywatne są przygaszone — od razu widać, że świat ich nie widzi */
.ev-tile.vis-private .ev-tile-img,
.ev-row.vis-private .ev-row-img{ opacity:.6; outline:1.5px dashed rgba(255,255,255,.4); outline-offset:-1.5px; }
.card.vis-private{ border-style:dashed; border-color:rgba(255,255,255,.28); }
.card.vis-private .cover-img{ opacity:.65; }
.card.vis-unannounced{ border-color:rgba(251,191,36,.35); }

/* przycisk „Publikuj” */
.mini-btn.publish{ color:#7ee2b8; border-color:rgba(52,211,153,.45); }
.mini-btn.publish:hover{ background:rgba(52,211,153,.18); border-color:var(--ok); color:#b6f3d6; }

/* lista „Zaplanowane” w panelu */
.ai-vis{
  font-style:normal; font-size:.66rem; font-weight:700;
  padding:.08rem .38rem; border-radius:999px; margin-right:.2rem;
}
.ai-vis.vis-private{ background:rgba(255,255,255,.1); color:#cfc8e6; }
.ai-vis.vis-unannounced{ background:rgba(251,191,36,.16); color:#ffd27a; }
.admin-item button.pub{ color:#7ee2b8; }
.admin-item button.pub:hover{ color:#b6f3d6; background:rgba(52,211,153,.14); }

/* ---------- wybór widoczności w formularzu ---------- */
.vis-field{ display:flex; flex-direction:column; gap:.45rem; }
.vis-options{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:.45rem; }
.form-grid .vis-opt{ display:block; position:relative; cursor:pointer; }
.vis-opt input{ position:absolute; opacity:0; pointer-events:none; }
.vis-opt-box{
  display:flex; flex-direction:column; gap:.15rem; height:100%;
  padding:.6rem .7rem; border-radius:11px;
  border:1px solid var(--stroke-strong); background:rgba(0,0,0,.3);
  transition:border-color .15s, background .15s;
}
.vis-opt-box b{ font-size:.86rem; color:var(--text); }
.vis-opt-box small{ font-size:.72rem; color:var(--text-faint); font-weight:500; line-height:1.3; }
.vis-opt:hover .vis-opt-box{ border-color:var(--brand); }
.vis-opt input:focus-visible + .vis-opt-box{ box-shadow:0 0 0 3px var(--brand-soft); }
.vis-opt input[value="public"]:checked + .vis-opt-box{ border-color:var(--ok); background:rgba(52,211,153,.1); }
.vis-opt input[value="unannounced"]:checked + .vis-opt-box{ border-color:#fbbf24; background:rgba(251,191,36,.1); }
.vis-opt input[value="private"]:checked + .vis-opt-box{ border-color:rgba(255,255,255,.6); background:rgba(255,255,255,.08); }

@media (max-width: 620px){
  .vis-options{ grid-template-columns:minmax(0,1fr); }
  .ev-tile-img .vis-badge, .ev-row-img .vis-badge{ display:none; }
  .ev-tile .cover-teaser span{ font-size:1.3rem; }
  .cover-teaser span{ font-size:2.8rem; }
}

/* ============================================================
   KOPIOWANIE TRANSMISJI
   ============================================================ */

/* przeciąganie z Alt: kursor „kopiuj”, oryginał zostaje w pełni widoczny */
body.copying,
body.copying *{ cursor:copy !important; }
body.copying .drag-src{ opacity:1; }
body.copying .drag-ghost{ border-color:var(--ok); }
body.copying .drag-ghost::after{
  content:"+ kopia"; position:absolute; top:-10px; right:-10px;
  padding:.18rem .5rem; border-radius:999px;
  background:var(--ok); color:#053321;
  font-size:.68rem; font-weight:800; letter-spacing:.03em;
  box-shadow:0 4px 12px -4px rgba(0,0,0,.7);
}
body.copying .day.drop-range{ background:rgba(52,211,153,.13); border-color:rgba(52,211,153,.55); }
body.copying .day.drop-ok{ box-shadow:inset 0 0 0 2px var(--ok); }

/* tryb „klikaj dni” dla kopiowania — zielony zamiast turkusowego */
body.copy-mode .move-bar{ background:#0b3226; border-color:rgba(52,211,153,.55); color:#c4f5de; }
body.copy-mode .move-bar svg{ color:var(--ok); }
body.copy-mode .day.clickable:hover{ border-color:var(--ok); background:rgba(52,211,153,.12); }
body.copy-mode .moving-src .ev-tile-img,
body.copy-mode .ev-row.moving-src{ outline-color:var(--ok); }

/* podpowiedź pod kalendarzem w trybie edycji */
.cal-hint{
  display:flex; flex-wrap:wrap; gap:.35rem 1.4rem;
  margin:.9rem 0 0; font-size:.78rem; color:var(--text-faint);
}
.cal-hint b{ color:var(--text-dim); font-weight:600; }
.cal-hint kbd{
  display:inline-block; padding:.05rem .4rem; border-radius:5px;
  border:1px solid var(--stroke-strong); border-bottom-width:2px;
  background:rgba(0,0,0,.35); color:var(--text);
  font-family:var(--mono); font-size:.72rem;
}
/* na dotyku nie ma przeciągania ani Alt — tam są przyciski na kartach */
@media (hover: none){
  .cal-hint{ display:none; }
}