:root {
  color-scheme: dark;
  --bg: #070a12;
  --bg-radial: radial-gradient(circle at 50% -10%, rgba(46, 120, 255, 0.18), transparent 70%), radial-gradient(circle at 100% 60%, rgba(57, 198, 255, 0.08), transparent 50%);
  --surface: rgba(14, 21, 37, 0.75);
  --surface-solid: #0e1525;
  --surface-hover: rgba(22, 33, 58, 0.85);
  --border: rgba(255, 255, 255, 0.09);
  --border-strong: rgba(57, 198, 255, 0.35);
  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --text-dim: #64748b;
  --accent: #39C6FF;
  --accent-gradient: linear-gradient(135deg, #39C6FF 0%, #4C6FFF 100%);
  --badge-bg: rgba(57, 198, 255, 0.12);
  --badge-color: #39C6FF;
  --card-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  --glass-blur: blur(20px);
}

body[data-theme="light"] {
  color-scheme: light;
  --bg: #f8fafc;
  --bg-radial: radial-gradient(circle at 50% -10%, rgba(57, 140, 255, 0.08), transparent 70%), radial-gradient(circle at 100% 60%, rgba(57, 198, 255, 0.04), transparent 50%);
  --surface: #ffffff;
  --surface-solid: #ffffff;
  --surface-hover: #f1f5f9;
  --border: rgba(0, 0, 0, 0.08);
  --border-strong: rgba(2, 132, 199, 0.3);
  --text-main: #0f172a;
  --text-muted: #475569;
  --text-dim: #94a3b8;
  --accent: #0284c7;
  --accent-gradient: linear-gradient(135deg, #0284c7 0%, #4f46e5 100%);
  --badge-bg: rgba(2, 132, 199, 0.08);
  --badge-color: #0284c7;
  --card-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
  --glass-blur: blur(16px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  background-image: var(--bg-radial);
  background-attachment: fixed;
  color: var(--text-main);
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

.pyn-shell {
  width: min(1280px, calc(100% - 48px));
  margin: 0 auto;
}

.pyn-doc-shell {
  width: min(880px, calc(100% - 48px));
  margin: 0 auto;
}

/* TOP NAVBAR */
.pyn-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  width: 100%;
  background: rgba(7, 10, 18, 0.82);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border-bottom: 1px solid var(--border);
  transition: background 0.2s ease, border-color 0.2s ease;
}
body[data-theme="light"] .pyn-nav {
  background: rgba(248, 250, 252, 0.85);
  border-color: rgba(0, 0, 0, 0.08);
}
.pyn-nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
  width: min(1280px, calc(100% - 48px));
  margin: 0 auto;
  gap: 20px;
}
.pyn-nav-logo img {
  height: 28px;
  width: auto;
  display: block;
}
.pyn-nav-center {
  display: flex;
  align-items: center;
  gap: 32px;
}
.pyn-nav-center a {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--text-muted);
  transition: color 0.15s ease;
}
.pyn-nav-center a:hover {
  color: var(--text-main);
}
.pyn-nav-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}
.pyn-theme-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.04);
  cursor: pointer;
  color: var(--text-main);
  transition: all 0.15s ease;
}
.pyn-theme-btn:hover {
  background: var(--surface-hover);
  border-color: var(--border-strong);
}
.pyn-theme-btn img {
  width: 17px;
  height: 17px;
}
body[data-theme="dark"] .theme-moon,
body:not([data-theme]) .theme-moon { display: none; }
body[data-theme="dark"] .theme-sun,
body:not([data-theme]) .theme-sun { display: block; }
body[data-theme="light"] .theme-sun { display: none; }
body[data-theme="light"] .theme-moon { display: block; }

.pyn-nav-login {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-main);
  padding: 8px 14px;
  border-radius: 8px;
  transition: background 0.15s ease;
}
.pyn-nav-login:hover {
  background: rgba(255, 255, 255, 0.06);
}
body[data-theme="light"] .pyn-nav-login:hover {
  background: rgba(0, 0, 0, 0.05);
}
.pyn-cta-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  border-radius: 999px;
  background: var(--accent-gradient);
  color: #ffffff !important;
  font-size: 13.5px;
  font-weight: 750;
  box-shadow: 0 4px 16px rgba(57, 198, 255, 0.28);
  transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.15s ease;
}
.pyn-cta-pill:hover {
  transform: translateY(-1px);
  filter: brightness(1.1);
  box-shadow: 0 6px 22px rgba(57, 198, 255, 0.38);
}

/* HERO */
.pyn-hero {
  padding: 56px 0 36px;
  border-bottom: 1px solid var(--border);
  text-align: center;
}
.pyn-hero h1 {
  max-width: 800px;
  margin: 0 auto 14px;
  font-size: 42px;
  font-weight: 850;
  letter-spacing: -0.04em;
  line-height: 1.15;
  font-family: 'Manrope', sans-serif;
  color: var(--text-main);
}
.pyn-hero p {
  max-width: 680px;
  margin: 0 auto 28px;
  font-size: 17px;
  color: var(--text-muted);
  line-height: 1.6;
}
.pyn-quick-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 14px;
  font-weight: 600;
}
.pyn-quick-link {
  color: var(--text-muted);
  transition: color 0.15s ease;
  text-decoration: none;
}
.pyn-quick-link:hover {
  color: var(--accent);
}
.pyn-nav-divider {
  color: var(--border-strong);
  user-select: none;
  font-weight: 300;
  opacity: 0.6;
}

/* LEGAL CARD / ARTICLE */
.pyn-legal-container {
  padding: 56px 0 80px;
}
.pyn-policy-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 38px 44px;
  box-shadow: var(--card-shadow);
}
.pyn-policy-card h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--text-main);
}
.pyn-policy-date {
  display: inline-block;
  color: var(--badge-color);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin: 8px 0 24px;
}
.pyn-policy-card h3 {
  margin: 32px 0 10px;
  font-size: 16px;
  font-weight: 750;
  color: var(--text-main);
  letter-spacing: -0.01em;
}
.pyn-policy-card p {
  margin: 0 0 14px;
  color: var(--text-muted);
  font-size: 14.5px;
  line-height: 1.7;
}
.pyn-policy-card ul {
  margin: 0 0 18px 24px;
  color: var(--text-muted);
  font-size: 14.5px;
  line-height: 1.7;
}
.pyn-policy-card li {
  margin-bottom: 6px;
}
.pyn-callout {
  margin-top: 28px;
  padding: 16px 20px;
  border-radius: 12px;
  border-left: 3px solid var(--accent);
  background: var(--badge-bg);
  color: var(--text-main) !important;
  font-size: 13.5px !important;
  line-height: 1.6;
}

/* Exact Platform Footer */
  .pynokio-footer {
position: relative;
z-index: 2;
width: 100%;
margin-top: 80px;
padding: 48px 24px 24px;
background: #080e1c !important;
border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
color: rgba(210, 224, 245, 0.65) !important;
box-sizing: border-box;
text-align: left;
  }
  .pynokio-footer-grid {
display: grid;
grid-template-columns: 1.2fr repeat(4, 1fr);
gap: 40px;
width: 100%;
max-width: 1320px;
margin: 0 auto;
box-sizing: border-box;
  }
  .pynokio-footer-brand { display: inline-flex; margin-bottom: 14px; }
  .pynokio-footer-brand img { display: block; width: auto; height: 28px; filter: none !important; }
  .pynokio-footer-tagline { max-width: 220px; margin: 0; color: rgba(210, 224, 245, 0.55); font-size: 13px; font-weight: 500; line-height: 1.5; }
  .pynokio-footer-heading { margin: 0 0 16px; color: #ffffff !important; font-size: 13px; font-weight: 800; letter-spacing: 0.02em; text-transform: uppercase; }
  .pynokio-footer-links { display: flex; flex-direction: column; gap: 10px; }
  .pynokio-footer a { color: rgba(210, 224, 245, 0.65); font-size: 13.5px; font-weight: 600; text-decoration: none; transition: color .2s ease; }
  .pynokio-footer a:hover { color: #39C6FF !important; }
  .pynokio-footer-socials { display: flex; gap: 8px; margin-top: 16px; }
  .pynokio-footer-socials a { display: inline-grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 50%; color: #ffffff; text-decoration: none; }
  .pynokio-footer-socials a:hover { background: rgba(255, 255, 255, 0.08); border-color: rgba(57, 198, 255, 0.4); color: #39C6FF !important; }
  .pynokio-footer-bottom {
display: flex;
justify-content: space-between;
gap: 16px;
width: 100%;
max-width: 1320px;
margin: 36px auto 0;
padding-top: 20px;
border-top: 1px solid rgba(255, 255, 255, 0.08);
font-size: 12px;
color: rgba(210, 224, 245, 0.45);
box-sizing: border-box;
  }
  @media (max-width: 900px) { .pynokio-footer-grid { grid-template-columns: repeat(2, 1fr); gap: 28px; } }
  @media (max-width: 560px) { .pynokio-footer { margin-top: 48px; padding: 36px 20px 24px; } .pynokio-footer-grid { grid-template-columns: 1fr; gap: 24px; } .pynokio-footer-bottom { flex-direction: column; gap: 12px; } }

  /* Light mode footer */
  body[data-theme="light"] .pynokio-footer,
  [data-theme="light"] .pynokio-footer {
background: #ffffff !important;
border-top: 1px solid rgba(15, 28, 51, 0.08) !important;
color: rgba(20, 32, 58, 0.65) !important;
  }
  body[data-theme="light"] .pynokio-footer-tagline,
  [data-theme="light"] .pynokio-footer-tagline { color: rgba(20, 32, 58, 0.55) !important; }
  body[data-theme="light"] .pynokio-footer-heading,
  [data-theme="light"] .pynokio-footer-heading { color: #10131a !important; }
  body[data-theme="light"] .pynokio-footer a,
  [data-theme="light"] .pynokio-footer a { color: rgba(20, 32, 58, 0.65) !important; }
  body[data-theme="light"] .pynokio-footer a:hover,
  [data-theme="light"] .pynokio-footer a:hover { color: #1a56db !important; }
  body[data-theme="light"] .pynokio-footer-socials a,
  [data-theme="light"] .pynokio-footer-socials a { border-color: rgba(15, 28, 51, 0.15) !important; color: #10131a !important; }
  body[data-theme="light"] .pynokio-footer-socials a:hover,
  [data-theme="light"] .pynokio-footer-socials a:hover { background: rgba(15, 28, 51, 0.06) !important; border-color: rgba(47, 127, 240, 0.4) !important; }
  body[data-theme="light"] .pynokio-footer-bottom,
  [data-theme="light"] .pynokio-footer-bottom { border-top: 1px solid rgba(15, 28, 51, 0.08) !important; color: rgba(20, 32, 58, 0.45) !important; }
  /* --- Ujednolicenie wygladu z Blog / Models / Affiliate --- */
body[data-theme="light"] {
  --bg: #fafaf8;                 /* to samo tlo co na Models i Affiliate */
  --bg-radial: none;             /* bez niebieskiej poswiaty */
}
body[data-theme="light"] .pyn-nav {
  background: rgba(250, 250, 248, 0.88);
  border-color: rgba(0, 0, 0, 0.07);
}
.pyn-nav-center a { font-size: 14px; font-weight: 600; }
.pyn-hero h1, .pyn-section-head h2 { font-family: 'Manrope', sans-serif; }
@media (max-width: 720px) {
  /* waskie ekrany: menu srodkowe chowamy, tak jak na Models/Affiliate */
  .pyn-nav-center { display: none; }
  .pyn-nav-inner { justify-content: space-between; }
}
/* Ciemny motyw: czarne logo trzeba odwrocic, inaczej ginie na tle */
body:not([data-theme="light"]) .pyn-nav-logo img,
body:not([data-theme="light"]) .pynokio-footer-brand img {
  filter: invert(1) brightness(1.6) !important;
}
/* Czarny przycisk "Get started" - identyczny jak na pozostalych stronach */
.pyn-cta-pill {
  padding: 9px 22px;
  background: #111111;
  color: #ffffff !important;
  font-size: 13.5px;
  font-weight: 700;
  box-shadow: none;
}
.pyn-cta-pill:hover {
  background: #2a2a2a;
  transform: none;
  filter: none;
  box-shadow: none;
}
body[data-theme="dark"] .pyn-cta-pill,
body:not([data-theme="light"]) .pyn-cta-pill {
  background: #ffffff;
  color: #111111 !important;
}
body[data-theme="dark"] .pyn-cta-pill:hover,
body:not([data-theme="light"]) .pyn-cta-pill:hover { background: #e8e8ea; }
/* top bar - the same as Affiliate and Pricing (zp-nav) */
.zp-nav{position:relative;display:flex;align-items:center;justify-content:space-between;width:min(1560px,calc(100vw - 32px));height:80px;margin:0 auto;padding:0 16px;z-index:20;font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:normal}
.zp-nav-logo{display:flex;align-items:center;line-height:1}
.zp-nav-logo img{height:32px;width:auto;filter:none}
.zp-nav-center{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:22px;padding:0}
.zp-nav-center a{display:inline-flex;align-items:center;padding:4px 0;font-size:14px;font-weight:600;color:#62626a;transition:color .16s ease;white-space:nowrap}
.zp-nav-center a:hover,.zp-nav-center a[aria-current="page"]{color:#0f1117}
.zp-nav-right{display:flex;align-items:center;gap:12px}
.zp-nav-btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 22px;border-radius:999px;background:#111111;color:#ffffff!important;font-size:13.5px;font-weight:700;letter-spacing:-.01em;border:1px solid #111111;cursor:pointer;text-decoration:none;transition:background .18s ease,border-color .18s ease}
.zp-nav-btn:hover{background:#2a2a2a;border-color:#2a2a2a}
body:not([data-theme="light"]) .zp-nav-logo img{filter:invert(1) brightness(1.6)}
body:not([data-theme="light"]) .zp-nav-center a{color:#a0a0a8}
body:not([data-theme="light"]) .zp-nav-center a:hover,body:not([data-theme="light"]) .zp-nav-center a[aria-current="page"]{color:#ffffff}
body:not([data-theme="light"]) .zp-nav-btn{background:#ffffff;border-color:#ffffff;color:#111111!important}
body:not([data-theme="light"]) .zp-nav-btn:hover{background:#e8e8ea;border-color:#e8e8ea}
@media (max-width:720px){.zp-nav-center{display:none}}
/* ==== Docs - one centred block: quiet index + content ==================== */
:root{--bg:#0c0c0e;--bg-radial:none;--surface:#131316;--surface-solid:#131316;--surface-hover:#17171a;--border:rgba(255,255,255,.08);--border-strong:rgba(255,255,255,.18);--text-main:#ededef;--text-muted:#a0a0a8;--text-dim:#6e6e76;--accent:#39C6FF;--card-shadow:none}
body[data-theme="light"]{--bg:#fbfbfa;--bg-radial:none;--surface:#f4f4f2;--surface-solid:#ffffff;--surface-hover:#f0f0ee;--border:rgba(0,0,0,.08);--border-strong:rgba(0,0,0,.18);--text-main:#18181b;--text-muted:#5b5b63;--text-dim:#9a9aa1;--accent:#0284c7;--card-shadow:none}
body{background:var(--bg);background-image:none}
.pyn-nav,body[data-theme="light"] .pyn-nav{border-bottom:0;background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none}
/* ==== Docs v2 - menu | tresc | spis tresci ================================ */
:root{--docs-card:#131316;--docs-code-bg:#0e0e11;--docs-code-text:#e7e7ea;--docs-mono:ui-monospace,SFMono-Regular,'Cascadia Code','Roboto Mono',Menlo,Consolas,monospace;--docs-pill:rgba(255,255,255,.06)}
body[data-theme="light"]{--docs-card:#ffffff;--docs-code-bg:#141417;--docs-code-text:#ececef;--docs-pill:rgba(0,0,0,.045)}
/* ta sama szerokosc i wciecie co gorna belka (.zp-nav): menu zaczyna sie pod logo, spis tresci konczy pod Get started */
.docs-shell{width:min(1560px,calc(100vw - 32px));margin:0 auto;padding:40px 16px 104px;display:grid;grid-template-columns:240px minmax(0,1fr);gap:72px;align-items:start}
.docs-shell.has-toc{grid-template-columns:240px minmax(0,1fr) 220px}

/* menu boczne */
.docs-index{position:sticky;top:24px;display:grid;gap:26px;margin-left:-10px;padding:8px 24px 8px 0;border-right:1px solid var(--border);min-height:calc(100vh - 160px);align-content:start}
.docs-group{display:grid;gap:2px}
.docs-group-title{margin:0 0 6px 10px;color:var(--text-main);font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.docs-index a{display:block;padding:6px 10px;border-radius:8px;color:var(--text-muted);font-size:14px;line-height:1.45;text-decoration:none;transition:color .15s ease,background .15s ease}
.docs-index a:hover{color:var(--text-main);background:var(--docs-pill)}
.docs-index a[aria-current="page"]{color:var(--text-main);background:var(--docs-pill);font-weight:600}

/* tresc */
.docs-main{width:100%;min-width:0;max-width:860px;margin:0 auto}
.docs-eyebrow{margin:0 0 12px!important;color:var(--text-dim)!important;font-size:13px!important;font-weight:600;letter-spacing:.01em;line-height:1.4!important}
.docs-main h1{margin:0 0 14px;color:var(--text-main);font:600 40px/1.12 'Manrope',sans-serif;letter-spacing:-.028em}
.docs-lead,.docs-main .detector-intro p{margin:0 0 14px;color:var(--text-muted);font-size:17.5px;line-height:1.65}
.docs-main .detector-intro p+p{font-size:15.5px}
.docs-meta{display:inline-flex;margin:4px 0 8px!important;padding:4px 11px;border:1px solid var(--border);border-radius:999px;color:var(--text-dim)!important;font-size:12.5px!important;line-height:1.5!important}
.docs-main h2{position:relative;margin:52px 0 14px;padding-top:40px;border-top:1px solid var(--border);color:var(--text-main);font:600 22px/1.35 'Manrope',sans-serif;letter-spacing:-.015em;scroll-margin-top:24px}
.docs-anchor{margin-left:10px;color:var(--text-dim)!important;font-weight:500;text-decoration:none!important;opacity:0;transition:opacity .15s ease}
.docs-main h2:hover .docs-anchor,.docs-anchor:focus-visible{opacity:1}
.docs-main h3{margin:0;color:var(--text-main);font:600 15.5px/1.45 'Plus Jakarta Sans',sans-serif}
.docs-main p,.docs-main li{color:var(--text-muted);font-size:15.5px;line-height:1.75}
.docs-main p{margin:0 0 16px}
.docs-main strong{color:var(--text-main);font-weight:600}
.docs-main ul{margin:0 0 18px;padding-left:20px}
.docs-main li{margin:6px 0}
.docs-main li::marker{color:var(--text-dim)}
.docs-main a{color:var(--text-main);text-decoration:underline;text-decoration-color:var(--border-strong);text-underline-offset:3px;transition:text-decoration-color .15s ease}
.docs-main a:hover{text-decoration-color:var(--text-main)}
.docs-main code{padding:2px 6px;border:1px solid var(--border);border-radius:6px;background:var(--docs-pill);color:var(--text-main);font:500 12.8px var(--docs-mono);overflow-wrap:anywhere}

/* naglowek strony (etykieta, tytul, opis, wersja) - wysrodkowany */
.docs-eyebrow,.docs-main h1{text-align:center}
/* .docs-main .docs-lead: silniejszy selektor niz .docs-main p, ktory zerowal marginesy auto */
.docs-main .docs-lead,.docs-main .detector-intro p{max-width:680px;margin-left:auto;margin-right:auto;text-align:center}
.docs-meta{display:flex;width:fit-content;margin-left:auto!important;margin-right:auto!important}
.docs-main .docs-header-note{text-align:center;font-size:14px}

/* strona glowna Docs - kafelki */
.docs-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 8px}
.docs-main a.docs-row{position:relative;display:grid;gap:6px;padding:18px 44px 18px 20px;border:1px solid var(--border);border-radius:14px;background:var(--docs-card);text-decoration:none;transition:border-color .15s ease,background .15s ease}
.docs-main a.docs-row:hover{border-color:var(--border-strong)}
.docs-row-title{color:var(--text-main);font-size:15px;font-weight:600}
.docs-row-note{color:var(--text-muted);font-size:14px;line-height:1.55}
.docs-row-arrow{position:absolute;top:18px;right:18px;color:var(--text-dim);transition:transform .15s ease,color .15s ease}
.docs-main a.docs-row:hover .docs-row-arrow{color:var(--text-main);transform:translateX(3px)}

/* karty informacyjne */
.docs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:4px 0 20px}
.docs-grid .docs-item{padding:18px 20px;border:1px solid var(--border);border-radius:14px;background:var(--docs-card)}
.docs-grid .docs-item p{margin:6px 0 0;font-size:14px;line-height:1.65}

/* notka */
.docs-note{margin:24px 0;padding:16px 18px;border:1px solid var(--border);border-radius:12px;background:var(--docs-pill);color:var(--text-muted);font-size:14.5px;line-height:1.7}
.docs-note strong{color:var(--text-main);font-weight:600}

/* tabele */
.docs-table-wrap{overflow-x:auto;margin:4px 0 20px;border:1px solid var(--border);border-radius:12px;background:var(--docs-card)}
.docs-table{width:100%;border-collapse:collapse;font-size:14px}
.docs-table th,.docs-table td{padding:12px 16px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top;line-height:1.55}
.docs-table tr:last-child th,.docs-table tr:last-child td{border-bottom:0}
.docs-table th{width:34%;color:var(--text-dim);font-weight:500}
.docs-table td{color:var(--text-main)}

/* kod */
.docs-code{position:relative;margin:4px 0 20px;padding:16px 84px 16px 18px;overflow-x:auto;border-radius:12px;background:var(--docs-code-bg);border:1px solid rgba(255,255,255,.06)}
.docs-main .docs-code code{padding:0;border:0;background:none;color:var(--docs-code-text);font:13px/1.7 var(--docs-mono);white-space:pre}
.docs-copy{position:absolute;top:10px;right:10px;padding:5px 11px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:rgba(255,255,255,.06);color:#d6d6db;font:500 12px 'Plus Jakarta Sans',sans-serif;cursor:pointer;transition:background .15s ease}
.docs-copy:hover{background:rgba(255,255,255,.12)}

/* modele */
.docs-filters{position:relative;display:flex;width:fit-content;max-width:100%;flex-wrap:wrap;gap:2px;margin:12px auto 4px;padding:3px;border:1px solid var(--border);border-radius:999px;background:var(--docs-pill)}
.docs-filter{padding:6px 14px;border:0;border-radius:999px;background:none;color:var(--text-muted);font:500 13.5px 'Plus Jakarta Sans',sans-serif;cursor:pointer;transition:color .15s ease,background .15s ease}
.docs-filter span{margin-left:4px;color:var(--text-dim);font-variant-numeric:tabular-nums}
.docs-filter:hover{color:var(--text-main)}
.docs-filter.active{color:var(--text-main);background:var(--docs-card);box-shadow:0 1px 2px rgba(0,0,0,.12)}
.docs-model-group[hidden]{display:none}
/* przesuwana pigulka pod aktywnym filtrem (dodaje ja docs.js) */
.docs-filter{position:relative;z-index:1}
.docs-filter-pill{position:absolute;top:0;left:0;z-index:0;border-radius:999px;background:var(--docs-card);box-shadow:0 1px 3px rgba(0,0,0,.14);pointer-events:none;transition:transform .38s cubic-bezier(.3,.7,.2,1),width .38s cubic-bezier(.3,.7,.2,1),height .38s ease}
.docs-filters.has-pill .docs-filter.active{background:none;box-shadow:none}
/* grupa modeli pojawia sie przy kazdej zmianie filtra */
.docs-model-group:not([hidden]){animation:docsGroupIn .42s cubic-bezier(.22,.61,.36,1) both}
.docs-model-group:not([hidden]) .docs-model{animation:docsGroupIn .42s cubic-bezier(.22,.61,.36,1) both}
.docs-model-group:not([hidden]) .docs-model:nth-child(2){animation-delay:.04s}
.docs-model-group:not([hidden]) .docs-model:nth-child(3){animation-delay:.08s}
.docs-model-group:not([hidden]) .docs-model:nth-child(4){animation-delay:.12s}
.docs-model-group:not([hidden]) .docs-model:nth-child(5){animation-delay:.16s}
@keyframes docsGroupIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.docs-filter-pill{transition:none}.docs-model-group:not([hidden]),.docs-model-group:not([hidden]) .docs-model{animation:none}}
.docs-models{border:1px solid var(--border);border-radius:14px;background:var(--docs-card);overflow:hidden}
.docs-model{padding:16px 20px;border-bottom:1px solid var(--border)}
.docs-model:last-child{border-bottom:0}
.docs-model-line{display:flex;align-items:center;justify-content:space-between;gap:16px}
.docs-model-line span{padding:2px 9px;border-radius:999px;background:var(--docs-pill);color:var(--text-dim);font-size:12px;white-space:nowrap}
.docs-model p{margin:4px 0 0;font-size:14px;line-height:1.6}
.docs-main .docs-model-specs{margin-top:6px;color:var(--text-dim);font:12px/1.6 var(--docs-mono)}

/* spis tresci po prawej */
.docs-toc{position:sticky;top:24px;display:grid;gap:2px;padding-top:8px}
.docs-toc-title{margin:0 0 8px;color:var(--text-dim);font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.docs-toc a{padding:4px 0 4px 12px;border-left:1px solid var(--border);color:var(--text-muted);font-size:13.5px;line-height:1.45;text-decoration:none;transition:color .15s ease,border-color .15s ease}
.docs-toc a:hover{color:var(--text-main)}
.docs-toc a[hidden]{display:none}
.docs-toc a.active{color:var(--text-main);border-left-color:var(--text-main)}


/* Overview: lista narzedzi, kroki, lista linkow - bez ramek */
.docs-features{margin:6px 0 8px;border-top:1px solid var(--border)}
.docs-features div{display:grid;grid-template-columns:210px minmax(0,1fr);gap:24px;padding:15px 0;border-bottom:1px solid var(--border)}
.docs-features dt{color:var(--text-main);font-size:15px;font-weight:600;line-height:1.65}
.docs-features dd{margin:0;color:var(--text-muted);font-size:15px;line-height:1.65}
.docs-steps{list-style:none;counter-reset:step;margin:10px 0 22px;padding:0}
.docs-main .docs-steps li{position:relative;margin:0;padding:4px 0 22px 50px;counter-increment:step}
.docs-steps li::before{content:counter(step);position:absolute;left:0;top:0;display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--border-strong);border-radius:50%;background:var(--bg);color:var(--text-main);font:600 13px 'Manrope',sans-serif}
.docs-steps li::after{content:"";position:absolute;left:16px;top:36px;bottom:4px;width:1px;background:var(--border)}
.docs-main .docs-steps li:last-child{padding-bottom:0}
.docs-steps li:last-child::after{display:none}
.docs-linklist{list-style:none;margin:6px 0 0;padding:0;border-top:1px solid var(--border)}
.docs-main .docs-linklist li{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:0;padding:14px 0;border-bottom:1px solid var(--border)}
.docs-main .docs-linklist a{color:var(--text-main);font-weight:600;text-decoration:none;white-space:nowrap}
.docs-main .docs-linklist a::after{content:"\2192";display:inline-block;margin-left:6px;color:var(--text-dim);transition:transform .2s ease,color .2s ease}
.docs-main .docs-linklist a:hover::after{color:var(--text-main);transform:translateX(3px)}
.docs-linklist span{color:var(--text-dim);font-size:14px;text-align:right}

/* audio detector */
:root{--pd-frame:#1e1e23;--pd-frame-line:rgba(255,255,255,.12);--pd-frame-shadow:0 24px 60px -32px rgba(0,0,0,.9);--pd-panel:#111114;--pd-drop:linear-gradient(180deg,#111114 0%,#0f0f12 100%);--pd-drop-hover:linear-gradient(180deg,#15161a 0%,#121215 100%);--pd-drop-line:rgba(255,255,255,.2);--pd-drop-line-hover:rgba(255,255,255,.38);--pd-drop-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 22px 50px -28px rgba(0,0,0,.9);--pd-btn:#1c1c20;--pd-btn-hover:#26262b;--pd-bar:rgba(255,255,255,.3);--pd-bar-off:rgba(255,255,255,.09);--pd-ok:#34d399;--pd-maybe:#fbbf24;--pd-err:#f87171;--pd-none:#a0a0a8}
body[data-theme="light"]{--pd-frame:#ffffff;--pd-frame-line:rgba(0,0,0,.09);--pd-frame-shadow:0 1px 2px rgba(15,23,42,.04),0 24px 50px -32px rgba(15,23,42,.3);--pd-panel:#f8f8f6;--pd-drop:linear-gradient(180deg,#f8f8f6 0%,#f5f5f3 100%);--pd-drop-hover:linear-gradient(180deg,#f4f5f6 0%,#f0f2f4 100%);--pd-drop-line:rgba(0,0,0,.2);--pd-drop-line-hover:rgba(0,0,0,.38);--pd-drop-shadow:0 1px 2px rgba(15,23,42,.04),0 24px 48px -30px rgba(15,23,42,.35);--pd-btn:#ffffff;--pd-btn-hover:#f1f1ef;--pd-bar:rgba(0,0,0,.26);--pd-bar-off:rgba(0,0,0,.07);--pd-ok:#059669;--pd-maybe:#d97706;--pd-err:#dc2626;--pd-none:#71717a}
/* zewnetrzna ramka wokol panelu detektora */
.docs-main .pd{margin:4px 0 0}
.pd-frame{padding:8px;border:1px solid var(--pd-frame-line);border-radius:26px;background:var(--pd-frame);box-shadow:var(--pd-frame-shadow)}
.pd-scope{position:relative;display:grid;justify-items:center;padding:44px 28px 36px;border:1px solid var(--border);border-radius:18px;background:var(--pd-panel);text-align:center;outline:none;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease}
/* stan poczatkowy wyglada jak miejsce na plik: przerywana ramka, tlo, cien */
.pd-scope[data-state="idle"]{cursor:pointer;border:1.5px dashed var(--pd-drop-line);background:var(--pd-drop);box-shadow:inset 0 1px 3px rgba(0,0,0,.06)}
.pd-scope[data-state="idle"]:hover{border-color:var(--pd-drop-line-hover);background:var(--pd-drop-hover)}
.pd-scope:focus-visible{border-color:var(--border-strong)}
.pd-scope.is-over,.pd-scope[data-state="idle"].is-over{border-style:dashed;border-color:var(--accent);background:var(--pd-drop-hover)}
.pd-input{position:absolute!important;width:1px;height:1px;opacity:0;pointer-events:none}
.pd-help-wrap{position:absolute;z-index:5;top:14px;right:14px}
.pd-help{display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid var(--border);border-radius:50%;background:var(--pd-frame);color:var(--text-dim);font:600 13px/1 'Plus Jakarta Sans',sans-serif;cursor:help;transition:color .15s ease,background .15s ease}
/* Znak srodkowany optycznie: pole wiersza ma zapas nad litera, wiec "?" stal za nisko. */
.pd-help>span{display:block;padding-bottom:1px}
@supports (text-box:trim-both cap alphabetic){.pd-help>span{padding-bottom:0;text-box:trim-both cap alphabetic}}
.pd-help-wrap:hover .pd-help,.pd-help:focus-visible{color:var(--text-main);background:var(--pd-btn-hover);outline:none}
.pd-pop{position:absolute;top:calc(100% + 10px);right:0;width:min(320px,70vw);padding:14px 16px;border:1px solid var(--border);border-radius:12px;background:var(--pd-frame);box-shadow:0 16px 40px -16px rgba(0,0,0,.45);color:var(--text-muted);font-size:13.5px;line-height:1.6;text-align:left;cursor:default;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s ease,transform .15s ease,visibility 0s linear .15s}
/* mostek: kursor przechodzi z ? do dymka bez jego chowania */
.pd-pop::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.pd-help-wrap:hover .pd-pop,.pd-help-wrap:focus-within .pd-pop{opacity:1;visibility:visible;transform:none;transition:opacity .15s ease,transform .15s ease,visibility 0s}

/* fala: slupki symetryczne wzgledem srodka, grupy po 3 = 1 bit */
.pd-wave{display:flex;align-items:center;justify-content:center;gap:3px;width:min(520px,100%);height:88px;margin:0 0 28px}
.pd-wave i{flex:1;max-width:6px;height:var(--h);min-height:6px;border-radius:99px;background:var(--pd-bar);transition:background .3s ease,transform .3s ease}
.pd-wave i.gap{margin-left:4px}
.pd-scope[data-state="busy"] .pd-wave i{animation:pdPulse 1s ease-in-out infinite;animation-delay:var(--d)}
@keyframes pdPulse{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.pd-scope:not([data-state="idle"]):not([data-state="busy"]) .pd-wave i{background:var(--pd-bar-off)}
.pd-scope[data-state="ok"] .pd-wave i.on{background:var(--pd-ok)}
.pd-scope[data-state="maybe"] .pd-wave i.on{background:var(--pd-maybe)}
.pd-idle{display:grid;justify-items:center;gap:12px}
.pd-scope:not([data-state="idle"]) .pd-idle{display:none}
.pd-drop-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 12px}
.pd-pick{display:inline-flex;align-items:center;gap:8px;padding:10px 18px 10px 15px;border:1px solid var(--border);border-radius:999px;background:var(--pd-btn);color:var(--text-main);font:600 14.5px 'Plus Jakarta Sans',sans-serif;cursor:pointer;transition:background .15s ease}
.pd-pick:hover{background:var(--pd-btn-hover)}
.pd-or{color:var(--text-muted);font-size:14.5px}
.docs-main .pd-hint{margin:0;color:var(--text-dim);font-size:13px;line-height:1.5}
/* stan i wynik - zawsze na srodku panelu */
.pd-status{display:grid;justify-items:center;width:100%;max-width:560px;animation:pdIn .3s ease both}
.pd-status[hidden]{display:none}
@keyframes pdIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.docs-main .pd-file{margin:0 0 10px;color:var(--text-dim);font-size:12.5px;overflow-wrap:anywhere}
.docs-main .pd-title{display:inline-flex;align-items:center;gap:9px;margin:0;color:var(--text-main);font:600 19px/1.35 'Manrope',sans-serif;letter-spacing:-.01em}
.pd-dot{width:9px;height:9px;border-radius:50%;background:var(--pd-none)}
.pd-scope[data-state="busy"] .pd-dot{background:var(--text-muted);animation:pdBlink 1s ease-in-out infinite}
.pd-scope[data-state="ok"] .pd-dot{background:var(--pd-ok)}
.pd-scope[data-state="maybe"] .pd-dot{background:var(--pd-maybe)}
.pd-scope[data-state="error"] .pd-dot{background:var(--pd-err)}
@keyframes pdBlink{0%,100%{opacity:.3}50%{opacity:1}}
.docs-main .pd-desc{margin:8px 0 0;color:var(--text-muted);font-size:14.5px;line-height:1.65}
.docs-main .pd-bits-label{margin:10px 0 0;color:var(--text-main);font-size:13px;font-variant-numeric:tabular-nums}
.pd-bits-label[hidden],.pd-facts[hidden],.pd-again[hidden]{display:none}
.pd-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;margin:22px 0 0;padding:16px 0 0;border-top:1px solid var(--border)}
.pd-facts div{padding:0 10px}
.pd-facts div+div{border-left:1px solid var(--border)}
.pd-facts dt{margin:0 0 3px;color:var(--text-dim);font-size:12px}
.pd-facts dd{margin:0;color:var(--text-main);font-size:13.5px;line-height:1.4;overflow-wrap:anywhere}
.pd-again{margin:20px 0 0;padding:8px 16px;border:1px solid var(--border);border-radius:999px;background:var(--pd-btn);color:var(--text-main);font:500 13.5px 'Plus Jakarta Sans',sans-serif;cursor:pointer;transition:background .15s ease}
.pd-again:hover{background:var(--pd-btn-hover)}
@media (max-width:560px){.pd-scope{padding:40px 16px 28px}.pd-wave{height:64px}.pd-facts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}.pd-facts div:nth-child(3){border-left:0}}
@media (prefers-reduced-motion:reduce){.pd-status,.pd-scope[data-state="busy"] .pd-wave i,.pd-scope[data-state="busy"] .pd-dot{animation:none}}
.docs-main .pyn-callout{margin:28px 0 0;padding:2px 0 2px 16px;border:0;border-left:2px solid var(--border-strong);border-radius:0;background:none;color:var(--text-muted);font-size:14px;line-height:1.7}
.docs-main .pyn-callout strong{color:var(--text-main);font-weight:600}
.detector-note{margin:16px 0 0!important;color:var(--text-dim)!important;font-size:12.5px!important}
/* entry animation - the same as on the other pages */
@keyframes zpFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.docs-enter .docs-shell{animation:zpFade .85s cubic-bezier(.22,.61,.36,1) both}
/* Gorny pasek (logo, linki, Get started) wchodzi tak samo jak na innych stronach. */
.docs-enter .zp-nav{animation:zpFade .85s cubic-bezier(.22,.61,.36,1) backwards}
@media (prefers-reduced-motion: reduce){.docs-enter .docs-shell,.docs-enter .zp-nav{animation:none!important}}
@media(max-width:1180px){.docs-shell,.docs-shell.has-toc{grid-template-columns:220px minmax(0,1fr);gap:48px}.docs-toc{display:none}}
@media(max-width:860px){
  .docs-shell,.docs-shell.has-toc{grid-template-columns:minmax(0,1fr);gap:24px;padding:20px 0 72px;width:calc(100% - 32px)}
  .docs-index{position:static;display:flex;gap:6px;min-height:0;margin-left:0;padding:0 0 14px;border-right:0;border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:none}
  .docs-index::-webkit-scrollbar{display:none}
  .docs-group{display:contents}.docs-group-title{display:none}
  .docs-index a{flex:none;padding:6px 12px;border:1px solid var(--border);border-radius:999px;font-size:13.5px}
  .docs-main h1{font-size:30px}
  .docs-lead,.docs-main .detector-intro p{font-size:16px}
  .docs-main h2{margin-top:40px;padding-top:32px;font-size:20px}
  .docs-rows,.docs-grid{grid-template-columns:minmax(0,1fr)}
  .docs-features div{grid-template-columns:minmax(0,1fr);gap:2px}
  .docs-main .docs-linklist li{flex-direction:column;gap:2px}
  .docs-linklist span{text-align:left}
  .docs-table th{width:40%}
}

/* Telefon: filtry modeli w jednym rzedzie, rowno wykadrowane. */
@media (max-width:760px){
  .docs-filters{flex-wrap:nowrap;width:100%;justify-content:space-between}
  .docs-filter{flex:1 1 auto;padding:7px 8px;font-size:13px;white-space:nowrap;text-align:center}
}
