/* ========================================
   FAJNE ŻYCIE - MINIMALISTYCZNY DESIGN
   ======================================== */

/* === ZMIENNE CSS - ROZSZERZONE === */
:root {
  /* Radiusy */
  --fz-radius: 8px;
  --fz-radius-sm: 6px;
  --fz-radius-lg: 12px;
  --fz-radius-xl: 16px;
  
  /* Layout */
  --fz-gap: 16px;
  --fz-toolbar-height: 56px;
  --fz-timeline-width: 1px;
  --fz-icon-size: 24px;
  --fz-content-padding: 16px;
  
  /* Kolory */
  --fz-bg: #ffffff;
  --fz-fg: #0a0a0a;
  --fz-muted: #6b7280;
  --fz-surface: #f8fafc;
  --fz-accent: #2563eb;
  
  /* Spacing - harmonijny system */
  --fz-spacing-xs: 4px;
  --fz-spacing-sm: 8px;
  --fz-spacing-md: 16px;
  --fz-spacing-lg: 24px;
  --fz-spacing-xl: 32px;
  --fz-spacing-2xl: 48px;
  --fz-spacing-3xl: 64px;
  
  /* Typografia */
  --fz-font-xs: 0.75rem;     /* 12px */
  --fz-font-sm: 0.875rem;    /* 14px */
  --fz-font-base: 1rem;      /* 16px */
  --fz-font-lg: 1.125rem;    /* 18px */
  --fz-font-xl: 1.25rem;     /* 20px */
  --fz-font-2xl: 1.5rem;     /* 24px */
  --fz-font-3xl: 1.875rem;   /* 30px */
  
  /* Line heights */
  --fz-leading-tight: 1.25;
  --fz-leading-normal: 1.5;
  --fz-leading-relaxed: 1.65;
  --fz-leading-loose: 1.8;
  
  /* Letter spacing */
  --fz-tracking-tighter: -0.02em;
  --fz-tracking-tight: -0.01em;
  --fz-tracking-normal: 0;
  --fz-tracking-wide: 0.02em;
  --fz-tracking-wider: 0.04em;
  
  /* Transitions */
  --fz-transition-fast: 150ms ease;
  --fz-transition-base: 250ms ease;
  --fz-transition-slow: 350ms ease;
  
  /* Shadows */
  --fz-shadow-sm: 0 1px 3px color-mix(in oklab, var(--fz-fg) 10%, transparent);
  --fz-shadow-md: 0 4px 12px color-mix(in oklab, var(--fz-fg) 10%, transparent);
  --fz-shadow-lg: 0 8px 24px color-mix(in oklab, var(--fz-fg) 12%, transparent);
  --fz-shadow-xl: 0 12px 32px color-mix(in oklab, var(--fz-fg) 15%, transparent);
}

@media (prefers-color-scheme: dark) {
  :root {
    --fz-bg: #0f1720;
    --fz-fg: #f1f5f9;
    --fz-muted: #94a3b8;
    --fz-surface: #1e293b;
    --fz-accent: #3b82f6;
  }
}

[data-color-mode="light"] { 
  --fz-bg:#ffffff; 
  --fz-fg:#0a0a0a; 
  --fz-surface:#f8fafc; 
  --fz-muted:#6b7280; 
  --fz-accent:#2563eb; 
}

[data-color-mode="dark"] { 
  --fz-bg:#0f1720; 
  --fz-fg:#f1f5f9; 
  --fz-surface:#1e293b; 
  --fz-muted:#94a3b8; 
  --fz-accent:#3b82f6; 
}

/* === PODSTAWY === */
html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body { 
  background: var(--fz-bg); 
  color: var(--fz-fg); 
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: var(--fz-font-base);
  line-height: var(--fz-leading-normal);
  letter-spacing: var(--fz-tracking-normal);
  margin: 0;
  padding: 0;
  font-feature-settings: 'kern' 1, 'liga' 1;
  text-rendering: optimizeLegibility;
}

/* Lepsze renderowanie treści */
p {
  margin: 0 0 1em 0;
  line-height: var(--fz-leading-relaxed);
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  line-height: var(--fz-leading-tight);
  letter-spacing: var(--fz-tracking-tight);
  margin: 0;
}

h1 { font-size: var(--fz-font-3xl); }
h2 { font-size: var(--fz-font-2xl); }
h3 { font-size: var(--fz-font-xl); }
h4 { font-size: var(--fz-font-lg); }
h5, h6 { font-size: var(--fz-font-base); }

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--fz-transition-fast);
}

/* Poprawa czytelności code/pre */
code, pre {
  font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Code', 'Consolas', monospace;
  font-size: 0.9em;
}

/* Lepsze renderowanie obrazów */
img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* === HEADER v2 (czysty) === */
.fz-header { position: relative; z-index: 60; background: var(--fz-bg); }
.fz-appbar { position: fixed; top: 0; left: 0; right: 0; background: color-mix(in oklab, var(--fz-bg) 95%, transparent); backdrop-filter: saturate(160%) blur(8px); border-bottom: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent); }
.fz-appbar-inner { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 12px; padding: 8px var(--fz-spacing-md); }
.fz-header-spacer { height: 52px; }

/* WordPress admin bar overlap fix */
body.admin-bar .fz-appbar { top: 32px; }
body.admin-bar .fz-header-spacer { height: calc(52px + 32px); }
@media (max-width: 782px) { /* WP breakpoint dla paska admina */
  body.admin-bar .fz-appbar { top: 46px; }
  body.admin-bar .fz-header-spacer { height: calc(52px + 46px); }
}
.fz-brand { display: flex; align-items: center; gap: var(--fz-spacing-sm); }

.fz-brand .brand-wrapper {
  display: flex;
  align-items: center;
  gap: var(--fz-spacing-sm);
}

.fz-brand .brand-text { 
  font-weight: 800; 
  font-size: 1.15rem; 
  color: var(--fz-fg); 
  text-decoration: none; 
  letter-spacing: -0.01em;
  transition: color var(--fz-transition-fast);
}

.fz-brand .brand-text:hover {
  color: var(--fz-accent);
}

.fz-brand .brand-tagline {
  font-size: 0.8rem;
  color: var(--fz-muted);
  font-weight: 500;
  font-style: italic;
  letter-spacing: 0.01em;
  padding-left: var(--fz-spacing-sm);
  border-left: 2px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  opacity: 0.7;
  transition: opacity var(--fz-transition-fast);
}

.fz-brand:hover .brand-tagline {
  opacity: 1;
}

.fz-brand .brand-logo { display: inline-flex; align-items: center; }
.fz-brand .logo-image { 
  height: 40px; 
  width: auto; 
  max-width: 200px; 
  object-fit: contain;
  transition: transform var(--fz-transition-fast);
}

.fz-brand .brand-logo:hover .logo-image {
  transform: scale(1.02);
}
.fz-toolbar { display: inline-flex; align-items: center; gap: 6px; }
.fz-nav-toggle { display: none; width: 36px; height: 36px; border-radius: 10px; border: 1px solid color-mix(in oklab, var(--fz-fg) 12%, transparent); background: color-mix(in oklab, var(--fz-surface) 60%, transparent); align-items: center; justify-content: center; }
.fz-nav-toggle span { width: 4px; height: 4px; border-radius: 50%; background: var(--fz-fg); display: inline-block; margin: 0 1px; }

.fz-nav { padding: 6px 0 8px; overflow: visible; }
.fz-menu, .fz-menu ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 0; flex-wrap: wrap; align-items: center; }
.fz-menu > li { position: relative; }
.fz-menu a { display: inline-flex; align-items: center; padding: 8px 10px; color: var(--fz-fg); text-decoration: none; font-weight: 600; position: relative; }
.fz-menu a::after { content: ''; position: absolute; left: 0; bottom: -6px; width: 0; height: 2px; background: var(--fz-accent); transition: width .2s ease; }

/* Wyłącz hover effect dla elementów WPML - bardziej specyficzny selektor */
.fz-menu li.wpml-ls-item a::after,
#fz-main-nav li.wpml-ls-item a::after,
#menu-glowne li.wpml-ls-item a::after {
  display: none !important;
  content: none !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  position: static !important;
  left: auto !important;
  bottom: auto !important;
}
.fz-menu a:hover { color: var(--fz-accent); }
.fz-menu a:hover::after { width: 100%; }
.fz-menu .current-menu-item > a, .fz-menu .current_page_item > a { color: var(--fz-accent); }
.fz-menu .current-menu-item > a::after, .fz-menu .current_page_item > a::after { width: 100%; }

/* Wyłącz hover effect dla elementów WPML */
.fz-menu .wpml-ls-item a:hover::after {
  width: 0 !important;
  display: none !important;
}

/* Minimalistyczne dropdowny */
.fz-menu li ul { position: absolute; left: 0; top: calc(100% + 6px); min-width: 180px; background: var(--fz-bg); border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent); border-radius: 8px; box-shadow: 0 10px 20px -12px color-mix(in oklab, var(--fz-fg) 25%, transparent); padding: 4px; opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .15s ease, transform .15s ease; z-index: 1000; }
.fz-menu li:hover > ul, .fz-menu li:focus-within > ul { opacity: 1; visibility: visible; transform: translateY(0); }
.fz-menu li ul li { width: 100%; }
.fz-menu li ul a { padding: 6px 10px; width: 100%; border-radius: 6px; font-size: .92rem; }
.fz-menu li ul a:hover { background: color-mix(in oklab, var(--fz-surface) 70%, transparent); color: var(--fz-accent); }

@media (max-width: 768px) {
  .fz-nav-toggle { display: inline-flex; }
  .fz-nav { display: none; }
  .fz-nav.open { display: block; }
  .fz-menu { flex-direction: column; align-items: stretch; }
  .fz-menu a { padding: 12px 0; }
  .fz-menu a::after { display: none; }
  .fz-menu li ul { position: static; border: none; box-shadow: none; padding: 0; opacity: 1; visibility: visible; transform: none; }
  .fz-menu li ul a { padding: 10px 0 10px 12px; }
}

.brand a { 
  font-weight: 700; 
  font-size: 1.1rem; 
  color: var(--fz-fg);
  text-decoration: none;
}

.header-actions { 
  display: flex; 
  align-items: center; 
  gap: var(--fz-spacing-sm); 
  margin-left: auto; 
}

.toolbar-slot { 
  display: flex; 
  align-items: center; 
  gap: var(--fz-spacing-xs); 
}

.nav-toggle { display: none; }

.primary-nav { 
  border-top: none; 
  padding: 2px 0 8px; /* mniejsza przestrzeń pod menu */
  overflow-x: auto; 
  -webkit-overflow-scrolling: touch;
}

.primary-nav .menu-list { 
  display: flex; 
  flex-wrap: wrap; 
  gap: 6px; 
  list-style: none; 
  margin: 0; 
  padding: 0; 
  justify-content: flex-start; 
  align-items: center; 
}

.primary-nav .menu,
.primary-nav .menu ul,
.primary-nav .menu-main-menu-container > ul,
.primary-nav > ul { 
  display: flex; 
  flex-wrap: wrap; 
  gap: 0; 
  list-style: none; 
  margin: 0; 
  padding: 0; 
  justify-content: flex-start; 
  align-items: center; 
}

.primary-nav .menu li,
.primary-nav .menu-list li,
.primary-nav li { 
  list-style: none; 
  margin: 0; 
  padding: 0; 
  display: inline-flex; 
}

.primary-nav .menu-list a,
.primary-nav .menu a,
.primary-nav a {
  display: inline-flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 0;
  border: none;
  background: transparent;
  position: relative;
  white-space: nowrap;
  color: var(--fz-fg);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 600;
  transition: color .2s ease;
}

/* Delikatny wskaźnik pod linkiem */
.primary-nav .menu-list a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 0;
  height: 2px;
  background: var(--fz-accent);
  transition: width .2s ease;
}

.primary-nav .menu-list a:hover,
.primary-nav .menu a:hover {
  color: var(--fz-accent);
}
.primary-nav .menu-list a:hover::after { width: 100%; }
.nav-toggle { display: none; }

@media (max-width: 768px) {
  .nav-toggle { display: inline-flex; width: 36px; height: 36px; border-radius: 10px; border: 1px solid color-mix(in oklab, var(--fz-fg) 12%, transparent); background: color-mix(in oklab, var(--fz-surface) 60%, transparent); align-items: center; justify-content: center; }
  .nav-toggle-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--fz-fg); display: inline-block; margin: 0 1px; }
  .primary-nav { display: none; }
  .primary-nav.open { display: block; padding-top: 4px; }
  .primary-nav .menu-list { flex-direction: column; align-items: stretch; gap: 0; }
  .primary-nav .menu-list a { padding: 12px 0; border-bottom: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent); }
  .primary-nav .menu-list a::after { display: none; }
  .primary-nav li ul { position: static; box-shadow: none; border: none; padding: 0; opacity: 1; visibility: visible; transform: none; }
  .primary-nav li ul a { padding: 10px 0 10px 12px; }
}

.primary-nav .current-menu-item > a,
.primary-nav .current_page_item > a {
  color: var(--fz-accent);
}
.primary-nav .current-menu-item > a::after,
.primary-nav .current_page_item > a::after { width: 100%; }

/* === WPML LANGUAGE SWITCHER STYLES === */
.wpml-ls-item {
  display: inline-flex !important;
  align-items: center;
}

.wpml-ls-item a {
  display: inline-flex !important;
  align-items: center;
  padding: 6px 8px !important;
  border-radius: 6px;
  transition: background-color 0.2s ease;
  min-height: 32px;
  min-width: 32px;
  justify-content: center;
}

.wpml-ls-item a:hover {
  background-color: color-mix(in oklab, var(--fz-surface) 70%, transparent) !important;
}

/* Użyj standardowych flag WPML lub fallback do naszych */
.wpml-ls-item img {
  width: 20px !important;
  height: 16px !important;
  object-fit: contain !important;
  border-radius: 2px !important;
  border: none !important; /* Usuń wszystkie ramki */
  display: block !important;
}

/* Fallback - jeśli WPML nie generuje img, użyj naszych flag - wyższa specyficzność */
.fz-menu li.wpml-ls-item a::after,
#fz-main-nav li.wpml-ls-item a::after,
#menu-glowne li.wpml-ls-item a::after {
  content: '' !important;
  width: 20px !important;
  height: 16px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  border-radius: 2px !important;
  display: block !important;
  position: static !important;
  left: auto !important;
  bottom: auto !important;
  background: transparent !important;
}

/* Flagi fallback dla konkretnych języków - wyższa specyficzność */
.fz-menu li.wpml-ls-item-pl a::after,
#fz-main-nav li.wpml-ls-item-pl a::after,
#menu-glowne li.wpml-ls-item-pl a::after {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 40"><rect width="60" height="40" fill="%23ffffff"/><rect y="20" width="60" height="20" fill="%23dc143c"/></svg>') !important;
}

.fz-menu li.wpml-ls-item-en a::after,
#fz-main-nav li.wpml-ls-item-en a::after,
#menu-glowne li.wpml-ls-item-en a::after {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 40"><rect width="60" height="40" fill="%23ffffff"/><g fill="%230124aa"><path d="M0 0h60v4.4H0zM0 8.8h60v4.4H0zM0 17.6h60v4.4H0zM0 26.4h60v4.4H0zM0 35.2h60v4.4H0z"/><path d="M0 0h24v24H0z"/><g fill="%23ffffff"><path d="M2.2 2.2h4.4v4.4H2.2zM8.8 2.2h4.4v4.4H8.8zM15.4 2.2h4.4v4.4h-4.4zM21.6 2.2h4.4v4.4h-4.4zM2.2 8.8h4.4v4.4H2.2zM8.8 8.8h4.4v4.4H8.8zM15.4 8.8h4.4v4.4h-4.4zM21.6 8.8h4.4v4.4h-4.4zM2.2 15.4h4.4v4.4H2.2zM8.8 15.4h4.4v4.4H8.8zM15.4 15.4h4.4v4.4h-4.4zM21.6 15.4h4.4v4.4h-4.4z"/></g></svg>') !important;
}

/* Zapewnij prawidłowe wyrównanie flag */
.wpml-ls-item a {
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  margin: 0 !important; /* Usuń wszystkie marginesy */
  min-width: 32px !important;
  min-height: 32px !important;
  justify-content: center !important;
  position: relative !important;
}

/* Dodatkowe zabezpieczenie - upewnij się, że flagi są widoczne */
.wpml-ls-item a:empty::after,
.wpml-ls-item a:not(:has(img))::after {
  display: block !important;
  content: '' !important;
}

/* Zapewnij, że elementy WPML są widoczne w menu */
.fz-menu .wpml-ls-item,
.primary-nav .wpml-ls-item,
.fz-menu li.wpml-ls-item,
.primary-nav li.wpml-ls-item,
#fz-main-nav .wpml-ls-item,
#menu-glowne .wpml-ls-item {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  align-items: center !important;
  vertical-align: middle !important;
  margin: 0 4px;
}

/* Style dla linków WPML w menu - poprawione wyrównanie */
#fz-main-nav .wpml-ls-item a,
#menu-glowne .wpml-ls-item a,
.fz-menu .wpml-ls-item a,
.primary-nav .wpml-ls-item a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 6px 8px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  border-radius: 6px !important;
  transition: background-color 0.2s ease !important;
  text-decoration: none !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  margin: 0 !important; /* Usuń marginesy */
  position: relative !important;
}

#fz-main-nav .wpml-ls-item a:hover,
#menu-glowne .wpml-ls-item a:hover,
.fz-menu .wpml-ls-item a:hover,
.primary-nav .wpml-ls-item a:hover {
  background-color: color-mix(in oklab, var(--fz-surface) 70%, transparent) !important;
}

/* Zapewnij widoczność elementów WPML w różnych kontekstach */
.wpml-ls-menu-item,
.wpml-ls-first-item,
.wpml-ls-last-item {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Dropdowny (submenu) */
.primary-nav li { position: relative; }
.primary-nav li ul {
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  min-width: 180px;
  background: var(--fz-bg);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  border-radius: 8px;
  box-shadow: 0 10px 20px -12px color-mix(in oklab, var(--fz-fg) 25%, transparent);
  padding: 4px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity .15s ease, transform .15s ease;
  z-index: 1000;
}
.primary-nav li:hover > ul,
.primary-nav li:focus-within > ul { opacity: 1; visibility: visible; transform: translateY(0); }
.primary-nav li ul li { width: 100%; }
.primary-nav li ul a { 
  padding: 6px 10px; 
  width: 100%; 
  color: var(--fz-fg);
  border-radius: 6px;
  font-size: 0.92rem;
}
.primary-nav li ul a:hover { background: color-mix(in oklab, var(--fz-surface) 70%, transparent); color: var(--fz-accent); }

/* Wskaźnik podmenu – zgodny z WordPressem (.menu-item-has-children) */
/* Usuwamy niestandardowy wskaźnik strzałki, by uniknąć artefaktów */
.primary-nav .menu-item-has-children > a { padding-right: 0; }

/* Arkusz nawigacji (mobile sheet) */
.nav-sheet { position: fixed; inset: 0; background: color-mix(in oklab, var(--fz-bg) 30%, transparent); backdrop-filter: blur(6px); display: none; }
.nav-sheet.active { display: block; }
.nav-sheet-content { position: absolute; left: 0; right: 0; bottom: 0; background: var(--fz-bg); border-top-left-radius: 16px; border-top-right-radius: 16px; padding: 16px; box-shadow: 0 -12px 24px -12px color-mix(in oklab, var(--fz-fg) 25%, transparent); }
.nav-sheet .sheet-menu { list-style: none; margin: 0; padding: 0; }
.nav-sheet .sheet-menu li a { display: block; padding: 12px 8px; border-bottom: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent); text-decoration: none; color: var(--fz-fg); }

/* === MOBILE === */
@media (max-width: 768px) {
  .primary-nav { display: block; }
  .primary-nav .menu-list { 
    gap: 0; 
    flex-direction: column; 
    align-items: flex-start; 
  }
  .primary-nav .menu-list a,
  .primary-nav .menu a,
  .primary-nav a {
    padding: var(--fz-spacing-sm) 0;
    border-bottom: 1px solid color-mix(in oklab, var(--fz-fg) 6%, transparent);
    width: 100%;
  }
  .header-row { padding: 0 var(--fz-spacing-sm); }
  
  /* Filtry na mobile */
  .stream-filters {
    gap: var(--fz-spacing-xs);
    margin-bottom: var(--fz-spacing-sm);
  }
  
  .stream-filters::before {
    font-size: 0.75rem;
    margin-right: var(--fz-spacing-xs);
  }
  
  .filter-btn {
    font-size: 0.75rem;
    padding: var(--fz-spacing-xs) var(--fz-spacing-sm);
    min-height: 24px;
  }
}

/* === GŁÓWNA STRONA === */
.app-main { 
  display: grid; 
  gap: var(--fz-spacing-lg); 
  margin-top: var(--fz-spacing-lg); 
  padding: 0 var(--fz-spacing-md);
}

/* === STRONY STATICZNE (page.php) === */
.page-view {
  display: block;
  margin-top: var(--fz-spacing-lg);
  padding: 0 var(--fz-spacing-md);
}

.page-article {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
}

.page-header { 
  margin-bottom: var(--fz-spacing-md);
}

.page-title {
  margin: 0;
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  line-height: 1.2;
  font-weight: 700;
  text-transform: none;
}

.page-content {
  font-size: 1rem;
  line-height: 1.7;
}

.page-content > :not(.alignwide):not(.alignfull) {
  max-width: 65ch;
  margin-left: auto;
  margin-right: auto;
}

.page-content :where(h2,h3,h4) {
  margin-top: 1.5em;
  margin-bottom: .6em;
}

.page-content :where(p,ul,ol,blockquote,pre) { margin: 0 0 1em 0; }
.page-content a { color: var(--fz-accent); }
.page-content a:hover { text-decoration: underline; }
.page-content blockquote {
  padding: .75rem 1rem;
  border-left: 3px solid var(--fz-accent);
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  border-radius: 0 var(--fz-radius) var(--fz-radius) 0;
}

/* Wyrównanie bloków szerokich z edytora */
.page-content .alignwide { width: min(100%, 960px); margin-left: auto; margin-right: auto; }
.page-content .alignfull { width: 100%; margin-left: 0; margin-right: 0; }

/* Formularze (np. newsletter MailPoet/Shortcode) */
.page-content form {
  display: grid;
  gap: var(--fz-spacing-sm);
}
.page-content input[type="email"],
.page-content input[type="text"],
.page-content textarea {
  width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid color-mix(in oklab, var(--fz-fg) 15%, transparent);
  background: var(--fz-bg);
  color: var(--fz-fg);
}
.page-content button,
.page-content input[type="submit"] {
  background: var(--fz-accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 14px;
  cursor: pointer;
}
.page-content button:hover,
.page-content input[type="submit"]:hover {
  background: color-mix(in oklab, var(--fz-accent) 85%, black);
}

/* === FILTRY STRUMIENIA - KREATYWNE ROZWIĄZANIE === */
.stream-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fz-spacing-xs);
  margin-bottom: var(--fz-spacing-md);
  padding: var(--fz-spacing-sm) 0;
  background: transparent;
  border-radius: 0;
  border: none;
  position: relative;
}

.stream-filters::before {
  content: "filters:";
  font-size: 0.8rem;
  color: var(--fz-muted);
  font-weight: 500;
  margin-right: var(--fz-spacing-sm);
  align-self: center;
  text-transform: lowercase;
}

.filter-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--fz-spacing-xs);
  padding: var(--fz-spacing-xs) var(--fz-spacing-sm);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 15%, transparent);
  background: color-mix(in oklab, var(--fz-surface) 30%, transparent);
  color: var(--fz-muted);
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  text-transform: lowercase;
  position: relative;
  white-space: nowrap;
  min-height: 28px;
}

.filter-btn::before {
  content: "●";
  font-size: 0.6rem;
  color: var(--fz-muted);
  transition: all 0.2s ease;
}

.filter-btn:hover {
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 30%, transparent);
  color: var(--fz-fg);
  transform: translateY(-1px);
  box-shadow: 0 2px 4px color-mix(in oklab, var(--fz-fg) 10%, transparent);
}

.filter-btn:hover::before {
  color: var(--fz-accent);
}

.filter-btn.active {
  background: var(--fz-accent);
  color: white;
  border-color: var(--fz-accent);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px color-mix(in oklab, var(--fz-accent) 30%, transparent);
}

.filter-btn.active::before {
  color: white;
}

.collapse-toggle {
  background: transparent;
  color: var(--fz-muted);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 15%, transparent);
  padding: var(--fz-spacing-xs) var(--fz-spacing-sm);
  border-radius: var(--fz-radius);
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.2s ease;
  text-transform: lowercase;
}

.collapse-toggle:hover {
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 30%, transparent);
  color: var(--fz-fg);
}

.collapse-toggle.active {
  background: var(--fz-accent);
  color: white;
  border-color: var(--fz-accent);
}

/* === OŚ CZASU === */
.timeline-stream {
  position: relative;
}

.timeline-stream::before {
  content: "";
  position: absolute;
  left: calc(var(--fz-content-padding) + var(--fz-icon-size) / 2 - var(--fz-timeline-width) / 2);
  top: 0;
  bottom: 0;
  width: var(--fz-timeline-width);
  background: color-mix(in oklab, var(--fz-fg) 12%, transparent);
  z-index: 1;
}

/* === SEPARATORY DNI - MINIMALISTYCZNE === */
.day-separator {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--fz-spacing-md);
  margin: var(--fz-spacing-xl) 0 var(--fz-spacing-lg) 0;
  font-size: 1rem;
  color: var(--fz-fg);
  font-weight: 600;
  text-transform: lowercase;
  z-index: 2;
}

.day-separator::before,
.day-separator::after {
  content: "";
  height: 1px;
  flex: 1;
  background: color-mix(in oklab, var(--fz-fg) 15%, transparent);
}

.day-separator::before {
  order: -1;
}

.day-label {
  display: inline-block;
  padding: var(--fz-spacing-xs) var(--fz-spacing-sm);
  border-radius: var(--fz-radius);
  background: color-mix(in oklab, var(--fz-surface) 70%, transparent);
  font-weight: 600;
  font-size: 0.9rem;
  text-transform: lowercase;
  color: var(--fz-fg);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
}

.day-top,
.day-collapse {
  width: 24px;
  height: 24px;
  border: 1px solid color-mix(in oklab, var(--fz-fg) 15%, transparent);
  background: var(--fz-bg);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  color: var(--fz-fg);
  font-size: 12px;
}

.day-top:hover,
.day-collapse:hover {
  background: color-mix(in oklab, var(--fz-surface) 80%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 30%, transparent);
}

/* === KARTY WPISÓW - SYSTEM Z KREATYWNYMI AKCENTAMI === */
.stream-item {
  position: relative;
  margin: 0 0 calc(var(--fz-spacing-xl) * 1.5) 0;
  padding-left: calc(var(--fz-content-padding) + var(--fz-icon-size) + var(--fz-spacing-sm));
  padding-right: var(--fz-content-padding);
  padding-top: var(--fz-spacing-sm);
  padding-bottom: var(--fz-spacing-md);
  z-index: 2;
  transition: all 0.3s ease;
}

/* Delikatny border z lewej strony w kolorze kategorii */
.stream-item::after {
  content: "";
  position: absolute;
  left: calc(var(--fz-content-padding) + var(--fz-icon-size) / 2);
  top: calc(var(--fz-icon-size) + 10px); /* Zaczyna się poniżej ikony */
  bottom: 0;
  width: 2px;
  background: linear-gradient(
    to bottom,
    color-mix(in oklab, var(--category-color, var(--fz-accent)) 30%, transparent),
    transparent
  );
  z-index: 1;
  opacity: 0.3;
  transition: opacity 0.3s ease;
}

.stream-item:hover::after {
  opacity: 0.6;
}

/* Dostosuj pozycję linii dla wpisów z większym paddingiem */
.stream-item.post-article::after,
.stream-item.post-articles::after {
  top: calc(var(--fz-icon-size) + var(--fz-spacing-md) + 14px);
}

.stream-item.post-podcast::after,
.stream-item.post-podcasts::after,
.stream-item.post-stefan::after,
.stream-item.post-conversations-with-stefan::after,
.stream-item.post-zapiski::after,
.stream-item.post-notes::after {
  top: calc(var(--fz-icon-size) + var(--fz-spacing-lg) + 12px);
}

.stream-item.post-podsumowanie::after,
.stream-item.post-summaries::after {
  top: calc(var(--fz-icon-size) + var(--fz-spacing-xl) + 16px);
}

/* === IKONY TIMELINE - WIDOCZNE I WYRÓWNANE DO TYTUŁÓW === */
.stream-item::before {
  content: "";
  position: absolute;
  left: var(--fz-content-padding);
  top: 2px; /* Domyślnie lekko od góry */
  width: var(--fz-icon-size);
  height: var(--fz-icon-size);
  border-radius: 50%;
  background: var(--category-color, var(--fz-bg));
  border: 2px solid color-mix(in oklab, var(--fz-fg) 20%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--fz-fg);
  z-index: 3;
  box-shadow: 0 2px 8px color-mix(in oklab, var(--fz-fg) 15%, transparent);
  transition: all 0.3s ease;
  cursor: pointer;
}

.stream-item::before:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px color-mix(in oklab, var(--fz-fg) 15%, transparent);
}

/* Wyrównanie ikon dla różnych typów wpisów - na wysokości tytułu/pierwszej linii */

/* Mikrowpisy - ikona na wysokości pierwszej linii tekstu */
.stream-item.post-micro::before {
  top: calc(var(--fz-spacing-md) + 2px);
}

/* Mikrodzienniki - ikona na wysokości kategorii */
.stream-item.post-mikrodziennik::before,
.stream-item.post-microjournals::before {
  top: calc(var(--fz-spacing-sm) + 2px);
}

/* Artykuły - ikona na wysokości tytułu */
.stream-item.post-article::before,
.stream-item.post-articles::before {
  top: calc(var(--fz-spacing-md) + 4px);
}

/* Podcasty - ikona na wysokości tytułu */
.stream-item.post-podcast::before,
.stream-item.post-podcasts::before {
  top: calc(var(--fz-spacing-lg) + 2px);
}

/* Rozmowy ze Stefanem - ikona na wysokości tytułu */
.stream-item.post-stefan::before,
.stream-item.post-conversations-with-stefan::before {
  top: calc(var(--fz-spacing-lg) + 2px);
}

/* Zapiski - ikona na wysokości tytułu */
.stream-item.post-zapiski::before,
.stream-item.post-notes::before {
  top: calc(var(--fz-spacing-lg) + 2px);
}

/* Podsumowania - ikona na wysokości headera */
.stream-item.post-podsumowanie::before,
.stream-item.post-summaries::before {
  top: calc(var(--fz-spacing-xl) + 6px);
}

/* Changelog - ikona na wysokości tytułu */
.stream-item.post-changelog::before {
  top: 4px;
}

/* === KOLORY IKON - NOWY SYSTEM KATEGORII === */
/* Wszystkie wpisy używają kolorów z ustawień kategorii */
.stream-item[data-category-color]::before {
  background: var(--category-color, #3b82f6) !important;
  border: none !important;
}

/* Customowe ikony z ustawień kategorii */
/* Customowe ikony z kolorami */
.stream-item[data-category-icon]::before {
  background-image: var(--custom-icon) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 14px 14px !important;
}

/* Kolor ikony dla customowych ikon */
.stream-item[data-category-icon-color]::before {
  color: var(--icon-color, #ffffff) !important;
}

/* Kolor ikony dla domyślnych ikon */
.stream-item:not([data-category-icon])::before {
  color: var(--icon-color, #ffffff) !important;
}

/* Domyślne ikony dla różnych typów szablonów - tylko gdy nie ma customowej ikony */
.stream-item.post-micro:not([data-category-icon])::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  stroke: var(--icon-color, #ffffff);
}

.stream-item.post-mikrodziennik:not([data-category-icon])::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpath d='M12 6v6l4 2'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.stream-item.post-article:not([data-category-icon])::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'%3E%3C/path%3E%3Cpolyline points='14,2 14,8 20,8'%3E%3C/polyline%3E%3Cline x1='16' y1='13' x2='8' y2='13'%3E%3C/line%3E%3Cline x1='16' y1='17' x2='8' y2='17'%3E%3C/line%3E%3Cpolyline points='10,9 9,9 8,9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.stream-item.post-podsumowanie:not([data-category-icon])::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3Ccircle cx='8' cy='15' r='1'%3E%3C/circle%3E%3Ccircle cx='12' cy='15' r='1'%3E%3C/circle%3E%3Ccircle cx='16' cy='15' r='1'%3E%3C/circle%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.stream-item.post-podcast:not([data-category-icon])::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3Cpath d='M12 1a6 6 0 0 0-6 6c0 1.887.454 3.665 1.257 5.234a.5.5 0 0 0 .686.165c.396-.197.82-.293 1.257-.293h6a3 3 0 0 1 1.257.293.5.5 0 0 0 .686-.165A11.944 11.944 0 0 0 18 7a6 6 0 0 0-6-6z'%3E%3C/path%3E%3Cpath d='M12 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'%3E%3C/path%3E%3Cpath d='M12 19a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.stream-item.post-stefan:not([data-category-icon])::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'%3E%3C/path%3E%3Cpath d='M13 8H7'%3E%3C/path%3E%3Cpath d='M17 12H7'%3E%3C/path%3E%3Cpath d='M13 16H7'%3E%3C/path%3E%3Ccircle cx='19' cy='8' r='2'%3E%3C/circle%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.stream-item.post-zapiski:not([data-category-icon])::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Cpath d='M9 12l2 2 4-4'%3E%3C/path%3E%3Cpath d='M21 12c.552 0 1-.448 1-1V5c0-.552-.448-1-1-1h-4l-2-2H9L7 4H3c-.552 0-1 .448-1 1v6c0 .552.448 1 1 1'%3E%3C/path%3E%3Cpath d='M3 12v6c0 .552.448 1 1 1h16c.552 0 1-.448 1-1v-6'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.stream-item::before:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px color-mix(in oklab, var(--fz-fg) 15%, transparent);
}

/* === STYLE DLA NOWYCH TYPÓW TREŚCI === */


/* === HEADERY Z BADGAMI PO PRAWEJ STRONIE === */


/* Header dla bloków z badge'ami */
.stefan-header,
.zapiski-header,
.podcast-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--fz-spacing-sm);
}

/* Badge'y dla różnych typów */
.stefan-badge {
  background: var(--category-color, #f59e0b);
  color: var(--icon-color, #ffffff);
}

.zapiski-badge {
  background: var(--category-color, #06b6d4);
  color: var(--icon-color, #ffffff);
}

.podcast-badge {
  background: var(--category-color, #8b5cf6);
  color: var(--icon-color, #ffffff);
}

/* Podsumowanie header */
.podsumowanie-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--fz-spacing-md);
  margin-bottom: var(--fz-spacing-sm);
}

.day-info {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.podsumowanie-badge {
  display: inline-block;
  background: var(--category-color, #ef4444);
  color: var(--icon-color, #ffffff);
  padding: 0.15rem 0.5rem;
  border-radius: 8px;
  font-size: 0.7rem;
  font-weight: 500;
  text-transform: lowercase;
  letter-spacing: 0.025em;
  white-space: nowrap;
}

/* === DODATKOWE STYLE DLA NOWYCH TYPÓW TREŚCI === */

/* === PODCASTS (PODCASTY) - WYRÓŻNIONY EMBED I GRADIENT === */
.stream-item.post-podcast,
.stream-item.post-podcasts {
  position: relative;
  background: linear-gradient(
    to bottom,
    color-mix(in oklab, var(--category-color, #8b5cf6) 5%, var(--fz-bg)),
    var(--fz-bg)
  );
  border-radius: 16px;
  padding: var(--fz-spacing-lg);
  padding-left: calc(var(--fz-content-padding) + var(--fz-icon-size) + var(--fz-spacing-sm) + var(--fz-spacing-md));
  margin-bottom: calc(var(--fz-spacing-xl) * 1.5);
  border: 1px solid color-mix(in oklab, var(--category-color, #8b5cf6) 15%, transparent);
  transition: all 0.3s ease;
}

.stream-item.post-podcast:hover {
  border-color: color-mix(in oklab, var(--category-color, #8b5cf6) 25%, transparent);
  box-shadow: 0 8px 24px color-mix(in oklab, var(--category-color, #8b5cf6) 8%, transparent);
  transform: translateY(-2px);
}

.stream-item.post-podcast::after {
  display: none;
}

.stream-item.post-podcast .podcast-header {
  margin-bottom: var(--fz-spacing-md);
}

.stream-item.post-podcast .podcast-badge {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.3rem 0.7rem;
  border-radius: 12px;
  letter-spacing: 0.03em;
  box-shadow: 0 2px 8px color-mix(in oklab, var(--category-color, #8b5cf6) 20%, transparent);
}

.stream-item.post-podcast iframe[src*="spotify.com"] {
  margin: var(--fz-spacing-lg) 0;
  border-radius: 12px;
  box-shadow: 0 4px 16px color-mix(in oklab, var(--fz-fg) 10%, transparent);
}

/* === CONVERSATIONS WITH STEFAN (ROZMOWY ZE STEFANEM) - Q&A LAYOUT === */
.stream-item.post-stefan,
.stream-item.post-conversations-with-stefan {
  background: linear-gradient(
    135deg,
    color-mix(in oklab, var(--category-color, #f59e0b) 5%, var(--fz-bg)),
    var(--fz-bg)
  );
  border-radius: 12px;
  padding: var(--fz-spacing-lg);
  padding-left: calc(var(--fz-content-padding) + var(--fz-icon-size) + var(--fz-spacing-sm) + var(--fz-spacing-md));
  margin-bottom: calc(var(--fz-spacing-xl) * 1.5);
  border: 1px solid color-mix(in oklab, var(--category-color, #f59e0b) 15%, transparent);
  transition: all 0.3s ease;
}

.stream-item.post-stefan:hover {
  border-color: color-mix(in oklab, var(--category-color, #f59e0b) 20%, transparent);
  box-shadow: 0 6px 20px color-mix(in oklab, var(--category-color, #f59e0b) 8%, transparent);
}

.stream-item.post-stefan::after {
  display: none;
}

.stream-item.post-stefan .stefan-badge {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.3rem 0.7rem;
  border-radius: 12px;
  letter-spacing: 0.03em;
}

.stream-item.post-stefan .item-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.stream-item.post-stefan .item-title,
.stream-item.post-stefan .block-title {
  margin-bottom: var(--fz-spacing-sm);
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.3;
}

.stream-item.post-stefan .stefan-no-title {
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--fz-fg);
}

.stream-item.post-stefan .stefan-no-title a {
  color: var(--fz-fg);
  text-decoration: none;
}

.stream-item.post-stefan .stefan-no-title a:hover {
  color: var(--category-color, #f59e0b);
}

/* === NOTES (ZAPISKI) - STYL KARTECZKI/NOTKI === */
.stream-item.post-notes,
.stream-item.post-zapiski {
  background: var(--fz-bg);
  border-radius: 10px;
  padding: var(--fz-spacing-lg);
  padding-left: calc(var(--fz-content-padding) + var(--fz-icon-size) + var(--fz-spacing-sm) + var(--fz-spacing-md));
  margin-bottom: calc(var(--fz-spacing-xl) * 1.2);
  border: 2px solid color-mix(in oklab, var(--category-color, #06b6d4) 15%, transparent);
  box-shadow: 
    0 2px 8px color-mix(in oklab, var(--category-color, #06b6d4) 8%, transparent),
    inset 0 1px 0 color-mix(in oklab, white 40%, transparent);
  transition: all 0.3s ease;
  position: relative;
}

.stream-item.post-zapiski::before {
  /* Ikona timeline */
  z-index: 4;
}

.stream-item.post-zapiski::after {
  /* Delikatny accent w rogu - bookmark style */
  content: "";
  position: absolute;
  top: calc(var(--fz-spacing-lg) - 4px);
  right: var(--fz-spacing-md);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 12px 16px 12px;
  border-color: transparent transparent color-mix(in oklab, var(--category-color, #06b6d4) 25%, transparent) transparent;
  opacity: 0.6;
  transition: all var(--fz-transition-fast);
}

.stream-item.post-notes:hover,
.stream-item.post-zapiski:hover {
  border-color: color-mix(in oklab, var(--category-color, #06b6d4) 30%, transparent);
  box-shadow: 
    0 4px 16px color-mix(in oklab, var(--category-color, #06b6d4) 12%, transparent),
    inset 0 1px 0 color-mix(in oklab, white 60%, transparent);
  transform: translateY(-2px);
}

.stream-item.post-notes .notes-header,
.stream-item.post-zapiski .zapiski-header {
  margin-bottom: var(--fz-spacing-md);
}

.stream-item.post-notes .notes-badge,
.stream-item.post-zapiski .zapiski-badge {
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.25rem 0.6rem;
  border-radius: 10px;
  letter-spacing: 0.02em;
}

.stream-item.post-notes .block-title,
.stream-item.post-zapiski .block-title {
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.3;
}

.stream-item.post-notes .block-content,
.stream-item.post-zapiski .block-content {
  font-size: 1rem;
  line-height: 1.65;
}

/* Bloki bez tytułu */
.block-no-title {
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--fz-fg);
}

.block-no-title a {
  color: var(--fz-fg);
  text-decoration: none;
}

.block-no-title a:hover {
  color: var(--fz-accent);
}

/* Formatowanie rozmowy */
.stefan-conversation {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.stefan-question {
  margin: 0;
  padding: 0.75rem 1rem;
  background: color-mix(in oklab, var(--fz-bg) 50%, var(--fz-fg) 5%);
  border-left: 3px solid var(--fz-accent);
  border-radius: 0 8px 8px 0;
  font-style: italic;
}

.stefan-answer {
  margin: 0;
  padding: 1rem;
  background: color-mix(in oklab, var(--fz-bg) 30%, var(--fz-fg) 10%);
  border-left: 3px solid #f59e0b;
  border-radius: 0 8px 8px 0;
  position: relative;
}

.stefan-answer::before {
  content: "🤖";
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  font-size: 0.8rem;
  opacity: 0.7;
}

.stefan-preview {
  font-style: italic;
  color: color-mix(in oklab, var(--fz-fg) 80%, transparent);
}

/* Responsywność dla embedów i headerów */
@media (max-width: 768px) {
  /* Responsywne headery */
  .stefan-header,
  .podsumowanie-header,
  .zapiski-header,
  .podcast-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  
  .stefan-badge,
  .podsumowanie-badge,
  .zapiski-badge,
  .podcast-badge {
    align-self: flex-end;
  }
}

/* Hover efekty dla nowych typów */

.stream-item.post-stefan:hover .stefan-badge {
  background: color-mix(in oklab, var(--fz-accent) 30%, transparent);
  transform: scale(1.05);
  transition: all 0.2s ease;
}

.stream-item.post-zapiski:hover .zapiski-badge {
  background: color-mix(in oklab, #06b6d4 80%, black);
  transform: scale(1.05);
  transition: all 0.2s ease;
}

.stream-item.post-podcast:hover .podcast-badge {
  background: color-mix(in oklab, #8b5cf6 80%, black);
  transform: scale(1.05);
  transition: all 0.2s ease;
}

/* === TREŚĆ WPISÓW - UJEDNOLICONY SYSTEM BLOKÓW === */
.item-content,
.block-content {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--fz-fg);
  margin: 0;
  /* Twarde wyrównanie - pierwsza linia zawsze na poziomie ikony */
  padding-top: 0;
  margin-top: 0;
}

/* Ujednolicone odstępy między nagłówkiem a treścią */
.block-header {
  margin-bottom: var(--fz-spacing-sm);
}

.block-title {
  font-size: 1.1rem;
  line-height: 1.4;
  margin: 0;
  color: var(--fz-fg);
}

.block-title a {
  color: var(--fz-fg);
  text-decoration: none;
}

.block-title a:hover {
  color: var(--fz-accent);
}

.block-badge {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 8px;
  font-size: 0.7rem;
  font-weight: 500;
  text-transform: lowercase;
  letter-spacing: 0.025em;
  white-space: nowrap;
  color: white;
}

.block-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fz-spacing-xs);
  margin: 0;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
}

.block-tag {
  display: inline-block;
  padding: 2px var(--fz-spacing-xs);
  background: color-mix(in oklab, var(--fz-surface) 70%, transparent);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  border-radius: 4px;
  font-size: 0.75rem;
  color: var(--fz-fg);
  text-decoration: none;
  transition: all 0.2s ease;
  text-transform: lowercase;
}

.block-tag:hover {
  background: color-mix(in oklab, var(--fz-accent) 15%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 30%, transparent);
  color: var(--fz-accent);
}

/* System ukrywania nadmiarowych tagów */
.block-tags.has-many-tags .block-tag:nth-child(n+9) {
  display: none;
}

.block-tags.has-many-tags.expanded .block-tag {
  display: inline-block;
}

.tags-show-more {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 2px var(--fz-spacing-sm);
  background: color-mix(in oklab, var(--fz-accent) 8%, transparent);
  border: 1px solid color-mix(in oklab, var(--fz-accent) 20%, transparent);
  border-radius: 12px;
  font-size: 0.7rem;
  color: var(--fz-accent);
  text-decoration: none;
  cursor: pointer;
  transition: all var(--fz-transition-fast);
  font-weight: 600;
  white-space: nowrap;
}

.tags-show-more:hover {
  background: color-mix(in oklab, var(--fz-accent) 15%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 40%, transparent);
}

.tags-show-more .count {
  font-weight: 700;
}

.block-tags.expanded .tags-show-more {
  display: none;
}

.block-more-indicator {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.75rem;
  color: var(--fz-muted);
  background: var(--fz-surface);
  padding: 2px 8px;
  border-radius: 12px;
  border: 1px solid var(--fz-muted);
  text-decoration: none;
  transition: all 0.2s ease;
  margin-left: 8px;
}

.block-more-indicator:hover {
  color: var(--fz-accent);
  border-color: var(--fz-accent);
  background: color-mix(in oklab, var(--fz-accent) 10%, var(--fz-surface));
  text-decoration: none;
}

.block-more-indicator .word-count {
  font-weight: 500;
}

.block-more-indicator .more-text {
  color: var(--fz-accent);
  font-weight: 600;
}

/* === MIKROWPISY - WYRÓŻNIONY STYL === */
.stream-item.post-micro {
  background: linear-gradient(
    135deg,
    color-mix(in oklab, var(--category-color, var(--fz-accent)) 6%, var(--fz-bg)),
    color-mix(in oklab, var(--category-color, var(--fz-accent)) 2%, var(--fz-bg))
  );
  border-radius: 12px;
  padding: var(--fz-spacing-md);
  padding-left: calc(var(--fz-content-padding) + var(--fz-icon-size) + var(--fz-spacing-sm) + var(--fz-spacing-xs));
  margin-bottom: var(--fz-spacing-lg);
  border: 1px solid color-mix(in oklab, var(--category-color, var(--fz-accent)) 12%, transparent);
  transition: all 0.3s ease;
}

.stream-item.post-micro:hover {
  background: linear-gradient(
    135deg,
    color-mix(in oklab, var(--category-color, var(--fz-accent)) 8%, var(--fz-bg)),
    color-mix(in oklab, var(--category-color, var(--fz-accent)) 3%, var(--fz-bg))
  );
  border-color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 25%, transparent);
  transform: translateX(2px);
  box-shadow: 0 2px 12px color-mix(in oklab, var(--category-color, var(--fz-accent)) 12%, transparent);
}

/* Mikrowpisy nie mają pseudo-borderu */
.stream-item.post-micro::after {
  display: none;
}

.micro-text {
  display: block;
  font-size: 0.95rem;
  line-height: 1.7;
}

/* Pierwszy akapit z czasem */
.micro-text .micro-first-para {
  margin: 0 0 0.8em 0;
}

/* Pozostałe akapity */
.micro-text p {
  margin: 0 0 0.8em 0;
}

.micro-text p:last-child {
  margin-bottom: 0;
}

/* Dyskretne linki inline (tagi, wspomnienia) w mikrowpisach */
.micro-text a:not(.micro-time):not(.journal-permalink) {
  color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 70%, var(--fz-fg));
  text-decoration: none;
  border-bottom: 1px solid color-mix(in oklab, var(--category-color, var(--fz-accent)) 25%, transparent);
  transition: all var(--fz-transition-fast);
  font-weight: 500;
}

.micro-text a:not(.micro-time):not(.journal-permalink):hover {
  color: var(--category-color, var(--fz-accent));
  border-bottom-color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 60%, transparent);
}

.micro-text strong,
.micro-text b {
  font-weight: 700;
  color: var(--fz-fg);
}

.micro-text em,
.micro-text i {
  font-style: italic;
  color: var(--fz-fg);
}

.micro-text code {
  font-family: 'SF Mono', 'Monaco', monospace;
  background: color-mix(in oklab, var(--category-color, var(--fz-accent)) 8%, transparent);
  padding: 0.1em 0.3em;
  border-radius: 3px;
  font-size: 0.9em;
}

/* Wspomnienia (mentions) w mikrowpisach */
.micro-text .mention-link,
.micro-text span[class*="mention"] {
  display: inline !important;
  color: var(--category-color, var(--fz-accent));
  font-weight: 500;
}

/* Headingi w mikrowpisach */
.micro-text h2,
.micro-text h3,
.micro-text h4 {
  font-size: 1.1rem;
  font-weight: 700;
  margin: 1.2em 0 0.6em 0;
  line-height: 1.3;
}

/* Listy w mikrowpisach */
.micro-text ul,
.micro-text ol {
  margin: 0.8em 0;
  padding-left: 1.5em;
}

.micro-text li {
  margin-bottom: 0.3em;
}

.micro-time {
  text-decoration: none;
  color: var(--category-color, var(--fz-accent));
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.02em;
  transition: all 0.2s ease;
}

.micro-time:hover {
  color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 80%, black);
}

/* === MICROJOURNALS (MIKRODZIENNIKI) - KOMPAKTOWY STYL === */
.stream-item.post-mikrodziennik,
.stream-item.post-microjournals {
  background: color-mix(in oklab, var(--category-color, var(--fz-accent)) 4%, var(--fz-bg));
  border-radius: 8px;
  padding: var(--fz-spacing-sm) var(--fz-spacing-md);
  padding-left: calc(var(--fz-content-padding) + var(--fz-icon-size) + var(--fz-spacing-sm) + var(--fz-spacing-xs));
  margin-bottom: var(--fz-spacing-md);
  border-left: 3px solid color-mix(in oklab, var(--category-color, var(--fz-accent)) 40%, transparent);
  transition: all 0.3s ease;
}

.stream-item.post-mikrodziennik:hover {
  background: color-mix(in oklab, var(--category-color, var(--fz-accent)) 6%, var(--fz-bg));
  border-left-color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 60%, transparent);
  transform: translateX(2px);
}

/* Mikrodzienniki nie mają pseudo-borderu */
.stream-item.post-mikrodziennik::after {
  display: none;
}

.journal-cat {
  color: var(--category-color, var(--fz-accent));
  font-weight: 700;
  letter-spacing: 0.01em;
  transition: all 0.2s ease;
}

.journal-cat:hover {
  color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 80%, black);
}

/* Wyrównanie mikrodzienników - INLINE CAŁOŚĆ (inaczej niż mikrowpisy) */
.stream-item.post-mikrodziennik .block-content {
  display: block;
  margin: 0;
  padding: 0;
}

.stream-item.post-mikrodziennik .micro-text {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle;
}

.stream-item.post-mikrodziennik .micro-text p {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
}

.stream-item.post-mikrodziennik .micro-text p:first-child {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Mikrodzienniki - format "kategoria: treść" w jednej linii - WYSOKA SPECYFICZNOŚĆ */
.stream-item.post-mikrodziennik .journal-cat {
  display: inline !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
}
.stream-item.post-mikrodziennik .journal-permalink {
  display: inline !important;
  margin-left: 0.25rem !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Usuń wszystkie marginesy i paddingi dla mikrodzienników */
/* UWAGA: nie stosuj globalnego inline do wszystkich potomków,
   bo rozwala to przyciski udostępniania/like (Jetpack). */
.stream-item.post-mikrodziennik .block-content p,
.stream-item.post-mikrodziennik .block-content ul,
.stream-item.post-mikrodziennik .block-content ol,
.stream-item.post-mikrodziennik .block-content li,
.stream-item.post-mikrodziennik .block-content a.journal-permalink,
.stream-item.post-mikrodziennik .block-content .journal-cat {
  margin: 0 !important;
  padding: 0 !important;
  display: inline !important;
}

/* Przywróć domyślny układ dla kontenerów Jetpacka w mikrodziennikach */
.stream-item.post-mikrodziennik .block-content .sharedaddy,
.stream-item.post-mikrodziennik .block-content .sd-sharing-enabled,
.stream-item.post-mikrodziennik .block-content .post-likes-widget,
.stream-item.post-mikrodziennik .block-content .wpl-likebox,
.stream-item.post-mikrodziennik .block-content .jetpack-likes-widget-wrapper {
  display: block !important;
  margin-top: 0.5rem !important;
}

.journal-permalink {
  color: var(--fz-muted);
  text-decoration: none;
  margin-left: var(--fz-spacing-xs);
}

/* === ARTICLES (ARTYKUŁY) - CZYSTY, CZYTELNY LAYOUT === */
.stream-item.post-article,
.stream-item.post-articles {
  padding-top: var(--fz-spacing-md);
  padding-bottom: calc(var(--fz-spacing-xl) * 1.2);
}

.stream-item.post-article .block-header {
  margin-bottom: var(--fz-spacing-md);
}

.stream-item.post-article .block-title {
  font-size: 1.75rem;
  line-height: 1.3;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 var(--fz-spacing-md) 0;
}

.stream-item.post-article .block-title a {
  color: var(--fz-fg);
  text-decoration: none;
  transition: color 0.2s ease;
  position: relative;
}

.stream-item.post-article .block-title a::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 2px;
  background: var(--category-color, var(--fz-accent));
  transition: width 0.3s ease;
}

.stream-item.post-article .block-title a:hover {
  color: var(--category-color, var(--fz-accent));
}

.stream-item.post-article .block-title a:hover::before {
  width: 100%;
}

.stream-item.post-article .block-content {
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--fz-fg);
}

.stream-item.post-article .block-content p {
  margin-bottom: 1.2em;
}

/* Dyskretne linki inline (tagi, wspomnienia) w artykułach - WYKLUCZAMY .more-link */
.stream-item.post-article .block-content a:not(.more-link),
.stream-item.post-articles .block-content a:not(.more-link),
.stream-item.post-podcast .block-content a:not(.more-link),
.stream-item.post-podcasts .block-content a:not(.more-link),
.stream-item.post-stefan .block-content a:not(.more-link),
.stream-item.post-conversations-with-stefan .block-content a:not(.more-link),
.stream-item.post-zapiski .block-content a:not(.more-link),
.stream-item.post-notes .block-content a:not(.more-link),
.stream-item .item-content a:not(.more-link),
.block-content a:not(.more-link) {
  color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 70%, var(--fz-fg));
  text-decoration: none;
  border-bottom: 1px solid color-mix(in oklab, var(--category-color, var(--fz-accent)) 25%, transparent);
  transition: all var(--fz-transition-fast);
  font-weight: 500;
}

.stream-item.post-article .block-content a:not(.more-link):hover,
.stream-item.post-articles .block-content a:not(.more-link):hover,
.stream-item.post-podcast .block-content a:not(.more-link):hover,
.stream-item.post-podcasts .block-content a:not(.more-link):hover,
.stream-item.post-stefan .block-content a:not(.more-link):hover,
.stream-item.post-conversations-with-stefan .block-content a:not(.more-link):hover,
.stream-item.post-zapiski .block-content a:not(.more-link):hover,
.stream-item.post-notes .block-content a:not(.more-link):hover,
.stream-item .item-content a:not(.more-link):hover,
.block-content a:not(.more-link):hover {
  color: var(--category-color, var(--fz-accent));
  border-bottom-color: color-mix(in oklab, var(--category-color, var(--fz-accent)) 60%, transparent);
}

/* Hierarchia nagłówków w treści artykułów */
.stream-item.post-article .block-content h2 {
  font-size: 1.35rem;
  font-weight: 700;
  margin-top: 1.8em;
  margin-bottom: 0.8em;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.stream-item.post-article .block-content h3 {
  font-size: 1.15rem;
  font-weight: 600;
  margin-top: 1.5em;
  margin-bottom: 0.6em;
  line-height: 1.4;
}

.stream-item.post-article .block-content h4 {
  font-size: 1.05rem;
  font-weight: 600;
  margin-top: 1.2em;
  margin-bottom: 0.5em;
  line-height: 1.4;
}

/* Zastosuj te same style dla wszystkich typów wpisów z treścią */
.block-content h2 {
  font-size: 1.35rem;
  font-weight: 700;
  margin-top: 1.8em;
  margin-bottom: 0.8em;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.block-content h3 {
  font-size: 1.15rem;
  font-weight: 600;
  margin-top: 1.5em;
  margin-bottom: 0.6em;
  line-height: 1.4;
}

.block-content h4 {
  font-size: 1.05rem;
  font-weight: 600;
  margin-top: 1.2em;
  margin-bottom: 0.5em;
  line-height: 1.4;
}

/* === GRADIENT FADE NA KOŃCU TREŚCI (pokazuje że jest więcej) === */
.block-content:has(.more-link),
.item-content:has(.more-link) {
  position: relative;
  padding-bottom: var(--fz-spacing-md);
}

.block-content:has(.more-link)::after,
.item-content:has(.more-link)::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: linear-gradient(
    to bottom,
    transparent,
    var(--fz-bg) 75%
  );
  pointer-events: none;
  z-index: 1;
}

/* === KONTENER DLA "READ MORE" (hint + przycisk) === */
.more-link-wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: flex-start;
  margin-top: var(--fz-spacing-md);
  margin-bottom: var(--fz-spacing-xs);
  position: relative;
  z-index: 2;
}

/* === HINT - informacja o długości === */
.more-link-hint {
  color: color-mix(in oklab, var(--fz-fg) 55%, transparent);
  font-style: italic;
  font-weight: 400;
  font-size: 0.75rem;
  letter-spacing: 0;
  line-height: 1.4;
}

/* === PRZYCISK "READ MORE" - STYL JAK BADGE === */
.more-link,
a.more-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.3rem 0.65rem;
  background: var(--category-color, var(--fz-accent));
  color: var(--icon-color, white) !important;
  border: none !important;
  border-radius: 10px;
  text-decoration: none !important;
  font-weight: 600;
  font-size: 0.7rem;
  transition: all var(--fz-transition-fast);
  text-transform: lowercase;
  letter-spacing: 0.02em;
  box-shadow: 0 1px 3px color-mix(in oklab, var(--category-color, var(--fz-accent)) 20%, transparent);
}

.more-link::after,
a.more-link::after {
  content: "→";
  font-size: 0.75rem;
  transition: transform var(--fz-transition-fast);
  margin-left: 0.1rem;
}

.more-link:hover,
a.more-link:hover {
  background: color-mix(in oklab, var(--category-color, var(--fz-accent)) 85%, black);
  transform: translateY(-1px);
  box-shadow: 0 2px 6px color-mix(in oklab, var(--category-color, var(--fz-accent)) 30%, transparent);
}

.more-link:hover::after,
a.more-link:hover::after {
  transform: translateX(2px);
}

/* Wrapper dla treści i tagów */
.block-footer {
  display: flex;
  flex-direction: column;
  gap: var(--fz-spacing-md);
  margin-top: var(--fz-spacing-md);
}

/* Artykuły - uniwersalna klasa dla tytułów */
.item-title {
  font-size: 1.1rem;
  line-height: 1.4;
  margin: 0 0 var(--fz-spacing-xs) 0;
  color: var(--fz-fg);
}

.item-title a {
  color: var(--fz-fg);
  text-decoration: none;
}

.item-title a:hover {
  color: var(--fz-accent);
}

/* === SUMMARIES (PODSUMOWANIA DNIA) - NAJBARDZIEJ WYRÓŻNIAJĄCY SIĘ TYP === */
.stream-item.post-podsumowanie,
.stream-item.post-summaries {
  background: linear-gradient(
    to bottom right,
    color-mix(in oklab, #ef4444 6%, var(--fz-bg)),
    var(--fz-bg)
  );
  border-radius: 16px;
  padding: var(--fz-spacing-xl);
  padding-left: calc(var(--fz-content-padding) + var(--fz-icon-size) + var(--fz-spacing-sm) + var(--fz-spacing-lg));
  margin-bottom: calc(var(--fz-spacing-xl) * 2);
  border: 2px solid color-mix(in oklab, #ef4444 18%, transparent);
  box-shadow: 0 4px 20px color-mix(in oklab, #ef4444 12%, transparent);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.stream-item.post-podsumowanie::before {
  /* Ikona timeline */
  z-index: 5;
  box-shadow: 0 4px 12px color-mix(in oklab, #ef4444 25%, transparent);
}

.stream-item.post-podsumowanie::after {
  /* Delikatny pattern w tle */
  content: "";
  position: absolute;
  top: -50%;
  right: -10%;
  width: 200px;
  height: 200px;
  background: radial-gradient(
    circle,
    color-mix(in oklab, #ef4444 8%, transparent),
    transparent 70%
  );
  z-index: 0;
  pointer-events: none;
}

.stream-item.post-podsumowanie:hover {
  border-color: color-mix(in oklab, #ef4444 30%, transparent);
  box-shadow: 0 8px 32px color-mix(in oklab, #ef4444 15%, transparent);
  transform: translateY(-3px);
}

.stream-item.post-podsumowanie .podsumowanie-header {
  position: relative;
  z-index: 2;
  padding: var(--fz-spacing-md);
  margin: calc(var(--fz-spacing-md) * -1);
  margin-bottom: var(--fz-spacing-lg);
  background: linear-gradient(
    135deg,
    color-mix(in oklab, #ef4444 8%, var(--fz-bg)),
    color-mix(in oklab, #ef4444 3%, var(--fz-bg))
  );
  border-radius: 12px;
  border: 1px solid color-mix(in oklab, #ef4444 12%, transparent);
}

.stream-item.post-podsumowanie .podsumowanie-badge {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.4rem 0.8rem;
  border-radius: 12px;
  letter-spacing: 0.03em;
  box-shadow: 0 2px 8px color-mix(in oklab, #ef4444 25%, transparent);
}

.stream-item.post-podsumowanie .podsumowanie-gablota {
  position: relative;
  z-index: 2;
  font-size: 1.1rem;
  line-height: 1.7;
  font-style: italic;
  color: var(--fz-fg);
  margin-bottom: var(--fz-spacing-lg);
  padding: var(--fz-spacing-md);
  background: color-mix(in oklab, var(--fz-surface) 40%, transparent);
  border-radius: 10px;
  border-left: 4px solid #ef4444;
}

.stream-item.post-podsumowanie .podsumowanie-module-preview {
  position: relative;
  z-index: 2;
  margin-bottom: var(--fz-spacing-md);
  padding: var(--fz-spacing-md);
  background: color-mix(in oklab, var(--fz-surface) 30%, transparent);
  border-radius: 10px;
  border-left: 3px solid color-mix(in oklab, #ef4444 40%, transparent);
}

.stream-item.post-podsumowanie .podsumowanie-more-indicator {
  position: relative;
  z-index: 2;
  text-align: center;
  margin-top: var(--fz-spacing-lg);
  padding-top: var(--fz-spacing-lg);
  border-top: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
}

.stream-item.post-podsumowanie .read-full-summary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 1.2rem;
  background: #ef4444;
  color: white;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9rem;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px color-mix(in oklab, #ef4444 30%, transparent);
}

.stream-item.post-podsumowanie .read-full-summary:hover {
  background: color-mix(in oklab, #ef4444 85%, black);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px color-mix(in oklab, #ef4444 40%, transparent);
}

.stream-item.post-podsumowanie .read-full-summary svg {
  transition: transform 0.3s ease;
}

.stream-item.post-podsumowanie .read-full-summary:hover svg {
  transform: translateX(3px);
}

/* Nadpisanie starych stylów wtyczki */
.post-podsumowanie,
.podsumowanie {
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  transition: none !important;
  transform: none !important;
}

/* Wyjątek: CPT Podsumowanie dnia – zawsze czerwony */
.stream-item.post-podsumowanie,
.podsumowanie {
  --category-color: #ef4444;
}

/* Usuń wszystkie efekty hover z wtyczki */
.post-podsumowanie:hover,
.podsumowanie:hover,
.strumien-zycia .podsumowanie:hover,
.archive-podsumowanie .podsumowanie:hover {
  transform: none !important;
  box-shadow: none !important;
  background: none !important;
}

/* Usuń wszystkie ramki z wtyczki Podsumowań */
.strumien-zycia .podsumowanie,
.archive-podsumowanie .podsumowanie {
  border: none !important;
}

/* Usuń wszystkie ramki z innych wpisów */
.stream-item,
.item-content,
.micro-text,
.artykul-zajawka {
  border: none !important;
  box-shadow: none !important;
}

/* Usuń efekty hover z wszystkich wpisów */
.stream-item:hover,
.item-content:hover,
.micro-text:hover,
.artykul-zajawka:hover {
  transform: none !important;
  box-shadow: none !important;
  background: none !important;
}

/* Usuń konfliktujące style z wtyczki */
.stream-item.post-podsumowanie .podsumowanie-header {
  margin-top: var(--fz-spacing-md) !important;
  margin-bottom: var(--fz-spacing-sm) !important;
}

.day-number {
  font-size: 1rem;
  font-weight: 600;
  color: var(--fz-fg);
}

.day-status {
  font-size: 0.8rem;
}

.day-date {
  font-size: 0.8rem;
  color: var(--fz-muted);
}

.patreon-lock-icon {
  font-size: 0.7rem;
  color: var(--fz-muted);
}

.podsumowanie-indicator {
  font-size: 0.75rem;
  color: var(--fz-muted);
  font-style: italic;
  margin-left: auto;
}

/* Tytuł podsumowania */
.podsumowanie-title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 var(--fz-spacing-xs) 0;
  color: var(--fz-fg);
}

.podsumowanie-title a {
  color: var(--fz-fg);
  text-decoration: none;
}

.podsumowanie-title a:hover {
  color: var(--fz-accent);
}

/* Gablota - kawałek na stronie głównej */
.podsumowanie-gablota {
  font-style: italic;
  color: var(--fz-muted);
  margin: var(--fz-spacing-xs) 0;
  font-size: 0.9rem;
  line-height: 1.6;
}

/* Moduły na stronie pojedynczego wpisu */
.podsumowanie-module {
  margin: var(--fz-spacing-md) 0;
  padding: var(--fz-spacing-sm);
  background: color-mix(in oklab, var(--fz-surface) 30%, transparent);
  border-radius: var(--fz-radius);
  border-left: 3px solid var(--fz-accent);
}

.module-title {
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0 0 var(--fz-spacing-xs) 0;
  color: var(--fz-accent);
  text-transform: lowercase;
}

.module-content {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--fz-fg);
}

/* === TAGS I WSKAŹNIKI - WYRÓWNANE DO LEWEJ === */
.item-footer {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: var(--fz-spacing-sm);
  gap: var(--fz-spacing-sm);
}

.item-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fz-spacing-xs);
  margin: 0;
  justify-content: flex-start;
  align-items: flex-start;
}

.item-tag {
  display: inline-block;
  padding: 2px var(--fz-spacing-xs);
  background: color-mix(in oklab, var(--fz-surface) 70%, transparent);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  border-radius: 4px;
  font-size: 0.75rem;
  color: var(--fz-fg);
  text-decoration: none;
  transition: all 0.2s ease;
  text-transform: lowercase;
}

.item-tag:hover {
  background: color-mix(in oklab, var(--fz-accent) 15%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 30%, transparent);
  color: var(--fz-accent);
}

/* === WSKAŹNIKI WIĘCEJ TREŚCI - MINIMALISTYCZNE === */
.content-more-indicator {
  margin: 0;
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--fz-spacing-xs);
  font-size: 0.8rem;
  color: var(--fz-muted);
  flex-shrink: 0;
}

.content-more-indicator a {
  color: var(--fz-accent);
  text-decoration: none;
  font-weight: 500;
}

.content-more-indicator a:hover {
  text-decoration: underline;
}

/* === OGRANICZENIE WYSOKOŚCI TREŚCI (ZACHOWUJE EMBEDY) === */
.content-height-limited {
  position: relative;
  overflow: hidden;
}

.content-height-limited .content-wrapper {
  position: relative;
}

.content-height-limited .content-fade {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  background: linear-gradient(transparent, var(--fz-bg));
  pointer-events: none;
  z-index: 1;
}

/* === WSKAŹNIK WIĘCEJ NA WYSOKOŚCI TAGÓW === */
.item-more-indicator {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.75rem;
  color: var(--fz-muted);
  background: var(--fz-surface);
  padding: 2px 8px;
  border-radius: 12px;
  border: 1px solid var(--fz-muted);
  text-decoration: none;
  transition: all 0.2s ease;
  margin-left: 8px;
}

.item-more-indicator:hover {
  color: var(--fz-accent);
  border-color: var(--fz-accent);
  background: color-mix(in oklab, var(--fz-accent) 10%, var(--fz-surface));
  text-decoration: none;
}

.item-more-indicator .word-count {
  font-weight: 500;
}

.item-more-indicator .more-text {
  color: var(--fz-accent);
  font-weight: 600;
}

/* === FUNKCJONALNOŚĆ ZWIJANIA === */
.stream-item.collapsed .item-tags {
  display: none;
}

.stream-item.collapsed .item-content {
  display: none;
}

/* === MARKERY CZASU - MINIMALISTYCZNE === */
.year-marker,
.month-marker {
  text-align: center;
  padding: var(--fz-spacing-sm);
  margin: var(--fz-spacing-lg) 0;
  font-size: 0.8rem;
  color: var(--fz-muted);
  background: color-mix(in oklab, var(--fz-surface) 40%, transparent);
  border-radius: var(--fz-radius);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
  text-transform: lowercase;
}

/* === RESPONSYWNOŚĆ === */
@media (max-width: 768px) {
  :root {
    --fz-content-padding: 12px;
    --fz-icon-size: 20px;
    --fz-spacing-md: 12px;
    --fz-spacing-lg: 16px;
  }
  
  .app-main {
    padding: 0 var(--fz-spacing-sm);
  }
  
  .stream-filters {
    padding: var(--fz-spacing-sm);
  }
  
  .filter-btn {
    padding: 4px var(--fz-spacing-xs);
    font-size: 0.8rem;
  }
  
  .day-separator {
    font-size: 0.9rem;
    margin: var(--fz-spacing-lg) 0 var(--fz-spacing-md) 0;
  }
  
  .day-label {
    padding: 4px var(--fz-spacing-xs);
    font-size: 0.8rem;
  }
}

/* === KOMUNIKAT O BRAKU WPISÓW === */
.no-posts-message {
  text-align: center;
  padding: var(--fz-spacing-xl) var(--fz-spacing-md);
  margin: var(--fz-spacing-lg) 0;
  background: color-mix(in oklab, var(--fz-surface) 40%, transparent);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  border-radius: var(--fz-radius);
}

.no-posts-content h3 {
  margin: 0 0 var(--fz-spacing-sm) 0;
  color: var(--fz-fg);
  font-size: 1.1rem;
  font-weight: 600;
}

.no-posts-content p {
  margin: 0 0 var(--fz-spacing-lg) 0;
  color: var(--fz-muted);
  font-size: 0.9rem;
  line-height: 1.5;
}

.no-posts-actions {
  display: flex;
  gap: var(--fz-spacing-sm);
  justify-content: center;
  flex-wrap: wrap;
}

.show-all-btn,
.load-more-btn {
  background: var(--fz-accent);
  color: white;
  border: none;
  padding: var(--fz-spacing-xs) var(--fz-spacing-md);
  border-radius: var(--fz-radius);
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  text-transform: lowercase;
}

.load-more-btn {
  background: color-mix(in oklab, var(--fz-muted) 70%, transparent);
  color: var(--fz-fg);
}

.show-all-btn:hover {
  background: color-mix(in oklab, var(--fz-accent) 80%, black);
  transform: translateY(-1px);
}

.load-more-btn:hover {
  background: color-mix(in oklab, var(--fz-muted) 50%, transparent);
  transform: translateY(-1px);
}

.no-more-posts {
  text-align: center;
  padding: var(--fz-spacing-lg);
  color: var(--fz-muted);
  font-style: italic;
  font-size: 0.9rem;
}

.loading-indicator {
  text-align: center;
  padding: var(--fz-spacing-lg);
  color: var(--fz-muted);
}

.loading-spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--fz-muted);
  border-radius: 50%;
  border-top-color: var(--fz-accent);
  animation: spin 1s ease-in-out infinite;
  margin-bottom: var(--fz-spacing-sm);
}

.no-more-posts-message,
.error-message {
  text-align: center;
  padding: var(--fz-spacing-lg);
  color: var(--fz-muted);
  font-style: italic;
  font-size: 0.9rem;
}

.error-message {
  color: #ef4444;
  background: color-mix(in oklab, #ef4444 10%, var(--fz-bg));
  border: 1px solid color-mix(in oklab, #ef4444 20%, transparent);
  border-radius: var(--fz-radius);
}

/* === JETPACK INFINITE SCROLL === */
.infinite-scroll .posts-navigation {
  display: none;
}

.infinite-scroll .infinite-loader {
  text-align: center;
  padding: var(--fz-spacing-lg);
}

.infinite-scroll .infinite-loader .spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid var(--fz-muted);
  border-radius: 50%;
  border-top-color: var(--fz-accent);
  animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ========================================
   EMBEDY WORDPRESS - UPROSZCZONE
   ======================================== */

/* Ogólne style dla embedów */
.item-content .wp-block-embed,
.micro-text .wp-block-embed {
  margin: 1rem 0;
  text-align: center;
}

/* YouTube embedy - proporcje 16:9 */
.item-content iframe[src*="youtube.com"],
.item-content iframe[src*="youtu.be"],
.micro-text iframe[src*="youtube.com"],
.micro-text iframe[src*="youtu.be"] {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  border-radius: var(--fz-radius);
  margin: 1rem 0;
  border: 0 !important;
  display: block;
}

/* Spotify embedy - kompaktowe */
.item-content iframe[src*="spotify.com"],
.micro-text iframe[src*="spotify.com"],
.wp-block-embed iframe[src*="spotify.com"] {
  width: 100% !important;
  height: 152px !important;
  border-radius: var(--fz-radius);
  margin: 1rem 0;
  border: 0 !important;
  display: block;
}

/* Napraw wrapper dla Spotify */
.wp-block-embed.wp-block-embed-spotify,
.wp-block-embed.wp-embed-aspect-1-1 {
  margin: 1rem 0 !important;
}

.wp-block-embed.wp-block-embed-spotify .wp-block-embed__wrapper,
.wp-block-embed.wp-embed-aspect-1-1 .wp-block-embed__wrapper {
  position: relative !important;
  width: 100% !important;
  height: 152px !important;
  padding-top: 0 !important;
}

.wp-block-embed.wp-block-embed-spotify .wp-block-embed__wrapper::before,
.wp-block-embed.wp-embed-aspect-1-1 .wp-block-embed__wrapper::before {
  display: none !important;
  content: none !important;
  padding-top: 0 !important;
  height: 0 !important;
}

/* Inne embedy - domyślne proporcje */
.item-content .wp-block-embed iframe:not([src*="youtube.com"]):not([src*="youtu.be"]):not([src*="spotify.com"]),
.micro-text .wp-block-embed iframe:not([src*="youtube.com"]):not([src*="youtu.be"]):not([src*="spotify.com"]) {
  width: 100% !important;
  height: auto !important;
  min-height: 200px !important;
  border-radius: var(--fz-radius);
  border: 0 !important;
  display: block;
}

/* === PRZYCISKI (używane m.in. w podglądzie Patreon) === */
/* Grupa przycisków logowania/odblokowania */
.locked-actions {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  margin-top: var(--fz-spacing-xs);
}

.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  color: var(--fz-fg);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 15%, transparent);
  border-radius: 999px;
  text-decoration: none;
  font-size: 0.85rem;
  line-height: 1;
  transition: all 0.2s ease;
}

.btn:hover {
  background: color-mix(in oklab, var(--fz-surface) 80%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 30%, transparent);
}

.btn-outline {
  background: transparent;
  color: var(--fz-fg);
  border: 1.5px solid color-mix(in oklab, var(--fz-fg) 30%, transparent);
}

.btn-outline:hover {
  background: color-mix(in oklab, var(--fz-surface) 70%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 40%, transparent);
}

/* Wyróżnienie dla akcji premium */
.btn-accent {
  background: var(--fz-accent);
  color: #fff;
  border-color: var(--fz-accent);
  box-shadow: 0 1px 4px color-mix(in oklab, var(--fz-accent) 30%, transparent);
}

.btn-accent:hover {
  background: color-mix(in oklab, var(--fz-accent) 90%, black);
  border-color: color-mix(in oklab, var(--fz-accent) 90%, black);
}

.btn-xs {
  padding: 8px 16px;
  font-size: 0.9rem;
  font-weight: 500;
  border-radius: 8px;
  background: var(--fz-accent);
  color: #fff;
  border: 1px solid var(--fz-accent);
  box-shadow: 0 2px 8px color-mix(in oklab, var(--fz-accent) 20%, transparent);
  transition: all 0.2s ease;
}

.btn-xs:hover {
  background: color-mix(in oklab, var(--fz-accent) 90%, black);
  border-color: color-mix(in oklab, var(--fz-accent) 90%, black);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px color-mix(in oklab, var(--fz-accent) 30%, transparent);
}

/* Kontener przycisku "załaduj więcej" */
.fz-infinite-handle {
  text-align: center;
  padding: 2rem 0;
  margin: 2rem 0;
}

/* Paginacja – wygląd minimalistyczny */
.navigation.pagination {
  display: flex;
  gap: var(--fz-spacing-xs);
  align-items: center;
  justify-content: center;
  margin: var(--fz-spacing-lg) 0;
}

.navigation.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid color-mix(in oklab, var(--fz-fg) 15%, transparent);
  border-radius: 8px;
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  color: var(--fz-fg);
  text-decoration: none;
  font-size: 0.9rem;
  transition: all 0.2s ease;
}

.navigation.pagination .page-numbers.current {
  background: var(--fz-accent);
  border-color: var(--fz-accent);
  color: #fff;
}

.navigation.pagination .page-numbers:hover {
  border-color: color-mix(in oklab, var(--fz-accent) 40%, transparent);
}

/* Uchwyt prostego infinite */
.fz-infinite-handle {
  display: flex;
  justify-content: center;
  margin: var(--fz-spacing-md) 0 var(--fz-spacing-lg) 0;
}

/* === SINGLE: PODSUMOWANIE DNIA === */
.podsumowanie-view { display:flex; justify-content:center; padding-top: 32px; }
.podsumowanie-article { width:100%; max-width: 760px; margin-left: auto; margin-right: auto; padding: 24px; padding-left: 24px !important; }

/* upewnij się, że nic nie wypycha w lewo */
.podsumowanie-article * { box-sizing: border-box; }
.podsumowanie-view .podsumowanie-header { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.podsumowanie-view .podsumowanie-meta { display: flex; align-items: center; gap: 10px; color: var(--fz-muted); font-size: .9rem; }
.podsumowanie-view .day-badge { display: inline-flex; align-items: center; gap: 6px; background: var(--fz-surface); border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent); border-radius: 999px; padding: 4px 10px; font-weight: 700; text-transform: lowercase; }
.podsumowanie-view .locked-badge { font-size: 1rem; opacity: .6; }
.podsumowanie-view .entry-title { font-size: clamp(1.6rem, 2.4vw, 2.2rem); line-height: 1.2; margin: 0; }
.podsumowanie-view .wyrok { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: .95rem; }
.podsumowanie-view .wyrok .wyrok-label { display: inline-block; border-radius: 8px; padding: 6px 10px; font-weight: 700; text-transform: lowercase; }
.podsumowanie-view .wyrok--good .wyrok-label { background: #ecfdf5; color: #065f46; }
.podsumowanie-view .wyrok--neutral .wyrok-label { background: #f3f4f6; color: #374151; }
.podsumowanie-view .wyrok--bad .wyrok-label { background: #fef2f2; color: #991b1b; }

.podsumowanie-view .entry-content { display: flex; flex-direction: column; gap: 22px; }
.podsumowanie-view .blok { background: var(--fz-bg); border: 1px solid #eaeef3; border-left: 4px solid #e5e7eb; border-radius: 14px; padding: 18px 20px; box-shadow: 0 2px 8px rgba(17,24,39,.03); }
.podsumowanie-view .blok h2 { margin: 0 0 10px 0; font-size: 1.08rem; letter-spacing: .2px; text-transform: lowercase; color: #111827; }
.podsumowanie-view .blok h2::after { content: ""; display:block; height:1px; background:#eef2f7; margin-top:8px; }
.podsumowanie-view .blok h3 { margin: 8px 0 6px 0; font-size: .92rem; text-transform: lowercase; color: #475569; font-weight: 600; }
.podsumowanie-view .blok p { margin: 0; color: var(--fz-fg); line-height: 1.7; }
.podsumowanie-view .blok-grid { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 10px; }
.podsumowanie-view .podblok { background: #fcfcfd; border: 1px solid #eef2f7; border-radius: 12px; padding: 12px; }
.podsumowanie-view .podblok h3 { opacity:.85 }

/* Akcenty kolorystyczne dla logicznych sekcji */
.podsumowanie-view #gablota.blok { border-left-color: #06b6d4; background: linear-gradient(0deg, rgba(6,182,212,.04), rgba(6,182,212,0)); }
.podsumowanie-view #sen.blok { border-left-color: #3b82f6; background: linear-gradient(0deg, rgba(59,130,246,.04), rgba(59,130,246,0)); }
.podsumowanie-view #aktywnosc.blok { border-left-color: #10b981; background: linear-gradient(0deg, rgba(16,185,129,.04), rgba(16,185,129,0)); }
.podsumowanie-view #stres.blok { border-left-color: #ef4444; background: linear-gradient(0deg, rgba(239,68,68,.04), rgba(239,68,68,0)); }
.podsumowanie-view #srodowisko.blok { border-left-color: #8b5cf6; background: linear-gradient(0deg, rgba(139,92,246,.05), rgba(139,92,246,0)); }
.podsumowanie-view #wnioski.blok { border-left-color: #0ea5e9; }
.podsumowanie-view #notatki.blok { border-left-color: #94a3b8; }

/* Czytelniejsze oddzielenie bloków na desktopie */
.podsumowanie-view .blok + .blok { scroll-margin-top: 84px; }

@media (min-width: 720px){
  .podsumowanie-view .blok-grid{grid-template-columns:1fr 1fr}
  .podsumowanie-view .blok-grid .podblok{position:relative}
  .podsumowanie-view .blok-grid .podblok + .podblok{border-left-color:#e5e7eb}
}

@media (min-width: 720px) {
  .podsumowanie-view .blok-grid { grid-template-columns: 1fr 1fr; }
}

.podsumowanie-view .post-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 20px; }
.podsumowanie-view .post-nav a { display: inline-block; border: 1px solid #e5e7eb; border-radius: 10px; padding: 8px 12px; color: var(--fz-fg); text-decoration: none; background: var(--fz-bg); }
.podsumowanie-view .post-nav a:hover { background: #f9fafb; }

/* Spis treści i progres */
.podsumowanie-view .podsumowanie-toc { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 14px; }
.podsumowanie-view .toc-chip { display:inline-flex; align-items:center; padding:6px 10px; border:1px solid color-mix(in oklab, var(--fz-fg) 12%, transparent); border-radius:999px; text-decoration:none; color:var(--fz-fg); background:color-mix(in oklab, var(--fz-surface) 60%, transparent); font-size:.85rem; text-transform:lowercase }
.podsumowanie-view .toc-chip:hover { border-color: var(--fz-accent); color: var(--fz-accent); }

.podsumowanie-view .progress-wrap { display:flex; flex-direction:column; gap:6px; margin-top:8px }
.podsumowanie-view .progress-label { font-size:.82rem; color:var(--fz-muted); text-transform:lowercase }
.podsumowanie-view .podsumowanie-progress { position:relative; height:8px; background: #f3f4f6; border-radius:999px; overflow:hidden; }
.podsumowanie-view .podsumowanie-progress__bar { position:absolute; left:0; top:0; bottom:0; width: var(--pct,0); background: linear-gradient(90deg, #10b981, #3b82f6); }
.podsumowanie-view .podsumowanie-progress__label { display:block; margin-top:6px; font-size:.8rem; color:var(--fz-muted) }

.podsumowanie-view .project-pill { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border:1px solid color-mix(in oklab, var(--fz-fg) 12%, transparent); border-radius:999px; font-size:.8rem; color:var(--fz-fg); background:color-mix(in oklab, var(--fz-surface) 60%, transparent); text-transform:lowercase }

/* ========================================
   KOMENTARZE - MINIMALISTYCZNY DESIGN
   ======================================== */

.comments-section {
  margin-top: var(--fz-spacing-xl);
  padding-top: var(--fz-spacing-xl);
  border-top: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
}

.comments-header {
  margin-bottom: var(--fz-spacing-lg);
}

.comments-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--fz-fg);
  margin: 0;
  text-transform: lowercase;
}

.comments-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.comments-list .comment-item {
  margin-bottom: var(--fz-spacing-lg);
  padding: 0;
}

.comment-body {
  display: flex;
  gap: var(--fz-spacing-md);
  align-items: flex-start;
}

.comment-avatar {
  flex-shrink: 0;
}

.comment-avatar img {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}

.comment-content {
  flex: 1;
  min-width: 0;
}

.comment-meta {
  display: flex;
  align-items: center;
  gap: var(--fz-spacing-sm);
  margin-bottom: var(--fz-spacing-sm);
  flex-wrap: wrap;
}

.comment-author {
  font-weight: 600;
  color: var(--fz-fg);
  font-style: normal;
  text-decoration: none;
}

.comment-author a {
  color: inherit;
  text-decoration: none;
}

.comment-author a:hover {
  color: var(--fz-accent);
}

.comment-time {
  font-size: 0.85rem;
  color: var(--fz-muted);
  text-decoration: none;
}

.comment-time a {
  color: inherit;
  text-decoration: none;
}

.comment-time a:hover {
  color: var(--fz-accent);
}

.edit-link {
  font-size: 0.85rem;
}

.edit-link a {
  color: var(--fz-muted);
  text-decoration: none;
}

.edit-link a:hover {
  color: var(--fz-accent);
}

.comment-text {
  margin-bottom: var(--fz-spacing-sm);
  line-height: 1.6;
}

.comment-text p {
  margin: 0 0 var(--fz-spacing-sm) 0;
}

.comment-text p:last-child {
  margin-bottom: 0;
}

.comment-actions {
  font-size: 0.85rem;
}

.comment-actions .reply a {
  color: var(--fz-muted);
  text-decoration: none;
  font-weight: 500;
}

.comment-actions .reply a:hover {
  color: var(--fz-accent);
}

/* Komentarze zagnieżdżone */
.comments-list .children {
  list-style: none;
  margin: var(--fz-spacing-lg) 0 0 0;
  padding-left: var(--fz-spacing-lg);
  border-left: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
}

.comments-list .children .comment-body {
  gap: var(--fz-spacing-sm);
}

.comments-list .children .comment-avatar img {
  width: 32px;
  height: 32px;
}

/* Paginacja komentarzy */
.comments-pagination {
  margin-top: var(--fz-spacing-xl);
  padding-top: var(--fz-spacing-lg);
  border-top: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
}

.comments-pagination-inner {
  display: flex;
  justify-content: center;
}

.comments-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  margin: 0 2px;
  border: 1px solid color-mix(in oklab, var(--fz-fg) 12%, transparent);
  border-radius: 8px;
  color: var(--fz-fg);
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 500;
  transition: all 0.15s ease;
}

.comments-pagination .page-numbers:hover,
.comments-pagination .page-numbers.current {
  background: var(--fz-accent);
  border-color: var(--fz-accent);
  color: white;
}

/* Formularz komentarza */
.comment-form {
  margin-top: var(--fz-spacing-xl);
  padding-top: var(--fz-spacing-xl);
  border-top: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
}

.comment-form h3 {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--fz-fg);
  margin: 0 0 var(--fz-spacing-lg) 0;
  text-transform: lowercase;
}

.comment-form-comment,
.comment-form-author,
.comment-form-email,
.comment-form-url {
  margin-bottom: var(--fz-spacing-md);
}

.comment-form-comment textarea,
.comment-form-author input,
.comment-form-email input,
.comment-form-url input {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid color-mix(in oklab, var(--fz-fg) 12%, transparent);
  border-radius: var(--fz-radius);
  background: var(--fz-bg);
  color: var(--fz-fg);
  font-size: 0.95rem;
  line-height: 1.5;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  box-sizing: border-box;
}

.comment-form-comment textarea:focus,
.comment-form-author input:focus,
.comment-form-email input:focus,
.comment-form-url input:focus {
  outline: none;
  border-color: var(--fz-accent);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--fz-accent) 10%, transparent);
}

.comment-form-comment textarea {
  min-height: 120px;
  resize: vertical;
}

.comment-notes {
  font-size: 0.85rem;
  color: var(--fz-muted);
  margin: var(--fz-spacing-md) 0;
  text-transform: lowercase;
}

.must-log-in,
.logged-in-as {
  font-size: 0.9rem;
  color: var(--fz-muted);
  margin-bottom: var(--fz-spacing-md);
}

.must-log-in a,
.logged-in-as a {
  color: var(--fz-accent);
  text-decoration: none;
}

.must-log-in a:hover,
.logged-in-as a:hover {
  text-decoration: underline;
}

.submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  background: var(--fz-accent);
  color: white;
  border: none;
  border-radius: var(--fz-radius);
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s ease, transform 0.1s ease;
  text-transform: lowercase;
}

.submit-btn:hover {
  background: color-mix(in oklab, var(--fz-accent) 85%, black);
  transform: translateY(-1px);
}

.submit-btn:active {
  transform: translateY(0);
}

/* Responsywność */
@media (max-width: 640px) {
  .comment-body {
    gap: var(--fz-spacing-sm);
  }
  
  .comment-avatar img {
    width: 32px;
    height: 32px;
  }
  
  .comment-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  
  .comments-list .children {
    padding-left: var(--fz-spacing-md);
  }
  
  .comments-list .children .comment-avatar img {
    width: 28px;
    height: 28px;
  }
}

/* ========================================
   STOPKA - OSOBISTA I ZAPRASZAJĄCA
   ======================================== */

.app-footer {
  margin-top: calc(var(--fz-spacing-3xl) * 1.5);
  background: linear-gradient(
    to bottom,
    var(--fz-bg),
    color-mix(in oklab, var(--fz-surface) 50%, var(--fz-bg))
  );
  color: var(--fz-fg);
  position: relative;
  overflow: hidden;
  border-top: 2px solid color-mix(in oklab, var(--fz-accent) 15%, transparent);
}

.app-footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  height: 2px;
  background: linear-gradient(
    to right,
    transparent,
    var(--fz-accent),
    transparent
  );
}

/* Hero Section */
.footer-hero {
  padding: calc(var(--fz-spacing-xl) * 2) 0;
  border-bottom: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
  position: relative;
  z-index: 1;
}

.hero-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(var(--fz-spacing-xl) * 2);
  align-items: center;
}

.hero-quote {
  text-align: left;
}

.quote-text {
  font-size: 1.4rem;
  font-weight: 300;
  line-height: 1.3;
  margin: 0 0 var(--fz-spacing-sm) 0;
  font-style: italic;
  color: var(--fz-fg);
  max-height: 3.6rem; /* Maksymalnie 3 linie */
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  position: relative;
}

.quote-text::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 20px;
  height: 1.3em;
  background: linear-gradient(to right, transparent, color-mix(in oklab, var(--fz-bg) 95%, var(--fz-fg)));
  pointer-events: none;
}

.quote-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: var(--fz-spacing-xs);
  font-size: 0.85rem;
  color: var(--fz-accent);
  text-decoration: none;
  transition: color 0.2s ease;
}

.quote-link:hover {
  color: var(--fz-fg);
}

.quote-link::after {
  content: '→';
  font-size: 0.9rem;
  transition: transform 0.2s ease;
}

.quote-link:hover::after {
  transform: translateX(2px);
}

.quote-author {
  font-size: 1rem;
  color: var(--fz-muted);
  margin: 0;
  font-weight: 500;
}

.hero-cta {
  text-align: center;
}

.hero-cta h3 {
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0 0 var(--fz-spacing-sm) 0;
  color: var(--fz-fg);
}

.hero-cta p {
  font-size: 1rem;
  color: var(--fz-muted);
  margin: 0 0 var(--fz-spacing-lg) 0;
  line-height: 1.5;
}

/* Pozioma nawigacja */
.footer-navigation-horizontal {
  padding: var(--fz-spacing-lg) 0;
  border-bottom: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
  position: relative;
  z-index: 1;
}

.horizontal-nav {
  text-align: center;
}

.horizontal-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: calc(var(--fz-spacing-lg) * 2);
  flex-wrap: wrap;
}

.horizontal-menu li {
  margin: 0;
}

.horizontal-menu a {
  color: var(--fz-fg);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 500;
  transition: all 0.2s ease;
  padding: var(--fz-spacing-sm) var(--fz-spacing-md);
  border-radius: var(--fz-radius);
  position: relative;
}

.horizontal-menu a:hover {
  color: var(--fz-accent);
  background: color-mix(in oklab, var(--fz-accent) 10%, transparent);
}

/* Main Content Grid - 3 kolumny */
.footer-main {
  padding: calc(var(--fz-spacing-xl) * 2) 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: calc(var(--fz-spacing-xl) * 1.5);
  position: relative;
  z-index: 1;
}

.footer-section h4 {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 var(--fz-spacing-lg) 0;
  color: var(--fz-fg);
  text-transform: lowercase;
  letter-spacing: 0.05em;
}

/* Sekcja O mnie */
.footer-about .section-header {
  display: flex;
  align-items: center;
  gap: var(--fz-spacing-md);
  margin-bottom: var(--fz-spacing-lg);
}

.footer-about .author-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: color-mix(in oklab, var(--fz-accent) 15%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid color-mix(in oklab, var(--fz-accent) 20%, transparent);
}

.footer-about .author-initial {
  font-size: 1rem;
  font-weight: 600;
  color: var(--fz-accent);
}

.about-text {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--fz-fg);
  margin: 0 0 var(--fz-spacing-lg) 0;
}

.social-links {
  display: flex;
  gap: var(--fz-spacing-sm);
}

.social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  text-decoration: none;
  transition: all 0.2s ease;
}

.social-link:hover {
  background: color-mix(in oklab, var(--fz-accent) 15%, transparent);
  border-color: color-mix(in oklab, var(--fz-accent) 30%, transparent);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px color-mix(in oklab, var(--fz-accent) 20%, transparent);
}

.social-icon {
  font-size: 1rem;
  line-height: 1;
}

/* Nawigacja */
.footer-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--fz-spacing-sm);
}

.footer-menu li {
  margin: 0;
}

.footer-menu a {
  color: var(--fz-fg);
  text-decoration: none;
  font-size: 0.95rem;
  transition: all 0.2s ease;
  display: block;
  padding: 4px 0;
  position: relative;
}

.footer-menu a:hover {
  color: var(--fz-accent);
  transform: translateX(4px);
}

.footer-menu a::before {
  content: '→';
  position: absolute;
  left: -16px;
  opacity: 0;
  transition: all 0.2s ease;
}

.footer-menu a:hover::before {
  opacity: 1;
  left: -12px;
}

/* Popularne wpisy */
.popular-posts {
  display: flex;
  flex-direction: column;
  gap: var(--fz-spacing-md);
}

.popular-post-link {
  display: block;
  text-decoration: none;
  padding: var(--fz-spacing-sm);
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  border-radius: var(--fz-radius);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  transition: all 0.2s ease;
}

.popular-post-link:hover {
  background: color-mix(in oklab, var(--fz-accent) 15%, transparent);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px color-mix(in oklab, var(--fz-accent) 20%, transparent);
}

.post-title {
  display: block;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--fz-fg);
  margin-bottom: 2px;
  line-height: 1.3;
}

.post-date {
  display: block;
  font-size: 0.8rem;
  color: var(--fz-muted);
}

/* Narzędzia */
.tools-list {
  display: flex;
  flex-direction: column;
  gap: var(--fz-spacing-sm);
}

.tool-link {
  display: flex;
  align-items: center;
  gap: var(--fz-spacing-sm);
  text-decoration: none;
  padding: var(--fz-spacing-sm);
  background: color-mix(in oklab, var(--fz-surface) 60%, transparent);
  border-radius: var(--fz-radius);
  border: 1px solid color-mix(in oklab, var(--fz-fg) 10%, transparent);
  transition: all 0.2s ease;
}

.tool-link:hover {
  background: color-mix(in oklab, var(--fz-accent) 15%, transparent);
  transform: translateX(4px);
}

.tool-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
}

.tool-name {
  font-size: 0.9rem;
  color: var(--fz-fg);
  font-weight: 500;
}

.tool-link:hover .tool-name {
  color: var(--fz-accent);
}

/* Stopka techniczna */
.footer-bottom {
  padding: var(--fz-spacing-lg) 0;
  border-top: 1px solid color-mix(in oklab, var(--fz-fg) 8%, transparent);
  position: relative;
  z-index: 1;
}

.footer-bottom-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--fz-spacing-md);
}

.copyright-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.copyright {
  font-size: 0.9rem;
  color: var(--fz-fg);
  font-weight: 500;
}

.tagline {
  font-size: 0.8rem;
  color: var(--fz-muted);
}

.legal-links {
  display: flex;
  gap: var(--fz-spacing-lg);
  flex-wrap: wrap;
}

.legal-links a {
  font-size: 0.85rem;
  color: var(--fz-muted);
  text-decoration: none;
  transition: color 0.2s ease;
}

.legal-links a:hover {
  color: var(--fz-accent);
}

/* Formularz newslettera w hero */
.hero-form .newsletter-input-group {
  display: flex;
  gap: var(--fz-spacing-sm);
  max-width: 100%;
}

.hero-form input[type="email"] {
  flex: 1;
  padding: 14px 18px;
  border: 2px solid color-mix(in oklab, var(--fz-fg) 15%, transparent);
  border-radius: var(--fz-radius);
  background: var(--fz-bg);
  color: var(--fz-fg);
  font-size: 1rem;
  transition: all 0.2s ease;
}

.hero-form input[type="email"]:focus {
  outline: none;
  border-color: var(--fz-accent);
  background: var(--fz-bg);
}

.hero-form input[type="email"]::placeholder {
  color: var(--fz-muted);
}

.hero-form button {
  padding: 14px 24px;
  background: var(--fz-accent);
  color: white;
  border: none;
  border-radius: var(--fz-radius);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  text-transform: lowercase;
  white-space: nowrap;
}

.hero-form button:hover {
  background: color-mix(in oklab, var(--fz-accent) 85%, black);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px color-mix(in oklab, var(--fz-accent) 30%, transparent);
}

/* Responsywność */
@media (max-width: 1024px) {
  .footer-main {
    grid-template-columns: repeat(2, 1fr);
    gap: calc(var(--fz-spacing-xl) * 1.2);
  }
  
  .hero-content {
    gap: calc(var(--fz-spacing-xl) * 1.5);
  }
  
  .horizontal-menu {
    gap: var(--fz-spacing-lg);
  }
}

@media (max-width: 768px) {
  .app-footer {
    margin-top: calc(var(--fz-spacing-xl) * 2);
  }
  
  .footer-hero {
    padding: calc(var(--fz-spacing-xl) * 1.5) 0;
  }
  
  .hero-content {
    grid-template-columns: 1fr;
    gap: var(--fz-spacing-xl);
    text-align: center;
  }
  
  .hero-quote {
    text-align: center;
  }
  
  .quote-text {
    font-size: 1.5rem;
  }
  
  .footer-navigation-horizontal {
    padding: var(--fz-spacing-md) 0;
  }
  
  .horizontal-menu {
    flex-direction: column;
    gap: var(--fz-spacing-sm);
  }
  
  .horizontal-menu a {
    padding: var(--fz-spacing-sm);
  }
  
  .footer-main {
    grid-template-columns: 1fr;
    gap: calc(var(--fz-spacing-xl) * 1.5);
    padding: var(--fz-spacing-xl) 0;
  }
  
  .footer-section h4 {
    font-size: 0.95rem;
  }
  
  .hero-form .newsletter-input-group {
    flex-direction: column;
  }
  
  .hero-form button {
    width: 100%;
  }
  
  .footer-bottom-content {
    flex-direction: column;
    text-align: center;
    gap: var(--fz-spacing-sm);
  }
  
  .legal-links {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .quote-text {
    font-size: 1.3rem;
  }
  
  .hero-cta h3 {
    font-size: 1.3rem;
  }
  
  .footer-section h4 {
    font-size: 0.9rem;
  }
  
  .about-text {
    font-size: 0.9rem;
  }
  
  .post-title {
    font-size: 0.85rem;
  }
  
  .tool-name {
    font-size: 0.85rem;
  }
}