/* ==================================================================
   IPappTV — wspólny styl stron z dokumentami
   (regulamin, terms, prywatnosc, privacy)

   Te same zmienne co na stronie głównej. Jeden plik dla czterech
   dokumentów, więc zmiana wyglądu to jedna edycja, a nie cztery.
   Zero zasobów zewnętrznych.
   ================================================================== */
:root{
  --ink:#0A0E1C; --ink-2:#0D1327;
  --panel:#131A2E;
  --line:#26304B; --line-soft:rgba(38,48,75,.55);
  --haze:#8A93AD; --text:#E9ECF5; --text-2:#C4CADB;
  --signal:#7C6CFF; --signal-soft:rgba(124,108,255,.13);
  --live:#2DD4BF;
  --mono:ui-monospace,"SF Mono","Cascadia Mono","Segoe UI Mono",Menlo,Consolas,monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--sans);
  line-height:1.7;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
a{color:var(--signal)}
a:focus-visible,button:focus-visible{outline:2px solid var(--live);outline-offset:3px;border-radius:6px}

/* ---------- pasek górny (identyczny jak na stronie głównej) ---------- */
.top{position:sticky;top:0;z-index:40;background:rgba(10,14,28,.78);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}
.top-in{display:flex;align-items:center;gap:16px;height:64px}
.brand{display:flex;align-items:center;gap:11px;font-weight:700;font-size:17px;
  letter-spacing:-.01em;color:var(--text);text-decoration:none}
.brand img{width:30px;height:30px;border-radius:9px}
.brand em{font-style:normal;color:var(--signal)}
.top nav{margin-left:auto;display:flex;align-items:center;gap:22px}
.top nav a{color:var(--haze);text-decoration:none;font-size:14px}
.top nav a:hover{color:var(--text)}
.lang{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.lang a,.lang span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;
  padding:6px 11px;text-decoration:none;color:var(--haze)}
.lang .cur{background:var(--signal-soft);color:var(--text)}

/* ---------- nagłówek dokumentu ---------- */
.doc-hero{padding:54px 0 30px;border-bottom:1px solid var(--line-soft)}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--haze);margin:0 0 14px}
h1{font-size:clamp(32px,4.6vw,48px);line-height:1.05;letter-spacing:-.035em;
  font-weight:800;margin:0 0 12px}
.upd{margin:0;color:var(--haze);font-size:14.5px}
.others{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0 0}
.others a{border:1px solid var(--line);border-radius:10px;padding:9px 14px;color:var(--text);
  text-decoration:none;font-size:14px;background:var(--panel)}
.others a:hover{border-color:var(--signal)}
.others a s{font-family:var(--mono);font-size:10px;color:var(--haze);
  text-decoration:none;margin-left:7px}

/* ---------- układ: spis treści + treść ---------- */
.doc-grid{display:grid;grid-template-columns:224px minmax(0,1fr);gap:56px;
  align-items:start;padding:40px 0 70px}
.toc{position:sticky;top:96px}
.toc p{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--haze);margin:0 0 12px}
.toc ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.toc a{display:block;font-size:13.5px;line-height:1.4;color:var(--haze);text-decoration:none;
  padding:6px 0 6px 13px;border-left:2px solid var(--line);transition:color .2s,border-color .2s}
.toc a:hover{color:var(--text)}
.toc a.on{color:var(--text);border-left-color:var(--signal)}

/* ---------- treść dokumentu ---------- */
.doc-body{max-width:74ch}
.doc-body h2{font-size:clamp(18px,2.1vw,22px);letter-spacing:-.02em;font-weight:700;
  margin:44px 0 12px;padding-top:22px;border-top:1px solid var(--line-soft);scroll-margin-top:92px}
.doc-body h2:first-child{margin-top:0;padding-top:0;border-top:0}
.doc-body p{margin:0 0 14px;color:var(--text-2);font-size:16px}
.doc-body ul{margin:0 0 14px;padding-left:20px;color:var(--text-2);font-size:16px}
.doc-body li{margin:0 0 6px}
.doc-body strong{color:var(--text);font-weight:650}
.doc-body .box{background:var(--panel);border:1px solid var(--line);
  border-left:3px solid var(--live);border-radius:0 14px 14px 0;
  padding:20px 24px;margin:0 0 22px;color:var(--text-2);font-size:15.5px}

footer{border-top:1px solid var(--line);padding:30px 0 48px;color:var(--haze);font-size:14px}
footer a{color:var(--haze)}

@media (max-width:900px){
  .doc-grid{grid-template-columns:1fr;gap:0;padding:30px 0 56px}
  .toc{position:static;margin:0 0 34px;padding:0 0 26px;border-bottom:1px solid var(--line-soft)}
  .toc ol{flex-direction:row;flex-wrap:wrap;gap:6px}
  .toc a{border-left:0;border:1px solid var(--line);border-radius:8px;padding:6px 11px}
  .toc a.on{border-color:var(--signal)}
  /* Chowamy odnośniki sekcji, ale przełącznik języka zostaje. */
  .top nav > a{display:none}
  .doc-hero{padding:38px 0 24px}
}
