/* eduseek.pl — design system (off-white + slate + emerald, motyw kartki w kratę) */
:root{
  --paper:#FBFAF6; --ink:#1E2A32; --ink-soft:#5a6b74; --muted:#6b757d;
  --slate:#1E2A32;
  --green:#0FA968; --green-deep:#0B7E4E; --green-tint:#E9F8F0;
  --indigo:#4F5BD5; --indigo-deep:#3a45ad; --indigo-tint:#EEF0FB;
  --amber:#F4A521; --line:#e8e3d6; --card:#ffffff;
  --grid:rgba(30,42,50,.06);
  --grid-soft:rgba(30,42,50,.042);        /* kratka tła całej strony — ledwo widoczna */
  --margin-line:rgba(214,98,98,.38);      /* czerwony margines jak w zeszycie */
  --radius:16px; --radius-sm:11px;
  --shadow:0 12px 30px -18px rgba(30,42,50,.35);
  --display:'Plus Jakarta Sans',system-ui,sans-serif;
  --body:'Inter',system-ui,sans-serif; --mono:'JetBrains Mono',monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;
  background-color:var(--paper);
  background-image:
    linear-gradient(var(--grid-soft) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid-soft) 1px,transparent 1px);
  background-size:26px 26px;
  background-attachment:fixed;color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--display);letter-spacing:-.02em;line-height:1.2}
.muted{color:var(--ink-soft)}
.section{padding:34px 20px}
.section-title{font-size:22px;margin:0 0 16px}
.block-title{font-family:var(--display);font-size:19px;margin:30px 0 12px}

/* ---------- Buttons ---------- */
.btn{font-family:var(--display);font-weight:700;font-size:15px;border:0;border-radius:12px;padding:11px 18px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:.15s}
.btn-primary{background:var(--indigo);color:#fff}
.btn-primary:hover{background:var(--indigo-deep)}
.btn-ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--indigo)}
.btn-block{display:flex;width:100%;justify-content:center}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:30;background:rgba(251,250,246,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:16px;height:64px}
.brand{display:flex;align-items:center;gap:10px}
.logo{width:34px;height:34px;border-radius:9px;background:var(--green);display:grid;place-items:center;flex:0 0 auto;box-shadow:0 8px 20px -10px rgba(15,169,104,.6)}
.brand-name{font-family:var(--display);font-weight:800;font-size:20px;letter-spacing:-.02em}
.brand-dot{color:var(--green-deep)}
.header-search{margin-left:auto;display:flex;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:4px 4px 4px 14px}
.header-search input{border:0;outline:0;font-family:var(--body);font-size:14px;width:200px;background:transparent;color:var(--ink)}
.header-search button{border:0;background:var(--ink);color:#fff;width:34px;height:34px;border-radius:999px;display:grid;place-items:center;cursor:pointer}

/* ---------- Hero + AI box ---------- */
.hero{padding:30px 0 14px}
.hero>.wrap{position:relative;text-align:center;
  background-color:#fff;
  background-image:
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:22px 22px;
  border:1.5px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:42px 34px 34px;max-width:1040px}
/* czerwony margines i dziurki — detal kartki wyrwanej z zeszytu */
.hero>.wrap::before{content:"";position:absolute;left:30px;top:14px;bottom:14px;width:2px;background:var(--margin-line);border-radius:2px}
.hero>.wrap::after{content:"";position:absolute;left:11px;top:0;bottom:0;width:8px;
  background-image:radial-gradient(circle at 4px 4px,var(--paper) 3.4px,transparent 3.6px);
  background-size:8px 116px;background-position:0 46px;background-repeat:repeat-y}
.hero-title{font-size:38px;margin:0 0 12px}
.hero-title span{color:var(--green-deep)}
.hero-lede{max-width:620px;margin:0 auto 22px;color:var(--ink-soft);font-size:17px}
.askbox{max-width:640px;margin:0 auto;background:#fff;border:2px solid var(--indigo);border-radius:18px;padding:14px;box-shadow:var(--shadow)}
.askbox textarea{width:100%;border:0;outline:0;resize:none;font-family:var(--body);font-size:16px;color:var(--ink);background:transparent;min-height:26px}
.askbox textarea::placeholder{color:#9aa6ad}
.aimeta{padding:2px 2px 0}
.detect{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;font-family:var(--display);color:var(--indigo-deep);background:var(--indigo-tint);border:1px solid #d6d8f5;border-radius:999px;padding:3px 9px;margin-bottom:6px}
.askrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.modes{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.mlabel{font-size:12px;color:var(--ink-soft);font-weight:600}
.mode{font-family:var(--display);font-weight:600;font-size:12.5px;color:var(--ink-soft);background:#fff;border:1.5px solid var(--line);border-radius:9px;padding:6px 10px;cursor:pointer;transition:.12s}
.mode:hover{border-color:var(--indigo)}
.mode[aria-pressed="true"]{background:var(--indigo);border-color:var(--indigo);color:#fff}
.askbtn{margin-left:auto}
.answer{max-width:640px;margin:14px auto 0;text-align:left;border:1.5px solid var(--green);border-radius:16px;overflow:hidden;background:var(--green-tint);display:none}
.answer.show{display:block}
.answer .ah{display:flex;align-items:center;gap:9px;padding:12px 14px;border-bottom:1px solid #bfe9d3;font-family:var(--display);font-weight:700;font-size:13px;color:var(--green-deep)}
.ahmode{margin-left:auto;font-family:var(--body);font-weight:500;font-size:11.5px;color:var(--ink-soft)}
.answer .ab{padding:14px;font-size:14.5px}
.toolsug{display:flex;align-items:center;gap:8px;margin:0 14px 14px;width:calc(100% - 28px);font-family:var(--display);font-weight:600;font-size:13.5px;color:var(--green-deep);background:#fff;border:1.5px solid #bfe9d3;border-radius:11px;padding:10px 12px;cursor:pointer;text-align:left}
.toolsug:hover{background:var(--green-tint)}
.typing::after{content:"▌";animation:blink 1s steps(1) infinite;color:var(--green)}
@keyframes blink{50%{opacity:0}}

/* ---------- Tiles (przedmioty) ---------- */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.tile{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:6px;transition:.15s}
.tile:hover{border-color:var(--green);transform:translateY(-2px);box-shadow:var(--shadow)}
.tile-ico{font-size:26px}
.tile-name{font-family:var(--display);font-weight:700}
.tile-count{font-size:13px;color:var(--ink-soft)}

/* ---------- Card list ---------- */
.cardlist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.card{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:14px 16px;display:flex;align-items:center;gap:12px;transition:.12s}
.card:hover{border-color:var(--indigo)}
.card a{flex:1;display:flex;flex-direction:column;gap:3px}
.card-sub,.card-snippet{font-size:12.5px;color:var(--ink-soft)}
.card-title{font-family:var(--display);font-weight:700;font-size:15.5px}
.pill{font-family:var(--display);font-weight:700;font-size:11px;padding:4px 9px;border-radius:999px;white-space:nowrap}
.pill-tool{background:var(--indigo-tint);color:var(--indigo-deep)}

/* ---------- Subject controls ---------- */
.subject-hero{padding-top:18px}
.page-title{font-size:30px;margin:6px 0 8px}
.count-line{color:var(--ink-soft);margin:.2em 0 14px}
.controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.seg{display:inline-flex;background:#fff;border:1.5px solid var(--line);border-radius:10px;overflow:hidden}
.seg-btn{padding:8px 14px;font-family:var(--display);font-weight:600;font-size:13.5px;color:var(--ink-soft)}
.seg-btn.is-on{background:var(--ink);color:#fff}
.toggle{padding:8px 14px;font-family:var(--display);font-weight:600;font-size:13.5px;border:1.5px solid var(--line);border-radius:10px;color:var(--ink-soft);background:#fff}
.toggle.is-on{border-color:var(--green);color:var(--green-deep);background:var(--green-tint)}
/* Sortowanie i filtr są przyciskami (nie linkami), żeby robot nie odkrywał adresów z parametrami. Zerujemy domyślny wygląd przycisku, by wyglądały jak dawne linki. */
button.seg-btn,button.toggle{margin:0;cursor:pointer;line-height:inherit;letter-spacing:inherit;-webkit-appearance:none;appearance:none}
button.seg-btn{border:0;background:transparent}
.pager{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:22px}
.pager a{font-family:var(--display);font-weight:700;color:var(--indigo-deep)}
.pager-info{color:var(--ink-soft);font-size:14px}

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:13px;color:var(--ink-soft);padding-top:16px;padding-bottom:4px}
.breadcrumbs a:hover{color:var(--indigo-deep)}
.breadcrumbs .sep{opacity:.5}
.crumb-current{color:var(--ink)}

/* ---------- Task page ---------- */
.task{display:grid;grid-template-columns:1fr 300px;gap:28px;padding-top:10px;padding-bottom:50px}
.task-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.kicker{font-family:var(--display);font-weight:700;font-size:13px;color:var(--green-deep)}
.vbadge{font-family:var(--display);font-weight:700;font-size:12px;color:var(--green-deep);background:var(--green-tint);border:1px solid #bfe9d3;border-radius:999px;padding:4px 11px}
.task-title{font-size:30px;margin:4px 0 18px}

/* motyw kartki w kratę (squared paper) */
.paper{background:
   linear-gradient(var(--grid) 1px,transparent 1px),
   linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:22px 22px;background-color:#fff;
  border:1.5px solid var(--line);border-radius:var(--radius)}
.quick{padding:16px 18px;margin-bottom:18px}
.quick-label{font-family:var(--display);font-weight:700;font-size:12px;color:var(--green-deep);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.quick-text{margin:0;font-size:17px;font-weight:500}

.content{font-size:16.5px}
.content h2{font-size:21px;margin:28px 0 10px}
.content ul{padding-left:22px}
.content li{margin:5px 0}
.content blockquote{margin:16px 0;padding:14px 18px;background:var(--green-tint);border-left:4px solid var(--green);border-radius:0 10px 10px 0;font-style:italic}
.content strong{font-weight:700}

.toolwrap{margin-top:8px}
.tool{padding:18px;margin-top:6px}

.faq-item{border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:4px 16px;margin-bottom:10px;background:#fff}
.faq-item summary{font-family:var(--display);font-weight:700;font-size:15.5px;cursor:pointer;padding:12px 0;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::before{content:"＋";color:var(--green-deep);margin-right:8px;font-weight:700}
.faq-item[open] summary::before{content:"－"}
.faq-a{padding:0 0 14px;color:var(--ink-soft)}

.askmini{margin-top:34px}
.askbox--mini{border-color:var(--line);box-shadow:none}
.askbox--mini:focus-within{border-color:var(--indigo)}

.task-side{display:flex;flex-direction:column;gap:16px}
.side-card{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius);padding:16px}
.side-title{font-family:var(--display);font-weight:700;margin:0 0 10px}

/* ---------- Ad slots ---------- */
.adslot{border:1.5px dashed #cfc9ba;border-radius:14px;color:#9b9684;font-size:11.5px;font-weight:600;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#fcfbf7,#fcfbf7 10px,#f7f5ee 10px,#f7f5ee 20px);margin:18px 0;text-transform:uppercase;letter-spacing:.05em}
.adslot--top{height:90px}
.adslot--box{height:250px;max-width:336px;margin:18px auto}
.adslot--side{height:600px}

/* ---------- Search ---------- */
.bigsearch{display:flex;gap:10px;margin:14px 0 18px}
.bigsearch input{flex:1;border:1.5px solid var(--line);border-radius:12px;padding:13px 16px;font-family:var(--body);font-size:16px;outline:0}
.bigsearch input:focus{border-color:var(--indigo)}

/* ---------- Tools (interaktywne) ---------- */
.t-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:12px}
.t-field{display:flex;flex-direction:column;gap:4px}
.t-field label{font-size:12px;font-weight:600;color:var(--ink-soft)}
.t-field input,.t-field select{border:1.5px solid var(--line);border-radius:10px;padding:9px 11px;font-family:var(--mono);font-size:15px;background:#fff;outline:0;min-width:80px}
.t-field input:focus,.t-field select:focus{border-color:var(--indigo)}
.t-out{font-family:var(--mono);font-size:18px;font-weight:600;color:var(--green-deep);background:var(--green-tint);border:1.5px solid #bfe9d3;border-radius:10px;padding:12px 14px;margin-top:6px}
.t-err{color:#c0392b}
.t-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.t-chip{font-family:var(--display);font-weight:600;font-size:13px;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:6px 12px}

/* ---------- Footer + cookie ---------- */
.site-footer{border-top:1px solid var(--line);margin-top:30px;background:#fff}
.footer-inner{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;padding-top:26px;padding-bottom:26px}
.footer-tag{color:var(--ink-soft);font-size:13px;margin:8px 0 0}
.footer-nav{display:flex;gap:18px;font-family:var(--display);font-weight:600;font-size:14px}
.footer-nav a:hover{color:var(--indigo-deep)}
.footer-copy{color:var(--muted);font-size:13px;width:100%}
.cookiebar{position:fixed;left:16px;right:16px;bottom:16px;z-index:50;background:var(--ink);color:#fff;border-radius:14px;padding:14px 18px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:0 20px 50px -20px rgba(0,0,0,.5)}
.cookiebar p{margin:0;font-size:13.5px;flex:1;min-width:220px}
.cookiebar-actions{display:flex;gap:10px}

/* ---------- Responsive ---------- */
@media(max-width:860px){
  .task{grid-template-columns:1fr}
  .task-side{order:-1}
  .adslot--side{height:120px}
  .hero-title{font-size:30px}
  .header-search input{width:120px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- Zadaj zdjęciem ---------- */
.photo-btn{font-family:var(--display);font-weight:600;font-size:13px;color:var(--indigo-deep);background:var(--indigo-tint);border:1.5px solid #d6d8f5;border-radius:10px;padding:7px 12px;cursor:pointer;transition:.12s}
.photo-btn:hover{background:#e3e6fb;border-color:var(--indigo)}
.photo-preview{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px;background:var(--green-tint);border:1.5px solid #bfe9d3;border-radius:12px}
#photoThumb{width:56px;height:56px;border-radius:9px;object-fit:cover;border:1px solid #bfe9d3;flex:0 0 auto}
.photo-remove{width:26px;height:26px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:18px;line-height:1;cursor:pointer;flex:0 0 auto;border:1.5px solid var(--line)}
.photo-remove:hover{background:#ffecec;color:#c0392b;border-color:#f3c6c6}
.photo-hint{font-size:13px;color:var(--green-deep);font-weight:500}

/* ---- Strony prawne (polityka prywatności, regulamin, cookies) ---- */
.legal{padding:28px 0 56px;max-width:820px}
.legal-title{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:clamp(1.6rem,4vw,2.2rem);margin:.2em 0 .35em}
.legal-lead{color:#475569;font-size:1.02rem;line-height:1.6;margin:0 0 1.4em}
.legal .content h2{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:1.18rem;margin:1.6em 0 .5em}
.legal .content p,.legal .content li{line-height:1.7}
.legal .content a{color:#4F5BD5;text-decoration:underline}

/* ---- Diagramy SVG w artykułach ---- */
.diagram{margin:1.5em 0;padding:1em;background:#fff;border:1px solid #E7E4DA;border-radius:14px;text-align:center}
.diagram svg{max-width:100%;height:auto}
.diagram figcaption{margin-top:.6em;font-size:.92rem;color:#475569}


/* ============ POPRAWKI v2 (mobile, hidden, SEO/UX) ============ */
/* atrybut hidden musi wygrywać z .cookiebar/.detect (display:flex) — naprawia popup i wiszące pigułki */
[hidden]{display:none!important}
/* koniec poziomego scrolla na mobile */
html,body{overflow-x:clip;max-width:100%}
img,svg{max-width:100%;height:auto}
.diagram{overflow-x:auto}
.askbox textarea{min-height:46px}

/* hamburger + menu mobilne */
.nav-toggle{display:none;margin-left:auto;width:42px;height:42px;border:1.5px solid var(--line);border-radius:11px;background:#fff;cursor:pointer;align-items:center;justify-content:center;flex:0 0 auto}
.nav-toggle:hover{border-color:var(--indigo)}
.nav-toggle svg{display:block}
.mobile-menu{display:none}
.mobile-menu.open{display:block;border-top:1px solid var(--line);background:var(--paper)}
.mobile-menu>.wrap{padding-top:12px;padding-bottom:16px}
.mobile-menu .header-search{display:flex;margin:0 0 12px;width:100%}
.mobile-menu .header-search input{width:100%}
.mobile-menu nav{display:flex;flex-direction:column;gap:2px}
.mobile-menu nav a{font-family:var(--display);font-weight:600;font-size:15px;padding:11px 8px;border-radius:9px;color:var(--ink)}
.mobile-menu nav a:hover{background:var(--indigo-tint);color:var(--indigo-deep)}

@media(max-width:760px){
  .header-inner .header-search{display:none}
  .nav-toggle{display:inline-flex}
  .hero-title{font-size:27px}
  .task-title{font-size:24px}
  .askrow{gap:8px}
}


/* ===== POPRAWKI v3: stopka na mobile ===== */
.footer-nav{flex-wrap:wrap}
@media(max-width:760px){
  .footer-inner{flex-direction:column;align-items:flex-start;gap:14px}
  .footer-nav{flex-wrap:wrap;gap:10px 16px;width:100%}
  .footer-copy{margin-top:4px}
}

/* reklama w treści (po pierwszej sekcji) */
.ad-inarticle{margin:22px 0}

/* ---------- Kalkulatory (/kalkulator/{slug}) ---------- */
.calc{padding:18px}
.calc-form{margin-bottom:4px}
.calc-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.calc-field{display:flex;flex-direction:column;gap:5px;flex:1;min-width:120px}
.calc-field>label{font-size:12.5px;font-weight:700;color:var(--ink-soft);font-family:var(--display)}
.calc-inwrap{position:relative;display:flex;align-items:center}
.calc-inwrap input{width:100%;border:1.5px solid var(--line);border-radius:11px;padding:12px 13px;font-family:var(--mono);font-size:17px;background:#fff;outline:0;transition:.15s}
.calc-inwrap input:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-tint)}
.calc-suffix{position:absolute;right:12px;font-family:var(--mono);font-size:15px;color:var(--muted);pointer-events:none}
.calc-out{margin-top:16px}
.calc-res{display:flex;flex-direction:column;gap:8px}
.calc-resline{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border:1.5px solid var(--line);border-radius:11px;background:#fff}
.calc-resline.is-hl{background:var(--green-tint);border-color:#bfe9d3}
.calc-reslabel{flex:1;min-width:120px;font-size:14px;color:var(--ink-soft);font-family:var(--display);font-weight:600}
.calc-resval{font-family:var(--mono);font-size:20px;font-weight:700;color:var(--ink)}
.calc-resline.is-hl .calc-resval{color:var(--green-deep);font-size:24px}
.calc-copy{font-family:var(--display);font-weight:700;font-size:12px;color:var(--green-deep);background:#fff;border:1.5px solid #bfe9d3;border-radius:999px;padding:5px 11px;cursor:pointer;transition:.15s}
.calc-copy:hover{background:var(--green-tint)}
.calc-diagram{display:flex;justify-content:center;margin:16px 0 4px}
.calc-formula{margin-top:14px;font-family:var(--mono);font-size:14.5px;color:var(--indigo-deep);background:var(--indigo-tint);border:1px solid #d6d8f5;border-radius:11px;padding:11px 14px}
.calc-formula span{font-family:var(--display);font-weight:700;color:var(--indigo)}
.calc-steps{margin-top:12px;border:1px solid var(--line);border-radius:11px;background:#fff}
.calc-steps>summary{cursor:pointer;font-family:var(--display);font-weight:700;font-size:14px;color:var(--indigo-deep);padding:11px 14px;list-style:none}
.calc-steps>summary::-webkit-details-marker{display:none}
.calc-steps>summary::before{content:'▸ ';color:var(--indigo)}
.calc-steps[open]>summary::before{content:'▾ '}
.calc-steplist{margin:0 0 12px;padding:0 18px 0 34px}
.calc-steplist li{font-family:var(--mono);font-size:13.5px;color:var(--ink-soft);margin:6px 0;line-height:1.5}
.calc-err{color:#c0392b;font-size:14px;font-family:var(--display);font-weight:600;padding:10px 14px;background:#fdecea;border:1.5px solid #f5c6c0;border-radius:11px}

/* Hub /kalkulatory */
.calc-hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:18px}
.calc-hub-card{display:block;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:15px 16px;transition:.15s}
.calc-hub-card:hover{border-color:var(--indigo);transform:translateY(-2px);box-shadow:var(--shadow)}
.calc-hub-card .chc-title{font-family:var(--display);font-weight:700;font-size:15.5px;color:var(--ink);display:block;margin-bottom:3px}
.calc-hub-card .chc-desc{font-size:12.5px;color:var(--ink-soft);line-height:1.45}
.calc-badge{display:inline-flex;align-items:center;gap:5px;font-family:var(--display);font-weight:700;font-size:12px;color:var(--indigo-deep);background:var(--indigo-tint);border:1px solid #d6d8f5;border-radius:999px;padding:4px 11px;margin-bottom:6px}
@media(max-width:520px){.calc-resline.is-hl .calc-resval{font-size:21px}}
.calc-field--wide{flex-basis:100%}
.calc-inwrap select{width:100%;border:1.5px solid var(--line);border-radius:11px;padding:12px 13px;font-family:var(--display);font-weight:600;font-size:15px;background:#fff;outline:0;cursor:pointer}
.calc-inwrap select:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-tint)}
/* --- hub kalkulatorów: przedmioty i grupy --- */
.calc-subject-chips{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0 6px}
.calc-subject-chip{display:flex;flex-direction:column;gap:2px;padding:12px 20px;background:#fff;border:1.5px solid var(--line);border-radius:14px;text-decoration:none;color:var(--slate);box-shadow:0 1px 2px rgba(30,42,50,.06);transition:border-color .15s,transform .15s}
.calc-subject-chip:hover{border-color:var(--indigo);transform:translateY(-2px)}
.calc-subject-chip b{font-family:var(--display);font-size:16px}
.calc-subject-chip span{font-size:12.5px;color:#5b666e}
.calc-hub-subject{font-family:var(--display);font-size:22px;margin:30px 0 2px}
.calc-hub-subject a{color:inherit;text-decoration:none}
.calc-hub-subject a:hover{color:var(--indigo-deep)}
.calc-hub-group-title{font-family:var(--display);font-size:16.5px;margin:22px 0 10px;display:flex;align-items:center;gap:8px}
.calc-hub-group-title .chg-count{font-size:12px;font-weight:600;background:var(--indigo-tint);color:var(--indigo-deep);border-radius:999px;padding:2px 9px}

/* --- dostępność: nawigacja klawiaturą i pomijanie nawigacji --- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--green-deep);color:#fff;padding:10px 16px;border-radius:0 0 var(--radius-sm) 0;font-weight:700}
.skip-link:focus{left:0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--indigo);outline-offset:2px;border-radius:4px}

/* pole pytania do AI w sekcji hero i w mini-formularzu pod treścią */
.ask-input{flex:1;min-width:220px;padding:13px 16px;border:1.5px solid var(--line);border-radius:var(--radius-sm);font:500 15px/1.4 var(--body);background:#fff;color:var(--ink)}
.ask-input::placeholder{color:var(--muted)}
.ask-input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px var(--green-tint)}

/* --- motyw kartki: dopracowanie sekcji --- */
.section{padding-top:34px;padding-bottom:6px}
.section-title,.page-title{position:relative;display:inline-block;padding-bottom:6px}
.section-title::after,.page-title::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px;
  background:linear-gradient(90deg,var(--green) 0%,var(--green) 42%,transparent 42%)}
.count-line{margin-top:10px}
/* karty na tle w kratkę czytają się lepiej z odrobinę mocniejszym cieniem przy najechaniu */
.calc-hub-card,.card{background-color:#fff}
.calc-hub-card:hover,.card:hover{box-shadow:0 14px 28px -20px rgba(30,42,50,.45)}
@media(max-width:760px){
  .hero{padding:16px 0 8px}
  .hero>.wrap{padding:26px 18px 22px;border-radius:var(--radius-sm)}
  .hero>.wrap::before{left:14px}
  .hero>.wrap::after{display:none}
  body{background-attachment:scroll;background-size:22px 22px}
}
@media(prefers-reduced-motion:reduce){
  .calc-hub-card:hover,.card:hover{box-shadow:none;transform:none}
}

/* Etykieta grupy tematycznej na karcie powiązanego kalkulatora.
   Pokazywana tylko wtedy, gdy propozycja pochodzi z innej sekcji niż
   oglądany kalkulator — inaczej byłaby powtórzeniem oczywistej informacji. */
.card-group{
  display:block;
  margin-top:4px;
  font-size:.78rem;
  line-height:1.3;
  color:var(--muted);
  font-weight:500;
}
.card:hover .card-group{ color:var(--slate); }

/* Odnośnik z artykułu do pełnej strony osadzonego kalkulatora. */
.tool-more{ margin:10px 0 0; font-size:.92rem; }
.tool-more a{ color:var(--indigo-deep); font-weight:600; text-decoration:none; }
.tool-more a:hover{ text-decoration:underline; }

/* ---------------------------------------------------------------------------
   NARZĘDZIA (/narzedzia)
   Układ pól i wyników wzorowany na kalkulatorach, z dodatkiem pola tekstowego
   o dużej powierzchni i stopera dla techniki pomodoro.
   --------------------------------------------------------------------------- */
.tool-box{ padding:18px 18px 16px; }
.tool-form{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px 14px; }
.tf{ display:flex; flex-direction:column; gap:5px; }
.tf-wide{ grid-column:1/-1; }
.tf label{ font-size:.86rem; font-weight:600; color:var(--ink-soft); }
.tf input, .tf select, .tf textarea{
  width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm);
  background:#fff; font:inherit; font-size:1rem; color:var(--ink);
}
.tf textarea{ resize:vertical; min-height:120px; line-height:1.5; font-size:.98rem; }
.tf input:focus-visible, .tf select:focus-visible, .tf textarea:focus-visible{
  outline:2px solid var(--indigo); outline-offset:1px; border-color:var(--indigo);
}
.tf-in{ position:relative; display:flex; align-items:center; }
.tf-suffix{ position:absolute; right:11px; font-size:.85rem; color:var(--muted); pointer-events:none; }

.tool-res{ margin-top:16px; }
.tool-hint{ color:var(--muted); font-size:.94rem; margin:0; }
.tool-err{ color:#b4232a; font-size:.94rem; margin:0; }
.tool-out{ margin:0; display:flex; flex-direction:column; gap:1px; background:var(--line); border-radius:var(--radius-sm); overflow:hidden; }
.to-row{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; padding:10px 13px; background:#fff; }
.to-row dt{ font-size:.9rem; color:var(--ink-soft); flex:0 0 auto; max-width:52%; }
.to-row dd{ margin:0; font-weight:600; text-align:right; word-break:break-word; }
.to-hl{ background:var(--green-tint); }
.to-hl dd{ font-size:1.15rem; color:var(--green-deep); }
.to-copy{
  margin-left:10px; padding:2px 9px; font-size:.76rem; font-weight:600; cursor:pointer;
  border:1px solid var(--line); border-radius:99px; background:#fff; color:var(--ink-soft);
}
.to-copy:hover{ border-color:var(--indigo); color:var(--indigo-deep); }
.tool-steps{ margin-top:14px; padding-top:12px; border-top:1px dashed var(--line); }
.tool-steps p{ margin:0 0 8px; font-size:.92rem; color:var(--ink-soft); line-height:1.55; }

/* Stoper pomodoro */
.tool-timer{ margin-top:16px; padding:16px; border:1px solid var(--line); border-radius:var(--radius-sm); text-align:center; background:#fff; }
.tt-display{ font-family:var(--mono); font-size:3rem; font-weight:700; line-height:1; color:var(--ink); font-variant-numeric:tabular-nums; }
.tt-display.tt-koniec{ color:var(--green-deep); animation:ttPuls 1s ease-in-out 3; }
@keyframes ttPuls{ 50%{ opacity:.35; } }
.tt-faza{ margin-top:5px; font-size:.88rem; color:var(--muted); }
.tt-btns{ margin-top:12px; display:flex; gap:8px; justify-content:center; }
.tt-btns button{
  padding:8px 20px; border-radius:99px; border:1px solid var(--line); background:#fff;
  font:inherit; font-weight:600; font-size:.92rem; cursor:pointer; color:var(--ink);
}
.tt-start{ background:var(--green) !important; color:#fff !important; border-color:var(--green) !important; }
.tt-btns button:hover{ filter:brightness(.96); }
.vbadge-ai{ background:var(--indigo-tint); color:var(--indigo-deep); }

/* Przełącznik trybu pracy narzędzi AI. Widoczny także bez planu Pro —
   użytkownik ma wiedzieć, że dokładniejszy tryb istnieje. */
.tryb-wrap{ margin-top:14px; }
.tryb-wybor{ display:inline-flex; gap:2px; padding:3px; background:var(--grid); border-radius:99px; }
.tryb-btn{
  display:inline-flex; align-items:center; gap:6px; padding:7px 16px; border:0; border-radius:99px;
  background:transparent; font:inherit; font-size:.9rem; font-weight:600; color:var(--ink-soft); cursor:pointer;
}
.tryb-btn:hover{ color:var(--ink); }
.tryb-akt{ background:#fff; color:var(--ink); box-shadow:0 1px 3px rgba(30,42,50,.12); }
.tryb-btn:focus-visible{ outline:2px solid var(--indigo); outline-offset:2px; }
.tryb-pro{
  padding:1px 7px; border-radius:99px; font-size:.68rem; font-weight:700; letter-spacing:.03em;
  text-transform:uppercase; background:var(--indigo-tint); color:var(--indigo-deep);
}
.tryb-opis{ margin:7px 2px 0; font-size:.85rem; color:var(--muted); }

/* Cennik */
.wrap-waski{ max-width:980px; }
.cennik{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; margin:26px 0 34px; }
.plan{ position:relative; padding:24px 22px; background:#fff; border:1px solid var(--line); border-radius:14px; display:flex; flex-direction:column; }
.plan-wyroz{ border-color:var(--green); box-shadow:0 4px 18px rgba(15,169,104,.13); }
.plan-znak{ position:absolute; top:-11px; left:22px; padding:3px 12px; border-radius:99px; background:var(--green); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.02em; }
.plan-nazwa{ margin:0 0 6px; font-size:1.15rem; }
.plan-cena{ margin:0 0 4px; font-size:2rem; font-weight:800; color:var(--ink); line-height:1.1; }
.plan-okres{ font-size:.92rem; font-weight:600; color:var(--muted); }
.plan-opis{ margin:0 0 14px; font-size:.92rem; color:var(--ink-soft); }
.plan-lista{ margin:0 0 18px; padding:0; list-style:none; display:flex; flex-direction:column; gap:9px; flex:1; }
.plan-lista li{ position:relative; padding-left:24px; font-size:.93rem; line-height:1.45; }
.plan-lista li::before{ content:"✓"; position:absolute; left:0; color:var(--green-deep); font-weight:700; }
.plan-kup{ width:100%; }
.plan-akcja{ margin:0; padding:10px 0; text-align:center; font-size:.9rem; font-weight:600; border-radius:99px; }
.plan-akcja-teraz{ color:var(--muted); border:1px dashed var(--line); }
.plan-akcja-wkrotce{ color:var(--ink-soft); background:var(--grid); }
.plan-info{ margin:0 0 18px; padding:13px 16px; border-radius:10px; background:var(--green-tint); color:var(--green-deep); font-weight:600; }

/* Plan lekcji — siatka tygodniowa z zapisem w pamięci przeglądarki. */
.pl-panel{ padding:16px; }
.pl-akcje{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.pl-akcje button{ padding:8px 15px; border:1px solid var(--line); border-radius:99px; background:#fff;
  font:inherit; font-size:.88rem; font-weight:600; cursor:pointer; color:var(--ink); }
.pl-akcje button:hover{ border-color:var(--indigo); color:var(--indigo-deep); }
.pl-czysc:hover{ border-color:#c0392b !important; color:#c0392b !important; }
.pl-stan{ margin:0 0 12px; font-size:.85rem; color:var(--muted); }
.pl-siatka-wrap{ overflow-x:auto; }
.pl-siatka{ width:100%; border-collapse:collapse; min-width:640px; }
.pl-siatka th{ padding:8px 6px; font-size:.82rem; font-weight:700; text-align:left;
  color:var(--ink-soft); border-bottom:2px solid var(--line); text-transform:capitalize; }
.pl-th-godz{ width:88px; }
.pl-siatka td{ padding:3px; border-bottom:1px solid var(--line); }
.pl-pole, .pl-pole-godz{ width:100%; padding:7px 9px; border:1px solid transparent; border-radius:6px;
  background:transparent; font:inherit; font-size:.92rem; color:var(--ink); }
.pl-pole:hover, .pl-pole-godz:hover{ background:var(--grid); }
.pl-pole:focus, .pl-pole-godz:focus{ outline:2px solid var(--indigo); outline-offset:-1px; background:#fff; }
.pl-pole-godz{ font-family:var(--mono); font-size:.85rem; color:var(--ink-soft); font-variant-numeric:tabular-nums; }
.pl-usun{ width:34px; }
.pl-usun-wiersz{ width:26px; height:26px; border:0; border-radius:50%; background:transparent;
  color:var(--muted); font-size:1.1rem; line-height:1; cursor:pointer; }
.pl-usun-wiersz:hover{ background:var(--grid); color:#c0392b; }

@media print {
  /* Wydruk planu: zostaje sama siatka, znika nawigacja i przyciski. */
  header, footer, nav, aside, .pl-akcje, .pl-stan, .tool-steps, .faqs, .similar, .quick, .content{ display:none !important; }
  .pl-siatka{ min-width:0; }
  .pl-pole, .pl-pole-godz{ border-color:transparent; }
  .pl-usun{ display:none; }
  .task-title{ margin-bottom:12px; }
}

/* Notatki metodą Cornella — wąska kolumna pytań, szeroka notatek, pasek podsumowania. */
.cor-panel{ padding:16px; }
.cor-akcje{ display:flex; gap:8px; align-items:center; margin-bottom:10px; }
.cor-akcje button{ padding:8px 15px; border:1px solid var(--line); border-radius:99px; background:#fff;
  font:inherit; font-size:.88rem; font-weight:600; cursor:pointer; color:var(--ink); }
.cor-akcje button:hover{ border-color:var(--indigo); color:var(--indigo-deep); }
.cor-licznik{ margin-left:auto; font-size:.82rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.cor-stan{ margin:0 0 12px; font-size:.85rem; color:var(--muted); }
.cor-naglowek{ display:flex; gap:10px; margin-bottom:12px; }
.cor-tytul{ flex:1; }
.cor-naglowek input{ padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:1rem; color:var(--ink); background:#fff; }
.cor-siatka{ display:grid; grid-template-columns:1fr 2fr; gap:12px; }
@media (max-width:640px){ .cor-siatka{ grid-template-columns:1fr; } }
.cor-kol{ display:flex; flex-direction:column; gap:5px; }
.cor-kol label, .cor-pods label{ font-size:.82rem; font-weight:700; color:var(--ink-soft); }
.cor-pole{ width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:.95rem; line-height:1.6; color:var(--ink); background:#fff; resize:vertical; }
.cor-pole:focus-visible{ outline:2px solid var(--indigo); outline-offset:1px; border-color:var(--indigo); }
.cor-pyt{ background:var(--grid-soft); }
.cor-pods{ margin-top:12px; display:flex; flex-direction:column; gap:5px; }
.cor-sum{ background:var(--green-tint); }

@media print {
  .cor-akcje, .cor-stan{ display:none !important; }
  .cor-pole, .cor-naglowek input{ border-color:#bbb; background:#fff !important; }
  .cor-siatka{ grid-template-columns:1fr 2fr !important; }
}

/* Harmonogram sesji */
.hs-panel{ padding:16px; }
.hs-dodaj{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.hs-dodaj input{ padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:.95rem; color:var(--ink); background:#fff; }
.hs-nazwa{ flex:2; min-width:140px; }
.hs-data{ flex:1; min-width:140px; }
.hs-godz{ width:96px; }
.hs-btn-dodaj{ padding:9px 18px; border:0; border-radius:99px; background:var(--green); color:#fff;
  font:inherit; font-weight:600; cursor:pointer; }
.hs-btn-dodaj:hover{ filter:brightness(.95); }
.hs-stan{ margin:0 0 12px; font-size:.85rem; color:var(--muted); }
.hs-tab{ width:100%; border-collapse:collapse; }
.hs-tab th{ padding:7px 8px; font-size:.8rem; text-align:left; color:var(--ink-soft); border-bottom:2px solid var(--line); }
.hs-tab td{ padding:8px; border-bottom:1px solid var(--line); font-size:.93rem; }
.hs-alarm{ background:#fff6e8; }
.hs-minelo{ opacity:.5; }
.hs-usun{ width:24px; height:24px; border:0; border-radius:50%; background:transparent;
  color:var(--muted); font-size:1.05rem; cursor:pointer; }
.hs-usun:hover{ background:var(--grid); color:#c0392b; }
.hs-pods{ margin-top:14px; padding:13px 15px; border-radius:10px; background:var(--grid-soft); }
.hs-pods p{ margin:0 0 7px; font-size:.93rem; line-height:1.5; }
.hs-pods p:last-child{ margin-bottom:0; }
.hs-uwaga{ color:#a35200; font-weight:600; }
.hs-rada{ color:var(--ink-soft); }

/* Wykres funkcji — rysowany w SVG, więc skaluje się bez utraty ostrości. */
.wf-panel{ padding:16px; }
.wf-pola{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:14px; }
.wf-pola input{ width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:1rem; color:var(--ink); background:#fff; }
.wf-pola input:focus-visible{ outline:2px solid var(--indigo); outline-offset:1px; border-color:var(--indigo); }
.wf-wzor{ font-family:var(--mono); }
.wf-plot{ margin-bottom:14px; }
.wf-svg{ width:100%; height:auto; display:block; background:#fff; border-radius:var(--radius-sm); }
.wf-ramka{ fill:none; stroke:var(--line); stroke-width:1; }
.wf-os{ stroke:var(--ink-soft); stroke-width:1; }
.wf-krzywa{ fill:none; stroke:var(--indigo); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.wf-etyk{ fill:var(--muted); font-size:11px; font-family:var(--mono); }

/* Fiszki językowe */
.fi-panel{ padding:16px; }
.fi-dodaj{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.fi-dodaj input{ flex:1; min-width:130px; padding:9px 11px; border:1px solid var(--line);
  border-radius:var(--radius-sm); font:inherit; font-size:.95rem; color:var(--ink); background:#fff; }
.fi-btn-dodaj{ padding:9px 18px; border:0; border-radius:99px; background:var(--green); color:#fff;
  font:inherit; font-weight:600; cursor:pointer; }
.fi-stan{ margin:0 0 14px; font-size:.85rem; color:var(--muted); }
.fi-karta{ padding:26px 20px; border:1px solid var(--line); border-radius:14px; text-align:center; background:#fff; }
.fi-licznik{ font-size:.8rem; color:var(--muted); margin-bottom:14px; }
.fi-przod-txt{ font-size:1.6rem; font-weight:700; color:var(--ink); }
.fi-tyl-txt{ margin-top:10px; padding-top:12px; border-top:1px dashed var(--line);
  font-size:1.25rem; color:var(--green-deep); font-weight:600; }
.fi-akcje{ margin-top:18px; display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.fi-akcje button{ padding:9px 20px; border-radius:99px; border:1px solid var(--line); background:#fff;
  font:inherit; font-weight:600; font-size:.92rem; cursor:pointer; color:var(--ink); }
.fi-odkryj{ background:var(--indigo) !important; color:#fff !important; border-color:var(--indigo) !important; }
.fi-dobrze{ background:var(--green) !important; color:#fff !important; border-color:var(--green) !important; }
.fi-zle:hover{ border-color:#c0392b; color:#c0392b; }
.fi-gotowe{ padding:20px; border:1px dashed var(--line); border-radius:12px; text-align:center; color:var(--ink-soft); }
.fi-gotowe p{ margin:0 0 6px; font-size:.94rem; }
.fi-tab{ width:100%; border-collapse:collapse; margin-top:18px; }
.fi-tab th{ padding:7px 8px; font-size:.78rem; text-align:left; color:var(--ink-soft); border-bottom:2px solid var(--line); }
.fi-tab td{ padding:7px 8px; border-bottom:1px solid var(--line); font-size:.9rem; }
.fi-usun{ width:24px; height:24px; border:0; border-radius:50%; background:transparent; color:var(--muted); cursor:pointer; }
.fi-usun:hover{ background:var(--grid); color:#c0392b; }

/* Test poziomu angielskiego */
.ta-karta{ padding:24px 20px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.ta-postep{ font-size:.8rem; color:var(--muted); margin-bottom:8px; }
.ta-pasek{ height:4px; background:var(--grid); border-radius:99px; overflow:hidden; margin-bottom:18px; }
.ta-pasek span{ display:block; height:100%; background:var(--green); transition:width .2s; }
.ta-pytanie{ font-size:1.2rem; font-weight:600; margin-bottom:18px; line-height:1.5; }
.ta-opcje{ display:flex; flex-direction:column; gap:8px; }
.ta-opcja{ padding:12px 16px; border:1px solid var(--line); border-radius:10px; background:#fff;
  font:inherit; font-size:1rem; text-align:left; cursor:pointer; color:var(--ink); }
.ta-opcja:hover{ border-color:var(--indigo); background:var(--indigo-tint); }
.ta-wynik{ padding:22px 20px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.ta-poziom{ font-size:2.6rem; font-weight:800; color:var(--green-deep); text-align:center; line-height:1; }
.ta-opis{ text-align:center; color:var(--ink-soft); margin-top:6px; font-size:.94rem; }
.ta-punkty{ text-align:center; margin-top:10px; font-weight:600; }
.ta-tab{ width:100%; border-collapse:collapse; margin:18px 0; }
.ta-tab td{ padding:6px 8px; border-bottom:1px solid var(--line); font-size:.9rem; }
.ta-tab td:first-child{ font-weight:700; width:50px; }
.ta-bledy{ margin-top:16px; padding-top:14px; border-top:1px dashed var(--line); font-size:.92rem; }
.ta-bledy p{ margin:8px 0; color:var(--ink-soft); line-height:1.5; }
.ta-restart{ margin-top:16px; padding:10px 22px; border:0; border-radius:99px; background:var(--indigo);
  color:#fff; font:inherit; font-weight:600; cursor:pointer; }
.ta-uwaga{ margin-top:12px; font-size:.84rem; color:var(--muted); }

/* Mapa myśli */
.mm-panel{ padding:16px; }
.mm-gora label{ display:block; font-size:.85rem; font-weight:600; color:var(--ink-soft); margin-bottom:5px; }
.mm-txt{ width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font-family:var(--mono); font-size:.92rem; line-height:1.6; color:var(--ink); background:#fff; resize:vertical; }
.mm-txt:focus-visible{ outline:2px solid var(--indigo); outline-offset:1px; border-color:var(--indigo); }
.mm-akcje{ display:flex; gap:8px; align-items:center; margin:10px 0 14px; }
.mm-akcje button{ padding:8px 15px; border:1px solid var(--line); border-radius:99px; background:#fff;
  font:inherit; font-size:.88rem; font-weight:600; cursor:pointer; color:var(--ink); }
.mm-akcje button:hover{ border-color:var(--indigo); color:var(--indigo-deep); }
.mm-stan{ font-size:.82rem; color:var(--muted); }
.mm-plot{ overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); padding:8px; }
.mm-svg{ width:100%; height:auto; min-width:520px; display:block; }
.mm-linia{ fill:none; stroke-width:2; opacity:.55; }
.mm-glowny{ font-family:var(--display); font-size:16px; font-weight:700; }
.mm-galaz{ font-family:var(--body); font-size:14px; font-weight:600; }
.mm-lisc{ font-family:var(--body); font-size:13px; }
@media print { .mm-gora{ display:none !important; } .mm-plot{ border:0; } }

/* Narzędzia oparte na modelu językowym */
.ai-panel{ padding:16px; }
.ai-in{ width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:.98rem; line-height:1.6; color:var(--ink); background:#fff; resize:vertical; }
.ai-in:focus-visible{ outline:2px solid var(--indigo); outline-offset:1px; border-color:var(--indigo); }
.ai-akcje{ display:flex; align-items:center; gap:12px; margin:14px 0; }
.ai-start{ padding:11px 26px; border:0; border-radius:99px; background:var(--green); color:#fff;
  font:inherit; font-weight:700; font-size:.98rem; cursor:pointer; }
.ai-start:disabled{ opacity:.6; cursor:default; }
.ai-licznik{ font-size:.82rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.ai-przekroczony{ color:#c0392b; font-weight:600; }
.ai-czekaj{ margin:0; padding:14px; border-radius:10px; background:var(--grid-soft); color:var(--ink-soft); font-size:.94rem; }
.ai-ok{ border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.ai-tresc{ padding:15px 17px; white-space:pre-wrap; line-height:1.65; font-size:.98rem; }
.ai-stopka{ display:flex; align-items:center; gap:12px; padding:9px 14px; background:var(--grid-soft); border-top:1px solid var(--line); }
.ai-kopiuj{ padding:5px 14px; border:1px solid var(--line); border-radius:99px; background:#fff;
  font:inherit; font-size:.82rem; font-weight:600; cursor:pointer; color:var(--ink-soft); }
.ai-pozostalo{ margin-left:auto; font-size:.8rem; color:var(--muted); }
.ai-blad{ padding:15px 17px; border-radius:10px; background:#fff6e8; border:1px solid #f0d9b0; }
.ai-blad strong{ display:block; margin-bottom:5px; color:#a35200; }
.ai-blad p{ margin:0; font-size:.93rem; color:var(--ink-soft); }
.ai-cta{ display:inline-block; margin-top:11px; padding:8px 18px; border-radius:99px;
  background:var(--indigo); color:#fff !important; font-weight:600; font-size:.9rem; text-decoration:none; }

/* Blok narzędzi na stronie głównej */
.section-lead{ margin:-6px 0 16px; color:var(--ink-soft); font-size:.95rem; }
.nrz-siatka{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px; }
.nrz-kafel{ display:flex; flex-direction:column; gap:3px; padding:14px 16px; background:#fff;
  border:1px solid var(--line); border-radius:12px; transition:border-color .15s; }
.nrz-kafel:hover{ border-color:var(--indigo); }
.nrz-nazwa{ font-weight:600; font-size:.96rem; color:var(--ink); }
.nrz-grupa{ font-size:.8rem; color:var(--muted); }
.nrz-wiecej{ margin-top:14px; }
.nrz-wiecej a{ font-weight:600; color:var(--indigo-deep); }

/* Powiązane narzędzia na stronie kalkulatora */
.nrz-pow{ margin:26px 0; }
.nrz-pow-lista{ margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:8px; }
.nrz-pow-lista a{ display:inline-flex; align-items:center; gap:6px; padding:8px 15px;
  background:#fff; border:1px solid var(--line); border-radius:99px;
  font-size:.9rem; font-weight:600; color:var(--ink); }
.nrz-pow-lista a:hover{ border-color:var(--indigo); color:var(--indigo-deep); }
.nrz-ai{ padding:1px 6px; border-radius:99px; font-size:.66rem; font-weight:700;
  background:var(--indigo-tint); color:var(--indigo-deep); }

/* Narzędzia PDF */
.pdf-panel{ padding:16px; }
.pdf-drop{ display:block; padding:28px 20px; border:2px dashed var(--line); border-radius:12px;
  text-align:center; cursor:pointer; background:var(--grid-soft); transition:border-color .15s; }
.pdf-drop:hover{ border-color:var(--indigo); }
.pdf-in{ position:absolute; width:1px; height:1px; opacity:0; }
.pdf-drop-txt{ font-size:.96rem; font-weight:600; color:var(--ink-soft); }
.pdf-lista{ margin-top:12px; }
.pdf-plik{ display:flex; justify-content:space-between; gap:12px; padding:8px 12px;
  border-bottom:1px solid var(--line); font-size:.9rem; }
.pdf-rozm{ color:var(--muted); font-variant-numeric:tabular-nums; }
.pdf-start{ margin-top:14px; padding:11px 26px; border:0; border-radius:99px; background:var(--green);
  color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.pdf-start:disabled{ opacity:.5; cursor:default; }
.pdf-stan{ margin-top:12px; }
.pdf-stan p{ margin:0; padding:11px 14px; border-radius:9px; font-size:.93rem; }
.pdf-info{ background:var(--grid-soft); color:var(--ink-soft); }
.pdf-ok{ background:var(--green-tint); color:var(--green-deep); font-weight:600; }
.pdf-err{ background:#fff6e8; color:#a35200; font-weight:600; }
.pdf-zakres{ width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:.95rem; color:var(--ink); background:#fff; }

/* PDF na tekst */
.pdft-wynik{ margin-top:14px; }
.pdft-akcje{ display:flex; gap:8px; margin:12px 0 8px; }
.pdft-akcje button{ padding:8px 16px; border:1px solid var(--line); border-radius:99px; background:#fff;
  font:inherit; font-size:.88rem; font-weight:600; cursor:pointer; color:var(--ink); }
.pdft-akcje button:hover{ border-color:var(--indigo); color:var(--indigo-deep); }
.pdft-tekst{ width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font-family:var(--mono); font-size:.86rem; line-height:1.6; color:var(--ink); background:#fff; resize:vertical; }
.doc-rozmiar{ width:100%; padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:.95rem; color:var(--ink); background:#fff; }

/* Tryb wymuszonych kolorów (wysoki kontrast w Windows) usuwa cienie, więc
   wskaźnik fokusu oparty na box-shadow przestaje być widoczny. Przywracamy
   obrys systemowy wszędzie tam, gdzie polegamy na cieniu. */
@media (forced-colors: active) {
  .ask-input:focus,
  .tool-in:focus,
  .ai-in:focus,
  .mm-txt:focus,
  button:focus,
  a:focus { outline: 2px solid Highlight; outline-offset: 2px; }
}
.lista-404{ margin:14px 0 0; padding:0; list-style:none; }
.lista-404 li{ padding:7px 0; border-bottom:1px solid var(--line); font-size:.95rem; }
.lista-404 a{ font-weight:600; color:var(--indigo-deep); }

/* ---------- Fiszki (widget artykułowy) ---------- */
.t-fiszka{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.4rem;
  min-height:120px; padding:1.25rem 1rem; margin-bottom:.75rem;
  border:1px solid var(--linia,#d8d8d8); border-radius:10px; background:var(--tlo-karta,#fff);
  cursor:pointer; text-align:center; user-select:none; transition:border-color .15s;
}
.t-fiszka:hover,.t-fiszka:focus{ border-color:var(--akcent,#2f6f4f); outline:none; }
.t-fiszka-przod,.t-fiszka-tyl{ font-size:1.5rem; font-weight:600; line-height:1.3; }
.t-fiszka-tyl{ color:var(--akcent,#2f6f4f); }
.t-fiszka-hint{ font-size:.82rem; }
.t-fiszka-nav{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.t-fiszka-nav button{
  padding:.35rem .7rem; border:1px solid var(--linia,#d8d8d8); border-radius:6px;
  background:var(--tlo-karta,#fff); cursor:pointer; font-size:.9rem;
}
.t-fiszka-nav button:hover{ border-color:var(--akcent,#2f6f4f); }
.t-licznik{ font-size:.85rem; color:var(--tekst-slaby,#666); min-width:4.5rem; text-align:center; }
@media (max-width:480px){
  .t-fiszka-przod,.t-fiszka-tyl{ font-size:1.25rem; }
  .t-fiszka-nav{ justify-content:center; }
}

/* ---------- Quiz (widget artykułowy) ---------- */
.t-quiz-pyt{ margin:.25rem 0 .75rem; }
.t-quiz-odp{ display:flex; flex-direction:column; gap:.4rem; }
.t-quiz-odp button{
  padding:.55rem .8rem; text-align:left; cursor:pointer; font-size:.95rem;
  border:1px solid var(--linia,#d8d8d8); border-radius:8px; background:var(--tlo-karta,#fff);
}
.t-quiz-odp button:hover:not(:disabled){ border-color:var(--akcent,#2f6f4f); }
.t-quiz-odp button:disabled{ cursor:default; }
.t-quiz-odp button.ok{ border-color:#2f6f4f; background:#eaf4ee; font-weight:600; }
.t-quiz-odp button.zle{ border-color:#a8422f; background:#f8ecea; }
.t-quiz-fb{ margin-top:.6rem; font-size:.92rem; }
.t-quiz-fb button{
  margin-top:.5rem; padding:.35rem .7rem; cursor:pointer;
  border:1px solid var(--linia,#d8d8d8); border-radius:6px; background:var(--tlo-karta,#fff);
}
.t-quiz-wynik{ font-size:1.05rem; margin:.3rem 0 .6rem; }

/* narzędzie AI bez skonfigurowanego klucza */
.tool-niedostepne{ padding:1.25rem; border-style:dashed; color:var(--tekst-slaby,#555); }
.tool-niedostepne p{ margin:0; }

/* ---------- Menu główne (desktop) ---------- */
.main-nav{ display:flex; gap:1.1rem; align-items:center; margin-left:1.2rem; }
.main-nav a{
  color:var(--tekst,#222); text-decoration:none; font-weight:600; font-size:.94rem;
  padding:.35rem 0; border-bottom:2px solid transparent; white-space:nowrap;
}
.main-nav a:hover,.main-nav a:focus{ color:var(--akcent,#0f9d58); border-bottom-color:var(--akcent,#0f9d58); }

.btn-ai{
  display:inline-flex; align-items:center; gap:.35rem; margin-left:auto;
  padding:.5rem .95rem; border-radius:999px; white-space:nowrap;
  background:var(--akcent,#0f9d58); color:#fff; text-decoration:none;
  font-weight:700; font-size:.9rem; box-shadow:0 1px 3px rgba(0,0,0,.14);
  transition:filter .15s, transform .08s;
}
.btn-ai:hover{ filter:brightness(1.07); }
.btn-ai:active{ transform:translateY(1px); }

/* Poniżej 980 px nawigacja i przycisk chowają się do hamburgera —
   inaczej pasek nagłówka zawijałby się na dwie linie. */
@media (max-width:980px){
  .main-nav{ display:none; }
  .header-inner > .btn-ai{ display:none; }
}

/* ---------- Menu mobilne ---------- */
.btn-ai-mob{
  display:flex; justify-content:center; margin:.85rem 0 .35rem;
  padding:.7rem 1rem; font-size:1rem;
}
.menu-sep{
  display:block; height:1px; background:var(--linia,#e3e3e3); margin:.55rem 0;
}
.mobile-menu nav a{ padding:.72rem 0; font-size:1.02rem; }

/* ---------- Wskaźnik oczekiwania na odpowiedź AI ---------- */
.ai-loader{ display:flex; align-items:center; gap:.65rem; padding:.35rem 0; }
.ai-dots{ display:inline-flex; gap:5px; }
.ai-dots i{
  width:8px; height:8px; border-radius:50%; background:var(--akcent,#0f9d58);
  display:block; animation:aiPuls 1.25s ease-in-out infinite;
}
.ai-dots i:nth-child(2){ animation-delay:.18s; }
.ai-dots i:nth-child(3){ animation-delay:.36s; }
.ai-loader-txt{ color:var(--tekst-slaby,#666); font-size:.94rem; }
@keyframes aiPuls{
  0%,80%,100%{ transform:scale(.65); opacity:.35; }
  40%{ transform:scale(1); opacity:1; }
}
/* Szanujemy ustawienie systemowe: przy ograniczonym ruchu tylko delikatne pulsowanie. */
@media (prefers-reduced-motion:reduce){
  .ai-dots i{ animation:aiFade 1.6s ease-in-out infinite; }
  @keyframes aiFade{ 0%,100%{opacity:.35} 50%{opacity:1} }
}

/* ---------- Formatowanie odpowiedzi AI ---------- */
.ab p{ margin:0 0 .7rem; }
.ab p:last-child{ margin-bottom:0; }
.ab ul,.ab ol{ margin:.4rem 0 .8rem 1.3rem; padding:0; }
.ab li{ margin:.3rem 0; }
.ab h4{ margin:.9rem 0 .4rem; font-size:1rem; }
.ab strong{ font-weight:700; }
.ab code{
  background:rgba(0,0,0,.06); padding:.1rem .3rem; border-radius:4px;
  font-size:.92em; font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ---------- Pułapka na automaty ---------- */
/* Ukryta poza ekranem, a nie przez display:none — część automatów pomija pola
   całkowicie ukryte, więc wpadłyby rzadziej. Czytniki ekranu pomija aria-hidden. */
.pulapka{
  position:absolute !important; left:-9999px !important; top:auto !important;
  width:1px !important; height:1px !important; overflow:hidden !important;
}

/* ---------- Licznik limitu ---------- */
.limit-info{
  margin:.6rem 0 0; font-size:.86rem; color:var(--tekst-slaby,#666);
}
.limit-info strong{ color:var(--tekst,#222); font-weight:700; }
.limit-info.limit-wyczerpany{ color:#a8422f; }
.limit-info.limit-wyczerpany strong{ color:#a8422f; }

/* ---------- Rozwijane menu w nagłówku ---------- */
.nav-poz{ position:relative; }
.nav-link{
  display:inline-flex; align-items:center; gap:.28rem;
  color:var(--tekst,#222); text-decoration:none; font-weight:600; font-size:.94rem;
  padding:.45rem .1rem; border-bottom:2px solid transparent; white-space:nowrap;
}
.nav-link:hover,.nav-link:focus,.nav-poz:hover .nav-link{
  color:var(--akcent,#0f9d58); border-bottom-color:var(--akcent,#0f9d58);
}
.nav-strzalka{ font-size:.7em; opacity:.6; transition:transform .15s; }
.nav-poz:hover .nav-strzalka{ transform:rotate(180deg); }

.nav-lista{
  position:absolute; top:100%; left:-.6rem; z-index:60;
  min-width:248px; padding:.4rem; margin-top:.3rem;
  background:#fff; border:1px solid var(--linia,#e3e3e3); border-radius:12px;
  box-shadow:0 10px 28px rgba(0,0,0,.11);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .14s, transform .14s, visibility .14s;
}
/* Otwieramy najechaniem i klawiaturą — samo :hover odcięłoby osoby
   poruszające się tabulatorem. */
.nav-ma-liste:hover .nav-lista,
.nav-ma-liste:focus-within .nav-lista{
  opacity:1; visibility:visible; transform:translateY(0);
}
.nav-lista a{
  display:flex; align-items:center; gap:.55rem;
  padding:.5rem .6rem; border-radius:8px;
  color:var(--tekst,#222); text-decoration:none; font-size:.92rem; font-weight:500;
}
.nav-lista a:hover,.nav-lista a:focus{ background:rgba(15,157,88,.09); color:var(--akcent,#0f9d58); }
.nav-ikona{ font-size:1.05rem; line-height:1; width:1.3rem; text-align:center; }
.nav-nazwa{ flex:1; }
.nav-liczba{
  font-size:.78rem; color:var(--tekst-slaby,#777); font-variant-numeric:tabular-nums;
  background:rgba(0,0,0,.05); padding:.1rem .4rem; border-radius:999px;
}
.nav-wszystkie{
  margin-top:.25rem; border-top:1px solid var(--linia,#eee);
  font-weight:600; color:var(--akcent,#0f9d58) !important;
}

/* Lista rozwijana nie ma sensu na dotyku — poniżej 1100 px wszystko
   przechodzi do menu pod hamburgerem. */
@media (max-width:1100px){
  .main-nav{ display:none; }
  .header-inner > .btn-ai{ display:none; }
}

/* ---------- Lista zadań na /zadania ---------- */
.lista-zadan{ list-style:none; padding:0; margin:.6rem 0 0;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:.3rem; }
.lista-zadan a{
  display:block; padding:.55rem .7rem; border-radius:8px;
  color:var(--tekst,#222); text-decoration:none; font-size:.94rem;
}
.lista-zadan a:hover{ background:rgba(15,157,88,.08); color:var(--akcent,#0f9d58); }