/* PRAEVI skin 1.0 — Archivo (SIL OFL 1.1), hostowany lokalnie. */
@font-face { font-family:"Archivo"; font-weight:100 900; font-stretch:62% 125%; font-style:normal; font-display:swap;
  src:url('/static/fonts/archivo-var.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Archivo"; font-weight:100 900; font-stretch:62% 125%; font-style:normal; font-display:swap;
  src:url('/static/fonts/archivo-var-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF,U+FB00-FB06; }
/* Aplikacja PRAEVI — jasny motyw brandowy (spójny z landingiem). */

:root {
  --indigo-900:#111316; --indigo-700:#111316; --indigo-100:#ECE8DF; --indigo-50:#F4F1EA;
  --orange-500:#E4572E; --orange-600:#B5391A; --orange-100:#FBE3D6;
  --success:#2F6F5E;
  --ink-900:#111316; --ink-700:#3A3F48; --ink-500:#6B675F; --ink-300:#CFC9BD;
  --ink-100:#ECE8DF; --ink-50:#FBF9F5;
  --linkedin:#3A3F48; --facebook:#3A3F48; --instagram:#3A3F48; --x:#3A3F48; --blog:#3A3F48;
  --line:#DDD7CB; --bg:#F4F1EA;
  /* Oznaczenia kolorem nadawane przez klienta. Cztery barwy przygaszone,
     dobrane do indygo i pomarańczu marki — mają porządkować kalendarz,
     a nie krzyczeć. Każda ma trzy poziomy: tło karty, obrys, kropka w wyborze. */
  --tag-amber-bg:#F5EBD6; --tag-amber-line:#D9BE85; --tag-amber-dot:#B4842C;
  --tag-sage-bg:#E1EBE2;  --tag-sage-line:#A9C2AE;  --tag-sage-dot:#5E8466;
  --tag-azure-bg:#E0E7F0; --tag-azure-line:#A7B8CF; --tag-azure-dot:#4F6E99;
  --tag-plum-bg:#EAE2EE;  --tag-plum-line:#C2B0CC;  --tag-plum-dot:#7E5F8F;
  --shadow-sm:none;
  --font-display:"Archivo", ui-sans-serif, system-ui, "Segoe UI", sans-serif;
  --font-body:"Archivo", ui-sans-serif, system-ui, "Segoe UI", sans-serif;


  /* ── System wizualny PRAEVI (ujednolicenie 2026-08-19) ─────────────
     Paleta była już wyprowadzona z tej samej marki, więc poniżej wchodzi
     WYŁĄCZNIE to, czego brakowało: bordo (odmowy, „czego unikać", błędy),
     błękit (linki, ogniskowanie), brakujące stopnie indygo oraz wspólne
     promienie, odstępy i cienie. Nazwy dotychczasowych zmiennych zostają
     nietknięte — inaczej trzeba by przepisać każdą regułę w pliku. */
  --indigo-950:#0B0D0F; --indigo-800:#262A31; --indigo-600:#3A3F48;
  --indigo-500:#5A616C; --indigo-400:#7A808A; --indigo-300:#A29C91;
  --indigo-200:#DDD7CB;
  --maroon-700:#7A2611; --maroon-500:#B5391A; --maroon-300:#F2895A;
  --maroon-200:#F5C9B5; --maroon-100:#FBE3D6;
  --blue-600:#111316; --blue-500:#B5391A; --blue-200:#DDD7CB;
  --blue-100:#ECE8DF; --blue-50:#F4F1EA;
  --success-700:#2F6F5E; --success-bg:#DCEDE6;
  --orange-400:#F2895A; --orange-200:#F5C9B5;
  --ink-800:#262A31; --ink-600:#5A616C; --ink-400:#A29C91; --ink-200:#DDD7CB;

  /* Role semantyczne — używamy ich w nowych regułach zamiast surowych barw */
  --text-link:var(--blue-600);
  --danger:var(--maroon-500); --danger-bg:var(--maroon-100);
  --warning:var(--orange-500); --warning-bg:var(--orange-100);

  /* Promienie i odstępy (skala 4 px) */
  --radius-xs:2px; --radius-sm:2px; --radius-md:0; --radius-lg:0;
  --radius-xl:0; --radius-pill:2px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:40px;

  /* Cienie: przygaszone indygiem, nigdy neutralna szarość */
  --shadow-xs:none;
  --shadow-md:none;
  --shadow-lg:0 12px 32px -12px rgba(17,19,22,.28);
  --focus-ring:0 0 0 2px #F4F1EA, 0 0 0 4px #B5391A;

  /* Kropkowana faktura na indygo — znak rozpoznawczy marki: pas nagłówka
     na komputerze, okładka ekranów logowania na telefonie. */
  --dot-texture:none;
  --dot-size:16px 16px;

  --tracking-caps:.08em;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; }
body {
  background:var(--bg); color:var(--ink-900);
  font-family:var(--font-body); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; min-height:100vh;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
h1,h2,h3 { font-family:var(--font-display); color:var(--ink-900); letter-spacing:-.01em; }

/* Auth / karty */
.center { min-height:100vh; display:grid; place-items:center; padding:24px; }
.card { width:100%; max-width:400px; background:#FBF9F5; border:1px solid var(--line); border-radius:0; padding:30px; box-shadow:var(--shadow-sm); }
.brand { display:inline-flex; align-items:center; gap:9px; font-family:var(--font-display);
  font-size:17px; font-weight:700; letter-spacing:.01em; color:var(--indigo-700); min-width:0; }
.brand-mark { height:26px; width:auto; display:block; flex:none; }
.brand-tag { font-family:var(--font-body); font-size:10px; font-weight:600; color:var(--ink-500);
  background:var(--ink-100); padding:2px 7px; border-radius:2px; text-transform:uppercase; letter-spacing:.06em; }
h1 { font-size:22px; font-weight:700; margin:6px 0 8px; }
.muted { color:var(--ink-500); font-size:14px; line-height:1.55; }
.err { color:#B5391A; font-size:14px; margin:8px 0; }

form { margin-top:16px; display:grid; gap:10px; }
input[type="email"], input[type="text"], input[type="url"], textarea {
  width:100%; padding:13px 14px; font-size:16px; font-family:inherit;
  background:#FBF9F5; color:var(--ink-900); border:1px solid var(--line); border-radius:2px;
}
input:focus, textarea:focus { outline:none; border-color:var(--ink-700); box-shadow:0 0 0 3px rgba(17,19,22,.1); }
textarea { resize:vertical; }
.filelabel { font-size:14px; color:var(--ink-500); display:grid; gap:8px; }
.fld { display:grid; gap:6px; font-size:13px; font-weight:600; color:var(--ink-500); }
.fld > select, .fld > input, .fld > textarea { font-weight:400; color:var(--ink-900); }
select, input[type="date"] {
  width:100%; padding:12px 14px; font-size:16px; font-family:inherit;
  background:#FBF9F5; color:var(--ink-900); border:1px solid var(--line); border-radius:2px;
}
select:focus, input[type="date"]:focus { outline:none; border-color:var(--indigo-700); box-shadow:0 0 0 3px rgba(17,19,22,.1); }
input[type="file"] { font-size:14px; color:var(--ink-700); }
.client-actions { display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin:8px 0 4px; }
.client-actions form { margin:0; }
.team-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); font-size:15px; }
.team-row form { margin:0; }

/* Wiersz użytkownika klienta: rozwijany (details) edytor + akcje */
.user-item { border-bottom:1px solid var(--line); padding:11px 0; font-size:15px; }
.user-item > summary { cursor:pointer; padding:2px 0; }
.user-body { display:grid; gap:16px; max-width:440px; margin:14px 0 6px; }
.row-actions { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.row-actions form { margin:0; }
summary.link { font-size:14px; font-weight:600; color:var(--ink-500); }
.confirm-del > summary { list-style:none; display:inline-block; }
.confirm-del > summary::-webkit-details-marker { display:none; }
.confirm-del > summary::marker { content:""; }
.confirm-del form { margin-top:8px; }
.danger, button.link.danger, summary.link.danger { color:#B5391A; }
.confirm-del[open] > summary.danger { color:#B5391A; }

button {
  min-height:46px; padding:12px 20px; font-size:15px; font-weight:600; font-family:var(--font-display);
  background:var(--indigo-700); color:#F4F1EA; border:0; border-radius:2px; cursor:pointer; transition:filter .15s, transform .1s;
}
button:hover { filter:brightness(1.08); }
button:active { transform:translateY(1px); }
button:disabled { opacity:.5; cursor:default; }
button.link { background:none; color:var(--ink-500); min-height:auto; padding:6px 8px; font-weight:600; }
button.link:hover { color:var(--ink-900); filter:none; }
a.link { color:var(--ink-700); font-weight:600; font-size:14px; }

/* Topbar / layout */
.topbar { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; row-gap:8px; column-gap:10px;
  padding:12px 16px; background:rgba(255,255,255,.9); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.topbar-actions { display:flex; align-items:center; gap:4px; flex-wrap:wrap; justify-content:flex-end; }
.topbar form { margin:0; }
.wrap { max-width:760px; margin:0 auto; padding:22px 18px 60px; }
.empty { margin-top:44px; text-align:center; }
.submit-cta { margin-top:28px; text-align:center; color:var(--ink-500); font-size:14px; }
.submit-cta a { color:var(--ink-700); font-weight:600; }

/* Feed */
.feed { max-width:640px; margin:0 auto; padding:18px 16px 72px; }
.daynav { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; }
.daynav-arrow { height:56px; width:56px; flex:none; display:grid; place-items:center; border-radius:0; background:#FBF9F5;
  border:1px solid var(--line); color:var(--ink-700); font-size:28px; text-decoration:none; box-shadow:var(--shadow-sm); }
.daynav-arrow.disabled { opacity:.35; pointer-events:none; }
.daynav-mid { text-align:center; position:relative; }
.daynav-label { display:block; font-family:var(--font-display); font-weight:700; font-size:16px; }
.daynav-picker { margin-top:4px; border:0; background:none; color:var(--ink-500); font-size:13px; font-family:inherit; padding:0; }
/* Lista postów dnia z boku (wariant A) — tylko na szerokim ekranie (patrz
   blok @media (min-width:768px) niżej). Na telefonie ukryta, a posty
   stackują się w jednej kolumnie jak dotąd. */
.day-list { display:none; }

.post { position:relative; background:#FBF9F5; border:1px solid var(--line); border-radius:0; padding:18px; margin-bottom:16px; box-shadow:var(--shadow-sm); }
.post.is-published { opacity:.7; }
/* padding-right robi miejsce strzałce oznaczania, przypiętej do rogu karty */
.post-head { display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; margin-bottom:12px; padding-right:30px; }
/* Skandynawski sznyt: kanał = cichy szary pill, status i prowieniencja =
   zwykły tekst; kolor tylko tam, gdzie coś znaczy (publikacja, recenzja). */
.badge { font-family:var(--font-body); font-size:13px; font-weight:600; color:var(--ink-700); padding:4px 10px; border-radius:2px; background:var(--ink-100); }
.post-time { font-size:13px; color:var(--ink-500); font-weight:500; }
.status-pill { margin-left:auto; font-size:13px; font-weight:600; padding:0; border-radius:0; background:none; color:var(--ink-500); }
.status-pill.pub { color:var(--success); }
.status-pill.appr { color:var(--ink-700); }
.ok-flash { color:var(--success); font-weight:600; font-size:15px; margin:10px 0; }
/* Potwierdzenie w karcie (a nie na górze listy) — po zapisie klient zostaje
   przy swoim poście, więc komunikat musi być tam, gdzie on patrzy.
   scroll-margin-top: karta przewinięta z kotwicy nie chowa się pod topbarem. */
.card-flash { margin:0 0 12px; font-size:14px; }
.post, .sig { scroll-margin-top:74px; }
.err-flash { color:#B5391A; font-weight:600; font-size:15px; margin:10px 0; }
/* Komentarz: ten sam cichy pill co kanał, ale obrysowany — z jednego rzutu
   oka widać, że to inny byt niż post (nie idzie na kanał, nie publikujemy). */
.badge-comment { background:#FBF9F5; border:1px solid var(--ink-300); }
.post-comment { border-left:3px solid var(--ink-300); }
.comment-hint { font-size:13px; margin:8px 0 0; }
.btn-target { text-decoration:none; display:inline-flex; align-items:center; }
.btn-status.ghost { border-style:solid; }

.post-form { margin:0; display:block; }
/* Pole treści: krótkie posty zostają na ~8 wierszach (min-height), długie
   rosną do treści aż do 1,5x (max-height), potem przewijają w środku.
   Wysokość dopina feed.js; min/max to podłoga i sufit. */
.post-text { width:100%; min-height:220px; max-height:330px; overflow-y:auto;
  border:1px solid var(--line); border-radius:2px; padding:14px; font-size:15px;
  line-height:1.6; background:var(--ink-50); color:var(--ink-900); font-family:var(--font-body); }
.post-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:12px; }
/* Jedyny kolorowy przycisk w karcie — główna akcja. */
.btn-copy { background:var(--orange-500); color:#F4F1EA; min-height:44px; padding:11px 20px; }
.btn-copy:hover { background:var(--orange-600); filter:none; }
.btn-copy.copied { background:var(--success); }
.note-input { flex:1; min-width:160px; min-height:44px; }
.btn-ghost { background:#FBF9F5; color:var(--ink-700); border:1px solid var(--ink-300); min-height:44px; padding:11px 16px; font-size:15px; }
.btn-ghost:hover { filter:none; background:var(--ink-50); }

.thumbs { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.thumb { position:relative; display:block; border-radius:2px; overflow:hidden; border:1px solid var(--line); width:clamp(220px, 82vw, 300px); }
.thumb img, .thumb video { width:100%; height:auto; display:block; }
/* Grafika/wideo w apce klienta: podgląd + przycisk × usuń + link pobierania */
.thumb-media { margin:0; }
.thumb-media video { background:#111316; }
.thumb-dl-link { display:block; text-align:center; font-size:12px; font-weight:600; color:#F4F1EA;
  background:rgba(17,19,22,.6); padding:5px 0; text-decoration:none; }
.thumb-dl-link:hover { background:rgba(17,19,22,.78); }
.thumb-rm { position:absolute; top:6px; right:6px; margin:0; z-index:2; }
.thumb-rm button { width:30px; height:30px; min-height:0; padding:0; border-radius:2px; border:none; cursor:pointer;
  background:rgba(17,19,22,.72); color:#F4F1EA; font-size:17px; line-height:1;
  display:flex; align-items:center; justify-content:center; }
.thumb-rm button:hover { background:rgba(17,19,22,.92); }

/* Grafiki przy poście (widok operatora) — responsywne, pełny obraz widoczny */
.post-imgs { display:flex; flex-wrap:wrap; gap:12px; margin:12px 0; }
.post-img { position:relative; margin:0; flex:0 0 auto; width:clamp(300px, 84vw, 600px); }
.post-img img, .post-img video { width:100%; height:auto; display:block; border-radius:0; border:1px solid var(--line); }
.post-img-rm { position:absolute; top:6px; right:6px; margin:0; }
.post-img-rm button { width:28px; height:28px; border-radius:2px; border:none; cursor:pointer;
  background:rgba(17,19,22,.72); color:#F4F1EA; font-size:15px; line-height:1;
  display:flex; align-items:center; justify-content:center; }
.post-img-rm button:hover { background:rgba(17,19,22,.92); }

/* Usuwanie postu przez klienta (miękkie — do Kosza) */
.post-remove { margin-top:10px; text-align:right; }
.post-remove .confirm-del form { margin-top:8px; }
.remove-hint { margin:0 0 8px; }

/* Info o zajętym miejscu (formularz nowego posta klienta) */
.store-line { font-size:12px; color:var(--ink-500); }
/* Panel miejsca na serwerze (pulpit admina) */
.server-box { border:1px solid var(--line); border-radius:0; padding:14px 16px; margin-bottom:22px; background:#FBF9F5; box-shadow:var(--shadow-sm); }
.server-box .store-bar { margin-top:8px; }
.server-box .err { margin:8px 0 0; }

/* Pasek zajętości miejsca (admin Pliki) */
.store-bar-wrap { margin:12px 0 18px; }
.store-bar { height:10px; border-radius:2px; background:var(--ink-100); overflow:hidden; }
.store-bar-fill { display:block; height:100%; background:var(--indigo-700); border-radius:2px; }
.store-bar-fill.full { background:#B5391A; }
/* Z-192: szerokosc paska klasa co 5 % zamiast atrybutu style (CSP style-src bez unsafe-inline). */
.store-bar-fill.w-0{width:0%} .store-bar-fill.w-5{width:5%} .store-bar-fill.w-10{width:10%} .store-bar-fill.w-15{width:15%} .store-bar-fill.w-20{width:20%} .store-bar-fill.w-25{width:25%} .store-bar-fill.w-30{width:30%} .store-bar-fill.w-35{width:35%} .store-bar-fill.w-40{width:40%} .store-bar-fill.w-45{width:45%} .store-bar-fill.w-50{width:50%} .store-bar-fill.w-55{width:55%} .store-bar-fill.w-60{width:60%} .store-bar-fill.w-65{width:65%} .store-bar-fill.w-70{width:70%} .store-bar-fill.w-75{width:75%} .store-bar-fill.w-80{width:80%} .store-bar-fill.w-85{width:85%} .store-bar-fill.w-90{width:90%} .store-bar-fill.w-95{width:95%} .store-bar-fill.w-100{width:100%}
.limit-form { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; margin-bottom:20px; }
.limit-form .fld { flex:0 0 auto; }
.limit-form button { min-height:auto; padding:11px 16px; }
.file-meta { font-size:12px; color:var(--ink-500); margin:6px 0 4px; }
.file-del { margin-top:2px; }
.store-block { border:1px solid var(--line); border-radius:0; padding:12px 14px; background:var(--ink-50); }
.store-block .err { margin:6px 0 0; }

/* Pasek postępu wysyłki pliku (formularz nowego posta) */
.upload-progress { margin:14px 0; }
.upload-progress-label { font-size:13px; font-weight:600; color:var(--ink-700); }
.upload-progress-track { height:10px; border-radius:2px; background:var(--ink-100); overflow:hidden; margin-top:6px; }
.upload-progress-fill { display:block; height:100%; width:0; background:var(--indigo-700); border-radius:2px; transition:width .15s; }

/* Sekcja "Uwaga do PRAEVI" na dole postu (portal klienta) */
.note-section { margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.note-label { display:block; font-size:13px; font-weight:600; color:var(--ink-500); }
.note-section .note-input { width:100%; box-sizing:border-box; }
.note-section button { margin-top:8px; }
/* Zwijane sekcje karty (uwaga, szczegóły): w spoczynku sama etykieta ze
   strzałką, zawartość po kliknięciu. Krótsza karta na telefonie. */
.note-fold > summary, .details-fold > summary { list-style:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:6px; padding:2px 0; }
.note-fold > summary::-webkit-details-marker,
.details-fold > summary::-webkit-details-marker { display:none; }
.note-fold > summary::marker, .details-fold > summary::marker { content:""; }
.note-fold > summary::after, .details-fold > summary::after { content:"▾";
  font-size:11px; line-height:1; transition:transform .15s; }
.note-fold[open] > summary::after, .details-fold[open] > summary::after { transform:rotate(180deg); }
.note-fold > summary:hover, .details-fold > summary:hover { color:var(--ink-900); }
.note-fold .note-form { margin-top:10px; }

/* Szczegóły publikacji na gotowym poście: kanał, dzień i godzina obok siebie,
   gdy jest miejsce; na telefonie jeden pod drugim. */
.details-fold { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.details-form { margin-top:10px; }
.details-hint { margin:0; font-size:13px; }
.details-grid { display:grid; gap:10px; grid-template-columns:1fr; }
@media (min-width:520px) { .details-grid { grid-template-columns:1.2fr 1fr .8fr; } }
.details-form button { justify-self:start; }
.details-form input[type="file"] { padding:4px 0; }
.thumb-dl { position:absolute; left:0; right:0; bottom:0; text-align:center; font-size:11px; font-weight:600; color:#F4F1EA;
  background:rgba(17,19,22,.6); padding:3px 0; }

.status-form { margin:14px 0 0; display:grid; gap:8px; }
.btn-status { background:#FBF9F5; color:var(--ink-700); border:1px solid var(--ink-300); min-height:44px; padding:10px 14px; font-size:15px; font-weight:600; }
.btn-status:hover { color:var(--ink-900); border-color:var(--ink-700); filter:none; background:var(--ink-50); }

/* Admin */
h2 { font-size:17px; font-weight:700; margin:28px 0 10px; }
.tbl-wrap { overflow-x:auto; }
.tbl { width:100%; border-collapse:collapse; font-size:14px; background:#FBF9F5; border-radius:0; overflow:hidden; border:1px solid var(--line); }
.tbl th, .tbl td { text-align:left; padding:11px 13px; border-bottom:1px solid var(--line); }
.tbl th { color:var(--ink-500); font-weight:600; background:var(--ink-50); }
.tbl a { color:var(--indigo-700); font-weight:600; }
.stack { display:grid; gap:10px; max-width:440px; margin-top:8px; }
.channels { border:1px solid var(--line); border-radius:0; padding:12px 14px; display:grid; gap:8px; background:#FBF9F5; }
.channels legend { padding:0 6px; }
.chk { display:flex; align-items:center; gap:8px; font-size:15px; }
.keybox { border-color:var(--orange-500); margin:16px 0; }
.key { display:block; word-break:break-all; background:var(--ink-50); padding:12px; border-radius:0; font-size:13px; font-family:ui-monospace, monospace; }
.pre { white-space:pre-wrap; }
.tagbox { margin-top:10px; padding:10px 12px; background:var(--ink-50); border:1px solid var(--line); border-radius:2px; }
.tagbox-label { display:block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-500); margin-bottom:4px; }
.tagbox .pre { font-size:14px; color:var(--ink-700); line-height:1.5; }
.sub { margin:12px 0; }
.card.sub, .card.keybox { max-width:none; }

/* Bramka wstrzyknięć na zgłoszeniach (core/security/prompt_guard.py).
   Wariant bazowy = tekst oznaczony, ale przepuszczony (waga `srednie`).
   `.sub-flagi-stop` = zaparkowane, silnik go nie tknie do zwolnienia. */
.sub-flagi { margin:10px 0 14px; padding:12px 14px; border-radius:0;
             background:var(--ink-50); border:1px solid var(--line); font-size:14px; }
.sub-flagi p { margin:0 0 6px; }
.sub-flagi ul { margin:0; padding-left:18px; color:var(--ink-700); }
.sub-flagi li { margin-bottom:3px; line-height:1.45; }
.sub-flagi code { font-family:ui-monospace, monospace; font-size:12px; }
.sub-flagi form { margin-top:10px; }
.sub-flagi-stop { background:#FBE3D6; border-color:#F5C9B5; }
.pre-inline { font-family:ui-monospace, monospace; font-size:12px; background:#FBF9F5;
              padding:1px 5px; border-radius:0; border:1px solid var(--line); }

/* Widok tygodnia (kalendarz) */
.weekwrap { max-width:1200px; margin:0 auto; padding:18px 16px 64px; }
.weeknav { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.weeknav-mid { text-align:center; }
.weeknav-label { display:block; font-family:var(--font-display); font-weight:700; font-size:16px; }
.weeknav-today { font-size:13px; color:var(--ink-700); font-weight:600; }
.week { display:grid; grid-template-columns:repeat(7, minmax(150px,1fr)); gap:10px; overflow-x:auto; padding-bottom:8px; }
.wcol { background:#FBF9F5; border:1px solid var(--line); border-radius:0; padding:8px; min-height:130px; }
.wcol.is-today { border-color:var(--ink-700); }
.wcol-head { display:flex; align-items:center; justify-content:space-between; gap:6px; padding:6px 6px 9px; text-decoration:none; color:var(--ink-900); border-bottom:1px solid var(--line); }
.wcol-wd { font-size:11px; color:var(--ink-500); font-weight:600; text-transform:uppercase; letter-spacing:.04em; }
.wcol-dnum { font-family:var(--font-display); font-weight:700; font-size:18px; }
.wcol.is-today .wcol-dnum { color:var(--ink-900); }
.wcol-posts { display:grid; gap:8px; padding-top:8px; }
.wpost { display:block; text-decoration:none; background:var(--ink-50); border:1px solid var(--line); border-radius:0; padding:8px; transition:border-color .15s; }
.wpost:hover { border-color:var(--ink-700); }
.wpost.pub { opacity:.55; }
.wpost-top { display:flex; align-items:center; gap:6px; }
.wpost .badge { font-size:11px; padding:3px 8px; }
.wpost-time { font-size:11px; color:var(--ink-500); }
.wpost-snip { display:block; margin-top:6px; font-size:12px; color:var(--ink-700); line-height:1.35; }
.wcol-empty { text-align:center; color:var(--ink-300); font-size:14px; padding:14px 0; }
/* Akcje w okienku dnia. Widzę pustą środę i mam tam obie drogi: wpisać
   własny post albo zamówić go u zespołu — bez wybierania dnia drugi raz
   w formularzu. Przygaszone, żeby nie konkurowały z treścią postów. */
.wcol-actions { display:grid; gap:6px; margin-top:8px; }
.wcol-act { display:block; text-align:center; text-decoration:none; font-size:12px;
  line-height:1.3; font-weight:600; color:var(--ink-500); padding:8px 6px;
  border-radius:2px; border:1px dashed var(--ink-300); background:#FBF9F5;
  text-wrap:balance; }
.wcol-act:hover { color:var(--indigo-700); border-color:var(--indigo-700);
  border-style:solid; background:var(--indigo-50); }
.wcol-add { margin-left:auto; width:23px; height:23px; border-radius:2px; display:flex; align-items:center; justify-content:center; font-size:18px; line-height:1; color:var(--indigo-700); background:var(--ink-50); text-decoration:none; flex:0 0 auto; }
.wcol-add:hover { background:var(--indigo-700); color:#F4F1EA; }
.wcol-addbig { display:block; text-align:center; color:var(--ink-300); font-size:13px; padding:12px 0; border:1px dashed var(--line); border-radius:0; text-decoration:none; }
.wcol-addbig:hover { color:var(--indigo-700); border-color:var(--indigo-700); background:var(--ink-50); }

/* ── Dolne tabsy (portal) ─────────────────────────────────────────── */
.has-tabs { padding-bottom:calc(76px + env(safe-area-inset-bottom)); }
.tabs { position:fixed; left:0; right:0; bottom:0; z-index:40; display:flex;
  background:#FBF9F5; border-top:1px solid var(--line);
  padding:6px 0 calc(8px + env(safe-area-inset-bottom)); }
.tab { flex:1; display:flex; flex-direction:column; align-items:center; gap:2px;
  text-decoration:none; color:var(--ink-500); font-size:11px; font-weight:600; }
.tab svg { width:22px; height:22px; }
.tab.is-active { color:var(--ink-900); }

/* ── Hamburger (topbar) ───────────────────────────────────────────── */
.menu { position:relative; }
.menu summary { list-style:none; cursor:pointer; display:flex; align-items:center;
  justify-content:center; width:38px; height:38px; border-radius:2px; }
.menu summary::-webkit-details-marker { display:none; }
.menu summary:hover { background:var(--ink-50); }
.menu-ico { font-size:19px; color:var(--ink-700); line-height:1; }
.menu-drop { position:absolute; right:0; top:44px; min-width:170px; background:#FBF9F5;
  border:1px solid var(--line); border-radius:0; padding:6px;
  box-shadow:var(--shadow-lg); z-index:50; }
.menu-item { display:block; width:100%; text-align:left; padding:10px 12px;
  border-radius:2px; font-size:14px; color:var(--ink-900); text-decoration:none;
  background:none; border:none; cursor:pointer; font-family:inherit; }
.menu-item:hover { background:var(--ink-50); }
.menu-user { display:block; padding:8px 12px 10px; margin-bottom:4px;
  border-bottom:1px solid var(--line); font-size:12px; color:var(--ink-500);
  line-height:1.35; word-break:break-all; cursor:default; }
.menu-user strong { display:block; margin-top:2px; color:var(--ink-900);
  font-weight:600; font-size:13px; }

/* ── Radar ────────────────────────────────────────────────────────── */
/* Licznik długości briefu przy zamówieniu treści. */
.order-count { margin:-4px 0 0; font-size:13px; }
.order-count.is-ok { color:var(--success); font-weight:600; }

.search-count { margin:0 0 12px; }
.crumb { margin:0 0 10px; display:flex; justify-content:space-between; align-items:center; }
.kind-head { margin:16px 4px 8px; font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; color:var(--ink-500); }
.sig { position:relative; background:#FBF9F5; border:1px solid var(--line); border-radius:0;
  padding:12px 14px; margin-bottom:10px; }
.sig-alert { border-color:var(--orange-500); background:#F5EBD6; }
.sig-head { display:flex; align-items:center; gap:8px; margin-bottom:6px; padding-right:30px; }
.sig-flag { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  color:var(--orange-600); }
.sig-time { margin-left:auto; font-size:12px; color:var(--ink-500); }
/* Sekcje radaru bez kolorów — czytelność robi typografia, nie tło. */
.sig-badge-competitor, .sig-badge-reference, .sig-badge-industry {
  background:var(--ink-100); color:var(--ink-700); }
.sig-title { margin:0 0 4px; font-size:15px; font-weight:600; line-height:1.4;
  color:var(--ink-900); }
.sig-why { margin:0 0 6px; font-size:13px; line-height:1.5; color:var(--ink-700); }
.sig-src { margin:0 0 8px; font-size:13px; color:var(--ink-500); }
.sig-src a { color:var(--ink-700); }
.btn-want { font-size:13px; padding:7px 12px; border:1px solid var(--ink-300);
  border-radius:2px; background:none; color:var(--ink-700); cursor:pointer;
  font-family:inherit; font-weight:600; }
.btn-want:hover { background:var(--ink-50); }
/* Prowieniencja: zwykły tekst; zieleń tylko przy "sprawdzone" (to sygnał
   zaufania), auto zostaje szare. */
.prov-badge { font-size:13px; font-weight:600; white-space:nowrap; }
.prov-badge.rev { color:var(--success); }
.prov-badge.auto { color:var(--ink-500); }
.prov-dot { font-size:10px; margin-left:auto; }
.prov-dot.rev { color:var(--success); }
.prov-dot.auto { color:var(--ink-500); }
.want summary { display:inline-block; list-style:none; }
.want summary::-webkit-details-marker { display:none; }
.want[open] summary { background:var(--ink-50); }
.want form { display:grid; gap:8px; margin-top:8px; }
.want .want-comment { font-size:15px; padding:10px 12px; }
.want form .btn-want { justify-self:start; }
/* Dwa warianty zgłoszenia (post / komentarz) jeden pod drugim — na wąskim
   ekranie zawijają się same, bo każdy <details> jest osobnym blokiem. */
.want-row { display:flex; flex-wrap:wrap; gap:8px; }
.want-row .want { flex:1 1 100%; }

/* ── Oznaczanie kolorem (post, sygnał radaru, kafelek w tygodniu) ──
   Kolor przemalowuje CAŁY panel wpisu, bo o to chodzi w oznaczaniu: klient
   ma go znaleźć wzrokiem, nie czytać etykiety. Wybór chowa się pod samą
   strzałką w prawym górnym rogu karty. */
.post[data-tag="amber"], .sig[data-tag="amber"], .wpost[data-tag="amber"] {
  background:var(--tag-amber-bg); border-color:var(--tag-amber-line); }
.post[data-tag="sage"], .sig[data-tag="sage"], .wpost[data-tag="sage"] {
  background:var(--tag-sage-bg); border-color:var(--tag-sage-line); }
.post[data-tag="azure"], .sig[data-tag="azure"], .wpost[data-tag="azure"] {
  background:var(--tag-azure-bg); border-color:var(--tag-azure-line); }
.post[data-tag="plum"], .sig[data-tag="plum"], .wpost[data-tag="plum"] {
  background:var(--tag-plum-bg); border-color:var(--tag-plum-line); }
/* Pole treści na kolorowej karcie: jaśniejsze niż tło, żeby tekst dalej
   czytał się jak kartka położona na kolorze. */
.post[data-tag] .post-text { background:rgba(255,255,255,.72); }

/* Strzałka siedzi w rogu karty na stałe (pozycja bezwzględna), a nie w toku
   nagłówka: przy długiej etykiecie prowieniencji nagłówek zawija się na
   telefonie i strzałka zjeżdżała z rogu na drugi wiersz. */
.tagpick { position:absolute; top:10px; right:10px; z-index:2; }
.tagpick > summary { list-style:none; cursor:pointer; display:flex; align-items:center;
  justify-content:center; width:30px; height:30px;
  border-radius:2px; color:var(--ink-500); font-size:14px; line-height:1; }
.tagpick > summary::-webkit-details-marker { display:none; }
.tagpick > summary::marker { content:""; }
.tagpick > summary:hover { background:var(--ink-100); color:var(--ink-900); }
.tagpick[open] > summary { background:var(--ink-100); color:var(--ink-900); }
.tagpick-drop { position:absolute; right:0; top:34px; z-index:30; margin:0;
  display:flex; align-items:center; gap:8px; padding:8px 9px; background:#FBF9F5;
  border:1px solid var(--line); border-radius:2px; box-shadow:var(--shadow-lg); }
.tagpick-swatch, .tagpick-clear { width:30px; height:30px; min-height:0; padding:0;
  border-radius:0; cursor:pointer; flex:none; }
.tagpick-swatch { border:1px solid rgba(17,19,22,.14); }
.tagpick-swatch:hover, .tagpick-clear:hover { filter:none; transform:scale(1.08); }
.sw-amber { background:var(--tag-amber-dot); }
.sw-sage  { background:var(--tag-sage-dot); }
.sw-azure { background:var(--tag-azure-dot); }
.sw-plum  { background:var(--tag-plum-dot); }
.tagpick-swatch.is-on { box-shadow:none; }
.tagpick-clear { background:#FBF9F5; border:1px solid var(--ink-300); color:var(--ink-500);
  font-size:16px; font-weight:400; line-height:1; display:flex; align-items:center;
  justify-content:center; }
.tagpick-clear:hover { color:var(--ink-900); border-color:var(--ink-700); }
/* Podgląd oznaczenia w panelu zespołu: sama kropka z podpisem, bez wyboru. */
.tag-chip { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.tag-chip i { width:11px; height:11px; border-radius:2px; display:inline-block;
  border:1px solid rgba(17,19,22,.14); }

/* Stopka karty logowania (link do regulaminu). */
.card-foot { margin:18px 0 0; padding-top:14px; border-top:1px solid var(--line); }
.card-foot a { font-size:13px; }

/* Ekran akceptacji Regulaminu (bramka przed wejściem do panelu). */
.card-zgoda { max-width:460px; }
.zgoda-box { display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start;
  padding:14px 16px; border:1px solid var(--ink-300); border-radius:0;
  background:var(--ink-50); font-size:14.5px; line-height:1.55; cursor:pointer; }
.zgoda-box:hover { border-color:var(--ink-700); }
.zgoda-box input[type="checkbox"] { width:20px; height:20px; margin:2px 0 0; accent-color:var(--indigo-700); }
.zgoda-czytaj { margin:0; }
.zgoda-czytaj a { color:var(--indigo-700); font-weight:600; font-size:14px; }
.zgoda-rodo { margin:18px 0 0; color:var(--ink-500); font-size:12.5px; line-height:1.55; }
.zgoda-rodo a { color:var(--ink-700); }
.zgoda-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.zgoda-foot .muted { font-size:13px; }
.zgoda-foot form { margin:0; }

/* Stan akceptacji Regulaminu przy użytkowniku w panelu admina. */
.zgoda-tag { font-size:12px; font-weight:600; color:var(--success); white-space:nowrap; }
.zgoda-tag.brak { color:var(--ink-500); }

/* ── Regulamin: podstrona z pełną treścią (public/regulamin.html) ──
   Dokument prawny czyta się długo, więc typografia jest tu szersza i
   luźniejsza niż w panelu: 16,5 px, interlinia 1,7, numeracja wisząca
   w marginesie (tekst ustępu układa się w równą kolumnę, a numer da się
   zeskanować wzrokiem). Ten sam arkusz obsługuje druk i PDF — sekcja
   @media print na końcu. */
.legal-body { background:var(--bg); }
.legal-top { display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 20px; background:#FBF9F5; border-bottom:1px solid var(--line); }
.legal-top .brand { text-decoration:none; }
.legal-top-akcje { display:inline-flex; align-items:center; gap:16px; }
.legal { max-width:800px; margin:0 auto; padding:26px 18px 64px; }

.legal-note { margin:0 0 18px; padding:12px 16px; border-radius:0;
  background:var(--orange-100); border:1px solid #E3D3AE; color:var(--ink-700);
  font-size:14px; line-height:1.55; }
.legal-note a { color:var(--indigo-700); }

.legal-doc { background:#FBF9F5; border:1px solid var(--line); border-radius:0;
  padding:44px 48px; box-shadow:var(--shadow-sm); color:var(--ink-900);
  font-size:16.5px; line-height:1.7; }
.legal-doc h1 { margin:0; font-size:27px; font-weight:700; line-height:1.25; }
.legal-lead { margin:8px 0 0; color:var(--ink-500); font-size:14px; }
/* Adnotacja tlumacza w wariancie EN — ma byc widoczna, ale nie udawac tresci
   dokumentu, bo wiaze tekst polski. */
.legal-tlum { margin:14px 0 0; padding:10px 14px; border-left:3px solid var(--ink-300);
  background:var(--ink-50); color:var(--ink-700); font-size:13.5px; line-height:1.55; }
.legal-doc a { color:var(--indigo-700); }

.legal-toc { margin:26px 0 8px; padding:18px 20px; background:var(--indigo-50);
  border-radius:0; }
.legal-toc ol { counter-reset:toc; list-style:none; margin:0; padding:0;
  columns:2; column-gap:30px; }
.legal-toc li { counter-increment:toc; break-inside:avoid; margin:0 0 7px; font-size:14px;
  line-height:1.45; }
.legal-toc li::before { content:"§ " counter(toc) ". "; color:var(--ink-500);
  font-variant-numeric:tabular-nums; }
.legal-toc a { color:var(--ink-700); text-decoration:none; }
.legal-toc a:hover { text-decoration:underline; }

.par { margin-top:38px; }
.par h2 { margin:0 0 14px; font-size:18px; font-weight:700; scroll-margin-top:80px; }

/* Numeracja wisząca: ustępy 1. 2. 3., litery a) b) c). */
.legal-doc ol.ust, .legal-doc ol.lit { list-style:none; margin:0; padding:0; }
.legal-doc ol.ust { counter-reset:ust; }
.legal-doc ol.ust > li { counter-increment:ust; position:relative; padding-left:34px;
  margin:0 0 13px; }
.legal-doc ol.ust > li::before { content:counter(ust) "."; position:absolute; left:0; top:0;
  width:24px; text-align:right; color:var(--ink-500); font-variant-numeric:tabular-nums; }
.legal-doc ol.lit { counter-reset:lit; margin:11px 0 4px; }
.legal-doc ol.lit > li { counter-increment:lit; position:relative; padding-left:32px;
  margin:0 0 9px; }
.legal-doc ol.lit > li::before { content:counter(lit, lower-alpha) ")"; position:absolute;
  left:0; top:0; width:22px; text-align:right; color:var(--ink-500); }

/* Definicje (§ 2): termin w lewej kolumnie, treść w prawej. */
.defs { margin:0; }
.defs > div { display:grid; grid-template-columns:186px 1fr; gap:0 18px;
  padding:9px 0; border-top:1px solid var(--line); }
.defs > div:first-child { border-top:0; padding-top:0; }
.defs dt { font-weight:600; color:var(--indigo-700); }
.defs dd { margin:0; }

.legal-download { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:26px 0 0; }
.btn-download { display:inline-block; padding:13px 22px; border-radius:2px;
  background:var(--indigo-700); color:#F4F1EA; text-decoration:none;
  font-family:var(--font-display); font-size:15px; font-weight:600; }
.btn-download:hover { filter:brightness(1.08); }
/* a:hover ze skórki (Ember) wygrywał z .btn-download:hover — ciemny tekst na graficie. */
a.btn-download:hover { color:#F4F1EA; }
.legal-foot { margin:34px 0 0; padding-top:18px; border-top:1px solid var(--line);
  color:var(--ink-500); font-size:13px; line-height:1.6; }
.legal-foot p { margin:0 0 4px; }
.legal-foot a { color:var(--ink-700); }

@media (max-width:600px) {
  .legal { padding:16px 12px 48px; }
  .legal-doc { padding:26px 20px; border-radius:0; font-size:16px; }
  .legal-doc h1 { font-size:23px; }
  .legal-toc ol { columns:1; }
  .defs > div { grid-template-columns:1fr; gap:2px; }
}

/* ── Komp: widok dnia jako planer (wariant A, uwagi Milki 30.07.2026) ──
   Telefon zostaje bez zmian — cały ten blok wchodzi dopiero od 768px.
   Lista postów z boku (master-detail: klik = post po prawej), zwarty
   nagłówek, wyraźnie wydzielone okno edycji (Szczegóły / Uwaga do PRAEVI
   zostają POD nim) i zbite na środku dolne tabsy. */
@media (min-width:768px) {
  /* Szerzej, bo teraz dwie kolumny: lista z boku + otwarty post. */
  .feed { max-width:1040px; padding-top:12px; }

  /* Nagłówek dnia zwarty i wyśrodkowany — strzałki przy dacie, nie w rogach
     (to raziło na żywo), mniejsze, data i kalendarzyk w jednej linii. */
  .daynav { margin-bottom:16px; justify-content:center; gap:14px; }
  .daynav-arrow { height:40px; width:40px; font-size:22px; border-radius:0; }
  .daynav-mid { display:flex; align-items:center; justify-content:center; gap:10px; }
  .daynav-label { font-size:15px; }
  .daynav-picker { margin-top:0; }

  /* Dwie kolumny: lista postów (lewa, przyklejona) + otwarty post (prawa). */
  .day-split { display:flex; gap:20px; align-items:flex-start; }
  .day-list { display:flex; flex-direction:column; gap:8px; width:300px; flex:none;
    position:sticky; top:80px; max-height:calc(100vh - 96px); overflow-y:auto; }
  .day-posts { flex:1; min-width:0; }
  .day-posts .post { max-width:640px; }

  /* Wpis listy: kanał + status + dwa wiersze początku treści, żeby dwa posty
     tego samego kanału dało się rozróżnić. Zaznaczony na pomarańczowo. */
  .day-list-item { display:block; text-decoration:none; color:var(--ink-900);
    padding:10px 12px; border:1px solid var(--line); border-radius:0;
    background:#FBF9F5; box-shadow:var(--shadow-sm); }
  .day-list-item:hover { border-color:var(--ink-300); }
  .day-list-item.is-active { border-color:var(--orange-500); background:var(--orange-100); }
  .dli-head { display:flex; align-items:center; gap:8px; }
  .dli-status { margin-left:auto; font-size:11px; font-weight:600; color:var(--ink-500); }
  .dli-snip { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
    overflow:hidden; margin-top:6px; font-size:12.5px; line-height:1.45; color:var(--ink-700); }

  /* Okno edycji wyraźnie wydzielone: treść + akcje w obrysowanym, jaśniejszym
     bloku, samo pole tekstu na bieli — od razu widać, gdzie się pisze.
     Szczegóły / Uwaga do PRAEVI zostają pod tym blokiem (kolejność w DOM). */
  .post { padding:20px 22px; }
  .post-form { border:1px solid var(--line); border-radius:0; background:var(--ink-50); padding:16px; }
  .post[data-tag] .post-form { background:rgba(255,255,255,.6); }
  .post-text { background:#FBF9F5; max-height:460px; }
  .details-fold, .note-section { margin-top:18px; }

  /* Dolne tabsy zbite na środku — na szerokim ekranie nie uciekają w rogi. */
  .tabs { justify-content:center; gap:10px; }
  .tab { flex:0 0 auto; min-width:132px; padding:2px 22px; }

  /* Drag-and-drop (komp). Tydzień: kafelek posta chwyta się myszą, kolumna
     docelowa podświetla się na przeciąganie. Dzień: karta posta podświetla
     się, gdy ciągniesz na nią plik, i przygasza w trakcie wgrywania. */
  .wpost[draggable="true"] { cursor:grab; }
  .wpost.is-dragging { opacity:.5; cursor:grabbing; }
  .wcol.drop-target { outline:2px dashed var(--orange-500); outline-offset:3px; border-radius:0; }
  .wdzien.drop-target { outline:2px dashed var(--orange-500); outline-offset:3px; border-radius:0; }
  .day-posts .post.drop-files { outline:2px dashed var(--orange-500); outline-offset:3px; }
  .day-posts .post.is-uploading { opacity:.6; pointer-events:none; }
}

/* Druk i PDF: sam dokument, bez nawigacji panelu. Marginesy strony ustawia
   @page, więc karta nie powiela wcięcia. */
@media print {
  @page { size:A4; margin:18mm 17mm 20mm; }
  /* .legal-body (klasa) bije `body` specyficznością — bez tego szare tło
     panelu wychodzi w PDF jako prostokąt pod ostatnim akapitem. */
  body, .legal-body { background:#FBF9F5; }
  .legal-top, .legal-download, .legal-note { display:none; }
  .legal { max-width:none; margin:0; padding:0; }
  .legal-doc { border:0; border-radius:0; box-shadow:none; padding:0;
    font-size:10.5pt; line-height:1.55; }
  .legal-doc h1 { font-size:17pt; }
  .par h2 { font-size:11.5pt; break-after:avoid; }
  .par { margin-top:20px; break-inside:auto; }
  .legal-doc ol.ust > li, .legal-doc ol.lit > li, .defs > div { break-inside:avoid; }
  .legal-toc { background:none; border:1px solid #DDD7CB; padding:12px 14px; }
  .legal-doc a { color:#111316; text-decoration:none; }
  .legal-foot { color:#3A3F48; }
}

/* ── Wywiad (intel) ── layout „briefu redakcyjnego” ───────────────
   Wzorzec: materiał wewnętrzny (kicker → tytuł → pasek metryk →
   Kierunkowskaz → numerowane sekcje → oś czasu z kropkami → kafle liczb).
   Mobile-first; >=768px szersza kolumna i siatki. */
/* Wywiad tak szeroki jak radar (decyzja Pawła 19.08): przy 860 px dwie
   kolumny wychodzily WEZSZE niz jedna kolumna radaru i wszystko bylo
   scisniete — szeroki ekran stal niewykorzystany. */
@media (min-width: 768px) { .p-portal .feed.wyw { max-width: 1040px; } }

/* nagłówek — kompaktowy: kicker z nazwą klienta drobnym drukiem i jedna
   linia metryk. Bez wielkiego tytułu; klient wie, czyj to panel, a brief
   ma być widoczny od razu, bez przewijania. */
.wyw-head { margin: 2px 0 12px; }
.wyw-kicker { font-size: 11px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color:var(--ink-500); line-height: 1.5; }
.wyw-klient { font-weight: 600; letter-spacing: .04em; color:var(--ink-700);
  text-transform: none; }
.wyw-meta { margin-top: 5px; padding: 6px 0; font-size: 12px; line-height: 1.6;
  color:var(--ink-500); border-top:1px solid var(--line);
  border-bottom:1px solid var(--line); font-variant-numeric: tabular-nums; }
.wyw-meta strong { color:var(--ink-900); font-weight: 700; }
/* Duży tytuł zostaje TYLKO dla ekranu przykładu (klient bez modułu). */
.wyw-title { font-family: var(--font-display); font-size: 22px; line-height: 1.2;
  letter-spacing: -.015em; margin: 4px 0 8px; }
@media (min-width: 768px) { .wyw-title { font-size: 26px; } }

/* numerowane sekcje */
.wyw-sec { display: flex; align-items: baseline; gap: 10px; margin: 22px 0 10px; }
.wyw-secnum { font-size: 12px; font-weight: 700; color:var(--ink-300);
  font-variant-numeric: tabular-nums; }
.wyw-sec h2 { font-size: 18px; margin: 0; }

/* Kierunkowskaz — ramka „gdyby zabrakło czasu” */
.wyw-note { background:#FBF9F5; border:1px solid var(--line); border-radius:0;
  padding: 16px 16px 8px; box-shadow: var(--shadow-sm); margin-bottom: 6px; }
.wyw-note-kicker { font-size: 10px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color:var(--ink-500); margin-bottom: 10px; }
.wyw-dir { font-size: 11px; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; margin: 14px 0 6px; color:var(--ink-500); }
.wyw-dir-idz { color:#2F6F5E; }
.wyw-dir-unikaj { color:#B5391A; }
.wyw-wniosek { border-left:3px solid var(--ink-300); border-radius:0;
  background:var(--ink-50); padding: 10px 12px; margin-bottom: 8px; }
.wyw-wniosek-idz { border-left-color: #2F6F5E; background:#DCEDE6; }
.wyw-wniosek-unikaj { border-left-color: #B5391A; background:#FBE3D6; }
.wyw-wniosek-claim { font-weight: 600; line-height: 1.45; }
.wyw-wniosek-nr { color:var(--ink-300); font-weight: 700; margin-right: 2px; }

/* pigułki widoków; #dowody = kotwica zmiany widoku (nie chowa się pod
   topbarem — jak .post w kalendarzu) */
#dowody { scroll-margin-top: 74px; }

/* karty aktorów + oś czasu z kropkami */
.wyw-actor > summary { list-style: none; cursor: pointer; display: grid; gap: 4px; }
.wyw-actor > summary::-webkit-details-marker { display: none; }
.wyw-actor-row { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.wyw-actor-name { font-family: var(--font-display); font-size: 16px; }
.wyw-actor-fn { font-size: 13px; }
.wyw-actor-stats { margin-left: auto; font-size: 12px; color:var(--ink-500);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.wyw-actor-last { font-size: 14px; color:var(--ink-500); line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
  overflow: hidden; }
.wyw-actor[open] .wyw-actor-last { display: none; }
.wyw-tl { margin: 12px 0 0 3px; padding-left: 18px;
  border-left:2px solid var(--ink-100); display: grid; gap: 14px; }
.wyw-tl-item { position: relative; }
.wyw-tl-item::before { content: ""; position: absolute; left: -23px; top: 5px;
  width: 8px; height: 8px; border-radius:2px; background:var(--ink-700);
  box-shadow:none; }
.wyw-date { font-size: 11px; font-weight: 700; letter-spacing: .05em;
  text-transform: uppercase; color:var(--ink-500); margin-bottom: 3px;
  font-variant-numeric: tabular-nums; }
.wyw-claim { font-size: 15px; line-height: 1.5; }

/* outlook strategiczny konkurenta (z tygodniowej syntezy) */
.wyw-outlook { margin: 12px 0 2px; padding: 10px 12px; background:var(--ink-50);
  border-left:3px solid var(--ink-700); border-radius:0; }
.wyw-outlook-kicker { font-size: 10px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color:var(--ink-500); margin-bottom: 5px; }
.wyw-outlook-claim { font-weight: 600; line-height: 1.45; }
.wyw-outlook-detail { font-size: 14px; line-height: 1.55; color:var(--ink-700);
  margin-top: 5px; }

/* otoczenie rynkowe — zwijane, żeby regulatorzy i media nie mieszały się
   z konkurentami na głównej liście */
.wyw-otocz > summary { margin: 16px 0 10px; cursor: pointer; }

/* badge BETA: w dolnej nawigacji i w nagłówku zakładki */
.tab-beta { display: inline-block; margin-left: 4px; font-size: 8px;
  font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  vertical-align: super; opacity: .75; }
.wyw-beta { display: inline-block; margin-left: 6px; padding: 1px 6px;
  border-radius:2px; background:var(--ink-900); color:#F4F1EA;
  font-size: 9px; font-weight: 800; letter-spacing: .08em; }

/* przykład dla klienta bez włączonego modułu — musi być widać, że to nie
   są jego dane: baner u góry i wyraźnie stonowane karty */
.wyw-demo-note { background:#F5EBD6; border:1px solid #E3D3AE;
  border-radius:0; padding: 12px 14px; font-size: 14px; line-height: 1.55;
  color:var(--ink-700); margin-bottom: 6px; }
.wyw-demo { position: relative; opacity: .92; }
.wyw-demo .sig, .wyw-demo .wyw-note { background:repeating-linear-gradient(135deg, var(--ink-50), var(--ink-50) 14px, var(--ink-100) 14px, var(--ink-100) 28px); }
.wyw-actor-demo .wyw-actor-row { display: flex; gap: 8px; align-items: baseline;
  flex-wrap: wrap; margin-bottom: 4px; }

/* „Napisz o tym" — jedyna akcja w zakładce (temat w trendzie) */
.wyw-akcja { margin-top: 10px; }
.wyw-akcja .btn-want { display: inline-block; text-decoration: none; }

/* „Więcej (N)" — nadwyżka ponad 5 pozycji w każdej liście */
.wyw-wiecej > summary { margin: 4px 0 12px; cursor: pointer; padding: 8px 0;
  font-size: 14px; }
.wyw-wiecef, .wyw-wiecej[open] > summary { margin-bottom: 8px; }

/* liczby jako kafle */
@media (min-width: 768px) {
  .wyw-nums { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .wyw-nums .sig { margin-bottom: 0; }
}
.wyw-num-value { font-family: var(--font-display); font-size: 30px;
  font-weight: 700; letter-spacing: -.015em; line-height: 1.1;
  margin-bottom: 4px; font-variant-numeric: tabular-nums; }

/* terminy: chip daty + treść */
.wyw-term { display: flex; gap: 12px; align-items: flex-start; }
.wyw-term-chip { flex: 0 0 auto; font-size: 12px; font-weight: 700;
  color:var(--ink-700); background:var(--ink-100); padding: 4px 10px;
  border-radius:2px; font-variant-numeric: tabular-nums; }
.wyw-term-body { min-width: 0; flex: 1; }
.wyw-term.is-past { opacity: .6; }
.intel-past > summary { margin: 14px 0 10px; cursor: pointer; }

/* cytat źródłowy / „dlaczego” (details) */
.intel-quote > summary { font-size: 13px; font-weight: 600; color:var(--ink-500);
  cursor: pointer; margin: 4px 0; }
.intel-quote blockquote { margin: 6px 0; padding: 8px 12px; background:var(--ink-50);
  border-left:3px solid var(--ink-300); font-size: 14px; line-height: 1.5;
  color:var(--ink-700); border-radius:0; }
.intel-quote .sig-why { margin: 6px 0; }

/* stan rozruchu */
.intel-warmup { padding: 44px 20px; text-align: center; }
.intel-warmup-ico { font-size: 34px; margin-bottom: 8px; }
.intel-warmup h2 { margin-bottom: 8px; }
.intel-warmup-count { margin-top: 14px; font-size: 13px; font-weight: 600;
  color:var(--ink-700); background:var(--ink-100); display: inline-block;
  padding: 5px 12px; border-radius:2px; }

/* ══ EKRANY WEJŚCIA (logowanie, kod, zgoda) ══════════════════════════
   System wizualny PRAEVI, wdrożenie 2026-08-19. Okładka w indygo
   z kropkowaną fakturą; na telefonie karta treści wchodzi na nią ujemnym
   marginesem, na komputerze okładka i treść siedzą w jednej pływającej
   karcie wyśrodkowanej na ekranie. */
.auth-shell { min-height:100vh; display:flex; flex-direction:column;
  justify-content:center; padding:16px 0 24px; }
.auth-panel { margin:0 16px; }

.auth-hero { background:var(--indigo-900); background-image:var(--dot-texture);
  background-size:var(--dot-size); color:#F4F1EA; padding:20px 16px 26px;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
/* Dolny odstęp WIĘKSZY niż w okładce bez tytułu, bo karta wchodzi na okładkę
   ujemnym marginesem 14 px — przy 22 px ogon „ę" w „Sprawdź skrzynkę" wchodził
   pod krawędź karty. 34 − 14 = 20 px prześwitu, tyle co we wzorcu. */
.auth-hero--titled { padding:20px 16px 34px; }
.auth-hero--titled .auth-hero__brand-row { margin-bottom:16px; }
.auth-hero__brand { display:inline-flex; align-items:center; gap:9px; }
.auth-hero__logo { height:20px; width:auto; display:block; }
.auth-hero__product { font-family:var(--font-display); font-size:15px;
  font-weight:700; color:#F4F1EA; }
.auth-hero h2 { margin:0; font-family:var(--font-display); font-size:22px;
  font-weight:700; letter-spacing:-.02em; line-height:1.2; color:#F4F1EA; }

.auth-card { margin:-14px 0 0; background:#FBF9F5; border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:18px 16px; box-shadow:var(--shadow-md);
  display:grid; gap:16px; }
.auth-card form { display:grid; gap:12px; margin:0; }
.auth-lead { margin:0; font-size:15px; line-height:1.6; color:var(--ink-700); }
.auth-lead a { color:var(--indigo-700); font-weight:600; }

.auth-foot, .auth-links { display:flex; align-items:center; justify-content:center;
  gap:10px; margin:18px 0 0; padding:0 16px; font-size:13px; font-weight:600; }
.auth-links { margin:4px 0 0; padding:0; justify-content:flex-start; }
.auth-foot .sep, .auth-links .sep { color:var(--ink-300); }
/* Z-070 (N-93): wybór języka na ekranach wejścia i zgody (PL | EN). */
.auth-lang { display:flex; justify-content:center; gap:6px; margin-top:10px; }
.auth-lang__form { margin:0; }
.auth-lang__btn { background:none; border:1px solid var(--line); border-radius:2px; padding:4px 12px;
  font-size:13px; color:var(--ink-500); cursor:pointer; }
.auth-lang__btn.is-active { color:var(--ink-900); border-color:var(--ink-700); font-weight:600; }
/* Bez podkreślenia — we wzorcu linki wejścia niesie kolor i grubość, nie
   kreska. Podkreślenie wraca przy najechaniu i przy ogniskowaniu klawiaturą,
   żeby link dało się rozpoznać bez samego koloru. */
.link-quiet { color:var(--indigo-700); font-weight:600; text-decoration:none; }
.link-quiet:hover, .link-quiet:focus-visible { text-decoration:underline; }

/* Pola */
.field-email { display:flex; align-items:center; gap:9px; height:46px;
  padding:0 12px; border:1px solid var(--line); border-radius:var(--radius-md);
  background:#FBF9F5; }
.field-email:focus-within { border-color:var(--blue-500); box-shadow:var(--focus-ring); }
.field-email svg { width:16px; height:16px; flex:none; color:var(--ink-500); }
.field-email input { flex:1; min-width:0; border:0; padding:0; height:auto;
  background:none; font-size:15px; color:var(--ink-900); box-shadow:none; }
.field-email input:focus { outline:none; box-shadow:none; }
.code-label { font-family:var(--font-display); font-size:11px; font-weight:700;
  letter-spacing:var(--tracking-caps); text-transform:uppercase;
  color:var(--ink-500); margin:0; }
/* Kod jako CZTERY pola po 58 px (wzorzec 8c), nie jedno z rozstrzelonymi
   znakami. Powód jest użytkowy, nie estetyczny: kod przepisuje się z maila
   na telefonie, a osobne pola pokazują wprost, ile znaków zostało, i nie
   pozwalają zgubić się w środku. */
.code-boxes { display:flex; gap:10px; }
.code-box { flex:1; min-width:0; height:58px; padding:0; text-align:center;
  font-family:var(--font-display); font-size:26px; font-weight:700;
  font-variant-numeric:tabular-nums; color:var(--ink-900);
  border:1px solid var(--line); border-radius:var(--radius-md); background:#FBF9F5; }
.code-box:focus { outline:none; border-color:var(--blue-500);
  box-shadow:var(--focus-ring); }

/* Przyciski */
.btn-primary { display:flex; align-items:center; justify-content:center;
  width:100%; height:48px; background:var(--indigo-700); color:#F4F1EA; border:0;
  border-radius:var(--radius-pill); font-family:var(--font-body); font-size:15px;
  font-weight:600; cursor:pointer; }
.btn-primary:hover { background:var(--indigo-600); }
.btn-primary--inline { width:fit-content; height:auto; padding:14px 24px; }
.btn-secondary { display:flex; align-items:center; justify-content:center;
  width:100%; height:48px; border-radius:var(--radius-pill);
  background:var(--ink-50); border:1px solid var(--line); color:var(--ink-400);
  font-size:15px; font-weight:600; }
.btn-secondary:not(:disabled) { color:var(--indigo-700); cursor:pointer; }

/* Komunikat błędu */
.alert-error { display:flex; align-items:flex-start; gap:10px; margin:0;
  padding:12px 14px; background:var(--danger-bg); border:1px solid var(--maroon-200);
  border-radius:var(--radius-md); font-size:14px; line-height:1.5;
  color:var(--maroon-500); }
.alert-error svg { width:17px; height:17px; flex:none; margin-top:1px; }
.alert-error[hidden], .err[hidden] { display:none; }

/* Zgoda na Regulamin */
.consent-box { display:grid; grid-template-columns:auto 1fr; gap:12px;
  align-items:start; padding:14px; border:1px solid var(--ink-300);
  border-radius:var(--radius-md); background:var(--ink-50); font-size:14px;
  line-height:1.55; color:var(--ink-900); cursor:pointer; }
.consent-box input[type="checkbox"] { width:22px; height:22px; margin:0;
  accent-color:var(--indigo-700); }
.consent-terms-link { margin:0; font-size:13px; font-weight:600; }
.consent-terms-link a { color:var(--indigo-700); }
.consent-rodo { margin:0; font-size:12px; line-height:1.6; color:var(--ink-500); }
.consent-rodo a { color:var(--indigo-700); font-weight:500; }
.consent-footer { display:flex; align-items:center; gap:10px; padding-top:14px;
  border-top:1px solid var(--ink-100); }
.consent-footer .who { flex:1; font-size:12px; color:var(--ink-500); }
.consent-footer form { margin:0; }
.consent-footer .reject { background:none; border:0; padding:0; min-height:auto;
  font-size:13px; font-weight:600; color:var(--maroon-500); cursor:pointer; }

@media (min-width:768px) {
  .auth-shell { align-items:center; padding:24px; }
  .auth-panel { width:460px; margin:0; background:#FBF9F5;
    border:1px solid var(--line); border-radius:0; overflow:hidden;
    box-shadow:var(--shadow-lg); }
  .auth-panel--terms { width:620px; }
  .auth-panel--rejected { width:520px; }
  .auth-hero { border-radius:0; padding:22px 26px 24px; }
  .auth-hero--titled { padding:22px 26px 22px; }
  .auth-hero__logo { height:22px; }
  .auth-hero__brand { gap:10px; }
  .auth-hero__product { font-size:16px; }
  .auth-hero h2 { font-size:24px; }
  .auth-card { margin:0; border:0; border-radius:0; box-shadow:none;
    padding:24px 26px 26px; gap:18px; }
  .auth-lead { font-size:15px; }
  .field-email { height:50px; padding:0 14px; gap:10px; }
  .field-email svg { width:17px; height:17px; }
  .code-box { height:66px; font-size:30px; }
  .code-boxes { gap:12px; }
  .btn-primary, .btn-secondary { height:50px; }
  .alert-error { padding:14px 16px; gap:11px; font-size:15px; }
  .alert-error svg { width:18px; height:18px; }
  .consent-box { gap:14px; padding:16px 18px; font-size:15px; line-height:1.6; }
  .consent-box input[type="checkbox"] { width:24px; height:24px; }
  .consent-terms-link, .consent-footer .reject, .link-quiet { font-size:14px; }
  .consent-rodo { font-size:13px; line-height:1.7; }
  .consent-footer { gap:12px; padding-top:16px; }
  .consent-footer .who { font-size:13px; }
  .auth-foot { margin-top:18px; }
}

/* ══ RADAR — nowy układ zakładki (wzorzec 3a / d3) ═══════════════════
   Wszystko pod `.p-portal`, bo `.sig`, `.badge`, `.btn-want` i `.kind-head`
   dzieli z panelem zespołu. Bez tego prefiksu ta warstwa
   przemalowuje radar admina — dokładnie ten błąd cofnięto 18.08.
   Zakres celowo wąski: reguły dotyczą TYLKO ekranów portalu klienta. */

/* ── Nagłówek grupy: numer w kwadracie, nazwa, linia ── */
.p-portal .kind-head { display:flex; align-items:center; gap:10px;
  margin:22px 0 10px; font-size:inherit; text-transform:none; letter-spacing:0; }
.p-portal .kind-nr { flex:none; min-width:24px; height:20px; padding:0 6px;
  display:grid; place-items:center; border-radius:var(--radius-xs);
  background:var(--indigo-100); color:var(--indigo-700);
  font-family:var(--font-display); font-size:11px; font-weight:700;
  font-variant-numeric:tabular-nums; }
.p-portal .kind-head h2 { margin:0; font-family:var(--font-display);
  font-size:17px; font-weight:700; letter-spacing:-.01em; color:var(--ink-900); }
/* Linia dociąga nagłówek do prawej krawędzi — bez niej numer i nazwa wiszą. */
.p-portal .kind-head::after { content:""; flex:1; height:1px;
  background:var(--line); }

/* ── Sygnały grupy w JEDNEJ karcie, rozdzielone liniami ── */
.p-portal .sig-grupa { background:#FBF9F5; border:1px solid var(--line);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-xs); overflow:hidden; }
.p-portal .sig-grupa .sig { border:0; border-radius:0; box-shadow:none;
  margin:0; padding:14px 16px; }
.p-portal .sig-grupa .sig + .sig { border-top:1px solid var(--line); }

/* ── Alert: biała karta z paskiem pomarańczu, nie pomarańczowe tło ── */
.p-portal .sig-alert { background:#FBF9F5; border-color:var(--line);
  border-radius:var(--radius-lg); overflow:hidden; }
.p-portal .sig-alert::before { content:""; position:absolute; inset:0 0 auto 0;
  height:4px; background:var(--orange-500); }
.p-portal .sig-alert .sig-head { margin-top:6px; }
.p-portal .sig-flag { display:inline-flex; align-items:center; gap:5px;
  padding:4px 9px; border-radius:var(--radius-pill);
  background:var(--orange-100); color:var(--orange-600); }

/* ── Plakietka źródła: wersaliki w obrysie indygo ── */
.p-portal .sig .badge { font-family:var(--font-display); font-size:10px;
  font-weight:700; letter-spacing:var(--tracking-caps); text-transform:uppercase;
  color:var(--indigo-700); background:var(--indigo-50);
  border:1px solid var(--indigo-100); }

/* ── Akcja, która coś WYSYŁA, jest zielona (zasada systemu) ── */
.p-portal .btn-want { color:var(--success-700); border-color:var(--success-700);
  border-radius:var(--radius-pill); background:#FBF9F5; font-weight:600; }
.p-portal .btn-want:hover { background:var(--success-bg); }

@media (min-width:768px) {
  .p-portal .kind-head h2 { font-size:19px; }
}

/* ══ WYWIAD — brief tygodniowy (wzorzec 2a) ══════════════════════════
   Wzorzec zdejmuje z pozycji kolorowe tło i listwę, a kierunek niesie
   KROPKA przy nazwie grupy plus numer w kwadracie. Powód jest czytelniczy:
   przy pięciu pozycjach dwa bloki kolorowego tła zabijały hierarchię —
   oko widziało pasy, nie treść. Wszystko pod `.p-portal`. */

/* Nazwa grupy z kropką: „● IDŹ W TO", „● CZEGO UNIKAĆ" */
.p-portal .wyw-dir { display:flex; align-items:center; gap:7px;
  margin:16px 0 6px; font-family:var(--font-display); font-size:10px;
  font-weight:700; letter-spacing:var(--tracking-caps); }
.p-portal .wyw-dir::before { content:""; width:7px; height:7px; flex:none;
  border-radius:2px; background:currentColor; }
.p-portal .wyw-dir-idz { color:var(--success-700); }
.p-portal .wyw-dir-unikaj { color:var(--maroon-500); }

/* Pozycja: bez tła i bez listwy, rozdzielona linią jak sygnały radaru. */
.p-portal .wyw-wniosek { border:0; border-radius:0; background:none;
  padding:12px 0; margin:0; }
.p-portal .wyw-wniosek + .wyw-wniosek { border-top:1px solid var(--line); }
.p-portal .wyw-wniosek-idz,
.p-portal .wyw-wniosek-unikaj { border-left:0; background:none; }

/* Numer w kwadracie — ta sama forma co numer sekcji, o stopień mniejsza. */
.p-portal .wyw-wniosek-claim { display:flex; gap:10px; align-items:flex-start;
  font-family:var(--font-display); font-size:16px; font-weight:600;
  line-height:1.4; color:var(--ink-900); }
.p-portal .wyw-wniosek-nr { flex:none; min-width:22px; height:22px; margin:2px 0 0;
  display:grid; place-items:center; border-radius:var(--radius-xs);
  font-size:11px; font-weight:700; font-variant-numeric:tabular-nums; }
.p-portal .wyw-wniosek-idz .wyw-wniosek-nr { background:var(--success-bg);
  color:var(--success-700); }
.p-portal .wyw-wniosek-unikaj .wyw-wniosek-nr { background:var(--maroon-100);
  color:var(--maroon-500); }

/* Akcja i „Dlaczego" w jednym wierszu (wzorzec): decyzja i uzasadnienie
   stoją obok siebie, zamiast rozpychać kartę na dwa piętra. */
.p-portal .wyw-akcja { display:flex; align-items:center; gap:12px;
  flex-wrap:wrap; margin-top:10px; }
.p-portal .wyw-akcja .btn-want { display:inline-flex; align-items:center; }
/* Pierwsza pozycja „idź w to" niesie akcję WYPEŁNIONĄ — w briefie jest
   jedna rzecz najważniejsza i ma być widać którą. */
.p-portal .wyw-wniosek-idz:first-of-type .wyw-akcja .btn-want {
  background:var(--success-700); border-color:var(--success-700); color:#F4F1EA; }
.p-portal .wyw-wniosek-idz:first-of-type .wyw-akcja .btn-want:hover {
  background:var(--success-bg); color:var(--success-700); }

/* Rozwinięte „Dlaczego" bierze cały wiersz — w wąskiej kolumnie obok
   przycisku uzasadnienie łamałoby się po dwa słowa. */
.p-portal .wyw-akcja .wyw-why { margin:0; }
.p-portal .wyw-akcja .wyw-why[open] { flex-basis:100%; }
.p-portal .wyw-akcja .wyw-why > summary { font-size:13px; font-weight:600;
  color:var(--ink-600); }

/* ══ WYWIAD — poprawki po przekliknięciu (Paweł 19.08) ═══════════════ */

/* Kotwica pigułek (#dowody) i karty: zatrzymać się POD paskiem. Wysokość
   zwiniętego pasa wpisuje skrypt; 110 px to zapas na wypadek jego braku
   (wcześniej stało tu 74 px pod stary, niski topbar — treść wjeżdżała pod
   okładkę przy Liczbach, Terminach i Mechanizmach). */
.p-portal #dowody,
.p-portal .sig,
.p-portal .post,
.p-portal .wyw-sec { scroll-margin-top:calc(var(--okladka-zwinieta, 110px) + 14px); }

/* „Na horyzoncie": chip daty i tekst na jednej linii bazowej. Chip miał
   własny rytm i wisiał kilka pikseli nad pierwszym wierszem. */
.p-portal .wyw-term { display:flex; align-items:flex-start; gap:12px; }
.p-portal .wyw-term-chip { flex:none; margin-top:1px; }
.p-portal .wyw-term-body { flex:1; min-width:0; }

/* Plakietka aktora NAD treścią, nie wewnątrz zdania. Wpleciona w tekst
   rozbijała zdanie w losowym miejscu — przy dwóch plakietkach robił się
   bałagan (uwaga Pawła). */
.p-portal .wyw-term-body .wyw-claim { display:flex; flex-direction:column;
  align-items:flex-start; gap:6px; }
.p-portal .wyw-term-body .wyw-claim .badge { order:-1; }

/* Sekcja „Profile i dane" ma STAŁE zaczepienie przy przełączaniu pigułek.
   Problem (Paweł 19.08): każdy widok ma inną długość, a skok do kotwicy
   #dowody udaje się tylko wtedy, gdy POD nią zostało dość miejsca do
   przewinięcia. Przy krótkim widoku (Liczby, Terminy) przeglądarka nie ma
   dokąd przewinąć, więc sekcja ląduje raz u góry, raz w połowie ekranu —
   i to jest to „ściąganie w dół" i skakanie.

   Minimalna wysokość na jeden ekran gwarantuje, że kotwica ZAWSZE dojdzie
   do góry, niezależnie od tego, ile pozycji ma dany widok. Odejmujemy
   zwinięty pasek i dolną nawigację, żeby nie robić zbędnego przewijania. */
/* Zapas NA KOŃCU STRONY, nie w sekcji. Wcześniej stało tu
   `min-height:100vh` na #dowody i owszem, kotwica dochodziła do góry — ale
   przy krótkim widoku (Konkurenci, Liczby) robiła się ogromna pusta dziura
   między pigułkami a kartami. Ten sam efekt daje przewijalny zapas pod
   treścią: kotwica ma dokąd doskoczyć, a pustka ląduje pod ostatnią kartą,
   gdzie czyta się jak zwykły margines. */
.p-portal .feed.wyw { padding-bottom:70vh; }

/* ══ KALENDARZ — tydzień jako jedna karta (wzorzec 4a) ═══════════════
   Zamiast siedmiu ramek jedna pod drugą: jedna karta, dni rozdzielone
   liniami. Dzień bez postów to JEDNA linijka „Wolne" z akcjami — cztery
   puste dni zajmują tyle, co wcześniej jeden. Wszystko pod `.p-portal`. */
.p-portal .week { display:block; background:#FBF9F5; border:1px solid var(--line);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-xs); overflow:hidden; }
.p-portal .wdzien { display:block; padding:12px 14px; }
.p-portal .wdzien + .wdzien { border-top:1px solid var(--line); }
/* Dzień pusty ma niższy rytm — to jest cała jego treść. */
.p-portal .wdzien.is-pusty { padding:8px 14px; }

.p-portal .wdzien-head { display:flex; align-items:center; gap:10px;
  flex-wrap:wrap; }
/* Data w kwadracie: skrót dnia nad numerem, jak w kalendarzu papierowym. */
.p-portal .wdzien-data { flex:none; display:flex; flex-direction:column;
  align-items:center; justify-content:center; width:34px; padding:3px 0;
  border-radius:var(--radius-sm); background:var(--ink-50);
  color:var(--ink-600); text-decoration:none; line-height:1.1; }
.p-portal .wdzien-wd { font-family:var(--font-display); font-size:8px;
  font-weight:700; letter-spacing:var(--tracking-caps); }
.p-portal .wdzien-dnum { font-family:var(--font-display); font-size:15px;
  font-weight:700; font-variant-numeric:tabular-nums; }
/* Dziś: ta sama forma, kolor marki — bez dodatkowego napisu w kwadracie. */
.p-portal .wdzien.is-today .wdzien-data { background:var(--indigo-700); color:#F4F1EA; }

.p-portal .wdzien-nazwa { font-family:var(--font-display); font-size:15px;
  font-weight:700; color:var(--ink-900); text-decoration:none; }
.p-portal .wdzien.is-pusty .wdzien-nazwa { font-weight:600;
  color:var(--ink-600); }
.p-portal .wdzien-wolne { color:var(--ink-400); font-size:14px; }
/* Licznik i akcje trzymają się prawej krawędzi. */
.p-portal .wdzien-licznik { margin-left:auto; font-size:12px;
  color:var(--ink-500); }
.p-portal .wdzien-akcje { margin-left:auto; display:flex; gap:8px;
  flex-wrap:wrap; }
.p-portal .wdzien-akcje-dol { margin:10px 0 0; }
.p-portal .wdzien-act { padding:5px 11px; border:1px solid var(--success-700);
  border-radius:var(--radius-pill); background:#FBF9F5; color:var(--success-700);
  font-size:12px; font-weight:600; text-decoration:none; white-space:nowrap; }
.p-portal .wdzien-act:hover { background:var(--success-bg); }

/* Posty dnia: zwięzłe karty, kanał + skrót treści. */
.p-portal .wdzien .wcol-posts { display:grid; gap:8px; margin:10px 0 0; }
.p-portal .wdzien .wpost { display:block; padding:10px 12px;
  border:1px solid var(--line); border-radius:var(--radius-md);
  background:var(--ink-50); text-decoration:none; }
.p-portal .wdzien .wpost-top { display:flex; align-items:center; gap:6px;
  margin-bottom:5px; }
.p-portal .wdzien .wpost-snip { display:block; font-size:14px; line-height:1.45;
  color:var(--ink-900); }
.p-portal .wdzien .wpost-time { font-size:11px; color:var(--ink-500); }
.p-portal .wdzien .prov-dot { margin-left:auto; }

/* Dzień pusty NIE pokazuje pełnej nazwy — niesie ją kwadrat z datą (PON 17).
   Wzorzec też jej tam nie ma i to nie jest przypadek: „Poniedziałek" plus
   „Wolne" plus dwie akcje nie mieszczą się w jednej linii na 375 px
   i akcje spadały do drugiego wiersza, czyli pusty dzień znowu rósł. */
.p-portal .wdzien.is-pusty .wdzien-nazwa { display:none; }

/* Kalendarz trzyma TĘ SAMĄ kolumnę co radar i Wywiad (1040 px). Wcześniej
   `.weekwrap` miał 1200, a pas okładki 1040 — treść i pasek zaczynały się
   w innych miejscach i przy przełączaniu zakładek wszystko przeskakiwało
   w bok (zgłosił Paweł). Kolumna 1200 miała sens przy siedmiu kolumnach
   tygodnia; do listy dni jest za szeroka, a kolumny i tak dostaną własną
   szerokość w porcji o układzie poziomym. */
.p-portal .weekwrap { max-width:1040px; }

/* Miejsce na pionowy pasek przewijania rezerwowane ZAWSZE, także gdy strona
   jest krótka. Bez tego strona długa (radar, Wywiad) ma pasek i jest o ~15 px
   węższa niż krótka (kalendarz z pustym tygodniem), a że treść jest
   wyśrodkowana, przy przełączaniu zakładek przesuwała się o połowę tej
   różnicy w bok. Zgłoszone przez Pawła i przez niego trafnie zdiagnozowane.

   Reguła jest globalna, nie pod `.p-portal`: to samo dotyczy panelu zespołu,
   a rezerwacja miejsca niczego nie przemalowuje — nie ma tu ryzyka, przed
   którym chroni zakresowanie. */
html { scrollbar-gutter: stable; }

/* ══ KALENDARZ — dwa układy z JEDNEGO HTML-a ═════════════════════════
   „kolumny" = dni obok siebie, „lista" = dni jeden pod drugim. Przełączane
   wyłącznie arkuszem, bez drugiego zestawu kart w drzewie. Powód nie jest
   estetyczny: przy dwóch kopiach każdy post miałby dwa razy ten sam
   `data-id` i `data-move-url`, a drag-and-drop (produkcja od 30.07)
   trafiałby w niewłaściwą kopię. Jeden HTML = te same zaczepienia. */
.p-portal .weekwrap.uklad-kolumny .week { display:grid; grid-auto-flow:column;
  grid-auto-columns:minmax(170px, 1fr); overflow-x:auto; align-items:start;
  -webkit-overflow-scrolling:touch; }
.p-portal .weekwrap.uklad-kolumny .wdzien { padding:10px 10px 12px; }
.p-portal .weekwrap.uklad-kolumny .wdzien + .wdzien { border-top:0;
  border-left:1px solid var(--line); }
/* W kolumnie nagłówek dnia układa się pionowo, a akcje schodzą pod posty. */
.p-portal .weekwrap.uklad-kolumny .wdzien-head { flex-direction:column;
  align-items:flex-start; gap:6px; }
.p-portal .weekwrap.uklad-kolumny .wdzien-licznik,
.p-portal .weekwrap.uklad-kolumny .wdzien-akcje { margin-left:0; }
.p-portal .weekwrap.uklad-kolumny .wdzien.is-pusty .wdzien-nazwa { display:block; }
.p-portal .weekwrap.uklad-kolumny .wdzien-act { font-size:11px; padding:4px 9px; }

/* Telefon i wąski ekran (do 767 px): tydzień ZAWSZE jako lista, niezależnie od zapisanego wyboru (Z-114, projekt
   właściciela 30.09: przełącznik Kolumny/Lista znika z telefonu — naglowek.css — a obrót ekranu niczego nie
   przełącza; wcześniej N-94 dawał dni obok siebie przy telefonie poziomo). Selektory z `.uklad-kolumny`, czyli
   o tej samej specyficzności co reguły „kolumn” wyżej — ten blok stoi później, więc lista wygrywa. */
@media (max-width:767px) {
  .p-portal .weekwrap.uklad-kolumny .week { display:block; overflow-x:visible; }
  .p-portal .weekwrap.uklad-kolumny .wdzien { padding:12px 14px; }
  .p-portal .weekwrap.uklad-kolumny .wdzien.is-pusty { padding:8px 14px; }
  .p-portal .weekwrap.uklad-kolumny .wdzien + .wdzien { border-top:1px solid var(--line); border-left:0; }
  .p-portal .weekwrap.uklad-kolumny .wdzien-head { flex-direction:row; align-items:center; gap:10px; }
  .p-portal .weekwrap.uklad-kolumny .wdzien-head .wdzien-licznik,
  .p-portal .weekwrap.uklad-kolumny .wdzien-head .wdzien-akcje { margin-left:auto; }
  .p-portal .weekwrap.uklad-kolumny .wdzien.is-pusty .wdzien-nazwa { display:none; }
  .p-portal .weekwrap.uklad-kolumny .wdzien-act { font-size:12px; padding:5px 11px; }
}

/* Kolumny biorą CAŁĄ szerokość ekranu, lista zostaje w kolumnie 1040 px.
   Zwężenie `.weekwrap` do 1040 zrobiłem, żeby zgrać treść z paskiem — i dla
   listy jest dobre, ale siedem kolumn się w tym nie mieści i dostawało
   poziomy pasek przesuwania (zgłosił Paweł). Tydzień jest artefaktem
   szerokim z natury: siedem dni ma się zmieścić bez przewijania, tak jak
   w starym widoku. Pasek marki zostaje na swoim 1040 — jest zamknięty. */
@media (min-width:768px) {
  .p-portal .weekwrap.uklad-kolumny { max-width:none; padding-left:24px;
    padding-right:24px; }
  /* `repeat(7, minmax(0,1fr))` zamiast auto-flow: siedem równych kolumn
     dzielących dostępną szerokość, bez minimum, czyli bez przewijania. */
  .p-portal .weekwrap.uklad-kolumny .week { grid-auto-flow:row;
    grid-template-columns:repeat(7, minmax(0, 1fr)); overflow-x:visible; }
  /* Kolumna dostaje wysokość, żeby pusty dzień nie był paskiem — w starym
     widoku to właśnie dawało kalendarzowi czytelną siatkę. */
  .p-portal .weekwrap.uklad-kolumny .wdzien { min-height:190px; min-width:0; }
  /* Tor bez minimum oznacza, że treść dnia też musi się mieścić w torze:
     karta posta nie rośnie ponad kolumnę, a długie słowo (adres, hasztag)
     się łamie, zamiast wjeżdżać na sąsiedni dzień. */
  .p-portal .weekwrap.uklad-kolumny .wcol-posts { grid-template-columns:minmax(0, 1fr); }
  .p-portal .weekwrap.uklad-kolumny .wpost { min-width:0; }
  .p-portal .weekwrap.uklad-kolumny .wpost-top { flex-wrap:wrap; }
  /* Dywiz tam, gdzie przeglądarka ma słownik (lang="pl"); bez słownika
     długie słowo i tak się łamie — overflow-wrap. */
  .p-portal .weekwrap.uklad-kolumny .wpost-snip { overflow-wrap:anywhere; hyphens:auto; }
}

/* Krótka etykieta akcji pod postami — domyślnie ukryta (patrz week.html). */
.p-portal .act-krotka { display:none; }

/* Wąskie kolumny: 768–1199 px (laptop z oknem na pół ekranu, tablet
   poziomo). Siedem kolumn bez przewijania daje tu 90–160 px na dzień, a
   „+ dodaj własny post" ma 123 px i „Poniedziałek" pogrubionym 15 px
   ok. 95 px — wszystko to wychodziło na sąsiedni dzień (zgłosił właściciel
   przy próbie Z-070, 881 px). Warunek spłaszczony (`and`), jak wyżej. */
@media (min-width:768px) and (max-width:1199px) {
  .p-portal .weekwrap.uklad-kolumny .wdzien { padding:10px 7px 12px; }
  .p-portal .weekwrap.uklad-kolumny .wdzien-nazwa { font-size:13px; }
  .p-portal .weekwrap.uklad-kolumny .wpost { padding:8px; }
  .p-portal .weekwrap.uklad-kolumny .wpost-snip { font-size:13px; }
  .p-portal .weekwrap.uklad-kolumny .act-pelna { display:none; }
  .p-portal .weekwrap.uklad-kolumny .act-krotka { display:inline; }
}

/* ══ WYWIAD — oznaczenia kolorem na kartach (v12) ═════════════════════
   Po co: zakładkę czyta kilka osób po stronie klienta, a szef potrzebuje
   powiedzieć „tym się zajmij" bez wychodzenia do maila. Ten sam gest, co
   w radarze i kalendarzu — strzałka w rogu, cztery barwy, znaczenia nie
   narzucamy. Wszystko pod `.p-portal`: `.sig` dzielimy z panelem zespołu.

   Karty `.sig` (terminy, liczby, wyniki) maluje reguła wspólna z radarem
   (`.sig[data-tag]`), więc tutaj domalowujemy TYLKO te bez chromu: pozycję
   briefu, wpis osi czasu i outlook. Kolory idą przez zmienne, żeby jedna
   reguła malowania obsłużyła trzy różne kształty kart. */

.p-portal .oznaczalna { position:relative; }

/* Miejsce na strzałkę: pierwszy wiersz karty nie ma pod nią wjeżdżać. */
.p-portal .wyw-wniosek-claim,
.p-portal .wyw-num .wyw-num-value,
.p-portal .sig > .wyw-date { padding-right:30px; }
.p-portal .wyw-term-body { padding-right:26px; }
.p-portal .wyw-tl-item { padding-right:30px; }
.p-portal .wyw-outlook { padding-right:34px; }

/* Karty bez własnego marginesu wewnętrznego trzymają strzałkę przy krawędzi
   treści, nie 10 px w środku — inaczej wisi nad tekstem. */
.p-portal .wyw-wniosek > .tagpick { top:8px; right:0; }
.p-portal .wyw-tl-item > .tagpick { top:-3px; right:0; }
.p-portal .wyw-outlook > .tagpick { top:4px; right:4px; }

.p-portal .oznaczalna[data-tag="amber"] { --tag-bg:var(--tag-amber-bg); --tag-line:var(--tag-amber-line); }
.p-portal .oznaczalna[data-tag="sage"]  { --tag-bg:var(--tag-sage-bg);  --tag-line:var(--tag-sage-line); }
.p-portal .oznaczalna[data-tag="azure"] { --tag-bg:var(--tag-azure-bg); --tag-line:var(--tag-azure-line); }
.p-portal .oznaczalna[data-tag="plum"]  { --tag-bg:var(--tag-plum-bg);  --tag-line:var(--tag-plum-line); }

/* Tint + listwa 3 px (język systemu). Ujemny margines z równym paddingiem:
   tło rozlewa się poza kolumnę treści, ale TEKST zostaje dokładnie tam,
   gdzie stał — oznaczenie nie przesuwa listy w poziomie. */
.p-portal .wyw-wniosek[data-tag],
.p-portal .wyw-tl-item[data-tag] { background:var(--tag-bg);
  box-shadow:inset 3px 0 0 var(--tag-line); border-radius:var(--radius-sm); }
.p-portal .wyw-wniosek[data-tag] { margin-inline:-12px; padding-inline:12px; }
.p-portal .wyw-tl-item[data-tag] { margin-left:-10px; padding-left:10px; }
/* Kropka osi czasu wisi na lewej krawędzi WPISU, więc po poszerzeniu bloku
   o 10 px musi zjechać o tyle samo, żeby nadal siedziała na linii. */
.p-portal .wyw-tl-item[data-tag]::before { left:-13px; }
/* Outlook ma własną listwę (indygo) — podmieniamy jej kolor zamiast dokładać
   drugą, inaczej blok dostałby dwie kreski jedna na drugiej. */
.p-portal .wyw-outlook[data-tag] { background:var(--tag-bg);
  border-left-color:var(--tag-line); }

/* Kropki w nagłówku profilu: co jest oznaczone w środku zwiniętej karty.
   Pusty kontener (nic nieoznaczonego) znika — stoi w HTML-u zawsze, bo
   dopisuje do niego skrypt po zapisie w tle. */
.p-portal .wyw-actor-dots { display:inline-flex; align-items:center; gap:3px;
  flex:none; }
.p-portal .wyw-actor-dots:empty { display:none; }
.p-portal .wyw-actor-dots i { width:8px; height:8px; border-radius:0;
  border:1px solid rgba(17,19,22,.14); }
.p-portal .wyw-actor-dots .dot-amber { background:var(--tag-amber-dot); }
.p-portal .wyw-actor-dots .dot-sage  { background:var(--tag-sage-dot); }
.p-portal .wyw-actor-dots .dot-azure { background:var(--tag-azure-dot); }
.p-portal .wyw-actor-dots .dot-plum  { background:var(--tag-plum-dot); }

/* ══ EKRANY DODAWANIA — „Nowy post" i „Zamów post" (wzorce 5a–5d) ═════
   Zasada z obu wzorców: na wejściu widać TYLKO to, co trzeba wypełnić.
   Reszta (godzina, plik, kolor / dzień, załącznik) siedzi pod jednym
   wierszem „Więcej opcji" i rozwija się przez `details`, czyli działa bez
   JS-a. Wszystko pod `.p-portal` — `button`, `select`, `input` i pola
   dzielimy z panelem zespołu, którego ta warstwa nie ma prawa przemalować. */

/* ── Karta formularza ── */
.p-portal .karta-form { background:#FBF9F5; border:1px solid var(--line);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-sm);
  padding:18px 16px; display:grid; gap:14px; }
.p-portal .pole { display:grid; gap:7px; }
.p-portal .pole-etykieta { font-family:var(--font-display); font-size:10px;
  font-weight:700; letter-spacing:var(--tracking-caps); text-transform:uppercase;
  color:var(--ink-500); }
.p-portal .karta-form select,
.p-portal .karta-form input[type="date"],
.p-portal .karta-form input[type="time"] { height:48px;
  border-radius:var(--radius-md); border:1px solid var(--line); font-size:15px; }
.p-portal .karta-form textarea { border-radius:var(--radius-md);
  border:1px solid var(--line); font-size:15px; line-height:1.55;
  padding:12px 14px; }

/* Licznik znaków pod polem — prawa krawędź, drobno, bez krzyku. */
.p-portal .licznik { margin:-6px 0 0; text-align:right; font-size:12px;
  color:var(--ink-500); font-variant-numeric:tabular-nums; }
.p-portal .licznik.is-ok { color:var(--success-700); font-weight:600; }

/* ── „Więcej opcji" ── */
.p-portal .wiecej { border:1px solid var(--line); border-radius:var(--radius-md);
  background:var(--ink-50); }
.p-portal .wiecej > summary { list-style:none; cursor:pointer; display:flex;
  align-items:center; gap:12px; padding:11px 14px; }
.p-portal .wiecej > summary::-webkit-details-marker { display:none; }
.p-portal .wiecej > summary::marker { content:""; }
.p-portal .wiecej-tekst { display:grid; gap:2px; flex:1; min-width:0; }
.p-portal .wiecej-tytul { font-family:var(--font-display); font-size:14px;
  font-weight:600; color:var(--indigo-900); }
.p-portal .wiecej-hint { font-size:12px; color:var(--ink-500); }
.p-portal .wiecej-strzalka { flex:none; color:var(--ink-500); font-size:14px;
  transition:transform .15s ease; }
.p-portal .wiecej[open] .wiecej-strzalka { transform:rotate(180deg); }
.p-portal .wiecej-tresc { display:grid; gap:14px; padding:2px 14px 14px; }

/* ── Wybór pliku ── */
/* `position:relative` nie jest ozdobą: ukryte pole pliku leży bezwzględnie,
   więc bez tego zaczepiłoby się o pierwszy pozycjonowany element wyżej. */
.p-portal .plik { position:relative; display:flex; align-items:center; gap:12px;
  cursor:pointer; padding:10px 12px; border:1px solid var(--line);
  border-radius:var(--radius-md); background:#FBF9F5; }
.p-portal .plik:hover { border-color:var(--ink-300); }
/* Natywne pole zostaje w układzie (klawiatura, czytniki ekranu), tylko go
   nie widać — klikalna jest cała ramka, bo to `label`. */
.p-portal .plik input[type="file"] { position:absolute; width:1px; height:1px;
  opacity:0; pointer-events:none; }
.p-portal .plik-ikona { flex:none; width:34px; height:34px; display:grid;
  place-items:center; border-radius:var(--radius-sm); background:var(--ink-100);
  color:var(--ink-700); font-size:15px; }
.p-portal .plik-tekst { display:grid; gap:1px; font-size:14px; }
.p-portal .plik-tekst strong { font-weight:600; color:var(--text-link); }
.p-portal .plik-tekst .muted { font-size:12px; }
.p-portal .plik-lista { margin:0; display:grid; gap:6px; }
.p-portal .plik-chip { display:flex; align-items:center; gap:8px;
  padding:8px 10px; border:1px solid var(--line);
  border-radius:var(--radius-sm); background:#FBF9F5; font-size:13px; }
.p-portal .plik-chip-nazwa { flex:1; min-width:0; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.p-portal .plik-chip-rozmiar { flex:none; color:var(--ink-500); font-size:12px; }
.p-portal .plik-chip-usun { flex:none; min-height:0; padding:2px 7px; border:0;
  background:none; color:var(--ink-500); font-size:16px; line-height:1; }
.p-portal .plik-chip-usun:hover { color:var(--maroon-500); background:none;
  filter:none; }
.p-portal .store-line { margin:0; font-size:12px; }

/* ── Kolor oznaczenia w formularzu (radio, więc działa bez JS-a) ── */
.p-portal .kolorki { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.p-portal .kolorek { position:relative; display:inline-flex; cursor:pointer; }
.p-portal .kolorek input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.p-portal .kolorek-kropka { width:30px; height:30px; border-radius:0;
  border:1px solid rgba(17,19,22,.14); display:block; }
.p-portal .kolorek input:checked + .kolorek-kropka {
  box-shadow:none; }
.p-portal .kolorek input:focus-visible + .kolorek-kropka {
  box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--indigo-700); }
.p-portal .kolorek-brak { position:relative; display:inline-flex;
  align-items:center; cursor:pointer; padding:7px 13px;
  border:1px solid var(--line); border-radius:var(--radius-pill);
  background:#FBF9F5; font-size:13px; color:var(--ink-700); }
.p-portal .kolorek-brak input { position:absolute; inset:0; opacity:0;
  cursor:pointer; }
.p-portal .kolorek-brak:has(input:checked) { border-color:var(--ink-700);
  color:var(--ink-900); font-weight:600; }

/* ── Przycisk główny: pełna szerokość, zielony gdy jest co wysłać ── */
.p-portal .btn-glowny { width:100%; min-height:52px; border:0;
  border-radius:var(--radius-pill); background:var(--success-700); color:#F4F1EA;
  font-family:var(--font-display); font-size:16px; font-weight:600; }
.p-portal .btn-glowny:hover { filter:brightness(1.07); }
.p-portal .btn-glowny:disabled { background:var(--ink-100); color:var(--ink-400);
  opacity:1; filter:none; }

/* ── Pasek drogi do progu w zamówieniu (wzorce 5c/5d) ── */
.p-portal .order-pasek { height:4px; border-radius:var(--radius-pill);
  background:var(--ink-100); overflow:hidden; margin-top:-6px; }
.p-portal .order-pasek-fill { display:block; height:100%; width:0;
  border-radius:var(--radius-pill); background:var(--ink-300);
  transition:width .15s ease; }
.p-portal .order-pasek-fill.is-ok { background:var(--success-700); }
.p-portal .order-count { margin:0; font-size:13px; line-height:1.5; }
.p-portal .order-licznik { margin:0; }

/* ── Kwit po wysłaniu zamówienia ── */
.p-portal .karta-kwit { justify-items:center; text-align:center;
  padding:28px 20px; }
.p-portal .kwit-ptaszek { margin:0; width:46px; height:46px; display:grid;
  place-items:center; border-radius:0; background:var(--success-bg);
  color:var(--success-700); font-size:22px; font-weight:700; }
.p-portal .karta-kwit h2 { margin:0; font-size:20px; }
.p-portal .karta-kwit p { margin:0; }

@media (min-width:768px) {
  /* Formularz nie rozlewa się na całą szerokość — czyta się go jak kartkę. */
  .p-portal .feed .karta-form { max-width:640px; padding:22px 20px; }
}

/* ══ WIDOK DNIA JAKO PLANER (wzorce 6a/6b, d2) ═══════════════════════
   Karta posta to jedyne miejsce w panelu, gdzie klient coś ROZSTRZYGA.
   Stąd cała robota tej porcji: jedna decyzja ma być widoczna, reszta
   (zapis roboczy, szczegóły, uwaga, usunięcie) schodzi o poziom niżej.
   Wszystko pod `.p-portal` — `.post`, `.badge` i `button` dzielimy
   z panelem zespołu. */

/* ── Karta ── */
.p-portal .day-posts .post,
.p-portal .feed > .day-split .post { border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm); padding:16px 14px; }
.p-portal .post-head { display:flex; align-items:center; gap:7px;
  flex-wrap:wrap; padding-right:34px; margin-bottom:12px; }
.p-portal .post-time { font-family:var(--font-display); font-size:12px;
  font-weight:700; color:var(--ink-500); font-variant-numeric:tabular-nums; }

/* Plakietki w jednym stroju: wersaliki, obrys, bez kolorowych plam.
   Kolor niesie TYLKO oznaczenie klienta i stan „zatwierdzone". */
.p-portal .post-head .badge,
.p-portal .post-head .status-pill,
.p-portal .post-head .prov-badge { display:inline-flex; align-items:center;
  height:22px; padding:0 9px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#FBF9F5;
  font-family:var(--font-display); font-size:9px; font-weight:700;
  letter-spacing:var(--tracking-caps); text-transform:uppercase;
  color:var(--ink-700); }
.p-portal .post-head .status-pill.appr { border-color:var(--success-700);
  color:var(--success-700); background:var(--success-bg); }
.p-portal .post-head .status-pill.pub { border-color:var(--ink-300);
  color:var(--ink-500); }
.p-portal .post-head .prov-badge.rev { border-color:var(--success-700);
  color:var(--success-700); background:var(--success-bg); }

/* ── Treść: pole edycji jako kartka w karcie ── */
.p-portal .post-text { border:1px solid var(--line);
  border-radius:var(--radius-md); padding:14px; font-size:15px;
  line-height:1.6; background:#FBF9F5; }

/* ── Wiersz decyzji ── */
.p-portal .post-actions { display:flex; flex-wrap:wrap; align-items:center;
  gap:8px; margin-top:12px; }
.p-portal .post-actions .btn-ghost,
.p-portal .post-actions .btn-copy { min-height:40px; padding:0 16px;
  border-radius:var(--radius-pill); border:1px solid var(--line);
  background:#FBF9F5; color:var(--ink-900); font-family:var(--font-display);
  font-size:14px; font-weight:600; }
.p-portal .post-actions .btn-ghost:hover,
.p-portal .post-actions .btn-copy:hover { border-color:var(--ink-700);
  filter:none; }
.p-portal .post-actions .btn-copy.copied { border-color:var(--success-700);
  background:var(--success-bg); color:var(--success-700); }
/* Decyzja bierze CAŁY wiersz: przy trzech przyciskach w rzędzie oko nie
   wiedziało, który jest tym jednym ważnym (wzorzec 6a stawia go osobno). */
.p-portal .post-actions .btn-decyzja { flex:1 0 100%; min-height:46px;
  border:0; border-radius:var(--radius-pill); background:var(--success-700);
  color:#F4F1EA; font-family:var(--font-display); font-size:15px;
  font-weight:600; }
.p-portal .post-actions .btn-decyzja:hover { filter:brightness(1.07); }
.p-portal .post-why { margin:9px 0 0; font-size:12px; line-height:1.5;
  color:var(--ink-500); }
.p-portal .status-form { margin-top:10px; }
.p-portal .status-form .btn-ghost { min-height:40px; padding:0 16px;
  border-radius:var(--radius-pill); border:1px solid var(--line);
  background:#FBF9F5; color:var(--ink-900); font-family:var(--font-display);
  font-size:14px; font-weight:600; }

/* ── Zwijane sekcje karty: ten sam strój, co „Więcej opcji" w formularzach ── */
.p-portal .post .wiecej { margin-top:10px; }
.p-portal .post .wiecej > summary { padding:11px 13px; }
.p-portal .post .details-form,
.p-portal .post .note-form { padding:0 13px 13px; display:grid; gap:10px; }
.p-portal .post .note-form { grid-template-columns:1fr auto; align-items:center; }
.p-portal .post .note-input { height:44px; border-radius:var(--radius-md);
  border:1px solid var(--line); }
.p-portal .post .note-form .btn-ghost { min-height:44px; padding:0 18px;
  border-radius:var(--radius-pill); border:1px solid var(--line);
  background:#FBF9F5; color:var(--ink-900); font-weight:600; }
.p-portal .post .details-hint { margin:0; font-size:12px; }
.p-portal .post .details-form .btn-ghost { justify-self:start; min-height:44px;
  padding:0 18px; border-radius:var(--radius-pill); border:1px solid var(--line);
  background:#FBF9F5; color:var(--ink-900); font-weight:600; }

/* Usunięcie posta zostaje najniżej i najciszej — to jedyna akcja
   nieodwracalna z punktu widzenia klienta. */
.p-portal .post-remove { margin-top:12px; }
.p-portal .post-remove .link.danger { font-size:13px; color:var(--maroon-500); }

/* ── Lista dnia z boku (komputer, wzorzec d2) ── */
.p-portal .day-list-label { margin:0 0 2px; font-family:var(--font-display);
  font-size:10px; font-weight:700; letter-spacing:var(--tracking-caps);
  text-transform:uppercase; color:var(--ink-500); }
.p-portal .day-list-akcja { display:block; padding:11px 12px; text-align:center;
  border:1px solid var(--line); border-radius:var(--radius-md); background:#FBF9F5;
  color:var(--ink-900); text-decoration:none; font-family:var(--font-display);
  font-size:13px; font-weight:600; }
.p-portal .day-list-akcja:hover { border-color:var(--ink-700); }

@media (min-width:768px) {
  /* Kolumna z listą i kolumna z postem trzymają tę samą siatkę co reszta
     panelu; bez tego dzień rozjeżdżał się z radarem i Wywiadem. */
  .p-portal .day-split { gap:24px; }
  .p-portal .day-list { width:288px; gap:10px; }
  .p-portal .day-list-item { border-radius:var(--radius-md); padding:11px 12px;
    box-shadow:var(--shadow-xs); }
  /* Zaznaczenie przez OBRYS i tło indygo, nie pomarańcz: pomarańcz w tym
     systemie znaczy „alert", a nie „tu jesteś". */
  .p-portal .day-list-item.is-active { border-color:var(--indigo-700);
    background:var(--indigo-50, #ECE8DF); }
  .p-portal .day-list-item[data-tag].is-active { border-color:var(--tag-line, var(--indigo-700)); }
  .p-portal .dli-status { font-family:var(--font-display); font-size:10px;
    letter-spacing:.03em; text-transform:uppercase; }
  .p-portal .day-posts .post { max-width:none; }
  .p-portal .feed.has-tabs .day-split { max-width:1040px; margin:0 auto; }
}

/* Zwijane sekcje karty niosa juz wlasna strzalke (.wiecej-strzalka), wiec
   stary znaczek `::after` dawal dwa daszki obok siebie. Ramka `.wiecej` ma
   tez wlasne obramowanie, wiec kreska i odstep sprzed niej sa zbedne. */
.p-portal .post .note-fold > summary::after,
.p-portal .post .details-fold > summary::after { content:""; }
.p-portal .post .details-fold { border-top:0; padding-top:0; margin-top:10px; }

/* Kreska nad uwaga zostala z ukladu, w ktorym pole bylo rozwiniete na stale.
   Teraz obie sekcje sa jednakowymi wierszami i separator robil z nich dwa
   rozne byty. */
.p-portal .post .note-section { margin-top:0; padding-top:0; border-top:0; }

/* ══ WYWIAD NA KOMPUTERZE — wyniki (d8) i pigułki w nagłówku (d7) ════ */

/* Karta okna obserwacji obok wyników. Na telefonie idzie POD nimi — to
   kontekst, a nie coś, co trzeba przeczytać przed wynikami. */
.p-portal .wyw-szukanie { display:grid; gap:16px; }
.p-portal .wyw-okno-karta { background:#FBF9F5; border:1px solid var(--line);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); padding:16px;
  align-self:start; }
.p-portal .wyw-okno-kicker { margin:0 0 6px; font-family:var(--font-display);
  font-size:10px; font-weight:700; letter-spacing:var(--tracking-caps);
  text-transform:uppercase; color:var(--ink-500); }
.p-portal .wyw-okno-zakres { margin:0 0 10px; font-size:14px;
  color:var(--ink-700); }
.p-portal .wyw-okno-liczba { margin:0; padding:9px 0; font-size:13px;
  color:var(--ink-500); border-top:1px solid var(--line); }
.p-portal .wyw-okno-liczba b { font-family:var(--font-display); font-size:24px;
  font-weight:700; color:var(--ink-900); margin-right:7px;
  font-variant-numeric:tabular-nums; }

@media (min-width:768px) {
  /* d8: wyniki z lewej, okno obserwacji z prawej. */
  .p-portal .wyw-szukanie { grid-template-columns:minmax(0,1fr) 300px; gap:24px; }
}

/* Wywiad: one complete fortnightly edition, with readable evidence. */
.intel-edition { overflow-wrap:anywhere; }
.intel-direction { font-size:1.05rem; line-height:1.55; font-weight:400; }
.intel-intro > summary { cursor:pointer; }
.intel-expand { font-size:.85rem; text-decoration:underline; white-space:nowrap; }
.intel-explanation { margin:16px 0; }
.intel-explanation summary { cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.intel-explanation li { margin:12px 0; }

/* D-079 F1 (Z-124): kciuki na kartach Radaru - projekt wlasciciela (.fv, wariant 1a; handoff feedback-vote.css),
   zmienne dopasowane do tokenow panelu. Blok w wierszu akcji karty, wyrownany do prawej. */
.fv {
  --fv-ink: var(--ink-900); --fv-muted: #6B675F; --fv-faint: #A29C91; --fv-line: var(--line);
  --fv-hover: var(--ink-100); --fv-up: #111316; --fv-up-bg: #ECE8DF; --fv-down: var(--ink-700); --fv-down-bg: #ECE8DF;
  position: relative; display: inline-flex; align-items: center; gap: 2px; font: inherit;
}
.want-row:has(.fv) { align-items: center; }
.want-row:has(.fv) .want { flex: 0 1 auto; }
.want-row:has(.fv) .want[open] { flex-basis: 100%; }
.want-row .fv { margin-left: auto; }
.fv__label { font-size: 12px; color:var(--fv-muted); margin-right: 6px; }
.fv[data-vote="up"] .fv__label { color:var(--fv-up); font-weight: 600; }
.fv[data-vote="down"] .fv__label { color:#6B675F; font-weight: 600; }
.fv__btn { width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border:0; border-radius:2px;
  background:transparent; color:var(--fv-muted); cursor: pointer; transition: background-color .15s ease, color .15s ease; }
.fv__btn svg { width: 17px; height: 17px; fill:none; stroke:currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fv__btn:hover { background:var(--fv-hover); color:var(--fv-ink); }
.fv__btn:focus-visible, .fv__help:focus-visible { outline:2px solid var(--fv-up); outline-offset: 2px; }
.fv__btn:active { transform: scale(.96); }
.fv__btn[data-v="up"][aria-pressed="true"] { background:var(--fv-up-bg); color:var(--fv-up); }
.fv__btn[data-v="down"][aria-pressed="true"] { background:var(--fv-down-bg); color:var(--fv-down); }
.fv__btn[aria-pressed="true"] svg { fill:currentColor; fill-opacity: .18; }
.fv__sep { width: 1px; height: 16px; background:var(--fv-line); margin: 0 6px; }
.fv__help { width: 24px; height: 24px; display: grid; place-items: center; padding: 0; border:0; border-radius:2px;
  background:transparent; color:var(--fv-faint); cursor: pointer; transition: color .15s ease; }
.fv__help svg { width: 15px; height: 15px; fill:none; stroke:currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fv__help:hover, .fv__help[aria-expanded="true"] { color:#6B675F; }
.fv__pop { position: absolute; top: 36px; right: -8px; z-index: 20; width: 288px; max-width: calc(100vw - 32px);
  padding: 14px 16px; background:#FBF9F5; border:1px solid var(--fv-line); border-radius:2px;
  box-shadow:var(--shadow-lg); display: flex; flex-direction: column; gap: 8px; text-align: left; }
.fv__pop[hidden] { display: none; }
.fv__pop-head { display: flex; justify-content: space-between; align-items: center; }
.fv__pop-title { font-size: 13px; font-weight: 700; color:var(--fv-ink); }
.fv__pop-close { border:0; background:none; color:var(--fv-muted); cursor: pointer; font-size: 16px; line-height: 1; padding: 0; }
.fv__pop p { margin: 0; font-size: 13px; line-height: 1.5; color:var(--fv-down); text-wrap: pretty; }
.fv__pop .fv__pop-note { font-size: 12px; color:#6B675F; font-style: italic; }
/* Karta alertu i grupa sygnalow przycinaja zawartosc do zaokraglonych rogow (overflow:hidden) - otwarty popover
   ocen wychodzi poza karte, wiec na ten czas przyciecie znika; pasek alertu ma wlasne zaokraglenie. */
.p-portal .sig-grupa:has(.fv__pop:not([hidden])), .p-portal .sig-alert:has(.fv__pop:not([hidden])) { overflow: visible; }
.p-portal .sig-alert::before { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
/* Globalny `button` ma min-height 46 px (pole dotyku formularzy) - kontrolki .fv maja wlasne rozmiary z projektu. */
.fv__btn, .fv__help, .fv__pop-close { min-height: 0; }

/* D-079 F2 (Z-124): komplet kalibracyjny - strona /app/radar/kalibracja i przypomnienie na Radarze. */
.kal-chip { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 10px 14px; border-radius:2px;
  background:var(--indigo-50); border:1px solid var(--indigo-100); color:var(--indigo-700); font-size: 14px;
  font-weight: 600; text-decoration: none; }
.kal-chip span { flex: 1; }
.kal-chip:hover { background:var(--indigo-100); }
.kal-postep { gap: 12px; padding: 0 16px; }
.kal-postep__licznik { font-variant-numeric: tabular-nums; white-space: nowrap; }
.kal-postep__pasek { width: 160px; height: 6px; appearance: none; border:0; border-radius:2px; overflow: hidden;
  background:rgba(255,255,255,.16); }
.kal-postep__pasek::-webkit-progress-bar { background:rgba(255,255,255,.16); border-radius:2px; }
.kal-postep__pasek::-webkit-progress-value { background:var(--ph-accent, #F2895A); border-radius:2px; }
.kal-postep__pasek::-moz-progress-bar { background:var(--ph-accent, #F2895A); border-radius:2px; }
.kal-intro { margin: 0 0 8px; }
.kal-legenda { margin: 0 0 16px; font-size: 14px; }
.kal-legenda summary { cursor: pointer; font-weight: 600; color:var(--ink-700); }
.kal-legenda__lista { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.kal-legenda__lista li { display: flex; align-items: center; gap: 10px; color:var(--ink-700); }
.kal-legenda__nr, .kal-ocena__nr { display: inline-grid; place-items: center; width: 26px; height: 26px; flex: none;
  border-radius:0; background:var(--indigo-50); color:var(--indigo-700); font-weight: 700; font-size: 13px;
  font-variant-numeric: tabular-nums; }
.kal-ocena__nr--silnik { background:var(--ink-100); color:var(--ink-700); }
.kal-sekcja { display: flex; align-items: center; gap: 8px; margin: 22px 0 10px; font-size: 15px; }
.kal-sekcja__ile { font-size: 12px; font-weight: 600; color:var(--ink-500); background:var(--ink-100);
  padding: 2px 8px; border-radius:2px; }
.kal-poz { margin-bottom: 12px; }
.kal-form { display: grid; gap: 10px; margin-top: 12px; }
.kal-skala { margin: 0; padding: 0; border:0; min-width: 0; }
.kal-skala legend { padding: 0; margin-bottom: 6px; font-size: 13px; font-weight: 600; color:var(--ink-500); }
.kal-skala__opcje { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; max-width: 320px; }
.kal-skala__opt { position: relative; display: block; cursor: pointer; }
.kal-skala__opt input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.kal-skala__nr { display: grid; place-items: center; height: 44px; border:1px solid var(--ink-300); border-radius:0;
  background:#FBF9F5; color:var(--ink-700); font-weight: 700; font-size: 16px; font-variant-numeric: tabular-nums;
  transition: background-color .15s ease, border-color .15s ease; }
.kal-skala__opt:hover .kal-skala__nr { background:var(--ink-50); }
.kal-skala__opt input:checked + .kal-skala__nr { background:var(--indigo-700); border-color:var(--indigo-700); color:#F4F1EA; }
.kal-skala__opt input:focus-visible + .kal-skala__nr { outline:2px solid var(--indigo-700); outline-offset: 2px; }
.kal-ukryte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.kal-why { display: grid; gap: 6px; font-size: 13px; font-weight: 600; color:var(--ink-500); }
.kal-why textarea { font-weight: 400; color:var(--ink-900); }
.kal-form .btn-want { justify-self: start; min-height: 0; }
.kal-ocena { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 13px; color:var(--ink-700); }
.kal-uzasadnienie { margin: 4px 0 6px; font-size: 13px; line-height: 1.5; color:var(--ink-700); font-style: italic; }
.kal-zmien > summary { display: inline-block; cursor: pointer; list-style: none; }
.kal-zmien > summary::-webkit-details-marker { display: none; }
.kal-zmien[open] > summary { margin-bottom: 8px; }
.kal-wyslij { margin: 24px 0 8px; display: grid; gap: 8px; }
.kal-potw > summary { list-style: none; cursor: pointer; }
.kal-potw > summary::-webkit-details-marker { display: none; }
.kal-potw[open] { padding: 14px 16px; border:1px solid var(--line); border-radius:0; background:#FBF9F5; }
.kal-potw[open] > summary { margin-bottom: 10px; }
.kal-potw p { margin: 0 0 10px; font-size: 14px; color:var(--ink-700); }
.kal-status { margin: 0 0 14px; font-size: 14px; font-weight: 600; color:var(--ink-700); }
.kal-porownanie { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 10px 0 4px; }
.kal-porownanie dt { font-size: 12px; font-weight: 600; color:var(--ink-500); margin-bottom: 4px; }
.kal-porownanie dd { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 13px; color:var(--ink-700); }
@media (max-width: 720px) {
  .kal-postep { justify-content: space-between; }
  .kal-postep__pasek { flex: 1; width: auto; }
  .kal-skala__opcje { max-width: none; }
  .kal-porownanie { grid-template-columns: 1fr; }
}

/* U-W1 (Z-156 E0): wcześniejsza edycja klienta pod polem treści posta. */
.prior-edit { margin:10px 0 0; }
.prior-edit-note { margin:0 0 6px; }
.prior-edit-fold summary { cursor:pointer; }
.prior-edit-text { white-space:pre-wrap; margin:8px 0; }

/* E1 (Z-157): rozmowa pod postem, historia wersji i różnice. Zmienne marki z :root; bez nowych barw. */
.conversation { margin:0 0 12px; }
.conv-title { margin:0 0 8px; font-size:15px; }
.conv-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.conv-msg { border:1px solid var(--line); border-radius:0; padding:10px 12px; background:#FBF9F5; max-width:92%; }
.conv-msg.conv-zespol { background:var(--indigo-50); border-color:var(--indigo-100); align-self:flex-start; }
.conv-msg.conv-ty { background:var(--orange-100); border-color:var(--orange-200); align-self:flex-end; }
.conv-msg.conv-new { box-shadow:none; }
.conv-meta { margin:0 0 4px; font-size:12.5px; }
.conv-text { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; }
.conv-badge { display:inline-block; background:var(--orange-500); color:var(--indigo-950); border-radius:2px;
  padding:1px 8px; font-size:11.5px; font-weight:600; margin-left:4px; }
.conv-close { margin:8px 0 0; }
.conv-close button { margin:0; }
.versions-link { margin:10px 0 0; font-size:14px; }
.versions-list { list-style:none; margin:0 0 18px; padding:0; display:flex; flex-direction:column; gap:8px; }
.version-row { border:1px solid var(--line); border-radius:0; padding:10px 12px; background:#FBF9F5; }
.version-row--wybrana { border-color:var(--indigo-300); background:var(--indigo-50); }
.version-meta { margin:0 0 4px; font-size:14px; }
.version-text summary, .version-detail summary { cursor:pointer; font-size:13.5px; color:var(--ink-500); }
.version-diff { line-height:1.55; }
.diff-del { background:var(--maroon-100); color:var(--maroon-700); text-decoration:line-through; }
.diff-ins { background:var(--success-bg); color:var(--success-700); text-decoration:none; }
.versions-page .pre { white-space:pre-wrap; overflow-wrap:anywhere; }
@media (max-width:720px) { .conv-msg { max-width:100%; } }

/* E1 (Z-157): admin - akcje w jednym wierszu, historia wersji. */
.inline-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:8px; }
.inline-actions button { margin:0; }
.versions-history { margin:16px 0; }
.versions-history .version { border-top:1px solid var(--line); padding:8px 0; }
.version-hidden { border-color:var(--warning); background:var(--warning-bg); }
.conversation-reply textarea { width:100%; box-sizing:border-box; }


/* ── PRAEVI skin 1.0 (Brand Book 1.0 + design system 2a) ─────────────────
   Tylko wygląd: te same klasy i szablony. Tytuły w szerokości 118%, wagi 600,
   ostre narożniki, linie zamiast cieni, logo z pliku zamiast nazwy składanej krojem. */
body { font-size:16px; }
h1, h2, h3, .ph__title { font-stretch:118%; font-weight:600; letter-spacing:-.01em; }
.sig-title, .wy-item h3, .kal-poz .sig-title { font-stretch:108%; }
.wpost-time, .post-time, .sig-time, .wdzien-dnum, .licznik, .order-count, .kal-postep__licznik { font-variant-numeric:tabular-nums; }
/* Logo: znak z pliku + logotyp z pliku (Brand Book: nazwy nie składamy krojem).
   Tekst „PRAEVI" w szablonach zostaje dla czytników ekranu, wizualnie go chowamy. */
.brand, .ph__brand, .auth-hero__brand { display:inline-flex; align-items:center; gap:8px; color:var(--ink-900); }
.brand > span:not(.brand-tag), .ph__brand > span, .auth-hero__product { position:absolute; width:1px; height:1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.brand-mark, .auth-hero__logo { height:26px; width:auto; }
.brand::after, .ph__brand::after, .auth-hero__brand::after { content:""; order:1; display:block; width:72px; height:10px; flex:none;
  background:url('../img/praevi-wordmark-graphite.svg') no-repeat left center / contain; }
.brand-tag { order:2; }
.p-portal .ph__brand::after, .auth-hero__brand::after { background-image:url('../img/praevi-wordmark-ivory.svg'); }
.p-portal .ph__brand .brand-mark, .auth-hero__logo { display:none; }
.p-portal .ph__brand::before, .auth-hero__brand::before { content:""; display:block; width:23px; height:26px; flex:none;
  background:url('../img/praevi-symbol-dark.svg') no-repeat center / contain; }
:focus-visible { outline:2px solid #B5391A; outline-offset:2px; }

/* Akcje są grafitowe (Brand Book: główna akcja = grafit). Zielony zostaje tylko dla stanów pozytywnych. */
.p-portal .btn-want, .p-portal .wdzien-act { color:var(--ink-900); border-color:var(--ink-900); background:transparent; }
.p-portal .btn-want:hover, .p-portal .wdzien-act:hover { background:var(--ink-100); }
.p-portal .btn-glowny, .p-portal .post-actions .btn-decyzja,
.p-portal .wyw-wniosek-idz:first-of-type .wyw-akcja .btn-want { background:var(--ink-900); border-color:var(--ink-900); color:#F4F1EA; }
.p-portal .btn-glowny:hover, .p-portal .post-actions .btn-decyzja:hover { background:var(--ink-800); }
.p-portal .wyw-wniosek-idz:first-of-type .wyw-akcja .btn-want:hover { background:var(--ink-100); color:var(--ink-900); }
.zgoda-box input[type="checkbox"], .consent-box input[type="checkbox"] { accent-color:var(--ink-900); }
.kal-postep__pasek::-webkit-progress-value { background:#F4F1EA; }
.kal-postep__pasek::-moz-progress-bar { background:#F4F1EA; }
.held-list a { color:var(--ink-900); }
a:hover { color:var(--orange-600); }
.auth-panel, .card { box-shadow:none; }
